@box/metadata-editor 1.15.4 → 1.17.0

package/dist/esm/lib/components/combobox-with-api-pagination/request.js

@@ -1,6 +1,6 @@
-let C = /* @__PURE__ */ function(E) {
+let C = /* @__PURE__ */ (function(E) {
   return E.NOT_STARTED = "NOT_STARTED", E.IN_PROGRESS = "IN_PROGRESS", E.ERROR = "ERROR", E.SUCCESS = "SUCCESS", E.CANCELLED = "CANCELLED", E;
-}({});
+})({});
 export {
   C as RequestStates
 };

package/dist/esm/lib/components/combobox-with-api-pagination/use-async-list.js

@@ -1,9 +1,9 @@
 import { useReducer as O } from "react";
 import { RequestStates as u } from "./request.js";
 import { isAbortError as I } from "./utils/is-abort-error.js";
-var s = /* @__PURE__ */ function(r) {
+var s = /* @__PURE__ */ (function(r) {
   return r.LOAD_MORE = "LOAD_MORE", r.RELOAD = "RELOAD", r.SEARCH = "SEARCH", r.SET_ERROR = "SET_ERROR", r.SET_LOADING = "SET_LOADING", r;
-}(s || {});
+})(s || {});
 function a(r, e) {
   switch (e.type) {
     case s.LOAD_MORE:
@@ -63,8 +63,7 @@ function m(r, e) {
   return E(r, e) || S(r, e);
 }
 function p(r, e) {
-  var t;
-  E(r, e) && e.abortController.abort(), S(r, e) && ((t = r.abortController) == null || t.abort());
+  E(r, e) && e.abortController.abort(), S(r, e) && r.abortController?.abort();
 }
 function h(r, e) {
   return S(r, e);

package/dist/esm/lib/components/combobox-with-api-pagination/utils/use-controllable-state.js

@@ -1,40 +1,37 @@
-import * as s from "react";
+import * as o from "react";
 function a(e) {
-  const n = s.useRef(e);
-  return s.useEffect(() => {
-    n.current = e;
-  }), s.useMemo(() => (...o) => {
-    var t;
-    return (t = n.current) == null ? void 0 : t.call(n, ...o);
-  }, []);
+  const c = o.useRef(e);
+  return o.useEffect(() => {
+    c.current = e;
+  }), o.useMemo(() => (...t) => c.current?.(...t), []);
 }
-function R({
+function v({
   prop: e,
-  defaultProp: n,
-  onChange: o = () => {
+  defaultProp: c,
+  onChange: t = () => {
   }
 }) {
-  const [t, c] = C({
-    defaultProp: n,
-    onChange: o
-  }), r = e !== void 0, i = r ? e : t, l = a(o), d = s.useCallback((u) => {
+  const [n, s] = R({
+    defaultProp: c,
+    onChange: t
+  }), r = e !== void 0, i = r ? e : n, l = a(t), d = o.useCallback((u) => {
     if (r) {
       const f = typeof u == "function" ? u(e) : u;
       f !== e && l(f);
     } else
-      c(u);
-  }, [r, e, c, l]);
+      s(u);
+  }, [r, e, s, l]);
   return [i, d];
 }
-function C({
+function R({
   defaultProp: e,
-  onChange: n
+  onChange: c
 }) {
-  const o = s.useState(e), [t] = o, c = s.useRef(t), r = a(n);
-  return s.useEffect(() => {
-    c.current !== t && (r(t), c.current = t);
-  }, [t, c, r]), o;
+  const t = o.useState(e), [n] = t, s = o.useRef(n), r = a(c);
+  return o.useEffect(() => {
+    s.current !== n && (r(n), s.current = n);
+  }, [n, s, r]), t;
 }
 export {
-  R as useControllableState
+  v as useControllableState
 };

package/dist/esm/lib/components/combobox-with-api-pagination/utils/use-intersection-observer.js

@@ -1,87 +1,85 @@
-import { useState as C, useRef as y, useCallback as a } from "react";
-const k = "0px", p = [0];
-function w() {
-  const o = /* @__PURE__ */ new Map();
-  function b({
-    root: c,
-    rootMargin: s,
-    threshold: u
+import { useState as y, useRef as R, useCallback as f } from "react";
+const k = "0px", g = [0];
+function C() {
+  const b = /* @__PURE__ */ new Map();
+  function a({
+    root: s,
+    rootMargin: t,
+    threshold: c
   }) {
-    let r = o.get(c);
-    r || (r = /* @__PURE__ */ new Map(), o.set(c, r));
+    let r = b.get(s);
+    r || (r = /* @__PURE__ */ new Map(), b.set(s, r));
     const i = JSON.stringify({
-      rootMargin: s,
-      threshold: u
+      rootMargin: t,
+      threshold: c
     });
-    let e = r.get(i);
-    if (!e) {
-      const n = /* @__PURE__ */ new Map();
-      e = {
-        observer: new IntersectionObserver((R) => {
-          R.forEach((v) => {
-            const t = n.get(v.target);
-            t == null || t(v);
+    let n = r.get(i);
+    if (!n) {
+      const e = /* @__PURE__ */ new Map();
+      n = {
+        observer: new IntersectionObserver((O) => {
+          O.forEach((v) => {
+            e.get(v.target)?.(v);
           });
         }, {
-          root: c,
-          rootMargin: s,
-          threshold: u
+          root: s,
+          rootMargin: t,
+          threshold: c
         }),
-        entryCallbacks: n
-      }, r.set(i, e);
+        entryCallbacks: e
+      }, r.set(i, n);
     }
     return {
-      observe: (n, l) => {
-        e == null || e.entryCallbacks.set(n, l), e == null || e.observer.observe(n);
+      observe: (e, l) => {
+        n?.entryCallbacks.set(e, l), n?.observer.observe(e);
       },
-      unobserve: (n) => {
-        e == null || e.entryCallbacks.delete(n), e == null || e.observer.unobserve(n);
+      unobserve: (e) => {
+        n?.entryCallbacks.delete(e), n?.observer.unobserve(e);
       }
     };
   }
   return {
-    getObserver: b
+    getObserver: a
   };
 }
-const M = w();
-function T(o) {
-  const b = (o == null ? void 0 : o.rootMargin) ?? k, c = (o == null ? void 0 : o.threshold) ?? p, s = y(null), u = y(null), r = y(null), [i, e] = C(), n = a(() => {
-    const t = s.current;
-    if (!t) {
-      e(void 0);
+const E = C();
+function p(b) {
+  const a = b?.rootMargin ?? k, s = b?.threshold ?? g, t = R(null), c = R(null), r = R(null), [i, n] = y(), e = f(() => {
+    const o = t.current;
+    if (!o) {
+      n(void 0);
       return;
     }
-    const f = M.getObserver({
-      root: u.current,
-      rootMargin: b,
-      threshold: c
+    const u = E.getObserver({
+      root: c.current,
+      rootMargin: a,
+      threshold: s
     });
-    f.observe(t, (E) => {
-      e(E);
-    }), r.current = f;
-  }, [b, c]), l = a(() => {
-    const t = r.current, f = s.current;
-    f && (t == null || t.unobserve(f)), r.current = null;
-  }, []), R = a((t) => {
-    l(), s.current = t, n();
-  }, [n, l]), v = a((t) => {
-    l(), u.current = t, n();
-  }, [n, l]);
-  return [R, {
+    u.observe(o, (h) => {
+      n(h);
+    }), r.current = u;
+  }, [a, s]), l = f(() => {
+    const o = r.current, u = t.current;
+    u && o?.unobserve(u), r.current = null;
+  }, []), O = f((o) => {
+    l(), t.current = o, e();
+  }, [e, l]), v = f((o) => {
+    l(), c.current = o, e();
+  }, [e, l]);
+  return [O, {
     entry: i,
     rootRef: v
   }];
 }
-function V(o) {
-  var i;
-  const [b, c] = T(o), s = !!((i = c.entry) != null && i.isIntersecting), [u, r] = C(s);
-  return s && !u && r(!0), [b, {
-    ...c,
-    isVisible: s,
-    wasEverVisible: u
+function w(b) {
+  const [a, s] = p(b), t = !!s.entry?.isIntersecting, [c, r] = y(t);
+  return t && !c && r(!0), [a, {
+    ...s,
+    isVisible: t,
+    wasEverVisible: c
   }];
 }
 export {
-  w as createObserverCache,
-  V as useTrackVisibility
+  C as createObserverCache,
+  w as useTrackVisibility
 };

package/dist/esm/lib/components/filter-instances-dropdown/filter-instances-dropdown.js

@@ -1,14 +1,14 @@
-import { TriggerButton as v, Text as C, ScrollableContainer as N, Divider as j } from "@box/blueprint-web";
+import { TriggerButton as v, Text as N, ScrollableContainer as C, Divider as j } from "@box/blueprint-web";
 import { useIntl as x } from "react-intl";
 import { SelectProvider as B, Select as b, SelectPopover as z, SelectItem as g, SelectItemCheck as I } from "@ariakit/react";
 import { Space1 as k } from "@box/blueprint-web-assets/tokens/px-tokens";
 import { useEffect as M } from "react";
 import S from "clsx";
 import { Checkmark as p } from "@box/blueprint-web-assets/icons/Fill";
-import { getVisibleTemplates as y, getTemplateDisplayName as _ } from "../../utils/utils.js";
+import { getVisibleTemplates as y, getTemplateDisplayName as u } from "../../utils/utils.js";
 import s from "./messages.js";
-import { jsxs as o, jsx as e } from "react/jsx-runtime";
-import '../../../../styles/filter-instances-dropdown.css';const D = "_details_106jz_2", w = "_triggerContainer_106jz_6", F = "_triggerButton_106jz_11", O = "_popover_106jz_17", P = "_divider_106jz_34", L = "_scrollableContainer_106jz_37", V = "_item_106jz_41", E = "_indicator_106jz_68", G = "_indicatorIcon_106jz_77", R = "_testContainer_106jz_81", t = {
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import '../../../../styles/filter-instances-dropdown.css';const D = "_details_106jz_2", w = "_triggerContainer_106jz_6", F = "_triggerButton_106jz_11", O = "_popover_106jz_17", P = "_divider_106jz_34", L = "_scrollableContainer_106jz_37", V = "_item_106jz_41", E = "_indicator_106jz_68", G = "_indicatorIcon_106jz_77", e = {
   details: D,
   triggerContainer: w,
   triggerButton: F,
@@ -17,78 +17,77 @@ import '../../../../styles/filter-instances-dropdown.css';const D = "_details_10
   scrollableContainer: L,
   item: V,
   indicator: E,
-  indicatorIcon: G,
-  testContainer: R
-}, q = parseInt(k, 10);
-function $({
-  appliedTemplates: u,
-  selectedTemplates: c,
-  setSelectedTemplates: l
+  indicatorIcon: G
+}, R = parseInt(k, 10);
+function Z({
+  appliedTemplates: _,
+  selectedTemplates: l,
+  setSelectedTemplates: c
 }) {
-  const a = x(), d = a.formatMessage(s.customMetadataName), n = y(u), i = c.length, m = n.length, h = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
+  const a = x(), d = a.formatMessage(s.customMetadataName), n = y(_), i = l.length, m = n.length, h = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
     selectedTemplatesNumber: i,
     visibleTemplatesNumber: m
   }), T = () => {
-    l([]);
+    c([]);
   };
   return M(() => {
-    i === m && l([]);
+    i === m && c([]);
   }, [i, m]), /* @__PURE__ */ o(B, {
-    setValue: l,
-    value: c,
+    setValue: c,
+    value: l,
     children: [/* @__PURE__ */ o("div", {
-      className: t.triggerContainer,
-      children: [/* @__PURE__ */ e(b, {
-        render: /* @__PURE__ */ e(v, {
+      className: e.triggerContainer,
+      children: [/* @__PURE__ */ t(b, {
+        render: /* @__PURE__ */ t(v, {
           caretDirection: "down",
-          className: t.triggerButton,
+          className: e.triggerButton,
           label: h,
           size: "small",
           variant: "tertiary",
           "data-target-id": "TriggerButton-allTemplatesTriggerButtonText|selectedTemplatesTriggerButtonText"
         })
-      }), n.length > 0 && /* @__PURE__ */ e(C, {
+      }), n.length > 0 && /* @__PURE__ */ t(N, {
         as: "p",
-        className: t.details,
+        className: e.details,
         color: "textOnLightSecondary",
         "data-testid": "detailsList",
         variant: "caption",
-        children: n.filter((r) => c.some((f) => f === r.id)).map((r) => _(r, d)).join(", ")
+        children: n.filter((r) => l.some((f) => f === r.id)).map((r) => u(r, d)).join(", ")
       })]
-    }), /* @__PURE__ */ e(z, {
-      className: t.popover,
-      gutter: q,
-      children: /* @__PURE__ */ o(N, {
-        className: t.scrollableContainer,
+    }), /* @__PURE__ */ t(z, {
+      className: e.popover,
+      gutter: R,
+      children: /* @__PURE__ */ o(C, {
+        className: e.scrollableContainer,
         children: [/* @__PURE__ */ o(g, {
           autoFocus: i === 0,
-          className: t.item,
+          className: e.item,
           hideOnClick: !0,
           onClick: T,
-          children: [i === 0 && /* @__PURE__ */ e(p, {
-            className: S(t.indicator, t.indicatorIcon)
+          children: [i === 0 && /* @__PURE__ */ t(p, {
+            className: S(e.indicator, e.indicatorIcon)
           }), a.formatMessage(s.allTemplatesTriggerButtonText)]
-        }), /* @__PURE__ */ e(j, {
-          className: t.divider
+        }), /* @__PURE__ */ t(j, {
+          className: e.divider
         }), n.map((r) => /* @__PURE__ */ o(g, {
-          className: t.item,
+          className: e.item,
           hideOnClick: !0,
           value: r.id,
-          children: [/* @__PURE__ */ e(I, {
-            className: t.indicator,
+          children: [/* @__PURE__ */ t(I, {
+            className: e.indicator,
             style: {
               width: "none",
               height: "none"
             },
-            children: /* @__PURE__ */ e(p, {
-              className: t.indicatorIcon
+            children: /* @__PURE__ */ t(p, {
+              className: e.indicatorIcon
             })
-          }), _(r, d)]
+          }), u(r, d)]
         }, r.id))]
       })
     })]
   });
 }
 export {
-  $ as FilterInstancesDropdown
+  Z as FilterInstancesDropdown
 };

package/dist/esm/lib/components/metadata-editor-fields/components/metadata-enum-field/metadata-enum-field.js

@@ -1,56 +1,56 @@
 import { Select as l, SELECT_EMPTY_VALUE as o } from "@box/blueprint-web";
-import { useFormikContext as C, getIn as L, Field as P } from "formik";
-import { forwardRef as S } from "react";
-import { useIntl as $, FormattedMessage as b } from "react-intl";
-import m from "../../../../messages.js";
-import { g as j } from "../../../../../../chunks/utils2.js";
-import { jsx as t, jsxs as w } from "react/jsx-runtime";
-const U = /* @__PURE__ */ S(({
-  className: c,
-  isAiSuggestionApplied: u,
-  description: p,
-  disableForm: f,
-  fieldNamePrefix: s,
-  updateModePrefix: g,
-  label: n,
-  onValueEdited: h,
-  options: v,
-  portalElement: E
-}, F) => {
+import { useFormikContext as C, getIn as L, Field as O } from "formik";
+import { forwardRef as P } from "react";
+import { useIntl as S, FormattedMessage as $ } from "react-intl";
+import i from "../../../../messages.js";
+import { g as b } from "../../../../../../chunks/utils2.js";
+import { jsx as t, jsxs as j } from "react/jsx-runtime";
+const U = /* @__PURE__ */ P(({
+  className: m,
+  isAiSuggestionApplied: c,
+  description: u,
+  disableForm: p,
+  fieldNamePrefix: r,
+  updateModePrefix: f,
+  label: s,
+  onValueEdited: g,
+  options: h,
+  portalElement: v
+}, E) => {
   const {
-    setFieldValue: M,
-    values: x
-  } = C(), V = $(), d = `${g ?? s}.value`, r = v || L(x, `${s}.options`, []).map(({
+    setFieldValue: F,
+    values: M
+  } = C(), x = S(), n = `${f ?? r}.value`, V = h || L(M, `${r}.options`, []).map(({
     key: a
-  }) => a), i = V.formatMessage(m.selectValuePlaceholder);
+  }) => a), d = x.formatMessage(i.selectValuePlaceholder);
   return /* @__PURE__ */ t("div", {
-    "data-testid": `${n}-field`,
-    children: /* @__PURE__ */ t(P, {
-      name: d,
+    "data-testid": `${s}-field`,
+    children: /* @__PURE__ */ t(O, {
+      name: n,
       children: ({
         field: a
       }) => /* @__PURE__ */ t(l, {
-        ref: F,
-        className: c,
+        ref: E,
+        className: m,
         "data-target-id": "Select-MetadataEditorEnumField",
-        disabled: f,
-        label: j(n, p, u),
+        disabled: p,
+        label: b(s, u, c),
         onValueChange: (e) => {
-          M(d, e === o ? "" : e), h();
+          F(n, e === o ? "" : e), g();
         },
-        placeholder: i,
+        placeholder: d,
         ...a,
         value: a.value === o ? "" : a.value,
-        children: /* @__PURE__ */ w(l.Content, {
-          container: E,
+        children: /* @__PURE__ */ j(l.Content, {
+          container: v,
           onEscapeKeyDown: (e) => e.stopPropagation(),
           children: [/* @__PURE__ */ t(l.Option, {
-            text: i,
+            text: d,
             value: o,
-            children: /* @__PURE__ */ t(b, {
-              ...m.selectValuePlaceholder
+            children: /* @__PURE__ */ t($, {
+              ...i.selectValuePlaceholder
             })
-          }), r == null ? void 0 : r.map((e) => /* @__PURE__ */ t(l.Option, {
+          }), V?.map((e) => /* @__PURE__ */ t(l.Option, {
             text: e,
             value: e,
             children: e

package/dist/esm/lib/components/metadata-editor-fields/components/metadata-float-field/use-float-validation.js

@@ -1,15 +1,15 @@
-import { useIntl as o } from "react-intl";
-import n from "../../../../messages.js";
-const s = (t) => t != null && t.length ? /^[-+]?\d+(\.\d+)?$/.test(t) : !0, l = () => {
-  const t = o();
+import { useIntl as r } from "react-intl";
+import o from "../../../../messages.js";
+const a = (t) => t?.length ? /^[-+]?\d+(\.\d+)?$/.test(t) : !0, i = () => {
+  const t = r();
   return {
-    validateFloats: (r) => {
-      if (!s(r))
-        return t.formatMessage(n.floatFieldInvalidValue);
+    validateFloats: (e) => {
+      if (!a(e))
+        return t.formatMessage(o.floatFieldInvalidValue);
     }
   };
 };
 export {
-  s as isFloatOrBlank,
-  l as useFloatValidation
+  a as isFloatOrBlank,
+  i as useFloatValidation
 };

package/dist/esm/lib/components/metadata-editor-fields/components/metadata-multi-select-field/metadata-multi-select-field.js

@@ -1,53 +1,52 @@
-import { Combobox as x } from "@box/blueprint-web";
-import { useFormikContext as V, getIn as w, Field as $ } from "formik";
-import { forwardRef as I } from "react";
-import { useIntl as S } from "react-intl";
-import j from "../../../../messages.js";
-import { g as k } from "../../../../../../chunks/utils2.js";
+import { Combobox as M } from "@box/blueprint-web";
+import { useFormikContext as x, getIn as V, Field as w } from "formik";
+import { forwardRef as $ } from "react";
+import { useIntl as I } from "react-intl";
+import S from "../../../../messages.js";
+import { g as j } from "../../../../../../chunks/utils2.js";
 import { jsx as t } from "react/jsx-runtime";
-const B = /* @__PURE__ */ I(({
-  className: n,
-  isAiSuggestionApplied: s,
-  description: m,
-  disableForm: d,
+const A = /* @__PURE__ */ $(({
+  className: i,
+  isAiSuggestionApplied: n,
+  description: s,
+  disableForm: m,
   fieldNamePrefix: o,
   label: a,
-  onValueEdited: u,
-  options: c,
-  portalElement: f,
-  updateModePrefix: p
-}, g) => {
+  onValueEdited: d,
+  options: u,
+  portalElement: c,
+  updateModePrefix: f
+}, p) => {
   const {
-    setFieldValue: h,
-    values: F
-  } = V(), b = S(), l = `${p ?? o}.value`, v = c || w(F, `${o}.options`, []).map(({
+    setFieldValue: g,
+    values: h
+  } = x(), F = I(), l = `${f ?? o}.value`, b = u || V(h, `${o}.options`, []).map(({
     key: e
-  }) => e), C = (e, r) => r.toLowerCase().includes(e.toLowerCase());
+  }) => e), v = (e, r) => r.toLowerCase().includes(e.toLowerCase());
   return /* @__PURE__ */ t("div", {
     "data-testid": `${a}-field`,
-    children: /* @__PURE__ */ t($, {
+    children: /* @__PURE__ */ t(w, {
       name: l,
       children: ({
         field: e
       }) => {
-        var i;
-        const L = (((i = e.value) == null ? void 0 : i.length) || 0) === 0 ? b.formatMessage(j.multiselectPlaceholder) : "";
-        return /* @__PURE__ */ t(x, {
-          ref: g,
+        const C = (e.value?.length || 0) === 0 ? F.formatMessage(S.multiselectPlaceholder) : "";
+        return /* @__PURE__ */ t(M, {
+          ref: p,
           as: "input",
-          className: n,
+          className: i,
           "data-target-id": "Combobox-MetadataEditorMultiSelectField",
-          disabled: d,
-          filterFn: C,
-          label: k(a, m, s),
+          disabled: m,
+          filterFn: v,
+          label: j(a, s, n),
           multiselect: !0,
           name: e.name,
-          onValueChange: (M) => {
-            h(l, M), u();
+          onValueChange: (L) => {
+            g(l, L), d();
           },
-          options: v,
-          placeholder: L,
-          portalElement: f,
+          options: b,
+          placeholder: C,
+          portalElement: c,
           value: e.value
         });
       }
@@ -55,6 +54,6 @@ const B = /* @__PURE__ */ I(({
   });
 });
 export {
-  B as MetadataMultiSelectField,
-  B as default
+  A as MetadataMultiSelectField,
+  A as default
 };