laif-ds
Version:
Design System di Laif con componenti React basati su principi di Atomic Design
124 lines (123 loc) • 4.4 kB
JavaScript
"use client";
import { jsx as t, jsxs as p, Fragment as b } from "react/jsx-runtime";
import y, { Suspense as x } from "react";
import { cn as g } from "../../lib/utils.js";
import { CopyButton as k } from "./copy-button.js";
import { Markdown as N } from "../../node_modules/react-markdown/lib/index.js";
import v from "../../node_modules/remark-gfm/lib/index.js";
function q({ children: e }) {
return /* @__PURE__ */ t("div", { className: "space-y-3", children: /* @__PURE__ */ t(N, { remarkPlugins: [v], components: C, children: e }) });
}
const h = y.memo(
async ({ children: e, language: o, ...n }) => {
const { codeToTokens: i, bundledLanguages: d } = await import("../../node_modules/shiki/dist/index.js");
if (!(o in d))
return /* @__PURE__ */ t("pre", { ...n, children: e });
const { tokens: a } = await i(e, {
lang: o,
defaultColor: !1,
themes: {
light: "github-light",
dark: "github-dark"
}
});
return /* @__PURE__ */ t("pre", { ...n, children: /* @__PURE__ */ t("code", { children: a.map((m, c) => /* @__PURE__ */ p(b, { children: [
/* @__PURE__ */ t("span", { children: m.map((l, u) => {
const f = typeof l.htmlStyle == "string" ? void 0 : l.htmlStyle;
return /* @__PURE__ */ t(
"span",
{
className: "text-shiki-light bg-shiki-light-bg dark:text-shiki-dark dark:bg-shiki-dark-bg",
style: f,
children: l.content
},
u
);
}) }, c),
c !== a.length - 1 && `
`
] })) }) });
}
);
h.displayName = "HighlightedCode";
const w = ({
children: e,
className: o,
language: n,
...i
}) => {
const d = typeof e == "string" ? e : s(e), a = g(
"overflow-x-scroll rounded-md border bg-d-background/50 p-4 font-mono text-sm [scrollbar-width:none]",
o
);
return /* @__PURE__ */ p("div", { className: "group/code relative mb-4", children: [
/* @__PURE__ */ t(
x,
{
fallback: /* @__PURE__ */ t("pre", { className: a, ...i, children: e }),
children: /* @__PURE__ */ t(h, { language: n, className: a, children: d })
}
),
/* @__PURE__ */ t("div", { className: "invisible absolute top-2 right-2 flex space-x-1 rounded-lg p-1 opacity-0 transition-all duration-200 group-hover/code:visible group-hover/code:opacity-100", children: /* @__PURE__ */ t(k, { content: d, copyMessage: "Copied code to clipboard" }) })
] });
};
function s(e) {
var o;
if (typeof e == "string")
return e;
if ((o = e == null ? void 0 : e.props) != null && o.children) {
let n = e.props.children;
return Array.isArray(n) ? n.map((i) => s(i)).join("") : s(n);
}
return "";
}
const C = {
h1: r("h1", "text-2xl font-semibold"),
h2: r("h2", "font-semibold text-xl"),
h3: r("h3", "font-semibold text-lg"),
h4: r("h4", "font-semibold text-base"),
h5: r("h5", "font-medium"),
strong: r("strong", "font-semibold"),
a: r("a", "text-d-primary underline underline-offset-2"),
blockquote: r("blockquote", "border-l-2 border-d-primary pl-4"),
code: ({ children: e, className: o, node: n, ...i }) => {
const d = /language-(\w+)/.exec(o || "");
return d ? /* @__PURE__ */ t(w, { className: o, language: d[1], ...i, children: e }) : /* @__PURE__ */ t(
"code",
{
className: g(
"[:not(pre)>&]:bg-d-background/50 font-mono [:not(pre)>&]:rounded-md [:not(pre)>&]:px-1 [:not(pre)>&]:py-0.5"
),
...i,
children: e
}
);
},
pre: ({ children: e }) => e,
ol: r("ol", "list-decimal space-y-2 pl-6"),
ul: r("ul", "list-disc space-y-2 pl-6"),
li: r("li", "my-1.5"),
table: r(
"table",
"w-full border-collapse overflow-y-auto rounded-md border border-foreground/20"
),
th: r(
"th",
"border border-foreground/20 px-4 py-2 text-left font-bold [&[align=center]]:text-center [&[align=right]]:text-right"
),
td: r(
"td",
"border border-foreground/20 px-4 py-2 text-left [&[align=center]]:text-center [&[align=right]]:text-right"
),
tr: r("tr", "m-0 border-t p-0 even:bg-d-secondary"),
p: r("p", "whitespace-pre-wrap"),
hr: r("hr", "border-foreground/20")
};
function r(e, o) {
const n = ({ node: i, ...d }) => /* @__PURE__ */ t(e, { className: o, ...d });
return n.displayName = String(e), n;
}
export {
q as MarkdownRenderer,
q as default
};