myshell-react-lib 0.1.64 → 0.1.65

package/dist/index.cjs

@@ -5435,7 +5435,7 @@ function Image2(_param) {
 }
 // src/components/button/button.styles.ts
 var import_class_variance_authority4 = require("class-variance-authority");
-var BASE_BUTTON = "relative shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-sm font-medium transition-colors focus-visible:secondary-none focus-visible:shadow-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:pointer-events-none disabled:shadow-none [&>span>svg]:text-inherit [&>span>span>svg]:text-inherit";
+var BASE_BUTTON = "relative shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-sm font-medium transition-colors focus-visible-style disabled:pointer-events-none disabled:shadow-none [&>span>svg]:text-inherit [&>span>span>svg]:text-inherit";
 var SIZE_CLASSES = {
     lg: {
         base: "h-11",
@@ -5885,7 +5885,7 @@ var AlertDialogContent = React7.forwardRef(function(_param, ref) {
             /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AlertDialogOverlay, {}),
             /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(AlertDialogPrimitive.Content, _object_spread({
                 ref: ref,
-                className: cn("fixed left-[50%] top-[50%] z-50 grid w-full rounded-4xl max-w-lg translate-x-[-50%] translate-y-[-50%] bg-Colors-Background-Normal-Primary-Default shadow-modal-default duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1", className)
+                className: cn("fixed left-[50%] top-[50%] z-50 grid w-full rounded-4xl max-w-lg translate-x-[-50%] translate-y-[-50%] bg-Colors-Background-Normal-Primary-Default shadow-modal-default duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] focus-visible-style", className)
             }, props))
         ]
     });
@@ -6387,7 +6387,7 @@ var TooltipContent = React9.forwardRef(function(_param, ref) {
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 // src/components/button/icon-button.styles.ts
 var import_class_variance_authority5 = require("class-variance-authority");
-var BASE_STYLES = "shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-sm font-medium transition-colors focus-visible:outline-none focus-visible:shadow-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:pointer-events-none disabled:shadow-none";
+var BASE_STYLES = "shrink-0 inline-flex items-center justify-center whitespace-nowrap rounded-sm font-medium transition-colors focus-visible-style disabled:pointer-events-none disabled:shadow-none";
 var VARIANT_STYLES = {
     primary: "",
     secondary: "border shadow-none",
@@ -6959,11 +6959,11 @@ var CheckIcon = function(param) {
         })
     });
 };
-var checkboxVariants = (0, import_class_variance_authority8.cva)("peer w-5 h-5 shrink-0 border-[1.5px]  overflow-hidden flex items-center justify-center text-current focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default", {
+var checkboxVariants = (0, import_class_variance_authority8.cva)("peer w-5 h-5 shrink-0 border-[1.5px]  overflow-hidden flex items-center justify-center text-current focus-visible-style", {
     variants: {
         variant: {
-            checkbox: "rounded-xxs border-cc-Check-Box-border-default hover:border-cc-Check-Box-border-hover data-[state=checked]:border-cc-Check-Box-bg-default hover:disabled:border-cc-Check-Box-border-disabled disabled:data-[state=checked]:border-cc-Check-Box-border-default focus-visible:border-cc-Check-Box-border-default focus-visible:ring-offset-1 disabled:bg-cc-Check-Box-bg-disabled disabled:cursor-not-allowed data-[state=checked]:bg-cc-Check-Box-bg-default data-[state=checked]:text-cc-Check-Box-fg-default hover:data-[state=checked]:bg-cc-Check-Box-bg-hovered disabled:data-[state=checked]:text-cc-Check-Box-fg-alt disabled:data-[state=checked]:bg-cc-Check-Box-bg-disabled",
-            circle: "rounded-full border-cc-Check-Box-border-default hover:border-cc-Check-Box-border-hover hover:disabled:border-cc-Check-Box-border-disabled data-[state=checked]:border-cc-Check-Box-bg-default hover:disabled:border-cc-Check-Box-border-disabled disabled:data-[state=checked]:border-cc-Check-Box-border-default focus-visible:border-cc-Check-Box-border-default focus-visible:ring-offset-1 disabled:bg-cc-Check-Box-bg-disabled disabled:cursor-not-allowed data-[state=checked]:bg-cc-Check-Box-bg-default data-[state=checked]:text-cc-Check-Box-fg-default hover:data-[state=checked]:bg-cc-Check-Box-bg-hovered disabled:data-[state=checked]:text-cc-Check-Box-fg-alt disabled:data-[state=checked]:bg-cc-Check-Box-bg-disabled",
+            checkbox: "rounded-xxs border-cc-Check-Box-border-default hover:border-cc-Check-Box-border-hover data-[state=checked]:border-cc-Check-Box-bg-default hover:disabled:border-cc-Check-Box-border-disabled disabled:data-[state=checked]:border-cc-Check-Box-border-default disabled:bg-cc-Check-Box-bg-disabled disabled:cursor-not-allowed data-[state=checked]:bg-cc-Check-Box-bg-default data-[state=checked]:text-cc-Check-Box-fg-default hover:data-[state=checked]:bg-cc-Check-Box-bg-hovered disabled:data-[state=checked]:text-cc-Check-Box-fg-alt disabled:data-[state=checked]:bg-cc-Check-Box-bg-disabled",
+            circle: "rounded-full border-cc-Check-Box-border-default hover:border-cc-Check-Box-border-hover hover:disabled:border-cc-Check-Box-border-disabled data-[state=checked]:border-cc-Check-Box-bg-default hover:disabled:border-cc-Check-Box-border-disabled disabled:data-[state=checked]:border-cc-Check-Box-border-default disabled:bg-cc-Check-Box-bg-disabled disabled:cursor-not-allowed data-[state=checked]:bg-cc-Check-Box-bg-default data-[state=checked]:text-cc-Check-Box-fg-default hover:data-[state=checked]:bg-cc-Check-Box-bg-hovered disabled:data-[state=checked]:text-cc-Check-Box-fg-alt disabled:data-[state=checked]:bg-cc-Check-Box-bg-disabled",
             radio: "rounded-full border-cc-Check-Box-border-default hover:border-cc-Check-Box-border-hover hover:disabled:border-cc-Check-Box-border-disabled disabled:bg-cc-Check-Box-bg-disabled disabled:data-[state=checked]:border-cc-Check-Box-border-disabled  hover:data-[state=checked]:bg-cc-Check-Box-border-hovered data-[state=checked]:bg-cc-Check-Box-bg-default disabled:data-[state=checked]:bg-cc-Check-Box-border-disabled",
             static: "rounded-full border-Colors-Beta-White-100 bg-Colors-Beta-Black-12 data-[state=checked]:bg-Colors-Beta-Black-100 border-Colors-Beta-White-100 hover:bg-Colors-Beta-Black-20 data-[state=checked]:border-none  disabled:border-Colors-Beta-White-80 disabled:data-[state=checked]:text-cc-Colors-Beta-White-80 disabled:data-[state=checked]:backdrop-blur-2xl"
         }
@@ -7033,7 +7033,7 @@ var DialogTrigger = React15.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(DialogPrimitive.Trigger, _object_spread({
         ref: ref,
-        className: cn("focus-visible:outline-none focus-visible:shadow-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1", className)
+        className: cn("focus-visible-style", className)
     }, props));
 });
 DialogTrigger.displayName = DialogPrimitive.Trigger.displayName;
@@ -7068,7 +7068,7 @@ var DialogContent = React15.forwardRef(function(_param, ref) {
             }),
             /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(DialogPrimitive.Content, _object_spread_props(_object_spread({
                 ref: ref,
-                className: cn("fixed left-[50%] top-[50%] z-50 grid w-[90%] rounded-4xl max-w-lg translate-x-[-50%] translate-y-[-50%] bg-Colors-Background-Normal-Primary-Default shadow-modal-default duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 focus-visible:outline-0", className)
+                className: cn("fixed left-[50%] top-[50%] z-50 grid w-[90%] rounded-4xl max-w-lg translate-x-[-50%] translate-y-[-50%] bg-Colors-Background-Normal-Primary-Default shadow-modal-default duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] focus-visible-style", className)
             }, props), {
                 children: [
                     children,
@@ -7775,7 +7775,7 @@ var Input = React21.forwardRef(function(_param, ref) {
             },
             border: {
                 none: "border-none shadow-none",
-                default: "border border-cc-Input-border-default "
+                default: "border border-cc-Input-border-default focus-visible-style"
             },
             outline: {
                 none: "outline-none",
@@ -7911,7 +7911,7 @@ function Link(_param) {
                 onClick === null || onClick === void 0 ? void 0 : onClick(e);
             }
         },
-        className: className,
+        className: cn("focus-visible-style", className),
         rel: externalLink ? "nofollow,noreferrer" : "dofollow",
         target: externalLink ? "_blank" : void 0
     }, props), {
@@ -8922,7 +8922,7 @@ var searchBarVariants = (0, import_class_variance_authority13.cva)("rounded-sm",
         }
     },
     defaultVariants: {
-        size: "sm"
+        size: "xs"
     }
 });
 function SearchBar(_param) {
@@ -8962,9 +8962,9 @@ function SearchBar(_param) {
                 placeholder: placeholder,
                 rounded: roundedFill ? "full" : "sm",
                 size: size,
-                className: cn("relative w-full px-9 flex space-x-2 text-base shadow-none placeholder:text-Colors-Text-Subtlest", {
+                className: cn("relative w-full px-9 flex space-x-2 text-base shadow-none placeholder:text-Colors-Text-Subtlest", "border-cc-Search-Bar-border-default bg-cc-Search-Bar-bg-default hover:bg-cc-Search-Bar-bg-hover focus-visible-style", {
                     "focus-visible:ring-transparent": readOnly
-                }, "border-cc-Search-Bar-border-default bg-cc-Search-Bar-bg-default hover:bg-cc-Search-Bar-bg-hover focus-visible:shadow-cc-Focus-Rings-Brand-default", className),
+                }, className),
                 value: value1,
                 onChange: function(e) {
                     setValue(e.target.value);
@@ -11437,7 +11437,7 @@ var RadioGroupItem = React30.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(RadioGroupPrimitive.Item, _object_spread_props(_object_spread({
         ref: ref,
-        className: cn("aspect-square h-5 w-5 rounded-full border-[1.5px] border-Colors-Border-Active text-transparent aria-checked:border-[6px] aria-checked:border-Colors-Utility-Lake-Blue-40 focus:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-30", className)
+        className: cn("aspect-square h-5 w-5 rounded-full border-[1.5px] border-Colors-Border-Active text-transparent aria-checked:border-[6px] aria-checked:border-Colors-Utility-Lake-Blue-40 focus:outline-none focus-visible-style disabled:cursor-not-allowed disabled:opacity-30", className)
     }, props), {
         children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(RadioGroupPrimitive.Indicator, {
             className: "flex items-center justify-center",
@@ -11989,7 +11989,7 @@ var Slider = React35.forwardRef(function(_param, ref) {
         "size"
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", {
-        className: "w-full p-3 flex justify-center items-center h-10 rounded-md	border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active shadow-background-default text-sm text-Colors-Text-Default hover:border-Colors-Border-Hover hover:bg-Colors-Foreground-Subtle aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Utility-Terracotta-5 aria-[invalid=true]:focus-visible:ring-error file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-30",
+        className: "w-full p-3 flex justify-center items-center h-10 rounded-md	border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active shadow-background-default text-sm text-Colors-Text-Default hover:border-Colors-Border-Hover hover:bg-Colors-Foreground-Subtle aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Utility-Terracotta-5 focus-visible-style file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler focus-visible-style disabled:cursor-not-allowed disabled:opacity-30",
         children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(SliderPrimitive.Root, _object_spread_props(_object_spread({
             ref: ref,
             className: cn("relative flex w-full touch-none select-none items-center", className)
@@ -12002,7 +12002,7 @@ var Slider = React35.forwardRef(function(_param, ref) {
                     })
                 }),
                 /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SliderPrimitive.Thumb, {
-                    className: cn("block rounded-full border-Colors-Utility-Lake-Blue-40 bg-Colors-Background-Normal-Primary-Default transition-colors focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 data-[disabled]:pointer-events-none data-[disabled]:opacity-30", size === "sm" ? "w-2 h-2 border-[1.5px]" : "w-5 h-5 border-[3px]")
+                    className: cn("block rounded-full border-Colors-Utility-Lake-Blue-40 bg-Colors-Background-Normal-Primary-Default transition-colors focus-visible-style data-[disabled]:pointer-events-none data-[disabled]:opacity-30", size === "sm" ? "w-2 h-2 border-[1.5px]" : "w-5 h-5 border-[3px]")
                 })
             ]
         }))
@@ -12027,7 +12027,7 @@ var SliderSingle = React35.forwardRef(function(_param, ref) {
         className: "flex w-full items-center space-x-1.5",
         children: [
             /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", {
-                className: cn("w-full p-3 flex justify-center items-center h-10 rounded-md border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active shadow-background-default text-sm text-Colors-Text-Default hover:border-Colors-Border-Hover hover:bg-Colors-Foreground-Subtle aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Utility-Terracotta-5 aria-[invalid=true]:focus-visible:ring-error file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-30", containerClassName),
+                className: cn("w-full p-3 flex justify-center items-center h-10 rounded-md border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active shadow-background-default text-sm text-Colors-Text-Default hover:border-Colors-Border-Hover hover:bg-Colors-Foreground-Subtle aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Utility-Terracotta-5 focus-visible-style file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler focus-visible-style disabled:cursor-not-allowed disabled:opacity-30", containerClassName),
                 children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(SliderPrimitive.Root, _object_spread_props(_object_spread({
                     ref: ref,
                     className: cn("relative flex w-full touch-none select-none items-center", className),
@@ -12052,7 +12052,7 @@ var SliderSingle = React35.forwardRef(function(_param, ref) {
                             })
                         }),
                         /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SliderPrimitive.Thumb, {
-                            className: cn("cursor-pointer block rounded-full border-Colors-Utility-Lake-Blue-40 bg-Colors-Background-Normal-Primary-Default transition-colors focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 data-[disabled]:pointer-events-none data-[disabled]:opacity-30", size === "sm" ? "w-2 h-2 border-[1.5px]" : "w-5 h-5 border-[3px]", thumbClassName)
+                            className: cn("cursor-pointer block rounded-full border-Colors-Utility-Lake-Blue-40 bg-Colors-Background-Normal-Primary-Default transition-colors focus-visible-style data-[disabled]:pointer-events-none data-[disabled]:opacity-30", size === "sm" ? "w-2 h-2 border-[1.5px]" : "w-5 h-5 border-[3px]", thumbClassName)
                         })
                     ]
                 }))
@@ -12135,7 +12135,7 @@ var switchVerticalSize = {
     lg: "h-10 w-6",
     xl: "h-12 w-7"
 };
-var switchRootVariants = (0, import_class_variance_authority16.cva)('peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-2 data-[state=unchecked]:focus-visible:bg-cc-Switch-bg-default disabled:cursor-not-allowed disabled:opacity-30 data-[state="checked"]:bg-cc-Switch-bg-on data-[state="unchecked"]:bg-cc-Switch-bg-default', {
+var switchRootVariants = (0, import_class_variance_authority16.cva)('peer inline-flex shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible-style disabled:cursor-not-allowed disabled:opacity-30 data-[state="checked"]:bg-cc-Switch-bg-on data-[state="unchecked"]:bg-cc-Switch-bg-default', {
     variants: {
         size: switchSize,
         vertical: {
@@ -12543,7 +12543,7 @@ var TabsContent = React37.forwardRef(function(_param, ref) {
     ]);
     return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TabsPrimitive.Content, _object_spread({
         ref: ref,
-        className: cn("mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-ring focus-visible:ring-offset-0", className)
+        className: cn("mt-2 ring-offset-background focus-visible:!outline-none focus-visible:ring-offset-0", className)
     }, props));
 });
 TabsContent.displayName = TabsPrimitive.Content.displayName;
@@ -12565,11 +12565,11 @@ var Textarea = React38.forwardRef(function(_param, ref) {
                 className: "relative",
                 children: [
                     /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("textarea", _object_spread({
-                        className: cn("w-full min-h-[123px] p-3 rounded-sm border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active ", "text-sm text-Colors-Text-Default placeholder:text-Colors-Text-Subtlest", "hover:border-Colors-Border-Hover bg-cc-Input-bg-default hover:bg-cc-Input-bg-hover disabled:bg-cc-Input-bg-disabled aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Background-Critical-Subtle", "aria-[invalid=true]:focus-visible:ring-error file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler", "disabled:cursor-not-allowed disabled:opacity-30", maxLength && ((value1 === null || value1 === void 0 ? void 0 : (_value_toString = value1.toString()) === null || _value_toString === void 0 ? void 0 : _value_toString.length) || 0) > maxLength || error ? "border-Colors-Border-Critical hover:bg-Colors-Background-Critical-Subtle focus-visible:ring-error" : "", className),
+                        className: cn("w-full min-h-[123px] p-3 rounded-sm border border-Colors-Border-Default bg-Colors-Background-Normal-Primary-Active ", "text-sm text-Colors-Text-Default placeholder:text-Colors-Text-Subtlest", "hover:border-Colors-Border-Hover bg-cc-Input-bg-default hover:bg-cc-Input-bg-hover disabled:bg-cc-Input-bg-disabled aria-[invalid=true]:border-Colors-Border-Critical aria-[invalid=true]:hover:bg-Colors-Background-Critical-Subtle", "focus-visible-style file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-Colors-Text-Subtler", "disabled:cursor-not-allowed disabled:opacity-30", className),
                         ref: ref,
                         maxLength: maxLength,
                         value: value1,
-                        "aria-invalid": error ? "true" : "false"
+                        "aria-invalid": maxLength && ((value1 === null || value1 === void 0 ? void 0 : (_value_toString = value1.toString()) === null || _value_toString === void 0 ? void 0 : _value_toString.length) || 0) > maxLength || error ? "true" : "false"
                     }, props)),
                     maxLength ? /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", {
                         className: cn("absolute text-right bottom-5 right-4 border-Colors-Border-Default", maxLengthClassName),
@@ -12600,7 +12600,7 @@ var TogglePrimitive = __toESM(require("@radix-ui/react-toggle"), 1);
 var import_class_variance_authority18 = require("class-variance-authority");
 var React39 = __toESM(require("react"), 1);
 var import_jsx_runtime53 = require("react/jsx-runtime");
-var toggleVariants = (0, import_class_variance_authority18.cva)("inline-flex items-center justify-center rounded-sm text-sm font-medium ring-offset-white text-Colors-Text-Subtlest hover:bg-slate-100 hover:text-slate-500 focus-visible:outline-none focus-visible:ring-slate-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-Colors-Background-Normal-Primary-Active data-[state=on]:text-Colors-Text-Brand-Default [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2 dark:ring-offset-slate-950 dark:hover:bg-slate-800 dark:hover:text-Colors-Text-Brand-Default dark:focus-visible:ring-slate-300 dark:data-[state=on]:bg-Colors-Background-Normal-Primary-Active dark:data-[state=on]:text-Colors-Text-Brand-Default", {
+var toggleVariants = (0, import_class_variance_authority18.cva)("inline-flex items-center justify-center rounded-sm text-sm font-medium ring-offset-white text-Colors-Text-Subtlest hover:bg-slate-100 hover:text-slate-500 focus-visible:outline-cc-Focus-Rings-Brand-default focus-visible:outline-none focus-visible:ring-slate-950 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-Colors-Background-Normal-Primary-Active data-[state=on]:text-Colors-Text-Brand-Default [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2 dark:ring-offset-slate-950 dark:hover:bg-slate-800 dark:hover:text-Colors-Text-Brand-Default dark:focus-visible:ring-slate-300 dark:data-[state=on]:bg-Colors-Background-Normal-Primary-Active dark:data-[state=on]:text-Colors-Text-Brand-Default", {
     variants: {
         variant: {
             default: "bg-transparent",
@@ -12685,7 +12685,7 @@ ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 // src/components/chips.tsx
 var import_class_variance_authority19 = require("class-variance-authority");
 var import_jsx_runtime55 = require("react/jsx-runtime");
-var chipsVariants = (0, import_class_variance_authority19.cva)('min-w-10 flex items-center justify-center text-Colors-Text-Subtle rounded-sm border px-1.5 text-sm cursor-pointer focus-visible:ring-cc-Focus-Rings-Brand-default focus-visible:ring-offset-1 data-[disabled="true"]:cursor-not-allowed font-medium', {
+var chipsVariants = (0, import_class_variance_authority19.cva)('min-w-10 flex items-center justify-center text-Colors-Text-Subtle rounded-sm border px-1.5 text-sm cursor-pointer focus-visible-style data-[disabled="true"]:cursor-not-allowed font-medium', {
     variants: {
         variant: {
             primary: 'border-cc-Chips-Primary-border-default bg-cc-Chips-Primary-bg-default hover:bg-cc-Chips-Primary-bg-hover data-[selected="true"]:text-Colors-Text-Bolder data-[disabled="true"]:data-[selected="true"]:text-Colors-Text-Bolder data-[selected="true"]:bg-cc-Chips-Primary-bg-select data-[disabled="true"]:text-Colors-Text-Disabled data-[disabled="true"]:bg-cc-Chips-Primary-bg-disabled data-[disabled="true"]:data-[selected="true"]:bg-cc-Chips-Primary-bg-select-disabled',