@szum-tech/design-system/dist/components/color-picker/index.d.cts

Szum-Tech design system with tailwindcss support

import * as React from 'react';
import { P as Popover, d as PopoverTrigger, a as PopoverContent } from '../../popover-trigger-k9HHK6Iv.js';
import { Slider } from 'radix-ui';
import { Button } from '../button/index.js';
import { S as Select } from '../../select-XQ8pKCV9.js';
import { Input } from '../input/index.js';
import 'class-variance-authority';
import 'class-variance-authority/types';

declare const COLOR_FORMATS: readonly ["hex", "rgb", "hsl", "hsb"];

type ColorFormat = (typeof COLOR_FORMATS)[number];
type Direction = "ltr" | "rtl";
type ColorValue = {
    r: number;
    g: number;
    b: number;
    a: number;
};
type HSVColorValue = {
    h: number;
    s: number;
    v: number;
    a: number;
};
/**
 * @see https://gist.github.com/bkrmendy/f4582173f50fab209ddfef1377ab31e3
 */
type EyeDropper = {
    open: (options?: {
        signal?: AbortSignal;
    }) => Promise<{
        sRGBHex: string;
    }>;
};
declare global {
    interface Window {
        EyeDropper?: {
            new (): EyeDropper;
        };
    }
}
type ColorPickerContextValue = {
    dir: Direction;
    disabled?: boolean;
    inline?: boolean;
    readOnly?: boolean;
    required?: boolean;
};

type ColorPickerProps = Omit<React.ComponentProps<"div">, "onValueChange"> & Pick<React.ComponentProps<typeof Popover>, "defaultOpen" | "open" | "onOpenChange" | "modal"> & {
    value?: string;
    defaultValue?: string;
    onValueChange?: (value: string) => void;
    dir?: Direction;
    format?: ColorFormat;
    defaultFormat?: ColorFormat;
    onFormatChange?: (format: ColorFormat) => void;
    name?: string;
    asChild?: boolean;
    disabled?: boolean;
    inline?: boolean;
    readOnly?: boolean;
    required?: boolean;
};
declare function ColorPicker(props: ColorPickerProps): React.JSX.Element;

type ColorPickerTriggerProps = React.ComponentProps<typeof PopoverTrigger>;
declare function ColorPickerTrigger(props: ColorPickerTriggerProps): React.JSX.Element;

type ColorPickerContentProps = React.ComponentProps<typeof PopoverContent>;
declare function ColorPickerContent(props: ColorPickerContentProps): React.JSX.Element;

type ColorPickerAreaProps = React.ComponentProps<"div"> & {
    asChild?: boolean;
};
declare function ColorPickerArea(props: ColorPickerAreaProps): React.JSX.Element;

type ColorPickerHueSliderProps = React.ComponentProps<typeof Slider.Root>;
declare function ColorPickerHueSlider(props: ColorPickerHueSliderProps): React.JSX.Element;

type ColorPickerAlphaSliderProps = React.ComponentProps<typeof Slider.Root>;
declare function ColorPickerAlphaSlider(props: ColorPickerAlphaSliderProps): React.JSX.Element;

type ColorPickerSwatchProps = React.ComponentProps<"div"> & {
    asChild?: boolean;
};
declare function ColorPickerSwatch(props: ColorPickerSwatchProps): React.JSX.Element;

type ColorPickerEyeDropperProps = React.ComponentProps<typeof Button>;
declare function ColorPickerEyeDropper(props: ColorPickerEyeDropperProps): React.JSX.Element;

type ColorPickerFormatSelectProps = Omit<React.ComponentProps<typeof Select>, "value" | "onValueChange">;
declare function ColorPickerFormatSelect(props: ColorPickerFormatSelectProps): React.JSX.Element;

type ColorPickerInputProps = Omit<React.ComponentProps<typeof Input>, "value" | "onChange" | "color"> & {
    withoutAlpha?: boolean;
};
declare function ColorPickerInput(props: ColorPickerInputProps): React.JSX.Element;

type ColorPickerStoreState = {
    color: ColorValue;
    hsv: HSVColorValue;
    open: boolean;
    format: ColorFormat;
};
declare function useColorPickerStore<U>(selector: (state: ColorPickerStoreState) => U): U;

export { type ColorFormat, ColorPicker, ColorPickerAlphaSlider, type ColorPickerAlphaSliderProps, ColorPickerArea, type ColorPickerAreaProps, ColorPickerContent, type ColorPickerContentProps, type ColorPickerContextValue, ColorPickerEyeDropper, type ColorPickerEyeDropperProps, ColorPickerFormatSelect, type ColorPickerFormatSelectProps, ColorPickerHueSlider, type ColorPickerHueSliderProps, ColorPickerInput, type ColorPickerInputProps, type ColorPickerProps, ColorPickerSwatch, type ColorPickerSwatchProps, ColorPickerTrigger, type ColorPickerTriggerProps, type ColorValue, type Direction, type EyeDropper, type HSVColorValue, useColorPickerStore };