export interface ColorSwatchProps {
    /**
     * A CSS color value or `var()` expression to render, e.g.
     * `"var(--fgColor-default)"` or `"#ff0000"`. The swatch resolves the
     * computed color at runtime, so `var()` tokens reflect the active theme
     * and color mode.
     */
    color: string;
    /** Optional label shown under the swatch. Defaults to the `color` string. */
    label?: string;
    /** Show the resolved hex value below the label. Defaults to `true`. */
    showValue?: boolean;
    /** Height of the color block in pixels. Defaults to `54`. */
    height?: number;
}
/**
 * Theme-aware color swatch. Renders a block filled with `color`, then reads
 * the resolved value via `getComputedStyle` and displays it as a hex string.
 * The resolved value recomputes whenever the active theme or color mode
 * changes, so swatches backed by CSS custom properties stay in sync.
 */
export declare function ColorSwatch({ color, label, showValue, height, }: ColorSwatchProps): import("react/jsx-runtime").JSX.Element;
export default ColorSwatch;