@layers-app/shared 0.2.4 → 0.2.5

package/dist/components/NavMenu/NavMenu.js

@@ -1,107 +1,126 @@
-import { jsxs as j, jsx as n } from "react/jsx-runtime";
-import { useMemo as N, useLayoutEffect as P, useRef as k } from "react";
-import { Stack as y, Skeleton as a, Text as A } from "@mantine/core";
-import { DnDItem as E } from "./components/DnDItem.js";
-import { DnDProvider as O } from "./components/DnDProvider.js";
-import { NavMenuActionIcon as R } from "./components/NavMenuActionIcon.js";
-import { NavMenuItem as f, NavMenuLoadMore as M } from "./components/NavMenuItem.js";
-import { NavMenuLabel as z } from "./components/NavMenuLabel.js";
-import { createNavMenuStore as $, NavMenuProvider as x } from "./store.js";
-import D from "./NavMenu.module.css.js";
-const q = ({
+import { jsxs as y, jsx as r } from "react/jsx-runtime";
+import { useMemo as x, useLayoutEffect as E, useRef as O } from "react";
+import { Stack as R, Skeleton as l, Text as w } from "@mantine/core";
+import { DnDItem as z } from "./components/DnDItem.js";
+import { DnDProvider as $ } from "./components/DnDProvider.js";
+import { NavMenuActionIcon as q } from "./components/NavMenuActionIcon.js";
+import { NavMenuItem as C, NavMenuLoadMore as D } from "./components/NavMenuItem.js";
+import { NavMenuLabel as B } from "./components/NavMenuLabel.js";
+import { createNavMenuStore as F, NavMenuProvider as L } from "./store.js";
+import T from "./NavMenu.module.css.js";
+const G = ({
   items: o,
-  loading: l,
+  loading: s,
   onLoadMore: i,
-  noItemsPlaceholder: T,
-  onOrderChange: C,
-  onEdit: m,
-  onToggle: g,
-  store: v,
-  totalCount: S
+  noItemsPlaceholder: j,
+  onOrderChange: m,
+  onEdit: g,
+  onToggle: S,
+  onClick: v,
+  store: I,
+  totalCount: N,
+  flatOrderChange: k,
+  canUserDragDrop: A = !0,
+  canDragDropItem: M
 }) => {
-  const t = N(() => v ?? $(), [v]), s = t.useStore((e) => e.opened), h = N(() => {
-    const e = [], d = (I, u) => {
-      for (const [b, p] of I.entries()) {
-        const r = {
-          ...p,
-          depth: u.parentDepth + 1,
-          parentChildrenCount: u.parentChildrenCount,
-          parentTotalChildren: u.parentTotalChildren,
-          isLast: b === I.length - 1
+  const n = x(() => I ?? F(), [I]), c = n.useStore((e) => e.opened), h = x(() => {
+    const e = [], d = (p, f) => {
+      for (const [P, a] of p.entries()) {
+        const t = {
+          ...a,
+          depth: f.parentDepth + 1,
+          parentChildrenCount: f.parentChildrenCount,
+          parentTotalChildren: f.parentTotalChildren,
+          isLast: P === p.length - 1
         };
-        e.push(r), s?.includes(p.id) && p.children.length > 0 && d(p.children, {
-          parentDepth: r.depth,
-          parentChildrenCount: r.children.length,
-          parentTotalChildren: r.children.length
-        }), i && r.isLast && r.parentChildrenCount < r.parentTotalChildren && e.push({
-          ...r,
-          id: `${r.id}-load-more`
+        e.push(t), c?.includes(a.id) && a.children.length > 0 && d(a.children, {
+          parentDepth: t.depth,
+          parentChildrenCount: t.children.length,
+          parentTotalChildren: t.children.length
+        }), i && t.isLast && t.parentChildrenCount < t.parentTotalChildren && e.push({
+          ...t,
+          id: `${t.id}-load-more`
         });
       }
     };
     return d(o, {
       parentDepth: -1,
       parentChildrenCount: o.length,
-      parentTotalChildren: S ?? o.length
+      parentTotalChildren: N ?? o.length
     }), e;
-  }, [o, i, s, S]);
-  P(() => {
-    t.useStore.setState({
+  }, [o, i, c, N]);
+  E(() => {
+    n.useStore.setState({
       props: {
-        onEdit: m ?? t.useStore.getState().props.onEdit,
-        onToggle: g ?? t.useStore.getState().props.onToggle,
-        onLoadMore: i ?? t.useStore.getState().props.onLoadMore
+        onEdit: g ?? n.useStore.getState().props.onEdit,
+        onToggle: S ?? n.useStore.getState().props.onToggle,
+        onClick: v ?? n.useStore.getState().props.onClick,
+        onLoadMore: i ?? n.useStore.getState().props.onLoadMore
       }
     });
-  }, [m, g, i, t]);
-  const c = k(null);
-  return l ? /* @__PURE__ */ j(y, { gap: 4, children: [
-    /* @__PURE__ */ n(a, { h: 32 }),
-    /* @__PURE__ */ n(a, { h: 32 }),
-    /* @__PURE__ */ n(a, { h: 32 }),
-    /* @__PURE__ */ n(a, { h: 32 })
-  ] }) : o?.length ? C ? /* @__PURE__ */ n(x, { store: t, children: /* @__PURE__ */ n(O, { containerRef: c, onOrderChange: C, children: /* @__PURE__ */ n("div", { className: D.container, ref: c, children: h.map((e, d) => e.id.includes("load-more") ? /* @__PURE__ */ n(
-    M,
+  }, [g, S, v, i, n]);
+  const u = O(null);
+  return s ? /* @__PURE__ */ y(R, { gap: 4, children: [
+    /* @__PURE__ */ r(l, { h: 32 }),
+    /* @__PURE__ */ r(l, { h: 32 }),
+    /* @__PURE__ */ r(l, { h: 32 }),
+    /* @__PURE__ */ r(l, { h: 32 })
+  ] }) : o?.length ? m ? /* @__PURE__ */ r(L, { store: n, children: /* @__PURE__ */ r($, { containerRef: u, onOrderChange: m, children: /* @__PURE__ */ r(
+    "div",
     {
-      depth: e.depth,
-      itemId: e.parentId,
-      currentChildrenCount: e.parentChildrenCount ?? 0
-    },
-    e.id
-  ) : /* @__PURE__ */ n(
-    E,
-    {
-      item: e,
-      index: d,
-      items: h,
-      opened: s,
-      children: /* @__PURE__ */ n(f, { item: e })
-    },
-    e.id
-  )) }) }) }) : /* @__PURE__ */ n(x, { store: t, children: /* @__PURE__ */ n("div", { className: D.container, ref: c, children: h.map((e) => e.id.includes("load-more") ? /* @__PURE__ */ n(
-    M,
+      className: T.container,
+      ref: u,
+      "data-flat-order-change": k,
+      children: h.map((e, d) => {
+        if (e.id.includes("load-more"))
+          return /* @__PURE__ */ r(
+            D,
+            {
+              depth: e.depth,
+              itemId: e.parentId,
+              currentChildrenCount: e.parentChildrenCount ?? 0
+            },
+            e.id
+          );
+        const p = M ? M(e) : A;
+        return /* @__PURE__ */ r(
+          z,
+          {
+            item: e,
+            index: d,
+            items: h,
+            opened: c,
+            itemAllowDragDrop: p,
+            children: /* @__PURE__ */ r(C, { item: e })
+          },
+          e.id
+        );
+      })
+    }
+  ) }) }) : /* @__PURE__ */ r(L, { store: n, children: /* @__PURE__ */ r("div", { className: T.container, ref: u, children: h.map((e) => e.id.includes("load-more") ? /* @__PURE__ */ r(
+    D,
     {
       depth: e.depth,
       itemId: e.parentId,
       currentChildrenCount: e.parentChildrenCount ?? 0
     },
     e.id
-  ) : /* @__PURE__ */ n(f, { item: e }, e.id)) }) }) : /* @__PURE__ */ n(L, { children: T });
-}, L = ({ children: o, ...l }) => /* @__PURE__ */ n(
-  A,
+  ) : /* @__PURE__ */ r(C, { item: e }, e.id)) }) }) : /* @__PURE__ */ r(b, { children: j });
+}, b = ({ children: o, ...s }) => /* @__PURE__ */ r(
+  w,
   {
     size: "xs",
     c: "var(--app-container-section-subtitle-color)",
     px: 4,
-    ...l,
+    ...s,
     children: o
   }
-), X = Object.assign(q, {
-  Item: f,
-  ActionIcon: R,
-  Label: z,
-  Placeholder: L
+), ee = Object.assign(G, {
+  Item: C,
+  ActionIcon: q,
+  Label: B,
+  Placeholder: b
 });
 export {
-  X as NavMenu
+  ee as NavMenu
 };

package/dist/components/NavMenu/NavMenu.module.css.js

@@ -1,23 +1,23 @@
-const o = "_container_1kio9_1", t = "_depthBox_1kio9_13", e = "_itemContainer_1kio9_38", n = "_item_1kio9_38", i = "_icon_1kio9_82", _ = "_chevron_1kio9_86", a = "_droppable_1kio9_111", c = "_draggableOverlay_1kio9_165", r = "_editInput_1kio9_174", d = {
-  container: o,
+const n = "_container_1ns3h_1", t = "_depthBox_1ns3h_13", e = "_itemContainer_1ns3h_38", o = "_item_1ns3h_38", _ = "_icon_1ns3h_90", s = "_chevron_1ns3h_94", a = "_droppable_1ns3h_119", c = "_draggableOverlay_1ns3h_176", r = "_editInput_1ns3h_185", i = {
+  container: n,
   depthBox: t,
   itemContainer: e,
-  item: n,
-  icon: i,
-  chevron: _,
+  item: o,
+  icon: _,
+  chevron: s,
   droppable: a,
   draggableOverlay: c,
   editInput: r
 };
 export {
-  _ as chevron,
-  o as container,
-  d as default,
+  s as chevron,
+  n as container,
+  i as default,
   t as depthBox,
   c as draggableOverlay,
   a as droppable,
   r as editInput,
-  i as icon,
-  n as item,
+  _ as icon,
+  o as item,
   e as itemContainer
 };

package/dist/components/NavMenu/components/DnDItem.d.ts

@@ -1,9 +1,10 @@
 import { PropsWithChildren } from 'react';
 import { NavMenuItemDef } from '../types';
-export declare const DnDItem: ({ item, children, index, opened, }: PropsWithChildren<{
+export declare const DnDItem: ({ item, children, index, opened, itemAllowDragDrop, }: PropsWithChildren<{
     item: NavMenuItemDef;
     index: number;
     items: NavMenuItemDef[];
     opened?: string[];
+    itemAllowDragDrop: boolean;
 }>) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=DnDItem.d.ts.map

package/dist/components/NavMenu/components/DnDItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DnDItem.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DnDItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAI1C,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAK1C,eAAO,MAAM,OAAO,GAAI,oCAKrB,iBAAiB,CAAC;IACnB,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;CACnB,CAAC,4CAgDD,CAAC"}
+{"version":3,"file":"DnDItem.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DnDItem.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAK1C,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAI1C,eAAO,MAAM,OAAO,GAAI,uDAMrB,iBAAiB,CAAC;IACnB,IAAI,EAAE,cAAc,CAAC;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,iBAAiB,EAAE,OAAO,CAAC;CAC5B,CAAC,4CAoDD,CAAC"}

package/dist/components/NavMenu/components/DnDItem.js

@@ -1,44 +1,46 @@
-import { jsx as v } from "react/jsx-runtime";
-import { useDraggable as h, useDroppable as y } from "@dnd-kit/core";
-import N from "../NavMenu.module.css.js";
-import { useNavMenuStore as R } from "../store.js";
-const j = ({
+import { jsx as y } from "react/jsx-runtime";
+import { useDraggable as N, useDroppable as R } from "@dnd-kit/core";
+import { useNavMenuStore as I } from "../store.js";
+import S from "../NavMenu.module.css.js";
+const C = ({
   item: e,
-  children: r,
-  index: d,
-  opened: i
+  children: n,
+  index: t,
+  opened: r,
+  itemAllowDragDrop: d
 }) => {
-  const { useStore: a } = R(), n = a((s) => !!s.editId), {
-    attributes: l,
-    listeners: p,
-    setNodeRef: c,
-    isDragging: f,
-    active: t
-  } = h({
+  const { useStore: c } = I(), l = c((s) => !!s.editId), {
+    attributes: p,
+    listeners: f,
+    setNodeRef: u,
+    isDragging: b,
+    active: a
+  } = N({
     id: e.id,
-    data: { ...e, index: d },
-    disabled: n
-  }), g = t ? e.pathById.filter((s) => s !== e.id).includes(t.id.toString()) : !1, o = f || g, { setNodeRef: u, isOver: b } = y({
+    data: { ...e, index: t },
+    disabled: l || !d
+  }), g = a ? e.pathById.filter((s) => s !== e.id).includes(a.id.toString()) : !1, i = b || g, { setNodeRef: o, isOver: v } = R({
     id: e.id,
-    data: { ...e, index: d },
-    disabled: o
-  }), D = i?.includes(e.id) && e.children.length > 0;
-  return /* @__PURE__ */ v(
+    data: { ...e, index: t, itemAllowDragDrop: d },
+    disabled: i
+  }), h = r?.includes(e.id) && e.children.length > 0;
+  return /* @__PURE__ */ y(
     "div",
     {
       ref: (s) => {
-        c(s), u(s);
+        d && u(s), o(s);
       },
-      ...l,
       ...p,
-      style: { opacity: o ? 0.25 : 1 },
-      className: N.droppable,
-      "data-opened": D,
-      "data-is-over": b,
-      children: r
+      ...f,
+      style: { opacity: i ? 0.25 : 1 },
+      className: S.droppable,
+      "data-opened": h,
+      "data-is-over": v,
+      "data-no-access": d ? void 0 : "true",
+      children: n
     }
   );
 };
 export {
-  j as DnDItem
+  C as DnDItem
 };

package/dist/components/NavMenu/components/DnDProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DnDProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DnDProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAa/D,OAAO,EAEL,kBAAkB,EAEnB,MAAM,UAAU,CAAC;AAGlB,KAAK,gBAAgB,GAAG;IACtB,aAAa,EAAE,kBAAkB,CAAC;IAClC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CAC/C,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,4CAIzB,iBAAiB,CAAC,gBAAgB,CAAC,4CA6ErC,CAAC"}
+{"version":3,"file":"DnDProvider.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DnDProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAuB,MAAM,OAAO,CAAC;AAa/D,OAAO,EAEL,kBAAkB,EAEnB,MAAM,UAAU,CAAC;AAGlB,KAAK,gBAAgB,GAAG;IACtB,aAAa,EAAE,kBAAkB,CAAC;IAClC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;CAC/C,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,4CAIzB,iBAAiB,CAAC,gBAAgB,CAAC,4CAqFrC,CAAC"}

package/dist/components/NavMenu/components/DnDProvider.js

@@ -1,9 +1,9 @@
-import { jsxs as S, jsx as T } from "react/jsx-runtime";
-import { useCallback as c, useRef as g } from "react";
-import { useSensor as u, MouseSensor as v, TouchSensor as x, useSensors as A, DndContext as M, pointerWithin as B } from "@dnd-kit/core";
+import { jsxs as g, jsx as S } from "react/jsx-runtime";
+import { useCallback as c, useRef as T } from "react";
+import { useSensor as u, MouseSensor as v, TouchSensor as A, useSensors as x, DndContext as M, pointerWithin as B } from "@dnd-kit/core";
 import { DraggableOverlay as C } from "./DraggableOverlay.js";
-const Y = ({
-  containerRef: r,
+const W = ({
+  containerRef: e,
   children: d,
   onOrderChange: s
 }) => {
@@ -11,54 +11,56 @@ const Y = ({
     activationConstraint: {
       distance: 15
     }
-  }), p = u(x, {
+  }), l = u(A, {
     activationConstraint: {
       distance: 15
     }
-  }), l = A(m, p), b = c(
+  }), p = x(m, l), b = c(
     ({ active: t, over: n }) => {
-      !n || !t || s({
-        over: n.data.current,
+      if (!n || !t) return;
+      const r = n.data.current;
+      r.itemAllowDragDrop !== !1 && s({
+        over: r,
         item: t.data.current,
-        position: e.current ?? "inside"
+        position: o.current ?? "inside"
       });
     },
     [s]
-  ), e = g(null), h = c(
+  ), o = T(null), D = c(
     ({ over: t, active: n }) => {
       if (!t) {
-        r.current?.removeAttribute("data-nearest-side");
+        e.current?.removeAttribute("data-nearest-side");
         return;
       }
-      const o = n.rect.current.translated;
-      if (!o) return;
-      const i = o.top + o.height / 2, a = 8, f = Math.abs(i - t.rect.top), D = Math.abs(i - t.rect.bottom);
-      if (f <= a) {
-        e.current = "before", r.current?.setAttribute("data-nearest-side", "top");
+      const r = n.rect.current.translated;
+      if (!r) return;
+      const a = r.top + r.height / 2, i = 8, f = Math.abs(a - t.rect.top), h = Math.abs(a - t.rect.bottom);
+      if (f <= i) {
+        o.current = "before", e.current?.setAttribute("data-nearest-side", "top");
         return;
       }
-      if (D <= a) {
-        e.current = "after", r.current?.setAttribute("data-nearest-side", "bottom");
+      if (h <= i) {
+        o.current = "after", e.current?.setAttribute("data-nearest-side", "bottom");
         return;
       }
-      e.current = "inside", r.current?.setAttribute("data-nearest-side", "inside");
+      o.current = "inside", e.current?.setAttribute("data-nearest-side", "inside");
     },
-    [r]
+    [e]
   );
-  return /* @__PURE__ */ S(
+  return /* @__PURE__ */ g(
     M,
     {
-      sensors: l,
+      sensors: p,
       onDragEnd: b,
       collisionDetection: B,
-      onDragMove: h,
+      onDragMove: D,
       children: [
         d,
-        /* @__PURE__ */ T(C, {})
+        /* @__PURE__ */ S(C, {})
       ]
     }
   );
 };
 export {
-  Y as DnDProvider
+  W as DnDProvider
 };

package/dist/components/NavMenu/components/DraggableOverlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableOverlay.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DraggableOverlay.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,gBAAgB,+CAe5B,CAAC"}
+{"version":3,"file":"DraggableOverlay.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/DraggableOverlay.tsx"],"names":[],"mappings":"AAQA,eAAO,MAAM,gBAAgB,+CAiB5B,CAAC"}

package/dist/components/NavMenu/components/NavMenuItem.d.ts

@@ -1,4 +1,4 @@
-import { ExpandNavMenuItemDef } from '../types.ts';
+import { ExpandNavMenuItemDef } from '../types';
 type NavMenuItemProps = {
     item: ExpandNavMenuItemDef;
     ignoreDepth?: boolean;

package/dist/components/NavMenu/components/NavMenuItem.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NavMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/NavMenuItem.tsx"],"names":[],"mappings":"AAmBA,OAAO,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAKnD,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,oBAAoB,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,WAAW,8DAAgC,gBAAgB,6CAStE,CAAC;AAyMH,eAAO,MAAM,eAAe,GAAI,0CAI7B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oBAAoB,EAAE,MAAM,CAAC;CAC9B,4CAiCA,CAAC"}
+{"version":3,"file":"NavMenuItem.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/NavMenuItem.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAKhD,KAAK,gBAAgB,GAAG;IACtB,IAAI,EAAE,oBAAoB,CAAC;IAC3B,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,WAAW,8DAAgC,gBAAgB,6CAQtE,CAAC;AA+OH,eAAO,MAAM,eAAe,GAAI,0CAI7B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oBAAoB,EAAE,MAAM,CAAC;CAC9B,4CAiCA,CAAC"}