@box/metadata-editor 0.107.1 → 0.108.0

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

@@ -1,59 +1,60 @@
-import { DateI18nProvider as L, DatePicker as P } from "@box/blueprint-web";
-import { useFormikContext as A, getIn as I, Field as T } from "formik";
+import { DateI18nProvider as x, DatePicker as I } from "@box/blueprint-web";
+import { useFormikContext as L, getIn as T, Field as A } from "formik";
 import { forwardRef as w, useMemo as S } from "react";
 import { useIntl as V } from "react-intl";
 import { convertIsoStringToCalendarDate as N, convertCalendarDateToISOString as O } from "../../../../utils/convertDate.js";
 import a from "../../../../messages.js";
 import { g as B } from "../../../../../../chunks/utils2.js";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 const H = /* @__PURE__ */ w(({
-  className: i,
+  className: s,
   description: d,
   isAiSuggestionApplied: c,
   disableForm: m,
   fieldNamePrefix: f,
-  label: l,
+  label: n,
   onValueEdited: u,
   portalElement: h,
   updateModePrefix: p
-}, g) => {
-  const r = `${p ?? f}.value`, e = V(), {
-    values: D,
+}, D) => {
+  const t = `${p ?? f}.value`, e = V(), {
+    values: g,
     setFieldTouched: M,
-    setFieldValue: v
-  } = A(), s = I(D, r), b = S(() => N(s), [s]), k = {
+    setFieldValue: k
+  } = L(), i = T(g, t), v = S(() => N(i), [i]), b = {
     clearDatePickerAriaLabel: e.formatMessage(a.clearSelectedDate),
     nextMonthAriaLabel: e.formatMessage(a.switchToNextMonth),
     openCalendarDropdownAriaLabel: e.formatMessage(a.openCalendar),
     previousMonthAriaLabel: e.formatMessage(a.switchToNextMonth)
   }, C = (o) => {
-    const n = O(o);
-    v(r, n), u();
-  }, x = () => {
-    M(r, !0);
+    const l = O(o);
+    k(t, l), u();
+  }, F = () => {
+    M(t, !0);
   };
-  return /* @__PURE__ */ t("div", {
-    "data-testid": `${l}-field`,
-    children: /* @__PURE__ */ t(L, {
+  return /* @__PURE__ */ r("div", {
+    "data-testid": `${n}-field`,
+    children: /* @__PURE__ */ r(x, {
       locale: e.locale,
-      children: /* @__PURE__ */ t(T, {
-        name: r,
+      children: /* @__PURE__ */ r(A, {
+        name: t,
         children: ({
           field: o,
-          meta: n
-        }) => /* @__PURE__ */ t(P, {
+          meta: l
+        }) => /* @__PURE__ */ r(I, {
           ...o,
-          ...k,
-          ref: g,
+          ...b,
+          ref: D,
           calendarAriaLabel: e.formatMessage(a.selectDate),
-          className: i,
-          error: n.error,
+          className: s,
+          dataTargetId: "DatePicker-MetadataEditorDateField",
+          error: l.error,
           isDisabled: m,
-          label: B(l, d, c, "span"),
-          onBlur: () => x(),
-          onChange: (F) => C(F),
+          label: B(n, d, c, "span"),
+          onBlur: () => F(),
+          onChange: (P) => C(P),
           portalElement: h,
-          value: b
+          value: v
         })
       })
     })

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

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

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

@@ -1,15 +1,15 @@
-import { TextInput as T } from "@box/blueprint-web";
-import { useFormikContext as V, getIn as $, Field as b } from "formik";
-import { forwardRef as B, useRef as I } from "react";
-import { g as M } from "../../../../../../chunks/utils2.js";
+import { TextInput as I } from "@box/blueprint-web";
+import { useFormikContext as M, getIn as R, Field as V } from "formik";
+import { forwardRef as $, useRef as b } from "react";
+import { g as B } from "../../../../../../chunks/utils2.js";
 import { useFloatValidation as O } from "./use-float-validation.js";
-import { jsx as r } from "react/jsx-runtime";
-const y = /* @__PURE__ */ B(({
-  className: l,
-  description: n,
-  isAiSuggestionApplied: d,
-  label: o,
-  fieldNamePrefix: i,
+import { jsx as a } from "react/jsx-runtime";
+const q = /* @__PURE__ */ $(({
+  className: d,
+  description: l,
+  isAiSuggestionApplied: i,
+  label: r,
+  fieldNamePrefix: n,
   disableForm: s,
   onValueEdited: u,
   updateModePrefix: c
@@ -18,37 +18,38 @@ const y = /* @__PURE__ */ B(({
     values: f,
     setFieldValue: p,
     setFieldTouched: F
-  } = V(), t = `${c ?? i}.value`, h = $(f, t), a = I(h), {
+  } = M(), t = `${c ?? n}.value`, h = R(f, t), o = b(h), {
     validateFloats: g
   } = O(), v = (e) => {
-    a.current = e, p(t, e), u();
+    o.current = e, p(t, e), u();
   }, x = (e) => {
     F(e, !0);
   };
-  return /* @__PURE__ */ r("div", {
-    "data-testid": `${o}-field`,
-    children: /* @__PURE__ */ r(b, {
+  return /* @__PURE__ */ a("div", {
+    "data-testid": `${r}-field`,
+    children: /* @__PURE__ */ a(V, {
       name: `${t}`,
-      validate: () => g(a.current),
+      validate: () => g(o.current),
       children: ({
         field: e,
-        meta: C
-      }) => /* @__PURE__ */ r(T, {
+        meta: T
+      }) => /* @__PURE__ */ a(I, {
         ...e,
         ref: m,
-        className: l,
+        className: d,
+        "data-target-id": "TextInput-MetadataEditorFloatField",
         disabled: s,
-        error: C.error,
+        error: T.error,
         inputMode: "decimal",
-        label: M(o, n, d),
+        label: B(r, l, i),
         onBlur: () => x(t),
-        onChange: (R) => v(R.currentTarget.value),
+        onChange: (C) => v(C.currentTarget.value),
         placeholder: "0"
       })
     })
   });
 });
 export {
-  y as MetadataFloatField,
-  y as default
+  q as MetadataFloatField,
+  q as default
 };

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

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

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

@@ -1,43 +1,44 @@
-import { TextInput as g } from "@box/blueprint-web";
-import { Field as u } from "formik";
+import { TextInput as u } from "@box/blueprint-web";
+import { Field as c } from "formik";
 import { forwardRef as h } from "react";
 import { useIntl as F } from "react-intl";
 import x from "../../../../messages.js";
 import { g as M } from "../../../../../../chunks/utils2.js";
 import { jsx as e } from "react/jsx-runtime";
-const b = /* @__PURE__ */ h(({
-  className: t,
+const I = /* @__PURE__ */ h(({
+  className: r,
   description: a,
-  isAiSuggestionApplied: o,
-  disableForm: i,
+  isAiSuggestionApplied: i,
+  disableForm: o,
   fieldNamePrefix: d,
-  label: r,
+  label: t,
   onValueEdited: l,
   updateModePrefix: m
-}, s) => {
-  const f = F(), n = `${m ?? d}.value`;
+}, n) => {
+  const s = F(), f = `${m ?? d}.value`;
   return /* @__PURE__ */ e("div", {
-    "data-testid": `${r}-field`,
-    children: /* @__PURE__ */ e(u, {
-      name: n,
+    "data-testid": `${t}-field`,
+    children: /* @__PURE__ */ e(c, {
+      name: f,
       children: ({
         field: p,
-        meta: c
-      }) => /* @__PURE__ */ e(g, {
+        meta: g
+      }) => /* @__PURE__ */ e(u, {
         ...p,
-        ref: s,
-        className: t,
-        disabled: i,
-        error: c.error,
-        label: M(r, a, o),
+        ref: n,
+        className: r,
+        "data-target-id": "TextInput-MetadataEditorStringField",
+        disabled: o,
+        error: g.error,
+        label: M(t, a, i),
         onChangeCapture: l,
-        placeholder: f.formatMessage(x.setValuePlaceholder)
+        placeholder: s.formatMessage(x.setValuePlaceholder)
       })
     })
   });
 });
-b.displayName = "MetadataStringField";
+I.displayName = "MetadataStringField";
 export {
-  b as MetadataStringField,
-  b as default
+  I as MetadataStringField,
+  I as default
 };

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

@@ -1,75 +1,76 @@
-import { ComboboxWithApiTreeView as K } from "@box/combobox-with-api";
-import { useFormikContext as W, getIn as $, Field as j } from "formik";
-import { forwardRef as D, useCallback as R } from "react";
-import { useIntl as q } from "react-intl";
-import z from "../../../../messages.js";
-import { g as b } from "../../../../../../chunks/utils2.js";
-import { jsx as e } from "react/jsx-runtime";
-import { ComboboxWithApiPagination as A } from "../../../combobox-with-api-pagination/combobox-with-api-pagination.js";
-const X = /* @__PURE__ */ D(({
-  description: i,
+import { ComboboxWithApiTreeView as w, ComboboxWithApiPagination as A } from "@box/combobox-with-api";
+import { useFormikContext as K, getIn as $, Field as j } from "formik";
+import { forwardRef as D, useCallback as E } from "react";
+import { useIntl as R } from "react-intl";
+import V from "../../../../messages.js";
+import { g as y } from "../../../../../../chunks/utils2.js";
+import { jsx as a } from "react/jsx-runtime";
+const S = /* @__PURE__ */ D(({
+  description: m,
   disableForm: l,
-  isAiSuggestionApplied: u,
-  fieldNamePrefix: p,
-  label: r,
-  portalElement: s,
-  taxonomyOptionsFetcher: c,
-  updateModePrefix: k,
-  className: d,
+  isAiSuggestionApplied: d,
+  fieldNamePrefix: u,
+  label: e,
+  portalElement: p,
+  taxonomyOptionsFetcher: s,
+  updateModePrefix: F,
+  className: h,
   isMultilevelTaxonomyFieldEnabled: M
-}, h) => {
-  const P = q(), a = `${k ?? p}.value`, {
-    setFieldValue: f,
-    values: g
-  } = W(), {
+}, c) => {
+  const k = R(), r = `${F ?? u}.value`, {
+    setFieldValue: g,
+    values: x
+  } = K(), {
     metadata: {
-      templateKey: v,
-      scope: x
+      templateKey: f,
+      scope: v
     }
-  } = g, T = $(g, p), {
-    key: C,
+  } = x, I = $(x, u), {
+    key: b,
     optionsRules: {
-      multiSelect: n,
+      multiSelect: i,
       selectableLevels: t
     },
-    levels: w
-  } = T, I = M && (t == null ? void 0 : t.some((o) => o > 1)), y = R((o) => c(x, v, C, t == null ? void 0 : t[0], o), [C, x, t, c, v]), F = (o) => n || !(o != null && o.length) ? P.formatMessage(z.taxonomyPlaceholder) : void 0;
-  return /* @__PURE__ */ e("div", {
-    "data-testid": `${r}-field`,
+    levels: P
+  } = I, W = M && (t == null ? void 0 : t.some((o) => o > 1)), C = E((o) => s(v, f, b, t == null ? void 0 : t[0], o), [b, v, t, s, f]), T = (o) => i || !(o != null && o.length) ? k.formatMessage(V.taxonomyPlaceholder) : void 0;
+  return /* @__PURE__ */ a("div", {
+    "data-testid": `${e}-field`,
     onKeyDown: (o) => o.stopPropagation(),
     role: "presentation",
-    children: /* @__PURE__ */ e(j, {
-      name: a,
+    children: /* @__PURE__ */ a(j, {
+      name: r,
       children: ({
         field: o
-      }) => I ? /* @__PURE__ */ e(K, {
-        ref: h,
-        className: d,
-        defaultFetcher: y,
+      }) => W ? /* @__PURE__ */ a(w, {
+        ref: c,
+        className: h,
+        dataTargetId: "ComboboxWithApiTreeView-MetadataEditorTaxonomyField",
+        defaultFetcher: C,
         disabled: l,
-        label: b(r, i, u),
-        levels: w,
-        multiselect: n,
-        onValueChange: (m) => f(a, m),
-        placeholder: F(o.value),
-        portalElement: s,
+        label: y(e, m, d),
+        levels: P,
+        multiselect: i,
+        onValueChange: (n) => g(r, n),
+        placeholder: T(o.value),
+        portalElement: p,
         selectableLevels: t,
         value: o.value
-      }) : /* @__PURE__ */ e(A, {
-        ref: h,
-        className: d,
-        defaultFetcher: y,
+      }) : /* @__PURE__ */ a(A, {
+        ref: c,
+        className: h,
+        dataTargetId: "ComboboxWithApiPagination-MetadataEditorTaxonomyField",
+        defaultFetcher: C,
         disabled: l,
-        label: b(r, i, u),
-        multiselect: n,
-        onValueChange: (m) => f(a, m),
-        placeholder: F(o.value),
-        portalElement: s,
+        label: y(e, m, d),
+        multiselect: i,
+        onValueChange: (n) => g(r, n),
+        placeholder: T(o.value),
+        portalElement: p,
         value: o.value
       })
     })
   });
 });
 export {
-  X as MetadataTaxonomyField
+  S as MetadataTaxonomyField
 };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@box/metadata-editor",
-    "version": "0.107.1",
+    "version": "0.108.0",
     "peerDependencies": {
         "@ariakit/react": "0.4.15",
         "@box/blueprint-web": "^7.30.3",
@@ -15,7 +15,7 @@
     "devDependencies": {
         "@ariakit/react": "0.4.15",
         "@box/babel-plugin-target-attributes": "1.3.0",
-        "@box/blueprint-web": "^12.0.0",
+        "@box/blueprint-web": "^12.1.0",
         "@box/blueprint-web-assets": "^4.44.0",
         "@box/storybook-utils": "^0.12.3",
         "@testing-library/react": "^15.0.6",