@ropav/styles 0.5.0 → 0.7.0

package/dist/components/color-picker/color-picker.styles.d.ts

@@ -1,40 +1,16 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const colorPickerVariants: import("tailwind-variants").TVReturnType<{
-    [key: string]: {
-        [key: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            popover?: import("tailwind-variants").ClassValue;
-            trigger?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {
-    [x: string]: {
-        [x: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            popover?: import("tailwind-variants").ClassValue;
-            trigger?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {}, {
-    base: string;
-    popover: string;
-    trigger: string;
-}, undefined, {
-    [key: string]: {
-        [key: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            popover?: import("tailwind-variants").ClassValue;
-            trigger?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {}, {
-    base: string;
-    popover: string;
-    trigger: string;
-}, import("tailwind-variants").TVReturnTypeLike<unknown, {
-    base: string;
-    popover: string;
-    trigger: string;
-}>>;
+import type { VariantProps } from "../../tv";
+export declare const colorPickerVariants: (props?: ({
+    class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+} & object) | undefined) => {
+    base: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+    popover: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+    trigger: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+};
 export type ColorPickerVariants = VariantProps<typeof colorPickerVariants>;
 //# sourceMappingURL=color-picker.styles.d.ts.map

package/dist/components/color-picker/color-picker.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-picker/color-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAM9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
+{"version":3,"file":"color-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-picker/color-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,mBAAmB;;;;;;;;;;;;CAM9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}

package/dist/components/color-picker/color-picker.styles.js

@@ -1,9 +1,9 @@
-import { tv } from "tailwind-variants";
+import { tv } from "../../tv.js";
 //#region src/components/color-picker/color-picker.styles.ts
 const colorPickerVariants = tv({ slots: {
-	base: "color-picker",
-	popover: "color-picker__popover",
-	trigger: "color-picker__trigger"
+	base: "rp-color-picker",
+	popover: "rp-color-picker__popover",
+	trigger: "rp-color-picker__trigger"
 } });
 //#endregion
 export { colorPickerVariants };

package/dist/components/color-picker.css

@@ -3,7 +3,7 @@
    ========================================================================== */
 
 /* Base color-picker styles */
-.color-picker {
+.rp-color-picker {
   @apply inline-flex;
 }
 
@@ -11,16 +11,12 @@
    Trigger
    ========================================================================== */
 
-.color-picker__trigger {
+.rp-color-picker__trigger {
   @apply inline-flex items-center gap-3 rounded-sm text-sm no-highlight;
 
   /* Cursor */
   cursor: var(--cursor-interactive);
 
-  /**
-   * Transitions
-   * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
-   */
   transition:
     background-color 150ms var(--ease-smooth),
     box-shadow 150ms var(--ease-out);
@@ -48,10 +44,10 @@
    Popover
    ========================================================================== */
 
-.color-picker__popover {
+.rp-color-picker__popover {
   @apply min-w-62 origin-(--trigger-anchor-point) scrollbar-none overflow-x-hidden overflow-y-auto overscroll-contain bg-overlay px-2 pt-2 pb-3;
   box-shadow: var(--shadow-overlay);
-  border-radius: min(32px, calc(var(--radius) * 2.5));
+  border-radius: min(32px, var(--component-radius));
   /* Content layout */
   @apply flex flex-col gap-3;
 

package/dist/components/color-slider/color-slider.styles.d.ts

@@ -1,46 +1,19 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const colorSliderVariants: import("tailwind-variants").TVReturnType<{
-    [key: string]: {
-        [key: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            output?: import("tailwind-variants").ClassValue;
-            thumb?: import("tailwind-variants").ClassValue;
-            track?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {
-    [x: string]: {
-        [x: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            output?: import("tailwind-variants").ClassValue;
-            thumb?: import("tailwind-variants").ClassValue;
-            track?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {}, {
-    base: string;
-    output: string;
-    thumb: string;
-    track: string;
-}, undefined, {
-    [key: string]: {
-        [key: string]: {
-            base?: import("tailwind-variants").ClassValue;
-            output?: import("tailwind-variants").ClassValue;
-            thumb?: import("tailwind-variants").ClassValue;
-            track?: import("tailwind-variants").ClassValue;
-        } | import("tailwind-variants").ClassValue;
-    };
-} | {}, {
-    base: string;
-    output: string;
-    thumb: string;
-    track: string;
-}, import("tailwind-variants").TVReturnTypeLike<unknown, {
-    base: string;
-    output: string;
-    thumb: string;
-    track: string;
-}>>;
+import type { VariantProps } from "../../tv";
+export declare const colorSliderVariants: (props?: ({
+    class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+} & object) | undefined) => {
+    base: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+    output: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+    thumb: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+    track: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & object) | undefined) => string;
+};
 export type ColorSliderVariants = VariantProps<typeof colorSliderVariants>;
 //# sourceMappingURL=color-slider.styles.d.ts.map

package/dist/components/color-slider/color-slider.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-slider.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-slider/color-slider.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAO9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
+{"version":3,"file":"color-slider.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-slider/color-slider.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;CAO9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}

package/dist/components/color-slider/color-slider.styles.js

@@ -1,10 +1,10 @@
-import { tv } from "tailwind-variants";
+import { tv } from "../../tv.js";
 //#region src/components/color-slider/color-slider.styles.ts
 const colorSliderVariants = tv({ slots: {
-	base: "color-slider",
-	output: "color-slider__output",
-	thumb: "color-slider__thumb",
-	track: "color-slider__track"
+	base: "rp-color-slider",
+	output: "rp-color-slider__output",
+	thumb: "rp-color-slider__thumb",
+	track: "rp-color-slider__track"
 } });
 //#endregion
 export { colorSliderVariants };

package/dist/components/color-slider.css

@@ -3,7 +3,7 @@
    ========================================================================== */
 
 /* Base styles */
-.color-slider {
+.rp-color-slider {
   @apply grid w-full gap-1;
 
   grid-template-areas:
@@ -13,7 +13,7 @@
   grid-template-rows: auto auto;
 
   /* When neither label nor output exist, collapse to single row */
-  &:not(:has([data-slot="label"])):not(:has(.color-slider__output)) {
+  &:not(:has([data-slot="label"])):not(:has(.rp-color-slider__output)) {
     grid-template-areas: "track";
     grid-template-columns: 1fr;
     grid-template-rows: auto;
@@ -21,7 +21,7 @@
   }
 
   /* When only label exists (no output) */
-  &:has([data-slot="label"]):not(:has(.color-slider__output)) {
+  &:has([data-slot="label"]):not(:has(.rp-color-slider__output)) {
     grid-template-areas:
       "label"
       "track";
@@ -29,13 +29,13 @@
   }
 
   /* When only output exists (no label) */
-  &:not(:has([data-slot="label"])):has(.color-slider__output) {
+  &:not(:has([data-slot="label"])):has(.rp-color-slider__output) {
     grid-template-areas:
       "output"
       "track";
     grid-template-columns: 1fr;
 
-    .color-slider__output {
+    .rp-color-slider__output {
       justify-self: end;
     }
   }
@@ -46,14 +46,16 @@
     grid-area: label;
   }
 
-  .color-slider__output {
+  .rp-color-slider__output {
     @apply text-sm font-medium tabular-nums;
 
     grid-area: output;
   }
 
-  .color-slider__track {
-    @apply relative rounded-2xl;
+  .rp-color-slider__track {
+    @apply relative;
+
+    border-radius: min(32px, var(--component-radius));
 
     grid-area: track;
     /* Edge cap pseudo-elements */
@@ -66,9 +68,11 @@
     }
   }
 
-  .color-slider__thumb {
+  .rp-color-slider__thumb {
     /* Flex container for centering */
-    @apply absolute flex cursor-grab items-center justify-center rounded-2xl no-highlight;
+    @apply absolute flex cursor-grab items-center justify-center no-highlight;
+
+    border-radius: min(32px, var(--component-radius));
 
     /* Border to create white ring around the thumb */
     @apply border-3 border-white shadow-overlay;
@@ -76,10 +80,6 @@
     /* Ensure thumb is above edge caps */
     z-index: 1;
 
-    /**
-     * Transitions
-     * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
-     */
     transition:
       transform 250ms var(--ease-out),
       box-shadow 150ms var(--ease-out);
@@ -116,7 +116,7 @@
   &[data-orientation="horizontal"] {
     flex-direction: column;
 
-    .color-slider__track {
+    .rp-color-slider__track {
       @apply h-5 justify-self-center rounded-none;
       width: calc(100% - 1.25rem);
 
@@ -133,7 +133,8 @@
       }
 
       &::before {
-        @apply rounded-ss-2xl rounded-es-2xl;
+        border-start-start-radius: min(32px, var(--component-radius));
+        border-end-start-radius: min(32px, var(--component-radius));
         inset-inline-start: -0.625rem;
         box-shadow:
           inset 1px 0 0 0 rgba(0, 0, 0, 0.1),
@@ -145,7 +146,8 @@
       }
 
       &::after {
-        @apply rounded-se-2xl rounded-ee-2xl;
+        border-start-end-radius: min(32px, var(--component-radius));
+        border-end-end-radius: min(32px, var(--component-radius));
         inset-inline-end: -0.625rem;
         box-shadow:
           inset -1px 0 0 0 rgba(0, 0, 0, 0.1),
@@ -155,7 +157,7 @@
       }
     }
 
-    .color-slider__thumb {
+    .rp-color-slider__thumb {
       @apply top-1/2 size-4;
     }
   }
@@ -175,14 +177,14 @@
     justify-items: center;
 
     /* When neither label nor output exist in vertical, just show track */
-    &:not(:has([data-slot="label"])):not(:has(.color-slider__output)) {
+    &:not(:has([data-slot="label"])):not(:has(.rp-color-slider__output)) {
       grid-template-areas: "track";
       grid-template-rows: 1fr;
       gap: 0;
     }
 
     /* When only label exists in vertical (no output) */
-    &:has([data-slot="label"]):not(:has(.color-slider__output)) {
+    &:has([data-slot="label"]):not(:has(.rp-color-slider__output)) {
       grid-template-areas:
         "track"
         "label";
@@ -190,14 +192,14 @@
     }
 
     /* When only output exists in vertical (no label) */
-    &:not(:has([data-slot="label"])):has(.color-slider__output) {
+    &:not(:has([data-slot="label"])):has(.rp-color-slider__output) {
       grid-template-areas:
         "output"
         "track";
       grid-template-rows: auto 1fr;
     }
 
-    .color-slider__output {
+    .rp-color-slider__output {
       text-align: center;
     }
 
@@ -205,7 +207,7 @@
       text-align: center;
     }
 
-    .color-slider__track {
+    .rp-color-slider__track {
       @apply w-5 justify-self-center rounded-none;
       height: calc(100% - 1.25rem);
 
@@ -223,8 +225,8 @@
 
       &::before {
         bottom: -0.625rem;
-        border-end-start-radius: 999px;
-        border-end-end-radius: 999px;
+        border-end-start-radius: min(32px, var(--component-radius));
+        border-end-end-radius: min(32px, var(--component-radius));
         /* Left, right, and bottom borders for bottom cap */
         box-shadow:
           inset 1px 0 0 0 rgba(0, 0, 0, 0.1),
@@ -237,8 +239,8 @@
 
       &::after {
         top: -0.625rem;
-        border-start-start-radius: 999px;
-        border-start-end-radius: 999px;
+        border-start-start-radius: min(32px, var(--component-radius));
+        border-start-end-radius: min(32px, var(--component-radius));
         /* Left, right, and top borders for top cap */
         box-shadow:
           inset 1px 0 0 0 rgba(0, 0, 0, 0.1),
@@ -248,7 +250,7 @@
       }
     }
 
-    .color-slider__thumb {
+    .rp-color-slider__thumb {
       /* Cross-axis centering; React Aria applies a physical translateX(-50%), so keep left-1/2 for RTL correctness */
       @apply left-1/2 size-4;
     }

package/dist/components/color-swatch/color-swatch.styles.d.ts

@@ -1,40 +1,9 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const colorSwatchVariants: import("tailwind-variants").TVReturnType<{
-    shape: {
-        circle: "color-swatch--circle";
-        square: "color-swatch--square";
-    };
-    size: {
-        lg: "color-swatch--lg";
-        md: "color-swatch--md";
-        sm: "color-swatch--sm";
-        xl: "color-swatch--xl";
-        xs: "color-swatch--xs";
-    };
-}, undefined, "color-swatch", {
-    shape: {
-        circle: "color-swatch--circle";
-        square: "color-swatch--square";
-    };
-    size: {
-        lg: "color-swatch--lg";
-        md: "color-swatch--md";
-        sm: "color-swatch--sm";
-        xl: "color-swatch--xl";
-        xs: "color-swatch--xs";
-    };
-}, undefined, import("tailwind-variants").TVReturnTypeLike<{
-    shape: {
-        circle: "color-swatch--circle";
-        square: "color-swatch--square";
-    };
-    size: {
-        lg: "color-swatch--lg";
-        md: "color-swatch--md";
-        sm: "color-swatch--sm";
-        xl: "color-swatch--xl";
-        xs: "color-swatch--xs";
-    };
-}, undefined>>;
+import type { VariantProps } from "../../tv";
+export declare const colorSwatchVariants: (props?: ({
+    class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+} & {
+    shape?: "circle" | "square" | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+}) | undefined) => string;
 export type ColorSwatchVariants = VariantProps<typeof colorSwatchVariants>;
 //# sourceMappingURL=color-swatch.styles.d.ts.map

package/dist/components/color-swatch/color-swatch.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-swatch.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-swatch/color-swatch.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,mBAAmB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;cAmB9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}
+{"version":3,"file":"color-swatch.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-swatch/color-swatch.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,mBAAmB;;;;;yBAmB9B,CAAC;AAEH,MAAM,MAAM,mBAAmB,GAAG,YAAY,CAAC,OAAO,mBAAmB,CAAC,CAAC"}

package/dist/components/color-swatch/color-swatch.styles.js

@@ -1,22 +1,22 @@
-import { tv } from "tailwind-variants";
+import { tv } from "../../tv.js";
 //#region src/components/color-swatch/color-swatch.styles.ts
 const colorSwatchVariants = tv({
-	base: "color-swatch",
+	base: "rp-color-swatch",
 	defaultVariants: {
 		shape: "circle",
 		size: "md"
 	},
 	variants: {
 		shape: {
-			circle: "color-swatch--circle",
-			square: "color-swatch--square"
+			circle: "rp-color-swatch--circle",
+			square: "rp-color-swatch--square"
 		},
 		size: {
-			lg: "color-swatch--lg",
-			md: "color-swatch--md",
-			sm: "color-swatch--sm",
-			xl: "color-swatch--xl",
-			xs: "color-swatch--xs"
+			lg: "rp-color-swatch--lg",
+			md: "rp-color-swatch--md",
+			sm: "rp-color-swatch--sm",
+			xl: "rp-color-swatch--xl",
+			xs: "rp-color-swatch--xs"
 		}
 	}
 });

package/dist/components/color-swatch-picker/color-swatch-picker.styles.d.ts

@@ -1,121 +1,39 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const colorSwatchPickerVariants: import("tailwind-variants").TVReturnType<{
-    layout: {
-        grid: {
-            base: string;
-        };
-        stack: {
-            base: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-        xl: {
-            base: string;
-        };
-        xs: {
-            base: string;
-        };
-    };
-    variant: {
-        circle: {
-            base: string;
-        };
-        square: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    indicator: string;
-    item: string;
-    swatch: string;
-}, undefined, {
-    layout: {
-        grid: {
-            base: string;
-        };
-        stack: {
-            base: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-        xl: {
-            base: string;
-        };
-        xs: {
-            base: string;
-        };
-    };
-    variant: {
-        circle: {
-            base: string;
-        };
-        square: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    indicator: string;
-    item: string;
-    swatch: string;
-}, import("tailwind-variants").TVReturnTypeLike<{
-    layout: {
-        grid: {
-            base: string;
-        };
-        stack: {
-            base: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-        xl: {
-            base: string;
-        };
-        xs: {
-            base: string;
-        };
-    };
-    variant: {
-        circle: {
-            base: string;
-        };
-        square: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    indicator: string;
-    item: string;
-    swatch: string;
-}>>;
+import type { VariantProps } from "../../tv";
+export declare const colorSwatchPickerVariants: (props?: ({
+    class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | /*elided*/ any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+} & {
+    layout?: "grid" | "stack" | undefined;
+    size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+    variant?: "circle" | "square" | undefined;
+}) | undefined) => {
+    base: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & {
+        layout?: "grid" | "stack" | undefined;
+        size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+        variant?: "circle" | "square" | undefined;
+    }) | undefined) => string;
+    indicator: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & {
+        layout?: "grid" | "stack" | undefined;
+        size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+        variant?: "circle" | "square" | undefined;
+    }) | undefined) => string;
+    item: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & {
+        layout?: "grid" | "stack" | undefined;
+        size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+        variant?: "circle" | "square" | undefined;
+    }) | undefined) => string;
+    swatch: (props?: ({
+        class?: string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | (string | false | any | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined)[] | null | undefined;
+    } & {
+        layout?: "grid" | "stack" | undefined;
+        size?: "lg" | "md" | "sm" | "xl" | "xs" | undefined;
+        variant?: "circle" | "square" | undefined;
+    }) | undefined) => string;
+};
 export type ColorSwatchPickerVariants = VariantProps<typeof colorSwatchPickerVariants>;
 //# sourceMappingURL=color-swatch-picker.styles.d.ts.map

package/dist/components/color-swatch-picker/color-swatch-picker.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color-swatch-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-swatch-picker/color-swatch-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,yBAAyB;;QAchC,IAAI;YACF,IAAI;;QAEN,KAAK;YACH,IAAI;;;;QAIN,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;;;QAIN,MAAM;YACJ,IAAI;;QAEN,MAAM;YACJ,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,yBAAyB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC"}
+{"version":3,"file":"color-swatch-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/color-swatch-picker/color-swatch-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,yBAAyB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+CpC,CAAC;AAEH,MAAM,MAAM,yBAAyB,GAAG,YAAY,CAAC,OAAO,yBAAyB,CAAC,CAAC"}