@choice-ui/react 1.7.6 → 1.7.7

package/dist/components/colors/dist/index.d.ts

@@ -0,0 +1,878 @@
+import { default as react__default, CSSProperties, HTMLProps, ReactNode } from 'react';
+import { PressMoveProps } from '../../../../../shared/src';
+import { PopoverProps } from '../../popover/src';
+import { Placement } from '@floating-ui/react';
+import { default as chroma } from 'chroma-js';
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+declare const COLOR_SPACES: {
+    readonly HEX: "hex";
+    readonly RGB: "rgb";
+    readonly HSL: "hsl";
+    readonly HSB: "hsb";
+};
+
+declare const DEFAULT_COLOR: RGB;
+declare const DEFAULT_GRADIENT_TRANSFORM: Transform;
+declare const BLACK_RGBA: RGBA;
+
+interface RGB {
+    readonly b: number;
+    readonly g: number;
+    readonly r: number;
+}
+interface RGBA {
+    readonly a: number;
+    readonly b: number;
+    readonly g: number;
+    readonly r: number;
+}
+interface HSL {
+    readonly h: number;
+    readonly l: number;
+    readonly s: number;
+}
+interface HSV {
+    readonly h: number;
+    readonly s: number;
+    readonly v: number;
+}
+interface HSLA {
+    readonly a: number;
+    readonly h: number;
+    readonly l: number;
+    readonly s: number;
+}
+interface HSB {
+    readonly b: number;
+    readonly h: number;
+    readonly s: number;
+}
+interface HSBA {
+    readonly a: number;
+    readonly b: number;
+    readonly h: number;
+    readonly s: number;
+}
+declare type Transform = [[number, number, number], [number, number, number]];
+interface PaintState {
+    h: number;
+    hsl_s: number;
+    hsv_s: number;
+    l: number;
+    v: number;
+}
+interface ColorStop {
+    readonly alpha: number;
+    readonly color: RGB;
+    readonly id: string;
+    readonly position: number;
+}
+type ColorProfile = "srgb" | "display-p3";
+type CheckColorContrastCategory = "auto" | "large-text" | "normal-text" | "graphics";
+type CheckColorContrastLevel = "AA" | "AAA";
+type PickerType = string;
+type PickerAreaType = "saturation-lightness" | "saturation-brightness";
+type PickerSliderType = "hue" | "saturation" | "lightness" | "alpha";
+type PickerGradientType = "linear" | "radial" | "conic";
+type ChannelFieldSpace = (typeof COLOR_SPACES)[keyof typeof COLOR_SPACES];
+type ChannelFieldFeature = {
+    alpha?: boolean;
+    hex?: boolean;
+    hsb?: boolean;
+    hsl?: boolean;
+    rgb?: boolean;
+    spaceDropdown?: boolean;
+};
+interface SolidPaintFeature extends ChannelFieldFeature {
+    checkColorContrast?: boolean;
+    containerWidth?: number;
+    nativePicker?: boolean;
+    presets?: boolean;
+}
+interface ImagePaintFeature extends SolidPaintFeature {
+    containerWidth?: number;
+    labels?: {
+        contrast?: string;
+        crop?: string;
+        exposure?: string;
+        fill?: string;
+        fit?: string;
+        processing?: string;
+        rotate?: string;
+        saturation?: string;
+        temperature?: string;
+        tile?: string;
+        tint?: string;
+        upload?: string;
+    };
+}
+interface PickerFeatures extends SolidPaintFeature {
+    custom?: boolean;
+    gradient?: boolean;
+    image?: boolean;
+    paintsType?: boolean;
+    pattern?: boolean;
+    pickerType?: boolean;
+    solid?: boolean;
+}
+interface ColorContrast {
+    backgroundColor?: RGB;
+    category?: CheckColorContrastCategory;
+    contrastInfo?: number;
+    foregroundAlpha?: number;
+    foregroundColor?: RGB;
+    handleApplyRecommendedPoint?: () => void;
+    handleCategoryChange?: (category: CheckColorContrastCategory) => void;
+    handleLevelChange?: (level: CheckColorContrastLevel) => void;
+    handleShowColorContrast?: () => void;
+    level?: CheckColorContrastLevel;
+    selectedElementType?: "text" | "graphics";
+    showColorContrast?: boolean;
+    standard?: boolean;
+}
+interface RecommendedPoint {
+    slX: number;
+    slY: number;
+    x: number;
+    y: number;
+}
+interface BezierCurveSegment {
+    cp1: [number, number];
+    cp2: [number, number];
+    end: [number, number];
+    start: [number, number];
+}
+interface BoundaryInfo {
+    bezierSegments: BezierCurveSegment[];
+    points: [number, number][];
+    simplifiedPoints: [number, number][];
+}
+interface BoundaryCalculationResult {
+    lowerBoundary: BoundaryInfo | null;
+    threshold: number;
+    upperBoundary: BoundaryInfo | null;
+}
+type PaletteType = "Slate" | "Red" | "Pink" | "Purple" | "Blue" | "Green" | "Brown" | "Orange" | "Yellow" | "Sky";
+
+type IndexKey = string;
+interface Vector {
+    readonly x: number;
+    readonly y: number;
+}
+
+interface SolidPaint {
+    readonly color: RGB;
+    readonly opacity: number;
+    readonly type: "SOLID";
+    readonly visible?: boolean;
+}
+interface GradientPaint {
+    readonly gradientStops: Array<ColorStop>;
+    readonly gradientTransform: Transform;
+    readonly opacity?: number;
+    readonly type: GradientPaintType;
+    readonly visible?: boolean;
+}
+interface ImagePaint {
+    readonly filters?: ImageFilters;
+    readonly imageHash: string | null;
+    readonly imageSizes: ImageSizes;
+    readonly imageTransform?: Transform;
+    readonly opacity?: number;
+    readonly rotation?: number;
+    readonly scaleMode: ImageScaleMode;
+    readonly scalingFactor?: number;
+    readonly type: "IMAGE";
+    readonly visible?: boolean;
+}
+interface ImageFilters {
+    readonly contrast?: number;
+    readonly exposure?: number;
+    readonly saturation?: number;
+    readonly temperature?: number;
+    readonly tint?: number;
+}
+interface PatternPaint {
+    readonly horizontalAlignment: "START" | "CENTER" | "END";
+    readonly scalingFactor: number;
+    readonly sourceNodeId: string;
+    readonly spacing: Vector;
+    readonly tileType: "RECTANGULAR" | "HORIZONTAL_HEXAGONAL" | "VERTICAL_HEXAGONAL";
+    readonly type: "PATTERN";
+}
+interface ImageSizes {
+    raw: string;
+    regular: string;
+    small: string;
+    sourceSize: {
+        height: number;
+        width: number;
+    };
+    thumb: string;
+}
+type ImageScaleMode = "FILL" | "FIT" | "CROP" | "TILE";
+type Paint = SolidPaint | GradientPaint | ImagePaint | PatternPaint;
+type PaintType = Paint["type"];
+type GradientPaintType = "GRADIENT_LINEAR" | "GRADIENT_RADIAL" | "GRADIENT_ANGULAR";
+type TextPaint = SolidPaint;
+type ColorUpdateSource = "external" | "internal";
+interface SolidPaintLabels {
+    alpha: string;
+    blue: string;
+    brightness: string;
+    custom?: string;
+    green: string;
+    hue: string;
+    lightness: string;
+    pickerColor?: string;
+    red: string;
+    saturation: string;
+}
+interface ColorChannelLabels {
+    alpha: string;
+    blue: string;
+    brightness: string;
+    green: string;
+    hue: string;
+    lightness: string;
+    red: string;
+    saturation: string;
+}
+interface GradientLabels {
+    addStopLabel: string;
+    alpha: string;
+    conic: string;
+    delete: string;
+    flipGradient: string;
+    linear: string;
+    position: string;
+    radial: string;
+    rotateGradient: string;
+    stopsTitle: string;
+    title: string;
+}
+interface GradientControlLabels {
+    addStopLabel: string;
+    alpha: string;
+    delete: string;
+    position: string;
+    title: string;
+}
+interface GradientListLabels {
+    alpha: string;
+    delete: string;
+    position: string;
+}
+interface GradientToolbarLabels {
+    conic: string;
+    flipGradient: string;
+    linear: string;
+    radial: string;
+    rotateGradient: string;
+}
+interface PaintTypeLabels {
+    colorContrast?: string;
+    gradient?: string;
+    image?: string;
+    pattern?: string;
+    solid?: string;
+}
+interface ColorPickerLabels {
+    custom?: string;
+    gradient?: string;
+    image?: string;
+    pattern?: string;
+    solid?: string;
+}
+interface ColorContrastLabels {
+    contrastSettings?: string;
+    notMeetStandard?: string;
+    viewColorValues?: string;
+}
+interface FillItemLabels {
+    alpha: string;
+}
+interface GradientFillLabels extends FillItemLabels {
+    conic: string;
+    linear: string;
+    radial: string;
+}
+
+type BaseVariableValue = string | number | boolean | RGBA;
+type VariableId = string;
+type VariableValue = BaseVariableValue | Record<string, unknown> | Array<BaseVariableValue>;
+type VariableType = "color" | "number" | "boolean" | "string" | "enum" | "object" | "array";
+type VariableOption = {
+    id: string;
+    value: string;
+};
+type VariableControlKey = "overflow" | "blendingMode" | "pointerEvents" | "userSelect" | "scrollbars" | "cursor";
+type Variable = {
+    controlKey?: VariableControlKey;
+    createdAt: number;
+    description?: string;
+    id: VariableId;
+    isComponentVariable?: boolean;
+    masterId: string;
+    name: string;
+    options?: Array<VariableOption>;
+    referencedConditionIds?: string[];
+    referencedNodeIds?: string[];
+    referencedVariantIds?: string[];
+    type: VariableType;
+    updatedAt: number | null;
+    value: VariableValue;
+};
+type Property = Pick<Variable, "id" | "name" | "type" | "value">;
+
+type ValueOf<T> = T[keyof T];
+
+type EffectItemType = "BACKGROUND_BLUR" | "FOREGROUND_BLUR" | "DROP_SHADOW" | "INNER_SHADOW";
+type EffectItem = {
+    color: RGBA;
+    index: IndexKey;
+    offset: {
+        x: number;
+        y: number;
+    };
+    radius: number;
+    spread: number;
+    type: EffectItemType;
+    visible: boolean;
+};
+type EffectItemKey = keyof EffectItem;
+type EffectItemValue = ValueOf<EffectItem>;
+
+type FillItem = BaseFillItem & Paint;
+type BaseFillItem = {
+    index: IndexKey;
+    isVariable?: boolean;
+};
+type SolidFillItem = BaseFillItem & SolidPaint;
+type TextFillItem = SolidFillItem;
+type GradientFillItem = BaseFillItem & GradientPaint;
+type ImageFillItem = BaseFillItem & ImagePaint;
+type FillItemKey = keyof FillItem;
+type FillItemValue = ValueOf<FillItem>;
+type FillType = Paint["type"];
+
+type TextCase = string;
+type FontName = {
+    family: string;
+    style: string;
+};
+type LineHeight = {
+    number: number;
+    unit: LineHeightUnitType;
+};
+type LetterSpacing = {
+    number: number;
+    unit: LetterSpacingUnitType;
+};
+type LineHeightUnitType = "px" | "%" | "em";
+type LetterSpacingUnitType = "px" | "em";
+
+type StyleId = string;
+type BaseStyleCommon = {
+    consumers: string[];
+    createdAt: number;
+    description?: string;
+    fileId: string;
+    id: StyleId;
+    index: IndexKey;
+    name?: string;
+    updatedAt: number | null;
+};
+type BasePendingStyleCommon = {
+    description?: string;
+    id: string;
+    isPending: true;
+    name?: string;
+};
+type BasePaintStyle = {
+    fills: FillItem[];
+    type: "PAINT";
+};
+type PaintStyle = BaseStyleCommon & BasePaintStyle;
+type PendingPaintStyle = BasePaintStyle & BasePendingStyleCommon;
+type BaseTextStyle = {
+    fontName: FontName;
+    fontSize: number;
+    letterSpacing: LetterSpacing;
+    lineHeight: LineHeight;
+    paragraphSpacing: number;
+    textCase: TextCase;
+    textDecoration: string;
+    type: "TEXT";
+};
+type TextStyle = BaseTextStyle & BaseStyleCommon;
+type PendingTextStyle = BaseTextStyle & BasePendingStyleCommon;
+type BaseEffectStyle = {
+    effects: EffectItem[];
+    type: "EFFECT";
+};
+type EffectStyle = BaseEffectStyle & BaseStyleCommon;
+type PendingEffectStyle = BaseEffectStyle & BasePendingStyleCommon;
+type BasePendingStyle = PendingPaintStyle | PendingTextStyle | PendingEffectStyle;
+type StyleType = "TEXT" | "PAINT" | "EFFECT";
+type TextStyleKey = keyof BaseTextStyle;
+type TextStyleValue = ValueOf<BaseTextStyle>;
+type Style = PaintStyle | TextStyle | EffectStyle;
+
+type LibrariesDisplayType = "LIST" | "LARGE_GRID" | "SMALL_GRID";
+type LibrariesType = "VARIABLE" | "STYLE";
+type LibrariesFeature = {
+    containerWidth?: number;
+    styles?: boolean;
+    variables?: boolean;
+};
+
+interface Position {
+    x: number;
+    y: number;
+}
+interface ColorAreaProps {
+    areaSize?: {
+        height?: number;
+        width?: number;
+    };
+    children?: React.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    hue?: number;
+    onChange?: (position: Position) => void;
+    onChangeEnd?: () => void;
+    onChangeStart?: () => void;
+    position: Position;
+    thumbColor?: RGB;
+    thumbSize?: number;
+    type: PickerAreaType;
+}
+declare const ColorArea: react.MemoExoticComponent<react.ForwardRefExoticComponent<ColorAreaProps & react.RefAttributes<HTMLDivElement>>>;
+
+interface ColorSliderProps {
+    backgroundStyle?: CSSProperties;
+    className?: string;
+    disabled?: boolean;
+    hue?: number;
+    onChange?: (position: number) => void;
+    onChangeEnd?: () => void;
+    onChangeStart?: () => void;
+    position: number;
+    thumbSize?: number;
+    trackSize?: {
+        height?: number;
+        width?: number;
+    };
+    type: PickerSliderType;
+}
+declare const ColorSlider: react.MemoExoticComponent<react.ForwardRefExoticComponent<ColorSliderProps & react.RefAttributes<HTMLDivElement>>>;
+
+interface ColorSwatchProps extends Omit<HTMLProps<HTMLDivElement>, "color"> {
+    alpha?: number;
+    children?: React.ReactNode;
+    className?: string;
+    color?: RGB;
+    disabled?: boolean;
+    gradient?: GradientPaint;
+    size?: number;
+    type?: LibrariesType;
+}
+declare const ColorSwatch: react.ForwardRefExoticComponent<Omit<ColorSwatchProps, "ref"> & react.RefAttributes<HTMLDivElement>>;
+
+interface ColorInputProps {
+    active?: boolean;
+    alpha?: number;
+    alphaTooltipLabel?: string;
+    children?: React.ReactNode;
+    className?: string;
+    classNames?: {
+        alpha?: string;
+        container?: string;
+        hex?: string;
+        swatch?: string;
+        wrapper?: string;
+    };
+    color?: RGB;
+    disabled?: boolean;
+    features?: {
+        alpha?: boolean;
+    };
+    onAlphaChange?: (alpha: number) => void;
+    onAlphaChangeEnd?: PressMoveProps["onPressEnd"];
+    onAlphaChangeStart?: PressMoveProps["onPressStart"];
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onColorChange?: (color: RGB) => void;
+    onFocus?: () => void;
+    onPickerClick?: () => void;
+    placeholder?: string;
+    selected?: boolean;
+}
+declare const ColorInput: react.ForwardRefExoticComponent<ColorInputProps & react.RefAttributes<HTMLDivElement>>;
+
+interface AlphaInputProps {
+    active?: boolean;
+    className?: string;
+    disabled?: boolean;
+    onChange?: (alpha: number) => void;
+    onPressEnd?: PressMoveProps["onPressEnd"];
+    onPressStart?: PressMoveProps["onPressStart"];
+    tooltipLabel?: string;
+    value?: number;
+}
+declare const AlphaInput: react.ForwardRefExoticComponent<AlphaInputProps & react.RefAttributes<HTMLInputElement>>;
+
+interface GradientItemProps {
+    active?: boolean;
+    alpha?: number;
+    className?: string;
+    classNames?: {
+        alpha?: string;
+        container?: string;
+        content?: string;
+        swatch?: string;
+        wrapper?: string;
+    };
+    disabled?: boolean;
+    features?: {
+        alpha?: boolean;
+    };
+    gradient?: GradientPaint;
+    labels?: GradientFillLabels;
+    onAlphaChange?: (alpha: number) => void;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onGradientChange?: (gradient: GradientPaint) => void;
+    onPickerClick?: () => void;
+    selected?: boolean;
+}
+declare const GradientItem: react.ForwardRefExoticComponent<GradientItemProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ImageItemProps {
+    active?: boolean;
+    alpha?: number;
+    className?: string;
+    classNames?: {
+        alpha?: string;
+        container?: string;
+        content?: string;
+        wrapper?: string;
+    };
+    disabled?: boolean;
+    features?: {
+        alpha?: boolean;
+    };
+    image?: ImagePaint;
+    imageUrl?: string;
+    label?: string;
+    labels: FillItemLabels;
+    onAlphaChange?: (alpha: number) => void;
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onPickerClick?: () => void;
+    selected?: boolean;
+}
+declare const ImageItem: react.ForwardRefExoticComponent<ImageItemProps & react.RefAttributes<HTMLDivElement>>;
+
+interface VariableItemProps {
+    active?: boolean;
+    className?: string;
+    classNames?: {
+        container?: string;
+        content?: string;
+        wrapper?: string;
+    };
+    disabled?: boolean;
+    label?: string;
+    libraries?: {
+        item: Variable | Style;
+        type: LibrariesType;
+    };
+    onClick?: (e: React.MouseEvent<HTMLDivElement>) => void;
+    onPickerClick?: () => void;
+    selected?: boolean;
+}
+declare const VariableItem: react.ForwardRefExoticComponent<VariableItemProps & react.RefAttributes<HTMLDivElement>>;
+
+interface HexInputProps extends Omit<HTMLProps<HTMLInputElement>, "onChange" | "onBlur" | "value"> {
+    onAlphaChange?: (alpha: number) => void;
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onChange?: (value: RGB) => void;
+    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    value?: RGB;
+}
+declare const HexInput: react.ForwardRefExoticComponent<Omit<HexInputProps, "ref"> & react.RefAttributes<HTMLInputElement>>;
+
+interface ColorChannelFieldProps {
+    alpha?: number;
+    className?: string;
+    colorSpace?: ChannelFieldSpace;
+    defaultColorSpace?: ChannelFieldSpace;
+    disabled?: boolean;
+    features?: ChannelFieldFeature;
+    hsb?: HSB;
+    hsl?: HSL;
+    labels?: ColorChannelLabels;
+    onAlphaChange?: (alpha: number) => void;
+    onAlphaChangeEnd?: () => void;
+    onAlphaChangeStart?: () => void;
+    onChangeColorSpace?: (colorSpace: ChannelFieldSpace) => void;
+    onHsbChange?: (hsb: HSB) => void;
+    onHslChange?: (hsl: HSL) => void;
+    onRgbChange?: (rgb: RGB) => void;
+    rgb?: RGB;
+}
+declare const ColorChannelField: react.MemoExoticComponent<react.ForwardRefExoticComponent<ColorChannelFieldProps & react.RefAttributes<HTMLDivElement>>>;
+
+interface ColorNativePickerProps extends Omit<HTMLProps<HTMLButtonElement>, "onChange"> {
+    onChange: (color: RGB) => void;
+    tooltip?: string;
+}
+declare const ColorNativePicker: react.ForwardRefExoticComponent<Omit<ColorNativePickerProps, "ref"> & react.RefAttributes<HTMLButtonElement>>;
+
+interface ColorSolidPaintProps {
+    alpha?: number;
+    checkColorContrast?: ColorContrast;
+    className?: string;
+    color?: RGB;
+    colorSpace: ChannelFieldSpace;
+    features?: SolidPaintFeature;
+    labels?: SolidPaintLabels;
+    library?: ReactNode;
+    onAlphaChange?: (alpha: number) => void;
+    onChangeEnd?: () => void;
+    onChangeStart?: () => void;
+    onColorChange?: (color: RGB) => void;
+    onColorSpaceChange: (colorSpace: ChannelFieldSpace) => void;
+    onLibraryChange?: (value: {
+        item: Variable;
+        type: LibrariesType;
+    }) => void;
+}
+declare const ColorSolidPaint: react.ForwardRefExoticComponent<ColorSolidPaintProps & react.RefAttributes<HTMLDivElement>>;
+
+interface TabItem {
+    content: ReactNode;
+    label: string;
+    value: string;
+}
+
+interface ColorPickerPopoverProps extends Omit<PopoverProps, "content"> {
+    additionalTabs?: TabItem[];
+    autoUpdate?: boolean;
+    checkColorContrast?: ColorContrast;
+    className?: string;
+    features?: PickerFeatures;
+    gradientPaint?: ReactNode;
+    imagePaint?: ReactNode;
+    labels?: ColorPickerLabels;
+    onOpenChange?: (open: boolean) => void;
+    onPaintsTypeChange?: (type: Paint["type"]) => void;
+    onPickerTypeChange?: (type: string) => void;
+    open: boolean;
+    paintsType?: Paint["type"];
+    pickerType?: string;
+    placement?: Placement;
+    solidPaint: ReactNode;
+    title?: string;
+    triggerRef?: react__default.RefObject<HTMLDivElement | HTMLFieldSetElement>;
+}
+declare const ColorPickerPopover: (props: ColorPickerPopoverProps) => react_jsx_runtime.JSX.Element;
+
+interface ColorGradientsPaintProps {
+    className?: string;
+    colorSpace: ChannelFieldSpace;
+    features?: {
+        containerWidth?: number;
+    };
+    gradient: GradientPaint;
+    labels?: GradientLabels;
+    onChangeEnd?: () => void;
+    onChangeStart?: () => void;
+    onColorSpaceChange: (colorSpace: ChannelFieldSpace) => void;
+    onGradientChange?: (gradient: GradientPaint) => void;
+    solidPaintLabels?: SolidPaintLabels;
+}
+declare const ColorGradientsPaint: react.ForwardRefExoticComponent<ColorGradientsPaintProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ColorImagePaintProps {
+    className?: string;
+    features?: ImagePaintFeature;
+    image?: ImagePaint;
+    imageSrc?: string;
+    onChooseImage?: () => void;
+    onImageChange?: (image: ImagePaint) => void;
+    onImageChangeEnd?: () => void;
+    onImageChangeStart?: () => void;
+}
+declare const ColorImagePaint: react__default.NamedExoticComponent<ColorImagePaintProps>;
+
+type SimpleColorPickerProps = {
+    alpha?: number;
+    className?: string;
+    color?: RGB;
+    colorAreaClassName?: string;
+    colorSpace?: ChannelFieldSpace;
+    features?: SolidPaintFeature;
+    labels?: ColorChannelLabels;
+    onAlphaChange?: (alpha: number) => void;
+    onChangeEnd?: () => void;
+    onChangeStart?: () => void;
+    onColorChange?: (color: RGB) => void;
+    onColorSpaceChange?: (colorSpace: ChannelFieldSpace) => void;
+};
+declare const SimpleColorPicker: react.ForwardRefExoticComponent<SimpleColorPickerProps & react.RefAttributes<HTMLDivElement>>;
+
+interface LibrariesDataProps {
+    features?: LibrariesFeature;
+    styles?: Style[];
+    variables?: Variable[];
+}
+interface CategoryProps {
+    category?: string;
+    onCategoryChange?: (category: string) => void;
+}
+interface DisplayProps {
+    displayType?: LibrariesDisplayType;
+    onDisplayTypeChange?: (displayType: LibrariesDisplayType) => void;
+}
+interface SelectionProps {
+    /** 重复项的索引，用于标记重复的颜色 */
+    duplicateIndex?: number | null;
+    /** 当选择库中的项目时的回调 */
+    onLibraryChange?: (value: {
+        item: Variable | Style;
+        type: LibrariesType;
+    }) => void;
+    /** 当色板颜色改变时的回调 */
+    onSwatchChange?: (value: {
+        alpha: number;
+        color: RGB;
+    }) => void;
+    /** 外部选中的项目，用于定位和高亮显示 */
+    selectedItem?: {
+        item: Variable | Style;
+        type: LibrariesType;
+    } | null;
+}
+interface BaseProps {
+    className?: string;
+    /** 头部右侧的元素 */
+    headerActionElement?: React.ReactNode;
+}
+interface LibrariesProps extends LibrariesDataProps, CategoryProps, DisplayProps, SelectionProps, BaseProps {
+}
+declare const Libraries: react.ForwardRefExoticComponent<LibrariesProps & react.RefAttributes<HTMLDivElement>>;
+
+interface ColorsContextType {
+    colorProfile: ColorProfile;
+    isWideGamutSupported: boolean;
+    setUserPreference: (profile: ColorProfile | null) => void;
+    userPreference: ColorProfile | null;
+}
+declare const ColorsContext: react.Context<ColorsContextType>;
+interface ColorsProviderProps {
+    children: ReactNode;
+    /** 初始用户偏好设置 */
+    defaultUserPreference?: ColorProfile | null;
+}
+/**
+ * 颜色配置 Provider - 提供广色域检测和用户偏好设置
+ */
+declare function ColorsProvider({ children, defaultUserPreference }: ColorsProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * 使用颜色配置的钩子 - 从 Context 中获取颜色配置信息
+ * @returns 颜色配置相关信息和操作方法
+ */
+declare const useColors: () => ColorsContextType;
+
+interface ColorParseResult {
+    alpha: number;
+    color: chroma.Color | null;
+    hasAlpha: boolean;
+}
+declare function useColorParser(): {
+    parseColor: (value: string) => ColorParseResult;
+};
+
+interface LibrariesState {
+    displayType: LibrariesDisplayType;
+    pickerType: PickerType;
+    selected: {
+        item: Variable | Style;
+        type: LibrariesType;
+    } | null;
+    selectedCategory: string;
+}
+/**
+ * Color Picker Hook
+ *
+ * 管理颜色选择器的状态和行为
+ *
+ * @returns {Object} 颜色选择器状态和处理函数
+ */
+declare const useColorPicker: () => {
+    pickerType: string;
+    paintsType: "SOLID" | GradientPaintType | "IMAGE" | "PATTERN";
+    color: RGB;
+    alpha: number;
+    gradient: GradientPaint;
+    libraries: LibrariesState;
+    variableColor: {
+        alpha: number;
+        color: RGB;
+    };
+    handleColorChange: (color: RGB) => void;
+    handleAlphaChange: (alpha: number) => void;
+    handleGradientChange: (gradient: GradientPaint) => void;
+    handlePickerTypeChange: (type: string) => void;
+    handlePaintsTypeChange: (type: "SOLID" | GradientPaintType | "IMAGE" | "PATTERN") => void;
+    handleLibraryChange: (item: {
+        item: Variable | Style;
+        type: LibrariesType;
+    }) => void;
+    handleCategoryChange: (category: string) => void;
+    handleDisplayTypeChange: (displayType: LibrariesDisplayType) => void;
+};
+
+declare function useColorProfile(): ColorProfile;
+
+/**
+ * 将-100到100范围的滤镜值映射到CSS滤镜的实际有效范围
+ * @param filters 图片滤镜配置对象
+ * @returns 包含CSS filter属性的样式对象
+ */
+declare const useImageFilterStyle: (filters?: Partial<ImageFilters>) => {
+    filter: string;
+};
+
+declare function rgbToHsl({ r, g, b }: RGB, prevHue?: number): HSL;
+declare function hslToRgb({ h, s, l }: HSL): RGB;
+declare function rgbToHsb({ r, g, b }: RGB): HSB;
+declare function hsbToRgb({ h, s, b }: HSB): RGB;
+declare function rgbToP3({ r, g, b, a }: RGBA): RGBA;
+declare function p3ToRgb({ r, g, b, a }: RGBA): RGBA;
+declare function p3StringToRgbString(color: string): string;
+declare const profileConvertString: (value: RGB | RGBA, colorProfile: ColorProfile) => string | RGB;
+declare const rgbaToRgb: (rgba: RGBA) => RGB;
+declare const stringToRgba: (color: string) => RGBA;
+/**
+ * 根据 WCAG 标准计算对比度阈值
+ * @param level 对比度级别 (AA / AAA)
+ * @param category 内容类别 (文本/图形)
+ * @returns 对比度阈值
+ */
+declare function getContrastThreshold(level?: CheckColorContrastLevel, category?: CheckColorContrastCategory, selectedElementType?: "text" | "graphics"): number;
+
+/**
+ * Convert position to color values based on color area type
+ */
+declare function positionToAreaColor(position: Vector, type: PickerAreaType, hue?: number): HSB | HSL;
+/**
+ * Convert color values to position based on color area type
+ */
+declare function colorToAreaPosition(color: HSB | HSL, type: PickerAreaType): Vector;
+
+declare const getGradientString: (gradientStops: GradientPaint["gradientStops"], gradientType: GradientPaint["type"], gradientTransform: GradientPaint["gradientTransform"], colorProfile?: ColorProfile) => string;
+
+export { AlphaInput, type AlphaInputProps, BLACK_RGBA, type BaseEffectStyle, type BasePaintStyle, type BasePendingStyle, type BasePendingStyleCommon, type BaseStyleCommon, type BaseTextStyle, type BaseVariableValue, type BezierCurveSegment, type BoundaryCalculationResult, type BoundaryInfo, COLOR_SPACES, type ChannelFieldFeature, type ChannelFieldSpace, type CheckColorContrastCategory, type CheckColorContrastLevel, ColorArea, type ColorAreaProps, ColorChannelField, type ColorChannelFieldProps, type ColorChannelLabels, type ColorContrast, type ColorContrastLabels, ColorGradientsPaint, type ColorGradientsPaintProps, ColorImagePaint, type ColorImagePaintProps, ColorInput, type ColorInputProps, ColorNativePicker, type ColorPickerLabels, ColorPickerPopover, type ColorPickerPopoverProps, type ColorProfile, ColorSlider, type ColorSliderProps, ColorSolidPaint, type ColorSolidPaintProps, type ColorStop, ColorSwatch, type ColorSwatchProps, type ColorUpdateSource, ColorsContext, ColorsProvider, type ColorsProviderProps, DEFAULT_COLOR, DEFAULT_GRADIENT_TRANSFORM, type EffectItem, type EffectItemKey, type EffectItemType, type EffectItemValue, type EffectStyle, type FillItem, type FillItemKey, type FillItemLabels, type FillItemValue, type FillType, type GradientControlLabels, type GradientFillItem, type GradientFillLabels, GradientItem, type GradientItemProps, type GradientLabels, type GradientListLabels, type GradientPaint, type GradientPaintType, type GradientToolbarLabels, type HSB, type HSBA, type HSL, type HSLA, type HSV, HexInput, type HexInputProps, type ImageFillItem, type ImageFilters, ImageItem, type ImageItemProps, type ImagePaint, type ImagePaintFeature, type ImageScaleMode, type ImageSizes, Libraries, type LibrariesDisplayType, type LibrariesFeature, type LibrariesProps, type LibrariesType, type Paint, type PaintState, type PaintStyle, type PaintType, type PaintTypeLabels, type PaletteType, type PatternPaint, type PendingEffectStyle, type PendingPaintStyle, type PendingTextStyle, type PickerAreaType, type PickerFeatures, type PickerGradientType, type PickerSliderType, type PickerType, type Property, type RGB, type RGBA, type RecommendedPoint, SimpleColorPicker, type SolidFillItem, type SolidPaint, type SolidPaintFeature, type SolidPaintLabels, type Style, type StyleId, type StyleType, type TextFillItem, type TextPaint, type TextStyle, type TextStyleKey, type TextStyleValue, type Transform, type Variable, type VariableControlKey, type VariableId, VariableItem, type VariableItemProps, type VariableOption, type VariableType, type VariableValue, colorToAreaPosition, getContrastThreshold, getGradientString, hsbToRgb, hslToRgb, p3StringToRgbString, p3ToRgb, positionToAreaColor, profileConvertString, rgbToHsb, rgbToHsl, rgbToP3, rgbaToRgb, stringToRgba, useColorParser, useColorPicker, useColorProfile, useColors, useImageFilterStyle };