@sth87/shadcn-design-system 0.0.35 → 0.1.0

package/dist/esm/packages/ui/src/components/scroll-area.js

@@ -1,61 +1,61 @@
-import { jsxs as s, jsx as l } from "react/jsx-runtime";
-import * as o from "@radix-ui/react-scroll-area";
-import { cn as t } from "../lib/utils.js";
-function b({
-  className: e,
+import { jsxs as t, jsx as s } from "react/jsx-runtime";
+import * as l from "@radix-ui/react-scroll-area";
+import { cn as a } from "../lib/utils.js";
+function i({
+  className: o,
   children: r,
-  ...a
+  ...e
 }) {
-  return /* @__PURE__ */ s(
-    o.Root,
+  return /* @__PURE__ */ t(
+    l.Root,
     {
       "data-slot": "scroll-area",
-      className: t("relative", e),
-      ...a,
+      className: a("ds:relative", o),
+      ...e,
       children: [
-        /* @__PURE__ */ l(
-          o.Viewport,
+        /* @__PURE__ */ s(
+          l.Viewport,
           {
             "data-slot": "scroll-area-viewport",
-            className: "size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1 focus-visible:ring-ring/50 [scrollbar-width:thin] [scrollbar-color:transparent_transparent] hover:[scrollbar-color:hsl(var(--border))_transparent] [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar]:h-2 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded hover:[&::-webkit-scrollbar-thumb]:bg-border",
+            className: "ds:size-full ds:rounded-[inherit] ds:transition-[color,box-shadow] ds:outline-none ds:focus-visible:ring-[3px] ds:focus-visible:outline-1 ds:focus-visible:ring-ring/50 ds:[scrollbar-width:thin] ds:[scrollbar-color:transparent_transparent] ds:hover:[scrollbar-color:hsl(var(--border))_transparent] ds:[&::-webkit-scrollbar]:w-2 ds:[&::-webkit-scrollbar]:h-2 ds:[&::-webkit-scrollbar-track]:bg-transparent ds:[&::-webkit-scrollbar-thumb]:bg-transparent ds:[&::-webkit-scrollbar-thumb]:rounded ds:hover:[&::-webkit-scrollbar-thumb]:bg-border",
             children: r
           }
         ),
-        /* @__PURE__ */ l(c, {}),
-        /* @__PURE__ */ l(o.Corner, {})
+        /* @__PURE__ */ s(d, {}),
+        /* @__PURE__ */ s(l.Corner, {})
       ]
     }
   );
 }
-function c({
-  className: e,
+function d({
+  className: o,
   orientation: r = "vertical",
-  ...a
+  ...e
 }) {
-  return /* @__PURE__ */ l(
-    o.ScrollAreaScrollbar,
+  return /* @__PURE__ */ s(
+    l.ScrollAreaScrollbar,
     {
       "data-slot": "scroll-area-scrollbar",
       orientation: r,
-      className: t(
-        "flex touch-none p-px transition-colors select-none",
-        r === "vertical" && "h-full w-2.5 border-l border-l-transparent",
-        r === "horizontal" && "h-2.5 flex-col border-t border-t-transparent",
-        e
+      className: a(
+        "ds:flex ds:touch-none ds:p-px ds:transition-colors ds:select-none",
+        r === "vertical" && "ds:h-full ds:w-2.5 ds:border-l ds:border-l-transparent",
+        r === "horizontal" && "ds:h-2.5 ds:flex-col ds:border-t ds:border-t-transparent",
+        o
       ),
-      ...a,
-      children: /* @__PURE__ */ l(
-        o.ScrollAreaThumb,
+      ...e,
+      children: /* @__PURE__ */ s(
+        l.ScrollAreaThumb,
         {
           "data-slot": "scroll-area-thumb",
-          className: "bg-border relative flex-1 rounded-full"
+          className: "ds:bg-border ds:relative ds:flex-1 ds:rounded-full"
         }
       )
     }
   );
 }
 export {
-  b as ScrollArea,
-  c as ScrollBar
+  i as ScrollArea,
+  d as ScrollBar
 };
 //# sourceMappingURL=scroll-area.js.map

package/dist/esm/packages/ui/src/components/scroll-area.js.map

@@ -1 +1 @@
-{"version":3,"file":"scroll-area.js","sources":["../../../../../../../../packages/ui/src/components/scroll-area.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"size-full rounded-[inherit] transition-[color,box-shadow] outline-none focus-visible:ring-[3px] focus-visible:outline-1 focus-visible:ring-ring/50 [scrollbar-width:thin] [scrollbar-color:transparent_transparent] hover:[scrollbar-color:hsl(var(--border))_transparent] [&::-webkit-scrollbar]:w-2 [&::-webkit-scrollbar]:h-2 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded hover:[&::-webkit-scrollbar-thumb]:bg-border\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\nfunction ScrollBar({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"flex touch-none p-px transition-colors select-none\",\n        orientation === \"vertical\" &&\n          \"h-full w-2.5 border-l border-l-transparent\",\n        orientation === \"horizontal\" &&\n          \"h-2.5 flex-col border-t border-t-transparent\",\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"bg-border relative flex-1 rounded-full\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"names":["ScrollArea","className","children","props","jsxs","ScrollAreaPrimitive","cn","jsx","ScrollBar","orientation"],"mappings":";;;AAOA,SAASA,EAAW;AAAA,EAClB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAA0D;AACxD,SACE,gBAAAC;AAAA,IAACC,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,YAAYL,CAAS;AAAA,MAClC,GAAGE;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACF,EAAoB;AAAA,UAApB;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAET,UAAAH;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFM,GAAA,EAAU;AAAA,QACX,gBAAAD,EAACF,EAAoB,QAApB,CAAA,CAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AAEA,SAASG,EAAU;AAAA,EACjB,WAAAP;AAAA,EACA,aAAAQ,IAAc;AAAA,EACd,GAAGN;AACL,GAAyE;AACvE,SACE,gBAAAI;AAAA,IAACF,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,aAAAI;AAAA,MACA,WAAWH;AAAA,QACT;AAAA,QACAG,MAAgB,cACd;AAAA,QACFA,MAAgB,gBACd;AAAA,QACFR;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEJ,UAAA,gBAAAI;AAAA,QAACF,EAAoB;AAAA,QAApB;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"scroll-area.js","sources":["../../../../../../../../packages/ui/src/components/scroll-area.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as ScrollAreaPrimitive from \"@radix-ui/react-scroll-area\";\n\nimport { cn } from \"@dsui/ui/lib/utils\";\n\nfunction ScrollArea({\n  className,\n  children,\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.Root>) {\n  return (\n    <ScrollAreaPrimitive.Root\n      data-slot=\"scroll-area\"\n      className={cn(\"ds:relative\", className)}\n      {...props}\n    >\n      <ScrollAreaPrimitive.Viewport\n        data-slot=\"scroll-area-viewport\"\n        className=\"ds:size-full ds:rounded-[inherit] ds:transition-[color,box-shadow] ds:outline-none ds:focus-visible:ring-[3px] ds:focus-visible:outline-1 ds:focus-visible:ring-ring/50 ds:[scrollbar-width:thin] ds:[scrollbar-color:transparent_transparent] ds:hover:[scrollbar-color:hsl(var(--border))_transparent] ds:[&::-webkit-scrollbar]:w-2 ds:[&::-webkit-scrollbar]:h-2 ds:[&::-webkit-scrollbar-track]:bg-transparent ds:[&::-webkit-scrollbar-thumb]:bg-transparent ds:[&::-webkit-scrollbar-thumb]:rounded ds:hover:[&::-webkit-scrollbar-thumb]:bg-border\"\n      >\n        {children}\n      </ScrollAreaPrimitive.Viewport>\n      <ScrollBar />\n      <ScrollAreaPrimitive.Corner />\n    </ScrollAreaPrimitive.Root>\n  );\n}\n\nfunction ScrollBar({\n  className,\n  orientation = \"vertical\",\n  ...props\n}: React.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>) {\n  return (\n    <ScrollAreaPrimitive.ScrollAreaScrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        \"ds:flex ds:touch-none ds:p-px ds:transition-colors ds:select-none\",\n        orientation === \"vertical\" &&\n          \"ds:h-full ds:w-2.5 ds:border-l ds:border-l-transparent\",\n        orientation === \"horizontal\" &&\n          \"ds:h-2.5 ds:flex-col ds:border-t ds:border-t-transparent\",\n        className\n      )}\n      {...props}\n    >\n      <ScrollAreaPrimitive.ScrollAreaThumb\n        data-slot=\"scroll-area-thumb\"\n        className=\"ds:bg-border ds:relative ds:flex-1 ds:rounded-full\"\n      />\n    </ScrollAreaPrimitive.ScrollAreaScrollbar>\n  );\n}\n\nexport { ScrollArea, ScrollBar };\n"],"names":["ScrollArea","className","children","props","jsxs","ScrollAreaPrimitive","cn","jsx","ScrollBar","orientation"],"mappings":";;;AAOA,SAASA,EAAW;AAAA,EAClB,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GAA0D;AACxD,SACE,gBAAAC;AAAA,IAACC,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,eAAeL,CAAS;AAAA,MACrC,GAAGE;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAI;AAAA,UAACF,EAAoB;AAAA,UAApB;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAET,UAAAH;AAAA,UAAA;AAAA,QAAA;AAAA,0BAEFM,GAAA,EAAU;AAAA,QACX,gBAAAD,EAACF,EAAoB,QAApB,CAAA,CAA2B;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGlC;AAEA,SAASG,EAAU;AAAA,EACjB,WAAAP;AAAA,EACA,aAAAQ,IAAc;AAAA,EACd,GAAGN;AACL,GAAyE;AACvE,SACE,gBAAAI;AAAA,IAACF,EAAoB;AAAA,IAApB;AAAA,MACC,aAAU;AAAA,MACV,aAAAI;AAAA,MACA,WAAWH;AAAA,QACT;AAAA,QACAG,MAAgB,cACd;AAAA,QACFA,MAAgB,gBACd;AAAA,QACFR;AAAA,MAAA;AAAA,MAED,GAAGE;AAAA,MAEJ,UAAA,gBAAAI;AAAA,QAACF,EAAoB;AAAA,QAApB;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,QAAA;AAAA,MAAA;AAAA,IACZ;AAAA,EAAA;AAGN;"}

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

@@ -1,4 +1,4 @@
-import { jsx as o, jsxs as u, Fragment as O } from "react/jsx-runtime";
+import { jsx as r, jsxs as u, Fragment as O } from "react/jsx-runtime";
 import { ChevronUp as W, ChevronDown as D, XIcon as E, CheckIcon as F } from "lucide-react";
 import { cva as G } from "class-variance-authority";
 import { cn as v } from "../lib/utils.js";
@@ -9,21 +9,21 @@ import { createContext as K, useState as N, useCallback as V, useRef as j, useEf
 import { Badge as A } from "./badge.js";
 import { Label as Z } from "./label.js";
 const $ = G(
-  "flex h-auto w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground dark:bg-background dark:hover:bg-input/50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground",
+  "ds:flex ds:h-auto ds:w-fit ds:items-center ds:justify-between ds:gap-2 ds:overflow-hidden ds:rounded-md ds:border ds:bg-transparent ds:shadow-xs ds:transition-[color,box-shadow] ds:outline-none ds:focus-visible:ring-[3px] ds:disabled:cursor-not-allowed ds:disabled:opacity-50 ds:data-[placeholder]:text-muted-foreground ds:dark:bg-background ds:dark:hover:bg-input/50 ds:[&_svg]:pointer-events-none ds:[&_svg]:shrink-0 ds:[&_svg:not([class*='size-'])]:size-4 ds:[&_svg:not([class*='text-'])]:text-muted-foreground",
   {
     variants: {
       size: {
-        xs: "min-h-6 text-xs px-2 py-0.5",
-        sm: "min-h-8 text-sm px-2.5 py-1",
-        normal: "min-h-9 px-3 py-1.5",
-        lg: "min-h-11 px-4 py-2",
-        xl: "min-h-14 px-5 py-3"
+        xs: "ds:min-h-6 ds:text-xs ds:px-2 ds:py-0.5",
+        sm: "ds:min-h-8 ds:text-sm ds:px-2.5 ds:py-1",
+        normal: "ds:min-h-9 ds:px-3 ds:py-1.5",
+        lg: "ds:min-h-11 ds:px-4 ds:py-2",
+        xl: "ds:min-h-14 ds:px-5 ds:py-3"
       },
       state: {
-        default: "border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40",
-        success: "border-success ring-success/30 focus-visible:border-success focus-visible:ring-success/50",
-        error: "border-destructive ring-destructive/30 focus-visible:border-destructive focus-visible:ring-destructive/50",
-        warning: "border-warning ring-warning/30 focus-visible:border-warning focus-visible:ring-warning/50"
+        default: "ds:border-input ds:focus-visible:border-ring ds:focus-visible:ring-ring/50 ds:aria-invalid:border-destructive ds:aria-invalid:ring-destructive/20 ds:dark:aria-invalid:ring-destructive/40",
+        success: "ds:border-success ds:ring-success/30 ds:focus-visible:border-success ds:focus-visible:ring-success/50",
+        error: "ds:border-destructive ds:ring-destructive/30 ds:focus-visible:border-destructive ds:focus-visible:ring-destructive/50",
+        warning: "ds:border-warning ds:ring-warning/30 ds:focus-visible:border-warning ds:focus-visible:ring-warning/50"
       }
     },
     defaultVariants: {
@@ -32,78 +32,78 @@ const $ = G(
     }
   }
 ), _ = K(null);
-function ae({
+function le({
   children: e,
-  values: t,
-  defaultValues: i,
-  onValuesChange: n
+  values: s,
+  defaultValues: o,
+  onValuesChange: t
 }) {
-  const [c, m] = N(!1), [l, x] = N(
-    new Set(t ?? i)
-  ), w = t ? new Set(t) : l, [f, b] = N(/* @__PURE__ */ new Map());
-  function y(d) {
+  const [a, m] = N(!1), [i, x] = N(
+    new Set(s ?? o)
+  ), w = s ? new Set(s) : i, [f, b] = N(/* @__PURE__ */ new Map());
+  function y(c) {
     const p = (g) => {
-      const r = new Set(g);
-      return r.has(d) ? r.delete(d) : r.add(d), r;
+      const n = new Set(g);
+      return n.has(c) ? n.delete(c) : n.add(c), n;
     };
-    x(p), n?.([...p(w)]);
+    x(p), t?.([...p(w)]);
   }
-  const C = V((d, p) => {
-    b((g) => g.get(d) === p ? g : new Map(g).set(d, p));
+  const C = V((c, p) => {
+    b((g) => g.get(c) === p ? g : new Map(g).set(c, p));
   }, []);
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ r(
     _,
     {
       value: {
-        open: c,
+        open: a,
         setOpen: m,
         selectedValues: w,
         toggleValue: y,
         items: f,
         onItemAdded: C
       },
-      children: /* @__PURE__ */ o(X, { open: c, onOpenChange: m, children: e })
+      children: /* @__PURE__ */ r(X, { open: a, onOpenChange: m, children: e })
     }
   );
 }
-function ce({
+function ae({
   className: e,
-  dropdownClassName: t,
-  children: i,
-  size: n,
-  state: c = "default",
+  dropdownClassName: s,
+  children: o,
+  size: t,
+  state: a = "default",
   ...m
 }) {
-  const { open: l } = k();
-  return /* @__PURE__ */ o(B, { asChild: !0, children: /* @__PURE__ */ u(
+  const { open: i } = k();
+  return /* @__PURE__ */ r(B, { asChild: !0, children: /* @__PURE__ */ u(
     Z,
     {
-      className: v($({ size: n, state: c }), e),
+      className: v($({ size: t, state: a }), e),
       children: [
-        i,
-        l && /* @__PURE__ */ o(
+        o,
+        i && /* @__PURE__ */ r(
           W,
           {
             className: v(
-              "z-10 opacity-50",
+              "ds:z-10 ds:opacity-50",
               {
-                "size-4": n === "sm" || n === "xs",
-                "size-5": n === "lg" || n === "xl"
+                "ds:size-4": t === "sm" || t === "xs",
+                "ds:size-5": t === "lg" || t === "xl"
               },
-              t
+              s
             )
           }
         ),
-        !l && /* @__PURE__ */ o(
+        !i && /* @__PURE__ */ r(
           D,
           {
             className: v(
-              "z-10 opacity-50",
+              "ds:z-10 ds:opacity-50",
               {
-                "size-4": n === "sm" || n === "xs",
-                "size-5": n === "lg" || n === "xl"
+                "ds:size-4": t === "sm" || t === "xs",
+                "ds:size-5": t === "lg" || t === "xl"
               },
-              t
+              s
             )
           }
         )
@@ -111,74 +111,74 @@ function ce({
     }
   ) });
 }
-function de({
+function ce({
   placeholder: e,
-  clickToRemove: t = !0,
-  className: i,
-  overflowBehavior: n = "wrap-when-open",
-  ...c
+  clickToRemove: s = !0,
+  className: o,
+  overflowBehavior: t = "wrap-when-open",
+  ...a
 }) {
-  const { selectedValues: m, toggleValue: l, items: x, open: w } = k(), [f, b] = N(0), y = j(null), C = j(null), d = n === "wrap" || n === "wrap-when-open" && w, p = V(() => {
+  const { selectedValues: m, toggleValue: i, items: x, open: w } = k(), [f, b] = N(0), y = j(null), C = j(null), c = t === "wrap" || t === "wrap-when-open" && w, p = V(() => {
     if (y.current == null) return;
-    const r = y.current, s = C.current, h = r.querySelectorAll(
+    const n = y.current, d = C.current, h = n.querySelectorAll(
       "[data-selected-item]"
     );
-    s != null && (s.style.display = "none"), h.forEach((a) => a.style.removeProperty("display"));
+    d != null && (d.style.display = "none"), h.forEach((l) => l.style.removeProperty("display"));
     let S = 0;
-    for (let a = h.length - 1; a >= 0; a--) {
-      const M = h[a];
-      if (r.scrollWidth <= r.clientWidth)
+    for (let l = h.length - 1; l >= 0; l--) {
+      const M = h[l];
+      if (n.scrollWidth <= n.clientWidth)
         break;
-      S = h.length - a, M.style.display = "none", s?.style.removeProperty("display");
+      S = h.length - l, M.style.display = "none", d?.style.removeProperty("display");
     }
     b(S);
   }, []), g = V(
-    (r) => {
-      y.current = r;
-      const s = new ResizeObserver(p);
-      return s.observe(r), () => {
-        s.disconnect(), y.current = null;
+    (n) => {
+      y.current = n;
+      const d = new ResizeObserver(p);
+      return d.observe(n), () => {
+        d.disconnect(), y.current = null;
       };
     },
     [p]
   );
-  return m.size === 0 && e ? /* @__PURE__ */ o("span", { className: "min-w-0 overflow-hidden font-normal text-muted-foreground", children: e }) : /* @__PURE__ */ u(
+  return m.size === 0 && e ? /* @__PURE__ */ r("span", { className: "ds:min-w-0 ds:overflow-hidden ds:font-normal ds:text-muted-foreground", children: e }) : /* @__PURE__ */ u(
     "div",
     {
-      ...c,
+      ...a,
       ref: g,
       className: v(
-        "flex w-fit gap-1.5 overflow-hidden",
-        d && "h-full flex-wrap",
-        i
+        "ds:flex ds:w-fit ds:gap-1.5 ds:overflow-hidden",
+        c && "ds:h-full ds:flex-wrap",
+        o
       ),
       children: [
-        [...m].filter((r) => x.has(r)).map((r) => {
-          const s = x.get(r), h = (S) => {
-            S.stopPropagation(), l(r);
+        [...m].filter((n) => x.has(n)).map((n) => {
+          const d = x.get(n), h = (S) => {
+            S.stopPropagation(), i(n);
           };
-          if (P.isValidElement(s)) {
-            const S = typeof s.type == "string" && ["div", "span", "button", "a"].includes(s.type), a = s, M = S ? {
-              key: r,
-              onClick: t ? h : void 0,
+          if (P.isValidElement(d)) {
+            const S = typeof d.type == "string" && ["div", "span", "button", "a"].includes(d.type), l = d, M = S ? {
+              key: n,
+              onClick: s ? h : void 0,
               className: v(
-                a.props.className,
-                "group flex items-center gap-1 whitespace-nowrap hover:scale-105 transition-transform",
+                l.props.className,
+                "ds:group ds:flex ds:items-center ds:gap-1 ds:whitespace-nowrap ds:hover:scale-105 ds:transition-transform",
                 {
-                  "cursor-pointer": t
+                  "ds:cursor-pointer": s
                 }
               ),
               "data-selected-item": !0
             } : {
-              key: r,
+              key: n,
               "data-selected-item": !0
             };
             return P.cloneElement(
-              a,
+              l,
               M,
               /* @__PURE__ */ u(O, { children: [
-                a.props.children,
-                t && /* @__PURE__ */ o(E, { className: "size-2 text-muted-foreground group-hover:text-destructive" })
+                l.props.children,
+                s && /* @__PURE__ */ r(E, { className: "ds:size-2 ds:text-muted-foreground ds:group-hover:text-destructive" })
               ] })
             );
           }
@@ -187,21 +187,21 @@ function de({
             {
               variant: "outline",
               "data-selected-item": !0,
-              className: "group flex items-center gap-1",
-              onClick: t ? h : void 0,
+              className: "ds:group ds:flex ds:items-center ds:gap-1",
+              onClick: s ? h : void 0,
               children: [
-                s,
-                t && /* @__PURE__ */ o(E, { className: "size-2 text-muted-foreground group-hover:text-destructive" })
+                d,
+                s && /* @__PURE__ */ r(E, { className: "ds:size-2 ds:text-muted-foreground ds:group-hover:text-destructive" })
               ]
             },
-            r
+            n
           );
         }),
         /* @__PURE__ */ u(
           A,
           {
             style: {
-              display: f > 0 && !d ? "block" : "none"
+              display: f > 0 && !c ? "block" : "none"
             },
             variant: "outline",
             ref: C,
@@ -217,58 +217,58 @@ function de({
 }
 function ue({
   search: e = !0,
-  children: t,
-  ...i
+  children: s,
+  ...o
 }) {
-  const n = typeof e == "object" ? !0 : e;
+  const t = typeof e == "object" ? !0 : e;
   return /* @__PURE__ */ u(O, { children: [
-    /* @__PURE__ */ o("div", { style: { display: "none" }, children: /* @__PURE__ */ o(I, { children: /* @__PURE__ */ o(z, { children: t }) }) }),
-    /* @__PURE__ */ o(J, { className: "min-w-[var(--radix-popover-trigger-width)] p-0", children: /* @__PURE__ */ u(I, { ...i, children: [
-      n ? /* @__PURE__ */ o(
+    /* @__PURE__ */ r("div", { style: { display: "none" }, children: /* @__PURE__ */ r(I, { children: /* @__PURE__ */ r(z, { children: s }) }) }),
+    /* @__PURE__ */ r(J, { className: "ds:min-w-[var(--radix-popover-trigger-width)] ds:p-0", children: /* @__PURE__ */ u(I, { ...o, children: [
+      t ? /* @__PURE__ */ r(
         R,
         {
           placeholder: typeof e == "object" ? e.placeholder : void 0
         }
-      ) : /* @__PURE__ */ o("button", { autoFocus: !0, className: "sr-only" }),
+      ) : /* @__PURE__ */ r("button", { autoFocus: !0, className: "ds:sr-only" }),
       /* @__PURE__ */ u(z, { children: [
-        n && /* @__PURE__ */ o(q, { children: typeof e == "object" ? e.emptyMessage : void 0 }),
-        t
+        t && /* @__PURE__ */ r(q, { children: typeof e == "object" ? e.emptyMessage : void 0 }),
+        s
       ] })
     ] }) })
   ] });
 }
 function me({
   value: e,
-  children: t,
-  badgeLabel: i,
-  onSelect: n,
-  icon: c,
+  children: s,
+  badgeLabel: o,
+  onSelect: t,
+  icon: a,
   tagRender: m,
-  ...l
+  ...i
 }) {
   const { toggleValue: x, selectedValues: w, onItemAdded: f } = k(), b = w.has(e);
   return Q(() => {
-    f(e, i ?? t);
-  }, [e, t, f, i]), /* @__PURE__ */ u(
+    f(e, o ?? s);
+  }, [e, s, f, o]), /* @__PURE__ */ u(
     L,
     {
-      ...l,
-      onSelect: l?.disabled ? void 0 : () => {
-        x(e), n?.(e);
+      ...i,
+      onSelect: i?.disabled ? void 0 : () => {
+        x(e), t?.(e);
       },
       className: v(
-        l?.disabled && "opacity-50 cursor-not-allowed grayscale",
-        b && "bg-primary/10 dark:bg-primary/20"
+        i?.disabled && "ds:opacity-50 ds:cursor-not-allowed ds:grayscale",
+        b && "ds:bg-primary/10 ds:dark:bg-primary/20"
       ),
       children: [
-        !m && c && /* @__PURE__ */ o("span", { className: "mr-2 max-w-4 max-h-4", children: c }),
-        t,
-        /* @__PURE__ */ o(
+        !m && a && /* @__PURE__ */ r("span", { className: "ds:mr-2 ds:max-w-4 ds:max-h-4", children: a }),
+        s,
+        /* @__PURE__ */ r(
           F,
           {
             className: v(
-              "mr-2 ml-auto size-4",
-              b ? "opacity-100" : "opacity-0"
+              "ds:mr-2 ds:ml-auto ds:size-4",
+              b ? "ds:opacity-100" : "ds:opacity-0"
             )
           }
         )
@@ -277,10 +277,10 @@ function me({
   );
 }
 function pe(e) {
-  return /* @__PURE__ */ o(H, { ...e });
+  return /* @__PURE__ */ r(H, { ...e });
 }
 function fe(e) {
-  return /* @__PURE__ */ o(U, { ...e });
+  return /* @__PURE__ */ r(U, { ...e });
 }
 function k() {
   const e = Y(_);
@@ -291,12 +291,12 @@ function k() {
   return e;
 }
 export {
-  ae as MultiSelect,
+  le as MultiSelect,
   ue as MultiSelectContent,
   pe as MultiSelectGroup,
   me as MultiSelectItem,
   fe as MultiSelectSeparator,
-  ce as MultiSelectTrigger,
-  de as MultiSelectValue
+  ae as MultiSelectTrigger,
+  ce as MultiSelectValue
 };
 //# sourceMappingURL=select.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"select.js","sources":["../../../../../../../../packages/ui/src/components/select.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon, ChevronDown, ChevronUp, XIcon } from \"lucide-react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"./command\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\nimport * as React from \"react\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Badge } from \"./badge\";\nimport { Label } from \"./label\";\n\nconst multiSelectTriggerVariants = cva(\n  \"flex h-auto w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground dark:bg-background dark:hover:bg-input/50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 [&_svg:not([class*='text-'])]:text-muted-foreground\",\n  {\n    variants: {\n      size: {\n        xs: \"min-h-6 text-xs px-2 py-0.5\",\n        sm: \"min-h-8 text-sm px-2.5 py-1\",\n        normal: \"min-h-9 px-3 py-1.5\",\n        lg: \"min-h-11 px-4 py-2\",\n        xl: \"min-h-14 px-5 py-3\",\n      },\n      state: {\n        default:\n          \"border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40\",\n        success:\n          \"border-success ring-success/30 focus-visible:border-success focus-visible:ring-success/50\",\n        error:\n          \"border-destructive ring-destructive/30 focus-visible:border-destructive focus-visible:ring-destructive/50\",\n        warning:\n          \"border-warning ring-warning/30 focus-visible:border-warning focus-visible:ring-warning/50\",\n      },\n    },\n    defaultVariants: {\n      size: \"normal\",\n      state: \"default\",\n    },\n  }\n);\n\ntype MultiSelectContextType = {\n  open: boolean;\n  setOpen: (open: boolean) => void;\n  selectedValues: Set<string>;\n  toggleValue: (value: string) => void;\n  items: Map<string, ReactNode>;\n  onItemAdded: (value: string, label: ReactNode) => void;\n};\nconst MultiSelectContext = createContext<MultiSelectContextType | null>(null);\n\nexport function MultiSelect({\n  children,\n  values,\n  defaultValues,\n  onValuesChange,\n}: {\n  children: ReactNode;\n  values?: string[];\n  defaultValues?: string[];\n  onValuesChange?: (values: string[]) => void;\n}) {\n  const [open, setOpen] = useState(false);\n  const [internalValues, setInternalValues] = useState(\n    new Set<string>(values ?? defaultValues)\n  );\n  const selectedValues = values ? new Set(values) : internalValues;\n  const [items, setItems] = useState<Map<string, ReactNode>>(new Map());\n\n  function toggleValue(value: string) {\n    const getNewSet = (prev: Set<string>) => {\n      const newSet = new Set(prev);\n      if (newSet.has(value)) {\n        newSet.delete(value);\n      } else {\n        newSet.add(value);\n      }\n      return newSet;\n    };\n    setInternalValues(getNewSet);\n    onValuesChange?.([...getNewSet(selectedValues)]);\n  }\n\n  const onItemAdded = useCallback((value: string, label: ReactNode) => {\n    setItems((prev) => {\n      if (prev.get(value) === label) return prev;\n      return new Map(prev).set(value, label);\n    });\n  }, []);\n\n  return (\n    <MultiSelectContext\n      value={{\n        open,\n        setOpen,\n        selectedValues,\n        toggleValue,\n        items,\n        onItemAdded,\n      }}\n    >\n      <Popover open={open} onOpenChange={setOpen}>\n        {children}\n      </Popover>\n    </MultiSelectContext>\n  );\n}\n\nexport function MultiSelectTrigger({\n  className,\n  dropdownClassName,\n  children,\n  size,\n  state = \"default\",\n  ...props\n}: {\n  className?: string;\n  dropdownClassName?: string;\n  children?: ReactNode;\n  size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n  state?: \"default\" | \"success\" | \"error\" | \"warning\";\n} & Omit<ComponentPropsWithoutRef<typeof Button>, \"size\"> &\n  VariantProps<typeof multiSelectTriggerVariants>) {\n  const { open } = useMultiSelectContext();\n\n  return (\n    <PopoverTrigger asChild>\n      {/* <Button\n        {...props}\n        variant={props.variant ?? \"outline\"}\n        role={props.role ?? \"combobox\"}\n        aria-expanded={props[\"aria-expanded\"] ?? open}\n        className={cn(\n          multiSelectTriggerVariants({ size, state }),\n          \"whitespace-nowrap text-sm\",\n          className\n        )}\n      >\n        {children}\n        <ChevronsUpDownIcon className=\"size-4 shrink-0 opacity-50\" />\n      </Button> */}\n\n      <Label\n        className={cn(multiSelectTriggerVariants({ size, state }), className)}\n      >\n        {children}\n        {open && (\n          <ChevronUp\n            className={cn(\n              \"z-10 opacity-50\",\n              {\n                \"size-4\": size === \"sm\" || size === \"xs\",\n                \"size-5\": size === \"lg\" || size === \"xl\",\n              },\n              dropdownClassName\n            )}\n          />\n        )}\n        {!open && (\n          <ChevronDown\n            className={cn(\n              \"z-10 opacity-50\",\n              {\n                \"size-4\": size === \"sm\" || size === \"xs\",\n                \"size-5\": size === \"lg\" || size === \"xl\",\n              },\n              dropdownClassName\n            )}\n          />\n        )}\n      </Label>\n    </PopoverTrigger>\n  );\n}\n\nexport function MultiSelectValue({\n  placeholder,\n  clickToRemove = true,\n  className,\n  overflowBehavior = \"wrap-when-open\",\n  ...props\n}: {\n  placeholder?: string;\n  clickToRemove?: boolean;\n  overflowBehavior?: \"wrap\" | \"wrap-when-open\" | \"cutoff\";\n} & Omit<ComponentPropsWithoutRef<\"div\">, \"children\">) {\n  const { selectedValues, toggleValue, items, open } = useMultiSelectContext();\n  const [overflowAmount, setOverflowAmount] = useState(0);\n  const valueRef = useRef<HTMLDivElement>(null);\n  const overflowRef = useRef<HTMLDivElement>(null);\n\n  const shouldWrap =\n    overflowBehavior === \"wrap\" ||\n    (overflowBehavior === \"wrap-when-open\" && open);\n\n  const checkOverflow = useCallback(() => {\n    if (valueRef.current == null) return;\n\n    const containerElement = valueRef.current;\n    const overflowElement = overflowRef.current;\n    const items = containerElement.querySelectorAll<HTMLElement>(\n      \"[data-selected-item]\"\n    );\n\n    if (overflowElement != null) overflowElement.style.display = \"none\";\n    items.forEach((child) => child.style.removeProperty(\"display\"));\n    let amount = 0;\n    for (let i = items.length - 1; i >= 0; i--) {\n      const child = items[i]!;\n      if (containerElement.scrollWidth <= containerElement.clientWidth) {\n        break;\n      }\n      amount = items.length - i;\n      child.style.display = \"none\";\n      overflowElement?.style.removeProperty(\"display\");\n    }\n    setOverflowAmount(amount);\n  }, []);\n\n  const handleResize = useCallback(\n    (node: HTMLDivElement) => {\n      valueRef.current = node;\n\n      const observer = new ResizeObserver(checkOverflow);\n      observer.observe(node);\n\n      return () => {\n        observer.disconnect();\n        valueRef.current = null;\n      };\n    },\n    [checkOverflow]\n  );\n\n  if (selectedValues.size === 0 && placeholder) {\n    return (\n      <span className=\"min-w-0 overflow-hidden font-normal text-muted-foreground\">\n        {placeholder}\n      </span>\n    );\n  }\n\n  return (\n    <div\n      {...props}\n      ref={handleResize}\n      className={cn(\n        \"flex w-fit gap-1.5 overflow-hidden\",\n        shouldWrap && \"h-full flex-wrap\",\n        className\n      )}\n    >\n      {[...selectedValues]\n        .filter((value) => items.has(value))\n        .map((value) => {\n          const itemNode = items.get(value);\n          const removeHandler = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            toggleValue(value);\n          };\n\n          if (React.isValidElement(itemNode)) {\n            const isDomElement =\n              typeof itemNode.type === \"string\" &&\n              [\"div\", \"span\", \"button\", \"a\"].includes(itemNode.type);\n\n            const element = itemNode as React.ReactElement<any>;\n\n            const cloneProps = isDomElement\n              ? {\n                  key: value,\n                  onClick: clickToRemove ? removeHandler : undefined,\n                  className: cn(\n                    element.props.className,\n                    \"group flex items-center gap-1 whitespace-nowrap hover:scale-105 transition-transform\",\n                    {\n                      \"cursor-pointer\": clickToRemove,\n                    }\n                  ),\n                  \"data-selected-item\": true,\n                }\n              : {\n                  key: value,\n                  \"data-selected-item\": true,\n                };\n\n            return React.cloneElement(\n              element,\n              cloneProps,\n              <>\n                {element.props.children}\n                {clickToRemove && (\n                  <XIcon className=\"size-2 text-muted-foreground group-hover:text-destructive\" />\n                )}\n              </>\n            );\n          }\n\n          return (\n            <Badge\n              variant=\"outline\"\n              data-selected-item\n              className=\"group flex items-center gap-1\"\n              key={value}\n              onClick={clickToRemove ? removeHandler : undefined}\n            >\n              {itemNode}\n              {clickToRemove && (\n                <XIcon className=\"size-2 text-muted-foreground group-hover:text-destructive\" />\n              )}\n            </Badge>\n          );\n        })}\n\n      <Badge\n        style={{\n          display: overflowAmount > 0 && !shouldWrap ? \"block\" : \"none\",\n        }}\n        variant=\"outline\"\n        ref={overflowRef}\n      >\n        +{overflowAmount}\n      </Badge>\n    </div>\n  );\n}\n\nexport function MultiSelectContent({\n  search = true,\n  children,\n  ...props\n}: {\n  search?: boolean | { placeholder?: string; emptyMessage?: string };\n  children: ReactNode;\n} & Omit<ComponentPropsWithoutRef<typeof Command>, \"children\">) {\n  const canSearch = typeof search === \"object\" ? true : search;\n\n  return (\n    <>\n      <div style={{ display: \"none\" }}>\n        <Command>\n          <CommandList>{children}</CommandList>\n        </Command>\n      </div>\n      <PopoverContent className=\"min-w-[var(--radix-popover-trigger-width)] p-0\">\n        <Command {...props}>\n          {canSearch ? (\n            <CommandInput\n              placeholder={\n                typeof search === \"object\" ? search.placeholder : undefined\n              }\n            />\n          ) : (\n            <button autoFocus className=\"sr-only\" />\n          )}\n          <CommandList>\n            {canSearch && (\n              <CommandEmpty>\n                {typeof search === \"object\" ? search.emptyMessage : undefined}\n              </CommandEmpty>\n            )}\n            {children}\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </>\n  );\n}\n\nexport function MultiSelectItem({\n  value,\n  children,\n  badgeLabel,\n  onSelect,\n  icon,\n  tagRender,\n  ...props\n}: {\n  badgeLabel?: ReactNode;\n  value: string;\n  icon?: ReactNode;\n  tagRender?: boolean;\n} & Omit<ComponentPropsWithoutRef<typeof CommandItem>, \"value\">) {\n  const { toggleValue, selectedValues, onItemAdded } = useMultiSelectContext();\n  const isSelected = selectedValues.has(value);\n\n  useEffect(() => {\n    onItemAdded(value, badgeLabel ?? children);\n  }, [value, children, onItemAdded, badgeLabel]);\n\n  return (\n    <CommandItem\n      {...props}\n      onSelect={\n        props?.disabled\n          ? undefined\n          : () => {\n              toggleValue(value);\n              onSelect?.(value);\n            }\n      }\n      className={cn(\n        props?.disabled && \"opacity-50 cursor-not-allowed grayscale\",\n        isSelected && \"bg-primary/10 dark:bg-primary/20\"\n      )}\n    >\n      {!tagRender && icon && (\n        <span className=\"mr-2 max-w-4 max-h-4\">{icon}</span>\n      )}\n      {children}\n      <CheckIcon\n        className={cn(\n          \"mr-2 ml-auto size-4\",\n          isSelected ? \"opacity-100\" : \"opacity-0\"\n        )}\n      />\n    </CommandItem>\n  );\n}\n\nexport function MultiSelectGroup(\n  props: ComponentPropsWithoutRef<typeof CommandGroup>\n) {\n  return <CommandGroup {...props} />;\n}\n\nexport function MultiSelectSeparator(\n  props: ComponentPropsWithoutRef<typeof CommandSeparator>\n) {\n  return <CommandSeparator {...props} />;\n}\n\nfunction useMultiSelectContext() {\n  const context = useContext(MultiSelectContext);\n  if (context == null) {\n    throw new Error(\n      \"useMultiSelectContext must be used within a MultiSelectContext\"\n    );\n  }\n  return context;\n}\n"],"names":["multiSelectTriggerVariants","cva","MultiSelectContext","createContext","MultiSelect","children","values","defaultValues","onValuesChange","open","setOpen","useState","internalValues","setInternalValues","selectedValues","items","setItems","toggleValue","value","getNewSet","prev","newSet","onItemAdded","useCallback","label","jsx","Popover","MultiSelectTrigger","className","dropdownClassName","size","state","props","useMultiSelectContext","PopoverTrigger","jsxs","Label","cn","ChevronUp","ChevronDown","MultiSelectValue","placeholder","clickToRemove","overflowBehavior","overflowAmount","setOverflowAmount","valueRef","useRef","overflowRef","shouldWrap","checkOverflow","containerElement","overflowElement","child","amount","i","handleResize","node","observer","itemNode","removeHandler","e","React","isDomElement","element","cloneProps","Fragment","XIcon","Badge","MultiSelectContent","search","canSearch","Command","CommandList","PopoverContent","CommandInput","CommandEmpty","MultiSelectItem","badgeLabel","onSelect","icon","tagRender","isSelected","useEffect","CommandItem","CheckIcon","MultiSelectGroup","CommandGroup","MultiSelectSeparator","CommandSeparator","context","useContext"],"mappings":"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"}
+{"version":3,"file":"select.js","sources":["../../../../../../../../packages/ui/src/components/select.tsx"],"sourcesContent":["\"use client\";\n\nimport { CheckIcon, ChevronDown, ChevronUp, XIcon } from \"lucide-react\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n  CommandSeparator,\n} from \"./command\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\nimport * as React from \"react\";\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useEffect,\n  useRef,\n  useState,\n  type ComponentPropsWithoutRef,\n  type ReactNode,\n} from \"react\";\nimport { Badge } from \"./badge\";\nimport { Label } from \"./label\";\n\nconst multiSelectTriggerVariants = cva(\n  \"ds:flex ds:h-auto ds:w-fit ds:items-center ds:justify-between ds:gap-2 ds:overflow-hidden ds:rounded-md ds:border ds:bg-transparent ds:shadow-xs ds:transition-[color,box-shadow] ds:outline-none ds:focus-visible:ring-[3px] ds:disabled:cursor-not-allowed ds:disabled:opacity-50 ds:data-[placeholder]:text-muted-foreground ds:dark:bg-background ds:dark:hover:bg-input/50 ds:[&_svg]:pointer-events-none ds:[&_svg]:shrink-0 ds:[&_svg:not([class*='size-'])]:size-4 ds:[&_svg:not([class*='text-'])]:text-muted-foreground\",\n  {\n    variants: {\n      size: {\n        xs: \"ds:min-h-6 ds:text-xs ds:px-2 ds:py-0.5\",\n        sm: \"ds:min-h-8 ds:text-sm ds:px-2.5 ds:py-1\",\n        normal: \"ds:min-h-9 ds:px-3 ds:py-1.5\",\n        lg: \"ds:min-h-11 ds:px-4 ds:py-2\",\n        xl: \"ds:min-h-14 ds:px-5 ds:py-3\",\n      },\n      state: {\n        default:\n          \"ds:border-input ds:focus-visible:border-ring ds:focus-visible:ring-ring/50 ds:aria-invalid:border-destructive ds:aria-invalid:ring-destructive/20 ds:dark:aria-invalid:ring-destructive/40\",\n        success:\n          \"ds:border-success ds:ring-success/30 ds:focus-visible:border-success ds:focus-visible:ring-success/50\",\n        error:\n          \"ds:border-destructive ds:ring-destructive/30 ds:focus-visible:border-destructive ds:focus-visible:ring-destructive/50\",\n        warning:\n          \"ds:border-warning ds:ring-warning/30 ds:focus-visible:border-warning ds:focus-visible:ring-warning/50\",\n      },\n    },\n    defaultVariants: {\n      size: \"normal\",\n      state: \"default\",\n    },\n  }\n);\n\ntype MultiSelectContextType = {\n  open: boolean;\n  setOpen: (open: boolean) => void;\n  selectedValues: Set<string>;\n  toggleValue: (value: string) => void;\n  items: Map<string, ReactNode>;\n  onItemAdded: (value: string, label: ReactNode) => void;\n};\nconst MultiSelectContext = createContext<MultiSelectContextType | null>(null);\n\nexport function MultiSelect({\n  children,\n  values,\n  defaultValues,\n  onValuesChange,\n}: {\n  children: ReactNode;\n  values?: string[];\n  defaultValues?: string[];\n  onValuesChange?: (values: string[]) => void;\n}) {\n  const [open, setOpen] = useState(false);\n  const [internalValues, setInternalValues] = useState(\n    new Set<string>(values ?? defaultValues)\n  );\n  const selectedValues = values ? new Set(values) : internalValues;\n  const [items, setItems] = useState<Map<string, ReactNode>>(new Map());\n\n  function toggleValue(value: string) {\n    const getNewSet = (prev: Set<string>) => {\n      const newSet = new Set(prev);\n      if (newSet.has(value)) {\n        newSet.delete(value);\n      } else {\n        newSet.add(value);\n      }\n      return newSet;\n    };\n    setInternalValues(getNewSet);\n    onValuesChange?.([...getNewSet(selectedValues)]);\n  }\n\n  const onItemAdded = useCallback((value: string, label: ReactNode) => {\n    setItems((prev) => {\n      if (prev.get(value) === label) return prev;\n      return new Map(prev).set(value, label);\n    });\n  }, []);\n\n  return (\n    <MultiSelectContext\n      value={{\n        open,\n        setOpen,\n        selectedValues,\n        toggleValue,\n        items,\n        onItemAdded,\n      }}\n    >\n      <Popover open={open} onOpenChange={setOpen}>\n        {children}\n      </Popover>\n    </MultiSelectContext>\n  );\n}\n\nexport function MultiSelectTrigger({\n  className,\n  dropdownClassName,\n  children,\n  size,\n  state = \"default\",\n  ...props\n}: {\n  className?: string;\n  dropdownClassName?: string;\n  children?: ReactNode;\n  size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n  state?: \"default\" | \"success\" | \"error\" | \"warning\";\n} & Omit<ComponentPropsWithoutRef<typeof Button>, \"size\"> &\n  VariantProps<typeof multiSelectTriggerVariants>) {\n  const { open } = useMultiSelectContext();\n\n  return (\n    <PopoverTrigger asChild>\n      {/* <Button\n        {...props}\n        variant={props.variant ?? \"outline\"}\n        role={props.role ?? \"combobox\"}\n        aria-expanded={props[\"aria-expanded\"] ?? open}\n        className={cn(\n          multiSelectTriggerVariants({ size, state }),\n          \"whitespace-nowrap text-sm\",\n          className\n        )}\n      >\n        {children}\n        <ChevronsUpDownIcon className=\"size-4 shrink-0 opacity-50\" />\n      </Button> */}\n\n      <Label\n        className={cn(multiSelectTriggerVariants({ size, state }), className)}\n      >\n        {children}\n        {open && (\n          <ChevronUp\n            className={cn(\n              \"ds:z-10 ds:opacity-50\",\n              {\n                \"ds:size-4\": size === \"sm\" || size === \"xs\",\n                \"ds:size-5\": size === \"lg\" || size === \"xl\",\n              },\n              dropdownClassName\n            )}\n          />\n        )}\n        {!open && (\n          <ChevronDown\n            className={cn(\n              \"ds:z-10 ds:opacity-50\",\n              {\n                \"ds:size-4\": size === \"sm\" || size === \"xs\",\n                \"ds:size-5\": size === \"lg\" || size === \"xl\",\n              },\n              dropdownClassName\n            )}\n          />\n        )}\n      </Label>\n    </PopoverTrigger>\n  );\n}\n\nexport function MultiSelectValue({\n  placeholder,\n  clickToRemove = true,\n  className,\n  overflowBehavior = \"wrap-when-open\",\n  ...props\n}: {\n  placeholder?: string;\n  clickToRemove?: boolean;\n  overflowBehavior?: \"wrap\" | \"wrap-when-open\" | \"cutoff\";\n} & Omit<ComponentPropsWithoutRef<\"div\">, \"children\">) {\n  const { selectedValues, toggleValue, items, open } = useMultiSelectContext();\n  const [overflowAmount, setOverflowAmount] = useState(0);\n  const valueRef = useRef<HTMLDivElement>(null);\n  const overflowRef = useRef<HTMLDivElement>(null);\n\n  const shouldWrap =\n    overflowBehavior === \"wrap\" ||\n    (overflowBehavior === \"wrap-when-open\" && open);\n\n  const checkOverflow = useCallback(() => {\n    if (valueRef.current == null) return;\n\n    const containerElement = valueRef.current;\n    const overflowElement = overflowRef.current;\n    const items = containerElement.querySelectorAll<HTMLElement>(\n      \"[data-selected-item]\"\n    );\n\n    if (overflowElement != null) overflowElement.style.display = \"none\";\n    items.forEach((child) => child.style.removeProperty(\"display\"));\n    let amount = 0;\n    for (let i = items.length - 1; i >= 0; i--) {\n      const child = items[i]!;\n      if (containerElement.scrollWidth <= containerElement.clientWidth) {\n        break;\n      }\n      amount = items.length - i;\n      child.style.display = \"none\";\n      overflowElement?.style.removeProperty(\"display\");\n    }\n    setOverflowAmount(amount);\n  }, []);\n\n  const handleResize = useCallback(\n    (node: HTMLDivElement) => {\n      valueRef.current = node;\n\n      const observer = new ResizeObserver(checkOverflow);\n      observer.observe(node);\n\n      return () => {\n        observer.disconnect();\n        valueRef.current = null;\n      };\n    },\n    [checkOverflow]\n  );\n\n  if (selectedValues.size === 0 && placeholder) {\n    return (\n      <span className=\"ds:min-w-0 ds:overflow-hidden ds:font-normal ds:text-muted-foreground\">\n        {placeholder}\n      </span>\n    );\n  }\n\n  return (\n    <div\n      {...props}\n      ref={handleResize}\n      className={cn(\n        \"ds:flex ds:w-fit ds:gap-1.5 ds:overflow-hidden\",\n        shouldWrap && \"ds:h-full ds:flex-wrap\",\n        className\n      )}\n    >\n      {[...selectedValues]\n        .filter((value) => items.has(value))\n        .map((value) => {\n          const itemNode = items.get(value);\n          const removeHandler = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            toggleValue(value);\n          };\n\n          if (React.isValidElement(itemNode)) {\n            const isDomElement =\n              typeof itemNode.type === \"string\" &&\n              [\"div\", \"span\", \"button\", \"a\"].includes(itemNode.type);\n\n            const element = itemNode as React.ReactElement<any>;\n\n            const cloneProps = isDomElement\n              ? {\n                  key: value,\n                  onClick: clickToRemove ? removeHandler : undefined,\n                  className: cn(\n                    element.props.className,\n                    \"ds:group ds:flex ds:items-center ds:gap-1 ds:whitespace-nowrap ds:hover:scale-105 ds:transition-transform\",\n                    {\n                      \"ds:cursor-pointer\": clickToRemove,\n                    }\n                  ),\n                  \"data-selected-item\": true,\n                }\n              : {\n                  key: value,\n                  \"data-selected-item\": true,\n                };\n\n            return React.cloneElement(\n              element,\n              cloneProps,\n              <>\n                {element.props.children}\n                {clickToRemove && (\n                  <XIcon className=\"ds:size-2 ds:text-muted-foreground ds:group-hover:text-destructive\" />\n                )}\n              </>\n            );\n          }\n\n          return (\n            <Badge\n              variant=\"outline\"\n              data-selected-item\n              className=\"ds:group ds:flex ds:items-center ds:gap-1\"\n              key={value}\n              onClick={clickToRemove ? removeHandler : undefined}\n            >\n              {itemNode}\n              {clickToRemove && (\n                <XIcon className=\"ds:size-2 ds:text-muted-foreground ds:group-hover:text-destructive\" />\n              )}\n            </Badge>\n          );\n        })}\n\n      <Badge\n        style={{\n          display: overflowAmount > 0 && !shouldWrap ? \"block\" : \"none\",\n        }}\n        variant=\"outline\"\n        ref={overflowRef}\n      >\n        +{overflowAmount}\n      </Badge>\n    </div>\n  );\n}\n\nexport function MultiSelectContent({\n  search = true,\n  children,\n  ...props\n}: {\n  search?: boolean | { placeholder?: string; emptyMessage?: string };\n  children: ReactNode;\n} & Omit<ComponentPropsWithoutRef<typeof Command>, \"children\">) {\n  const canSearch = typeof search === \"object\" ? true : search;\n\n  return (\n    <>\n      <div style={{ display: \"none\" }}>\n        <Command>\n          <CommandList>{children}</CommandList>\n        </Command>\n      </div>\n      <PopoverContent className=\"ds:min-w-[var(--radix-popover-trigger-width)] ds:p-0\">\n        <Command {...props}>\n          {canSearch ? (\n            <CommandInput\n              placeholder={\n                typeof search === \"object\" ? search.placeholder : undefined\n              }\n            />\n          ) : (\n            <button autoFocus className=\"ds:sr-only\" />\n          )}\n          <CommandList>\n            {canSearch && (\n              <CommandEmpty>\n                {typeof search === \"object\" ? search.emptyMessage : undefined}\n              </CommandEmpty>\n            )}\n            {children}\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </>\n  );\n}\n\nexport function MultiSelectItem({\n  value,\n  children,\n  badgeLabel,\n  onSelect,\n  icon,\n  tagRender,\n  ...props\n}: {\n  badgeLabel?: ReactNode;\n  value: string;\n  icon?: ReactNode;\n  tagRender?: boolean;\n} & Omit<ComponentPropsWithoutRef<typeof CommandItem>, \"value\">) {\n  const { toggleValue, selectedValues, onItemAdded } = useMultiSelectContext();\n  const isSelected = selectedValues.has(value);\n\n  useEffect(() => {\n    onItemAdded(value, badgeLabel ?? children);\n  }, [value, children, onItemAdded, badgeLabel]);\n\n  return (\n    <CommandItem\n      {...props}\n      onSelect={\n        props?.disabled\n          ? undefined\n          : () => {\n              toggleValue(value);\n              onSelect?.(value);\n            }\n      }\n      className={cn(\n        props?.disabled && \"ds:opacity-50 ds:cursor-not-allowed ds:grayscale\",\n        isSelected && \"ds:bg-primary/10 ds:dark:bg-primary/20\"\n      )}\n    >\n      {!tagRender && icon && (\n        <span className=\"ds:mr-2 ds:max-w-4 ds:max-h-4\">{icon}</span>\n      )}\n      {children}\n      <CheckIcon\n        className={cn(\n          \"ds:mr-2 ds:ml-auto ds:size-4\",\n          isSelected ? \"ds:opacity-100\" : \"ds:opacity-0\"\n        )}\n      />\n    </CommandItem>\n  );\n}\n\nexport function MultiSelectGroup(\n  props: ComponentPropsWithoutRef<typeof CommandGroup>\n) {\n  return <CommandGroup {...props} />;\n}\n\nexport function MultiSelectSeparator(\n  props: ComponentPropsWithoutRef<typeof CommandSeparator>\n) {\n  return <CommandSeparator {...props} />;\n}\n\nfunction useMultiSelectContext() {\n  const context = useContext(MultiSelectContext);\n  if (context == null) {\n    throw new Error(\n      \"useMultiSelectContext must be used within a MultiSelectContext\"\n    );\n  }\n  return context;\n}\n"],"names":["multiSelectTriggerVariants","cva","MultiSelectContext","createContext","MultiSelect","children","values","defaultValues","onValuesChange","open","setOpen","useState","internalValues","setInternalValues","selectedValues","items","setItems","toggleValue","value","getNewSet","prev","newSet","onItemAdded","useCallback","label","jsx","Popover","MultiSelectTrigger","className","dropdownClassName","size","state","props","useMultiSelectContext","PopoverTrigger","jsxs","Label","cn","ChevronUp","ChevronDown","MultiSelectValue","placeholder","clickToRemove","overflowBehavior","overflowAmount","setOverflowAmount","valueRef","useRef","overflowRef","shouldWrap","checkOverflow","containerElement","overflowElement","child","amount","i","handleResize","node","observer","itemNode","removeHandler","e","React","isDomElement","element","cloneProps","Fragment","XIcon","Badge","MultiSelectContent","search","canSearch","Command","CommandList","PopoverContent","CommandInput","CommandEmpty","MultiSelectItem","badgeLabel","onSelect","icon","tagRender","isSelected","useEffect","CommandItem","CheckIcon","MultiSelectGroup","CommandGroup","MultiSelectSeparator","CommandSeparator","context","useContext"],"mappings":"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"}