@thebes/cadmea 1.3.0 → 1.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,12 +1,12 @@
1
1
  import { className, createComponent, delegateEvents, effect, insert, memo, setAttribute, template } from "solid-js/web";
2
2
  import { createMutation, createQuery, useQueryClient } from "@tanstack/solid-query";
3
- import { For, Index, Show, Suspense, createEffect, createSignal, lazy } from "solid-js";
3
+ import { For, Index, Show, Suspense, createEffect, createSignal, lazy, onCleanup } from "solid-js";
4
4
  import { createForm } from "@tanstack/solid-form";
5
5
  import { validateDocument } from "@thebes/cadmus/cms";
6
6
  import { Link, useBlocker } from "@tanstack/solid-router";
7
7
  import { createSolidTable, flexRender, getCoreRowModel } from "@tanstack/solid-table";
8
8
  //#region src/CollectionEdit.tsx
9
- 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$1 = /*#__PURE__*/ template(`<button type=button class="btn flex-1">`), _tmpl$4$1 = /*#__PURE__*/ template(`<button type=button class="btn btn-primary flex-1">`), _tmpl$5$1 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline flex-1">`), _tmpl$6$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$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">`);
9
+ 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$1 = /*#__PURE__*/ template(`<button type=button class="btn flex-1">`), _tmpl$4$1 = /*#__PURE__*/ template(`<button type=button class="btn btn-primary flex-1">`), _tmpl$5$1 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline flex-1">`), _tmpl$6$1 = /*#__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">`);
10
10
  const RichTextEditor = lazy(() => import("../RichTextEditor-ComcBFfl.js").then((mod) => ({ default: mod.RichTextEditor })));
11
11
  function editableFields(config) {
12
12
  return Object.entries(config.fields).filter(([key]) => key !== "id");
@@ -54,6 +54,7 @@ function CollectionEdit(props) {
54
54
  const isDefaultValue = form.useStore((s) => s.isDefaultValue);
55
55
  createEffect(() => props.onDirtyChange?.(!isDefaultValue()));
56
56
  const formValues = form.useStore((s) => s.values);
57
+ createEffect(() => props.onValuesChange?.(editablePayload(formValues())));
57
58
  function editablePayload(value) {
58
59
  return Object.fromEntries(Object.entries(value).filter(([key]) => props.config.fields[key]?.type !== "date"));
59
60
  }
@@ -70,8 +71,30 @@ function CollectionEdit(props) {
70
71
  };
71
72
  const fieldGroups = groupFields(editableFields(props.config));
72
73
  const versioned = () => props.config.versions?.drafts && props.draftActions;
74
+ const [autosaveStatus, setAutosaveStatus] = createSignal("idle");
75
+ let autosaveTimer;
76
+ createEffect(() => {
77
+ const dirty = !isDefaultValue();
78
+ const values = formValues();
79
+ if (!versioned() || !props.draftActions?.autosave) return;
80
+ if (!dirty) {
81
+ setAutosaveStatus("idle");
82
+ return;
83
+ }
84
+ clearTimeout(autosaveTimer);
85
+ autosaveTimer = setTimeout(async () => {
86
+ setAutosaveStatus("saving");
87
+ try {
88
+ await props.draftActions?.onSaveDraft(editablePayload(values));
89
+ setAutosaveStatus("saved");
90
+ } catch {
91
+ setAutosaveStatus("idle");
92
+ }
93
+ }, props.draftActions?.autosaveMs ?? 1500);
94
+ });
95
+ onCleanup(() => clearTimeout(autosaveTimer));
73
96
  return (() => {
74
- var _el$ = _tmpl$6$1(), _el$3 = _el$.firstChild;
97
+ var _el$ = _tmpl$7$1(), _el$3 = _el$.firstChild;
75
98
  _el$.addEventListener("submit", (event) => {
76
99
  event.preventDefault();
77
100
  form.handleSubmit();
@@ -103,9 +126,9 @@ function CollectionEdit(props) {
103
126
  });
104
127
  },
105
128
  get children() {
106
- var _el$0 = _tmpl$7$1(), _el$1 = _el$0.firstChild;
107
- insert(_el$1, () => group.name);
108
- insert(_el$0, createComponent(FieldsGrid, {
129
+ var _el$1 = _tmpl$8$1(), _el$10 = _el$1.firstChild;
130
+ insert(_el$10, () => group.name);
131
+ insert(_el$1, createComponent(FieldsGrid, {
109
132
  form,
110
133
  ctx,
111
134
  get fields() {
@@ -113,7 +136,7 @@ function CollectionEdit(props) {
113
136
  },
114
137
  values: formValues
115
138
  }), null);
116
- return _el$0;
139
+ return _el$1;
117
140
  }
118
141
  })
119
142
  }), _el$3);
@@ -127,9 +150,9 @@ function CollectionEdit(props) {
127
150
  return props.capabilities?.canUpdate !== false;
128
151
  },
129
152
  get children() {
130
- var _el$10 = _tmpl$4$1();
131
- _el$10.$$click = () => void form.handleSubmit();
132
- insert(_el$10, createComponent(Show, {
153
+ var _el$11 = _tmpl$4$1();
154
+ _el$11.$$click = () => void form.handleSubmit();
155
+ insert(_el$11, createComponent(Show, {
133
156
  get when() {
134
157
  return props.saving;
135
158
  },
@@ -140,8 +163,8 @@ function CollectionEdit(props) {
140
163
  return _tmpl$2$3();
141
164
  }
142
165
  }));
143
- effect(() => _el$10.disabled = props.saving);
144
- return _el$10;
166
+ effect(() => _el$11.disabled = props.saving);
167
+ return _el$11;
145
168
  }
146
169
  });
147
170
  },
@@ -202,6 +225,27 @@ function CollectionEdit(props) {
202
225
  effect(() => _el$8.disabled = !props.draftActions?.canPreview || props.draftActions?.previewing);
203
226
  return _el$8;
204
227
  }
228
+ }),
229
+ createComponent(Show, {
230
+ get when() {
231
+ return props.draftActions?.autosave;
232
+ },
233
+ get children() {
234
+ var _el$0 = _tmpl$6$1();
235
+ insert(_el$0, createComponent(Show, {
236
+ get when() {
237
+ return autosaveStatus() === "saving";
238
+ },
239
+ children: "Saving…"
240
+ }), null);
241
+ insert(_el$0, createComponent(Show, {
242
+ get when() {
243
+ return autosaveStatus() === "saved";
244
+ },
245
+ children: "Saved"
246
+ }), null);
247
+ return _el$0;
248
+ }
205
249
  })
206
250
  ];
207
251
  }
@@ -211,8 +255,8 @@ function CollectionEdit(props) {
211
255
  }
212
256
  function FieldsGrid(props) {
213
257
  return (() => {
214
- var _el$12 = _tmpl$8$1();
215
- insert(_el$12, createComponent(For, {
258
+ var _el$13 = _tmpl$9$1();
259
+ insert(_el$13, createComponent(For, {
216
260
  get each() {
217
261
  return props.fields;
218
262
  },
@@ -225,7 +269,7 @@ function FieldsGrid(props) {
225
269
  }
226
270
  })
227
271
  }));
228
- return _el$12;
272
+ return _el$13;
229
273
  })();
230
274
  }
231
275
  function renderField(form, ctx, name, field, label) {
@@ -234,40 +278,40 @@ function renderField(form, ctx, name, field, label) {
234
278
  return createComponent(form.Field, {
235
279
  name,
236
280
  children: (fieldApi) => (() => {
237
- var _el$13 = _tmpl$10$1(), _el$14 = _el$13.firstChild;
238
- className(_el$13, `form-control ${spanClass}`);
239
- setAttribute(_el$14, "for", name);
240
- insert(_el$14, label, null);
241
- insert(_el$14, createComponent(Show, {
281
+ var _el$14 = _tmpl$11$1(), _el$15 = _el$14.firstChild;
282
+ className(_el$14, `form-control ${spanClass}`);
283
+ setAttribute(_el$15, "for", name);
284
+ insert(_el$15, label, null);
285
+ insert(_el$15, createComponent(Show, {
242
286
  get when() {
243
287
  return field.required;
244
288
  },
245
289
  get children() {
246
- return _tmpl$9$1();
290
+ return _tmpl$0$1();
247
291
  }
248
292
  }), null);
249
- insert(_el$13, createComponent(Show, {
293
+ insert(_el$14, createComponent(Show, {
250
294
  get when() {
251
295
  return field.admin?.description;
252
296
  },
253
297
  get children() {
254
- var _el$16 = _tmpl$0$1();
255
- insert(_el$16, () => field.admin?.description);
256
- return _el$16;
298
+ var _el$17 = _tmpl$1$1();
299
+ insert(_el$17, () => field.admin?.description);
300
+ return _el$17;
257
301
  }
258
302
  }), null);
259
- insert(_el$13, () => renderControl(ctx, name, field, fieldApi), null);
260
- insert(_el$13, createComponent(Show, {
303
+ insert(_el$14, () => renderControl(ctx, name, field, fieldApi), null);
304
+ insert(_el$14, createComponent(Show, {
261
305
  get when() {
262
306
  return (fieldApi().state.meta.errors?.length ?? 0) > 0;
263
307
  },
264
308
  get children() {
265
- var _el$17 = _tmpl$1$1();
266
- insert(_el$17, () => fieldApi().state.meta.errors.filter(Boolean).join(", "));
267
- return _el$17;
309
+ var _el$18 = _tmpl$10$1();
310
+ insert(_el$18, () => fieldApi().state.meta.errors.filter(Boolean).join(", "));
311
+ return _el$18;
268
312
  }
269
313
  }), null);
270
- return _el$13;
314
+ return _el$14;
271
315
  })()
272
316
  });
273
317
  }
@@ -287,76 +331,76 @@ function renderControl(ctx, name, field, fieldApi) {
287
331
  const change = (v) => fieldApi().handleChange(v);
288
332
  switch (field.type) {
289
333
  case "text": return (() => {
290
- var _el$18 = _tmpl$11$1();
291
- _el$18.addEventListener("blur", () => fieldApi().handleBlur());
292
- _el$18.$$input = (e) => change(e.currentTarget.value);
293
- setAttribute(_el$18, "id", name);
294
- _el$18.readOnly = readOnly;
334
+ var _el$19 = _tmpl$12$1();
335
+ _el$19.addEventListener("blur", () => fieldApi().handleBlur());
336
+ _el$19.$$input = (e) => change(e.currentTarget.value);
337
+ setAttribute(_el$19, "id", name);
338
+ _el$19.readOnly = readOnly;
295
339
  effect((_p$) => {
296
340
  var _v$ = field.admin?.placeholder, _v$2 = field.required;
297
- _v$ !== _p$.e && setAttribute(_el$18, "placeholder", _p$.e = _v$);
298
- _v$2 !== _p$.t && (_el$18.required = _p$.t = _v$2);
341
+ _v$ !== _p$.e && setAttribute(_el$19, "placeholder", _p$.e = _v$);
342
+ _v$2 !== _p$.t && (_el$19.required = _p$.t = _v$2);
299
343
  return _p$;
300
344
  }, {
301
345
  e: void 0,
302
346
  t: void 0
303
347
  });
304
- effect(() => _el$18.value = fieldApi().state.value ?? "");
305
- return _el$18;
348
+ effect(() => _el$19.value = fieldApi().state.value ?? "");
349
+ return _el$19;
306
350
  })();
307
351
  case "select": return (() => {
308
- var _el$19 = _tmpl$12$1();
309
- _el$19.addEventListener("blur", () => fieldApi().handleBlur());
310
- _el$19.addEventListener("change", (e) => change(e.currentTarget.value));
311
- setAttribute(_el$19, "id", name);
312
- _el$19.disabled = readOnly;
313
- insert(_el$19, createComponent(For, {
352
+ var _el$20 = _tmpl$13$1();
353
+ _el$20.addEventListener("blur", () => fieldApi().handleBlur());
354
+ _el$20.addEventListener("change", (e) => change(e.currentTarget.value));
355
+ setAttribute(_el$20, "id", name);
356
+ _el$20.disabled = readOnly;
357
+ insert(_el$20, createComponent(For, {
314
358
  get each() {
315
359
  return field.options;
316
360
  },
317
361
  children: (option) => (() => {
318
- var _el$20 = _tmpl$13$1();
319
- _el$20.value = option;
320
- insert(_el$20, option);
321
- return _el$20;
362
+ var _el$21 = _tmpl$14();
363
+ _el$21.value = option;
364
+ insert(_el$21, option);
365
+ return _el$21;
322
366
  })()
323
367
  }));
324
- effect(() => _el$19.required = field.required);
325
- effect(() => _el$19.value = fieldApi().state.value ?? "");
326
- return _el$19;
368
+ effect(() => _el$20.required = field.required);
369
+ effect(() => _el$20.value = fieldApi().state.value ?? "");
370
+ return _el$20;
327
371
  })();
328
372
  case "number": return (() => {
329
- var _el$21 = _tmpl$14();
330
- _el$21.addEventListener("blur", () => fieldApi().handleBlur());
331
- _el$21.$$input = (e) => change(e.currentTarget.valueAsNumber);
332
- setAttribute(_el$21, "id", name);
333
- _el$21.readOnly = readOnly;
373
+ var _el$22 = _tmpl$15();
374
+ _el$22.addEventListener("blur", () => fieldApi().handleBlur());
375
+ _el$22.$$input = (e) => change(e.currentTarget.valueAsNumber);
376
+ setAttribute(_el$22, "id", name);
377
+ _el$22.readOnly = readOnly;
334
378
  effect((_p$) => {
335
379
  var _v$3 = field.admin?.placeholder, _v$4 = field.required;
336
- _v$3 !== _p$.e && setAttribute(_el$21, "placeholder", _p$.e = _v$3);
337
- _v$4 !== _p$.t && (_el$21.required = _p$.t = _v$4);
380
+ _v$3 !== _p$.e && setAttribute(_el$22, "placeholder", _p$.e = _v$3);
381
+ _v$4 !== _p$.t && (_el$22.required = _p$.t = _v$4);
338
382
  return _p$;
339
383
  }, {
340
384
  e: void 0,
341
385
  t: void 0
342
386
  });
343
- effect(() => _el$21.value = fieldApi().state.value ?? "");
344
- return _el$21;
345
- })();
346
- case "date": return (() => {
347
- var _el$22 = _tmpl$15();
348
- setAttribute(_el$22, "id", name);
349
- effect(() => _el$22.value = formatDateValue(fieldApi().state.value));
387
+ effect(() => _el$22.value = fieldApi().state.value ?? "");
350
388
  return _el$22;
351
389
  })();
352
- case "checkbox": return (() => {
390
+ case "date": return (() => {
353
391
  var _el$23 = _tmpl$16();
354
- _el$23.addEventListener("change", (e) => change(e.currentTarget.checked));
355
392
  setAttribute(_el$23, "id", name);
356
- _el$23.disabled = readOnly;
357
- effect(() => _el$23.checked = fieldApi().state.value ?? false);
393
+ effect(() => _el$23.value = formatDateValue(fieldApi().state.value));
358
394
  return _el$23;
359
395
  })();
396
+ case "checkbox": return (() => {
397
+ var _el$24 = _tmpl$17();
398
+ _el$24.addEventListener("change", (e) => change(e.currentTarget.checked));
399
+ setAttribute(_el$24, "id", name);
400
+ _el$24.disabled = readOnly;
401
+ effect(() => _el$24.checked = fieldApi().state.value ?? false);
402
+ return _el$24;
403
+ })();
360
404
  case "upload": return createComponent(UploadControl, {
361
405
  name,
362
406
  field,
@@ -414,19 +458,19 @@ function UploadControl(props) {
414
458
  }
415
459
  }
416
460
  return (() => {
417
- var _el$25 = _tmpl$19(), _el$27 = _el$25.firstChild;
418
- insert(_el$25, createComponent(Show, {
461
+ var _el$26 = _tmpl$20(), _el$28 = _el$26.firstChild;
462
+ insert(_el$26, createComponent(Show, {
419
463
  get when() {
420
464
  return value();
421
465
  },
422
466
  get children() {
423
- var _el$26 = _tmpl$17();
424
- insert(_el$26, value);
425
- return _el$26;
467
+ var _el$27 = _tmpl$18();
468
+ insert(_el$27, value);
469
+ return _el$27;
426
470
  }
427
- }), _el$27);
428
- _el$27.addEventListener("change", handleFileChange);
429
- insert(_el$25, createComponent(Show, {
471
+ }), _el$28);
472
+ _el$28.addEventListener("change", handleFileChange);
473
+ insert(_el$26, createComponent(Show, {
430
474
  get when() {
431
475
  return uploading();
432
476
  },
@@ -434,28 +478,28 @@ function UploadControl(props) {
434
478
  return _tmpl$2$3();
435
479
  }
436
480
  }), null);
437
- insert(_el$25, createComponent(Show, {
481
+ insert(_el$26, createComponent(Show, {
438
482
  get when() {
439
483
  return uploadError();
440
484
  },
441
485
  get children() {
442
- var _el$29 = _tmpl$18();
443
- insert(_el$29, uploadError);
444
- return _el$29;
486
+ var _el$30 = _tmpl$19();
487
+ insert(_el$30, uploadError);
488
+ return _el$30;
445
489
  }
446
490
  }), null);
447
491
  effect((_p$) => {
448
492
  var _v$5 = props.name, _v$6 = props.field.required && !value(), _v$7 = uploading() || props.field.admin?.readOnly;
449
- _v$5 !== _p$.e && setAttribute(_el$27, "id", _p$.e = _v$5);
450
- _v$6 !== _p$.t && (_el$27.required = _p$.t = _v$6);
451
- _v$7 !== _p$.a && (_el$27.disabled = _p$.a = _v$7);
493
+ _v$5 !== _p$.e && setAttribute(_el$28, "id", _p$.e = _v$5);
494
+ _v$6 !== _p$.t && (_el$28.required = _p$.t = _v$6);
495
+ _v$7 !== _p$.a && (_el$28.disabled = _p$.a = _v$7);
452
496
  return _p$;
453
497
  }, {
454
498
  e: void 0,
455
499
  t: void 0,
456
500
  a: void 0
457
501
  });
458
- return _el$25;
502
+ return _el$26;
459
503
  })();
460
504
  }
461
505
  function RelationshipField(props) {
@@ -510,86 +554,86 @@ function RelationshipField(props) {
510
554
  }
511
555
  }
512
556
  return (() => {
513
- var _el$30 = _tmpl$23(), _el$32 = _el$30.firstChild;
514
- insert(_el$30, createComponent(Show, {
557
+ var _el$31 = _tmpl$24(), _el$33 = _el$31.firstChild;
558
+ insert(_el$31, createComponent(Show, {
515
559
  get when() {
516
560
  return memo(() => !!isMulti())() && selectedOptions().length > 0;
517
561
  },
518
562
  get children() {
519
- var _el$31 = _tmpl$20();
520
- insert(_el$31, createComponent(For, {
563
+ var _el$32 = _tmpl$21();
564
+ insert(_el$32, createComponent(For, {
521
565
  get each() {
522
566
  return selectedOptions();
523
567
  },
524
568
  children: (option) => (() => {
525
- var _el$35 = _tmpl$24(), _el$36 = _el$35.firstChild;
526
- insert(_el$35, () => option.label, _el$36);
527
- _el$36.$$click = () => removeId(option.id);
528
- effect(() => setAttribute(_el$36, "aria-label", `Remove ${option.label}`));
529
- return _el$35;
569
+ var _el$36 = _tmpl$25(), _el$37 = _el$36.firstChild;
570
+ insert(_el$36, () => option.label, _el$37);
571
+ _el$37.$$click = () => removeId(option.id);
572
+ effect(() => setAttribute(_el$37, "aria-label", `Remove ${option.label}`));
573
+ return _el$36;
530
574
  })()
531
575
  }));
532
- return _el$31;
576
+ return _el$32;
533
577
  }
534
- }), _el$32);
535
- _el$32.$$keydown = onKeyDown;
536
- _el$32.addEventListener("blur", () => setTimeout(() => setOpen(false), 120));
537
- _el$32.addEventListener("focus", () => setOpen(true));
538
- _el$32.$$input = (e) => {
578
+ }), _el$33);
579
+ _el$33.$$keydown = onKeyDown;
580
+ _el$33.addEventListener("blur", () => setTimeout(() => setOpen(false), 120));
581
+ _el$33.addEventListener("focus", () => setOpen(true));
582
+ _el$33.$$input = (e) => {
539
583
  setQuery(e.currentTarget.value);
540
584
  setOpen(true);
541
585
  setActive(0);
542
586
  };
543
- setAttribute(_el$32, "aria-controls", listId);
544
- insert(_el$30, createComponent(Show, {
587
+ setAttribute(_el$33, "aria-controls", listId);
588
+ insert(_el$31, createComponent(Show, {
545
589
  get when() {
546
590
  return memo(() => !!(!isMulti() && value() != null))() && !props.field.required;
547
591
  },
548
592
  get children() {
549
- var _el$33 = _tmpl$21();
550
- _el$33.$$click = () => removeId(value());
551
- _el$33.$$mousedown = (e) => e.preventDefault();
552
- return _el$33;
593
+ var _el$34 = _tmpl$22();
594
+ _el$34.$$click = () => removeId(value());
595
+ _el$34.$$mousedown = (e) => e.preventDefault();
596
+ return _el$34;
553
597
  }
554
598
  }), null);
555
- insert(_el$30, createComponent(Show, {
599
+ insert(_el$31, createComponent(Show, {
556
600
  get when() {
557
601
  return memo(() => !!open())() && filtered().length > 0;
558
602
  },
559
603
  get children() {
560
- var _el$34 = _tmpl$22();
561
- setAttribute(_el$34, "id", listId);
562
- insert(_el$34, createComponent(For, {
604
+ var _el$35 = _tmpl$23();
605
+ setAttribute(_el$35, "id", listId);
606
+ insert(_el$35, createComponent(For, {
563
607
  get each() {
564
608
  return filtered();
565
609
  },
566
610
  children: (option, i) => (() => {
567
- var _el$37 = _tmpl$25();
568
- _el$37.$$click = () => choose(option);
569
- _el$37.$$mousedown = (e) => e.preventDefault();
570
- insert(_el$37, () => option.label);
611
+ var _el$38 = _tmpl$26();
612
+ _el$38.$$click = () => choose(option);
613
+ _el$38.$$mousedown = (e) => e.preventDefault();
614
+ insert(_el$38, () => option.label);
571
615
  effect((_p$) => {
572
616
  var _v$11 = selectedIds().includes(option.id), _v$12 = !!(i() === active());
573
- _v$11 !== _p$.e && setAttribute(_el$37, "aria-selected", _p$.e = _v$11);
574
- _v$12 !== _p$.t && _el$37.classList.toggle("bg-base-200", _p$.t = _v$12);
617
+ _v$11 !== _p$.e && setAttribute(_el$38, "aria-selected", _p$.e = _v$11);
618
+ _v$12 !== _p$.t && _el$38.classList.toggle("bg-base-200", _p$.t = _v$12);
575
619
  return _p$;
576
620
  }, {
577
621
  e: void 0,
578
622
  t: void 0
579
623
  });
580
- return _el$37;
624
+ return _el$38;
581
625
  })()
582
626
  }));
583
- return _el$34;
627
+ return _el$35;
584
628
  }
585
629
  }), null);
586
630
  effect((_p$) => {
587
631
  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…";
588
- _v$8 !== _p$.e && setAttribute(_el$32, "id", _p$.e = _v$8);
589
- _v$9 !== _p$.t && setAttribute(_el$32, "aria-expanded", _p$.t = _v$9);
590
- _v$0 !== _p$.a && (_el$32.required = _p$.a = _v$0);
591
- _v$1 !== _p$.o && (_el$32.disabled = _p$.o = _v$1);
592
- _v$10 !== _p$.i && setAttribute(_el$32, "placeholder", _p$.i = _v$10);
632
+ _v$8 !== _p$.e && setAttribute(_el$33, "id", _p$.e = _v$8);
633
+ _v$9 !== _p$.t && setAttribute(_el$33, "aria-expanded", _p$.t = _v$9);
634
+ _v$0 !== _p$.a && (_el$33.required = _p$.a = _v$0);
635
+ _v$1 !== _p$.o && (_el$33.disabled = _p$.o = _v$1);
636
+ _v$10 !== _p$.i && setAttribute(_el$33, "placeholder", _p$.i = _v$10);
593
637
  return _p$;
594
638
  }, {
595
639
  e: void 0,
@@ -598,8 +642,8 @@ function RelationshipField(props) {
598
642
  o: void 0,
599
643
  i: void 0
600
644
  });
601
- effect(() => _el$32.value = open() || isMulti() ? query() : singleLabel());
602
- return _el$30;
645
+ effect(() => _el$33.value = open() || isMulti() ? query() : singleLabel());
646
+ return _el$31;
603
647
  })();
604
648
  }
605
649
  function renderArray(form, ctx, name, field, label) {
@@ -660,129 +704,129 @@ function BlockEditor(props) {
660
704
  return "";
661
705
  }
662
706
  return (() => {
663
- var _el$38 = _tmpl$28(), _el$39 = _el$38.firstChild, _el$42 = _el$39.nextSibling;
664
- insert(_el$39, () => props.label, null);
665
- insert(_el$39, createComponent(Show, {
707
+ var _el$39 = _tmpl$29(), _el$40 = _el$39.firstChild, _el$43 = _el$40.nextSibling;
708
+ insert(_el$40, () => props.label, null);
709
+ insert(_el$40, createComponent(Show, {
666
710
  get when() {
667
711
  return props.field.required;
668
712
  },
669
713
  get children() {
670
- return _tmpl$9$1();
714
+ return _tmpl$0$1();
671
715
  }
672
716
  }), null);
673
- insert(_el$38, createComponent(Show, {
717
+ insert(_el$39, createComponent(Show, {
674
718
  get when() {
675
719
  return props.field.admin?.description;
676
720
  },
677
721
  get children() {
678
- var _el$41 = _tmpl$0$1();
679
- insert(_el$41, () => props.field.admin?.description);
680
- return _el$41;
722
+ var _el$42 = _tmpl$1$1();
723
+ insert(_el$42, () => props.field.admin?.description);
724
+ return _el$42;
681
725
  }
682
- }), _el$42);
683
- insert(_el$42, createComponent(Index, {
726
+ }), _el$43);
727
+ insert(_el$43, createComponent(Index, {
684
728
  get each() {
685
729
  return items();
686
730
  },
687
731
  children: (item, index) => {
688
732
  const isCollapsed = () => collapsed().has(index);
689
733
  return (() => {
690
- 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;
691
- _el$48.$$click = () => toggleCollapse(index);
692
- insert(_el$49, () => isCollapsed() ? "▸" : "▾");
693
- insert(_el$50, () => blockTitle(item()));
694
- insert(_el$47, createComponent(Show, {
734
+ 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;
735
+ _el$49.$$click = () => toggleCollapse(index);
736
+ insert(_el$50, () => isCollapsed() ? "▸" : "▾");
737
+ insert(_el$51, () => blockTitle(item()));
738
+ insert(_el$48, createComponent(Show, {
695
739
  get when() {
696
740
  return memo(() => !!isCollapsed())() && blockSummary(item());
697
741
  },
698
742
  get children() {
699
- var _el$51 = _tmpl$29();
700
- insert(_el$51, () => blockSummary(item()));
701
- return _el$51;
743
+ var _el$52 = _tmpl$30();
744
+ insert(_el$52, () => blockSummary(item()));
745
+ return _el$52;
702
746
  }
703
- }), _el$52);
704
- _el$53.$$click = () => move(index, index - 1);
705
- _el$53.disabled = index === 0;
706
- _el$54.$$click = () => move(index, index + 1);
707
- _el$55.$$click = () => duplicate(index);
708
- _el$56.$$click = () => props.fieldApi().removeValue(index);
709
- insert(_el$46, createComponent(Show, {
747
+ }), _el$53);
748
+ _el$54.$$click = () => move(index, index - 1);
749
+ _el$54.disabled = index === 0;
750
+ _el$55.$$click = () => move(index, index + 1);
751
+ _el$56.$$click = () => duplicate(index);
752
+ _el$57.$$click = () => props.fieldApi().removeValue(index);
753
+ insert(_el$47, createComponent(Show, {
710
754
  get when() {
711
755
  return !isCollapsed();
712
756
  },
713
757
  get children() {
714
- var _el$57 = _tmpl$30();
715
- insert(_el$57, createComponent(For, {
758
+ var _el$58 = _tmpl$31();
759
+ insert(_el$58, createComponent(For, {
716
760
  get each() {
717
761
  return fieldsForItem(props.field, item());
718
762
  },
719
763
  children: ([itemKey, itemField]) => renderField(props.form, props.ctx, `${props.name}[${index}].${itemKey}`, itemField, labelFor(itemKey, itemField))
720
764
  }));
721
- return _el$57;
765
+ return _el$58;
722
766
  }
723
767
  }), null);
724
768
  effect((_p$) => {
725
769
  var _v$13 = !isCollapsed(), _v$14 = index === items().length - 1;
726
- _v$13 !== _p$.e && setAttribute(_el$48, "aria-expanded", _p$.e = _v$13);
727
- _v$14 !== _p$.t && (_el$54.disabled = _p$.t = _v$14);
770
+ _v$13 !== _p$.e && setAttribute(_el$49, "aria-expanded", _p$.e = _v$13);
771
+ _v$14 !== _p$.t && (_el$55.disabled = _p$.t = _v$14);
728
772
  return _p$;
729
773
  }, {
730
774
  e: void 0,
731
775
  t: void 0
732
776
  });
733
- return _el$46;
777
+ return _el$47;
734
778
  })();
735
779
  }
736
780
  }), null);
737
- insert(_el$42, createComponent(Show, {
781
+ insert(_el$43, createComponent(Show, {
738
782
  get when() {
739
783
  return disc && variants.length > 0;
740
784
  },
741
785
  get fallback() {
742
786
  return (() => {
743
- var _el$58 = _tmpl$32();
744
- _el$58.firstChild;
745
- _el$58.$$click = () => addBlock();
746
- insert(_el$58, () => props.label, null);
747
- return _el$58;
787
+ var _el$59 = _tmpl$33();
788
+ _el$59.firstChild;
789
+ _el$59.$$click = () => addBlock();
790
+ insert(_el$59, () => props.label, null);
791
+ return _el$59;
748
792
  })();
749
793
  },
750
794
  get children() {
751
- var _el$43 = _tmpl$27(), _el$44 = _el$43.firstChild;
752
- _el$44.$$click = () => setMenuOpen((o) => !o);
753
- insert(_el$43, createComponent(Show, {
795
+ var _el$44 = _tmpl$28(), _el$45 = _el$44.firstChild;
796
+ _el$45.$$click = () => setMenuOpen((o) => !o);
797
+ insert(_el$44, createComponent(Show, {
754
798
  get when() {
755
799
  return menuOpen();
756
800
  },
757
801
  get children() {
758
- var _el$45 = _tmpl$26();
759
- insert(_el$45, createComponent(For, {
802
+ var _el$46 = _tmpl$27();
803
+ insert(_el$46, createComponent(For, {
760
804
  each: variants,
761
805
  children: (variant) => (() => {
762
- var _el$60 = _tmpl$34();
763
- _el$60.$$click = () => addBlock(variant);
764
- insert(_el$60, createComponent(Show, {
806
+ var _el$61 = _tmpl$35();
807
+ _el$61.$$click = () => addBlock(variant);
808
+ insert(_el$61, createComponent(Show, {
765
809
  get when() {
766
810
  return disc?.variantsAdmin?.[variant]?.icon;
767
811
  },
768
812
  get children() {
769
- var _el$61 = _tmpl$33();
770
- effect(() => className(_el$61, disc?.variantsAdmin?.[variant]?.icon));
771
- return _el$61;
813
+ var _el$62 = _tmpl$34();
814
+ effect(() => className(_el$62, disc?.variantsAdmin?.[variant]?.icon));
815
+ return _el$62;
772
816
  }
773
817
  }), null);
774
- insert(_el$60, () => variantLabel(disc, variant), null);
775
- return _el$60;
818
+ insert(_el$61, () => variantLabel(disc, variant), null);
819
+ return _el$61;
776
820
  })()
777
821
  }));
778
- return _el$45;
822
+ return _el$46;
779
823
  }
780
824
  }), null);
781
- effect(() => setAttribute(_el$44, "aria-expanded", menuOpen()));
782
- return _el$43;
825
+ effect(() => setAttribute(_el$45, "aria-expanded", menuOpen()));
826
+ return _el$44;
783
827
  }
784
828
  }), null);
785
- return _el$38;
829
+ return _el$39;
786
830
  })();
787
831
  }
788
832
  function fieldsForItem(field, item) {