@box/metadata-editor 0.60.4 → 0.61.1

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

@@ -1,26 +1,32 @@
-import { MetadataDateField as a } from "./components/metadata-date-field/metadata-date-field.js";
+import { forwardRef as r } from "react";
+import { MetadataDateField as o } from "./components/metadata-date-field/metadata-date-field.js";
 import { MetadataEnumField as i } from "./components/metadata-enum-field/metadata-enum-field.js";
-import { MetadataFloatField as o } from "./components/metadata-float-field/metadata-float-field.js";
-import { MetadataMultiSelectField as r } from "./components/metadata-multi-select-field/metadata-multi-select-field.js";
-import { MetadataStringField as m } from "./components/metadata-string-field/metadata-string-field.js";
-import { jsx as e } from "react/jsx-runtime";
-const n = {
-  date: (t) => /* @__PURE__ */ e(a, {
-    ...t
-  }),
-  enum: (t) => /* @__PURE__ */ e(i, {
-    ...t
-  }),
-  float: (t) => /* @__PURE__ */ e(o, {
-    ...t
-  }),
-  multiSelect: (t) => /* @__PURE__ */ e(r, {
-    ...t
-  }),
-  string: (t) => /* @__PURE__ */ e(m, {
-    ...t
-  })
+import { MetadataFloatField as m } from "./components/metadata-float-field/metadata-float-field.js";
+import { MetadataMultiSelectField as f } from "./components/metadata-multi-select-field/metadata-multi-select-field.js";
+import { MetadataStringField as d } from "./components/metadata-string-field/metadata-string-field.js";
+import { jsx as a } from "react/jsx-runtime";
+const c = {
+  date: /* @__PURE__ */ r((t, e) => /* @__PURE__ */ a(o, {
+    ...t,
+    ref: e
+  })),
+  enum: /* @__PURE__ */ r((t, e) => /* @__PURE__ */ a(i, {
+    ...t,
+    ref: e
+  })),
+  float: /* @__PURE__ */ r((t, e) => /* @__PURE__ */ a(m, {
+    ...t,
+    ref: e
+  })),
+  multiSelect: /* @__PURE__ */ r((t, e) => /* @__PURE__ */ a(f, {
+    ...t,
+    ref: e
+  })),
+  string: /* @__PURE__ */ r((t, e) => /* @__PURE__ */ a(d, {
+    ...t,
+    ref: e
+  }))
 };
 export {
-  n as editorFieldTypes
+  c as editorFieldTypes
 };

package/esm/lib/components/metadata-editor-fields/metadata-editor-fields.js

@@ -1,31 +1,36 @@
-import { Text as n } from "@box/blueprint-web";
-import { useFormikContext as i, getIn as l, FieldArray as d } from "formik";
-import { FormattedMessage as p } from "react-intl";
-import c from "../../messages.js";
-import { M as f, s as g } from "../../../../chunks/metadata-editor-field-wrapper.js";
-import { jsx as e } from "react/jsx-runtime";
-const A = (s) => {
+import { useRef as f, useEffect as l } from "react";
+import { Text as c } from "@box/blueprint-web";
+import { useFormikContext as d, getIn as u, FieldArray as p } from "formik";
+import { FormattedMessage as x } from "react-intl";
+import g from "../../messages.js";
+import { M as h, s as F } from "../../../../chunks/metadata-editor-field-wrapper.js";
+import { jsx as t } from "react/jsx-runtime";
+const k = (m) => {
   const {
-    values: o
-  } = i(), t = "metadata.fields", a = l(o, t);
-  return a.length ? /* @__PURE__ */ e(d, {
-    name: t,
+    values: i
+  } = d(), o = "metadata.fields", r = u(i, o), s = f(null), a = r.findIndex((e) => !e.hidden);
+  return l(() => {
+    var e;
+    a > -1 && ((e = s.current) == null || e.focus());
+  }, []), r.length ? /* @__PURE__ */ t(p, {
+    name: o,
     validateOnChange: !1,
-    children: () => a.map((r, m) => /* @__PURE__ */ e(f, {
-      ...s,
-      field: r,
-      index: m
-    }, r.key))
-  }) : /* @__PURE__ */ e(n, {
+    children: () => r.map((e, n) => /* @__PURE__ */ t(h, {
+      ...m,
+      ref: n === a ? s : null,
+      field: e,
+      index: n
+    }, e.key))
+  }) : /* @__PURE__ */ t(c, {
     as: "span",
-    className: g.noAttributesText,
+    className: F.noAttributesText,
     color: "textOnLightSecondary",
-    children: /* @__PURE__ */ e(p, {
-      ...c.noTemplateAtributesError
+    children: /* @__PURE__ */ t(x, {
+      ...g.noTemplateAtributesError
     })
   });
 };
 export {
-  A as TemplateInstance,
-  A as default
+  k as TemplateInstance,
+  k as default
 };

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

@@ -2,10 +2,10 @@ import "../../../../../../styles/metadata-instance-form.css";
 import { Card as v } from "@box/blueprint-web";
 import { Formik as N, Form as P } from "formik";
 import { useState as c, useRef as U, useEffect as _, useMemo as x } from "react";
-import { TEMPLATE_CUSTOM_PROPERTIES as K } from "../../../../constants.js";
-import { useAutofill as L } from "../../../../utils/autofill-context.js";
-import { TemplateInstance as R } from "../../../metadata-editor-fields/metadata-editor-fields.js";
-import { MetadataEmptyState as B } from "../../../metadata-empty-state/metadata-empty-state.js";
+import { TEMPLATE_CUSTOM_PROPERTIES as L } from "../../../../constants.js";
+import { useAutofill as R } from "../../../../utils/autofill-context.js";
+import { TemplateInstance as B } from "../../../metadata-editor-fields/metadata-editor-fields.js";
+import { MetadataEmptyState as K } from "../../../metadata-empty-state/metadata-empty-state.js";
 import { UnsavedChangesModal as j } from "../../../unsaved-changes-modal/unsaved-changes-modal.js";
 import { CustomInstance as k } from "../custom-instance/custom-instance.js";
 import { DeleteConfirmationModal as $ } from "../delete-confirmation-modal/delete-confirmation-modal.js";
@@ -15,7 +15,7 @@ import { createJSONPatch as J } from "./utils.js";
 import { jsx as t, jsxs as d } from "react/jsx-runtime";
 const V = "_metadataInstanceForm_1hu4u_1", q = {
   metadataInstanceForm: V
-}, re = (p) => {
+}, me = (p) => {
   const {
     areAiSuggestionsAvailable: f,
     isAiSuggestionsFeatureEnabled: o,
@@ -27,44 +27,44 @@ const V = "_metadataInstanceForm_1hu4u_1", q = {
     selectedTemplateInstance: e,
     setIsUnsavedChangesModalOpen: i,
     onDiscardUnsavedChanges: M
-  } = p, [S, m] = c(!1), {
+  } = p, [S, r] = c(!1), {
     isFetchingSuggestions: n,
     getAiSuggestions: E
-  } = L(), s = e.templateKey === K, I = async (a) => {
+  } = R(), s = e.templateKey === L, I = async (a) => {
     await F(a, J(a, e));
   }, D = (a) => {
     a ? i(!0) : h();
-  }, y = () => {
-    m(!0);
-  }, b = {
+  }, b = () => {
+    r(!0);
+  }, y = {
     metadata: {
       ...e
     }
-  }, r = U(null), [l, A] = c(null);
+  }, m = U(null), [l, A] = c(null);
   _(() => {
-    A(r.current);
+    A(m.current);
   }, [e.templateKey, e.scope]);
   const O = x(() => {
     const a = e.fields.length === 0;
     return s ? /* @__PURE__ */ t(k, {
       isLoading: n
-    }) : a ? /* @__PURE__ */ t(B, {
+    }) : a ? /* @__PURE__ */ t(K, {
       isBoxAiSuggestionsFeatureEnabled: o,
       level: "instance"
-    }) : /* @__PURE__ */ t(R, {
+    }) : /* @__PURE__ */ t(B, {
       disableForm: n,
       portalElement: l
     });
-  }, [s, e.fields.length, e.templateKey, e.scope, n, o, l]);
+  }, [s, e.fields.length, n, o, l]);
   return /* @__PURE__ */ t(N, {
-    initialValues: b,
+    initialValues: y,
     onSubmit: I,
     children: ({
       values: a,
       dirty: T
     }) => /* @__PURE__ */ d(P, {
       children: [/* @__PURE__ */ d(v, {
-        ref: r,
+        ref: m,
         className: q.metadataInstanceForm,
         children: [/* @__PURE__ */ t(H, {
           areAiSuggestionsAvailable: f,
@@ -76,7 +76,7 @@ const V = "_metadataInstanceForm_1hu4u_1", q = {
           isDeleteButtonDisabled: u,
           isLoading: n,
           onCancel: () => D(T),
-          onDelete: y
+          onDelete: b
         })]
       }), /* @__PURE__ */ t(j, {
         onBackToEdit: () => i(!1),
@@ -84,7 +84,7 @@ const V = "_metadataInstanceForm_1hu4u_1", q = {
         open: g
       }), /* @__PURE__ */ t($, {
         onConfirm: () => C(e),
-        onDismiss: () => m(!1),
+        onDismiss: () => r(!1),
         open: S,
         templateName: e.displayName
       })]
@@ -92,5 +92,5 @@ const V = "_metadataInstanceForm_1hu4u_1", q = {
   }, `${e.scope}.${e.templateKey}`);
 };
 export {
-  re as MetadataInstanceForm
+  me as MetadataInstanceForm
 };

package/esm/lib/components/metadata-instance-editor/subcomponents/metadata-instance-form-header/metadata-instance-form-header.js

@@ -1,43 +1,49 @@
 import "../../../../../../styles/metadata-instance-form-header.css";
-import { Text as h, Tooltip as F, Button as x } from "@box/blueprint-web";
-import { BoxAiLogo as M } from "@box/blueprint-web-assets/icons/Logo";
-import { useFormikContext as _, getIn as n } from "formik";
-import { useIntl as y } from "react-intl";
+import { Text as x, Tooltip as M, Button as _ } from "@box/blueprint-web";
+import { BoxAiLogo as H } from "@box/blueprint-web-assets/icons/Logo";
+import { useFormikContext as k, getIn as m } from "formik";
+import { useIntl as v } from "react-intl";
 import e from "./messages.js";
-import { jsxs as H, jsx as a } from "react/jsx-runtime";
-const v = "_metadataInstanceFormHeader_1b2cc_1", A = "_title_1b2cc_8", i = {
-  metadataInstanceFormHeader: v,
-  title: A
-}, S = ({
-  areAiSuggestionsAvailable: l,
-  isAiSuggestionsFeatureEnabled: r,
-  isLoading: o,
-  templateName: m,
-  onAutofill: c
+import { jsxs as A, jsx as n } from "react/jsx-runtime";
+const T = "_metadataInstanceFormHeader_1b2cc_1", S = "_title_1b2cc_8", c = {
+  metadataInstanceFormHeader: T,
+  title: S
+}, V = ({
+  areAiSuggestionsAvailable: d,
+  isAiSuggestionsFeatureEnabled: u,
+  isLoading: s,
+  templateName: f,
+  onAutofill: g
 }) => {
   const {
-    isSubmitting: d,
-    values: s,
-    setFieldValue: u
-  } = _(), t = y(), f = async () => {
-    const B = n(s, "metadata.fields"), I = n(s, "metadata.templateKey"), b = await c(I, B);
-    u("metadata.fields", b);
-  }, g = m ?? t.formatMessage(e.customInstanceTitle), p = !l || d || o;
-  return /* @__PURE__ */ H("div", {
-    className: i.metadataInstanceFormHeader,
-    children: [/* @__PURE__ */ a(h, {
+    isSubmitting: p,
+    values: i,
+    setFieldValue: B
+  } = k(), t = v(), I = async () => {
+    const r = m(i, "metadata.fields"), F = m(i, "metadata.templateKey"), a = await g(F, r);
+    B("metadata.fields", r.map((o) => {
+      const l = a == null ? void 0 : a.find((h) => h.key === o.key);
+      return l ? {
+        ...o,
+        aiSuggestion: l.aiSuggestion
+      } : o;
+    }));
+  }, b = f ?? t.formatMessage(e.customInstanceTitle), y = !d || p || s;
+  return /* @__PURE__ */ A("div", {
+    className: c.metadataInstanceFormHeader,
+    children: [/* @__PURE__ */ n(x, {
       as: "h1",
-      className: i.title,
+      className: c.title,
       variant: "titleMedium",
-      children: g
-    }), r && /* @__PURE__ */ a(F, {
+      children: b
+    }), u && /* @__PURE__ */ n(M, {
       content: t.formatMessage(e.autofillButtonTooltip),
-      children: /* @__PURE__ */ a(x, {
-        disabled: p,
-        icon: M,
-        loading: o,
+      children: /* @__PURE__ */ n(_, {
+        disabled: y,
+        icon: H,
+        loading: s,
         loadingAriaLabel: t.formatMessage(e.loadingButtonAriaLabel),
-        onClick: f,
+        onClick: I,
         variant: "secondary",
         "data-target-id": "Button-autofillButton",
         children: t.formatMessage(e.autofillButton)
@@ -46,5 +52,5 @@ const v = "_metadataInstanceFormHeader_1b2cc_1", A = "_title_1b2cc_8", i = {
   });
 };
 export {
-  S as MetadataInstanceFormHeader
+  V as MetadataInstanceFormHeader
 };

package/esm/lib/components/metadata-instance-list/subcomponents/metadata-instance/metadata-instance.js

@@ -5,39 +5,39 @@ import { MetadataInstanceHeader as h } from "../metadata-instance-header/metadat
 import { MetadataInstanceContent as D } from "../metadata-instance-content/metadata-instance-content.js";
 import { MetadataInstanceFooter as V } from "../metadata-instance-footer/metadata-instance-footer.js";
 import { MetadataEmptyState as b } from "../../../metadata-empty-state/metadata-empty-state.js";
-import { jsxs as s, jsx as e, Fragment as l } from "react/jsx-runtime";
+import { jsxs as d, jsx as o, Fragment as l } from "react/jsx-runtime";
 const H = "_topDivider_tzhlb_1", S = "_bottomDivider_tzhlb_5", n = {
   topDivider: H,
   bottomDivider: S
 }, w = ({
-  isAiSuggestionsFeatureEnabled: d,
+  isAiSuggestionsFeatureEnabled: s,
   onEdit: u,
   onEditWithAutofill: p,
   templateInstance: t
 }) => {
-  const o = t.fields, y = o.every((a) => !a.value), c = o.some((a) => !a.value), v = o.length > 0, [i, r] = E(!0);
-  return /* @__PURE__ */ s(f, {
-    children: [/* @__PURE__ */ e(h, {
+  const e = t.fields, y = e.every((a) => !a.value), v = e.some((a) => !a.value), c = e.length > 0, [i, r] = E(!0);
+  return /* @__PURE__ */ d(f, {
+    children: [/* @__PURE__ */ o(h, {
       canEdit: !0,
-      isAiSuggestionsFeatureEnabled: d,
-      onAutofill: p,
+      isAiSuggestionsFeatureEnabled: s,
+      onAutofill: () => p(t),
       onEdit: () => u(t),
       templateName: t == null ? void 0 : t.displayName
-    }), /* @__PURE__ */ e(m, {
+    }), /* @__PURE__ */ o(m, {
       className: n.topDivider
-    }), i && y ? /* @__PURE__ */ e(b, {
-      isAnyEmptyValueHidden: v,
-      isBoxAiSuggestionsFeatureEnabled: d,
+    }), i && y ? /* @__PURE__ */ o(b, {
+      isAnyEmptyValueHidden: c,
+      isBoxAiSuggestionsFeatureEnabled: s,
       level: "instance",
       onShowEmptyValues: () => r(!1)
-    }) : /* @__PURE__ */ s(l, {
-      children: [/* @__PURE__ */ e(D, {
+    }) : /* @__PURE__ */ d(l, {
+      children: [/* @__PURE__ */ o(D, {
         shouldHideEmptyValues: i,
         templateInstance: t
-      }), c && /* @__PURE__ */ s(l, {
-        children: [/* @__PURE__ */ e(m, {
+      }), v && /* @__PURE__ */ d(l, {
+        children: [/* @__PURE__ */ o(m, {
           className: n.bottomDivider
-        }), /* @__PURE__ */ e(V, {
+        }), /* @__PURE__ */ o(V, {
           isAnyEmptyValueHidden: i,
           onHideEmptyValues: () => r(!0),
           onShowEmptyValues: () => r(!1)

package/esm/lib/components/metadata-instance-list/subcomponents/metadata-instance-header/messages.js

@@ -6,11 +6,11 @@ const e = t({
   },
   autofillButtonTooltip: {
     id: "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip",
-    defaultMessage: "Autofill with Box AI"
+    defaultMessage: "Autofill {templateName} with Box AI"
   },
   autofillButtonAriaLabel: {
     id: "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel",
-    defaultMessage: "Autofill with Box AI"
+    defaultMessage: "Autofill {templateName} with Box AI"
   },
   editButtonTooltip: {
     id: "metadataEditor.viewInstance.metadataInstanceHeader.editButtonTooltip",

package/esm/lib/components/metadata-instance-list/subcomponents/metadata-instance-header/metadata-instance-header.js

@@ -3,43 +3,47 @@ import { Text as f, Tooltip as i, IconButton as s } from "@box/blueprint-web";
 import { Pencil as g } from "@box/blueprint-web-assets/icons/Line";
 import { BoxAiLogo as b } from "@box/blueprint-web-assets/icons/Logo";
 import { useIntl as I } from "react-intl";
-import o from "./messages.js";
+import n from "./messages.js";
 import { jsxs as r, jsx as a } from "react/jsx-runtime";
-const p = "_metadataInstanceHeader_1vbbg_1", _ = "_iconButtonsContainer_1vbbg_7", h = "_title_1vbbg_15", e = {
-  metadataInstanceHeader: p,
-  iconButtonsContainer: _,
-  title: h
+const _ = "_metadataInstanceHeader_1vbbg_1", h = "_iconButtonsContainer_1vbbg_7", p = "_title_1vbbg_15", e = {
+  metadataInstanceHeader: _,
+  iconButtonsContainer: h,
+  title: p
 }, T = ({
   canEdit: c,
   isAiSuggestionsFeatureEnabled: l,
   onEdit: d,
-  onAutofill: m,
-  templateName: n
+  onAutofill: u,
+  templateName: t
 }) => {
-  const t = I(), u = n || t.formatMessage(o.customInstanceTitle), B = l && n;
+  const o = I(), m = t || o.formatMessage(n.customInstanceTitle), B = l && t;
   return /* @__PURE__ */ r("div", {
     className: e.metadataInstanceHeader,
     children: [/* @__PURE__ */ a(f, {
       as: "h1",
       className: e.title,
       variant: "titleMedium",
-      children: u
+      children: m
     }), c && /* @__PURE__ */ r("div", {
       className: e.iconButtonsContainer,
       children: [B && /* @__PURE__ */ a(i, {
-        content: t.formatMessage(o.autofillButtonTooltip),
+        content: o.formatMessage(n.autofillButtonTooltip, {
+          templateName: t
+        }),
         children: /* @__PURE__ */ a(s, {
-          "aria-label": t.formatMessage(o.autofillButtonAriaLabel),
+          "aria-label": o.formatMessage(n.autofillButtonAriaLabel, {
+            templateName: t
+          }),
           icon: b,
-          onClick: m,
+          onClick: u,
           variant: "icon-logo",
           "data-target-id": "IconButton-autofillButtonAriaLabel"
         })
       }), /* @__PURE__ */ a(i, {
-        content: t.formatMessage(o.editButtonTooltip),
+        content: o.formatMessage(n.editButtonTooltip),
         children: /* @__PURE__ */ a(s, {
-          "aria-label": t.formatMessage(o.editButtonAriaLabel, {
-            templateName: n
+          "aria-label": o.formatMessage(n.editButtonAriaLabel, {
+            templateName: t
           }),
           icon: g,
           onClick: d,

package/esm/lib/utils/api-wrapper.js

@@ -0,0 +1,19 @@
+import { AutofillContextProvider as f } from "./autofill-context.js";
+import { jsx as o } from "react/jsx-runtime";
+function e(t) {
+  return ({
+    isAiSuggestionsFeatureEnabled: r,
+    fetchSuggestions: p,
+    ...i
+  }) => /* @__PURE__ */ o(f, {
+    fetchSuggestions: p,
+    isAiSuggestionsFeatureEnabled: r,
+    children: /* @__PURE__ */ o(t, {
+      isAiSuggestionsFeatureEnabled: r,
+      ...i
+    })
+  });
+}
+export {
+  e as withApiWrapper
+};

package/esm/lib/utils/autofill-context.js

@@ -1,60 +1,61 @@
-import { createContext as C, useState as g, useCallback as p, useMemo as A, useContext as v } from "react";
-import { TEMPLATE_CUSTOM_PROPERTIES as x } from "../constants.js";
+import { createContext as p, useState as m, useCallback as v, useMemo as x, useContext as A } from "react";
+import { TEMPLATE_CUSTOM_PROPERTIES as P } from "../constants.js";
 import { fetchSuggestions as E } from "./utils.js";
-import { jsx as P } from "react/jsx-runtime";
-const m = /* @__PURE__ */ C(null), y = ({
+import { jsx as M } from "react/jsx-runtime";
+const h = /* @__PURE__ */ p(null), O = ({
   children: e,
-  isAiSuggestionsFeatureEnabled: n
+  isAiSuggestionsFeatureEnabled: r,
+  fetchSuggestions: i = E
 }) => {
-  const [t, h] = g({}), [i, u] = g(!1), a = p(async (r, l, w = !1) => {
-    let s = [];
-    if (!n)
+  const [t, S] = m({}), [u, l] = m(!1), a = v(async (s, c, C = !1) => {
+    let n = [];
+    if (!r)
       throw new Error("AI Suggestions feature not available.");
-    if (r === x)
+    if (s === P)
       throw new Error("Can't fetch suggestions for Custom Metadata instance");
-    if (!t[r] || w) {
-      u(!0);
+    if (!t[s] || C) {
+      l(!0);
       try {
-        s = await E(r, l), h({
+        n = await i(s, c), S({
           ...t,
-          [r]: {
-            ...Object.fromEntries(s.map((o) => [o.key, o.aiSuggestion]))
+          [s]: {
+            ...Object.fromEntries(n.map((o) => [o.key, o.aiSuggestion]))
           }
         });
       } catch {
       } finally {
-        u(!1);
+        l(!1);
       }
     } else
-      s = l.map((o) => {
-        var f;
-        const c = (f = t == null ? void 0 : t.templateKey) == null ? void 0 : f[o.key];
+      n = c.map((o) => {
+        var g;
+        const f = (g = t == null ? void 0 : t.templateKey) == null ? void 0 : g[o.key];
         return {
           ...o,
-          ...c ? {
-            aiSuggestion: c
+          ...f ? {
+            aiSuggestion: f
           } : null
         };
       });
-    return s;
-  }, [t]), S = A(() => ({
+    return n;
+  }, [r, t, i]), w = x(() => ({
     getAiSuggestions: a,
-    isAiSuggestionsFeatureEnabled: n,
-    isFetchingSuggestions: i,
+    isAiSuggestionsFeatureEnabled: r,
+    isFetchingSuggestions: u,
     suggestions: t
-  }), [a, n, i, t]);
-  return /* @__PURE__ */ P(m.Provider, {
-    value: S,
+  }), [a, r, u, t]);
+  return /* @__PURE__ */ M(h.Provider, {
+    value: w,
     children: e
   });
-}, I = () => {
-  const e = v(m);
+}, d = () => {
+  const e = A(h);
   if (!e)
     throw new Error("useAutofill should be wrapped inside AutofillProvider");
   return e;
 };
 export {
-  m as AutofillContext,
-  y as AutofillContextProvider,
-  I as useAutofill
+  h as AutofillContext,
+  O as AutofillContextProvider,
+  d as useAutofill
 };

package/i18n/en-US.js

@@ -91,8 +91,8 @@ export default {
   "metadataEditor.unsavedChangesModal.header": "Unsaved Changes",
   "metadataEditor.viewInstance.metadataInstanceFooter.hideEmptyValuesCTA": "Hide empty values",
   "metadataEditor.viewInstance.metadataInstanceFooter.showEmptyValuesCTA": "Show empty values",
-  "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel": "Autofill with Box AI",
-  "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip": "Autofill with Box AI",
+  "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel": "Autofill {templateName} with Box AI",
+  "metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip": "Autofill {templateName} with Box AI",
   "metadataEditor.viewInstance.metadataInstanceHeader.customMetadataTitle": "Custom Metadata",
   "metadataEditor.viewInstance.metadataInstanceHeader.editButtonAriaLabel": "Edit {templateName}",
   "metadataEditor.viewInstance.metadataInstanceHeader.editButtonTooltip": "Edit"

package/i18n/en-US.properties

@@ -183,9 +183,9 @@ metadataEditor.viewInstance.metadataInstanceFooter.hideEmptyValuesCTA = Hide emp
 # Call to action to show hidden empty values
 metadataEditor.viewInstance.metadataInstanceFooter.showEmptyValuesCTA = Show empty values
 # Aria label for the autofill button
-metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel = Autofill with Box AI
+metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel = Autofill {templateName} with Box AI
 # Tooltip text explaining that by clicking button user can autofill template using Box AI
-metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip = Autofill with Box AI
+metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip = Autofill {templateName} with Box AI
 # Header with Custom Metadata template name
 metadataEditor.viewInstance.metadataInstanceHeader.customMetadataTitle = Custom Metadata
 # Aria label for the edit button

package/i18n/json/src/lib/components/metadata-instance-list/subcomponents/metadata-instance-header/messages.json

@@ -1 +1 @@
-[{"id":"metadataEditor.viewInstance.metadataInstanceHeader.customMetadataTitle","description":"Header with Custom Metadata template name","defaultMessage":"Custom Metadata"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip","description":"Tooltip text explaining that by clicking button user can autofill template using Box AI","defaultMessage":"Autofill with Box AI"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel","description":"Aria label for the autofill button","defaultMessage":"Autofill with Box AI"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.editButtonTooltip","description":"Tooltip text explaining that by clicking button user can edit template","defaultMessage":"Edit"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.editButtonAriaLabel","description":"Aria label for the edit button","defaultMessage":"Edit {templateName}"}]
+[{"id":"metadataEditor.viewInstance.metadataInstanceHeader.customMetadataTitle","description":"Header with Custom Metadata template name","defaultMessage":"Custom Metadata"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonTooltip","description":"Tooltip text explaining that by clicking button user can autofill template using Box AI","defaultMessage":"Autofill {templateName} with Box AI"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.autofillButtonAriaLabel","description":"Aria label for the autofill button","defaultMessage":"Autofill {templateName} with Box AI"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.editButtonTooltip","description":"Tooltip text explaining that by clicking button user can edit template","defaultMessage":"Edit"},{"id":"metadataEditor.viewInstance.metadataInstanceHeader.editButtonAriaLabel","description":"Aria label for the edit button","defaultMessage":"Edit {templateName}"}]

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@box/metadata-editor",
-  "version": "0.60.4",
+  "version": "0.61.1",
   "peerDependencies": {
     "@ariakit/react": "0.4.5",
     "@box/blueprint-web": "^7.30.3",
@@ -53,5 +53,5 @@
     "**/*.css"
   ],
   "license": "SEE LICENSE IN LICENSE",
-  "gitHead": "cc88fe6001296a03f1dfce7edec7b6cd1b0ed9f0"
+  "gitHead": "e2f69a163f18e91fd7f4c4afc4778636657815a0"
 }

package/types/index.d.ts

@@ -9,3 +9,4 @@ export * from './lib/defaults';
 export * from './lib/metadata-editor';
 export * from './lib/types';
 export * from './lib/utils/autofill-context';
+export * from './lib/utils/api-wrapper';

package/types/lib/components/metadata-editor-fields/components/metadata-date-field/metadata-date-field.d.ts

@@ -1,3 +1,3 @@
 import { type MetadataFieldProps } from '../../types';
-export declare const MetadataDateField: ({ description, disableForm, fieldNamePrefix, label, portalElement, className, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataDateField: import("react").ForwardRefExoticComponent<MetadataFieldProps & import("react").RefAttributes<HTMLInputElement>>;
 export default MetadataDateField;

package/types/lib/components/metadata-editor-fields/components/metadata-enum-field/metadata-enum-field.d.ts

@@ -1,3 +1,3 @@
 import { type MetadataFieldProps } from '../../types';
-export declare const MetadataEnumField: ({ className, description, disableForm, fieldNamePrefix, label, options, portalElement, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataEnumField: import("react").ForwardRefExoticComponent<MetadataFieldProps & import("react").RefAttributes<HTMLInputElement>>;
 export default MetadataEnumField;

package/types/lib/components/metadata-editor-fields/components/metadata-float-field/metadata-float-field.d.ts

@@ -1,3 +1,3 @@
 import { type MetadataFieldProps } from '../../types';
-export declare const MetadataFloatField: ({ className, description, label, fieldNamePrefix, disableForm, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataFloatField: import("react").ForwardRefExoticComponent<MetadataFieldProps & import("react").RefAttributes<HTMLInputElement>>;
 export default MetadataFloatField;