@doscientos/ui 0.1.17 → 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" }
   },
@@ -2860,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;
@@ -3063,6 +3073,7 @@ function ToolbarSpacer({ className, ...props }) {
   ToolbarSpacer,
   Tooltip,
   TooltipTrigger,
+  actionRipple,
   alertVariants,
   badgeVariants,
   buttonGroupVariants,