laif-ds 0.2.69 → 0.2.71

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

@@ -1,151 +1,194 @@
 "use client";
-import { jsx as i, jsxs as l, Fragment as z } from "react/jsx-runtime";
-import { useState as L } from "react";
-import { KanbanBoardProvider as H, KanbanBoard as I, KanbanBoardColumn as P, KanbanBoardColumnHeader as S, KanbanBoardColumnList as A, KanbanBoardColumnListItem as F, KanbanBoardCard as J, KanbanBoardCardTitle as R, KanbanBoardCardDescription as W } from "./kanban.js";
-import { stringToHexColor as q, hexToRgba as E } from "../../lib/utils.js";
-import { Button as G } from "./button.js";
-import { Icon as Q } from "./icon.js";
-import U from "../../node_modules/lucide-react/dist/esm/icons/plus.js";
-function M({
-  columns: v,
-  initialTasks: K,
+import { jsx as o, jsxs as l, Fragment as H } from "react/jsx-runtime";
+import { useState as I, useMemo as P } from "react";
+import { KanbanBoardProvider as A, KanbanBoard as F, KanbanBoardColumn as J, KanbanBoardColumnHeader as R, KanbanBoardColumnList as W, KanbanBoardColumnListItem as q, KanbanBoardCard as E, KanbanBoardCardTitle as G, KanbanBoardCardDescription as Q } from "./kanban.js";
+import { stringToHexColor as U, cn as B, hexToRgba as K } from "../../lib/utils.js";
+import { Button as V } from "./button.js";
+import { Icon as X } from "./icon.js";
+import Y from "../../node_modules/lucide-react/dist/esm/icons/lock.js";
+import Z from "../../node_modules/lucide-react/dist/esm/icons/plus.js";
+function ne({
+  columns: p,
+  initialTasks: w,
   onTaskMove: m,
   onTaskEdit: x,
-  onTaskCreate: u,
-  taskActions: B,
-  renderTaskContent: b,
-  className: y,
-  allowTaskCreate: j = !0
+  onTaskCreate: h,
+  taskActions: D,
+  renderTaskContent: g,
+  className: j,
+  allowTaskCreate: z = !0
 }) {
-  const [h, N] = L(K), g = (r) => {
-    const d = {};
-    for (const e of Object.keys(r))
-      d[e] = [...r[e]];
-    return d;
-  }, w = (r, d) => {
-    N((e) => {
-      const o = g(e);
-      let t, n;
-      for (const s of Object.keys(o)) {
-        const c = o[s].findIndex((p) => p.id === r);
+  const [N, C] = I(w), b = P(
+    () => new Set(p.filter((e) => e.disabled).map((e) => e.id)),
+    [p]
+  ), y = (e) => {
+    const i = {};
+    for (const r of Object.keys(e))
+      i[r] = [...e[r]];
+    return i;
+  }, O = (e, i) => {
+    C((r) => {
+      const d = y(r);
+      let a, n;
+      for (const s of Object.keys(d)) {
+        const c = d[s].findIndex((f) => f.id === e);
         if (c !== -1) {
-          n = s, [t] = o[s].splice(c, 1);
+          n = s, [a] = d[s].splice(c, 1);
           break;
         }
       }
-      return !t || n === d ? e : (o[d] || (o[d] = []), o[d].push(t), n && m && m(r, n, d), o);
+      return !a || n === i || n && b.has(n) || b.has(i) ? r : (d[i] || (d[i] = []), d[i].push(a), n && m && m(e, n, i), d);
     });
-  }, O = (r, d, e, o) => {
-    N((t) => {
-      const n = g(t), s = Object.keys(n).find(
-        (a) => n[a].some((D) => D.id === r)
+  }, L = (e, i, r, d) => {
+    C((a) => {
+      const n = y(a), s = Object.keys(n).find(
+        (t) => n[t].some((S) => S.id === e)
       );
-      if (!s) return t;
+      if (!s) return a;
       const c = n[s].findIndex(
-        (a) => a.id === r
+        (t) => t.id === e
       );
-      if (c === -1) return t;
-      const [p] = n[s].splice(c, 1);
-      n[e] || (n[e] = []);
-      const f = n[e].findIndex(
-        (a) => a.id === d
+      if (c === -1 || b.has(s) || b.has(r))
+        return a;
+      const [f] = n[s].splice(c, 1);
+      n[r] || (n[r] = []);
+      const u = n[r].findIndex(
+        (t) => t.id === i
       );
-      if (f === -1)
-        n[e].push(p);
+      if (u === -1)
+        n[r].push(f);
       else {
-        const a = o === "top" ? f : f + 1;
-        n[e].splice(a, 0, p);
+        const t = d === "top" ? u : u + 1;
+        n[r].splice(t, 0, f);
       }
-      return s !== e && m && m(r, s, e), n;
+      return s !== r && m && m(e, s, r), n;
     });
-  }, C = (r) => JSON.parse(r);
-  return /* @__PURE__ */ i(H, { children: /* @__PURE__ */ i(I, { className: y, children: v.map((r) => {
-    const d = q(r.label);
+  }, v = (e) => JSON.parse(e);
+  return /* @__PURE__ */ o(A, { children: /* @__PURE__ */ o(F, { className: j, children: p.map((e) => {
+    const i = U(e.label), r = !!e.disabled;
     return /* @__PURE__ */ l(
-      P,
+      J,
       {
-        columnId: r.id,
-        onDropOverColumn: (e) => {
-          const o = C(e);
-          w(o.id, r.id);
+        columnId: e.id,
+        disabled: r,
+        onDropOverColumn: (d) => {
+          if (r) return;
+          const a = v(d);
+          O(a.id, e.id);
         },
-        className: "group/column rounded-xl backdrop-blur-sm transition-colors",
+        className: B(
+          "group/column relative transition-all duration-200",
+          !r && "hover:-translate-y-0.5 hover:shadow-lg"
+        ),
         children: [
-          /* @__PURE__ */ i(S, { className: "relative mb-1.5 px-1.5 pt-1.5", children: /* @__PURE__ */ l("div", { className: "flex w-full items-center justify-between", children: [
+          /* @__PURE__ */ o(R, { className: "sticky top-0 z-10 mb-2 rounded-xl border border-d-border/60 bg-d-sidebar/90 px-2.5 py-2 backdrop-blur", children: /* @__PURE__ */ l("div", { className: "flex w-full items-center justify-between", children: [
             /* @__PURE__ */ l("div", { className: "flex items-center gap-2", children: [
-              /* @__PURE__ */ i(
+              /* @__PURE__ */ l(
                 "div",
                 {
-                  className: "flex items-center gap-1.5 rounded-md px-2 py-0.5 text-xs font-semibold",
+                  className: "flex items-center gap-1.5 rounded-full border px-2.5 py-0.5 text-xs font-semibold shadow-sm",
                   style: {
-                    backgroundColor: E(d, 0.15),
-                    color: d
+                    backgroundColor: K(i, 0.15),
+                    color: i,
+                    borderColor: K(i, 0.35)
                   },
-                  children: /* @__PURE__ */ i("span", { className: "max-w-[150px] truncate", children: r.label })
+                  children: [
+                    /* @__PURE__ */ o(
+                      "span",
+                      {
+                        className: "size-1.5 rounded-full",
+                        style: { backgroundColor: i }
+                      }
+                    ),
+                    /* @__PURE__ */ o("span", { className: "max-w-[150px] truncate", children: e.label })
+                  ]
                 }
               ),
-              /* @__PURE__ */ i("span", { className: "text-d-muted-foreground text-xs", children: h[r.id]?.length ?? 0 })
+              /* @__PURE__ */ o("span", { className: "text-d-muted-foreground inline-flex items-center rounded-full border border-d-border/60 bg-d-muted/40 px-2 py-0.5 text-[11px] font-medium", children: N[e.id]?.length ?? 0 })
             ] }),
-            /* @__PURE__ */ i("div", { className: "flex items-center gap-1", children: j && u && /* @__PURE__ */ i(
-              G,
-              {
-                variant: "ghost",
-                size: "icon",
-                className: "text-d-muted-foreground hover:text-d-foreground h-6 w-6",
-                onClick: () => u(r.id),
-                children: /* @__PURE__ */ i(U, { className: "size-3.5" })
-              }
-            ) })
+            /* @__PURE__ */ l("div", { className: "flex items-center gap-1", children: [
+              r && /* @__PURE__ */ o(
+                "span",
+                {
+                  className: "text-d-muted-foreground inline-flex size-6 items-center justify-center",
+                  title: "Colonna bloccata",
+                  "aria-label": "Colonna bloccata",
+                  children: /* @__PURE__ */ o(Y, { className: "size-3.5" })
+                }
+              ),
+              z && h && /* @__PURE__ */ o(
+                V,
+                {
+                  variant: "ghost",
+                  size: "icon",
+                  className: "text-d-muted-foreground hover:text-d-foreground h-6 w-6",
+                  onClick: () => h(e.id),
+                  children: /* @__PURE__ */ o(Z, { className: "size-3.5" })
+                }
+              )
+            ] })
           ] }) }),
-          /* @__PURE__ */ i(A, { className: "px-1 pb-2", children: h[r.id]?.map((e) => /* @__PURE__ */ i(
-            F,
+          /* @__PURE__ */ o(
+            W,
             {
-              cardId: e.id,
-              className: "mb-1.5 border-0 last:mb-0",
-              onDropOverListItem: (o, t) => {
-                if (t === "none") return;
-                const n = C(o);
-                O(
-                  n.id,
-                  e.id,
-                  r.id,
-                  t
-                );
-              },
-              children: /* @__PURE__ */ i(
-                J,
+              className: "px-1.5 pb-3",
+              dropDisabled: r,
+              children: N[e.id]?.map((d) => /* @__PURE__ */ o(
+                q,
                 {
-                  data: e,
-                  className: "group/card hover:border-d-border/40 relative rounded-md border border-transparent shadow-sm transition-all duration-200 hover:shadow-md",
-                  backgroundColor: d,
-                  onEdit: x ? () => x(e, r.id) : void 0,
-                  actions: B?.(e, r.id),
-                  meta: e.meta,
-                  children: b ? b(e, r.id) : /* @__PURE__ */ l(z, { children: [
-                    /* @__PURE__ */ l("div", { className: "mb-1 flex items-start gap-2", children: [
-                      e.icon && /* @__PURE__ */ i(
-                        Q,
-                        {
-                          name: e.icon,
-                          size: "sm",
-                          className: "text-d-muted-foreground mt-0.5 shrink-0"
-                        }
+                  cardId: d.id,
+                  dropDisabled: r,
+                  className: "mb-2 border-0 last:mb-0",
+                  onDropOverListItem: (a, n) => {
+                    if (r || n === "none") return;
+                    const s = v(a);
+                    L(
+                      s.id,
+                      d.id,
+                      e.id,
+                      n
+                    );
+                  },
+                  children: /* @__PURE__ */ o(
+                    E,
+                    {
+                      data: d,
+                      dragDisabled: r,
+                      className: B(
+                        "group/card relative rounded-xl border border-transparent shadow-sm transition-all duration-200",
+                        !r && "hover:-translate-y-0.5 hover:border-d-border/60 hover:shadow-lg"
                       ),
-                      /* @__PURE__ */ i(R, { className: "flex-1 text-sm leading-snug font-medium", children: e.title })
-                    ] }),
-                    e.description && /* @__PURE__ */ i(W, { className: "text-d-muted-foreground mt-1.5 line-clamp-2 text-xs", children: e.description })
-                  ] })
-                }
-              )
-            },
-            e.id
-          )) })
+                      backgroundColor: i,
+                      onEdit: x ? () => x(d, e.id) : void 0,
+                      actions: D?.(d, e.id),
+                      meta: d.meta,
+                      children: g ? g(d, e.id) : /* @__PURE__ */ l(H, { children: [
+                        /* @__PURE__ */ l("div", { className: "mb-1 flex items-start gap-2", children: [
+                          d.icon && /* @__PURE__ */ o(
+                            X,
+                            {
+                              name: d.icon,
+                              size: "sm",
+                              className: "text-d-muted-foreground mt-0.5 shrink-0"
+                            }
+                          ),
+                          /* @__PURE__ */ o(G, { className: "flex-1 text-sm leading-snug font-semibold", children: d.title })
+                        ] }),
+                        d.description && /* @__PURE__ */ o(Q, { className: "text-d-muted-foreground mt-1.5 line-clamp-2 text-xs leading-relaxed", children: d.description })
+                      ] })
+                    }
+                  )
+                },
+                d.id
+              ))
+            }
+          )
         ]
       },
-      r.id
+      e.id
     );
   }) }) });
 }
 export {
-  M as AppKanban
+  ne as AppKanban
 };

package/dist/components/ui/app-time-picker.js

@@ -0,0 +1,244 @@
+"use client";
+import { jsxs as u, jsx as i } from "react/jsx-runtime";
+import { designTokens as f } from "../design-tokens.js";
+import { Icon as A } from "./icon.js";
+import { Label as ne } from "./label.js";
+import { Popover as oe, PopoverTrigger as re, PopoverContent as ie } from "./popover.js";
+import { cn as z } from "../../lib/utils.js";
+import { useState as I, useRef as _, useCallback as U, useMemo as S, useLayoutEffect as ae } from "react";
+import { Button as L } from "./button.js";
+const de = {
+  sm: f.sizes.sm,
+  default: f.sizes.default,
+  lg: f.sizes.lg
+}, le = {
+  default: "bg-d-input border-d-border/50",
+  destructive: "bg-d-destructive/10 border-d-destructive/50 text-d-destructive",
+  outline: "bg-transparent border-d-foreground",
+  secondary: "bg-d-secondary border-d-border text-d-secondary-foreground",
+  ghost: "bg-transparent border-transparent hover:bg-d-accent",
+  link: "bg-transparent border-transparent text-d-primary underline-offset-4 hover:underline"
+};
+function k({
+  options: a,
+  value: l,
+  onChange: g,
+  type: b,
+  className: T,
+  disabledValues: w
+}) {
+  const m = _(null);
+  return ae(() => {
+    m.current && l !== void 0 && m.current.scrollIntoView({
+      behavior: "instant",
+      block: "center"
+    });
+  }, [l]), /* @__PURE__ */ u(
+    "div",
+    {
+      className: z(
+        "flex min-h-0 w-14 flex-col items-center overflow-hidden sm:w-16",
+        T
+      ),
+      children: [
+        /* @__PURE__ */ i("div", { className: "text-d-muted-foreground py-2 text-[10px] font-semibold tracking-wider uppercase", children: b === "hour" ? "HH" : b === "minute" ? "MM" : "SS" }),
+        /* @__PURE__ */ i("div", { className: "flex min-h-0 w-full flex-1 flex-col overflow-auto overscroll-contain px-1.5", children: a.map((c) => {
+          const N = w?.has(c) ?? !1;
+          return /* @__PURE__ */ i(
+            L,
+            {
+              ref: l !== void 0 && c === l ? m : void 0,
+              variant: l !== void 0 && c === l ? "default" : "ghost",
+              size: "sm",
+              disabled: N,
+              onClick: () => g(c),
+              children: c.toString().padStart(2, "0")
+            },
+            c
+          );
+        }) })
+      ]
+    }
+  );
+}
+function ve(a) {
+  const {
+    value: l,
+    onChange: g,
+    onClear: b,
+    label: T,
+    placeholder: w = "Seleziona orario",
+    disabled: m = !1,
+    clearable: c = !1,
+    className: N,
+    labelClassName: B,
+    wrpClassName: E,
+    size: W = "default",
+    variant: X = "default",
+    useUtc: d = !1,
+    withSeconds: H = !1,
+    id: q,
+    "data-testid": F
+  } = a, [G, D] = I(
+    void 0
+  ), [V, J] = I(!1), K = _(null), p = a.hasOwnProperty("value"), s = p ? l : G, P = U(() => {
+    p || D(void 0), g?.(void 0), b?.();
+  }, [p, g, b]), O = U(() => {
+    if (!s) return "";
+    let e, n, o;
+    d ? (e = s.getUTCHours(), n = s.getUTCMinutes(), o = s.getUTCSeconds()) : (e = s.getHours(), n = s.getMinutes(), o = s.getSeconds());
+    const v = [
+      e.toString().padStart(2, "0"),
+      n.toString().padStart(2, "0")
+    ];
+    return H && v.push(o.toString().padStart(2, "0")), v.join(":");
+  }, [s, d, H])(), M = U(
+    (e, n) => {
+      const o = s ? new Date(s) : /* @__PURE__ */ new Date();
+      d ? (s || o.setUTCHours(0, 0, 0, 0), e === "hour" ? o.setUTCHours(n) : e === "minute" ? o.setUTCMinutes(n) : e === "second" && o.setUTCSeconds(n)) : (s || o.setHours(0, 0, 0, 0), e === "hour" ? o.setHours(n) : e === "minute" ? o.setMinutes(n) : e === "second" && o.setSeconds(n)), p || D(o), g?.(o);
+    },
+    [s, g, d, p]
+  ), h = d ? s?.getUTCHours() : s?.getHours(), x = d ? s?.getUTCMinutes() : s?.getMinutes(), Q = d ? s?.getUTCSeconds() : s?.getSeconds(), Y = S(
+    () => Array.from({ length: 24 }, (e, n) => n),
+    []
+  ), Z = S(
+    () => Array.from({ length: 60 }, (e, n) => n),
+    []
+  ), $ = S(
+    () => Array.from({ length: 60 }, (e, n) => n),
+    []
+  ), { disabledHours: ee, disabledMinutes: te, disabledSeconds: se } = S(() => {
+    const e = /* @__PURE__ */ new Set(), n = /* @__PURE__ */ new Set(), o = /* @__PURE__ */ new Set(), v = d ? (r) => r.getUTCHours() : (r) => r.getHours(), j = d ? (r) => r.getUTCMinutes() : (r) => r.getMinutes(), R = d ? (r) => r.getUTCSeconds() : (r) => r.getSeconds();
+    if (a.minTime) {
+      const r = v(a.minTime), C = j(a.minTime), y = R(a.minTime);
+      for (let t = 0; t < r; t++) e.add(t);
+      if (h !== void 0 && h === r) {
+        for (let t = 0; t < C; t++) n.add(t);
+        if (x !== void 0 && x === C)
+          for (let t = 0; t < y; t++) o.add(t);
+      }
+    }
+    if (a.maxTime) {
+      const r = v(a.maxTime), C = j(a.maxTime), y = R(a.maxTime);
+      for (let t = r + 1; t < 24; t++) e.add(t);
+      if (h !== void 0 && h === r) {
+        for (let t = C + 1; t < 60; t++) n.add(t);
+        if (x !== void 0 && x === C)
+          for (let t = y + 1; t < 60; t++) o.add(t);
+      }
+    }
+    return { disabledHours: e, disabledMinutes: n, disabledSeconds: o };
+  }, [a.minTime, a.maxTime, h, x, d]);
+  return /* @__PURE__ */ u("div", { className: z("flex flex-col gap-1.5", E), children: [
+    T && /* @__PURE__ */ i(ne, { className: B, children: T }),
+    /* @__PURE__ */ u(
+      oe,
+      {
+        open: m ? !1 : V,
+        onOpenChange: (e) => !m && J(e),
+        modal: !0,
+        children: [
+          /* @__PURE__ */ i(re, { asChild: !0, children: /* @__PURE__ */ u(
+            "div",
+            {
+              ref: K,
+              id: q,
+              "data-testid": F,
+              className: z(
+                f.input.base,
+                f.radius.default,
+                f.focusRingWithin,
+                "flex w-fit min-w-[120px] cursor-pointer items-center justify-between gap-3 transition-colors",
+                V && f.activeRing,
+                de[W],
+                le[X],
+                m && "cursor-not-allowed opacity-50",
+                N
+              ),
+              children: [
+                /* @__PURE__ */ u("div", { className: "flex items-center gap-2 overflow-hidden", children: [
+                  /* @__PURE__ */ i(A, { name: "Clock", size: "xs", className: "opacity-50" }),
+                  O ? /* @__PURE__ */ i("span", { className: "text-d-foreground truncate font-medium tabular-nums", children: O }) : /* @__PURE__ */ i("span", { className: "text-d-muted-foreground whitespace-nowrap", children: w })
+                ] }),
+                /* @__PURE__ */ u("div", { className: "text-d-muted-foreground/30 flex items-center gap-1.5", children: [
+                  c && s && /* @__PURE__ */ i(
+                    "div",
+                    {
+                      role: "button",
+                      className: "bg-d-accent hover:bg-d-accent/80 border-d-border flex cursor-pointer items-center justify-center rounded-full border p-1 transition-colors",
+                      onClick: (e) => {
+                        e.stopPropagation(), e.preventDefault(), P();
+                      },
+                      onMouseDown: (e) => e.preventDefault(),
+                      "aria-label": "Clear selection",
+                      children: /* @__PURE__ */ i(
+                        A,
+                        {
+                          name: "X",
+                          size: "xs",
+                          className: "!text-d-foreground opacity-50"
+                        }
+                      )
+                    }
+                  ),
+                  d && /* @__PURE__ */ i("span", { className: "text-[10px] font-bold", children: "UTC" })
+                ] })
+              ]
+            }
+          ) }),
+          /* @__PURE__ */ u(ie, { className: "flex w-auto flex-col p-0", align: "start", children: [
+            /* @__PURE__ */ u("div", { className: "divide-d-border flex min-h-0 flex-1 items-start divide-x", children: [
+              /* @__PURE__ */ i(
+                k,
+                {
+                  type: "hour",
+                  value: h,
+                  options: Y,
+                  onChange: (e) => M("hour", e),
+                  disabledValues: ee,
+                  className: "flex max-h-64 flex-1"
+                }
+              ),
+              /* @__PURE__ */ i(
+                k,
+                {
+                  type: "minute",
+                  value: x,
+                  options: Z,
+                  onChange: (e) => M("minute", e),
+                  disabledValues: te,
+                  className: "flex max-h-64 flex-1"
+                }
+              ),
+              H && /* @__PURE__ */ i(
+                k,
+                {
+                  type: "second",
+                  value: Q,
+                  options: $,
+                  onChange: (e) => M("second", e),
+                  disabledValues: se,
+                  className: "flex max-h-64 flex-1"
+                }
+              )
+            ] }),
+            s && /* @__PURE__ */ i("div", { className: "border-d-border flex border-t p-1", children: /* @__PURE__ */ i(
+              L,
+              {
+                size: "sm",
+                variant: "ghost",
+                className: "w-full",
+                onClick: P,
+                children: "Clear"
+              }
+            ) })
+          ] })
+        ]
+      }
+    )
+  ] });
+}
+export {
+  ve as AppTimePicker,
+  k as TimePickerColumn
+};