@box/tree 0.50.1 → 0.50.3

package/dist/esm/lib/tree.js

@@ -1,129 +1,128 @@
-import { TooltipProvider as g } from "@box/blueprint-web";
-import b from "clsx";
-import { useRef as h, useEffect as u, useCallback as w } from "react";
-import S from "react-accessible-treeview";
-import { preventDisabledNodeExpanding as E, preventLoadingContentNodeExpanding as y, serviceNodeKeyboardHandler as x, serviceNodeClickHandler as C } from "./utils.js";
+import { TooltipProvider as b, useForkRef as h } from "@box/blueprint-web";
+import R from "clsx";
+import { forwardRef as S, useRef as x, useEffect as v, useCallback as C } from "react";
+import M from "react-accessible-treeview";
+import { preventDisabledNodeExpanding as y, preventLoadingContentNodeExpanding as I, serviceNodeKeyboardHandler as T, serviceNodeClickHandler as H } from "./utils.js";
 import { jsx as t } from "react/jsx-runtime";
-import { useSelectionInheritance as R } from "./hooks/useSelectionInheritance.js";
-import { ContentNode as M } from "./components/content-node/content-node.js";
-import { ServiceNodeWrapper as v } from "./components/service-node-wrapper/service-node-wrapper.js";
-import { LoadMoreNode as H } from "./components/load-more-node/load-more-node.js";
-import { ReloadNode as T } from "./components/reload-node/reload-node.js";
-import { LoadingNode as _ } from "./components/loading-node/loading-node.js";
-import '../../styles/tree.css';const K = "_tree_17956_1", P = {
-  tree: K
-}, j = (d, s, a) => (o) => {
+import { useSelectionInheritance as _ } from "./hooks/useSelectionInheritance.js";
+import { ContentNode as K } from "./components/content-node/content-node.js";
+import { ServiceNodeWrapper as N } from "./components/service-node-wrapper/service-node-wrapper.js";
+import { LoadMoreNode as P } from "./components/load-more-node/load-more-node.js";
+import { ReloadNode as j } from "./components/reload-node/reload-node.js";
+import { LoadingNode as A } from "./components/loading-node/loading-node.js";
+import '../../styles/tree.css';const D = "_tree_17956_1", F = {
+  tree: D
+}, V = (i, s, f) => (n) => {
   const {
     element: m,
-    isDisabled: i
-  } = o, {
-    id: c,
-    metadata: f,
+    isDisabled: d
+  } = n, {
+    id: a,
+    metadata: c,
     parent: l
   } = m, {
-    variant: n
-  } = f;
-  if (n === "content" || n === "user" || n === "labeled") {
+    variant: o
+  } = c;
+  if (o === "content" || o === "user" || o === "labeled") {
     const r = {
-      ...o,
-      size: d,
+      ...n,
+      size: i,
       withIcon: s
     };
-    return /* @__PURE__ */ t(M, {
+    return /* @__PURE__ */ t(K, {
       ...r,
-      containsSelection: a.includes(c)
+      containsSelection: f.includes(a)
     });
   }
-  if (n === "loadMore") {
+  if (o === "loadMore") {
     const r = {
-      ...o,
-      size: d
+      ...n,
+      size: i
     };
-    return /* @__PURE__ */ t(v, {
-      isDisabled: i,
+    return /* @__PURE__ */ t(N, {
+      isDisabled: d,
       parentId: l,
       variant: "loadMore",
-      children: /* @__PURE__ */ t(H, {
+      children: /* @__PURE__ */ t(P, {
         ...r
       })
     });
   }
-  if (n === "reload") {
+  if (o === "reload") {
     const r = {
-      ...o,
-      size: d
+      ...n,
+      size: i
     };
-    return /* @__PURE__ */ t(v, {
-      isDisabled: i,
+    return /* @__PURE__ */ t(N, {
+      isDisabled: d,
       parentId: l,
       variant: "reload",
-      children: /* @__PURE__ */ t(T, {
+      children: /* @__PURE__ */ t(j, {
         ...r
       })
     });
   }
-  if (n === "loading") {
+  if (o === "loading") {
     const r = {
-      ...o,
-      size: d
+      ...n,
+      size: i
     };
-    return /* @__PURE__ */ t(v, {
-      isDisabled: i,
+    return /* @__PURE__ */ t(N, {
+      isDisabled: d,
       variant: "loading",
-      children: /* @__PURE__ */ t(_, {
+      children: /* @__PURE__ */ t(A, {
         ...r
       })
     });
   }
   return null;
-};
-function X({
-  "aria-label": d,
-  size: s = "small",
-  data: a,
-  withIcons: o = !1,
-  onExpand: m,
-  onSelect: i,
+}, z = /* @__PURE__ */ S(function({
+  "aria-label": s,
+  size: f = "small",
+  data: n,
+  withIcons: m = !1,
+  onExpand: d,
+  onSelect: a,
   onLoadData: c,
-  className: f,
-  multiSelect: l = !1,
-  ...n
-}) {
-  const r = h(null), {
-    selectionInheritors: I,
+  className: l,
+  multiSelect: o = !1,
+  ...r
+}, L) {
+  const u = x(null), {
+    selectionInheritors: g,
     getSelectionInheritors: p
-  } = R();
-  u(() => {
-    const e = r.current;
-    return e && (e.addEventListener("keydown", E), e.addEventListener("keydown", y)), () => {
-      e && (e.removeEventListener("keydown", E), e.removeEventListener("keydown", y));
+  } = _();
+  v(() => {
+    const e = u.current;
+    return e && (e.addEventListener("keydown", y), e.addEventListener("keydown", I)), () => {
+      e && (e.removeEventListener("keydown", y), e.removeEventListener("keydown", I));
     };
-  }), u(() => {
-    const e = r.current, N = x(c), k = C(c);
-    return e && (e.addEventListener("keydown", N), e.addEventListener("click", k)), () => {
-      e && (e.removeEventListener("keydown", N), e.removeEventListener("click", k));
+  }), v(() => {
+    const e = u.current, k = T(c), E = H(c);
+    return e && (e.addEventListener("keydown", k), e.addEventListener("click", E)), () => {
+      e && (e.removeEventListener("keydown", k), e.removeEventListener("click", E));
     };
-  }), u(() => {
-    p(a, n.selectedIds || n.defaultSelectedIds);
+  }), v(() => {
+    p(n, r.selectedIds || r.defaultSelectedIds);
   }, []);
-  const L = w((e) => {
-    p(a, Array.from(e.treeState.selectedIds)), i && i(e);
-  }, [i, a, p]);
-  return /* @__PURE__ */ t(g, {
-    children: /* @__PURE__ */ t(S, {
-      ref: r,
-      "aria-label": d,
-      className: b(P.tree, f),
-      data: a,
-      multiSelect: l,
-      nodeRenderer: j(s, o, I),
-      onExpand: m,
-      onSelect: L,
-      ...n
+  const w = C((e) => {
+    p(n, Array.from(e.treeState.selectedIds)), a && a(e);
+  }, [a, n, p]);
+  return /* @__PURE__ */ t(b, {
+    children: /* @__PURE__ */ t(M, {
+      ref: h(u, L),
+      "aria-label": s,
+      className: R(F.tree, l),
+      data: n,
+      multiSelect: o,
+      nodeRenderer: V(f, m, g),
+      onExpand: d,
+      onSelect: w,
+      ...r
     })
   });
-}
+});
 export {
-  X as Tree,
-  X as default
+  z as Tree,
+  z as default
 };

package/dist/types/lib/tree.d.ts

@@ -1,3 +1,3 @@
 import { TreeProps } from './types';
-export declare function Tree({ 'aria-label': ariaLabel, size, data, withIcons, onExpand, onSelect, onLoadData, className, multiSelect, ...restTreeProps }: TreeProps): import("react/jsx-runtime").JSX.Element;
+export declare const Tree: import('react').ForwardRefExoticComponent<TreeProps & import('react').RefAttributes<HTMLDivElement>>;
 export default Tree;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/tree",
-    "version": "0.50.1",
+    "version": "0.50.3",
     "peerDependencies": {
         "@box/blueprint-web": "^7.11.0",
         "@box/blueprint-web-assets": "^4.16.0",
@@ -11,10 +11,10 @@
         "react-intl": "^6.4.2"
     },
     "devDependencies": {
-        "@box/blueprint-web": "^12.9.3",
-        "@box/blueprint-web-assets": "^4.52.0",
-        "@box/item-icon": "^0.9.157",
-        "@box/storybook-utils": "^0.13.5",
+        "@box/blueprint-web": "^12.9.5",
+        "@box/blueprint-web-assets": "^4.53.0",
+        "@box/item-icon": "^0.9.159",
+        "@box/storybook-utils": "^0.13.6",
         "@faker-js/faker": "^8.4.1",
         "react": "^18.3.0",
         "react-dom": "^18.3.0",