@box/metadata-template-editor 1.21.12 → 1.22.1

package/README.md

@@ -11,7 +11,7 @@
 
 # metadata-template-editor
 
-This library was generated with @box/automation. General overview on how to perform tasks on the generated library can be found in [run-tasks](https://nx.dev/core-features/run-tasks) Nx documentation.
+This library was generated with [@box/automation](../../automation//README.md). General overview on how to perform tasks on the generated library can be found in [run-tasks](https://nx.dev/core-features/run-tasks) Nx documentation.
 
 ## Running commands
 
@@ -43,7 +43,7 @@ All commands used with Nx can be found in `project.json` file within your packag
 -   `nx test-jest metadata-template-editor` - runs jest unit tests, producing code coverage at the end.
 -   `nx sonar metadata-template-editor` - performs static analysis of code using SonarQube tooling, to detect bugs and code smells. Integrated as one of the steps in CI process.
 -   `nx chromatic metadata-template-editor` - uploads storybook build for review to [box chromatic](https://box.chromatic.com/) , and performs visual comparison of the UI changes against baseline.
--   `nx prepare metadata-template-editor` - command run during package publication process orchestrated by Lerna.
+-   `nx prepare metadata-template-editor` - command run during package publication process orchestrated by Nx Release.
 
 ## Ownership
 
@@ -51,7 +51,7 @@ Code of the feature belongs to metadata-experience. Responsibilities of owning t
 
 ## Translations
 
-For translations this package will be leveraging `@box/frontend` as it has the required scripts to do translations the Box way, for more information on this checkout their i18n docs.
+For translations this package will be leveraging `@box/frontend` as it has the required scripts to do translations the Box way, for more information on this checkout their i18n docs [here](https://git.dev.box.net/Box/frontend/tree/master/i18n)
 
-The `i18n/` dir is bundled with this package to enable the consuming app to use the translations included in this component it need to adjust it's TranslationsPlugin,
-see EUA's webpack.base.config.js and i18n.config.js for reference.
+The `i18n/` dir is bundled with this package to enable the consuming app to use the translations included in this component it need to adjust it's [TranslationsPlugin](https://git.dev.box.net/Box/frontend/blob/master/webpack/README.md#translationsplugin),
+see EUA's [webpack.base.config.js](https://git.dev.box.net/Box/EndUserApp/blob/master/conf/webpack/webpack.base.js#L270-L273) and [i18n.config.js](https://git.dev.box.net/Box/EndUserApp/blob/master/i18n.config.js) for reference.

package/dist/chunks/field-context-menu.js

@@ -6,73 +6,76 @@ import { Ellipsis as l } from "@box/blueprint-web-assets/icons/Fill";
 import u from "react";
 import { IconIconErrorOnLight as d } from "@box/blueprint-web-assets/tokens/tokens";
 import { ArrowDown as f, ArrowUp as p, Hidden as m, Trash as h, TwoFiles as g, Visible as _ } from "@box/blueprint-web-assets/icons/Line";
-import '../styles/field-context-menu.css';var v = {
+import v from "clsx";
+import '../styles/field-context-menu.css';var y = {
 	contextMenuTrigger: "_contextMenuTrigger_102vn_1",
 	menuItem: "_menuItem_102vn_5",
 	contextMenu: "_contextMenu_102vn_1",
 	divider: "_divider_102vn_14"
-}, y = ({ index: y, maxIndex: b, isHidden: x, onReorderFields: S, onToggleVisibility: C, onRequestDelete: w, onRequestDuplicate: T }) => {
-	let E = o(), [D, O] = u.useState(!1), k = u.useRef(null), A = () => {
-		y > 0 && S(y, y - 1);
-	}, j = () => {
-		S(y, y + 1);
+}, b = ({ className: b, index: x, maxIndex: S, isHidden: C, onReorderFields: w, onToggleVisibility: T, onRequestDelete: E, onRequestDuplicate: D, onOpenChange: O }) => {
+	let k = o(), [A, j] = u.useState(!1), M = u.useRef(null), N = (e) => {
+		j(e), O?.(e);
+	}, P = () => {
+		x > 0 && w(x, x - 1);
+	}, F = () => {
+		w(x, x + 1);
 	};
 	return /* @__PURE__ */ c(n.Root, {
-		open: D,
-		onOpenChange: O,
+		open: A,
+		onOpenChange: N,
 		modal: !1,
 		children: [/* @__PURE__ */ s(n.Trigger, {
-			className: v.contextMenuTrigger,
+			className: v(y.contextMenuTrigger, b),
 			children: /* @__PURE__ */ s(r, {
 				icon: l,
-				"aria-label": E.formatMessage(e.contextMenuAriaLabel),
+				"aria-label": k.formatMessage(e.contextMenuAriaLabel),
 				size: "large"
 			})
 		}), /* @__PURE__ */ c(n.Content, {
-			ref: k,
+			ref: M,
 			align: "end",
-			className: v.contextMenu,
+			className: y.contextMenu,
 			children: [
 				/* @__PURE__ */ s(n.Item, {
-					disabled: y === 0,
-					onClick: A,
-					"aria-label": E.formatMessage(e.moveUpAriaLabel),
+					disabled: x === 0,
+					onClick: P,
+					"aria-label": k.formatMessage(e.moveUpAriaLabel),
 					children: /* @__PURE__ */ c("div", {
-						className: v.menuItem,
+						className: y.menuItem,
 						children: [/* @__PURE__ */ s(p, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...e.moveUp })]
 					})
 				}),
 				/* @__PURE__ */ s(n.Item, {
-					disabled: y === b,
-					onClick: j,
-					"aria-label": E.formatMessage(e.moveDownAriaLabel),
+					disabled: x === S,
+					onClick: F,
+					"aria-label": k.formatMessage(e.moveDownAriaLabel),
 					children: /* @__PURE__ */ c("div", {
-						className: v.menuItem,
+						className: y.menuItem,
 						children: [/* @__PURE__ */ s(f, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...e.moveDown })]
 					})
 				}),
 				/* @__PURE__ */ s(n.Item, {
-					onClick: T,
-					"aria-label": E.formatMessage(e.duplicateFieldAriaLabel),
+					onClick: D,
+					"aria-label": k.formatMessage(e.duplicateFieldAriaLabel),
 					children: /* @__PURE__ */ c("div", {
-						className: v.menuItem,
+						className: y.menuItem,
 						children: [/* @__PURE__ */ s(g, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...e.duplicateField })]
 					})
 				}),
 				/* @__PURE__ */ s(n.Item, {
-					onClick: () => C(!x),
-					"aria-label": E.formatMessage(x ? e.showField : e.hideField),
+					onClick: () => T(!C),
+					"aria-label": k.formatMessage(C ? e.showField : e.hideField),
 					children: /* @__PURE__ */ c("div", {
-						className: v.menuItem,
-						children: [s(x ? _ : m, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...x ? e.showField : e.hideField })]
+						className: y.menuItem,
+						children: [s(C ? _ : m, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...C ? e.showField : e.hideField })]
 					})
 				}),
-				/* @__PURE__ */ s(t, { className: v.divider }),
+				/* @__PURE__ */ s(t, { className: y.divider }),
 				/* @__PURE__ */ s(n.Item, {
-					onClick: w,
-					"aria-label": E.formatMessage(e.deleteFieldAriaLabel),
+					onClick: E,
+					"aria-label": k.formatMessage(e.deleteFieldAriaLabel),
 					children: /* @__PURE__ */ c("div", {
-						className: v.menuItem,
+						className: y.menuItem,
 						children: [/* @__PURE__ */ s(h, {
 							color: d,
 							"aria-hidden": "true"
@@ -87,4 +90,4 @@ import '../styles/field-context-menu.css';var v = {
 		})]
 	});
 };
-export { y as t };
+export { b as t };

package/dist/chunks/metadata-field-configurator.module.js

@@ -1,18 +1,22 @@
 import '../styles/metadata-field-configurator.css';var e = {
-	fieldset: "_fieldset_1podr_1",
-	toolbarActions: "_toolbarActions_1podr_7",
-	extensionTabsContainer: "_extensionTabsContainer_1podr_13",
-	extensionContent: "_extensionContent_1podr_21",
-	fieldAccordionItem: "_fieldAccordionItem_1podr_25",
-	expandedToolbarActions: "_expandedToolbarActions_1podr_29",
-	dragHandle: "_dragHandle_1podr_38",
-	errorIcon: "_errorIcon_1podr_53",
-	validationErrors: "_validationErrors_1podr_59",
-	expandedContent: "_expandedContent_1podr_63",
-	basic: "_basic_1podr_69",
-	fieldTypeSelect: "_fieldTypeSelect_1podr_74",
-	typeSpecific: "_typeSpecific_1podr_78",
-	description: "_description_1podr_85",
-	labelWithTooltip: "_labelWithTooltip_1podr_90"
+	fieldset: "_fieldset_ireyr_1",
+	fieldAccordionItem: "_fieldAccordionItem_ireyr_7",
+	expandedContent: "_expandedContent_ireyr_11",
+	basic: "_basic_ireyr_17",
+	fieldTypeSelect: "_fieldTypeSelect_ireyr_22",
+	typeSpecific: "_typeSpecific_ireyr_26",
+	description: "_description_ireyr_33",
+	labelWithTooltip: "_labelWithTooltip_ireyr_38",
+	validationErrors: "_validationErrors_ireyr_49",
+	errorIcon: "_errorIcon_ireyr_53",
+	fieldActionSlot: "_fieldActionSlot_ireyr_59",
+	expandedToolbarActions: "_expandedToolbarActions_ireyr_65",
+	fieldCollapsedText: "_fieldCollapsedText_ireyr_71",
+	extensionTabsContainer: "_extensionTabsContainer_ireyr_76",
+	extensionContent: "_extensionContent_ireyr_82",
+	menuOpen: "_menuOpen_ireyr_94",
+	fieldContextMenu: "_fieldContextMenu_ireyr_97",
+	hiddenBadge: "_hiddenBadge_ireyr_112",
+	contextMenuWithCollapsedText: "_contextMenuWithCollapsedText_ireyr_115"
 };
 export { e as t };

package/dist/chunks/metadata-field-list.js

@@ -11,12 +11,12 @@ import { useIntl as l } from "react-intl";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 import { forwardRef as f, useCallback as p, useEffect as m, useImperativeHandle as h, useRef as g, useState as _ } from "react";
 import * as v from "yup";
+import y from "clsx";
 import ee from "lodash/cloneDeep";
-import y from "lodash/uniqueId";
-import { DndContext as te, DragOverlay as ne, KeyboardSensor as b, PointerSensor as re, TouchSensor as x, closestCenter as S, useSensor as C, useSensors as ie } from "@dnd-kit/core";
-import { SortableContext as ae, arrayMove as w, sortableKeyboardCoordinates as T, useSortable as E, verticalListSortingStrategy as oe } from "@dnd-kit/sortable";
-import { CSS as D } from "@dnd-kit/utilities";
-import O from "clsx";
+import b from "lodash/uniqueId";
+import { DndContext as te, DragOverlay as x, KeyboardSensor as S, PointerSensor as ne, TouchSensor as re, closestCenter as ie, useSensor as C, useSensors as w } from "@dnd-kit/core";
+import { SortableContext as T, arrayMove as E, sortableKeyboardCoordinates as ae, useSortable as D, verticalListSortingStrategy as oe } from "@dnd-kit/sortable";
+import { CSS as O } from "@dnd-kit/utilities";
 import '../styles/metadata-field-list.css';var k = {
 	fieldList: "_fieldList_18x5c_1",
 	fieldItem: "_fieldItem_18x5c_11",
@@ -28,15 +28,15 @@ function j(e) {
 }
 var M = 150;
 function N({ field: e, index: t, maxIndex: n, isExpanded: r, onChangeField: i, onDeleteAtIndex: a, onDuplicateAtIndex: o, onReorderFields: c, onRequestExpand: l, submitAttemptCount: d }) {
-	let f = j(e), { attributes: p, listeners: m, setNodeRef: h, transform: g, transition: _, isDragging: v } = E({ id: f });
+	let f = j(e), { attributes: p, listeners: m, setNodeRef: h, transform: g, transition: _, isDragging: v } = D({ id: f });
 	return /* @__PURE__ */ u("li", {
 		ref: h,
 		style: {
-			transform: D.Translate.toString(g),
+			transform: O.Translate.toString(g),
 			transition: _
 		},
 		"data-field-id": f,
-		className: O(k.fieldItem, { [k.dragging]: v }),
+		className: y(k.fieldItem, { [k.dragging]: v }),
 		children: /* @__PURE__ */ u(s, {
 			values: e,
 			onValuesChange: i,
@@ -57,7 +57,7 @@ function N({ field: e, index: t, maxIndex: n, isExpanded: r, onChangeField: i, o
 		})
 	});
 }
-var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteFieldAtIndex: E, onDuplicateField: D, taxonomyOptions: O, fetchTaxonomies: P, firstInvalidFieldIndex: F, submitAttemptCount: I, fieldExtensions: L, onValidationChange: R }, z) {
+var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteFieldAtIndex: y, onDuplicateField: D, taxonomyOptions: O, fetchTaxonomies: P, firstInvalidFieldIndex: F, submitAttemptCount: I, fieldExtensions: L, onValidationChange: R }, z) {
 	let { formatMessage: B } = l(), V = o(P, O), H = g(null), U = g(null), W = g(new Set(s.map((e) => j(e)))), G = r(), K = g(null);
 	m(() => {
 		K.current = null;
@@ -117,17 +117,17 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 		}, M);
 		return () => clearTimeout(t);
 	}, [q]);
-	let [Y, X] = _(null), se = ie(C(re, { activationConstraint: { distance: 8 } }), C(x, { activationConstraint: {
+	let [Y, X] = _(null), se = w(C(ne, { activationConstraint: { distance: 8 } }), C(re, { activationConstraint: {
 		delay: 250,
 		tolerance: 5
-	} }), C(b, { coordinateGetter: T })), ce = p((e) => {
+	} }), C(S, { coordinateGetter: ae })), ce = p((e) => {
 		X(String(e.active.id));
 	}, []), le = p((e) => {
 		X(null);
 		let { active: t, over: n } = e;
 		if (n && t.id !== n.id) {
 			let e = s.findIndex((e) => j(e) === t.id), r = s.findIndex((e) => j(e) === n.id);
-			e !== -1 && r !== -1 && f?.(w(s, e, r));
+			e !== -1 && r !== -1 && f?.(E(s, e, r));
 		}
 	}, [s, f]), ue = p(() => {
 		X(null);
@@ -135,16 +135,16 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 		f?.(s.map((n, r) => r === e ? t : n));
 	}, [s, f]), fe = p((e) => {
 		let t = s[e], n = j(t);
-		J((e) => e === n ? null : e), f?.(s.filter((t, n) => n !== e)), E?.(e, t);
+		J((e) => e === n ? null : e), f?.(s.filter((t, n) => n !== e)), y?.(e, t);
 	}, [
 		s,
 		f,
-		E
+		y
 	]), pe = p((t) => {
 		let n = s[t], r = ee(n);
-		r.id = y("field-"), r.key = "", r.isFieldNew = !0, r.type === e.Dropdown && (r.dropdown.options = r.dropdown.options.map((e) => ({
+		r.id = b("field-"), r.key = "", r.isFieldNew = !0, r.type === e.Dropdown && (r.dropdown.options = r.dropdown.options.map((e) => ({
 			...e,
-			id: y()
+			id: b()
 		})));
 		let i = [...s];
 		i.splice(t + 1, 0, r), f?.(i), D?.(r);
@@ -153,7 +153,7 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 		f,
 		D
 	]), me = p((e, t) => {
-		t < 0 || t >= s.length || f?.(w(s, e, t));
+		t < 0 || t >= s.length || f?.(E(s, e, t));
 	}, [s, f]), he = p((e) => {
 		let t = e || null;
 		J(t), t && setTimeout(() => {
@@ -169,7 +169,7 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 		value: V,
 		children: /* @__PURE__ */ d(te, {
 			sensors: se,
-			collisionDetection: S,
+			collisionDetection: ie,
 			onDragStart: ce,
 			onDragEnd: le,
 			onDragCancel: ue,
@@ -180,7 +180,7 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 					collapsible: !0,
 					value: q ?? "",
 					onValueChange: he,
-					children: /* @__PURE__ */ u(ae, {
+					children: /* @__PURE__ */ u(T, {
 						items: ge,
 						strategy: oe,
 						children: /* @__PURE__ */ u("ul", {
@@ -204,7 +204,7 @@ var P = /* @__PURE__ */ f(function({ fields: s, onChangeFields: f, onDeleteField
 						})
 					})
 				})
-			}), /* @__PURE__ */ u(ne, {
+			}), /* @__PURE__ */ u(x, {
 				dropAnimation: null,
 				children: Z && Q ? /* @__PURE__ */ u(c, {
 					type: "single",

package/dist/chunks/metadata-template-editor-form.js

@@ -1,8 +1,8 @@
 import { t as e } from "./field-selector.js";
 import { t } from "./field-type-dropdown.js";
 import { FieldTypeTiles as n } from "../esm/lib/components/field-type-tiles/field-type-tiles.js";
-import { FieldExtensionsContext as r } from "../esm/lib/components/metadata-field-configurator/context/field-extensions-context.js";
-import { createDefaultFieldValues as i } from "../esm/lib/components/metadata-field-configurator/utils.js";
+import { createDefaultFieldValues as r } from "../esm/lib/components/metadata-field-configurator/utils.js";
+import { FieldExtensionsContext as i } from "../esm/lib/components/metadata-field-configurator/context/field-extensions-context.js";
 import { t as a } from "./metadata-field-list.js";
 import o from "../esm/lib/messages.js";
 import { Button as s, Link as c, Text as l, TextInput as u } from "@box/blueprint-web";
@@ -22,7 +22,7 @@ import '../styles/metadata-template-editor-form.css';var x = {
 		let e = F.fields.findIndex(Boolean);
 		return e >= 0 ? e : null;
 	}, [F.fields]), q = (e) => {
-		let t = i(e.type);
+		let t = r(e.type);
 		L("fields", [...I.fields, t]);
 	}, J = (e) => {
 		L("fields", e);
@@ -99,7 +99,7 @@ import '../styles/metadata-template-editor-form.css';var x = {
 			})
 		]
 	});
-	return N === void 0 ? X : /* @__PURE__ */ m(r.Provider, {
+	return N === void 0 ? X : /* @__PURE__ */ m(i.Provider, {
 		value: N,
 		children: X
 	});

package/dist/chunks/sortable-option-list.js

@@ -1,17 +1,17 @@
-import { useFieldConfigurator as e } from "../esm/lib/components/metadata-field-configurator/context/field-configurator-context.js";
-import t from "../esm/lib/components/metadata-field-configurator/messages/dropdown-messages.js";
-import n from "../esm/lib/components/metadata-field-configurator/components/confirmation-modal/confirmation-modal.js";
+import e from "../esm/lib/components/metadata-field-configurator/components/confirmation-modal/confirmation-modal.js";
+import { useFieldConfigurator as t } from "../esm/lib/components/metadata-field-configurator/context/field-configurator-context.js";
+import n from "../esm/lib/components/metadata-field-configurator/messages/dropdown-messages.js";
 import { IconButton as r, TextInput as i } from "@box/blueprint-web";
 import { useIntl as a } from "react-intl";
 import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
 import { DragDots as l } from "@box/blueprint-web-assets/icons/Fill";
 import { useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
-import m from "lodash/uniqueId";
-import { Trash as h } from "@box/blueprint-web-assets/icons/Line";
-import { DndContext as g, DragOverlay as _, KeyboardSensor as v, PointerSensor as y, TouchSensor as b, closestCenter as x, useSensor as S, useSensors as C } from "@dnd-kit/core";
-import { SortableContext as ee, arrayMove as w, sortableKeyboardCoordinates as T, useSortable as E, verticalListSortingStrategy as te } from "@dnd-kit/sortable";
-import { CSS as D } from "@dnd-kit/utilities";
-import O from "clsx";
+import { Trash as m } from "@box/blueprint-web-assets/icons/Line";
+import h from "clsx";
+import g from "lodash/uniqueId";
+import { DndContext as _, DragOverlay as v, KeyboardSensor as y, PointerSensor as b, TouchSensor as x, closestCenter as S, useSensor as C, useSensors as w } from "@dnd-kit/core";
+import { SortableContext as ee, arrayMove as T, sortableKeyboardCoordinates as te, useSortable as E, verticalListSortingStrategy as D } from "@dnd-kit/sortable";
+import { CSS as O } from "@dnd-kit/utilities";
 import '../styles/sortable-option-list.css';var k = {
 	sortableOptionList: "_sortableOptionList_1cieq_1",
 	option: "_option_1cieq_9",
@@ -32,24 +32,24 @@ function ne(e, t, n, r, i, a) {
 	}
 	return o;
 }
-function re({ option: e, index: t, isFieldReadOnly: n, onInputChange: a, onDelete: o, onInputRef: u, error: d, handleBlur: f, canDelete: p, dragAriaLabel: m, inputPlaceholder: g, deleteAriaLabel: _ }) {
-	let { attributes: v, listeners: y, setNodeRef: b, transform: x, transition: S, isDragging: C } = E({ id: e.id });
+function re({ option: e, index: t, isFieldReadOnly: n, onInputChange: a, onDelete: o, onInputRef: u, error: d, handleBlur: f, canDelete: p, dragAriaLabel: g, inputPlaceholder: _, deleteAriaLabel: v }) {
+	let { attributes: y, listeners: b, setNodeRef: x, transform: S, transition: C, isDragging: w } = E({ id: e.id });
 	return /* @__PURE__ */ c("li", {
-		ref: b,
+		ref: x,
 		style: {
-			transform: D.Translate.toString(x),
-			transition: S
+			transform: O.Translate.toString(S),
+			transition: C
 		},
-		className: O(k.option, {
-			[k.dragging]: C,
+		className: h(k.option, {
+			[k.dragging]: w,
 			[k.editable]: !n
 		}),
 		children: [
 			!n && /* @__PURE__ */ s("div", {
 				className: k.dragHandle,
+				...b,
 				...y,
-				...v,
-				"aria-label": m,
+				"aria-label": g,
 				tabIndex: -1,
 				children: /* @__PURE__ */ s(l, {
 					fontSize: 20,
@@ -58,8 +58,8 @@ function re({ option: e, index: t, isFieldReadOnly: n, onInputChange: a, onDelet
 			}),
 			/* @__PURE__ */ s(i, {
 				disabled: n,
-				placeholder: g,
-				label: g,
+				placeholder: _,
+				label: _,
 				hideLabel: !0,
 				onBlur: f,
 				id: `dropdown.options.${t}.key`,
@@ -74,8 +74,8 @@ function re({ option: e, index: t, isFieldReadOnly: n, onInputChange: a, onDelet
 				className: k.deleteButtonContainer,
 				children: /* @__PURE__ */ s(r, {
 					onClick: () => o(e),
-					"aria-label": _,
-					icon: h,
+					"aria-label": v,
+					icon: m,
 					size: "x-small",
 					variant: "default",
 					tabIndex: -1,
@@ -87,11 +87,11 @@ function re({ option: e, index: t, isFieldReadOnly: n, onInputChange: a, onDelet
 		]
 	});
 }
-function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
-	let { formatMessage: A } = a(), { values: j, errors: ie, touched: M, setFieldValue: N, setFieldTouched: ae, setTouched: P, handleBlur: oe } = e(), F = C(S(y, { activationConstraint: { distance: 8 } }), S(b, { activationConstraint: {
+function A({ shouldFocusLastOption: E = !1, onFocusConsumed: O }) {
+	let { formatMessage: A } = a(), { values: j, errors: ie, touched: M, setFieldValue: N, setFieldTouched: ae, setTouched: P, handleBlur: oe } = t(), F = w(C(b, { activationConstraint: { distance: 8 } }), C(x, { activationConstraint: {
 		delay: 250,
 		tolerance: 5
-	} }), S(v, { coordinateGetter: T })), { options: I } = j.dropdown, { isFieldReadOnly: L } = j, [R, z] = p(I), [B, V] = p(null), H = f(null), [U, W] = p(null), [G, K] = p(!1), [q, J] = p(null);
+	} }), C(y, { coordinateGetter: te })), { options: I } = j.dropdown, { isFieldReadOnly: L } = j, [R, z] = p(I), [B, V] = p(null), H = f(null), [U, W] = p(null), [G, K] = p(!1), [q, J] = p(null);
 	d(() => {
 		z(I);
 	}, [I]), d(() => () => {
@@ -119,7 +119,7 @@ function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
 		r?.options && (r.options = r.options.filter((t, n) => R[n]?.id !== e)), P(n), t.length === 0 && N("dropdown", {
 			...j.dropdown,
 			options: [{
-				id: m(),
+				id: g(),
 				key: "",
 				isNew: !0
 			}]
@@ -136,57 +136,57 @@ function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
 		if (n && t.id !== n.id) {
 			let e = R.findIndex((e) => e.id === t.id), r = R.findIndex((e) => e.id === n.id);
 			if (e !== -1 && r !== -1) {
-				let t = w(R, e, r);
+				let t = T(R, e, r);
 				z(t), Y(t);
 				let n = M?.dropdown?.options;
 				n && n.length > 0 && P({
 					...M,
 					dropdown: {
 						...M.dropdown ?? {},
-						options: w(n, e, r)
+						options: T(n, e, r)
 					}
 				});
 			}
 		}
 	}, de = u((e, t) => {
 		e && E && t === R.length - 1 && (H.current && clearTimeout(H.current), H.current = setTimeout(() => {
-			e.focus(), D(), H.current = null;
+			e.focus(), O(), H.current = null;
 		}, 0));
 	}, [
 		E,
-		D,
+		O,
 		R.length
 	]), $ = U ? R.find((e) => e.id === U) : null;
-	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ c(g, {
+	return /* @__PURE__ */ c(o, { children: [/* @__PURE__ */ c(_, {
 		sensors: F,
-		collisionDetection: x,
+		collisionDetection: S,
 		onDragStart: le,
 		onDragEnd: Q,
 		onDragCancel: ue,
 		children: [/* @__PURE__ */ s(ee, {
 			items: R.map((e) => e.id),
-			strategy: te,
+			strategy: D,
 			children: /* @__PURE__ */ s("ul", {
 				className: k.sortableOptionList,
-				children: R.map((e, n) => /* @__PURE__ */ s(re, {
+				children: R.map((e, t) => /* @__PURE__ */ s(re, {
 					option: e,
-					index: n,
+					index: t,
 					isFieldReadOnly: !!L,
 					onInputChange: se,
 					onDelete: ce,
 					onInputRef: de,
-					error: ne(ie, M, n, e, R, B),
+					error: ne(ie, M, t, e, R, B),
 					handleBlur: oe,
 					canDelete: R.length >= 2,
-					dragAriaLabel: A(t.dragAndDropOptionAriaLabel),
-					inputPlaceholder: A(t.addAnOptionOptionPlaceholder),
-					deleteAriaLabel: A(t.deleteDropdownOptionAriaLabel)
+					dragAriaLabel: A(n.dragAndDropOptionAriaLabel),
+					inputPlaceholder: A(n.addAnOptionOptionPlaceholder),
+					deleteAriaLabel: A(n.deleteDropdownOptionAriaLabel)
 				}, e.id))
 			})
-		}), /* @__PURE__ */ s(_, {
+		}), /* @__PURE__ */ s(v, {
 			dropAnimation: null,
 			children: $ ? /* @__PURE__ */ c("li", {
-				className: O(k.option, k.optionDragOverlay, { [k.editable]: !L }),
+				className: h(k.option, k.optionDragOverlay, { [k.editable]: !L }),
 				children: [
 					!L && /* @__PURE__ */ s("div", {
 						className: k.dragHandle,
@@ -197,8 +197,8 @@ function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
 					}),
 					/* @__PURE__ */ s(i, {
 						disabled: L,
-						placeholder: A(t.addAnOptionOptionPlaceholder),
-						label: A(t.addAnOptionOptionPlaceholder),
+						placeholder: A(n.addAnOptionOptionPlaceholder),
+						label: A(n.addAnOptionOptionPlaceholder),
 						hideLabel: !0,
 						id: "drag-overlay-option",
 						name: "drag-overlay-option",
@@ -208,7 +208,7 @@ function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
 					!L && /* @__PURE__ */ s("div", {
 						className: k.deleteButtonContainer,
 						children: /* @__PURE__ */ s(r, {
-							icon: h,
+							icon: m,
 							size: "x-small",
 							variant: "default",
 							tabIndex: -1,
@@ -221,11 +221,11 @@ function A({ shouldFocusLastOption: E = !1, onFocusConsumed: D }) {
 				]
 			}) : null
 		})]
-	}), G && /* @__PURE__ */ s(n, {
+	}), G && /* @__PURE__ */ s(e, {
 		onClose: X,
 		onConfirm: () => Z(q?.id ?? null),
-		title: A(t.deleteOptionTitle, { optionName: q?.key ?? "" }),
-		body: A(t.deleteOptionDescription)
+		title: A(n.deleteOptionTitle, { optionName: q?.key ?? "" }),
+		body: A(n.deleteOptionDescription)
 	})] });
 }
 export { A as t };

package/dist/esm/index.js

@@ -3,11 +3,11 @@ import { a as t, c as n, i as r, l as i, n as a, o, r as s, s as c, t as l } fro
 import { t as u } from "../chunks/field-type-dropdown.js";
 import { FieldTypeTiles as d } from "./lib/components/field-type-tiles/field-type-tiles.js";
 import { useTemplateFieldSchema as f } from "./lib/components/metadata-field-configurator/hooks/useTemplateFieldSchema.js";
-import { FieldExtensionsContext as p, useFieldExtensions as m } from "./lib/components/metadata-field-configurator/context/field-extensions-context.js";
-import { createDefaultFieldValues as h } from "./lib/components/metadata-field-configurator/utils.js";
+import { createDefaultFieldValues as p } from "./lib/components/metadata-field-configurator/utils.js";
+import { FieldExtensionsContext as m, useFieldExtensions as h } from "./lib/components/metadata-field-configurator/context/field-extensions-context.js";
 import { MetadataFieldConfigurator as g } from "./lib/components/metadata-field-configurator/metadata-field-configurator.js";
 import { t as _ } from "../chunks/metadata-field-list.js";
 import { t as v } from "../chunks/metadata-template-editor.js";
 import { t as y } from "../chunks/metadata-template-editor-modal.js";
 import "./lib/components/metadata-template-editor-modal/index.js";
-export { l as AllOps, a as ApiMetadataTemplateFieldType, s as EnumOperations, p as FieldExtensionsContext, r as FieldOperations, e as FieldSelector, t as FieldType, u as FieldTypeDropdown, d as FieldTypeTiles, g as MetadataFieldConfigurator, _ as MetadataFieldList, _ as MetadataFieldListDefault, v as MetadataTemplateEditor, y as MetadataTemplateEditorModal, o as MetadataTemplateEditorMode, c as MultiSelectOperations, n as TaxonomySelection, i as TemplateOperations, h as createDefaultFieldValues, m as useFieldExtensions, f as useTemplateFieldSchema };
+export { l as AllOps, a as ApiMetadataTemplateFieldType, s as EnumOperations, m as FieldExtensionsContext, r as FieldOperations, e as FieldSelector, t as FieldType, u as FieldTypeDropdown, d as FieldTypeTiles, g as MetadataFieldConfigurator, _ as MetadataFieldList, _ as MetadataFieldListDefault, v as MetadataTemplateEditor, y as MetadataTemplateEditorModal, o as MetadataTemplateEditorMode, c as MultiSelectOperations, n as TaxonomySelection, i as TemplateOperations, p as createDefaultFieldValues, h as useFieldExtensions, f as useTemplateFieldSchema };