@sth87/shadcn-design-system 0.0.36 → 0.1.1

package/dist/esm/packages/ui/src/components/badge.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.js","sources":["../../../../../../../../packages/ui/src/components/badge.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst colorVariants = {\n  primary: {\n    solid: \"bg-primary text-primary-foreground\",\n    light: \"bg-primary/30 text-primary dark:bg-primary/30\",\n    outline: \"border-primary text-primary bg-transparent\",\n  },\n  secondary: {\n    solid: \"bg-secondary text-secondary-foreground\",\n    light: \"bg-secondary/30 text-secondary dark:bg-secondary/30\",\n    outline: \"border-secondary text-secondary bg-transparent\",\n  },\n  accent: {\n    solid: \"bg-accent text-accent-foreground\",\n    light: \"bg-accent/30 text-accent dark:bg-accent/30\",\n    outline: \"border-accent text-accent bg-transparent\",\n  },\n  destructive: {\n    solid: \"bg-destructive text-destructive-foreground dark:bg-destructive/60\",\n    light: \"bg-destructive/30 text-destructive dark:bg-destructive/30\",\n    outline: \"border-destructive text-destructive bg-transparent\",\n  },\n  muted: {\n    solid: \"bg-muted text-muted-foreground\",\n    light: \"bg-muted/30 text-muted-foreground dark:bg-muted/30\",\n    outline: \"border-input text-muted-foreground bg-transparent\",\n  },\n  success: {\n    solid: \"bg-success text-success-foreground dark:bg-success/60\",\n    light: \"bg-success/30 text-success dark:bg-success/30\",\n    outline: \"border-success text-success bg-transparent\",\n  },\n  error: {\n    solid: \"bg-error text-error-foreground dark:bg-error/60\",\n    light: \"bg-error/30 text-error dark:bg-error/30\",\n    outline: \"border-error text-error bg-transparent\",\n  },\n  warning: {\n    solid: \"bg-warning text-warning-foreground dark:bg-warning/60\",\n    light: \"bg-warning/30 text-warning dark:bg-warning/30\",\n    outline: \"border-warning text-warning bg-transparent\",\n  },\n};\n\nconst generateCompoundVariants = () => {\n  const variants: Array<{\n    variant: keyof typeof colorVariants.primary;\n    color: keyof typeof colorVariants;\n    className: string;\n  }> = [];\n\n  (Object.keys(colorVariants) as Array<keyof typeof colorVariants>).forEach(\n    (color) => {\n      (\n        Object.keys(colorVariants[color]) as Array<\n          keyof typeof colorVariants.primary\n        >\n      ).forEach((variant) => {\n        variants.push({\n          variant,\n          color,\n          className: colorVariants[color][variant],\n        });\n      });\n    }\n  );\n\n  return variants;\n};\n\nconst badgeVariants = cva(\n  \"inline-flex items-center justify-center rounded-full w-fit whitespace-nowrap shrink-0 [&>svg]:pointer-events-none transition-[color,box-shadow] font-medium\",\n  {\n    variants: {\n      variant: {\n        solid: \"\",\n        light: \"\",\n        outline: \"border\",\n      },\n      size: {\n        dot: \"size-1.5 text-[0px] leading-0 [&>svg]:size-2\",\n        xs: \"h-4 min-w-4 text-[8px] leading-0 px-1 [&>svg]:size-2\",\n        sm: \"h-5 min-w-5 text-[10px] leading-0 px-1 [&>svg]:size-3\",\n        normal: \"h-6 min-w-6 text-[10px] leading-0 px-1.25 [&>svg]:size-3.5\",\n        lg: \"h-7 min-w-7 text-xs leading-0 px-1.25 [&>svg]:size-4\",\n        xl: \"h-8 min-w-8 text-sm leading-0 px-1.5 [&>svg]:size-5\",\n      },\n      color: {\n        primary: \"\",\n        secondary: \"\",\n        accent: \"\",\n        destructive: \"\",\n        muted: \"\",\n        success: \"\",\n        error: \"\",\n        warning: \"\",\n        custom: \"\",\n      },\n      border: {\n        true: \"\",\n        false: \"\",\n      },\n    },\n    compoundVariants: [\n      ...generateCompoundVariants(),\n      {\n        border: true,\n        size: \"dot\",\n        className: \"border border-background\",\n      },\n      {\n        border: true,\n        size: \"xs\",\n        className: \"border border-background\",\n      },\n      {\n        border: true,\n        size: \"sm\",\n        className: \"border border-background\",\n      },\n      {\n        border: true,\n        size: \"normal\",\n        className: \"border border-background\",\n      },\n      {\n        border: true,\n        size: \"lg\",\n        className: \"border-[2px] border-background\",\n      },\n      {\n        border: true,\n        size: \"xl\",\n        className: \"border-[2px] border-background\",\n      },\n    ],\n    defaultVariants: {\n      variant: \"solid\",\n      size: \"normal\",\n      color: \"primary\",\n      border: false,\n    },\n  }\n);\n\ntype BadgeProps = React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & {\n    asChild?: boolean;\n  };\n\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n  (\n    { className, variant, size, color, border, asChild = false, ...props },\n    ref\n  ) => {\n    const Comp = asChild ? Slot : \"span\";\n    return (\n      <Comp\n        ref={ref}\n        data-slot=\"badge\"\n        className={cn(\n          badgeVariants({ variant, size, color, border }),\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nBadge.displayName = \"Badge\";\n\nexport { Badge, badgeVariants, type BadgeProps };\n"],"names":["colorVariants","generateCompoundVariants","variants","color","variant","badgeVariants","cva","Badge","React","className","size","border","asChild","props","ref","jsx","Slot","cn"],"mappings":"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"}
+{"version":3,"file":"badge.js","sources":["../../../../../../../../packages/ui/src/components/badge.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"../lib/utils\";\n\nconst colorVariants = {\n  primary: {\n    solid: \"ds:bg-primary ds:text-primary-foreground\",\n    light: \"ds:bg-primary/30 ds:text-primary ds:dark:bg-primary/30\",\n    outline: \"ds:border-primary ds:text-primary ds:bg-transparent\",\n  },\n  secondary: {\n    solid: \"ds:bg-secondary ds:text-secondary-foreground\",\n    light: \"ds:bg-secondary/30 ds:text-secondary ds:dark:bg-secondary/30\",\n    outline: \"ds:border-secondary ds:text-secondary ds:bg-transparent\",\n  },\n  accent: {\n    solid: \"ds:bg-accent ds:text-accent-foreground\",\n    light: \"ds:bg-accent/30 ds:text-accent ds:dark:bg-accent/30\",\n    outline: \"ds:border-accent ds:text-accent ds:bg-transparent\",\n  },\n  destructive: {\n    solid: \"ds:bg-destructive ds:text-destructive-foreground ds:dark:bg-destructive/60\",\n    light: \"ds:bg-destructive/30 ds:text-destructive ds:dark:bg-destructive/30\",\n    outline: \"ds:border-destructive ds:text-destructive ds:bg-transparent\",\n  },\n  muted: {\n    solid: \"ds:bg-muted ds:text-muted-foreground\",\n    light: \"ds:bg-muted/30 ds:text-muted-foreground ds:dark:bg-muted/30\",\n    outline: \"ds:border-input ds:text-muted-foreground ds:bg-transparent\",\n  },\n  success: {\n    solid: \"ds:bg-success ds:text-success-foreground ds:dark:bg-success/60\",\n    light: \"ds:bg-success/30 ds:text-success ds:dark:bg-success/30\",\n    outline: \"ds:border-success ds:text-success ds:bg-transparent\",\n  },\n  error: {\n    solid: \"ds:bg-error ds:text-error-foreground ds:dark:bg-error/60\",\n    light: \"ds:bg-error/30 ds:text-error ds:dark:bg-error/30\",\n    outline: \"ds:border-error ds:text-error ds:bg-transparent\",\n  },\n  warning: {\n    solid: \"ds:bg-warning ds:text-warning-foreground ds:dark:bg-warning/60\",\n    light: \"ds:bg-warning/30 ds:text-warning ds:dark:bg-warning/30\",\n    outline: \"ds:border-warning ds:text-warning ds:bg-transparent\",\n  },\n};\n\nconst generateCompoundVariants = () => {\n  const variants: Array<{\n    variant: keyof typeof colorVariants.primary;\n    color: keyof typeof colorVariants;\n    className: string;\n  }> = [];\n\n  (Object.keys(colorVariants) as Array<keyof typeof colorVariants>).forEach(\n    (color) => {\n      (\n        Object.keys(colorVariants[color]) as Array<\n          keyof typeof colorVariants.primary\n        >\n      ).forEach((variant) => {\n        variants.push({\n          variant,\n          color,\n          className: colorVariants[color][variant],\n        });\n      });\n    }\n  );\n\n  return variants;\n};\n\nconst badgeVariants = cva(\n  \"ds:inline-flex ds:items-center ds:justify-center ds:rounded-full ds:w-fit ds:whitespace-nowrap ds:shrink-0 ds:[&>svg]:pointer-events-none ds:transition-[color,box-shadow] ds:font-medium\",\n  {\n    variants: {\n      variant: {\n        solid: \"\",\n        light: \"\",\n        outline: \"ds:border\",\n      },\n      size: {\n        dot: \"ds:size-1.5 ds:text-[0px] ds:leading-0 ds:[&>svg]:size-2\",\n        xs: \"ds:h-4 ds:min-w-4 ds:text-[8px] ds:leading-0 ds:px-1 ds:[&>svg]:size-2\",\n        sm: \"ds:h-5 ds:min-w-5 ds:text-[10px] ds:leading-0 ds:px-1 ds:[&>svg]:size-3\",\n        normal: \"ds:h-6 ds:min-w-6 ds:text-[10px] ds:leading-0 ds:px-1.25 ds:[&>svg]:size-3.5\",\n        lg: \"ds:h-7 ds:min-w-7 ds:text-xs ds:leading-0 ds:px-1.25 ds:[&>svg]:size-4\",\n        xl: \"ds:h-8 ds:min-w-8 ds:text-sm ds:leading-0 ds:px-1.5 ds:[&>svg]:size-5\",\n      },\n      color: {\n        primary: \"\",\n        secondary: \"\",\n        accent: \"\",\n        destructive: \"\",\n        muted: \"\",\n        success: \"\",\n        error: \"\",\n        warning: \"\",\n        custom: \"\",\n      },\n      border: {\n        true: \"\",\n        false: \"\",\n      },\n    },\n    compoundVariants: [\n      ...generateCompoundVariants(),\n      {\n        border: true,\n        size: \"dot\",\n        className: \"ds:border ds:border-background\",\n      },\n      {\n        border: true,\n        size: \"xs\",\n        className: \"ds:border ds:border-background\",\n      },\n      {\n        border: true,\n        size: \"sm\",\n        className: \"ds:border ds:border-background\",\n      },\n      {\n        border: true,\n        size: \"normal\",\n        className: \"ds:border ds:border-background\",\n      },\n      {\n        border: true,\n        size: \"lg\",\n        className: \"ds:border-[2px] ds:border-background\",\n      },\n      {\n        border: true,\n        size: \"xl\",\n        className: \"ds:border-[2px] ds:border-background\",\n      },\n    ],\n    defaultVariants: {\n      variant: \"solid\",\n      size: \"normal\",\n      color: \"primary\",\n      border: false,\n    },\n  }\n);\n\ntype BadgeProps = React.ComponentProps<\"span\"> &\n  VariantProps<typeof badgeVariants> & {\n    asChild?: boolean;\n  };\n\nconst Badge = React.forwardRef<HTMLSpanElement, BadgeProps>(\n  (\n    { className, variant, size, color, border, asChild = false, ...props },\n    ref\n  ) => {\n    const Comp = asChild ? Slot : \"span\";\n    return (\n      <Comp\n        ref={ref}\n        data-slot=\"badge\"\n        className={cn(\n          badgeVariants({ variant, size, color, border }),\n          className\n        )}\n        {...props}\n      />\n    );\n  }\n);\n\nBadge.displayName = \"Badge\";\n\nexport { Badge, badgeVariants, type BadgeProps };\n"],"names":["colorVariants","generateCompoundVariants","variants","color","variant","badgeVariants","cva","Badge","React","className","size","border","asChild","props","ref","jsx","Slot","cn"],"mappings":"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"}

package/dist/esm/packages/ui/src/components/breadcrumb.js

@@ -1,7 +1,7 @@
-import { jsx as a, jsxs as o } from "react/jsx-runtime";
-import { Slot as s } from "@radix-ui/react-slot";
-import { ChevronRight as i, MoreHorizontal as l } from "lucide-react";
-import { cn as t } from "../lib/utils.js";
+import { jsx as a, jsxs as d } from "react/jsx-runtime";
+import { Slot as n } from "@radix-ui/react-slot";
+import { ChevronRight as o, MoreHorizontal as i } from "lucide-react";
+import { cn as s } from "../lib/utils.js";
 function p({ ...r }) {
   return /* @__PURE__ */ a("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...r });
 }
@@ -10,8 +10,8 @@ function f({ className: r, ...e }) {
     "ol",
     {
       "data-slot": "breadcrumb-list",
-      className: t(
-        "text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5",
+      className: s(
+        "ds:text-muted-foreground ds:flex ds:flex-wrap ds:items-center ds:gap-1.5 ds:text-sm ds:break-words ds:sm:gap-2.5",
         r
       ),
       ...e
@@ -23,7 +23,7 @@ function g({ className: r, ...e }) {
     "li",
     {
       "data-slot": "breadcrumb-item",
-      className: t("inline-flex items-center gap-1.5", r),
+      className: s("ds:inline-flex ds:items-center ds:gap-1.5", r),
       ...e
     }
   );
@@ -31,14 +31,14 @@ function g({ className: r, ...e }) {
 function x({
   asChild: r,
   className: e,
-  ...n
+  ...t
 }) {
   return /* @__PURE__ */ a(
-    r ? s : "a",
+    r ? n : "a",
     {
       "data-slot": "breadcrumb-link",
-      className: t("hover:text-foreground transition-colors", e),
-      ...n
+      className: s("ds:hover:text-foreground ds:transition-colors", e),
+      ...t
     }
   );
 }
@@ -50,7 +50,7 @@ function h({ className: r, ...e }) {
       role: "link",
       "aria-disabled": "true",
       "aria-current": "page",
-      className: t("text-foreground font-normal", r),
+      className: s("ds:text-foreground ds:font-normal", r),
       ...e
     }
   );
@@ -58,7 +58,7 @@ function h({ className: r, ...e }) {
 function N({
   children: r,
   className: e,
-  ...n
+  ...t
 }) {
   return /* @__PURE__ */ a(
     "li",
@@ -66,9 +66,9 @@ function N({
       "data-slot": "breadcrumb-separator",
       role: "presentation",
       "aria-hidden": "true",
-      className: t("[&>svg]:size-3.5", e),
-      ...n,
-      children: r ?? /* @__PURE__ */ a(i, {})
+      className: s("ds:[&>svg]:size-3.5", e),
+      ...t,
+      children: r ?? /* @__PURE__ */ a(o, {})
     }
   );
 }
@@ -76,17 +76,17 @@ function B({
   className: r,
   ...e
 }) {
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ d(
     "span",
     {
       "data-slot": "breadcrumb-ellipsis",
       role: "presentation",
       "aria-hidden": "true",
-      className: t("flex size-9 items-center justify-center", r),
+      className: s("ds:flex ds:size-9 ds:items-center ds:justify-center", r),
       ...e,
       children: [
-        /* @__PURE__ */ a(l, { className: "size-4" }),
-        /* @__PURE__ */ a("span", { className: "sr-only", children: "More" })
+        /* @__PURE__ */ a(i, { className: "ds:size-4" }),
+        /* @__PURE__ */ a("span", { className: "ds:sr-only", children: "More" })
       ]
     }
   );

package/dist/esm/packages/ui/src/components/breadcrumb.js.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb.js","sources":["../../../../../../../../packages/ui/src/components/breadcrumb.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { ChevronRight, MoreHorizontal } from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nfunction Breadcrumb({ ...props }: React.ComponentProps<\"nav\">) {\n  return <nav aria-label=\"breadcrumb\" data-slot=\"breadcrumb\" {...props} />;\n}\n\nfunction BreadcrumbList({ className, ...props }: React.ComponentProps<\"ol\">) {\n  return (\n    <ol\n      data-slot=\"breadcrumb-list\"\n      className={cn(\n        \"text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-item\"\n      className={cn(\"inline-flex items-center gap-1.5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbLink({\n  asChild,\n  className,\n  ...props\n}: React.ComponentProps<\"a\"> & {\n  asChild?: boolean;\n}) {\n  const Comp = asChild ? Slot : \"a\";\n\n  return (\n    <Comp\n      data-slot=\"breadcrumb-link\"\n      className={cn(\"hover:text-foreground transition-colors\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbPage({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-page\"\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn(\"text-foreground font-normal\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-separator\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"[&>svg]:size-3.5\", className)}\n      {...props}\n    >\n      {children ?? <ChevronRight />}\n    </li>\n  );\n}\n\nfunction BreadcrumbEllipsis({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-ellipsis\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"flex size-9 items-center justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontal className=\"size-4\" />\n      <span className=\"sr-only\">More</span>\n    </span>\n  );\n}\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n};\n"],"names":["Breadcrumb","props","BreadcrumbList","className","jsx","cn","BreadcrumbItem","BreadcrumbLink","asChild","Slot","BreadcrumbPage","BreadcrumbSeparator","children","ChevronRight","BreadcrumbEllipsis","jsxs","MoreHorizontal"],"mappings":";;;;AAMA,SAASA,EAAW,EAAE,GAAGC,KAAsC;AAC7D,2BAAQ,OAAA,EAAI,cAAW,cAAa,aAAU,cAAc,GAAGA,GAAO;AACxE;AAEA,SAASC,EAAe,EAAE,WAAAC,GAAW,GAAGF,KAAqC;AAC3E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAe,EAAE,WAAAH,GAAW,GAAGF,KAAqC;AAC3E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,oCAAoCF,CAAS;AAAA,MAC1D,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASM,EAAe;AAAA,EACtB,SAAAC;AAAA,EACA,WAAAL;AAAA,EACA,GAAGF;AACL,GAEG;AAGD,SACE,gBAAAG;AAAA,IAHWI,IAAUC,IAAO;AAAA,IAG3B;AAAA,MACC,aAAU;AAAA,MACV,WAAWJ,EAAG,2CAA2CF,CAAS;AAAA,MACjE,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASS,EAAe,EAAE,WAAAP,GAAW,GAAGF,KAAuC;AAC7E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,iBAAc;AAAA,MACd,gBAAa;AAAA,MACb,WAAWC,EAAG,+BAA+BF,CAAS;AAAA,MACrD,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASU,EAAoB;AAAA,EAC3B,UAAAC;AAAA,EACA,WAAAT;AAAA,EACA,GAAGF;AACL,GAA+B;AAC7B,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,WAAWC,EAAG,oBAAoBF,CAAS;AAAA,MAC1C,GAAGF;AAAA,MAEH,UAAAW,uBAAaC,GAAA,CAAA,CAAa;AAAA,IAAA;AAAA,EAAA;AAGjC;AAEA,SAASC,EAAmB;AAAA,EAC1B,WAAAX;AAAA,EACA,GAAGF;AACL,GAAiC;AAC/B,SACE,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,WAAWV,EAAG,2CAA2CF,CAAS;AAAA,MACjE,GAAGF;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAACY,GAAA,EAAe,WAAU,SAAA,CAAS;AAAA,QACnC,gBAAAZ,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,OAAA,CAAI;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGpC;"}
+{"version":3,"file":"breadcrumb.js","sources":["../../../../../../../../packages/ui/src/components/breadcrumb.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { ChevronRight, MoreHorizontal } from \"lucide-react\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nfunction Breadcrumb({ ...props }: React.ComponentProps<\"nav\">) {\n  return <nav aria-label=\"breadcrumb\" data-slot=\"breadcrumb\" {...props} />;\n}\n\nfunction BreadcrumbList({ className, ...props }: React.ComponentProps<\"ol\">) {\n  return (\n    <ol\n      data-slot=\"breadcrumb-list\"\n      className={cn(\n        \"ds:text-muted-foreground ds:flex ds:flex-wrap ds:items-center ds:gap-1.5 ds:text-sm ds:break-words ds:sm:gap-2.5\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-item\"\n      className={cn(\"ds:inline-flex ds:items-center ds:gap-1.5\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbLink({\n  asChild,\n  className,\n  ...props\n}: React.ComponentProps<\"a\"> & {\n  asChild?: boolean;\n}) {\n  const Comp = asChild ? Slot : \"a\";\n\n  return (\n    <Comp\n      data-slot=\"breadcrumb-link\"\n      className={cn(\"ds:hover:text-foreground ds:transition-colors\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbPage({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-page\"\n      role=\"link\"\n      aria-disabled=\"true\"\n      aria-current=\"page\"\n      className={cn(\"ds:text-foreground ds:font-normal\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction BreadcrumbSeparator({\n  children,\n  className,\n  ...props\n}: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      data-slot=\"breadcrumb-separator\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"ds:[&>svg]:size-3.5\", className)}\n      {...props}\n    >\n      {children ?? <ChevronRight />}\n    </li>\n  );\n}\n\nfunction BreadcrumbEllipsis({\n  className,\n  ...props\n}: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      data-slot=\"breadcrumb-ellipsis\"\n      role=\"presentation\"\n      aria-hidden=\"true\"\n      className={cn(\"ds:flex ds:size-9 ds:items-center ds:justify-center\", className)}\n      {...props}\n    >\n      <MoreHorizontal className=\"ds:size-4\" />\n      <span className=\"ds:sr-only\">More</span>\n    </span>\n  );\n}\n\nexport {\n  Breadcrumb,\n  BreadcrumbList,\n  BreadcrumbItem,\n  BreadcrumbLink,\n  BreadcrumbPage,\n  BreadcrumbSeparator,\n  BreadcrumbEllipsis,\n};\n"],"names":["Breadcrumb","props","BreadcrumbList","className","jsx","cn","BreadcrumbItem","BreadcrumbLink","asChild","Slot","BreadcrumbPage","BreadcrumbSeparator","children","ChevronRight","BreadcrumbEllipsis","jsxs","MoreHorizontal"],"mappings":";;;;AAMA,SAASA,EAAW,EAAE,GAAGC,KAAsC;AAC7D,2BAAQ,OAAA,EAAI,cAAW,cAAa,aAAU,cAAc,GAAGA,GAAO;AACxE;AAEA,SAASC,EAAe,EAAE,WAAAC,GAAW,GAAGF,KAAqC;AAC3E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASK,EAAe,EAAE,WAAAH,GAAW,GAAGF,KAAqC;AAC3E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,6CAA6CF,CAAS;AAAA,MACnE,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASM,EAAe;AAAA,EACtB,SAAAC;AAAA,EACA,WAAAL;AAAA,EACA,GAAGF;AACL,GAEG;AAGD,SACE,gBAAAG;AAAA,IAHWI,IAAUC,IAAO;AAAA,IAG3B;AAAA,MACC,aAAU;AAAA,MACV,WAAWJ,EAAG,iDAAiDF,CAAS;AAAA,MACvE,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASS,EAAe,EAAE,WAAAP,GAAW,GAAGF,KAAuC;AAC7E,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,iBAAc;AAAA,MACd,gBAAa;AAAA,MACb,WAAWC,EAAG,qCAAqCF,CAAS;AAAA,MAC3D,GAAGF;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASU,EAAoB;AAAA,EAC3B,UAAAC;AAAA,EACA,WAAAT;AAAA,EACA,GAAGF;AACL,GAA+B;AAC7B,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,WAAWC,EAAG,uBAAuBF,CAAS;AAAA,MAC7C,GAAGF;AAAA,MAEH,UAAAW,uBAAaC,GAAA,CAAA,CAAa;AAAA,IAAA;AAAA,EAAA;AAGjC;AAEA,SAASC,EAAmB;AAAA,EAC1B,WAAAX;AAAA,EACA,GAAGF;AACL,GAAiC;AAC/B,SACE,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,eAAY;AAAA,MACZ,WAAWV,EAAG,uDAAuDF,CAAS;AAAA,MAC7E,GAAGF;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAG,EAACY,GAAA,EAAe,WAAU,YAAA,CAAY;AAAA,QACtC,gBAAAZ,EAAC,QAAA,EAAK,WAAU,cAAa,UAAA,OAAA,CAAI;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGvC;"}

package/dist/esm/packages/ui/src/components/button-group.js

@@ -1,15 +1,15 @@
-import { jsx as e } from "react/jsx-runtime";
-import { Slot as a } from "@radix-ui/react-slot";
-import { cva as i } from "class-variance-authority";
-import { cn as n } from "../lib/utils.js";
-import { Separator as s } from "./separator.js";
-const l = i(
-  "flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2",
+import { jsx as r } from "react/jsx-runtime";
+import { Slot as e } from "@radix-ui/react-slot";
+import { cva as n } from "class-variance-authority";
+import { cn as d } from "../lib/utils.js";
+import { Separator as a } from "./separator.js";
+const i = n(
+  "ds:flex ds:w-fit ds:items-stretch ds:[&>*]:focus-visible:z-10 ds:[&>*]:focus-visible:relative ds:[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit ds:[&>input]:flex-1 ds:has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md ds:has-[>[data-slot=button-group]]:gap-2",
   {
     variants: {
       orientation: {
-        horizontal: "[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none",
-        vertical: "flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none"
+        horizontal: "ds:[&>*:not(:first-child)]:rounded-l-none ds:[&>*:not(:first-child)]:border-l-0 ds:[&>*:not(:last-child)]:rounded-r-none",
+        vertical: "ds:flex-col ds:[&>*:not(:first-child)]:rounded-t-none ds:[&>*:not(:first-child)]:border-t-0 ds:[&>*:not(:last-child)]:rounded-b-none"
       }
     },
     defaultVariants: {
@@ -18,52 +18,52 @@ const l = i(
   }
 );
 function h({
-  className: o,
+  className: s,
   orientation: t,
-  ...r
+  ...o
 }) {
-  return /* @__PURE__ */ e(
+  return /* @__PURE__ */ r(
     "div",
     {
       role: "group",
       "data-slot": "button-group",
       "data-orientation": t,
-      className: n(l({ orientation: t }), o),
-      ...r
+      className: d(i({ orientation: t }), s),
+      ...o
     }
   );
 }
 function g({
-  className: o,
+  className: s,
   asChild: t = !1,
-  ...r
+  ...o
 }) {
-  return /* @__PURE__ */ e(
-    t ? a : "div",
+  return /* @__PURE__ */ r(
+    t ? e : "div",
     {
-      className: n(
-        "bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
-        o
+      className: d(
+        "ds:bg-muted ds:flex ds:items-center ds:gap-2 ds:rounded-md ds:border ds:px-4 ds:text-sm ds:font-medium ds:shadow-xs ds:[&_svg]:pointer-events-none ds:[&_svg:not([class*='size-'])]:size-4",
+        s
       ),
-      ...r
+      ...o
     }
   );
 }
 function v({
-  className: o,
+  className: s,
   orientation: t = "vertical",
-  ...r
+  ...o
 }) {
-  return /* @__PURE__ */ e(
-    s,
+  return /* @__PURE__ */ r(
+    a,
     {
       "data-slot": "button-group-separator",
       orientation: t,
-      className: n(
-        "bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto",
-        o
+      className: d(
+        "ds:bg-input ds:relative ds:!m-0 ds:self-stretch ds:data-[orientation=vertical]:h-auto",
+        s
       ),
-      ...r
+      ...o
     }
   );
 }
@@ -71,6 +71,6 @@ export {
   h as ButtonGroup,
   v as ButtonGroupSeparator,
   g as ButtonGroupText,
-  l as buttonGroupVariants
+  i as buttonGroupVariants
 };
 //# sourceMappingURL=button-group.js.map

package/dist/esm/packages/ui/src/components/button-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.js","sources":["../../../../../../../../packages/ui/src/components/button-group.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { Separator } from \"@dsui/ui/components/separator\";\n\nconst buttonGroupVariants = cva(\n  \"flex w-fit items-stretch [&>*]:focus-visible:z-10 [&>*]:focus-visible:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2\",\n  {\n    variants: {\n      orientation: {\n        horizontal:\n          \"[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\",\n        vertical:\n          \"flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none\",\n      },\n    },\n    defaultVariants: {\n      orientation: \"horizontal\",\n    },\n  }\n);\n\nfunction ButtonGroup({\n  className,\n  orientation,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof buttonGroupVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"button-group\"\n      data-orientation={orientation}\n      className={cn(buttonGroupVariants({ orientation }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction ButtonGroupText({\n  className,\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  asChild?: boolean;\n}) {\n  const Comp = asChild ? Slot : \"div\";\n\n  return (\n    <Comp\n      className={cn(\n        \"bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ButtonGroupSeparator({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"button-group-separator\"\n      orientation={orientation}\n      className={cn(\n        \"bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  ButtonGroup,\n  ButtonGroupSeparator,\n  ButtonGroupText,\n  buttonGroupVariants,\n};\n"],"names":["buttonGroupVariants","cva","ButtonGroup","className","orientation","props","jsx","cn","ButtonGroupText","asChild","Slot","ButtonGroupSeparator","Separator"],"mappings":";;;;;AAMA,MAAMA,IAAsBC;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,aAAa;AAAA,QACX,YACE;AAAA,QACF,UACE;AAAA,MAAA;AAAA,IACJ;AAAA,IAEF,iBAAiB;AAAA,MACf,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ;AAEA,SAASC,EAAY;AAAA,EACnB,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,GAA2E;AACzE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAU;AAAA,MACV,oBAAkBF;AAAA,MAClB,WAAWG,EAAGP,EAAoB,EAAE,aAAAI,EAAA,CAAa,GAAGD,CAAS;AAAA,MAC5D,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASG,EAAgB;AAAA,EACvB,WAAAL;AAAA,EACA,SAAAM,IAAU;AAAA,EACV,GAAGJ;AACL,GAEG;AAGD,SACE,gBAAAC;AAAA,IAHWG,IAAUC,IAAO;AAAA,IAG3B;AAAA,MACC,WAAWH;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASM,EAAqB;AAAA,EAC5B,WAAAR;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,GAA2C;AACzC,SACE,gBAAAC;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,aAAAR;AAAA,MACA,WAAWG;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"button-group.js","sources":["../../../../../../../../packages/ui/src/components/button-group.tsx"],"sourcesContent":["import { Slot } from \"@radix-ui/react-slot\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { Separator } from \"@dsui/ui/components/separator\";\n\nconst buttonGroupVariants = cva(\n  \"ds:flex ds:w-fit ds:items-stretch ds:[&>*]:focus-visible:z-10 ds:[&>*]:focus-visible:relative ds:[&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit ds:[&>input]:flex-1 ds:has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md ds:has-[>[data-slot=button-group]]:gap-2\",\n  {\n    variants: {\n      orientation: {\n        horizontal:\n          \"ds:[&>*:not(:first-child)]:rounded-l-none ds:[&>*:not(:first-child)]:border-l-0 ds:[&>*:not(:last-child)]:rounded-r-none\",\n        vertical:\n          \"ds:flex-col ds:[&>*:not(:first-child)]:rounded-t-none ds:[&>*:not(:first-child)]:border-t-0 ds:[&>*:not(:last-child)]:rounded-b-none\",\n      },\n    },\n    defaultVariants: {\n      orientation: \"horizontal\",\n    },\n  }\n);\n\nfunction ButtonGroup({\n  className,\n  orientation,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof buttonGroupVariants>) {\n  return (\n    <div\n      role=\"group\"\n      data-slot=\"button-group\"\n      data-orientation={orientation}\n      className={cn(buttonGroupVariants({ orientation }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction ButtonGroupText({\n  className,\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  asChild?: boolean;\n}) {\n  const Comp = asChild ? Slot : \"div\";\n\n  return (\n    <Comp\n      className={cn(\n        \"ds:bg-muted ds:flex ds:items-center ds:gap-2 ds:rounded-md ds:border ds:px-4 ds:text-sm ds:font-medium ds:shadow-xs ds:[&_svg]:pointer-events-none ds:[&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ButtonGroupSeparator({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"button-group-separator\"\n      orientation={orientation}\n      className={cn(\n        \"ds:bg-input ds:relative ds:!m-0 ds:self-stretch ds:data-[orientation=vertical]:h-auto\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  ButtonGroup,\n  ButtonGroupSeparator,\n  ButtonGroupText,\n  buttonGroupVariants,\n};\n"],"names":["buttonGroupVariants","cva","ButtonGroup","className","orientation","props","jsx","cn","ButtonGroupText","asChild","Slot","ButtonGroupSeparator","Separator"],"mappings":";;;;;AAMA,MAAMA,IAAsBC;AAAA,EAC1B;AAAA,EACA;AAAA,IACE,UAAU;AAAA,MACR,aAAa;AAAA,QACX,YACE;AAAA,QACF,UACE;AAAA,MAAA;AAAA,IACJ;AAAA,IAEF,iBAAiB;AAAA,MACf,aAAa;AAAA,IAAA;AAAA,EACf;AAEJ;AAEA,SAASC,EAAY;AAAA,EACnB,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,GAAGC;AACL,GAA2E;AACzE,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,MAAK;AAAA,MACL,aAAU;AAAA,MACV,oBAAkBF;AAAA,MAClB,WAAWG,EAAGP,EAAoB,EAAE,aAAAI,EAAA,CAAa,GAAGD,CAAS;AAAA,MAC5D,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASG,EAAgB;AAAA,EACvB,WAAAL;AAAA,EACA,SAAAM,IAAU;AAAA,EACV,GAAGJ;AACL,GAEG;AAGD,SACE,gBAAAC;AAAA,IAHWG,IAAUC,IAAO;AAAA,IAG3B;AAAA,MACC,WAAWH;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASM,EAAqB;AAAA,EAC5B,WAAAR;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,GAAGC;AACL,GAA2C;AACzC,SACE,gBAAAC;AAAA,IAACM;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,aAAAR;AAAA,MACA,WAAWG;AAAA,QACT;AAAA,QACAJ;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/esm/packages/ui/src/components/button.js

@@ -3,121 +3,121 @@ import * as i from "react";
 import { Slot as g } from "@radix-ui/react-slot";
 import { cva as b } from "class-variance-authority";
 import { cn as u } from "../lib/utils.js";
-const t = {
+const e = {
   primary: {
-    solid: "border-primary bg-primary text-primary-foreground hover:bg-primary/90 focus-visible:ring-primary/20",
-    mix: "bg-primary/30 border-primary text-primary hover:bg-primary/40 dark:bg-primary/30 dark:hover:bg-primary/40",
-    light: "bg-primary/30 border-primary/0 text-primary hover:bg-primary/40 dark:bg-primary/30 dark:hover:bg-primary/40",
-    outline: "border-primary text-primary hover:bg-primary/10 dark:border-primary dark:hover:bg-primary/20",
-    stroke: "border-primary text-primary hover:bg-primary/10 dark:border-primary dark:hover:bg-primary/20",
-    ghost: "text-primary hover:bg-primary/10 hover:text-primary dark:hover:bg-primary/20",
-    link: "text-primary"
+    solid: "ds:border-primary ds:bg-primary ds:text-primary-foreground ds:hover:bg-primary/90 ds:focus-visible:ring-primary/20",
+    mix: "ds:bg-primary/30 ds:border-primary ds:text-primary ds:hover:bg-primary/40 ds:dark:bg-primary/30 ds:dark:hover:bg-primary/40",
+    light: "ds:bg-primary/30 ds:border-primary/0 ds:text-primary ds:hover:bg-primary/40 ds:dark:bg-primary/30 ds:dark:hover:bg-primary/40",
+    outline: "ds:border-primary ds:text-primary ds:hover:bg-primary/10 ds:dark:border-primary ds:dark:hover:bg-primary/20",
+    stroke: "ds:border-primary ds:text-primary ds:hover:bg-primary/10 ds:dark:border-primary ds:dark:hover:bg-primary/20",
+    ghost: "ds:text-primary ds:hover:bg-primary/10 ds:hover:text-primary ds:dark:hover:bg-primary/20",
+    link: "ds:text-primary"
   },
   secondary: {
-    solid: "border-secondary bg-secondary text-secondary-foreground hover:bg-secondary/80 focus-visible:ring-secondary/20",
-    mix: "bg-secondary/30 border-secondary text-secondary hover:bg-secondary/40 dark:bg-secondary/30 dark:hover:bg-secondary/40",
-    light: "bg-secondary/30 border-secondary/0 text-secondary hover:bg-secondary/40 dark:bg-secondary/30 dark:hover:bg-secondary/40",
-    outline: "border-secondary text-secondary hover:bg-secondary/10 dark:border-secondary dark:hover:bg-secondary/20",
-    stroke: "border-secondary text-secondary hover:bg-secondary/10 dark:border-secondary dark:hover:bg-secondary/20",
-    ghost: "text-secondary hover:bg-secondary/10 hover:text-secondary dark:hover:bg-secondary/20",
-    link: "text-secondary"
+    solid: "ds:border-secondary ds:bg-secondary ds:text-secondary-foreground ds:hover:bg-secondary/80 ds:focus-visible:ring-secondary/20",
+    mix: "ds:bg-secondary/30 ds:border-secondary ds:text-secondary ds:hover:bg-secondary/40 ds:dark:bg-secondary/30 ds:dark:hover:bg-secondary/40",
+    light: "ds:bg-secondary/30 ds:border-secondary/0 ds:text-secondary ds:hover:bg-secondary/40 ds:dark:bg-secondary/30 ds:dark:hover:bg-secondary/40",
+    outline: "ds:border-secondary ds:text-secondary ds:hover:bg-secondary/10 ds:dark:border-secondary ds:dark:hover:bg-secondary/20",
+    stroke: "ds:border-secondary ds:text-secondary ds:hover:bg-secondary/10 ds:dark:border-secondary ds:dark:hover:bg-secondary/20",
+    ghost: "ds:text-secondary ds:hover:bg-secondary/10 ds:hover:text-secondary ds:dark:hover:bg-secondary/20",
+    link: "ds:text-secondary"
   },
   accent: {
-    solid: "border-accent bg-accent text-accent-foreground hover:bg-accent/80 focus-visible:ring-accent/20",
-    mix: "bg-accent/30 border-accent text-accent hover:bg-accent/40 dark:bg-accent/30 dark:hover:bg-accent/40",
-    light: "bg-accent/30 border-accent/0 text-accent hover:bg-accent/40 dark:bg-accent/30 dark:hover:bg-accent/40",
-    outline: "border-accent text-accent hover:bg-accent/10 dark:border-accent dark:hover:bg-accent/20",
-    stroke: "border-accent text-accent hover:bg-accent/10 dark:border-accent dark:hover:bg-accent/20",
-    ghost: "text-accent hover:bg-accent/10 hover:text-accent dark:hover:bg-accent/20",
-    link: "text-accent"
+    solid: "ds:border-accent ds:bg-accent ds:text-accent-foreground ds:hover:bg-accent/80 ds:focus-visible:ring-accent/20",
+    mix: "ds:bg-accent/30 ds:border-accent ds:text-accent ds:hover:bg-accent/40 ds:dark:bg-accent/30 ds:dark:hover:bg-accent/40",
+    light: "ds:bg-accent/30 ds:border-accent/0 ds:text-accent ds:hover:bg-accent/40 ds:dark:bg-accent/30 ds:dark:hover:bg-accent/40",
+    outline: "ds:border-accent ds:text-accent ds:hover:bg-accent/10 ds:dark:border-accent ds:dark:hover:bg-accent/20",
+    stroke: "ds:border-accent ds:text-accent ds:hover:bg-accent/10 ds:dark:border-accent ds:dark:hover:bg-accent/20",
+    ghost: "ds:text-accent ds:hover:bg-accent/10 ds:hover:text-accent ds:dark:hover:bg-accent/20",
+    link: "ds:text-accent"
   },
   destructive: {
-    solid: "border-destructive bg-destructive text-destructive-foreground hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:bg-destructive/60",
-    mix: "bg-destructive/30 border-destructive text-destructive hover:bg-destructive/40 dark:bg-destructive/30 dark:hover:bg-destructive/40",
-    light: "bg-destructive/30 border-destructive/0 text-destructive hover:bg-destructive/40 dark:bg-destructive/30 dark:hover:bg-destructive/40",
-    outline: "border-destructive text-destructive hover:bg-destructive/10 dark:border-destructive dark:hover:bg-destructive/20",
-    stroke: "border-destructive text-destructive hover:bg-destructive/10 dark:border-destructive dark:hover:bg-destructive/20",
-    ghost: "text-destructive hover:bg-destructive/10 hover:text-destructive dark:hover:bg-destructive/20",
-    link: "text-destructive"
+    solid: "ds:border-destructive ds:bg-destructive ds:text-destructive-foreground ds:hover:bg-destructive/90 ds:focus-visible:ring-destructive/20 ds:dark:bg-destructive/60",
+    mix: "ds:bg-destructive/30 ds:border-destructive ds:text-destructive ds:hover:bg-destructive/40 ds:dark:bg-destructive/30 ds:dark:hover:bg-destructive/40",
+    light: "ds:bg-destructive/30 ds:border-destructive/0 ds:text-destructive ds:hover:bg-destructive/40 ds:dark:bg-destructive/30 ds:dark:hover:bg-destructive/40",
+    outline: "ds:border-destructive ds:text-destructive ds:hover:bg-destructive/10 ds:dark:border-destructive ds:dark:hover:bg-destructive/20",
+    stroke: "ds:border-destructive ds:text-destructive ds:hover:bg-destructive/10 ds:dark:border-destructive ds:dark:hover:bg-destructive/20",
+    ghost: "ds:text-destructive ds:hover:bg-destructive/10 ds:hover:text-destructive ds:dark:hover:bg-destructive/20",
+    link: "ds:text-destructive"
   },
   muted: {
-    solid: "border-muted bg-muted text-muted-foreground hover:bg-muted/80 focus-visible:ring-muted/20",
-    mix: "bg-muted/30 border-muted text-muted-foreground hover:bg-muted/40 dark:bg-muted/30 dark:hover:bg-muted/40",
-    light: "bg-muted/30 border-muted/0 text-muted-foreground hover:bg-muted/40 dark:bg-muted/30 dark:hover:bg-muted/40",
-    outline: "border-input text-muted-foreground hover:bg-accent hover:text-accent-foreground dark:border-input dark:hover:bg-input/50",
-    stroke: "border-input text-muted-foreground hover:bg-accent hover:text-accent-foreground dark:border-input dark:hover:bg-input/50",
-    ghost: "text-muted-foreground hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
-    link: "text-muted-foreground"
+    solid: "ds:border-muted ds:bg-muted ds:text-muted-foreground ds:hover:bg-muted/80 ds:focus-visible:ring-muted/20",
+    mix: "ds:bg-muted/30 ds:border-muted ds:text-muted-foreground ds:hover:bg-muted/40 ds:dark:bg-muted/30 ds:dark:hover:bg-muted/40",
+    light: "ds:bg-muted/30 ds:border-muted/0 ds:text-muted-foreground ds:hover:bg-muted/40 ds:dark:bg-muted/30 ds:dark:hover:bg-muted/40",
+    outline: "ds:border-input ds:text-muted-foreground ds:hover:bg-accent ds:hover:text-accent-foreground ds:dark:border-input ds:dark:hover:bg-input/50",
+    stroke: "ds:border-input ds:text-muted-foreground ds:hover:bg-accent ds:hover:text-accent-foreground ds:dark:border-input ds:dark:hover:bg-input/50",
+    ghost: "ds:text-muted-foreground ds:hover:bg-accent ds:hover:text-accent-foreground ds:dark:hover:bg-accent/50",
+    link: "ds:text-muted-foreground"
   },
   success: {
-    solid: "border-success bg-success text-success-foreground hover:bg-success/90 focus-visible:ring-success/20 dark:bg-success/60",
-    mix: "bg-success/30 border-success text-success hover:bg-success/40 dark:bg-success/30 dark:hover:bg-success/40",
-    light: "bg-success/30 border-success/0 text-success hover:bg-success/40 dark:bg-success/30 dark:hover:bg-success/40",
-    outline: "border-success text-success hover:bg-success/10 dark:border-success dark:hover:bg-success/20",
-    stroke: "border-success text-success hover:bg-success/10 dark:border-success dark:hover:bg-success/20",
-    ghost: "text-success hover:bg-success/10 hover:text-success dark:hover:bg-success/20",
-    link: "text-success"
+    solid: "ds:border-success ds:bg-success ds:text-success-foreground ds:hover:bg-success/90 ds:focus-visible:ring-success/20 ds:dark:bg-success/60",
+    mix: "ds:bg-success/30 ds:border-success ds:text-success ds:hover:bg-success/40 ds:dark:bg-success/30 ds:dark:hover:bg-success/40",
+    light: "ds:bg-success/30 ds:border-success/0 ds:text-success ds:hover:bg-success/40 ds:dark:bg-success/30 ds:dark:hover:bg-success/40",
+    outline: "ds:border-success ds:text-success ds:hover:bg-success/10 ds:dark:border-success ds:dark:hover:bg-success/20",
+    stroke: "ds:border-success ds:text-success ds:hover:bg-success/10 ds:dark:border-success ds:dark:hover:bg-success/20",
+    ghost: "ds:text-success ds:hover:bg-success/10 ds:hover:text-success ds:dark:hover:bg-success/20",
+    link: "ds:text-success"
   },
   error: {
-    solid: "border-error bg-error text-error-foreground hover:bg-error/90 focus-visible:ring-error/20 dark:bg-error/60",
-    mix: "bg-error/30 border-error text-error hover:bg-error/40 dark:bg-error/30 dark:hover:bg-error/40",
-    light: "bg-error/30 border-error/0 text-error hover:bg-error/40 dark:bg-error/30 dark:hover:bg-error/40",
-    outline: "border-error text-error hover:bg-error/10 dark:border-error dark:hover:bg-error/20",
-    stroke: "border-error text-error hover:bg-error/10 dark:border-error dark:hover:bg-error/20",
-    ghost: "text-error hover:bg-error/10 hover:text-error dark:hover:bg-error/20",
-    link: "text-error"
+    solid: "ds:border-error ds:bg-error ds:text-error-foreground ds:hover:bg-error/90 ds:focus-visible:ring-error/20 ds:dark:bg-error/60",
+    mix: "ds:bg-error/30 ds:border-error ds:text-error ds:hover:bg-error/40 ds:dark:bg-error/30 ds:dark:hover:bg-error/40",
+    light: "ds:bg-error/30 ds:border-error/0 ds:text-error ds:hover:bg-error/40 ds:dark:bg-error/30 ds:dark:hover:bg-error/40",
+    outline: "ds:border-error ds:text-error ds:hover:bg-error/10 ds:dark:border-error ds:dark:hover:bg-error/20",
+    stroke: "ds:border-error ds:text-error ds:hover:bg-error/10 ds:dark:border-error ds:dark:hover:bg-error/20",
+    ghost: "ds:text-error ds:hover:bg-error/10 ds:hover:text-error ds:dark:hover:bg-error/20",
+    link: "ds:text-error"
   },
   warning: {
-    solid: "border-warning bg-warning text-warning-foreground hover:bg-warning/90 focus-visible:ring-warning/20 dark:bg-warning/60",
-    mix: "bg-warning/30 border-warning text-warning hover:bg-warning/40 dark:bg-warning/30 dark:hover:bg-warning/40",
-    light: "bg-warning/30 border-warning/0 text-warning hover:bg-warning/40 dark:bg-warning/30 dark:hover:bg-warning/40",
-    outline: "border-warning text-warning hover:bg-warning/10 dark:border-warning dark:hover:bg-warning/20",
-    stroke: "border-warning text-warning hover:bg-warning/10 dark:border-warning dark:hover:bg-warning/20",
-    ghost: "text-warning hover:bg-warning/10 hover:text-warning dark:hover:bg-warning/20",
-    link: "text-warning"
+    solid: "ds:border-warning ds:bg-warning ds:text-warning-foreground ds:hover:bg-warning/90 ds:focus-visible:ring-warning/20 ds:dark:bg-warning/60",
+    mix: "ds:bg-warning/30 ds:border-warning ds:text-warning ds:hover:bg-warning/40 ds:dark:bg-warning/30 ds:dark:hover:bg-warning/40",
+    light: "ds:bg-warning/30 ds:border-warning/0 ds:text-warning ds:hover:bg-warning/40 ds:dark:bg-warning/30 ds:dark:hover:bg-warning/40",
+    outline: "ds:border-warning ds:text-warning ds:hover:bg-warning/10 ds:dark:border-warning ds:dark:hover:bg-warning/20",
+    stroke: "ds:border-warning ds:text-warning ds:hover:bg-warning/10 ds:dark:border-warning ds:dark:hover:bg-warning/20",
+    ghost: "ds:text-warning ds:hover:bg-warning/10 ds:hover:text-warning ds:dark:hover:bg-warning/20",
+    link: "ds:text-warning"
   }
 }, v = () => {
-  const e = [];
-  return Object.keys(t).forEach(
-    (r) => {
-      Object.keys(t[r]).forEach((o) => {
-        e.push({
-          variant: o,
-          color: r,
-          className: t[r][o]
+  const r = [];
+  return Object.keys(e).forEach(
+    (s) => {
+      Object.keys(e[s]).forEach((d) => {
+        r.push({
+          variant: d,
+          color: s,
+          className: e[s][d]
         });
       });
     }
-  ), e;
+  ), r;
 }, h = b(
-  "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
+  "ds:inline-flex ds:items-center ds:justify-center ds:gap-2 ds:whitespace-nowrap ds:rounded-md ds:text-sm ds:font-medium ds:transition-all ds:disabled:pointer-events-none ds:disabled:opacity-50 ds:[&_svg]:pointer-events-none ds:[&_svg:not([class*='size-'])]:size-4 ds:shrink-0 ds:[&_svg]:shrink-0 ds:outline-none ds:focus-visible:border-ring ds:focus-visible:ring-ring/50 ds:focus-visible:ring-[3px] ds:aria-invalid:ring-destructive/20 ds:dark:aria-invalid:ring-destructive/40 ds:aria-invalid:border-destructive",
   {
     variants: {
       variant: {
-        solid: "border hover:bg-border",
-        mix: "border bg-background shadow-xs dark:bg-input/30",
-        light: "shadow-xs",
-        outline: "border bg-background shadow-xs dark:bg-input/30",
-        stroke: "border bg-background shadow-xs dark:bg-input/30",
+        solid: "ds:border ds:hover:bg-border",
+        mix: "ds:border ds:bg-background ds:shadow-xs ds:dark:bg-input/30",
+        light: "ds:shadow-xs",
+        outline: "ds:border ds:bg-background ds:shadow-xs ds:dark:bg-input/30",
+        stroke: "ds:border ds:bg-background ds:shadow-xs ds:dark:bg-input/30",
         ghost: "",
         link: ""
       },
       size: {
-        xs: "h-6 rounded-md gap-2 px-2 text-sm py-0.5 has-[>svg]:px-2",
-        sm: "h-8 rounded-md gap-2 px-3 text-sm py-1.5 has-[>svg]:px-2.5",
-        normal: "h-10 px-4 py-2 has-[>svg]:px-3",
-        lg: "h-12 rounded-md px-4 py-3 has-[>svg]:px-4",
-        xl: "h-14 rounded-md px-4 py-4 has-[>svg]:px-4",
-        icon: "size-10 [&_svg:not([class*='size-'])]:size-6",
-        "icon-xs": "size-6 [&_svg:not([class*='size-'])]:size-4",
-        "icon-sm": "size-8 [&_svg:not([class*='size-'])]:size-5",
-        "icon-lg": "size-12 [&_svg:not([class*='size-'])]:size-6",
-        "icon-xl": "size-14 [&_svg:not([class*='size-'])]:size-6",
-        "circle-icon": "size-10 rounded-full [&_svg:not([class*='size-'])]:size-6",
-        "circle-icon-xs": "size-6 rounded-full [&_svg:not([class*='size-'])]:size-4",
-        "circle-icon-sm": "size-8 rounded-full [&_svg:not([class*='size-'])]:size-5",
-        "circle-icon-lg": "size-12 rounded-full [&_svg:not([class*='size-'])]:size-6",
-        "circle-icon-xl": "size-14 rounded-full [&_svg:not([class*='size-'])]:size-6"
+        xs: "ds:h-6 ds:rounded-md ds:gap-2 ds:px-2 ds:text-sm ds:py-0.5 ds:has-[>svg]:px-2",
+        sm: "ds:h-8 ds:rounded-md ds:gap-2 ds:px-3 ds:text-sm ds:py-1.5 ds:has-[>svg]:px-2.5",
+        normal: "ds:h-10 ds:px-4 ds:py-2 ds:has-[>svg]:px-3",
+        lg: "ds:h-12 ds:rounded-md ds:px-4 ds:py-3 ds:has-[>svg]:px-4",
+        xl: "ds:h-14 ds:rounded-md ds:px-4 ds:py-4 ds:has-[>svg]:px-4",
+        icon: "ds:size-10 ds:[&_svg:not([class*='size-'])]:size-6",
+        "icon-xs": "ds:size-6 ds:[&_svg:not([class*='size-'])]:size-4",
+        "icon-sm": "ds:size-8 ds:[&_svg:not([class*='size-'])]:size-5",
+        "icon-lg": "ds:size-12 ds:[&_svg:not([class*='size-'])]:size-6",
+        "icon-xl": "ds:size-14 ds:[&_svg:not([class*='size-'])]:size-6",
+        "circle-icon": "ds:size-10 ds:rounded-full ds:[&_svg:not([class*='size-'])]:size-6",
+        "circle-icon-xs": "ds:size-6 ds:rounded-full ds:[&_svg:not([class*='size-'])]:size-4",
+        "circle-icon-sm": "ds:size-8 ds:rounded-full ds:[&_svg:not([class*='size-'])]:size-5",
+        "circle-icon-lg": "ds:size-12 ds:rounded-full ds:[&_svg:not([class*='size-'])]:size-6",
+        "circle-icon-xl": "ds:size-14 ds:rounded-full ds:[&_svg:not([class*='size-'])]:size-6"
       },
       color: {
         primary: "",
@@ -139,12 +139,12 @@ const t = {
     }
   }
 ), k = i.forwardRef(
-  ({ className: e, variant: r, size: o, color: s, asChild: d = !1, ...a }, c) => /* @__PURE__ */ n(
-    d ? g : "button",
+  ({ className: r, variant: s, size: d, color: o, asChild: t = !1, ...a }, c) => /* @__PURE__ */ n(
+    t ? g : "button",
     {
       ref: c,
       "data-slot": "button",
-      className: u(h({ variant: r, size: o, color: s, className: e })),
+      className: u(h({ variant: s, size: d, color: o, className: r })),
       ...a
     }
   )