@wakastellar/ui 4.0.0 → 4.1.1

package/dist/components/editor/blocks/waka-comment-thread-block.es.js

@@ -0,0 +1,269 @@
+"use client";
+"use client";
+import { cn as e } from "../../../utils/cn.es.js";
+import * as t from "react";
+import { Fragment as n, jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/components/editor/blocks/waka-comment-thread-block.tsx
+var a = "comment_thread";
+function o(e) {
+	let t = Date.now() - new Date(e).getTime(), n = Math.floor(t / 1e3);
+	if (n < 60) return "just now";
+	let r = Math.floor(n / 60);
+	if (r < 60) return `${r}m ago`;
+	let i = Math.floor(r / 60);
+	if (i < 24) return `${i}h ago`;
+	let a = Math.floor(i / 24);
+	if (a < 30) return `${a}d ago`;
+	let o = Math.floor(a / 30);
+	return o < 12 ? `${o}mo ago` : `${Math.floor(o / 12)}y ago`;
+}
+function s({ author: t, size: n = "sm" }) {
+	let i = n === "sm" ? "h-6 w-6 text-[9px]" : "h-8 w-8 text-[10px]";
+	return t.avatar ? /* @__PURE__ */ r("img", {
+		src: t.avatar,
+		alt: t.name,
+		className: e("rounded-full object-cover flex-shrink-0", i)
+	}) : /* @__PURE__ */ r("div", {
+		className: e("rounded-full flex items-center justify-center text-white font-semibold flex-shrink-0", i, [
+			"bg-blue-500",
+			"bg-emerald-500",
+			"bg-violet-500",
+			"bg-amber-500",
+			"bg-rose-500",
+			"bg-cyan-500"
+		][t.name.split("").reduce((e, t) => e + t.charCodeAt(0), 0) % 6]),
+		children: t.name.charAt(0).toUpperCase()
+	});
+}
+function c({ comment: t, isCurrentUser: n, isFirst: a }) {
+	return /* @__PURE__ */ i("div", {
+		className: e("flex gap-2.5 px-3 py-2", !a && "border-t border-border/30"),
+		children: [/* @__PURE__ */ r(s, { author: t.author }), /* @__PURE__ */ i("div", {
+			className: "flex-1 min-w-0",
+			children: [
+				/* @__PURE__ */ i("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ r("span", {
+							className: e("text-xs font-semibold", n ? "text-primary" : "text-foreground"),
+							children: t.author.name
+						}),
+						/* @__PURE__ */ r("span", {
+							className: "text-[10px] text-muted-foreground",
+							children: o(t.createdAt)
+						}),
+						t.edited && /* @__PURE__ */ r("span", {
+							className: "text-[9px] text-muted-foreground/60 italic",
+							children: "(edited)"
+						})
+					]
+				}),
+				/* @__PURE__ */ r("p", {
+					className: "text-xs text-foreground/80 mt-0.5 leading-relaxed whitespace-pre-wrap",
+					children: t.content
+				}),
+				t.reactions && t.reactions.length > 0 && /* @__PURE__ */ r("div", {
+					className: "flex flex-wrap gap-1 mt-1.5",
+					children: t.reactions.map((t, n) => /* @__PURE__ */ i("button", {
+						type: "button",
+						className: e("inline-flex items-center gap-0.5 px-1.5 py-0.5 rounded-full text-[10px] border transition-colors", t.reacted ? "bg-primary/10 border-primary/30 text-primary" : "bg-muted/50 border-border/50 text-muted-foreground hover:bg-muted"),
+						children: [/* @__PURE__ */ r("span", { children: t.emoji }), /* @__PURE__ */ r("span", {
+							className: "font-medium",
+							children: t.count
+						})]
+					}, n))
+				})
+			]
+		})]
+	});
+}
+function l({ attributes: a, children: o, element: s, className: l, currentUserId: u, onReply: d, onResolve: f, onReopen: p }) {
+	let m = s, h = m?.threadId || "", g = m?.quotedText || "", _ = m?.status || "open", v = m?.comments || [], y = m?.totalComments ?? v.length, [b, x] = t.useState(""), [S, C] = t.useState(_ === "resolved"), w = {
+		open: {
+			label: "Open",
+			color: "text-blue-600 dark:text-blue-400",
+			bg: "bg-blue-50 dark:bg-blue-500/10"
+		},
+		resolved: {
+			label: "Resolved",
+			color: "text-emerald-600 dark:text-emerald-400",
+			bg: "bg-emerald-50 dark:bg-emerald-500/10"
+		},
+		archived: {
+			label: "Archived",
+			color: "text-muted-foreground",
+			bg: "bg-muted"
+		}
+	}, T = () => {
+		!b.trim() || !d || (d(h, b.trim()), x(""));
+	};
+	return /* @__PURE__ */ i("div", {
+		...a,
+		contentEditable: !1,
+		className: e("my-3 rounded-lg overflow-hidden border shadow-sm transition-all duration-200", _ === "resolved" ? "border-emerald-200 dark:border-emerald-800/30" : "border-primary/20", l),
+		children: [
+			/* @__PURE__ */ i("div", {
+				className: e("flex items-center justify-between px-3 py-2 cursor-pointer", _ === "resolved" ? "bg-emerald-50/50 dark:bg-emerald-950/10" : "bg-primary/5"),
+				onClick: () => C(!S),
+				role: "button",
+				tabIndex: 0,
+				onKeyDown: (e) => {
+					(e.key === "Enter" || e.key === " ") && C(!S);
+				},
+				"aria-expanded": !S,
+				children: [/* @__PURE__ */ i("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ r("svg", {
+							className: e("h-4 w-4", _ === "resolved" ? "text-emerald-500" : "text-primary"),
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: 2,
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ r("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: "M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z"
+							})
+						}),
+						/* @__PURE__ */ r("span", {
+							className: e("text-[10px] font-bold uppercase tracking-wider px-1.5 py-0.5 rounded", w[_].bg, w[_].color),
+							children: w[_].label
+						}),
+						/* @__PURE__ */ i("span", {
+							className: "text-[10px] text-muted-foreground",
+							children: [
+								y,
+								" comment",
+								y === 1 ? "" : "s"
+							]
+						})
+					]
+				}), /* @__PURE__ */ i("div", {
+					className: "flex items-center gap-2",
+					children: [
+						_ === "open" && f && /* @__PURE__ */ r("button", {
+							type: "button",
+							onClick: (e) => {
+								e.stopPropagation(), f(h);
+							},
+							className: "text-[10px] font-medium text-emerald-600 hover:text-emerald-700 dark:text-emerald-400 transition-colors",
+							children: "Resolve"
+						}),
+						_ === "resolved" && p && /* @__PURE__ */ r("button", {
+							type: "button",
+							onClick: (e) => {
+								e.stopPropagation(), p(h);
+							},
+							className: "text-[10px] font-medium text-primary hover:text-primary/80 transition-colors",
+							children: "Reopen"
+						}),
+						/* @__PURE__ */ r("svg", {
+							className: e("h-3.5 w-3.5 text-muted-foreground transition-transform", S && "-rotate-90"),
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: 2,
+							children: /* @__PURE__ */ r("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: "M19 9l-7 7-7-7"
+							})
+						})
+					]
+				})]
+			}),
+			!S && /* @__PURE__ */ i(n, { children: [
+				g && /* @__PURE__ */ r("div", {
+					className: "mx-3 mt-3 mb-1 px-3 py-2 rounded bg-muted/50 border-l-2 border-primary/30",
+					children: /* @__PURE__ */ i("p", {
+						className: "text-xs text-muted-foreground italic leading-relaxed line-clamp-3",
+						children: [
+							"\"",
+							g,
+							"\""
+						]
+					})
+				}),
+				/* @__PURE__ */ r("div", {
+					className: "py-1",
+					children: v.map((e, t) => /* @__PURE__ */ r(c, {
+						comment: e,
+						isCurrentUser: e.author.id === u,
+						isFirst: t === 0
+					}, e.id))
+				}),
+				_ === "open" && d && /* @__PURE__ */ r("div", {
+					className: "px-3 pb-3 pt-1 border-t border-border/30",
+					children: /* @__PURE__ */ i("div", {
+						className: "flex gap-2",
+						children: [/* @__PURE__ */ r("input", {
+							type: "text",
+							value: b,
+							onChange: (e) => x(e.target.value),
+							onKeyDown: (e) => {
+								e.key === "Enter" && !e.shiftKey && (e.preventDefault(), T());
+							},
+							placeholder: "Reply...",
+							className: e("flex-1 px-3 py-1.5 rounded-md text-xs bg-muted/50 border border-border/50", "focus:outline-none focus:ring-1 focus:ring-ring", "placeholder:text-muted-foreground/50")
+						}), /* @__PURE__ */ r("button", {
+							type: "button",
+							onClick: T,
+							disabled: !b.trim(),
+							className: e("px-3 py-1.5 rounded-md text-xs font-medium transition-colors", "bg-primary text-primary-foreground hover:bg-primary/90", "disabled:opacity-40 disabled:cursor-not-allowed"),
+							children: "Reply"
+						})]
+					})
+				})
+			] }),
+			/* @__PURE__ */ r("div", {
+				className: "hidden",
+				children: o
+			})
+		]
+	});
+}
+l.displayName = "WakaCommentThreadBlock";
+function u(e) {
+	let t = (/* @__PURE__ */ new Date()).toISOString();
+	return [{
+		type: a,
+		threadId: e?.threadId || `thread-${Date.now()}`,
+		quotedText: e?.quotedText || "",
+		status: "open",
+		comments: e?.initialComment ? [{
+			id: `comment-${Date.now()}`,
+			author: {
+				id: e.initialComment.authorId,
+				name: e.initialComment.authorName
+			},
+			content: e.initialComment.content,
+			createdAt: t
+		}] : [],
+		children: [{ text: "" }]
+	}];
+}
+async function d(e, t, n) {
+	try {
+		let { createPlatePlugin: i } = await import("platejs/react");
+		return i({
+			key: a,
+			node: {
+				isElement: !0,
+				isVoid: !0,
+				type: a,
+				component: (i) => /* @__PURE__ */ r(l, {
+					...i,
+					currentUserId: e,
+					onReply: t,
+					onResolve: n
+				})
+			}
+		});
+	} catch {
+		return console.warn("[WakaCommentThreadBlock] platejs not installed"), null;
+	}
+}
+//#endregion
+export { a as COMMENT_THREAD_BLOCK_TYPE, l as WakaCommentThreadBlock, u as createCommentThreadNodes, d as createCommentThreadPlugin };

package/dist/components/editor/blocks/waka-diagram-block.cjs.js

@@ -0,0 +1,9 @@
+"use client";"use client";const e=require("../../../_virtual/_rolldown/runtime.cjs.js"),t=require("../../../utils/cn.cjs.js");let n=require("react");n=e.__toESM(n);let r=require("react/jsx-runtime"),i=require("dompurify");i=e.__toESM(i);var a=`diagram`,o=new Set([`href`,`xlink:href`]),s=!1;function c(){s||(s=!0,i.default.addHook(`uponSanitizeAttribute`,(e,t)=>{if(!t?.attrName)return;let n=t.attrName.toLowerCase();o.has(n)&&((t.attrValue||``).trim().startsWith(`#`)||(t.keepAttr=!1))}))}var l={USE_PROFILES:{svg:!0,svgFilters:!0,html:!0},ADD_TAGS:[`foreignObject`,`use`,`marker`,`pattern`,`mask`,`clipPath`],ADD_ATTR:[`transform`,`viewBox`,`xmlns`,`xmlns:xlink`,`xlink:href`],FORBID_TAGS:[`script`,`iframe`,`object`,`embed`,`link`,`meta`,`base`,`form`],FORBID_ATTR:[/^on/i]};function u(e){return c(),i.default.sanitize(e,l)}var d={mermaid:{label:`Mermaid`,color:`text-pink-600 dark:text-pink-400 bg-pink-50 dark:bg-pink-500/10`,icon:`M12 3l8 4.5v9L12 21l-8-4.5v-9L12 3z`},plantuml:{label:`PlantUML`,color:`text-teal-600 dark:text-teal-400 bg-teal-50 dark:bg-teal-500/10`,icon:`M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6z`},excalidraw:{label:`Excalidraw`,color:`text-indigo-600 dark:text-indigo-400 bg-indigo-50 dark:bg-indigo-500/10`,icon:`M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z`}};function f({attributes:e,children:i,element:a,className:o,onRender:s}){let c=a,l=c?.syntax||`mermaid`,f=c?.source||``,p=d[l],[m,h]=n.useState(!1),[g,_]=n.useState(null),[v,y]=n.useState(!s),b=n.useRef(null);return n.useEffect(()=>{if(!f||!s||v)return;let e=!1,t=setTimeout(async()=>{h(!0),_(null);try{let t=await s(f,l);if(!e&&b.current){let e=u(t);b.current.textContent=``;let n=new DOMParser().parseFromString(e,`text/html`),r=document.createDocumentFragment();Array.from(n.body.childNodes).forEach(e=>{r.appendChild(document.importNode(e,!0))}),b.current.appendChild(r)}}catch(t){e||_(t instanceof Error?t.message:`Render failed`)}finally{e||h(!1)}},500);return()=>{e=!0,clearTimeout(t)}},[f,l,s,v]),(0,r.jsxs)(`div`,{...e,contentEditable:!1,className:t.cn(`my-4 rounded-lg overflow-hidden border border-border shadow-sm`,o),children:[(0,r.jsxs)(`div`,{className:`flex items-center justify-between px-4 py-2 bg-muted/30 border-b border-border`,children:[(0,r.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,r.jsx)(`svg`,{className:t.cn(`h-4 w-4`,p.color.split(` `)[0]),viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:2,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:p.icon})}),(0,r.jsx)(`span`,{className:t.cn(`text-[10px] font-bold uppercase tracking-wider px-1.5 py-0.5 rounded`,p.color),children:p.label}),c?.caption&&(0,r.jsx)(`span`,{className:`text-xs text-muted-foreground ml-2`,children:c.caption})]}),(0,r.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,r.jsx)(`button`,{type:`button`,onClick:()=>y(!0),className:t.cn(`px-2 py-1 rounded text-[10px] font-medium transition-colors`,v?`bg-muted text-foreground`:`text-muted-foreground hover:text-foreground`),children:`Source`}),(0,r.jsx)(`button`,{type:`button`,onClick:()=>y(!1),className:t.cn(`px-2 py-1 rounded text-[10px] font-medium transition-colors`,v?`text-muted-foreground hover:text-foreground`:`bg-muted text-foreground`),children:`Preview`})]})]}),v&&(0,r.jsx)(`div`,{className:`border-b border-border`,children:(0,r.jsx)(`pre`,{className:t.cn(`text-[12px] font-mono leading-relaxed p-4 overflow-x-auto`,`bg-gray-950 dark:bg-gray-900 text-gray-100`,`max-h-[300px] overflow-y-auto`),children:(0,r.jsx)(`code`,{children:f||`graph TD
+    A[Start] --> B[Process]
+    B --> C{Decision}
+    C -->|Yes| D[Result A]
+    C -->|No| E[Result B]`})})}),!v&&(0,r.jsx)(`div`,{className:`p-4 bg-white dark:bg-gray-950 min-h-[120px] flex items-center justify-center`,children:m?(0,r.jsxs)(`div`,{className:`flex flex-col items-center gap-2 text-muted-foreground`,children:[(0,r.jsxs)(`svg`,{className:`h-6 w-6 animate-spin`,viewBox:`0 0 24 24`,fill:`none`,children:[(0,r.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,r.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z`})]}),(0,r.jsx)(`span`,{className:`text-xs`,children:`Rendering diagram...`})]}):g?(0,r.jsxs)(`div`,{className:`flex flex-col items-center gap-2 text-destructive`,children:[(0,r.jsx)(`svg`,{className:`h-6 w-6`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:2,children:(0,r.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.34 16.5c-.77.833.192 2.5 1.732 2.5z`})}),(0,r.jsx)(`span`,{className:`text-xs`,children:g})]}):s?(0,r.jsx)(`div`,{ref:b,className:`diagram-rendered w-full [&_svg]:max-w-full [&_svg]:h-auto`}):(0,r.jsxs)(`div`,{className:`flex flex-col items-center gap-2 text-muted-foreground`,children:[(0,r.jsx)(`svg`,{className:`h-8 w-8`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:1.5,children:(0,r.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:p.icon})}),(0,r.jsx)(`span`,{className:`text-xs`,children:`Provide an onRender callback to see the diagram preview`}),(0,r.jsx)(`button`,{type:`button`,onClick:()=>y(!0),className:`text-xs text-primary hover:underline`,children:`View source instead`})]})}),(0,r.jsx)(`div`,{className:`hidden`,children:i})]})}f.displayName=`WakaDiagramBlock`;function p(e){return[{type:a,syntax:e?.syntax||`mermaid`,source:e?.source||`graph TD
+    A[Start] --> B[Process]
+    B --> C{Decision}
+    C -->|Yes| D[Result A]
+    C -->|No| E[Result B]`,caption:e?.caption,children:[{text:``}]}]}async function m(e){try{let{createPlatePlugin:t}=await import(`platejs/react`);return t({key:a,node:{isElement:!0,isVoid:!0,type:a,component:t=>(0,r.jsx)(f,{...t,onRender:e})}})}catch{return console.warn(`[WakaDiagramBlock] platejs not installed`),null}}exports.DIAGRAM_BLOCK_TYPE=a,exports.WakaDiagramBlock=f,exports.createDiagramNodes=p,exports.createDiagramPlugin=m,exports.sanitizeDiagramMarkup=u;

package/dist/components/editor/blocks/waka-diagram-block.es.js

@@ -0,0 +1,262 @@
+"use client";
+"use client";
+import { cn as e } from "../../../utils/cn.es.js";
+import * as t from "react";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import i from "dompurify";
+//#region src/components/editor/blocks/waka-diagram-block.tsx
+var a = "diagram", o = /* @__PURE__ */ new Set(["href", "xlink:href"]), s = !1;
+function c() {
+	s || (s = !0, i.addHook("uponSanitizeAttribute", (e, t) => {
+		if (!t?.attrName) return;
+		let n = t.attrName.toLowerCase();
+		o.has(n) && ((t.attrValue || "").trim().startsWith("#") || (t.keepAttr = !1));
+	}));
+}
+var l = {
+	USE_PROFILES: {
+		svg: !0,
+		svgFilters: !0,
+		html: !0
+	},
+	ADD_TAGS: [
+		"foreignObject",
+		"use",
+		"marker",
+		"pattern",
+		"mask",
+		"clipPath"
+	],
+	ADD_ATTR: [
+		"transform",
+		"viewBox",
+		"xmlns",
+		"xmlns:xlink",
+		"xlink:href"
+	],
+	FORBID_TAGS: [
+		"script",
+		"iframe",
+		"object",
+		"embed",
+		"link",
+		"meta",
+		"base",
+		"form"
+	],
+	FORBID_ATTR: [/^on/i]
+};
+function u(e) {
+	return c(), i.sanitize(e, l);
+}
+var d = {
+	mermaid: {
+		label: "Mermaid",
+		color: "text-pink-600 dark:text-pink-400 bg-pink-50 dark:bg-pink-500/10",
+		icon: "M12 3l8 4.5v9L12 21l-8-4.5v-9L12 3z"
+	},
+	plantuml: {
+		label: "PlantUML",
+		color: "text-teal-600 dark:text-teal-400 bg-teal-50 dark:bg-teal-500/10",
+		icon: "M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6z"
+	},
+	excalidraw: {
+		label: "Excalidraw",
+		color: "text-indigo-600 dark:text-indigo-400 bg-indigo-50 dark:bg-indigo-500/10",
+		icon: "M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
+	}
+};
+function f({ attributes: i, children: a, element: o, className: s, onRender: c }) {
+	let l = o, f = l?.syntax || "mermaid", p = l?.source || "", m = d[f], [h, g] = t.useState(!1), [_, v] = t.useState(null), [y, b] = t.useState(!c), x = t.useRef(null);
+	return t.useEffect(() => {
+		if (!p || !c || y) return;
+		let e = !1, t = setTimeout(async () => {
+			g(!0), v(null);
+			try {
+				let t = await c(p, f);
+				if (!e && x.current) {
+					let e = u(t);
+					x.current.textContent = "";
+					let n = new DOMParser().parseFromString(e, "text/html"), r = document.createDocumentFragment();
+					Array.from(n.body.childNodes).forEach((e) => {
+						r.appendChild(document.importNode(e, !0));
+					}), x.current.appendChild(r);
+				}
+			} catch (t) {
+				e || v(t instanceof Error ? t.message : "Render failed");
+			} finally {
+				e || g(!1);
+			}
+		}, 500);
+		return () => {
+			e = !0, clearTimeout(t);
+		};
+	}, [
+		p,
+		f,
+		c,
+		y
+	]), /* @__PURE__ */ r("div", {
+		...i,
+		contentEditable: !1,
+		className: e("my-4 rounded-lg overflow-hidden border border-border shadow-sm", s),
+		children: [
+			/* @__PURE__ */ r("div", {
+				className: "flex items-center justify-between px-4 py-2 bg-muted/30 border-b border-border",
+				children: [/* @__PURE__ */ r("div", {
+					className: "flex items-center gap-2",
+					children: [
+						/* @__PURE__ */ n("svg", {
+							className: e("h-4 w-4", m.color.split(" ")[0]),
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: 2,
+							"aria-hidden": "true",
+							children: /* @__PURE__ */ n("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: m.icon
+							})
+						}),
+						/* @__PURE__ */ n("span", {
+							className: e("text-[10px] font-bold uppercase tracking-wider px-1.5 py-0.5 rounded", m.color),
+							children: m.label
+						}),
+						l?.caption && /* @__PURE__ */ n("span", {
+							className: "text-xs text-muted-foreground ml-2",
+							children: l.caption
+						})
+					]
+				}), /* @__PURE__ */ r("div", {
+					className: "flex items-center gap-1",
+					children: [/* @__PURE__ */ n("button", {
+						type: "button",
+						onClick: () => b(!0),
+						className: e("px-2 py-1 rounded text-[10px] font-medium transition-colors", y ? "bg-muted text-foreground" : "text-muted-foreground hover:text-foreground"),
+						children: "Source"
+					}), /* @__PURE__ */ n("button", {
+						type: "button",
+						onClick: () => b(!1),
+						className: e("px-2 py-1 rounded text-[10px] font-medium transition-colors", y ? "text-muted-foreground hover:text-foreground" : "bg-muted text-foreground"),
+						children: "Preview"
+					})]
+				})]
+			}),
+			y && /* @__PURE__ */ n("div", {
+				className: "border-b border-border",
+				children: /* @__PURE__ */ n("pre", {
+					className: e("text-[12px] font-mono leading-relaxed p-4 overflow-x-auto", "bg-gray-950 dark:bg-gray-900 text-gray-100", "max-h-[300px] overflow-y-auto"),
+					children: /* @__PURE__ */ n("code", { children: p || "graph TD\n    A[Start] --> B[Process]\n    B --> C{Decision}\n    C -->|Yes| D[Result A]\n    C -->|No| E[Result B]" })
+				})
+			}),
+			!y && /* @__PURE__ */ n("div", {
+				className: "p-4 bg-white dark:bg-gray-950 min-h-[120px] flex items-center justify-center",
+				children: h ? /* @__PURE__ */ r("div", {
+					className: "flex flex-col items-center gap-2 text-muted-foreground",
+					children: [/* @__PURE__ */ r("svg", {
+						className: "h-6 w-6 animate-spin",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						children: [/* @__PURE__ */ n("circle", {
+							className: "opacity-25",
+							cx: "12",
+							cy: "12",
+							r: "10",
+							stroke: "currentColor",
+							strokeWidth: "4"
+						}), /* @__PURE__ */ n("path", {
+							className: "opacity-75",
+							fill: "currentColor",
+							d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"
+						})]
+					}), /* @__PURE__ */ n("span", {
+						className: "text-xs",
+						children: "Rendering diagram..."
+					})]
+				}) : _ ? /* @__PURE__ */ r("div", {
+					className: "flex flex-col items-center gap-2 text-destructive",
+					children: [/* @__PURE__ */ n("svg", {
+						className: "h-6 w-6",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						stroke: "currentColor",
+						strokeWidth: 2,
+						children: /* @__PURE__ */ n("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							d: "M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.34 16.5c-.77.833.192 2.5 1.732 2.5z"
+						})
+					}), /* @__PURE__ */ n("span", {
+						className: "text-xs",
+						children: _
+					})]
+				}) : c ? /* @__PURE__ */ n("div", {
+					ref: x,
+					className: "diagram-rendered w-full [&_svg]:max-w-full [&_svg]:h-auto"
+				}) : /* @__PURE__ */ r("div", {
+					className: "flex flex-col items-center gap-2 text-muted-foreground",
+					children: [
+						/* @__PURE__ */ n("svg", {
+							className: "h-8 w-8",
+							viewBox: "0 0 24 24",
+							fill: "none",
+							stroke: "currentColor",
+							strokeWidth: 1.5,
+							children: /* @__PURE__ */ n("path", {
+								strokeLinecap: "round",
+								strokeLinejoin: "round",
+								d: m.icon
+							})
+						}),
+						/* @__PURE__ */ n("span", {
+							className: "text-xs",
+							children: "Provide an onRender callback to see the diagram preview"
+						}),
+						/* @__PURE__ */ n("button", {
+							type: "button",
+							onClick: () => b(!0),
+							className: "text-xs text-primary hover:underline",
+							children: "View source instead"
+						})
+					]
+				})
+			}),
+			/* @__PURE__ */ n("div", {
+				className: "hidden",
+				children: a
+			})
+		]
+	});
+}
+f.displayName = "WakaDiagramBlock";
+function p(e) {
+	return [{
+		type: a,
+		syntax: e?.syntax || "mermaid",
+		source: e?.source || "graph TD\n    A[Start] --> B[Process]\n    B --> C{Decision}\n    C -->|Yes| D[Result A]\n    C -->|No| E[Result B]",
+		caption: e?.caption,
+		children: [{ text: "" }]
+	}];
+}
+async function m(e) {
+	try {
+		let { createPlatePlugin: t } = await import("platejs/react");
+		return t({
+			key: a,
+			node: {
+				isElement: !0,
+				isVoid: !0,
+				type: a,
+				component: (t) => /* @__PURE__ */ n(f, {
+					...t,
+					onRender: e
+				})
+			}
+		});
+	} catch {
+		return console.warn("[WakaDiagramBlock] platejs not installed"), null;
+	}
+}
+//#endregion
+export { a as DIAGRAM_BLOCK_TYPE, f as WakaDiagramBlock, p as createDiagramNodes, m as createDiagramPlugin, u as sanitizeDiagramMarkup };

package/dist/components/editor/blocks/waka-embed-block.cjs.js

@@ -0,0 +1 @@
+"use client";"use client";const e=require("../../../_virtual/_rolldown/runtime.cjs.js"),t=require("../../../utils/cn.cjs.js"),n=require("../../../utils/security.cjs.js");let r=require("react");r=e.__toESM(r);let i=require("react/jsx-runtime");var a=`embed`,o={figma:{label:`Figma`,icon:`M12 2a4 4 0 00-4 4v4a4 4 0 004-4V2zm0 12a4 4 0 01-4 4v2h4v-6zm8-4a4 4 0 01-4 4H12v-8h4a4 4 0 014 4z`,color:`text-purple-600 dark:text-purple-400`,bgColor:`bg-purple-50 dark:bg-purple-500/10`,transform:e=>e.includes(`figma.com`)?`https://www.figma.com/embed?embed_host=wakastart&url=${encodeURIComponent(e)}`:null,defaultAspect:`16/9`,domain:`figma.com`},youtube:{label:`YouTube`,icon:`M19.615 3.184c-3.604-.246-11.631-.245-15.23 0C.488 3.45.029 5.804 0 12c.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0C23.512 20.55 23.971 18.196 24 12c-.029-6.185-.484-8.549-4.385-8.816zM9 16V8l8 4-8 4z`,color:`text-red-600 dark:text-red-400`,bgColor:`bg-red-50 dark:bg-red-500/10`,transform:e=>{let t=e.match(/(?:youtube\.com\/(?:watch\?v=|embed\/)|youtu\.be\/)([a-zA-Z0-9_-]+)/);return t?`https://www.youtube.com/embed/${t[1]}`:null},defaultAspect:`16/9`,domain:`youtube.com`},vimeo:{label:`Vimeo`,icon:`M22.875 10.063c-.098 2.141-1.592 5.075-4.483 8.8-2.988 3.891-5.517 5.836-7.588 5.836-1.282 0-2.367-1.184-3.258-3.553L6.14 15.15c-.589-2.369-1.221-3.553-1.896-3.553-.147 0-.663.31-1.546.928l-.925-1.19c.973-.855 1.932-1.71 2.877-2.565 1.297-1.12 2.27-1.71 2.921-1.77 1.534-.147 2.479.903 2.834 3.148.384 2.422.65 3.928.801 4.519.445 2.022.934 3.033 1.468 3.033.414 0 1.037-.656 1.868-1.967.831-1.311 1.276-2.31 1.336-2.998.119-1.14-.328-1.71-1.342-1.71-.478 0-.97.109-1.477.327.981-3.212 2.855-4.773 5.625-4.684 2.054.059 3.024 1.394 2.908 4.003z`,color:`text-sky-600 dark:text-sky-400`,bgColor:`bg-sky-50 dark:bg-sky-500/10`,transform:e=>{let t=e.match(/vimeo\.com\/(\d+)/);return t?`https://player.vimeo.com/video/${t[1]}`:null},defaultAspect:`16/9`,domain:`vimeo.com`},codesandbox:{label:`CodeSandbox`,icon:`M2 6l10-4 10 4v12l-10 4L2 18V6zm10 2L4 4v8l8 4V8zm8-4l-8 4v8l8-4V4z`,color:`text-gray-700 dark:text-gray-300`,bgColor:`bg-gray-50 dark:bg-gray-500/10`,transform:e=>{let t=e.match(/codesandbox\.io\/(?:s|p)\/([a-zA-Z0-9-]+)/);return t?`https://codesandbox.io/embed/${t[1]}?fontsize=14&hidenavigation=1&theme=dark`:null},defaultAspect:`16/9`,domain:`codesandbox.io`},codepen:{label:`CodePen`,icon:`M12 2L2 8.5v7L12 22l10-6.5v-7L12 2zm0 3.311L18.26 9 12 12.689 5.74 9 12 5.311zM4 10.289l6 3.9v5.522l-6-3.9v-5.522zm8 9.422v-5.522l6-3.9v5.522l-6 3.9z`,color:`text-gray-700 dark:text-gray-300`,bgColor:`bg-gray-50 dark:bg-gray-500/10`,transform:e=>{let t=e.match(/codepen\.io\/([^/]+)\/pen\/([a-zA-Z0-9]+)/);return t?`https://codepen.io/${t[1]}/embed/${t[2]}?default-tab=result&theme-id=dark`:null},defaultAspect:`16/9`,domain:`codepen.io`},stackblitz:{label:`StackBlitz`,icon:`M13 10V3L4 14h7v7l9-11h-7z`,color:`text-blue-600 dark:text-blue-400`,bgColor:`bg-blue-50 dark:bg-blue-500/10`,transform:e=>e.includes(`stackblitz.com`)?e.replace(`stackblitz.com/edit`,`stackblitz.com/embed`):null,defaultAspect:`16/9`,domain:`stackblitz.com`},loom:{label:`Loom`,icon:`M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 14.5v-9l6 4.5-6 4.5z`,color:`text-purple-600 dark:text-purple-400`,bgColor:`bg-purple-50 dark:bg-purple-500/10`,transform:e=>{let t=e.match(/loom\.com\/share\/([a-zA-Z0-9]+)/);return t?`https://www.loom.com/embed/${t[1]}`:null},defaultAspect:`16/9`,domain:`loom.com`},miro:{label:`Miro`,icon:`M4 3h16a1 1 0 011 1v16a1 1 0 01-1 1H4a1 1 0 01-1-1V4a1 1 0 011-1z`,color:`text-yellow-600 dark:text-yellow-400`,bgColor:`bg-yellow-50 dark:bg-yellow-500/10`,transform:e=>{let t=e.match(/miro\.com\/app\/board\/([^/?]+)/);return t?`https://miro.com/app/live-embed/${t[1]}/`:null},defaultAspect:`16/9`,domain:`miro.com`},notion:{label:`Notion`,icon:`M4 4a2 2 0 012-2h12a2 2 0 012 2v16a2 2 0 01-2 2H6a2 2 0 01-2-2V4zm4 2v4h8V6H8zm0 6v2h8v-2H8zm0 4v2h5v-2H8z`,color:`text-gray-800 dark:text-gray-200`,bgColor:`bg-gray-50 dark:bg-gray-500/10`,transform:()=>null,defaultAspect:`16/9`,domain:`notion.so`},"github-gist":{label:`GitHub Gist`,icon:`M12 2C6.477 2 2 6.477 2 12c0 4.42 2.865 8.166 6.839 9.489.5.092.682-.217.682-.482 0-.237-.009-.866-.013-1.7-2.782.604-3.369-1.34-3.369-1.34-.454-1.156-1.11-1.462-1.11-1.462-.908-.62.069-.608.069-.608 1.003.07 1.531 1.03 1.531 1.03.892 1.529 2.341 1.087 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.11-4.555-4.943 0-1.091.39-1.984 1.029-2.683-.103-.253-.446-1.27.098-2.647 0 0 .84-.269 2.75 1.025A9.578 9.578 0 0112 6.836c.85.004 1.705.114 2.504.336 1.909-1.294 2.747-1.025 2.747-1.025.546 1.377.203 2.394.1 2.647.64.699 1.028 1.592 1.028 2.683 0 3.842-2.339 4.687-4.566 4.935.359.309.678.919.678 1.852 0 1.336-.012 2.415-.012 2.743 0 .267.18.578.688.48C19.138 20.161 22 16.416 22 12c0-5.523-4.477-10-10-10z`,color:`text-gray-800 dark:text-gray-200`,bgColor:`bg-gray-50 dark:bg-gray-500/10`,transform:()=>null,defaultAspect:`4/3`,domain:`gist.github.com`},generic:{label:`Embed`,icon:`M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14`,color:`text-muted-foreground`,bgColor:`bg-muted`,transform:()=>null,defaultAspect:`16/9`,domain:``}};function s(e){let t=e.toLowerCase();return t.includes(`figma.com`)?`figma`:t.includes(`youtube.com`)||t.includes(`youtu.be`)?`youtube`:t.includes(`vimeo.com`)?`vimeo`:t.includes(`codesandbox.io`)?`codesandbox`:t.includes(`codepen.io`)?`codepen`:t.includes(`stackblitz.com`)?`stackblitz`:t.includes(`loom.com`)?`loom`:t.includes(`miro.com`)?`miro`:t.includes(`notion.so`)?`notion`:t.includes(`gist.github.com`)?`github-gist`:`generic`}function c(e,t){return o[t].transform(e)||e}function l({attributes:e,children:a,element:s,className:c}){let l=s,u=o[l?.provider||`generic`],d=l?.embedUrl||``,f=l?.aspectRatio||u.defaultAspect,p=r.useMemo(()=>d?n.sanitizeUrl(d):``,[d]),[m,h]=r.useState(!1),[g,_]=r.useState(!1);return(0,i.jsxs)(`div`,{...e,contentEditable:!1,className:t.cn(`my-4 rounded-lg overflow-hidden border border-border shadow-sm`,c),children:[(0,i.jsxs)(`div`,{className:`flex items-center justify-between px-3 py-2 bg-muted/30 border-b border-border`,children:[(0,i.jsxs)(`div`,{className:`flex items-center gap-2`,children:[(0,i.jsx)(`svg`,{className:t.cn(`h-4 w-4`,u.color),viewBox:`0 0 24 24`,fill:`currentColor`,"aria-hidden":`true`,children:(0,i.jsx)(`path`,{d:u.icon})}),(0,i.jsx)(`span`,{className:t.cn(`text-[10px] font-bold uppercase tracking-wider`,u.color),children:u.label}),l?.title&&(0,i.jsx)(`span`,{className:`text-xs text-muted-foreground ml-1 truncate max-w-[300px]`,children:l.title})]}),l?.url&&(0,i.jsxs)(`a`,{href:n.sanitizeUrl(l.url),target:`_blank`,rel:`noopener noreferrer`,className:`text-[10px] text-primary hover:underline flex items-center gap-1`,children:[`Open`,(0,i.jsx)(`svg`,{className:`h-3 w-3`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:2,children:(0,i.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14`})})]})]}),(0,i.jsxs)(`div`,{className:`relative bg-muted/10`,style:{aspectRatio:f,maxHeight:l?.maxHeight?`${l.maxHeight}px`:void 0},children:[!m&&!g&&p&&(0,i.jsx)(`div`,{className:`absolute inset-0 flex items-center justify-center bg-muted/20`,children:(0,i.jsxs)(`svg`,{className:`h-8 w-8 animate-spin text-muted-foreground/30`,viewBox:`0 0 24 24`,fill:`none`,children:[(0,i.jsx)(`circle`,{className:`opacity-25`,cx:`12`,cy:`12`,r:`10`,stroke:`currentColor`,strokeWidth:`4`}),(0,i.jsx)(`path`,{className:`opacity-75`,fill:`currentColor`,d:`M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z`})]})}),g&&(0,i.jsxs)(`div`,{className:`absolute inset-0 flex flex-col items-center justify-center bg-muted/10 text-muted-foreground`,children:[(0,i.jsx)(`svg`,{className:`h-8 w-8 mb-2`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:1.5,children:(0,i.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4c-.77-.833-1.964-.833-2.732 0L3.34 16.5c-.77.833.192 2.5 1.732 2.5z`})}),(0,i.jsx)(`span`,{className:`text-xs`,children:`Failed to load embed`})]}),!p&&(0,i.jsxs)(`div`,{className:`flex flex-col items-center justify-center py-12 text-muted-foreground`,children:[(0,i.jsx)(`svg`,{className:`h-10 w-10 mb-3 text-muted-foreground/30`,viewBox:`0 0 24 24`,fill:`none`,stroke:`currentColor`,strokeWidth:1.5,children:(0,i.jsx)(`path`,{strokeLinecap:`round`,strokeLinejoin:`round`,d:`M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1`})}),(0,i.jsx)(`span`,{className:`text-sm`,children:`Paste a URL to embed content`}),(0,i.jsx)(`span`,{className:`text-[10px] mt-1 text-muted-foreground/60`,children:`Supports Figma, YouTube, CodeSandbox, Loom, and more`})]}),p&&(0,i.jsx)(`iframe`,{src:p,title:l?.title||`${u.label} embed`,className:t.cn(`w-full h-full border-0`,!m&&`opacity-0`),loading:`lazy`,allowFullScreen:!0,sandbox:`allow-scripts allow-same-origin allow-popups allow-forms`,onLoad:()=>h(!0),onError:()=>_(!0)})]}),(0,i.jsx)(`div`,{className:`hidden`,children:a})]})}l.displayName=`WakaEmbedBlock`;function u(e,t){let n=s(e);return[{type:a,url:e,provider:n,embedUrl:c(e,n),title:t?.title,aspectRatio:t?.aspectRatio,maxHeight:t?.maxHeight,children:[{text:``}]}]}async function d(){try{let{createPlatePlugin:e}=await import(`platejs/react`);return e({key:a,node:{isElement:!0,isVoid:!0,type:a,component:l}})}catch{return console.warn(`[WakaEmbedBlock] platejs not installed`),null}}exports.EMBED_BLOCK_TYPE=a,exports.WakaEmbedBlock=l,exports.createEmbedNodes=u,exports.createEmbedPlugin=d,exports.detectEmbedProvider=s,exports.resolveEmbedUrl=c;