@box/metadata-template-editor 2.1.12 → 2.2.0

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

@@ -40,7 +40,7 @@ import '../styles/dropdown-field-configuration.css';var p = {
 				shouldFocusLastOption: y,
 				onFocusConsumed: D
 			}),
-			/* @__PURE__ */ s(a, {
+			!h.isFieldReadOnly && /* @__PURE__ */ s(a, {
 				className: p.addOptionButton,
 				onClick: E,
 				children: m(t.addOption)

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

@@ -16,18 +16,18 @@ import x from "clsx";
 import te from "lodash/cloneDeep";
 import S from "lodash/uniqueId";
 import { DndContext as ne, DragOverlay as re, KeyboardSensor as C, PointerSensor as ie, TouchSensor as ae, closestCenter as oe, useSensor as w, useSensors as se } from "@dnd-kit/core";
-import { SortableContext as ce, arrayMove as T, sortableKeyboardCoordinates as le, useSortable as E, verticalListSortingStrategy as D } from "@dnd-kit/sortable";
-import { CSS as O } from "@dnd-kit/utilities";
-import '../styles/metadata-field-list.css';var k = {
+import { SortableContext as ce, arrayMove as T, sortableKeyboardCoordinates as le, useSortable as E, verticalListSortingStrategy as ue } from "@dnd-kit/sortable";
+import { CSS as D } from "@dnd-kit/utilities";
+import '../styles/metadata-field-list.css';var O = {
 	fieldList: "_fieldList_18x5c_1",
 	fieldItem: "_fieldItem_18x5c_11",
 	dragging: "_dragging_18x5c_11",
 	accordionRootContainer: "_accordionRootContainer_18x5c_15"
-}, ue = 150;
-function A(e) {
+}, de = 150;
+function k(e) {
 	return e.id;
 }
-var j = 150, de = class extends C {
+var A = 150, fe = class extends C {
 	static activators = [{
 		eventName: "onKeyDown",
 		handler: (e, t, n) => {
@@ -42,16 +42,16 @@ var j = 150, de = class extends C {
 		}
 	}];
 };
-function fe({ field: e, index: t, maxIndex: n, isExpanded: r, onChangeField: i, onDeleteAtIndex: a, onDuplicateAtIndex: o, onReorderFields: s, onRequestExpand: c, submitAttemptCount: u }) {
-	let d = A(e), { attributes: p, listeners: m, setNodeRef: h, transform: g, transition: _, isDragging: v } = E({ id: d });
+function pe({ field: e, index: t, maxIndex: n, isExpanded: r, onChangeField: i, onDeleteAtIndex: a, onDuplicateAtIndex: o, onReorderFields: s, onRequestExpand: c, submitAttemptCount: u }) {
+	let d = k(e), { attributes: p, listeners: m, setNodeRef: h, transform: g, transition: _, isDragging: v } = E({ id: d });
 	return /* @__PURE__ */ f("li", {
 		ref: h,
 		style: {
-			transform: O.Translate.toString(g),
+			transform: D.Translate.toString(g),
 			transition: _
 		},
 		"data-field-id": d,
-		className: x(k.fieldItem, { [k.dragging]: v }),
+		className: x(O.fieldItem, { [O.dragging]: v }),
 		children: /* @__PURE__ */ f(l, {
 			values: e,
 			onValuesChange: i,
@@ -72,183 +72,209 @@ function fe({ field: e, index: t, maxIndex: n, isExpanded: r, onChangeField: i,
 		})
 	});
 }
-var M = /*#__PURE__*/ m(function({ fields: l, onChangeFields: m, onDeleteFieldAtIndex: x, onDuplicateField: C, taxonomyOptions: E, fetchTaxonomies: O, disabledFieldTypes: M, taxonomyInitialStateLabels: N, firstInvalidFieldIndex: P, submitAttemptCount: F, fieldExtensions: I, onValidationChange: L }, R) {
-	let { formatMessage: z } = d(), B = r(), pe = c(O, E), V = y(null), H = y(null), U = y(new Set(l.map((e) => A(e)))), W = a(), G = y(null);
+var j = /*#__PURE__*/ m(function({ fields: m, onChangeFields: x, onDeleteFieldAtIndex: C, onDuplicateField: E, taxonomyOptions: D, fetchTaxonomies: j, disabledFieldTypes: M, taxonomyInitialStateLabels: N, firstInvalidFieldIndex: P, submitAttemptCount: F, fieldExtensions: I, onValidationChange: L, readOnly: R = !1 }, me) {
+	let { formatMessage: he } = d(), z = r(), ge = c(j, D), B = y(null), V = y(null), H = y(new Set(m.map((e) => k(e)))), U = a(), W = y(null);
 	g(() => {
-		G.current = null;
+		W.current = null;
 	}, [L]), g(() => {
 		if (!L) return;
 		let e = !1, t = setTimeout(() => {
-			ee.array().of(W).validate(l, { abortEarly: !0 }).then(() => {
-				e || G.current === !0 || (G.current = !0, L(!0));
+			ee.array().of(U).validate(m, { abortEarly: !0 }).then(() => {
+				e || W.current === !0 || (W.current = !0, L(!0));
 			}).catch(() => {
-				e || G.current === !1 || (G.current = !1, L(!1));
+				e || W.current === !1 || (W.current = !1, L(!1));
 			});
-		}, ue);
+		}, de);
 		return () => {
 			e = !0, clearTimeout(t);
 		};
 	}, [
-		l,
-		W,
+		m,
+		U,
 		L
 	]);
-	let [K, q] = b(() => {
-		let e = l.find((e) => e.isFieldNew);
-		return e ? A(e) : null;
+	let [G, K] = b(() => {
+		let e = m.find((e) => e.isFieldNew);
+		return e ? k(e) : null;
 	});
-	_(R, () => ({ scrollToAndExpand(e) {
-		H.current = e, K === e ? (H.current = null, setTimeout(() => {
-			(V.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
+	_(me, () => ({ scrollToAndExpand(e) {
+		V.current = e, G === e ? (V.current = null, setTimeout(() => {
+			(B.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
 				behavior: "smooth",
 				block: "nearest"
 			});
-		}, 0)) : q(e);
-	} }), [K]), g(() => {
-		l.forEach((e) => {
-			let t = A(e);
-			U.current.has(t) || (U.current.add(t), H.current = t, q(t));
+		}, 0)) : K(e);
+	} }), [G]), g(() => {
+		m.forEach((e) => {
+			let t = k(e);
+			H.current.has(t) || (H.current.add(t), V.current = t, K(t));
 		});
-	}, [l]), g(() => {
+	}, [m]), g(() => {
 		if (P == null || !F) return;
-		let e = l[P];
+		let e = m[P];
 		if (!e) return;
-		let t = A(e);
-		q(t), requestAnimationFrame(() => {
-			(V.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
+		let t = k(e);
+		K(t), requestAnimationFrame(() => {
+			(B.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
 				behavior: "smooth",
 				block: "nearest"
 			});
 		});
 	}, [F]), g(() => {
-		let e = H.current;
-		if (!e || e !== K) return;
-		H.current = null;
+		let e = V.current;
+		if (!e || e !== G) return;
+		V.current = null;
 		let t = setTimeout(() => {
-			(V.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
+			(B.current?.querySelector(`[data-field-id="${e}"]`))?.scrollIntoView({
 				behavior: "smooth",
 				block: "nearest"
 			});
-		}, j);
+		}, A);
 		return () => clearTimeout(t);
-	}, [K]);
-	let [J, Y] = b(null), me = se(w(ie, { activationConstraint: { distance: 8 } }), w(ae, { activationConstraint: {
+	}, [G]);
+	let [q, J] = b(null), _e = se(w(ie, { activationConstraint: { distance: 8 } }), w(ae, { activationConstraint: {
 		delay: 250,
 		tolerance: 5
-	} }), w(de, { coordinateGetter: le })), he = h((e) => {
-		Y(String(e.active.id));
-	}, []), ge = h((e) => {
-		Y(null);
+	} }), w(fe, { coordinateGetter: le })), ve = h((e) => {
+		J(String(e.active.id));
+	}, []), ye = h((e) => {
+		J(null);
 		let { active: t, over: n } = e;
 		if (n && t.id !== n.id) {
-			let e = l.findIndex((e) => A(e) === t.id), r = l.findIndex((e) => A(e) === n.id);
-			e !== -1 && r !== -1 && m?.(T(l, e, r));
+			let e = m.findIndex((e) => k(e) === t.id), r = m.findIndex((e) => k(e) === n.id);
+			e !== -1 && r !== -1 && x?.(T(m, e, r));
 		}
-	}, [l, m]), _e = h(() => {
-		Y(null);
-	}, []), ve = h((e, t) => {
-		m?.(l.map((n, r) => r === e ? t : n));
-	}, [l, m]), ye = h((e) => {
-		let t = l[e], n = A(t);
-		q((e) => e === n ? null : e), m?.(l.filter((t, n) => n !== e)), x?.(e, t);
+	}, [m, x]), be = h(() => {
+		J(null);
+	}, []), xe = h((e, t) => {
+		x?.(m.map((n, r) => r === e ? t : n));
+	}, [m, x]), Se = h((e) => {
+		let t = m[e], n = k(t);
+		K((e) => e === n ? null : e), x?.(m.filter((t, n) => n !== e)), C?.(e, t);
 	}, [
-		l,
 		m,
-		x
-	]), X = h((t) => {
-		let n = l[t], r = te(n);
+		x,
+		C
+	]), Ce = h((t) => {
+		let n = m[t], r = te(n);
 		r.id = S("field-"), r.key = "", r.isFieldNew = !0, r.type === e.Dropdown && (r.dropdown.options = r.dropdown.options.map((e) => ({
 			...e,
 			id: S()
 		})));
-		let i = [...l];
-		i.splice(t + 1, 0, r), m?.(i), C?.(r);
+		let i = [...m];
+		i.splice(t + 1, 0, r), x?.(i), E?.(r);
 	}, [
-		l,
 		m,
-		C
-	]), be = h((e, t) => {
-		t < 0 || t >= l.length || m?.(T(l, e, t));
-	}, [l, m]), xe = h((e) => {
+		x,
+		E
+	]), we = h((e, t) => {
+		t < 0 || t >= m.length || x?.(T(m, e, t));
+	}, [m, x]), Y = h((e) => {
 		let t = e || null;
-		q(t), t && setTimeout(() => {
-			(V.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
+		K(t), t && setTimeout(() => {
+			(B.current?.querySelector(`[data-field-id="${t}"]`))?.scrollIntoView({
 				behavior: "smooth",
 				block: "nearest"
 			});
-		}, j);
-	}, []), Se = l.map((e) => A(e)), Z = J ? l.find((e) => A(e) === J) : null, Q = Z ? t(Z.type) : null, Ce = Z ? ((t) => {
-		let n = t.name || z(i.fieldNameInputPlaceholder);
+		}, A);
+	}, []), Te = m.map((e) => k(e)), X = q ? m.find((e) => k(e) === q) : null, Z = X ? t(X.type) : null, Ee = X ? ((t) => {
+		let n = t.name || he(i.fieldNameInputPlaceholder);
 		return t.type === e.Dropdown ? `${n} (${t.dropdown?.options?.length ?? 0})` : n;
-	})(Z) : "", we = v(() => ({
-		disabledFieldTypes: M ?? B.disabledFieldTypes,
-		taxonomyInitialStateLabels: N ?? B.taxonomyInitialStateLabels
+	})(X) : "", De = v(() => ({
+		disabledFieldTypes: M ?? z.disabledFieldTypes,
+		taxonomyInitialStateLabels: N ?? z.taxonomyInitialStateLabels
 	}), [
 		M,
 		N,
-		B
-	]), $ = /* @__PURE__ */ f(n.Provider, {
-		value: we,
-		children: /* @__PURE__ */ f(o.Provider, {
-			value: pe,
-			children: /* @__PURE__ */ p(ne, {
-				sensors: me,
-				collisionDetection: oe,
-				onDragStart: he,
-				onDragEnd: ge,
-				onDragCancel: _e,
-				children: [/* @__PURE__ */ f("div", {
-					className: k.accordionRootContainer,
-					children: /* @__PURE__ */ f(u, {
-						type: "single",
-						collapsible: !0,
-						value: K ?? "",
-						onValueChange: xe,
-						children: /* @__PURE__ */ f(ce, {
-							items: Se,
-							strategy: D,
-							children: /* @__PURE__ */ f("ul", {
-								ref: V,
-								className: k.fieldList,
-								children: l.map((e, t) => {
-									let n = A(e);
-									return /* @__PURE__ */ f(fe, {
-										field: e,
-										index: t,
-										maxIndex: l.length - 1,
-										isExpanded: K === n,
-										onChangeField: (e) => ve(t, e),
-										onDeleteAtIndex: ye,
-										onDuplicateAtIndex: X,
-										onReorderFields: be,
-										onRequestExpand: () => q(n),
-										submitAttemptCount: F
-									}, n);
-								})
-							})
-						})
-					})
-				}), /* @__PURE__ */ f(re, {
-					dropAnimation: null,
-					children: Z && Q ? /* @__PURE__ */ f(u, {
-						type: "single",
-						children: /* @__PURE__ */ f(u.Item, {
-							value: "ghost",
-							title: Ce,
-							startElement: /* @__PURE__ */ f(Q, {
-								fontSize: "20px",
-								role: "presentation"
-							}),
-							children: null
-						})
-					}) : null
-				})]
+		z
+	]), Oe = R ? /* @__PURE__ */ f("ul", {
+		ref: B,
+		className: O.fieldList,
+		children: m.map((e, t) => {
+			let n = k(e);
+			return /* @__PURE__ */ f("li", {
+				"data-field-id": n,
+				className: O.fieldItem,
+				children: /* @__PURE__ */ f(l, {
+					values: e,
+					onValuesChange: () => void 0,
+					index: t,
+					maxIndex: m.length - 1,
+					onDuplicate: () => void 0,
+					onReorderFields: () => void 0,
+					onDragStart: () => void 0,
+					onDragEnd: () => void 0,
+					onTouchStart: () => void 0,
+					isExpanded: G === n,
+					onExpandedChange: (e) => {
+						e && K(n);
+					},
+					readOnly: !0
+				})
+			}, n);
+		})
+	}) : /* @__PURE__ */ f(ce, {
+		items: Te,
+		strategy: ue,
+		children: /* @__PURE__ */ f("ul", {
+			ref: B,
+			className: O.fieldList,
+			children: m.map((e, t) => {
+				let n = k(e);
+				return /* @__PURE__ */ f(pe, {
+					field: e,
+					index: t,
+					maxIndex: m.length - 1,
+					isExpanded: G === n,
+					onChangeField: (e) => xe(t, e),
+					onDeleteAtIndex: Se,
+					onDuplicateAtIndex: Ce,
+					onReorderFields: we,
+					onRequestExpand: () => K(n),
+					submitAttemptCount: F
+				}, n);
 			})
 		})
+	}), Q = /* @__PURE__ */ f("div", {
+		className: O.accordionRootContainer,
+		children: /* @__PURE__ */ f(u, {
+			type: "single",
+			collapsible: !0,
+			value: G ?? "",
+			onValueChange: Y,
+			children: Oe
+		})
+	}), ke = R ? Q : /* @__PURE__ */ p(ne, {
+		sensors: _e,
+		collisionDetection: oe,
+		onDragStart: ve,
+		onDragEnd: ye,
+		onDragCancel: be,
+		children: [Q, /* @__PURE__ */ f(re, {
+			dropAnimation: null,
+			children: X && Z ? /* @__PURE__ */ f(u, {
+				type: "single",
+				children: /* @__PURE__ */ f(u.Item, {
+					value: "ghost",
+					title: Ee,
+					startElement: /* @__PURE__ */ f(Z, {
+						fontSize: "20px",
+						role: "presentation"
+					}),
+					children: null
+				})
+			}) : null
+		})]
+	}), $ = /* @__PURE__ */ f(n.Provider, {
+		value: De,
+		children: /* @__PURE__ */ f(o.Provider, {
+			value: ge,
+			children: ke
+		})
 	});
 	return I === void 0 ? $ : /* @__PURE__ */ f(s.Provider, {
 		value: I,
 		children: $
 	});
 });
-export { M as t };
+export { j as t };

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

@@ -1,107 +1,131 @@
 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 { 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";
+import { FieldTypeTiles as ee } from "../esm/lib/components/field-type-tiles/field-type-tiles.js";
+import { createDefaultFieldValues as n } from "../esm/lib/components/metadata-field-configurator/utils.js";
+import { FieldExtensionsContext as r } from "../esm/lib/components/metadata-field-configurator/context/field-extensions-context.js";
+import { t as i } from "./metadata-field-list.js";
+import a from "../esm/lib/messages.js";
+import { Button as o, EmptyState as s, Link as c, Text as l, TextInput as u } from "@box/blueprint-web";
 import { FormattedMessage as d, useIntl as f } from "react-intl";
 import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
 import { useEffect as g, useMemo as _, useRef as v } from "react";
+import te from "clsx";
 import { Form as y, useFormikContext as b } from "formik";
-import '../styles/metadata-template-editor-form.css';var x = {
-	form: "_form_8cb30_1",
-	loading: "_loading_8cb30_8",
-	fields: "_fields_8cb30_15",
-	actions: "_actions_8cb30_21",
-	fieldsHeader: "_fieldsHeader_8cb30_28"
-}, S = "bodyDefaultBold", C = "h2", w = "https://developer.box.com/guides/metadata/fields/", T = ({ formId: T, onCancel: E, taxonomyOptions: D, fetchTaxonomies: O, hideActions: k, isEditMode: A, onDirtyStateChange: j, onValidationChange: M, fieldExtensions: N }) => {
-	let P = f(), { errors: F, values: I, setFieldValue: L, isSubmitting: R, isValid: z, touched: B, handleChange: V, handleBlur: H, submitCount: U, dirty: W } = b(), G = v(null), K = _(() => {
-		if (!Array.isArray(F.fields)) return null;
-		let e = F.fields.findIndex(Boolean);
+import { NoTemplates as x } from "@box/blueprint-web-assets/illustrations/Medium";
+import '../styles/metadata-template-editor-form.css';var S = {
+	form: "_form_1f0e7_1",
+	loading: "_loading_1f0e7_10",
+	fields: "_fields_1f0e7_17",
+	emptyFields: "_emptyFields_1f0e7_23",
+	actions: "_actions_1f0e7_28",
+	fieldsHeader: "_fieldsHeader_1f0e7_35"
+}, C = "bodyDefaultBold", w = "h2", T = "https://developer.box.com/guides/metadata/fields/", E = ({ formId: E, onCancel: D, taxonomyOptions: O, fetchTaxonomies: k, hideActions: A, isEditMode: j, readOnly: M = !1, onDirtyStateChange: N, onValidationChange: P, fieldExtensions: F }) => {
+	let I = f(), { errors: L, values: R, setFieldValue: z, isSubmitting: B, isValid: V, touched: H, handleChange: U, handleBlur: W, submitCount: G, dirty: K } = b(), q = v(null), J = _(() => {
+		if (!Array.isArray(L.fields)) return null;
+		let e = L.fields.findIndex(Boolean);
 		return e >= 0 ? e : null;
-	}, [F.fields]), q = (e) => {
-		let t = r(e.type);
-		L("fields", [...I.fields, t]);
-	}, J = (e) => {
-		L("fields", e);
+	}, [L.fields]), Y = (e) => {
+		let t = n(e.type);
+		z("fields", [...R.fields, t]);
+	}, X = (e) => {
+		z("fields", e);
 	};
 	g(() => {
-		j?.(W);
-	}, [W, j]), g(() => {
-		M?.(z);
-	}, [z, M]);
-	let Y = R || A && !W, X = /* @__PURE__ */ h(y, {
+		N?.(K);
+	}, [K, N]), g(() => {
+		P?.(V);
+	}, [V, P]);
+	let Z = B || j && !K, Q;
+	Q = M && R.fields.length === 0 ? /* @__PURE__ */ m(s, {
+		size: "large",
+		illustration: x,
+		body: /* @__PURE__ */ m(l, {
+			as: "p",
+			children: I.formatMessage(a.noFields)
+		})
+	}) : M ? /* @__PURE__ */ m(i, {
+		ref: q,
+		fields: R.fields,
+		taxonomyOptions: O,
+		fetchTaxonomies: k,
+		readOnly: !0
+	}) : R.fields.length === 0 ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(ee, { onFieldAdd: Y }), /* @__PURE__ */ m(c, {
+		isExternal: !0,
+		className: S.fieldsLearnMoreLink,
+		href: T,
+		target: "_blank",
+		children: /* @__PURE__ */ m(d, { ...a.fieldsLearnMore })
+	})] }) : /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(i, {
+		ref: q,
+		fields: R.fields,
+		taxonomyOptions: O,
+		fetchTaxonomies: k,
+		onChangeFields: X,
+		firstInvalidFieldIndex: J,
+		submitAttemptCount: G
+	}), /* @__PURE__ */ m(t, { onFieldAdd: Y })] });
+	let $ = /* @__PURE__ */ h(y, {
 		noValidate: !0,
-		id: T,
-		className: x.form,
+		id: E,
+		className: S.form,
 		children: [
 			/* @__PURE__ */ m("div", {
-				className: x.templateInfo,
+				className: S.templateInfo,
 				children: /* @__PURE__ */ m(u, {
 					name: "displayName",
-					label: P.formatMessage(o.templateName),
-					placeholder: P.formatMessage(o.templateNameDescription),
-					value: I.displayName,
-					error: B.displayName && F.displayName ? F.displayName : void 0,
+					label: I.formatMessage(a.templateName),
+					placeholder: I.formatMessage(a.templateNameDescription),
+					value: R.displayName,
+					error: !M && H.displayName && L.displayName ? L.displayName : void 0,
 					onChange: (e) => {
-						V(e);
+						U(e);
 					},
-					onBlur: H
+					onBlur: W,
+					readOnly: M
 				})
 			}),
 			/* @__PURE__ */ h("div", {
-				className: x.fieldsHeader,
+				className: S.fieldsHeader,
 				children: [/* @__PURE__ */ m(l, {
-					as: C,
-					variant: S,
-					children: /* @__PURE__ */ m(d, { ...I.fields.length === 0 ? o.fieldsAddFirst : o.fields })
-				}), I.fields.length > 0 && /* @__PURE__ */ m(e, {
-					fields: I.fields,
-					onSelect: (e) => G.current?.scrollToAndExpand(e)
+					as: w,
+					variant: C,
+					children: /* @__PURE__ */ m(d, { ...!M && R.fields.length === 0 ? a.fieldsAddFirst : a.fields })
+				}), R.fields.length > 0 && /* @__PURE__ */ m(e, {
+					fields: R.fields,
+					onSelect: (e) => q.current?.scrollToAndExpand(e)
 				})]
 			}),
 			/* @__PURE__ */ m("div", {
-				className: x.fields,
-				children: I.fields.length === 0 ? /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(n, { onFieldAdd: q }), /* @__PURE__ */ m(c, {
-					isExternal: !0,
-					className: x.fieldsLearnMoreLink,
-					href: w,
-					target: "_blank",
-					children: /* @__PURE__ */ m(d, { ...o.fieldsLearnMore })
-				})] }) : /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m(a, {
-					ref: G,
-					fields: I.fields,
-					taxonomyOptions: D,
-					fetchTaxonomies: O,
-					onChangeFields: J,
-					firstInvalidFieldIndex: K,
-					submitAttemptCount: U
-				}), /* @__PURE__ */ m(t, { onFieldAdd: q })] })
+				className: te(S.fields, { [S.emptyFields]: R.fields.length === 0 && M }),
+				children: Q
 			}),
-			!k && /* @__PURE__ */ h("div", {
-				className: x.actions,
-				children: [E && /* @__PURE__ */ m(s, {
+			!A && /* @__PURE__ */ m("div", {
+				className: S.actions,
+				children: M ? D && /* @__PURE__ */ m(o, {
+					variant: "primary",
+					type: "button",
+					onClick: D,
+					children: I.formatMessage(a.close)
+				}) : /* @__PURE__ */ h(p, { children: [D && /* @__PURE__ */ m(o, {
 					variant: "secondary",
 					type: "button",
-					onClick: E,
-					loading: R,
-					disabled: R,
-					loadingAriaLabel: P.formatMessage(o.submitting),
-					children: P.formatMessage(o.cancel)
-				}), /* @__PURE__ */ m(s, {
+					onClick: D,
+					loading: B,
+					disabled: B,
+					loadingAriaLabel: I.formatMessage(a.submitting),
+					children: I.formatMessage(a.cancel)
+				}), /* @__PURE__ */ m(o, {
 					variant: "primary",
 					type: "submit",
-					disabled: Y,
-					children: P.formatMessage(o.save)
-				})]
+					disabled: Z,
+					children: I.formatMessage(a.save)
+				})] })
 			})
 		]
 	});
-	return N === void 0 ? X : /* @__PURE__ */ m(i.Provider, {
-		value: N,
-		children: X
+	return F === void 0 ? $ : /* @__PURE__ */ m(r.Provider, {
+		value: F,
+		children: $
 	});
 };
-export { T as t };
+export { E as t };