@box/metadata-editor 0.98.10 → 0.99.1

package/dist/chunks/filter-dropdown-menu.module.js

@@ -1,17 +1,17 @@
-import '../styles/filter-dropdown-menu.css';const c = "_content_17su9_1", e = "_scrollableContainer_17su9_20", s = "_item_17su9_25", o = "_option_17su9_35", t = "_search_17su9_56", n = "_searchIcon_17su9_61", _ = "_global_17su9_70", a = "_clearSearchIcon_17su9_75", r = "_searchInput_17su9_83", i = "_firefoxDefaultOpacityFix_17su9_115", l = "_divider_17su9_133", u = "_searchDivider_17su9_137", h = {
+import '../styles/filter-dropdown-menu.css';const c = "_content_3uvu2_1", e = "_scrollableContainer_3uvu2_20", o = "_item_3uvu2_25", t = "_option_3uvu2_35", n = "_search_3uvu2_56", _ = "_searchIcon_3uvu2_61", a = "_global_3uvu2_70", r = "_clearSearchIcon_3uvu2_75", s = "_searchInput_3uvu2_83", i = "_firefoxDefaultOpacityFix_3uvu2_115", u = "_divider_3uvu2_133", l = "_searchDivider_3uvu2_137", v = {
   content: c,
   scrollableContainer: e,
-  item: s,
-  option: o,
-  search: t,
-  searchIcon: n,
-  global: _,
-  clearSearchIcon: a,
-  searchInput: r,
+  item: o,
+  option: t,
+  search: n,
+  searchIcon: _,
+  global: a,
+  clearSearchIcon: r,
+  searchInput: s,
   firefoxDefaultOpacityFix: i,
-  divider: l,
-  searchDivider: u
+  divider: u,
+  searchDivider: l
 };
 export {
-  h as s
+  v as s
 };

package/dist/chunks/metadata-instance-form-card-wrapper.js

@@ -4,7 +4,7 @@ import { TEMPLATE_CUSTOM_PROPERTIES as w } from "../esm/lib/constants.js";
 import { MetadataInstanceFormFooter as A } from "../esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-footer/metadata-instance-form-footer.js";
 import { MetadataInstanceFormHeader as E } from "../esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-header/metadata-instance-form-header.js";
 import { jsx as t, jsxs as M } from "react/jsx-runtime";
-import '../styles/metadata-instance-form-card-wrapper.css';const b = "_metadataInstanceForm_1ae95_1", v = "_wrapperGradient_1ae95_7", D = "_suggestionsFetching_1ae95_12", I = "_metadataInstanceFormContent_1ae95_18", L = "_showOverlay_1ae95_25", s = {
+import '../styles/metadata-instance-form-card-wrapper.css';const b = "_metadataInstanceForm_1e6l2_1", v = "_wrapperGradient_1e6l2_7", D = "_suggestionsFetching_1e6l2_12", I = "_metadataInstanceFormContent_1e6l2_18", L = "_showOverlay_1e6l2_25", s = {
   metadataInstanceForm: b,
   wrapperGradient: v,
   suggestionsFetching: D,
@@ -17,9 +17,9 @@ import '../styles/metadata-instance-form-card-wrapper.css';const b = "_metadataI
     className: i,
     formRef: g,
     isAiSuggestionsFeatureEnabled: m,
-    isBetaLanguageEnabled: d,
-    isLargeFile: c = !1,
-    isDeleteButtonDisabled: l,
+    isBetaLanguageEnabled: l,
+    isLargeFile: d = !1,
+    isDeleteButtonDisabled: c,
     suggestions: F,
     isFetchingSuggestions: e,
     isFormDirty: u = !1,
@@ -39,13 +39,13 @@ import '../styles/metadata-instance-form-card-wrapper.css';const b = "_metadataI
         areAiSuggestionsAvailable: o,
         hasSuggestions: C,
         isAiSuggestionsFeatureEnabled: m && !f,
-        isBetaLanguageEnabled: d,
-        isLargeFile: c,
+        isBetaLanguageEnabled: l,
+        isLargeFile: d,
         isLoading: e,
         onAutofill: _,
         templateName: a == null ? void 0 : a.displayName
       }), a && r, /* @__PURE__ */ t(A, {
-        isDeleteButtonDisabled: l,
+        isDeleteButtonDisabled: c,
         isLoading: e,
         onCancel: () => p(u),
         onDelete: h

package/dist/chunks/utils2.js

@@ -1,42 +1,42 @@
-import { BoxAiLogo as s } from "@box/blueprint-web-assets/icons/Logo";
-import g from "../esm/lib/components/interactive-text/interactive-text.js";
-import { convertISOStringToUTCDate as i } from "../esm/lib/utils/convertDate.js";
-import { jsxs as c, jsx as o } from "react/jsx-runtime";
-import '../styles/utils.css';const _ = "_noAttributesText_1ggnw_1", b = "_fieldWrapper_1ggnw_5", p = "_hasSuggestion_1ggnw_10", x = "_error_1ggnw_18", d = "_dateField_1ggnw_30", m = "_suggestionApplied_1ggnw_34", u = "_comboboxContainer_1ggnw_34", T = "_labelWrapper_1ggnw_48", w = "_labelText_1ggnw_54", S = "_labelIcon_1ggnw_57", t = {
-  noAttributesText: _,
-  fieldWrapper: b,
-  hasSuggestion: p,
+import { BoxAiLogo as n } from "@box/blueprint-web-assets/icons/Logo";
+import i from "../esm/lib/components/interactive-text/interactive-text.js";
+import { convertISOStringToUTCDate as c } from "../esm/lib/utils/convertDate.js";
+import { jsxs as _, jsx as o } from "react/jsx-runtime";
+import '../styles/utils.css';const b = "_noAttributesText_1wv72_2", p = "_fieldWrapper_1wv72_6", g = "_hasSuggestion_1wv72_11", x = "_error_1wv72_19", d = "_dateField_1wv72_31", m = "_suggestionApplied_1wv72_35", u = "_comboboxContainer_1wv72_35", v = "_labelWrapper_1wv72_49", T = "_labelText_1wv72_55", w = "_labelIcon_1wv72_58", t = {
+  noAttributesText: b,
+  fieldWrapper: p,
+  hasSuggestion: g,
   error: x,
   dateField: d,
   suggestionApplied: m,
   comboboxContainer: u,
-  labelWrapper: T,
-  labelText: w,
-  labelIcon: S
-}, f = (e, n, l = !1, a = "label") => (r) => /* @__PURE__ */ c("div", {
+  labelWrapper: v,
+  labelText: T,
+  labelIcon: w
+}, W = (e, r, a = !1, s = "label") => (l) => /* @__PURE__ */ _("div", {
   className: t.labelWrapper,
-  children: [n ? /* @__PURE__ */ o(g, {
-    as: a,
+  children: [r ? /* @__PURE__ */ o(i, {
+    as: s,
     className: t.labelText,
-    tooltipText: n,
-    ...r,
+    tooltipText: r,
+    ...l,
     children: e
   }) : /* @__PURE__ */ o("label", {
     className: t.labelText,
-    ...r,
+    ...l,
     children: e
-  }), l && /* @__PURE__ */ o(s, {
+  }), a && /* @__PURE__ */ o(n, {
     className: t.labelIcon
   })]
-}), C = (e) => {
+}), f = (e) => {
   try {
-    return i(e).toISOString();
+    return c(e).toISOString();
   } catch {
     return null;
   }
 };
 export {
-  f as g,
+  W as g,
   t as s,
-  C as t
+  f as t
 };

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 x } from "@box/blueprint-web";
-import { useIntl as B } from "react-intl";
-import { SelectProvider as b, Select as I, SelectPopover as k, SelectItem as g, SelectItemCheck as M } from "@ariakit/react";
+import { TriggerButton as f, Text as v, ScrollableContainer as C, Divider as N } from "@box/blueprint-web";
+import { useIntl as x } from "react-intl";
+import { SelectProvider as B, Select as I, SelectPopover as k, SelectItem as g, SelectItemCheck as M } from "@ariakit/react";
 import { Space1 as S } from "@box/blueprint-web-assets/tokens/px-tokens";
 import { useEffect as y } from "react";
 import D from "clsx";
 import { Checkmark as p } from "@box/blueprint-web-assets/icons/Fill";
 import { getVisibleTemplates as j, getTemplateDisplayName as _ } 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 w = "_details_19fcm_1", F = "_triggerContainer_19fcm_5", O = "_triggerButton_19fcm_10", P = "_popover_19fcm_16", L = "_divider_19fcm_33", V = "_scrollableContainer_19fcm_36", z = "_item_19fcm_40", E = "_indicator_19fcm_67", G = "_indicatorIcon_19fcm_76", R = "_testContainer_19fcm_80", t = {
+import { jsxs as o, jsx as t } from "react/jsx-runtime";
+import '../../../../styles/filter-instances-dropdown.css';const w = "_details_18edb_1", F = "_triggerContainer_18edb_5", O = "_triggerButton_18edb_10", P = "_popover_18edb_16", L = "_divider_18edb_33", V = "_scrollableContainer_18edb_36", z = "_item_18edb_40", E = "_indicator_18edb_67", G = "_indicatorIcon_18edb_76", R = "_testContainer_18edb_80", e = {
   details: w,
   triggerContainer: F,
   triggerButton: O,
@@ -21,69 +21,69 @@ import '../../../../styles/filter-instances-dropdown.css';const w = "_details_19
   testContainer: R
 }, q = parseInt(S, 10);
 function $({
-  appliedTemplates: f,
+  appliedTemplates: u,
   selectedTemplates: c,
   setSelectedTemplates: l
 }) {
-  const a = B(), d = a.formatMessage(s.customMetadataName), n = j(f), i = c.length, m = n.length, u = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
+  const a = x(), m = a.formatMessage(s.customMetadataName), n = j(u), i = c.length, d = n.length, b = i === 0 ? a.formatMessage(s.allTemplatesTriggerButtonText) : a.formatMessage(s.selectedTemplatesTriggerButtonText, {
     selectedTemplatesNumber: i,
-    visibleTemplatesNumber: m
+    visibleTemplatesNumber: d
   }), h = () => {
     l([]);
   };
   return y(() => {
-    i === m && l([]);
-  }, [i, m]), /* @__PURE__ */ o(b, {
+    i === d && l([]);
+  }, [i, d]), /* @__PURE__ */ o(B, {
     setValue: l,
     value: c,
     children: [/* @__PURE__ */ o("div", {
-      className: t.triggerContainer,
-      children: [/* @__PURE__ */ e(I, {
-        render: /* @__PURE__ */ e(v, {
+      className: e.triggerContainer,
+      children: [/* @__PURE__ */ t(I, {
+        render: /* @__PURE__ */ t(f, {
           caretDirection: "down",
-          className: t.triggerButton,
-          label: u,
+          className: e.triggerButton,
+          label: b,
           size: "small",
           variant: "tertiary",
           "data-target-id": "TriggerButton-allTemplatesTriggerButtonText|selectedTemplatesTriggerButtonText"
         })
-      }), n.length > 0 && /* @__PURE__ */ e(C, {
+      }), n.length > 0 && /* @__PURE__ */ t(v, {
         as: "p",
-        className: t.details,
+        className: e.details,
         color: "textOnLightSecondary",
         "data-testid": "detailsList",
         variant: "caption",
-        children: n.filter((r) => c.some((T) => T === r.id)).map((r) => _(r, d)).join(", ")
+        children: n.filter((r) => c.some((T) => T === r.id)).map((r) => _(r, m)).join(", ")
       })]
-    }), /* @__PURE__ */ e(k, {
-      className: t.popover,
+    }), /* @__PURE__ */ t(k, {
+      className: e.popover,
       gutter: q,
-      children: /* @__PURE__ */ o(N, {
-        className: t.scrollableContainer,
+      children: /* @__PURE__ */ o(C, {
+        className: e.scrollableContainer,
         children: [/* @__PURE__ */ o(g, {
           autoFocus: i === 0,
-          className: t.item,
+          className: e.item,
           hideOnClick: !0,
           onClick: h,
-          children: [i === 0 && /* @__PURE__ */ e(p, {
-            className: D(t.indicator, t.indicatorIcon)
+          children: [i === 0 && /* @__PURE__ */ t(p, {
+            className: D(e.indicator, e.indicatorIcon)
           }), a.formatMessage(s.allTemplatesTriggerButtonText)]
-        }), /* @__PURE__ */ e(x, {
-          className: t.divider
+        }), /* @__PURE__ */ t(N, {
+          className: e.divider
         }), n.map((r) => /* @__PURE__ */ o(g, {
-          className: t.item,
+          className: e.item,
           hideOnClick: !0,
           value: r.id,
-          children: [/* @__PURE__ */ e(M, {
-            className: t.indicator,
+          children: [/* @__PURE__ */ t(M, {
+            className: e.indicator,
             style: {
               width: "none",
               height: "none"
             },
-            children: /* @__PURE__ */ e(p, {
-              className: t.indicatorIcon
+            children: /* @__PURE__ */ t(p, {
+              className: e.indicatorIcon
             })
-          }), _(r, d)]
+          }), _(r, m)]
         }, r.id))]
       })
     })]

package/dist/esm/lib/components/interactive-header-text/interactive-header-text.js

@@ -1,22 +1,22 @@
 import { Focusable as l } from "@ariakit/react";
 import { useFullTextTooltip as n, Text as i } from "@box/blueprint-web";
 import m from "clsx";
-import { useRef as p } from "react";
-import { jsx as e, Fragment as c } from "react/jsx-runtime";
-import '../../../../styles/interactive-header-text.css';const d = "_header_d9pl2_1", f = {
-  header: d
+import { useRef as c } from "react";
+import { jsx as e, Fragment as d } from "react/jsx-runtime";
+import '../../../../styles/interactive-header-text.css';const p = "_header_qqeyd_1", f = {
+  header: p
 }, _ = ({
   className: o,
   title: r
 }) => {
-  const t = p(null), {
+  const t = c(null), {
     Wrapper: a,
     wrapperProps: s
   } = n({
     ref: t,
     textValue: r
   });
-  return /* @__PURE__ */ e(c, {
+  return /* @__PURE__ */ e(d, {
     children: /* @__PURE__ */ e(a, {
       ...s,
       children: /* @__PURE__ */ e(l, {

package/dist/esm/lib/components/interactive-text/interactive-text.js

@@ -1,13 +1,13 @@
 import { Focusable as o } from "@ariakit/react";
 import { Tooltip as a, Text as s } from "@box/blueprint-web";
-import m from "clsx";
+import l from "clsx";
 import { jsx as t } from "react/jsx-runtime";
-import '../../../../styles/interactive-text.css';const x = "_interactiveText_2jv0p_1", l = {
-  interactiveText: x
+import '../../../../styles/interactive-text.css';const m = "_interactiveText_1i8lr_1", x = {
+  interactiveText: m
 }, _ = ({
   tooltipText: r,
-  className: c,
-  children: i,
+  className: i,
+  children: c,
   ...e
 }) => {
   const {
@@ -19,9 +19,9 @@ import '../../../../styles/interactive-text.css';const x = "_interactiveText_2jv
     children: /* @__PURE__ */ t(o, {
       render: /* @__PURE__ */ t(s, {
         as: n,
-        className: m(l.interactiveText, c),
+        className: l(x.interactiveText, i),
         ...e,
-        children: i
+        children: c
       })
     })
   });

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

@@ -1,14 +1,14 @@
-import { Text as s, IconButton as c, DropdownMenu as a } from "@box/blueprint-web";
-import { Checkmark as m, Ellipsis as f } from "@box/blueprint-web-assets/icons/Fill";
+import { Text as l, IconButton as c, DropdownMenu as a } from "@box/blueprint-web";
+import { Checkmark as u, Ellipsis as f } from "@box/blueprint-web-assets/icons/Fill";
 import { useIntl as I, FormattedMessage as r } from "react-intl";
 import t from "./messages.js";
 import { formatSuggestionValue as w } from "./utils.js";
-import { jsx as e, jsxs as i, Fragment as u } from "react/jsx-runtime";
-import '../../../../../../styles/ai-suggestion-field.css';const C = "_wrapperGradient_t2yak_1", _ = "_wrapper_t2yak_1", b = "_buttons_t2yak_18", k = "_selectTrigger_t2yak_22", o = {
+import { jsx as e, jsxs as i, Fragment as m } from "react/jsx-runtime";
+import '../../../../../../styles/ai-suggestion-field.css';const C = "_wrapperGradient_z7sut_1", _ = "_wrapper_z7sut_1", b = "_buttons_z7sut_18", x = "_selectTrigger_z7sut_22", o = {
   wrapperGradient: C,
   wrapper: _,
   buttons: b,
-  selectTrigger: k
+  selectTrigger: x
 };
 function N({
   aiSuggestion: S,
@@ -18,13 +18,13 @@ function N({
   type: n,
   isSameValue: h
 }) {
-  const l = I();
+  const s = I();
   return /* @__PURE__ */ e("div", {
     className: o.wrapperGradient,
     children: /* @__PURE__ */ e("div", {
       className: o.wrapper,
-      children: h ? /* @__PURE__ */ i(u, {
-        children: [/* @__PURE__ */ e(s, {
+      children: h ? /* @__PURE__ */ i(m, {
+        children: [/* @__PURE__ */ e(l, {
           as: "p",
           color: "textOnLightSecondary",
           variant: "caption",
@@ -34,42 +34,42 @@ function N({
         }), /* @__PURE__ */ e("div", {
           className: o.buttons,
           children: /* @__PURE__ */ e(c, {
-            "aria-label": l.formatMessage(t.aiSuggestionConfirm),
-            icon: m,
+            "aria-label": s.formatMessage(t.aiSuggestionConfirm),
+            icon: u,
             onClick: p,
             size: "x-small",
             "data-target-id": "IconButton-aiSuggestionConfirm"
           })
         })]
-      }) : /* @__PURE__ */ i(u, {
+      }) : /* @__PURE__ */ i(m, {
         children: [/* @__PURE__ */ i("div", {
-          children: [/* @__PURE__ */ e(s, {
+          children: [/* @__PURE__ */ e(l, {
             as: "p",
             color: "textOnLightSecondary",
             variant: "caption",
             children: /* @__PURE__ */ e(r, {
               ...t.aiSuggestionCaption
             })
-          }), /* @__PURE__ */ e(s, {
+          }), /* @__PURE__ */ e(l, {
             as: "p",
             children: w(S, {
               type: n,
-              locale: l.locale
+              locale: s.locale
             })
           })]
         }), /* @__PURE__ */ i("div", {
           className: o.buttons,
           children: [/* @__PURE__ */ e(c, {
-            "aria-label": l.formatMessage(n === "multiSelect" ? t.aiSuggestionAppend : t.aiSuggestionClearAndReplace),
+            "aria-label": s.formatMessage(n === "multiSelect" ? t.aiSuggestionAppend : t.aiSuggestionClearAndReplace),
             "data-target-id": n === "multiSelect" ? "IconButton-aiSuggestionAppend" : "IconButton-aiSuggestionClearAndReplace",
-            icon: m,
+            icon: u,
             onClick: n === "multiSelect" ? g : d,
             size: "x-small"
           }), /* @__PURE__ */ i(a.Root, {
             children: [/* @__PURE__ */ e(a.Trigger, {
               className: o.selectTrigger,
               children: /* @__PURE__ */ e(c, {
-                "aria-label": l.formatMessage(t.aiSuggestionOptions),
+                "aria-label": s.formatMessage(t.aiSuggestionOptions),
                 icon: f,
                 "data-target-id": "IconButton-aiSuggestionOptions"
               })

package/dist/esm/lib/components/metadata-instance-editor/subcomponents/autofill-overlay/autofill-overlay.js

@@ -3,57 +3,57 @@ import { LoadingIndicator as y, Text as n, TextButton as g } from "@box/blueprin
 import { useIntl as v } from "react-intl";
 import { AlertTriangle as _ } from "@box/blueprint-web-assets/icons/Line";
 import { SurfaceStatusSurfaceError as p, Size5 as m } from "@box/blueprint-web-assets/tokens/tokens";
-import h from "clsx";
-import e from "./messages.js";
-import { jsxs as b, jsx as i } from "react/jsx-runtime";
-import '../../../../../../styles/autofill-overlay.css';const O = "_autofillOverlay_15bqk_1", T = "_withError_15bqk_15", S = "_autofillOverlayTitle_15bqk_19", x = "_dismissButton_15bqk_24", B = "_overlayIcon_15bqk_28", I = "_testContainerStyle_15bqk_34", a = {
+import x from "clsx";
+import i from "./messages.js";
+import { jsxs as h, jsx as a } from "react/jsx-runtime";
+import '../../../../../../styles/autofill-overlay.css';const O = "_autofillOverlay_1xnil_1", T = "_withError_1xnil_15", S = "_autofillOverlayTitle_1xnil_19", B = "_dismissButton_1xnil_24", I = "_overlayIcon_1xnil_28", M = "_testContainerStyle_1xnil_34", s = {
   autofillOverlay: O,
   withError: T,
   autofillOverlayTitle: S,
-  dismissButton: x,
-  overlayIcon: B,
-  testContainerStyle: I
-}, A = ({
-  errorCode: s,
+  dismissButton: B,
+  overlayIcon: I,
+  testContainerStyle: M
+}, z = ({
+  errorCode: e,
   isFetchingSuggestions: c,
-  isLongLoading: l
+  isLongLoading: o
 }) => {
   const t = v(), [f, u] = d(!1);
-  let o = t.formatMessage(e.defaultLoadingMessage);
-  s && (o = t.formatMessage(e.errorTitle)), l && (o = t.formatMessage(e.longLoadingTitle));
-  const r = l ? t.formatMessage(e.longLoadingDescription) : s && t.formatMessage(e.errorDescription);
-  return !c && !s || f ? null : /* @__PURE__ */ b("div", {
-    className: h(a.autofillOverlay, s && a.withError),
-    children: [s ? /* @__PURE__ */ i(_, {
-      className: a.overlayIcon,
+  let l = t.formatMessage(i.defaultLoadingMessage);
+  e && (l = t.formatMessage(i.errorTitle)), o && (l = t.formatMessage(i.longLoadingTitle));
+  const r = o ? t.formatMessage(i.longLoadingDescription) : e && t.formatMessage(i.errorDescription);
+  return !c && !e || f ? null : /* @__PURE__ */ h("div", {
+    className: x(s.autofillOverlay, e && s.withError),
+    children: [e ? /* @__PURE__ */ a(_, {
+      className: s.overlayIcon,
       color: p,
       height: m,
       role: "presentation",
       width: m
-    }) : /* @__PURE__ */ i(y, {
-      "aria-label": t.formatMessage(e.loadingAriaLabel),
+    }) : /* @__PURE__ */ a(y, {
+      "aria-label": t.formatMessage(i.loadingAriaLabel),
       "aria-live": "polite",
-      className: a.overlayIcon,
+      className: s.overlayIcon,
       size: "large",
       variant: "default"
-    }), /* @__PURE__ */ i(n, {
+    }), /* @__PURE__ */ a(n, {
       as: "p",
-      className: a.autofillOverlayTitle,
+      className: s.autofillOverlayTitle,
       variant: "subtitle",
-      children: o
-    }), r && /* @__PURE__ */ i(n, {
+      children: l
+    }), r && /* @__PURE__ */ a(n, {
       as: "p",
       color: "textOnLightSecondary",
       variant: "bodyDefault",
       children: r
-    }), s && /* @__PURE__ */ i(g, {
-      className: a.dismissButton,
+    }), e && /* @__PURE__ */ a(g, {
+      className: s.dismissButton,
       onClick: () => u(!0),
       "data-target-id": "TextButton-dismissButton",
-      children: t.formatMessage(e.dismissButton)
+      children: t.formatMessage(i.dismissButton)
     })]
   });
 };
 export {
-  A as AutofillOverlay
+  z as AutofillOverlay
 };

package/dist/esm/lib/components/metadata-instance-editor/subcomponents/custom-instance-new-field/custom-instance-new-field.js

@@ -1,23 +1,23 @@
-import { Card as I, TextInput as u, Button as m } from "@box/blueprint-web";
+import { Card as y, TextInput as u, Button as m } from "@box/blueprint-web";
 import { useState as l } from "react";
-import { useIntl as y } from "react-intl";
+import { useIntl as v } from "react-intl";
 import t from "./messages.js";
 import { jsxs as p, jsx as a } from "react/jsx-runtime";
-import '../../../../../../styles/custom-instance-new-field.css';const M = "_customInstanceNewFieldCard_ivrhw_1", _ = "_customInstanceNewFieldFooter_ivrhw_6", b = "_inputWrapper_ivrhw_13", n = {
+import '../../../../../../styles/custom-instance-new-field.css';const M = "_customInstanceNewFieldCard_fcftk_1", _ = "_customInstanceNewFieldFooter_fcftk_6", b = "_inputWrapper_fcftk_13", n = {
   customInstanceNewFieldCard: M,
   customInstanceNewFieldFooter: _,
   inputWrapper: b
-}, x = (g) => {
+}, x = (f) => {
   const {
-    onAdd: h,
-    onCancel: f,
+    onAdd: g,
+    onCancel: F,
     formKeys: c = []
-  } = g, e = y(), [r, F] = l(""), [i, C] = l(""), [d, o] = l(""), N = c.length !== 0, w = (s) => {
-    F(s), d && o("");
-  }, v = () => {
-    r ? r.startsWith("$") ? o(e.formatMessage(t.customErrorInternalKey)) : c.includes(r) ? o(e.formatMessage(t.customErrorDuplicateKey)) : h(r, i) : o(e.formatMessage(t.keyFieldRequiredError));
+  } = f, e = v(), [r, h] = l(""), [d, C] = l(""), [i, o] = l(""), N = c.length !== 0, I = (s) => {
+    h(s), i && o("");
+  }, w = () => {
+    r ? r.startsWith("$") ? o(e.formatMessage(t.customErrorInternalKey)) : c.includes(r) ? o(e.formatMessage(t.customErrorDuplicateKey)) : g(r, d) : o(e.formatMessage(t.keyFieldRequiredError));
   };
-  return /* @__PURE__ */ p(I, {
+  return /* @__PURE__ */ p(y, {
     "aria-label": e.formatMessage(t.addAttributeGroupAriaLabel),
     className: n.customInstanceNewFieldCard,
     "data-testid": "customInstanceNewField",
@@ -26,9 +26,9 @@ import '../../../../../../styles/custom-instance-new-field.css';const M = "_cust
       className: n.inputWrapper,
       children: /* @__PURE__ */ a(u, {
         autoFocus: !0,
-        error: d,
+        error: i,
         label: e.formatMessage(t.customKeyLabel),
-        onChange: (s) => w(s.target.value),
+        onChange: (s) => I(s.target.value),
         placeholder: e.formatMessage(t.customKeyPlaceholder),
         required: !0,
         value: r
@@ -39,17 +39,17 @@ import '../../../../../../styles/custom-instance-new-field.css';const M = "_cust
         label: e.formatMessage(t.valueLabel),
         onChange: (s) => C(s.target.value),
         placeholder: e.formatMessage(t.valuePlaceholder),
-        value: i
+        value: d
       })
     }), /* @__PURE__ */ p("div", {
       className: n.customInstanceNewFieldFooter,
       children: [N && /* @__PURE__ */ a(m, {
-        onClick: f,
+        onClick: F,
         variant: "secondary",
         "data-target-id": "Button-cancelCTA",
         children: e.formatMessage(t.cancelCTA)
       }), /* @__PURE__ */ a(m, {
-        onClick: v,
+        onClick: w,
         variant: "primary",
         "data-target-id": "Button-addNewFieldCTA",
         children: e.formatMessage(t.addNewFieldCTA)

package/dist/esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-autofill-button/metadata-instance-form-autofill-button.js

@@ -1,4 +1,4 @@
-import { LoadingIndicator as v, IconButton as k, Tooltip as x, Button as K } from "@box/blueprint-web";
+import { LoadingIndicator as k, IconButton as v, Tooltip as x, Button as K } from "@box/blueprint-web";
 import { BoxAiLogo as p } from "@box/blueprint-web-assets/icons/Logo";
 import { useFormikContext as L, getIn as i } from "formik";
 import { useEffect as h } from "react";
@@ -6,7 +6,7 @@ import { useIntl as C } from "react-intl";
 import { useAutofill as F } from "../../../../utils/autofill-context.js";
 import n from "./messages.js";
 import { jsx as l } from "react/jsx-runtime";
-import '../../../../../../styles/metadata-instance-form-autofill-button.css';const T = "_loadingIndicator_1vv9u_1", _ = {
+import '../../../../../../styles/metadata-instance-form-autofill-button.css';const T = "_loadingIndicator_baqvi_1", _ = {
   loadingIndicator: T
 }, w = ({
   areAiSuggestionsAvailable: B,
@@ -18,14 +18,14 @@ import '../../../../../../styles/metadata-instance-form-autofill-button.css';con
   const {
     isSubmitting: A,
     values: e,
-    setFieldValue: u
+    setFieldValue: m
   } = L(), t = C(), {
     suggestions: o
   } = F();
   h(() => {
     if (o) {
       const a = i(e, "metadata.fields"), r = i(e, "metadata.templateKey");
-      u("metadata.fields", a == null ? void 0 : a.map((s) => {
+      m("metadata.fields", a == null ? void 0 : a.map((s) => {
         var g;
         const f = (g = o == null ? void 0 : o[r]) == null ? void 0 : g[s.key];
         return f ? {
@@ -34,18 +34,18 @@ import '../../../../../../styles/metadata-instance-form-autofill-button.css';con
         } : s;
       }));
     }
-  }, [o, u]);
-  const m = () => {
+  }, [o, m]);
+  const u = () => {
     const a = i(e, "metadata.templateKey"), r = i(e, "metadata.scope");
     y(a, r);
-  }, d = !B || A || c, M = c ? /* @__PURE__ */ l(v, {
+  }, d = !B || A || c, M = c ? /* @__PURE__ */ l(k, {
     "aria-label": t.formatMessage(n.loadingButtonAriaLabel),
     className: _.loadingIndicator
-  }) : /* @__PURE__ */ l(k, {
+  }) : /* @__PURE__ */ l(v, {
     "aria-label": t.formatMessage(n.autofillButtonAriaLabel),
     disabled: d,
     icon: p,
-    onClick: m,
+    onClick: u,
     variant: "icon-logo",
     "data-target-id": "IconButton-autofillButtonAriaLabel"
   });
@@ -54,7 +54,7 @@ import '../../../../../../styles/metadata-instance-form-autofill-button.css';con
     children: I === "secondary-button" ? /* @__PURE__ */ l(K, {
       disabled: d,
       icon: p,
-      onClick: m,
+      onClick: u,
       variant: "secondary",
       "data-target-id": "Button-autofillButton",
       children: t.formatMessage(n.autofillButton)