@devalok/shilp-sutra 0.33.2 → 0.34.1

package/dist/composed/markdown-viewer.js

@@ -1,145 +1,193 @@
 "use client";
-import { jsx as r, Fragment as w, jsxs as u } from "react/jsx-runtime";
-import * as d from "react";
-import C from "react-markdown";
-import S from "remark-gfm";
-import { IconCheck as z, IconCopy as R } from "@tabler/icons-react";
-import { Icon as b } from "../ui/icon.js";
-import { cn as l } from "../ui/lib/utils.js";
-import { Button as $ } from "../ui/button.js";
-function h(t) {
-  return t.toLowerCase().replace(/[^\w]+/g, "-").replace(/(^-|-$)/g, "");
+import { cn as e } from "../ui/lib/utils.js";
+import { Icon as t } from "../ui/icon.js";
+import { Button as n } from "../ui/button.js";
+import * as r from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { IconCheck as s, IconCopy as c } from "@tabler/icons-react";
+import l from "react-markdown";
+import u from "remark-gfm";
+//#region src/composed/markdown-viewer.tsx
+function d(e) {
+	return e.toLowerCase().replace(/[^\w]+/g, "-").replace(/(^-|-$)/g, "");
 }
-function m(t) {
-  return typeof t == "string" ? t : typeof t == "number" ? String(t) : t ? Array.isArray(t) ? t.map(m).join("") : typeof t == "object" && "props" in t ? m(t.props.children) : "" : "";
+function f(e) {
+	return typeof e == "string" ? e : typeof e == "number" ? String(e) : e ? Array.isArray(e) ? e.map(f).join("") : typeof e == "object" && "props" in e ? f(e.props.children) : "" : "";
 }
-function y({ code: t }) {
-  const [a, i] = d.useState(!1), n = d.useRef(void 0);
-  d.useEffect(() => () => clearTimeout(n.current), []);
-  function c() {
-    navigator.clipboard.writeText(t).then(() => {
-      i(!0), n.current = setTimeout(() => i(!1), 2e3);
-    });
-  }
-  return /* @__PURE__ */ r(
-    $,
-    {
-      variant: "ghost",
-      size: "icon-xs",
-      className: "absolute top-ds-02 right-ds-02 opacity-0 group-hover:opacity-100 transition-opacity",
-      onClick: c,
-      "aria-label": a ? "Copied" : "Copy code",
-      children: a ? /* @__PURE__ */ r(b, { icon: z, size: "xs" }) : /* @__PURE__ */ r(b, { icon: R, size: "xs" })
-    }
-  );
+function p({ code: e }) {
+	let [i, o] = r.useState(!1), l = r.useRef(void 0);
+	r.useEffect(() => () => clearTimeout(l.current), []);
+	function u() {
+		navigator.clipboard.writeText(e).then(() => {
+			o(!0), l.current = setTimeout(() => o(!1), 2e3);
+		});
+	}
+	return /* @__PURE__ */ a(n, {
+		variant: "ghost",
+		size: "icon-xs",
+		className: "absolute top-ds-02 right-ds-02 opacity-0 group-hover:opacity-100 transition-opacity",
+		onClick: u,
+		"aria-label": i ? "Copied" : "Copy code",
+		children: i ? /* @__PURE__ */ a(t, {
+			icon: s,
+			size: "xs"
+		}) : /* @__PURE__ */ a(t, {
+			icon: c,
+			size: "xs"
+		})
+	});
 }
-function j({ language: t, code: a, mb: i }) {
-  const [n, c] = d.useState(null);
-  if (d.useEffect(() => {
-    let o = !1;
-    return Promise.all([
-      import("react-syntax-highlighter"),
-      import("react-syntax-highlighter/dist/esm/styles/prism/one-dark")
-    ]).then(([f, e]) => {
-      o || c({ Highlighter: f.Prism ?? f.default, style: e.default });
-    }).catch(() => {
-    }), () => {
-      o = !0;
-    };
-  }, []), !n)
-    return /* @__PURE__ */ u("div", { className: l("group relative", i), children: [
-      /* @__PURE__ */ r("pre", { className: "bg-surface-sunken rounded-ds-md p-ds-04 overflow-x-auto text-ds-sm font-mono", children: /* @__PURE__ */ r("code", { children: a }) }),
-      /* @__PURE__ */ r(y, { code: a })
-    ] });
-  const { Highlighter: p, style: g } = n;
-  return /* @__PURE__ */ u("div", { className: l("group relative", i), children: [
-    /* @__PURE__ */ r(
-      p,
-      {
-        language: t,
-        style: g,
-        customStyle: {
-          margin: 0,
-          borderRadius: "var(--radius-md)",
-          fontSize: "var(--font-size-sm)",
-          padding: "var(--spacing-04)"
-        },
-        children: a
-      }
-    ),
-    /* @__PURE__ */ r(y, { code: a })
-  ] });
+function m({ language: t, code: n, mb: i }) {
+	let [s, c] = r.useState(null);
+	if (r.useEffect(() => {
+		let e = !1;
+		return Promise.all([import("react-syntax-highlighter"), import("react-syntax-highlighter/dist/esm/styles/prism/one-dark")]).then(([t, n]) => {
+			e || c({
+				Highlighter: t.Prism ?? t.default,
+				style: n.default
+			});
+		}).catch(() => {}), () => {
+			e = !0;
+		};
+	}, []), !s) return /* @__PURE__ */ o("div", {
+		className: e("group relative", i),
+		children: [/* @__PURE__ */ a("pre", {
+			className: "bg-surface-sunken rounded-ds-md p-ds-04 overflow-x-auto text-ds-sm font-mono",
+			children: /* @__PURE__ */ a("code", { children: n })
+		}), /* @__PURE__ */ a(p, { code: n })]
+	});
+	let { Highlighter: l, style: u } = s;
+	return /* @__PURE__ */ o("div", {
+		className: e("group relative", i),
+		children: [/* @__PURE__ */ a(l, {
+			language: t,
+			style: u,
+			customStyle: {
+				margin: 0,
+				borderRadius: "var(--radius-md)",
+				fontSize: "var(--font-size-sm)",
+				padding: "var(--spacing-04)"
+			},
+			children: n
+		}), /* @__PURE__ */ a(p, { code: n })]
+	});
 }
-const M = d.forwardRef(({
-  content: t,
-  compact: a = !1,
-  allowHtml: i = !1,
-  linkTarget: n = "_blank",
-  className: c,
-  ...p
-}, g) => {
-  const o = a ? "mb-ds-02" : "mb-ds-03", f = a ? "mt-ds-03" : "mt-ds-05";
-  return /* @__PURE__ */ r("div", { ref: g, className: l("font-sans text-surface-fg", c), ...p, children: /* @__PURE__ */ r(
-    C,
-    {
-      remarkPlugins: [S],
-      skipHtml: !i,
-      components: {
-        h1: ({ children: e }) => {
-          const s = h(m(e));
-          return /* @__PURE__ */ u("h1", { id: s, className: l("group", a ? "text-ds-md" : "text-ds-lg", "font-semibold text-surface-fg", f, o), children: [
-            /* @__PURE__ */ r("a", { href: `#${s}`, className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline", "aria-hidden": "true", children: "#" }),
-            e
-          ] });
-        },
-        h2: ({ children: e }) => {
-          const s = h(m(e));
-          return /* @__PURE__ */ u("h2", { id: s, className: l("group", "text-ds-md font-semibold text-surface-fg", a ? "mt-ds-03" : "mt-ds-04", o), children: [
-            /* @__PURE__ */ r("a", { href: `#${s}`, className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline", "aria-hidden": "true", children: "#" }),
-            e
-          ] });
-        },
-        h3: ({ children: e }) => {
-          const s = h(m(e));
-          return /* @__PURE__ */ u("h3", { id: s, className: l("group", "text-ds-md font-semibold text-surface-fg", "mt-ds-03", o), children: [
-            /* @__PURE__ */ r("a", { href: `#${s}`, className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline", "aria-hidden": "true", children: "#" }),
-            e
-          ] });
-        },
-        p: ({ children: e }) => /* @__PURE__ */ r("p", { className: l("text-ds-md text-surface-fg leading-ds-relaxed", o), children: e }),
-        a: ({ href: e, children: s }) => /* @__PURE__ */ r(
-          "a",
-          {
-            href: e,
-            target: n,
-            rel: n === "_blank" ? "noopener noreferrer" : void 0,
-            className: "text-accent-11 hover:underline",
-            children: s
-          }
-        ),
-        code: ({ className: e, children: s, ...N }) => {
-          const x = e ? /language-(\w+)/.exec(e) : null;
-          if (x) {
-            const v = x[1], k = String(s).replace(/\n$/, "");
-            return /* @__PURE__ */ r(j, { language: v, code: k, mb: o });
-          }
-          return /* @__PURE__ */ r("code", { className: "bg-surface-sunken rounded-ds-sm px-1.5 py-0.5 text-ds-sm font-mono text-surface-fg", ...N, children: s });
-        },
-        pre: ({ children: e }) => /* @__PURE__ */ r(w, { children: e }),
-        blockquote: ({ children: e }) => /* @__PURE__ */ r("blockquote", { className: l("border-l-2 border-surface-border-subtle pl-ds-04 text-surface-fg-muted italic", o), children: e }),
-        ul: ({ children: e }) => /* @__PURE__ */ r("ul", { className: l("list-disc pl-ds-06 text-ds-md text-surface-fg space-y-ds-01", o), children: e }),
-        ol: ({ children: e }) => /* @__PURE__ */ r("ol", { className: l("list-decimal pl-ds-06 text-ds-md text-surface-fg space-y-ds-01", o), children: e }),
-        table: ({ children: e }) => /* @__PURE__ */ r("div", { className: l("overflow-x-auto", o), children: /* @__PURE__ */ r("table", { className: "w-full border-collapse", children: e }) }),
-        th: ({ children: e }) => /* @__PURE__ */ r("th", { className: "border border-surface-border-subtle px-ds-03 py-ds-02 text-left text-ds-sm font-semibold bg-surface-sunken", children: e }),
-        td: ({ children: e }) => /* @__PURE__ */ r("td", { className: "border border-surface-border-subtle px-ds-03 py-ds-02 text-ds-sm", children: e }),
-        hr: () => /* @__PURE__ */ r("hr", { className: l("border-surface-border-subtle", a ? "my-ds-03" : "my-ds-04") }),
-        img: ({ src: e, alt: s }) => /* @__PURE__ */ r("img", { src: e, alt: s ?? "", className: "rounded-ds-md max-w-full", loading: "lazy" })
-      },
-      children: t
-    }
-  ) });
+var h = r.forwardRef(({ content: t, compact: n = !1, allowHtml: r = !1, linkTarget: s = "_blank", className: c, ...p }, h) => {
+	let g = n ? "mb-ds-02" : "mb-ds-03", _ = n ? "mt-ds-03" : "mt-ds-05";
+	return /* @__PURE__ */ a("div", {
+		ref: h,
+		className: e("font-sans text-surface-fg", c),
+		...p,
+		children: /* @__PURE__ */ a(l, {
+			remarkPlugins: [u],
+			skipHtml: !r,
+			components: {
+				h1: ({ children: t }) => {
+					let r = d(f(t));
+					return /* @__PURE__ */ o("h1", {
+						id: r,
+						className: e("group", n ? "text-ds-md" : "text-ds-lg", "font-semibold text-surface-fg", _, g),
+						children: [/* @__PURE__ */ a("a", {
+							href: `#${r}`,
+							className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline",
+							"aria-hidden": "true",
+							children: "#"
+						}), t]
+					});
+				},
+				h2: ({ children: t }) => {
+					let r = d(f(t));
+					return /* @__PURE__ */ o("h2", {
+						id: r,
+						className: e("group", "text-ds-md font-semibold text-surface-fg", n ? "mt-ds-03" : "mt-ds-04", g),
+						children: [/* @__PURE__ */ a("a", {
+							href: `#${r}`,
+							className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline",
+							"aria-hidden": "true",
+							children: "#"
+						}), t]
+					});
+				},
+				h3: ({ children: t }) => {
+					let n = d(f(t));
+					return /* @__PURE__ */ o("h3", {
+						id: n,
+						className: e("group", "text-ds-md font-semibold text-surface-fg", "mt-ds-03", g),
+						children: [/* @__PURE__ */ a("a", {
+							href: `#${n}`,
+							className: "opacity-0 group-hover:opacity-100 text-surface-fg-subtle mr-ds-02 no-underline",
+							"aria-hidden": "true",
+							children: "#"
+						}), t]
+					});
+				},
+				p: ({ children: t }) => /* @__PURE__ */ a("p", {
+					className: e("text-ds-md text-surface-fg leading-ds-relaxed", g),
+					children: t
+				}),
+				a: ({ href: e, children: t }) => /* @__PURE__ */ a("a", {
+					href: e,
+					target: s,
+					rel: s === "_blank" ? "noopener noreferrer" : void 0,
+					className: "text-accent-11 hover:underline",
+					children: t
+				}),
+				code: ({ className: e, children: t, ...n }) => {
+					let r = e ? /language-(\w+)/.exec(e) : null;
+					if (r) {
+						let e = r[1];
+						return /* @__PURE__ */ a(m, {
+							language: e,
+							code: String(t).replace(/\n$/, ""),
+							mb: g
+						});
+					}
+					return /* @__PURE__ */ a("code", {
+						className: "bg-surface-sunken rounded-ds-sm px-1.5 py-0.5 text-ds-sm font-mono text-surface-fg",
+						...n,
+						children: t
+					});
+				},
+				pre: ({ children: e }) => /* @__PURE__ */ a(i, { children: e }),
+				blockquote: ({ children: t }) => /* @__PURE__ */ a("blockquote", {
+					className: e("border-l-2 border-surface-border-subtle pl-ds-04 text-surface-fg-muted italic", g),
+					children: t
+				}),
+				ul: ({ children: t }) => /* @__PURE__ */ a("ul", {
+					className: e("list-disc pl-ds-06 text-ds-md text-surface-fg space-y-ds-01", g),
+					children: t
+				}),
+				ol: ({ children: t }) => /* @__PURE__ */ a("ol", {
+					className: e("list-decimal pl-ds-06 text-ds-md text-surface-fg space-y-ds-01", g),
+					children: t
+				}),
+				table: ({ children: t }) => /* @__PURE__ */ a("div", {
+					className: e("overflow-x-auto", g),
+					children: /* @__PURE__ */ a("table", {
+						className: "w-full border-collapse",
+						children: t
+					})
+				}),
+				th: ({ children: e }) => /* @__PURE__ */ a("th", {
+					className: "border border-surface-border-subtle px-ds-03 py-ds-02 text-left text-ds-sm font-semibold bg-surface-sunken",
+					children: e
+				}),
+				td: ({ children: e }) => /* @__PURE__ */ a("td", {
+					className: "border border-surface-border-subtle px-ds-03 py-ds-02 text-ds-sm",
+					children: e
+				}),
+				hr: () => /* @__PURE__ */ a("hr", { className: e("border-surface-border-subtle", n ? "my-ds-03" : "my-ds-04") }),
+				img: ({ src: e, alt: t }) => /* @__PURE__ */ a("img", {
+					src: e,
+					alt: t ?? "",
+					className: "rounded-ds-md max-w-full",
+					loading: "lazy"
+				})
+			},
+			children: t
+		})
+	});
 });
-M.displayName = "MarkdownViewer";
-export {
-  M as MarkdownViewer
-};
+h.displayName = "MarkdownViewer";
+//#endregion
+export { h as MarkdownViewer };