laif-ds 0.1.85 → 0.1.88

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

@@ -1,19 +1,17 @@
 "use client";
-import { jsxs as n, jsx as e } from "react/jsx-runtime";
-import * as Y from "react";
-import { useState as i, useEffect as k, useCallback as D } from "react";
-import { useDebounce as Z } from "../../hooks/use-debounce.js";
-import { cva as _ } from "../../node_modules/class-variance-authority/dist/index.js";
-import { cn as z } from "../../lib/utils.js";
-import { Button as V } from "./button.js";
-import { Label as ee } from "./label.js";
-import { Command as te, CommandInput as oe, CommandList as ne, CommandEmpty as se, CommandGroup as O, CommandItem as R } from "./command.js";
-import { Popover as re, PopoverTrigger as ae, PopoverContent as ie } from "./popover.js";
-import ce from "../../node_modules/lucide-react/dist/esm/icons/x.js";
-import le from "../../node_modules/lucide-react/dist/esm/icons/chevrons-up-down.js";
-import de from "../../node_modules/lucide-react/dist/esm/icons/loader-circle.js";
-import me from "../../node_modules/lucide-react/dist/esm/icons/check.js";
-const fe = _(
+import { jsxs as r, jsx as e } from "react/jsx-runtime";
+import * as p from "react";
+import { useState as l, useEffect as h, useCallback as F } from "react";
+import { useDebounce as oe } from "../../hooks/use-debounce.js";
+import { cva as re } from "../../node_modules/class-variance-authority/dist/index.js";
+import { cn as S } from "../../lib/utils.js";
+import { Label as le } from "./label.js";
+import { Popover as ae, PopoverTrigger as ce, PopoverContent as ie } from "./popover.js";
+import { Command as de, CommandInput as fe, CommandList as me, CommandEmpty as ue, CommandGroup as G, CommandItem as M } from "./command.js";
+import { Icon as B } from "./icon.js";
+import pe from "../../node_modules/lucide-react/dist/esm/icons/loader-circle.js";
+import he from "../../node_modules/lucide-react/dist/esm/icons/check.js";
+const ge = re(
   "flex items-center justify-between whitespace-nowrap rounded-md border border-input bg-d-input px-3 py-2 shadow-sm ring-offset-background data-[placeholder]:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
   {
     variants: {
@@ -28,132 +26,153 @@ const fe = _(
     }
   }
 );
-function ke({
-  fetcher: c,
-  preload: m,
-  filterFn: y,
-  renderOption: A,
+function Pe({
+  fetcher: i,
+  preload: f,
+  filterFn: R,
+  renderOption: E,
   getOptionValue: a,
-  getDisplayValue: b,
-  notFound: F,
-  loadingSkeleton: $,
-  label: l,
-  labelClassName: B,
-  placeholder: G = "Select...",
-  value: s = "",
-  onChange: u,
-  disabled: v = !1,
-  width: E = "200px",
-  className: M,
-  triggerClassName: U,
-  noResultsMessage: X,
-  clearable: w = !0,
-  size: q
+  getDisplayValue: g,
+  notFound: U,
+  loadingSkeleton: X,
+  label: z,
+  labelClassName: $,
+  placeholder: O = "Select...",
+  value: o = "",
+  onChange: x,
+  disabled: W = !1,
+  width: m = "200px",
+  triggerClassName: q,
+  noResultsMessage: H,
+  clearable: L = !0,
+  size: J
 }) {
-  const [p, N] = i(!1), [r, d] = i([]), [C, h] = i(!1), [S, g] = i(null), [L, x] = i(null), [I, H] = i(""), f = Z(I, m ? 0 : 300), [j, P] = i([]);
-  k(() => ((async () => {
+  const [c, j] = l(!1), y = m === "auto", I = p.useRef(null), P = p.useRef(null), K = p.useRef(null), Q = p.useRef(null), [w, N] = l(!1), [v, b] = l(null), [T, C] = l(null), [D, Y] = l(""), u = oe(D, f ? 0 : 300), [k, A] = l([]), [n, d] = l([]), [Z, _] = l(
+    void 0
+  );
+  h(() => ((async () => {
     try {
-      if (h(!0), g(null), m) {
+      if (N(!0), b(null), f) {
         console.log(
           "[AsyncSelect] Preload attivo: caricamento completo dei dati"
         );
-        const o = await c("");
-        P(o), d(o);
+        const s = await i("");
+        A(s), d(s);
       } else {
-        const o = await c(s);
-        d(o);
+        const s = await i(o);
+        d(s);
       }
-    } catch (o) {
-      g(
-        o instanceof Error ? o.message : "Failed to fetch options"
+    } catch (s) {
+      b(
+        s instanceof Error ? s.message : "Failed to fetch options"
       );
     } finally {
-      h(!1);
+      N(!1);
     }
   })(), () => {
-    d([]), P([]);
-  }), [c, s, m]), k(() => {
-    if (p)
-      if (m)
-        if (f) {
-          const t = j.filter(
-            (o) => y ? y(o, f) : String(b(o)).toLowerCase().includes(f.toLowerCase())
+    d([]), A([]);
+  }), [i, o, f]), h(() => {
+    if (c)
+      if (f)
+        if (u) {
+          const t = k.filter(
+            (s) => R ? R(s, u) : String(g(s)).toLowerCase().includes(u.toLowerCase())
           );
           d(t);
         } else
-          d(j);
+          d(k);
       else
         (async () => {
           try {
-            h(!0), g(null);
-            const o = await c(f);
-            d(o);
-          } catch (o) {
-            g(
-              o instanceof Error ? o.message : "Failed to fetch options"
+            N(!0), b(null);
+            const s = await i(u);
+            d(s);
+          } catch (s) {
+            b(
+              s instanceof Error ? s.message : "Failed to fetch options"
             );
           } finally {
-            h(!1);
+            N(!1);
           }
         })();
   }, [
-    p,
+    c,
+    u,
     f,
-    m,
-    y,
-    j,
-    b
-  ]), k(() => {
-    if (s && r.length > 0) {
-      const t = r.find((o) => a(o) === s);
-      x(t || null);
-    } else s || x(null);
-  }, [s, r, a]);
-  const J = D(
+    R,
+    k,
+    g
+  ]), h(() => {
+    if (o && n.length > 0) {
+      const t = n.find((s) => a(s) === o);
+      C(t || null);
+    } else o || C(null);
+  }, [o, n, a]), h(() => {
+    c && I.current && I.current.focus();
+  }, [c]), h(() => {
+    if (c && P.current) {
+      const t = P.current.getBoundingClientRect();
+      _(t.width);
+    }
+  }, [c]);
+  const V = F(
     (t) => {
-      const o = w && t === s ? "" : t, Q = r.find((W) => a(W) === o) || null;
-      x(Q), u(o), N(!1);
+      const s = L && t === o ? "" : t, se = n.find((ne) => a(ne) === s) || null;
+      C(se), x(s), j(!1);
     },
-    [s, u, w, r, a]
-  ), K = D(
+    [o, x, L, n, a]
+  ), ee = F(
     (t) => {
-      t.stopPropagation(), t.preventDefault(), x(null), u(""), N(!1);
+      t.stopPropagation(), t.preventDefault(), C(null), x(""), j(!1);
     },
-    [u]
-  ), T = Y.useId();
-  return /* @__PURE__ */ n("div", { className: "space-y-1.5", children: [
-    l && /* @__PURE__ */ e(ee, { htmlFor: T, className: B, children: l }),
-    /* @__PURE__ */ n(re, { open: p, onOpenChange: N, children: [
-      /* @__PURE__ */ e(ae, { disabled: v, children: /* @__PURE__ */ e(
-        V,
+    [x]
+  ), te = p.useId();
+  return /* @__PURE__ */ r("div", { className: S("space-y-1.5", y && "w-full"), children: [
+    z && /* @__PURE__ */ e(le, { className: $, children: z }),
+    /* @__PURE__ */ e("div", { ref: K, className: "relative", "data-slot": "async-select", children: /* @__PURE__ */ r(ae, { open: c, onOpenChange: j, children: [
+      /* @__PURE__ */ e(ce, { asChild: !0, children: /* @__PURE__ */ e(
+        "button",
         {
-          id: T,
+          id: te,
           type: "button",
-          variant: "ghost",
-          role: "combobox",
-          "aria-expanded": p,
-          className: z(
-            fe({ size: q }),
-            v && "cursor-not-allowed opacity-50",
-            U,
-            "font-normal"
+          disabled: W,
+          className: S(
+            ge({ size: J }),
+            W && "cursor-not-allowed opacity-50",
+            q,
+            "font-normal",
+            y && "w-full"
           ),
-          style: { width: E },
-          disabled: v,
-          children: /* @__PURE__ */ n("div", { className: "flex flex-1 items-center justify-between overflow-hidden", children: [
-            L ? /* @__PURE__ */ e("div", { className: "truncate", children: b(L) }) : /* @__PURE__ */ e("span", { className: "text-d-muted-foreground hover:text-d-foreground", children: G }),
-            /* @__PURE__ */ n("div", { className: "flex items-center gap-1", children: [
-              w && L && /* @__PURE__ */ e(
+          style: y ? void 0 : { width: m },
+          ref: P,
+          children: /* @__PURE__ */ r("div", { className: "flex w-full flex-1 items-center justify-between overflow-hidden", children: [
+            T ? /* @__PURE__ */ e("div", { className: "truncate", children: g(T) }) : /* @__PURE__ */ e("span", { className: "text-d-muted-foreground hover:text-d-foreground", children: O }),
+            /* @__PURE__ */ r("div", { className: "flex w-full items-center justify-end gap-1", children: [
+              L && T && /* @__PURE__ */ e(
                 "div",
                 {
-                  className: "bg-d-input hover:bg-d-input/30 border-d-border z-20 flex cursor-pointer items-center justify-center rounded-full border p-1",
-                  onClick: K,
+                  className: "border-d-input bg-d-accent cursor-pointer rounded-full p-1",
+                  onClick: ee,
                   onMouseDown: (t) => t.preventDefault(),
                   "aria-label": "Clear selection",
-                  children: /* @__PURE__ */ e(ce, { size: 8, className: "text-d-foreground" })
+                  children: /* @__PURE__ */ e(
+                    B,
+                    {
+                      name: "X",
+                      size: "xs",
+                      className: "!text-d-foreground opacity-50"
+                    }
+                  )
                 }
               ),
-              /* @__PURE__ */ e(le, { className: "opacity-50", size: 10 })
+              /* @__PURE__ */ e(
+                B,
+                {
+                  name: "ChevronsUpDown",
+                  size: "xs",
+                  className: "!text-d-foreground opacity-50"
+                }
+              )
             ] })
           ] })
         }
@@ -161,63 +180,75 @@ function ke({
       /* @__PURE__ */ e(
         ie,
         {
-          style: { width: E },
-          className: z("p-0", M),
-          children: /* @__PURE__ */ n(te, { shouldFilter: !1, children: [
-            /* @__PURE__ */ n("div", { className: "border-d-border relative w-full border-b", children: [
-              /* @__PURE__ */ e(
-                oe,
-                {
-                  className: "!focus:outline-none !focus-visible:outline-none !focus:ring-0 !focus:ring-offset-0 !focus-visible:ring-0 !focus-visible:ring-offset-0 !border-none !outline-none",
-                  placeholder: `Search ${typeof l == "string" ? l.toLowerCase() : "options"}...`,
-                  value: I,
-                  onValueChange: (t) => {
-                    H(t);
+          className: S("p-0"),
+          style: {
+            width: y ? Z : typeof m == "number" ? `${m}px` : m
+          },
+          align: "start",
+          side: "bottom",
+          sideOffset: 4,
+          onWheel: (t) => t.stopPropagation(),
+          avoidCollisions: !1,
+          children: /* @__PURE__ */ r(
+            de,
+            {
+              shouldFilter: !1,
+              className: "w-full border-none shadow-lg",
+              children: [
+                /* @__PURE__ */ e(
+                  fe,
+                  {
+                    ref: I,
+                    placeholder: O,
+                    value: D,
+                    onValueChange: Y
                   }
-                }
-              ),
-              C && r.length > 0 && /* @__PURE__ */ e("div", { className: "absolute top-1/2 right-2 flex -translate-y-1/2 transform items-center", children: /* @__PURE__ */ e(de, { className: "h-4 w-4 animate-spin" }) })
-            ] }),
-            /* @__PURE__ */ n(ne, { children: [
-              S && /* @__PURE__ */ e("div", { className: "text-d-destructive p-3 text-center", children: S }),
-              C && r.length === 0 && ($ || /* @__PURE__ */ e(ue, {})),
-              !C && !S && r.length === 0 && (F || /* @__PURE__ */ e(se, { children: X ?? `No ${typeof l == "string" ? l.toLowerCase() : "options"} found.` })),
-              /* @__PURE__ */ e(O, { children: r.map((t) => /* @__PURE__ */ n(
-                R,
-                {
-                  value: a(t),
-                  onSelect: J,
-                  children: [
-                    A(t),
-                    /* @__PURE__ */ e(
-                      me,
-                      {
-                        className: z(
-                          "ml-auto h-3 w-3",
-                          s === a(t) ? "opacity-100" : "opacity-0"
+                ),
+                w && n.length > 0 && /* @__PURE__ */ e("div", { className: "flex items-center justify-center p-2", children: /* @__PURE__ */ e(pe, { className: "h-4 w-4 animate-spin" }) }),
+                /* @__PURE__ */ r(me, { ref: Q, children: [
+                  v && /* @__PURE__ */ e("div", { className: "text-d-destructive p-3 text-center", children: v }),
+                  w && n.length === 0 && (X || /* @__PURE__ */ e(xe, {})),
+                  !w && !v && n.length === 0 && (U || /* @__PURE__ */ e(ue, { children: H || "No results found." })),
+                  !w && !v && n.length > 0 && /* @__PURE__ */ e(G, { children: n.map((t) => /* @__PURE__ */ r(
+                    M,
+                    {
+                      value: a(t),
+                      onSelect: V,
+                      className: "cursor-pointer",
+                      children: [
+                        E ? E(t) : /* @__PURE__ */ e("span", { children: g(t) }),
+                        /* @__PURE__ */ e(
+                          he,
+                          {
+                            className: S(
+                              "ml-auto h-4 w-4",
+                              o === a(t) ? "opacity-100" : "opacity-0"
+                            )
+                          }
                         )
-                      }
-                    )
-                  ]
-                },
-                a(t)
-              )) })
-            ] })
-          ] })
+                      ]
+                    },
+                    a(t)
+                  )) })
+                ] })
+              ]
+            }
+          )
         }
       )
-    ] })
+    ] }) })
   ] });
 }
-function ue() {
-  return /* @__PURE__ */ e(O, { children: [1, 2, 3].map((c) => /* @__PURE__ */ e(R, { disabled: !0, children: /* @__PURE__ */ n("div", { className: "flex w-full items-center gap-2", children: [
+function xe() {
+  return /* @__PURE__ */ e(G, { children: [1, 2, 3].map((i) => /* @__PURE__ */ e(M, { disabled: !0, children: /* @__PURE__ */ r("div", { className: "flex w-full items-center gap-2", children: [
     /* @__PURE__ */ e("div", { className: "bg-d-secondary h-6 w-6 animate-pulse rounded-full" }),
-    /* @__PURE__ */ n("div", { className: "flex flex-1 flex-col gap-1", children: [
+    /* @__PURE__ */ r("div", { className: "flex flex-1 flex-col gap-1", children: [
       /* @__PURE__ */ e("div", { className: "bg-d-secondary h-4 w-24 animate-pulse rounded" }),
       /* @__PURE__ */ e("div", { className: "bg-d-secondary h-3 w-16 animate-pulse rounded" })
     ] })
-  ] }) }, c)) });
+  ] }) }, i)) });
 }
 export {
-  ke as AsyncSelect
+  Pe as AsyncSelect,
+  ge as asyncSelectTriggerVariants
 };

package/dist/components/ui/button.js

@@ -14,7 +14,7 @@ const m = h(
         outline: "border bg-d-background shadow-xs hover:bg-d-accent hover:text-d-accent-foreground dark:bg-d-input/30 dark:border-d-input dark:hover:bg-d-input/50",
         "outline-primary": "border !border-d-primary bg-d-background shadow-xs text-d-primary/80 hover:!text-d-primary",
         secondary: "bg-d-secondary text-d-secondary-foreground shadow-xs hover:bg-d-secondary/80 hover:text-d-secondary-foreground",
-        ghost: "hover:bg-d-accent hover:text-d-accent-foreground dark:hover:bg-d-accent/50",
+        ghost: "hover:bg-d-accent hover:text-d-accent-foreground dark:hover:bg-d-accent",
         link: "text-d-primary underline-offset-4 hover:underline"
       },
       size: {

package/dist/components/ui/checkbox.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as e } from "react/jsx-runtime";
-import { Checkbox as t, CheckboxIndicator as a } from "../../node_modules/@radix-ui/react-checkbox/dist/index.js";
-import { cn as d } from "../../lib/utils.js";
+import { Checkbox as t, CheckboxIndicator as d } from "../../node_modules/@radix-ui/react-checkbox/dist/index.js";
+import { cn as a } from "../../lib/utils.js";
 import o from "../../node_modules/lucide-react/dist/esm/icons/check.js";
 function b({
   className: r,
@@ -11,13 +11,13 @@ function b({
     t,
     {
       "data-slot": "checkbox",
-      className: d(
-        "peer border-d-input dark:bg-d-input/30 data-[state=checked]:bg-d-primary data-[state=checked]:text-d-primary-foreground dark:data-[state=checked]:bg-d-primary data-[state=checked]:border-d-primary focus-visible:border-d-ring focus-visible:ring-d-ring/50 aria-invalid:ring-d-destructive/20 dark:aria-invalid:ring-d-destructive/40 aria-invalid:border-d-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
+      className: a(
+        "peer bg-d-input border-d-border data-[state=checked]:bg-d-primary data-[state=checked]:border-d-primary data-[state=checked]:text-d-primary-foreground focus-visible:border-d-ring focus-visible:ring-d-ring/50 aria-invalid:border-d-destructive aria-invalid:ring-d-destructive/20 dark:aria-invalid:ring-d-destructive/40 size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50",
         r
       ),
       ...i,
       children: /* @__PURE__ */ e(
-        a,
+        d,
         {
           "data-slot": "checkbox-indicator",
           className: "flex items-center justify-center text-current transition-none",