@questpie/admin 1.1.1 → 3.0.0

package/dist/client/components/blocks/block-editor-provider.mjs

@@ -0,0 +1,235 @@
+"use client";
+
+import { BlockEditorContextProvider } from "./block-editor-context.mjs";
+import { duplicateBlockInTree, getAllBlockIds, getDefaultValues, insertBlockInTree, removeBlockFromTree, reorderBlockInTree } from "./utils/tree-utils.mjs";
+import { c } from "react/compiler-runtime";
+import * as React from "react";
+import { createStore } from "zustand";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/client/components/blocks/block-editor-provider.tsx
+/**
+* Block Editor Provider
+*
+* Provides selector-driven state and actions for the block editor.
+*/
+function BlockEditorProvider(t0) {
+	const $ = c(18);
+	const { value, onChange, blocks, allowedBlocks, locale: t1, children } = t0;
+	const locale = t1 === void 0 ? "en" : t1;
+	const onChangeRef = React.useRef(onChange);
+	let t2;
+	let t3;
+	if ($[0] !== onChange) {
+		t2 = () => {
+			onChangeRef.current = onChange;
+		};
+		t3 = [onChange];
+		$[0] = onChange;
+		$[1] = t2;
+		$[2] = t3;
+	} else {
+		t2 = $[1];
+		t3 = $[2];
+	}
+	React.useEffect(t2, t3);
+	let t4;
+	if ($[3] !== allowedBlocks || $[4] !== blocks || $[5] !== locale || $[6] !== value) {
+		t4 = () => createStore((set, get) => {
+			const actions = {
+				selectBlock: (id) => {
+					set((prev) => ({
+						selectedBlockId: id,
+						isLibraryOpen: id !== null ? false : prev.isLibraryOpen,
+						insertPosition: id !== null ? null : prev.insertPosition
+					}));
+				},
+				toggleExpanded: (id_0) => {
+					set((prev_0) => {
+						const next = new Set(prev_0.expandedBlockIds);
+						if (next.has(id_0)) next.delete(id_0);
+						else next.add(id_0);
+						return { expandedBlockIds: next };
+					});
+				},
+				expandAll: () => {
+					const allIds = getAllBlockIds(get().content._tree);
+					set({ expandedBlockIds: new Set(allIds) });
+				},
+				collapseAll: () => {
+					set({ expandedBlockIds: /* @__PURE__ */ new Set() });
+				},
+				addBlock: (type, position) => {
+					const state = get();
+					const blockDef = state.blocks[type];
+					if (!blockDef) {
+						if (process.env.NODE_ENV !== "production") console.warn(`Block type "${type}" not found`);
+						return;
+					}
+					const newBlock = {
+						id: crypto.randomUUID(),
+						type,
+						children: []
+					};
+					const newValues = getDefaultValues(blockDef.fields);
+					const nextContent = {
+						_tree: insertBlockInTree(state.content._tree, newBlock, position),
+						_values: {
+							...state.content._values,
+							[newBlock.id]: newValues
+						}
+					};
+					onChangeRef.current(nextContent);
+					set((prev_1) => ({
+						content: nextContent,
+						selectedBlockId: newBlock.id,
+						isLibraryOpen: false,
+						insertPosition: null,
+						expandedBlockIds: position.parentId ? new Set([...prev_1.expandedBlockIds, position.parentId]) : prev_1.expandedBlockIds
+					}));
+				},
+				removeBlock: (id_1) => {
+					const state_0 = get();
+					const { newTree, removedIds } = removeBlockFromTree(state_0.content._tree, id_1);
+					const newValues_0 = { ...state_0.content._values };
+					for (const removedId of removedIds) delete newValues_0[removedId];
+					const nextContent_0 = {
+						_tree: newTree,
+						_values: newValues_0
+					};
+					onChangeRef.current(nextContent_0);
+					set((prev_2) => {
+						const nextExpanded = new Set(prev_2.expandedBlockIds);
+						for (const removedId_0 of removedIds) nextExpanded.delete(removedId_0);
+						return {
+							content: nextContent_0,
+							expandedBlockIds: nextExpanded,
+							selectedBlockId: prev_2.selectedBlockId === id_1 || (prev_2.selectedBlockId ? removedIds.includes(prev_2.selectedBlockId) : false) ? null : prev_2.selectedBlockId
+						};
+					});
+				},
+				duplicateBlock: (id_2) => {
+					const state_1 = get();
+					const { newTree: newTree_0, newIds, newValues: newValues_1 } = duplicateBlockInTree(state_1.content._tree, state_1.content._values, id_2);
+					const nextContent_1 = {
+						_tree: newTree_0,
+						_values: {
+							...state_1.content._values,
+							...newValues_1
+						}
+					};
+					onChangeRef.current(nextContent_1);
+					set({
+						content: nextContent_1,
+						selectedBlockId: newIds.length > 0 ? newIds[0] : state_1.selectedBlockId
+					});
+				},
+				moveBlock: (_id, parentId, fromIndex, toIndex) => {
+					const state_2 = get();
+					const nextContent_2 = {
+						...state_2.content,
+						_tree: reorderBlockInTree(state_2.content._tree, parentId, fromIndex, toIndex)
+					};
+					onChangeRef.current(nextContent_2);
+					set({ content: nextContent_2 });
+				},
+				updateBlockValues: (id_3, newValues_2) => {
+					const state_3 = get();
+					const nextContent_3 = {
+						...state_3.content,
+						_values: {
+							...state_3.content._values,
+							[id_3]: {
+								...state_3.content._values[id_3],
+								...newValues_2
+							}
+						}
+					};
+					onChangeRef.current(nextContent_3);
+					set({ content: nextContent_3 });
+				},
+				openLibrary: (position_0) => {
+					set({
+						insertPosition: position_0,
+						isLibraryOpen: true,
+						selectedBlockId: null
+					});
+				},
+				closeLibrary: () => {
+					set({
+						isLibraryOpen: false,
+						insertPosition: null
+					});
+				}
+			};
+			let initialAllowedBlocks;
+			if (allowedBlocks != null) initialAllowedBlocks = allowedBlocks;
+			else initialAllowedBlocks = null;
+			return {
+				content: value,
+				selectedBlockId: null,
+				expandedBlockIds: /* @__PURE__ */ new Set(),
+				isLibraryOpen: false,
+				insertPosition: null,
+				blocks,
+				allowedBlocks: initialAllowedBlocks,
+				locale,
+				actions
+			};
+		});
+		$[3] = allowedBlocks;
+		$[4] = blocks;
+		$[5] = locale;
+		$[6] = value;
+		$[7] = t4;
+	} else t4 = $[7];
+	const [store] = React.useState(t4);
+	let t5;
+	let t6;
+	if ($[8] !== allowedBlocks || $[9] !== blocks || $[10] !== locale || $[11] !== store || $[12] !== value) {
+		t5 = () => {
+			const state_4 = store.getState();
+			let nextAllowedBlocks;
+			if (allowedBlocks != null) nextAllowedBlocks = allowedBlocks;
+			else nextAllowedBlocks = null;
+			const patch = {};
+			if (state_4.content !== value) patch.content = value;
+			if (state_4.blocks !== blocks) patch.blocks = blocks;
+			if (state_4.allowedBlocks !== nextAllowedBlocks) patch.allowedBlocks = nextAllowedBlocks;
+			if (state_4.locale !== locale) patch.locale = locale;
+			if (Object.keys(patch).length > 0) store.setState(patch);
+		};
+		t6 = [
+			value,
+			blocks,
+			allowedBlocks,
+			locale,
+			store
+		];
+		$[8] = allowedBlocks;
+		$[9] = blocks;
+		$[10] = locale;
+		$[11] = store;
+		$[12] = value;
+		$[13] = t5;
+		$[14] = t6;
+	} else {
+		t5 = $[13];
+		t6 = $[14];
+	}
+	React.useEffect(t5, t6);
+	let t7;
+	if ($[15] !== children || $[16] !== store) {
+		t7 = /* @__PURE__ */ jsx(BlockEditorContextProvider, {
+			value: store,
+			children
+		});
+		$[15] = children;
+		$[16] = store;
+		$[17] = t7;
+	} else t7 = $[17];
+	return t7;
+}
+
+//#endregion
+export { BlockEditorProvider };

package/dist/client/components/blocks/block-fields-renderer.mjs

@@ -0,0 +1,240 @@
+"use client";
+
+import { useResolveText, useTranslation } from "../../i18n/hooks.mjs";
+import { selectAdmin, useAdminStore } from "../../runtime/provider.mjs";
+import { buildFieldDefinitionsFromMetadata } from "../../utils/build-field-definitions-from-schema.mjs";
+import { FieldLayoutRenderer } from "../layout/field-layout-renderer.mjs";
+import { c } from "react/compiler-runtime";
+import "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/client/components/blocks/block-fields-renderer.tsx
+/**
+* Block Fields Renderer
+*
+* Renders form fields for a block inline (inside the block card).
+* Uses registered field components from the admin config.
+*/
+function BlockFieldsRenderer(t0) {
+	const $ = c(24);
+	const { blockId, blockSchema } = t0;
+	const { t } = useTranslation();
+	const admin = useAdminStore(selectAdmin);
+	blockSchema?.fields;
+	let t1;
+	bb0: {
+		if (!blockSchema?.fields || !admin) {
+			let t2$2;
+			if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
+				t2$2 = {};
+				$[0] = t2$2;
+			} else t2$2 = $[0];
+			t1 = t2$2;
+			break bb0;
+		}
+		const t2$1 = blockSchema.fields;
+		let t3$1;
+		if ($[1] !== admin || $[2] !== t2$1) {
+			t3$1 = buildFieldDefinitionsFromMetadata(t2$1, admin.getFields());
+			$[1] = admin;
+			$[2] = t2$1;
+			$[3] = t3$1;
+		} else t3$1 = $[3];
+		t1 = t3$1;
+	}
+	const blockFields = t1;
+	const resolveText = useResolveText();
+	if (Object.keys(blockFields).length === 0) {
+		let t2$1;
+		if ($[4] !== t) {
+			t2$1 = t("blocks.noEditableFields");
+			$[4] = t;
+			$[5] = t2$1;
+		} else t2$1 = $[5];
+		let t3$1;
+		if ($[6] !== t2$1) {
+			t3$1 = /* @__PURE__ */ jsx("div", {
+				className: "text-muted-foreground py-4 text-center text-sm",
+				children: t2$1
+			});
+			$[6] = t2$1;
+			$[7] = t3$1;
+		} else t3$1 = $[7];
+		return t3$1;
+	}
+	if (blockSchema.form?.fields?.length) {
+		let t2$1;
+		if ($[8] !== blockFields || $[9] !== blockId) {
+			t2$1 = (fieldName, opts) => {
+				const fieldDef = blockFields[fieldName];
+				if (!fieldDef) return null;
+				return /* @__PURE__ */ jsx(BlockField, {
+					name: fieldName,
+					blockId,
+					definition: fieldDef
+				}, `${blockId}:${fieldName}`);
+			};
+			$[8] = blockFields;
+			$[9] = blockId;
+			$[10] = t2$1;
+		} else t2$1 = $[10];
+		let t3$1;
+		if ($[11] !== resolveText) {
+			t3$1 = (text, fallback) => resolveText(text, fallback);
+			$[11] = resolveText;
+			$[12] = t3$1;
+		} else t3$1 = $[12];
+		let t4;
+		if ($[13] !== t2$1 || $[14] !== t3$1) {
+			t4 = {
+				renderField: t2$1,
+				resolveText: t3$1
+			};
+			$[13] = t2$1;
+			$[14] = t3$1;
+			$[15] = t4;
+		} else t4 = $[15];
+		const layoutCtx = t4;
+		const t5 = blockSchema.form.fields;
+		let t6;
+		if ($[16] !== layoutCtx || $[17] !== t5) {
+			t6 = /* @__PURE__ */ jsx(FieldLayoutRenderer, {
+				items: t5,
+				ctx: layoutCtx
+			});
+			$[16] = layoutCtx;
+			$[17] = t5;
+			$[18] = t6;
+		} else t6 = $[18];
+		return t6;
+	}
+	let t2;
+	if ($[19] !== blockFields) {
+		t2 = Object.entries(blockFields);
+		$[19] = blockFields;
+		$[20] = t2;
+	} else t2 = $[20];
+	let t3;
+	if ($[21] !== blockId || $[22] !== t2) {
+		t3 = /* @__PURE__ */ jsx("div", {
+			className: "space-y-4",
+			children: t2.map((t4) => {
+				const [fieldName_0, fieldDef_0] = t4;
+				return /* @__PURE__ */ jsx(BlockField, {
+					name: fieldName_0,
+					blockId,
+					definition: fieldDef_0
+				}, `${blockId}:${fieldName_0}`);
+			})
+		});
+		$[21] = blockId;
+		$[22] = t2;
+		$[23] = t3;
+	} else t3 = $[23];
+	return t3;
+}
+function BlockField(t0) {
+	const $ = c(29);
+	const { name, blockId, definition } = t0;
+	const resolveText = useResolveText();
+	let t1;
+	if ($[0] !== definition) {
+		t1 = definition["~options"] || {};
+		$[0] = definition;
+		$[1] = t1;
+	} else t1 = $[1];
+	const options = t1;
+	const fieldType = definition.name;
+	let t2;
+	if ($[2] !== name || $[3] !== options.label || $[4] !== resolveText) {
+		t2 = resolveText(options.label, name);
+		$[2] = name;
+		$[3] = options.label;
+		$[4] = resolveText;
+		$[5] = t2;
+	} else t2 = $[5];
+	const label = t2;
+	let t3;
+	if ($[6] !== options.description || $[7] !== resolveText) {
+		t3 = resolveText(options.description, "");
+		$[6] = options.description;
+		$[7] = resolveText;
+		$[8] = t3;
+	} else t3 = $[8];
+	const description = t3;
+	let t4;
+	if ($[9] !== options.placeholder || $[10] !== resolveText) {
+		t4 = resolveText(options.placeholder, "");
+		$[9] = options.placeholder;
+		$[10] = resolveText;
+		$[11] = t4;
+	} else t4 = $[11];
+	const placeholder = t4;
+	const scopedName = `content._values.${blockId}.${name}`;
+	const FieldComponent = definition.component;
+	if (!FieldComponent) {
+		let t5$1;
+		if ($[12] !== fieldType) {
+			t5$1 = /* @__PURE__ */ jsxs("div", {
+				className: "text-destructive text-sm",
+				children: ["No component registered for field type: ", fieldType]
+			});
+			$[12] = fieldType;
+			$[13] = t5$1;
+		} else t5$1 = $[13];
+		return t5$1;
+	}
+	const t5 = options.required ?? false;
+	const t6 = options.disabled ?? false;
+	const t7 = options.readOnly ?? false;
+	const t8 = options.localized ?? false;
+	let t9;
+	if ($[14] !== options) {
+		t9 = stripUiOptions(options);
+		$[14] = options;
+		$[15] = t9;
+	} else t9 = $[15];
+	let t10;
+	if ($[16] !== description || $[17] !== label || $[18] !== placeholder || $[19] !== scopedName || $[20] !== t5 || $[21] !== t6 || $[22] !== t7 || $[23] !== t8 || $[24] !== t9) {
+		t10 = {
+			name: scopedName,
+			label,
+			description,
+			placeholder,
+			required: t5,
+			disabled: t6,
+			readOnly: t7,
+			localized: t8,
+			...t9
+		};
+		$[16] = description;
+		$[17] = label;
+		$[18] = placeholder;
+		$[19] = scopedName;
+		$[20] = t5;
+		$[21] = t6;
+		$[22] = t7;
+		$[23] = t8;
+		$[24] = t9;
+		$[25] = t10;
+	} else t10 = $[25];
+	const componentProps = t10;
+	let t11;
+	if ($[26] !== FieldComponent || $[27] !== componentProps) {
+		t11 = /* @__PURE__ */ jsx(FieldComponent, { ...componentProps });
+		$[26] = FieldComponent;
+		$[27] = componentProps;
+		$[28] = t11;
+	} else t11 = $[28];
+	return t11;
+}
+/**
+* Strip UI-specific options that shouldn't be passed to field components
+*/
+function stripUiOptions(options) {
+	const { label: _label, description: _description, placeholder: _placeholder, required: _required, disabled: _disabled, readOnly: _readOnly, hidden: _hidden, visible: _visible, localized: _localized, locale: _locale, compute: _compute, onChange: _onChange, ...rest } = options;
+	return rest;
+}
+
+//#endregion
+export { BlockFieldsRenderer };

package/dist/client/components/blocks/block-insert-button.mjs

@@ -0,0 +1,189 @@
+"use client";
+
+import { useTranslation } from "../../i18n/hooks.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { Button } from "../ui/button.mjs";
+import { useBlockEditorActions } from "./block-editor-context.mjs";
+import { c } from "react/compiler-runtime";
+import { Icon } from "@iconify/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/client/components/blocks/block-insert-button.tsx
+/**
+* Block Insert Button
+*
+* Button to add new blocks at a specific position.
+* Opens the block library sidebar.
+*/
+function BlockInsertButton(t0) {
+	const $ = c(39);
+	const { position, compact: t1, variant: t2, parentLabel, className } = t0;
+	const compact = t1 === void 0 ? false : t1;
+	const variant = t2 === void 0 ? "default" : t2;
+	const { t } = useTranslation();
+	const { openLibrary } = useBlockEditorActions();
+	let t3;
+	if ($[0] !== openLibrary || $[1] !== position) {
+		t3 = () => {
+			openLibrary(position);
+		};
+		$[0] = openLibrary;
+		$[1] = position;
+		$[2] = t3;
+	} else t3 = $[2];
+	const handleOpen = t3;
+	if (variant === "compact" || compact) {
+		let t4$1;
+		if ($[3] !== className) {
+			t4$1 = cn("group relative z-10 -my-0.5 w-full cursor-pointer", "h-2 sm:h-1.5", className);
+			$[3] = className;
+			$[4] = t4$1;
+		} else t4$1 = $[4];
+		let t5$1;
+		if ($[5] !== handleOpen) {
+			t5$1 = (e) => {
+				if (e.key === "Enter" || e.key === " ") {
+					e.preventDefault();
+					handleOpen();
+				}
+			};
+			$[5] = handleOpen;
+			$[6] = t5$1;
+		} else t5$1 = $[6];
+		let t6$1;
+		if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
+			t6$1 = /* @__PURE__ */ jsx("div", { className: "bg-primary/40 sm:group-hover:bg-primary absolute inset-x-0 top-1/2 h-0.5 -translate-y-1/2 transition-colors sm:bg-transparent" });
+			$[7] = t6$1;
+		} else t6$1 = $[7];
+		let t7$1;
+		if ($[8] === Symbol.for("react.memo_cache_sentinel")) {
+			t7$1 = /* @__PURE__ */ jsx(Icon, {
+				icon: "ph:plus-bold",
+				width: 10,
+				height: 10
+			});
+			$[8] = t7$1;
+		} else t7$1 = $[8];
+		let t8;
+		if ($[9] !== t) {
+			t8 = t("common.add");
+			$[9] = t;
+			$[10] = t8;
+		} else t8 = $[10];
+		let t9;
+		if ($[11] !== t8) {
+			t9 = /* @__PURE__ */ jsx("div", {
+				className: "pointer-events-none absolute inset-x-0 top-1/2 flex -translate-y-1/2 items-center justify-center opacity-100 transition-opacity sm:opacity-0 sm:group-hover:opacity-100",
+				children: /* @__PURE__ */ jsxs("div", {
+					className: "bg-primary text-primary-foreground pointer-events-auto flex cursor-pointer items-center gap-1 rounded-full px-2 py-0.5 text-xs shadow-sm",
+					children: [t7$1, /* @__PURE__ */ jsx("span", { children: t8 })]
+				})
+			});
+			$[11] = t8;
+			$[12] = t9;
+		} else t9 = $[12];
+		let t10;
+		if ($[13] !== handleOpen || $[14] !== t4$1 || $[15] !== t5$1 || $[16] !== t9) {
+			t10 = /* @__PURE__ */ jsxs("div", {
+				className: t4$1,
+				role: "button",
+				tabIndex: 0,
+				onClick: handleOpen,
+				onKeyDown: t5$1,
+				children: [t6$1, t9]
+			});
+			$[13] = handleOpen;
+			$[14] = t4$1;
+			$[15] = t5$1;
+			$[16] = t9;
+			$[17] = t10;
+		} else t10 = $[17];
+		return t10;
+	}
+	if (variant === "rail") {
+		let t4$1;
+		if ($[18] !== className) {
+			t4$1 = cn("group text-muted-foreground hover:text-foreground relative flex items-center gap-2 text-xs font-medium transition-colors", className);
+			$[18] = className;
+			$[19] = t4$1;
+		} else t4$1 = $[19];
+		let t5$1;
+		if ($[20] === Symbol.for("react.memo_cache_sentinel")) {
+			t5$1 = /* @__PURE__ */ jsx("div", {
+				className: "border-border bg-background text-muted-foreground group-hover:border-foreground group-hover:text-foreground relative z-10 flex h-5 w-5 items-center justify-center rounded-full border transition-all",
+				children: /* @__PURE__ */ jsx(Icon, {
+					icon: "ph:plus",
+					className: "h-3 w-3"
+				})
+			});
+			$[20] = t5$1;
+		} else t5$1 = $[20];
+		let t6$1;
+		if ($[21] !== parentLabel || $[22] !== t) {
+			t6$1 = parentLabel ? t("blocks.addTo", { parent: parentLabel }) : t("blocks.add");
+			$[21] = parentLabel;
+			$[22] = t;
+			$[23] = t6$1;
+		} else t6$1 = $[23];
+		let t7$1;
+		if ($[24] !== t6$1) {
+			t7$1 = /* @__PURE__ */ jsx("span", {
+				className: "truncate",
+				children: t6$1
+			});
+			$[24] = t6$1;
+			$[25] = t7$1;
+		} else t7$1 = $[25];
+		let t8;
+		if ($[26] !== handleOpen || $[27] !== t4$1 || $[28] !== t7$1) {
+			t8 = /* @__PURE__ */ jsxs("button", {
+				type: "button",
+				className: t4$1,
+				onClick: handleOpen,
+				children: [t5$1, t7$1]
+			});
+			$[26] = handleOpen;
+			$[27] = t4$1;
+			$[28] = t7$1;
+			$[29] = t8;
+		} else t8 = $[29];
+		return t8;
+	}
+	let t4;
+	if ($[30] !== className) {
+		t4 = cn("w-full border-dashed", className);
+		$[30] = className;
+		$[31] = t4;
+	} else t4 = $[31];
+	let t5;
+	if ($[32] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:plus",
+			className: "mr-2 h-4 w-4"
+		});
+		$[32] = t5;
+	} else t5 = $[32];
+	let t6;
+	if ($[33] !== t) {
+		t6 = t("blocks.add");
+		$[33] = t;
+		$[34] = t6;
+	} else t6 = $[34];
+	let t7;
+	if ($[35] !== handleOpen || $[36] !== t4 || $[37] !== t6) {
+		t7 = /* @__PURE__ */ jsxs(Button, {
+			variant: "outline",
+			className: t4,
+			onClick: handleOpen,
+			children: [t5, t6]
+		});
+		$[35] = handleOpen;
+		$[36] = t4;
+		$[37] = t6;
+		$[38] = t7;
+	} else t7 = $[38];
+	return t7;
+}
+
+//#endregion
+export { BlockInsertButton };