@senitix/ui 0.4.0 → 0.4.2

package/dist/multi-container-DmkgnCJN.js

@@ -0,0 +1,799 @@
+import { jsx as e, jsxs as T, Fragment as ie } from "react/jsx-runtime";
+import * as s from "react";
+import { u as $, C as G, g as de, a as P, b as O, c as te, D as V, d as re, S as X, v as Y, h as le, e as Z, f as q, s as H, K as J, P as Q, p as ce, r as ue, i as ne } from "./sortable.esm-Cb8oRBzU.js";
+import { c as M } from "./index-BGUveO6l.js";
+import { u as me } from "./locale-provider-BHGNO4j7.js";
+import { c as fe, S as ge } from "./scroll-area-CGNbDUBQ.js";
+import { C as ee } from "./chevron-right-Di90aqSn.js";
+import { F as oe } from "./file-CHbdXCWO.js";
+/**
+ * @license lucide-react v0.441.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const se = fe("Folder", [
+  [
+    "path",
+    {
+      d: "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z",
+      key: "1kt360"
+    }
+  ]
+]);
+function he({
+  id: n,
+  children: t,
+  className: r,
+  disabled: o = !1
+}) {
+  const {
+    attributes: a,
+    listeners: m,
+    setNodeRef: f,
+    transform: I,
+    transition: v,
+    isDragging: i
+  } = $({ id: n, disabled: o }), x = s.useMemo(() => ({
+    transform: G.Transform.toString(I),
+    transition: v,
+    opacity: i ? 0.5 : 1
+  }), [I, v, i]);
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: f,
+      style: x,
+      className: M(
+        "rounded-xl border bg-card text-card-foreground p-3 shadow-sm touch-none select-none",
+        i && "z-50 ring-2 ring-primary/30",
+        o && "opacity-50 cursor-not-allowed",
+        !o && !i && "cursor-grab hover:shadow-md hover:border-primary/30",
+        !o && i && "cursor-grabbing",
+        r
+      ),
+      ...a,
+      ...m,
+      children: /* @__PURE__ */ e("div", { className: "min-w-0", children: t })
+    }
+  );
+}
+function pe(n, t, r) {
+  const o = {
+    ...n
+  };
+  return t.top + n.y <= r.top ? o.y = r.top - t.top : t.bottom + n.y >= r.top + r.height && (o.y = r.top + r.height - t.bottom), t.left + n.x <= r.left ? o.x = r.left - t.left : t.right + n.x >= r.left + r.width && (o.x = r.left + r.width - t.right), o;
+}
+const U = (n) => {
+  let {
+    transform: t,
+    draggingNodeRect: r,
+    windowRect: o
+  } = n;
+  return !r || !o ? t : pe(t, r, o);
+}, _ = (n) => {
+  let {
+    activatorEvent: t,
+    draggingNodeRect: r,
+    transform: o
+  } = n;
+  if (r && t) {
+    const a = de(t);
+    if (!a)
+      return o;
+    const m = a.x - r.left, f = a.y - r.top;
+    return {
+      ...o,
+      x: o.x + m - r.width / 2,
+      y: o.y + f - r.height / 2
+    };
+  }
+  return o;
+}, xe = {
+  sm: "gap-1",
+  md: "gap-2",
+  lg: "gap-4"
+}, be = {
+  sideEffects: q({
+    styles: {
+      active: {
+        opacity: "0.5"
+      }
+    }
+  })
+};
+function We({
+  items: n,
+  onReorder: t,
+  renderItem: r,
+  renderOverlay: o,
+  direction: a = "vertical",
+  className: m,
+  itemClassName: f,
+  disabled: I = !1,
+  gap: v = "md"
+}) {
+  const [i, x] = s.useState(null), g = P(
+    O(Q, {
+      activationConstraint: {
+        distance: 5
+      }
+    }),
+    O(J, {
+      coordinateGetter: H
+    })
+  ), k = s.useCallback((C) => {
+    x(C.active.id);
+  }, []), N = s.useCallback((C) => {
+    const { active: d, over: w } = C;
+    if (w && d.id !== w.id) {
+      const E = n.findIndex((c) => c.id === d.id), l = n.findIndex((c) => c.id === w.id);
+      E !== -1 && l !== -1 && t(te(n, E, l));
+    }
+    x(null);
+  }, [n, t]), A = s.useCallback(() => {
+    x(null);
+  }, []), b = s.useMemo(
+    () => n.find((C) => C.id === i),
+    [i, n]
+  ), S = s.useMemo(() => n.map((C) => C.id), [n]);
+  return /* @__PURE__ */ T(
+    V,
+    {
+      sensors: g,
+      collisionDetection: re,
+      onDragStart: k,
+      onDragEnd: N,
+      onDragCancel: A,
+      children: [
+        /* @__PURE__ */ e(
+          X,
+          {
+            items: S,
+            strategy: a === "vertical" ? Y : le,
+            children: /* @__PURE__ */ e(
+              "div",
+              {
+                className: M(
+                  "flex",
+                  a === "vertical" ? "flex-col" : "flex-row flex-wrap",
+                  xe[v],
+                  m
+                ),
+                children: n.map((C) => /* @__PURE__ */ e(
+                  he,
+                  {
+                    id: C.id,
+                    className: f,
+                    disabled: I,
+                    children: r(C)
+                  },
+                  C.id
+                ))
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ e(Z, { dropAnimation: be, modifiers: [_, U], children: b ? /* @__PURE__ */ e("div", { className: "rounded-xl border bg-card text-card-foreground p-3 shadow-2xl ring-2 ring-primary/30 cursor-grabbing", children: o ? o(b) : r(b) }) : null })
+      ]
+    }
+  );
+}
+const ve = s.memo(function({
+  id: t,
+  children: r,
+  className: o
+}) {
+  const {
+    attributes: a,
+    listeners: m,
+    setNodeRef: f,
+    transform: I,
+    transition: v,
+    isDragging: i
+  } = $({ id: t }), x = s.useMemo(() => ({
+    transform: G.Transform.toString(I),
+    transition: v,
+    opacity: i ? 0.5 : 1
+  }), [I, v, i]);
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: f,
+      style: x,
+      className: M(
+        "rounded-xl border bg-card text-card-foreground p-3 shadow-sm touch-none select-none",
+        i && "ring-2 ring-primary/20",
+        !i && "cursor-grab hover:shadow-md hover:border-primary/30",
+        i && "cursor-grabbing",
+        o
+      ),
+      ...a,
+      ...m,
+      children: /* @__PURE__ */ e("div", { className: "min-w-0", children: r })
+    }
+  );
+});
+function R() {
+  return /* @__PURE__ */ T("div", { className: "rounded-xl border bg-card p-3 animate-pulse", children: [
+    /* @__PURE__ */ e("div", { className: "h-4 w-3/4 rounded bg-muted mb-2" }),
+    /* @__PURE__ */ e("div", { className: "h-3 w-1/2 rounded bg-muted" })
+  ] });
+}
+function Ce({
+  column: n,
+  items: t,
+  renderItem: r,
+  renderColumnHeader: o,
+  columnClassName: a,
+  itemClassName: m,
+  collapsible: f = !1,
+  isLoading: I = !1,
+  emptyPlaceholder: v
+}) {
+  const [i, x] = s.useState(!1), { setNodeRef: g, isOver: k } = ne({
+    id: `column-${n.id}`,
+    data: {
+      type: "column",
+      columnId: n.id
+    }
+  });
+  return f && i ? /* @__PURE__ */ T(
+    "div",
+    {
+      className: M(
+        "flex flex-col items-center min-w-[48px] w-[48px] bg-muted/30 border border-border/50 rounded-xl p-2 cursor-pointer transition-colors hover:bg-muted/50",
+        a
+      ),
+      onClick: () => x(!1),
+      children: [
+        /* @__PURE__ */ e(ee, { className: "h-4 w-4 text-muted-foreground mb-2" }),
+        /* @__PURE__ */ e("span", { className: "text-xs font-medium text-muted-foreground bg-background border px-1.5 py-0.5 rounded-full shadow-sm mb-2", children: t.length }),
+        /* @__PURE__ */ e("span", { className: "text-xs font-semibold text-foreground [writing-mode:vertical-lr] rotate-180", children: n.title })
+      ]
+    }
+  ) : /* @__PURE__ */ T(
+    "div",
+    {
+      ref: g,
+      className: M(
+        "flex flex-col min-w-[280px] w-[280px] bg-muted/30 border border-border/50 rounded-xl transition-colors duration-200",
+        k && "ring-2 ring-primary/30 bg-primary/5",
+        a
+      ),
+      children: [
+        n.color && /* @__PURE__ */ e(
+          "div",
+          {
+            className: "h-[3px] rounded-t-xl",
+            style: { backgroundColor: n.color }
+          }
+        ),
+        /* @__PURE__ */ T("div", { className: "flex items-center justify-between p-3 pb-0", children: [
+          /* @__PURE__ */ T("div", { className: "flex items-center gap-2", children: [
+            f && /* @__PURE__ */ e(
+              "button",
+              {
+                onClick: () => x(!0),
+                className: "p-0.5 rounded hover:bg-muted transition-colors",
+                children: /* @__PURE__ */ e(ee, { className: "h-3.5 w-3.5 text-muted-foreground rotate-90" })
+              }
+            ),
+            o ? o(n) : /* @__PURE__ */ e("h3", { className: "font-semibold text-sm text-foreground", children: n.title })
+          ] }),
+          /* @__PURE__ */ e("span", { className: "text-xs font-medium text-muted-foreground bg-background border px-2 py-0.5 rounded-full shadow-sm", children: t.length })
+        ] }),
+        /* @__PURE__ */ e(ge, { className: "flex-1", children: /* @__PURE__ */ e(
+          X,
+          {
+            items: t.map((N) => N.id),
+            strategy: Y,
+            children: /* @__PURE__ */ e("div", { className: "flex flex-col gap-2 p-3 min-h-[100px] flex-1", children: I ? /* @__PURE__ */ T(ie, { children: [
+              /* @__PURE__ */ e(R, {}),
+              /* @__PURE__ */ e(R, {}),
+              /* @__PURE__ */ e(R, {})
+            ] }) : t.length === 0 ? /* @__PURE__ */ e("div", { className: "flex flex-col items-center justify-center rounded-lg border-2 border-dashed border-muted-foreground/20 py-8 text-center transition-colors", children: /* @__PURE__ */ e("p", { className: "text-sm text-muted-foreground", children: v }) }) : t.map((N) => /* @__PURE__ */ e(
+              ve,
+              {
+                id: N.id,
+                className: m,
+                children: r(N)
+              },
+              N.id
+            )) })
+          }
+        ) })
+      ]
+    }
+  );
+}
+const ye = (n) => {
+  const r = ce(n).filter(
+    (a) => !String(a.id).startsWith("column-")
+  );
+  return r.length > 0 ? r : ue(n);
+}, Ie = {
+  sideEffects: q({
+    styles: {
+      active: {
+        opacity: "0.5"
+      }
+    }
+  })
+};
+function je({
+  columns: n,
+  items: t,
+  onItemMove: r,
+  onReorder: o,
+  renderItem: a,
+  renderColumnHeader: m,
+  className: f,
+  columnClassName: I,
+  itemClassName: v,
+  collapsible: i = !1,
+  isLoading: x = !1,
+  emptyPlaceholder: g
+}) {
+  const [k, N] = s.useState(null), { t: A } = me(), b = s.useRef(null), S = P(
+    O(Q, {
+      activationConstraint: {
+        distance: 5
+      }
+    }),
+    O(J, {
+      coordinateGetter: H
+    })
+  ), C = s.useCallback(
+    (u) => t.filter((h) => h.columnId === u),
+    [t]
+  ), d = s.useCallback(
+    (u) => {
+      const h = t.find((p) => p.id === u);
+      return h == null ? void 0 : h.columnId;
+    },
+    [t]
+  ), w = s.useCallback(
+    (u) => {
+      const h = String(u);
+      return h.startsWith("column-") ? h.replace("column-", "") : d(u);
+    },
+    [d]
+  ), E = s.useCallback((u) => {
+    N(u.active.id), b.current = null;
+  }, []), l = s.useCallback((u) => {
+    const { active: h, over: p } = u;
+    if (!p) return;
+    const K = d(h.id), F = w(p.id);
+    if (!K || !F || K === F || b.current === p.id) return;
+    b.current = p.id;
+    const L = C(F), j = String(p.id);
+    let W;
+    if (j.startsWith("column-"))
+      W = L.length;
+    else {
+      const B = L.findIndex((z) => z.id === p.id);
+      W = B >= 0 ? B : L.length;
+    }
+    r(h.id, K, F, W);
+  }, [d, w, C, r]), c = s.useCallback((u) => {
+    const { active: h, over: p } = u;
+    if (!p) {
+      N(null), b.current = null;
+      return;
+    }
+    const K = d(h.id), F = String(p.id);
+    let L;
+    if (F.startsWith("column-") ? L = F.replace("column-", "") : L = d(p.id), !K) {
+      N(null), b.current = null;
+      return;
+    }
+    if (K === L && h.id !== p.id && o && !F.startsWith("column-")) {
+      const j = C(K), W = j.findIndex((z) => z.id === h.id), B = j.findIndex((z) => z.id === p.id);
+      W !== -1 && B !== -1 && o(K, te(j, W, B));
+    }
+    N(null), b.current = null;
+  }, [d, C, o]), y = s.useCallback(() => {
+    N(null), b.current = null;
+  }, []), D = s.useMemo(
+    () => t.find((u) => u.id === k),
+    [k, t]
+  );
+  return /* @__PURE__ */ T(
+    V,
+    {
+      sensors: S,
+      collisionDetection: ye,
+      onDragStart: E,
+      onDragOver: l,
+      onDragEnd: c,
+      onDragCancel: y,
+      children: [
+        /* @__PURE__ */ e("div", { className: M("flex gap-4 overflow-x-auto p-1", f), children: n.map((u) => {
+          const h = C(u.id);
+          return /* @__PURE__ */ e(
+            Ce,
+            {
+              column: u,
+              items: h,
+              renderItem: a,
+              renderColumnHeader: m,
+              columnClassName: I,
+              itemClassName: v,
+              collapsible: i,
+              isLoading: x,
+              emptyPlaceholder: g ?? A("kanban.dragHere")
+            },
+            u.id
+          );
+        }) }),
+        /* @__PURE__ */ e(Z, { dropAnimation: Ie, modifiers: [_, U], children: D ? /* @__PURE__ */ e("div", { className: "rounded-xl border bg-card text-card-foreground p-3 shadow-xl rotate-1 scale-[1.02] cursor-grabbing", children: /* @__PURE__ */ e("div", { className: "min-w-0", children: a(D) }) }) : null })
+      ]
+    }
+  );
+}
+const Ne = s.memo(function({
+  node: t,
+  depth: r,
+  expanded: o,
+  onToggle: a,
+  renderNode: m
+}) {
+  const {
+    attributes: f,
+    listeners: I,
+    setNodeRef: v,
+    transform: i,
+    transition: x,
+    isDragging: g
+  } = $({ id: t.id }), k = s.useMemo(() => ({
+    transform: G.Transform.toString(i),
+    transition: x,
+    paddingLeft: `${r * 20 + 8}px`,
+    opacity: g ? 0.5 : 1
+  }), [i, x, r, g]), N = t.children && t.children.length > 0, A = t.isFolder || N, b = s.useCallback((S) => {
+    S.stopPropagation(), a();
+  }, [a]);
+  return /* @__PURE__ */ T(
+    "div",
+    {
+      ref: v,
+      style: k,
+      className: M(
+        "flex items-center gap-2 py-2 pr-3 rounded-lg touch-none select-none",
+        g && "bg-muted ring-1 ring-primary/20",
+        !g && "cursor-grab hover:bg-muted/60",
+        g && "cursor-grabbing"
+      ),
+      ...f,
+      ...I,
+      children: [
+        A ? /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            onClick: b,
+            className: "flex-shrink-0 p-1 hover:bg-muted rounded-md transition-colors duration-200",
+            children: /* @__PURE__ */ e(
+              ee,
+              {
+                className: M(
+                  "h-4 w-4 text-muted-foreground transition-transform duration-200",
+                  o && "rotate-90"
+                )
+              }
+            )
+          }
+        ) : /* @__PURE__ */ e("span", { className: "w-6" }),
+        /* @__PURE__ */ e("span", { className: M(
+          "flex-shrink-0",
+          A ? "text-primary/80" : "text-muted-foreground"
+        ), children: A ? /* @__PURE__ */ e(se, { className: "h-4 w-4" }) : /* @__PURE__ */ e(oe, { className: "h-4 w-4" }) }),
+        /* @__PURE__ */ e("span", { className: "flex-1 truncate text-sm text-foreground", children: m ? m(t) : t.label })
+      ]
+    }
+  );
+});
+function ae(n, t, r = 0) {
+  const o = [];
+  for (const a of n)
+    o.push({ node: a, depth: r }), a.children && t.has(a.id) && o.push(...ae(a.children, t, r + 1));
+  return o;
+}
+const we = {
+  sideEffects: q({
+    styles: {
+      active: {
+        opacity: "0.5"
+      }
+    }
+  })
+};
+function Be({
+  data: n,
+  onMove: t,
+  onToggle: r,
+  renderNode: o,
+  className: a,
+  defaultExpanded: m = /* @__PURE__ */ new Set()
+}) {
+  const [f, I] = s.useState(m), [v, i] = s.useState(null), x = P(
+    O(Q, {
+      activationConstraint: {
+        distance: 5
+      }
+    }),
+    O(J, {
+      coordinateGetter: H
+    })
+  ), g = s.useMemo(
+    () => ae(n, f),
+    [n, f]
+  ), k = s.useCallback((d) => {
+    I((w) => {
+      const E = new Set(w), l = E.has(d);
+      return l ? E.delete(d) : E.add(d), r == null || r(d, !l), E;
+    });
+  }, [r]), N = s.useCallback((d) => {
+    i(d.active.id);
+  }, []), A = s.useCallback((d) => {
+    const { active: w, over: E } = d;
+    if (E && w.id !== E.id) {
+      const l = g.findIndex((y) => y.node.id === w.id), c = g.findIndex((y) => y.node.id === E.id);
+      l !== -1 && c !== -1 && (t == null || t(w.id, null, c));
+    }
+    i(null);
+  }, [g, t]), b = s.useCallback(() => {
+    i(null);
+  }, []), S = s.useMemo(
+    () => {
+      var d;
+      return (d = g.find((w) => w.node.id === v)) == null ? void 0 : d.node;
+    },
+    [v, g]
+  ), C = s.useMemo(
+    () => g.map((d) => d.node.id),
+    [g]
+  );
+  return /* @__PURE__ */ T(
+    V,
+    {
+      sensors: x,
+      collisionDetection: re,
+      onDragStart: N,
+      onDragEnd: A,
+      onDragCancel: b,
+      children: [
+        /* @__PURE__ */ e(
+          X,
+          {
+            items: C,
+            strategy: Y,
+            children: /* @__PURE__ */ e("div", { className: M("border rounded-xl p-3 bg-card shadow-sm", a), children: g.map(({ node: d, depth: w }) => /* @__PURE__ */ e(
+              Ne,
+              {
+                node: d,
+                depth: w,
+                expanded: f.has(d.id),
+                onToggle: () => k(d.id),
+                renderNode: o
+              },
+              d.id
+            )) })
+          }
+        ),
+        /* @__PURE__ */ e(Z, { dropAnimation: we, modifiers: [_, U], children: S ? /* @__PURE__ */ T("div", { className: "flex items-center gap-2 py-2 px-3 rounded-lg bg-card border shadow-2xl ring-2 ring-primary/30 cursor-grabbing", children: [
+          /* @__PURE__ */ e("span", { className: M(
+            "flex-shrink-0",
+            S.isFolder || S.children && S.children.length > 0 ? "text-primary/80" : "text-muted-foreground"
+          ), children: S.isFolder || S.children && S.children.length > 0 ? /* @__PURE__ */ e(se, { className: "h-4 w-4" }) : /* @__PURE__ */ e(oe, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ e("span", { className: "text-sm text-foreground", children: o ? o(S) : S.label })
+        ] }) : null })
+      ]
+    }
+  );
+}
+function Se({ id: n, children: t, className: r, isEmpty: o }) {
+  const { setNodeRef: a, isOver: m } = ne({ id: n });
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: a,
+      className: M(
+        "min-h-[100px] rounded-xl transition-colors duration-200",
+        m && "bg-primary/5 ring-2 ring-primary/30",
+        o && "border-2 border-dashed border-muted-foreground/30",
+        r
+      ),
+      children: t
+    }
+  );
+}
+const De = s.memo(function({
+  id: t,
+  children: r,
+  className: o
+}) {
+  const {
+    attributes: a,
+    listeners: m,
+    setNodeRef: f,
+    transform: I,
+    transition: v,
+    isDragging: i
+  } = $({ id: t }), x = s.useMemo(() => ({
+    transform: G.Transform.toString(I),
+    transition: v,
+    opacity: i ? 0.5 : 1
+  }), [I, v, i]);
+  return /* @__PURE__ */ e(
+    "div",
+    {
+      ref: f,
+      style: x,
+      className: M(
+        "rounded-xl border bg-card text-card-foreground p-3 shadow-sm touch-none select-none",
+        i && "ring-2 ring-primary/20",
+        !i && "cursor-grab hover:shadow-md hover:border-primary/30",
+        i && "cursor-grabbing",
+        o
+      ),
+      ...a,
+      ...m,
+      children: /* @__PURE__ */ e("div", { className: "min-w-0", children: r })
+    }
+  );
+}), ke = {
+  horizontal: "flex gap-4 overflow-x-auto",
+  vertical: "flex flex-col gap-4",
+  grid: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4"
+}, Ee = {
+  sideEffects: q({
+    styles: {
+      active: {
+        opacity: "0.5"
+      }
+    }
+  })
+};
+function ze({
+  containers: n,
+  items: t,
+  onItemMove: r,
+  onReorder: o,
+  renderItem: a,
+  renderContainerHeader: m,
+  renderEmptyContainer: f,
+  className: I,
+  containerClassName: v,
+  itemClassName: i,
+  layout: x = "horizontal"
+}) {
+  const [g, k] = s.useState(null), N = P(
+    O(Q, {
+      activationConstraint: {
+        distance: 5
+      }
+    }),
+    O(J, {
+      coordinateGetter: H
+    })
+  ), A = s.useCallback(
+    (l) => t.filter((c) => c.containerId === l),
+    [t]
+  ), b = s.useCallback(
+    (l) => {
+      const c = t.find((y) => y.id === l);
+      return c == null ? void 0 : c.containerId;
+    },
+    [t]
+  ), S = s.useCallback((l) => {
+    k(l.active.id);
+  }, []), C = s.useCallback((l) => {
+    var K;
+    const { active: c, over: y } = l;
+    if (!y) return;
+    const D = b(c.id);
+    let u = b(y.id);
+    if (u || (u = (K = n.find((F) => F.id === y.id)) == null ? void 0 : K.id), !D || !u || D === u) return;
+    const h = A(u), p = h.findIndex((F) => F.id === y.id);
+    r(
+      c.id,
+      D,
+      u,
+      p >= 0 ? p : h.length
+    );
+  }, [n, b, A, r]), d = s.useCallback((l) => {
+    var h;
+    const { active: c, over: y } = l;
+    if (!y) {
+      k(null);
+      return;
+    }
+    const D = b(c.id);
+    if (!D) {
+      k(null);
+      return;
+    }
+    const u = b(y.id) || ((h = n.find((p) => p.id === y.id)) == null ? void 0 : h.id);
+    if (D === u && c.id !== y.id && o) {
+      const p = A(D), K = p.findIndex((L) => L.id === c.id), F = p.findIndex((L) => L.id === y.id);
+      K !== -1 && F !== -1 && o(D, te(p, K, F));
+    }
+    k(null);
+  }, [n, b, A, o]), w = s.useCallback(() => {
+    k(null);
+  }, []), E = s.useMemo(
+    () => t.find((l) => l.id === g),
+    [g, t]
+  );
+  return /* @__PURE__ */ T(
+    V,
+    {
+      sensors: N,
+      collisionDetection: re,
+      onDragStart: S,
+      onDragOver: C,
+      onDragEnd: d,
+      onDragCancel: w,
+      children: [
+        /* @__PURE__ */ e("div", { className: M(ke[x], I), children: n.map((l) => {
+          const c = A(l.id), y = c.length === 0;
+          return /* @__PURE__ */ T(
+            "div",
+            {
+              className: M(
+                "flex flex-col rounded-xl border border-border/50 bg-muted/20 p-4 transition-colors duration-200",
+                x === "horizontal" && "min-w-[280px] w-[280px]",
+                v
+              ),
+              children: [
+                /* @__PURE__ */ e("div", { className: "mb-3", children: m ? m(l, c.length) : /* @__PURE__ */ T("div", { className: "flex items-center justify-between", children: [
+                  /* @__PURE__ */ e("h3", { className: "font-semibold text-sm text-foreground", children: l.title }),
+                  /* @__PURE__ */ e("span", { className: "text-xs font-medium text-muted-foreground bg-background border px-2 py-0.5 rounded-full shadow-sm", children: c.length })
+                ] }) }),
+                /* @__PURE__ */ e(
+                  Se,
+                  {
+                    id: l.id,
+                    isEmpty: y,
+                    className: "flex-1",
+                    children: /* @__PURE__ */ e(
+                      X,
+                      {
+                        items: c.map((D) => D.id),
+                        strategy: Y,
+                        children: /* @__PURE__ */ T("div", { className: "flex flex-col gap-2", children: [
+                          c.map((D) => /* @__PURE__ */ e(
+                            De,
+                            {
+                              id: D.id,
+                              className: i,
+                              children: a(D)
+                            },
+                            D.id
+                          )),
+                          y && f && /* @__PURE__ */ e("div", { className: "flex items-center justify-center py-8 text-muted-foreground text-sm", children: f(l) })
+                        ] })
+                      }
+                    )
+                  }
+                )
+              ]
+            },
+            l.id
+          );
+        }) }),
+        /* @__PURE__ */ e(Z, { dropAnimation: Ee, modifiers: [_, U], children: E ? /* @__PURE__ */ e("div", { className: "rounded-xl border bg-card text-card-foreground p-3 shadow-2xl ring-2 ring-primary/30 cursor-grabbing", children: /* @__PURE__ */ e("div", { className: "min-w-0", children: a(E) }) }) : null })
+      ]
+    }
+  );
+}
+export {
+  je as K,
+  ze as M,
+  he as S,
+  Be as T,
+  We as a
+};
+//# sourceMappingURL=multi-container-DmkgnCJN.js.map