@layers-app/shared 0.1.5 → 0.2.1

package/dist/components/Logotype.d.ts

@@ -1,10 +1,12 @@
 import { FlexProps } from '@mantine/core';
-import { default as LayersLogoIcon } from '../assets/layers-logo-icon.svg?react';
-import { default as LayersLogoCopyright } from '../assets/logo-copyright.svg?react';
-export declare const Logotype: ({ minified, isLink, to, variant, ...props }: FlexProps & {
+import LayersLogoIcon from '../assets/layers-logo-icon.svg?react';
+import LayersLogoCopyright from '../assets/logo-copyright.svg?react';
+export declare const Logotype: ({ minified, isLink, to, variant, isDesktop, ...props }: FlexProps & {
     minified?: boolean;
     isLink?: boolean;
     to?: string;
     variant?: "default" | "copyright";
+    isDesktop?: boolean;
 }) => import("react/jsx-runtime").JSX.Element;
 export { LayersLogoIcon, LayersLogoCopyright };
+//# sourceMappingURL=Logotype.d.ts.map

package/dist/components/Logotype.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Logotype.d.ts","sourceRoot":"","sources":["../../src/components/Logotype.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,SAAS,EAAE,MAAM,eAAe,CAAC;AAGhD,OAAO,cAAc,MAAM,sCAAsC,CAAC;AAClE,OAAO,mBAAmB,MAAM,oCAAoC,CAAC;AAGrE,eAAO,MAAM,QAAQ,GAAI,wDAOtB,SAAS,GAAG;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,CAAC;IAClC,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,4CAwCA,CAAC;AAEF,OAAO,EAAE,cAAc,EAAE,mBAAmB,EAAE,CAAC"}

package/dist/components/Logotype.js

@@ -0,0 +1,41 @@
+import { jsx as r } from "react/jsx-runtime";
+import { Link as f } from "react-router-dom";
+import { Flex as g } from "@mantine/core";
+import u from "../assets/layers-logo-full.svg.js";
+import L from "../assets/layers-logo-icon.svg.js";
+import a from "../assets/logo-copyright.svg.js";
+import { useIsDarkTheme as h } from "../helpers/themeUtils.js";
+const S = ({
+  minified: o,
+  isLink: m = !0,
+  to: p = "/",
+  variant: t = "default",
+  isDesktop: s,
+  ...e
+}) => {
+  const n = h(), i = () => o ? /* @__PURE__ */ r(L, {}) : t === "copyright" ? /* @__PURE__ */ r(a, {}) : /* @__PURE__ */ r(u, {}), c = () => o ? s ? 192 : 40 : t === "copyright" ? 18 : 70;
+  return m ? /* @__PURE__ */ r(f, { to: p, children: /* @__PURE__ */ r(
+    g,
+    {
+      component: "span",
+      w: c(),
+      c: n ? "white" : "black",
+      ...e,
+      children: i()
+    }
+  ) }) : /* @__PURE__ */ r(
+    g,
+    {
+      component: "span",
+      w: c(),
+      c: n ? "white" : "black",
+      ...e,
+      children: i()
+    }
+  );
+};
+export {
+  a as LayersLogoCopyright,
+  L as LayersLogoIcon,
+  S as Logotype
+};

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

@@ -1,21 +1,24 @@
 import { PropsWithChildren, ReactNode } from 'react';
 import { BoxProps } from '@mantine/core';
 import { NavMenuStore, createNavMenuStore } from './store';
-import { ExpandNavMenuItemDef, NavMenuItemDef, NavMenuOrderChange } from './types';
+import { ExpandNavMenuItemDef, NavMenuItemDef, NavMenuOnLoadMore, NavMenuOrderChange } from './types';
 export type NavMenuProps = {
     items: NavMenuItemDef[];
     loading?: boolean;
+    onLoadMore?: NavMenuOnLoadMore;
     onOrderChange?: NavMenuOrderChange;
     noItemsPlaceholder?: ReactNode;
+    totalCount?: number;
 } & Partial<NavMenuStore['props']> & {
     store?: ReturnType<typeof createNavMenuStore>;
 };
-export declare const NavMenu: (({ items, loading, noItemsPlaceholder, onOrderChange, onEdit, store: _store, }: NavMenuProps) => import("react/jsx-runtime").JSX.Element) & {
-    Item: import('react').MemoExoticComponent<({ item, ignoreDepth }: {
+export declare const NavMenu: (({ items, loading, onLoadMore, noItemsPlaceholder, onOrderChange, onEdit, onToggle, store: _store, totalCount, }: NavMenuProps) => import("react/jsx-runtime").JSX.Element) & {
+    Item: import("react").MemoExoticComponent<({ item, ignoreDepth }: {
         item: ExpandNavMenuItemDef;
         ignoreDepth?: boolean;
     }) => import("react/jsx-runtime").JSX.Element>;
-    ActionIcon: import('react').ForwardRefExoticComponent<import('@mantine/core').ActionIconProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
-    Label: ({ children, ...props }: PropsWithChildren<import('@mantine/core').TextProps>) => import("react/jsx-runtime").JSX.Element;
+    ActionIcon: import("react").ForwardRefExoticComponent<import("@mantine/core").ActionIconProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Label: ({ children, ...props }: PropsWithChildren<import("@mantine/core").TextProps>) => import("react/jsx-runtime").JSX.Element;
     Placeholder: ({ children, ...props }: PropsWithChildren<BoxProps>) => import("react/jsx-runtime").JSX.Element;
 };
+//# sourceMappingURL=NavMenu.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NavMenu.d.ts","sourceRoot":"","sources":["../../../src/components/NavMenu/NavMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EACjB,SAAS,EAIV,MAAM,OAAO,CAAC;AAEf,OAAO,EAAE,QAAQ,EAAyB,MAAM,eAAe,CAAC;AAOhE,OAAO,EAAmB,YAAY,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC5E,OAAO,EACL,oBAAoB,EACpB,cAAc,EACd,iBAAiB,EACjB,kBAAkB,EACnB,MAAM,SAAS,CAAC;AAIjB,MAAM,MAAM,YAAY,GAAG;IACzB,KAAK,EAAE,cAAc,EAAE,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,aAAa,CAAC,EAAE,kBAAkB,CAAC;IACnC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB,GAAG,OAAO,CAAC,YAAY,CAAC,OAAO,CAAC,CAAC,GAAG;IACjC,KAAK,CAAC,EAAE,UAAU,CAAC,OAAO,kBAAkB,CAAC,CAAC;CAC/C,CAAC;AAsKJ,eAAO,MAAM,OAAO,qHA1JjB,YAAY;;;;;;;0CA6I8B,iBAAiB,CAAC,QAAQ,CAAC;CAkBtE,CAAC"}

package/dist/components/NavMenu/NavMenu.js

@@ -0,0 +1,107 @@
+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 = ({
+  items: o,
+  loading: l,
+  onLoadMore: i,
+  noItemsPlaceholder: T,
+  onOrderChange: C,
+  onEdit: m,
+  onToggle: g,
+  store: v,
+  totalCount: S
+}) => {
+  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
+        };
+        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`
+        });
+      }
+    };
+    return d(o, {
+      parentDepth: -1,
+      parentChildrenCount: o.length,
+      parentTotalChildren: S ?? o.length
+    }), e;
+  }, [o, i, s, S]);
+  P(() => {
+    t.useStore.setState({
+      props: {
+        onEdit: m ?? t.useStore.getState().props.onEdit,
+        onToggle: g ?? t.useStore.getState().props.onToggle,
+        onLoadMore: i ?? t.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,
+    {
+      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,
+    {
+      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,
+  {
+    size: "xs",
+    c: "var(--app-container-section-subtitle-color)",
+    px: 4,
+    ...l,
+    children: o
+  }
+), X = Object.assign(q, {
+  Item: f,
+  ActionIcon: R,
+  Label: z,
+  Placeholder: L
+});
+export {
+  X as NavMenu
+};

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

@@ -0,0 +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,
+  depthBox: t,
+  itemContainer: e,
+  item: n,
+  icon: i,
+  chevron: _,
+  droppable: a,
+  draggableOverlay: c,
+  editInput: r
+};
+export {
+  _ as chevron,
+  o as container,
+  d as default,
+  t as depthBox,
+  c as draggableOverlay,
+  a as droppable,
+  r as editInput,
+  i as icon,
+  n as item,
+  e as itemContainer
+};

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

@@ -6,3 +6,4 @@ export declare const DnDItem: ({ item, children, index, opened, }: PropsWithChil
     items: NavMenuItemDef[];
     opened?: string[];
 }>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DnDItem.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,44 @@
+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 = ({
+  item: e,
+  children: r,
+  index: d,
+  opened: i
+}) => {
+  const { useStore: a } = R(), n = a((s) => !!s.editId), {
+    attributes: l,
+    listeners: p,
+    setNodeRef: c,
+    isDragging: f,
+    active: t
+  } = h({
+    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({
+    id: e.id,
+    data: { ...e, index: d },
+    disabled: o
+  }), D = i?.includes(e.id) && e.children.length > 0;
+  return /* @__PURE__ */ v(
+    "div",
+    {
+      ref: (s) => {
+        c(s), u(s);
+      },
+      ...l,
+      ...p,
+      style: { opacity: o ? 0.25 : 1 },
+      className: N.droppable,
+      "data-opened": D,
+      "data-is-over": b,
+      children: r
+    }
+  );
+};
+export {
+  j as DnDItem
+};

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

@@ -6,3 +6,4 @@ type DnDProviderProps = {
 };
 export declare const DnDProvider: ({ containerRef, children, onOrderChange, }: PropsWithChildren<DnDProviderProps>) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=DnDProvider.d.ts.map

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

@@ -0,0 +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"}

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

@@ -0,0 +1,64 @@
+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 { DraggableOverlay as C } from "./DraggableOverlay.js";
+const Y = ({
+  containerRef: r,
+  children: d,
+  onOrderChange: s
+}) => {
+  const m = u(v, {
+    activationConstraint: {
+      distance: 15
+    }
+  }), p = u(x, {
+    activationConstraint: {
+      distance: 15
+    }
+  }), l = A(m, p), b = c(
+    ({ active: t, over: n }) => {
+      !n || !t || s({
+        over: n.data.current,
+        item: t.data.current,
+        position: e.current ?? "inside"
+      });
+    },
+    [s]
+  ), e = g(null), h = c(
+    ({ over: t, active: n }) => {
+      if (!t) {
+        r.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");
+        return;
+      }
+      if (D <= a) {
+        e.current = "after", r.current?.setAttribute("data-nearest-side", "bottom");
+        return;
+      }
+      e.current = "inside", r.current?.setAttribute("data-nearest-side", "inside");
+    },
+    [r]
+  );
+  return /* @__PURE__ */ S(
+    M,
+    {
+      sensors: l,
+      onDragEnd: b,
+      collisionDetection: B,
+      onDragMove: h,
+      children: [
+        d,
+        /* @__PURE__ */ T(C, {})
+      ]
+    }
+  );
+};
+export {
+  Y as DnDProvider
+};

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

@@ -1 +1,2 @@
 export declare const DraggableOverlay: () => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=DraggableOverlay.d.ts.map

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

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

package/dist/components/NavMenu/components/DraggableOverlay.js

@@ -0,0 +1,18 @@
+import { jsx as r } from "react/jsx-runtime";
+import { useDndContext as t, DragOverlay as o } from "@dnd-kit/core";
+import { snapCenterToCursor as a } from "@dnd-kit/modifiers";
+import { NavMenuItem as i } from "./NavMenuItem.js";
+import n from "../NavMenu.module.css.js";
+const d = () => {
+  const { active: e } = t();
+  return /* @__PURE__ */ r(o, { dropAnimation: null, modifiers: [a], children: e ? /* @__PURE__ */ r("div", { className: n.draggableOverlay, children: /* @__PURE__ */ r(
+    i,
+    {
+      item: { ...e.data.current, active: !1 },
+      ignoreDepth: !0
+    }
+  ) }) : null });
+};
+export {
+  d as DraggableOverlay
+};

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

@@ -1,2 +1,3 @@
 import { ActionIconProps } from '@mantine/core';
-export declare const NavMenuActionIcon: import('react').ForwardRefExoticComponent<ActionIconProps & Omit<import('react').DetailedHTMLProps<import('react').ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
+export declare const NavMenuActionIcon: import("react").ForwardRefExoticComponent<ActionIconProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+//# sourceMappingURL=NavMenuActionIcon.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NavMenuActionIcon.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/NavMenuActionIcon.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAc,eAAe,EAAE,MAAM,eAAe,CAAC;AAK5D,eAAO,MAAM,iBAAiB,4OA4B7B,CAAC"}

package/dist/components/NavMenu/components/NavMenuActionIcon.js

@@ -0,0 +1,27 @@
+import { jsx as f } from "react/jsx-runtime";
+import { forwardRef as i } from "react";
+import { ActionIcon as p } from "@mantine/core";
+const x = i(
+  ({
+    children: o,
+    size: r = 20,
+    radius: t = 4,
+    color: n = "gray",
+    variant: m = "subtle",
+    ...c
+  }, e) => /* @__PURE__ */ f(
+    p,
+    {
+      ref: e,
+      size: r,
+      radius: t,
+      color: n,
+      variant: m,
+      ...c,
+      children: o
+    }
+  )
+);
+export {
+  x as NavMenuActionIcon
+};

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

@@ -3,5 +3,11 @@ type NavMenuItemProps = {
     item: ExpandNavMenuItemDef;
     ignoreDepth?: boolean;
 };
-export declare const NavMenuItem: import('react').MemoExoticComponent<({ item, ignoreDepth }: NavMenuItemProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const NavMenuItem: import("react").MemoExoticComponent<({ item, ignoreDepth }: NavMenuItemProps) => import("react/jsx-runtime").JSX.Element>;
+export declare const NavMenuLoadMore: ({ depth, itemId, currentChildrenCount, }: {
+    depth: number;
+    itemId: string;
+    currentChildrenCount: number;
+}) => import("react/jsx-runtime").JSX.Element;
 export {};
+//# sourceMappingURL=NavMenuItem.d.ts.map

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

@@ -0,0 +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;AAwMH,eAAO,MAAM,eAAe,GAAI,0CAI7B;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,oBAAoB,EAAE,MAAM,CAAC;CAC9B,4CAiCA,CAAC"}

package/dist/components/NavMenu/components/NavMenuItem.js

@@ -0,0 +1,187 @@
+import { jsx as t, jsxs as d } from "react/jsx-runtime";
+import { memo as m, useRef as x, useEffect as b, useMemo as E } from "react";
+import { useTranslation as g } from "react-i18next";
+import { NavLink as S } from "react-router-dom";
+import { MoreHorizontalIcon as I, ArrowRight01Icon as M } from "@hugeicons/core-free-icons";
+import { HugeiconsIcon as v } from "@hugeicons/react";
+import { ApiCommon as h } from "../../../node_modules/@layers-app/layers/src/api/common.js";
+import { Flex as p, Loader as y, Text as N, FocusTrap as k, Center as j, Tooltip as P } from "@mantine/core";
+import { useForm as z } from "@mantine/form";
+import { useClickOutside as A } from "@mantine/hooks";
+import { useAsyncStatus as D } from "../../../hooks/useAsyncStatus.js";
+import { EmojiPicker as F } from "../../EmojiPicker/EmojiPicker.js";
+import { EntityIcon as w } from "../../EntityIcon.js";
+import { NavMenu as L } from "../NavMenu.js";
+import { useNavMenuStore as u } from "../store.js";
+import { NavMenuActionIcon as O } from "./NavMenuActionIcon.js";
+import a from "../NavMenu.module.css.js";
+const ne = m(({ item: e, ignoreDepth: o }) => {
+  const { useStore: r } = u(), n = r((s) => s.editId === e.id);
+  return /* @__PURE__ */ t(C, { depth: o ? void 0 : e.depth, children: n ? /* @__PURE__ */ t(B, { item: e }) : /* @__PURE__ */ t(T, { item: e }) });
+}), T = m(({ item: e }) => {
+  const { api: o } = u();
+  return e.href ? /* @__PURE__ */ t(
+    S,
+    {
+      to: e.href,
+      className: a.item,
+      "data-active": e.active,
+      "data-has-children": e.hasChildren,
+      children: /* @__PURE__ */ t(f, { item: e })
+    }
+  ) : /* @__PURE__ */ t(
+    "div",
+    {
+      className: a.item,
+      "data-active": e.active,
+      "data-has-children": e.hasChildren,
+      onClick: () => o.toggleOpened(e),
+      children: /* @__PURE__ */ t(f, { item: e })
+    }
+  );
+}), f = m(({ item: e }) => {
+  const { t: o } = g(), { useStore: r, api: n } = u(), s = r((i) => i.opened.includes(e.id)), l = r((i) => i.loading[e.id]);
+  return /* @__PURE__ */ d(p, { gap: 4, h: "100%", flex: 1, miw: 0, justify: "space-between", children: [
+    /* @__PURE__ */ d(p, { gap: 4, miw: 0, flex: 1, children: [
+      l ? /* @__PURE__ */ t(j, { w: 20, h: 20, children: /* @__PURE__ */ t(y, { size: 16 }) }) : e.hasChildren && /* @__PURE__ */ t(
+        O,
+        {
+          className: a.chevron,
+          onClick: (i) => {
+            i.preventDefault(), i.stopPropagation(), n.toggleOpened(e);
+          },
+          children: /* @__PURE__ */ t(
+            v,
+            {
+              icon: M,
+              size: 16,
+              style: {
+                transform: `rotate(${s ? 90 : 0}deg)`,
+                transition: "transform 0.1s ease-in-out"
+              }
+            }
+          )
+        }
+      ),
+      /* @__PURE__ */ t("div", { className: a.icon, children: /* @__PURE__ */ t(w, { item: e.data }) }),
+      /* @__PURE__ */ t(
+        P,
+        {
+          disabled: e.title.length < 25,
+          label: e.title || o("noName"),
+          openDelay: 400,
+          children: /* @__PURE__ */ t(
+            N,
+            {
+              flex: 1,
+              truncate: !0,
+              style: { opacity: e.title ? 1 : 0.5 },
+              size: "sm",
+              fw: 500,
+              miw: 0,
+              c: "var(--mantine-color-text)",
+              onDoubleClick: (i) => {
+                r.getState().props.onEdit && !e?.isDisabledEditByDoubleClick && (i.preventDefault(), i.stopPropagation(), n.startEditing(e.id));
+              },
+              children: e.title || o("noName")
+            }
+          )
+        }
+      )
+    ] }),
+    e.rightSection
+  ] });
+}), B = m(({ item: e }) => {
+  const { api: o } = u(), r = x(null), n = z({
+    initialValues: {
+      name: e.title,
+      icon: e.data?.icon || ""
+    }
+  }), s = (c) => {
+    o.handleEdit({
+      id: e.id,
+      name: c.name ?? "",
+      icon: c.icon ?? ""
+    }), o.stopEditing();
+  }, l = A(() => {
+    s(n.getValues());
+  });
+  b(() => {
+    r.current && r.current.select();
+  }, []);
+  const i = E(
+    () => [h.Entity.Sprint, h.Entity.Project].includes(
+      e.data?.type || ""
+    ),
+    [e.data?.type]
+  );
+  return /* @__PURE__ */ t(
+    "form",
+    {
+      onSubmit: n.onSubmit(s),
+      className: a.item,
+      ref: l,
+      "data-editing": !0,
+      children: /* @__PURE__ */ d(p, { gap: 4, h: "100%", flex: 1, miw: 0, justify: "space-between", children: [
+        /* @__PURE__ */ t("div", { className: a.icon, children: /* @__PURE__ */ t(
+          F,
+          {
+            showIcons: !0,
+            showColors: !0,
+            withinPortal: !1,
+            popoverProps: {
+              floatingStrategy: "fixed"
+            },
+            value: n.values.icon,
+            onChange: (c) => n.setFieldValue("icon", c),
+            children: /* @__PURE__ */ t(L.ActionIcon, { disabled: i, children: /* @__PURE__ */ t(w, { item: { ...e.data, icon: n.values.icon } }) })
+          }
+        ) }),
+        /* @__PURE__ */ t(k, { children: /* @__PURE__ */ t(
+          "input",
+          {
+            ref: r,
+            className: a.editInput,
+            ...n.getInputProps("name"),
+            onFocus: (c) => c.target.select()
+          }
+        ) })
+      ] })
+    }
+  );
+}), C = m(
+  ({ depth: e = 0, children: o }) => /* @__PURE__ */ d(
+    "div",
+    {
+      className: a.itemContainer,
+      style: {
+        "--depth": e
+      },
+      children: [
+        Array.from({ length: e }).map((r, n) => /* @__PURE__ */ t("div", { className: a.depthBox }, n)),
+        o
+      ]
+    }
+  )
+), oe = ({
+  depth: e,
+  itemId: o,
+  currentChildrenCount: r
+}) => {
+  const { t: n } = g("appContainer"), { api: s } = u(), { isLoading: l, onSubmit: i } = D();
+  return /* @__PURE__ */ t(C, { depth: e, children: /* @__PURE__ */ t(
+    "div",
+    {
+      className: a.item,
+      onClick: () => i(() => s.loadMore({ itemId: o, currentChildrenCount: r })),
+      children: /* @__PURE__ */ t(p, { gap: 4, h: "100%", flex: 1, miw: 0, justify: "space-between", children: /* @__PURE__ */ d(p, { gap: 4, miw: 0, flex: 1, c: "gray", children: [
+        /* @__PURE__ */ t("div", { className: a.icon, children: l ? /* @__PURE__ */ t(y, { size: 16 }) : /* @__PURE__ */ t(v, { icon: I, size: 16 }) }),
+        /* @__PURE__ */ t(N, { flex: 1, truncate: !0, size: "sm", fw: 500, miw: 0, children: n("loadMore") })
+      ] }) })
+    }
+  ) });
+};
+export {
+  ne as NavMenuItem,
+  oe as NavMenuLoadMore
+};

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

@@ -1,3 +1,4 @@
 import { PropsWithChildren } from 'react';
 import { TextProps } from '@mantine/core';
 export declare const NavMenuLabel: ({ children, ...props }: PropsWithChildren<TextProps>) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=NavMenuLabel.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"NavMenuLabel.d.ts","sourceRoot":"","sources":["../../../../src/components/NavMenu/components/NavMenuLabel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE1C,OAAO,EAAQ,SAAS,EAAE,MAAM,eAAe,CAAC;AAEhD,eAAO,MAAM,YAAY,GAAI,wBAG1B,iBAAiB,CAAC,SAAS,CAAC,4CAW9B,CAAC"}

package/dist/components/NavMenu/components/NavMenuLabel.js

@@ -0,0 +1,18 @@
+import { jsx as t } from "react/jsx-runtime";
+import { Text as e } from "@mantine/core";
+const a = ({
+  children: o,
+  ...r
+}) => /* @__PURE__ */ t(
+  e,
+  {
+    size: "sm",
+    fw: 600,
+    c: "var(--app-container-section-title-color)",
+    ...r,
+    children: o
+  }
+);
+export {
+  a as NavMenuLabel
+};

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

@@ -3,3 +3,4 @@ export * from './components/NavMenuItem';
 export * from './components/NavMenuLabel';
 export * from './types';
 export * from './store';
+//# sourceMappingURL=index.d.ts.map