@openrails/contentkit-ui 0.79.0 → 0.81.0

package/dist/components/content/editors.js

@@ -0,0 +1,764 @@
+import { useMessages as e } from "../../i18n/context.js";
+import { useContentKitClient as t } from "../../react/context.js";
+import { Button as n } from "../../ui/button.js";
+import { SortableList as r } from "../sortable-list.js";
+import { MediaFolderEditor as i } from "../media-folder-editor.js";
+import { Badge as a } from "../../ui/badge.js";
+import { Input as o } from "../../ui/input.js";
+import { Label as s } from "../../ui/label.js";
+import { Select as c, SelectContent as l, SelectItem as u, SelectTrigger as d, SelectValue as f } from "../../ui/select.js";
+import { ErrorLine as p, useAction as m } from "../social/parts.js";
+import { Switch as h } from "../../ui/switch.js";
+import { fromLocalInput as g, parseAttributes as _, toLocalInput as v } from "../../client/group-fields.js";
+import { useKinds as y } from "../../react/groups.js";
+import { GroupPicker as b, labelOf as x, useGroupNames as S, useLanguageName as C } from "../groups/parts.js";
+import { OfferFields as w } from "./offer-fields.js";
+import { AttributeFields as T, formOf as E } from "../groups/fields.js";
+import { MembershipEditor as D } from "../groups/memberships.js";
+import { useEffect as O, useId as k, useMemo as A, useState as j } from "react";
+import { jsx as M, jsxs as N } from "react/jsx-runtime";
+import { cn as P } from "cn";
+//#region src/components/content/editors.tsx
+var F = "__none__", I = [
+	"listed",
+	"members",
+	"unlisted"
+], L = [
+	"open",
+	"closed",
+	"hidden"
+], R = [
+	"public",
+	"tier",
+	"ppv",
+	"group",
+	"group_ppv"
+];
+function z({ title: e, ckui: t, children: n }) {
+	return /* @__PURE__ */ N("section", {
+		className: "grid gap-3 border-t border-border pt-4",
+		"data-ckui": t,
+		children: [/* @__PURE__ */ M("h3", {
+			className: "font-medium",
+			children: e
+		}), n]
+	});
+}
+function B({ show: t }) {
+	let { t: n } = e();
+	return t ? /* @__PURE__ */ M("span", {
+		role: "status",
+		className: "text-muted-foreground",
+		children: n("contentEditor.saved")
+	}) : null;
+}
+function V(e, t) {
+	let { kinds: n } = y({ client: t });
+	return {
+		model: n,
+		spec: n?.kinds[e]
+	};
+}
+function H({ content: r, ...i }) {
+	let { t: a } = e(), o = t(i.client), { spec: h } = V(r.kind, i.client), g = A(() => h?.attributes ?? {}, [h]), [v, y] = j(r.listing), [b, x] = j(r.comments), [S, C] = j({});
+	O(() => {
+		y(r.listing), x(r.comments), C(E(g, r.attributes));
+	}, [
+		r.revision,
+		r.listing,
+		r.comments,
+		r.attributes,
+		g
+	]);
+	let [w, D] = j(null), [k, P] = j(!1), F = m("content.save", i.onError);
+	return /* @__PURE__ */ M(z, {
+		title: a("contentEditor.details"),
+		ckui: "content-details",
+		children: /* @__PURE__ */ N("form", {
+			className: "grid gap-3",
+			onSubmit: (e) => {
+				e.preventDefault(), D(null), P(!1);
+				let t;
+				try {
+					t = _(g, S);
+				} catch (e) {
+					return D(e.message);
+				}
+				F.run(() => o.contents.update(r.id, {
+					listing: v,
+					comments: b,
+					attributes: t,
+					revision: r.revision
+				})).then((e) => e && P(!0));
+			},
+			children: [
+				/* @__PURE__ */ N("div", {
+					className: "grid gap-1.5 sm:max-w-xs",
+					children: [/* @__PURE__ */ M(s, { children: a("contentEditor.listing") }), /* @__PURE__ */ N(c, {
+						value: v,
+						onValueChange: (e) => y(e),
+						children: [/* @__PURE__ */ M(d, {
+							size: "sm",
+							"aria-label": a("contentEditor.listing"),
+							children: /* @__PURE__ */ M(f, { children: (e) => a(`contentEditor.listing_${e}`) })
+						}), /* @__PURE__ */ M(l, { children: I.map((e) => /* @__PURE__ */ M(u, {
+							value: e,
+							children: a(`contentEditor.listing_${e}`)
+						}, e)) })]
+					})]
+				}),
+				/* @__PURE__ */ N("div", {
+					className: "grid gap-1.5 sm:max-w-xs",
+					children: [/* @__PURE__ */ M(s, { children: a("contentEditor.comments") }), /* @__PURE__ */ N(c, {
+						value: b,
+						onValueChange: (e) => x(e),
+						children: [/* @__PURE__ */ M(d, {
+							size: "sm",
+							"aria-label": a("contentEditor.comments"),
+							children: /* @__PURE__ */ M(f, { children: (e) => a(`contentEditor.comments_${e}`) })
+						}), /* @__PURE__ */ M(l, { children: L.map((e) => /* @__PURE__ */ M(u, {
+							value: e,
+							children: a(`contentEditor.comments_${e}`)
+						}, e)) })]
+					})]
+				}),
+				/* @__PURE__ */ M(T, {
+					declared: g,
+					form: S,
+					onChange: (e, t) => C((n) => ({
+						...n,
+						[e]: t
+					})),
+					labels: i.labels
+				}),
+				w && /* @__PURE__ */ M(p, { children: w }),
+				/* @__PURE__ */ M(p, { error: F.error }),
+				/* @__PURE__ */ N("div", {
+					className: "flex items-center gap-3",
+					children: [/* @__PURE__ */ M(n, {
+						type: "submit",
+						size: "sm",
+						disabled: F.pending,
+						children: F.pending ? a("common.saving") : a("common.save")
+					}), /* @__PURE__ */ M(B, { show: k })]
+				})
+			]
+		})
+	});
+}
+function U({ value: t, onChange: n, model: r, labels: i, client: a }) {
+	let { t: p } = e(), m = k(), _ = r?.tiers ?? [], y = Object.entries(r?.group_kinds ?? {}).filter(([, e]) => e.sellable || e.auth_scope).map(([e]) => e), [C, w] = j(y[0] ?? ""), T = S(t.group_id ? [t.group_id] : [], { client: a }), E = t.group_id ? T.get(t.group_id) : void 0, D = (e) => n({
+		...t,
+		...e
+	});
+	return /* @__PURE__ */ N("div", {
+		className: "grid gap-3",
+		"data-ckui": "rule-fields",
+		children: [
+			/* @__PURE__ */ N("div", {
+				className: "grid gap-1.5 sm:max-w-xs",
+				children: [/* @__PURE__ */ M(s, { children: p("contentEditor.access") }), /* @__PURE__ */ N(c, {
+					value: t.level,
+					onValueChange: (e) => n({
+						level: e,
+						preview: t.preview,
+						free_after: t.free_after
+					}),
+					children: [/* @__PURE__ */ M(d, {
+						size: "sm",
+						"aria-label": p("contentEditor.access"),
+						children: /* @__PURE__ */ M(f, { children: (e) => p(`contentEditor.level_${e}`) })
+					}), /* @__PURE__ */ M(l, { children: R.filter((e) => (e !== "tier" || _.length) && (!e.startsWith("group") || y.length)).map((e) => /* @__PURE__ */ M(u, {
+						value: e,
+						children: p(`contentEditor.level_${e}`)
+					}, e)) })]
+				})]
+			}),
+			t.level === "tier" && /* @__PURE__ */ N("fieldset", {
+				className: "flex flex-wrap gap-3",
+				children: [/* @__PURE__ */ M("legend", {
+					className: "sr-only",
+					children: p("contentEditor.tiers")
+				}), _.map((e) => /* @__PURE__ */ N("label", {
+					className: "flex items-center gap-2",
+					children: [/* @__PURE__ */ M(h, {
+						checked: t.tiers?.includes(e) ?? !1,
+						onCheckedChange: (n) => D({ tiers: n ? [...t.tiers ?? [], e] : (t.tiers ?? []).filter((t) => t !== e) }),
+						"aria-label": x(i, e)
+					}), x(i, e)]
+				}, e))]
+			}),
+			(t.level === "group" || t.level === "group_ppv") && /* @__PURE__ */ N("div", {
+				className: "flex flex-wrap items-end gap-2",
+				children: [
+					E || t.group_id ? /* @__PURE__ */ M("span", {
+						className: "rounded-md border border-border px-2 py-0.5",
+						"data-ckui": "rule-group",
+						children: E ? E.name || E.slug : t.group_id
+					}) : null,
+					y.length > 1 && /* @__PURE__ */ N(c, {
+						value: C,
+						onValueChange: (e) => w(String(e)),
+						children: [/* @__PURE__ */ M(d, {
+							size: "sm",
+							"aria-label": p("groupEditor.edgeKind"),
+							children: /* @__PURE__ */ M(f, { children: (e) => x(i, e) })
+						}), /* @__PURE__ */ M(l, { children: y.map((e) => /* @__PURE__ */ M(u, {
+							value: e,
+							children: x(i, e)
+						}, e)) })]
+					}),
+					C && /* @__PURE__ */ M(b, {
+						kind: C,
+						label: p("contentEditor.group"),
+						client: a,
+						onPick: (e) => D({ group_id: e.id })
+					}, C)
+				]
+			}),
+			t.level !== "public" && /* @__PURE__ */ N("div", {
+				className: "grid gap-3 sm:grid-cols-3",
+				children: [
+					/* @__PURE__ */ N("div", {
+						className: "grid gap-1.5",
+						children: [/* @__PURE__ */ M(s, {
+							htmlFor: `${m}-pages`,
+							children: p("contentEditor.previewPages")
+						}), /* @__PURE__ */ M(o, {
+							id: `${m}-pages`,
+							className: "h-8",
+							type: "number",
+							min: 0,
+							value: t.preview?.pages ?? "",
+							onChange: (e) => D({ preview: {
+								...t.preview,
+								pages: e.target.value ? Math.max(0, Math.trunc(Number(e.target.value))) : void 0
+							} })
+						})]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid gap-1.5",
+						children: [/* @__PURE__ */ M(s, {
+							htmlFor: `${m}-segments`,
+							children: p("contentEditor.previewSegments")
+						}), /* @__PURE__ */ M(o, {
+							id: `${m}-segments`,
+							className: "h-8",
+							type: "number",
+							min: 0,
+							value: t.preview?.segments ?? "",
+							onChange: (e) => D({ preview: {
+								...t.preview,
+								segments: e.target.value ? Math.max(0, Math.trunc(Number(e.target.value))) : void 0
+							} })
+						})]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid gap-1.5",
+						children: [/* @__PURE__ */ M(s, {
+							htmlFor: `${m}-free`,
+							children: p("contentEditor.freeAfter")
+						}), /* @__PURE__ */ M(o, {
+							id: `${m}-free`,
+							className: "h-8",
+							type: "datetime-local",
+							value: v(t.free_after),
+							onChange: (e) => D({ free_after: g(e.target.value) })
+						})]
+					})
+				]
+			})
+		]
+	});
+}
+function W(e) {
+	let t = e.preview && (e.preview.pages || e.preview.segments) ? {
+		pages: e.preview.pages || void 0,
+		segments: e.preview.segments || void 0
+	} : void 0;
+	return {
+		level: e.level,
+		tiers: e.level === "tier" ? e.tiers : void 0,
+		group_id: e.level === "group" || e.level === "group_ppv" ? e.group_id : void 0,
+		preview: e.level === "public" ? void 0 : t,
+		free_after: e.level === "public" ? void 0 : e.free_after
+	};
+}
+function G({ content: r, ...i }) {
+	let { t: a } = e(), o = t(i.client), { model: s } = V(r.kind, i.client), [c, l] = j(r.access);
+	O(() => l(r.access), [r.revision, r.access]);
+	let [u, d] = j(!1), f = m("content.save", i.onError), h = m("offer.save", i.onError);
+	return /* @__PURE__ */ N(z, {
+		title: a("contentEditor.accessTitle"),
+		ckui: "access-editor",
+		children: [
+			/* @__PURE__ */ N("form", {
+				className: "grid gap-3",
+				onSubmit: (e) => {
+					e.preventDefault(), d(!1), f.run(() => o.contents.update(r.id, {
+						access: W(c),
+						revision: r.revision
+					})).then((e) => e && d(!0));
+				},
+				children: [
+					/* @__PURE__ */ M(U, {
+						value: c,
+						onChange: l,
+						model: s,
+						labels: i.labels,
+						client: o
+					}),
+					/* @__PURE__ */ M(p, { error: f.error }),
+					/* @__PURE__ */ N("div", {
+						className: "flex items-center gap-3",
+						children: [/* @__PURE__ */ M(n, {
+							type: "submit",
+							size: "sm",
+							disabled: f.pending,
+							children: f.pending ? a("common.saving") : a("common.save")
+						}), /* @__PURE__ */ M(B, { show: u })]
+					})
+				]
+			}),
+			/* @__PURE__ */ M(w, {
+				offer: r.offer,
+				pending: h.pending,
+				onSell: (e) => void h.run(() => o.offers.sell({ content: r.id }, e)),
+				onWithdraw: () => void h.run(() => o.offers.withdraw({ content: r.id }))
+			}),
+			/* @__PURE__ */ M(p, { error: h.error })
+		]
+	});
+}
+function K(e, t, n) {
+	return e.label || [...e.languages.map(t), ...e.traits.map((e) => x(n, e))].join(" · ");
+}
+function q({ content: i, media: o = !0, ...s }) {
+	let { t: c } = e(), l = t(s.client), u = C(), { model: d, spec: f } = V(i.kind, s.client), h = m("content.save", s.onError), g = m("content.save", s.onError), [_, v] = j(null), y = A(() => [...i.versions].sort((e, t) => e.position - t.position), [i.versions]);
+	if (f?.versions.hidden) return null;
+	let b = d?.languages ?? [];
+	return /* @__PURE__ */ N(z, {
+		title: c("contentEditor.versions"),
+		ckui: "versions-editor",
+		children: [
+			/* @__PURE__ */ M(r, {
+				items: y,
+				id: (e) => e.id,
+				name: (e) => K(e, u, s.labels),
+				label: c("contentEditor.versions"),
+				disabled: h.pending || y.length < 2,
+				onMove: (e, t) => {
+					let n = y.map((e) => e.id), [r] = n.splice(e, 1);
+					n.splice(t, 0, r), h.run(() => l.contents.orderVersions(i.id, n));
+				},
+				children: (e, t) => /* @__PURE__ */ N("div", {
+					className: "grid gap-2 rounded-md border border-border p-2",
+					"data-ckui": "version-row",
+					"data-version": e.id,
+					children: [/* @__PURE__ */ N("div", {
+						className: "flex flex-wrap items-center gap-2",
+						children: [
+							y.length > 1 && t,
+							/* @__PURE__ */ M("span", {
+								className: "min-w-0 flex-1 font-medium break-words",
+								children: K(e, u, s.labels)
+							}),
+							/* @__PURE__ */ M(a, {
+								variant: e.live ? "default" : "outline",
+								children: c(e.live ? "contentEditor.live" : e.state === "draft" ? "contentManager.draft" : "contentManager.scheduled")
+							}),
+							e.access && /* @__PURE__ */ M(a, {
+								variant: "secondary",
+								children: c(`contentEditor.level_${e.access.level}`)
+							}),
+							e.pages ? /* @__PURE__ */ M("span", {
+								className: "text-xs text-muted-foreground",
+								children: c("contentEditor.pageCount", { count: e.pages })
+							}) : null,
+							/* @__PURE__ */ M(n, {
+								type: "button",
+								size: "xs",
+								variant: "ghost",
+								"aria-expanded": _ === e.id,
+								onClick: () => v(_ === e.id ? null : e.id),
+								children: c(_ === e.id ? "contentEditor.close" : "contentEditor.edit")
+							})
+						]
+					}), _ === e.id && /* @__PURE__ */ M(X, {
+						content: i,
+						version: e,
+						model: d,
+						media: o,
+						...s
+					})]
+				})
+			}),
+			/* @__PURE__ */ M(p, { error: h.error }),
+			/* @__PURE__ */ M(Y, {
+				languages: b,
+				many: f?.versions.languages === "many",
+				pending: g.pending,
+				onAdd: (e) => void g.run(() => l.contents.addVersion(i.id, e))
+			}),
+			/* @__PURE__ */ M(p, { error: g.error })
+		]
+	});
+}
+function J({ languages: t, value: n, many: r, onChange: i }) {
+	let { t: a } = e(), o = C();
+	return r ? /* @__PURE__ */ N("fieldset", {
+		className: "flex flex-wrap gap-3",
+		children: [/* @__PURE__ */ M("legend", {
+			className: "sr-only",
+			children: a("contentEditor.versionLanguages")
+		}), t.map((e) => /* @__PURE__ */ N("label", {
+			className: "flex items-center gap-1.5",
+			children: [/* @__PURE__ */ M(h, {
+				size: "sm",
+				checked: n.includes(e),
+				onCheckedChange: (t) => i(t ? [...n, e] : n.filter((t) => t !== e)),
+				"aria-label": o(e)
+			}), o(e)]
+		}, e))]
+	}) : /* @__PURE__ */ N(c, {
+		value: n[0] ?? F,
+		onValueChange: (e) => i(e === F ? [] : [String(e)]),
+		children: [/* @__PURE__ */ M(d, {
+			size: "sm",
+			"aria-label": a("contentEditor.versionLanguage"),
+			children: /* @__PURE__ */ M(f, { children: (e) => e === F ? a("contentEditor.chooseLanguage") : o(e) })
+		}), /* @__PURE__ */ M(l, { children: t.map((e) => /* @__PURE__ */ M(u, {
+			value: e,
+			children: o(e)
+		}, e)) })]
+	});
+}
+function Y({ languages: t, many: r, pending: i, onAdd: a }) {
+	let { t: o } = e(), [s, c] = j([]);
+	return /* @__PURE__ */ N("div", {
+		className: "flex flex-wrap items-center gap-2",
+		"data-ckui": "add-version",
+		children: [/* @__PURE__ */ M(J, {
+			languages: t,
+			value: s,
+			many: r,
+			onChange: c
+		}), /* @__PURE__ */ M(n, {
+			type: "button",
+			size: "sm",
+			variant: "outline",
+			disabled: i || !s.length,
+			onClick: () => {
+				a({ languages: s }), c([]);
+			},
+			children: o("contentEditor.addVersion")
+		})]
+	});
+}
+function X({ content: r, version: a, model: c, media: l, ...u }) {
+	let { t: d } = e(), f = k(), _ = t(u.client), y = c?.kinds[r.kind], [b, S] = j(a.languages), [C, T] = j(a.traits), [E, D] = j(a.label ?? ""), [O, A] = j(a.state === "draft"), [P, F] = j(v(a.publish_at)), [I, L] = j(!!a.access), [R, z] = j(a.access ?? r.access), [V, H] = j(!1), G = m("content.save", u.onError), K = m("content.save", u.onError), q = m("offer.save", u.onError);
+	return /* @__PURE__ */ N("div", {
+		className: "grid gap-4 pt-2",
+		children: [
+			/* @__PURE__ */ N("form", {
+				className: "grid gap-3",
+				onSubmit: (e) => {
+					e.preventDefault(), H(!1), G.run(() => _.contents.updateVersion(r.id, a.id, {
+						languages: b,
+						traits: C,
+						label: E.trim(),
+						state: O ? "draft" : "published",
+						publish_at: g(P),
+						...I ? { access: W(R) } : { clear_access: !!a.access }
+					})).then((e) => e && H(!0));
+				},
+				children: [
+					/* @__PURE__ */ M(J, {
+						languages: c?.languages ?? [],
+						value: b,
+						many: y?.versions.languages === "many",
+						onChange: S
+					}),
+					!!y?.versions.traits?.length && /* @__PURE__ */ N("fieldset", {
+						className: "flex flex-wrap gap-3",
+						children: [/* @__PURE__ */ M("legend", {
+							className: "sr-only",
+							children: d("contentEditor.traits")
+						}), y.versions.traits.map((e) => /* @__PURE__ */ N("label", {
+							className: "flex items-center gap-1.5",
+							children: [/* @__PURE__ */ M(h, {
+								size: "sm",
+								checked: C.includes(e),
+								onCheckedChange: (t) => T(t ? [...C, e] : C.filter((t) => t !== e)),
+								"aria-label": x(u.labels, e)
+							}), x(u.labels, e)]
+						}, e))]
+					}),
+					/* @__PURE__ */ N("div", {
+						className: "grid gap-3 sm:grid-cols-2",
+						children: [/* @__PURE__ */ N("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ M(s, {
+								htmlFor: `${f}-label`,
+								children: d("contentEditor.versionLabel")
+							}), /* @__PURE__ */ M(o, {
+								id: `${f}-label`,
+								className: "h-8",
+								value: E,
+								onChange: (e) => D(e.target.value)
+							})]
+						}), /* @__PURE__ */ N("div", {
+							className: "grid gap-1.5",
+							children: [/* @__PURE__ */ M(s, {
+								htmlFor: `${f}-at`,
+								children: d("contentEditor.versionPublishAt")
+							}), /* @__PURE__ */ M(o, {
+								id: `${f}-at`,
+								className: "h-8",
+								type: "datetime-local",
+								value: P,
+								onChange: (e) => F(e.target.value)
+							})]
+						})]
+					}),
+					/* @__PURE__ */ N("label", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ M(h, {
+							size: "sm",
+							checked: O,
+							onCheckedChange: A
+						}), d("contentEditor.versionDraft")]
+					}),
+					/* @__PURE__ */ N("label", {
+						className: "flex items-center gap-2",
+						children: [/* @__PURE__ */ M(h, {
+							size: "sm",
+							checked: I,
+							onCheckedChange: L
+						}), d("contentEditor.ownAccess")]
+					}),
+					I && /* @__PURE__ */ M(U, {
+						value: R,
+						onChange: z,
+						model: c,
+						labels: u.labels,
+						client: _
+					}),
+					/* @__PURE__ */ M(p, { error: G.error }),
+					/* @__PURE__ */ N("div", {
+						className: "flex flex-wrap items-center gap-3",
+						children: [
+							/* @__PURE__ */ M(n, {
+								type: "submit",
+								size: "sm",
+								disabled: G.pending || !b.length,
+								children: G.pending ? d("common.saving") : d("common.save")
+							}),
+							/* @__PURE__ */ M(B, { show: V }),
+							/* @__PURE__ */ M(n, {
+								type: "button",
+								size: "sm",
+								variant: "destructive",
+								className: "ms-auto",
+								disabled: K.pending,
+								onClick: () => void K.run(() => _.contents.removeVersion(r.id, a.id)),
+								children: d("contentEditor.deleteVersion")
+							})
+						]
+					}),
+					/* @__PURE__ */ M(p, { error: K.error })
+				]
+			}),
+			/* @__PURE__ */ M(w, {
+				offer: a.offer,
+				pending: q.pending,
+				onSell: (e) => void q.run(() => _.offers.sell({
+					content: r.id,
+					version: a.id
+				}, e)),
+				onWithdraw: () => void q.run(() => _.offers.withdraw({
+					content: r.id,
+					version: a.id
+				}))
+			}),
+			/* @__PURE__ */ M(p, { error: q.error }),
+			y?.segments && /* @__PURE__ */ M(Z, {
+				content: r,
+				version: a,
+				...u
+			}),
+			l && /* @__PURE__ */ M(i, {
+				item: {
+					kind: r.kind,
+					id: r.id,
+					version: a.id
+				},
+				label: d("contentEditor.media")
+			})
+		]
+	});
+}
+function Z({ content: r, version: i, ...a }) {
+	let { t: s } = e(), c = t(a.client), l = () => i.segments.map((e) => ({
+		title: e.title ?? "",
+		start: String(e.start),
+		end: String(e.end),
+		release: v(e.release_at)
+	})), [u, d] = j(l);
+	O(() => d(l()), [JSON.stringify(i.segments)]);
+	let [f, h] = j(!1), _ = m("content.save", a.onError), y = (e, t) => {
+		h(!1), d((n) => n.map((n, r) => r === e ? {
+			...n,
+			...t
+		} : n));
+	}, b = u.every((e) => /^\d+$/.test(e.start) && /^\d+$/.test(e.end) && Number(e.end) > Number(e.start));
+	return /* @__PURE__ */ N("div", {
+		className: "grid gap-2",
+		"data-ckui": "segments-editor",
+		children: [
+			/* @__PURE__ */ M("h4", {
+				className: "text-sm font-medium",
+				children: s("contentEditor.segments")
+			}),
+			u.length === 0 && /* @__PURE__ */ M("p", {
+				className: "text-muted-foreground",
+				children: s("contentEditor.noSegments")
+			}),
+			u.map((e, t) => /* @__PURE__ */ N("div", {
+				className: "flex flex-wrap items-center gap-2",
+				"data-ckui": "segment-row",
+				children: [
+					/* @__PURE__ */ M("span", {
+						className: "w-6 text-xs text-muted-foreground tabular-nums",
+						children: t + 1
+					}),
+					/* @__PURE__ */ M(o, {
+						className: "h-8 w-40",
+						"aria-label": s("contentEditor.segmentTitle", { n: t + 1 }),
+						placeholder: s("contentEditor.segmentTitlePlaceholder"),
+						value: e.title,
+						onChange: (e) => y(t, { title: e.target.value })
+					}),
+					/* @__PURE__ */ M(o, {
+						className: "h-8 w-20",
+						type: "number",
+						min: 0,
+						"aria-label": s("contentEditor.segmentStart", { n: t + 1 }),
+						value: e.start,
+						onChange: (e) => y(t, { start: e.target.value })
+					}),
+					/* @__PURE__ */ M("span", {
+						"aria-hidden": !0,
+						children: "–"
+					}),
+					/* @__PURE__ */ M(o, {
+						className: "h-8 w-20",
+						type: "number",
+						min: 1,
+						"aria-label": s("contentEditor.segmentEnd", { n: t + 1 }),
+						value: e.end,
+						onChange: (e) => y(t, { end: e.target.value })
+					}),
+					/* @__PURE__ */ M(o, {
+						className: "h-8 w-48",
+						type: "datetime-local",
+						"aria-label": s("contentEditor.segmentRelease", { n: t + 1 }),
+						value: e.release,
+						onChange: (e) => y(t, { release: e.target.value })
+					}),
+					/* @__PURE__ */ M(n, {
+						type: "button",
+						size: "xs",
+						variant: "ghost",
+						onClick: () => d((e) => e.filter((e, n) => n !== t)),
+						children: s("common.remove")
+					})
+				]
+			}, t)),
+			/* @__PURE__ */ N("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [
+					/* @__PURE__ */ M(n, {
+						type: "button",
+						size: "sm",
+						variant: "outline",
+						onClick: () => {
+							let e = u.at(-1), t = e && Number(e.end) || 0;
+							d((e) => [...e, {
+								title: "",
+								start: String(t),
+								end: String(t + 1),
+								release: ""
+							}]);
+						},
+						children: s("contentEditor.addSegment")
+					}),
+					/* @__PURE__ */ M(n, {
+						type: "button",
+						size: "sm",
+						disabled: _.pending || !b,
+						onClick: () => {
+							h(!1);
+							let e = u.map((e, t) => ({
+								position: t + 1,
+								title: e.title.trim() || void 0,
+								start: Number(e.start),
+								end: Number(e.end),
+								release_at: g(e.release),
+								released: !1
+							}));
+							_.run(() => c.contents.setSegments(r.id, i.id, e)).then((e) => e && h(!0));
+						},
+						children: s("contentEditor.saveSegments")
+					}),
+					/* @__PURE__ */ M(B, { show: f })
+				]
+			}),
+			/* @__PURE__ */ M(p, { error: _.error })
+		]
+	});
+}
+function Q({ content: e, ...t }) {
+	let n = C(), r = A(() => e.versions.map((e) => ({
+		id: e.id,
+		label: K(e, n, t.labels)
+	})), [
+		e.versions,
+		n,
+		t.labels
+	]), { spec: i } = V(e.kind, t.client);
+	return /* @__PURE__ */ N("div", {
+		className: P("grid gap-6", t.className),
+		"data-ckui": "content-sections",
+		children: [
+			/* @__PURE__ */ M(H, {
+				content: e,
+				...t
+			}),
+			/* @__PURE__ */ M(G, {
+				content: e,
+				...t
+			}),
+			/* @__PURE__ */ M(q, {
+				content: e,
+				...t
+			}),
+			!!i?.groups?.length && /* @__PURE__ */ M("section", {
+				className: "grid gap-3 border-t border-border pt-4",
+				"data-ckui": "content-groups",
+				children: /* @__PURE__ */ M(D, {
+					content: e.id,
+					contentKind: e.kind,
+					versions: i.versions.hidden ? void 0 : r,
+					labels: t.labels,
+					client: t.client,
+					onError: t.onError
+				})
+			})
+		]
+	});
+}
+//#endregion
+export { G as AccessEditor, H as ContentDetailsEditor, Q as ContentSections, Z as SegmentsEditor, q as VersionsEditor, K as versionLabel };
+
+//# sourceMappingURL=editors.js.map