@box/metadata-template-editor 1.20.9 → 1.20.10

package/dist/chunks/chip.js

@@ -0,0 +1,21 @@
+import e from "../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";
+import { Text as t } from "@box/blueprint-web";
+import { useIntl as n } from "react-intl";
+import { jsx as r } from "react/jsx-runtime";
+import i from "clsx";
+import '../styles/chip.css';var a = {
+	chip: "_chip_x2zx9_1",
+	selected: "_selected_x2zx9_12"
+}, o = /* @__PURE__ */ function(e) {
+	return e.Selected = "selected", e.Unselected = "unselected", e;
+}({}), s = ({ value: s, selected: c = !1 }) => {
+	let { formatMessage: l } = n(), u = l(c ? e.chipSelected : e.chipNotSelected);
+	return /* @__PURE__ */ r(t, {
+		as: "span",
+		className: i(a.chip, { [a.selected]: c }),
+		"data-state": c ? o.Selected : o.Unselected,
+		"aria-label": `${s}: ${u}`,
+		children: s
+	});
+};
+export { o as n, s as t };

package/dist/chunks/dropdown-field-configuration.js

@@ -0,0 +1,62 @@
+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 { t as n } from "./sortable-option-list.js";
+import { InlineNotice as r, Switch as i, TextButton as a } from "@box/blueprint-web";
+import { useIntl as o } from "react-intl";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+import { useCallback as l, useEffect as u, useState as d } from "react";
+import f from "lodash/uniqueId";
+import '../styles/dropdown-field-configuration.css';var p = {
+	dropdownFieldConfiguration: "_dropdownFieldConfiguration_rjv8w_1",
+	addOptionButton: "_addOptionButton_rjv8w_7"
+}, m = () => {
+	let { formatMessage: m } = o(), { values: h, errors: g, touched: _, setFieldValue: v } = e(), [y, b] = d(!1), x = h.dropdown.options.length > 0, S = g.dropdown, C = _.dropdown, w = S?.options?.some((e, t) => e?.key && C?.options?.[t]), T = l((e = !1) => {
+		v("dropdown", {
+			...h.dropdown,
+			options: [...h.dropdown.options, {
+				id: f(),
+				key: "",
+				isNew: !0
+			}]
+		}), b(e);
+	}, [h.dropdown, v]), E = l(() => {
+		T(!0);
+	}, [T]);
+	u(() => {
+		x || T(!1);
+	}, [x, T]);
+	let D = l(() => {
+		b(!1);
+	}, []);
+	return /* @__PURE__ */ c("div", {
+		className: p.dropdownFieldConfiguration,
+		children: [
+			w && /* @__PURE__ */ s(r, {
+				variant: "error",
+				variantIconAriaLabel: m(t.optionListValidationError),
+				children: m(t.optionListValidationError)
+			}),
+			x && /* @__PURE__ */ s(n, {
+				shouldFocusLastOption: y,
+				onFocusConsumed: D
+			}),
+			/* @__PURE__ */ s(a, {
+				className: p.addOptionButton,
+				onClick: E,
+				children: m(t.addOption)
+			}),
+			/* @__PURE__ */ s(i.Item, {
+				name: "dropdown.allowMultipleSelections",
+				checked: h.dropdown.allowMultipleSelections,
+				disabled: !h.isFieldNew || h.isFieldReadOnly,
+				label: m(t.allowMultipleSelection),
+				onCheckedChange: (e) => v("dropdown", {
+					...h.dropdown,
+					allowMultipleSelections: e
+				}),
+				value: "true"
+			})
+		]
+	});
+};
+export { m as t };

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

@@ -0,0 +1,90 @@
+import { general as e } from "../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";
+import { Divider as t, DropdownMenu as n, IconButton as r, Text as i } from "@box/blueprint-web";
+import { FormattedMessage as a, useIntl as o } from "react-intl";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+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 = {
+	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);
+	};
+	return /* @__PURE__ */ c(n.Root, {
+		open: D,
+		onOpenChange: O,
+		modal: !1,
+		children: [/* @__PURE__ */ s(n.Trigger, {
+			className: v.contextMenuTrigger,
+			children: /* @__PURE__ */ s(r, {
+				icon: l,
+				"aria-label": E.formatMessage(e.contextMenuAriaLabel),
+				size: "large"
+			})
+		}), /* @__PURE__ */ c(n.Content, {
+			ref: k,
+			align: "end",
+			className: v.contextMenu,
+			children: [
+				/* @__PURE__ */ s(n.Item, {
+					disabled: y === 0,
+					onClick: A,
+					"aria-label": E.formatMessage(e.moveUpAriaLabel),
+					children: /* @__PURE__ */ c("div", {
+						className: v.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),
+					children: /* @__PURE__ */ c("div", {
+						className: v.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),
+					children: /* @__PURE__ */ c("div", {
+						className: v.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),
+					children: /* @__PURE__ */ c("div", {
+						className: v.menuItem,
+						children: [s(x ? _ : m, { "aria-hidden": "true" }), /* @__PURE__ */ s(a, { ...x ? e.showField : e.hideField })]
+					})
+				}),
+				/* @__PURE__ */ s(t, { className: v.divider }),
+				/* @__PURE__ */ s(n.Item, {
+					onClick: w,
+					"aria-label": E.formatMessage(e.deleteFieldAriaLabel),
+					children: /* @__PURE__ */ c("div", {
+						className: v.menuItem,
+						children: [/* @__PURE__ */ s(h, {
+							color: d,
+							"aria-hidden": "true"
+						}), /* @__PURE__ */ s(i, {
+							as: "span",
+							color: "textOnLightError",
+							children: /* @__PURE__ */ s(a, { ...e.deleteField })
+						})]
+					})
+				})
+			]
+		})]
+	});
+};
+export { y as t };

package/dist/chunks/field-selector.js

@@ -0,0 +1,23 @@
+import e from "../esm/lib/components/field-selector/messages.js";
+import { DropdownMenu as t, TextButton as n } from "@box/blueprint-web";
+import { useIntl as r } from "react-intl";
+import { ChevronDown as i } from "@box/blueprint-web-assets/icons/Medium";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import '../styles/field-selector.css';var s = { fieldSelectorTrigger: "_fieldSelectorTrigger_cj5ij_1" };
+function c({ fields: c, onSelect: l }) {
+	let { formatMessage: u } = r();
+	return /* @__PURE__ */ o(t.Root, {
+		modal: !1,
+		children: [/* @__PURE__ */ a(t.Trigger, { children: /* @__PURE__ */ a(n, {
+			icon: i,
+			className: s.fieldSelectorTrigger,
+			variant: "bodyDefaultSemibold",
+			color: "textOnLightSecondary",
+			children: u(e.selectField)
+		}) }), /* @__PURE__ */ a(t.Content, { children: c.map((n) => /* @__PURE__ */ a(t.Item, {
+			onClick: () => l(n.id),
+			children: /* @__PURE__ */ a(t.Item.MainContent, { label: n.name || u(e.unnamedField) })
+		}, n.id)) })]
+	});
+}
+export { c as t };

package/dist/chunks/field-type-dropdown.js

@@ -0,0 +1,31 @@
+import { useFieldOptions as e } from "../esm/lib/utils/field-options/useFieldOptions.js";
+import { fieldTypeDropdownMessages as t } from "../esm/lib/components/field-type-dropdown/messages.js";
+import { Button as n, DropdownMenu as r } from "@box/blueprint-web";
+import { useIntl as i } from "react-intl";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Plus as s } from "@box/blueprint-web-assets/icons/Fill";
+import '../styles/field-type-dropdown.css';var c = { addField: "_addField_1bl6g_1" };
+function l({ onFieldAdd: l, trigger: u }) {
+	let { formatMessage: d } = i(), f = e();
+	return /* @__PURE__ */ o(r.Root, {
+		modal: !1,
+		children: [/* @__PURE__ */ a(r.Trigger, { children: u ?? /* @__PURE__ */ a(n, {
+			className: c.addField,
+			variant: "secondary",
+			size: "large",
+			startIcon: s,
+			"aria-label": d(t.addFieldAriaLabel),
+			children: d(t.addField)
+		}) }), /* @__PURE__ */ a(r.Content, { children: f.availableFieldTypes.map((e) => /* @__PURE__ */ o(r.Item, {
+			onClick: () => l(e),
+			children: [/* @__PURE__ */ a(r.Item.StartElement, { children: /* @__PURE__ */ a(e.Icon, {
+				fontSize: "15px",
+				"aria-hidden": "true"
+			}) }), /* @__PURE__ */ a(r.Item.MainContent, {
+				caption: e.description,
+				label: String(e.label)
+			})]
+		}, e.type)) })]
+	});
+}
+export { l as t };

package/dist/chunks/levels-chain.js

@@ -0,0 +1,125 @@
+import e from "../esm/lib/components/metadata-field-configurator/messages/levels-chain-messages.js";
+import { t } from "./chip.js";
+import { getHideCounts as n } from "../esm/lib/components/metadata-field-configurator/components/levels-chain/utils.js";
+import { Text as r, Tooltip as i } from "@box/blueprint-web";
+import { FormattedMessage as a } from "react-intl";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { useEffect as c, useLayoutEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import { IconIconOnLightSecondary as p } from "@box/blueprint-web-assets/tokens/tokens";
+import { ArrowRight as m } from "@box/blueprint-web-assets/icons/Line";
+import '../styles/levels-chain.css';var h = {
+	levelsChain: "_levelsChain_1wuki_1",
+	hiddenLevelsButton: "_hiddenLevelsButton_1wuki_11"
+};
+function g(e) {
+	let t = Math.ceil(e.length / 2);
+	return [e.slice(0, t), e.slice(t)];
+}
+var _ = ({ levels: _ = [], selectedLevels: v = [] }) => {
+	let [y, b] = g(_), [x, S] = f(!1), [C, w] = f([]), [T, E] = f([]), [D, O] = f(0), [k, A] = f(0), j = d(null), M = d(null), N = u(() => {
+		let e = j.current ? window.getComputedStyle(j.current) : { gap: "11px" };
+		return parseInt(e.gap, 10);
+	}, [j.current]), P = /* @__PURE__ */ o(m, {
+		color: p,
+		"aria-hidden": "true"
+	});
+	c(() => {
+		S(!1);
+	}, [_]), l(() => {
+		if (j.current && !x && _.length > 0) {
+			let e = j.current;
+			A(e.clientWidth);
+			let t = e.querySelectorAll("li"), n = Array.from(t).slice(0, y.length), r = Array.from(t).slice(y.length + 1);
+			w(n.map((e) => e.getBoundingClientRect().width)), E(r.map((e) => e.getBoundingClientRect().width)), M.current && O(M.current.getBoundingClientRect().width), S(!0);
+		}
+	}, [
+		y,
+		b,
+		x,
+		_.length
+	]), c(() => {
+		let e = () => {
+			j.current && A(j.current.clientWidth);
+		};
+		return window.addEventListener("resize", e), () => {
+			window.removeEventListener("resize", e);
+		};
+	}, []);
+	let [F, I] = u(() => n({
+		isMeasured: x,
+		leftLevelWidths: C,
+		rightLevelWidths: T,
+		containerWidthPx: k,
+		buttonWidthPx: D,
+		gapBetweenItems: N
+	}), [
+		x,
+		C,
+		T,
+		k,
+		D,
+		N
+	]), L = u(() => {
+		let e = y.slice(y.length - F), t = b.slice(0, I);
+		return [...e, ...t];
+	}, [
+		F,
+		I,
+		y,
+		b
+	]), R = L.some((e) => v.includes(e.level));
+	return _.length === 0 ? /* @__PURE__ */ o("div", {
+		role: "alert",
+		children: /* @__PURE__ */ o(a, { ...e.noLevels })
+	}) : /* @__PURE__ */ s("ul", {
+		ref: j,
+		className: h.levelsChain,
+		"data-testid": "taxonomy-levels-chain",
+		children: [
+			y.map((e, n) => {
+				let r = x && n >= y.length - F;
+				return /* @__PURE__ */ s("li", {
+					className: h.left,
+					style: { display: r ? "none" : void 0 },
+					"aria-hidden": r,
+					children: [/* @__PURE__ */ o(t, {
+						value: e.name,
+						selected: v.includes(e.level)
+					}), y.length + b.length > 1 ? P : null]
+				}, e.level);
+			}),
+			/* @__PURE__ */ s("li", {
+				ref: M,
+				style: x ? F > 0 || I > 0 ? {} : { display: "none" } : {
+					position: "absolute",
+					visibility: "hidden"
+				},
+				"aria-hidden": !(F > 0 || I > 0),
+				tabIndex: x && (F > 0 || I > 0) ? 0 : -1,
+				children: [/* @__PURE__ */ o(i, {
+					content: L.map((e) => e.name).join(" > "),
+					children: /* @__PURE__ */ o(r, {
+						as: "span",
+						children: /* @__PURE__ */ o(t, {
+							value: `+${F + I}`,
+							selected: R
+						})
+					})
+				}), P]
+			}),
+			b.map((e, n) => {
+				let r = x && n < I;
+				return /* @__PURE__ */ s("li", {
+					className: h.right,
+					style: { display: r ? "none" : void 0 },
+					"aria-hidden": r,
+					children: [/* @__PURE__ */ o(t, {
+						value: e.name,
+						selected: v.includes(e.level)
+					}), n < b.length - 1 && P]
+				}, e.level);
+			})
+		]
+	});
+};
+export { _ as t };

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

@@ -1,17 +1,18 @@
-import '../styles/metadata-field-configurator.css';const e = "_fieldset_1bz4h_1", n = "_extensionTabsContainer_1bz4h_13", t = "_extensionContent_1bz4h_21", o = "_fieldAccordionItem_1bz4h_25", i = "_expandedToolbarActions_1bz4h_29", s = "_dragHandle_1bz4h_41", c = "_expandedContent_1bz4h_75", _ = "_basic_1bz4h_81", d = "_fieldTypeSelect_1bz4h_86", a = "_typeSpecific_1bz4h_90", l = "_description_1bz4h_97", b = "_labelWithTooltip_1bz4h_102", p = {
-  fieldset: e,
-  extensionTabsContainer: n,
-  extensionContent: t,
-  fieldAccordionItem: o,
-  expandedToolbarActions: i,
-  dragHandle: s,
-  expandedContent: c,
-  basic: _,
-  fieldTypeSelect: d,
-  typeSpecific: a,
-  description: l,
-  labelWithTooltip: b
-};
-export {
-  p as s
+import '../styles/metadata-field-configurator.css';var e = {
+	fieldset: "_fieldset_1bz4h_1",
+	toolbarActions: "_toolbarActions_1bz4h_7",
+	extensionTabsContainer: "_extensionTabsContainer_1bz4h_13",
+	extensionContent: "_extensionContent_1bz4h_21",
+	fieldAccordionItem: "_fieldAccordionItem_1bz4h_25",
+	expandedToolbarActions: "_expandedToolbarActions_1bz4h_29",
+	dragHandle: "_dragHandle_1bz4h_41",
+	errorIcon: "_errorIcon_1bz4h_65",
+	validationErrors: "_validationErrors_1bz4h_71",
+	expandedContent: "_expandedContent_1bz4h_75",
+	basic: "_basic_1bz4h_81",
+	fieldTypeSelect: "_fieldTypeSelect_1bz4h_86",
+	typeSpecific: "_typeSpecific_1bz4h_90",
+	description: "_description_1bz4h_97",
+	labelWithTooltip: "_labelWithTooltip_1bz4h_102"
 };
+export { e as t };

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

@@ -0,0 +1,229 @@
+import { a as e } from "./types.js";
+import { FieldTypeIcon as t } from "../esm/lib/utils/field-options/field-type-icon.js";
+import { general as n } from "../esm/lib/components/metadata-field-configurator/messages/configurator-messages.js";
+import { useTemplateFieldSchema as r } from "../esm/lib/components/metadata-field-configurator/hooks/useTemplateFieldSchema.js";
+import { TaxonomyOptionsContext as i } from "../esm/lib/components/metadata-field-configurator/context/taxonomy-options-context.js";
+import { FieldExtensionsContext as a } from "../esm/lib/components/metadata-field-configurator/context/field-extensions-context.js";
+import { useTaxonomyFetch as o } from "../esm/lib/components/metadata-field-configurator/hooks/useTaxonomyFetch.js";
+import { MetadataFieldConfigurator as s } from "../esm/lib/components/metadata-field-configurator/metadata-field-configurator.js";
+import { Accordion as c } from "@box/blueprint-web";
+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 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 '../styles/metadata-field-list.css';var k = {
+	fieldList: "_fieldList_18x5c_1",
+	fieldItem: "_fieldItem_18x5c_11",
+	dragging: "_dragging_18x5c_11",
+	accordionRootContainer: "_accordionRootContainer_18x5c_15"
+}, A = 150;
+function j(e) {
+	return e.id;
+}
+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 });
+	return /* @__PURE__ */ u("li", {
+		ref: h,
+		style: {
+			transform: D.Translate.toString(g),
+			transition: _
+		},
+		"data-field-id": f,
+		className: O(k.fieldItem, { [k.dragging]: v }),
+		children: /* @__PURE__ */ u(s, {
+			values: e,
+			onValuesChange: i,
+			index: t,
+			maxIndex: n,
+			onDelete: () => a(t),
+			onDuplicate: () => o(t),
+			onReorderFields: c,
+			dndDragHandleProps: {
+				listeners: m,
+				attributes: p
+			},
+			isExpanded: r,
+			onExpandedChange: (e) => {
+				e && l();
+			},
+			submitAttemptCount: d
+		})
+	});
+}
+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) {
+	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;
+	}, [R]), m(() => {
+		if (!R) return;
+		let e = !1, t = setTimeout(() => {
+			v.array().of(G).validate(s, { abortEarly: !0 }).then(() => {
+				e || K.current === !0 || (K.current = !0, R(!0));
+			}).catch(() => {
+				e || K.current === !1 || (K.current = !1, R(!1));
+			});
+		}, A);
+		return () => {
+			e = !0, clearTimeout(t);
+		};
+	}, [
+		s,
+		G,
+		R
+	]);
+	let [q, J] = _(() => {
+		let e = s.find((e) => e.isFieldNew);
+		return e ? j(e) : null;
+	});
+	h(z, () => ({ scrollToAndExpand(e) {
+		U.current = e, q === e ? (U.current = null, setTimeout(() => {
+			(H.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		}, 0)) : J(e);
+	} }), [q]), m(() => {
+		s.forEach((e) => {
+			let t = j(e);
+			W.current.has(t) || (W.current.add(t), U.current = t, J(t));
+		});
+	}, [s]), m(() => {
+		if (F == null || !I) return;
+		let e = s[F];
+		if (!e) return;
+		let t = j(e);
+		J(t), requestAnimationFrame(() => {
+			(H.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		});
+	}, [I]), m(() => {
+		let e = U.current;
+		if (!e || e !== q) return;
+		U.current = null;
+		let t = setTimeout(() => {
+			(H.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		}, M);
+		return () => clearTimeout(t);
+	}, [q]);
+	let [Y, X] = _(null), se = ie(C(re, { activationConstraint: { distance: 8 } }), C(x, { activationConstraint: {
+		delay: 250,
+		tolerance: 5
+	} }), C(b, { coordinateGetter: T })), 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));
+		}
+	}, [s, f]), ue = p(() => {
+		X(null);
+	}, []), de = p((e, t) => {
+		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);
+	}, [
+		s,
+		f,
+		E
+	]), 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) => ({
+			...e,
+			id: y()
+		})));
+		let i = [...s];
+		i.splice(t + 1, 0, r), f?.(i), D?.(r);
+	}, [
+		s,
+		f,
+		D
+	]), me = p((e, t) => {
+		t < 0 || t >= s.length || f?.(w(s, e, t));
+	}, [s, f]), he = p((e) => {
+		let t = e || null;
+		J(t), t && setTimeout(() => {
+			(H.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
+				behavior: "smooth",
+				block: "nearest"
+			});
+		}, M);
+	}, []), ge = s.map((e) => j(e)), Z = Y ? s.find((e) => j(e) === Y) : null, Q = Z ? t(Z.type) : null, _e = Z ? ((t) => {
+		let r = t.name || B(n.fieldNameInputPlaceholder);
+		return t.type === e.Dropdown ? `${r} (${t.dropdown?.options?.length ?? 0})` : r;
+	})(Z) : "", $ = /* @__PURE__ */ u(i.Provider, {
+		value: V,
+		children: /* @__PURE__ */ d(te, {
+			sensors: se,
+			collisionDetection: S,
+			onDragStart: ce,
+			onDragEnd: le,
+			onDragCancel: ue,
+			children: [/* @__PURE__ */ u("div", {
+				className: k.accordionRootContainer,
+				children: /* @__PURE__ */ u(c, {
+					type: "single",
+					collapsible: !0,
+					value: q ?? "",
+					onValueChange: he,
+					children: /* @__PURE__ */ u(ae, {
+						items: ge,
+						strategy: oe,
+						children: /* @__PURE__ */ u("ul", {
+							ref: H,
+							className: k.fieldList,
+							children: s.map((e, t) => {
+								let n = j(e);
+								return /* @__PURE__ */ u(N, {
+									field: e,
+									index: t,
+									maxIndex: s.length - 1,
+									isExpanded: q === n,
+									onChangeField: (e) => de(t, e),
+									onDeleteAtIndex: fe,
+									onDuplicateAtIndex: pe,
+									onReorderFields: me,
+									onRequestExpand: () => J(n),
+									submitAttemptCount: I
+								}, n);
+							})
+						})
+					})
+				})
+			}), /* @__PURE__ */ u(ne, {
+				dropAnimation: null,
+				children: Z && Q ? /* @__PURE__ */ u(c, {
+					type: "single",
+					children: /* @__PURE__ */ u(c.Item, {
+						value: "ghost",
+						title: _e,
+						startElement: /* @__PURE__ */ u(Q, {
+							fontSize: "20px",
+							role: "presentation"
+						}),
+						children: null
+					})
+				}) : null
+			})]
+		})
+	});
+	return L === void 0 ? $ : /* @__PURE__ */ u(a.Provider, {
+		value: L,
+		children: $
+	});
+});
+export { P as t };