@mzc-fe/design-system 0.0.9 → 0.0.10-rc.0

package/dist/components/alert/alert.js

@@ -15,7 +15,7 @@ const l = i(
     variants: {
       variant: {
         default: "bg-card text-card-foreground",
-        destructive: "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90"
+        destructive: "text-error bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-error/90"
       }
     },
     defaultVariants: {
@@ -26,7 +26,7 @@ const l = i(
 function g({ className: t, variant: r, ...s }) {
   return /* @__PURE__ */ e("div", { "data-slot": "alert", role: "alert", className: a(l({ variant: r }), t), ...s });
 }
-function u({ className: t, ...r }) {
+function m({ className: t, ...r }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -36,7 +36,7 @@ function u({ className: t, ...r }) {
     }
   );
 }
-function m({ className: t, ...r }) {
+function u({ className: t, ...r }) {
   return /* @__PURE__ */ e(
     "div",
     {
@@ -51,6 +51,6 @@ function m({ className: t, ...r }) {
 }
 export {
   g as Alert,
-  m as AlertDescription,
-  u as AlertTitle
+  u as AlertDescription,
+  m as AlertTitle
 };

package/dist/components/badge/badge.js

@@ -1,6 +1,6 @@
-import { jsx as a } from "react/jsx-runtime";
+import { jsx as i } from "react/jsx-runtime";
 import "react";
-import { Slot as o } from "@radix-ui/react-slot";
+import { Slot as t } from "@radix-ui/react-slot";
 import { cva as n } from "class-variance-authority";
 import { cn as s } from "../../lib/utils.js";
 const d = n(
@@ -10,8 +10,8 @@ const d = n(
     "rounded-full border border-border",
     "transition-[color,box-shadow]",
     "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-    "aria-invalid:ring-destructive/20 aria-invalid:border-destructive",
-    "dark:aria-invalid:ring-destructive/40",
+    "aria-invalid:ring-error/20 aria-invalid:border-error",
+    "dark:aria-invalid:ring-error/40",
     "[&>svg]:size-3 [&>svg]:pointer-events-none"
   ],
   {
@@ -20,11 +20,11 @@ const d = n(
         default: ["border-transparent bg-primary text-primary-foreground", "[a&]:hover:bg-primary/90"],
         secondary: ["border-transparent bg-secondary text-secondary-foreground", "[a&]:hover:bg-secondary/90"],
         destructive: [
-          "border-transparent bg-destructive text-white",
-          "[a&]:hover:bg-destructive/90",
-          "focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
+          "border-transparent bg-error text-white",
+          "[a&]:hover:bg-error/90",
+          "focus-visible:ring-error/20 dark:focus-visible:ring-error/40 dark:bg-error/60"
         ],
-        outline: ["text-foreground", "[a&]:hover:bg-accent [a&]:hover:text-accent-foreground"]
+        outline: ["text-foreground", "[a&]:hover:bg-accent-1 [a&]:hover:text-accent-foreground"]
       }
     },
     defaultVariants: {
@@ -32,10 +32,10 @@ const d = n(
     }
   }
 );
-function l({ className: r, variant: e, asChild: t = !1, ...i }) {
-  return /* @__PURE__ */ a(t ? o : "span", { "data-slot": "badge", className: s(d({ variant: e }), r), ...i });
+function v({ className: r, variant: e, asChild: o = !1, ...a }) {
+  return /* @__PURE__ */ i(o ? t : "span", { "data-slot": "badge", className: s(d({ variant: e }), r), ...a });
 }
 export {
-  l as Badge,
+  v as Badge,
   d as badgeVariants
 };

package/dist/components/button/button.js

@@ -1,9 +1,9 @@
-import { jsx as o } from "react/jsx-runtime";
+import { jsx as n } from "react/jsx-runtime";
 import "react";
 import { Slot as a } from "@radix-ui/react-slot";
 import { cva as s } from "class-variance-authority";
 import { cn as d } from "../../lib/utils.js";
-const u = s(
+const g = s(
   [
     "inline-flex items-center justify-center gap-2 shrink-0 rounded-md",
     "whitespace-nowrap text-sm font-medium",
@@ -11,26 +11,26 @@ const u = s(
     "disabled:pointer-events-none disabled:opacity-50",
     "[&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 [&_svg]:shrink-0",
     "outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-    "aria-invalid:ring-destructive/20 aria-invalid:border-destructive",
-    "dark:aria-invalid:ring-destructive/40"
+    "aria-invalid:ring-error/20 aria-invalid:border-error",
+    "dark:aria-invalid:ring-error/40"
   ],
   {
     variants: {
       variant: {
         default: ["bg-primary text-primary-foreground", "hover:bg-primary/90"],
         destructive: [
-          "bg-destructive dark:bg-destructive/60 text-white",
-          "hover:bg-destructive/90",
-          "focus-visible:ring-destructive/20",
-          "dark:focus-visible:ring-destructive/40 dark:bg-destructive/60"
+          "bg-error dark:bg-error/60 text-white",
+          "hover:bg-error/90",
+          "focus-visible:ring-error/20",
+          "dark:focus-visible:ring-error/40 dark:bg-error/60"
         ],
         outline: [
           "border border-border bg-background shadow-xs",
-          "hover:bg-accent hover:text-accent-foreground",
+          "hover:bg-accent-1 dark:hover:bg-input/50 hover:text-accent-foreground",
           "dark:bg-input/30 dark:border-input dark:hover:bg-input/50"
         ],
         secondary: ["bg-secondary text-secondary-foreground", "hover:bg-secondary/80"],
-        ghost: ["hover:bg-accent hover:text-accent-foreground", "dark:hover:bg-accent/50"],
+        ghost: ["hover:bg-accent-1 hover:text-accent-foreground"],
         link: ["text-primary underline-offset-4", "hover:underline"]
       },
       size: {
@@ -48,19 +48,19 @@ const u = s(
     }
   }
 );
-function f({ className: t, variant: e = "default", size: r = "default", asChild: i = !1, ...n }) {
-  return /* @__PURE__ */ o(
+function f({ className: o, variant: r = "default", size: e = "default", asChild: i = !1, ...t }) {
+  return /* @__PURE__ */ n(
     i ? a : "button",
     {
       "data-slot": "button",
-      "data-variant": e,
-      "data-size": r,
-      className: d(u({ variant: e, size: r, className: t })),
-      ...n
+      "data-variant": r,
+      "data-size": e,
+      className: d(g({ variant: r, size: e, className: o })),
+      ...t
     }
   );
 }
 export {
   f as Button,
-  u as buttonVariants
+  g as buttonVariants
 };

package/dist/components/calendar/calendar.js

@@ -32,15 +32,9 @@ function j({
       },
       classNames: {
         root: e("w-fit", t.root),
-        months: e(
-          "flex gap-4 flex-col md:flex-row relative",
-          t.months
-        ),
+        months: e("flex gap-4 flex-col md:flex-row relative", t.months),
         month: e("flex flex-col w-full gap-4", t.month),
-        nav: e(
-          "flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between",
-          t.nav
-        ),
+        nav: e("flex items-center gap-1 w-full absolute top-0 inset-x-0 justify-between", t.nav),
         button_previous: e(
           f({ variant: s }),
           "size-(--cell-size) aria-disabled:opacity-50 p-0 select-none",
@@ -63,10 +57,7 @@ function j({
           "relative has-focus:border-ring border border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] rounded-md",
           t.dropdown_root
         ),
-        dropdown: e(
-          "absolute bg-popover inset-0 opacity-0",
-          t.dropdown
-        ),
+        dropdown: e("absolute bg-popover inset-0 opacity-0", t.dropdown),
         caption_label: e(
           "select-none font-medium",
           l === "label" ? "text-sm" : "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5",
@@ -79,57 +70,28 @@ function j({
           t.weekday
         ),
         week: e("flex w-full mt-2", t.week),
-        week_number_header: e(
-          "select-none w-(--cell-size)",
-          t.week_number_header
-        ),
-        week_number: e(
-          "text-[0.8rem] select-none text-muted-foreground",
-          t.week_number
-        ),
+        week_number_header: e("select-none w-(--cell-size)", t.week_number_header),
+        week_number: e("text-[0.8rem] select-none text-muted-foreground", t.week_number),
         day: e(
           "relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none",
           g.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-md" : "[&:first-child[data-selected=true]_button]:rounded-l-md",
           t.day
         ),
-        range_start: e(
-          "rounded-l-md bg-accent",
-          t.range_start
-        ),
+        range_start: e("rounded-l-md bg-accent-1", t.range_start),
         range_middle: e("rounded-none", t.range_middle),
-        range_end: e("rounded-r-md bg-accent", t.range_end),
+        range_end: e("rounded-r-md bg-accent-1", t.range_end),
         today: e(
-          "bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none",
+          "bg-accent-1 text-accent-foreground rounded-md data-[selected=true]:rounded-none",
           t.today
         ),
-        outside: e(
-          "text-muted-foreground aria-selected:text-muted-foreground",
-          t.outside
-        ),
-        disabled: e(
-          "text-muted-foreground opacity-50",
-          t.disabled
-        ),
+        outside: e("text-muted-foreground aria-selected:text-muted-foreground", t.outside),
+        disabled: e("text-muted-foreground opacity-50", t.disabled),
         hidden: e("invisible", t.hidden),
         ...i
       },
       components: {
-        Root: ({ className: a, rootRef: d, ...o }) => /* @__PURE__ */ n(
-          "div",
-          {
-            "data-slot": "calendar",
-            ref: d,
-            className: e(a),
-            ...o
-          }
-        ),
-        Chevron: ({ className: a, orientation: d, ...o }) => d === "left" ? /* @__PURE__ */ n(b, { className: e("size-4", a), ...o }) : d === "right" ? /* @__PURE__ */ n(
-          h,
-          {
-            className: e("size-4", a),
-            ...o
-          }
-        ) : /* @__PURE__ */ n(w, { className: e("size-4", a), ...o }),
+        Root: ({ className: a, rootRef: d, ...o }) => /* @__PURE__ */ n("div", { "data-slot": "calendar", ref: d, className: e(a), ...o }),
+        Chevron: ({ className: a, orientation: d, ...o }) => d === "left" ? /* @__PURE__ */ n(b, { className: e("size-4", a), ...o }) : d === "right" ? /* @__PURE__ */ n(h, { className: e("size-4", a), ...o }) : /* @__PURE__ */ n(w, { className: e("size-4", a), ...o }),
         DayButton: v,
         WeekNumber: ({ children: a, ...d }) => /* @__PURE__ */ n("td", { ...d, children: /* @__PURE__ */ n("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children: a }) }),
         ...x
@@ -138,12 +100,7 @@ function j({
     }
   );
 }
-function v({
-  className: c,
-  day: i,
-  modifiers: r,
-  ...l
-}) {
+function v({ className: c, day: i, modifiers: r, ...l }) {
   const s = p(), u = m.useRef(null);
   return m.useEffect(() => {
     r.focused && u.current?.focus();
@@ -159,7 +116,7 @@ function v({
       "data-range-end": r.range_end,
       "data-range-middle": r.range_middle,
       className: e(
-        "data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70",
+        "data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent-1 data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 dark:hover:text-accent-foreground flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] data-[range-end=true]:rounded-md data-[range-end=true]:rounded-r-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md data-[range-start=true]:rounded-l-md [&>span]:text-xs [&>span]:opacity-70",
         s.day,
         c
       ),

package/dist/components/checkbox/checkbox.js

@@ -1,32 +1,32 @@
 import { jsx as r } from "react/jsx-runtime";
 import "react";
-import * as t from "@radix-ui/react-checkbox";
-import { MinusIcon as d, CheckIcon as n } from "lucide-react";
-import { cn as o } from "../../lib/utils.js";
-function b({ className: a, checked: e, ...i }) {
+import * as a from "@radix-ui/react-checkbox";
+import { MinusIcon as o, CheckIcon as n } from "lucide-react";
+import { cn as d } from "../../lib/utils.js";
+function b({ className: i, checked: e, ...t }) {
   return /* @__PURE__ */ r(
-    t.Root,
+    a.Root,
     {
       "data-slot": "checkbox",
-      className: o(
+      className: d(
         "peer size-4 shrink-0 rounded-[4px]",
         "border-input border shadow-xs transition-shadow outline-none",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
-        "aria-invalid:border-destructive aria-invalid:ring-destructive/20",
+        "aria-invalid:border-error aria-invalid:ring-error/20",
         "data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
         "data-[state=indeterminate]:border-primary data-[state=indeterminate]:bg-primary data-[state=indeterminate]:text-primary-foreground",
         "disabled:cursor-not-allowed disabled:opacity-50",
-        "dark:bg-input/30 dark:data-[state=checked]:bg-primary dark:data-[state=indeterminate]:bg-primary dark:aria-invalid:ring-destructive/40",
-        a
+        "dark:bg-input/30 dark:data-[state=checked]:bg-primary dark:data-[state=indeterminate]:bg-primary dark:aria-invalid:ring-error/40",
+        i
       ),
       checked: e,
-      ...i,
+      ...t,
       children: /* @__PURE__ */ r(
-        t.Indicator,
+        a.Indicator,
         {
           "data-slot": "checkbox-indicator",
           className: "grid place-content-center text-current transition-none",
-          children: e === "indeterminate" ? /* @__PURE__ */ r(d, { className: "size-3.5" }) : /* @__PURE__ */ r(n, { className: "size-3.5" })
+          children: e === "indeterminate" ? /* @__PURE__ */ r(o, { className: "size-3.5" }) : /* @__PURE__ */ r(n, { className: "size-3.5" })
         }
       )
     }

package/dist/components/combobox/combobox.js

@@ -140,7 +140,7 @@ function Ve({
       "data-slot": "combobox-trigger",
       className: g(
         "border-input dark:bg-input/30 dark:hover:bg-input/50 flex w-full items-center gap-2 rounded-md border bg-transparent px-4 text-sm font-medium shadow-xs transition-[color,box-shadow] outline-none",
-        "hover:bg-accent/50",
+        "hover:bg-accent-1/50",
         "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
         "active:opacity-60",
         "disabled:cursor-not-allowed disabled:opacity-50",
@@ -303,7 +303,7 @@ function Be({
       "data-slot": "combobox-item",
       "data-selected": m,
       className: g(
-        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "data-[selected=true]:bg-accent-1 data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         a
       ),
       value: o,

package/dist/components/command/command.js

@@ -91,7 +91,7 @@ function z({ className: e, ...t }) {
     {
       "data-slot": "command-item",
       className: r(
-        "data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "data-[selected=true]:bg-accent-1 data-[selected=true]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         e
       ),
       ...t

package/dist/components/context-menu/context-menu.js

@@ -33,7 +33,7 @@ function z({
       "data-slot": "context-menu-sub-trigger",
       "data-inset": n,
       className: r(
-        "focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent-1 focus:text-accent-foreground data-[state=open]:bg-accent-1 data-[state=open]:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         t
       ),
       ...s,
@@ -94,7 +94,7 @@ function _({
       "data-inset": n,
       "data-variant": a,
       className: r(
-        "focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/20 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent-1 focus:text-accent-foreground data-[variant=destructive]:text-error data-[variant=destructive]:focus:bg-error/10 dark:data-[variant=destructive]:focus:bg-error/20 data-[variant=destructive]:focus:text-error data-[variant=destructive]:*:[svg]:!text-error [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         t
       ),
       ...s
@@ -112,7 +112,7 @@ function I({
     {
       "data-slot": "context-menu-checkbox-item",
       className: r(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent-1 focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         t
       ),
       checked: a,
@@ -134,7 +134,7 @@ function y({
     {
       "data-slot": "context-menu-radio-item",
       className: r(
-        "focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+        "focus:bg-accent-1 focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         t
       ),
       ...a,

package/dist/components/dialog/dialog.js

@@ -64,7 +64,7 @@ function N({ className: a, children: o, showCloseButton: r = !0, size: l, ...d }
             e.Close,
             {
               "data-slot": "dialog-close",
-              className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
+              className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent-1 data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
               children: [
                 /* @__PURE__ */ t(c, {}),
                 /* @__PURE__ */ t("span", { className: "sr-only", children: "Close" })

package/dist/components/dropdown-menu/dropdown-menu.js

@@ -54,10 +54,10 @@ function z({
       className: r(
         "relative flex items-center gap-2 rounded-sm px-2 py-1.5",
         "text-sm outline-hidden select-none",
-        "focus:bg-accent focus:text-accent-foreground cursor-default",
+        "focus:bg-accent-1 focus:text-accent-foreground cursor-default",
         "data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8",
-        "data-[variant=destructive]:text-destructive data-[variant=destructive]:focus:bg-destructive/10 data-[variant=destructive]:focus:text-destructive data-[variant=destructive]:*:[svg]:!text-destructive",
-        "dark:data-[variant=destructive]:focus:bg-destructive/20",
+        "data-[variant=destructive]:text-error data-[variant=destructive]:focus:bg-error/10 data-[variant=destructive]:focus:text-error data-[variant=destructive]:*:[svg]:!text-error",
+        "dark:data-[variant=destructive]:focus:bg-error/20",
         "[&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         e
       ),
@@ -78,7 +78,7 @@ function D({
       className: r(
         "relative flex items-center gap-2 rounded-sm py-1.5 pr-2 pl-8",
         "text-sm outline-hidden select-none",
-        "focus:bg-accent focus:text-accent-foreground cursor-default",
+        "focus:bg-accent-1 focus:text-accent-foreground cursor-default",
         "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
         "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         e
@@ -107,7 +107,7 @@ function _({
       className: r(
         "relative flex items-center gap-2 rounded-sm py-1.5 pr-2 pl-8",
         "text-sm outline-hidden select-none",
-        "focus:bg-accent focus:text-accent-foreground cursor-default",
+        "focus:bg-accent-1 focus:text-accent-foreground cursor-default",
         "data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
         "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         e
@@ -172,8 +172,8 @@ function C({
       className: r(
         "flex items-center gap-2 rounded-sm px-2 py-1.5",
         "text-sm outline-hidden select-none",
-        "focus:bg-accent focus:text-accent-foreground cursor-default",
-        "data-[state=open]:bg-accent data-[state=open]:text-accent-foreground data-[inset]:pl-8",
+        "focus:bg-accent-1 focus:text-accent-foreground cursor-default",
+        "data-[state=open]:bg-accent-1 data-[state=open]:text-accent-foreground data-[inset]:pl-8",
         "[&_svg:not([class*='text-'])]:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
         e
       ),

package/dist/components/field/field.js

@@ -46,7 +46,7 @@ function y({ className: t, ...e }) {
     }
   );
 }
-const g = c("group/field flex w-full gap-3 data-[invalid=true]:text-destructive", {
+const g = c("group/field flex w-full gap-3 data-[invalid=true]:text-error", {
   variants: {
     orientation: {
       vertical: ["flex-col [&>*]:w-full [&>.sr-only]:w-auto"],
@@ -165,26 +165,17 @@ function V({
   className: t,
   children: e,
   errors: o,
-  ...s
+  ...n
 }) {
   const i = u(() => {
     if (e)
       return e;
     if (!o?.length)
       return null;
-    const r = [...new Map(o.map((d) => [d?.message, d])).values()];
-    return r?.length == 1 ? r[0]?.message : /* @__PURE__ */ a("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: r.map((d, n) => d?.message && /* @__PURE__ */ a("li", { children: d.message }, n)) });
+    const d = [...new Map(o.map((r) => [r?.message, r])).values()];
+    return d?.length == 1 ? d[0]?.message : /* @__PURE__ */ a("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: d.map((r, s) => r?.message && /* @__PURE__ */ a("li", { children: r.message }, s)) });
   }, [e, o]);
-  return i ? /* @__PURE__ */ a(
-    "div",
-    {
-      role: "alert",
-      "data-slot": "field-error",
-      className: l("text-destructive text-sm font-normal", t),
-      ...s,
-      children: i
-    }
-  ) : null;
+  return i ? /* @__PURE__ */ a("div", { role: "alert", "data-slot": "field-error", className: l("text-error text-sm font-normal", t), ...n, children: i }) : null;
 }
 export {
   L as Field,

package/dist/components/form/form.d.ts

@@ -50,4 +50,4 @@ declare function FormControl({ ...props }: React.ComponentProps<typeof Slot>): i
 declare function FormDescription({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element;
 /** 폼 필드의 유효성 검증 메시지 컴포넌트입니다. */
 declare function FormMessage({ className, ...props }: React.ComponentProps<"p">): import("react/jsx-runtime").JSX.Element | null;
-export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField, };
+export { useFormField, Form, FormItem, FormLabel, FormControl, FormDescription, FormMessage, FormField };

package/dist/components/form/form.js

@@ -4,15 +4,13 @@ import { Slot as f } from "@radix-ui/react-slot";
 import { FormProvider as u, useFormContext as F, useFormState as x, Controller as I } from "react-hook-form";
 import { cn as a } from "../../lib/utils.js";
 import { Label as g } from "../label/label.js";
-const S = u, c = s.createContext(
-  {}
-), $ = ({
+const S = u, c = s.createContext({}), $ = ({
   ...e
 }) => /* @__PURE__ */ m(c.Provider, { value: { name: e.name }, children: /* @__PURE__ */ m(I, { ...e }) }), d = () => {
-  const e = s.useContext(c), t = s.useContext(l), { getFieldState: r } = F(), o = x({ name: e.name }), n = r(e.name, o);
+  const e = s.useContext(c), r = s.useContext(l), { getFieldState: t } = F(), o = x({ name: e.name }), n = t(e.name, o);
   if (!e)
     throw new Error("useFormField should be used within <FormField>");
-  const { id: i } = t;
+  const { id: i } = r;
   return {
     id: i,
     name: e.name,
@@ -21,73 +19,52 @@ const S = u, c = s.createContext(
     formMessageId: `${i}-form-item-message`,
     ...n
   };
-}, l = s.createContext(
-  {}
-);
-function D({ className: e, ...t }) {
-  const r = s.useId();
-  return /* @__PURE__ */ m(l.Provider, { value: { id: r }, children: /* @__PURE__ */ m(
-    "div",
-    {
-      "data-slot": "form-item",
-      className: a("grid gap-2", e),
-      ...t
-    }
-  ) });
+}, l = s.createContext({});
+function D({ className: e, ...r }) {
+  const t = s.useId();
+  return /* @__PURE__ */ m(l.Provider, { value: { id: t }, children: /* @__PURE__ */ m("div", { "data-slot": "form-item", className: a("grid gap-2", e), ...r }) });
 }
-function M({
-  className: e,
-  ...t
-}) {
-  const { error: r, formItemId: o } = d();
+function M({ className: e, ...r }) {
+  const { error: t, formItemId: o } = d();
   return /* @__PURE__ */ m(
     g,
     {
       "data-slot": "form-label",
-      "data-error": !!r,
-      className: a("data-[error=true]:text-destructive", e),
+      "data-error": !!t,
+      className: a("data-[error=true]:text-error", e),
       htmlFor: o,
-      ...t
+      ...r
     }
   );
 }
 function N({ ...e }) {
-  const { error: t, formItemId: r, formDescriptionId: o, formMessageId: n } = d();
+  const { error: r, formItemId: t, formDescriptionId: o, formMessageId: n } = d();
   return /* @__PURE__ */ m(
     f,
     {
       "data-slot": "form-control",
-      id: r,
-      "aria-describedby": t ? `${o} ${n}` : `${o}`,
-      "aria-invalid": !!t,
+      id: t,
+      "aria-describedby": r ? `${o} ${n}` : `${o}`,
+      "aria-invalid": !!r,
       ...e
     }
   );
 }
-function w({ className: e, ...t }) {
-  const { formDescriptionId: r } = d();
+function w({ className: e, ...r }) {
+  const { formDescriptionId: t } = d();
   return /* @__PURE__ */ m(
     "p",
     {
       "data-slot": "form-description",
-      id: r,
+      id: t,
       className: a("text-muted-foreground text-sm", e),
-      ...t
+      ...r
     }
   );
 }
-function P({ className: e, ...t }) {
-  const { error: r, formMessageId: o } = d(), n = r ? String(r?.message ?? "") : t.children;
-  return n ? /* @__PURE__ */ m(
-    "p",
-    {
-      "data-slot": "form-message",
-      id: o,
-      className: a("text-destructive text-sm", e),
-      ...t,
-      children: n
-    }
-  ) : null;
+function P({ className: e, ...r }) {
+  const { error: t, formMessageId: o } = d(), n = t ? String(t?.message ?? "") : r.children;
+  return n ? /* @__PURE__ */ m("p", { "data-slot": "form-message", id: o, className: a("text-error text-sm", e), ...r, children: n }) : null;
 }
 export {
   S as Form,

package/dist/components/input/input.js

@@ -1,19 +1,19 @@
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as o } from "react/jsx-runtime";
 import "react";
 import { cn as n } from "../../lib/utils.js";
-function l({ className: e, type: i, ...r }) {
-  return /* @__PURE__ */ t(
+function l({ className: r, type: e, ...i }) {
+  return /* @__PURE__ */ o(
     "input",
     {
-      type: i,
+      type: e,
       "data-slot": "input",
       className: n(
         "file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
         "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",
-        e
+        "aria-invalid:ring-error/20 dark:aria-invalid:ring-error/40 aria-invalid:border-error",
+        r
       ),
-      ...r
+      ...i
     }
   );
 }