reallysimpledocs 1.0.0-beta.4 → 1.0.0

package/src/runtime/components/mdx/CodeGroup.astro

@@ -1,45 +1,134 @@
 ---
-const { defaultTab, class: className = "" } = Astro.props;
+import { decodeHtml } from "../../lib/html.js";
+
+const { class: className = "" } = Astro.props;
 const id = `code-group-${Math.random().toString(36).slice(2)}`;
 const slotHtml = Astro.slots.has("default") ? await Astro.slots.render("default") : "";
 const normalizedTabs = parseCodeTabs(slotHtml);
-const defaultValue = defaultTab || normalizedTabs[0]?.value;
-const classes = [
-  "relative my-6 w-full max-w-full overflow-hidden rounded-lg [&>[role=tabpanel]]:border-t-0 [&_[data-code-block]]:my-0 [&_[data-code-block]]:min-w-0 [&_[data-code-block]]:rounded-none [&_[data-code-block]>header]:hidden",
-  className,
-];
+const defaultValue = normalizedTabs[0]?.value;
 
 function parseCodeTabs(html) {
   const blocks = [];
-  const pattern =
-    /<div\b(?=[^>]*\bdata-code-block\b)(?=[^>]*\bdata-code-title="([^"]*)")[^>]*>([\s\S]*?)<\/div>/g;
-  let match;
-  while ((match = pattern.exec(html))) {
-    const label = decodeHtml(match[1]).trim();
-    if (!label) continue;
+  for (const block of findCodeFrames(html)) {
+    const label = decodeHtml(block.title).trim();
+    const code = findCodeBlock(block.html);
+    if (!label || !code) continue;
     blocks.push({
       label,
       value: label,
-      html: match[0],
+      html: code.html,
     });
   }
   return blocks;
 }
 
-function decodeHtml(value) {
-  return String(value || "")
-    .replace(/&lt;/g, "<")
-    .replace(/&gt;/g, ">")
-    .replace(/&amp;/g, "&")
-    .replace(/&quot;/g, '"')
-    .replace(/&#39;/g, "'");
+function findCodeFrames(html) {
+  const blocks = [];
+  let cursor = 0;
+
+  while (cursor < html.length) {
+    const open = findNextDiv(html, cursor);
+    if (!open) break;
+    const title = attrValue(open.source, "data-code-title");
+    if (hasClass(open.source, "code-frame") && title) {
+      const close = findMatchingDivClose(html, open.end);
+      if (!close) break;
+      blocks.push({ title, html: html.slice(open.start, close.end) });
+      cursor = close.end;
+      continue;
+    }
+    cursor = open.end;
+  }
+
+  return blocks;
 }
+
+function findCodeBlock(html) {
+  let cursor = 0;
+
+  while (cursor < html.length) {
+    const open = findNextDiv(html, cursor);
+    if (!open) break;
+    if (hasClass(open.source, "code-block")) {
+      const close = findMatchingDivClose(html, open.end);
+      if (!close) return null;
+      return { html: html.slice(open.start, close.end) };
+    }
+    cursor = open.end;
+  }
+
+  return null;
+}
+
+function findMatchingDivClose(html, fromIndex) {
+  let depth = 1;
+  let cursor = fromIndex;
+
+  while (cursor < html.length) {
+    const tag = findNextDiv(html, cursor);
+    if (!tag) return null;
+    depth += tag.closing ? -1 : 1;
+    if (depth === 0) return tag;
+    cursor = tag.end;
+  }
+
+  return null;
+}
+
+function findNextDiv(html, fromIndex) {
+  let cursor = fromIndex;
+  while (cursor < html.length) {
+    const start = html.indexOf("<div", cursor);
+    const closeStart = html.indexOf("</div", cursor);
+    const isClose = closeStart !== -1 && (start === -1 || closeStart < start);
+    const tagStart = isClose ? closeStart : start;
+    if (tagStart === -1) return null;
+
+    const end = findTagEnd(html, tagStart);
+    if (end === -1) return null;
+    return {
+      start: tagStart,
+      end: end + 1,
+      closing: isClose,
+      source: html.slice(tagStart, end + 1),
+    };
+  }
+
+  return null;
+}
+
+function findTagEnd(html, start) {
+  let quote = "";
+  for (let index = start; index < html.length; index += 1) {
+    const char = html[index];
+    if (quote) {
+      if (char === quote) quote = "";
+      continue;
+    }
+    if (char === '"' || char === "'") {
+      quote = char;
+      continue;
+    }
+    if (char === ">") return index;
+  }
+  return -1;
+}
+
+function attrValue(tag, name) {
+  const pattern = new RegExp(`\\s${name}=(["'])(.*?)\\1`, "s");
+  return tag.match(pattern)?.[2] || "";
+}
+
+function hasClass(tag, name) {
+  return attrValue(tag, "class").split(/\s+/).includes(name);
+}
+
 ---
 
-<div class:list={classes} data-code-group>
-  <header class="flex h-10 items-center gap-2 border-b border-border/50 bg-muted/50 px-3 text-sm font-medium">
-    <div class="tabs my-0 min-w-0 max-w-full gap-0">
-      <nav class="h-full justify-start rounded-none bg-transparent p-0" role="tablist" aria-orientation="horizontal" data-variant="line">
+<div class:list={["tabs-frame", className]}>
+  <header>
+    <div class="tabs">
+      <nav role="tablist" aria-orientation="horizontal" data-variant="line">
         {
           normalizedTabs.map((tab, index) => {
             const selected = tab.value === defaultValue;
@@ -66,6 +155,7 @@ function decodeHtml(value) {
       return (
         <div
           role="tabpanel"
+          data-code-panel
           id={`${id}-panel-${index + 1}`}
           aria-labelledby={`${id}-tab-${index + 1}`}
           tabindex="-1"

package/src/runtime/components/mdx/Preview.astro

@@ -4,15 +4,13 @@ import { highlightCode } from "../../lib/highlight.js";
 const { code = "", lang = "html", title = "Preview", class: className = "" } = Astro.props;
 const id = `preview-${Math.random().toString(36).slice(2)}`;
 const html = await highlightCode(code, lang);
+const previewClassName = className || "w-fit";
 ---
 
-<section
-  class="relative my-6 max-w-full overflow-visible rounded-lg border [&>[role=tabpanel]]:border-t-0 [&>[data-code-panel]_[data-code-block]]:my-0 [&>[data-code-panel]_[data-code-block]]:min-w-0 [&>[data-code-panel]_[data-code-block]]:rounded-none"
-  data-preview
->
-  <header class="flex h-10 items-center gap-2 border-b border-border/50 bg-muted/50 px-3 text-sm font-medium">
-    <div class="tabs my-0 min-w-0 max-w-full gap-0">
-      <nav class="h-full justify-start rounded-none bg-transparent p-0" role="tablist" aria-orientation="horizontal" data-variant="line">
+<section class="tabs-frame">
+  <header>
+    <div class="tabs">
+      <nav role="tablist" aria-orientation="horizontal" data-variant="line">
         <button
           type="button"
           role="tab"
@@ -43,9 +41,8 @@ const html = await highlightCode(code, lang);
     aria-labelledby={`${id}-preview-tab`}
     tabindex="-1"
     aria-selected="true"
-    class="flex min-h-64 w-full items-center justify-center p-6"
   >
-    <div class={className}>
+    <div class={previewClassName}>
       <slot />
     </div>
   </section>
@@ -58,10 +55,7 @@ const html = await highlightCode(code, lang);
     aria-selected="false"
     hidden
   >
-    <div
-      class="relative my-6 w-full max-w-full overflow-hidden rounded-lg"
-      data-code-block
-    >
+    <div class="code-block">
       <Fragment set:html={html} />
     </div>
   </section>

package/src/runtime/components/mdx/Steps.astro

@@ -1,11 +1,7 @@
 ---
 const { class: className = "" } = Astro.props;
-const classes = [
-  "mb-12 mt-6 [counter-reset:step] md:ml-4 md:border-l md:pl-8 [&>section]:mb-10 [&>section]:[counter-increment:step] [&>section:last-child]:mb-0 [&>section>*+*]:mt-6 [&>section>*]:leading-relaxed [&>section>*:first-child]:mt-0 [&>section>*:last-child]:mb-0 [&>section>h3+*]:mt-4 [&>section>h3]:relative [&>section>h3]:scroll-m-28 [&>section>h3]:text-lg [&>section>h3]:font-medium [&>section>h3]:tracking-tight [&>section>h3]:before:mr-4 [&>section>h3]:before:inline-flex [&>section>h3]:before:size-7 [&>section>h3]:before:items-center [&>section>h3]:before:justify-center [&>section>h3]:before:rounded-full [&>section>h3]:before:bg-muted [&>section>h3]:before:text-sm [&>section>h3]:before:font-medium [&>section>h3]:before:text-muted-foreground [&>section>h3]:before:content-[counter(step)] md:[&>section>h3]:before:absolute md:[&>section>h3]:before:left-0 md:[&>section>h3]:before:top-0 md:[&>section>h3]:before:mr-0 md:[&>section>h3]:before:-translate-x-[2.875rem]",
-  className,
-];
 ---
 
-<div role="list" class:list={classes}>
+<div role="list" class:list={["steps", className]}>
   <slot />
 </div>

package/src/runtime/components/mdx/Tab.astro

@@ -0,0 +1,6 @@
+---
+const { title } = Astro.props;
+void title;
+---
+
+<slot />

package/src/runtime/components/mdx/Tabs.astro

@@ -1,16 +1,17 @@
 ---
-const { tabs = [], defaultTab, orientation = "horizontal", variant, class: className = "" } = Astro.props;
+const { tabs = [], variant, class: className = "" } = Astro.props;
 const id = `tabs-${Math.random().toString(36).slice(2)}`;
-const normalizedTabs = tabs.map((tab, index) => ({
+const configuredTabs = typeof tabs === "string" ? JSON.parse(tabs) : tabs;
+const normalizedTabs = configuredTabs.map((tab, index) => ({
   ...tab,
   slot: tab.slot || String(index),
   value: tab.value || tab.slot || String(index),
 }));
-const defaultValue = defaultTab || normalizedTabs.find((tab) => !tab.disabled)?.value || normalizedTabs[0]?.value;
+const defaultValue = normalizedTabs[0]?.value;
 ---
 
-<div class:list={["tabs my-6", className]}>
-  <nav role="tablist" aria-orientation={orientation} data-variant={variant}>
+<div class:list={["tabs", className]}>
+  <nav role="tablist" aria-orientation="horizontal" data-variant={variant}>
     {
       normalizedTabs.map((tab, index) => {
         const selected = tab.value === defaultValue;
@@ -21,8 +22,7 @@ const defaultValue = defaultTab || normalizedTabs.find((tab) => !tab.disabled)?.
             id={`${id}-tab-${index + 1}`}
             aria-controls={`${id}-panel-${index + 1}`}
             aria-selected={selected ? "true" : "false"}
-            tabindex={selected && !tab.disabled ? "0" : "-1"}
-            disabled={tab.disabled}
+            tabindex={selected ? "0" : "-1"}
           >
             {tab.label}
           </button>

package/src/runtime/lib/code-meta.js

@@ -0,0 +1,8 @@
+export function parseCodeMeta(meta) {
+  const value = String(meta || "");
+  const title = value.match(/(?:^|\s)title=(?:"([^"]*)"|'([^']*)'|([^\s]+))/);
+
+  return {
+    title: title?.[1] ?? title?.[2] ?? title?.[3] ?? "",
+  };
+}

package/src/runtime/lib/docs.js

@@ -2,9 +2,12 @@ import fs from "node:fs";
 import path from "node:path";
 import { marked } from "marked";
 import GithubSlugger from "github-slugger";
+import { codeToHtml } from "shiki";
 import * as lucideIcons from "lucide-static";
-import { highlightCode as renderHighlightedCode } from "./highlight.js";
-import { mdxToMarkdown } from "./markdown-export.js";
+import { transformBasecoatTablesHtml } from "../../astro/rehype-basecoat-tables.js";
+import { parseCodeMeta } from "./code-meta.js";
+import { escapeHtml } from "./html.js";
+import { normalizeDocMarkdown } from "./markdown-export.js";
 import { markdownPath, routePath } from "./paths.js";
 
 export function getManifest(config) {
@@ -83,14 +86,8 @@ export function getDocMarkdown(config, page) {
   return fs.readFileSync(filePath, "utf8");
 }
 
-export async function getMarkdownExport(config, page) {
-  const source = getDocMarkdown(config, page);
-  if (page.extension === ".mdx") return await mdxToMarkdown(source, config);
-  return `${source.trim()}\n`;
-}
-
-export async function getMarkdownBodyExport(config, page) {
-  return parseDocMarkdown(await getMarkdownExport(config, page), page.title).body.trim();
+export function getMarkdownExport(config, page) {
+  return `${getNormalizedDocMarkdown(config, page).trim()}\n`;
 }
 
 export async function renderDoc(config, page) {
@@ -108,25 +105,10 @@ export async function renderDoc(config, page) {
     return `<h${depth} id="${id}" tabindex="-1"><a class="header-anchor" href="#${id}">${text}</a></h${depth}>`;
   };
 
-  renderer.table = (token) => {
-    const header = renderer.tablerow({
-      text: token.header.map((cell) => renderer.tablecell(cell)).join(""),
-    });
-    const body = token.rows
-      .map((row) =>
-        renderer.tablerow({
-          text: row.map((cell) => renderer.tablecell(cell)).join(""),
-        }),
-      )
-      .join("");
-    const tbody = body ? `<tbody>${body}</tbody>` : "";
-    return `<div class="relative my-6 w-full overflow-auto"><table><thead>${header}</thead>${tbody}</table></div>`;
-  };
-
   const tokens = marked.lexer(content);
-  await highlightMarkdownCode(tokens);
+  await highlightCode(tokens);
   const html = marked.parser(tokens, { renderer });
-  return { page, html, headings };
+  return { page, html: await transformBasecoatTablesHtml(html), headings };
 }
 
 export function getDocHeadings(config, page) {
@@ -159,46 +141,6 @@ export function getNavigation(config, page) {
   };
 }
 
-export function getBreadcrumbs(config, page) {
-  const pages = getPages(config);
-  const bySlug = new Map(pages.map((entry) => [entry.slug, entry]));
-  const trail = [];
-
-  const walk = (items = [], ancestors = []) => {
-    for (const item of items) {
-      if (item?.type === "group") {
-        const result = walk(item.items || [], ancestors);
-        if (result) return result;
-        continue;
-      }
-
-      if (item?.type === "submenu") {
-        const result = walk(item.items || [], item.label ? [...ancestors, { label: item.label }] : ancestors);
-        if (result) return result;
-        continue;
-      }
-
-      const slug = typeof item === "string" ? item : getPageItemSlug(item);
-      if (slug !== page.slug) continue;
-      const matchedPage = bySlug.get(slug);
-      if (!matchedPage) return ancestors;
-      return [
-        ...ancestors,
-        {
-          label: item.label || matchedPage.title,
-          url: matchedPage.path,
-        },
-      ];
-    }
-    return null;
-  };
-
-  const manifest = getManifest(config);
-  const found = walk(manifest.menu || []);
-  if (found) trail.push(...found);
-  return trail;
-}
-
 export function resolveIcon(icon) {
   if (!icon || typeof icon !== "string") return "";
   const trimmed = icon.trim();
@@ -229,35 +171,28 @@ export function buildMenus(config, currentSlug) {
       icon,
       url: page.path,
       label: item.label || page.title,
+      badge: item.badge,
       current: page.slug === currentSlug,
       keywords: page.title,
-    };
-  };
-
-  const processExternalLink = (item) => {
-    if (!item?.url || !item?.label) return null;
-    const external = isExternalUrl(item.url);
-    const attrs = {
-      ...item.attrs,
-      target: external ? item.attrs?.target || "_blank" : item.attrs?.target,
-      rel: external ? item.attrs?.rel || "noopener" : item.attrs?.rel,
-    };
-    return {
-      type: "item",
-      icon: resolveIcon(item.icon),
-      url: item.url,
-      label: item.label,
-      external,
-      attrs,
-      keywords: item.label,
+      attrs: item.attrs,
     };
   };
 
   const processItem = (item) => {
     if (typeof item === "string") return processSlug(item);
+    if (item?.url && item?.label) {
+      return {
+        type: "item",
+        icon: resolveIcon(item.icon),
+        url: item.url,
+        label: item.label,
+        badge: item.badge,
+        external: /^https?:\/\//.test(item.url),
+        attrs: item.attrs,
+      };
+    }
     const slug = getPageItemSlug(item);
     if (slug) return processSlug(slug, item);
-    if (item?.url) return processExternalLink(item);
     if (item?.type === "submenu") {
       const items = (item.items || []).map(processItem).filter(Boolean);
       return {
@@ -287,37 +222,90 @@ export function buildMenus(config, currentSlug) {
       icon: item.icon,
       url: item.url,
       label: item.label,
-      external: item.external,
-      attrs: item.attrs,
       keywords: item.keywords,
+      attrs: item.attrs,
     })),
   }));
 
   return { sidebar, command };
 }
 
-export async function getLlmDocs(config) {
-  const docs = [];
-  for (const page of getPages(config)) {
-    docs.push({
-      ...page,
-      content: await getMarkdownBodyExport(config, page),
-    });
-  }
-  return docs;
+export function getLlmDocs(config) {
+  return getPages(config).map((page) => ({
+    ...page,
+    content: getNormalizedDocMarkdown(config, page, { includeTitle: false }).trim(),
+  }));
 }
 
-export async function getSearchDocs(config) {
-  const docs = [];
-  for (const page of getPages(config)) {
-    docs.push({
+export function getSearchDocs(config) {
+  const pages = getPages(config);
+  const trails = getPageTrails(config, pages);
+
+  return pages.map((page) => {
+    const markdown = getNormalizedDocMarkdown(config, page, { includeTitle: false });
+    const { prose, code } = splitFencedMarkdown(markdown);
+    const trail = trails.get(page.slug) || [page.title];
+
+    return {
       slug: page.slug,
       title: page.title,
+      breadcrumb: trail.length > 1 ? trail.join(" › ") : "",
       path: page.path,
-      body: markdownPlainText(await getMarkdownBodyExport(config, page)),
+      body: markdownPlainText(prose),
+      code: markdownPlainText(code),
+    };
+  });
+}
+
+function getPageTrails(config, pages) {
+  const manifest = getManifest(config);
+  const pagesBySlug = new Map(pages.map((page) => [page.slug, page]));
+  const trails = new Map();
+
+  const pageLabel = (item, slug) => {
+    if (typeof item === "object" && item?.label) return item.label;
+    return pagesBySlug.get(slug)?.title || fallbackLabelFromSlug(slug);
+  };
+
+  const walk = (items = [], parents = []) => {
+    items.forEach((item) => {
+      if (typeof item === "string") {
+        trails.set(item, [...parents, pageLabel(item, item)]);
+        return;
+      }
+
+      if (item?.type === "submenu") {
+        walk(item.items || [], [...parents, item.label].filter(Boolean));
+        return;
+      }
+
+      const slug = getPageItemSlug(item);
+      if (slug) trails.set(slug, [...parents, pageLabel(item, slug)]);
     });
-  }
-  return docs;
+  };
+
+  (manifest.menu || []).forEach((group) => {
+    if (group?.type === "group") walk(group.items || []);
+  });
+
+  return trails;
+}
+
+function splitFencedMarkdown(markdown) {
+  const code = [];
+  const prose = String(markdown || "").replace(/```[^\n]*\n([\s\S]*?)```/g, (_, block) => {
+    code.push(block);
+    return "\n";
+  });
+
+  return { prose, code: code.join("\n\n") };
+}
+
+function getNormalizedDocMarkdown(config, page, { includeTitle = true } = {}) {
+  const source = getDocMarkdown(config, page);
+  const parsed = parseDocMarkdown(source, page.title);
+  const body = normalizeDocMarkdown(renderNunjucksCompat(parsed.body), collectMdxExports(source));
+  return includeTitle ? `# ${parsed.title}\n\n${body}` : body;
 }
 
 function flattenSidebarItems(items = []) {
@@ -329,10 +317,6 @@ export function getPageItemSlug(item) {
   return item.slug || item.page || "";
 }
 
-function isExternalUrl(url) {
-  return /^[a-z][a-z0-9+.-]*:/i.test(String(url || ""));
-}
-
 function parseDocMarkdown(source, fallbackTitle) {
   const content = normalizeDocSource(source);
   const tokens = marked.lexer(content);
@@ -355,6 +339,15 @@ function markdownPlainText(markdown) {
   return tokensText(marked.lexer(renderNunjucksCompat(normalizeDocSource(markdown))));
 }
 
+function collectMdxExports(source) {
+  const values = new Map();
+  const pattern = /export\s+const\s+([A-Za-z_$][\w$]*)\s*=\s*`([\s\S]*?)`;/g;
+  for (const match of String(source || "").matchAll(pattern)) {
+    values.set(match[1], match[2].replace(/\\n/g, "\n").replace(/\\`/g, "`"));
+  }
+  return values;
+}
+
 function normalizeDocSource(source) {
   const withoutFrontmatter = String(source || "")
     .trimStart()
@@ -366,10 +359,10 @@ function normalizeDocSource(source) {
     .trimStart();
 }
 
-async function highlightMarkdownCode(tokens) {
+async function highlightCode(tokens) {
   for (const token of tokens) {
     if (token.type === "code") {
-      const html = await highlightToken(token);
+      const html = codeBlockHtml(token, await highlightToken(token));
       Object.assign(token, {
         type: "html",
         raw: html,
@@ -380,24 +373,39 @@ async function highlightMarkdownCode(tokens) {
     }
 
     for (const childTokens of nestedTokenLists(token)) {
-      await highlightMarkdownCode(childTokens);
+      await highlightCode(childTokens);
     }
   }
 }
 
+function codeBlockHtml(token, html) {
+  const title = parseCodeMeta(token.lang).title;
+  if (!title) return html;
+  return `<div class="code-frame" data-code-title="${escapeHtml(title)}"><header><span>${escapeHtml(title)}</span></header><div class="code-block">${html}</div></div>`;
+}
+
 async function highlightToken(token) {
-  const lang = normalizeLanguage(token.lang);
   try {
-    return wrapCodeBlock(await renderHighlightedCode(token.text, lang));
+    return await codeToHtml(token.text, {
+      lang: normalizeLanguage(token.lang),
+      themes: {
+        light: "github-light",
+        dark: "github-dark",
+      },
+      defaultColor: false,
+    });
   } catch {
-    return wrapCodeBlock(await renderHighlightedCode(token.text, "text"));
+    return codeToHtml(token.text, {
+      lang: "text",
+      themes: {
+        light: "github-light",
+        dark: "github-dark",
+      },
+      defaultColor: false,
+    });
   }
 }
 
-function wrapCodeBlock(html) {
-  return `<div class="relative my-6 w-full max-w-full overflow-hidden rounded-lg" data-code-block>${html}</div>`;
-}
-
 function normalizeLanguage(lang) {
   const value = lang?.trim().split(/\s+/)[0].toLowerCase() || "text";
   if (value === "njk") return "html";
@@ -427,6 +435,7 @@ function plainText(tokens) {
 function tokensText(tokens) {
   return tokens
     .map((token) => {
+      if (token.type === "html") return htmlText(token.raw || token.text || "");
       const childTokens = [];
       if (token.tokens) childTokens.push(token.tokens);
       if (token.items) childTokens.push(...token.items.flatMap((item) => (item.tokens ? [item.tokens] : [])));
@@ -438,3 +447,16 @@ function tokensText(tokens) {
     .replace(/\s+/g, " ")
     .trim();
 }
+
+function htmlText(html) {
+  return String(html || "")
+    .replace(/<script\b[\s\S]*?<\/script>/gi, " ")
+    .replace(/<style\b[\s\S]*?<\/style>/gi, " ")
+    .replace(/<[^>]+>/g, " ")
+    .replace(/&nbsp;/g, " ")
+    .replace(/&amp;/g, "&")
+    .replace(/&lt;/g, "<")
+    .replace(/&gt;/g, ">")
+    .replace(/&quot;/g, '"')
+    .replace(/&#39;/g, "'");
+}

package/src/runtime/lib/highlight.js

@@ -3,7 +3,7 @@ import { codeToHtml } from "shiki";
 export async function highlightCode(code, lang = "text") {
   const value = String(code || "");
   const language = String(lang || "text").toLowerCase() === "mdx" ? "tsx" : String(lang || "text");
-  const html = await codeToHtml(value, {
+  return codeToHtml(value, {
     lang: language,
     themes: {
       light: "github-light",
@@ -11,17 +11,4 @@ export async function highlightCode(code, lang = "text") {
     },
     defaultColor: false,
   });
-  return addCodeLayoutClasses(html);
-}
-
-function addCodeLayoutClasses(html) {
-  return String(html)
-    .replace(
-      /<pre class="/,
-      '<pre class="!my-0 max-w-full overflow-x-auto !rounded-none !border-0 ',
-    )
-    .replace(
-      /<code>/,
-      '<code class="block min-w-full w-max px-4 py-3 text-[13px]">',
-    );
 }