Color and Interpolation

/**
 * Parse CSS color specifier and return color object
 * @param specifier - CSS color string
 * @returns Color object or null if invalid
 */
function color(specifier: string): Color | null;

/**
 * Create RGB color
 * @param r - Red component (0-255)
 * @param g - Green component (0-255)
 * @param b - Blue component (0-255)
 * @param opacity - Optional opacity (0-1)
 * @returns RGB color object
 */
function rgb(r: number, g: number, b: number, opacity?: number): RGBColor;

/**
 * Create HSL color
 * @param h - Hue in degrees (0-360)
 * @param s - Saturation as percentage (0-1)
 * @param l - Lightness as percentage (0-1)
 * @param opacity - Optional opacity (0-1)
 * @returns HSL color object
 */
function hsl(h: number, s: number, l: number, opacity?: number): HSLColor;

interface Color {
  opacity: number;
  
  /**
   * Convert to RGB color space
   * @returns RGB representation
   */
  rgb(): RGBColor;
  
  /**
   * Create brighter version of color
   * @param k - Brightness factor (default 1)
   * @returns Brighter color
   */
  brighter(k?: number): Color;
  
  /**
   * Create darker version of color
   * @param k - Darkness factor (default 1)
   * @returns Darker color
   */
  darker(k?: number): Color;
  
  /**
   * Test if color is displayable in RGB
   * @returns True if displayable
   */
  displayable(): boolean;
  
  /**
   * Return color as hex string
   * @returns Hex color string (#rrggbb)
   */
  formatHex(): string;
  
  /**
   * Return color as RGB string
   * @returns RGB color string
   */
  formatRgb(): string;
  
  /**
   * Return color as string
   * @returns String representation
   */
  toString(): string;
}

/**
 * Create interpolator between two values
 * @param a - Start value
 * @param b - End value
 * @returns Interpolation function
 */
function interpolate(a: any, b: any): (t: number) => any;

/**
 * Interpolate between numbers
 * @param a - Start number
 * @param b - End number
 * @returns Number interpolation function
 */
function interpolateNumber(a: number, b: number): (t: number) => number;

/**
 * Interpolate between RGB colors
 * @param a - Start color
 * @param b - End color
 * @returns Color interpolation function
 */
function interpolateRgb(a: string | Color, b: string | Color): (t: number) => string;

/**
 * Interpolate between HSL colors
 * @param a - Start color
 * @param b - End color
 * @returns Color interpolation function
 */
function interpolateHsl(a: string | Color, b: string | Color): (t: number) => string;

import { color, rgb, interpolateRgb } from "d3";

// Create and manipulate colors
const red = rgb(255, 0, 0);
const brightRed = red.brighter(2);
const darkRed = red.darker(0.5);

// Color interpolation
const interpolator = interpolateRgb("red", "blue");
const midColor = interpolator(0.5); // Purple-ish color

// Parse CSS colors
const parsedColor = color("#ff0000");
console.log(parsedColor.formatRgb()); // "rgb(255, 0, 0)"

interface RGBColor extends Color {
  r: number;
  g: number;
  b: number;
}

interface HSLColor extends Color {
  h: number;
  s: number;
  l: number;
}

type ColorSpecifier = string | Color;
type Interpolator<T> = (t: number) => T;