@questpie/admin 1.1.1 → 3.0.0

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

@@ -0,0 +1,434 @@
+"use client";
+
+import { useTranslation } from "../../i18n/hooks.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { Card, CardContent, CardHeader } from "../ui/card.mjs";
+import { useBlockEditorActions, useBlockSchema, useBlockValues, 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 { c } from "react/compiler-runtime";
+import { Icon } from "@iconify/react";
+import * as React 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 areBlockItemPropsEqual(prev, next) {
+	return prev.block === next.block && prev.level === next.level && prev.index === next.index && prev.parentId === next.parentId;
+}
+const BlockItem = React.memo(function BlockItem$1(t0) {
+	const $ = c(100);
+	const { block, level } = t0;
+	const { t } = useTranslation();
+	const actions = useBlockEditorActions();
+	const blockSchema = useBlockSchema(block.type);
+	const values = useBlockValues(block.id);
+	const isExpanded = useIsBlockExpanded(block.id);
+	const isUnknownType = !blockSchema;
+	const canHaveChildren = blockSchema?.allowChildren ?? false;
+	let t1;
+	if ($[0] !== block.id) {
+		t1 = { id: block.id };
+		$[0] = block.id;
+		$[1] = t1;
+	} else t1 = $[1];
+	const { attributes, listeners, setNodeRef, transform, transition, isDragging, isOver, active } = useSortable(t1);
+	let t2;
+	if ($[2] !== transform) {
+		t2 = CSS.Transform.toString(transform);
+		$[2] = transform;
+		$[3] = t2;
+	} else t2 = $[3];
+	let t3;
+	if ($[4] !== t2 || $[5] !== transition) {
+		t3 = {
+			transform: t2,
+			transition
+		};
+		$[4] = t2;
+		$[5] = transition;
+		$[6] = t3;
+	} else t3 = $[6];
+	const style = t3;
+	const showDropIndicator = isOver && active?.id !== block.id;
+	let t4;
+	if ($[7] !== block || $[8] !== blockSchema || $[9] !== values) {
+		t4 = getBlockLabel(block, blockSchema, values);
+		$[7] = block;
+		$[8] = blockSchema;
+		$[9] = values;
+		$[10] = t4;
+	} else t4 = $[10];
+	const blockLabel = t4;
+	let t5;
+	if ($[11] !== actions || $[12] !== block.id) {
+		t5 = (e) => {
+			const target = e.target;
+			if (target.closest("[data-drag-handle]") || target.closest("[data-actions-menu]")) return;
+			actions.toggleExpanded(block.id);
+		};
+		$[11] = actions;
+		$[12] = block.id;
+		$[13] = t5;
+	} else t5 = $[13];
+	const handleToggleExpand = t5;
+	let t6;
+	if ($[14] !== actions || $[15] !== block.id) {
+		t6 = () => {
+			actions.duplicateBlock(block.id);
+		};
+		$[14] = actions;
+		$[15] = block.id;
+		$[16] = t6;
+	} else t6 = $[16];
+	const handleDuplicate = t6;
+	let t7;
+	if ($[17] !== actions || $[18] !== block.id) {
+		t7 = () => {
+			actions.removeBlock(block.id);
+		};
+		$[17] = actions;
+		$[18] = block.id;
+		$[19] = t7;
+	} else t7 = $[19];
+	const handleRemove = t7;
+	let t8;
+	if ($[20] !== actions || $[21] !== block.id) {
+		t8 = (e_0) => {
+			if (e_0.key === "Enter" || e_0.key === " ") {
+				e_0.preventDefault();
+				actions.toggleExpanded(block.id);
+			}
+		};
+		$[20] = actions;
+		$[21] = block.id;
+		$[22] = t8;
+	} else t8 = $[22];
+	const handleKeyDown = t8;
+	const isRoot = level === 0;
+	const t9 = isDragging && "opacity-50";
+	let t10;
+	if ($[23] !== t9) {
+		t10 = cn("relative", t9);
+		$[23] = t9;
+		$[24] = t10;
+	} else t10 = $[24];
+	let t11;
+	if ($[25] !== showDropIndicator) {
+		t11 = showDropIndicator && /* @__PURE__ */ jsx("div", { className: "bg-primary absolute -top-0.5 right-0 left-0 z-10 h-0.5" });
+		$[25] = showDropIndicator;
+		$[26] = t11;
+	} else t11 = $[26];
+	const t12 = isUnknownType && "border-destructive/50";
+	let t13;
+	if ($[27] !== t12) {
+		t13 = cn("gap-0 overflow-hidden p-0 transition-shadow", t12);
+		$[27] = t12;
+		$[28] = t13;
+	} else t13 = $[28];
+	let t14;
+	if ($[29] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = cn("group flex cursor-pointer flex-row items-center gap-2 px-3 py-2 select-none", "hover:bg-muted transition-colors", "focus-visible:ring-primary focus-visible:ring-2 focus-visible:outline-none focus-visible:ring-inset");
+		$[29] = t14;
+	} else t14 = $[29];
+	let t15;
+	if ($[30] === Symbol.for("react.memo_cache_sentinel")) {
+		t15 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:dots-six-vertical",
+			className: "text-muted-foreground h-4 w-4"
+		});
+		$[30] = t15;
+	} else t15 = $[30];
+	let t16;
+	if ($[31] !== attributes || $[32] !== listeners) {
+		t16 = /* @__PURE__ */ jsx("button", {
+			type: "button",
+			"data-drag-handle": true,
+			className: "hover:bg-muted -ml-1 cursor-grab rounded p-1 active:cursor-grabbing",
+			...attributes,
+			...listeners,
+			onClick: _temp,
+			children: t15
+		});
+		$[31] = attributes;
+		$[32] = listeners;
+		$[33] = t16;
+	} else t16 = $[33];
+	const t17 = isExpanded && "rotate-90";
+	let t18;
+	if ($[34] !== t17) {
+		t18 = cn("h-4 w-4 transition-transform duration-150 ease-in-out", t17);
+		$[34] = t17;
+		$[35] = t18;
+	} else t18 = $[35];
+	let t19;
+	if ($[36] !== t18) {
+		t19 = /* @__PURE__ */ jsx("div", {
+			className: "text-muted-foreground",
+			children: /* @__PURE__ */ jsx(Icon, {
+				icon: "ph:caret-right",
+				className: t18
+			})
+		});
+		$[36] = t18;
+		$[37] = t19;
+	} else t19 = $[37];
+	let t20;
+	if ($[38] !== blockSchema?.admin?.icon || $[39] !== isRoot || $[40] !== isUnknownType) {
+		t20 = isUnknownType ? /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:warning",
+			className: "text-destructive h-3.5 w-3.5"
+		}) : /* @__PURE__ */ jsx(BlockIcon, {
+			icon: blockSchema?.admin?.icon,
+			size: 14,
+			className: isRoot ? "text-foreground" : "text-muted-foreground"
+		});
+		$[38] = blockSchema?.admin?.icon;
+		$[39] = isRoot;
+		$[40] = isUnknownType;
+		$[41] = t20;
+	} else t20 = $[41];
+	const t21 = isUnknownType ? "text-destructive" : isRoot ? "text-foreground" : "text-foreground/90";
+	let t22;
+	if ($[42] !== t21) {
+		t22 = cn("truncate text-sm font-medium", t21);
+		$[42] = t21;
+		$[43] = t22;
+	} else t22 = $[43];
+	let t23;
+	if ($[44] !== blockLabel || $[45] !== t22) {
+		t23 = /* @__PURE__ */ jsx("span", {
+			className: t22,
+			children: blockLabel
+		});
+		$[44] = blockLabel;
+		$[45] = t22;
+		$[46] = t23;
+	} else t23 = $[46];
+	let t24;
+	if ($[47] !== values) {
+		t24 = values && /* @__PURE__ */ jsx("span", {
+			className: "text-muted-foreground hidden truncate text-xs sm:inline",
+			children: getPreviewText(values)
+		});
+		$[47] = values;
+		$[48] = t24;
+	} else t24 = $[48];
+	let t25;
+	if ($[49] !== t23 || $[50] !== t24) {
+		t25 = /* @__PURE__ */ jsxs("div", {
+			className: "flex min-w-0 flex-1 items-baseline gap-2",
+			children: [t23, t24]
+		});
+		$[49] = t23;
+		$[50] = t24;
+		$[51] = t25;
+	} else t25 = $[51];
+	let t26;
+	if ($[52] !== block.id || $[53] !== canHaveChildren || $[54] !== handleDuplicate || $[55] !== handleRemove) {
+		t26 = /* @__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 transition-opacity group-hover:opacity-100"
+			})
+		});
+		$[52] = block.id;
+		$[53] = canHaveChildren;
+		$[54] = handleDuplicate;
+		$[55] = handleRemove;
+		$[56] = t26;
+	} else t26 = $[56];
+	let t27;
+	if ($[57] !== handleKeyDown || $[58] !== handleToggleExpand || $[59] !== t16 || $[60] !== t19 || $[61] !== t20 || $[62] !== t25 || $[63] !== t26) {
+		t27 = /* @__PURE__ */ jsxs(CardHeader, {
+			role: "button",
+			tabIndex: 0,
+			className: t14,
+			onClick: handleToggleExpand,
+			onKeyDown: handleKeyDown,
+			children: [
+				t16,
+				t19,
+				t20,
+				t25,
+				t26
+			]
+		});
+		$[57] = handleKeyDown;
+		$[58] = handleToggleExpand;
+		$[59] = t16;
+		$[60] = t19;
+		$[61] = t20;
+		$[62] = t25;
+		$[63] = t26;
+		$[64] = t27;
+	} else t27 = $[64];
+	let t28;
+	if ($[65] !== block.id || $[66] !== blockSchema || $[67] !== isExpanded || $[68] !== isRoot) {
+		t28 = isExpanded && blockSchema && /* @__PURE__ */ jsx(CardContent, {
+			className: cn("p-3", !isRoot && "py-2"),
+			children: /* @__PURE__ */ jsx(BlockFieldsRenderer, {
+				blockId: block.id,
+				blockSchema
+			})
+		});
+		$[65] = block.id;
+		$[66] = blockSchema;
+		$[67] = isExpanded;
+		$[68] = isRoot;
+		$[69] = t28;
+	} else t28 = $[69];
+	let t29;
+	if ($[70] !== block.type || $[71] !== isExpanded || $[72] !== isUnknownType || $[73] !== t) {
+		t29 = isExpanded && isUnknownType && /* @__PURE__ */ jsx(CardContent, {
+			className: "p-3",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "text-destructive flex items-center gap-2 text-sm",
+				children: [/* @__PURE__ */ jsx(Icon, {
+					icon: "ph:warning",
+					className: "h-4 w-4 shrink-0"
+				}), /* @__PURE__ */ jsx("span", { children: t("blocks.unknownType", { type: block.type }) })]
+			})
+		});
+		$[70] = block.type;
+		$[71] = isExpanded;
+		$[72] = isUnknownType;
+		$[73] = t;
+		$[74] = t29;
+	} else t29 = $[74];
+	let t30;
+	if ($[75] !== t13 || $[76] !== t27 || $[77] !== t28 || $[78] !== t29) {
+		t30 = /* @__PURE__ */ jsxs(Card, {
+			className: t13,
+			children: [
+				t27,
+				t28,
+				t29
+			]
+		});
+		$[75] = t13;
+		$[76] = t27;
+		$[77] = t28;
+		$[78] = t29;
+		$[79] = t30;
+	} else t30 = $[79];
+	let t31;
+	if ($[80] !== block.children || $[81] !== block.id || $[82] !== canHaveChildren || $[83] !== isExpanded || $[84] !== level) {
+		t31 = canHaveChildren && isExpanded && block.children.length > 0 && /* @__PURE__ */ jsxs("div", {
+			className: "relative",
+			children: [/* @__PURE__ */ jsx("div", { className: "bg-border absolute top-0 bottom-0 left-3 w-px" }), /* @__PURE__ */ jsx("div", {
+				className: "space-y-2 pt-2 pl-8",
+				children: /* @__PURE__ */ jsx(BlockTree, {
+					blocks: block.children,
+					level: level + 1,
+					parentId: block.id
+				})
+			})]
+		});
+		$[80] = block.children;
+		$[81] = block.id;
+		$[82] = canHaveChildren;
+		$[83] = isExpanded;
+		$[84] = level;
+		$[85] = t31;
+	} else t31 = $[85];
+	let t32;
+	if ($[86] !== block.children || $[87] !== block.id || $[88] !== blockLabel || $[89] !== canHaveChildren || $[90] !== isExpanded) {
+		t32 = canHaveChildren && isExpanded && /* @__PURE__ */ jsxs("div", {
+			className: "relative mt-2 pl-8",
+			children: [
+				/* @__PURE__ */ jsx("div", { className: "bg-border absolute -top-2 left-3 h-[calc(50%+8px)] w-px" }),
+				/* @__PURE__ */ jsx("div", { className: "bg-border absolute top-1/2 left-3 h-px w-5" }),
+				/* @__PURE__ */ jsx(BlockInsertButton, {
+					position: {
+						parentId: block.id,
+						index: block.children.length
+					},
+					variant: "rail",
+					parentLabel: blockLabel
+				})
+			]
+		});
+		$[86] = block.children;
+		$[87] = block.id;
+		$[88] = blockLabel;
+		$[89] = canHaveChildren;
+		$[90] = isExpanded;
+		$[91] = t32;
+	} else t32 = $[91];
+	let t33;
+	if ($[92] !== setNodeRef || $[93] !== style || $[94] !== t10 || $[95] !== t11 || $[96] !== t30 || $[97] !== t31 || $[98] !== t32) {
+		t33 = /* @__PURE__ */ jsxs("div", {
+			ref: setNodeRef,
+			style,
+			className: t10,
+			children: [
+				t11,
+				t30,
+				t31,
+				t32
+			]
+		});
+		$[92] = setNodeRef;
+		$[93] = style;
+		$[94] = t10;
+		$[95] = t11;
+		$[96] = t30;
+		$[97] = t31;
+		$[98] = t32;
+		$[99] = t33;
+	} else t33 = $[99];
+	return t33;
+}, areBlockItemPropsEqual);
+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 "";
+}
+function _temp(e_1) {
+	return e_1.stopPropagation();
+}
+
+//#endregion
+export { BlockItem };

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

@@ -0,0 +1,285 @@
+"use client";
+
+import { useTranslation } from "../../i18n/hooks.mjs";
+import { cn } from "../../lib/utils.mjs";
+import { Input } from "../ui/input.mjs";
+import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "../ui/sheet.mjs";
+import { useAllowedBlockTypes, useBlockEditorActions, useBlockInsertPosition, useBlockRegistry } from "./block-editor-context.mjs";
+import { BlockIcon } from "./block-type-icon.mjs";
+import { c } from "react/compiler-runtime";
+import { Icon } from "@iconify/react";
+import * as React 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(t0) {
+	const $ = c(32);
+	const { open, onClose } = t0;
+	const { t } = useTranslation();
+	const actions = useBlockEditorActions();
+	const blockRegistry = useBlockRegistry();
+	const allowedBlocks = useAllowedBlockTypes();
+	const insertPosition = useBlockInsertPosition();
+	const [search, setSearch] = React.useState("");
+	let result;
+	if ($[0] !== allowedBlocks || $[1] !== blockRegistry || $[2] !== search) {
+		const categoryMap = /* @__PURE__ */ new Map();
+		const uncategorizedConfig = {
+			label: {
+				key: "blocks.uncategorized",
+				fallback: "Other"
+			},
+			order: 999
+		};
+		for (const [name, def] of Object.entries(blockRegistry)) {
+			if (allowedBlocks && !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
+			});
+		}
+		result = Array.from(categoryMap.values());
+		result.sort(_temp);
+		for (const category of result) category.blocks.sort(_temp2);
+		$[0] = allowedBlocks;
+		$[1] = blockRegistry;
+		$[2] = search;
+		$[3] = result;
+	} else result = $[3];
+	const categories = result;
+	const searchInputRef = React.useRef(null);
+	let t1;
+	let t2;
+	if ($[4] !== open) {
+		t1 = () => {
+			if (open) {
+				const timer = setTimeout(() => searchInputRef.current?.focus(), 100);
+				return () => clearTimeout(timer);
+			}
+		};
+		t2 = [open];
+		$[4] = open;
+		$[5] = t1;
+		$[6] = t2;
+	} else {
+		t1 = $[5];
+		t2 = $[6];
+	}
+	React.useEffect(t1, t2);
+	let t3;
+	if ($[7] !== actions || $[8] !== insertPosition || $[9] !== onClose) {
+		t3 = (type) => {
+			if (insertPosition) actions.addBlock(type, insertPosition);
+			onClose();
+			setSearch("");
+		};
+		$[7] = actions;
+		$[8] = insertPosition;
+		$[9] = onClose;
+		$[10] = t3;
+	} else t3 = $[10];
+	const handleSelectBlock = t3;
+	let t4;
+	if ($[11] !== onClose) {
+		t4 = (nextOpen) => {
+			if (!nextOpen) onClose();
+		};
+		$[11] = onClose;
+		$[12] = t4;
+	} else t4 = $[12];
+	let t5;
+	if ($[13] === Symbol.for("react.memo_cache_sentinel")) {
+		t5 = /* @__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" })]
+		});
+		$[13] = t5;
+	} else t5 = $[13];
+	let t6;
+	if ($[14] === Symbol.for("react.memo_cache_sentinel")) {
+		t6 = /* @__PURE__ */ jsx(Icon, {
+			icon: "ph:magnifying-glass",
+			className: "text-muted-foreground absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2"
+		});
+		$[14] = t6;
+	} else t6 = $[14];
+	let t7;
+	if ($[15] !== t) {
+		t7 = t("blocks.searchPlaceholder");
+		$[15] = t;
+		$[16] = t7;
+	} else t7 = $[16];
+	let t8;
+	if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
+		t8 = (e) => setSearch(e.target.value);
+		$[17] = t8;
+	} else t8 = $[17];
+	let t9;
+	if ($[18] !== search || $[19] !== t7) {
+		t9 = /* @__PURE__ */ jsx("div", {
+			className: "px-6 py-4",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "relative",
+				children: [t6, /* @__PURE__ */ jsx(Input, {
+					ref: searchInputRef,
+					placeholder: t7,
+					value: search,
+					onChange: t8,
+					className: "pl-9"
+				})]
+			})
+		});
+		$[18] = search;
+		$[19] = t7;
+		$[20] = t9;
+	} else t9 = $[20];
+	let t10;
+	if ($[21] !== categories || $[22] !== handleSelectBlock || $[23] !== search) {
+		t10 = /* @__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: "text-muted-foreground/50 mb-4 h-12 w-12"
+					}),
+					/* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground text-sm",
+						children: "No blocks found"
+					}),
+					search && /* @__PURE__ */ jsx("p", {
+						className: "text-muted-foreground mt-1 text-xs",
+						children: "Try a different search term"
+					})
+				]
+			}) : /* @__PURE__ */ jsx("div", {
+				className: "space-y-6",
+				children: categories.map((category_0) => /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsxs("div", {
+					className: "mb-3 flex items-center gap-2",
+					children: [category_0.config.icon && /* @__PURE__ */ jsx(Icon, {
+						icon: category_0.config.icon.props.name,
+						className: "text-muted-foreground h-4 w-4"
+					}), /* @__PURE__ */ jsx("h4", {
+						className: "text-muted-foreground text-xs font-semibold tracking-wide uppercase",
+						children: getCategoryDisplayLabel(category_0.config)
+					})]
+				}), /* @__PURE__ */ jsx("div", {
+					className: "grid grid-cols-2 gap-2",
+					children: category_0.blocks.map((block) => /* @__PURE__ */ jsxs("button", {
+						type: "button",
+						className: cn("flex flex-col items-start gap-2 border p-3 text-left", "hover:border-primary hover:bg-accent transition-colors", "focus-visible:ring-primary focus:outline-none focus-visible:ring-2"),
+						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: "truncate text-sm font-medium",
+								children: getBlockDisplayLabel(block)
+							}), block.admin?.description && /* @__PURE__ */ jsx("p", {
+								className: "text-muted-foreground mt-0.5 line-clamp-2 text-xs",
+								children: getDescriptionText(block.admin.description)
+							})]
+						})]
+					}, block.name))
+				})] }, category_0.key))
+			})
+		});
+		$[21] = categories;
+		$[22] = handleSelectBlock;
+		$[23] = search;
+		$[24] = t10;
+	} else t10 = $[24];
+	let t11;
+	if ($[25] !== t10 || $[26] !== t9) {
+		t11 = /* @__PURE__ */ jsxs(SheetContent, {
+			side: "left",
+			className: "qa-block-library flex w-full flex-col sm:max-w-md",
+			children: [
+				t5,
+				t9,
+				t10
+			]
+		});
+		$[25] = t10;
+		$[26] = t9;
+		$[27] = t11;
+	} else t11 = $[27];
+	let t12;
+	if ($[28] !== open || $[29] !== t11 || $[30] !== t4) {
+		t12 = /* @__PURE__ */ jsx(Sheet, {
+			open,
+			onOpenChange: t4,
+			children: t11
+		});
+		$[28] = open;
+		$[29] = t11;
+		$[30] = t4;
+		$[31] = t12;
+	} else t12 = $[31];
+	return t12;
+}
+function _temp2(a_0, b_0) {
+	return (a_0.admin?.order ?? 999) - (b_0.admin?.order ?? 999);
+}
+function _temp(a, b) {
+	return (a.config.order ?? 999) - (b.config.order ?? 999);
+}
+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] || "Uncategorized";
+}
+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 };