@questpie/admin 3.2.4 → 3.2.6

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

@@ -9,7 +9,6 @@ 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";
@@ -26,9 +25,7 @@ import { CSS } from "@dnd-kit/utilities";
 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(105);
-	const { block, level } = t0;
+const BlockItem = React.memo(function BlockItem$1({ block, level, index: _index, parentId: _parentId }) {
 	const { t } = useTranslation();
 	const actions = useBlockEditorActions();
 	const blockSchema = useBlockSchema(block.type);
@@ -37,373 +34,145 @@ const BlockItem = React.memo(function BlockItem$1(t0) {
 	const isSelected = useIsBlockSelected(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 { 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;
-	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;
+	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.useCallback(() => {
+		actions.duplicateBlock(block.id);
+	}, [actions, block.id]);
+	const handleRemove = React.useCallback(() => {
+		actions.removeBlock(block.id);
+	}, [actions, block.id]);
+	const handleKeyDown = (e) => {
+		if (e.key === "Enter" || e.key === " ") {
+			e.preventDefault();
 			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 = `content._values.${block.id}`;
-	const t13 = isUnknownType && "border-destructive/50";
-	const t14 = isSelected && "border-primary ring-primary/20 ring-2";
-	let t15;
-	if ($[27] !== t13 || $[28] !== t14) {
-		t15 = cn("gap-0 overflow-hidden p-0 transition-[border-color,box-shadow]", t13, t14);
-		$[27] = t13;
-		$[28] = t14;
-		$[29] = t15;
-	} else t15 = $[29];
-	const t16 = isSelected && "bg-primary/5";
-	let t17;
-	if ($[30] !== t16) {
-		t17 = 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-ring/25 focus-visible:ring-3 focus-visible:outline-none focus-visible:ring-inset", t16);
-		$[30] = t16;
-		$[31] = t17;
-	} else t17 = $[31];
-	let t18;
-	if ($[32] === Symbol.for("react.memo_cache_sentinel")) {
-		t18 = /* @__PURE__ */ jsx(Icon, {
-			icon: "ph:dots-six-vertical",
-			className: "text-muted-foreground h-4 w-4"
-		});
-		$[32] = t18;
-	} else t18 = $[32];
-	let t19;
-	if ($[33] !== attributes || $[34] !== listeners) {
-		t19 = /* @__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: t18
-		});
-		$[33] = attributes;
-		$[34] = listeners;
-		$[35] = t19;
-	} else t19 = $[35];
-	const t20 = isExpanded && "rotate-90";
-	let t21;
-	if ($[36] !== t20) {
-		t21 = cn("h-4 w-4 transition-transform duration-150 ease-in-out", t20);
-		$[36] = t20;
-		$[37] = t21;
-	} else t21 = $[37];
-	let t22;
-	if ($[38] !== t21) {
-		t22 = /* @__PURE__ */ jsx("div", {
-			className: "text-muted-foreground",
-			children: /* @__PURE__ */ jsx(Icon, {
-				icon: "ph:caret-right",
-				className: t21
-			})
-		});
-		$[38] = t21;
-		$[39] = t22;
-	} else t22 = $[39];
-	let t23;
-	if ($[40] !== blockSchema?.admin?.icon || $[41] !== isRoot || $[42] !== isUnknownType) {
-		t23 = 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"
-		});
-		$[40] = blockSchema?.admin?.icon;
-		$[41] = isRoot;
-		$[42] = isUnknownType;
-		$[43] = t23;
-	} else t23 = $[43];
-	const t24 = isUnknownType ? "text-destructive" : isRoot ? "text-foreground" : "text-foreground/90";
-	let t25;
-	if ($[44] !== t24) {
-		t25 = cn("truncate text-sm font-medium", t24);
-		$[44] = t24;
-		$[45] = t25;
-	} else t25 = $[45];
-	let t26;
-	if ($[46] !== blockLabel || $[47] !== t25) {
-		t26 = /* @__PURE__ */ jsx("span", {
-			className: t25,
-			children: blockLabel
-		});
-		$[46] = blockLabel;
-		$[47] = t25;
-		$[48] = t26;
-	} else t26 = $[48];
-	let t27;
-	if ($[49] !== values) {
-		t27 = values && /* @__PURE__ */ jsx("span", {
-			className: "text-muted-foreground hidden truncate text-xs sm:inline",
-			children: getPreviewText(values)
-		});
-		$[49] = values;
-		$[50] = t27;
-	} else t27 = $[50];
-	let t28;
-	if ($[51] !== t26 || $[52] !== t27) {
-		t28 = /* @__PURE__ */ jsxs("div", {
-			className: "flex min-w-0 flex-1 items-baseline gap-2",
-			children: [t26, t27]
-		});
-		$[51] = t26;
-		$[52] = t27;
-		$[53] = t28;
-	} else t28 = $[53];
-	let t29;
-	if ($[54] !== block.id || $[55] !== canHaveChildren || $[56] !== handleDuplicate || $[57] !== handleRemove) {
-		t29 = /* @__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"
-			})
-		});
-		$[54] = block.id;
-		$[55] = canHaveChildren;
-		$[56] = handleDuplicate;
-		$[57] = handleRemove;
-		$[58] = t29;
-	} else t29 = $[58];
-	let t30;
-	if ($[59] !== handleKeyDown || $[60] !== handleToggleExpand || $[61] !== isExpanded || $[62] !== t17 || $[63] !== t19 || $[64] !== t22 || $[65] !== t23 || $[66] !== t28 || $[67] !== t29) {
-		t30 = /* @__PURE__ */ jsxs(CardHeader, {
-			role: "button",
-			tabIndex: 0,
-			"aria-expanded": isExpanded,
-			className: t17,
-			onClick: handleToggleExpand,
-			onKeyDown: handleKeyDown,
-			children: [
-				t19,
-				t22,
-				t23,
-				t28,
-				t29
-			]
-		});
-		$[59] = handleKeyDown;
-		$[60] = handleToggleExpand;
-		$[61] = isExpanded;
-		$[62] = t17;
-		$[63] = t19;
-		$[64] = t22;
-		$[65] = t23;
-		$[66] = t28;
-		$[67] = t29;
-		$[68] = t30;
-	} else t30 = $[68];
-	let t31;
-	if ($[69] !== block.id || $[70] !== blockSchema || $[71] !== isExpanded || $[72] !== isRoot) {
-		t31 = isExpanded && blockSchema && /* @__PURE__ */ jsx(CardContent, {
-			className: cn("p-3", !isRoot && "py-2"),
-			children: /* @__PURE__ */ jsx(BlockFieldsRenderer, {
-				blockId: block.id,
-				blockSchema
+	return /* @__PURE__ */ jsxs("div", {
+		ref: setNodeRef,
+		style,
+		className: cn("relative", isDragging && "opacity-50"),
+		children: [
+			showDropIndicator && /* @__PURE__ */ jsx("div", { className: "bg-primary absolute -top-0.5 right-0 left-0 z-10 h-0.5" }),
+			/* @__PURE__ */ jsxs(Card, {
+				"data-field-path": `content._values.${block.id}`,
+				className: cn("gap-0 overflow-hidden p-0 transition-[border-color,box-shadow]", isUnknownType && "border-destructive/50", isSelected && "border-primary ring-primary/20 ring-2"),
+				children: [
+					/* @__PURE__ */ jsxs(CardHeader, {
+						role: "button",
+						tabIndex: 0,
+						"aria-expanded": isExpanded,
+						className: 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-ring/25 focus-visible:ring-3 focus-visible:outline-none focus-visible:ring-inset", isSelected && "bg-primary/5"),
+						onClick: handleToggleExpand,
+						onKeyDown: handleKeyDown,
+						children: [
+							/* @__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: (e) => e.stopPropagation(),
+								children: /* @__PURE__ */ jsx(Icon, {
+									icon: "ph:dots-six-vertical",
+									className: "text-muted-foreground h-4 w-4"
+								})
+							}),
+							/* @__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")
+								})
+							}),
+							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"
+							}),
+							/* @__PURE__ */ jsxs("div", {
+								className: "flex min-w-0 flex-1 items-baseline gap-2",
+								children: [/* @__PURE__ */ jsx("span", {
+									className: cn("truncate text-sm font-medium", isUnknownType ? "text-destructive" : isRoot ? "text-foreground" : "text-foreground/90"),
+									children: blockLabel
+								}), values && /* @__PURE__ */ jsx("span", {
+									className: "text-muted-foreground hidden truncate text-xs 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 transition-opacity group-hover:opacity-100"
+								})
+							})
+						]
+					}),
+					isExpanded && blockSchema && /* @__PURE__ */ jsx(CardContent, {
+						className: cn("p-3", !isRoot && "py-2"),
+						children: /* @__PURE__ */ jsx(BlockFieldsRenderer, {
+							blockId: block.id,
+							blockSchema
+						})
+					}),
+					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 }) })]
+						})
+					})
+				]
+			}),
+			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
+					})
+				})]
+			}),
+			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
+					})
+				]
 			})
-		});
-		$[69] = block.id;
-		$[70] = blockSchema;
-		$[71] = isExpanded;
-		$[72] = isRoot;
-		$[73] = t31;
-	} else t31 = $[73];
-	let t32;
-	if ($[74] !== block.type || $[75] !== isExpanded || $[76] !== isUnknownType || $[77] !== t) {
-		t32 = 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 }) })]
-			})
-		});
-		$[74] = block.type;
-		$[75] = isExpanded;
-		$[76] = isUnknownType;
-		$[77] = t;
-		$[78] = t32;
-	} else t32 = $[78];
-	let t33;
-	if ($[79] !== t12 || $[80] !== t15 || $[81] !== t30 || $[82] !== t31 || $[83] !== t32) {
-		t33 = /* @__PURE__ */ jsxs(Card, {
-			"data-field-path": t12,
-			className: t15,
-			children: [
-				t30,
-				t31,
-				t32
-			]
-		});
-		$[79] = t12;
-		$[80] = t15;
-		$[81] = t30;
-		$[82] = t31;
-		$[83] = t32;
-		$[84] = t33;
-	} else t33 = $[84];
-	let t34;
-	if ($[85] !== block.children || $[86] !== block.id || $[87] !== canHaveChildren || $[88] !== isExpanded || $[89] !== level) {
-		t34 = 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
-				})
-			})]
-		});
-		$[85] = block.children;
-		$[86] = block.id;
-		$[87] = canHaveChildren;
-		$[88] = isExpanded;
-		$[89] = level;
-		$[90] = t34;
-	} else t34 = $[90];
-	let t35;
-	if ($[91] !== block.children || $[92] !== block.id || $[93] !== blockLabel || $[94] !== canHaveChildren || $[95] !== isExpanded) {
-		t35 = 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
-				})
-			]
-		});
-		$[91] = block.children;
-		$[92] = block.id;
-		$[93] = blockLabel;
-		$[94] = canHaveChildren;
-		$[95] = isExpanded;
-		$[96] = t35;
-	} else t35 = $[96];
-	let t36;
-	if ($[97] !== setNodeRef || $[98] !== style || $[99] !== t10 || $[100] !== t11 || $[101] !== t33 || $[102] !== t34 || $[103] !== t35) {
-		t36 = /* @__PURE__ */ jsxs("div", {
-			ref: setNodeRef,
-			style,
-			className: t10,
-			children: [
-				t11,
-				t33,
-				t34,
-				t35
-			]
-		});
-		$[97] = setNodeRef;
-		$[98] = style;
-		$[99] = t10;
-		$[100] = t11;
-		$[101] = t33;
-		$[102] = t34;
-		$[103] = t35;
-		$[104] = t36;
-	} else t36 = $[104];
-	return t36;
+		]
+	});
 }, areBlockItemPropsEqual);
 function getBlockLabel(block, blockSchema, values) {
 	if (values) {
@@ -437,9 +206,6 @@ function getPreviewText(values) {
 	}
 	return "";
 }
-function _temp(e_1) {
-	return e_1.stopPropagation();
-}
 
 //#endregion
 export { BlockItem };