@smwb/ui-solid 1.0.0 → 2.1.0

package/dist/components/dataDisplay/statusDot/statusDot.js.map

@@ -1 +1 @@
-{"version":3,"file":"statusDot.js","sources":["../../../../src/components/dataDisplay/statusDot/statusDot.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\n/** What the marker says: `active` is under way, `attention` waits for someone, `idle` rests, `done` is finished. */\nexport type StatusDotStatus = \"active\" | \"attention\" | \"idle\" | \"done\" | \"error\" | \"unknown\";\n\n/** The theme colour names `Chip` takes; `default` is the neutral on-surface colour. */\nexport type StatusDotColor = \"default\" | \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport type StatusDotSize = \"sm\" | \"md\";\n\nexport interface StatusDotProps extends Omit<JSX.HTMLAttributes<HTMLSpanElement>, \"role\" | \"children\" | \"aria-label\"> {\n  /**\n   * What the dot says, and so its colour: `active` info, `attention` warning, `idle` neutral, `done` success,\n   * `error` error. `unknown` is a ring in the outline colour. Without `status` (and without `color`) the dot is\n   * `unknown`.\n   */\n  status?: StatusDotStatus | undefined;\n  /**\n   * A theme colour instead of the status's own, or on its own with no `status` (a plain disc). Given with a\n   * `status`, the status still sets the shape.\n   */\n  color?: StatusDotColor | undefined;\n  /** `md` (12px) unless given; `sm` is 8px. */\n  size?: StatusDotSize | undefined;\n  /**\n   * A ring spreads from the dot. On unless given for `active`, off for every other status. Never drawn while the\n   * user prefers reduced motion.\n   */\n  pulse?: boolean | undefined;\n  /** What the dot means in words, e.g. \"Working\": the accessible name, read by assistive technology. */\n  label: string;\n  /** Test id of the root; `status-dot` unless given. */\n  \"data-testid\"?: string | undefined;\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/** A small status marker: a dot coloured and shaped by `status`, named by `label`. */\nexport function StatusDot(props: StatusDotProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\"class\", \"status\", \"color\", \"size\", \"pulse\", \"label\", \"ref\", \"data-testid\"]);\n\n  // A bare colour is a plain disc; with neither, the dot is \"unknown\".\n  const shown = (): StatusDotStatus | undefined => local.status ?? (local.color === undefined ? \"unknown\" : undefined);\n\n  return (\n    <span\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      role=\"img\"\n      aria-label={local.label}\n      data-testid={local[\"data-testid\"] ?? \"status-dot\"}\n      class={cn(\n        \"smwb-status-dot\",\n        `smwb-status-dot_size-${local.size ?? \"md\"}`,\n        shown() && `smwb-status-dot_status-${shown()}`,\n        local.color && `smwb-status-dot_color-${local.color}`,\n        { \"smwb-status-dot_pulse\": local.pulse ?? local.status === \"active\" },\n        local.class\n      )}\n    />\n  );\n}\n\nexport default StatusDot;\n"],"names":["StatusDot","props","local","rest","splitProps","shown","status","color","undefined","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","label","cn","size","pulse","class"],"mappings":";;;;;;;AA0CO,SAASA,EAAUC,GAAoC;AAC5D,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CAAC,SAAS,UAAU,SAAS,QAAQ,SAAS,SAAS,OAAO,aAAa,CAAC,GAG9GI,IAAQA,MAAmCH,EAAMI,WAAWJ,EAAMK,UAAUC,SAAY,YAAYA;AAE1G,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAGSC,EAAUV,EAAMW,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBb,GAAI;AAAA,MAAA,MAEH;AAAA,MAAK,IAAA,eAAA;AAAA,eACED,EAAMe;AAAAA,MAAK;AAAA,MAAA,IAAA,gBAAA;AAAA,eACVf,EAAM,aAAa,KAAK;AAAA,MAAY;AAAA,MAAA,IAAA,QAAA;AAAA,eAC1CgB,EACL,mBACA,wBAAwBhB,EAAMiB,QAAQ,IAAI,IAC1Cd,EAAAA,KAAW,0BAA0BA,EAAAA,CAAO,IAC5CH,EAAMK,SAAS,yBAAyBL,EAAMK,KAAK,IACnD;AAAA,UAAE,yBAAyBL,EAAMkB,SAASlB,EAAMI,WAAW;AAAA,QAAA,GAC3DJ,EAAMmB,KACR;AAAA,MAAC;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAZ;AAAAA,EAAA,GAAA;AAGP;"}
+{"version":3,"file":"statusDot.js","sources":["../../../../src/components/dataDisplay/statusDot/statusDot.tsx"],"sourcesContent":["import type { JSX } from \"solid-js\";\nimport { splitProps } from \"solid-js\";\nimport cn from \"clsx\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\n\n/** What the marker says: `active` is under way, `attention` waits for someone, `idle` rests, `done` is finished. */\nexport type StatusDotStatus = \"active\" | \"attention\" | \"idle\" | \"done\" | \"error\" | \"unknown\";\n\n/** The theme colour names `Chip` takes; `default` is the neutral on-surface colour. */\nexport type StatusDotColor = \"default\" | \"primary\" | \"secondary\" | \"error\" | \"success\" | \"warning\" | \"info\";\n\nexport type StatusDotSize = \"sm\" | \"md\";\n\n/** The marker's outline, chosen by the caller and not by `status`: `dot` is a disc, `diamond` a square turned corner-up. */\nexport type StatusDotShape = \"dot\" | \"diamond\";\n\nexport interface StatusDotProps extends Omit<JSX.HTMLAttributes<HTMLSpanElement>, \"role\" | \"children\" | \"aria-label\"> {\n  /**\n   * What the dot says, and so its colour: `active` info, `attention` warning, `idle` neutral, `done` success,\n   * `error` error. `unknown` is a ring in the outline colour. Without `status` (and without `color`) the dot is\n   * `unknown`.\n   */\n  status?: StatusDotStatus | undefined;\n  /**\n   * A theme colour instead of the status's own, or on its own with no `status` (a plain disc). Given with a\n   * `status`, the status still sets the shape.\n   */\n  color?: StatusDotColor | undefined;\n  /** `md` (12px) unless given; `sm` is 8px. */\n  size?: StatusDotSize | undefined;\n  /**\n   * The marker's outline, `dot` unless given: `diamond` turns the same square corner-up. The shape is the caller's\n   * choice, not the status's — a diamond takes its colour from `color` or `status`, its size from `size` and its\n   * pulse from `pulse` exactly as the dot does, so `unknown` is a ring and `active` pulses in either shape. Its box\n   * is the box of a dot of the same `size`, so the two swap places without moving a row.\n   */\n  shape?: StatusDotShape | undefined;\n  /**\n   * A ring spreads from the dot. On unless given for `active`, off for every other status. Never drawn while the\n   * user prefers reduced motion.\n   */\n  pulse?: boolean | undefined;\n  /** What the dot means in words, e.g. \"Working\": the accessible name, read by assistive technology. */\n  label: string;\n  /** Test id of the root; `status-dot` unless given. */\n  \"data-testid\"?: string | undefined;\n  ref?: Ref<HTMLSpanElement>;\n}\n\n/** A small status marker: a dot or a diamond, coloured by `status` or `color`, named by `label`. */\nexport function StatusDot(props: StatusDotProps): JSX.Element {\n  const [local, rest] = splitProps(props, [\n    \"class\",\n    \"status\",\n    \"color\",\n    \"size\",\n    \"shape\",\n    \"pulse\",\n    \"label\",\n    \"ref\",\n    \"data-testid\",\n  ]);\n\n  // A bare colour is a plain disc; with neither, the dot is \"unknown\".\n  const shown = (): StatusDotStatus | undefined => local.status ?? (local.color === undefined ? \"unknown\" : undefined);\n\n  return (\n    <span\n      {...rest}\n      ref={mergeRefs(local.ref)}\n      role=\"img\"\n      aria-label={local.label}\n      data-testid={local[\"data-testid\"] ?? \"status-dot\"}\n      class={cn(\n        \"smwb-status-dot\",\n        `smwb-status-dot_size-${local.size ?? \"md\"}`,\n        // Only the diamond carries a class: a dot is the shape the base rule already draws.\n        local.shape === \"diamond\" && \"smwb-status-dot_shape-diamond\",\n        shown() && `smwb-status-dot_status-${shown()}`,\n        local.color && `smwb-status-dot_color-${local.color}`,\n        { \"smwb-status-dot_pulse\": local.pulse ?? local.status === \"active\" },\n        local.class\n      )}\n    />\n  );\n}\n\nexport default StatusDot;\n"],"names":["StatusDot","props","local","rest","splitProps","shown","status","color","undefined","_el$","_tmpl$","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","label","cn","size","shape","pulse","class"],"mappings":";;;;;;;AAoDO,SAASA,EAAUC,GAAoC;AAC5D,QAAM,CAACC,GAAOC,CAAI,IAAIC,EAAWH,GAAO,CACtC,SACA,UACA,SACA,QACA,SACA,SACA,SACA,OACA,aAAa,CACd,GAGKI,IAAQA,MAAmCH,EAAMI,WAAWJ,EAAMK,UAAUC,SAAY,YAAYA;AAE1G,UAAA,MAAA;AAAA,QAAAC,IAAAC,EAAAA,GAAAC,IAGSC,EAAUV,EAAMW,GAAG;AAAC,kBAAAF,KAAA,cAAAG,EAAAH,GAAAF,CAAA,GAAAM,EAAAN,GAAAO,EADrBb,GAAI;AAAA,MAAA,MAEH;AAAA,MAAK,IAAA,eAAA;AAAA,eACED,EAAMe;AAAAA,MAAK;AAAA,MAAA,IAAA,gBAAA;AAAA,eACVf,EAAM,aAAa,KAAK;AAAA,MAAY;AAAA,MAAA,IAAA,QAAA;AAAA,eAC1CgB;AAAAA,UACL;AAAA,UACA,wBAAwBhB,EAAMiB,QAAQ,IAAI;AAAA;AAAA,UAE1CjB,EAAMkB,UAAU,aAAa;AAAA,UAC7Bf,OAAW,0BAA0BA,EAAAA,CAAO;AAAA,UAC5CH,EAAMK,SAAS,yBAAyBL,EAAMK,KAAK;AAAA,UACnD;AAAA,YAAE,yBAAyBL,EAAMmB,SAASnB,EAAMI,WAAW;AAAA,UAAA;AAAA,UAC3DJ,EAAMoB;AAAAA,QAAAA;AAAAA,MACP;AAAA,IAAA,CAAA,GAAA,IAAA,EAAA,GAAAb;AAAAA,EAAA,GAAA;AAGP;"}

package/dist/components/dataDisplay/treeView/treeView.d.ts

@@ -9,11 +9,27 @@ export interface ITreeNodeItem {
     hasChildren?: boolean;
 }
 export interface TreeViewProps extends Omit<JSX.HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    /**
+     * Icons of the nodes that have children, by state; `{ closed: "folder", opened: "folder_open" }` unless given.
+     * `false` draws none, and the label starts where the icon did.
+     */
     nodeIcon?: {
         opened?: string;
         closed?: string;
-    };
-    listIcon?: string;
+    } | false;
+    /** Icon of a node without children; "draft" unless given. `false` draws none. */
+    listIcon?: string | false;
+    /**
+     * Compact look: the row is as tall as the small control (`--smui-control-h-sm`, 32px) instead of the medium one
+     * (40px), and a level steps 16px (`@treeViewIndentDense`) instead of 40px. A tree with `--smwb-tree-row-h` or
+     * `--smwb-tree-indent` set on it (the `style` prop) takes those values, e.g. a 26px row.
+     */
+    dense?: boolean;
+    /**
+     * Whether the vertical lines and corners that join a node to its parent are drawn. They are by default; turning
+     * them off leaves the levels where they were.
+     */
+    guides?: boolean;
     data: ITreeNodeItem[];
     expanded?: string[];
     defaultExpanded?: string[];

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

@@ -1,203 +1,219 @@
-import { createComponent as i, use as F, spread as K, mergeProps as U, insert as f, template as w, setAttribute as v, effect as E, memo as N, className as j, delegateEvents as B } from "solid-js/web";
+import { createComponent as s, use as K, spread as U, mergeProps as j, insert as h, template as w, setAttribute as v, effect as O, memo as B, className as G, delegateEvents as H } from "solid-js/web";
 import '../../../assets/styles/less/components/treeView/treeView.entry.css';import '../../../assets/styles/less/tokens.entry.css';/* empty css                                     */
 /* empty css                                                           */
-import { mergeProps as G, splitProps as H, createSignal as P, createContext as J, createMemo as $, For as Q, useContext as W, createUniqueId as X, Show as x } from "solid-js";
-import q from "clsx";
-import { createControllableState as z } from "../../../primitives/createControllableState.js";
-import { mergeRefs as Y } from "../../../primitives/mergeRefs.js";
-import { isOwnClick as Z } from "../../../utils/ownClick.js";
-import { Icon as T } from "../../base/icon/icon.js";
-var ee = /* @__PURE__ */ w("<div class=smwb-tree__wrapper role=presentation>"), te = /* @__PURE__ */ w("<input type=checkbox class=smwb-tree__node__checkbox>"), ne = /* @__PURE__ */ w("<div role=group>"), re = /* @__PURE__ */ w("<div role=treeitem><div class=smwb-tree__node__row><span class=smwb-tree__node__toggle aria-hidden=true></span><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), le = /* @__PURE__ */ w("<span class=smwb-tree__node__actions>"), oe = /* @__PURE__ */ w("<div class=smwb-tree__node__loading role=status>"), de = /* @__PURE__ */ w("<div>");
-const D = J();
-function ae(s, t) {
-  if (s === t) return !0;
-  if (s.id !== t.id || s.label !== t.label || s.hasChildren !== t.hasChildren) return !1;
-  const e = s.children, c = t.children;
-  return e === c ? !0 : !e || !c || e.length !== c.length ? !1 : e.every((o, g) => {
-    const u = c[g];
-    return !!u && o.id === u.id && o.label === u.label && o.hasChildren === u.hasChildren;
+import { mergeProps as J, splitProps as Q, createSignal as z, createContext as W, createMemo as $, For as X, useContext as Y, createUniqueId as Z, Show as b } from "solid-js";
+import D from "clsx";
+import { createControllableState as V } from "../../../primitives/createControllableState.js";
+import { mergeRefs as ee } from "../../../primitives/mergeRefs.js";
+import { isOwnClick as te } from "../../../utils/ownClick.js";
+import { Icon as A } from "../../base/icon/icon.js";
+var ne = /* @__PURE__ */ w("<div class=smwb-tree__wrapper role=presentation>"), re = /* @__PURE__ */ w("<input type=checkbox class=smwb-tree__node__checkbox>"), le = /* @__PURE__ */ w("<div role=group>"), de = /* @__PURE__ */ w("<div role=treeitem><div class=smwb-tree__node__row><span class=smwb-tree__node__toggle aria-hidden=true></span><span class=smwb-tree__node__content tabindex=0 role=button><span class=smwb-tree__node__label>"), oe = /* @__PURE__ */ w("<span class=smwb-tree__node__actions>"), se = /* @__PURE__ */ w("<div class=smwb-tree__node__loading role=status>"), ae = /* @__PURE__ */ w("<div>");
+const M = W();
+function ce(a, n) {
+  if (a === n) return !0;
+  if (a.id !== n.id || a.label !== n.label || a.hasChildren !== n.hasChildren) return !1;
+  const e = a.children, c = n.children;
+  return e === c ? !0 : !e || !c || e.length !== c.length ? !1 : e.every((d, u) => {
+    const i = c[u];
+    return !!i && d.id === i.id && d.label === i.label && d.hasChildren === i.hasChildren;
   });
 }
-function M(s) {
-  const t = $(() => s.items.map((o, g) => {
-    const u = s.path === "" ? `${g}` : `${s.path}.${g}`;
+function F(a) {
+  const n = $(() => a.items.map((d, u) => {
+    const i = a.path === "" ? `${u}` : `${a.path}.${u}`;
     return {
-      id: o.id ?? u,
-      item: o,
-      path: u
+      id: d.id ?? i,
+      item: d,
+      path: i
     };
-  })), e = $(() => new Map(t().map((o) => [o.id, o]))), c = $(() => t().map((o) => o.id));
-  return i(Q, {
+  })), e = $(() => new Map(n().map((d) => [d.id, d]))), c = $(() => n().map((d) => d.id));
+  return s(X, {
     get each() {
       return c();
     },
-    children: (o) => {
-      let g = e().get(o);
-      const u = () => g = e().get(o) ?? g;
-      return s.wrap ? (() => {
-        var m = ee();
-        return f(m, i(V, {
-          entry: u
-        })), m;
-      })() : i(V, {
-        entry: u
+    children: (d) => {
+      let u = e().get(d);
+      const i = () => u = e().get(d) ?? u;
+      return a.wrap ? (() => {
+        var f = ne();
+        return h(f, s(q, {
+          entry: i
+        })), f;
+      })() : s(q, {
+        entry: i
       });
     }
   });
 }
-function V(s) {
-  const t = W(D), e = s.entry().id, c = () => s.entry().item, o = `${X()}-label`, g = $(() => c(), void 0, {
-    equals: ae
-  }), u = $(() => t.renderLabel ? t.renderLabel(g(), e) : g().label), m = () => c().children ?? t.loadedChildren()[e], I = () => t.hasLoader && (!!c().hasChildren || !!t.loadedChildren()[e]), h = () => !!m() && (m()?.length ?? 0) > 0 || I(), b = () => t.expandedIds().includes(e), C = () => t.selectedIds().includes(e), L = () => t.loadingIds().includes(e), y = () => {
-    b() || t.ensureLoaded(c(), e), t.toggleExpanded(e);
+function q(a) {
+  const n = Y(M), e = a.entry().id, c = () => a.entry().item, d = `${Z()}-label`, u = $(() => c(), void 0, {
+    equals: ce
+  }), i = $(() => n.renderLabel ? n.renderLabel(u(), e) : u().label), f = () => c().children ?? n.loadedChildren()[e], I = () => n.hasLoader && (!!c().hasChildren || !!n.loadedChildren()[e]), g = () => !!f() && (f()?.length ?? 0) > 0 || I(), _ = () => n.expandedIds().includes(e), C = () => n.selectedIds().includes(e), L = () => n.loadingIds().includes(e), N = () => {
+    const t = n.nodeIcon;
+    if (t !== !1)
+      return _() ? t.opened ?? "folder_open" : t.closed ?? "folder";
+  }, R = () => n.listIcon === !1 ? void 0 : n.listIcon, y = () => {
+    _() || n.ensureLoaded(c(), e), n.toggleExpanded(e);
   }, S = () => {
-    t.toggleOnRowClick && h() && y(), t.selectable && t.toggleSelected(e);
-  }, O = (d) => {
-    d.target === d.currentTarget && (d.key === "Enter" || d.key === " " ? (d.preventDefault(), S()) : d.key === "ArrowRight" && h() ? (t.ensureLoaded(c(), e), t.setOpen(e, !0)) : d.key === "ArrowLeft" && h() && t.setOpen(e, !1));
-  }, A = (d) => {
-    Z(d) && S();
+    n.toggleOnRowClick && g() && y(), n.selectable && n.toggleSelected(e);
+  }, E = (t) => {
+    t.target === t.currentTarget && (t.key === "Enter" || t.key === " " ? (t.preventDefault(), S()) : t.key === "ArrowRight" && g() ? (n.ensureLoaded(c(), e), n.setOpen(e, !0)) : t.key === "ArrowLeft" && g() && n.setOpen(e, !1));
+  }, r = (t) => {
+    te(t) && S();
   };
   return (() => {
-    var d = re(), n = d.firstChild, r = n.firstChild, l = r.nextSibling, _ = l.firstChild;
-    return v(d, "aria-labelledby", o), r.$$click = () => h() && y(), f(r, i(x, {
+    var t = de(), o = t.firstChild, m = o.firstChild, x = m.nextSibling, T = x.firstChild;
+    return v(t, "aria-labelledby", d), m.$$click = () => g() && y(), h(m, s(b, {
       get when() {
-        return h();
+        return g();
       },
       get children() {
-        return i(T, {
+        return s(A, {
           get name() {
-            return b() ? "expand_more" : "chevron_right";
+            return _() ? "expand_more" : "chevron_right";
           },
           size: 20
         });
       }
-    })), f(n, i(x, {
+    })), h(o, s(b, {
       get when() {
-        return t.checkboxes;
+        return n.checkboxes;
       },
       get children() {
-        var a = te();
-        return a.addEventListener("change", () => t.toggleSelected(e)), E(() => v(a, "aria-label", c().label)), E(() => a.checked = C()), a;
+        var l = re();
+        return l.addEventListener("change", () => n.toggleSelected(e)), O(() => v(l, "aria-label", c().label)), O(() => l.checked = C()), l;
       }
-    }), l), l.$$keydown = O, l.$$click = A, v(_, "id", o), f(_, i(x, {
+    }), x), x.$$keydown = E, x.$$click = r, v(T, "id", d), h(T, s(b, {
       get when() {
-        return h();
+        return g();
       },
       get fallback() {
-        return i(T, {
-          get name() {
-            return t.listIcon;
+        return s(b, {
+          get when() {
+            return R();
           },
-          size: 20
+          children: (l) => s(A, {
+            get name() {
+              return l();
+            },
+            size: 20
+          })
         });
       },
       get children() {
-        return i(T, {
-          get name() {
-            return N(() => !!b())() ? t.nodeIcon.opened ?? "folder_open" : t.nodeIcon.closed ?? "folder";
+        return s(b, {
+          get when() {
+            return N();
           },
-          fill: 1,
-          size: 20
+          children: (l) => s(A, {
+            get name() {
+              return l();
+            },
+            fill: 1,
+            size: 20
+          })
         });
       }
-    }), null), f(_, u, null), f(n, i(x, {
+    }), null), h(T, i, null), h(o, s(b, {
       get when() {
-        return t.renderActions;
+        return n.renderActions;
       },
-      children: (a) => {
-        const p = $(() => a()(g(), e));
+      children: (l) => {
+        const p = $(() => l()(u(), e));
         return (() => {
-          var k = le();
-          return f(k, p), k;
+          var k = oe();
+          return h(k, p), k;
         })();
       }
-    }), null), f(d, i(x, {
+    }), null), h(t, s(b, {
       get when() {
-        return N(() => !!h())() && b();
+        return B(() => !!g())() && _();
       },
       get children() {
-        var a = ne();
-        return f(a, i(x, {
+        var l = le();
+        return h(l, s(b, {
           get when() {
-            return !(L() && !m());
+            return !(L() && !f());
           },
           get fallback() {
             return (() => {
-              var p = oe();
-              return f(p, () => t.loadingText), p;
+              var p = se();
+              return h(p, () => n.loadingText), p;
             })();
           },
           get children() {
-            return i(M, {
+            return s(F, {
               get items() {
-                return m() ?? [];
+                return f() ?? [];
               },
               get path() {
-                return s.entry().path;
+                return a.entry().path;
               }
             });
           }
-        })), a;
+        })), l;
       }
-    }), null), E((a) => {
-      var p = q("smwb-tree__node", {
+    }), null), O((l) => {
+      var p = D("smwb-tree__node", {
         "smwb-tree__node_selected": C()
-      }), k = h() ? b() : void 0, R = t.selectable || t.checkboxes ? C() : void 0;
-      return p !== a.e && j(d, a.e = p), k !== a.t && v(d, "aria-expanded", a.t = k), R !== a.a && v(d, "aria-selected", a.a = R), a;
+      }), k = g() ? _() : void 0, P = n.selectable || n.checkboxes ? C() : void 0;
+      return p !== l.e && G(t, l.e = p), k !== l.t && v(t, "aria-expanded", l.t = k), P !== l.a && v(t, "aria-selected", l.a = P), l;
     }, {
       e: void 0,
       t: void 0,
       a: void 0
-    }), d;
+    }), t;
   })();
 }
-function be(s) {
-  const t = G({
+function we(a) {
+  const n = J({
     listIcon: "draft",
     nodeIcon: {
       closed: "folder",
       opened: "folder_open"
     },
+    dense: !1,
+    guides: !0,
     data: [],
     defaultExpanded: [],
     defaultSelected: [],
     selectable: !1,
     checkboxes: !1,
     loadingText: "Loading…"
-  }, s), [e, c] = H(t, ["class", "listIcon", "nodeIcon", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "toggleOnRowClick", "renderLabel", "renderActions", "loadingText", "loadChildren", "ref", "data-testid"]), [o, g] = P({}), [u, m] = P([]), [I, h] = z({
+  }, a), [e, c] = Q(n, ["class", "listIcon", "nodeIcon", "dense", "guides", "data", "expanded", "defaultExpanded", "onExpandedChange", "selected", "defaultSelected", "onSelectedChange", "selectable", "checkboxes", "toggleOnRowClick", "renderLabel", "renderActions", "loadingText", "loadChildren", "ref", "data-testid"]), [d, u] = z({}), [i, f] = z([]), [I, g] = V({
     value: () => e.expanded,
     defaultValue: e.defaultExpanded,
-    onChange: (n) => e.onExpandedChange?.(n)
+    onChange: (r) => e.onExpandedChange?.(r)
   });
-  let b;
-  const [C, L] = z({
+  let _;
+  const [C, L] = V({
     value: () => e.selected,
     defaultValue: e.defaultSelected,
-    onChange: (n) => {
-      const r = b;
-      b = void 0, e.onSelectedChange?.(n, r);
+    onChange: (r) => {
+      const t = _;
+      _ = void 0, e.onSelectedChange?.(r, t);
     }
-  }), d = {
+  }), E = {
     expandedIds: I,
     selectedIds: C,
-    loadedChildren: o,
-    loadingIds: u,
-    toggleExpanded: (n) => h((r) => r.includes(n) ? r.filter((l) => l !== n) : [...r, n]),
-    setOpen: (n, r) => h((l) => {
-      const _ = l.includes(n);
-      return r && !_ ? [...l, n] : !r && _ ? l.filter((a) => a !== n) : l;
+    loadedChildren: d,
+    loadingIds: i,
+    toggleExpanded: (r) => g((t) => t.includes(r) ? t.filter((o) => o !== r) : [...t, r]),
+    setOpen: (r, t) => g((o) => {
+      const m = o.includes(r);
+      return t && !m ? [...o, r] : !t && m ? o.filter((x) => x !== r) : o;
     }),
-    toggleSelected: (n) => {
-      b = {
-        id: n,
-        selected: !C().includes(n)
-      }, L((r) => r.includes(n) ? r.filter((l) => l !== n) : [...r, n]);
+    toggleSelected: (r) => {
+      _ = {
+        id: r,
+        selected: !C().includes(r)
+      }, L((t) => t.includes(r) ? t.filter((o) => o !== r) : [...t, r]);
     },
-    ensureLoaded: (n, r) => {
-      !e.loadChildren || o()[r] || n.children && n.children.length > 0 || (m((l) => l.includes(r) ? l : [...l, r]), e.loadChildren(n, r).then((l) => g((_) => ({
-        ..._,
-        [r]: l
-      }))).finally(() => m((l) => l.filter((_) => _ !== r))));
+    ensureLoaded: (r, t) => {
+      !e.loadChildren || d()[t] || r.children && r.children.length > 0 || (f((o) => o.includes(t) ? o : [...o, t]), e.loadChildren(r, t).then((o) => u((m) => ({
+        ...m,
+        [t]: o
+      }))).finally(() => f((o) => o.filter((m) => m !== t))));
     },
     get selectable() {
       return e.selectable;
@@ -227,30 +243,33 @@ function be(s) {
       return !!e.loadChildren;
     }
   };
-  return i(D.Provider, {
-    value: d,
+  return s(M.Provider, {
+    value: E,
     get children() {
-      var n = de(), r = Y(e.ref);
-      return typeof r == "function" && F(r, n), K(n, U(c, {
+      var r = ae(), t = ee(e.ref);
+      return typeof t == "function" && K(t, r), U(r, j(c, {
         get "data-testid"() {
           return e["data-testid"] ?? "tree-view";
         },
         role: "tree",
         get class() {
-          return q("smwb-tree", e.class);
+          return D("smwb-tree", {
+            "smwb-tree_dense": e.dense,
+            "smwb-tree_no-guides": !e.guides
+          }, e.class);
         }
-      }), !1, !0), f(n, i(M, {
+      }), !1, !0), h(r, s(F, {
         get items() {
           return e.data;
         },
         path: "",
         wrap: !0
-      })), n;
+      })), r;
     }
   });
 }
-B(["click", "keydown"]);
+H(["click", "keydown"]);
 export {
-  be as TreeView
+  we as TreeView
 };
 //# sourceMappingURL=treeView.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"treeView.js","sources":["../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import {\n  type Accessor,\n  type JSX,\n  For,\n  Show,\n  createContext,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  mergeProps,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { isOwnClick } from \"../../../utils/ownClick\";\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  /**\n   * Enables row selection: a click, Enter or Space on a row toggles its selection. The chevron and the\n   * Left/Right keys never change it.\n   */\n  selectable?: boolean;\n  /** Renders a checkbox per node bound to selection. */\n  checkboxes?: boolean;\n  /**\n   * Whether a click, Enter or Space on a row also expands or collapses its children. The chevron and the\n   * Right/Left keys always do. Defaults to `true` while the tree is not `selectable` (a row has nothing else to\n   * do) and to `false` otherwise, so that selecting a row leaves it open or closed.\n   */\n  toggleOnRowClick?: boolean;\n  /** Custom node renderer. */\n  renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  /**\n   * Per-node actions (buttons, a menu trigger), drawn at the end of the row. They sit beside the row's\n   * button, not inside it, so they take their own clicks, Enter and Space, focus and accessible names.\n   */\n  renderActions?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  /** Text shown while `loadChildren` is pending; \"Loading…\" unless given. */\n  loadingText?: string;\n  /** Lazily resolves children the first time a node is expanded. */\n  loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n  /** Test id of the root `<div>`; `tree-view` unless given. */\n  \"data-testid\"?: string | undefined;\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  toggleOnRowClick: boolean;\n  loadingText: string;\n  nodeIcon: { opened?: string; closed?: string };\n  listIcon: string;\n  renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  renderActions: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\ninterface TreeEntry {\n  id: string;\n  item: ITreeNodeItem;\n  path: string;\n}\n\n/**\n * Whether two items are the same as far as a row's own markup goes. A caller that refetches hands the tree\n * brand-new objects for the same nodes, and comparing those by identity would rebuild the `renderLabel` /\n * `renderActions` output on every refetch: Solid replaces a dynamic child, so the elements the caller drew\n * (and the focus in them, an open menu anchored to one, a caret) would be thrown away while the row around\n * them survives. Children are compared one level deep — a row draws that it has them, not their subtrees.\n */\nfunction sameItem(a: ITreeNodeItem, b: ITreeNodeItem): boolean {\n  if (a === b) return true;\n  if (a.id !== b.id || a.label !== b.label || a.hasChildren !== b.hasChildren) return false;\n  const left = a.children;\n  const right = b.children;\n  if (left === right) return true;\n  if (!left || !right || left.length !== right.length) return false;\n  return left.every((child, idx) => {\n    const other = right[idx];\n    return !!other && child.id === other.id && child.label === other.label && child.hasChildren === other.hasChildren;\n  });\n}\n\n/**\n * The rows of one level, keyed by node id. `For` keys by reference, so it would rebuild every row (and drop\n * the focus in it) whenever the caller hands in new objects for the same nodes. It is given the ids instead:\n * equal strings are the same row, and a row reads its item from the current data.\n */\nfunction TreeNodes(props: { items: ITreeNodeItem[]; path: string; wrap?: boolean }): JSX.Element {\n  const entries = createMemo<TreeEntry[]>(() =>\n    props.items.map((item, idx) => {\n      const path = props.path === \"\" ? `${idx}` : `${props.path}.${idx}`;\n      return { id: item.id ?? path, item, path };\n    })\n  );\n  const byId = createMemo(() => new Map(entries().map((entry) => [entry.id, entry])));\n  const ids = createMemo(() => entries().map((entry) => entry.id));\n\n  return (\n    <For each={ids()}>\n      {(id) => {\n        // A removed row is disposed after the lookup recomputes, so keep the last entry for that pass.\n        let last = byId().get(id)!;\n        const entry = (): TreeEntry => (last = byId().get(id) ?? last);\n        return props.wrap ? (\n          <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n            <TreeNode entry={entry} />\n          </div>\n        ) : (\n          <TreeNode entry={entry} />\n        );\n      }}\n    </For>\n  );\n}\n\nfunction TreeNode(props: { entry: Accessor<TreeEntry> }): JSX.Element {\n  const ctx = useContext(TreeContext)!;\n  // The id is the row's identity and never changes while the row lives.\n  const nodeId = props.entry().id;\n  const item = (): ITreeNodeItem => props.entry().item;\n  // Names the treeitem: its own content would drag the actions and the checkbox into the node's name.\n  const labelId = `${createUniqueId()}-label`;\n  // What the caller's renderers see. Held by value, not by identity, so a refetch that hands in new\n  // objects for the same nodes does not rebuild the slots below (see sameItem).\n  const slotItem = createMemo(() => item(), undefined, { equals: sameItem });\n  const labelSlot = createMemo<JSX.Element>(() =>\n    ctx.renderLabel ? ctx.renderLabel(slotItem(), nodeId) : slotItem().label\n  );\n  const resolvedChildren = (): ITreeNodeItem[] | undefined => item().children ?? ctx.loadedChildren()[nodeId];\n  const isLazy = (): boolean => ctx.hasLoader && (!!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 toggleNode = (): void => {\n    if (!isOpen()) ctx.ensureLoaded(item(), nodeId);\n    ctx.toggleExpanded(nodeId);\n  };\n\n  const activateRow = (): void => {\n    if (ctx.toggleOnRowClick && hasChildNodes()) toggleNode();\n    if (ctx.selectable) ctx.toggleSelected(nodeId);\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    // Keys from controls a custom label draws are theirs.\n    if (event.target !== event.currentTarget) return;\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      activateRow();\n    } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n      ctx.ensureLoaded(item(), nodeId);\n      ctx.setOpen(nodeId, true);\n    } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n      ctx.setOpen(nodeId, false);\n    }\n  };\n\n  const onContentClick: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    if (isOwnClick(event)) activateRow();\n  };\n\n  return (\n    <div\n      class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n      role=\"treeitem\"\n      aria-labelledby={labelId}\n      aria-expanded={hasChildNodes() ? isOpen() : undefined}\n      aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n    >\n      <div class=\"smwb-tree__node__row\">\n        {/*\n          A pointer shortcut: the keyboard expands with ArrowRight/ArrowLeft on the row, so the chevron is\n          decorative, unnamed and no Tab stop. If it ever becomes a real <button>, `aria-hidden` must go with\n          it (a focusable element inside `aria-hidden` is an ARIA violation) and it then needs a name plus\n          `aria-expanded`.\n        */}\n        <span class=\"smwb-tree__node__toggle\" aria-hidden=\"true\" onClick={() => hasChildNodes() && toggleNode()}>\n          <Show when={hasChildNodes()}>\n            <Icon name={isOpen() ? \"expand_more\" : \"chevron_right\"} size={20} />\n          </Show>\n        </span>\n        <Show when={ctx.checkboxes}>\n          <input\n            type=\"checkbox\"\n            class=\"smwb-tree__node__checkbox\"\n            checked={isSelected()}\n            onChange={() => ctx.toggleSelected(nodeId)}\n            aria-label={item().label}\n          />\n        </Show>\n        <span class=\"smwb-tree__node__content\" onClick={onContentClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n          <span class=\"smwb-tree__node__label\" id={labelId}>\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            {labelSlot()}\n          </span>\n        </span>\n        <Show when={ctx.renderActions}>\n          {(renderActions) => {\n            // Created inside the branch that draws it, so SSR and hydration agree on which keys exist.\n            const actionsSlot = createMemo<JSX.Element>(() => renderActions()(slotItem(), nodeId));\n            return <span class=\"smwb-tree__node__actions\">{actionsSlot()}</span>;\n          }}\n        </Show>\n      </div>\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                {ctx.loadingText}\n              </div>\n            }\n          >\n            <TreeNodes items={resolvedChildren() ?? []} path={props.entry().path} />\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      loadingText: \"Loading…\",\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    \"toggleOnRowClick\",\n    \"renderLabel\",\n    \"renderActions\",\n    \"loadingText\",\n    \"loadChildren\",\n    \"ref\",\n    \"data-testid\",\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 toggleOnRowClick() {\n      return local.toggleOnRowClick ?? !local.selectable;\n    },\n    get loadingText() {\n      return local.loadingText;\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 renderActions() {\n      return local.renderActions;\n    },\n    get hasLoader() {\n      return !!local.loadChildren;\n    },\n  };\n\n  return (\n    <TreeContext.Provider value={contextValue}>\n      <div\n        {...rest}\n        data-testid={local[\"data-testid\"] ?? \"tree-view\"}\n        ref={mergeRefs(local.ref)}\n        role=\"tree\"\n        class={cn(\"smwb-tree\", local.class)}\n      >\n        <TreeNodes items={local.data} path=\"\" wrap />\n      </div>\n    </TreeContext.Provider>\n  );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","sameItem","a","b","id","label","hasChildren","left","children","right","length","every","child","idx","other","TreeNodes","props","entries","createMemo","items","map","item","path","byId","Map","entry","ids","_$createComponent","For","each","last","get","wrap","_el$","_tmpl$","_$insert","TreeNode","ctx","useContext","nodeId","labelId","createUniqueId","slotItem","undefined","equals","labelSlot","renderLabel","resolvedChildren","loadedChildren","isLazy","hasLoader","hasChildNodes","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","toggleNode","ensureLoaded","toggleExpanded","activateRow","toggleOnRowClick","selectable","toggleSelected","onKeyDown","event","target","currentTarget","key","preventDefault","setOpen","onContentClick","isOwnClick","_el$2","_tmpl$4","_el$3","firstChild","_el$4","_el$6","nextSibling","_el$7","_$setAttribute","$$click","Show","when","Icon","name","size","checkboxes","_el$5","_tmpl$2","addEventListener","_$effect","checked","$$keydown","fallback","listIcon","_$memo","nodeIcon","opened","closed","fill","renderActions","actionsSlot","_el$9","_tmpl$5","_el$8","_tmpl$3","_el$0","_tmpl$6","loadingText","_p$","_v$","cn","_v$2","_v$3","e","_$className","t","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$1","_tmpl$7","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","_$delegateEvents"],"mappings":"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"}
+{"version":3,"file":"treeView.js","sources":["../../../../src/components/dataDisplay/treeView/treeView.tsx"],"sourcesContent":["import {\n  type Accessor,\n  type JSX,\n  For,\n  Show,\n  createContext,\n  createMemo,\n  createSignal,\n  createUniqueId,\n  mergeProps,\n  splitProps,\n  useContext,\n} from \"solid-js\";\nimport cn from \"clsx\";\nimport { Icon } from \"../../base/icon\";\nimport { createControllableState } from \"../../../primitives/createControllableState\";\nimport { mergeRefs, type Ref } from \"../../../primitives/mergeRefs\";\nimport { isOwnClick } from \"../../../utils/ownClick\";\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  /**\n   * Icons of the nodes that have children, by state; `{ closed: \"folder\", opened: \"folder_open\" }` unless given.\n   * `false` draws none, and the label starts where the icon did.\n   */\n  nodeIcon?: { opened?: string; closed?: string } | false;\n  /** Icon of a node without children; \"draft\" unless given. `false` draws none. */\n  listIcon?: string | false;\n  /**\n   * Compact look: the row is as tall as the small control (`--smui-control-h-sm`, 32px) instead of the medium one\n   * (40px), and a level steps 16px (`@treeViewIndentDense`) instead of 40px. A tree with `--smwb-tree-row-h` or\n   * `--smwb-tree-indent` set on it (the `style` prop) takes those values, e.g. a 26px row.\n   */\n  dense?: boolean;\n  /**\n   * Whether the vertical lines and corners that join a node to its parent are drawn. They are by default; turning\n   * them off leaves the levels where they were.\n   */\n  guides?: boolean;\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  /**\n   * Enables row selection: a click, Enter or Space on a row toggles its selection. The chevron and the\n   * Left/Right keys never change it.\n   */\n  selectable?: boolean;\n  /** Renders a checkbox per node bound to selection. */\n  checkboxes?: boolean;\n  /**\n   * Whether a click, Enter or Space on a row also expands or collapses its children. The chevron and the\n   * Right/Left keys always do. Defaults to `true` while the tree is not `selectable` (a row has nothing else to\n   * do) and to `false` otherwise, so that selecting a row leaves it open or closed.\n   */\n  toggleOnRowClick?: boolean;\n  /** Custom node renderer. */\n  renderLabel?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  /**\n   * Per-node actions (buttons, a menu trigger), drawn at the end of the row. They sit beside the row's\n   * button, not inside it, so they take their own clicks, Enter and Space, focus and accessible names.\n   */\n  renderActions?: (item: ITreeNodeItem, nodeId: string) => JSX.Element;\n  /** Text shown while `loadChildren` is pending; \"Loading…\" unless given. */\n  loadingText?: string;\n  /** Lazily resolves children the first time a node is expanded. */\n  loadChildren?: (item: ITreeNodeItem, nodeId: string) => Promise<ITreeNodeItem[]>;\n  /** Test id of the root `<div>`; `tree-view` unless given. */\n  \"data-testid\"?: string | undefined;\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  toggleOnRowClick: boolean;\n  loadingText: string;\n  nodeIcon: { opened?: string; closed?: string } | false;\n  listIcon: string | false;\n  renderLabel: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  renderActions: ((item: ITreeNodeItem, nodeId: string) => JSX.Element) | undefined;\n  hasLoader: boolean;\n}\n\nconst TreeContext = createContext<TreeContextValue>();\n\ninterface TreeEntry {\n  id: string;\n  item: ITreeNodeItem;\n  path: string;\n}\n\n/**\n * Whether two items are the same as far as a row's own markup goes. A caller that refetches hands the tree\n * brand-new objects for the same nodes, and comparing those by identity would rebuild the `renderLabel` /\n * `renderActions` output on every refetch: Solid replaces a dynamic child, so the elements the caller drew\n * (and the focus in them, an open menu anchored to one, a caret) would be thrown away while the row around\n * them survives. Children are compared one level deep — a row draws that it has them, not their subtrees.\n */\nfunction sameItem(a: ITreeNodeItem, b: ITreeNodeItem): boolean {\n  if (a === b) return true;\n  if (a.id !== b.id || a.label !== b.label || a.hasChildren !== b.hasChildren) return false;\n  const left = a.children;\n  const right = b.children;\n  if (left === right) return true;\n  if (!left || !right || left.length !== right.length) return false;\n  return left.every((child, idx) => {\n    const other = right[idx];\n    return !!other && child.id === other.id && child.label === other.label && child.hasChildren === other.hasChildren;\n  });\n}\n\n/**\n * The rows of one level, keyed by node id. `For` keys by reference, so it would rebuild every row (and drop\n * the focus in it) whenever the caller hands in new objects for the same nodes. It is given the ids instead:\n * equal strings are the same row, and a row reads its item from the current data.\n */\nfunction TreeNodes(props: { items: ITreeNodeItem[]; path: string; wrap?: boolean }): JSX.Element {\n  const entries = createMemo<TreeEntry[]>(() =>\n    props.items.map((item, idx) => {\n      const path = props.path === \"\" ? `${idx}` : `${props.path}.${idx}`;\n      return { id: item.id ?? path, item, path };\n    })\n  );\n  const byId = createMemo(() => new Map(entries().map((entry) => [entry.id, entry])));\n  const ids = createMemo(() => entries().map((entry) => entry.id));\n\n  return (\n    <For each={ids()}>\n      {(id) => {\n        // A removed row is disposed after the lookup recomputes, so keep the last entry for that pass.\n        let last = byId().get(id)!;\n        const entry = (): TreeEntry => (last = byId().get(id) ?? last);\n        return props.wrap ? (\n          <div class=\"smwb-tree__wrapper\" role=\"presentation\">\n            <TreeNode entry={entry} />\n          </div>\n        ) : (\n          <TreeNode entry={entry} />\n        );\n      }}\n    </For>\n  );\n}\n\nfunction TreeNode(props: { entry: Accessor<TreeEntry> }): JSX.Element {\n  const ctx = useContext(TreeContext)!;\n  // The id is the row's identity and never changes while the row lives.\n  const nodeId = props.entry().id;\n  const item = (): ITreeNodeItem => props.entry().item;\n  // Names the treeitem: its own content would drag the actions and the checkbox into the node's name.\n  const labelId = `${createUniqueId()}-label`;\n  // What the caller's renderers see. Held by value, not by identity, so a refetch that hands in new\n  // objects for the same nodes does not rebuild the slots below (see sameItem).\n  const slotItem = createMemo(() => item(), undefined, { equals: sameItem });\n  const labelSlot = createMemo<JSX.Element>(() =>\n    ctx.renderLabel ? ctx.renderLabel(slotItem(), nodeId) : slotItem().label\n  );\n  const resolvedChildren = (): ITreeNodeItem[] | undefined => item().children ?? ctx.loadedChildren()[nodeId];\n  const isLazy = (): boolean => ctx.hasLoader && (!!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  // The names of the node's icon and of the leaf's, `undefined` when `nodeIcon` / `listIcon` is `false`.\n  const nodeIconName = (): string | undefined => {\n    const icons = ctx.nodeIcon;\n    if (icons === false) return undefined;\n    return isOpen() ? (icons.opened ?? \"folder_open\") : (icons.closed ?? \"folder\");\n  };\n  const listIconName = (): string | undefined => (ctx.listIcon === false ? undefined : ctx.listIcon);\n\n  const toggleNode = (): void => {\n    if (!isOpen()) ctx.ensureLoaded(item(), nodeId);\n    ctx.toggleExpanded(nodeId);\n  };\n\n  const activateRow = (): void => {\n    if (ctx.toggleOnRowClick && hasChildNodes()) toggleNode();\n    if (ctx.selectable) ctx.toggleSelected(nodeId);\n  };\n\n  const onKeyDown: JSX.EventHandler<HTMLSpanElement, KeyboardEvent> = (event) => {\n    // Keys from controls a custom label draws are theirs.\n    if (event.target !== event.currentTarget) return;\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      activateRow();\n    } else if (event.key === \"ArrowRight\" && hasChildNodes()) {\n      ctx.ensureLoaded(item(), nodeId);\n      ctx.setOpen(nodeId, true);\n    } else if (event.key === \"ArrowLeft\" && hasChildNodes()) {\n      ctx.setOpen(nodeId, false);\n    }\n  };\n\n  const onContentClick: JSX.EventHandler<HTMLSpanElement, MouseEvent> = (event) => {\n    if (isOwnClick(event)) activateRow();\n  };\n\n  return (\n    <div\n      class={cn(\"smwb-tree__node\", { \"smwb-tree__node_selected\": isSelected() })}\n      role=\"treeitem\"\n      aria-labelledby={labelId}\n      aria-expanded={hasChildNodes() ? isOpen() : undefined}\n      aria-selected={ctx.selectable || ctx.checkboxes ? isSelected() : undefined}\n    >\n      <div class=\"smwb-tree__node__row\">\n        {/*\n          A pointer shortcut: the keyboard expands with ArrowRight/ArrowLeft on the row, so the chevron is\n          decorative, unnamed and no Tab stop. If it ever becomes a real <button>, `aria-hidden` must go with\n          it (a focusable element inside `aria-hidden` is an ARIA violation) and it then needs a name plus\n          `aria-expanded`.\n        */}\n        <span class=\"smwb-tree__node__toggle\" aria-hidden=\"true\" onClick={() => hasChildNodes() && toggleNode()}>\n          <Show when={hasChildNodes()}>\n            <Icon name={isOpen() ? \"expand_more\" : \"chevron_right\"} size={20} />\n          </Show>\n        </span>\n        <Show when={ctx.checkboxes}>\n          <input\n            type=\"checkbox\"\n            class=\"smwb-tree__node__checkbox\"\n            checked={isSelected()}\n            onChange={() => ctx.toggleSelected(nodeId)}\n            aria-label={item().label}\n          />\n        </Show>\n        <span class=\"smwb-tree__node__content\" onClick={onContentClick} onKeyDown={onKeyDown} tabindex={0} role=\"button\">\n          <span class=\"smwb-tree__node__label\" id={labelId}>\n            <Show\n              when={hasChildNodes()}\n              fallback={<Show when={listIconName()}>{(name) => <Icon name={name()} size={20} />}</Show>}\n            >\n              <Show when={nodeIconName()}>{(name) => <Icon name={name()} fill={1} size={20} />}</Show>\n            </Show>\n            {labelSlot()}\n          </span>\n        </span>\n        <Show when={ctx.renderActions}>\n          {(renderActions) => {\n            // Created inside the branch that draws it, so SSR and hydration agree on which keys exist.\n            const actionsSlot = createMemo<JSX.Element>(() => renderActions()(slotItem(), nodeId));\n            return <span class=\"smwb-tree__node__actions\">{actionsSlot()}</span>;\n          }}\n        </Show>\n      </div>\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                {ctx.loadingText}\n              </div>\n            }\n          >\n            <TreeNodes items={resolvedChildren() ?? []} path={props.entry().path} />\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\" as string | false,\n      nodeIcon: { closed: \"folder\", opened: \"folder_open\" } as { opened?: string; closed?: string } | false,\n      dense: false,\n      guides: true,\n      data: [] as ITreeNodeItem[],\n      defaultExpanded: [] as string[],\n      defaultSelected: [] as string[],\n      selectable: false,\n      checkboxes: false,\n      loadingText: \"Loading…\",\n    },\n    props\n  );\n  const [local, rest] = splitProps(merged, [\n    \"class\",\n    \"listIcon\",\n    \"nodeIcon\",\n    \"dense\",\n    \"guides\",\n    \"data\",\n    \"expanded\",\n    \"defaultExpanded\",\n    \"onExpandedChange\",\n    \"selected\",\n    \"defaultSelected\",\n    \"onSelectedChange\",\n    \"selectable\",\n    \"checkboxes\",\n    \"toggleOnRowClick\",\n    \"renderLabel\",\n    \"renderActions\",\n    \"loadingText\",\n    \"loadChildren\",\n    \"ref\",\n    \"data-testid\",\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 toggleOnRowClick() {\n      return local.toggleOnRowClick ?? !local.selectable;\n    },\n    get loadingText() {\n      return local.loadingText;\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 renderActions() {\n      return local.renderActions;\n    },\n    get hasLoader() {\n      return !!local.loadChildren;\n    },\n  };\n\n  return (\n    <TreeContext.Provider value={contextValue}>\n      <div\n        {...rest}\n        data-testid={local[\"data-testid\"] ?? \"tree-view\"}\n        ref={mergeRefs(local.ref)}\n        role=\"tree\"\n        class={cn(\"smwb-tree\", { \"smwb-tree_dense\": local.dense, \"smwb-tree_no-guides\": !local.guides }, local.class)}\n      >\n        <TreeNodes items={local.data} path=\"\" wrap />\n      </div>\n    </TreeContext.Provider>\n  );\n}\n\nexport default TreeView;\n"],"names":["TreeContext","createContext","sameItem","a","b","id","label","hasChildren","left","children","right","length","every","child","idx","other","TreeNodes","props","entries","createMemo","items","map","item","path","byId","Map","entry","ids","_$createComponent","For","each","last","get","wrap","_el$","_tmpl$","_$insert","TreeNode","ctx","useContext","nodeId","labelId","createUniqueId","slotItem","undefined","equals","labelSlot","renderLabel","resolvedChildren","loadedChildren","isLazy","hasLoader","hasChildNodes","isOpen","expandedIds","includes","isSelected","selectedIds","isLoading","loadingIds","nodeIconName","icons","nodeIcon","opened","closed","listIconName","listIcon","toggleNode","ensureLoaded","toggleExpanded","activateRow","toggleOnRowClick","selectable","toggleSelected","onKeyDown","event","target","currentTarget","key","preventDefault","setOpen","onContentClick","isOwnClick","_el$2","_tmpl$4","_el$3","firstChild","_el$4","_el$6","nextSibling","_el$7","_$setAttribute","$$click","Show","when","Icon","name","size","checkboxes","_el$5","_tmpl$2","addEventListener","_$effect","checked","$$keydown","fallback","fill","renderActions","actionsSlot","_el$9","_tmpl$5","_$memo","_el$8","_tmpl$3","_el$0","_tmpl$6","loadingText","_p$","_v$","cn","_v$2","_v$3","e","_$className","t","TreeView","merged","mergeProps","dense","guides","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$1","_tmpl$7","_ref$","mergeRefs","ref","_$use","_$spread","_$mergeProps","class","_$delegateEvents"],"mappings":"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"}

package/dist/components/inputs/button/button.d.ts

@@ -10,6 +10,13 @@ export interface ButtonProps extends JSX.HTMLAttributes<HTMLButtonElement | HTML
     size?: "small" | "medium" | "large";
     /** Icon as an element (e.g. <Icon/>) or a string (icon name / url / base64). */
     icon?: JSX.Element | string;
+    /**
+     * Icon-only button: a square of its size's control height (`--smui-control-h-sm/md/lg`), with no
+     * `min-width` and no padding. Works for every `variant` and for a link (`href`). It has no text, so its
+     * name comes from `aria-label` (or `aria-labelledby`); without one the component warns in the console.
+     * Apart from `fullWidth`: a square does not stretch.
+     */
+    iconOnly?: boolean;
     /** Props forwarded to the <Icon/> when `icon` is a string. */
     iconProps?: Omit<IconProps, "name">;
     /** @deprecated use `color`. Kept for backward compatibility. */