laif-ds 0.2.47 → 0.2.48

package/dist/components/ui/app-select.js

@@ -1,35 +1,34 @@
 "use client";
-import { jsxs as s, jsx as r, Fragment as le } from "react/jsx-runtime";
+import { jsxs as s, jsx as l, Fragment as le } from "react/jsx-runtime";
 import { Badge as re } from "./badge.js";
-import { Command as ne, CommandInput as te, CommandList as ae, CommandEmpty as se, CommandGroup as j, CommandItem as B } from "./command.js";
+import { Command as ne, CommandInput as ae, CommandList as te, CommandEmpty as se, CommandGroup as j, CommandItem as M } from "./command.js";
 import { Label as ie } from "./label.js";
-import { cn as y } from "../../lib/utils.js";
+import { cn as w } from "../../lib/utils.js";
 import { useState as h, useRef as oe, useMemo as N, useCallback as de, useEffect as ce } from "react";
-import { Button as D } from "./button.js";
 import { Checkbox as ue } from "./checkbox.js";
-import { Icon as me } from "./icon.js";
-import { Popover as fe, PopoverTrigger as he, PopoverContent as pe } from "./popover.js";
-import ge from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
-const ve = {
+import { Icon as S } from "./icon.js";
+import { Popover as me, PopoverTrigger as fe, PopoverContent as he } from "./popover.js";
+import pe from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
+const ge = {
   sm: "min-h-8 h-8 text-xs py-1.5",
   default: "min-h-9 h-9 text-sm py-2",
   lg: "min-h-10 h-10 text-base py-2"
 };
-function ke(S) {
+function Oe(P) {
   const {
     multiple: n = !1,
     options: m,
     value: A,
-    defaultValue: L,
-    onValueChange: M,
+    defaultValue: B,
+    onValueChange: R,
     onClear: p,
-    placeholder: R = "Seleziona...",
-    emptyPlaceholder: X = "Nessun risultato",
-    searchPlaceholder: E = "Cerca...",
-    addItemPlaceholder: F = "Aggiungi",
+    placeholder: X = "Seleziona...",
+    emptyPlaceholder: E = "Nessun risultato",
+    searchPlaceholder: F = "Cerca...",
+    addItemPlaceholder: L = "Aggiungi",
     itemCountMessage: T = (e) => `${e} elementi selezionati`,
     maxSelectedMessage: W = (e) => `Puoi selezionare fino a ${e} elementi`,
-    label: P,
+    label: D,
     className: $ = "",
     wrpClassName: G = "",
     searchable: O = !1,
@@ -37,164 +36,178 @@ function ke(S) {
     groupBy: g = "group",
     maxSelected: o,
     showChipsInsteadOfCount: H = !1,
-    disabled: v,
+    disabled: b,
     size: J = "default",
     isSingleSelectClearable: K = !1
-  } = S, [b, x] = h(!1), [d, C] = h(""), w = oe(null), [Q, U] = h(0), V = S.hasOwnProperty("value"), [Y, Z] = h(L), i = V ? A : Y, c = (e) => {
-    V || Z(e), M?.(e);
-  }, t = N(() => n ? Array.isArray(i) ? i : [] : i != null ? [i] : [], [i, n]), u = N(() => {
-    const e = m.filter((a) => t.includes(a.value));
+  } = P, [v, x] = h(!1), [d, C] = h(""), y = oe(null), [Q, U] = h(0), V = P.hasOwnProperty("value"), [Y, Z] = h(B), i = V ? A : Y, c = (e) => {
+    V || Z(e), R?.(e);
+  }, a = N(() => n ? Array.isArray(i) ? i : [] : i != null ? [i] : [], [i, n]), u = N(() => {
+    const e = m.filter((t) => a.includes(t.value));
     if (n) {
-      const a = t.filter((l) => !e.find((f) => f.value === l)).map((l) => ({ value: l, label: l }));
-      return [...e, ...a];
-    } else if (t.length && !e.length)
-      return [{ value: t[0], label: t[0] }];
+      const t = a.filter((r) => !e.find((f) => f.value === r)).map((r) => ({ value: r, label: r }));
+      return [...e, ...t];
+    } else if (a.length && !e.length)
+      return [{ value: a[0], label: a[0] }];
     return e;
-  }, [m, t, n]), z = (e) => {
+  }, [m, a, n]), z = (e) => {
     if (!e.disabled)
       if (n) {
-        const a = t.includes(e.value);
-        if (!a && o !== void 0 && t.length >= o)
+        const t = a.includes(e.value);
+        if (!t && o !== void 0 && a.length >= o)
           return;
         c(
-          a ? t.filter((l) => l !== e.value) : [...t, e.value]
+          t ? a.filter((r) => r !== e.value) : [...a, e.value]
         );
       } else
         c(e.value), x(!1);
   }, k = de(() => {
     c(n ? [] : void 0), C(""), p && p();
   }, [c, p, n]), _ = N(() => g ? m.reduce(
-    (e, a) => {
-      const l = a[g] || "";
-      return e[l] = e[l] || [], e[l].push(a), e;
+    (e, t) => {
+      const r = t[g] || "";
+      return e[r] = e[r] || [], e[r].push(t), e;
     },
     {}
   ) : { "": m }, [m, g]);
   return ce(() => {
-    b && w.current && U(w.current.getBoundingClientRect().width);
-  }, [b]), /* @__PURE__ */ s("div", { className: y("flex flex-col gap-2", G), children: [
-    P && /* @__PURE__ */ r(ie, { children: P }),
+    v && y.current && U(y.current.getBoundingClientRect().width);
+  }, [v]), /* @__PURE__ */ s("div", { className: w("flex flex-col gap-2", G), children: [
+    D && /* @__PURE__ */ l(ie, { children: D }),
     /* @__PURE__ */ s(
-      fe,
+      me,
       {
-        open: v ? !1 : b,
-        onOpenChange: (e) => !v && x(e),
+        open: b ? !1 : v,
+        onOpenChange: (e) => !b && x(e),
         modal: !0,
         children: [
-          /* @__PURE__ */ r(he, { asChild: !0, children: /* @__PURE__ */ s(
+          /* @__PURE__ */ l(fe, { asChild: !0, children: /* @__PURE__ */ s(
             "div",
             {
-              ref: w,
-              className: y(
+              ref: y,
+              className: w(
                 "bg-d-input border-d-border/50 focus-within:ring-d-ring flex min-h-10 w-full min-w-[100px] cursor-pointer items-center justify-between gap-2 rounded-md border px-3 py-2 text-sm focus-within:ring-1",
-                ve[J],
-                v && "cursor-not-allowed opacity-50",
+                ge[J],
+                b && "cursor-not-allowed opacity-50",
                 $
               ),
               children: [
-                u.length === 0 ? /* @__PURE__ */ r("span", { className: "text-d-muted-foreground", children: R }) : n ? /* @__PURE__ */ s("div", { className: "flex h-full w-full min-w-0 items-center justify-between gap-2", children: [
-                  /* @__PURE__ */ r("div", { className: "flex min-w-0 flex-nowrap gap-1 overflow-auto", children: H ? /* @__PURE__ */ r(le, { children: u.map((e) => /* @__PURE__ */ s(
+                u.length === 0 ? /* @__PURE__ */ l("span", { className: "text-d-muted-foreground", children: X }) : n ? /* @__PURE__ */ s("div", { className: "flex h-full w-full min-w-0 items-center justify-between gap-2", children: [
+                  /* @__PURE__ */ l("div", { className: "flex min-w-0 flex-nowrap gap-1 overflow-auto", children: H ? /* @__PURE__ */ l(le, { children: u.map((e) => /* @__PURE__ */ s(
                     re,
                     {
                       variant: "secondary",
                       className: "hover:bg-d-secondary/100 bg-d-secondary/50 border-d-border flex cursor-pointer items-center gap-1 border",
-                      onClick: (a) => {
-                        a.stopPropagation(), z(e);
+                      onClick: (t) => {
+                        t.stopPropagation(), z(e);
                       },
                       children: [
                         e.label,
-                        !e.fixed && /* @__PURE__ */ r(me, { name: "X", size: "xs" })
+                        !e.fixed && /* @__PURE__ */ l(S, { name: "X", size: "xs" })
                       ]
                     },
                     e.value
-                  )) }) : /* @__PURE__ */ r("div", { children: T(u.length) }) }),
-                  n && /* @__PURE__ */ r(
-                    D,
+                  )) }) : /* @__PURE__ */ l("div", { children: T(u.length) }) }),
+                  n && /* @__PURE__ */ l(
+                    "div",
                     {
-                      className: "h-6 w-6 rounded-full",
-                      iconLeft: "X",
-                      variant: "ghost-destructive",
-                      size: "icon",
+                      className: "border-d-input bg-d-accent cursor-pointer rounded-full p-1",
                       onClick: (e) => {
                         e.stopPropagation(), e.preventDefault(), k();
-                      }
+                      },
+                      onMouseDown: (e) => e.preventDefault(),
+                      "aria-label": "Clear selection",
+                      children: /* @__PURE__ */ l(
+                        S,
+                        {
+                          name: "X",
+                          size: "xs",
+                          className: "!text-d-foreground opacity-50"
+                        }
+                      )
                     }
                   )
                 ] }) : /* @__PURE__ */ s("div", { className: "flex h-full w-full min-w-0 items-center justify-between gap-2", children: [
-                  /* @__PURE__ */ r("div", { className: "min-w-0 flex-1 truncate", children: typeof u[0]?.label == "string" ? /* @__PURE__ */ r("span", { children: u[0]?.label }) : u[0]?.label }),
-                  K && i !== void 0 && i !== null && /* @__PURE__ */ r(
-                    D,
+                  /* @__PURE__ */ l("div", { className: "min-w-0 flex-1 truncate", children: typeof u[0]?.label == "string" ? /* @__PURE__ */ l("span", { children: u[0]?.label }) : u[0]?.label }),
+                  K && i !== void 0 && i !== null && /* @__PURE__ */ l(
+                    "div",
                     {
-                      className: "h-6 w-6 rounded-full",
-                      iconLeft: "X",
-                      variant: "ghost-destructive",
-                      size: "icon",
+                      className: "border-d-input bg-d-accent cursor-pointer rounded-full p-1",
                       onClick: (e) => {
                         e.stopPropagation(), e.preventDefault(), k();
-                      }
+                      },
+                      onMouseDown: (e) => e.preventDefault(),
+                      "aria-label": "Clear selection",
+                      children: /* @__PURE__ */ l(
+                        S,
+                        {
+                          name: "X",
+                          size: "xs",
+                          className: "!text-d-foreground opacity-50"
+                        }
+                      )
                     }
                   )
                 ] }),
-                /* @__PURE__ */ r(ge, { className: "h-4 w-4 opacity-50" })
+                /* @__PURE__ */ l(pe, { className: "h-4 w-4 opacity-50" })
               ]
             }
           ) }),
-          /* @__PURE__ */ r(
-            pe,
+          /* @__PURE__ */ l(
+            he,
             {
               className: "p-0",
               style: { width: Q },
               align: "start",
               sideOffset: 4,
               children: /* @__PURE__ */ s(ne, { shouldFilter: !!O, className: "w-full", children: [
-                O && /* @__PURE__ */ r(
-                  te,
+                O && /* @__PURE__ */ l(
+                  ae,
                   {
-                    placeholder: E,
+                    placeholder: F,
                     className: "placeholder:text-d-muted-foreground",
                     value: d,
                     onValueChange: C
                   }
                 ),
-                /* @__PURE__ */ s(ae, { className: "max-h-60 overflow-auto overscroll-contain", children: [
-                  /* @__PURE__ */ r(se, { children: X }),
-                  q && d && /* @__PURE__ */ r(j, { children: /* @__PURE__ */ r(
-                    B,
+                /* @__PURE__ */ s(te, { className: "max-h-60 overflow-auto overscroll-contain", children: [
+                  /* @__PURE__ */ l(se, { children: E }),
+                  q && d && /* @__PURE__ */ l(j, { children: /* @__PURE__ */ l(
+                    M,
                     {
                       className: "cursor-pointer",
                       onSelect: () => {
-                        d && (c(n ? [...t, d] : d), C(""), !n && x(!1));
+                        d && (c(n ? [...a, d] : d), C(""), !n && x(!1));
                       },
                       children: /* @__PURE__ */ s("div", { className: "text-d-foreground text-xs", children: [
-                        F,
+                        L,
                         " “",
                         d,
                         "”"
                       ] })
                     }
                   ) }),
-                  Object.entries(_).map(([e, a]) => /* @__PURE__ */ r(j, { heading: e || void 0, children: a.map((l) => {
-                    const f = t.includes(l.value), ee = n && o !== void 0 && !f && t.length >= o, I = l.disabled || ee;
+                  Object.entries(_).map(([e, t]) => /* @__PURE__ */ l(j, { heading: e || void 0, children: t.map((r) => {
+                    const f = a.includes(r.value), ee = n && o !== void 0 && !f && a.length >= o, I = r.disabled || ee;
                     return /* @__PURE__ */ s(
-                      B,
+                      M,
                       {
-                        value: typeof l.label == "string" ? l.label : String(l.value),
-                        onSelect: () => !I && z(l),
-                        className: y(
+                        value: typeof r.label == "string" ? r.label : String(r.value),
+                        onSelect: () => !I && z(r),
+                        className: w(
                           "cursor-pointer",
                           I && "cursor-not-allowed opacity-50",
                           !n && f && "bg-d-accent/75 text-d-accent-foreground"
                         ),
                         children: [
-                          n && /* @__PURE__ */ r(ue, { checked: f, className: "mr-1" }),
-                          typeof l.label == "string" ? /* @__PURE__ */ r("span", { children: l.label }) : l.label
+                          n && /* @__PURE__ */ l(ue, { checked: f, className: "mr-1" }),
+                          typeof r.label == "string" ? /* @__PURE__ */ l("span", { children: r.label }) : r.label
                         ]
                       },
-                      l.value
+                      r.value
                     );
                   }) }, e))
                 ] }),
-                n && o !== void 0 && t.length >= o && /* @__PURE__ */ r("div", { className: "border-d-border text-d-muted-foreground border-t px-2 py-1 text-xs", children: W(o) })
+                n && o !== void 0 && a.length >= o && /* @__PURE__ */ l("div", { className: "border-d-border text-d-muted-foreground border-t px-2 py-1 text-xs", children: W(o) })
               ] })
             }
           )
@@ -204,5 +217,5 @@ function ke(S) {
   ] });
 }
 export {
-  ke as AppSelect
+  Oe as AppSelect
 };