@questpie/admin 1.1.1 → 2.0.0

package/dist/client/components/blocks/block-item-menu.mjs

@@ -0,0 +1,161 @@
+"use client";
+
+import { useTranslation } from "../../i18n/hooks.mjs";
+import { Button } from "../ui/button.mjs";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger } from "../ui/dropdown-menu.mjs";
+import { useBlockEditor } from "./block-editor-context.mjs";
+import { BlockTypeIcon } from "./block-type-icon.mjs";
+import { findBlockById, findBlockPosition } from "./utils/tree-utils.mjs";
+import { Icon } from "@iconify/react";
+import * as React$1 from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/client/components/blocks/block-item-menu.tsx
+/**
+* Block Item Menu
+*
+* Shared menu items for block context menu and dropdown.
+* Provides actions like duplicate, delete, add child, etc.
+*/
+function MenuItems({ blockId, canHaveChildren, onDuplicate, onRemove, MenuItem, Separator, SubMenu, SubMenuTrigger, SubMenuContent, onClose }) {
+	const { t } = useTranslation();
+	const { state, actions } = useBlockEditor();
+	const blockTypes = React$1.useMemo(() => {
+		return Object.entries(state.blocks).filter(([type]) => {
+			if (!state.allowedBlocks) return true;
+			return state.allowedBlocks.includes(type);
+		}).map(([type, def]) => ({
+			type,
+			label: getBlockLabel(def)
+		})).sort((a, b) => a.label.localeCompare(b.label));
+	}, [state.blocks, state.allowedBlocks]);
+	const blockPosition = React$1.useMemo(() => findBlockPosition(state.content._tree, blockId), [state.content._tree, blockId]);
+	const handleAddChild = (blockType) => {
+		const childrenCount = findBlockById(state.content._tree, blockId)?.children.length ?? 0;
+		actions.addBlock(blockType, {
+			parentId: blockId,
+			index: childrenCount
+		});
+		if (!state.expandedBlockIds.has(blockId)) actions.toggleExpanded(blockId);
+		onClose?.();
+	};
+	const handleAddAbove = (blockType) => {
+		if (!blockPosition) return;
+		actions.addBlock(blockType, {
+			parentId: blockPosition.parentId,
+			index: blockPosition.index
+		});
+		onClose?.();
+	};
+	const handleAddBelow = (blockType) => {
+		if (!blockPosition) return;
+		actions.addBlock(blockType, {
+			parentId: blockPosition.parentId,
+			index: blockPosition.index + 1
+		});
+		onClose?.();
+	};
+	const handleDuplicate = () => {
+		onDuplicate();
+		onClose?.();
+	};
+	const handleRemove = () => {
+		onRemove();
+		onClose?.();
+	};
+	return /* @__PURE__ */ jsxs(Fragment, { children: [
+		blockTypes.length > 0 && blockPosition && /* @__PURE__ */ jsxs(Fragment, { children: [
+			/* @__PURE__ */ jsxs(SubMenu, { children: [/* @__PURE__ */ jsxs(SubMenuTrigger, { children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:arrow-up",
+				className: "h-4 w-4"
+			}), t("blocks.addAbove")] }), /* @__PURE__ */ jsx(SubMenuContent, { children: blockTypes.map(({ type, label }) => /* @__PURE__ */ jsxs(MenuItem, {
+				onClick: () => handleAddAbove(type),
+				children: [/* @__PURE__ */ jsx(BlockTypeIcon, {
+					type,
+					className: "h-4 w-4"
+				}), label]
+			}, type)) })] }),
+			/* @__PURE__ */ jsxs(SubMenu, { children: [/* @__PURE__ */ jsxs(SubMenuTrigger, { children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:arrow-down",
+				className: "h-4 w-4"
+			}), t("blocks.addBelow")] }), /* @__PURE__ */ jsx(SubMenuContent, { children: blockTypes.map(({ type, label }) => /* @__PURE__ */ jsxs(MenuItem, {
+				onClick: () => handleAddBelow(type),
+				children: [/* @__PURE__ */ jsx(BlockTypeIcon, {
+					type,
+					className: "h-4 w-4"
+				}), label]
+			}, type)) })] }),
+			canHaveChildren && /* @__PURE__ */ jsxs(SubMenu, { children: [/* @__PURE__ */ jsxs(SubMenuTrigger, { children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:plus",
+				className: "h-4 w-4"
+			}), t("blocks.addChild")] }), /* @__PURE__ */ jsx(SubMenuContent, { children: blockTypes.map(({ type, label }) => /* @__PURE__ */ jsxs(MenuItem, {
+				onClick: () => handleAddChild(type),
+				children: [/* @__PURE__ */ jsx(BlockTypeIcon, {
+					type,
+					className: "h-4 w-4"
+				}), label]
+			}, type)) })] }),
+			/* @__PURE__ */ jsx(Separator, {})
+		] }),
+		/* @__PURE__ */ jsxs(MenuItem, {
+			onClick: handleDuplicate,
+			children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:copy",
+				className: "h-4 w-4"
+			}), t("common.duplicate")]
+		}),
+		/* @__PURE__ */ jsx(Separator, {}),
+		/* @__PURE__ */ jsxs(MenuItem, {
+			variant: "destructive",
+			onClick: handleRemove,
+			children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:trash",
+				className: "h-4 w-4"
+			}), t("common.delete")]
+		})
+	] });
+}
+function BlockItemDropdownMenu({ className, ...menuProps }) {
+	const [open, setOpen] = React$1.useState(false);
+	return /* @__PURE__ */ jsxs(DropdownMenu, {
+		open,
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsxs(DropdownMenuTrigger, {
+			render: /* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				size: "icon",
+				className,
+				onClick: (e) => e.stopPropagation()
+			}),
+			children: [/* @__PURE__ */ jsx(Icon, {
+				icon: "ph:dots-three-vertical",
+				className: "h-4 w-4"
+			}), /* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: "Block actions"
+			})]
+		}), /* @__PURE__ */ jsx(DropdownMenuContent, {
+			align: "end",
+			children: /* @__PURE__ */ jsx(MenuItems, {
+				...menuProps,
+				MenuItem: DropdownMenuItem,
+				Separator: DropdownMenuSeparator,
+				SubMenu: DropdownMenuSub,
+				SubMenuTrigger: DropdownMenuSubTrigger,
+				SubMenuContent: DropdownMenuSubContent,
+				onClose: () => setOpen(false)
+			})
+		})]
+	});
+}
+function getBlockLabel(blockDef) {
+	const label = blockDef.admin?.label;
+	if (!label) return blockDef.name || "Block";
+	if (typeof label === "string") return label;
+	if ("key" in label) return label.fallback || blockDef.name || "Block";
+	return label.en || Object.values(label)[0] || blockDef.name || "Block";
+}
+
+//#endregion
+export { BlockItemDropdownMenu };
+//# sourceMappingURL=block-item-menu.mjs.map

package/dist/client/components/blocks/block-item-menu.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"block-item-menu.mjs","names":["React"],"sources":["../../../../src/client/components/blocks/block-item-menu.tsx"],"sourcesContent":["/**\n * Block Item Menu\n *\n * Shared menu items for block context menu and dropdown.\n * Provides actions like duplicate, delete, add child, etc.\n */\n\n\"use client\";\n\nimport { Icon } from \"@iconify/react\";\nimport * as React from \"react\";\nimport { useTranslation } from \"../../i18n/hooks.js\";\nimport { Button } from \"../ui/button.js\";\nimport {\n\tContextMenu,\n\tContextMenuContent,\n\tContextMenuItem,\n\tContextMenuSeparator,\n\tContextMenuSub,\n\tContextMenuSubContent,\n\tContextMenuSubTrigger,\n\tContextMenuTrigger,\n} from \"../ui/context-menu.js\";\nimport {\n\tDropdownMenu,\n\tDropdownMenuContent,\n\tDropdownMenuItem,\n\tDropdownMenuSeparator,\n\tDropdownMenuSub,\n\tDropdownMenuSubContent,\n\tDropdownMenuSubTrigger,\n\tDropdownMenuTrigger,\n} from \"../ui/dropdown-menu.js\";\nimport { useBlockEditor } from \"./block-editor-context.js\";\nimport { BlockTypeIcon } from \"./block-type-icon.js\";\nimport { findBlockById, findBlockPosition } from \"./utils/tree-utils.js\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport interface BlockItemMenuProps {\n\t/** Block ID */\n\tblockId: string;\n\t/** Whether this block can have children */\n\tcanHaveChildren: boolean;\n\t/** Callback for duplicate */\n\tonDuplicate: () => void;\n\t/** Callback for remove */\n\tonRemove: () => void;\n}\n\n// ============================================================================\n// Shared Menu Content\n// ============================================================================\n\ninterface MenuItemsProps extends BlockItemMenuProps {\n\t/** Render function for menu item */\n\tMenuItem: React.ComponentType<{\n\t\tonClick?: () => void;\n\t\tvariant?: \"default\" | \"destructive\";\n\t\tchildren: React.ReactNode;\n\t}>;\n\t/** Render function for separator */\n\tSeparator: React.ComponentType;\n\t/** Render function for submenu */\n\tSubMenu: React.ComponentType<{ children: React.ReactNode }>;\n\t/** Render function for submenu trigger */\n\tSubMenuTrigger: React.ComponentType<{ children: React.ReactNode }>;\n\t/** Render function for submenu content */\n\tSubMenuContent: React.ComponentType<{ children: React.ReactNode }>;\n\t/** Close the menu */\n\tonClose?: () => void;\n}\n\nfunction MenuItems({\n\tblockId,\n\tcanHaveChildren,\n\tonDuplicate,\n\tonRemove,\n\tMenuItem,\n\tSeparator,\n\tSubMenu,\n\tSubMenuTrigger,\n\tSubMenuContent,\n\tonClose,\n}: MenuItemsProps) {\n\tconst { t } = useTranslation();\n\tconst { state, actions } = useBlockEditor();\n\n\t// Get available block types for add actions\n\tconst blockTypes = React.useMemo(() => {\n\t\treturn Object.entries(state.blocks)\n\t\t\t.filter(([type]) => {\n\t\t\t\tif (!state.allowedBlocks) return true;\n\t\t\t\treturn state.allowedBlocks.includes(type);\n\t\t\t})\n\t\t\t.map(([type, def]) => ({\n\t\t\t\ttype,\n\t\t\t\tlabel: getBlockLabel(def),\n\t\t\t}))\n\t\t\t.sort((a, b) => a.label.localeCompare(b.label));\n\t}, [state.blocks, state.allowedBlocks]);\n\n\tconst blockPosition = React.useMemo(\n\t\t() => findBlockPosition(state.content._tree, blockId),\n\t\t[state.content._tree, blockId],\n\t);\n\n\tconst handleAddChild = (blockType: string) => {\n\t\t// Find current block to get children count\n\t\tconst block = findBlockById(state.content._tree, blockId);\n\t\tconst childrenCount = block?.children.length ?? 0;\n\n\t\tactions.addBlock(blockType, {\n\t\t\tparentId: blockId,\n\t\t\tindex: childrenCount,\n\t\t});\n\n\t\t// Make sure block is expanded\n\t\tif (!state.expandedBlockIds.has(blockId)) {\n\t\t\tactions.toggleExpanded(blockId);\n\t\t}\n\n\t\tonClose?.();\n\t};\n\n\tconst handleAddAbove = (blockType: string) => {\n\t\tif (!blockPosition) return;\n\t\tactions.addBlock(blockType, {\n\t\t\tparentId: blockPosition.parentId,\n\t\t\tindex: blockPosition.index,\n\t\t});\n\t\tonClose?.();\n\t};\n\n\tconst handleAddBelow = (blockType: string) => {\n\t\tif (!blockPosition) return;\n\t\tactions.addBlock(blockType, {\n\t\t\tparentId: blockPosition.parentId,\n\t\t\tindex: blockPosition.index + 1,\n\t\t});\n\t\tonClose?.();\n\t};\n\n\tconst handleDuplicate = () => {\n\t\tonDuplicate();\n\t\tonClose?.();\n\t};\n\n\tconst handleRemove = () => {\n\t\tonRemove();\n\t\tonClose?.();\n\t};\n\n\treturn (\n\t\t<>\n\t\t\t{blockTypes.length > 0 && blockPosition && (\n\t\t\t\t<>\n\t\t\t\t\t<SubMenu>\n\t\t\t\t\t\t<SubMenuTrigger>\n\t\t\t\t\t\t\t<Icon icon=\"ph:arrow-up\" className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t{t(\"blocks.addAbove\")}\n\t\t\t\t\t\t</SubMenuTrigger>\n\t\t\t\t\t\t<SubMenuContent>\n\t\t\t\t\t\t\t{blockTypes.map(({ type, label }) => (\n\t\t\t\t\t\t\t\t<MenuItem key={type} onClick={() => handleAddAbove(type)}>\n\t\t\t\t\t\t\t\t\t<BlockTypeIcon type={type} className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SubMenuContent>\n\t\t\t\t\t</SubMenu>\n\t\t\t\t\t<SubMenu>\n\t\t\t\t\t\t<SubMenuTrigger>\n\t\t\t\t\t\t\t<Icon icon=\"ph:arrow-down\" className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t{t(\"blocks.addBelow\")}\n\t\t\t\t\t\t</SubMenuTrigger>\n\t\t\t\t\t\t<SubMenuContent>\n\t\t\t\t\t\t\t{blockTypes.map(({ type, label }) => (\n\t\t\t\t\t\t\t\t<MenuItem key={type} onClick={() => handleAddBelow(type)}>\n\t\t\t\t\t\t\t\t\t<BlockTypeIcon type={type} className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</SubMenuContent>\n\t\t\t\t\t</SubMenu>\n\t\t\t\t\t{canHaveChildren && (\n\t\t\t\t\t\t<SubMenu>\n\t\t\t\t\t\t\t<SubMenuTrigger>\n\t\t\t\t\t\t\t\t<Icon icon=\"ph:plus\" className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t\t{t(\"blocks.addChild\")}\n\t\t\t\t\t\t\t</SubMenuTrigger>\n\t\t\t\t\t\t\t<SubMenuContent>\n\t\t\t\t\t\t\t\t{blockTypes.map(({ type, label }) => (\n\t\t\t\t\t\t\t\t\t<MenuItem key={type} onClick={() => handleAddChild(type)}>\n\t\t\t\t\t\t\t\t\t\t<BlockTypeIcon type={type} className=\"h-4 w-4\" />\n\t\t\t\t\t\t\t\t\t\t{label}\n\t\t\t\t\t\t\t\t\t</MenuItem>\n\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t</SubMenuContent>\n\t\t\t\t\t\t</SubMenu>\n\t\t\t\t\t)}\n\t\t\t\t\t<Separator />\n\t\t\t\t</>\n\t\t\t)}\n\n\t\t\t{/* Duplicate */}\n\t\t\t<MenuItem onClick={handleDuplicate}>\n\t\t\t\t<Icon icon=\"ph:copy\" className=\"h-4 w-4\" />\n\t\t\t\t{t(\"common.duplicate\")}\n\t\t\t</MenuItem>\n\n\t\t\t<Separator />\n\n\t\t\t{/* Delete */}\n\t\t\t<MenuItem variant=\"destructive\" onClick={handleRemove}>\n\t\t\t\t<Icon icon=\"ph:trash\" className=\"h-4 w-4\" />\n\t\t\t\t{t(\"common.delete\")}\n\t\t\t</MenuItem>\n\t\t</>\n\t);\n}\n\n// ============================================================================\n// Context Menu Wrapper\n// ============================================================================\n\nexport interface BlockItemContextMenuProps extends BlockItemMenuProps {\n\tchildren: React.ReactNode;\n}\n\nexport function BlockItemContextMenu({\n\tchildren,\n\t...menuProps\n}: BlockItemContextMenuProps) {\n\treturn (\n\t\t<ContextMenu>\n\t\t\t<ContextMenuTrigger className=\"block\">{children}</ContextMenuTrigger>\n\t\t\t<ContextMenuContent>\n\t\t\t\t<MenuItems\n\t\t\t\t\t{...menuProps}\n\t\t\t\t\tMenuItem={ContextMenuItem}\n\t\t\t\t\tSeparator={ContextMenuSeparator}\n\t\t\t\t\tSubMenu={ContextMenuSub}\n\t\t\t\t\tSubMenuTrigger={ContextMenuSubTrigger}\n\t\t\t\t\tSubMenuContent={ContextMenuSubContent}\n\t\t\t\t/>\n\t\t\t</ContextMenuContent>\n\t\t</ContextMenu>\n\t);\n}\n\n// ============================================================================\n// Dropdown Menu Button\n// ============================================================================\n\nexport interface BlockItemDropdownMenuProps extends BlockItemMenuProps {\n\tclassName?: string;\n}\n\nexport function BlockItemDropdownMenu({\n\tclassName,\n\t...menuProps\n}: BlockItemDropdownMenuProps) {\n\tconst [open, setOpen] = React.useState(false);\n\n\treturn (\n\t\t<DropdownMenu open={open} onOpenChange={setOpen}>\n\t\t\t<DropdownMenuTrigger\n\t\t\t\trender={\n\t\t\t\t\t<Button\n\t\t\t\t\t\tvariant=\"ghost\"\n\t\t\t\t\t\tsize=\"icon\"\n\t\t\t\t\t\tclassName={className}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<Icon icon=\"ph:dots-three-vertical\" className=\"h-4 w-4\" />\n\t\t\t\t<span className=\"sr-only\">Block actions</span>\n\t\t\t</DropdownMenuTrigger>\n\t\t\t<DropdownMenuContent align=\"end\">\n\t\t\t\t<MenuItems\n\t\t\t\t\t{...menuProps}\n\t\t\t\t\tMenuItem={DropdownMenuItem}\n\t\t\t\t\tSeparator={DropdownMenuSeparator}\n\t\t\t\t\tSubMenu={DropdownMenuSub}\n\t\t\t\t\tSubMenuTrigger={DropdownMenuSubTrigger}\n\t\t\t\t\tSubMenuContent={DropdownMenuSubContent}\n\t\t\t\t\tonClose={() => setOpen(false)}\n\t\t\t\t/>\n\t\t\t</DropdownMenuContent>\n\t\t</DropdownMenu>\n\t);\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nimport type { BlockSchema } from \"#questpie/admin/server\";\n\nfunction getBlockLabel(blockDef: BlockSchema): string {\n\tconst label = blockDef.admin?.label;\n\n\tif (!label) {\n\t\treturn blockDef.name || \"Block\";\n\t}\n\n\tif (typeof label === \"string\") {\n\t\treturn label;\n\t}\n\n\tif (\"key\" in label) {\n\t\treturn label.fallback || blockDef.name || \"Block\";\n\t}\n\n\t// I18nLocaleMap\n\treturn label.en || Object.values(label)[0] || blockDef.name || \"Block\";\n}\n"],"mappings":"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"}

package/dist/client/components/blocks/block-item.mjs

@@ -0,0 +1,187 @@
+"use client";
+
+import { cn } from "../../lib/utils.mjs";
+import { Card, CardContent, CardHeader } from "../ui/card.mjs";
+import { useBlockEditor, useBlockSchema, useIsBlockExpanded } from "./block-editor-context.mjs";
+import { BlockInsertButton } from "./block-insert-button.mjs";
+import { BlockFieldsRenderer } from "./block-fields-renderer.mjs";
+import { BlockIcon } from "./block-type-icon.mjs";
+import { BlockItemDropdownMenu } from "./block-item-menu.mjs";
+import { BlockTree } from "./block-tree.mjs";
+import { Icon } from "@iconify/react";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSortable } from "@dnd-kit/sortable";
+import { CSS } from "@dnd-kit/utilities";
+
+//#region src/client/components/blocks/block-item.tsx
+/**
+* Block Item
+*
+* Single block item with inline editable fields.
+* Click header to expand/collapse, drag handle for reordering.
+*/
+function BlockItem({ block, level, index: _index, parentId: _parentId }) {
+	const { state, actions } = useBlockEditor();
+	const blockSchema = useBlockSchema(block.type);
+	const isExpanded = useIsBlockExpanded(block.id);
+	const canHaveChildren = blockSchema?.allowChildren ?? false;
+	const { attributes, listeners, setNodeRef, transform, transition, isDragging, isOver, active } = useSortable({ id: block.id });
+	const style = {
+		transform: CSS.Transform.toString(transform),
+		transition
+	};
+	const showDropIndicator = isOver && active?.id !== block.id;
+	const values = state.content._values[block.id];
+	const blockLabel = getBlockLabel(block, blockSchema, values);
+	const handleToggleExpand = (e) => {
+		const target = e.target;
+		if (target.closest("[data-drag-handle]") || target.closest("[data-actions-menu]")) return;
+		actions.toggleExpanded(block.id);
+	};
+	const handleDuplicate = React$1.useCallback(() => {
+		actions.duplicateBlock(block.id);
+	}, [actions, block.id]);
+	const handleRemove = React$1.useCallback(() => {
+		actions.removeBlock(block.id);
+	}, [actions, block.id]);
+	const handleKeyDown = (e) => {
+		if (e.key === "Enter" || e.key === " ") {
+			e.preventDefault();
+			actions.toggleExpanded(block.id);
+		}
+	};
+	const isRoot = level === 0;
+	return /* @__PURE__ */ jsxs("div", {
+		ref: setNodeRef,
+		style,
+		className: cn("relative", isDragging && "opacity-50"),
+		children: [
+			showDropIndicator && /* @__PURE__ */ jsx("div", { className: "absolute -top-0.5 left-0 right-0 z-10 h-0.5 bg-primary" }),
+			/* @__PURE__ */ jsxs(Card, {
+				className: cn("overflow-hidden transition-shadow p-0 gap-0"),
+				children: [/* @__PURE__ */ jsxs(CardHeader, {
+					role: "button",
+					tabIndex: 0,
+					className: cn("group flex flex-row items-center gap-2 px-3 py-2 cursor-pointer select-none", "hover:bg-muted/50 transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-inset"),
+					onClick: handleToggleExpand,
+					onKeyDown: handleKeyDown,
+					children: [
+						/* @__PURE__ */ jsx("button", {
+							type: "button",
+							"data-drag-handle": true,
+							className: "cursor-grab active:cursor-grabbing p-1 -ml-1 rounded hover:bg-muted",
+							...attributes,
+							...listeners,
+							onClick: (e) => e.stopPropagation(),
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: "ph:dots-six-vertical",
+								className: "h-4 w-4 text-muted-foreground"
+							})
+						}),
+						/* @__PURE__ */ jsx("div", {
+							className: "text-muted-foreground",
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: "ph:caret-right",
+								className: cn("h-4 w-4 transition-transform duration-150 ease-in-out", isExpanded && "rotate-90")
+							})
+						}),
+						/* @__PURE__ */ jsx(BlockIcon, {
+							icon: blockSchema?.admin?.icon,
+							size: 14,
+							className: isRoot ? "text-foreground" : "text-muted-foreground"
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex-1 min-w-0 flex items-baseline gap-2",
+							children: [/* @__PURE__ */ jsx("span", {
+								className: cn("text-sm font-medium truncate", isRoot ? "text-foreground" : "text-foreground/90"),
+								children: blockLabel
+							}), values && /* @__PURE__ */ jsx("span", {
+								className: "text-xs text-muted-foreground truncate hidden sm:inline",
+								children: getPreviewText(values)
+							})]
+						}),
+						/* @__PURE__ */ jsx("div", {
+							"data-actions-menu": true,
+							children: /* @__PURE__ */ jsx(BlockItemDropdownMenu, {
+								blockId: block.id,
+								canHaveChildren,
+								onDuplicate: handleDuplicate,
+								onRemove: handleRemove,
+								className: "h-7 w-7 opacity-0 group-hover:opacity-100 transition-opacity"
+							})
+						})
+					]
+				}), isExpanded && blockSchema && /* @__PURE__ */ jsx(CardContent, {
+					className: cn("p-3", !isRoot && "py-2"),
+					children: /* @__PURE__ */ jsx(BlockFieldsRenderer, {
+						blockId: block.id,
+						blockSchema
+					})
+				})]
+			}),
+			canHaveChildren && isExpanded && block.children.length > 0 && /* @__PURE__ */ jsxs("div", {
+				className: "relative",
+				children: [/* @__PURE__ */ jsx("div", { className: "absolute left-3 top-0 bottom-0 w-px bg-border" }), /* @__PURE__ */ jsx("div", {
+					className: "pl-8 pt-2 space-y-2",
+					children: /* @__PURE__ */ jsx(BlockTree, {
+						blocks: block.children,
+						level: level + 1,
+						parentId: block.id
+					})
+				})]
+			}),
+			canHaveChildren && isExpanded && /* @__PURE__ */ jsxs("div", {
+				className: "pl-8 relative mt-2",
+				children: [
+					/* @__PURE__ */ jsx("div", { className: "absolute left-3 -top-2 w-px h-[calc(50%+8px)] bg-border" }),
+					/* @__PURE__ */ jsx("div", { className: "absolute left-3 top-1/2 w-5 h-px bg-border" }),
+					/* @__PURE__ */ jsx(BlockInsertButton, {
+						position: {
+							parentId: block.id,
+							index: block.children.length
+						},
+						variant: "rail",
+						parentLabel: blockLabel
+					})
+				]
+			})
+		]
+	});
+}
+function getBlockLabel(block, blockSchema, values) {
+	if (values) {
+		const title = values.title || values.name || values.label || values.heading;
+		if (title && typeof title === "string") return title.slice(0, 50);
+	}
+	const label = blockSchema?.admin?.label;
+	if (label) {
+		if (typeof label === "string") return label;
+		if ("key" in label) return label.fallback || block.type;
+		const localeLabel = label.en;
+		if (localeLabel) return localeLabel;
+		const firstValue = Object.values(label)[0];
+		if (typeof firstValue === "string") return firstValue;
+	}
+	return block.type.charAt(0).toUpperCase() + block.type.slice(1);
+}
+function getPreviewText(values) {
+	for (const field of [
+		"subtitle",
+		"description",
+		"text",
+		"caption",
+		"summary"
+	]) {
+		const value = values[field];
+		if (value && typeof value === "string") {
+			const text = value.slice(0, 60);
+			return text.length < value.length ? `${text}...` : text;
+		}
+	}
+	return "";
+}
+
+//#endregion
+export { BlockItem };
+//# sourceMappingURL=block-item.mjs.map

package/dist/client/components/blocks/block-item.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"block-item.mjs","names":["React"],"sources":["../../../../src/client/components/blocks/block-item.tsx"],"sourcesContent":["/**\n * Block Item\n *\n * Single block item with inline editable fields.\n * Click header to expand/collapse, drag handle for reordering.\n */\n\n\"use client\";\n\nimport { useSortable } from \"@dnd-kit/sortable\";\nimport { CSS } from \"@dnd-kit/utilities\";\nimport { Icon } from \"@iconify/react\";\nimport * as React from \"react\";\nimport type { BlockNode } from \"../../blocks/types.js\";\nimport { cn } from \"../../lib/utils.js\";\nimport { Card, CardContent, CardHeader } from \"../ui/card.js\";\nimport {\n\tuseBlockEditor,\n\tuseBlockSchema,\n\tuseIsBlockExpanded,\n} from \"./block-editor-context.js\";\nimport { BlockFieldsRenderer } from \"./block-fields-renderer.js\";\nimport { BlockInsertButton } from \"./block-insert-button.js\";\nimport { BlockItemDropdownMenu } from \"./block-item-menu.js\";\nimport { BlockTree } from \"./block-tree.js\";\nimport { BlockIcon } from \"./block-type-icon.js\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type BlockItemProps = {\n\t/** Block node data */\n\tblock: BlockNode;\n\t/** Nesting level (0 = root) */\n\tlevel: number;\n\t/** Index in parent's children */\n\tindex: number;\n\t/** Parent block ID (null = root) */\n\tparentId: string | null;\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function BlockItem({\n\tblock,\n\tlevel,\n\tindex: _index,\n\tparentId: _parentId,\n}: BlockItemProps) {\n\tconst { state, actions } = useBlockEditor();\n\tconst blockSchema = useBlockSchema(block.type);\n\tconst isExpanded = useIsBlockExpanded(block.id);\n\tconst canHaveChildren = blockSchema?.allowChildren ?? false;\n\n\t// Drag and drop\n\tconst {\n\t\tattributes,\n\t\tlisteners,\n\t\tsetNodeRef,\n\t\ttransform,\n\t\ttransition,\n\t\tisDragging,\n\t\tisOver,\n\t\tactive,\n\t} = useSortable({ id: block.id });\n\n\tconst style = {\n\t\ttransform: CSS.Transform.toString(transform),\n\t\ttransition,\n\t};\n\n\t// Show drop indicator when dragging over this item (but not self)\n\tconst showDropIndicator = isOver && active?.id !== block.id;\n\n\t// Get block label from values or definition\n\tconst values = state.content._values[block.id];\n\tconst blockLabel = getBlockLabel(block, blockSchema, values);\n\n\t// Handlers\n\tconst handleToggleExpand = (e: React.MouseEvent) => {\n\t\t// Don't toggle if clicking on drag handle or actions\n\t\tconst target = e.target as HTMLElement;\n\t\tif (\n\t\t\ttarget.closest(\"[data-drag-handle]\") ||\n\t\t\ttarget.closest(\"[data-actions-menu]\")\n\t\t) {\n\t\t\treturn;\n\t\t}\n\t\tactions.toggleExpanded(block.id);\n\t};\n\n\tconst handleDuplicate = React.useCallback(() => {\n\t\tactions.duplicateBlock(block.id);\n\t}, [actions, block.id]);\n\n\tconst handleRemove = React.useCallback(() => {\n\t\tactions.removeBlock(block.id);\n\t}, [actions, block.id]);\n\n\t// Keyboard handler for header\n\tconst handleKeyDown = (e: React.KeyboardEvent) => {\n\t\tif (e.key === \"Enter\" || e.key === \" \") {\n\t\t\te.preventDefault();\n\t\t\tactions.toggleExpanded(block.id);\n\t\t}\n\t};\n\n\tconst isRoot = level === 0;\n\n\treturn (\n\t\t<div\n\t\t\tref={setNodeRef}\n\t\t\tstyle={style}\n\t\t\tclassName={cn(\"relative\", isDragging && \"opacity-50\")}\n\t\t>\n\t\t\t{/* Drop indicator line */}\n\t\t\t{showDropIndicator && (\n\t\t\t\t<div className=\"absolute -top-0.5 left-0 right-0 z-10 h-0.5 bg-primary\" />\n\t\t\t)}\n\n\t\t\t{/* Block card */}\n\t\t\t<Card\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"overflow-hidden transition-shadow p-0 gap-0\",\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{/* Header - clickable to expand/collapse */}\n\t\t\t\t<CardHeader\n\t\t\t\t\trole=\"button\"\n\t\t\t\t\ttabIndex={0}\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"group flex flex-row items-center gap-2 px-3 py-2 cursor-pointer select-none\",\n\t\t\t\t\t\t\"hover:bg-muted/50 transition-colors\",\n\t\t\t\t\t\t\"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary focus-visible:ring-inset\",\n\t\t\t\t\t)}\n\t\t\t\t\tonClick={handleToggleExpand}\n\t\t\t\t\tonKeyDown={handleKeyDown}\n\t\t\t\t>\n\t\t\t\t\t{/* Drag handle */}\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tdata-drag-handle\n\t\t\t\t\t\tclassName=\"cursor-grab active:cursor-grabbing p-1 -ml-1 rounded hover:bg-muted\"\n\t\t\t\t\t\t{...attributes}\n\t\t\t\t\t\t{...listeners}\n\t\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon=\"ph:dots-six-vertical\"\n\t\t\t\t\t\t\tclassName=\"h-4 w-4 text-muted-foreground\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</button>\n\n\t\t\t\t\t{/* Expand/collapse icon */}\n\t\t\t\t\t<div className=\"text-muted-foreground\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon={\"ph:caret-right\"}\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"h-4 w-4 transition-transform duration-150 ease-in-out\",\n\t\t\t\t\t\t\t\tisExpanded && \"rotate-90\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Block icon */}\n\t\t\t\t\t<BlockIcon\n\t\t\t\t\t\ticon={blockSchema?.admin?.icon}\n\t\t\t\t\t\tsize={14}\n\t\t\t\t\t\tclassName={isRoot ? \"text-foreground\" : \"text-muted-foreground\"}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{/* Block label */}\n\t\t\t\t\t<div className=\"flex-1 min-w-0 flex items-baseline gap-2\">\n\t\t\t\t\t\t<span\n\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\"text-sm font-medium truncate\",\n\t\t\t\t\t\t\t\tisRoot ? \"text-foreground\" : \"text-foreground/90\",\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{blockLabel}\n\t\t\t\t\t\t</span>\n\t\t\t\t\t\t{/* Show preview text if available */}\n\t\t\t\t\t\t{values && (\n\t\t\t\t\t\t\t<span className=\"text-xs text-muted-foreground truncate hidden sm:inline\">\n\t\t\t\t\t\t\t\t{getPreviewText(values)}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\n\t\t\t\t\t{/* Actions menu */}\n\t\t\t\t\t<div data-actions-menu>\n\t\t\t\t\t\t<BlockItemDropdownMenu\n\t\t\t\t\t\t\tblockId={block.id}\n\t\t\t\t\t\t\tcanHaveChildren={canHaveChildren}\n\t\t\t\t\t\t\tonDuplicate={handleDuplicate}\n\t\t\t\t\t\t\tonRemove={handleRemove}\n\t\t\t\t\t\t\tclassName=\"h-7 w-7 opacity-0 group-hover:opacity-100 transition-opacity\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</CardHeader>\n\n\t\t\t\t{/* Body with inline fields - only when expanded */}\n\t\t\t\t{isExpanded && blockSchema && (\n\t\t\t\t\t<CardContent className={cn(\"p-3\", !isRoot && \"py-2\")}>\n\t\t\t\t\t\t<BlockFieldsRenderer blockId={block.id} blockSchema={blockSchema} />\n\t\t\t\t\t</CardContent>\n\t\t\t\t)}\n\t\t\t</Card>\n\n\t\t\t{/* Children with rail */}\n\t\t\t{canHaveChildren && isExpanded && block.children.length > 0 && (\n\t\t\t\t<div className=\"relative\">\n\t\t\t\t\t{/* Rail line */}\n\t\t\t\t\t<div className=\"absolute left-3 top-0 bottom-0 w-px bg-border\" />\n\t\t\t\t\t<div className=\"pl-8 pt-2 space-y-2\">\n\t\t\t\t\t\t<BlockTree\n\t\t\t\t\t\t\tblocks={block.children}\n\t\t\t\t\t\t\tlevel={level + 1}\n\t\t\t\t\t\t\tparentId={block.id}\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{/* Add child button - only for blocks that can have children */}\n\t\t\t{canHaveChildren && isExpanded && (\n\t\t\t\t<div className=\"pl-8 relative mt-2\">\n\t\t\t\t\t<div className=\"absolute left-3 -top-2 w-px h-[calc(50%+8px)] bg-border\" />\n\t\t\t\t\t{/* Horizontal rail connector */}\n\t\t\t\t\t<div className=\"absolute left-3 top-1/2 w-5 h-px bg-border\" />\n\t\t\t\t\t<BlockInsertButton\n\t\t\t\t\t\tposition={{ parentId: block.id, index: block.children.length }}\n\t\t\t\t\t\tvariant=\"rail\"\n\t\t\t\t\t\tparentLabel={blockLabel}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nimport type { BlockSchema } from \"#questpie/admin/server\";\n\nfunction getBlockLabel(\n\tblock: BlockNode,\n\tblockSchema: BlockSchema | undefined,\n\tvalues: Record<string, unknown> | undefined,\n): string {\n\t// Try to get meaningful label from values\n\tif (values) {\n\t\tconst title = values.title || values.name || values.label || values.heading;\n\t\tif (title && typeof title === \"string\") {\n\t\t\treturn title.slice(0, 50);\n\t\t}\n\t}\n\n\t// Fall back to block type label\n\tconst label = blockSchema?.admin?.label;\n\tif (label) {\n\t\t// Handle string directly\n\t\tif (typeof label === \"string\") {\n\t\t\treturn label;\n\t\t}\n\n\t\t// Handle key-based translation object\n\t\tif (\"key\" in label) {\n\t\t\treturn label.fallback || block.type;\n\t\t}\n\n\t\t// Handle I18nLocaleMap - use English or first available\n\t\tconst localeLabel = label.en;\n\t\tif (localeLabel) {\n\t\t\treturn localeLabel;\n\t\t}\n\t\tconst firstValue = Object.values(label)[0];\n\t\tif (typeof firstValue === \"string\") {\n\t\t\treturn firstValue;\n\t\t}\n\t}\n\n\t// Fall back to type name\n\treturn block.type.charAt(0).toUpperCase() + block.type.slice(1);\n}\n\nfunction getPreviewText(values: Record<string, unknown>): string {\n\t// Extract a short preview from common fields\n\tconst previewFields = [\n\t\t\"subtitle\",\n\t\t\"description\",\n\t\t\"text\",\n\t\t\"caption\",\n\t\t\"summary\",\n\t];\n\tfor (const field of previewFields) {\n\t\tconst value = values[field];\n\t\tif (value && typeof value === \"string\") {\n\t\t\tconst text = value.slice(0, 60);\n\t\t\treturn text.length < (value as string).length ? `${text}...` : text;\n\t\t}\n\t}\n\treturn \"\";\n}\n"],"mappings":"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"}

package/dist/client/components/blocks/block-library-sidebar.mjs

@@ -0,0 +1,190 @@
+"use client";
+
+import { cn } from "../../lib/utils.mjs";
+import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "../ui/sheet.mjs";
+import { Input } from "../ui/input.mjs";
+import { useBlockEditorActions, useBlockEditorState } from "./block-editor-context.mjs";
+import { BlockIcon } from "./block-type-icon.mjs";
+import { Icon } from "@iconify/react";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/client/components/blocks/block-library-sidebar.tsx
+/**
+* Block Library Sidebar
+*
+* Drawer component for selecting block types to add.
+* Uses shadcn Sheet component for mobile-friendly sidebar.
+*/
+function BlockLibrarySidebar({ open, onClose }) {
+	const state = useBlockEditorState();
+	const actions = useBlockEditorActions();
+	const [search, setSearch] = React$1.useState("");
+	const categories = React$1.useMemo(() => {
+		const categoryMap = /* @__PURE__ */ new Map();
+		const uncategorizedConfig = {
+			label: { en: "Other" },
+			order: 999
+		};
+		for (const [name, def] of Object.entries(state.blocks)) {
+			if (state.allowedBlocks && !state.allowedBlocks.includes(name)) continue;
+			if (def.admin?.hidden) continue;
+			if (search) {
+				if (!getBlockDisplayLabel(def).toLowerCase().includes(search.toLowerCase())) continue;
+			}
+			const categoryConfig = def.admin?.category;
+			let key;
+			let config;
+			if (categoryConfig) {
+				key = getCategoryKey(categoryConfig);
+				config = categoryConfig;
+			} else {
+				key = "uncategorized";
+				config = uncategorizedConfig;
+			}
+			if (!categoryMap.has(key)) categoryMap.set(key, {
+				key,
+				config,
+				blocks: []
+			});
+			categoryMap.get(key)?.blocks.push({
+				...def,
+				name
+			});
+		}
+		const result = Array.from(categoryMap.values());
+		result.sort((a, b) => (a.config.order ?? 999) - (b.config.order ?? 999));
+		for (const category of result) category.blocks.sort((a, b) => (a.admin?.order ?? 999) - (b.admin?.order ?? 999));
+		return result;
+	}, [
+		state.blocks,
+		state.allowedBlocks,
+		search
+	]);
+	const searchInputRef = React$1.useRef(null);
+	React$1.useEffect(() => {
+		if (open) {
+			const timer = setTimeout(() => searchInputRef.current?.focus(), 100);
+			return () => clearTimeout(timer);
+		}
+	}, [open]);
+	const handleSelectBlock = (type) => {
+		if (state.insertPosition) actions.addBlock(type, state.insertPosition);
+		onClose();
+		setSearch("");
+	};
+	return /* @__PURE__ */ jsx(Sheet, {
+		open,
+		onOpenChange: onClose,
+		children: /* @__PURE__ */ jsxs(SheetContent, {
+			side: "left",
+			className: "w-full sm:max-w-md flex flex-col",
+			children: [
+				/* @__PURE__ */ jsxs(SheetHeader, {
+					className: "space-y-2",
+					children: [/* @__PURE__ */ jsx(SheetTitle, { children: "Add Block" }), /* @__PURE__ */ jsx(SheetDescription, { children: "Select a block type to add to your content" })]
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: "px-6 py-4",
+					children: /* @__PURE__ */ jsxs("div", {
+						className: "relative",
+						children: [/* @__PURE__ */ jsx(Icon, {
+							icon: "ph:magnifying-glass",
+							className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground"
+						}), /* @__PURE__ */ jsx(Input, {
+							ref: searchInputRef,
+							placeholder: "Search blocks...",
+							value: search,
+							onChange: (e) => setSearch(e.target.value),
+							className: "pl-9"
+						})]
+					})
+				}),
+				/* @__PURE__ */ jsx("div", {
+					className: "flex-1 overflow-y-auto px-6 pb-6",
+					children: categories.length === 0 ? /* @__PURE__ */ jsxs("div", {
+						className: "flex flex-col items-center justify-center py-12 text-center",
+						children: [
+							/* @__PURE__ */ jsx(Icon, {
+								icon: "ph:cube",
+								className: "h-12 w-12 text-muted-foreground/50 mb-4"
+							}),
+							/* @__PURE__ */ jsx("p", {
+								className: "text-sm text-muted-foreground",
+								children: "No blocks found"
+							}),
+							search && /* @__PURE__ */ jsx("p", {
+								className: "text-xs text-muted-foreground mt-1",
+								children: "Try a different search term"
+							})
+						]
+					}) : /* @__PURE__ */ jsx("div", {
+						className: "space-y-6",
+						children: categories.map((category) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
+							className: "mb-3 flex items-center gap-2",
+							children: [category.config.icon && /* @__PURE__ */ jsx(Icon, {
+								icon: category.config.icon.props.name,
+								className: "h-4 w-4 text-muted-foreground"
+							}), /* @__PURE__ */ jsx("h4", {
+								className: "text-xs font-semibold uppercase tracking-wide text-muted-foreground",
+								children: getCategoryDisplayLabel(category.config)
+							})]
+						}), /* @__PURE__ */ jsx("div", {
+							className: "grid grid-cols-2 gap-2",
+							children: category.blocks.map((block) => /* @__PURE__ */ jsxs("button", {
+								type: "button",
+								className: cn("flex flex-col items-start gap-2 rounded-md border p-3 text-left", "transition-colors hover:border-primary hover:bg-accent", "focus:outline-none focus-visible:ring-2 focus-visible:ring-primary"),
+								onClick: () => handleSelectBlock(block.name),
+								children: [/* @__PURE__ */ jsx(BlockIcon, {
+									icon: block.admin?.icon,
+									size: 20,
+									className: "text-muted-foreground"
+								}), /* @__PURE__ */ jsxs("div", {
+									className: "min-w-0",
+									children: [/* @__PURE__ */ jsx("p", {
+										className: "text-sm font-medium truncate",
+										children: getBlockDisplayLabel(block)
+									}), block.admin?.description && /* @__PURE__ */ jsx("p", {
+										className: "text-xs text-muted-foreground line-clamp-2 mt-0.5",
+										children: getDescriptionText(block.admin.description)
+									})]
+								})]
+							}, block.name))
+						})] }, category.key))
+					})
+				})
+			]
+		})
+	});
+}
+function getBlockDisplayLabel(block) {
+	const label = block.admin?.label;
+	if (!label) return block.name;
+	if (typeof label === "string") return label;
+	if ("key" in label) return label.fallback || block.name;
+	return label.en || Object.values(label)[0] || block.name;
+}
+function getCategoryKey(config) {
+	const { label } = config;
+	if (typeof label === "string") return label.toLowerCase().replace(/\s+/g, "-");
+	if ("key" in label) return label.key.toLowerCase().replace(/[.:]/g, "-");
+	return (label.en ?? Object.values(label)[0] ?? "").toLowerCase().replace(/\s+/g, "-");
+}
+function getCategoryDisplayLabel(config) {
+	const { label } = config;
+	if (typeof label === "string") return label;
+	if ("key" in label) return label.fallback || label.key;
+	return label.en || Object.values(label)[0] || "Other";
+}
+function getDescriptionText(description) {
+	if (!description) return "";
+	if (typeof description === "string") return description;
+	if (typeof description === "function") return "";
+	if ("key" in description) return description.fallback || "";
+	const localeMap = description;
+	return localeMap.en || Object.values(localeMap)[0] || "";
+}
+
+//#endregion
+export { BlockLibrarySidebar };
+//# sourceMappingURL=block-library-sidebar.mjs.map

package/dist/client/components/blocks/block-library-sidebar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"block-library-sidebar.mjs","names":["React","uncategorizedConfig: BlockCategoryConfig","key: string","config: BlockCategoryConfig"],"sources":["../../../../src/client/components/blocks/block-library-sidebar.tsx"],"sourcesContent":["/**\n * Block Library Sidebar\n *\n * Drawer component for selecting block types to add.\n * Uses shadcn Sheet component for mobile-friendly sidebar.\n */\n\n\"use client\";\n\nimport { Icon } from \"@iconify/react\";\nimport * as React from \"react\";\nimport type { BlockCategoryConfig, BlockSchema } from \"#questpie/admin/server\";\nimport { cn } from \"../../lib/utils.js\";\nimport { Input } from \"../ui/input.js\";\nimport {\n\tSheet,\n\tSheetContent,\n\tSheetDescription,\n\tSheetHeader,\n\tSheetTitle,\n} from \"../ui/sheet.js\";\nimport {\n\tuseBlockEditorActions,\n\tuseBlockEditorState,\n} from \"./block-editor-context.js\";\nimport { BlockIcon } from \"./block-type-icon.js\";\n\n// ============================================================================\n// Types\n// ============================================================================\n\nexport type BlockLibrarySidebarProps = {\n\t/** Whether the sidebar is open */\n\topen: boolean;\n\t/** Callback when sidebar closes */\n\tonClose: () => void;\n};\n\ntype BlockWithName = BlockSchema & { name: string };\n\ntype CategoryInfo = {\n\tkey: string;\n\tconfig: BlockCategoryConfig;\n\tblocks: BlockWithName[];\n};\n\n// ============================================================================\n// Component\n// ============================================================================\n\nexport function BlockLibrarySidebar({\n\topen,\n\tonClose,\n}: BlockLibrarySidebarProps) {\n\tconst state = useBlockEditorState();\n\tconst actions = useBlockEditorActions();\n\tconst [search, setSearch] = React.useState(\"\");\n\n\t// Group blocks by category\n\tconst categories = React.useMemo(() => {\n\t\tconst categoryMap = new Map<string, CategoryInfo>();\n\n\t\t// Default uncategorized category\n\t\tconst uncategorizedConfig: BlockCategoryConfig = {\n\t\t\tlabel: { en: \"Other\" },\n\t\t\torder: 999,\n\t\t};\n\n\t\tfor (const [name, def] of Object.entries(state.blocks)) {\n\t\t\t// Filter by allowed blocks\n\t\t\tif (state.allowedBlocks && !state.allowedBlocks.includes(name)) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\t// Skip hidden blocks\n\t\t\tif (def.admin?.hidden) {\n\t\t\t\tcontinue;\n\t\t\t}\n\n\t\t\t// Filter by search\n\t\t\tif (search) {\n\t\t\t\tconst label = getBlockDisplayLabel(def);\n\t\t\t\tif (!label.toLowerCase().includes(search.toLowerCase())) {\n\t\t\t\t\tcontinue;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\tconst categoryConfig = def.admin?.category;\n\t\t\tlet key: string;\n\t\t\tlet config: BlockCategoryConfig;\n\n\t\t\tif (categoryConfig) {\n\t\t\t\tkey = getCategoryKey(categoryConfig);\n\t\t\t\tconfig = categoryConfig;\n\t\t\t} else {\n\t\t\t\tkey = \"uncategorized\";\n\t\t\t\tconfig = uncategorizedConfig;\n\t\t\t}\n\n\t\t\tif (!categoryMap.has(key)) {\n\t\t\t\tcategoryMap.set(key, { key, config, blocks: [] });\n\t\t\t}\n\t\t\tcategoryMap.get(key)?.blocks.push({ ...def, name });\n\t\t}\n\n\t\t// Convert to array and sort\n\t\tconst result = Array.from(categoryMap.values());\n\n\t\t// Sort categories by order\n\t\tresult.sort((a, b) => (a.config.order ?? 999) - (b.config.order ?? 999));\n\n\t\t// Sort blocks within each category by order\n\t\tfor (const category of result) {\n\t\t\tcategory.blocks.sort(\n\t\t\t\t(a, b) => (a.admin?.order ?? 999) - (b.admin?.order ?? 999),\n\t\t\t);\n\t\t}\n\n\t\treturn result;\n\t}, [state.blocks, state.allowedBlocks, search]);\n\n\t// Focus search on open\n\tconst searchInputRef = React.useRef<HTMLInputElement>(null);\n\tReact.useEffect(() => {\n\t\tif (open) {\n\t\t\tconst timer = setTimeout(() => searchInputRef.current?.focus(), 100);\n\t\t\treturn () => clearTimeout(timer);\n\t\t}\n\t}, [open]);\n\n\t// Handle block selection\n\tconst handleSelectBlock = (type: string) => {\n\t\tif (state.insertPosition) {\n\t\t\tactions.addBlock(type, state.insertPosition);\n\t\t}\n\t\tonClose();\n\t\tsetSearch(\"\");\n\t};\n\n\treturn (\n\t\t<Sheet open={open} onOpenChange={onClose}>\n\t\t\t<SheetContent side=\"left\" className=\"w-full sm:max-w-md flex flex-col\">\n\t\t\t\t<SheetHeader className=\"space-y-2\">\n\t\t\t\t\t<SheetTitle>Add Block</SheetTitle>\n\t\t\t\t\t<SheetDescription>\n\t\t\t\t\t\tSelect a block type to add to your content\n\t\t\t\t\t</SheetDescription>\n\t\t\t\t</SheetHeader>\n\n\t\t\t\t{/* Search */}\n\t\t\t\t<div className=\"px-6 py-4\">\n\t\t\t\t\t<div className=\"relative\">\n\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\ticon=\"ph:magnifying-glass\"\n\t\t\t\t\t\t\tclassName=\"absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t<Input\n\t\t\t\t\t\t\tref={searchInputRef}\n\t\t\t\t\t\t\tplaceholder=\"Search blocks...\"\n\t\t\t\t\t\t\tvalue={search}\n\t\t\t\t\t\t\tonChange={(e) => setSearch(e.target.value)}\n\t\t\t\t\t\t\tclassName=\"pl-9\"\n\t\t\t\t\t\t/>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t{/* Block list by category */}\n\t\t\t\t<div className=\"flex-1 overflow-y-auto px-6 pb-6\">\n\t\t\t\t\t{categories.length === 0 ? (\n\t\t\t\t\t\t<div className=\"flex flex-col items-center justify-center py-12 text-center\">\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\ticon=\"ph:cube\"\n\t\t\t\t\t\t\t\tclassName=\"h-12 w-12 text-muted-foreground/50 mb-4\"\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t<p className=\"text-sm text-muted-foreground\">No blocks found</p>\n\t\t\t\t\t\t\t{search && (\n\t\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground mt-1\">\n\t\t\t\t\t\t\t\t\tTry a different search term\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t) : (\n\t\t\t\t\t\t<div className=\"space-y-6\">\n\t\t\t\t\t\t\t{categories.map((category) => (\n\t\t\t\t\t\t\t\t<div key={category.key}>\n\t\t\t\t\t\t\t\t\t{/* Category header */}\n\t\t\t\t\t\t\t\t\t<div className=\"mb-3 flex items-center gap-2\">\n\t\t\t\t\t\t\t\t\t\t{category.config.icon && (\n\t\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\t\ticon={category.config.icon.props.name as string}\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"h-4 w-4 text-muted-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t<h4 className=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\t{getCategoryDisplayLabel(category.config)}\n\t\t\t\t\t\t\t\t\t\t</h4>\n\t\t\t\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t\t\t\t{/* Blocks grid */}\n\t\t\t\t\t\t\t\t\t<div className=\"grid grid-cols-2 gap-2\">\n\t\t\t\t\t\t\t\t\t\t{category.blocks.map((block) => (\n\t\t\t\t\t\t\t\t\t\t\t<button\n\t\t\t\t\t\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\t\t\t\t\t\tkey={block.name}\n\t\t\t\t\t\t\t\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"flex flex-col items-start gap-2 rounded-md border p-3 text-left\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"transition-colors hover:border-primary hover:bg-accent\",\n\t\t\t\t\t\t\t\t\t\t\t\t\t\"focus:outline-none focus-visible:ring-2 focus-visible:ring-primary\",\n\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={() => handleSelectBlock(block.name)}\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t<BlockIcon\n\t\t\t\t\t\t\t\t\t\t\t\t\ticon={block.admin?.icon}\n\t\t\t\t\t\t\t\t\t\t\t\t\tsize={20}\n\t\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"text-muted-foreground\"\n\t\t\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t\t\t\t<div className=\"min-w-0\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<p className=\"text-sm font-medium truncate\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t{getBlockDisplayLabel(block)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t{block.admin?.description && (\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<p className=\"text-xs text-muted-foreground line-clamp-2 mt-0.5\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t{getDescriptionText(block.admin.description)}\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t\t</button>\n\t\t\t\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t))}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t)}\n\t\t\t\t</div>\n\t\t\t</SheetContent>\n\t\t</Sheet>\n\t);\n}\n\n// ============================================================================\n// Helpers\n// ============================================================================\n\nimport type { I18nText } from \"../../i18n/types.js\";\n\nfunction getBlockDisplayLabel(block: BlockSchema & { name: string }): string {\n\tconst label = block.admin?.label;\n\n\tif (!label) {\n\t\treturn block.name;\n\t}\n\n\tif (typeof label === \"string\") {\n\t\treturn label;\n\t}\n\n\tif (\"key\" in label) {\n\t\treturn label.fallback || block.name;\n\t}\n\n\t// I18nLocaleMap\n\treturn label.en || Object.values(label)[0] || block.name;\n}\n\nfunction getCategoryKey(config: BlockCategoryConfig): string {\n\tconst { label } = config;\n\n\tif (typeof label === \"string\") {\n\t\treturn label.toLowerCase().replace(/\\s+/g, \"-\");\n\t}\n\n\tif (\"key\" in label) {\n\t\treturn label.key.toLowerCase().replace(/[.:]/g, \"-\");\n\t}\n\n\t// I18nLocaleMap\n\tconst text = label.en ?? Object.values(label)[0] ?? \"\";\n\treturn text.toLowerCase().replace(/\\s+/g, \"-\");\n}\n\nfunction getCategoryDisplayLabel(config: BlockCategoryConfig): string {\n\tconst { label } = config;\n\n\tif (typeof label === \"string\") {\n\t\treturn label;\n\t}\n\n\tif (\"key\" in label) {\n\t\treturn label.fallback || label.key;\n\t}\n\n\t// I18nLocaleMap\n\treturn label.en || Object.values(label)[0] || \"Other\";\n}\n\nfunction getDescriptionText(description: I18nText | undefined): string {\n\tif (!description) return \"\";\n\n\tif (typeof description === \"string\") {\n\t\treturn description;\n\t}\n\n\tif (typeof description === \"function\") {\n\t\treturn \"\";\n\t}\n\n\tif (\"key\" in description) {\n\t\treturn description.fallback || \"\";\n\t}\n\n\tconst localeMap = description as Record<string, string>;\n\treturn localeMap.en || Object.values(localeMap)[0] || \"\";\n}\n"],"mappings":"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"}