@smwb/ui-solid 0.7.0 → 0.8.1

package/dist/headless/components/dataDisplay/treeView/treeView.js

@@ -1,33 +1,33 @@
-import { createComponent as s, use as T, spread as D, mergeProps as R, insert as g, template as _, effect as I, setAttribute as S, memo as E, className as F, delegateEvents as K } from "solid-js/web";
-import { mergeProps as j, splitProps as q, createSignal as y, For as V, createContext as B, useContext as G, Show as w } from "solid-js";
+import { createComponent as s, use as D, spread as R, mergeProps as F, insert as g, template as _, effect as S, setAttribute as E, memo as y, className as K, delegateEvents as j } from "solid-js/web";
+import { mergeProps as q, splitProps as B, createSignal as P, For as V, createContext as G, useContext as H, Show as L } from "solid-js";
 import z from "clsx";
-import { createControllableState as P } from "../../../primitives/createControllableState.js";
-import { mergeRefs as H } from "../../../primitives/mergeRefs.js";
-import { Icon as O } from "../../base/icon/icon.js";
-var J = /* @__PURE__ */ _("<input type=checkbox class=smwb-tree__node__checkbox>"), M = /* @__PURE__ */ _("<div role=group>"), Q = /* @__PURE__ */ _("<div role=treeitem><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), U = /* @__PURE__ */ _("<div class=smwb-tree__node__loading role=status>Загрузка…"), W = /* @__PURE__ */ _("<div>"), X = /* @__PURE__ */ _("<div class=smwb-tree__wrapper role=presentation>");
-const A = B();
+import { createControllableState as O } from "../../../primitives/createControllableState.js";
+import { mergeRefs as J } from "../../../primitives/mergeRefs.js";
+import { Icon as T } from "../../base/icon/icon.js";
+var M = /* @__PURE__ */ _("<input type=checkbox class=smwb-tree__node__checkbox>"), Q = /* @__PURE__ */ _("<div role=group>"), U = /* @__PURE__ */ _("<div role=treeitem><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), W = /* @__PURE__ */ _("<div class=smwb-tree__node__loading role=status>Загрузка…"), X = /* @__PURE__ */ _("<div>"), Y = /* @__PURE__ */ _("<div class=smwb-tree__wrapper role=presentation>");
+const A = G();
 function N(o) {
-  const n = G(A), e = () => o.item.id ?? o.path, h = () => o.item.children ?? n.loadedChildren()[e()], C = () => n.hasLoader && (!!o.item.hasChildren || !!n.loadedChildren()[e()]), c = () => !!h() && (h()?.length ?? 0) > 0 || C(), f = () => n.expandedIds().includes(e()), m = () => n.selectedIds().includes(e()), v = () => n.loadingIds().includes(e()), x = () => {
+  const n = H(A), e = () => o.item.id ?? o.path, h = () => o.item.children ?? n.loadedChildren()[e()], $ = () => n.hasLoader && (!!o.item.hasChildren || !!n.loadedChildren()[e()]), c = () => !!h() && (h()?.length ?? 0) > 0 || $(), f = () => n.expandedIds().includes(e()), m = () => n.selectedIds().includes(e()), I = () => n.loadingIds().includes(e()), x = () => {
     c() && (f() || n.ensureLoaded(o.item, e()), n.toggleExpanded(e())), n.selectable && n.toggleSelected(e());
-  }, L = (a) => {
+  }, p = (a) => {
     a.key === "Enter" || a.key === " " ? (a.preventDefault(), x()) : a.key === "ArrowRight" && c() ? (n.ensureLoaded(o.item, e()), n.setOpen(e(), !0)) : a.key === "ArrowLeft" && c() && n.setOpen(e(), !1);
   };
   return (() => {
-    var a = Q(), p = a.firstChild, $ = p.firstChild;
-    return p.$$keydown = L, p.$$click = x, g(p, s(w, {
+    var a = U(), b = a.firstChild, k = b.firstChild;
+    return b.$$keydown = p, b.$$click = x, g(b, s(L, {
       get when() {
         return n.checkboxes;
       },
       get children() {
-        var r = J();
-        return r.addEventListener("change", () => n.toggleSelected(e())), r.$$click = (u) => u.stopPropagation(), I(() => S(r, "aria-label", o.item.label)), I(() => r.checked = m()), r;
+        var r = M();
+        return r.addEventListener("change", () => n.toggleSelected(e())), r.$$click = (u) => u.stopPropagation(), S(() => E(r, "aria-label", o.item.label)), S(() => r.checked = m()), r;
       }
-    }), $), g($, s(w, {
+    }), k), g(k, s(L, {
       get when() {
         return c();
       },
       get fallback() {
-        return s(O, {
+        return s(T, {
           get name() {
             return n.listIcon;
           },
@@ -35,50 +35,50 @@ function N(o) {
         });
       },
       get children() {
-        return s(O, {
+        return s(T, {
           get name() {
-            return E(() => !!f())() ? n.nodeIcon.opened ?? "folder_open" : n.nodeIcon.closed ?? "folder";
+            return y(() => !!f())() ? n.nodeIcon.opened ?? "folder_open" : n.nodeIcon.closed ?? "folder";
           },
           fill: 1,
           size: 20
         });
       }
-    }), null), g($, (() => {
-      var r = E(() => !!n.renderLabel);
+    }), null), g(k, (() => {
+      var r = y(() => !!n.renderLabel);
       return () => r() ? n.renderLabel(o.item, e()) : o.item.label;
-    })(), null), g(a, s(w, {
+    })(), null), g(a, s(L, {
       get when() {
-        return E(() => !!c())() && f();
+        return y(() => !!c())() && f();
       },
       get children() {
-        var r = M();
-        return g(r, s(w, {
+        var r = Q();
+        return g(r, s(L, {
           get when() {
-            return !(v() && !h());
+            return !(I() && !h());
           },
           get fallback() {
-            return U();
+            return W();
           },
           get children() {
             return s(V, {
               get each() {
                 return h() ?? [];
               },
-              children: (u, b) => s(N, {
+              children: (u, C) => s(N, {
                 item: u,
                 get path() {
-                  return `${o.path}.${b()}`;
+                  return `${o.path}.${C()}`;
                 }
               })
             });
           }
         })), r;
       }
-    }), null), I((r) => {
+    }), null), S((r) => {
       var u = z("smwb-tree__node", {
         "smwb-tree__node_selected": m()
-      }), b = c() ? f() : void 0, t = n.selectable || n.checkboxes ? m() : void 0;
-      return u !== r.e && F(a, r.e = u), b !== r.t && S(a, "aria-expanded", r.t = b), t !== r.a && S(a, "aria-selected", r.a = t), r;
+      }), C = c() ? f() : void 0, w = n.selectable || n.checkboxes ? m() : void 0;
+      return u !== r.e && K(a, r.e = u), C !== r.t && E(a, "aria-expanded", r.t = C), w !== r.a && E(a, "aria-selected", r.a = w), r;
     }, {
       e: void 0,
       t: void 0,
@@ -86,8 +86,8 @@ function N(o) {
     }), a;
   })();
 }
-function re(o) {
-  const n = j({
+function de(o) {
+  const n = q({
     listIcon: "draft",
     nodeIcon: {
       closed: "folder",
@@ -98,27 +98,37 @@ function re(o) {
     defaultSelected: [],
     selectable: !1,
     checkboxes: !1
-  }, o), [e, h] = q(n, ["class", "listIcon", "nodeIcon", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "renderLabel", "loadChildren", "ref"]), [C, c] = y({}), [f, m] = y([]), [v, x] = P({
+  }, o), [e, h] = B(n, ["class", "listIcon", "nodeIcon", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "renderLabel", "loadChildren", "ref"]), [$, c] = P({}), [f, m] = P([]), [I, x] = O({
     value: () => e.expanded,
     defaultValue: e.defaultExpanded,
     onChange: (t) => e.onExpandedChange?.(t)
-  }), [L, a] = P({
+  });
+  let p;
+  const [a, b] = O({
     value: () => e.selected,
     defaultValue: e.defaultSelected,
-    onChange: (t) => e.onSelectedChange?.(t)
-  }), b = {
-    expandedIds: v,
-    selectedIds: L,
-    loadedChildren: C,
+    onChange: (t) => {
+      const l = p;
+      p = void 0, e.onSelectedChange?.(t, l);
+    }
+  }), w = {
+    expandedIds: I,
+    selectedIds: a,
+    loadedChildren: $,
     loadingIds: f,
     toggleExpanded: (t) => x((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]),
     setOpen: (t, l) => x((d) => {
       const i = d.includes(t);
-      return l && !i ? [...d, t] : !l && i ? d.filter((k) => k !== t) : d;
+      return l && !i ? [...d, t] : !l && i ? d.filter((v) => v !== t) : d;
     }),
-    toggleSelected: (t) => a((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]),
+    toggleSelected: (t) => {
+      p = {
+        id: t,
+        selected: !a().includes(t)
+      }, b((l) => l.includes(t) ? l.filter((d) => d !== t) : [...l, t]);
+    },
     ensureLoaded: (t, l) => {
-      !e.loadChildren || C()[l] || t.children && t.children.length > 0 || (m((d) => d.includes(l) ? d : [...d, l]), e.loadChildren(t, l).then((d) => c((i) => ({
+      !e.loadChildren || $()[l] || t.children && t.children.length > 0 || (m((d) => d.includes(l) ? d : [...d, l]), e.loadChildren(t, l).then((d) => c((i) => ({
         ...i,
         [l]: d
       }))).finally(() => m((d) => d.filter((i) => i !== l))));
@@ -143,10 +153,10 @@ function re(o) {
     }
   };
   return s(A.Provider, {
-    value: b,
+    value: w,
     get children() {
-      var t = W(), l = H(e.ref);
-      return typeof l == "function" && T(l, t), D(t, R(h, {
+      var t = X(), l = J(e.ref);
+      return typeof l == "function" && D(l, t), R(t, F(h, {
         "data-testid": "tree-view",
         role: "tree",
         get class() {
@@ -157,20 +167,20 @@ function re(o) {
           return e.data;
         },
         children: (d, i) => (() => {
-          var k = X();
-          return g(k, s(N, {
+          var v = Y();
+          return g(v, s(N, {
             item: d,
             get path() {
               return `${i()}`;
             }
-          })), k;
+          })), v;
         })()
       })), t;
     }
   });
 }
-K(["click", "keydown"]);
+j(["click", "keydown"]);
 export {
-  re as TreeView
+  de as TreeView
 };
 //# sourceMappingURL=treeView.js.map

package/dist/headless/components/dataDisplay/treeView/treeView.js.map

@@ -1 +1 @@
-{"version":3,"file":"treeView.js","sources":["../../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createContext, createSignal, mergeProps, splitProps, useContext } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ITreeNodeItem {\n  /** Stable identifier. Falls back to the positional path when omitted. */\n  id?: string;\n  label: string;\n  children?: ITreeNodeItem[];\n  /** Hint that the node is expandable even before its children are loaded. */\n  hasChildren?: boolean;\n}\n\nexport interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  nodeIcon?: { opened?: string; closed?: string };\n  listIcon?: string;\n  data: ITreeNodeItem[];\n  expanded?: string[];\n  defaultExpanded?: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  selected?: string[];\n  defaultSelected?: string[];\n  onSelectedChange?: (selected: string[]) => void;\n  selectable?: boolean;\n  checkboxes?: boolean;\n  renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n  ref?: Ref<HTMLDivElement>;\n}\n\ninterface TreeContextValue {\n  expandedIds: Accessor<string[]>;\n  selectedIds: Accessor<string[]>;\n  loadedChildren: Accessor<Record<string, ITreeNodeItem[]>>;\n  loadingIds: Accessor<string[]>;\n  toggleExpanded: (id: string) => void;\n  setOpen: (id: string, open: boolean) => void;\n  toggleSelected: (id: string) => void;\n  ensureLoaded: (item: ITreeNodeItem, nodeId: string) => void;\n  selectable: boolean;\n  checkboxes: boolean;\n  nodeIcon: { opened?: string; closed?: string };\n  listIcon: string;\n  renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\nfunction TreeNode(props: { item: ITreeNodeItem; path: string }): JSX.Element {\n  const ctx = useContext(TreeContext)!;\n  const nodeId = (): string => props.item.id ?? props.path;\n  const resolvedChildren = (): ITreeNodeItem[] | undefined => props.item.children ?? ctx.loadedChildren()[nodeId()];\n  const isLazy = (): boolean => ctx.hasLoader && (!!props.item.hasChildren || !!ctx.loadedChildren()[nodeId()]);\n  const hasChildNodes = (): boolean => (!!resolvedChildren() && (resolvedChildren()?.length ?? 0) > 0) || isLazy();\n  const isOpen = (): boolean => ctx.expandedIds().includes(nodeId());\n  const isSelected = (): boolean => ctx.selectedIds().includes(nodeId());\n  const isLoading = (): boolean => ctx.loadingIds().includes(nodeId());\n\n  const onLabelClick = (): void => {\n    if (hasChildNodes()) {\n      if (!isOpen()) ctx.ensureLoaded(props.item, nodeId());\n      ctx.toggleExpanded(nodeId());\n    }\n    if (ctx.selectable) ctx.toggleSelected(nodeId());\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      onLabelClick();\n    } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n      ctx.ensureLoaded(props.item, nodeId());\n      ctx.setOpen(nodeId(), true);\n    } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n      ctx.setOpen(nodeId(), false);\n    }\n  };\n\n  return (\n    <div\n      class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n      role=\"treeitem\"\n      aria-expanded={hasChildNodes() ? isOpen() : undefined}\n      aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n    >\n      <span class=\"smwb-tree__node__content\" onClick={onLabelClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n        <Show when={ctx.checkboxes}>\n          <input\n            type=\"checkbox\"\n            class=\"smwb-tree__node__checkbox\"\n            checked={isSelected()}\n            onClick={(e) => e.stopPropagation()}\n            onChange={() => ctx.toggleSelected(nodeId())}\n            aria-label={props.item.label}\n          />\n        </Show>\n        <span class=\"smwb-tree__node__label\">\n          <Show when={hasChildNodes()} fallback={<Icon name={ctx.listIcon} size={20} />}>\n            <Icon name={isOpen() ? ctx.nodeIcon.opened ?? \"folder_open\" : ctx.nodeIcon.closed ?? \"folder\"} fill={1} size={20} />\n          </Show>\n          {ctx.renderLabel ? ctx.renderLabel(props.item, nodeId()) : props.item.label}\n        </span>\n      </span>\n      <Show when={hasChildNodes() && isOpen()}>\n        <div role=\"group\">\n          <Show\n            when={!(isLoading() && !resolvedChildren())}\n            fallback={\n              <div class=\"smwb-tree__node__loading\" role=\"status\">\n                Загрузка…\n              </div>\n            }\n          >\n            <For each={resolvedChildren() ?? []}>\n              {(child, idx) => <TreeNode item={child} path={`${props.path}.${idx()}`} />}\n            </For>\n          </Show>\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport function TreeView(props: TreeViewProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      listIcon: \"draft\",\n      nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string },\n      data: [] as ITreeNodeItem[],\n      defaultExpanded: [] as string[],\n      defaultSelected: [] as string[],\n      selectable: false,\n      checkboxes: false,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"listIcon\",\n    \"nodeIcon\",\n    \"data\",\n    \"expanded\",\n    \"defaultExpanded\",\n    \"onExpandedChange\",\n    \"selected\",\n    \"defaultSelected\",\n    \"onSelectedChange\",\n    \"selectable\",\n    \"checkboxes\",\n    \"renderLabel\",\n    \"loadChildren\",\n    \"ref\",\n  ]);\n\n  const [loadedChildren, setLoadedChildren] = createSignal<Record<string, ITreeNodeItem[]>>({});\n  const [loadingIds, setLoadingIds] = createSignal<string[]>([]);\n  const [expandedIds, setExpandedIds] = createControllableState<string[]>({\n    value: () => local.expanded,\n    defaultValue: local.defaultExpanded,\n    onChange: (next) => local.onExpandedChange?.(next),\n  });\n  const [selectedIds, setSelectedIds] = createControllableState<string[]>({\n    value: () => local.selected,\n    defaultValue: local.defaultSelected,\n    onChange: (next) => local.onSelectedChange?.(next),\n  });\n\n  const toggleExpanded = (id: string): void =>\n    setExpandedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n  const setOpen = (id: string, open: boolean): void =>\n    setExpandedIds((prev) => {\n      const has = prev.includes(id);\n      if (open && !has) return [...prev, id];\n      if (!open && has) return prev.filter((x) => x !== id);\n      return prev;\n    });\n\n  const toggleSelected = (id: string): void =>\n    setSelectedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n  const ensureLoaded = (item: ITreeNodeItem, nodeId: string): void => {\n    if (!local.loadChildren || loadedChildren()[nodeId] || (item.children && item.children.length > 0)) return;\n    setLoadingIds((prev) => (prev.includes(nodeId) ? prev : [...prev, nodeId]));\n    void local\n      .loadChildren(item, nodeId)\n      .then((children) => setLoadedChildren((prev) => ({ ...prev, [nodeId]: children })))\n      .finally(() => setLoadingIds((prev) => prev.filter((x) => x !== nodeId)));\n  };\n\n  const contextValue: TreeContextValue = {\n    expandedIds,\n    selectedIds,\n    loadedChildren,\n    loadingIds,\n    toggleExpanded,\n    setOpen,\n    toggleSelected,\n    ensureLoaded,\n    get selectable() {\n      return local.selectable;\n    },\n    get checkboxes() {\n      return local.checkboxes;\n    },\n    get nodeIcon() {\n      return local.nodeIcon;\n    },\n    get listIcon() {\n      return local.listIcon;\n    },\n    get renderLabel() {\n      return local.renderLabel;\n    },\n    get hasLoader() {\n      return !!local.loadChildren;\n    },\n  };\n\n  return (\n    <TreeContext.Provider value={contextValue}>\n      <div {...rest} data-testid=\"tree-view\" ref={mergeRefs(local.ref)} role=\"tree\" class={cn(\"smwb-tree\", local.class)}>\n        <For each={local.data}>\n          {(node, idx) => (\n            <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n              <TreeNode item={node} path={`${idx()}`} />\n            </div>\n          )}\n        </For>\n      </div>\n    </TreeContext.Provider>\n  );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","TreeNode","props","ctx","useContext","nodeId","item","id","path","resolvedChildren","children","loadedChildren","isLazy","hasLoader","hasChildren","hasChildNodes","length","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","onLabelClick","ensureLoaded","toggleExpanded","selectable","toggleSelected","onKeyDown","event","key","preventDefault","setOpen","_el$","_tmpl$3","_el$2","firstChild","_el$4","$$keydown","$$click","_$insert","_$createComponent","Show","when","checkboxes","_el$3","_tmpl$","addEventListener","e","stopPropagation","_$effect","_$setAttribute","label","checked","fallback","Icon","name","listIcon","size","_$memo","nodeIcon","opened","closed","fill","_c$","renderLabel","_el$5","_tmpl$2","_tmpl$4","For","each","child","idx","_p$","_v$","cn","_v$2","undefined","_v$3","_$className","t","a","TreeView","merged","mergeProps","data","defaultExpanded","defaultSelected","local","rest","splitProps","setLoadedChildren","createSignal","setLoadingIds","setExpandedIds","createControllableState","value","expanded","defaultValue","onChange","next","onExpandedChange","setSelectedIds","selected","onSelectedChange","contextValue","prev","filter","x","open","has","loadChildren","then","finally","Provider","_el$7","_tmpl$5","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","node","_el$8","_tmpl$6","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"treeView.js","sources":["../../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import { type Accessor, type JSX, For, Show, createContext, createSignal, mergeProps, splitProps, useContext } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\nexport interface ITreeNodeItem {\n  /** Stable identifier. Falls back to the positional path when omitted. */\n  id?: string;\n  label: string;\n  children?: ITreeNodeItem[];\n  /** Hint that the node is expandable even before its children are loaded. */\n  hasChildren?: boolean;\n}\n\nexport interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, \"onSelect\"> {\n  nodeIcon?: { opened?: string; closed?: string };\n  listIcon?: string;\n  data: ITreeNodeItem[];\n  expanded?: string[];\n  defaultExpanded?: string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  selected?: string[];\n  defaultSelected?: string[];\n  /** Reports the full selection plus, for user toggles, the node that just changed. */\n  onSelectedChange?: (selected: string[], changed?: { id: string; selected: boolean }) => void;\n  selectable?: boolean;\n  checkboxes?: boolean;\n  renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n  ref?: Ref<HTMLDivElement>;\n}\n\ninterface TreeContextValue {\n  expandedIds: Accessor<string[]>;\n  selectedIds: Accessor<string[]>;\n  loadedChildren: Accessor<Record<string, ITreeNodeItem[]>>;\n  loadingIds: Accessor<string[]>;\n  toggleExpanded: (id: string) => void;\n  setOpen: (id: string, open: boolean) => void;\n  toggleSelected: (id: string) => void;\n  ensureLoaded: (item: ITreeNodeItem, nodeId: string) => void;\n  selectable: boolean;\n  checkboxes: boolean;\n  nodeIcon: { opened?: string; closed?: string };\n  listIcon: string;\n  renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\nfunction TreeNode(props: { item: ITreeNodeItem; path: string }): JSX.Element {\n  const ctx = useContext(TreeContext)!;\n  const nodeId = (): string => props.item.id ?? props.path;\n  const resolvedChildren = (): ITreeNodeItem[] | undefined => props.item.children ?? ctx.loadedChildren()[nodeId()];\n  const isLazy = (): boolean => ctx.hasLoader && (!!props.item.hasChildren || !!ctx.loadedChildren()[nodeId()]);\n  const hasChildNodes = (): boolean => (!!resolvedChildren() && (resolvedChildren()?.length ?? 0) > 0) || isLazy();\n  const isOpen = (): boolean => ctx.expandedIds().includes(nodeId());\n  const isSelected = (): boolean => ctx.selectedIds().includes(nodeId());\n  const isLoading = (): boolean => ctx.loadingIds().includes(nodeId());\n\n  const onLabelClick = (): void => {\n    if (hasChildNodes()) {\n      if (!isOpen()) ctx.ensureLoaded(props.item, nodeId());\n      ctx.toggleExpanded(nodeId());\n    }\n    if (ctx.selectable) ctx.toggleSelected(nodeId());\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      onLabelClick();\n    } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n      ctx.ensureLoaded(props.item, nodeId());\n      ctx.setOpen(nodeId(), true);\n    } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n      ctx.setOpen(nodeId(), false);\n    }\n  };\n\n  return (\n    <div\n      class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n      role=\"treeitem\"\n      aria-expanded={hasChildNodes() ? isOpen() : undefined}\n      aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n    >\n      <span class=\"smwb-tree__node__content\" onClick={onLabelClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n        <Show when={ctx.checkboxes}>\n          <input\n            type=\"checkbox\"\n            class=\"smwb-tree__node__checkbox\"\n            checked={isSelected()}\n            onClick={(e) => e.stopPropagation()}\n            onChange={() => ctx.toggleSelected(nodeId())}\n            aria-label={props.item.label}\n          />\n        </Show>\n        <span class=\"smwb-tree__node__label\">\n          <Show when={hasChildNodes()} fallback={<Icon name={ctx.listIcon} size={20} />}>\n            <Icon name={isOpen() ? ctx.nodeIcon.opened ?? \"folder_open\" : ctx.nodeIcon.closed ?? \"folder\"} fill={1} size={20} />\n          </Show>\n          {ctx.renderLabel ? ctx.renderLabel(props.item, nodeId()) : props.item.label}\n        </span>\n      </span>\n      <Show when={hasChildNodes() && isOpen()}>\n        <div role=\"group\">\n          <Show\n            when={!(isLoading() && !resolvedChildren())}\n            fallback={\n              <div class=\"smwb-tree__node__loading\" role=\"status\">\n                Загрузка…\n              </div>\n            }\n          >\n            <For each={resolvedChildren() ?? []}>\n              {(child, idx) => <TreeNode item={child} path={`${props.path}.${idx()}`} />}\n            </For>\n          </Show>\n        </div>\n      </Show>\n    </div>\n  );\n}\n\nexport function TreeView(props: TreeViewProps): JSX.Element {\n  const merged = mergeProps(\n    {\n      listIcon: \"draft\",\n      nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string },\n      data: [] as ITreeNodeItem[],\n      defaultExpanded: [] as string[],\n      defaultSelected: [] as string[],\n      selectable: false,\n      checkboxes: false,\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"listIcon\",\n    \"nodeIcon\",\n    \"data\",\n    \"expanded\",\n    \"defaultExpanded\",\n    \"onExpandedChange\",\n    \"selected\",\n    \"defaultSelected\",\n    \"onSelectedChange\",\n    \"selectable\",\n    \"checkboxes\",\n    \"renderLabel\",\n    \"loadChildren\",\n    \"ref\",\n  ]);\n\n  const [loadedChildren, setLoadedChildren] = createSignal<Record<string, ITreeNodeItem[]>>({});\n  const [loadingIds, setLoadingIds] = createSignal<string[]>([]);\n  const [expandedIds, setExpandedIds] = createControllableState<string[]>({\n    value: () => local.expanded,\n    defaultValue: local.defaultExpanded,\n    onChange: (next) => local.onExpandedChange?.(next),\n  });\n  let lastToggled: { id: string; selected: boolean } | undefined;\n  const [selectedIds, setSelectedIds] = createControllableState<string[]>({\n    value: () => local.selected,\n    defaultValue: local.defaultSelected,\n    onChange: (next) => {\n      // createControllableState calls onChange synchronously from the setter,\n      // so lastToggled still refers to the toggle that caused this change.\n      const changed = lastToggled;\n      lastToggled = undefined;\n      local.onSelectedChange?.(next, changed);\n    },\n  });\n\n  const toggleExpanded = (id: string): void =>\n    setExpandedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n\n  const setOpen = (id: string, open: boolean): void =>\n    setExpandedIds((prev) => {\n      const has = prev.includes(id);\n      if (open && !has) return [...prev, id];\n      if (!open && has) return prev.filter((x) => x !== id);\n      return prev;\n    });\n\n  const toggleSelected = (id: string): void => {\n    lastToggled = { id, selected: !selectedIds().includes(id) };\n    setSelectedIds((prev) => (prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id]));\n  };\n\n  const ensureLoaded = (item: ITreeNodeItem, nodeId: string): void => {\n    if (!local.loadChildren || loadedChildren()[nodeId] || (item.children && item.children.length > 0)) return;\n    setLoadingIds((prev) => (prev.includes(nodeId) ? prev : [...prev, nodeId]));\n    void local\n      .loadChildren(item, nodeId)\n      .then((children) => setLoadedChildren((prev) => ({ ...prev, [nodeId]: children })))\n      .finally(() => setLoadingIds((prev) => prev.filter((x) => x !== nodeId)));\n  };\n\n  const contextValue: TreeContextValue = {\n    expandedIds,\n    selectedIds,\n    loadedChildren,\n    loadingIds,\n    toggleExpanded,\n    setOpen,\n    toggleSelected,\n    ensureLoaded,\n    get selectable() {\n      return local.selectable;\n    },\n    get checkboxes() {\n      return local.checkboxes;\n    },\n    get nodeIcon() {\n      return local.nodeIcon;\n    },\n    get listIcon() {\n      return local.listIcon;\n    },\n    get renderLabel() {\n      return local.renderLabel;\n    },\n    get hasLoader() {\n      return !!local.loadChildren;\n    },\n  };\n\n  return (\n    <TreeContext.Provider value={contextValue}>\n      <div {...rest} data-testid=\"tree-view\" ref={mergeRefs(local.ref)} role=\"tree\" class={cn(\"smwb-tree\", local.class)}>\n        <For each={local.data}>\n          {(node, idx) => (\n            <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n              <TreeNode item={node} path={`${idx()}`} />\n            </div>\n          )}\n        </For>\n      </div>\n    </TreeContext.Provider>\n  );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","TreeNode","props","ctx","useContext","nodeId","item","id","path","resolvedChildren","children","loadedChildren","isLazy","hasLoader","hasChildren","hasChildNodes","length","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","onLabelClick","ensureLoaded","toggleExpanded","selectable","toggleSelected","onKeyDown","event","key","preventDefault","setOpen","_el$","_tmpl$3","_el$2","firstChild","_el$4","$$keydown","$$click","_$insert","_$createComponent","Show","when","checkboxes","_el$3","_tmpl$","addEventListener","e","stopPropagation","_$effect","_$setAttribute","label","checked","fallback","Icon","name","listIcon","size","_$memo","nodeIcon","opened","closed","fill","_c$","renderLabel","_el$5","_tmpl$2","_tmpl$4","For","each","child","idx","_p$","_v$","cn","_v$2","undefined","_v$3","_$className","t","a","TreeView","merged","mergeProps","data","defaultExpanded","defaultSelected","local","rest","splitProps","setLoadedChildren","createSignal","setLoadingIds","setExpandedIds","createControllableState","value","expanded","defaultValue","onChange","next","onExpandedChange","lastToggled","setSelectedIds","selected","changed","onSelectedChange","contextValue","prev","filter","x","open","has","loadChildren","then","finally","Provider","_el$7","_tmpl$5","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","node","_el$8","_tmpl$6","_$delegateEvents"],"mappings":"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"}

package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js

@@ -0,0 +1,107 @@
+import { createComponent as r, mergeProps as m, insert as l, effect as g, className as b, template as p } from "solid-js/web";
+import { splitProps as f, createUniqueId as i, Show as c } from "solid-js";
+import y from "clsx";
+import { Modal as n } from "../modal/modal.js";
+import { Typography as s } from "../../dataDisplay/typography/typography.js";
+import { Button as u } from "../../inputs/button/button.js";
+var C = /* @__PURE__ */ p("<div>");
+function _(d) {
+  const [e] = f(d, ["open", "title", "subject", "message", "confirmLabel", "cancelLabel", "danger", "busy", "onConfirm", "onCancel", "class"]), o = i(), a = i();
+  return r(n, m({
+    get open() {
+      return e.open;
+    },
+    onClose: () => e.onCancel(),
+    size: "small",
+    role: "alertdialog",
+    backdrop: "dark",
+    get closeOnEsc() {
+      return !e.busy;
+    },
+    get closeOnOutsideClick() {
+      return !e.busy;
+    },
+    get "aria-label"() {
+      return e.title;
+    }
+  }, () => {
+    const t = [e.subject ? o : "", e.message ? a : ""].filter(Boolean).join(" ");
+    return t ? {
+      "aria-describedby": t
+    } : {};
+  }, {
+    get children() {
+      return [r(n.Header, {
+        get children() {
+          return e.title;
+        }
+      }), r(n.Content, {
+        get children() {
+          var t = C();
+          return l(t, r(c, {
+            get when() {
+              return e.subject;
+            },
+            get children() {
+              return r(s, {
+                id: o,
+                variant: "body2",
+                color: "textPrimary",
+                component: "span",
+                get children() {
+                  return e.subject;
+                }
+              });
+            }
+          }), null), l(t, r(c, {
+            get when() {
+              return e.message;
+            },
+            get children() {
+              return r(s, {
+                id: a,
+                variant: "caption",
+                color: "textSecondary",
+                component: "span",
+                get children() {
+                  return e.message;
+                }
+              });
+            }
+          }), null), g(() => b(t, y("smwb-confirm-dialog__body", e.class))), t;
+        }
+      }), r(n.Footer, {
+        get children() {
+          return [r(u, {
+            variant: "text",
+            size: "small",
+            get disabled() {
+              return !!e.busy;
+            },
+            onClick: () => e.onCancel(),
+            get label() {
+              return e.cancelLabel ?? "Cancel";
+            }
+          }), r(u, {
+            variant: "contained",
+            size: "small",
+            get color() {
+              return e.danger ? "error" : "primary";
+            },
+            get disabled() {
+              return !!e.busy;
+            },
+            onClick: () => e.onConfirm(),
+            get label() {
+              return e.confirmLabel;
+            }
+          })];
+        }
+      })];
+    }
+  }));
+}
+export {
+  _ as ConfirmDialog
+};
+//# sourceMappingURL=confirmDialog.js.map

package/dist/headless/components/feedBack/confirmDialog/confirmDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"confirmDialog.js","sources":["../../../../../src/components/feedBack/confirmDialog/confirmDialog.tsx"],"sourcesContent":["import { type JSX, Show, splitProps, createUniqueId } from \"solid-js\";\nimport cn from \"clsx\";\nimport { Modal } from \"../modal\";\nimport { Button } from \"../../inputs/button\";\nimport { Typography } from \"../../dataDisplay/typography\";\n\nexport interface ConfirmDialogProps {\n  open: boolean;\n  title: string;\n  /** The subject of the action, shown emphasised on its own line (e.g. the asset name). */\n  subject?: string;\n  /** A secondary explanatory line (e.g. \"can't be undone\"). */\n  message?: string;\n  confirmLabel: string;\n  cancelLabel?: string;\n  /** Style the confirm button as destructive (red). */\n  danger?: boolean;\n  /** Disable the actions + gate Esc/outside-click while a confirm is in flight. */\n  busy?: boolean;\n  onConfirm: () => void;\n  onCancel: () => void;\n  class?: string;\n}\n\n/**\n * An alert/confirm dialog built on {@link Modal}: a title, an optional emphasised subject + secondary\n * message, and Cancel / Confirm actions. `role=\"alertdialog\"` with the subject + message wired to\n * `aria-describedby` so a screen reader announces the consequence, not just the title. While `busy`,\n * Escape + outside-click are gated and the buttons disabled. Pure presentation — the caller owns the\n * open state and the confirm/cancel handlers (and supplies localised labels).\n */\nexport function ConfirmDialog(props: ConfirmDialogProps): JSX.Element {\n  const [local] = splitProps(props, [\n    \"open\",\n    \"title\",\n    \"subject\",\n    \"message\",\n    \"confirmLabel\",\n    \"cancelLabel\",\n    \"danger\",\n    \"busy\",\n    \"onConfirm\",\n    \"onCancel\",\n    \"class\",\n  ]);\n  const subjectId = createUniqueId();\n  const messageId = createUniqueId();\n  // Only include aria-describedby when there's something to describe (the lib's exactOptionalPropertyTypes\n  // forbids passing an explicit `undefined` to Modal's optional prop, so spread a precisely-typed object).\n  const ariaDescribed = (): { \"aria-describedby\"?: string } => {\n    const ids = [local.subject ? subjectId : \"\", local.message ? messageId : \"\"].filter(Boolean).join(\" \");\n    return ids ? { \"aria-describedby\": ids } : {};\n  };\n\n  return (\n    <Modal\n      open={local.open}\n      onClose={() => local.onCancel()}\n      size=\"small\"\n      role=\"alertdialog\"\n      backdrop=\"dark\"\n      closeOnEsc={!local.busy}\n      closeOnOutsideClick={!local.busy}\n      aria-label={local.title}\n      {...ariaDescribed()}\n    >\n      <Modal.Header>{local.title}</Modal.Header>\n      <Modal.Content>\n        <div class={cn(\"smwb-confirm-dialog__body\", local.class)}>\n          <Show when={local.subject}>\n            <Typography id={subjectId} variant=\"body2\" color=\"textPrimary\" component=\"span\">\n              {local.subject}\n            </Typography>\n          </Show>\n          <Show when={local.message}>\n            <Typography id={messageId} variant=\"caption\" color=\"textSecondary\" component=\"span\">\n              {local.message}\n            </Typography>\n          </Show>\n        </div>\n      </Modal.Content>\n      <Modal.Footer>\n        <Button\n          variant=\"text\"\n          size=\"small\"\n          disabled={!!local.busy}\n          onClick={() => local.onCancel()}\n          label={local.cancelLabel ?? \"Cancel\"}\n        />\n        <Button\n          variant=\"contained\"\n          size=\"small\"\n          color={local.danger ? \"error\" : \"primary\"}\n          disabled={!!local.busy}\n          onClick={() => local.onConfirm()}\n          label={local.confirmLabel}\n        />\n      </Modal.Footer>\n    </Modal>\n  );\n}\n\nexport default ConfirmDialog;\n"],"names":["ConfirmDialog","props","local","splitProps","subjectId","createUniqueId","messageId","_$createComponent","Modal","_$mergeProps","open","onClose","onCancel","size","role","backdrop","closeOnEsc","busy","closeOnOutsideClick","title","ariaDescribed","ids","subject","message","filter","Boolean","join","children","Header","Content","_el$","_tmpl$","_$insert","Show","when","Typography","id","variant","color","component","_$effect","_$className","cn","class","Footer","Button","disabled","onClick","label","cancelLabel","danger","onConfirm","confirmLabel"],"mappings":"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"}

package/dist/headless/components/feedBack/modal/modal.js

@@ -1,11 +1,12 @@
-import { createComponent as d, Portal as f, addEventListener as b, insert as s, Dynamic as w, mergeProps as g, effect as l, className as i, isServer as y, template as C, delegateEvents as k } from "solid-js/web";
-import { mergeProps as A, splitProps as E, createEffect as h, onCleanup as O, Show as $ } from "solid-js";
-import a from "clsx";
-import { createCssTransition as x } from "../../../primitives/createCssTransition.js";
-import { createFocusTrap as P } from "../../../primitives/createFocusTrap.js";
-import { mergeRefs as F } from "../../../primitives/mergeRefs.js";
-var c = /* @__PURE__ */ C("<div>");
-const L = {
+import { createComponent as c, Portal as w, addEventListener as y, use as g, insert as s, Dynamic as C, mergeProps as k, effect as l, className as i, isServer as E, template as _, delegateEvents as A } from "solid-js/web";
+import { mergeProps as O, splitProps as $, createEffect as h, onCleanup as x, Show as L } from "solid-js";
+import n from "clsx";
+import { createCssTransition as P } from "../../../primitives/createCssTransition.js";
+import { createFocusTrap as F } from "../../../primitives/createFocusTrap.js";
+import { isTopOverlayLayer as S } from "../../../primitives/overlayLayer.js";
+import { mergeRefs as z } from "../../../primitives/mergeRefs.js";
+var D = /* @__PURE__ */ _("<div data-smwb-overlay-layer>"), d = /* @__PURE__ */ _("<div>");
+const M = {
   appear: "smwb-modal__overlay-appear",
   appearActive: "smwb-modal__overlay-appear-active",
   appearDone: "smwb-modal__overlay-appear-done",
@@ -15,8 +16,8 @@ const L = {
   exit: "smwb-modal__overlay-exit",
   exitActive: "smwb-modal__overlay-exit-active"
 };
-function S(o) {
-  const r = A({
+function N(o) {
+  const r = O({
     animation: "fade",
     backdrop: "dark",
     size: "large",
@@ -25,51 +26,51 @@ function S(o) {
     disableAppearAnimation: !1,
     role: "dialog",
     closeOnEsc: !0
-  }, o), [e, v] = E(r, ["children", "onClose", "open", "class", "animation", "backdrop", "size", "closeOnOutsideClick", "asForm", "disableAppearAnimation", "role", "closeOnEsc", "ref"]);
-  let p;
-  const m = x({
+  }, o), [e, f] = $(r, ["children", "onClose", "open", "class", "animation", "backdrop", "size", "closeOnOutsideClick", "asForm", "disableAppearAnimation", "role", "closeOnEsc", "ref"]);
+  let p, u;
+  const m = P({
     in: () => e.open,
     timeout: {
       appear: 225,
       enter: 225,
       exit: 150
     },
-    classNames: L,
+    classNames: M,
     appear: !e.disableAppearAnimation
   });
-  return P({
+  return F({
     active: () => e.open && m.mounted(),
     container: () => p
   }), h(() => {
     if (!e.open || !e.closeOnEsc || !e.onClose) return;
-    const t = (n) => {
-      n.key === "Escape" && e.onClose?.();
+    const t = (a) => {
+      a.key === "Escape" && S(u) && e.onClose?.();
     };
-    document.addEventListener("keydown", t), O(() => document.removeEventListener("keydown", t));
-  }), d($, {
+    document.addEventListener("keydown", t), x(() => document.removeEventListener("keydown", t));
+  }), c(L, {
     get when() {
       return m.mounted();
     },
     get children() {
-      return d(f, {
+      return c(w, {
         get mount() {
-          return y ? void 0 : document.body;
+          return E ? void 0 : document.body;
         },
         get children() {
-          var t = c();
-          return b(t, "click", e.closeOnOutsideClick && e.onClose ? () => e.onClose?.() : void 0, !0), s(t, d(w, g({
+          var t = D();
+          return y(t, "click", e.closeOnOutsideClick && e.onClose ? () => e.onClose?.() : void 0, !0), g((a) => u = a, t), s(t, c(C, k({
             get component() {
               return e.asForm ? "form" : "div";
             }
-          }, v, {
-            ref(n) {
-              var u = F(e.ref, (_) => p = _);
-              typeof u == "function" && u(n);
+          }, f, {
+            ref(a) {
+              var v = z(e.ref, (b) => p = b);
+              typeof v == "function" && v(a);
             },
             get class() {
-              return a("smwb-modal", `smwb-${e.size}`, `smwb-${e.animation}`, e.class);
+              return n("smwb-modal", `smwb-${e.size}`, `smwb-${e.animation}`, e.class);
             },
-            onClick: (n) => n.stopPropagation(),
+            onClick: (a) => a.stopPropagation(),
             get role() {
               return e.role;
             },
@@ -77,40 +78,40 @@ function S(o) {
             get children() {
               return e.children;
             }
-          }))), l(() => i(t, a("smwb-modal__overlay", `smwb-${e.backdrop}`, `smwb-${e.size}`, m.classes()))), t;
+          }))), l(() => i(t, n("smwb-modal__overlay", `smwb-${e.backdrop}`, `smwb-${e.size}`, m.classes()))), t;
         }
       });
     }
   });
 }
-function z(o) {
+function T(o) {
   return (() => {
-    var r = c();
-    return s(r, () => o.children), l(() => i(r, a("smwb-modal__header", o.class))), r;
+    var r = d();
+    return s(r, () => o.children), l(() => i(r, n("smwb-modal__header", o.class))), r;
   })();
 }
-function D(o) {
+function R(o) {
   return (() => {
-    var r = c();
-    return s(r, () => o.children), l(() => i(r, a("smwb-modal__content", o.class))), r;
+    var r = d();
+    return s(r, () => o.children), l(() => i(r, n("smwb-modal__content", o.class))), r;
   })();
 }
-function M(o) {
+function j(o) {
   return (() => {
-    var r = c();
-    return s(r, () => o.children), l(() => i(r, a("smwb-modal__footer", o.class))), r;
+    var r = d();
+    return s(r, () => o.children), l(() => i(r, n("smwb-modal__footer", o.class))), r;
   })();
 }
-const K = Object.assign(S, {
-  Footer: M,
-  Header: z,
-  Content: D
+const I = Object.assign(N, {
+  Footer: j,
+  Header: T,
+  Content: R
 });
-k(["click"]);
+A(["click"]);
 export {
-  D as Content,
-  M as Footer,
-  z as Header,
-  K as Modal
+  R as Content,
+  j as Footer,
+  T as Header,
+  I as Modal
 };
 //# sourceMappingURL=modal.js.map