import { VariantProps } from "@soybeanjs/cva";

//#region src/styles/color-swatch-picker.d.ts
declare const colorSwatchPickerVariants: import("@soybeanjs/cva").SCVResult<"root" | "item" | "itemIndicator" | "swatchRoot" | "swatchChecker" | "swatchFill", NoInfer<{
  size: {
    xs: {
      root: "grid-cols-[repeat(auto-fill,minmax(1.25rem,1fr))] gap-1.5 text-2xs";
      item: "size-5";
      itemIndicator: "text-4xs";
    };
    sm: {
      root: "grid-cols-[repeat(auto-fill,minmax(1.375rem,1fr))] gap-1.75 text-xs";
      item: "size-5.5";
      itemIndicator: "text-3xs";
    };
    md: {
      root: "grid-cols-[repeat(auto-fill,minmax(1.5rem,1fr))] gap-2 text-sm";
      item: "size-6";
      itemIndicator: "text-2xs";
    };
    lg: {
      root: "grid-cols-[repeat(auto-fill,minmax(1.625rem,1fr))] gap-2.5 text-base";
      item: "size-6.5";
      itemIndicator: "text-xs";
    };
    xl: {
      root: "grid-cols-[repeat(auto-fill,minmax(1.75rem,1fr))] gap-3 text-lg";
      item: "size-7";
      itemIndicator: "text-sm";
    };
    '2xl': {
      root: "grid-cols-[repeat(auto-fill,minmax(2rem,1fr))] gap-4 text-xl";
      item: "size-8";
      itemIndicator: "text-base";
    };
  };
  shape: {
    square: {
      item: "rounded-md";
    };
    circle: {
      item: "rounded-full";
    };
  };
}>, {
  size?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | undefined;
  shape?: "square" | "circle" | undefined;
}>;
type ColorSwatchPickerVariants = VariantProps<typeof colorSwatchPickerVariants>;
type ColorSwatchPickerShape = NonNullable<ColorSwatchPickerVariants['shape']>;
//#endregion
export { ColorSwatchPickerShape };