@openrails/contentkit-ui 0.79.0 → 0.81.0

package/dist/components/groups/editor.js

@@ -0,0 +1,860 @@
+import { toContentKitError as e } from "../../client/errors.js";
+import { useMessages as t } from "../../i18n/context.js";
+import { ContentKitUiRoot as n } from "../../scope.js";
+import { useContentKitClient as r } from "../../react/context.js";
+import { Button as i } from "../../ui/button.js";
+import { Dialog as a, DialogContent as o, DialogDescription as s, DialogFooter as c, DialogHeader as l, DialogTitle as u } from "../../ui/dialog.js";
+import { Badge as d } from "../../ui/badge.js";
+import { Input as f } from "../../ui/input.js";
+import { Label as p } from "../../ui/label.js";
+import { Select as m, SelectContent as h, SelectItem as g, SelectTrigger as _, SelectValue as v } from "../../ui/select.js";
+import { Skeleton as y } from "../../ui/skeleton.js";
+import { Textarea as b } from "../../ui/textarea.js";
+import { ErrorLine as x, contentError as S, useAction as C } from "../social/parts.js";
+import { parseAttributes as w, slugify as T } from "../../client/group-fields.js";
+import { useGroup as E, useKinds as D } from "../../react/groups.js";
+import { GroupPicker as O, labelOf as k, useGroupNames as A, useLanguageName as j } from "./parts.js";
+import { OfferFields as M } from "../content/offer-fields.js";
+import { AttributeFields as N, formOf as P } from "./fields.js";
+import { GroupImageEditor as F } from "./banner.js";
+import { useCallback as I, useEffect as L, useId as R, useRef as z, useState as B } from "react";
+import { Fragment as V, jsx as H, jsxs as U } from "react/jsx-runtime";
+import { cn as W } from "cn";
+//#region src/components/groups/editor.tsx
+function G(e) {
+	let { t: r } = t(), { kinds: a, loading: o } = D({ client: e.client }), s = E(e.id, { client: e.client }), c = e.languages ?? a?.languages ?? ["en"], l = s.group?.kind ?? e.kind, u = a?.group_kinds?.[l] ?? {}, d = (t) => /* @__PURE__ */ H(n, {
+		appearance: e.appearance,
+		className: W("grid gap-6 text-sm", e.className),
+		"data-ckui": "group-editor",
+		"data-kind": l,
+		children: t
+	});
+	if (o) return d(/* @__PURE__ */ H(y, { className: "h-40 w-full" }));
+	if (!e.id && !s.group && !s.loading) return d(/* @__PURE__ */ H(Q, {
+		...e,
+		kind: l,
+		spec: u,
+		languages: c,
+		g: s
+	}));
+	if (s.deleted) return d(/* @__PURE__ */ H(J, {
+		group: s.deleted,
+		onRestore: () => s.restore(),
+		onError: e.onError,
+		name: s.deleted.slug
+	}));
+	if (!s.group) return s.error ? d(/* @__PURE__ */ U("div", {
+		role: "alert",
+		className: "grid justify-items-start gap-2",
+		children: [/* @__PURE__ */ H("p", {
+			className: "text-destructive",
+			children: r("groupEditor.loadFailed")
+		}), /* @__PURE__ */ H(i, {
+			size: "sm",
+			variant: "outline",
+			onClick: s.reload,
+			children: r("common.retry")
+		})]
+	})) : d(/* @__PURE__ */ H(y, { className: "h-40 w-full" }));
+	let f = s.group;
+	return d(/* @__PURE__ */ U(V, { children: [
+		/* @__PURE__ */ H(Y, {
+			group: f,
+			g: s,
+			labels: e.labels,
+			onMerged: e.onMerged,
+			onDeleted: e.onDeleted,
+			onError: e.onError,
+			client: e.client
+		}),
+		/* @__PURE__ */ H($, {
+			group: f,
+			spec: u,
+			g: s,
+			labels: e.labels,
+			onError: e.onError,
+			client: e.client
+		}, f.id),
+		/* @__PURE__ */ H(ee, {
+			group: f,
+			g: s,
+			languages: c,
+			onError: e.onError
+		}),
+		/* @__PURE__ */ H(te, {
+			group: f,
+			g: s,
+			languages: c,
+			onError: e.onError
+		}, f.id),
+		/* @__PURE__ */ H(ne, {
+			group: f,
+			spec: u,
+			onError: e.onError,
+			client: e.client
+		}),
+		u.sellable && /* @__PURE__ */ H(re, {
+			group: f,
+			onError: e.onError,
+			client: e.client
+		}),
+		/* @__PURE__ */ H(ae, {
+			group: f,
+			g: s,
+			kinds: a,
+			labels: e.labels,
+			onError: e.onError,
+			client: e.client
+		}),
+		e.children?.(f)
+	] }));
+}
+function K(e, t) {
+	let [n, r] = B(e), i = z(!1), a = z(e);
+	return a.current = e, L(() => {
+		i.current || r(a.current());
+	}, [t]), [
+		n,
+		I((e) => {
+			i.current = !0, r(e);
+		}, []),
+		I(() => {
+			i.current = !1;
+		}, [])
+	];
+}
+function q({ title: e, children: t, ckui: n, action: r }) {
+	return /* @__PURE__ */ U("section", {
+		className: "grid gap-3",
+		"data-ckui": n,
+		children: [/* @__PURE__ */ U("div", {
+			className: "flex flex-wrap items-center justify-between gap-2",
+			children: [/* @__PURE__ */ H("h3", {
+				className: "font-medium",
+				children: e
+			}), r]
+		}), t]
+	});
+}
+function J({ group: e, name: n, onRestore: r, onError: a }) {
+	let { t: o } = t(), s = C("group.save", a);
+	return /* @__PURE__ */ U("div", {
+		className: "grid justify-items-start gap-2",
+		"data-ckui": "group-deleted",
+		"data-state": e.state,
+		children: [
+			/* @__PURE__ */ H("p", { children: o("groupEditor.deletedNotice", { name: n }) }),
+			/* @__PURE__ */ H(i, {
+				size: "sm",
+				variant: "outline",
+				disabled: s.pending,
+				onClick: () => void s.run(r),
+				children: o("groupEditor.restore")
+			}),
+			/* @__PURE__ */ H(x, { error: s.error })
+		]
+	});
+}
+function Y({ group: e, g: n, labels: r, onMerged: f, onDeleted: p, onError: m, client: h }) {
+	let { t: g } = t(), [_, v] = B(!1), [y, b] = B(!1), S = C("group.save", m);
+	return /* @__PURE__ */ U("div", {
+		className: "flex flex-wrap items-center gap-2",
+		"data-ckui": "group-head",
+		children: [
+			/* @__PURE__ */ H("h2", {
+				className: "text-base font-semibold break-words",
+				children: e.name || e.slug
+			}),
+			/* @__PURE__ */ H(d, {
+				variant: "outline",
+				children: k(r, e.kind)
+			}),
+			/* @__PURE__ */ U("div", {
+				className: "ms-auto flex flex-wrap gap-2",
+				children: [/* @__PURE__ */ H(i, {
+					size: "sm",
+					variant: "outline",
+					onClick: () => v(!0),
+					children: g("groupEditor.merge")
+				}), /* @__PURE__ */ H(i, {
+					size: "sm",
+					variant: "destructive",
+					disabled: S.pending,
+					onClick: () => b(!0),
+					children: g("groupEditor.delete")
+				})]
+			}),
+			/* @__PURE__ */ H(x, {
+				error: S.error,
+				className: "basis-full"
+			}),
+			/* @__PURE__ */ H(X, {
+				open: _,
+				onOpenChange: v,
+				group: e,
+				client: h,
+				onMerge: async (e) => {
+					let t = await n.merge(e.id);
+					return f?.(t), t;
+				}
+			}),
+			/* @__PURE__ */ H(a, {
+				open: y,
+				onOpenChange: b,
+				children: /* @__PURE__ */ U(o, {
+					"data-ckui": "group-delete-dialog",
+					children: [/* @__PURE__ */ U(l, { children: [/* @__PURE__ */ H(u, { children: g("groupEditor.deleteTitle", { name: e.name || e.slug }) }), /* @__PURE__ */ H(s, { children: g("groupEditor.deleteBody") })] }), /* @__PURE__ */ U(c, { children: [/* @__PURE__ */ H(i, {
+						variant: "outline",
+						onClick: () => b(!1),
+						children: g("common.cancel")
+					}), /* @__PURE__ */ H(i, {
+						variant: "destructive",
+						disabled: S.pending,
+						onClick: () => {
+							b(!1), S.run(n.remove).then((e) => e && p?.(e));
+						},
+						children: g("groupEditor.delete")
+					})] })]
+				})
+			})
+		]
+	});
+}
+function X({ open: n, onOpenChange: r, group: d, onMerge: m, language: h, client: g }) {
+	let _ = t(), { t: v } = _, y = R(), [b, C] = B(null), [w, T] = B(""), [E, D] = B(!1), [k, A] = B(null);
+	L(() => {
+		n && (C(null), T(""), A(null));
+	}, [n]);
+	let j = v("groupEditor.mergeWord"), M = !!b && w.trim().toLowerCase() === j.toLowerCase(), N = d.name || d.slug;
+	return /* @__PURE__ */ H(a, {
+		open: n,
+		onOpenChange: r,
+		children: /* @__PURE__ */ U(o, {
+			"data-ckui": "group-merge-dialog",
+			children: [
+				/* @__PURE__ */ U(l, { children: [/* @__PURE__ */ H(u, { children: v("groupEditor.mergeTitle", { name: N }) }), /* @__PURE__ */ H(s, { children: v("groupEditor.mergeBody") })] }),
+				b ? /* @__PURE__ */ U("div", {
+					className: "flex flex-wrap items-center gap-2",
+					"data-ckui": "merge-target",
+					children: [/* @__PURE__ */ H("span", { children: v("groupEditor.mergeInto", { name: b.name || b.slug }) }), /* @__PURE__ */ H(i, {
+						size: "xs",
+						variant: "ghost",
+						onClick: () => C(null),
+						children: v("groupEditor.change")
+					})]
+				}) : /* @__PURE__ */ H(O, {
+					kind: d.kind,
+					language: h,
+					exclude: [d.id],
+					label: v("groupEditor.mergeTarget"),
+					onPick: C,
+					client: g,
+					autoFocus: !0
+				}),
+				/* @__PURE__ */ U("div", {
+					className: "grid gap-1.5",
+					children: [/* @__PURE__ */ H(p, {
+						htmlFor: `${y}-typed`,
+						children: v("admin.typeToConfirm", { word: j })
+					}), /* @__PURE__ */ H(f, {
+						id: `${y}-typed`,
+						value: w,
+						autoComplete: "off",
+						onChange: (e) => T(e.target.value)
+					})]
+				}),
+				k && /* @__PURE__ */ H(x, { children: S(_, k) }),
+				/* @__PURE__ */ U(c, { children: [/* @__PURE__ */ H(i, {
+					variant: "outline",
+					onClick: () => r(!1),
+					children: v("common.cancel")
+				}), /* @__PURE__ */ H(i, {
+					variant: "destructive",
+					disabled: !M || E,
+					onClick: async () => {
+						if (b) {
+							D(!0), A(null);
+							try {
+								await m(b), r(!1);
+							} catch (t) {
+								A(e(t));
+							} finally {
+								D(!1);
+							}
+						}
+					},
+					children: v("groupEditor.merge")
+				})] })
+			]
+		})
+	});
+}
+function Z({ label: e, kind: n, value: r, onChange: a, exclude: o, required: s, client: c }) {
+	let { t: l } = t();
+	return /* @__PURE__ */ U("div", {
+		className: "grid gap-1.5",
+		"data-ckui": "group-field",
+		children: [/* @__PURE__ */ U("span", {
+			className: "text-sm font-medium",
+			children: [e, s && /* @__PURE__ */ H("span", {
+				"aria-hidden": !0,
+				children: " *"
+			})]
+		}), r ? /* @__PURE__ */ U("div", {
+			className: "flex flex-wrap items-center gap-2",
+			children: [/* @__PURE__ */ H("span", {
+				className: "rounded-md border border-border px-2 py-0.5",
+				"data-ckui": "group-field-value",
+				children: r.name || r.slug
+			}), /* @__PURE__ */ H(i, {
+				type: "button",
+				size: "xs",
+				variant: "ghost",
+				onClick: () => a(null),
+				"aria-label": l("groupEditor.clearField", { field: e }),
+				children: l(s ? "groupEditor.change" : "common.remove")
+			})]
+		}) : /* @__PURE__ */ H(O, {
+			kind: n,
+			label: e,
+			exclude: o,
+			onPick: a,
+			client: c
+		})]
+	});
+}
+function Q({ kind: e, spec: n, languages: r, labels: a, g: o, onCreated: s, onError: c, client: l }) {
+	let u = t(), { t: d } = u, m = R(), h = j(), [g, _] = B({}), [v, y] = B(""), [b, E] = B(!1), [D, O] = B(null), [A, M] = B(null), F = n.attributes ?? {}, [I, z] = B(() => P(F, {})), [V, W] = B(null), G = C("group.save", c), K = g[r[0]] ?? "";
+	L(() => {
+		b || y(T(K));
+	}, [K, b]);
+	let q = async () => {
+		W(null);
+		let t;
+		try {
+			t = w(F, I);
+		} catch (e) {
+			W(e.message);
+			return;
+		}
+		let n = r.filter((e) => g[e]?.trim()).map((e) => ({
+			language: e,
+			kind: "name",
+			name: g[e].trim()
+		})), i = await G.run(() => o.create({
+			kind: e,
+			slug: v.trim(),
+			names: n,
+			parent_id: D?.id,
+			scope_id: A?.id,
+			attributes: Object.keys(t).length ? t : void 0
+		}));
+		i && s?.(i);
+	};
+	return /* @__PURE__ */ U("form", {
+		className: "grid gap-4",
+		"data-ckui": "group-create",
+		onSubmit: (e) => {
+			e.preventDefault(), q();
+		},
+		children: [
+			/* @__PURE__ */ H("h2", {
+				className: "text-base font-semibold",
+				children: d("groupEditor.newTitle", { kind: k(a, e) })
+			}),
+			r.map((e, t) => /* @__PURE__ */ U("div", {
+				className: "grid gap-1.5",
+				children: [/* @__PURE__ */ H(p, {
+					htmlFor: `${m}-${e}`,
+					children: d("groupEditor.nameIn", { language: h(e) })
+				}), /* @__PURE__ */ H(f, {
+					id: `${m}-${e}`,
+					className: "h-8",
+					lang: e,
+					required: t === 0,
+					value: g[e] ?? "",
+					onChange: (t) => _((n) => ({
+						...n,
+						[e]: t.target.value
+					}))
+				})]
+			}, e)),
+			/* @__PURE__ */ U("div", {
+				className: "grid gap-1.5",
+				children: [/* @__PURE__ */ H(p, {
+					htmlFor: `${m}-slug`,
+					children: d("groupEditor.slug")
+				}), /* @__PURE__ */ H(f, {
+					id: `${m}-slug`,
+					className: "h-8",
+					required: !0,
+					value: v,
+					onChange: (e) => {
+						E(!0), y(e.target.value);
+					}
+				})]
+			}),
+			n.scoped_by && /* @__PURE__ */ H(Z, {
+				label: k(a, n.scoped_by),
+				kind: n.scoped_by,
+				value: A,
+				onChange: M,
+				required: !0,
+				client: l
+			}),
+			n.parent && /* @__PURE__ */ H(Z, {
+				label: d("groupEditor.parent"),
+				kind: n.parent,
+				value: D,
+				onChange: O,
+				client: l
+			}),
+			/* @__PURE__ */ H(N, {
+				declared: F,
+				form: I,
+				onChange: (e, t) => z((n) => ({
+					...n,
+					[e]: t
+				})),
+				labels: a
+			}),
+			V && /* @__PURE__ */ H(x, { children: V }),
+			G.error && /* @__PURE__ */ H(x, { children: S(u, G.error) }),
+			/* @__PURE__ */ H(i, {
+				type: "submit",
+				className: "justify-self-start",
+				disabled: G.pending || !K.trim() || !v.trim() || !!n.scoped_by && !A,
+				children: G.pending ? d("common.saving") : d("groupEditor.create")
+			})
+		]
+	});
+}
+function $({ group: e, spec: n, g: r, labels: a, onError: o, client: s }) {
+	let { t: c } = t(), l = R(), u = n.attributes ?? {}, [d, m, h] = K(() => ({
+		slug: e.slug,
+		parent: e.parent ?? null,
+		scope: e.scope ?? null,
+		attrs: P(u, e.attributes)
+	}), e.revision), { slug: g, parent: _, scope: v, attrs: y } = d, b = (e) => {
+		M(!1), m((t) => ({
+			...t,
+			...e
+		}));
+	}, S = (e) => b({ slug: e }), T = (e) => b({ parent: e }), E = (e) => b({ scope: e }), D = (e) => b({ attrs: e(y) }), [O, A] = B(null), [j, M] = B(!1), F = C("group.save", o), I = async () => {
+		A(null), M(!1);
+		let e;
+		try {
+			e = w(u, y);
+		} catch (e) {
+			A(e.message);
+			return;
+		}
+		await F.run(() => r.update({
+			slug: g.trim(),
+			attributes: e,
+			...n.parent ? { parent_id: _?.id ?? "" } : {},
+			...n.scoped_by && v ? { scope_id: v.id } : {}
+		})) && (h(), M(!0));
+	};
+	return /* @__PURE__ */ H(q, {
+		title: c("groupEditor.details"),
+		ckui: "group-details",
+		children: /* @__PURE__ */ U("form", {
+			className: "grid gap-3",
+			onSubmit: (e) => {
+				e.preventDefault(), I();
+			},
+			children: [
+				/* @__PURE__ */ U("div", {
+					className: "grid gap-1.5",
+					children: [/* @__PURE__ */ H(p, {
+						htmlFor: `${l}-slug`,
+						children: c("groupEditor.slug")
+					}), /* @__PURE__ */ H(f, {
+						id: `${l}-slug`,
+						className: "h-8",
+						required: !0,
+						value: g,
+						onChange: (e) => S(e.target.value)
+					})]
+				}),
+				n.scoped_by && /* @__PURE__ */ H(Z, {
+					label: k(a, n.scoped_by),
+					kind: n.scoped_by,
+					value: v,
+					onChange: E,
+					required: !0,
+					client: s
+				}),
+				n.parent && /* @__PURE__ */ H(Z, {
+					label: c("groupEditor.parent"),
+					kind: n.parent,
+					value: _,
+					onChange: T,
+					exclude: [e.id],
+					client: s
+				}),
+				/* @__PURE__ */ H(N, {
+					declared: u,
+					form: y,
+					onChange: (e, t) => D((n) => ({
+						...n,
+						[e]: t
+					})),
+					labels: a
+				}),
+				O && /* @__PURE__ */ H(x, { children: O }),
+				/* @__PURE__ */ H(x, { error: F.error }),
+				/* @__PURE__ */ U("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ H(i, {
+						type: "submit",
+						size: "sm",
+						disabled: F.pending || !g.trim() || !!n.scoped_by && !v,
+						children: F.pending ? c("common.saving") : c("common.save")
+					}), j && /* @__PURE__ */ H("span", {
+						role: "status",
+						className: "text-muted-foreground",
+						children: c("groupEditor.saved")
+					})]
+				})
+			]
+		})
+	});
+}
+function ee({ group: e, g: n, languages: r, onError: a }) {
+	let { t: o } = t(), s = R(), c = j(), [l, u] = B(r[0]), [y, b] = B("alias"), [S, w] = B(""), T = C("group.save", a), E = [...e.names].sort((e, t) => e.language.localeCompare(t.language) || (e.kind === t.kind ? e.name.localeCompare(t.name) : e.kind === "name" ? -1 : 1)), D = [.../* @__PURE__ */ new Set([...r, ...e.names.map((e) => e.language)])];
+	return /* @__PURE__ */ U(q, {
+		title: o("groupEditor.names"),
+		ckui: "group-names-editor",
+		children: [
+			E.length ? /* @__PURE__ */ H("ul", {
+				className: "grid divide-y divide-border rounded-lg border border-border",
+				children: E.map((e) => /* @__PURE__ */ U("li", {
+					className: "flex flex-wrap items-center gap-2 p-2.5",
+					"data-ckui": "group-name",
+					"data-kind": e.kind,
+					"data-language": e.language,
+					children: [
+						/* @__PURE__ */ H(d, {
+							variant: "outline",
+							children: c(e.language)
+						}),
+						/* @__PURE__ */ H("span", {
+							className: "min-w-0 flex-1 break-words",
+							lang: e.language,
+							children: e.name
+						}),
+						/* @__PURE__ */ H("span", {
+							className: "text-xs text-muted-foreground",
+							children: o(e.kind === "name" ? "groupEditor.canonical" : "groupEditor.alias")
+						}),
+						e.kind === "alias" && /* @__PURE__ */ H(i, {
+							size: "xs",
+							variant: "ghost",
+							disabled: T.pending,
+							onClick: () => void T.run(() => n.names("add", [{
+								...e,
+								kind: "name"
+							}])),
+							children: o("groupEditor.makeCanonical")
+						}),
+						/* @__PURE__ */ H(i, {
+							size: "xs",
+							variant: "ghost",
+							disabled: T.pending,
+							"aria-label": o("groupEditor.removeName", { name: e.name }),
+							onClick: () => void T.run(() => n.names("remove", [e])),
+							children: o("common.remove")
+						})
+					]
+				}, `${e.language}:${e.kind}:${e.name}`))
+			}) : /* @__PURE__ */ H("p", {
+				className: "text-muted-foreground",
+				children: o("groupEditor.noNames")
+			}),
+			/* @__PURE__ */ U("form", {
+				className: "flex flex-wrap items-end gap-2",
+				onSubmit: (e) => {
+					e.preventDefault();
+					let t = S.trim();
+					t && T.run(() => n.names("add", [{
+						language: l,
+						kind: y,
+						name: t
+					}])).then((e) => e && w(""));
+				},
+				children: [
+					D.length > 1 && /* @__PURE__ */ U(m, {
+						value: l,
+						onValueChange: (e) => u(String(e)),
+						children: [/* @__PURE__ */ H(_, {
+							size: "sm",
+							"aria-label": o("groupEditor.language"),
+							children: /* @__PURE__ */ H(v, { children: (e) => c(e) })
+						}), /* @__PURE__ */ H(h, { children: D.map((e) => /* @__PURE__ */ H(g, {
+							value: e,
+							children: c(e)
+						}, e)) })]
+					}),
+					/* @__PURE__ */ U(m, {
+						value: y,
+						onValueChange: (e) => b(e),
+						children: [/* @__PURE__ */ H(_, {
+							size: "sm",
+							"aria-label": o("groupEditor.nameKind"),
+							children: /* @__PURE__ */ H(v, { children: (e) => o(e === "name" ? "groupEditor.canonical" : "groupEditor.alias") })
+						}), /* @__PURE__ */ U(h, { children: [/* @__PURE__ */ H(g, {
+							value: "alias",
+							children: o("groupEditor.alias")
+						}), /* @__PURE__ */ H(g, {
+							value: "name",
+							children: o("groupEditor.canonical")
+						})] })]
+					}),
+					/* @__PURE__ */ H(p, {
+						htmlFor: `${s}-name`,
+						className: "sr-only",
+						children: o("groupEditor.newName")
+					}),
+					/* @__PURE__ */ H(f, {
+						id: `${s}-name`,
+						className: "h-8 min-w-40 flex-1",
+						lang: l,
+						value: S,
+						placeholder: o("groupEditor.newName"),
+						onChange: (e) => w(e.target.value)
+					}),
+					/* @__PURE__ */ H(i, {
+						type: "submit",
+						size: "sm",
+						variant: "outline",
+						disabled: T.pending || !S.trim(),
+						children: o("groupEditor.addName")
+					})
+				]
+			}),
+			/* @__PURE__ */ H(x, { error: T.error })
+		]
+	});
+}
+function te({ group: e, g: n, languages: r, onError: a }) {
+	let { t: o } = t(), s = R(), c = j(), l = [.../* @__PURE__ */ new Set([...r, ...e.text.map((e) => e.language)])], [u, d, m] = K(() => Object.fromEntries(l.map((t) => [t, e.text.find((e) => e.language === t) ?? { language: t }])), e.revision), [h, g] = B(!1), _ = C("group.save", a), v = (e, t) => {
+		g(!1), d((n) => ({
+			...n,
+			[e]: {
+				...n[e],
+				...t
+			}
+		}));
+	};
+	return /* @__PURE__ */ H(q, {
+		title: o("groupEditor.text"),
+		ckui: "group-text",
+		children: /* @__PURE__ */ U("form", {
+			className: "grid gap-4",
+			onSubmit: (e) => {
+				e.preventDefault();
+				let t = Object.values(u).map((e) => ({
+					language: e.language,
+					description: e.description?.trim() || void 0,
+					sort_key: e.sort_key?.trim() || void 0
+				})).filter((e) => e.description || e.sort_key);
+				_.run(() => n.update({ text: t })).then((e) => {
+					e && (m(), g(!0));
+				});
+			},
+			children: [
+				l.map((e) => /* @__PURE__ */ U("fieldset", {
+					className: "grid gap-2",
+					"data-language": e,
+					children: [
+						/* @__PURE__ */ H("legend", {
+							className: "mb-1 text-xs font-medium text-muted-foreground",
+							children: c(e)
+						}),
+						/* @__PURE__ */ H(p, {
+							htmlFor: `${s}-${e}-d`,
+							className: "sr-only",
+							children: o("groupEditor.descriptionIn", { language: c(e) })
+						}),
+						/* @__PURE__ */ H(b, {
+							id: `${s}-${e}-d`,
+							lang: e,
+							rows: 3,
+							placeholder: o("groupEditor.description"),
+							value: u[e]?.description ?? "",
+							onChange: (t) => v(e, { description: t.target.value })
+						}),
+						/* @__PURE__ */ H(p, {
+							htmlFor: `${s}-${e}-s`,
+							className: "sr-only",
+							children: o("groupEditor.sortKeyIn", { language: c(e) })
+						}),
+						/* @__PURE__ */ H(f, {
+							id: `${s}-${e}-s`,
+							className: "h-8",
+							lang: e,
+							placeholder: o("groupEditor.sortKey"),
+							value: u[e]?.sort_key ?? "",
+							onChange: (t) => v(e, { sort_key: t.target.value })
+						})
+					]
+				}, e)),
+				/* @__PURE__ */ H(x, { error: _.error }),
+				/* @__PURE__ */ U("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ H(i, {
+						type: "submit",
+						size: "sm",
+						disabled: _.pending,
+						children: _.pending ? o("common.saving") : o("common.save")
+					}), h && /* @__PURE__ */ H("span", {
+						role: "status",
+						className: "text-muted-foreground",
+						children: o("groupEditor.saved")
+					})]
+				})
+			]
+		})
+	});
+}
+function ne({ group: e, spec: n, onError: r, client: i }) {
+	let { t: a } = t(), o = e.cover, s = o?.image ? "image" : o?.content_id && !o.auto ? "content" : "auto";
+	return /* @__PURE__ */ U(q, {
+		title: a(n.owner === "user" ? "groupEditor.images" : "groupEditor.cover"),
+		ckui: "group-cover-editor",
+		children: [
+			/* @__PURE__ */ H("p", {
+				className: "text-muted-foreground",
+				"data-ckui": "cover-mode",
+				children: a(s === "image" ? "groupEditor.coverImage" : s === "content" ? "groupEditor.coverContent" : "groupEditor.coverAuto")
+			}),
+			/* @__PURE__ */ H(F, {
+				group: e,
+				slot: "cover",
+				client: i,
+				onError: r
+			}),
+			n.owner === "user" && /* @__PURE__ */ H(F, {
+				group: e,
+				slot: "avatar",
+				client: i,
+				onError: r
+			})
+		]
+	});
+}
+function re({ group: e, onError: n, client: i }) {
+	let { t: a } = t(), o = r(i), s = C("offer.save", n), c = e.access?.offer;
+	return /* @__PURE__ */ U(q, {
+		title: a("groupEditor.membershipPrice"),
+		ckui: "group-offer",
+		children: [/* @__PURE__ */ H(M, {
+			offer: c,
+			pending: s.pending,
+			onSell: (t) => void s.run(() => o.offers.sellGroup(e.id, t)),
+			onWithdraw: () => void s.run(() => o.offers.withdrawGroup(e.id))
+		}), /* @__PURE__ */ H(x, { error: s.error })]
+	});
+}
+var ie = /^[a-z][a-z0-9_]*$/;
+function ae({ group: e, g: n, kinds: r, labels: a, onError: o, client: s }) {
+	let { t: c } = t(), l = R(), u = C("group.save", o), y = A(e.edges.map((t) => t.from === e.id ? t.to : t.from), { client: s }), b = Object.keys(r?.group_kinds ?? {}).sort(), [S, w] = B(""), [T, E] = B(b[0] ?? e.kind), D = e.edges.filter((t) => t.from === e.id), j = e.edges.filter((t) => t.to === e.id), M = (e) => {
+		let t = y.get(e);
+		return t ? t.name || t.slug : e;
+	}, N = ie.test(S.trim());
+	return /* @__PURE__ */ U(q, {
+		title: c("groupEditor.edges"),
+		ckui: "group-edges",
+		children: [
+			D.length + j.length ? /* @__PURE__ */ U("ul", {
+				className: "grid gap-1.5",
+				children: [D.map((e) => /* @__PURE__ */ U("li", {
+					className: "flex flex-wrap items-center gap-2",
+					"data-ckui": "group-edge",
+					"data-relation": e.relation,
+					children: [
+						/* @__PURE__ */ H(d, {
+							variant: "secondary",
+							children: k(a, e.relation)
+						}),
+						/* @__PURE__ */ H("span", { children: M(e.to) }),
+						/* @__PURE__ */ H(i, {
+							size: "xs",
+							variant: "ghost",
+							disabled: u.pending,
+							"aria-label": c("groupEditor.removeEdge", { name: M(e.to) }),
+							onClick: () => void u.run(() => n.edges("remove", [{
+								relation: e.relation,
+								to: e.to
+							}])),
+							children: c("common.remove")
+						})
+					]
+				}, `${e.relation}:${e.to}`)), j.map((e) => /* @__PURE__ */ U("li", {
+					className: "flex flex-wrap items-center gap-2 text-muted-foreground",
+					"data-ckui": "group-edge",
+					"data-relation": `inverse:${e.relation}`,
+					children: [/* @__PURE__ */ H("span", {
+						className: "text-foreground",
+						children: M(e.from)
+					}), /* @__PURE__ */ H(d, {
+						variant: "outline",
+						children: k(a, e.relation)
+					})]
+				}, `in:${e.relation}:${e.from}`))]
+			}) : /* @__PURE__ */ H("p", {
+				className: "text-muted-foreground",
+				children: c("groupEditor.noEdges")
+			}),
+			/* @__PURE__ */ U("div", {
+				className: "flex flex-wrap items-end gap-2",
+				children: [
+					/* @__PURE__ */ U("div", {
+						className: "grid gap-1",
+						children: [/* @__PURE__ */ H(p, {
+							htmlFor: `${l}-rel`,
+							className: "text-xs text-muted-foreground",
+							children: c("groupEditor.relation")
+						}), /* @__PURE__ */ H(f, {
+							id: `${l}-rel`,
+							className: "h-8 w-40",
+							value: S,
+							placeholder: "member_of",
+							"aria-invalid": !!S && !N,
+							onChange: (e) => w(e.target.value)
+						})]
+					}),
+					b.length > 1 && /* @__PURE__ */ U(m, {
+						value: T,
+						onValueChange: (e) => E(String(e)),
+						children: [/* @__PURE__ */ H(_, {
+							size: "sm",
+							"aria-label": c("groupEditor.edgeKind"),
+							children: /* @__PURE__ */ H(v, { children: (e) => k(a, e) })
+						}), /* @__PURE__ */ H(h, { children: b.map((e) => /* @__PURE__ */ H(g, {
+							value: e,
+							children: k(a, e)
+						}, e)) })]
+					}),
+					N && /* @__PURE__ */ H(O, {
+						kind: T,
+						label: c("groupEditor.edgeTarget"),
+						exclude: [e.id],
+						client: s,
+						onPick: (e) => void u.run(() => n.edges("add", [{
+							relation: S.trim(),
+							to: e.id
+						}])).then((e) => e && w(""))
+					}, T)
+				]
+			}),
+			/* @__PURE__ */ H(x, { error: u.error })
+		]
+	});
+}
+//#endregion
+export { G as GroupEditor, X as GroupMergeDialog };
+
+//# sourceMappingURL=editor.js.map