@box/combobox-with-api 0.36.7 → 0.37.0

package/dist/chunks/dynamic-loading-tree.js

@@ -1,10 +1,10 @@
 import { LoadingIndicator as H } from "@box/blueprint-web";
 import { Tree as J } from "@box/tree";
-import { useReducer as K, useState as L, useMemo as Q, useCallback as y, useEffect as T } from "react";
+import { useReducer as K, useState as L, useMemo as Q, useCallback as b, useEffect as T } from "react";
 import { getServiceNode as R, RootTreeNode as i, hasValidLevel as X } from "../esm/lib/components/combobox-with-api-tree-view/tree-utils.js";
 import { t as Y, i as Z, A as o } from "./treeReducer.js";
 import { jsxs as $, jsx as S } from "react/jsx-runtime";
-import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F = "_disabled_z81ug_12", ee = "_label_z81ug_15", ae = "_hiddenLabel_z81ug_27", te = "_comboboxContainer_z81ug_30", le = "_withComboboxButtons_z81ug_46", ne = "_error_z81ug_54", oe = "_textInputWrapper_z81ug_62", se = "_textInput_z81ug_62", ie = "_errorIcon_z81ug_84", re = "_comboboxButtons_z81ug_87", de = "_withChips_z81ug_94", ce = "_inlineError_z81ug_104", ue = "_popover_z81ug_108", pe = "_option_z81ug_134", me = "_indicator_z81ug_157", _e = "_indicatorIcon_z81ug_166", ye = "_optionWithIndicator_z81ug_169", be = "_loadingIndicator_z81ug_172", ge = "_noResultOption_z81ug_175", E = {
+import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F = "_disabled_z81ug_12", ee = "_label_z81ug_15", ae = "_hiddenLabel_z81ug_27", te = "_comboboxContainer_z81ug_30", le = "_withComboboxButtons_z81ug_46", ne = "_error_z81ug_54", oe = "_textInputWrapper_z81ug_62", se = "_textInput_z81ug_62", ie = "_errorIcon_z81ug_84", re = "_comboboxButtons_z81ug_87", de = "_withChips_z81ug_94", ce = "_inlineError_z81ug_104", ue = "_popover_z81ug_108", pe = "_option_z81ug_134", me = "_indicator_z81ug_157", _e = "_indicatorIcon_z81ug_166", be = "_optionWithIndicator_z81ug_169", ye = "_loadingIndicator_z81ug_172", ge = "_noResultOption_z81ug_175", E = {
   container: P,
   disabled: F,
   label: ee,
@@ -22,8 +22,8 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
   option: pe,
   indicator: me,
   indicatorIcon: _e,
-  optionWithIndicator: ye,
-  loadingIndicator: be,
+  optionWithIndicator: be,
+  loadingIndicator: ye,
   noResultOption: ge
 }, Ee = ({
   ariaLabel: k,
@@ -38,10 +38,10 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
   noResultMessage: w,
   loadingAriaLabel: B
 }) => {
-  const [m, l] = K(Y, Z), [b, W] = L({
+  const [m, l] = K(Y, Z), [y, W] = L({
     nodes: [],
     selectedIds: []
-  }), [I, g] = L(!1), v = Q(() => Math.max(...h), [h]), A = y((a = m) => {
+  }), [I, g] = L(!1), v = Q(() => Math.max(...h), [h]), A = b((a = m) => {
     const t = [];
     return [...Object.values(a).map((e) => {
       const r = [...e.children], {
@@ -60,14 +60,14 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
       let c;
       return e.children.length && e.status === "loading" && (c = R(s.id, s.metadata.displayValue, "loading")), e.status === "error" && (c = R(s.id, s.metadata.displayValue, "reload")), e.status === "success" && e.marker && (c = R(s.id, s.metadata.displayValue, "loadMore")), c && (t.push(c), s.children.push(c.id)), s;
     }), ...t];
-  }, [m]), D = y((a) => {
+  }, [m]), D = b((a) => {
     var r;
     const t = (r = a.ancestors) == null ? void 0 : r.find((n) => n.level === a.level - 1), d = O.find((n) => n.level === a.level);
     return a.level === 1 || u === "" ? a.displayValue : {
       labelName: d.displayName,
       labelValue: t.displayName
     };
-  }, [O, u]), _ = y((a) => ({
+  }, [O, u]), _ = b((a) => ({
     id: a.value,
     name: a.displayValue,
     parent: i.id,
@@ -107,7 +107,7 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
       onlySelectableOptions: !1,
       ancestorId: null
     }).then((t) => {
-      const d = t.options.map((e) => {
+      const d = t.options.filter((e) => e.selectable).map((e) => {
         const {
           labelName: r,
           labelValue: n
@@ -193,7 +193,7 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
       }), g(!1);
     }));
   }, [p, _, x, u, O, v, D]);
-  const U = y((a) => {
+  const U = b((a) => {
     const {
       isExpanded: t,
       isDisabled: d,
@@ -247,7 +247,7 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
         }
       });
     });
-  }, [p, _]), j = y((a) => {
+  }, [p, _]), j = b((a) => {
     const t = m[a], {
       level: d
     } = t.metadata, {
@@ -287,7 +287,7 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
         }
       });
     });
-  }, [p, _, u, m]), M = b.nodes.length === 0 || b.nodes[0].children.length === 0 && b.nodes[0].id === i.id, q = y((a) => {
+  }, [p, _, u, m]), M = y.nodes.length === 0 || y.nodes[0].children.length === 0 && y.nodes[0].id === i.id, q = b((a) => {
     const {
       metadata: t
     } = a.element;
@@ -305,12 +305,12 @@ import '../styles/dynamic-loading-tree.css';const P = "_container_z81ug_1", F =
       children: w
     }) : !I && /* @__PURE__ */ S(J, {
       "aria-label": k,
-      data: b.nodes,
+      data: y.nodes,
       multiSelect: V,
       onExpand: U,
       onLoadData: j,
       onNodeSelect: q,
-      selectedIds: b.selectedIds,
+      selectedIds: y.selectedIds,
       size: "large",
       togglableSelect: !0
     })]

package/dist/esm/lib/components/combobox-with-api-tree-view/index.js

@@ -1,5 +1,5 @@
 import { ComboboxWithApiTreeView as I } from "./combobox-with-api-tree-view.js";
-const u = [
+const m = [
   // Level 1
   {
     id: "japan-l1-id",
@@ -394,7 +394,7 @@ const u = [
     ancestorId: n,
     marker: o,
     failOnLoadMore: N,
-    options: v = u,
+    options: v = m,
     failOnLoadMoreTimes: b = Number.MAX_SAFE_INTEGER,
     failOnLoadLevel: g,
     failOnLoadLevelTimes: k = Number.MAX_SAFE_INTEGER
@@ -406,21 +406,21 @@ const u = [
     if (s === g && e < k)
       return e += 1, Promise.reject();
     a && await new Promise((r) => setTimeout(r, a));
-    const m = v.filter((r) => {
+    const c = v.filter((r) => {
       const {
         displayName: h,
-        level: c,
+        level: u,
         ancestors: p
       } = {
         ...r
       };
       let d = !0;
-      return s && c && c !== s && (d = !1), t && (d = d && h.toLowerCase().includes(t.toLowerCase())), n && (d = d && (p == null ? void 0 : p.some(({
+      return s && u && u !== s && (d = !1), t && (d = d && h.toLowerCase().includes(t.toLowerCase())), n && (d = d && (p == null ? void 0 : p.some(({
         id: S
       }) => S === n))), d;
     }), f = Promise.resolve({
-      marker: U(o, m),
-      options: j(o, m)
+      marker: U(o, c),
+      options: j(o, c)
     });
     return w(await f);
   };
@@ -443,7 +443,7 @@ function w(l) {
   };
 }
 const J = (l) => {
-  const e = u.find((a) => a.displayName === l);
+  const e = m.find((a) => a.displayName === l);
   return e ? {
     value: e.id,
     displayValue: e.displayName,
@@ -452,9 +452,13 @@ const J = (l) => {
     ancestors: e.ancestors
   } : null;
 };
+m.map((l) => ({
+  ...l,
+  selectable: l.level === 2
+}));
 export {
   I as ComboboxWithApiTreeView,
-  u as apiResponse,
+  m as apiResponse,
   J as findNode,
   x as mockTreeFetcher
 };

package/dist/i18n/en-x-pseudo.js

@@ -1,10 +1,10 @@
 export default {
-  "comboboxWithApi.apiError": "⟦萬萬萬萬萬萬萬萬萬萬萬萬 Ćοùļďл'ţ ļοâď гěŝůľτś. Ćĺïсķ τô τѓŷ ăğâїń. 國國國國國國國國國國國國⟧",
-  "comboboxWithApiPagination.clearButtonAriaLabel": "⟦萬萬萬萬萬萬萬 Çĺēåř íπΡцτ äпď ѕēļє¢τīòń 國國國國國國國⟧",
-  "comboboxWithApiPagination.errorAction": "⟦萬 Γèľőâď 國⟧",
-  "comboboxWithApiPagination.errorIconLabel": "⟦萬 Ёřґοř 國⟧",
-  "comboboxWithApiPagination.errorMessage": "⟦萬萬萬萬萬萬 ₣άįľëď ťő ĺòåď öΡťìóηѕ 國國國國國國⟧",
-  "comboboxWithApiPagination.loadingAriaLabel": "⟦萬萬 Ŀóãďîňġ... 國國⟧",
-  "comboboxWithApiPagination.loadingMoreAriaLabel": "⟦萬萬萬萬 Ľōąďιʼnġ móŗε... 國國國國⟧",
-  "comboboxWithApiPagination.noResults": "⟦萬萬萬萬 Иō ґèśůľτѕ ƒόûŋď 國國國國⟧"
+  "comboboxWithApi.apiError": "⟦萬萬萬萬萬萬萬萬萬萬萬萬 Ĉőüĺďπ'ţ ļŏάď ѓêśûļŧş. Çľїċκ ŧø ťřγ ăğǻîл. 國國國國國國國國國國國國⟧",
+  "comboboxWithApiPagination.clearButtonAriaLabel": "⟦萬萬萬萬萬萬萬 Ĉľēåŕ їйΡũţ αлď śęľëćťϊоп 國國國國國國國⟧",
+  "comboboxWithApiPagination.errorAction": "⟦萬 Ŗëĺòâď 國⟧",
+  "comboboxWithApiPagination.errorIconLabel": "⟦萬 Σґгóг 國⟧",
+  "comboboxWithApiPagination.errorMessage": "⟦萬萬萬萬萬萬 ₣ǻĭľέď ŧо ľőáď óΡŧіőňś 國國國國國國⟧",
+  "comboboxWithApiPagination.loadingAriaLabel": "⟦萬萬 Ļõąďϊʼnğ... 國國⟧",
+  "comboboxWithApiPagination.loadingMoreAriaLabel": "⟦萬萬萬萬 Ŀöâďĩηğ möŕе... 國國國國⟧",
+  "comboboxWithApiPagination.noResults": "⟦萬萬萬萬 Йõ ґεѕüļŧş ƒοùпď 國國國國⟧"
 }

package/dist/i18n/en-x-pseudo.properties

@@ -1,16 +1,16 @@
 # Error message displayed as combobox item when an API failed and the suggestions could not load
-comboboxWithApi.apiError = ⟦萬萬萬萬萬萬萬萬萬萬萬萬 Ćοùļďл'ţ ļοâď гěŝůľτś. Ćĺïсķ τô τѓŷ ăğâїń. 國國國國國國國國國國國國⟧
+comboboxWithApi.apiError = ⟦萬萬萬萬萬萬萬萬萬萬萬萬 Ĉőüĺďπ'ţ ļŏάď ѓêśûļŧş. Çľїċκ ŧø ťřγ ăğǻîл. 國國國國國國國國國國國國⟧
 # Aria label for the clear button visible at the end of the combobox. When clicked, it will clear all text in the input, as well as the current selection.
-comboboxWithApiPagination.clearButtonAriaLabel = ⟦萬萬萬萬萬萬萬 Çĺēåř íπΡцτ äпď ѕēļє¢τīòń 國國國國國國國⟧
+comboboxWithApiPagination.clearButtonAriaLabel = ⟦萬萬萬萬萬萬萬 Ĉľēåŕ їйΡũţ αлď śęľëćťϊоп 國國國國國國國⟧
 # Error message displayed resembling button that calls to action to reload the results
-comboboxWithApiPagination.errorAction = ⟦萬 Γèľőâď 國⟧
+comboboxWithApiPagination.errorAction = ⟦萬 Ŗëĺòâď 國⟧
 # Aria-label text for the error icon in the loading results error message
-comboboxWithApiPagination.errorIconLabel = ⟦萬 Ёřґοř 國⟧
+comboboxWithApiPagination.errorIconLabel = ⟦萬 Σґгóг 國⟧
 # Error message displayed as inline notice that informs the user that the options failed to load
-comboboxWithApiPagination.errorMessage = ⟦萬萬萬萬萬萬 ₣άįľëď ťő ĺòåď öΡťìóηѕ 國國國國國國⟧
+comboboxWithApiPagination.errorMessage = ⟦萬萬萬萬萬萬 ₣ǻĭľέď ŧо ľőáď óΡŧіőňś 國國國國國國⟧
 # Visually hidden aria-label text for the loading spinner
-comboboxWithApiPagination.loadingAriaLabel = ⟦萬萬 Ŀóãďîňġ... 國國⟧
+comboboxWithApiPagination.loadingAriaLabel = ⟦萬萬 Ļõąďϊʼnğ... 國國⟧
 # Visually hidden aria-label text for the loading spinner show when loading more results from infinite scrolling list
-comboboxWithApiPagination.loadingMoreAriaLabel = ⟦萬萬萬萬 Ľōąďιʼnġ móŗε... 國國國國⟧
+comboboxWithApiPagination.loadingMoreAriaLabel = ⟦萬萬萬萬 Ŀöâďĩηğ möŕе... 國國國國⟧
 # Message displayed when no results are found in the combobox
-comboboxWithApiPagination.noResults = ⟦萬萬萬萬 Иō ґèśůľτѕ ƒόûŋď 國國國國⟧
+comboboxWithApiPagination.noResults = ⟦萬萬萬萬 Йõ ґεѕüļŧş ƒοùпď 國國國國⟧

package/dist/types/lib/components/combobox-with-api-tree-view/stories/shared.d.ts

@@ -24,3 +24,14 @@ export declare const mockTreeFetcher: ({ delay, signal, level, searchInput, ance
 export declare const findNode: (name: string) => TreeOptionType;
 export declare const mockRejectedFetcher: ({ delay }: MockFetcherProps) => Promise<FetcherResponse<TreeOptionType>>;
 export { mockTreeFetcher as mockFetcher };
+export declare const onlyLevelTwoSelectableOptions: {
+    selectable: boolean;
+    id: string;
+    ancestors: {
+        id: string;
+        displayName: string;
+        level: number;
+    }[];
+    displayName: string;
+    level: number;
+}[];

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/combobox-with-api",
-    "version": "0.36.7",
+    "version": "0.37.0",
     "peerDependencies": {
         "@ariakit/react": "0.4.15",
         "@box/blueprint-web": "^10.3.1",
@@ -11,7 +11,7 @@
         "react-intl": "^6.4.2"
     },
     "dependencies": {
-        "@box/tree": "^0.47.4",
+        "@box/tree": "^0.48.0",
         "react-accessible-treeview": "2.9.0"
     },
     "devDependencies": {