import * as _yamada_ui_core from '@yamada-ui/core';
import { ThemeProps, HTMLUIProps } from '@yamada-ui/core';
import { FC, ReactNode, ForwardedRef } from 'react';
import { ColorSelectorBodyProps } from './color-selector-body.js';
import { ColorSelectorChannelsProps } from './color-selector-channels.js';
import { ColorSelectorSwatchesProps } from './color-selector-swatches.js';
import { SaturationSliderProps } from './saturation-slider.js';
import { UseColorSelectorProps } from './use-color-selector.js';
import './color-selector-eye-dropper.js';
import '@yamada-ui/button';
import '@yamada-ui/icon';
import './color-selector-sliders.js';
import './alpha-slider.js';
import './use-color-slider.js';
import '@yamada-ui/form-control';
import './hue-slider.js';
import '@yamada-ui/input';
import './color-swatch.js';
import './use-saturation-slider.js';
import '@yamada-ui/utils';

interface ColorSelectorOptions {
    children?: FC<{
        value: string;
    }> | ReactNode;
    /**
     * Ref for the saturation slider component.
     */
    saturationSliderRef?: ForwardedRef<HTMLInputElement>;
    /**
     * If `true`, display the channels component.
     *
     * @default true
     */
    withChannel?: boolean;
    /**
     * If `true`, display the saturation, hue, alpha, channels and eye dropper component.
     *
     * @default true
     */
    withPicker?: boolean;
    /**
     * Props for the channels component.
     */
    channelsProps?: ColorSelectorChannelsProps;
    /**
     * Props for the color selector input element.
     */
    inputProps?: HTMLUIProps<"input">;
    /**
     * Props for the saturation slider component.
     */
    saturationSliderProps?: Omit<SaturationSliderProps, "defaultValue" | "value">;
    /**
     * Props for the swatches component.
     */
    swatchesProps?: ColorSelectorSwatchesProps;
}
interface ColorSelectorProps extends ThemeProps<"ColorSelector">, UseColorSelectorProps, ColorSelectorOptions, Pick<ColorSelectorBodyProps, "alphaSliderProps" | "alphaSliderRef" | "eyeDropperProps" | "eyeDropperRef" | "hueSliderProps" | "hueSliderRef" | "withEyeDropper" | "withResult">, Pick<ColorSelectorSwatchesProps, "swatches" | "swatchesColumns" | "swatchesLabel" | "swatchProps">, Pick<ColorSelectorChannelsProps, "channelProps"> {
}
/**
 * `ColorSelector` is a component used by the user to select a color.
 *
 * @see Docs https://yamada-ui.com/components/forms/color-selector
 */
declare const ColorSelector: _yamada_ui_core.Component<"input", ColorSelectorProps>;

export { ColorSelector, type ColorSelectorProps };