@openrails/contentkit-ui 0.85.1 → 0.86.0

package/dist/components/groups/banner.js

@@ -2,22 +2,22 @@ import { useMessages as e } from "../../i18n/context.js";
 import { ContentKitUiRoot as t } from "../../scope.js";
 import { ContentKitContext as n, useContentKitClient as r } from "../../react/context.js";
 import { decodeImage as i } from "../../client/image.js";
-import { Button as a } from "../../ui/button.js";
-import { ImageCropDialog as o } from "../image-crop-dialog.js";
-import { Badge as s } from "../../ui/badge.js";
-import { Skeleton as c } from "../../ui/skeleton.js";
-import { ErrorLine as l, contentError as u, useAction as d } from "../social/parts.js";
-import { useGroup as f } from "../../react/groups.js";
+import { useGroup as a } from "../../react/groups.js";
+import { Button as o } from "../../ui/button.js";
+import { ImageCropDialog as s } from "../image-crop-dialog.js";
+import { Badge as c } from "../../ui/badge.js";
+import { Skeleton as l } from "../../ui/skeleton.js";
+import { ErrorLine as u, contentError as d, useAction as f } from "../social/parts.js";
 import { GroupAvatar as p, GroupCover as m } from "./parts.js";
 import { priceLabel as h } from "../content/paywall.js";
 import { useContext as g, useRef as _, useState as v } from "react";
 import { jsx as y, jsxs as b } from "react/jsx-runtime";
 import { cn as x } from "cn";
 //#region src/components/groups/banner.tsx
-function S({ group: i, onCheckout: o, onSignIn: c, client: f, onError: p, className: m, appearance: _ }) {
-	let v = e(), { t: S } = v, C = r(f), w = g(n), T = d("membership.join", p), E = i.access;
+function S({ group: i, onCheckout: a, onSignIn: s, client: l, onError: p, className: m, appearance: _ }) {
+	let v = e(), { t: S } = v, C = r(l), w = g(n), T = f("membership.join", p), E = i.access;
 	if (!E || E.editor || !E.offer && !E.member && !E.unknown) return null;
-	let D = w?.viewer === null, O = c ?? w?.onSignIn, k = E.offer && Number(E.offer.terms.amount) > 0 ? E.offer : void 0;
+	let D = w?.viewer === null, O = s ?? w?.onSignIn, k = E.offer && Number(E.offer.terms.amount) > 0 ? E.offer : void 0;
 	return /* @__PURE__ */ b(t, {
 		appearance: _,
 		className: x("grid gap-2 rounded-lg border border-border p-3 text-sm", m),
@@ -28,7 +28,7 @@ function S({ group: i, onCheckout: o, onSignIn: c, client: f, onError: p, classN
 			children: S("membership.unknown")
 		}) : E.member ? /* @__PURE__ */ b("div", {
 			className: "flex flex-wrap items-center gap-2",
-			children: [/* @__PURE__ */ y(s, { children: S("membership.member") }), !k && /* @__PURE__ */ y(a, {
+			children: [/* @__PURE__ */ y(c, { children: S("membership.member") }), !k && /* @__PURE__ */ y(o, {
 				size: "sm",
 				variant: "ghost",
 				disabled: T.pending,
@@ -40,13 +40,13 @@ function S({ group: i, onCheckout: o, onSignIn: c, client: f, onError: p, classN
 			children: [/* @__PURE__ */ y("p", {
 				className: "text-muted-foreground",
 				children: S(k ? "membership.paidPitch" : "membership.freePitch")
-			}), /* @__PURE__ */ y(a, {
+			}), /* @__PURE__ */ y(o, {
 				size: "sm",
 				className: "justify-self-start",
-				disabled: T.pending || !!k && !o,
+				disabled: T.pending || !!k && !a,
 				onClick: () => {
 					if (D && O) return O();
-					if (k) return o?.({
+					if (k) return a?.({
 						key: E.key,
 						offer: k
 					});
@@ -54,69 +54,69 @@ function S({ group: i, onCheckout: o, onSignIn: c, client: f, onError: p, classN
 				},
 				children: k ? S("membership.joinFor", { price: h(v, k.terms) }) : S("membership.join")
 			})]
-		}), T.error && /* @__PURE__ */ y(l, { children: u(v, T.error) })]
+		}), T.error && /* @__PURE__ */ y(u, { children: d(v, T.error) })]
 	});
 }
 function C(n) {
-	let r = e(), i = f(n.group ? null : n.id, {
+	let r = e(), i = a(n.group ? null : n.id, {
 		language: n.language,
 		client: n.client
-	}), a = n.group ?? i.group;
-	if (!a) return i.error ? /* @__PURE__ */ y(l, { children: u(r, i.error) }) : /* @__PURE__ */ y(c, { className: "h-48 w-full" });
-	let o = a.text.find((e) => e.language === (n.language ?? a.name_language)) ?? a.text.find((e) => e.description), s = a.counts.filter((e) => e.language === (n.language ?? "")).reduce((e, t) => e + t.count, 0);
+	}), o = n.group ?? i.group;
+	if (!o) return i.error ? /* @__PURE__ */ y(u, { children: d(r, i.error) }) : /* @__PURE__ */ y(l, { className: "h-48 w-full" });
+	let s = o.text.find((e) => e.language === (n.language ?? o.name_language)) ?? o.text.find((e) => e.description), c = o.counts.filter((e) => e.language === (n.language ?? "")).reduce((e, t) => e + t.count, 0);
 	return /* @__PURE__ */ b(t, {
 		appearance: n.appearance,
 		className: x("grid gap-3 text-sm", n.className),
 		"data-ckui": "group-banner",
-		"data-kind": a.kind,
+		"data-kind": o.kind,
 		children: [
 			/* @__PURE__ */ y(m, {
-				group: a,
+				group: o,
 				className: "aspect-[3/1] w-full"
 			}),
 			/* @__PURE__ */ b("div", {
 				className: "flex flex-wrap items-end gap-4 px-2 sm:px-4",
 				children: [
 					/* @__PURE__ */ y(p, {
-						group: a,
+						group: o,
 						className: "-mt-12 size-20 border-4 border-background sm:-mt-16 sm:size-28"
 					}),
 					/* @__PURE__ */ b("div", {
 						className: "grid min-w-0 flex-1 gap-1",
 						children: [/* @__PURE__ */ y("h1", {
 							className: "text-xl font-semibold break-words",
-							children: a.name || a.slug
+							children: o.name || o.slug
 						}), /* @__PURE__ */ y("p", {
 							className: "text-xs text-muted-foreground tabular-nums",
-							children: r.plural("groups.items", s)
+							children: r.plural("groups.items", c)
 						})]
 					}),
 					/* @__PURE__ */ b("div", {
 						className: "flex flex-wrap items-start gap-2",
 						children: [/* @__PURE__ */ y(S, {
-							group: a,
+							group: o,
 							onCheckout: n.onCheckout,
 							client: n.client
 						}), n.children]
 					})
 				]
 			}),
-			o?.description && /* @__PURE__ */ y("p", {
+			s?.description && /* @__PURE__ */ y("p", {
 				className: "px-2 break-words whitespace-pre-line sm:px-4",
-				children: o.description
+				children: s.description
 			})
 		]
 	});
 }
-function w({ group: t, slot: n, crop: r = !0, client: s, onError: c, className: u }) {
-	let { t: h } = e(), g = f(t.id, { client: s }), S = _(null), C = d("group.save", c), [w, T] = v(null), [E, D] = v(null), O = g.group ?? t, k = n === "cover" ? !!O.cover?.image || !!O.cover?.content_id && !O.cover.auto : !!O.avatar?.image, A = (e, t) => C.run(() => g.uploadImage(n, e, {
+function w({ group: t, slot: n, crop: r = !0, client: c, onError: l, className: d }) {
+	let { t: h } = e(), g = a(t.id, { client: c }), S = _(null), C = f("group.save", l), [w, T] = v(null), [E, D] = v(null), O = g.group ?? t, k = n === "cover" ? !!O.cover?.image || !!O.cover?.content_id && !O.cover.auto : !!O.avatar?.image, A = (e, t) => C.run(() => g.uploadImage(n, e, {
 		wait: !1,
 		edit: t
 	})), j = () => {
 		w?.revoke?.(), T(null), D(null);
 	};
 	return /* @__PURE__ */ b("div", {
-		className: x("flex flex-wrap items-center gap-3", u),
+		className: x("flex flex-wrap items-center gap-3", d),
 		"data-ckui": "group-image-editor",
 		"data-slot": n,
 		children: [
@@ -134,14 +134,14 @@ function w({ group: t, slot: n, crop: r = !0, client: s, onError: c, className:
 				children: [
 					/* @__PURE__ */ b("div", {
 						className: "flex flex-wrap gap-2",
-						children: [/* @__PURE__ */ y(a, {
+						children: [/* @__PURE__ */ y(o, {
 							type: "button",
 							size: "sm",
 							variant: "outline",
 							disabled: C.pending,
 							onClick: () => S.current?.click(),
 							children: C.pending ? h("groupEditor.uploading") : h(n === "avatar" ? "groupEditor.uploadAvatar" : "groupEditor.uploadCover")
-						}), k && /* @__PURE__ */ y(a, {
+						}), k && /* @__PURE__ */ y(o, {
 							type: "button",
 							size: "sm",
 							variant: "ghost",
@@ -166,10 +166,10 @@ function w({ group: t, slot: n, crop: r = !0, client: s, onError: c, className:
 							}
 						}
 					}),
-					/* @__PURE__ */ y(l, { error: C.error })
+					/* @__PURE__ */ y(u, { error: C.error })
 				]
 			}),
-			/* @__PURE__ */ y(o, {
+			/* @__PURE__ */ y(s, {
 				open: !!w,
 				onOpenChange: (e) => !e && j(),
 				source: w,

package/dist/components/groups/directory.js

@@ -1,17 +1,17 @@
 import { useMessages as e } from "../../i18n/context.js";
 import { ContentKitUiRoot as t } from "../../scope.js";
-import { Button as n } from "../../ui/button.js";
-import { Skeleton as r } from "../../ui/skeleton.js";
-import { contentError as i } from "../social/parts.js";
-import { LETTERS as a } from "../../client/group-fields.js";
-import { useGroups as o } from "../../react/groups.js";
+import { useGroups as n } from "../../react/groups.js";
+import { Button as r } from "../../ui/button.js";
+import { Skeleton as i } from "../../ui/skeleton.js";
+import { contentError as a } from "../social/parts.js";
+import { LETTERS as o } from "../../client/group-fields.js";
 import { GroupCover as s, GroupLink as c } from "./parts.js";
 import { useState as l } from "react";
 import { jsx as u, jsxs as d } from "react/jsx-runtime";
 import { cn as f } from "cn";
 //#region src/components/groups/directory.tsx
 function p(p) {
-	let m = e(), { t: h } = m, [g, _] = l(null), v = p.letter === void 0 ? g : p.letter, y = (e) => p.onLetterChange ? p.onLetterChange(e) : _(e), b = o({
+	let m = e(), { t: h } = m, [g, _] = l(null), v = p.letter === void 0 ? g : p.letter, y = (e) => p.onLetterChange ? p.onLetterChange(e) : _(e), b = n({
 		kind: p.kind,
 		language: p.language,
 		contentKind: p.contentKind,
@@ -31,7 +31,7 @@ function p(p) {
 				"aria-label": h("groups.byLetter"),
 				className: "flex flex-wrap gap-1",
 				"data-ckui": "letters",
-				children: [null, ...a].map((e) => /* @__PURE__ */ u(n, {
+				children: [null, ...o].map((e) => /* @__PURE__ */ u(r, {
 					size: "xs",
 					variant: v === e ? "default" : "ghost",
 					"aria-pressed": v === e,
@@ -44,14 +44,14 @@ function p(p) {
 			b.loading && !b.items.length ? /* @__PURE__ */ u("div", {
 				className: x ? "grid grid-cols-[repeat(auto-fill,minmax(9rem,1fr))] gap-3" : "grid gap-2",
 				"aria-busy": !0,
-				children: Array.from({ length: 6 }, (e, t) => /* @__PURE__ */ u(r, { className: x ? "aspect-[3/4] w-full" : "h-6 w-48" }, t))
+				children: Array.from({ length: 6 }, (e, t) => /* @__PURE__ */ u(i, { className: x ? "aspect-[3/4] w-full" : "h-6 w-48" }, t))
 			}) : b.error && !b.items.length ? /* @__PURE__ */ d("div", {
 				role: "alert",
 				className: "grid justify-items-start gap-2",
 				children: [/* @__PURE__ */ u("p", {
 					className: "text-destructive",
-					children: i(m, b.error)
-				}), /* @__PURE__ */ u(n, {
+					children: a(m, b.error)
+				}), /* @__PURE__ */ u(r, {
 					size: "sm",
 					variant: "outline",
 					onClick: b.reload,
@@ -100,7 +100,7 @@ function p(p) {
 				role: "status",
 				children: h("groups.empty")
 			}),
-			b.hasMore && /* @__PURE__ */ u(n, {
+			b.hasMore && /* @__PURE__ */ u(r, {
 				variant: "outline",
 				size: "sm",
 				className: "justify-self-center",