fromsrc 0.0.2 → 0.0.22

package/dist/components/create.js

@@ -5,10 +5,10 @@ import { CopyButton } from './copybutton';
 
 const managers = ["npm", "pnpm", "yarn", "bun"];
 const commands = {
+  bun: "bun create",
   npm: "npm create",
   pnpm: "pnpm create",
-  yarn: "yarn create",
-  bun: "bun create"
+  yarn: "yarn create"
 };
 function CreateBase({ package: pkg = "fromsrc" }) {
   const [active, setActive] = useState("npm");
@@ -21,30 +21,40 @@ function CreateBase({ package: pkg = "fromsrc" }) {
       mapRef.current.set(manager, mapRef.current.size);
     }
   }
-  const getTabId = useCallback((value) => `${id}-tab-${mapRef.current.get(value) ?? 0}`, [id]);
+  const getTabId = useCallback(
+    (value) => `${id}-tab-${mapRef.current.get(value) ?? 0}`,
+    [id]
+  );
   const handleKeyDown = useCallback(
     (e) => {
       const currentIndex = managers.indexOf(active);
       let nextIndex = currentIndex;
       switch (e.key) {
-        case "ArrowLeft":
+        case "ArrowLeft": {
           nextIndex = currentIndex > 0 ? currentIndex - 1 : managers.length - 1;
           break;
-        case "ArrowRight":
+        }
+        case "ArrowRight": {
           nextIndex = currentIndex < managers.length - 1 ? currentIndex + 1 : 0;
           break;
-        case "Home":
+        }
+        case "Home": {
           nextIndex = 0;
           break;
-        case "End":
+        }
+        case "End": {
           nextIndex = managers.length - 1;
           break;
-        default:
+        }
+        default: {
           return;
+        }
       }
       e.preventDefault();
       const next = managers[nextIndex];
-      if (next) setActive(next);
+      if (next) {
+        setActive(next);
+      }
       const tabs = tablistRef.current?.querySelectorAll('[role="tab"]');
       tabs?.[nextIndex]?.focus();
     },
@@ -59,24 +69,24 @@ function CreateBase({ package: pkg = "fromsrc" }) {
       role: "figure",
       "aria-label": `Package manager command: ${command}`,
       style: {
-        position: "relative",
-        margin: "24px 0",
-        borderRadius: "8px",
         backgroundColor: "#0d0d0d",
         border: "1px solid #1c1c1c",
-        overflow: "hidden"
+        borderRadius: "8px",
+        margin: "24px 0",
+        overflow: "hidden",
+        position: "relative"
       },
       children: [
         /* @__PURE__ */ jsxs(
           "div",
           {
             style: {
-              display: "flex",
               alignItems: "center",
-              justifyContent: "space-between",
-              padding: "0 12px",
+              borderBottom: "1px solid #1c1c1c",
+              display: "flex",
               height: "40px",
-              borderBottom: "1px solid #1c1c1c"
+              justifyContent: "space-between",
+              padding: "0 12px"
             },
             children: [
               /* @__PURE__ */ jsx(
@@ -86,7 +96,7 @@ function CreateBase({ package: pkg = "fromsrc" }) {
                   role: "tablist",
                   "aria-label": "Select package manager",
                   onKeyDown: handleKeyDown,
-                  style: { display: "flex", alignItems: "center", gap: "4px" },
+                  style: { alignItems: "center", display: "flex", gap: "4px" },
                   children: managers.map((m, index) => /* @__PURE__ */ jsx(
                     "button",
                     {
@@ -98,14 +108,14 @@ function CreateBase({ package: pkg = "fromsrc" }) {
                       tabIndex: active === m ? 0 : -1,
                       onClick: () => handleTabClick(m),
                       style: {
-                        padding: "4px 10px",
-                        fontSize: "13px",
-                        color: active === m ? "#fafafa" : "#737373",
                         background: "transparent",
                         border: "none",
-                        cursor: "pointer",
                         borderBottom: active === m ? "2px solid #fafafa" : "2px solid transparent",
+                        color: active === m ? "#fafafa" : "#737373",
+                        cursor: "pointer",
+                        fontSize: "13px",
                         marginBottom: "-1px",
+                        padding: "4px 10px",
                         transition: "color 0.15s"
                       },
                       children: m
@@ -126,10 +136,10 @@ function CreateBase({ package: pkg = "fromsrc" }) {
             "aria-labelledby": getTabId(active),
             tabIndex: 0,
             style: {
-              padding: "14px 16px",
+              fontFamily: "var(--font-mono), ui-monospace, monospace",
               fontSize: "13px",
               lineHeight: "1.6",
-              fontFamily: "var(--font-mono), ui-monospace, monospace"
+              padding: "14px 16px"
             },
             children: /* @__PURE__ */ jsxs("code", { children: [
               /* @__PURE__ */ jsx("span", { style: { color: "#7ee787" }, children: commands[active] }),

package/dist/components/definition.js

@@ -14,10 +14,17 @@ const Definition = memo(function Definition2({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs("div", { className: className ?? "border-b border-line pb-4 last:border-0 last:pb-0", ...props, children: [
-    /* @__PURE__ */ jsx("dt", { className: "text-sm font-medium text-fg", children: term }),
-    /* @__PURE__ */ jsx("dd", { className: "mt-1 text-sm text-muted", children })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: className ?? "border-b border-line pb-4 last:border-0 last:pb-0",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsx("dt", { className: "text-sm font-medium text-fg", children: term }),
+        /* @__PURE__ */ jsx("dd", { className: "mt-1 text-sm text-muted", children })
+      ]
+    }
+  );
 });
 const Glossary = memo(function Glossary2({
   className,

package/dist/components/diffview.js

@@ -7,12 +7,17 @@ function computediff(before, after) {
   const afterlines = after.split("\n");
   const m = beforelines.length;
   const n = afterlines.length;
-  const lcs = Array.from({ length: m + 1 }, () => Array(n + 1).fill(0));
+  const lcs = Array.from(
+    { length: m + 1 },
+    () => Array(n + 1).fill(0)
+  );
   for (let i2 = 1; i2 <= m; i2++) {
     for (let j2 = 1; j2 <= n; j2++) {
       const row = lcs[i2];
       const prevrow = lcs[i2 - 1];
-      if (!row || !prevrow) continue;
+      if (!row || !prevrow) {
+        continue;
+      }
       const diag = prevrow[j2 - 1] ?? 0;
       const up = prevrow[j2] ?? 0;
       const left = row[j2 - 1] ?? 0;
@@ -31,22 +36,33 @@ function computediff(before, after) {
   while (i > 0 || j > 0) {
     if (i > 0 && j > 0 && beforelines[i - 1] === afterlines[j - 1]) {
       const content = beforelines[i - 1];
-      if (content === void 0) break;
-      result.unshift({ type: "context", content, beforeNum: beforenum, afterNum: afternum });
+      if (content === void 0) {
+        break;
+      }
+      result.unshift({
+        afterNum: afternum,
+        beforeNum: beforenum,
+        content,
+        type: "context"
+      });
       i--;
       j--;
       beforenum--;
       afternum--;
     } else if (j > 0 && (i === 0 || (lcs[i]?.[j - 1] ?? 0) >= (lcs[i - 1]?.[j] ?? 0))) {
       const content = afterlines[j - 1];
-      if (content === void 0) break;
-      result.unshift({ type: "add", content, afterNum: afternum });
+      if (content === void 0) {
+        break;
+      }
+      result.unshift({ afterNum: afternum, content, type: "add" });
       j--;
       afternum--;
     } else if (i > 0) {
       const content = beforelines[i - 1];
-      if (content === void 0) break;
-      result.unshift({ type: "remove", content, beforeNum: beforenum });
+      if (content === void 0) {
+        break;
+      }
+      result.unshift({ beforeNum: beforenum, content, type: "remove" });
       i--;
       beforenum--;
     }
@@ -54,26 +70,26 @@ function computediff(before, after) {
   return result;
 }
 const containerstyle = {
-  position: "relative",
-  margin: "24px 0",
-  borderRadius: "8px",
   backgroundColor: "#0d0d0d",
   border: "1px solid #1c1c1c",
-  overflow: "hidden"
+  borderRadius: "8px",
+  margin: "24px 0",
+  overflow: "hidden",
+  position: "relative"
 };
 const headerstyle = {
-  display: "flex",
   alignItems: "center",
-  justifyContent: "space-between",
-  padding: "0 16px",
-  height: "40px",
   backgroundColor: "#161b22",
-  borderBottom: "1px solid #1c1c1c"
+  borderBottom: "1px solid #1c1c1c",
+  display: "flex",
+  height: "40px",
+  justifyContent: "space-between",
+  padding: "0 16px"
 };
 const titlestyle = {
-  fontSize: "0.8rem",
+  color: "#a0a0a0",
   fontFamily: "ui-monospace, monospace",
-  color: "#a0a0a0"
+  fontSize: "0.8rem"
 };
 const linestyle = {
   display: "flex",
@@ -82,21 +98,24 @@ const linestyle = {
   lineHeight: "1.6"
 };
 const linenumstyle = {
+  color: "#4a4a4a",
   display: "inline-block",
-  width: "40px",
   padding: "0 8px",
   textAlign: "right",
-  color: "#4a4a4a",
-  userSelect: "none"
+  userSelect: "none",
+  width: "40px"
 };
-function DiffLineComponent({ line, showBefore }) {
+function DiffLineComponent({
+  line,
+  showBefore
+}) {
   const num = showBefore ? line.beforeNum : line.afterNum || line.beforeNum;
   const bg = line.type === "add" ? "rgba(46, 160, 67, 0.15)" : line.type === "remove" ? "rgba(248, 81, 73, 0.15)" : "transparent";
   const color = line.type === "add" ? "#3fb950" : line.type === "remove" ? "#f85149" : "#e6edf3";
   const prefix = line.type === "add" ? "+ " : line.type === "remove" ? "- " : "";
   return /* @__PURE__ */ jsxs("div", { style: { ...linestyle, backgroundColor: bg }, children: [
     /* @__PURE__ */ jsx("span", { style: linenumstyle, children: num }),
-    /* @__PURE__ */ jsx("span", { style: { paddingLeft: "8px", paddingRight: "16px", flex: 1 }, children: /* @__PURE__ */ jsxs("span", { style: { color }, children: [
+    /* @__PURE__ */ jsx("span", { style: { flex: 1, paddingLeft: "8px", paddingRight: "16px" }, children: /* @__PURE__ */ jsxs("span", { style: { color }, children: [
       prefix,
       line.content
     ] }) })
@@ -114,15 +133,30 @@ const DiffView = memo(function DiffView2({
   if (mode === "split") {
     return /* @__PURE__ */ jsxs("figure", { role: "group", style: containerstyle, children: [
       hasheader && /* @__PURE__ */ jsx("div", { style: headerstyle, children: /* @__PURE__ */ jsx("span", { style: titlestyle, children: title || lang }) }),
-      /* @__PURE__ */ jsxs("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", overflow: "auto", maxHeight: "500px" }, children: [
-        /* @__PURE__ */ jsx("div", { style: { borderRight: "1px solid #1c1c1c" }, children: diff.map((line, idx) => line.type === "add" ? null : /* @__PURE__ */ jsx(DiffLineComponent, { line, showBefore: true }, idx)) }),
-        /* @__PURE__ */ jsx("div", { children: diff.map((line, idx) => line.type === "remove" ? null : /* @__PURE__ */ jsx(DiffLineComponent, { line }, idx)) })
-      ] })
+      /* @__PURE__ */ jsxs(
+        "div",
+        {
+          style: {
+            display: "grid",
+            gridTemplateColumns: "1fr 1fr",
+            maxHeight: "500px",
+            overflow: "auto"
+          },
+          children: [
+            /* @__PURE__ */ jsx("div", { style: { borderRight: "1px solid #1c1c1c" }, children: diff.map(
+              (line, idx) => line.type === "add" ? null : /* @__PURE__ */ jsx(DiffLineComponent, { line, showBefore: true }, idx)
+            ) }),
+            /* @__PURE__ */ jsx("div", { children: diff.map(
+              (line, idx) => line.type === "remove" ? null : /* @__PURE__ */ jsx(DiffLineComponent, { line }, idx)
+            ) })
+          ]
+        }
+      )
     ] });
   }
   return /* @__PURE__ */ jsxs("figure", { role: "group", style: containerstyle, children: [
     hasheader && /* @__PURE__ */ jsx("div", { style: headerstyle, children: /* @__PURE__ */ jsx("span", { style: titlestyle, children: title || lang }) }),
-    /* @__PURE__ */ jsx("div", { style: { overflow: "auto", maxHeight: "500px" }, children: diff.map((line, idx) => /* @__PURE__ */ jsx(DiffLineComponent, { line }, idx)) })
+    /* @__PURE__ */ jsx("div", { style: { maxHeight: "500px", overflow: "auto" }, children: diff.map((line, idx) => /* @__PURE__ */ jsx(DiffLineComponent, { line }, idx)) })
   ] });
 });
 

package/dist/components/divider.js

@@ -1,7 +1,11 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { memo } from 'react';
 
-function DividerBase({ label, className, ...props }) {
+function DividerBase({
+  label,
+  className,
+  ...props
+}) {
   if (label) {
     return /* @__PURE__ */ jsxs(
       "div",

package/dist/components/docheader.js

@@ -12,7 +12,14 @@ function DocHeaderBase({
   return /* @__PURE__ */ jsxs("header", { className: `space-y-3 ${className || ""}`, children: [
     breadcrumb && breadcrumb.length > 0 && /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "text-xs text-muted", children: /* @__PURE__ */ jsx("ol", { className: "flex items-center gap-1.5", children: breadcrumb.map((item, i) => /* @__PURE__ */ jsxs("li", { className: "flex items-center gap-1.5", children: [
       i > 0 && /* @__PURE__ */ jsx("span", { "aria-hidden": "true", className: "text-dim", children: "/" }),
-      i === breadcrumb.length - 1 ? /* @__PURE__ */ jsx("span", { "aria-current": "page", className: "text-fg", children: item.label }) : /* @__PURE__ */ jsx("a", { href: item.href, className: "hover:text-fg transition-colors", children: item.label })
+      i === breadcrumb.length - 1 ? /* @__PURE__ */ jsx("span", { "aria-current": "page", className: "text-fg", children: item.label }) : /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: item.href,
+          className: "hover:text-fg transition-colors",
+          children: item.label
+        }
+      )
     ] }, item.href)) }) }),
     /* @__PURE__ */ jsx("h1", { className: "text-3xl font-bold tracking-tight", children: title }),
     description && /* @__PURE__ */ jsx("p", { className: "text-muted text-lg", children: description }),

package/dist/components/doclinkcard.js

@@ -15,17 +15,41 @@ const DocLinkCard = memo(function DocLinkCard2({
       href,
       className: `flex items-center gap-3 p-4 rounded-xl border border-line bg-surface/30 hover:border-fg/20 hover:-translate-y-0.5 hover:shadow-md focus:outline-none focus-visible:ring-2 focus-visible:ring-fg/20 transition-all group ${className ?? ""}`,
       children: [
-        icon && /* @__PURE__ */ jsx("div", { "aria-hidden": "true", className: "shrink-0 size-9 rounded-lg bg-bg border border-line flex items-center justify-center text-muted group-hover:text-fg transition-colors", children: icon }),
+        icon && /* @__PURE__ */ jsx(
+          "div",
+          {
+            "aria-hidden": "true",
+            className: "shrink-0 size-9 rounded-lg bg-bg border border-line flex items-center justify-center text-muted group-hover:text-fg transition-colors",
+            children: icon
+          }
+        ),
         /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0", children: [
           /* @__PURE__ */ jsx("div", { className: "text-sm font-medium text-fg truncate", children: title }),
           description && /* @__PURE__ */ jsx("div", { className: "text-sm text-muted truncate mt-0.5", children: description })
         ] }),
-        /* @__PURE__ */ jsx("svg", { "aria-hidden": "true", className: "shrink-0 size-4 text-muted group-hover:text-fg transition-colors", viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ jsx("path", { d: "M6 4l4 4-4 4" }) })
+        /* @__PURE__ */ jsx(
+          "svg",
+          {
+            "aria-hidden": "true",
+            className: "shrink-0 size-4 text-muted group-hover:text-fg transition-colors",
+            viewBox: "0 0 16 16",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: "2",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsx("path", { d: "M6 4l4 4-4 4" })
+          }
+        )
       ]
     }
   );
 });
-const grid = { 1: "grid-cols-1", 2: "grid-cols-1 md:grid-cols-2", 3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3" };
+const grid = {
+  1: "grid-cols-1",
+  2: "grid-cols-1 md:grid-cols-2",
+  3: "grid-cols-1 md:grid-cols-2 lg:grid-cols-3"
+};
 const DocLinkCards = memo(function DocLinkCards2({
   children,
   columns = 2,

package/dist/components/dropdown.d.ts

@@ -18,6 +18,6 @@ interface DropdownProps {
     items: (DropdownItem | "separator")[];
     align?: "start" | "end";
 }
-declare function Dropdown({ trigger, items, align }: DropdownProps): ReactNode;
+declare function Dropdown({ trigger, items, align, }: DropdownProps): ReactNode;
 
 export { Dropdown, type DropdownItem, type DropdownProps };

package/dist/components/dropdown.js

@@ -4,13 +4,19 @@ import { useState, useRef, useId, useCallback } from 'react';
 import { getNextIndex } from '../hooks/arrownav';
 import { useClickOutside } from '../hooks/clickoutside';
 
-function Dropdown({ trigger, items, align = "start" }) {
+function Dropdown({
+  trigger,
+  items,
+  align = "start"
+}) {
   const [open, setOpen] = useState(false);
   const [index, setIndex] = useState(-1);
   const ref = useRef(null);
   const triggerRef = useRef(null);
   const id = useId();
-  const selectableItems = items.filter((i) => i !== "separator" && !i.disabled);
+  const selectableItems = items.filter(
+    (i) => i !== "separator" && !i.disabled
+  );
   const close = useCallback(() => {
     setOpen(false);
     setIndex(-1);
@@ -27,14 +33,16 @@ function Dropdown({ trigger, items, align = "start" }) {
         return;
       }
       switch (e.key) {
-        case "Escape":
+        case "Escape": {
           close();
           triggerRef.current?.focus();
           e.preventDefault();
           break;
-        case "Tab":
+        }
+        case "Tab": {
           close();
           break;
+        }
         case "ArrowDown":
         case "ArrowUp":
         case "Home":
@@ -44,12 +52,14 @@ function Dropdown({ trigger, items, align = "start" }) {
             current: index,
             wrap: false
           });
-          if (next !== index) setIndex(next);
+          if (next !== index) {
+            setIndex(next);
+          }
           e.preventDefault();
           break;
         }
         case "Enter":
-        case " ":
+        case " ": {
           if (index >= 0) {
             selectableItems[index]?.onClick?.();
             close();
@@ -57,27 +67,38 @@ function Dropdown({ trigger, items, align = "start" }) {
           }
           e.preventDefault();
           break;
+        }
       }
     },
     [open, index, selectableItems, close]
   );
   const menuId = `${id}-menu`;
-  const getItemId = useCallback((itemIndex) => `${id}-item-${itemIndex}`, [id]);
+  const getItemId = useCallback(
+    (itemIndex) => `${id}-item-${itemIndex}`,
+    [id]
+  );
   const handleTriggerClick = useCallback(() => {
     setOpen((prev) => !prev);
   }, []);
   const handleItemClick = useCallback(
     (item) => {
-      if (item.disabled) return;
+      if (item.disabled) {
+        return;
+      }
       item.onClick?.();
       close();
       triggerRef.current?.focus();
     },
     [close]
   );
-  const handleItemHover = useCallback((item, selectableIndex) => {
-    if (!item.disabled) setIndex(selectableIndex);
-  }, []);
+  const handleItemHover = useCallback(
+    (item, selectableIndex) => {
+      if (!item.disabled) {
+        setIndex(selectableIndex);
+      }
+    },
+    []
+  );
   return /* @__PURE__ */ jsxs("div", { ref, className: "relative inline-block", children: [
     /* @__PURE__ */ jsx(
       "div",

package/dist/components/dynamiccode.js

@@ -7,8 +7,8 @@ async function highlight(code, lang, theme) {
   const { codeToHtml } = await import('shiki');
   return codeToHtml(code, {
     lang,
-    theme,
-    structure: "inline"
+    structure: "inline",
+    theme
   });
 }
 const DynamicCode = memo(function DynamicCode2({
@@ -27,7 +27,9 @@ const DynamicCode = memo(function DynamicCode2({
       prevCode.current = code;
       prevLang.current = lang;
       highlight(code, lang, theme).then((result) => {
-        if (!cancelled) setHtml(result);
+        if (!cancelled) {
+          setHtml(result);
+        }
       });
     }
     return () => {

package/dist/components/editlink.js

@@ -4,9 +4,12 @@ import { memo } from 'react';
 
 function buildUrl(repo, path, branch, provider) {
   const [, org, name] = repo.split("/");
-  if (provider === "gitlab") return `https://gitlab.com/${org}/${name}/-/edit/${branch}/${path}`;
-  if (provider === "bitbucket")
+  if (provider === "gitlab") {
+    return `https://gitlab.com/${org}/${name}/-/edit/${branch}/${path}`;
+  }
+  if (provider === "bitbucket") {
     return `https://bitbucket.org/${org}/${name}/src/${branch}/${path}?mode=edit`;
+  }
   return `https://github.com/${org}/${name}/edit/${branch}/${path}`;
 }
 function EditLinkBase({
@@ -18,27 +21,36 @@ function EditLinkBase({
   provider = "github"
 }) {
   const href = buildUrl(repo, path, branch, provider);
-  return /* @__PURE__ */ jsxs("a", { href, target: "_blank", rel: "noopener noreferrer", className, children: [
-    /* @__PURE__ */ jsxs(
-      "svg",
-      {
-        "aria-hidden": "true",
-        width: 14,
-        height: 14,
-        viewBox: "0 0 24 24",
-        fill: "none",
-        stroke: "currentColor",
-        strokeWidth: 2,
-        strokeLinecap: "round",
-        strokeLinejoin: "round",
-        children: [
-          /* @__PURE__ */ jsx("path", { d: "M17 3a2.83 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" }),
-          /* @__PURE__ */ jsx("path", { d: "m15 5 4 4" })
-        ]
-      }
-    ),
-    label
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      href,
+      target: "_blank",
+      rel: "noopener noreferrer",
+      className,
+      children: [
+        /* @__PURE__ */ jsxs(
+          "svg",
+          {
+            "aria-hidden": "true",
+            width: 14,
+            height: 14,
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "currentColor",
+            strokeWidth: 2,
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: [
+              /* @__PURE__ */ jsx("path", { d: "M17 3a2.83 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z" }),
+              /* @__PURE__ */ jsx("path", { d: "m15 5 4 4" })
+            ]
+          }
+        ),
+        label
+      ]
+    }
+  );
 }
 const EditLink = memo(EditLinkBase);
 

package/dist/components/embed.js

@@ -54,15 +54,23 @@ const StackBlitz = memo(function StackBlitz2({
   ) });
 });
 const Tweet = memo(function Tweet2({ id }) {
-  return /* @__PURE__ */ jsx("div", { className: "my-6 flex justify-center", role: "region", "aria-label": "Embedded tweet", children: /* @__PURE__ */ jsx("blockquote", { className: "twitter-tweet", "data-theme": "dark", children: /* @__PURE__ */ jsx(
-    "a",
+  return /* @__PURE__ */ jsx(
+    "div",
     {
-      href: `https://twitter.com/x/status/${id}`,
-      rel: "noopener noreferrer",
-      target: "_blank",
-      children: "Loading tweet..."
+      className: "my-6 flex justify-center",
+      role: "region",
+      "aria-label": "Embedded tweet",
+      children: /* @__PURE__ */ jsx("blockquote", { className: "twitter-tweet", "data-theme": "dark", children: /* @__PURE__ */ jsx(
+        "a",
+        {
+          href: `https://twitter.com/x/status/${id}`,
+          rel: "noopener noreferrer",
+          target: "_blank",
+          children: "Loading tweet..."
+        }
+      ) })
     }
-  ) }) });
+  );
 });
 const Gist = memo(function Gist2({
   id,

package/dist/components/endpoint.d.ts

@@ -18,7 +18,7 @@ interface EndpointProps {
     /** Child content such as parameters and responses */
     children?: ReactNode;
 }
-declare function EndpointBase({ method, path, description, children }: EndpointProps): JSX.Element;
+declare function EndpointBase({ method, path, description, children, }: EndpointProps): JSX.Element;
 declare const Endpoint: react.MemoExoticComponent<typeof EndpointBase>;
 /**
  * Props for the Param component
@@ -35,7 +35,7 @@ interface ParamProps {
     /** Additional content */
     children?: ReactNode;
 }
-declare function ParamBase({ name, type, required, description, children }: ParamProps): JSX.Element;
+declare function ParamBase({ name, type, required, description, children, }: ParamProps): JSX.Element;
 declare const Param: react.MemoExoticComponent<typeof ParamBase>;
 /**
  * Valid HTTP status codes
@@ -52,7 +52,7 @@ interface ResponseProps {
     /** Response body content */
     children?: ReactNode;
 }
-declare function ResponseBase({ status, description, children }: ResponseProps): JSX.Element;
+declare function ResponseBase({ status, description, children, }: ResponseProps): JSX.Element;
 declare const Response: react.MemoExoticComponent<typeof ResponseBase>;
 
 export { Endpoint, type EndpointProps, type Method, Param, type ParamProps, Response, type ResponseProps };