@questpie/admin 2.0.0 → 3.0.0

package/dist/client/components/fields/relation/displays/grid-display.mjs

@@ -1,10 +1,12 @@
+import { useTranslation } from "../../../../i18n/hooks.mjs";
 import { resolveIconElement } from "../../../component-renderer.mjs";
 import { Button } from "../../../ui/button.mjs";
 import { Skeleton } from "../../../ui/skeleton.mjs";
 import { getImageUrl, getItemDisplayValue } from "./types.mjs";
 import { CollectionEditLink } from "../../../admin-link.mjs";
+import { c } from "react/compiler-runtime";
 import { Icon } from "@iconify/react";
-import * as React$1 from "react";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/client/components/fields/relation/displays/grid-display.tsx
@@ -17,98 +19,191 @@ const gridCols = {
 	3: "grid-cols-2 sm:grid-cols-3",
 	4: "grid-cols-2 sm:grid-cols-3 lg:grid-cols-4"
 };
-function GridSkeleton({ count = 6, gridColumns = 3 }) {
-	const skeletonKeys = React$1.useMemo(() => Array.from({ length: count }, () => crypto.randomUUID()), [count]);
-	return /* @__PURE__ */ jsx("div", {
-		className: `grid gap-2 ${gridCols[gridColumns]}`,
-		children: skeletonKeys.map((key) => /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-2 rounded-md border border-border/60 bg-card/30 backdrop-blur-sm p-2",
-			children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-8 shrink-0 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 flex-1 max-w-[120px] rounded" })]
-		}, key))
-	});
+function GridSkeleton(t0) {
+	const $ = c(7);
+	const { count: t1, gridColumns: t2 } = t0;
+	const count = t1 === void 0 ? 6 : t1;
+	const gridColumns = t2 === void 0 ? 3 : t2;
+	let t3;
+	if ($[0] !== count) {
+		t3 = Array.from({ length: count }, _temp);
+		$[0] = count;
+		$[1] = t3;
+	} else t3 = $[1];
+	const skeletonKeys = t3;
+	const t4 = `grid gap-2 ${gridCols[gridColumns]}`;
+	let t5;
+	if ($[2] !== skeletonKeys) {
+		t5 = skeletonKeys.map(_temp2);
+		$[2] = skeletonKeys;
+		$[3] = t5;
+	} else t5 = $[3];
+	let t6;
+	if ($[4] !== t4 || $[5] !== t5) {
+		t6 = /* @__PURE__ */ jsx("div", {
+			className: t4,
+			children: t5
+		});
+		$[4] = t4;
+		$[5] = t5;
+		$[6] = t6;
+	} else t6 = $[6];
+	return t6;
 }
-function GridDisplay({ items, collection, collectionIcon, actions, editable = false, fields, gridColumns = 3, linkToDetail = false, isLoading = false, loadingCount = 6 }) {
-	const getTitle = (item) => item[fields?.title || "_title"] || getItemDisplayValue(item);
-	const getImage = (item) => getImageUrl(item, fields?.image);
-	if (isLoading && items.length === 0) return /* @__PURE__ */ jsx(GridSkeleton, {
-		count: loadingCount,
-		gridColumns
-	});
-	return /* @__PURE__ */ jsx("div", {
-		className: `grid gap-2 ${gridCols[gridColumns]}`,
-		children: items.map((item) => {
-			const image = getImage(item);
-			const gridContent = /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-2 rounded-md border border-border/60 bg-card/30 backdrop-blur-sm p-2 hover:bg-card/50 transition-colors h-full",
-				children: [
-					image ? /* @__PURE__ */ jsx("div", {
-						className: "size-8 rounded bg-muted shrink-0 overflow-hidden",
-						children: /* @__PURE__ */ jsx("img", {
-							src: image,
-							alt: getTitle(item),
-							className: "w-full h-full object-cover"
-						})
-					}) : collectionIcon ? /* @__PURE__ */ jsx("div", {
-						className: "size-8 rounded bg-muted shrink-0 flex items-center justify-center",
-						children: resolveIconElement(collectionIcon, { className: "size-4 text-muted-foreground" })
-					}) : null,
-					/* @__PURE__ */ jsx("span", {
-						className: "text-sm truncate flex-1",
-						children: getTitle(item)
-					}),
-					editable && (actions?.onEdit || actions?.onRemove) && /* @__PURE__ */ jsxs("div", {
-						className: "flex items-center gap-0.5 shrink-0",
-						children: [actions?.onEdit && /* @__PURE__ */ jsx(Button, {
-							type: "button",
-							variant: "ghost",
-							size: "icon",
-							className: "h-6 w-6",
-							onClick: (e) => {
-								e.preventDefault();
-								e.stopPropagation();
-								actions.onEdit?.(item);
-							},
-							"aria-label": "Edit item",
-							children: /* @__PURE__ */ jsx(Icon, {
-								icon: "ph:pencil",
-								className: "size-3"
-							})
-						}), actions?.onRemove && /* @__PURE__ */ jsx(Button, {
-							type: "button",
-							variant: "ghost",
-							size: "icon",
-							className: "h-6 w-6",
-							onClick: (e) => {
-								e.preventDefault();
-								e.stopPropagation();
-								actions.onRemove?.(item);
-							},
-							"aria-label": "Remove item",
-							children: /* @__PURE__ */ jsx(Icon, {
-								icon: "ph:x",
-								className: "size-3"
-							})
-						})]
-					})
-				]
+function _temp2(key) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "border-border bg-card flex items-center gap-2 border p-2",
+		children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-8 shrink-0 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 max-w-[120px] flex-1 rounded" })]
+	}, key);
+}
+function _temp() {
+	return crypto.randomUUID();
+}
+function GridDisplay(t0) {
+	const $ = c(29);
+	const { items, collection, collectionIcon, actions, editable: t1, fields, gridColumns: t2, linkToDetail: t3, isLoading: t4, loadingCount: t5 } = t0;
+	const editable = t1 === void 0 ? false : t1;
+	const gridColumns = t2 === void 0 ? 3 : t2;
+	const linkToDetail = t3 === void 0 ? false : t3;
+	const isLoading = t4 === void 0 ? false : t4;
+	const loadingCount = t5 === void 0 ? 6 : t5;
+	const { t } = useTranslation();
+	let t6;
+	if ($[0] !== fields?.title) {
+		t6 = (item) => item[fields?.title || "_title"] || getItemDisplayValue(item);
+		$[0] = fields?.title;
+		$[1] = t6;
+	} else t6 = $[1];
+	const getTitle = t6;
+	let t7;
+	if ($[2] !== fields?.image) {
+		t7 = (item_0) => getImageUrl(item_0, fields?.image);
+		$[2] = fields?.image;
+		$[3] = t7;
+	} else t7 = $[3];
+	const getImage = t7;
+	if (isLoading && items.length === 0) {
+		let t8$1;
+		if ($[4] !== gridColumns || $[5] !== loadingCount) {
+			t8$1 = /* @__PURE__ */ jsx(GridSkeleton, {
+				count: loadingCount,
+				gridColumns
 			});
-			if (!editable && actions?.onEdit) return /* @__PURE__ */ jsx("button", {
-				type: "button",
-				onClick: () => actions.onEdit?.(item),
-				className: "text-left w-full",
-				children: gridContent
-			}, item.id);
-			if (!editable && linkToDetail) return /* @__PURE__ */ jsx(CollectionEditLink, {
-				collection,
-				id: item.id,
-				className: "block",
-				children: gridContent
-			}, item.id);
-			return /* @__PURE__ */ jsx("div", { children: gridContent }, item.id);
-		})
-	});
+			$[4] = gridColumns;
+			$[5] = loadingCount;
+			$[6] = t8$1;
+		} else t8$1 = $[6];
+		return t8$1;
+	}
+	const t8 = `grid gap-2 ${gridCols[gridColumns]}`;
+	let t9;
+	if ($[7] !== actions || $[8] !== collection || $[9] !== collectionIcon || $[10] !== editable || $[11] !== getImage || $[12] !== getTitle || $[13] !== items || $[14] !== linkToDetail || $[15] !== t) {
+		let t10$1;
+		if ($[17] !== actions || $[18] !== collection || $[19] !== collectionIcon || $[20] !== editable || $[21] !== getImage || $[22] !== getTitle || $[23] !== linkToDetail || $[24] !== t) {
+			t10$1 = (item_1) => {
+				const image = getImage(item_1);
+				const gridContent = /* @__PURE__ */ jsxs("div", {
+					className: "border-border bg-card hover:bg-card flex h-full items-center gap-2 border p-2 transition-colors",
+					children: [
+						image ? /* @__PURE__ */ jsx("div", {
+							className: "bg-muted size-8 shrink-0 overflow-hidden rounded",
+							children: /* @__PURE__ */ jsx("img", {
+								src: image,
+								alt: getTitle(item_1),
+								className: "h-full w-full object-cover"
+							})
+						}) : collectionIcon ? /* @__PURE__ */ jsx("div", {
+							className: "bg-muted flex size-8 shrink-0 items-center justify-center rounded",
+							children: resolveIconElement(collectionIcon, { className: "size-4 text-muted-foreground" })
+						}) : null,
+						/* @__PURE__ */ jsx("span", {
+							className: "flex-1 truncate text-sm",
+							children: getTitle(item_1)
+						}),
+						editable && (actions?.onEdit || actions?.onRemove) && /* @__PURE__ */ jsxs("div", {
+							className: "flex shrink-0 items-center gap-0.5",
+							children: [actions?.onEdit && /* @__PURE__ */ jsx(Button, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								className: "h-6 w-6",
+								onClick: (e) => {
+									e.preventDefault();
+									e.stopPropagation();
+									actions.onEdit?.(item_1);
+								},
+								"aria-label": t("field.editItem"),
+								children: /* @__PURE__ */ jsx(Icon, {
+									icon: "ph:pencil",
+									className: "size-3"
+								})
+							}), actions?.onRemove && /* @__PURE__ */ jsx(Button, {
+								type: "button",
+								variant: "ghost",
+								size: "icon",
+								className: "h-6 w-6",
+								onClick: (e_0) => {
+									e_0.preventDefault();
+									e_0.stopPropagation();
+									actions.onRemove?.(item_1);
+								},
+								"aria-label": t("field.removeItem"),
+								children: /* @__PURE__ */ jsx(Icon, {
+									icon: "ph:x",
+									className: "size-3"
+								})
+							})]
+						})
+					]
+				});
+				if (!editable && actions?.onEdit) return /* @__PURE__ */ jsx("button", {
+					type: "button",
+					onClick: () => actions.onEdit?.(item_1),
+					className: "w-full text-left",
+					children: gridContent
+				}, item_1.id);
+				if (!editable && linkToDetail) return /* @__PURE__ */ jsx(CollectionEditLink, {
+					collection,
+					id: item_1.id,
+					className: "block",
+					children: gridContent
+				}, item_1.id);
+				return /* @__PURE__ */ jsx("div", { children: gridContent }, item_1.id);
+			};
+			$[17] = actions;
+			$[18] = collection;
+			$[19] = collectionIcon;
+			$[20] = editable;
+			$[21] = getImage;
+			$[22] = getTitle;
+			$[23] = linkToDetail;
+			$[24] = t;
+			$[25] = t10$1;
+		} else t10$1 = $[25];
+		t9 = items.map(t10$1);
+		$[7] = actions;
+		$[8] = collection;
+		$[9] = collectionIcon;
+		$[10] = editable;
+		$[11] = getImage;
+		$[12] = getTitle;
+		$[13] = items;
+		$[14] = linkToDetail;
+		$[15] = t;
+		$[16] = t9;
+	} else t9 = $[16];
+	let t10;
+	if ($[26] !== t8 || $[27] !== t9) {
+		t10 = /* @__PURE__ */ jsx("div", {
+			className: t8,
+			children: t9
+		});
+		$[26] = t8;
+		$[27] = t9;
+		$[28] = t10;
+	} else t10 = $[28];
+	return t10;
 }
 
 //#endregion
-export { GridDisplay };
-//# sourceMappingURL=grid-display.mjs.map
+export { GridDisplay };

package/dist/client/components/fields/relation/displays/list-display.mjs

@@ -1,128 +1,247 @@
+import { useTranslation } from "../../../../i18n/hooks.mjs";
 import { resolveIconElement } from "../../../component-renderer.mjs";
 import { Button } from "../../../ui/button.mjs";
 import { Skeleton } from "../../../ui/skeleton.mjs";
 import { getItemDisplayValue } from "./types.mjs";
 import { CollectionEditLink } from "../../../admin-link.mjs";
+import { c } from "react/compiler-runtime";
 import { Icon } from "@iconify/react";
-import * as React$1 from "react";
+import "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/client/components/fields/relation/displays/list-display.tsx
 /**
 * List Display - vertical list with action buttons
 */
-function ListSkeleton({ count = 3, editable = false }) {
-	const skeletonKeys = React$1.useMemo(() => Array.from({ length: count }, () => crypto.randomUUID()), [count]);
-	if (editable) return /* @__PURE__ */ jsx("div", {
-		className: "space-y-2 rounded-lg border border-border/60 bg-card/30 backdrop-blur-sm p-3",
-		children: skeletonKeys.map((key) => /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-2 rounded-md border border-border/60 bg-card/30 backdrop-blur-sm p-2",
-			children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-3.5 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 flex-1 max-w-[200px] rounded" })]
-		}, key))
-	});
-	return /* @__PURE__ */ jsx("ul", {
-		className: "space-y-1",
-		children: skeletonKeys.map((key) => /* @__PURE__ */ jsxs("li", {
-			className: "flex items-center gap-1",
-			children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-3 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32 rounded" })]
-		}, key))
-	});
+function ListSkeleton(t0) {
+	const $ = c(6);
+	const { count: t1, editable: t2 } = t0;
+	const count = t1 === void 0 ? 3 : t1;
+	const editable = t2 === void 0 ? false : t2;
+	let t3;
+	if ($[0] !== count) {
+		t3 = Array.from({ length: count }, _temp);
+		$[0] = count;
+		$[1] = t3;
+	} else t3 = $[1];
+	const skeletonKeys = t3;
+	if (editable) {
+		let t4$1;
+		if ($[2] !== skeletonKeys) {
+			t4$1 = /* @__PURE__ */ jsx("div", {
+				className: "border-border bg-card space-y-2 border p-3",
+				children: skeletonKeys.map(_temp2)
+			});
+			$[2] = skeletonKeys;
+			$[3] = t4$1;
+		} else t4$1 = $[3];
+		return t4$1;
+	}
+	let t4;
+	if ($[4] !== skeletonKeys) {
+		t4 = /* @__PURE__ */ jsx("ul", {
+			className: "space-y-1",
+			children: skeletonKeys.map(_temp3)
+		});
+		$[4] = skeletonKeys;
+		$[5] = t4;
+	} else t4 = $[5];
+	return t4;
 }
-function ListDisplay({ items, collection, collectionIcon, actions, editable = false, orderable = false, linkToDetail = false, renderItem, isLoading = false, loadingCount = 3 }) {
-	const iconElement = resolveIconElement(collectionIcon, { className: "size-3.5 text-muted-foreground shrink-0" });
-	const smallIconElement = resolveIconElement(collectionIcon, { className: "size-3 text-muted-foreground" });
-	if (isLoading && items.length === 0) return /* @__PURE__ */ jsx(ListSkeleton, {
-		count: loadingCount,
-		editable
-	});
-	if (editable) return /* @__PURE__ */ jsx("div", {
-		className: "space-y-2 rounded-lg border border-border/60 bg-card/30 backdrop-blur-sm p-3",
-		children: items.map((item, index) => /* @__PURE__ */ jsxs("div", {
-			className: "flex items-center gap-2 rounded-md border border-border/60 bg-card/30 backdrop-blur-sm p-2",
-			children: [
-				orderable && /* @__PURE__ */ jsx("button", {
-					type: "button",
-					className: "cursor-grab text-muted-foreground hover:text-foreground",
-					"aria-label": "Drag to reorder",
-					children: /* @__PURE__ */ jsx(Icon, {
-						icon: "ph:dots-six-vertical",
-						className: "h-4 w-4"
-					})
-				}),
-				/* @__PURE__ */ jsxs("div", {
-					className: "flex-1 flex items-center gap-2 min-w-0",
-					children: [iconElement, renderItem ? renderItem(item, index) : /* @__PURE__ */ jsx("span", {
-						className: "text-sm truncate",
-						children: getItemDisplayValue(item)
-					})]
-				}),
-				actions?.onEdit && /* @__PURE__ */ jsx(Button, {
-					type: "button",
-					variant: "ghost",
-					size: "icon",
-					className: "h-7 w-7 shrink-0",
-					onClick: () => actions.onEdit?.(item),
-					title: "Edit",
-					"aria-label": "Edit item",
-					children: /* @__PURE__ */ jsx(Icon, {
-						icon: "ph:pencil",
-						className: "h-3 w-3"
-					})
-				}),
-				actions?.onRemove && /* @__PURE__ */ jsx(Button, {
+function _temp3(key_0) {
+	return /* @__PURE__ */ jsxs("li", {
+		className: "flex items-center gap-1",
+		children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-3 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-32 rounded" })]
+	}, key_0);
+}
+function _temp2(key) {
+	return /* @__PURE__ */ jsxs("div", {
+		className: "border-border bg-card flex items-center gap-2 border p-2",
+		children: [/* @__PURE__ */ jsx(Skeleton, { className: "size-3.5 rounded" }), /* @__PURE__ */ jsx(Skeleton, { className: "h-4 max-w-[200px] flex-1 rounded" })]
+	}, key);
+}
+function _temp() {
+	return crypto.randomUUID();
+}
+function ListDisplay(t0) {
+	const $ = c(37);
+	const { items, collection, collectionIcon, actions, editable: t1, orderable: t2, linkToDetail: t3, renderItem, isLoading: t4, loadingCount: t5 } = t0;
+	const editable = t1 === void 0 ? false : t1;
+	const orderable = t2 === void 0 ? false : t2;
+	const linkToDetail = t3 === void 0 ? false : t3;
+	const isLoading = t4 === void 0 ? false : t4;
+	const loadingCount = t5 === void 0 ? 3 : t5;
+	const { t } = useTranslation();
+	let t6;
+	if ($[0] !== collectionIcon) {
+		t6 = resolveIconElement(collectionIcon, { className: "size-3.5 text-muted-foreground shrink-0" });
+		$[0] = collectionIcon;
+		$[1] = t6;
+	} else t6 = $[1];
+	const iconElement = t6;
+	let t7;
+	if ($[2] !== collectionIcon) {
+		t7 = resolveIconElement(collectionIcon, { className: "size-3 text-muted-foreground" });
+		$[2] = collectionIcon;
+		$[3] = t7;
+	} else t7 = $[3];
+	const smallIconElement = t7;
+	if (isLoading && items.length === 0) {
+		let t8$1;
+		if ($[4] !== editable || $[5] !== loadingCount) {
+			t8$1 = /* @__PURE__ */ jsx(ListSkeleton, {
+				count: loadingCount,
+				editable
+			});
+			$[4] = editable;
+			$[5] = loadingCount;
+			$[6] = t8$1;
+		} else t8$1 = $[6];
+		return t8$1;
+	}
+	if (editable) {
+		let t8$1;
+		if ($[7] !== actions || $[8] !== iconElement || $[9] !== items || $[10] !== orderable || $[11] !== renderItem || $[12] !== t) {
+			let t9$2;
+			if ($[14] !== actions || $[15] !== iconElement || $[16] !== orderable || $[17] !== renderItem || $[18] !== t) {
+				t9$2 = (item, index) => /* @__PURE__ */ jsxs("div", {
+					className: "border-border bg-card flex items-center gap-2 border p-2",
+					children: [
+						orderable && /* @__PURE__ */ jsx("button", {
+							type: "button",
+							className: "text-muted-foreground hover:text-foreground cursor-grab",
+							"aria-label": t("field.dragToReorder"),
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: "ph:dots-six-vertical",
+								className: "h-4 w-4"
+							})
+						}),
+						/* @__PURE__ */ jsxs("div", {
+							className: "flex min-w-0 flex-1 items-center gap-2",
+							children: [iconElement, renderItem ? renderItem(item, index) : /* @__PURE__ */ jsx("span", {
+								className: "truncate text-sm",
+								children: getItemDisplayValue(item)
+							})]
+						}),
+						actions?.onEdit && /* @__PURE__ */ jsx(Button, {
+							type: "button",
+							variant: "ghost",
+							size: "icon",
+							className: "h-7 w-7 shrink-0",
+							onClick: () => actions.onEdit?.(item),
+							title: t("common.edit"),
+							"aria-label": t("field.editItem"),
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: "ph:pencil",
+								className: "h-3 w-3"
+							})
+						}),
+						actions?.onRemove && /* @__PURE__ */ jsx(Button, {
+							type: "button",
+							variant: "ghost",
+							size: "icon",
+							className: "h-7 w-7 shrink-0",
+							onClick: () => actions.onRemove?.(item),
+							title: t("common.remove"),
+							"aria-label": t("field.removeItem"),
+							children: /* @__PURE__ */ jsx(Icon, {
+								icon: "ph:x",
+								className: "h-3 w-3"
+							})
+						})
+					]
+				}, item.id);
+				$[14] = actions;
+				$[15] = iconElement;
+				$[16] = orderable;
+				$[17] = renderItem;
+				$[18] = t;
+				$[19] = t9$2;
+			} else t9$2 = $[19];
+			t8$1 = items.map(t9$2);
+			$[7] = actions;
+			$[8] = iconElement;
+			$[9] = items;
+			$[10] = orderable;
+			$[11] = renderItem;
+			$[12] = t;
+			$[13] = t8$1;
+		} else t8$1 = $[13];
+		let t9$1;
+		if ($[20] !== t8$1) {
+			t9$1 = /* @__PURE__ */ jsx("div", {
+				className: "border-border bg-card space-y-2 border p-3",
+				children: t8$1
+			});
+			$[20] = t8$1;
+			$[21] = t9$1;
+		} else t9$1 = $[21];
+		return t9$1;
+	}
+	let t8;
+	if ($[22] !== actions || $[23] !== collection || $[24] !== items || $[25] !== linkToDetail || $[26] !== renderItem || $[27] !== smallIconElement) {
+		let t9$1;
+		if ($[29] !== actions || $[30] !== collection || $[31] !== linkToDetail || $[32] !== renderItem || $[33] !== smallIconElement) {
+			t9$1 = (item_0, index_0) => {
+				const displayText = renderItem ? renderItem(item_0, index_0) : getItemDisplayValue(item_0);
+				if (actions?.onEdit) return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("button", {
 					type: "button",
-					variant: "ghost",
-					size: "icon",
-					className: "h-7 w-7 shrink-0",
-					onClick: () => actions.onRemove?.(item),
-					title: "Remove",
-					"aria-label": "Remove item",
-					children: /* @__PURE__ */ jsx(Icon, {
-						icon: "ph:x",
-						className: "h-3 w-3"
-					})
-				})
-			]
-		}, item.id))
-	});
-	return /* @__PURE__ */ jsx("ul", {
-		className: "space-y-1",
-		children: items.map((item, index) => {
-			const displayText = renderItem ? renderItem(item, index) : getItemDisplayValue(item);
-			if (actions?.onEdit) return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs("button", {
-				type: "button",
-				onClick: () => actions.onEdit?.(item),
-				className: "text-sm text-primary hover:underline inline-flex items-center gap-1",
-				children: [
-					smallIconElement,
-					displayText,
-					/* @__PURE__ */ jsx(Icon, {
-						icon: "ph:pencil",
-						className: "size-3"
-					})
-				]
-			}) }, item.id);
-			if (linkToDetail) return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(CollectionEditLink, {
-				collection,
-				id: item.id,
-				className: "text-sm text-primary hover:underline inline-flex items-center gap-1",
-				children: [
-					smallIconElement,
-					displayText,
-					/* @__PURE__ */ jsx(Icon, {
-						icon: "ph:arrow-right",
-						className: "size-3"
-					})
-				]
-			}) }, item.id);
-			return /* @__PURE__ */ jsxs("li", {
-				className: "text-sm flex items-center gap-1",
-				children: [smallIconElement, displayText]
-			}, item.id);
-		})
-	});
+					onClick: () => actions.onEdit?.(item_0),
+					className: "text-primary inline-flex items-center gap-1 text-sm hover:underline",
+					children: [
+						smallIconElement,
+						displayText,
+						/* @__PURE__ */ jsx(Icon, {
+							icon: "ph:pencil",
+							className: "size-3"
+						})
+					]
+				}) }, item_0.id);
+				if (linkToDetail) return /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsxs(CollectionEditLink, {
+					collection,
+					id: item_0.id,
+					className: "text-primary inline-flex items-center gap-1 text-sm hover:underline",
+					children: [
+						smallIconElement,
+						displayText,
+						/* @__PURE__ */ jsx(Icon, {
+							icon: "ph:arrow-right",
+							className: "size-3"
+						})
+					]
+				}) }, item_0.id);
+				return /* @__PURE__ */ jsxs("li", {
+					className: "flex items-center gap-1 text-sm",
+					children: [smallIconElement, displayText]
+				}, item_0.id);
+			};
+			$[29] = actions;
+			$[30] = collection;
+			$[31] = linkToDetail;
+			$[32] = renderItem;
+			$[33] = smallIconElement;
+			$[34] = t9$1;
+		} else t9$1 = $[34];
+		t8 = items.map(t9$1);
+		$[22] = actions;
+		$[23] = collection;
+		$[24] = items;
+		$[25] = linkToDetail;
+		$[26] = renderItem;
+		$[27] = smallIconElement;
+		$[28] = t8;
+	} else t8 = $[28];
+	let t9;
+	if ($[35] !== t8) {
+		t9 = /* @__PURE__ */ jsx("ul", {
+			className: "space-y-1",
+			children: t8
+		});
+		$[35] = t8;
+		$[36] = t9;
+	} else t9 = $[36];
+	return t9;
 }
 
 //#endregion
-export { ListDisplay };
-//# sourceMappingURL=list-display.mjs.map
+export { ListDisplay };