@thebes/cadmea 1.2.0 → 1.4.0

package/dist/index/index.js

@@ -4,8 +4,8 @@ import { VISUAL_EDIT_MESSAGE, validateDocument } from "@thebes/cadmus/cms";
 import { For, Index, Show, Suspense, createEffect, createMemo, createSignal, lazy, onCleanup, onMount } from "solid-js";
 import { createSolidTable, flexRender, getCoreRowModel } from "@tanstack/solid-table";
 //#region src/CollectionEdit.tsx
-var _tmpl$$4 = /*#__PURE__*/ template(`<p class="text-sm text-error"role=alert>`), _tmpl$2$3 = /*#__PURE__*/ template(`<span class="loading loading-spinner loading-sm">`), _tmpl$3$3 = /*#__PURE__*/ template(`<button type=button class="btn flex-1">`), _tmpl$4$3 = /*#__PURE__*/ template(`<button type=button class="btn btn-primary flex-1">`), _tmpl$5$2 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline flex-1">`), _tmpl$6$2 = /*#__PURE__*/ template(`<form class="flex flex-col gap-4"><div class="bg-base-100 sticky bottom-0 flex gap-2 border-t py-3">`), _tmpl$7$1 = /*#__PURE__*/ template(`<fieldset class="border-base-300 rounded-box border p-4"><legend class="px-2 text-sm font-semibold">`), _tmpl$8$1 = /*#__PURE__*/ template(`<div class="grid grid-cols-1 gap-4 md:grid-cols-2">`), _tmpl$9$1 = /*#__PURE__*/ template(`<span class=text-error> *`), _tmpl$0$1 = /*#__PURE__*/ template(`<p class="text-base-content/60 mb-1 text-xs">`), _tmpl$1$1 = /*#__PURE__*/ template(`<p class="text-error mt-1 text-sm"role=alert>`), _tmpl$10$1 = /*#__PURE__*/ template(`<div><label class=label>`), _tmpl$11$1 = /*#__PURE__*/ template(`<input class=input type=text>`), _tmpl$12$1 = /*#__PURE__*/ template(`<select class=select>`), _tmpl$13$1 = /*#__PURE__*/ template(`<option>`), _tmpl$14 = /*#__PURE__*/ template(`<input class=input type=number>`), _tmpl$15 = /*#__PURE__*/ template(`<input class=input type=text readonly>`), _tmpl$16 = /*#__PURE__*/ template(`<input class=checkbox type=checkbox>`), _tmpl$17 = /*#__PURE__*/ template(`<p class="text-sm opacity-70 break-all">`), _tmpl$18 = /*#__PURE__*/ template(`<p class="text-sm text-error">`), _tmpl$19 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2"><input class=file-input type=file>`), _tmpl$20 = /*#__PURE__*/ template(`<div class="mb-1 flex flex-wrap gap-1">`), _tmpl$21 = /*#__PURE__*/ template(`<button type=button aria-label=Clear class="absolute top-2 right-2 cursor-pointer opacity-60">×`), _tmpl$22 = /*#__PURE__*/ template(`<div role=listbox class="bg-base-100 border-base-300 rounded-box absolute z-10 mt-1 flex max-h-56 w-full flex-col overflow-auto border p-1 shadow">`), _tmpl$23 = /*#__PURE__*/ template(`<div class=relative><input type=text role=combobox autocomplete=off class=input>`), _tmpl$24 = /*#__PURE__*/ template(`<span class="badge badge-primary gap-1"><button type=button class=cursor-pointer>×`), _tmpl$25 = /*#__PURE__*/ template(`<button type=button role=option class="rounded px-3 py-2 text-left">`), _tmpl$26 = /*#__PURE__*/ template(`<div role=menu class="bg-base-100 border-base-300 rounded-box absolute z-10 mt-1 flex flex-col border p-1 shadow">`), _tmpl$27 = /*#__PURE__*/ template(`<div class="relative self-start"><button type=button class="btn btn-outline btn-sm"aria-haspopup=menu>Add block`), _tmpl$28 = /*#__PURE__*/ template(`<div class="form-control md:col-span-2"><div class="label font-medium"></div><div class="flex flex-col gap-3">`), _tmpl$29 = /*#__PURE__*/ template(`<span class="text-base-content/60 truncate text-sm">`), _tmpl$30 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2">`), _tmpl$31 = /*#__PURE__*/ template(`<div class="card bg-base-200 flex flex-col gap-2 p-3"><div class="flex items-center gap-2"><button type=button class="btn btn-ghost btn-sm gap-2"><span aria-hidden=true></span><span class=font-semibold></span></button><div class="ml-auto flex gap-1"><button type=button class="btn btn-ghost btn-xs"aria-label="Move up">↑</button><button type=button class="btn btn-ghost btn-xs"aria-label="Move down">↓</button><button type=button class="btn btn-ghost btn-xs"aria-label=Duplicate>⧉</button><button type=button class="btn btn-ghost btn-xs text-error"aria-label=Remove>Remove`), _tmpl$32 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline btn-sm self-start">Add `), _tmpl$33 = /*#__PURE__*/ template(`<i aria-hidden=true>`), _tmpl$34 = /*#__PURE__*/ template(`<button type=button role=menuitem class="flex items-center gap-2 rounded px-3 py-2 text-left">`);
-const RichTextEditor = lazy(() => import("../RichTextEditor-BPilh7Pw.js").then((mod) => ({ default: mod.RichTextEditor })));
+var _tmpl$$4 = /*#__PURE__*/ template(`<p class="text-sm text-error"role=alert>`), _tmpl$2$3 = /*#__PURE__*/ template(`<span class="loading loading-spinner loading-sm">`), _tmpl$3$3 = /*#__PURE__*/ template(`<button type=button class="btn flex-1">`), _tmpl$4$3 = /*#__PURE__*/ template(`<button type=button class="btn btn-primary flex-1">`), _tmpl$5$2 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline flex-1">`), _tmpl$6$2 = /*#__PURE__*/ template(`<span class="text-base-content/60 self-center px-1 text-xs"aria-live=polite>`), _tmpl$7$1 = /*#__PURE__*/ template(`<form class="flex flex-col gap-4"><div class="bg-base-100 sticky bottom-0 flex gap-2 border-t py-3">`), _tmpl$8$1 = /*#__PURE__*/ template(`<fieldset class="border-base-300 rounded-box border p-4"><legend class="px-2 text-sm font-semibold">`), _tmpl$9$1 = /*#__PURE__*/ template(`<div class="grid grid-cols-1 gap-4 md:grid-cols-2">`), _tmpl$0$1 = /*#__PURE__*/ template(`<span class=text-error> *`), _tmpl$1$1 = /*#__PURE__*/ template(`<p class="text-base-content/60 mb-1 text-xs">`), _tmpl$10$1 = /*#__PURE__*/ template(`<p class="text-error mt-1 text-sm"role=alert>`), _tmpl$11$1 = /*#__PURE__*/ template(`<div><label class=label>`), _tmpl$12$1 = /*#__PURE__*/ template(`<input class=input type=text>`), _tmpl$13$1 = /*#__PURE__*/ template(`<select class=select>`), _tmpl$14 = /*#__PURE__*/ template(`<option>`), _tmpl$15 = /*#__PURE__*/ template(`<input class=input type=number>`), _tmpl$16 = /*#__PURE__*/ template(`<input class=input type=text readonly>`), _tmpl$17 = /*#__PURE__*/ template(`<input class=checkbox type=checkbox>`), _tmpl$18 = /*#__PURE__*/ template(`<p class="text-sm opacity-70 break-all">`), _tmpl$19 = /*#__PURE__*/ template(`<p class="text-sm text-error">`), _tmpl$20 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2"><input class=file-input type=file>`), _tmpl$21 = /*#__PURE__*/ template(`<div class="mb-1 flex flex-wrap gap-1">`), _tmpl$22 = /*#__PURE__*/ template(`<button type=button aria-label=Clear class="absolute top-2 right-2 cursor-pointer opacity-60">×`), _tmpl$23 = /*#__PURE__*/ template(`<div role=listbox class="bg-base-100 border-base-300 rounded-box absolute z-10 mt-1 flex max-h-56 w-full flex-col overflow-auto border p-1 shadow">`), _tmpl$24 = /*#__PURE__*/ template(`<div class=relative><input type=text role=combobox autocomplete=off class=input>`), _tmpl$25 = /*#__PURE__*/ template(`<span class="badge badge-primary gap-1"><button type=button class=cursor-pointer>×`), _tmpl$26 = /*#__PURE__*/ template(`<button type=button role=option class="rounded px-3 py-2 text-left">`), _tmpl$27 = /*#__PURE__*/ template(`<div role=menu class="bg-base-100 border-base-300 rounded-box absolute z-10 mt-1 flex flex-col border p-1 shadow">`), _tmpl$28 = /*#__PURE__*/ template(`<div class="relative self-start"><button type=button class="btn btn-outline btn-sm"aria-haspopup=menu>Add block`), _tmpl$29 = /*#__PURE__*/ template(`<div class="form-control md:col-span-2"><div class="label font-medium"></div><div class="flex flex-col gap-3">`), _tmpl$30 = /*#__PURE__*/ template(`<span class="text-base-content/60 truncate text-sm">`), _tmpl$31 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2">`), _tmpl$32 = /*#__PURE__*/ template(`<div class="card bg-base-200 flex flex-col gap-2 p-3"><div class="flex items-center gap-2"><button type=button class="btn btn-ghost btn-sm gap-2"><span aria-hidden=true></span><span class=font-semibold></span></button><div class="ml-auto flex gap-1"><button type=button class="btn btn-ghost btn-xs"aria-label="Move up">↑</button><button type=button class="btn btn-ghost btn-xs"aria-label="Move down">↓</button><button type=button class="btn btn-ghost btn-xs"aria-label=Duplicate>⧉</button><button type=button class="btn btn-ghost btn-xs text-error"aria-label=Remove>Remove`), _tmpl$33 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline btn-sm self-start">Add `), _tmpl$34 = /*#__PURE__*/ template(`<i aria-hidden=true>`), _tmpl$35 = /*#__PURE__*/ template(`<button type=button role=menuitem class="flex items-center gap-2 rounded px-3 py-2 text-left">`);
+const RichTextEditor = lazy(() => import("../RichTextEditor-ComcBFfl.js").then((mod) => ({ default: mod.RichTextEditor })));
 function editableFields(config) {
 	return Object.entries(config.fields).filter(([key]) => key !== "id");
 }
@@ -68,8 +68,30 @@ function CollectionEdit(props) {
 	};
 	const fieldGroups = groupFields(editableFields(props.config));
 	const versioned = () => props.config.versions?.drafts && props.draftActions;
+	const [autosaveStatus, setAutosaveStatus] = createSignal("idle");
+	let autosaveTimer;
+	createEffect(() => {
+		const dirty = !isDefaultValue();
+		const values = formValues();
+		if (!versioned() || !props.draftActions?.autosave) return;
+		if (!dirty) {
+			setAutosaveStatus("idle");
+			return;
+		}
+		clearTimeout(autosaveTimer);
+		autosaveTimer = setTimeout(async () => {
+			setAutosaveStatus("saving");
+			try {
+				await props.draftActions?.onSaveDraft(editablePayload(values));
+				setAutosaveStatus("saved");
+			} catch {
+				setAutosaveStatus("idle");
+			}
+		}, props.draftActions?.autosaveMs ?? 1500);
+	});
+	onCleanup(() => clearTimeout(autosaveTimer));
 	return (() => {
-		var _el$ = _tmpl$6$2(), _el$3 = _el$.firstChild;
+		var _el$ = _tmpl$7$1(), _el$3 = _el$.firstChild;
 		_el$.addEventListener("submit", (event) => {
 			event.preventDefault();
 			form.handleSubmit();
@@ -101,9 +123,9 @@ function CollectionEdit(props) {
 					});
 				},
 				get children() {
-					var _el$0 = _tmpl$7$1(), _el$1 = _el$0.firstChild;
-					insert(_el$1, () => group.name);
-					insert(_el$0, createComponent(FieldsGrid, {
+					var _el$1 = _tmpl$8$1(), _el$10 = _el$1.firstChild;
+					insert(_el$10, () => group.name);
+					insert(_el$1, createComponent(FieldsGrid, {
 						form,
 						ctx,
 						get fields() {
@@ -111,7 +133,7 @@ function CollectionEdit(props) {
 						},
 						values: formValues
 					}), null);
-					return _el$0;
+					return _el$1;
 				}
 			})
 		}), _el$3);
@@ -125,9 +147,9 @@ function CollectionEdit(props) {
 						return props.capabilities?.canUpdate !== false;
 					},
 					get children() {
-						var _el$10 = _tmpl$4$3();
-						_el$10.$$click = () => void form.handleSubmit();
-						insert(_el$10, createComponent(Show, {
+						var _el$11 = _tmpl$4$3();
+						_el$11.$$click = () => void form.handleSubmit();
+						insert(_el$11, createComponent(Show, {
 							get when() {
 								return props.saving;
 							},
@@ -138,8 +160,8 @@ function CollectionEdit(props) {
 								return _tmpl$2$3();
 							}
 						}));
-						effect(() => _el$10.disabled = props.saving);
-						return _el$10;
+						effect(() => _el$11.disabled = props.saving);
+						return _el$11;
 					}
 				});
 			},
@@ -200,6 +222,27 @@ function CollectionEdit(props) {
 							effect(() => _el$8.disabled = !props.draftActions?.canPreview || props.draftActions?.previewing);
 							return _el$8;
 						}
+					}),
+					createComponent(Show, {
+						get when() {
+							return props.draftActions?.autosave;
+						},
+						get children() {
+							var _el$0 = _tmpl$6$2();
+							insert(_el$0, createComponent(Show, {
+								get when() {
+									return autosaveStatus() === "saving";
+								},
+								children: "Saving…"
+							}), null);
+							insert(_el$0, createComponent(Show, {
+								get when() {
+									return autosaveStatus() === "saved";
+								},
+								children: "Saved"
+							}), null);
+							return _el$0;
+						}
 					})
 				];
 			}
@@ -209,8 +252,8 @@ function CollectionEdit(props) {
 }
 function FieldsGrid(props) {
 	return (() => {
-		var _el$12 = _tmpl$8$1();
-		insert(_el$12, createComponent(For, {
+		var _el$13 = _tmpl$9$1();
+		insert(_el$13, createComponent(For, {
 			get each() {
 				return props.fields;
 			},
@@ -223,7 +266,7 @@ function FieldsGrid(props) {
 				}
 			})
 		}));
-		return _el$12;
+		return _el$13;
 	})();
 }
 function renderField(form, ctx, name, field, label) {
@@ -232,40 +275,40 @@ function renderField(form, ctx, name, field, label) {
 	return createComponent(form.Field, {
 		name,
 		children: (fieldApi) => (() => {
-			var _el$13 = _tmpl$10$1(), _el$14 = _el$13.firstChild;
-			className(_el$13, `form-control ${spanClass}`);
-			setAttribute(_el$14, "for", name);
-			insert(_el$14, label, null);
-			insert(_el$14, createComponent(Show, {
+			var _el$14 = _tmpl$11$1(), _el$15 = _el$14.firstChild;
+			className(_el$14, `form-control ${spanClass}`);
+			setAttribute(_el$15, "for", name);
+			insert(_el$15, label, null);
+			insert(_el$15, createComponent(Show, {
 				get when() {
 					return field.required;
 				},
 				get children() {
-					return _tmpl$9$1();
+					return _tmpl$0$1();
 				}
 			}), null);
-			insert(_el$13, createComponent(Show, {
+			insert(_el$14, createComponent(Show, {
 				get when() {
 					return field.admin?.description;
 				},
 				get children() {
-					var _el$16 = _tmpl$0$1();
-					insert(_el$16, () => field.admin?.description);
-					return _el$16;
+					var _el$17 = _tmpl$1$1();
+					insert(_el$17, () => field.admin?.description);
+					return _el$17;
 				}
 			}), null);
-			insert(_el$13, () => renderControl(ctx, name, field, fieldApi), null);
-			insert(_el$13, createComponent(Show, {
+			insert(_el$14, () => renderControl(ctx, name, field, fieldApi), null);
+			insert(_el$14, createComponent(Show, {
 				get when() {
 					return (fieldApi().state.meta.errors?.length ?? 0) > 0;
 				},
 				get children() {
-					var _el$17 = _tmpl$1$1();
-					insert(_el$17, () => fieldApi().state.meta.errors.filter(Boolean).join(", "));
-					return _el$17;
+					var _el$18 = _tmpl$10$1();
+					insert(_el$18, () => fieldApi().state.meta.errors.filter(Boolean).join(", "));
+					return _el$18;
 				}
 			}), null);
-			return _el$13;
+			return _el$14;
 		})()
 	});
 }
@@ -285,76 +328,76 @@ function renderControl(ctx, name, field, fieldApi) {
 	const change = (v) => fieldApi().handleChange(v);
 	switch (field.type) {
 		case "text": return (() => {
-			var _el$18 = _tmpl$11$1();
-			_el$18.addEventListener("blur", () => fieldApi().handleBlur());
-			_el$18.$$input = (e) => change(e.currentTarget.value);
-			setAttribute(_el$18, "id", name);
-			_el$18.readOnly = readOnly;
+			var _el$19 = _tmpl$12$1();
+			_el$19.addEventListener("blur", () => fieldApi().handleBlur());
+			_el$19.$$input = (e) => change(e.currentTarget.value);
+			setAttribute(_el$19, "id", name);
+			_el$19.readOnly = readOnly;
 			effect((_p$) => {
 				var _v$ = field.admin?.placeholder, _v$2 = field.required;
-				_v$ !== _p$.e && setAttribute(_el$18, "placeholder", _p$.e = _v$);
-				_v$2 !== _p$.t && (_el$18.required = _p$.t = _v$2);
+				_v$ !== _p$.e && setAttribute(_el$19, "placeholder", _p$.e = _v$);
+				_v$2 !== _p$.t && (_el$19.required = _p$.t = _v$2);
 				return _p$;
 			}, {
 				e: void 0,
 				t: void 0
 			});
-			effect(() => _el$18.value = fieldApi().state.value ?? "");
-			return _el$18;
+			effect(() => _el$19.value = fieldApi().state.value ?? "");
+			return _el$19;
 		})();
 		case "select": return (() => {
-			var _el$19 = _tmpl$12$1();
-			_el$19.addEventListener("blur", () => fieldApi().handleBlur());
-			_el$19.addEventListener("change", (e) => change(e.currentTarget.value));
-			setAttribute(_el$19, "id", name);
-			_el$19.disabled = readOnly;
-			insert(_el$19, createComponent(For, {
+			var _el$20 = _tmpl$13$1();
+			_el$20.addEventListener("blur", () => fieldApi().handleBlur());
+			_el$20.addEventListener("change", (e) => change(e.currentTarget.value));
+			setAttribute(_el$20, "id", name);
+			_el$20.disabled = readOnly;
+			insert(_el$20, createComponent(For, {
 				get each() {
 					return field.options;
 				},
 				children: (option) => (() => {
-					var _el$20 = _tmpl$13$1();
-					_el$20.value = option;
-					insert(_el$20, option);
-					return _el$20;
+					var _el$21 = _tmpl$14();
+					_el$21.value = option;
+					insert(_el$21, option);
+					return _el$21;
 				})()
 			}));
-			effect(() => _el$19.required = field.required);
-			effect(() => _el$19.value = fieldApi().state.value ?? "");
-			return _el$19;
+			effect(() => _el$20.required = field.required);
+			effect(() => _el$20.value = fieldApi().state.value ?? "");
+			return _el$20;
 		})();
 		case "number": return (() => {
-			var _el$21 = _tmpl$14();
-			_el$21.addEventListener("blur", () => fieldApi().handleBlur());
-			_el$21.$$input = (e) => change(e.currentTarget.valueAsNumber);
-			setAttribute(_el$21, "id", name);
-			_el$21.readOnly = readOnly;
+			var _el$22 = _tmpl$15();
+			_el$22.addEventListener("blur", () => fieldApi().handleBlur());
+			_el$22.$$input = (e) => change(e.currentTarget.valueAsNumber);
+			setAttribute(_el$22, "id", name);
+			_el$22.readOnly = readOnly;
 			effect((_p$) => {
 				var _v$3 = field.admin?.placeholder, _v$4 = field.required;
-				_v$3 !== _p$.e && setAttribute(_el$21, "placeholder", _p$.e = _v$3);
-				_v$4 !== _p$.t && (_el$21.required = _p$.t = _v$4);
+				_v$3 !== _p$.e && setAttribute(_el$22, "placeholder", _p$.e = _v$3);
+				_v$4 !== _p$.t && (_el$22.required = _p$.t = _v$4);
 				return _p$;
 			}, {
 				e: void 0,
 				t: void 0
 			});
-			effect(() => _el$21.value = fieldApi().state.value ?? "");
-			return _el$21;
-		})();
-		case "date": return (() => {
-			var _el$22 = _tmpl$15();
-			setAttribute(_el$22, "id", name);
-			effect(() => _el$22.value = formatDateValue(fieldApi().state.value));
+			effect(() => _el$22.value = fieldApi().state.value ?? "");
 			return _el$22;
 		})();
-		case "checkbox": return (() => {
+		case "date": return (() => {
 			var _el$23 = _tmpl$16();
-			_el$23.addEventListener("change", (e) => change(e.currentTarget.checked));
 			setAttribute(_el$23, "id", name);
-			_el$23.disabled = readOnly;
-			effect(() => _el$23.checked = fieldApi().state.value ?? false);
+			effect(() => _el$23.value = formatDateValue(fieldApi().state.value));
 			return _el$23;
 		})();
+		case "checkbox": return (() => {
+			var _el$24 = _tmpl$17();
+			_el$24.addEventListener("change", (e) => change(e.currentTarget.checked));
+			setAttribute(_el$24, "id", name);
+			_el$24.disabled = readOnly;
+			effect(() => _el$24.checked = fieldApi().state.value ?? false);
+			return _el$24;
+		})();
 		case "upload": return createComponent(UploadControl, {
 			name,
 			field,
@@ -379,7 +422,10 @@ function renderControl(ctx, name, field, fieldApi) {
 					get content() {
 						return fieldApi().state.value;
 					},
-					onChange: (doc) => change(doc)
+					onChange: (doc) => change(doc),
+					get onUploadFile() {
+						return ctx.onUploadFile;
+					}
 				});
 			}
 		});
@@ -409,19 +455,19 @@ function UploadControl(props) {
 		}
 	}
 	return (() => {
-		var _el$25 = _tmpl$19(), _el$27 = _el$25.firstChild;
-		insert(_el$25, createComponent(Show, {
+		var _el$26 = _tmpl$20(), _el$28 = _el$26.firstChild;
+		insert(_el$26, createComponent(Show, {
 			get when() {
 				return value();
 			},
 			get children() {
-				var _el$26 = _tmpl$17();
-				insert(_el$26, value);
-				return _el$26;
+				var _el$27 = _tmpl$18();
+				insert(_el$27, value);
+				return _el$27;
 			}
-		}), _el$27);
-		_el$27.addEventListener("change", handleFileChange);
-		insert(_el$25, createComponent(Show, {
+		}), _el$28);
+		_el$28.addEventListener("change", handleFileChange);
+		insert(_el$26, createComponent(Show, {
 			get when() {
 				return uploading();
 			},
@@ -429,28 +475,28 @@ function UploadControl(props) {
 				return _tmpl$2$3();
 			}
 		}), null);
-		insert(_el$25, createComponent(Show, {
+		insert(_el$26, createComponent(Show, {
 			get when() {
 				return uploadError();
 			},
 			get children() {
-				var _el$29 = _tmpl$18();
-				insert(_el$29, uploadError);
-				return _el$29;
+				var _el$30 = _tmpl$19();
+				insert(_el$30, uploadError);
+				return _el$30;
 			}
 		}), null);
 		effect((_p$) => {
 			var _v$5 = props.name, _v$6 = props.field.required && !value(), _v$7 = uploading() || props.field.admin?.readOnly;
-			_v$5 !== _p$.e && setAttribute(_el$27, "id", _p$.e = _v$5);
-			_v$6 !== _p$.t && (_el$27.required = _p$.t = _v$6);
-			_v$7 !== _p$.a && (_el$27.disabled = _p$.a = _v$7);
+			_v$5 !== _p$.e && setAttribute(_el$28, "id", _p$.e = _v$5);
+			_v$6 !== _p$.t && (_el$28.required = _p$.t = _v$6);
+			_v$7 !== _p$.a && (_el$28.disabled = _p$.a = _v$7);
 			return _p$;
 		}, {
 			e: void 0,
 			t: void 0,
 			a: void 0
 		});
-		return _el$25;
+		return _el$26;
 	})();
 }
 function RelationshipField(props) {
@@ -505,86 +551,86 @@ function RelationshipField(props) {
 		}
 	}
 	return (() => {
-		var _el$30 = _tmpl$23(), _el$32 = _el$30.firstChild;
-		insert(_el$30, createComponent(Show, {
+		var _el$31 = _tmpl$24(), _el$33 = _el$31.firstChild;
+		insert(_el$31, createComponent(Show, {
 			get when() {
 				return memo(() => !!isMulti())() && selectedOptions().length > 0;
 			},
 			get children() {
-				var _el$31 = _tmpl$20();
-				insert(_el$31, createComponent(For, {
+				var _el$32 = _tmpl$21();
+				insert(_el$32, createComponent(For, {
 					get each() {
 						return selectedOptions();
 					},
 					children: (option) => (() => {
-						var _el$35 = _tmpl$24(), _el$36 = _el$35.firstChild;
-						insert(_el$35, () => option.label, _el$36);
-						_el$36.$$click = () => removeId(option.id);
-						effect(() => setAttribute(_el$36, "aria-label", `Remove ${option.label}`));
-						return _el$35;
+						var _el$36 = _tmpl$25(), _el$37 = _el$36.firstChild;
+						insert(_el$36, () => option.label, _el$37);
+						_el$37.$$click = () => removeId(option.id);
+						effect(() => setAttribute(_el$37, "aria-label", `Remove ${option.label}`));
+						return _el$36;
 					})()
 				}));
-				return _el$31;
+				return _el$32;
 			}
-		}), _el$32);
-		_el$32.$$keydown = onKeyDown;
-		_el$32.addEventListener("blur", () => setTimeout(() => setOpen(false), 120));
-		_el$32.addEventListener("focus", () => setOpen(true));
-		_el$32.$$input = (e) => {
+		}), _el$33);
+		_el$33.$$keydown = onKeyDown;
+		_el$33.addEventListener("blur", () => setTimeout(() => setOpen(false), 120));
+		_el$33.addEventListener("focus", () => setOpen(true));
+		_el$33.$$input = (e) => {
 			setQuery(e.currentTarget.value);
 			setOpen(true);
 			setActive(0);
 		};
-		setAttribute(_el$32, "aria-controls", listId);
-		insert(_el$30, createComponent(Show, {
+		setAttribute(_el$33, "aria-controls", listId);
+		insert(_el$31, createComponent(Show, {
 			get when() {
 				return memo(() => !!(!isMulti() && value() != null))() && !props.field.required;
 			},
 			get children() {
-				var _el$33 = _tmpl$21();
-				_el$33.$$click = () => removeId(value());
-				_el$33.$$mousedown = (e) => e.preventDefault();
-				return _el$33;
+				var _el$34 = _tmpl$22();
+				_el$34.$$click = () => removeId(value());
+				_el$34.$$mousedown = (e) => e.preventDefault();
+				return _el$34;
 			}
 		}), null);
-		insert(_el$30, createComponent(Show, {
+		insert(_el$31, createComponent(Show, {
 			get when() {
 				return memo(() => !!open())() && filtered().length > 0;
 			},
 			get children() {
-				var _el$34 = _tmpl$22();
-				setAttribute(_el$34, "id", listId);
-				insert(_el$34, createComponent(For, {
+				var _el$35 = _tmpl$23();
+				setAttribute(_el$35, "id", listId);
+				insert(_el$35, createComponent(For, {
 					get each() {
 						return filtered();
 					},
 					children: (option, i) => (() => {
-						var _el$37 = _tmpl$25();
-						_el$37.$$click = () => choose(option);
-						_el$37.$$mousedown = (e) => e.preventDefault();
-						insert(_el$37, () => option.label);
+						var _el$38 = _tmpl$26();
+						_el$38.$$click = () => choose(option);
+						_el$38.$$mousedown = (e) => e.preventDefault();
+						insert(_el$38, () => option.label);
 						effect((_p$) => {
 							var _v$11 = selectedIds().includes(option.id), _v$12 = !!(i() === active());
-							_v$11 !== _p$.e && setAttribute(_el$37, "aria-selected", _p$.e = _v$11);
-							_v$12 !== _p$.t && _el$37.classList.toggle("bg-base-200", _p$.t = _v$12);
+							_v$11 !== _p$.e && setAttribute(_el$38, "aria-selected", _p$.e = _v$11);
+							_v$12 !== _p$.t && _el$38.classList.toggle("bg-base-200", _p$.t = _v$12);
 							return _p$;
 						}, {
 							e: void 0,
 							t: void 0
 						});
-						return _el$37;
+						return _el$38;
 					})()
 				}));
-				return _el$34;
+				return _el$35;
 			}
 		}), null);
 		effect((_p$) => {
 			var _v$8 = props.name, _v$9 = open(), _v$0 = props.field.required && selectedIds().length === 0, _v$1 = props.field.admin?.readOnly, _v$10 = props.field.admin?.placeholder ?? "Search…";
-			_v$8 !== _p$.e && setAttribute(_el$32, "id", _p$.e = _v$8);
-			_v$9 !== _p$.t && setAttribute(_el$32, "aria-expanded", _p$.t = _v$9);
-			_v$0 !== _p$.a && (_el$32.required = _p$.a = _v$0);
-			_v$1 !== _p$.o && (_el$32.disabled = _p$.o = _v$1);
-			_v$10 !== _p$.i && setAttribute(_el$32, "placeholder", _p$.i = _v$10);
+			_v$8 !== _p$.e && setAttribute(_el$33, "id", _p$.e = _v$8);
+			_v$9 !== _p$.t && setAttribute(_el$33, "aria-expanded", _p$.t = _v$9);
+			_v$0 !== _p$.a && (_el$33.required = _p$.a = _v$0);
+			_v$1 !== _p$.o && (_el$33.disabled = _p$.o = _v$1);
+			_v$10 !== _p$.i && setAttribute(_el$33, "placeholder", _p$.i = _v$10);
 			return _p$;
 		}, {
 			e: void 0,
@@ -593,8 +639,8 @@ function RelationshipField(props) {
 			o: void 0,
 			i: void 0
 		});
-		effect(() => _el$32.value = open() || isMulti() ? query() : singleLabel());
-		return _el$30;
+		effect(() => _el$33.value = open() || isMulti() ? query() : singleLabel());
+		return _el$31;
 	})();
 }
 function renderArray(form, ctx, name, field, label) {
@@ -655,129 +701,129 @@ function BlockEditor(props) {
 		return "";
 	}
 	return (() => {
-		var _el$38 = _tmpl$28(), _el$39 = _el$38.firstChild, _el$42 = _el$39.nextSibling;
-		insert(_el$39, () => props.label, null);
-		insert(_el$39, createComponent(Show, {
+		var _el$39 = _tmpl$29(), _el$40 = _el$39.firstChild, _el$43 = _el$40.nextSibling;
+		insert(_el$40, () => props.label, null);
+		insert(_el$40, createComponent(Show, {
 			get when() {
 				return props.field.required;
 			},
 			get children() {
-				return _tmpl$9$1();
+				return _tmpl$0$1();
 			}
 		}), null);
-		insert(_el$38, createComponent(Show, {
+		insert(_el$39, createComponent(Show, {
 			get when() {
 				return props.field.admin?.description;
 			},
 			get children() {
-				var _el$41 = _tmpl$0$1();
-				insert(_el$41, () => props.field.admin?.description);
-				return _el$41;
+				var _el$42 = _tmpl$1$1();
+				insert(_el$42, () => props.field.admin?.description);
+				return _el$42;
 			}
-		}), _el$42);
-		insert(_el$42, createComponent(Index, {
+		}), _el$43);
+		insert(_el$43, createComponent(Index, {
 			get each() {
 				return items();
 			},
 			children: (item, index) => {
 				const isCollapsed = () => collapsed().has(index);
 				return (() => {
-					var _el$46 = _tmpl$31(), _el$47 = _el$46.firstChild, _el$48 = _el$47.firstChild, _el$49 = _el$48.firstChild, _el$50 = _el$49.nextSibling, _el$52 = _el$48.nextSibling, _el$53 = _el$52.firstChild, _el$54 = _el$53.nextSibling, _el$55 = _el$54.nextSibling, _el$56 = _el$55.nextSibling;
-					_el$48.$$click = () => toggleCollapse(index);
-					insert(_el$49, () => isCollapsed() ? "▸" : "▾");
-					insert(_el$50, () => blockTitle(item()));
-					insert(_el$47, createComponent(Show, {
+					var _el$47 = _tmpl$32(), _el$48 = _el$47.firstChild, _el$49 = _el$48.firstChild, _el$50 = _el$49.firstChild, _el$51 = _el$50.nextSibling, _el$53 = _el$49.nextSibling, _el$54 = _el$53.firstChild, _el$55 = _el$54.nextSibling, _el$56 = _el$55.nextSibling, _el$57 = _el$56.nextSibling;
+					_el$49.$$click = () => toggleCollapse(index);
+					insert(_el$50, () => isCollapsed() ? "▸" : "▾");
+					insert(_el$51, () => blockTitle(item()));
+					insert(_el$48, createComponent(Show, {
 						get when() {
 							return memo(() => !!isCollapsed())() && blockSummary(item());
 						},
 						get children() {
-							var _el$51 = _tmpl$29();
-							insert(_el$51, () => blockSummary(item()));
-							return _el$51;
+							var _el$52 = _tmpl$30();
+							insert(_el$52, () => blockSummary(item()));
+							return _el$52;
 						}
-					}), _el$52);
-					_el$53.$$click = () => move(index, index - 1);
-					_el$53.disabled = index === 0;
-					_el$54.$$click = () => move(index, index + 1);
-					_el$55.$$click = () => duplicate(index);
-					_el$56.$$click = () => props.fieldApi().removeValue(index);
-					insert(_el$46, createComponent(Show, {
+					}), _el$53);
+					_el$54.$$click = () => move(index, index - 1);
+					_el$54.disabled = index === 0;
+					_el$55.$$click = () => move(index, index + 1);
+					_el$56.$$click = () => duplicate(index);
+					_el$57.$$click = () => props.fieldApi().removeValue(index);
+					insert(_el$47, createComponent(Show, {
 						get when() {
 							return !isCollapsed();
 						},
 						get children() {
-							var _el$57 = _tmpl$30();
-							insert(_el$57, createComponent(For, {
+							var _el$58 = _tmpl$31();
+							insert(_el$58, createComponent(For, {
 								get each() {
 									return fieldsForItem(props.field, item());
 								},
 								children: ([itemKey, itemField]) => renderField(props.form, props.ctx, `${props.name}[${index}].${itemKey}`, itemField, labelFor(itemKey, itemField))
 							}));
-							return _el$57;
+							return _el$58;
 						}
 					}), null);
 					effect((_p$) => {
 						var _v$13 = !isCollapsed(), _v$14 = index === items().length - 1;
-						_v$13 !== _p$.e && setAttribute(_el$48, "aria-expanded", _p$.e = _v$13);
-						_v$14 !== _p$.t && (_el$54.disabled = _p$.t = _v$14);
+						_v$13 !== _p$.e && setAttribute(_el$49, "aria-expanded", _p$.e = _v$13);
+						_v$14 !== _p$.t && (_el$55.disabled = _p$.t = _v$14);
 						return _p$;
 					}, {
 						e: void 0,
 						t: void 0
 					});
-					return _el$46;
+					return _el$47;
 				})();
 			}
 		}), null);
-		insert(_el$42, createComponent(Show, {
+		insert(_el$43, createComponent(Show, {
 			get when() {
 				return disc && variants.length > 0;
 			},
 			get fallback() {
 				return (() => {
-					var _el$58 = _tmpl$32();
-					_el$58.firstChild;
-					_el$58.$$click = () => addBlock();
-					insert(_el$58, () => props.label, null);
-					return _el$58;
+					var _el$59 = _tmpl$33();
+					_el$59.firstChild;
+					_el$59.$$click = () => addBlock();
+					insert(_el$59, () => props.label, null);
+					return _el$59;
 				})();
 			},
 			get children() {
-				var _el$43 = _tmpl$27(), _el$44 = _el$43.firstChild;
-				_el$44.$$click = () => setMenuOpen((o) => !o);
-				insert(_el$43, createComponent(Show, {
+				var _el$44 = _tmpl$28(), _el$45 = _el$44.firstChild;
+				_el$45.$$click = () => setMenuOpen((o) => !o);
+				insert(_el$44, createComponent(Show, {
 					get when() {
 						return menuOpen();
 					},
 					get children() {
-						var _el$45 = _tmpl$26();
-						insert(_el$45, createComponent(For, {
+						var _el$46 = _tmpl$27();
+						insert(_el$46, createComponent(For, {
 							each: variants,
 							children: (variant) => (() => {
-								var _el$60 = _tmpl$34();
-								_el$60.$$click = () => addBlock(variant);
-								insert(_el$60, createComponent(Show, {
+								var _el$61 = _tmpl$35();
+								_el$61.$$click = () => addBlock(variant);
+								insert(_el$61, createComponent(Show, {
 									get when() {
 										return disc?.variantsAdmin?.[variant]?.icon;
 									},
 									get children() {
-										var _el$61 = _tmpl$33();
-										effect(() => className(_el$61, disc?.variantsAdmin?.[variant]?.icon));
-										return _el$61;
+										var _el$62 = _tmpl$34();
+										effect(() => className(_el$62, disc?.variantsAdmin?.[variant]?.icon));
+										return _el$62;
 									}
 								}), null);
-								insert(_el$60, () => variantLabel(disc, variant), null);
-								return _el$60;
+								insert(_el$61, () => variantLabel(disc, variant), null);
+								return _el$61;
 							})()
 						}));
-						return _el$45;
+						return _el$46;
 					}
 				}), null);
-				effect(() => setAttribute(_el$44, "aria-expanded", menuOpen()));
-				return _el$43;
+				effect(() => setAttribute(_el$45, "aria-expanded", menuOpen()));
+				return _el$44;
 			}
 		}), null);
-		return _el$38;
+		return _el$39;
 	})();
 }
 function fieldsForItem(field, item) {