@thebes/cadmea 1.0.0

package/dist/index/index.js

@@ -0,0 +1,740 @@
+import { className, createComponent, delegateEvents, effect, insert, memo, setAttribute, template, use } from "solid-js/web";
+import { For, Show, Suspense, createEffect, createSignal, lazy, onCleanup } from "solid-js";
+//#region src/CollectionEdit.tsx
+var _tmpl$$2 = /*#__PURE__*/ template(`<p class="text-sm text-error"role=alert>`), _tmpl$2$2 = /*#__PURE__*/ template(`<span class="loading loading-spinner loading-sm">`), _tmpl$3$2 = /*#__PURE__*/ template(`<button type=button class="btn flex-1">`), _tmpl$4$2 = /*#__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(`<span class=text-error> *`), _tmpl$8$1 = /*#__PURE__*/ template(`<div class=form-control><label class=label>`), _tmpl$9$1 = /*#__PURE__*/ template(`<button type=submit class="btn btn-primary flex-1">`), _tmpl$0$1 = /*#__PURE__*/ template(`<input class=input type=text>`), _tmpl$1$1 = /*#__PURE__*/ template(`<select class=select>`), _tmpl$10$1 = /*#__PURE__*/ template(`<option>`), _tmpl$11$1 = /*#__PURE__*/ template(`<input class=input type=number>`), _tmpl$12$1 = /*#__PURE__*/ template(`<input class=input type=text readonly>`), _tmpl$13$1 = /*#__PURE__*/ template(`<input class=checkbox type=checkbox>`), _tmpl$14 = /*#__PURE__*/ template(`<p class="text-sm opacity-70 break-all">`), _tmpl$15 = /*#__PURE__*/ template(`<p class="text-sm text-error">`), _tmpl$16 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2"><input class=file-input type=file>`), _tmpl$17 = /*#__PURE__*/ template(`<select class=select><option value>—`), _tmpl$18 = /*#__PURE__*/ template(`<div class="flex flex-col gap-3"><button type=button class="btn btn-outline btn-sm self-start">Add `), _tmpl$19 = /*#__PURE__*/ template(`<div class="card bg-base-200 flex flex-col gap-2 p-3"><button type=button class="btn btn-error btn-outline btn-sm self-start">Remove`);
+const RichTextEditor = lazy(() => import("../RichTextEditor-BPilh7Pw.js").then((mod) => ({ default: mod.RichTextEditor })));
+function editableFields(config) {
+	return Object.entries(config.fields).filter(([key]) => key !== "id");
+}
+function CollectionEdit(props) {
+	const initialSnapshot = JSON.stringify(props.initialValues ?? {});
+	const [values, setValues] = createSignal(props.initialValues ?? {});
+	createEffect(() => {
+		props.onDirtyChange?.(JSON.stringify(values()) !== initialSnapshot);
+	});
+	function setField(key, value) {
+		setValues((prev) => ({
+			...prev,
+			[key]: value
+		}));
+	}
+	function editablePayload() {
+		return Object.fromEntries(Object.entries(values()).filter(([key]) => props.config.fields[key]?.type !== "date"));
+	}
+	function handleSubmit(event) {
+		event.preventDefault();
+		props.onSubmit(editablePayload());
+	}
+	const ctx = {
+		onUploadFile: props.onUploadFile,
+		relationshipOptions: props.relationshipOptions
+	};
+	const versioned = () => props.config.versions?.drafts && props.draftActions;
+	return (() => {
+		var _el$ = _tmpl$6$1(), _el$3 = _el$.firstChild;
+		_el$.addEventListener("submit", handleSubmit);
+		insert(_el$, createComponent(Show, {
+			get when() {
+				return props.error;
+			},
+			get children() {
+				var _el$2 = _tmpl$$2();
+				insert(_el$2, () => props.error);
+				return _el$2;
+			}
+		}), _el$3);
+		insert(_el$, createComponent(For, {
+			get each() {
+				return editableFields(props.config);
+			},
+			children: ([key, field]) => (() => {
+				var _el$0 = _tmpl$8$1(), _el$1 = _el$0.firstChild;
+				setAttribute(_el$1, "for", key);
+				insert(_el$1, key, null);
+				insert(_el$1, createComponent(Show, {
+					get when() {
+						return field.required;
+					},
+					get children() {
+						return _tmpl$7$1();
+					}
+				}), null);
+				insert(_el$0, () => renderInput(key, field, values()[key], setField, ctx), null);
+				return _el$0;
+			})()
+		}), _el$3);
+		insert(_el$3, createComponent(Show, {
+			get when() {
+				return versioned();
+			},
+			get fallback() {
+				return createComponent(Show, {
+					get when() {
+						return props.capabilities?.canUpdate !== false;
+					},
+					get children() {
+						var _el$11 = _tmpl$9$1();
+						insert(_el$11, createComponent(Show, {
+							get when() {
+								return props.saving;
+							},
+							get fallback() {
+								return props.submitLabel ?? "Save";
+							},
+							get children() {
+								return _tmpl$2$2();
+							}
+						}));
+						effect(() => _el$11.disabled = props.saving);
+						return _el$11;
+					}
+				});
+			},
+			get children() {
+				return [
+					(() => {
+						var _el$4 = _tmpl$3$2();
+						_el$4.$$click = () => void props.draftActions?.onSaveDraft(editablePayload());
+						insert(_el$4, createComponent(Show, {
+							get when() {
+								return props.draftActions?.saving;
+							},
+							get fallback() {
+								return props.draftActions?.saveDraftLabel ?? "Save draft";
+							},
+							get children() {
+								return _tmpl$2$2();
+							}
+						}));
+						effect(() => _el$4.disabled = props.draftActions?.saving);
+						return _el$4;
+					})(),
+					(() => {
+						var _el$6 = _tmpl$4$2();
+						_el$6.$$click = () => void props.draftActions?.onPublish?.();
+						insert(_el$6, createComponent(Show, {
+							get when() {
+								return props.draftActions?.publishing;
+							},
+							get fallback() {
+								return props.draftActions?.publishLabel ?? "Publish";
+							},
+							get children() {
+								return _tmpl$2$2();
+							}
+						}));
+						effect(() => _el$6.disabled = !props.draftActions?.canPublish || props.draftActions?.publishing);
+						return _el$6;
+					})(),
+					createComponent(Show, {
+						get when() {
+							return props.draftActions?.onPreview;
+						},
+						get children() {
+							var _el$8 = _tmpl$5$1();
+							_el$8.$$click = () => void props.draftActions?.onPreview?.();
+							insert(_el$8, createComponent(Show, {
+								get when() {
+									return props.draftActions?.previewing;
+								},
+								get fallback() {
+									return props.draftActions?.previewLabel ?? "Preview";
+								},
+								get children() {
+									return _tmpl$2$2();
+								}
+							}));
+							effect(() => _el$8.disabled = !props.draftActions?.canPreview || props.draftActions?.previewing);
+							return _el$8;
+						}
+					})
+				];
+			}
+		}));
+		return _el$;
+	})();
+}
+function renderInput(key, field, value, setField, ctx) {
+	switch (field.type) {
+		case "text": return (() => {
+			var _el$13 = _tmpl$0$1();
+			_el$13.$$input = (e) => setField(key, e.currentTarget.value);
+			setAttribute(_el$13, "id", key);
+			_el$13.value = value ?? "";
+			effect(() => _el$13.required = field.required);
+			return _el$13;
+		})();
+		case "select": return (() => {
+			var _el$14 = _tmpl$1$1();
+			_el$14.addEventListener("change", (e) => setField(key, e.currentTarget.value));
+			setAttribute(_el$14, "id", key);
+			_el$14.value = value ?? "";
+			insert(_el$14, createComponent(For, {
+				get each() {
+					return field.options;
+				},
+				children: (option) => (() => {
+					var _el$15 = _tmpl$10$1();
+					_el$15.value = option;
+					insert(_el$15, option);
+					return _el$15;
+				})()
+			}));
+			effect(() => _el$14.required = field.required);
+			return _el$14;
+		})();
+		case "number": return (() => {
+			var _el$16 = _tmpl$11$1();
+			_el$16.$$input = (e) => setField(key, e.currentTarget.valueAsNumber);
+			setAttribute(_el$16, "id", key);
+			_el$16.value = value ?? "";
+			effect(() => _el$16.required = field.required);
+			return _el$16;
+		})();
+		case "date": return (() => {
+			var _el$17 = _tmpl$12$1();
+			setAttribute(_el$17, "id", key);
+			effect(() => _el$17.value = formatDateValue(value));
+			return _el$17;
+		})();
+		case "checkbox": return (() => {
+			var _el$18 = _tmpl$13$1();
+			_el$18.addEventListener("change", (e) => setField(key, e.currentTarget.checked));
+			setAttribute(_el$18, "id", key);
+			_el$18.checked = value ?? false;
+			return _el$18;
+		})();
+		case "upload": return renderUploadInput(key, field, value, setField, ctx);
+		case "relationship": return renderRelationshipInput(key, field, value, setField, ctx);
+		case "array": return renderArrayInput(key, field, value, setField, ctx);
+		case "richText": return createComponent(Suspense, {
+			get fallback() {
+				return _tmpl$2$2();
+			},
+			get children() {
+				return createComponent(RichTextEditor, {
+					id: key,
+					content: value,
+					onChange: (doc) => setField(key, doc)
+				});
+			}
+		});
+		default: return null;
+	}
+}
+function renderUploadInput(key, field, value, setField, ctx) {
+	const [uploading, setUploading] = createSignal(false);
+	const [uploadError, setUploadError] = createSignal();
+	async function handleFileChange(e) {
+		const file = e.currentTarget.files?.[0];
+		if (!file) return;
+		if (!ctx.onUploadFile) {
+			setUploadError("No upload handler configured for this form.");
+			return;
+		}
+		setUploading(true);
+		setUploadError(void 0);
+		try {
+			const { url } = await ctx.onUploadFile(file);
+			setField(key, url);
+		} catch (err) {
+			setUploadError(err instanceof Error ? err.message : "Upload failed");
+		} finally {
+			setUploading(false);
+		}
+	}
+	return (() => {
+		var _el$20 = _tmpl$16(), _el$22 = _el$20.firstChild;
+		insert(_el$20, createComponent(Show, {
+			when: value,
+			get children() {
+				var _el$21 = _tmpl$14();
+				insert(_el$21, value);
+				return _el$21;
+			}
+		}), _el$22);
+		_el$22.addEventListener("change", handleFileChange);
+		setAttribute(_el$22, "id", key);
+		insert(_el$20, createComponent(Show, {
+			get when() {
+				return uploading();
+			},
+			get children() {
+				return _tmpl$2$2();
+			}
+		}), null);
+		insert(_el$20, createComponent(Show, {
+			get when() {
+				return uploadError();
+			},
+			get children() {
+				var _el$24 = _tmpl$15();
+				insert(_el$24, uploadError);
+				return _el$24;
+			}
+		}), null);
+		effect((_p$) => {
+			var _v$ = field.required && !value, _v$2 = uploading();
+			_v$ !== _p$.e && (_el$22.required = _p$.e = _v$);
+			_v$2 !== _p$.t && (_el$22.disabled = _p$.t = _v$2);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0
+		});
+		return _el$20;
+	})();
+}
+function renderRelationshipInput(key, field, value, setField, ctx) {
+	if (field.hasMany) return null;
+	const options = ctx.relationshipOptions?.[field.relationTo] ?? [];
+	return (() => {
+		var _el$25 = _tmpl$17();
+		_el$25.firstChild;
+		_el$25.addEventListener("change", (e) => setField(key, e.currentTarget.value === "" ? null : Number(e.currentTarget.value)));
+		setAttribute(_el$25, "id", key);
+		insert(_el$25, createComponent(For, {
+			each: options,
+			children: (option) => (() => {
+				var _el$27 = _tmpl$10$1();
+				insert(_el$27, () => option.label);
+				effect(() => _el$27.value = option.id);
+				return _el$27;
+			})()
+		}), null);
+		effect(() => _el$25.required = field.required);
+		effect(() => _el$25.value = value != null ? String(value) : "");
+		return _el$25;
+	})();
+}
+function renderArrayInput(key, field, value, setField, ctx) {
+	const items = () => Array.isArray(value) ? value : [];
+	function updateItem(index, itemKey, itemValue) {
+		const next = items().slice();
+		next[index] = {
+			...next[index],
+			[itemKey]: itemValue
+		};
+		setField(key, next);
+	}
+	function addItem() {
+		setField(key, [...items(), {}]);
+	}
+	function removeItem(index) {
+		setField(key, items().filter((_, i) => i !== index));
+	}
+	function fieldsForItem(item) {
+		const base = Object.entries(field.fields);
+		const discriminator = field.discriminator;
+		if (!discriminator) return base;
+		const variantValue = item[discriminator.key];
+		const variantFields = typeof variantValue === "string" ? discriminator.variants[variantValue] : void 0;
+		return variantFields ? [...base, ...Object.entries(variantFields)] : base;
+	}
+	return (() => {
+		var _el$28 = _tmpl$18(), _el$29 = _el$28.firstChild;
+		_el$29.firstChild;
+		insert(_el$28, createComponent(For, {
+			get each() {
+				return items();
+			},
+			children: (item, index) => (() => {
+				var _el$31 = _tmpl$19(), _el$32 = _el$31.firstChild;
+				insert(_el$31, createComponent(For, {
+					get each() {
+						return fieldsForItem(item);
+					},
+					children: ([itemKey, itemField]) => {
+						const inputId = `${key}.${index()}.${itemKey}`;
+						return (() => {
+							var _el$33 = _tmpl$8$1(), _el$34 = _el$33.firstChild;
+							setAttribute(_el$34, "for", inputId);
+							insert(_el$34, itemKey, null);
+							insert(_el$34, createComponent(Show, {
+								get when() {
+									return itemField.required;
+								},
+								get children() {
+									return _tmpl$7$1();
+								}
+							}), null);
+							insert(_el$33, () => renderInput(inputId, itemField, item[itemKey], (_, v) => updateItem(index(), itemKey, v), ctx), null);
+							return _el$33;
+						})();
+					}
+				}), _el$32);
+				_el$32.$$click = () => removeItem(index());
+				return _el$31;
+			})()
+		}), _el$29);
+		_el$29.$$click = addItem;
+		insert(_el$29, key, null);
+		return _el$28;
+	})();
+}
+function formatDateValue(value) {
+	if (!value) return "—";
+	const date = value instanceof Date ? value : new Date(value);
+	return Number.isNaN(date.getTime()) ? "—" : date.toLocaleString();
+}
+delegateEvents(["click", "input"]);
+//#endregion
+//#region src/CollectionList.tsx
+var _tmpl$$1 = /*#__PURE__*/ template(`<button type=button class="btn btn-outline btn-sm">`), _tmpl$2$1 = /*#__PURE__*/ template(`<div class=join><select aria-label="Sort by"class="select select-sm join-item"></select><select aria-label="Sort direction"class="select select-sm join-item"><option value=asc>Ascending</option><option value=desc>Descending`), _tmpl$3$1 = /*#__PURE__*/ template(`<th>`), _tmpl$4$1 = /*#__PURE__*/ template(`<table class="table hidden md:table"><thead><tr></tr></thead><tbody>`), _tmpl$5 = /*#__PURE__*/ template(`<div class="flex flex-col gap-2 md:hidden">`), _tmpl$6 = /*#__PURE__*/ template(`<div class="bg-base-100 sticky bottom-0 flex items-center justify-between gap-2 border-t py-2"><button type=button class="btn btn-sm">Prev</button><span class="text-sm opacity-70">Page </span><button type=button class="btn btn-sm">Next`), _tmpl$7 = /*#__PURE__*/ template(`<div class="flex flex-col gap-3"><div class="flex flex-wrap items-center justify-between gap-2">`), _tmpl$8 = /*#__PURE__*/ template(`<option>`), _tmpl$9 = /*#__PURE__*/ template(`<p class="text-sm opacity-70">No <!> yet.`), _tmpl$0 = /*#__PURE__*/ template(`<td><input type=checkbox class="checkbox checkbox-sm">`), _tmpl$1 = /*#__PURE__*/ template(`<tr>`), _tmpl$10 = /*#__PURE__*/ template(`<td>`), _tmpl$11 = /*#__PURE__*/ template(`<input type=checkbox class="checkbox checkbox-sm mt-1">`), _tmpl$12 = /*#__PURE__*/ template(`<div class="card bg-base-200 cursor-pointer p-3"role=button tabindex=0><div class="flex items-start gap-3"><div class="flex flex-1 flex-col gap-1">`), _tmpl$13 = /*#__PURE__*/ template(`<div class="flex justify-between gap-2 text-sm"><span class=opacity-60></span><span class=text-right>`);
+function listableFields(config) {
+	const excluded = new Set([
+		"richText",
+		"array",
+		"relationship"
+	]);
+	return Object.entries(config.fields).filter(([key, field]) => key !== "id" && !excluded.has(field.type));
+}
+function formatCellValue(value) {
+	if (value === null || value === void 0) return "—";
+	if (value instanceof Date) return value.toLocaleDateString();
+	return String(value);
+}
+function rowId(row) {
+	return typeof row.id === "number" ? row.id : void 0;
+}
+function CollectionList(props) {
+	const columns = () => listableFields(props.config);
+	const [selectMode, setSelectMode] = createSignal(false);
+	function toggleSelected(id) {
+		const next = new Set(props.selectedIds ?? []);
+		if (next.has(id)) next.delete(id);
+		else next.add(id);
+		props.onSelectionChange?.(next);
+	}
+	function handleRowActivate(row) {
+		if (selectMode()) {
+			const id = rowId(row);
+			if (id !== void 0) toggleSelected(id);
+			return;
+		}
+		props.onRowClick?.(row);
+	}
+	return (() => {
+		var _el$ = _tmpl$7(), _el$2 = _el$.firstChild;
+		insert(_el$2, createComponent(Show, {
+			get when() {
+				return props.selectable;
+			},
+			get children() {
+				var _el$3 = _tmpl$$1();
+				_el$3.$$click = () => setSelectMode((v) => !v);
+				insert(_el$3, () => selectMode() ? "Done" : "Select");
+				return _el$3;
+			}
+		}), null);
+		insert(_el$2, createComponent(Show, {
+			get when() {
+				return props.onSortChange;
+			},
+			get children() {
+				var _el$4 = _tmpl$2$1(), _el$5 = _el$4.firstChild, _el$6 = _el$5.nextSibling;
+				_el$5.addEventListener("change", (e) => props.onSortChange?.(e.currentTarget.value, props.sortDirection ?? "asc"));
+				insert(_el$5, createComponent(For, {
+					get each() {
+						return columns();
+					},
+					children: ([key]) => (() => {
+						var _el$16 = _tmpl$8();
+						_el$16.value = key;
+						insert(_el$16, key);
+						return _el$16;
+					})()
+				}));
+				_el$6.addEventListener("change", (e) => props.onSortChange?.(props.sortField ?? columns()[0]?.[0] ?? "", e.currentTarget.value));
+				effect(() => _el$5.value = props.sortField ?? "");
+				effect(() => _el$6.value = props.sortDirection ?? "asc");
+				return _el$4;
+			}
+		}), null);
+		insert(_el$, createComponent(Show, {
+			get when() {
+				return props.rows.length > 0;
+			},
+			get fallback() {
+				return (() => {
+					var _el$17 = _tmpl$9(), _el$20 = _el$17.firstChild.nextSibling;
+					_el$20.nextSibling;
+					insert(_el$17, () => props.config.slug, _el$20);
+					return _el$17;
+				})();
+			},
+			get children() {
+				return [(() => {
+					var _el$7 = _tmpl$4$1(), _el$8 = _el$7.firstChild, _el$9 = _el$8.firstChild, _el$1 = _el$8.nextSibling;
+					insert(_el$9, createComponent(Show, {
+						get when() {
+							return selectMode();
+						},
+						get children() {
+							return _tmpl$3$1();
+						}
+					}), null);
+					insert(_el$9, createComponent(For, {
+						get each() {
+							return columns();
+						},
+						children: ([key]) => (() => {
+							var _el$21 = _tmpl$3$1();
+							insert(_el$21, key);
+							return _el$21;
+						})()
+					}), null);
+					insert(_el$1, createComponent(For, {
+						get each() {
+							return props.rows;
+						},
+						children: (row) => (() => {
+							var _el$22 = _tmpl$1();
+							_el$22.$$click = () => handleRowActivate(row);
+							insert(_el$22, createComponent(Show, {
+								get when() {
+									return selectMode();
+								},
+								get children() {
+									var _el$23 = _tmpl$0(), _el$24 = _el$23.firstChild;
+									_el$24.addEventListener("change", () => {
+										const id = rowId(row);
+										if (id !== void 0) toggleSelected(id);
+									});
+									_el$24.$$click = (e) => e.stopPropagation();
+									effect(() => _el$24.checked = rowId(row) !== void 0 && (props.selectedIds?.has(rowId(row)) ?? false));
+									return _el$23;
+								}
+							}), null);
+							insert(_el$22, createComponent(For, {
+								get each() {
+									return columns();
+								},
+								children: ([key]) => (() => {
+									var _el$25 = _tmpl$10();
+									insert(_el$25, () => formatCellValue(row[key]));
+									return _el$25;
+								})()
+							}), null);
+							effect(() => className(_el$22, props.onRowClick || selectMode() ? "cursor-pointer hover" : void 0));
+							return _el$22;
+						})()
+					}));
+					return _el$7;
+				})(), (() => {
+					var _el$10 = _tmpl$5();
+					insert(_el$10, createComponent(For, {
+						get each() {
+							return props.rows;
+						},
+						children: (row) => (() => {
+							var _el$26 = _tmpl$12(), _el$27 = _el$26.firstChild, _el$29 = _el$27.firstChild;
+							_el$26.$$keydown = (e) => {
+								if (e.key === "Enter" || e.key === " ") {
+									e.preventDefault();
+									handleRowActivate(row);
+								}
+							};
+							_el$26.$$click = () => handleRowActivate(row);
+							insert(_el$27, createComponent(Show, {
+								get when() {
+									return selectMode();
+								},
+								get children() {
+									var _el$28 = _tmpl$11();
+									_el$28.addEventListener("change", () => {
+										const id = rowId(row);
+										if (id !== void 0) toggleSelected(id);
+									});
+									_el$28.$$click = (e) => e.stopPropagation();
+									effect(() => _el$28.checked = rowId(row) !== void 0 && (props.selectedIds?.has(rowId(row)) ?? false));
+									return _el$28;
+								}
+							}), _el$29);
+							insert(_el$29, createComponent(For, {
+								get each() {
+									return columns();
+								},
+								children: ([key]) => (() => {
+									var _el$30 = _tmpl$13(), _el$31 = _el$30.firstChild, _el$32 = _el$31.nextSibling;
+									insert(_el$31, key);
+									insert(_el$32, () => formatCellValue(row[key]));
+									return _el$30;
+								})()
+							}));
+							return _el$26;
+						})()
+					}));
+					return _el$10;
+				})()];
+			}
+		}), null);
+		insert(_el$, createComponent(Show, {
+			get when() {
+				return memo(() => props.page !== void 0)() && props.pageSize !== void 0;
+			},
+			get children() {
+				var _el$11 = _tmpl$6(), _el$12 = _el$11.firstChild, _el$13 = _el$12.nextSibling;
+				_el$13.firstChild;
+				var _el$15 = _el$13.nextSibling;
+				_el$12.$$click = () => props.onPageChange?.((props.page ?? 1) - 1);
+				insert(_el$13, () => props.page, null);
+				_el$15.$$click = () => props.onPageChange?.((props.page ?? 1) + 1);
+				effect((_p$) => {
+					var _v$ = (props.page ?? 1) <= 1, _v$2 = props.totalCount !== void 0 ? (props.page ?? 1) * (props.pageSize ?? 0) >= props.totalCount : props.rows.length < (props.pageSize ?? 0);
+					_v$ !== _p$.e && (_el$12.disabled = _p$.e = _v$);
+					_v$2 !== _p$.t && (_el$15.disabled = _p$.t = _v$2);
+					return _p$;
+				}, {
+					e: void 0,
+					t: void 0
+				});
+				return _el$11;
+			}
+		}), null);
+		return _el$;
+	})();
+}
+delegateEvents(["click", "keydown"]);
+//#endregion
+//#region src/SearchPalette.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<ul class="max-h-80 overflow-y-auto py-2">`), _tmpl$2 = /*#__PURE__*/ template(`<div aria-hidden=true class="fixed inset-0 z-50 flex items-start justify-center bg-[var(--color-backdrop)] px-4 pt-[15vh]"><div role=dialog aria-modal=true aria-label=Search class="w-full max-w-lg overflow-hidden rounded-2xl border border-[var(--line)] bg-[var(--surface-strong)] shadow-2xl"><div class="flex items-center gap-2 border-b border-[var(--line)] px-4 py-3"><i class="ph ph-magnifying-glass text-lg text-[var(--sea-ink-soft)]"aria-hidden=true></i><input type=text placeholder=Search… aria-label=Search class="flex-1 bg-transparent text-base text-[var(--sea-ink)] outline-none placeholder:text-[var(--sea-ink-soft)]"><kbd class="rounded border border-[var(--chip-line)] bg-[var(--chip-bg)] px-1.5 py-0.5 text-xs text-[var(--sea-ink-soft)]">Esc`), _tmpl$3 = /*#__PURE__*/ template(`<p class="px-4 py-6 text-center text-sm text-[var(--sea-ink-soft)]">`), _tmpl$4 = /*#__PURE__*/ template(`<li><button type=button class="flex w-full items-center justify-between gap-3 px-4 py-2 text-left text-sm text-[var(--sea-ink)] hover:bg-[var(--link-bg-hover)]"><span class=truncate></span><span class="shrink-0 text-xs text-[var(--sea-ink-soft)]">`);
+const DEBOUNCE_MS = 200;
+function capitalize(value) {
+	return value.length === 0 ? value : value[0].toUpperCase() + value.slice(1);
+}
+/**
+* Self-contained Cmd+K (Ctrl+K on non-Mac) search palette — issue #29.
+* Owns its own open/closed state and keyboard listener; the host app only
+* supplies `onSearch` (wired to a server function that fans out across
+* every collection with `search` configured) and `onSelect` (navigation).
+* Mirrors PanelNav's focus-trap-on-open / restore-focus-on-close pattern
+* rather than introducing a second one.
+*/
+function SearchPalette(props) {
+	const [open, setOpen] = createSignal(false);
+	const [query, setQuery] = createSignal("");
+	const [results, setResults] = createSignal([]);
+	const [activeIndex, setActiveIndex] = createSignal(0);
+	let inputRef;
+	let triggeredBy = null;
+	let debounceTimer;
+	let latestQueryToken = 0;
+	function close() {
+		setOpen(false);
+		setQuery("");
+		setResults([]);
+		triggeredBy?.focus();
+	}
+	function runSearch(value) {
+		const token = ++latestQueryToken;
+		if (value.trim().length < 2) {
+			setResults([]);
+			return;
+		}
+		props.onSearch(value).then((found) => {
+			if (token !== latestQueryToken) return;
+			setResults(found);
+			setActiveIndex(0);
+		});
+	}
+	function onInput(value) {
+		setQuery(value);
+		clearTimeout(debounceTimer);
+		debounceTimer = setTimeout(() => runSearch(value), DEBOUNCE_MS);
+	}
+	function selectResult(result) {
+		if (!result) return;
+		props.onSelect(result);
+		close();
+	}
+	createEffect(() => {
+		function onGlobalKeyDown(event) {
+			if ((event.metaKey || event.ctrlKey) && event.key.toLowerCase() === "k") {
+				event.preventDefault();
+				triggeredBy = document.activeElement;
+				setOpen(true);
+			}
+		}
+		document.addEventListener("keydown", onGlobalKeyDown);
+		onCleanup(() => document.removeEventListener("keydown", onGlobalKeyDown));
+	});
+	createEffect(() => {
+		if (open()) inputRef?.focus();
+	});
+	function onDialogKeyDown(event) {
+		if (event.key === "Escape") {
+			close();
+			return;
+		}
+		if (event.key === "ArrowDown") {
+			event.preventDefault();
+			setActiveIndex((i) => Math.min(i + 1, results().length - 1));
+			return;
+		}
+		if (event.key === "ArrowUp") {
+			event.preventDefault();
+			setActiveIndex((i) => Math.max(i - 1, 0));
+			return;
+		}
+		if (event.key === "Enter") {
+			event.preventDefault();
+			selectResult(results()[activeIndex()]);
+		}
+	}
+	return createComponent(Show, {
+		get when() {
+			return open();
+		},
+		get children() {
+			var _el$ = _tmpl$2(), _el$2 = _el$.firstChild, _el$5 = _el$2.firstChild.firstChild.nextSibling;
+			_el$.$$click = close;
+			_el$2.$$keydown = onDialogKeyDown;
+			_el$2.$$click = (event) => event.stopPropagation();
+			_el$5.$$input = (event) => onInput(event.currentTarget.value);
+			var _ref$ = inputRef;
+			typeof _ref$ === "function" ? use(_ref$, _el$5) : inputRef = _el$5;
+			insert(_el$2, createComponent(Show, {
+				get when() {
+					return results().length > 0;
+				},
+				get fallback() {
+					return (() => {
+						var _el$7 = _tmpl$3();
+						insert(_el$7, () => query().trim().length < 2 ? "Keep typing to search…" : "No results");
+						return _el$7;
+					})();
+				},
+				get children() {
+					var _el$6 = _tmpl$();
+					insert(_el$6, createComponent(For, {
+						get each() {
+							return results();
+						},
+						children: (result, index) => (() => {
+							var _el$8 = _tmpl$4(), _el$9 = _el$8.firstChild, _el$0 = _el$9.firstChild, _el$1 = _el$0.nextSibling;
+							_el$9.addEventListener("mouseenter", () => setActiveIndex(index()));
+							_el$9.$$click = () => selectResult(result);
+							insert(_el$0, () => result.label);
+							insert(_el$1, () => capitalize(result.collection));
+							effect(() => _el$9.classList.toggle("bg-[var(--link-bg-hover)]", !!(activeIndex() === index())));
+							return _el$8;
+						})()
+					}));
+					return _el$6;
+				}
+			}), null);
+			effect(() => _el$5.value = query());
+			return _el$;
+		}
+	});
+}
+delegateEvents([
+	"click",
+	"keydown",
+	"input"
+]);
+//#endregion
+export { CollectionEdit, CollectionList, SearchPalette };
+
+//# sourceMappingURL=index.js.map