@ropav/styles 0.5.0 → 0.7.0

package/dist/components/autocomplete/autocomplete.styles.d.ts

@@ -1,109 +1,60 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const autocompleteVariants: import("tailwind-variants").TVReturnType<{
-    fullWidth: {
-        false: {};
-        true: {
-            base: string;
-            trigger: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-            popover: string;
-        };
-        md: {};
-        sm: {
-            base: string;
-            popover: string;
-        };
-    };
-    variant: {
-        primary: {
-            base: string;
-        };
-        secondary: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    clearButton: string;
-    filter: string;
-    indicator: string;
-    popover: string;
-    trigger: string;
-    value: string;
-}, undefined, {
-    fullWidth: {
-        false: {};
-        true: {
-            base: string;
-            trigger: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-            popover: string;
-        };
-        md: {};
-        sm: {
-            base: string;
-            popover: string;
-        };
-    };
-    variant: {
-        primary: {
-            base: string;
-        };
-        secondary: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    clearButton: string;
-    filter: string;
-    indicator: string;
-    popover: string;
-    trigger: string;
-    value: string;
-}, import("tailwind-variants").TVReturnTypeLike<{
-    fullWidth: {
-        false: {};
-        true: {
-            base: string;
-            trigger: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-            popover: string;
-        };
-        md: {};
-        sm: {
-            base: string;
-            popover: string;
-        };
-    };
-    variant: {
-        primary: {
-            base: string;
-        };
-        secondary: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    clearButton: string;
-    filter: string;
-    indicator: string;
-    popover: string;
-    trigger: string;
-    value: string;
-}>>;
+import type { VariantProps } from "../../tv";
+export declare const autocompleteVariants: (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;
+} & {
+    fullWidth?: boolean | undefined;
+    size?: "lg" | "md" | "sm" | undefined;
+    variant?: "primary" | "secondary" | 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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | undefined) => string;
+    clearButton: (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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | undefined) => string;
+    filter: (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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | 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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | 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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | 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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | undefined) => string;
+    value: (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;
+    } & {
+        fullWidth?: boolean | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "primary" | "secondary" | undefined;
+    }) | undefined) => string;
+};
 export type AutocompleteVariants = VariantProps<typeof autocompleteVariants>;
 //# sourceMappingURL=autocomplete.styles.d.ts.map

package/dist/components/autocomplete/autocomplete.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"autocomplete.styles.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/autocomplete.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,oBAAoB;;QAiB3B,KAAK;QACL,IAAI;YACF,IAAI;YACJ,OAAO;;;;QAIT,EAAE;YACA,IAAI;YACJ,OAAO;;QAET,EAAE;QACF,EAAE;YACA,IAAI;YACJ,OAAO;;;;QAIT,OAAO;YACL,IAAI;;QAEN,SAAS;YACP,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,oBAAoB,CAAC,CAAC"}
+{"version":3,"file":"autocomplete.styles.d.ts","sourceRoot":"","sources":["../../../src/components/autocomplete/autocomplete.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,oBAAoB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2C/B,CAAC;AAEH,MAAM,MAAM,oBAAoB,GAAG,YAAY,CAAC,OAAO,oBAAoB,CAAC,CAAC"}

package/dist/components/autocomplete/autocomplete.styles.js

@@ -1,4 +1,4 @@
-import { tv } from "tailwind-variants";
+import { tv } from "../../tv.js";
 //#region src/components/autocomplete/autocomplete.styles.ts
 const autocompleteVariants = tv({
 	defaultVariants: {
@@ -7,36 +7,36 @@ const autocompleteVariants = tv({
 		variant: "primary"
 	},
 	slots: {
-		base: "autocomplete",
-		clearButton: "autocomplete__clear-button",
-		filter: "autocomplete__filter",
-		indicator: "autocomplete__indicator",
-		popover: "autocomplete__popover",
-		trigger: "autocomplete__trigger",
-		value: "autocomplete__value"
+		base: "rp-autocomplete",
+		clearButton: "rp-autocomplete__clear-button",
+		filter: "rp-autocomplete__filter",
+		indicator: "rp-autocomplete__indicator",
+		popover: "rp-autocomplete__popover",
+		trigger: "rp-autocomplete__trigger",
+		value: "rp-autocomplete__value"
 	},
 	variants: {
 		fullWidth: {
 			false: {},
 			true: {
-				base: "autocomplete--full-width",
-				trigger: "autocomplete__trigger--full-width"
+				base: "rp-autocomplete--full-width",
+				trigger: "rp-autocomplete__trigger--full-width"
 			}
 		},
 		size: {
 			lg: {
-				base: "autocomplete--lg",
-				popover: "autocomplete__popover--lg"
+				base: "rp-autocomplete--lg",
+				popover: "rp-autocomplete__popover--lg"
 			},
 			md: {},
 			sm: {
-				base: "autocomplete--sm",
-				popover: "autocomplete__popover--sm"
+				base: "rp-autocomplete--sm",
+				popover: "rp-autocomplete__popover--sm"
 			}
 		},
 		variant: {
-			primary: { base: "autocomplete--primary" },
-			secondary: { base: "autocomplete--secondary" }
+			primary: { base: "rp-autocomplete--primary" },
+			secondary: { base: "rp-autocomplete--secondary" }
 		}
 	}
 });

package/dist/components/autocomplete.css

@@ -1,10 +1,17 @@
 /* Autocomplete styles */
-.autocomplete {
+.rp-autocomplete {
   @apply flex flex-col gap-1;
 }
 
-.autocomplete__trigger {
-  @apply relative isolate inline-flex min-h-9 rounded-field border bg-field px-3 field-line-md text-field-foreground shadow-field outline-none select-none no-highlight;
+.rp-autocomplete__trigger {
+  @apply relative isolate inline-flex min-h-9 rounded-field border px-3 field-line-md text-field-foreground shadow-field outline-none select-none no-highlight;
+
+  /* The fill, per state. The `--secondary` variant re-points these and declares nothing else. */
+  --autocomplete-trigger-bg: var(--field-background, var(--default));
+  --autocomplete-trigger-bg-hover: var(--field-hover);
+  --autocomplete-trigger-bg-focus: var(--field-focus);
+
+  background-color: var(--autocomplete-trigger-bg);
 
   /* Forced Colors Mode flattens the fill onto the page and strips the shadow, leaving a control
    * with nothing to say it is one. `ButtonBorder` is the keyword the platform uses for a
@@ -14,10 +21,6 @@
     outline-offset: -1px;
   }
 
-  /**
-   * Transitions
-   * CRITICAL: motion-reduce must be AFTER transition for correct override specificity
-   */
   transition:
     background-color 150ms var(--ease-smooth),
     border-color 150ms var(--ease-smooth),
@@ -31,15 +34,15 @@
   border-color: var(--field-border);
 
   /* Add inline-end padding when indicator is present */
-  &:has(.autocomplete__indicator) {
+  &:has(.rp-autocomplete__indicator) {
     @apply pe-7;
   }
 
   /* Hover state - exclude when clear button is hovered to prevent double hover effect */
   @media (hover: hover) {
-    &:hover:not(:has(.autocomplete__clear-button:hover)),
-    &[data-hovered="true"]:not(:has(.autocomplete__clear-button:hover)) {
-      @apply bg-field-hover;
+    &:hover:not(:has(.rp-autocomplete__clear-button:hover)),
+    &[data-hovered="true"]:not(:has(.rp-autocomplete__clear-button:hover)) {
+      background-color: var(--autocomplete-trigger-bg-hover);
       border-color: var(--field-border-hover);
     }
   }
@@ -49,7 +52,7 @@
   &[data-focus-visible="true"] {
     @apply status-focused;
     border-color: var(--field-border-focus);
-    background-color: var(--field-focus);
+    background-color: var(--autocomplete-trigger-bg-focus);
   }
 
   /* Focus state */
@@ -58,10 +61,10 @@
   }
 
   /* Invalid state */
-  .autocomplete[data-invalid="true"] &,
-  .autocomplete[aria-invalid="true"] & {
+  .rp-autocomplete[data-invalid="true"] &,
+  .rp-autocomplete[aria-invalid="true"] & {
     @apply status-invalid-field;
-    background-color: var(--field-focus);
+    background-color: var(--autocomplete-trigger-bg-focus);
   }
 
   /* Disabled state */
@@ -73,46 +76,28 @@
 }
 
 /* Variant property definitions */
-.autocomplete--primary {
+.rp-autocomplete--primary {
   /* Default styles */
 }
 
-.autocomplete--secondary .autocomplete__trigger {
+.rp-autocomplete--secondary .rp-autocomplete__trigger {
   @apply shadow-none;
-  background-color: var(--autocomplete-trigger-bg);
 
   --autocomplete-trigger-bg: var(--default);
   --autocomplete-trigger-bg-hover: var(--default-hover);
   --autocomplete-trigger-bg-focus: var(--default);
+}
 
-  /* Exclude when clear button is hovered to prevent double hover effect */
-  @media (hover: hover) {
-    &:hover:not(:has(.autocomplete__clear-button:hover)),
-    &[data-hovered="true"]:not(:has(.autocomplete__clear-button:hover)) {
-      background-color: var(--autocomplete-trigger-bg-hover);
-    }
-  }
-
-  &:focus-visible:not(:focus),
-  &[data-focus-visible="true"] {
-    background-color: var(--autocomplete-trigger-bg-focus);
-  }
-
-  &:focus,
-  &[data-focus="true"] {
-  }
+.rp-autocomplete__value {
+  @apply flex-1 text-start wrap-break-word;
 
-  .autocomplete[data-invalid="true"] &,
-  .autocomplete[aria-invalid="true"] & {
-    background-color: var(--autocomplete-trigger-bg-focus);
-  }
-}
+  --autocomplete-value-fg: currentcolor;
+  --autocomplete-value-fg-placeholder: var(--field-placeholder, var(--muted));
 
-.autocomplete__value {
-  @apply flex-1 text-start wrap-break-word text-current;
+  color: var(--autocomplete-value-fg);
 
   &[data-placeholder="true"] {
-    @apply text-field-placeholder;
+    color: var(--autocomplete-value-fg-placeholder);
   }
 
   /* Removes the list-box-item indicator element from the autocomplete value*/
@@ -121,7 +106,7 @@
   }
 }
 
-.autocomplete__indicator {
+.rp-autocomplete__indicator {
   @apply absolute inset-y-0 end-2 my-auto flex shrink-0 items-center justify-center text-field-placeholder transition duration-150;
 
   /* Cursor */
@@ -137,7 +122,7 @@
 }
 
 /* Similar to popover content styles */
-.autocomplete__popover {
+.rp-autocomplete__popover {
   @apply flex w-(--trigger-width) max-w-(--trigger-width) origin-(--trigger-anchor-point) scroll-py-1 flex-col overflow-hidden overscroll-contain bg-overlay p-0 pt-2 text-sm outline-none;
   border-radius: min(32px, var(--component-radius));
   box-shadow: var(--shadow-overlay);
@@ -241,18 +226,23 @@
 }
 
 /* Full width modifier */
-.autocomplete--full-width {
+.rp-autocomplete--full-width {
   @apply w-full;
 }
 
-.autocomplete__trigger--full-width {
+.rp-autocomplete__trigger--full-width {
   @apply w-full;
 }
 
 /* Clear Button styles */
-.autocomplete__clear-button {
+.rp-autocomplete__clear-button {
   @apply relative isolate inline-flex h-6 w-6 shrink-0 origin-center items-center justify-center rounded-xl p-1 text-muted select-none no-highlight;
-  @apply me-0 size-5 shrink-0 self-center bg-transparent;
+  @apply me-0 size-5 shrink-0 self-center;
+
+  --autocomplete-clear-button-bg: transparent;
+  --autocomplete-clear-button-bg-hover: var(--default-hover);
+
+  background-color: var(--autocomplete-clear-button-bg);
 
   /* Cursor */
   cursor: var(--cursor-interactive);
@@ -280,7 +270,7 @@
   @media (hover: hover) {
     &:hover,
     &[data-hovered="true"] {
-      @apply bg-default-hover;
+      background-color: var(--autocomplete-clear-button-bg-hover);
     }
   }
 
@@ -296,21 +286,21 @@
 
 /* The trigger's own metrics, and the option rows in a popover that is portalled out of this tree -
  * which is why the popover carries its own size class rather than being reached from the base. */
-.autocomplete--sm .autocomplete__trigger {
+.rp-autocomplete--sm .rp-autocomplete__trigger {
   @apply min-h-8 field-line-sm;
 }
 
-.autocomplete--lg .autocomplete__trigger {
+.rp-autocomplete--lg .rp-autocomplete__trigger {
   @apply min-h-10 field-line-lg;
 }
 
-.autocomplete__popover--sm {
+.rp-autocomplete__popover--sm {
   [data-slot="list-box-item"] {
     @apply min-h-8 py-1;
   }
 }
 
-.autocomplete__popover--lg {
+.rp-autocomplete__popover--lg {
   @apply text-base;
 
   [data-slot="list-box-item"] {

package/dist/components/avatar/avatar.styles.d.ts

@@ -1,121 +1,32 @@
-import type { VariantProps } from "tailwind-variants";
-export declare const avatarVariants: import("tailwind-variants").TVReturnType<{
-    color: {
-        accent: {
-            fallback: string;
-        };
-        danger: {
-            fallback: string;
-        };
-        default: {
-            fallback: string;
-        };
-        success: {
-            fallback: string;
-        };
-        warning: {
-            fallback: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-    };
-    variant: {
-        default: {};
-        soft: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    fallback: string;
-    image: string;
-}, undefined, {
-    color: {
-        accent: {
-            fallback: string;
-        };
-        danger: {
-            fallback: string;
-        };
-        default: {
-            fallback: string;
-        };
-        success: {
-            fallback: string;
-        };
-        warning: {
-            fallback: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-    };
-    variant: {
-        default: {};
-        soft: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    fallback: string;
-    image: string;
-}, import("tailwind-variants").TVReturnTypeLike<{
-    color: {
-        accent: {
-            fallback: string;
-        };
-        danger: {
-            fallback: string;
-        };
-        default: {
-            fallback: string;
-        };
-        success: {
-            fallback: string;
-        };
-        warning: {
-            fallback: string;
-        };
-    };
-    size: {
-        lg: {
-            base: string;
-        };
-        md: {
-            base: string;
-        };
-        sm: {
-            base: string;
-        };
-    };
-    variant: {
-        default: {};
-        soft: {
-            base: string;
-        };
-    };
-}, {
-    base: string;
-    fallback: string;
-    image: string;
-}>>;
+import type { VariantProps } from "../../tv";
+export declare const avatarVariants: (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;
+} & {
+    color?: "accent" | "danger" | "default" | "success" | "warning" | undefined;
+    size?: "lg" | "md" | "sm" | undefined;
+    variant?: "default" | "soft" | 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;
+    } & {
+        color?: "accent" | "danger" | "default" | "success" | "warning" | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "default" | "soft" | undefined;
+    }) | undefined) => string;
+    fallback: (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;
+    } & {
+        color?: "accent" | "danger" | "default" | "success" | "warning" | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "default" | "soft" | undefined;
+    }) | undefined) => string;
+    image: (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;
+    } & {
+        color?: "accent" | "danger" | "default" | "success" | "warning" | undefined;
+        size?: "lg" | "md" | "sm" | undefined;
+        variant?: "default" | "soft" | undefined;
+    }) | undefined) => string;
+};
 export type AvatarVariants = VariantProps<typeof avatarVariants>;
 //# sourceMappingURL=avatar.styles.d.ts.map

package/dist/components/avatar/avatar.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"avatar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAItD,eAAO,MAAM,cAAc;;QAYrB,MAAM;YACJ,QAAQ;;QAEV,MAAM;YACJ,QAAQ;;QAEV,OAAO;YACL,QAAQ;;QAEV,OAAO;YACL,QAAQ;;QAEV,OAAO;YACL,QAAQ;;;;QAIV,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;QAEN,EAAE;YACA,IAAI;;;;QAIN,OAAO;QACP,IAAI;YACF,IAAI;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAIV,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC"}
+{"version":3,"file":"avatar.styles.d.ts","sourceRoot":"","sources":["../../../src/components/avatar/avatar.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAI7C,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8CzB,CAAC;AAEH,MAAM,MAAM,cAAc,GAAG,YAAY,CAAC,OAAO,cAAc,CAAC,CAAC"}

package/dist/components/avatar/avatar.styles.js

@@ -1,4 +1,4 @@
-import { tv } from "tailwind-variants";
+import { tv } from "../../tv.js";
 //#region src/components/avatar/avatar.styles.ts
 const avatarVariants = tv({
 	defaultVariants: {
@@ -6,26 +6,26 @@ const avatarVariants = tv({
 		size: "md"
 	},
 	slots: {
-		base: "avatar",
-		fallback: "avatar__fallback",
-		image: "avatar__image"
+		base: "rp-avatar",
+		fallback: "rp-avatar__fallback",
+		image: "rp-avatar__image"
 	},
 	variants: {
 		color: {
-			accent: { fallback: "avatar__fallback--accent" },
-			danger: { fallback: "avatar__fallback--danger" },
-			default: { fallback: "avatar__fallback--default" },
-			success: { fallback: "avatar__fallback--success" },
-			warning: { fallback: "avatar__fallback--warning" }
+			accent: { fallback: "rp-avatar__fallback--accent" },
+			danger: { fallback: "rp-avatar__fallback--danger" },
+			default: { fallback: "rp-avatar__fallback--default" },
+			success: { fallback: "rp-avatar__fallback--success" },
+			warning: { fallback: "rp-avatar__fallback--warning" }
 		},
 		size: {
-			lg: { base: "avatar--lg" },
-			md: { base: "avatar--md" },
-			sm: { base: "avatar--sm" }
+			lg: { base: "rp-avatar--lg" },
+			md: { base: "rp-avatar--md" },
+			sm: { base: "rp-avatar--sm" }
 		},
 		variant: {
 			default: {},
-			soft: { base: "avatar--soft" }
+			soft: { base: "rp-avatar--soft" }
 		}
 	}
 });