laif-ds 0.2.53 → 0.2.54

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

@@ -1,21 +1,21 @@
 "use client";
-import { jsxs as s, jsx as l, Fragment as ae } from "react/jsx-runtime";
-import { Badge as re } from "./badge.js";
-import { Command as ne, CommandInput as te, CommandList as se, CommandEmpty as ie, CommandGroup as R, CommandItem as A } from "./command.js";
-import { Label as oe } from "./label.js";
+import { jsxs as s, jsx as l, Fragment as re } from "react/jsx-runtime";
+import { Badge as ne } from "./badge.js";
+import { Command as te, CommandInput as se, CommandList as ie, CommandEmpty as oe, CommandGroup as R, CommandItem as A } from "./command.js";
+import { Label as de } from "./label.js";
 import { designTokens as d } from "../../lib/design-tokens.js";
 import { cn as y } from "../../lib/utils.js";
-import { useState as h, useRef as de, useMemo as S, useCallback as ce, useEffect as ue } from "react";
-import { Checkbox as me } from "./checkbox.js";
+import { useState as h, useRef as ce, useMemo as S, useCallback as ue, useEffect as me } from "react";
+import { Checkbox as fe } from "./checkbox.js";
 import { Icon as z } from "./icon.js";
-import { Popover as fe, PopoverTrigger as pe, PopoverContent as he } from "./popover.js";
-import ge from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
-const ve = {
+import { Popover as pe, PopoverTrigger as he, PopoverContent as ge } from "./popover.js";
+import ve from "../../node_modules/lucide-react/dist/esm/icons/chevron-down.js";
+const be = {
   sm: d.sizes.sm,
   default: d.sizes.default,
   lg: d.sizes.lg
 };
-function Ve(P) {
+function ke(P) {
   const {
     multiple: r = !1,
     options: c,
@@ -31,17 +31,18 @@ function Ve(P) {
     maxSelectedMessage: G = (e) => `Puoi selezionare fino a ${e} elementi`,
     label: D,
     className: q = "",
-    wrpClassName: H = "",
+    labelClassName: H = "",
+    wrpClassName: J = "",
     searchable: O = !1,
-    creatable: J = !1,
+    creatable: K = !1,
     groupBy: v = "group",
     maxSelected: o,
-    showChipsInsteadOfCount: K = !1,
+    showChipsInsteadOfCount: Q = !1,
     disabled: b,
-    size: Q = "default",
-    isSingleSelectClearable: U = !1
-  } = P, [x, C] = h(!1), [u, w] = h(""), N = de(null), [V, Y] = h(0), k = P.hasOwnProperty("value"), [Z, _] = h(T), i = k ? B : Z, m = (e) => {
-    k || _(e), W?.(e);
+    size: U = "default",
+    isSingleSelectClearable: Y = !1
+  } = P, [x, C] = h(!1), [u, N] = h(""), w = ce(null), [V, Z] = h(0), k = P.hasOwnProperty("value"), [_, ee] = h(T), i = k ? B : _, m = (e) => {
+    k || ee(e), W?.(e);
   }, n = S(() => r ? Array.isArray(i) ? i : [] : i != null ? [i] : [], [i, r]), f = S(() => {
     const e = c.filter((t) => n.includes(t.value));
     if (r) {
@@ -61,44 +62,44 @@ function Ve(P) {
         );
       } else
         m(e.value), C(!1);
-  }, j = ce(() => {
-    m(r ? [] : void 0), w(""), g && g();
-  }, [m, g, r]), ee = S(() => v ? c.reduce(
+  }, j = ue(() => {
+    m(r ? [] : void 0), N(""), g && g();
+  }, [m, g, r]), le = S(() => v ? c.reduce(
     (e, t) => {
       const a = t[v] || "";
       return e[a] = e[a] || [], e[a].push(t), e;
     },
     {}
   ) : { "": c }, [c, v]);
-  return ue(() => {
-    N.current && Y(N.current.getBoundingClientRect().width);
-  }, [x, n, c]), /* @__PURE__ */ s("div", { className: y("flex flex-col gap-1.5", H), children: [
-    D && /* @__PURE__ */ l(oe, { children: D }),
+  return me(() => {
+    w.current && Z(w.current.getBoundingClientRect().width);
+  }, [x, n, c]), /* @__PURE__ */ s("div", { className: y("flex flex-col gap-1.5", J), children: [
+    D && /* @__PURE__ */ l(de, { className: H, children: D }),
     /* @__PURE__ */ s(
-      fe,
+      pe,
       {
         open: b ? !1 : x,
         onOpenChange: (e) => !b && C(e),
         modal: !0,
         children: [
-          /* @__PURE__ */ l(pe, { asChild: !0, children: /* @__PURE__ */ s(
+          /* @__PURE__ */ l(he, { asChild: !0, children: /* @__PURE__ */ s(
             "div",
             {
-              ref: N,
+              ref: w,
               className: y(
                 d.input.base,
                 d.radius.default,
                 d.focusRingWithin,
                 "flex w-full min-w-[100px] cursor-pointer items-center justify-between gap-2",
                 x && d.activeRing,
-                ve[Q],
+                be[U],
                 b && "cursor-not-allowed opacity-50",
                 q
               ),
               children: [
                 f.length === 0 ? /* @__PURE__ */ l("span", { className: "text-d-muted-foreground", children: X }) : r ? /* @__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: K ? /* @__PURE__ */ l(ae, { children: f.map((e) => /* @__PURE__ */ s(
-                    re,
+                  /* @__PURE__ */ l("div", { className: "flex min-w-0 flex-nowrap gap-1 overflow-auto", children: Q ? /* @__PURE__ */ l(re, { children: f.map((e) => /* @__PURE__ */ s(
+                    ne,
                     {
                       variant: "secondary",
                       className: "hover:bg-d-secondary/100 bg-d-secondary/50 border-d-border flex cursor-pointer items-center gap-1 border",
@@ -133,7 +134,7 @@ function Ve(P) {
                   )
                 ] }) : /* @__PURE__ */ s("div", { className: "flex h-full w-full min-w-0 items-center justify-between gap-2", children: [
                   /* @__PURE__ */ l("div", { className: "min-w-0 flex-1 truncate", children: typeof f[0]?.label == "string" ? /* @__PURE__ */ l("span", { children: f[0]?.label }) : f[0]?.label }),
-                  U && i !== void 0 && i !== null && /* @__PURE__ */ l(
+                  Y && i !== void 0 && i !== null && /* @__PURE__ */ l(
                     "div",
                     {
                       className: "border-d-input bg-d-accent cursor-pointer rounded-full p-1",
@@ -153,35 +154,35 @@ function Ve(P) {
                     }
                   )
                 ] }),
-                /* @__PURE__ */ l(ge, { className: "h-4 w-4 opacity-50" })
+                /* @__PURE__ */ l(ve, { className: "h-4 w-4 opacity-50" })
               ]
             }
           ) }),
           /* @__PURE__ */ l(
-            he,
+            ge,
             {
               className: "p-0",
               style: { width: V > 0 ? V : "auto" },
               align: "start",
               sideOffset: 4,
-              children: /* @__PURE__ */ s(ne, { shouldFilter: !!O, className: "w-full", children: [
+              children: /* @__PURE__ */ s(te, { shouldFilter: !!O, className: "w-full", children: [
                 O && /* @__PURE__ */ l(
-                  te,
+                  se,
                   {
                     placeholder: F,
                     className: "placeholder:text-d-muted-foreground",
                     value: u,
-                    onValueChange: w
+                    onValueChange: N
                   }
                 ),
-                /* @__PURE__ */ s(se, { className: "max-h-60 overflow-auto overscroll-contain", children: [
-                  /* @__PURE__ */ l(ie, { children: E }),
-                  J && u && /* @__PURE__ */ l(R, { children: /* @__PURE__ */ l(
+                /* @__PURE__ */ s(ie, { className: "max-h-60 overflow-auto overscroll-contain", children: [
+                  /* @__PURE__ */ l(oe, { children: E }),
+                  K && u && /* @__PURE__ */ l(R, { children: /* @__PURE__ */ l(
                     A,
                     {
                       className: "cursor-pointer",
                       onSelect: () => {
-                        u && (m(r ? [...n, u] : u), w(""), !r && C(!1));
+                        u && (m(r ? [...n, u] : u), N(""), !r && C(!1));
                       },
                       children: /* @__PURE__ */ s("div", { className: "text-d-foreground text-xs", children: [
                         L,
@@ -191,8 +192,8 @@ function Ve(P) {
                       ] })
                     }
                   ) }),
-                  Object.entries(ee).map(([e, t]) => /* @__PURE__ */ l(R, { heading: e || void 0, children: t.map((a) => {
-                    const p = n.includes(a.value), le = r && o !== void 0 && !p && n.length >= o, M = a.disabled || le;
+                  Object.entries(le).map(([e, t]) => /* @__PURE__ */ l(R, { heading: e || void 0, children: t.map((a) => {
+                    const p = n.includes(a.value), ae = r && o !== void 0 && !p && n.length >= o, M = a.disabled || ae;
                     return /* @__PURE__ */ s(
                       A,
                       {
@@ -204,7 +205,7 @@ function Ve(P) {
                           !r && p && "bg-d-accent/75 text-d-accent-foreground"
                         ),
                         children: [
-                          r && /* @__PURE__ */ l(me, { checked: p, className: "mr-1" }),
+                          r && /* @__PURE__ */ l(fe, { checked: p, className: "mr-1" }),
                           typeof a.label == "string" ? /* @__PURE__ */ l("span", { children: a.label }) : a.label
                         ]
                       },
@@ -222,5 +223,5 @@ function Ve(P) {
   ] });
 }
 export {
-  Ve as AppSelect
+  ke as AppSelect
 };

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

@@ -0,0 +1,123 @@
+"use client";
+import { jsxs as d, jsx as e } from "react/jsx-runtime";
+import { cn as r } from "../../lib/utils.js";
+import { cva as k } from "../../node_modules/class-variance-authority/dist/index.js";
+import * as c from "react";
+import { Label as g } from "./label.js";
+import { Tooltip as z, TooltipTrigger as B, TooltipContent as C } from "./tooltip.js";
+const x = k(
+  "inline-flex items-center justify-center transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-d-ring focus-visible:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "hover:text-d-foreground text-d-muted-foreground",
+        primary: "hover:text-d-primary text-d-primary/70",
+        secondary: "hover:text-d-secondary-foreground text-d-secondary-foreground/70",
+        accent: "hover:text-d-accent-foreground text-d-accent-foreground/70",
+        muted: "hover:text-d-muted-foreground text-d-muted-foreground/50",
+        ghost: "hover:bg-d-accent hover:text-d-accent-foreground"
+      },
+      size: {
+        sm: "text-xs",
+        default: "text-sm",
+        lg: "text-base"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+function E({
+  content: o,
+  children: n,
+  label: t,
+  labelClassName: i,
+  header: f,
+  variant: v = "primary",
+  triggerVariant: l = "default",
+  size: u = "default",
+  className: m,
+  wrpClassName: p,
+  contentClassName: h,
+  side: b = "top",
+  align: y = "center",
+  sideOffset: T = 4,
+  matchTriggerWidth: s = !1,
+  delayDuration: N = 200,
+  disabled: R = !1,
+  asChild: j = !1
+}) {
+  const [w, A] = c.useState(), a = c.useRef(null);
+  return c.useEffect(() => {
+    s && a.current && A(a.current.getBoundingClientRect().width);
+  }, [s]), R ? /* @__PURE__ */ d("div", { className: r("flex flex-col gap-2", p), children: [
+    t && /* @__PURE__ */ e(g, { className: i, children: t }),
+    /* @__PURE__ */ e(
+      "div",
+      {
+        className: r(
+          x({ variant: l, size: u }),
+          m
+        ),
+        children: n
+      }
+    )
+  ] }) : /* @__PURE__ */ d("div", { className: r("flex flex-col gap-2", p), children: [
+    t && /* @__PURE__ */ e(g, { className: i, children: t }),
+    /* @__PURE__ */ d(z, { delayDuration: N, children: [
+      /* @__PURE__ */ e(B, { asChild: j, children: /* @__PURE__ */ e(
+        "div",
+        {
+          ref: a,
+          className: r(
+            x({ variant: l, size: u }),
+            m
+          ),
+          children: n
+        }
+      ) }),
+      /* @__PURE__ */ d(
+        C,
+        {
+          variant: v,
+          side: b,
+          align: y,
+          sideOffset: T,
+          className: r(h),
+          style: {
+            width: s ? w : void 0
+          },
+          children: [
+            f && /* @__PURE__ */ e("div", { className: "border-d-border mb-2 border-b pb-2 font-semibold", children: f }),
+            o
+          ]
+        }
+      )
+    ] })
+  ] });
+}
+function F({
+  text: o,
+  className: n,
+  variant: t = "primary",
+  truncate: i = !0
+}) {
+  return /* @__PURE__ */ e(E, { content: o, variant: t, asChild: !0, children: /* @__PURE__ */ e(
+    "span",
+    {
+      className: r(
+        "text-d-secondary-foreground block w-full min-w-0",
+        i && "truncate",
+        n
+      ),
+      children: o
+    }
+  ) });
+}
+export {
+  F as AppTextTooltip,
+  E as AppTooltip,
+  E as default
+};

package/dist/components/ui/button.js

@@ -64,7 +64,7 @@ function N({
     u,
     {
       "data-slot": "button",
-      className: s(m({ variant: a, size: e, className: d }), "relative"),
+      className: s("relative", m({ variant: a, size: e, className: d })),
       ...o,
       children: [
         /* @__PURE__ */ t("span", { className: "absolute inset-0 overflow-hidden rounded-[inherit] pointer-events-none", children: /* @__PURE__ */ t("span", { className: "absolute inset-0 bg-gradient-to-r from-transparent via-white/20 to-transparent -translate-x-full group-hover:translate-x-full transition-transform duration-700 ease-out" }) }),