@doscientos/ui 0.1.16 → 0.1.18

package/dist/index.cjs

@@ -202,6 +202,7 @@ __export(index_exports, {
   ToolbarSpacer: () => ToolbarSpacer,
   Tooltip: () => Tooltip,
   TooltipTrigger: () => TooltipTrigger,
+  actionRipple: () => actionRipple,
   alertVariants: () => alertVariants,
   badgeVariants: () => badgeVariants,
   buttonGroupVariants: () => buttonGroupVariants,
@@ -317,6 +318,12 @@ function useFormDirty() {
   return { formRef, isDirty, markDirty: () => setIsDirty(true), reset };
 }
 
+// src/lib/action-ripple.ts
+var import_class_variance_authority = require("class-variance-authority");
+var actionRipple = (0, import_class_variance_authority.cva)(
+  "relative isolate overflow-hidden after:pointer-events-none after:absolute after:top-1/2 after:left-1/2 after:aspect-square after:w-full after:-translate-x-1/2 after:-translate-y-1/2 after:scale-0 after:rounded-full after:bg-current after:opacity-0 after:content-[''] after:transition-[scale,opacity] after:duration-300 after:ease-out active:after:scale-150 active:after:opacity-10 data-pressed:after:scale-150 data-pressed:after:opacity-10 motion-reduce:after:hidden"
+);
+
 // src/lib/cn.ts
 var import_clsx = require("clsx");
 var import_tailwind_merge = require("tailwind-merge");
@@ -449,9 +456,9 @@ function AccordionContent({
 }
 
 // src/ui/alert/alert.tsx
-var import_class_variance_authority = require("class-variance-authority");
+var import_class_variance_authority2 = require("class-variance-authority");
 var import_jsx_runtime2 = require("react/jsx-runtime");
-var alertVariants = (0, import_class_variance_authority.cva)(
+var alertVariants = (0, import_class_variance_authority2.cva)(
   "group/alert relative grid w-full gap-0.5 rounded-lg border border-border px-2.5 py-2 text-left text-sm has-data-[slot=alert-action]:relative has-data-[slot=alert-action]:pr-18 has-[>svg]:grid-cols-[auto_1fr] has-[>svg]:gap-x-2 *:[svg]:row-span-2 *:[svg]:translate-y-0.5 *:[svg]:text-current *:[svg:not([class*='size-'])]:size-4",
   {
     variants: {
@@ -624,10 +631,10 @@ function AvatarGroupCount({ className, ...props }) {
 }
 
 // src/ui/badge/badge.tsx
-var import_class_variance_authority2 = require("class-variance-authority");
+var import_class_variance_authority3 = require("class-variance-authority");
 var import_react_aria_components2 = require("react-aria-components");
 var import_jsx_runtime5 = require("react/jsx-runtime");
-var badgeVariants = (0, import_class_variance_authority2.cva)(
+var badgeVariants = (0, import_class_variance_authority3.cva)(
   "inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border border-transparent px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 [&>svg]:pointer-events-none [&>svg]:size-3",
   {
     variants: {
@@ -690,78 +697,15 @@ function BreadcrumbSeparator({ children = "/", className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { "data-slot": "breadcrumb-separator", "aria-hidden": "true", className: cn("text-muted-foreground/60", className), ...props, children });
 }
 
-// src/ui/button/button.tsx
-var import_class_variance_authority3 = require("class-variance-authority");
-var import_react_aria_components4 = require("react-aria-components");
-var import_jsx_runtime7 = require("react/jsx-runtime");
-var buttonVariants = (0, import_class_variance_authority3.cva)(
-  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-  {
-    variants: {
-      variant: {
-        default: "bg-primary text-primary-foreground hover:bg-primary/80",
-        outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
-        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
-        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
-        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
-        link: "text-primary underline-offset-4 hover:underline"
-      },
-      size: {
-        default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
-        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
-        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
-        icon: "size-8",
-        "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
-        "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
-        "icon-lg": "size-9"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-function Button({ className, variant = "default", size = "default", ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-    import_react_aria_components4.Button,
-    {
-      "data-slot": "button",
-      "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
-function LinkButton({
-  className,
-  variant = "default",
-  size = "default",
-  ...props
-}) {
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
-    import_react_aria_components4.Link,
-    {
-      "data-slot": "button",
-      "data-variant": variant,
-      "data-size": size,
-      className: cn(buttonVariants({ variant, size, className })),
-      ...props
-    }
-  );
-}
-
 // src/ui/button-group/button-group.tsx
 var import_class_variance_authority4 = require("class-variance-authority");
 
 // src/ui/separator/separator.tsx
-var import_react_aria_components5 = require("react-aria-components");
-var import_jsx_runtime8 = require("react/jsx-runtime");
+var import_react_aria_components4 = require("react-aria-components");
+var import_jsx_runtime7 = require("react/jsx-runtime");
 function Separator({ className, orientation = "horizontal", ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
-    import_react_aria_components5.Separator,
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+    import_react_aria_components4.Separator,
     {
       "data-slot": "separator",
       orientation,
@@ -775,7 +719,7 @@ function Separator({ className, orientation = "horizontal", ...props }) {
 }
 
 // src/ui/button-group/button-group.tsx
-var import_jsx_runtime9 = (
+var import_jsx_runtime8 = (
   // biome-ignore lint/a11y/useSemanticElements: fieldset would impose form semantics on a generic action group.
   require("react/jsx-runtime")
 );
@@ -798,7 +742,7 @@ function ButtonGroup({
   orientation,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "div",
     {
       role: "group",
@@ -825,7 +769,7 @@ function ButtonGroupText({
     };
     return render(renderProps);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     "div",
     {
       "data-slot": "button-group-text",
@@ -842,7 +786,7 @@ function ButtonGroupSeparator({
   orientation = "vertical",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
     Separator,
     {
       "data-slot": "button-group-separator",
@@ -856,6 +800,72 @@ function ButtonGroupSeparator({
   );
 }
 
+// src/ui/button/button.tsx
+var import_class_variance_authority5 = require("class-variance-authority");
+var import_react_aria_components5 = require("react-aria-components");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var buttonVariants = (0, import_class_variance_authority5.cva)(
+  cn(
+    "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+    actionRipple()
+  ),
+  {
+    variants: {
+      variant: {
+        default: "bg-primary text-primary-foreground hover:bg-primary/80",
+        outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
+        secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80 aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
+        ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
+        destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
+        link: "text-primary underline-offset-4 hover:underline after:hidden"
+      },
+      size: {
+        default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
+        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
+        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
+        icon: "size-8",
+        "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
+        "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
+        "icon-lg": "size-9"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function Button({ className, variant = "default", size = "default", ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    import_react_aria_components5.Button,
+    {
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+function LinkButton({
+  className,
+  variant = "default",
+  size = "default",
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    import_react_aria_components5.Link,
+    {
+      "data-slot": "button",
+      "data-variant": variant,
+      "data-size": size,
+      className: cn(buttonVariants({ variant, size, className })),
+      ...props
+    }
+  );
+}
+
 // src/ui/card/card.tsx
 var import_jsx_runtime10 = require("react/jsx-runtime");
 function Card({ className, size = "default", ...props }) {
@@ -1177,7 +1187,7 @@ function DrawerDescription({ className, ...props }) {
 
 // src/ui/dropdown-menu/dropdown-menu.tsx
 var React2 = require("react");
-var import_class_variance_authority5 = require("class-variance-authority");
+var import_class_variance_authority6 = require("class-variance-authority");
 var import_lucide_react4 = require("lucide-react");
 var import_react_aria_components11 = require("react-aria-components");
 var import_jsx_runtime17 = require("react/jsx-runtime");
@@ -1237,7 +1247,7 @@ function DropdownMenuLabel({
     }
   );
 }
-var dropdownMenuItemVariants = (0, import_class_variance_authority5.cva)(
+var dropdownMenuItemVariants = (0, import_class_variance_authority6.cva)(
   "group/dropdown-menu-item relative flex cursor-default items-center outline-hidden select-none data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
@@ -1364,7 +1374,7 @@ function DropdownMenuShortcut({
 }
 
 // src/ui/empty-state/empty-state.tsx
-var import_class_variance_authority6 = require("class-variance-authority");
+var import_class_variance_authority7 = require("class-variance-authority");
 var import_jsx_runtime18 = require("react/jsx-runtime");
 function EmptyState({ className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
@@ -1389,7 +1399,7 @@ function EmptyStateHeader({ className, ...props }) {
     }
   );
 }
-var emptyStateMediaVariants = (0, import_class_variance_authority6.cva)(
+var emptyStateMediaVariants = (0, import_class_variance_authority7.cva)(
   "mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
   {
     variants: {
@@ -1454,7 +1464,7 @@ function EmptyStateContent({ className, ...props }) {
 }
 
 // src/ui/field/field.tsx
-var import_class_variance_authority7 = require("class-variance-authority");
+var import_class_variance_authority8 = require("class-variance-authority");
 
 // src/ui/label/label.tsx
 var import_react6 = require("react");
@@ -1500,7 +1510,7 @@ function FieldGroup({ className, ...props }) {
     }
   );
 }
-var fieldVariants = (0, import_class_variance_authority7.cva)(
+var fieldVariants = (0, import_class_variance_authority8.cva)(
   "group/field flex w-full gap-2 data-[invalid=true]:text-destructive",
   {
     variants: {
@@ -1780,6 +1790,9 @@ function IconButton({
   ] });
 }
 
+// src/ui/input-group/input-group.tsx
+var import_class_variance_authority9 = require("class-variance-authority");
+
 // src/ui/input/input.tsx
 var import_react8 = require("react");
 var import_react_aria_components15 = require("react-aria-components");
@@ -1789,9 +1802,6 @@ var InputImpl = (0, import_react8.forwardRef)(function Input2({ className, type,
 });
 var Input3 = InputImpl;
 
-// src/ui/input-group/input-group.tsx
-var import_class_variance_authority8 = require("class-variance-authority");
-
 // src/ui/textarea/textarea.tsx
 var import_react9 = require("react");
 var import_react_aria_components16 = require("react-aria-components");
@@ -1820,7 +1830,7 @@ function InputGroup({ className, ...props }) {
     }
   );
 }
-var inputGroupAddonVariants = (0, import_class_variance_authority8.cva)(
+var inputGroupAddonVariants = (0, import_class_variance_authority9.cva)(
   "flex cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none [&_svg:not([class*='size-'])]:size-4",
   {
     variants: {
@@ -1859,7 +1869,7 @@ function InputGroupAddon({
     )
   );
 }
-var inputGroupButtonVariants = (0, import_class_variance_authority8.cva)("shrink-0 shadow-none", {
+var inputGroupButtonVariants = (0, import_class_variance_authority9.cva)("shrink-0 shadow-none", {
   variants: {
     size: { xs: "h-6 px-1.5 text-xs", sm: "h-7 px-2", "icon-xs": "size-6", "icon-sm": "size-7" }
   },
@@ -2597,18 +2607,27 @@ var import_jsx_runtime42 = require("react/jsx-runtime");
 var switchSizes = {
   sm: {
     control: "h-4 w-[1.875rem] p-0.5",
-    thumb: "h-3 w-4",
-    offset: "0.625rem"
+    thumb: "h-3",
+    idleWidth: "0.75rem",
+    activeWidth: "1rem",
+    selectedOffset: "0.875rem",
+    activeSelectedOffset: "0.625rem"
   },
   md: {
     control: "h-5 w-9 p-0.5",
-    thumb: "h-4 w-5",
-    offset: "0.75rem"
+    thumb: "h-4",
+    idleWidth: "1rem",
+    activeWidth: "1.25rem",
+    selectedOffset: "1rem",
+    activeSelectedOffset: "0.75rem"
   },
   lg: {
     control: "h-6 w-11 p-0.5",
-    thumb: "h-5 w-6",
-    offset: "1rem"
+    thumb: "h-5",
+    idleWidth: "1.25rem",
+    activeWidth: "1.5rem",
+    selectedOffset: "1.25rem",
+    activeSelectedOffset: "1rem"
   }
 };
 function Switch({
@@ -2654,43 +2673,50 @@ function Switch({
         className
       ),
       ...props,
-      children: (state) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-          "span",
-          {
-            "aria-hidden": "true",
-            "data-slot": "switch-control",
-            className: cn(
-              "relative inline-flex shrink-0 items-center overflow-hidden rounded-full border border-border bg-input shadow-inner",
-              "transition-[background-color,border-color,box-shadow] duration-200 ease-out motion-reduce:transition-none",
-              "group-data-hovered/switch:bg-muted-foreground/25",
-              "group-data-selected/switch:border-primary group-data-selected/switch:bg-primary",
-              "group-data-selected/switch:group-data-hovered/switch:bg-primary/85",
-              "group-data-focus-visible/switch:ring-3 group-data-focus-visible/switch:ring-ring/50",
-              styles.control
-            ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
-              "span",
-              {
-                "data-slot": "switch-thumb",
-                style: { transform: state.isSelected ? `translate3d(${styles.offset}, 0, 0)` : "translate3d(0, 0, 0)" },
-                className: cn(
-                  "grid shrink-0 place-items-center rounded-full border border-border/60 bg-background text-[0.625rem] text-muted-foreground shadow-sm",
-                  "will-change-transform transition-[transform,background-color,color,border-color] duration-[240ms] ease-[cubic-bezier(0.2,0.8,0.2,1)] motion-reduce:transition-none",
-                  "group-data-selected/switch:border-primary-foreground/20",
-                  "group-data-selected/switch:bg-primary-foreground group-data-selected/switch:text-primary",
-                  styles.thumb
-                ),
-                children: state.isSelected ? selectedIcon ?? icon : icon
-              }
-            )
-          }
-        ),
-        children || description ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "grid gap-0.5 leading-tight", children: [
-          children ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "data-slot": "switch-label", className: "font-medium", children: typeof children === "function" ? children(state) : children }) : null,
-          description ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "data-slot": "switch-description", className: "text-xs font-normal text-muted-foreground", children: description }) : null
-        ] }) : null
-      ] })
+      children: (state) => {
+        const isThumbActive = state.isHovered || state.isPressed;
+        const thumbOffset = state.isSelected ? isThumbActive ? styles.activeSelectedOffset : styles.selectedOffset : "0";
+        return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+            "span",
+            {
+              "aria-hidden": "true",
+              "data-slot": "switch-control",
+              className: cn(
+                "relative inline-flex shrink-0 items-center overflow-hidden rounded-full border border-border bg-input shadow-inner",
+                "transition-[background-color,border-color,box-shadow] duration-200 ease-out motion-reduce:transition-none",
+                "group-data-hovered/switch:bg-muted-foreground/25",
+                "group-data-selected/switch:border-primary group-data-selected/switch:bg-primary",
+                "group-data-selected/switch:group-data-hovered/switch:bg-primary/85",
+                "group-data-focus-visible/switch:ring-3 group-data-focus-visible/switch:ring-ring/50",
+                styles.control
+              ),
+              children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
+                "span",
+                {
+                  "data-slot": "switch-thumb",
+                  style: {
+                    transform: `translate3d(${thumbOffset}, 0, 0)`,
+                    width: isThumbActive ? styles.activeWidth : styles.idleWidth
+                  },
+                  className: cn(
+                    "grid shrink-0 place-items-center rounded-full border border-border/60 bg-background text-[0.625rem] text-muted-foreground shadow-sm",
+                    "will-change-[transform,width] transition-[transform,width,background-color,color,border-color] duration-[240ms] ease-[cubic-bezier(0.2,0.8,0.2,1)] motion-reduce:transition-none",
+                    "group-data-selected/switch:border-primary-foreground/20",
+                    "group-data-selected/switch:bg-primary-foreground group-data-selected/switch:text-primary",
+                    styles.thumb
+                  ),
+                  children: state.isSelected ? selectedIcon ?? icon : icon
+                }
+              )
+            }
+          ),
+          children || description ? /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("span", { className: "grid gap-0.5 leading-tight", children: [
+            children ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "data-slot": "switch-label", className: "font-medium", children: typeof children === "function" ? children(state) : children }) : null,
+            description ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { "data-slot": "switch-description", className: "text-xs font-normal text-muted-foreground", children: description }) : null
+          ] }) : null
+        ] });
+      }
     }
   );
 }
@@ -2844,7 +2870,7 @@ function ToastProvider({ children }) {
   ] });
 }
 function Toaster({ position }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_sileo.Toaster, { position });
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_sileo.Toaster, { position, options: { fill: "var(--ui-secondary)" } });
 }
 function ToastViewport({ position, visiblePosition, className }) {
   void className;
@@ -3047,6 +3073,7 @@ function ToolbarSpacer({ className, ...props }) {
   ToolbarSpacer,
   Tooltip,
   TooltipTrigger,
+  actionRipple,
   alertVariants,
   badgeVariants,
   buttonGroupVariants,