@box/metadata-editor 0.51.1 → 0.51.2

package/chunks/metadata-editor-field-wrapper.js

@@ -13,48 +13,50 @@ const W = "_noAttributesText_vykxc_1", M = "_fieldWrapper_vykxc_5", N = "_hasSug
   hasSuggestion: N,
   error: T
 }, E = ({
-  disableForm: a,
-  portalElement: n,
+  disableForm: n,
+  portalElement: a,
   field: e,
   index: p
 }) => {
   const {
     setFieldValue: d
-  } = x(), [g, r] = h(!0), i = k[e.type], c = i && !e.hidden, m = !_(e.updateMode), s = `metadata.fields[${p}]`;
-  if (!c)
+  } = x(), [l, i] = h(!0), r = k[e.type], g = r && !e.hidden, m = !_(e.updateMode), s = `metadata.fields[${p}]`;
+  if (!g)
     return null;
   if (m)
     return /* @__PURE__ */ o(v, {
       fieldNamePrefix: s,
       fieldType: e.type,
-      children: /* @__PURE__ */ o(i, {
-        disableForm: a,
+      children: /* @__PURE__ */ o(r, {
+        description: e.description,
+        disableForm: n,
         fieldNamePrefix: s,
         label: e.displayName,
-        portalElement: n
+        portalElement: a
       })
     }, e.key);
   const {
     aiSuggestion: t,
     value: f
-  } = e, l = t && g;
+  } = e, c = t && l;
   return /* @__PURE__ */ F("div", {
     className: u.fieldWrapper,
-    children: [/* @__PURE__ */ o(i, {
-      className: S(l && u.hasSuggestion),
-      disableForm: a,
+    children: [/* @__PURE__ */ o(r, {
+      className: S(c && u.hasSuggestion),
+      description: e.description,
+      disableForm: n,
       fieldNamePrefix: `metadata.fields[${p}]`,
       label: e.displayName,
-      portalElement: n
-    }), l && /* @__PURE__ */ o(A, {
+      portalElement: a
+    }), c && /* @__PURE__ */ o(A, {
       aiSuggestion: t,
       onAiSuggestionAppend: () => {
         const y = e.type === "multiSelect" ? [f, t].flat() : t;
-        d(`${s}.value`, y), r(!1);
+        d(`${s}.value`, y), i(!1);
       },
-      onAiSuggestionIgnore: () => r(!1),
+      onAiSuggestionIgnore: () => i(!1),
       onAiSuggestionReplace: () => {
-        d(`${s}.value`, t), r(!1);
+        d(`${s}.value`, t), i(!1);
       }
     })]
   }, e.key);

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

@@ -1,26 +1,32 @@
-import { Focusable as c } from "@ariakit/react";
-import { Tooltip as a, Text as i } from "@box/blueprint-web";
+import "../../../../styles/interactive-text.css";
+import { Focusable as n } from "@ariakit/react";
+import { Tooltip as a, Text as s } from "@box/blueprint-web";
+import m from "clsx";
 import { jsx as t } from "react/jsx-runtime";
-const l = ({
+const x = "_interactiveText_2jv0p_1", l = {
+  interactiveText: x
+}, d = ({
   tooltipText: r,
-  children: o,
+  className: i,
+  children: c,
   ...e
 }) => {
   const {
-    as: n = "span"
+    as: o = "span"
   } = e;
   return /* @__PURE__ */ t(a, {
     __checkInteractivity: !1,
     content: r,
-    children: /* @__PURE__ */ t(c, {
-      render: /* @__PURE__ */ t(i, {
-        as: n,
+    children: /* @__PURE__ */ t(n, {
+      render: /* @__PURE__ */ t(s, {
+        as: o,
+        className: m(l.interactiveText, i),
         ...e,
-        children: o
+        children: c
       })
     })
   });
 };
 export {
-  l as default
+  d as default
 };

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

@@ -1,64 +1,71 @@
-import { DateI18nProvider as P, DatePicker as x } from "@box/blueprint-web";
-import { useFormikContext as F, getIn as T, Field as V } from "formik";
-import { useMemo as b } from "react";
-import { useIntl as A } from "react-intl";
-import { convertToDatePickerValue as C, convertToFormikValue as L } from "./date-conversion-utils.js";
-import { useDateInternationalization as I } from "./use-date-internationalization.js";
-import o from "../../../../messages.js";
-import { jsx as t } from "react/jsx-runtime";
-const q = ({
-  disableForm: c,
-  fieldNamePrefix: m,
-  label: i,
-  portalElement: d,
+import { DateI18nProvider as T, DatePicker as P } from "@box/blueprint-web";
+import { useFormikContext as F, getIn as V, Field as b } from "formik";
+import { useMemo as A } from "react";
+import { useIntl as C } from "react-intl";
+import { convertToDatePickerValue as I, convertToFormikValue as L } from "./date-conversion-utils.js";
+import { useDateInternationalization as w } from "./use-date-internationalization.js";
+import a from "../../../../messages.js";
+import N from "../../../interactive-text/interactive-text.js";
+import { jsx as o } from "react/jsx-runtime";
+const G = ({
+  description: s,
+  disableForm: m,
+  fieldNamePrefix: d,
+  label: r,
+  portalElement: f,
   className: u
 }) => {
-  const a = `${m}.value`, e = A(), {
-    values: f,
-    setFieldTouched: h,
-    setFieldValue: p
+  const t = `${d}.value`, e = C(), {
+    values: h,
+    setFieldTouched: p,
+    setFieldValue: D
   } = F(), {
-    localTimezone: D
-  } = I(e.locale), r = T(f, a), s = b(() => C(r), [r]);
-  console.log(0, r, s);
-  const M = {
-    clearDatePickerAriaLabel: e.formatMessage(o.clearSelectedDate),
-    nextMonthAriaLabel: e.formatMessage(o.switchToNextMonth),
-    openCalendarDropdownAriaLabel: e.formatMessage(o.openCalendar),
-    previousMonthAriaLabel: e.formatMessage(o.switchToNextMonth)
-  }, g = (l) => {
-    const n = L(l, D);
-    p(a, n);
-  }, k = () => {
-    h(a, !0);
+    localTimezone: M
+  } = w(e.locale), c = V(h, t), g = A(() => I(c), [c]), k = {
+    clearDatePickerAriaLabel: e.formatMessage(a.clearSelectedDate),
+    nextMonthAriaLabel: e.formatMessage(a.switchToNextMonth),
+    openCalendarDropdownAriaLabel: e.formatMessage(a.openCalendar),
+    previousMonthAriaLabel: e.formatMessage(a.switchToNextMonth)
+  }, v = (n) => {
+    const l = L(n, M);
+    D(t, l);
+  }, x = () => {
+    p(t, !0);
   };
-  return /* @__PURE__ */ t("div", {
-    "data-testid": `${i}-field`,
-    children: /* @__PURE__ */ t(P, {
+  return /* @__PURE__ */ o("div", {
+    "data-testid": `${r}-field`,
+    children: /* @__PURE__ */ o(T, {
       locale: e.locale,
-      children: /* @__PURE__ */ t(V, {
-        name: a,
+      children: /* @__PURE__ */ o(b, {
+        name: t,
         children: ({
-          field: l,
-          meta: n
-        }) => /* @__PURE__ */ t(x, {
-          ...l,
-          ...M,
-          calendarAriaLabel: e.formatMessage(o.selectDate),
+          field: n,
+          meta: l
+        }) => /* @__PURE__ */ o(P, {
+          ...n,
+          ...k,
+          calendarAriaLabel: e.formatMessage(a.selectDate),
           className: u,
-          error: n.error,
-          isDisabled: c,
-          label: i,
-          onBlur: () => k(),
-          onChange: (v) => g(v),
-          portalElement: d,
-          value: s
+          error: l.error,
+          isDisabled: m,
+          label: s ? ({
+            ...i
+          }) => N({
+            as: "span",
+            tooltipText: s,
+            children: r,
+            ...i
+          }) : r,
+          onBlur: () => x(),
+          onChange: (i) => v(i),
+          portalElement: f,
+          value: g
         })
       })
     })
   });
 };
 export {
-  q as MetadataDateField,
-  q as default
+  G as MetadataDateField,
+  G as default
 };

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

@@ -1,47 +1,56 @@
-import { Select as l, SELECT_EMPTY_VALUE as r } from "@box/blueprint-web";
-import { useFormikContext as x, getIn as E, Field as F } from "formik";
-import { useIntl as M, FormattedMessage as V } from "react-intl";
+import { Select as l, SELECT_EMPTY_VALUE as s } from "@box/blueprint-web";
+import { useFormikContext as E, getIn as F, Field as M } from "formik";
+import { useIntl as V, FormattedMessage as C } from "react-intl";
 import d from "../../../../messages.js";
-import { jsx as t, jsxs as C } from "react/jsx-runtime";
-const T = ({
-  className: m,
-  disableForm: i,
-  fieldNamePrefix: n,
-  label: o,
-  options: h,
-  portalElement: v
+import T from "../../../interactive-text/interactive-text.js";
+import { jsx as t, jsxs as I } from "react/jsx-runtime";
+const A = ({
+  className: i,
+  description: n,
+  disableForm: h,
+  fieldNamePrefix: c,
+  label: r,
+  options: v,
+  portalElement: p
 }) => {
   const {
-    setFieldValue: p,
-    values: g
-  } = x(), f = M(), c = `${n}.value`, s = h || E(g, `${n}.options`, []).map(({
+    setFieldValue: x,
+    values: f
+  } = E(), g = V(), m = `${c}.value`, o = v || F(f, `${c}.options`, []).map(({
     key: a
-  }) => a), u = f.formatMessage(d.selectValuePlaceholder);
+  }) => a), u = g.formatMessage(d.selectValuePlaceholder);
   return /* @__PURE__ */ t("div", {
-    "data-testid": `${o}-field`,
-    children: /* @__PURE__ */ t(F, {
-      name: c,
+    "data-testid": `${r}-field`,
+    children: /* @__PURE__ */ t(M, {
+      name: m,
       children: ({
         field: a
       }) => /* @__PURE__ */ t(l, {
-        className: m,
-        disabled: i,
-        label: o,
+        className: i,
+        disabled: h,
+        label: n ? ({
+          ...e
+        }) => T({
+          as: "label",
+          tooltipText: n,
+          children: r,
+          ...e
+        }) : r,
         onValueChange: (e) => {
-          p(c, e === r ? "" : e);
+          x(m, e === s ? "" : e);
         },
         placeholder: u,
         ...a,
-        value: a.value === r ? "" : a.value,
-        children: /* @__PURE__ */ C(l.Content, {
-          container: v,
+        value: a.value === s ? "" : a.value,
+        children: /* @__PURE__ */ I(l.Content, {
+          container: p,
           children: [/* @__PURE__ */ t(l.Option, {
             text: u,
-            value: r,
-            children: /* @__PURE__ */ t(V, {
+            value: s,
+            children: /* @__PURE__ */ t(C, {
               ...d.selectValuePlaceholder
             })
-          }), s == null ? void 0 : s.map((e) => /* @__PURE__ */ t(l.Option, {
+          }), o == null ? void 0 : o.map((e) => /* @__PURE__ */ t(l.Option, {
             text: e,
             value: e,
             children: e
@@ -52,6 +61,6 @@ const T = ({
   });
 };
 export {
-  T as MetadataEnumField,
-  T as default
+  A as MetadataEnumField,
+  A as default
 };

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

@@ -1,49 +1,58 @@
-import { TextInput as v } from "@box/blueprint-web";
-import { useFormikContext as g, getIn as x, Field as C } from "formik";
-import { useRef as T } from "react";
-import { fieldDefaultProps as V } from "../constants.js";
-import { useFloatValidation as $ } from "./use-float-validation.js";
-import { jsx as r } from "react/jsx-runtime";
-const D = ({
-  label: o,
-  fieldNamePrefix: l,
-  disableForm: n,
-  className: i
+import { TextInput as x } from "@box/blueprint-web";
+import { useFormikContext as T, getIn as g, Field as C } from "formik";
+import { useRef as I } from "react";
+import V from "../../../interactive-text/interactive-text.js";
+import { fieldDefaultProps as $ } from "../constants.js";
+import { useFloatValidation as B } from "./use-float-validation.js";
+import { jsx as a } from "react/jsx-runtime";
+const N = ({
+  className: i,
+  description: l,
+  label: r,
+  fieldNamePrefix: d,
+  disableForm: s
 }) => {
   const {
-    values: d,
-    setFieldValue: s,
-    setFieldTouched: u
-  } = g(), t = `${l}.value`, c = x(d, t), a = T(c), {
-    validateFloats: m
-  } = $(), f = (e) => {
-    a.current = e, s(t, e);
-  }, p = (e) => {
-    u(e, !0);
+    values: u,
+    setFieldValue: m,
+    setFieldTouched: c
+  } = T(), t = `${d}.value`, f = g(u, t), n = I(f), {
+    validateFloats: p
+  } = B(), h = (e) => {
+    n.current = e, m(t, e);
+  }, F = (e) => {
+    c(e, !0);
   };
-  return /* @__PURE__ */ r("div", {
-    "data-testid": `${o}-field`,
-    children: /* @__PURE__ */ r(C, {
+  return /* @__PURE__ */ a("div", {
+    "data-testid": `${r}-field`,
+    children: /* @__PURE__ */ a(C, {
       name: `${t}`,
-      validate: () => m(a.current),
+      validate: () => p(n.current),
       children: ({
         field: e,
-        meta: h
-      }) => /* @__PURE__ */ r(v, {
-        ...V,
+        meta: v
+      }) => /* @__PURE__ */ a(x, {
+        ...$,
         ...e,
         className: i,
-        disabled: n,
-        error: h.error,
-        label: o,
-        onBlur: () => p(t),
-        onChange: (F) => f(F.currentTarget.value),
+        disabled: s,
+        error: v.error,
+        label: l ? ({
+          ...o
+        }) => V({
+          as: "label",
+          tooltipText: l,
+          children: r,
+          ...o
+        }) : r,
+        onBlur: () => F(t),
+        onChange: (o) => h(o.currentTarget.value),
         placeholder: "0"
       })
     })
   });
 };
 export {
-  D as MetadataFloatField,
-  D as default
+  N as MetadataFloatField,
+  N as default
 };

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

@@ -1,45 +1,54 @@
-import { TooltipProvider as v, Combobox as F } from "@box/blueprint-web";
-import { useFormikContext as g, getIn as C, Field as x } from "formik";
-import { useIntl as M } from "react-intl";
-import $ from "../../../../messages.js";
-import { fieldDefaultProps as b } from "../constants.js";
+import { TooltipProvider as F, Combobox as g } from "@box/blueprint-web";
+import { useFormikContext as x, getIn as C, Field as b } from "formik";
+import { useIntl as I } from "react-intl";
+import M from "../../../../messages.js";
+import T from "../../../interactive-text/interactive-text.js";
+import { fieldDefaultProps as $ } from "../constants.js";
 import { jsx as o } from "react/jsx-runtime";
-const k = ({
+const O = ({
   className: s,
-  disableForm: a,
-  fieldNamePrefix: l,
-  label: r,
-  portalElement: n,
-  options: m
+  description: a,
+  disableForm: m,
+  fieldNamePrefix: i,
+  label: l,
+  portalElement: u,
+  options: d
 }) => {
   const {
-    setFieldValue: u,
-    values: d
-  } = g(), c = M(), i = `${l}.value`, p = m || C(d, `${l}.options`, []).map(({
+    setFieldValue: c,
+    values: p
+  } = x(), f = I(), n = `${i}.value`, h = d || C(p, `${i}.options`, []).map(({
     key: e
-  }) => e), f = (e, t) => t.toLowerCase().includes(e.toLowerCase());
+  }) => e), v = (e, t) => t.toLowerCase().includes(e.toLowerCase());
   return /* @__PURE__ */ o("div", {
-    "data-testid": `${r}-field`,
-    children: /* @__PURE__ */ o(x, {
-      name: i,
+    "data-testid": `${l}-field`,
+    children: /* @__PURE__ */ o(b, {
+      name: n,
       children: ({
         field: e
       }) => {
         var t;
-        return /* @__PURE__ */ o(v, {
-          children: /* @__PURE__ */ o(F, {
-            ...b,
+        return /* @__PURE__ */ o(F, {
+          children: /* @__PURE__ */ o(g, {
+            ...$,
             as: "input",
             className: s,
-            disabled: a,
-            filterFn: f,
-            label: r,
+            disabled: m,
+            filterFn: v,
+            label: a ? ({
+              ...r
+            }) => T({
+              as: "label",
+              tooltipText: a,
+              children: l,
+              ...r
+            }) : l,
             multiselect: !0,
             name: e.name,
-            onValueChange: (h) => u(i, h),
-            options: p,
-            placeholder: ((t = e.value) == null ? void 0 : t.length) === 0 ? c.formatMessage($.multiselectPlaceholder) : "",
-            portalElement: n,
+            onValueChange: (r) => c(n, r),
+            options: h,
+            placeholder: ((t = e.value) == null ? void 0 : t.length) === 0 ? f.formatMessage(M.multiselectPlaceholder) : "",
+            portalElement: u,
             value: e.value
           })
         });
@@ -48,6 +57,6 @@ const k = ({
   });
 };
 export {
-  k as MetadataMultiSelectField,
-  k as default
+  O as MetadataMultiSelectField,
+  O as default
 };

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

@@ -1,37 +1,46 @@
-import { TextInput as s } from "@box/blueprint-web";
-import { Field as f } from "formik";
-import { useIntl as n } from "react-intl";
-import p from "../../../../messages.js";
-import { fieldDefaultProps as c } from "../constants.js";
-import { jsx as e } from "react/jsx-runtime";
-const u = ({
-  label: r,
-  fieldNamePrefix: t,
-  disableForm: a,
-  className: o
+import { TextInput as n } from "@box/blueprint-web";
+import { Field as p } from "formik";
+import { useIntl as c } from "react-intl";
+import u from "../../../../messages.js";
+import h from "../../../interactive-text/interactive-text.js";
+import { fieldDefaultProps as x } from "../constants.js";
+import { jsx as t } from "react/jsx-runtime";
+const g = ({
+  description: r,
+  label: e,
+  fieldNamePrefix: a,
+  disableForm: o,
+  className: i
 }) => {
-  const i = n(), d = `${t}.value`;
-  return /* @__PURE__ */ e("div", {
-    "data-testid": `${r}-field`,
-    children: /* @__PURE__ */ e(f, {
+  const l = c(), d = `${a}.value`;
+  return /* @__PURE__ */ t("div", {
+    "data-testid": `${e}-field`,
+    children: /* @__PURE__ */ t(p, {
       name: d,
       children: ({
-        field: l,
-        meta: m
-      }) => /* @__PURE__ */ e(s, {
-        ...c,
-        ...l,
-        className: o,
-        disabled: a,
-        error: m.error,
-        label: r,
-        placeholder: i.formatMessage(p.setValuePlaceholder)
+        field: m,
+        meta: s
+      }) => /* @__PURE__ */ t(n, {
+        ...x,
+        ...m,
+        className: i,
+        disabled: o,
+        error: s.error,
+        label: r ? ({
+          ...f
+        }) => h({
+          as: "label",
+          tooltipText: r,
+          children: e,
+          ...f
+        }) : e,
+        placeholder: l.formatMessage(u.setValuePlaceholder)
       })
     })
   });
 };
-u.displayName = "MetadataStringField";
+g.displayName = "MetadataStringField";
 export {
-  u as MetadataStringField,
-  u as default
+  g as MetadataStringField,
+  g as default
 };

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

@@ -1,17 +1,16 @@
 import "../../../../../../styles/metadata-instance-entry.css";
 import { Text as o } from "@box/blueprint-web";
-import { FormattedDate as d } from "react-intl";
-import { convertISOStringToUTCDate as l } from "./convertDate.js";
-import y from "../../../interactive-text/interactive-text.js";
-import { jsxs as f, jsx as a } from "react/jsx-runtime";
-const I = "_metadataInstanceEntry_1qhk8_1", p = "_metadataInstanceEntryInteractiveLabel_1qhk8_7", c = {
-  metadataInstanceEntry: I,
-  metadataInstanceEntryInteractiveLabel: p
-}, _ = ({
-  description: r,
+import { FormattedDate as s } from "react-intl";
+import { convertISOStringToUTCDate as d } from "./convertDate.js";
+import f from "../../../interactive-text/interactive-text.js";
+import { jsxs as y, jsx as r } from "react/jsx-runtime";
+const l = "_metadataInstanceEntry_gwoh6_1", p = {
+  metadataInstanceEntry: l
+}, S = ({
+  description: a,
   name: e,
   shouldHideEmptyValues: i,
-  type: s,
+  type: c,
   value: t
 }) => {
   const n = (() => {
@@ -21,9 +20,9 @@ const I = "_metadataInstanceEntry_1qhk8_1", p = "_metadataInstanceEntryInteracti
       return null;
     if (Array.isArray(t))
       return t.join(", ");
-    if (s === "date" && typeof t == "string") {
-      const m = l(t);
-      return /* @__PURE__ */ a(d, {
+    if (c === "date" && typeof t == "string") {
+      const m = d(t);
+      return /* @__PURE__ */ r(s, {
         day: "numeric",
         month: "long",
         value: m,
@@ -32,26 +31,25 @@ const I = "_metadataInstanceEntry_1qhk8_1", p = "_metadataInstanceEntryInteracti
     }
     return t;
   })();
-  return i && !n ? null : /* @__PURE__ */ f("div", {
-    className: c.metadataInstanceEntry,
-    children: [/* @__PURE__ */ a(o, {
+  return i && !n ? null : /* @__PURE__ */ y("div", {
+    className: p.metadataInstanceEntry,
+    children: [/* @__PURE__ */ r(o, {
       as: "p",
       color: "textOnLightSecondary",
       variant: "bodyDefaultBold",
-      children: r ? /* @__PURE__ */ a(y, {
+      children: a ? /* @__PURE__ */ r(f, {
         as: "span",
-        className: c.metadataInstanceEntryInteractiveLabel,
         color: "textOnLightSecondary",
-        tooltipText: r,
+        tooltipText: a,
         variant: "bodyDefaultBold",
         children: e
       }) : e
-    }), n && /* @__PURE__ */ a(o, {
+    }), n && /* @__PURE__ */ r(o, {
       as: "p",
       children: n
     })]
   });
 };
 export {
-  _ as MetadataInstanceEntry
+  S as MetadataInstanceEntry
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@box/metadata-editor",
-  "version": "0.51.1",
+  "version": "0.51.2",
   "peerDependencies": {
     "@ariakit/react": "0.4.5",
     "@box/blueprint-web": "^7.20.0",
@@ -52,5 +52,5 @@
     "**/*.css"
   ],
   "license": "SEE LICENSE IN LICENSE",
-  "gitHead": "114a9fc84dfc0b21d45b6b647064e736ea022384"
+  "gitHead": "fd714816101aaeb678900361350e92c6372cd03f"
 }

package/styles/interactive-text.css

@@ -0,0 +1 @@
+._interactiveText_2jv0p_1{text-decoration:dashed underline var(--gray-50) .5px!important;text-underline-offset:2px;width:fit-content}._interactiveText_2jv0p_1:hover{color:var(--gray-100);text-decoration-color:var(--gray-100)!important}

package/styles/metadata-instance-entry.css

@@ -1 +1 @@
-._metadataInstanceEntry_1qhk8_1{display:flex;flex-direction:column;gap:var(--space-2)}._metadataInstanceEntryInteractiveLabel_1qhk8_7{text-decoration:dashed underline var(--gray-50) .5px!important;text-underline-offset:2px}._metadataInstanceEntryInteractiveLabel_1qhk8_7:hover{color:var(--gray-100);text-decoration-color:var(--gray-100)!important}
+._metadataInstanceEntry_gwoh6_1{display:flex;flex-direction:column;gap:var(--space-2)}

package/types/lib/components/interactive-text/interactive-text.d.ts

@@ -1,9 +1,10 @@
 import { type TextProps } from '@box/blueprint-web';
 export type InteractiveTextProps = TextProps & {
+    className?: string;
     tooltipText: string;
 };
 /**
  * Wrapper component for displaying tooltip content on focusing text nodes
  */
-declare const InteractiveText: ({ tooltipText, children, ...props }: InteractiveTextProps) => import("react/jsx-runtime").JSX.Element;
+declare const InteractiveText: ({ tooltipText, className, children, ...props }: InteractiveTextProps) => import("react/jsx-runtime").JSX.Element;
 export default InteractiveText;

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: ({ disableForm, fieldNamePrefix, label, portalElement, className, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataDateField: ({ description, disableForm, fieldNamePrefix, label, portalElement, className, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
 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, disableForm, fieldNamePrefix, label, options, portalElement, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataEnumField: ({ className, description, disableForm, fieldNamePrefix, label, options, portalElement, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
 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: ({ label, fieldNamePrefix, disableForm, className }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MetadataFloatField: ({ className, description, label, fieldNamePrefix, disableForm, }: MetadataFieldProps) => import("react/jsx-runtime").JSX.Element;
 export default MetadataFloatField;

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

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

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

@@ -1,6 +1,6 @@
 import { type MetadataFieldProps } from '../../types';
 export declare const MetadataStringField: {
-    ({ label, fieldNamePrefix, disableForm, className }: MetadataFieldProps): import("react/jsx-runtime").JSX.Element;
+    ({ description, label, fieldNamePrefix, disableForm, className, }: MetadataFieldProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default MetadataStringField;

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

@@ -4,6 +4,7 @@ export type TemplateInstanceProps = {
     portalElement?: HTMLElement;
 };
 export type MetadataFieldProps = {
+    description?: string | null;
     label: string;
     fieldNamePrefix: string;
     disableForm: boolean;

package/types/lib/test-utils/sample-data.d.ts

@@ -1,4 +1,4 @@
-import { type MetadataTemplate, type MetadataTemplateField, type MetadataTemplateInstance, type MetadataTemplateOption, type AutofillSuggestions } from '../types';
+import { type AutofillSuggestions, type MetadataTemplate, type MetadataTemplateField, type MetadataTemplateInstance, type MetadataTemplateOption } from '../types';
 declare const stringField: MetadataTemplateField;
 declare const dateField: MetadataTemplateField;
 declare const enumField: MetadataTemplateField;