admin-ui-starter-kit 0.1.0 → 0.1.2

package/dist/_shared/comments-CvmS7zG3.js

@@ -0,0 +1,945 @@
+import { a as e, i as t, l as n } from "./ui-provider-4qKSKMPd.js";
+import { cn as r } from "../lib/utils.js";
+import { t as i } from "./text-DIxMTECE.js";
+import { t as a } from "./heading-BprqyzDs.js";
+import { t as o } from "./badge-BVCh_hfL.js";
+import { t as s } from "./button-ChCkwoOD.js";
+import { i as c, n as l, r as u, t as d } from "./tooltip-Cws4BiPT.js";
+import { t as f } from "./smart-card-MT6JjkoI.js";
+import { n as p, s as m } from "./popover-CgRGcFk9.js";
+import { o as h, r as g, t as _ } from "./avatar-CpBz9pTv.js";
+import { t as v } from "./rich-text-editor-0uoIoYXU.js";
+import { n as y, o as b, r as x, t as ee, u as S } from "./mentions-CS3rIhze.js";
+import { Fragment as C, createElement as w, forwardRef as T, memo as E, useCallback as D, useEffect as O, useImperativeHandle as te, useMemo as k, useRef as A, useState as j } from "react";
+import { formatDistanceToNow as M } from "date-fns";
+import { Fragment as N, jsx as P, jsxs as F } from "react/jsx-runtime";
+import { AtSign as I, CornerDownRight as L, File as R, FileText as z, Image as B, Loader2 as V, MessageCircle as H, Paperclip as U, Pencil as W, Pin as G, Send as ne, Smile as re, Trash2 as ie, X as K } from "lucide-react";
+//#region src/components/features/comments/comments.strings.ts
+var q = {
+	title: "Comments",
+	subtitle: "",
+	empty: "No comments yet.",
+	emptyHint: "Start the conversation — your team will see it instantly.",
+	composerPlaceholder: "Write a comment…",
+	composerSubmit: "Post comment",
+	composerSubmitting: "Posting…",
+	composerSave: "Save changes",
+	invalidContent: "Comment cannot be empty.",
+	composerCancel: "Cancel",
+	composerEditingEyebrow: "Editing comment",
+	composerReplyingEyebrow: "Replying to {{name}}",
+	composerAttachmentLabel: "Attach file",
+	composerReferenceLabel: "Mention or link",
+	composerReferenceMenuTitle: "Insert reference",
+	composerReferenceSearchPlaceholder: "Search…",
+	composerReferenceEmpty: "No matches.",
+	composerReferenceLoading: "Searching…",
+	fallbackAuthor: "Anonymous",
+	pinned: "Pinned",
+	edited: "edited",
+	deleteLabel: "Delete",
+	editLabel: "Edit",
+	replyLabel: "Reply",
+	pinLabel: "Pin",
+	unpinLabel: "Unpin",
+	moreActionsLabel: "More actions",
+	confirmDeleteLabel: "Delete comment",
+	attachmentFallback: "Attachment",
+	attachmentRemoveLabel: "Remove attachment",
+	attachmentUploadingLabel: "Uploading…",
+	attachmentFailedLabel: "Upload failed",
+	attachmentTooLargeError: "File is too large.",
+	attachmentTooManyError: "Too many attachments.",
+	attachmentRetryLabel: "Retry",
+	attachmentDownloadLabel: "Download",
+	addReactionLabel: "Add reaction",
+	showRepliesLabel: "Show replies",
+	hideRepliesLabel: "Hide replies"
+};
+function J(e, t) {
+	return e.replace(/\{\{(\w+)\}\}/g, (e, n) => {
+		let r = t[n];
+		return r == null ? "" : String(r);
+	});
+}
+//#endregion
+//#region src/components/features/comments/comments-provider.tsx
+function Y(e) {
+	return k(() => ({
+		...q,
+		...e ?? {}
+	}), [e]);
+}
+function ae(t) {
+	let r = n(), i = e();
+	return k(() => ({
+		getMediaUrl: t?.getMediaUrl ?? ((e) => r.resolveUrl?.(e ?? {})),
+		getMediaName: t?.getMediaName ?? ((e) => r.resolveName?.(e ?? {})),
+		getStatusLabel: t?.getStatusLabel,
+		formatRelativeTime: t?.formatRelativeTime ?? i.formatRelativeTime
+	}), [
+		t,
+		r,
+		i.formatRelativeTime
+	]);
+}
+//#endregion
+//#region src/components/features/comments/partials/comment-attachment-chip.tsx
+function oe(e) {
+	return typeof e != "number" || e <= 0 ? null : e < 1024 ? `${e} B` : e < 1024 * 1024 ? `${(e / 1024).toFixed(1)} KB` : `${(e / (1024 * 1024)).toFixed(1)} MB`;
+}
+function se(e) {
+	return e.mimeType?.startsWith("image/") ? B : e.mimeType === "application/pdf" || e.mimeType?.startsWith("text/") ? z : e.mimeType ? R : U;
+}
+var ce = ({ attachment: e, editable: t = !1, onRemove: n, onRetry: a, accessors: o, strings: s, compact: c = !1, className: l }) => {
+	let u = {
+		...q,
+		...s
+	}, d = o?.getMediaUrl?.(e) ?? e.url, f = o?.getMediaName?.(e) ?? e.name ?? u.attachmentFallback, p = se(e), m = e.status === "uploading", h = e.status === "failed", g = oe(e.size), _ = m ? u.attachmentUploadingLabel + (typeof e.progress == "number" ? ` ${Math.round(e.progress)}%` : "") : h ? e.error ?? u.attachmentFailedLabel : g, v = r("relative inline-flex min-w-0 max-w-[20rem] items-center gap-1.5 rounded-md", "ring-1 ring-inset transition-colors", c ? "px-2 py-1 text-xs" : "px-2.5 py-1 text-xs", h ? "bg-destructive/[0.04] ring-destructive/30 hover:bg-destructive/[0.08]" : "bg-foreground/[0.03] ring-border/60 hover:bg-foreground/[0.06]", l), y = m ? /* @__PURE__ */ P(V, {
+		className: r("shrink-0 animate-spin text-muted-foreground", "size-3.5"),
+		"aria-hidden": !0
+	}) : /* @__PURE__ */ P(p, {
+		className: r("shrink-0", "size-3.5", h ? "text-destructive" : "text-muted-foreground"),
+		"aria-hidden": !0
+	}), b = /* @__PURE__ */ F("span", {
+		className: "inline-flex min-w-0 items-baseline gap-1.5",
+		children: [/* @__PURE__ */ P(i, {
+			tag: "span",
+			size: "xs",
+			weight: "medium",
+			className: r("truncate", h && "text-destructive"),
+			children: f
+		}), _ ? /* @__PURE__ */ P(i, {
+			tag: "span",
+			size: "xxs",
+			type: "secondary",
+			className: "shrink-0 tabular-nums",
+			children: _
+		}) : null]
+	});
+	return /* @__PURE__ */ F("div", {
+		className: v,
+		children: [
+			y,
+			d && !m && !h ? /* @__PURE__ */ P("a", {
+				href: d,
+				target: "_blank",
+				rel: "noreferrer noopener",
+				className: "inline-flex min-w-0 flex-1 items-baseline gap-1.5 hover:underline",
+				"aria-label": u.attachmentDownloadLabel,
+				children: b
+			}) : b,
+			m && typeof e.progress == "number" && /* @__PURE__ */ P("div", {
+				className: "bg-primary/15 absolute bottom-0 left-2 right-2 h-px overflow-hidden rounded-full",
+				children: /* @__PURE__ */ P("div", {
+					className: "bg-primary h-full transition-[width]",
+					style: { width: `${Math.min(100, Math.max(0, e.progress))}%` }
+				})
+			}),
+			h && a && /* @__PURE__ */ P("button", {
+				type: "button",
+				onClick: () => a(e.id),
+				className: "text-destructive ring-destructive/30 hover:ring-destructive/60 shrink-0 rounded px-1.5 py-px text-xxs font-medium ring-1 ring-inset transition-colors",
+				children: u.attachmentRetryLabel
+			}),
+			t && n && /* @__PURE__ */ P("button", {
+				type: "button",
+				onClick: () => n(e.id),
+				className: "text-muted-foreground hover:bg-foreground/10 hover:text-foreground -mr-0.5 inline-flex size-4 shrink-0 items-center justify-center rounded transition-colors focus-visible:ring-2 focus-visible:ring-ring/40",
+				"aria-label": u.attachmentRemoveLabel,
+				title: u.attachmentRemoveLabel,
+				children: /* @__PURE__ */ P(K, { className: "size-3" })
+			})
+		]
+	});
+};
+//#endregion
+//#region src/components/features/comments/hooks/use-attachment-upload.ts
+function le(e = {}) {
+	let { onUpload: t, maxSize: n, maxFiles: r, disabled: i, initialAttachments: a, onChange: o, onError: s } = e, [c, l] = j(() => a ? [...a] : []), u = A(/* @__PURE__ */ new Map()), d = A(/* @__PURE__ */ new Map()), f = A(o);
+	f.current = o;
+	let p = D((e, t) => {
+		l((n) => n.map((n) => n.id === e ? {
+			...n,
+			...t
+		} : n));
+	}, []), m = D((e) => {
+		l([...e]);
+	}, []), h = D((e, n) => {
+		if (!t) return;
+		let r = new AbortController();
+		u.current.set(e, { controller: r }), p(e, {
+			status: "uploading",
+			progress: 0,
+			error: void 0
+		}), t({
+			file: n,
+			onProgress: (t) => {
+				p(e, { progress: t });
+			},
+			signal: r.signal
+		}).then((t) => {
+			u.current.delete(e), p(e, {
+				...t,
+				id: e,
+				status: "uploaded",
+				progress: 100,
+				error: void 0
+			});
+		}).catch((t) => {
+			if (u.current.delete(e), r.signal.aborted) return;
+			let n = t instanceof Error ? t.message : "Upload failed";
+			p(e, {
+				status: "failed",
+				error: n
+			}), s?.(n);
+		});
+	}, [
+		s,
+		t,
+		p
+	]), g = D((e) => {
+		if (i || !t) return;
+		let a = Array.from(e);
+		a.length !== 0 && l((e) => {
+			let t = [...e];
+			for (let e of a) {
+				if (typeof r == "number" && t.length >= r) {
+					s?.("Too many attachments.");
+					break;
+				}
+				if (typeof n == "number" && e.size > n) {
+					s?.("File is too large.");
+					continue;
+				}
+				let i = typeof crypto < "u" && "randomUUID" in crypto ? crypto.randomUUID() : `att-${Date.now()}-${Math.random().toString(36).slice(2)}`;
+				d.current.set(i, e), t.push({
+					id: i,
+					name: e.name,
+					size: e.size,
+					mimeType: e.type,
+					status: "uploading",
+					progress: 0
+				}), queueMicrotask(() => h(i, e));
+			}
+			return t;
+		});
+	}, [
+		h,
+		i,
+		r,
+		n,
+		s,
+		t
+	]), _ = D((e) => {
+		let t = u.current.get(e);
+		t && (t.controller.abort(), u.current.delete(e)), d.current.delete(e), l((t) => t.filter((t) => t.id !== e));
+	}, []), v = D((e) => {
+		let t = d.current.get(e);
+		t && h(e, t);
+	}, [h]), y = D(() => {
+		for (let e of u.current.values()) e.controller.abort();
+		u.current.clear(), d.current.clear(), l([]);
+	}, []);
+	return O(() => {
+		f.current?.(c);
+	}, [c]), O(() => {
+		let e = u.current;
+		return () => {
+			for (let t of e.values()) t.controller.abort();
+		};
+	}, []), {
+		attachments: c,
+		uploadedAttachments: k(() => c.filter((e) => e.status === "uploaded" || !e.status), [c]),
+		isUploading: k(() => c.some((e) => e.status === "uploading"), [c]),
+		addFiles: g,
+		removeAttachment: _,
+		retryAttachment: v,
+		setAttachments: m,
+		reset: y
+	};
+}
+//#endregion
+//#region src/components/features/comments/partials/comment-composer.tsx
+function ue(e) {
+	return !e || typeof e != "string" ? !1 : e.replace(/<[^>]*>/g, "").trim().length > 0;
+}
+var X = T(function({ context: e, canComment: t = !0, isSubmitting: n = !1, errors: r, resetKey: a = 0, onSubmit: o, onCancel: c, editingComment: l, strings: u, resources: d, onResourceSearch: f, attachments: h, initialValues: g, autoFocus: _ = !1, inlineSubmit: b = !0, placeholder: C }, w) {
+	let T = Y(u), E = d, D = f, M = h, N = A(null), [L, R] = j(() => g?.content ?? l?.content ?? ""), [z, B] = j(null), H = S({
+		resources: E,
+		onResourceSearch: D,
+		editorRef: N,
+		initialMentions: g?.references ?? l?.references
+	}), W = le({
+		...M,
+		initialAttachments: g?.attachments ?? void 0
+	});
+	te(w, () => ({
+		focus: () => N.current?.focus(),
+		clear: () => {
+			N.current?.clear(), H.reset(), W.reset(), B(null);
+		},
+		setBody: (e) => {
+			N.current?.setHTML(e);
+		}
+	}), [W, H]), O(() => {
+		N.current?.setHTML(g?.content ?? ""), H.setMentions(g?.references ?? []), W.setAttachments(g?.attachments ?? []), B(null);
+	}, [
+		e.id,
+		e.type,
+		a
+	]), O(() => {
+		if (!l) return;
+		N.current?.setHTML(l.content ?? ""), H.setMentions(l.references ?? []);
+		let e = (l.attachments ?? l.media ?? []).filter((e) => !!e);
+		W.setAttachments(e);
+	}, [l?.id]), O(() => {
+		r?.content && B(r.content);
+	}, [r]);
+	let G = (t) => {
+		t?.preventDefault();
+		let n = N.current?.getHTML() ?? L;
+		if (!ue(n)) {
+			B(T.invalidContent);
+			return;
+		}
+		B(null), o({
+			content: n,
+			commentableId: e.id,
+			commentableType: e.type,
+			contentType: "html",
+			references: H.mentions,
+			attachments: W.uploadedAttachments,
+			editingId: l?.id
+		});
+	}, re = A(null), ie = () => re.current?.click(), K = (e) => {
+		e && W.addFiles(e);
+	}, q = W.attachments.length > 0, J = !!l, ae = n ? T.composerSubmitting : J ? T.composerSave : T.composerSubmit, oe = J ? /* @__PURE__ */ P(de, {
+		label: T.composerEditingEyebrow,
+		closeLabel: T.composerCancel,
+		onClose: c
+	}) : null, se = k(() => {
+		let e = [];
+		return E && Object.keys(E).length > 0 && e.push({
+			id: "reference",
+			icon: I,
+			label: T.composerReferenceLabel,
+			onClick: () => H.setPickerOpen(!0)
+		}), M?.onUpload && !M.disabled && e.push({
+			id: "attachment",
+			icon: U,
+			label: T.composerAttachmentLabel,
+			onClick: ie
+		}), e;
+	}, [
+		E,
+		M?.onUpload,
+		M?.disabled,
+		T.composerReferenceLabel,
+		T.composerAttachmentLabel
+	]);
+	if (!t) return null;
+	let X = /* @__PURE__ */ P(s, {
+		type: "button",
+		onClick: () => G(),
+		disabled: n || W.isUploading,
+		icon: n ? V : ne,
+		children: ae
+	}), fe = J || c ? /* @__PURE__ */ P(s, {
+		type: "button",
+		variant: "secondary",
+		buttonStyle: "ghost",
+		onClick: c,
+		disabled: n,
+		children: T.composerCancel
+	}) : null, Z = q ? /* @__PURE__ */ P("div", {
+		className: "flex flex-wrap items-center gap-1.5",
+		children: W.attachments.map((e) => /* @__PURE__ */ P(ce, {
+			attachment: e,
+			editable: !0,
+			onRemove: W.removeAttachment,
+			onRetry: W.retryAttachment,
+			strings: u
+		}, e.id))
+	}) : null, pe = q ? Z : null, Q = b === !1 ? null : X, me = b === !1 || J;
+	return /* @__PURE__ */ F("form", {
+		onSubmit: G,
+		className: "space-y-2",
+		children: [
+			oe,
+			/* @__PURE__ */ P("input", {
+				ref: re,
+				type: "file",
+				multiple: !0,
+				hidden: !0,
+				accept: M?.accept,
+				onChange: (e) => {
+					K(e.target.files), e.target.value = "";
+				}
+			}),
+			!H.triggerActive && /* @__PURE__ */ F(p, {
+				open: H.pickerOpen,
+				onOpenChange: H.setPickerOpen,
+				children: [/* @__PURE__ */ P(m, {
+					render: /* @__PURE__ */ P("button", {
+						type: "button",
+						className: "sr-only",
+						tabIndex: -1
+					}),
+					children: T.composerReferenceLabel
+				}), /* @__PURE__ */ P(x, {
+					open: H.pickerOpen,
+					activeKind: H.activeKind,
+					setActiveKind: H.setActiveKind,
+					kinds: H.kinds,
+					resources: E,
+					query: H.query,
+					setQuery: H.setQuery,
+					suggestions: H.suggestions,
+					isLoading: H.isLoading,
+					onSelect: H.pickSuggestion,
+					strings: {
+						title: T.composerReferenceMenuTitle,
+						searchPlaceholder: T.composerReferenceSearchPlaceholder,
+						empty: T.composerReferenceEmpty,
+						loading: T.composerReferenceLoading
+					}
+				})]
+			}),
+			/* @__PURE__ */ F("div", {
+				className: "relative",
+				children: [/* @__PURE__ */ P(v, {
+					ref: N,
+					value: L,
+					onChange: (e) => {
+						R(e);
+						let t = ee(e), n = H.mentions;
+						if (n.map((e) => e.id).join("|") !== t.map((e) => e.id).join("|")) {
+							let e = new Map(n.map((e) => [e.id, e])), r = t.map((t) => e.get(t.id) ?? t);
+							H.setMentions(r);
+						}
+					},
+					placeholder: C ?? T.composerPlaceholder,
+					minHeight: "3rem",
+					autoFocus: _ || J,
+					extraToolbarItems: se,
+					toolbarTrailing: Q,
+					footerSlot: pe,
+					onCaretChange: H.handleCaretChange
+				}), /* @__PURE__ */ P(y, {
+					open: H.triggerActive && H.pickerOpen,
+					activeKind: H.activeKind,
+					setActiveKind: H.setActiveKind,
+					onManualKindChange: () => H.setManualKindOverride(!0),
+					kinds: H.kinds,
+					resources: E,
+					query: H.query,
+					suggestions: H.suggestions,
+					suggestionsByKind: H.suggestionsByKind,
+					isLoading: H.isLoading,
+					onSelect: H.pickSuggestion,
+					strings: {
+						title: T.composerReferenceMenuTitle,
+						empty: T.composerReferenceEmpty,
+						loading: T.composerReferenceLoading
+					}
+				})]
+			}),
+			z && /* @__PURE__ */ P(i, {
+				size: "xs",
+				type: "error",
+				children: z
+			}),
+			me && /* @__PURE__ */ F("div", {
+				className: "flex items-center justify-end gap-2",
+				children: [fe, X]
+			})
+		]
+	});
+});
+function de({ label: e, closeLabel: t, onClose: n }) {
+	return /* @__PURE__ */ F("div", {
+		className: "bg-muted/40 ring-border/60 flex items-center justify-between rounded px-2.5 py-1.5 ring-1 ring-inset",
+		children: [/* @__PURE__ */ P(i, {
+			size: "xxs",
+			type: "secondary",
+			weight: "medium",
+			className: "uppercase tracking-wide",
+			children: e
+		}), n ? /* @__PURE__ */ P("button", {
+			type: "button",
+			onClick: n,
+			className: "text-muted-foreground hover:text-foreground inline-flex size-4 items-center justify-center rounded transition-colors",
+			"aria-label": t,
+			children: /* @__PURE__ */ P(K, { className: "size-3" })
+		}) : null]
+	});
+}
+function fe(e, t) {
+	return J(e, { name: t ?? "" });
+}
+//#endregion
+//#region src/components/features/comments/partials/comment-empty.tsx
+var Z = ({ strings: e, icon: t, className: n }) => {
+	let a = Y(e);
+	return /* @__PURE__ */ F("div", {
+		className: r("flex flex-col items-center justify-center py-8 text-center", n),
+		children: [
+			/* @__PURE__ */ P("div", {
+				className: "bg-muted/50 mb-3 flex h-12 w-12 items-center justify-center rounded-full",
+				children: t ?? /* @__PURE__ */ P(H, { className: "text-muted-foreground/60 h-5 w-5" })
+			}),
+			/* @__PURE__ */ P(i, {
+				weight: "medium",
+				children: a.empty
+			}),
+			a.emptyHint ? /* @__PURE__ */ P(i, {
+				size: "xs",
+				type: "secondary",
+				className: "mt-1 max-w-[28ch]",
+				children: a.emptyHint
+			}) : null
+		]
+	});
+};
+//#endregion
+//#region src/components/features/comments/partials/comment-content.tsx
+function pe(e) {
+	return /* @__PURE__ */ P(Q, { comment: e });
+}
+function Q(e) {
+	let { comment: t, resources: n, renderReference: r, sanitizer: a } = e, o = t.contentType ?? t.content_type ?? "text";
+	return o === "rich" ? me(t.content) : o === "html" ? /* @__PURE__ */ P(b, {
+		html: t.content ?? "",
+		mentions: t.references,
+		resources: n,
+		renderMention: r,
+		sanitizer: a
+	}) : /* @__PURE__ */ P(i, {
+		className: "whitespace-pre-line",
+		children: ge(t.content ?? "")
+	});
+}
+function me(e) {
+	if (!e) return null;
+	try {
+		let t = JSON.parse(e);
+		return !t || !Array.isArray(t.blocks) || t.blocks.length === 0 ? null : /* @__PURE__ */ P("div", {
+			className: "prose prose-sm prose-p:my-0.5 prose-headings:my-1 prose-a:text-primary prose-a:no-underline hover:prose-a:underline max-w-none space-y-1",
+			children: t.blocks.map((e, t) => /* @__PURE__ */ P(C, { children: he(e) }, e.id ?? `${e.type}-${t}`))
+		});
+	} catch {
+		return /* @__PURE__ */ P(i, {
+			className: "whitespace-pre-line",
+			children: ge(e)
+		});
+	}
+}
+function he(e) {
+	let t = e.data ?? {};
+	switch (e.type) {
+		case "paragraph": {
+			let e = String(t.text ?? "").trim();
+			return e ? /* @__PURE__ */ P(i, {
+				asHTML: !0,
+				content: e
+			}) : null;
+		}
+		case "header": {
+			let e = $(String(t.text ?? "")), n = Number(t.level ?? 3);
+			return e ? w(a, { tag: `h${Math.min(Math.max(n, 1), 6)}` }, e) : null;
+		}
+		case "list": {
+			let e = (Array.isArray(t.items) ? t.items : []).map((e) => $(String(e ?? ""))).filter((e) => e.length > 0);
+			return e.length === 0 ? null : t.style === "ordered" ? /* @__PURE__ */ P("ol", {
+				className: "ml-6 list-decimal space-y-1 text-sm",
+				children: e.map((e, t) => /* @__PURE__ */ P("li", { children: e }, `${e}-${t}`))
+			}) : /* @__PURE__ */ P("ul", {
+				className: "ml-6 list-disc space-y-1 text-sm",
+				children: e.map((e) => /* @__PURE__ */ P("li", { children: e }, e))
+			});
+		}
+		case "quote": {
+			let e = String(t.text ?? "").trim();
+			if (!e) return null;
+			let n = $(String(t.caption ?? ""));
+			return /* @__PURE__ */ F("blockquote", {
+				className: "border-muted text-muted-foreground border-l-2 pl-3 text-sm italic",
+				children: [/* @__PURE__ */ P(i, {
+					asHTML: !0,
+					content: e
+				}), n.length > 0 && /* @__PURE__ */ F("cite", {
+					className: "text-muted-foreground/80 mt-1 block text-xs not-italic",
+					children: ["— ", n]
+				})]
+			});
+		}
+		case "delimiter": return /* @__PURE__ */ P("div", {
+			className: "border-muted my-4 border-b border-dashed",
+			"aria-hidden": "true"
+		});
+		default: {
+			let e = $(String(t.text ?? ""));
+			return e ? /* @__PURE__ */ P(i, {
+				className: "whitespace-pre-line",
+				children: e
+			}) : null;
+		}
+	}
+}
+function $(e) {
+	return e.replace(/<[^>]*>/g, "").trim();
+}
+function ge(e) {
+	if (typeof e != "string") return "";
+	let t = e.trim();
+	if (t === "") return "";
+	if (t.startsWith("{") || t.startsWith("[")) return t;
+	try {
+		let e = JSON.parse(t);
+		if (typeof e == "string") return e;
+	} catch {}
+	return t.startsWith("\"") && t.endsWith("\"") ? t.slice(1, -1) : t;
+}
+//#endregion
+//#region src/components/features/comments/partials/comment-item.tsx
+var _e = "?", ve = (e) => e?.url, ye = (e) => e?.name, be = (e) => e.charAt(0).toUpperCase() + e.slice(1).replace(/_/g, " "), xe = (e) => {
+	try {
+		return M(new Date(e), { addSuffix: !0 });
+	} catch {
+		return "—";
+	}
+}, Se = E(function({ comment: e, canModerate: t, onDelete: n, onPinToggle: a, onReact: f, onReply: p, strings: m, getMediaUrl: v, getMediaName: y, getStatusLabel: b, formatRelativeTime: x, resources: ee, renderAttachment: S, renderReference: C }) {
+	let w = Y(m), T = ae({
+		getMediaUrl: v,
+		getMediaName: y,
+		getStatusLabel: b,
+		formatRelativeTime: x
+	}), E = T.getMediaUrl ?? ve, D = T.getMediaName ?? ye, O = T.getStatusLabel ?? be, te = T.formatRelativeTime ?? xe, A = e.user?.name ?? w.fallbackAuthor, j = e.user?.avatar ?? void 0, M = k(() => e.createdAt ? te(e.createdAt) : "—", [e.createdAt, te]), N = k(() => {
+		if (!A) return _e;
+		let e = A.trim();
+		return e === "" ? _e : e.charAt(0).toUpperCase();
+	}, [A]), I = k(() => Array.isArray(e.tagsArray) ? e.tagsArray.filter((e) => typeof e == "string") : e.tagsArray && typeof e.tagsArray == "object" ? Object.values(e.tagsArray).filter((e) => typeof e == "string") : [], [e.tagsArray]), R = k(() => (e.attachments ?? e.media ?? []).filter((e) => !!e && typeof e == "object"), [e.attachments, e.media]), z = e.reactions ?? [], B = e.isPinned === !0, V = e.isEdited === !0, H = e.status && e.status !== "active", U = H && e.status ? O(e.status) : null, ne = e.canDelete === !0 || t === !0, K = e.canEdit === !0 || t === !0, q = R.length > 0;
+	return /* @__PURE__ */ P("article", {
+		className: r("group relative overflow-hidden rounded-lg border transition-colors", "border-border/60 bg-card hover:bg-muted/30 px-3 py-2.5"),
+		"data-comment-id": e.id,
+		children: /* @__PURE__ */ F("div", {
+			className: "flex items-start gap-3",
+			children: [
+				/* @__PURE__ */ F(_, {
+					className: "mt-0.5 h-8 w-8 shrink-0",
+					children: [!!j && /* @__PURE__ */ P(h, {
+						src: j,
+						alt: A
+					}), /* @__PURE__ */ P(g, {
+						className: "bg-muted text-muted-foreground text-xs font-medium",
+						children: N
+					})]
+				}),
+				/* @__PURE__ */ F("div", {
+					className: "min-w-0 flex-1",
+					children: [
+						/* @__PURE__ */ F("div", {
+							className: "flex min-w-0 items-baseline gap-2",
+							children: [
+								/* @__PURE__ */ P(i, {
+									tag: "span",
+									weight: "semibold",
+									className: "truncate",
+									children: A
+								}),
+								!!B && /* @__PURE__ */ P(u, {
+									delayDuration: 0,
+									children: /* @__PURE__ */ F(d, { children: [/* @__PURE__ */ P(c, {
+										render: /* @__PURE__ */ P("span", { className: "inline-flex shrink-0 self-center" }),
+										children: /* @__PURE__ */ P(G, {
+											className: "text-warning size-3",
+											"aria-hidden": !0
+										})
+									}), /* @__PURE__ */ P(l, {
+										side: "top",
+										className: "text-xs",
+										children: w.pinned
+									})] })
+								}),
+								/* @__PURE__ */ P(i, {
+									tag: "span",
+									size: "xs",
+									type: "secondary",
+									className: "shrink-0 tabular-nums",
+									children: M
+								}),
+								!!V && /* @__PURE__ */ P(i, {
+									tag: "span",
+									size: "xs",
+									type: "secondary",
+									className: "shrink-0",
+									children: w.edited
+								}),
+								!!H && !!U && /* @__PURE__ */ P(o, {
+									variant: "secondary",
+									className: "self-center uppercase tracking-wide",
+									children: U
+								})
+							]
+						}),
+						/* @__PURE__ */ P("div", {
+							className: "mt-1 text-sm leading-relaxed",
+							children: /* @__PURE__ */ P(Q, {
+								comment: e,
+								resources: ee,
+								renderReference: C
+							})
+						}),
+						I.length > 0 && /* @__PURE__ */ P("div", {
+							className: "mt-2 flex flex-wrap gap-1.5",
+							children: I.map((e) => /* @__PURE__ */ P(o, {
+								variant: "secondary",
+								className: "uppercase tracking-wide",
+								children: e
+							}, e))
+						}),
+						q && /* @__PURE__ */ P("div", {
+							className: "mt-2 flex flex-wrap gap-1.5",
+							children: R.map((e) => S ? /* @__PURE__ */ P("div", { children: S(e) }, e.id ?? e.name) : /* @__PURE__ */ P(ce, {
+								attachment: e,
+								accessors: {
+									getMediaUrl: E,
+									getMediaName: D
+								},
+								strings: m
+							}, e.id ?? e.name))
+						}),
+						z.length > 0 && /* @__PURE__ */ P("div", {
+							className: "mt-2 flex flex-wrap items-center gap-1",
+							children: z.map((t) => /* @__PURE__ */ P("button", {
+								type: "button",
+								onClick: () => f && e.id ? f(e.id, t.emoji) : void 0,
+								title: t.users?.join(", "),
+								className: "rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/40",
+								children: /* @__PURE__ */ F(o, {
+									variant: t.mine ? "primary" : "secondary",
+									className: "cursor-pointer transition-colors hover:opacity-90",
+									children: [/* @__PURE__ */ P("span", {
+										"aria-hidden": !0,
+										className: "leading-none",
+										children: t.emoji
+									}), /* @__PURE__ */ P("span", {
+										className: "tabular-nums",
+										children: t.count
+									})]
+								})
+							}, t.emoji))
+						})
+					]
+				}),
+				/* @__PURE__ */ F("div", {
+					className: r("shrink-0 self-start opacity-0 transition-opacity", "group-hover:opacity-100 focus-within:opacity-100", "-mr-1 inline-flex items-center gap-0.5"),
+					children: [
+						!!p && /* @__PURE__ */ P(s, {
+							type: "button",
+							size: "icon-xs",
+							variant: "secondary",
+							buttonStyle: "ghost",
+							onClick: () => e.id && p(e.id),
+							title: w.replyLabel,
+							"aria-label": w.replyLabel,
+							children: /* @__PURE__ */ P(L, { className: "size-3.5" })
+						}),
+						!!f && /* @__PURE__ */ P(s, {
+							type: "button",
+							size: "icon-xs",
+							variant: "secondary",
+							buttonStyle: "ghost",
+							onClick: () => e.id && f(e.id, "👍"),
+							title: w.addReactionLabel,
+							"aria-label": w.addReactionLabel,
+							children: /* @__PURE__ */ P(re, { className: "size-3.5" })
+						}),
+						!!a && t && /* @__PURE__ */ P(s, {
+							type: "button",
+							size: "icon-xs",
+							variant: "secondary",
+							buttonStyle: "ghost",
+							onClick: () => a(e),
+							title: B ? w.unpinLabel : w.pinLabel,
+							"aria-label": B ? w.unpinLabel : w.pinLabel,
+							children: /* @__PURE__ */ P(G, { className: r("size-3.5", B && "text-warning") })
+						}),
+						!!K && !!e.id && /* @__PURE__ */ P(s, {
+							type: "button",
+							size: "icon-xs",
+							variant: "secondary",
+							buttonStyle: "ghost",
+							title: w.editLabel,
+							"aria-label": w.editLabel,
+							children: /* @__PURE__ */ P(W, { className: "size-3.5" })
+						}),
+						!!ne && !!n && !!e.id && /* @__PURE__ */ P(s, {
+							type: "button",
+							size: "icon-xs",
+							variant: "secondary",
+							buttonStyle: "ghost",
+							className: "hover:bg-destructive/10 hover:text-destructive",
+							onClick: () => n(e.id),
+							title: w.deleteLabel,
+							"aria-label": w.deleteLabel,
+							children: /* @__PURE__ */ P(ie, { className: "size-3.5" })
+						})
+					]
+				})
+			]
+		})
+	});
+}), Ce = function({ comments: e, canModerate: t, onDelete: n, onPinToggle: r, onReact: i, onReply: a, strings: o, getMediaUrl: s, getMediaName: c, getStatusLabel: l, formatRelativeTime: u, resources: d, renderItem: f, renderAttachment: p, renderReference: m, emptySlot: h }) {
+	return e.length ? /* @__PURE__ */ P("div", {
+		className: "flex flex-col gap-2",
+		children: e.map((e, h) => {
+			let g = /* @__PURE__ */ P(Se, {
+				comment: e,
+				canModerate: t,
+				onDelete: n,
+				onPinToggle: r,
+				onReact: i,
+				onReply: a,
+				strings: o,
+				getMediaUrl: s,
+				getMediaName: c,
+				getStatusLabel: l,
+				formatRelativeTime: u,
+				resources: d,
+				renderAttachment: p,
+				renderReference: m
+			});
+			return f ? /* @__PURE__ */ P("div", { children: f({
+				comment: e,
+				canModerate: t ?? !1,
+				onDelete: n,
+				defaultItem: g
+			}) }, e.id ?? `comment-${h}`) : /* @__PURE__ */ P("div", { children: g }, e.id ?? `comment-${h}`);
+		})
+	}) : /* @__PURE__ */ P(N, { children: h ?? /* @__PURE__ */ P(Z, { strings: o }) });
+};
+//#endregion
+//#region src/components/features/comments/comments.tsx
+function we(e) {
+	let n = t(), i = e.composerPosition ?? n.composerPosition ?? "top", a = e.canComment ?? !1, o = e.canModerate ?? !1, s = e.onSubmit, c = e.onDelete, l = e.onPinToggle, u = e.onReact, d = e.onReply, p = e.resources, m = e.attachments, h = Y(e.strings), g = e.title === void 0 ? h.title : e.title, [_, v] = j({}), [y, b] = j(!1), [x, ee] = j(0), S = {
+		setErrors: (e) => v(e),
+		reset: () => {
+			ee((e) => e + 1), v({}), b(!1);
+		},
+		setSubmitting: b
+	}, C = D((e) => {
+		s && (b(!0), v({}), s(e, S));
+	}, [s]), w = e.composerSlot ?? (a ? /* @__PURE__ */ P(X, {
+		context: e.context,
+		canComment: a,
+		isSubmitting: y,
+		errors: _,
+		resetKey: x,
+		onSubmit: C,
+		strings: e.strings,
+		resources: p,
+		attachments: m
+	}) : null), T = /* @__PURE__ */ P(Ce, {
+		comments: e.comments,
+		canModerate: o,
+		onDelete: c,
+		onPinToggle: l,
+		onReact: u,
+		onReply: d,
+		strings: e.strings,
+		getMediaUrl: e.getMediaUrl,
+		getMediaName: e.getMediaName,
+		getStatusLabel: e.getStatusLabel,
+		formatRelativeTime: e.formatRelativeTime,
+		resources: p,
+		renderItem: e.renderItem,
+		renderAttachment: e.renderAttachment,
+		renderReference: e.renderReference,
+		emptySlot: e.emptySlot ?? /* @__PURE__ */ P(Z, { strings: e.strings })
+	}), E = w ? /* @__PURE__ */ P("div", { children: w }) : null, O = /* @__PURE__ */ F("div", {
+		className: "flex flex-col gap-4",
+		children: [
+			e.headerSlot,
+			i === "top" && E,
+			T,
+			i === "bottom" && E,
+			e.footerSlot
+		]
+	});
+	return e.bare ? O : /* @__PURE__ */ P(f, {
+		title: g === !1 ? void 0 : g,
+		description: h.subtitle || void 0,
+		padding: "sm",
+		className: r("comments--component", e.className),
+		children: O
+	});
+}
+var Te = we;
+//#endregion
+//#region src/components/features/comments/hooks/use-comments.ts
+function Ee(e = {}) {
+	let { onSubmit: t, onUpdate: n, onDelete: r } = e, [i, a] = j({ kind: "idle" }), [o, s] = j(!1), [c, l] = j({}), [u, d] = j(0), f = {
+		setErrors: (e) => l(e),
+		reset: () => {
+			d((e) => e + 1), a({ kind: "idle" }), l({});
+		},
+		setSubmitting: s
+	};
+	return {
+		composerMode: i,
+		isSubmitting: o,
+		formErrors: c,
+		resetKey: u,
+		startReply: D((e) => {
+			a({
+				kind: "replying",
+				commentId: e.id ?? "",
+				authorName: e.user?.name
+			});
+		}, []),
+		startEdit: D((e) => {
+			a({
+				kind: "editing",
+				comment: e
+			});
+		}, []),
+		cancelComposerMode: D(() => {
+			a({ kind: "idle" }), l({});
+		}, []),
+		submit: D((e) => {
+			if (s(!0), l({}), i.kind === "editing" && i.comment.id) {
+				if (!n) {
+					s(!1);
+					return;
+				}
+				n(i.comment.id, e, f);
+				return;
+			}
+			if (!t) {
+				s(!1);
+				return;
+			}
+			t(i.kind === "replying" ? {
+				...e,
+				replyToId: i.commentId
+			} : e, f);
+		}, [
+			i,
+			t,
+			n
+		]),
+		deleteComment: D((e) => {
+			!r || !e || r(e);
+		}, [r]),
+		resetComposer: D(() => {
+			d((e) => e + 1), a({ kind: "idle" }), l({});
+		}, []),
+		helpers: f
+	};
+}
+//#endregion
+export { Se as a, Z as c, le as d, ce as f, J as g, q as h, Ce as i, X as l, Y as m, we as n, Q as o, ae as p, Te as r, pe as s, Ee as t, fe as u };
+
+//# sourceMappingURL=comments-CvmS7zG3.js.map