@roottale/cms-renderer-next 0.10.0 → 0.12.0

package/dist/routes.js

@@ -0,0 +1,110 @@
+// src/routes.ts
+import {
+  fetchPosts,
+  generateRssXml,
+  rssItemsFromPosts
+} from "@roottale/cms-client/server";
+import {
+  verifyRootTaleWebhook
+} from "@roottale/cms-client/webhook";
+function trimSlash(u) {
+  return u.replace(/\/+$/, "");
+}
+async function safeFetchPosts(config, limit) {
+  try {
+    const page = await fetchPosts({
+      apiKey: config.apiKey,
+      baseUrl: config.apiBase,
+      type: "post",
+      limit
+    });
+    return page.items;
+  } catch (err) {
+    console.error("[@roottale/cms-renderer-next/routes] fetchPosts \uC2E4\uD328:", err);
+    return [];
+  }
+}
+function createFeedRoute(config) {
+  return async function GET() {
+    const siteUrl = trimSlash(config.siteUrl);
+    const blogBase = config.blogBasePath ?? "/blog";
+    const posts = await safeFetchPosts(config, 50);
+    const xml = generateRssXml({
+      title: config.title,
+      link: `${siteUrl}${blogBase}`,
+      feedUrl: `${siteUrl}/feed.xml`,
+      description: config.description,
+      language: config.language,
+      items: rssItemsFromPosts(posts, {
+        postUrl: (p) => `${siteUrl}${blogBase}/${p.slug}`
+      })
+    });
+    return new Response(xml, {
+      headers: {
+        "content-type": "application/rss+xml; charset=utf-8",
+        "cache-control": "public, max-age=1800, s-maxage=1800"
+      }
+    });
+  };
+}
+function createSitemap(config, staticRoutes = []) {
+  return async function sitemap() {
+    const siteUrl = trimSlash(config.siteUrl);
+    const blogBase = config.blogBasePath ?? "/blog";
+    const posts = await safeFetchPosts(config, 200);
+    const postEntries = posts.map((p) => ({
+      url: `${siteUrl}${blogBase}/${p.slug}`,
+      lastModified: p.updatedAt ?? p.publishedAt ?? void 0,
+      changeFrequency: "weekly",
+      priority: 0.6
+    }));
+    return [...staticRoutes, ...postEntries];
+  };
+}
+function pathsFromBody(rawBody) {
+  try {
+    const body = JSON.parse(rawBody);
+    if (Array.isArray(body.paths)) {
+      return body.paths.filter((p) => typeof p === "string");
+    }
+  } catch {
+  }
+  return [];
+}
+function createRevalidateRoute(config) {
+  const blogBase = config.blogBasePath ?? "/blog";
+  const alsoRevalidate = config.alsoRevalidate ?? [
+    "/feed.xml",
+    "/sitemap.xml",
+    blogBase
+  ];
+  return async function POST(req) {
+    const rawBody = await req.text();
+    const result = await verifyRootTaleWebhook({
+      rawBody,
+      headers: req.headers,
+      apiKey: config.apiKey,
+      apiBase: config.apiBase,
+      consumeJti: config.consumeJti
+    });
+    if (!result.ok) {
+      return Response.json({ ok: false, reason: result.reason }, { status: 401 });
+    }
+    const paths = [.../* @__PURE__ */ new Set([...pathsFromBody(rawBody), ...alsoRevalidate])];
+    for (const p of paths) {
+      await config.revalidate(p);
+    }
+    return Response.json({
+      ok: true,
+      event: result.event,
+      deliveryId: result.deliveryId,
+      revalidated: paths
+    });
+  };
+}
+export {
+  createFeedRoute,
+  createRevalidateRoute,
+  createSitemap
+};
+//# sourceMappingURL=routes.js.map

package/dist/routes.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/routes.ts"],"sourcesContent":["/**\n * `@roottale/cms-renderer-next/routes` — Next.js App Router 통합 라우트 팩토리.\n *\n * 외부 고객사 사이트가 매번 직접 작성하던 공통 라우트(RSS feed / sitemap /\n * revalidate webhook)를 1줄 팩토리로 표준화. 블로그 조회와 *동일한* 단일\n * customer API key(`ROOTTALE_API_KEY`)를 사용한다.\n *\n * 설계 원칙:\n * - feed/sitemap 은 `fetchPosts` 실패를 swallow → 라우트가 *항상 200* (빌드 시\n *   정적 생성이 throw 해서 404 나는 사고 방지).\n * - revalidate 는 admin(mysite.roottale.com)에서 글/카테고리/미디어 변경 시 보내는\n *   서명 webhook 을 검증하고, 본문 paths + 파생 경로(feed·sitemap·블로그 인덱스)를\n *   모두 revalidate → 각 사이트에 자동 반영.\n * - `next` 에 직접 의존하지 않음: revalidate 콜백(`revalidatePath`)을 주입받는다.\n *\n * 사용 예는 roottale-docs `services/external-site-integration.md` 참조.\n */\n\nimport {\n  fetchPosts,\n  generateRssXml,\n  rssItemsFromPosts,\n  type CmsPostContent,\n} from \"@roottale/cms-client/server\";\nimport {\n  verifyRootTaleWebhook,\n  type VerifyRootTaleWebhookResult,\n} from \"@roottale/cms-client/webhook\";\n\nexport interface RootTaleSiteConfig {\n  /** `rtlk_cust_*` — 블로그 조회와 같은 키. 서버에서만(절대 브라우저 금지). */\n  apiKey: string;\n  /** API base 오버라이드. 기본 `https://api.roottale.com`. */\n  apiBase?: string;\n  /** 사이트 절대 URL (뒤 슬래시 없이). 예: `https://kjmtax.roottale.app`. */\n  siteUrl: string;\n  /** 피드/사이트 제목. */\n  title: string;\n  description?: string;\n  /** 기본 \"ko-KR\". */\n  language?: string;\n  /** 블로그 base path. 기본 \"/blog\". */\n  blogBasePath?: string;\n}\n\nfunction trimSlash(u: string): string {\n  return u.replace(/\\/+$/, \"\");\n}\n\nasync function safeFetchPosts(\n  config: RootTaleSiteConfig,\n  limit: number,\n): Promise<CmsPostContent[]> {\n  try {\n    const page = await fetchPosts({\n      apiKey: config.apiKey,\n      baseUrl: config.apiBase,\n      type: \"post\",\n      limit,\n    });\n    return page.items;\n  } catch (err) {\n    // 빌드/런타임 fetch 실패 시 빈 목록 — 라우트는 항상 정상 응답(404 방지).\n    console.error(\"[@roottale/cms-renderer-next/routes] fetchPosts 실패:\", err);\n    return [];\n  }\n}\n\n/**\n * `app/feed.xml/route.ts` 용 GET 핸들러. RSS 2.0.\n *\n * ```ts\n * import { createFeedRoute } from \"@roottale/cms-renderer-next/routes\";\n * export const dynamic = \"force-dynamic\";\n * export const GET = createFeedRoute({\n *   apiKey: process.env.ROOTTALE_API_KEY!,\n *   siteUrl: \"https://example.com\",\n *   title: \"Example 블로그\",\n *   description: \"...\",\n * });\n * ```\n */\nexport function createFeedRoute(\n  config: RootTaleSiteConfig,\n): () => Promise<Response> {\n  return async function GET(): Promise<Response> {\n    const siteUrl = trimSlash(config.siteUrl);\n    const blogBase = config.blogBasePath ?? \"/blog\";\n    const posts = await safeFetchPosts(config, 50);\n    const xml = generateRssXml({\n      title: config.title,\n      link: `${siteUrl}${blogBase}`,\n      feedUrl: `${siteUrl}/feed.xml`,\n      description: config.description,\n      language: config.language,\n      items: rssItemsFromPosts(posts, {\n        postUrl: (p) => `${siteUrl}${blogBase}/${p.slug}`,\n      }),\n    });\n    return new Response(xml, {\n      headers: {\n        \"content-type\": \"application/rss+xml; charset=utf-8\",\n        \"cache-control\": \"public, max-age=1800, s-maxage=1800\",\n      },\n    });\n  };\n}\n\n/** Next `MetadataRoute.Sitemap[number]` 와 구조 호환(타입 결합 회피). */\nexport interface SitemapEntry {\n  url: string;\n  lastModified?: string | Date;\n  changeFrequency?:\n    | \"always\"\n    | \"hourly\"\n    | \"daily\"\n    | \"weekly\"\n    | \"monthly\"\n    | \"yearly\"\n    | \"never\";\n  priority?: number;\n}\n\n/**\n * `app/sitemap.ts` default export. 정적 경로 + 글 경로를 합친다.\n *\n * ```ts\n * import { createSitemap } from \"@roottale/cms-renderer-next/routes\";\n * export default createSitemap(\n *   { apiKey: process.env.ROOTTALE_API_KEY!, siteUrl: \"https://example.com\", title: \"...\" },\n *   [{ url: \"https://example.com\", changeFrequency: \"weekly\", priority: 1 }],\n * );\n * ```\n */\nexport function createSitemap(\n  config: RootTaleSiteConfig,\n  staticRoutes: SitemapEntry[] = [],\n): () => Promise<SitemapEntry[]> {\n  return async function sitemap(): Promise<SitemapEntry[]> {\n    const siteUrl = trimSlash(config.siteUrl);\n    const blogBase = config.blogBasePath ?? \"/blog\";\n    const posts = await safeFetchPosts(config, 200);\n    const postEntries: SitemapEntry[] = posts.map((p) => ({\n      url: `${siteUrl}${blogBase}/${p.slug}`,\n      lastModified: p.updatedAt ?? p.publishedAt ?? undefined,\n      changeFrequency: \"weekly\",\n      priority: 0.6,\n    }));\n    return [...staticRoutes, ...postEntries];\n  };\n}\n\nexport interface RevalidateRouteConfig {\n  /** `rtlk_cust_*` — 블로그 조회/webhook 검증 공통 키. */\n  apiKey: string;\n  apiBase?: string;\n  /** Next 의 `revalidatePath` (또는 동등 콜백) 주입. */\n  revalidate: (path: string) => void | Promise<void>;\n  /** 블로그 base path. 기본 \"/blog\". */\n  blogBasePath?: string;\n  /**\n   * 모든 글/분류/미디어 변경에 대해 *항상 함께* revalidate 할 파생 경로.\n   * 피드·사이트맵·블로그 인덱스처럼 \"글 목록\"에 의존하는 경로 — admin 변경이\n   * 자동 반영되려면 필수. 기본: [\"/feed.xml\", \"/sitemap.xml\", blogBase].\n   */\n  alsoRevalidate?: string[];\n  /** (옵션) jti replay 방지 hook (cms-client verify 로 전달). */\n  consumeJti?: (jti: string, exp: number) => Promise<\"new\" | \"seen\">;\n}\n\n/** webhook 본문에서 paths[] 추출(서명 검증 후 호출 — body_hash 가 binding). */\nfunction pathsFromBody(rawBody: string): string[] {\n  try {\n    const body = JSON.parse(rawBody) as { paths?: unknown };\n    if (Array.isArray(body.paths)) {\n      return body.paths.filter((p): p is string => typeof p === \"string\");\n    }\n  } catch {\n    /* 비-JSON 본문 — 파생 경로만 revalidate */\n  }\n  return [];\n}\n\n/**\n * `app/api/revalidate/route.ts` 용 POST 핸들러.\n *\n * admin(mysite.roottale.com)이 글/카테고리/미디어 변경 시 보내는 서명 webhook 을\n * 검증하고, 본문 paths + 파생 경로(feed·sitemap·블로그 인덱스)를 revalidate.\n *\n * ```ts\n * import { revalidatePath } from \"next/cache\";\n * import { createRevalidateRoute } from \"@roottale/cms-renderer-next/routes\";\n * export const POST = createRevalidateRoute({\n *   apiKey: process.env.ROOTTALE_API_KEY!,\n *   revalidate: revalidatePath,\n * });\n * ```\n */\nexport function createRevalidateRoute(\n  config: RevalidateRouteConfig,\n): (req: Request) => Promise<Response> {\n  const blogBase = config.blogBasePath ?? \"/blog\";\n  const alsoRevalidate = config.alsoRevalidate ?? [\n    \"/feed.xml\",\n    \"/sitemap.xml\",\n    blogBase,\n  ];\n\n  return async function POST(req: Request): Promise<Response> {\n    const rawBody = await req.text();\n    const result: VerifyRootTaleWebhookResult = await verifyRootTaleWebhook({\n      rawBody,\n      headers: req.headers,\n      apiKey: config.apiKey,\n      apiBase: config.apiBase,\n      consumeJti: config.consumeJti,\n    });\n    if (!result.ok) {\n      return Response.json({ ok: false, reason: result.reason }, { status: 401 });\n    }\n\n    // 본문 paths + 파생 경로(항상) — 중복 제거.\n    const paths = [...new Set([...pathsFromBody(rawBody), ...alsoRevalidate])];\n    for (const p of paths) {\n      await config.revalidate(p);\n    }\n\n    return Response.json({\n      ok: true,\n      event: result.event,\n      deliveryId: result.deliveryId,\n      revalidated: paths,\n    });\n  };\n}\n"],"mappings":"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","names":[]}

package/dist/server.d.ts

@@ -31,24 +31,24 @@ declare function RootTalePostCard(props: RootTalePostCardProps): ReactElement;
 /**
  * `@roottale/cms-renderer/toc` — Tiptap doc → TOC entries + heading id injection.
  *
- * Server-only utility. Walks a Tiptap JSON doc, extracts H2/H3 headings, and
+ * Server-only utility. Walks a Tiptap JSON doc, extracts H1-H4 headings, and
  * derives stable kebab-case ids (Korean-safe). The companion `attachHeadingIds`
- * mutates a shallow clone of the doc so renderers can emit `<h2 id="...">`
- * anchors that match what `<RootTaleTableOfContents>` links to.
+ * mutates a shallow clone of the doc so renderers can emit heading anchors
+ * that match what `<RootTaleTableOfContents>` links to.
  *
  * Internal ancestor: `roottale-internal/packages/cms-renderer/src/toc.ts`
  * (HTML-string based, vendored snapshot). Ported to Tiptap-JSON because the
  * platform renderer no longer round-trips through HTML before render.
  */
 interface TocEntry {
-    level: 2 | 3;
+    level: 2 | 3 | 4;
     text: string;
     id: string;
 }
 declare function headingToId(text: string): string;
 declare function extractToc(doc: Record<string, unknown>): TocEntry[];
 /**
- * Returns a shallow-cloned Tiptap doc where each H2/H3 carries the matching
+ * Returns a shallow-cloned Tiptap doc where each H1-H4 carries the matching
  * `attrs.id` from `entries` (same order as `extractToc` returns). Existing
  * `id` attrs are overwritten so renderer + TOC always agree on anchors.
  */
@@ -232,7 +232,7 @@ type RootTaleBlogPostProps = {
     notFoundElement?: ReactElement;
     /**
      * When true, prepends an auto-derived `<RootTaleTableOfContents>` before
-     * the article body (H2/H3 headings only). Default: false — keep markup
+     * the article body (H2-H4 headings only). Default: false — keep markup
      * stable for customers who already control their own layout.
      */
     showTableOfContents?: boolean;

package/dist/server.js

@@ -16,14 +16,18 @@ function RootTalePostCard(props) {
   const showDate = display ? display.showDate : true;
   const showAuthor = display ? display.showAuthor : false;
   const authorName = post.authorName;
-  const meta = [
-    showDate ? formatPublishedDate(post.publishedAt) : null,
-    showAuthor && authorName ? `\uC791\uC131\uC790 ${authorName}` : null
-  ].filter(Boolean).join(" \xB7 ");
+  const publishedDate = showDate ? formatPublishedDate(post.publishedAt) : "";
   return /* @__PURE__ */ jsx("article", { "data-roottale-cms": "card", className: "rt-cms-card", children: /* @__PURE__ */ jsxs("a", { className: "rt-cms-card-link", href: href(post), children: [
-    meta ? /* @__PURE__ */ jsx("p", { className: "rt-cms-meta", children: meta }) : null,
+    publishedDate || showAuthor && authorName ? /* @__PURE__ */ jsxs("p", { className: "rt-cms-meta", children: [
+      publishedDate ? /* @__PURE__ */ jsx("span", { className: "rt-cms-meta-item", "data-rt-cms-meta": "date", children: publishedDate }) : null,
+      showAuthor && authorName ? /* @__PURE__ */ jsxs("span", { className: "rt-cms-meta-item", "data-rt-cms-meta": "author", children: [
+        "\uC791\uC131\uC790 ",
+        authorName
+      ] }) : null
+    ] }) : null,
     /* @__PURE__ */ jsx("h2", { className: "rt-cms-title", children: post.title }),
-    post.excerpt ? /* @__PURE__ */ jsx("p", { className: "rt-cms-excerpt", children: post.excerpt }) : null
+    post.excerpt ? /* @__PURE__ */ jsx("p", { className: "rt-cms-excerpt", children: post.excerpt }) : null,
+    /* @__PURE__ */ jsx("span", { className: "rt-cms-card-action", "aria-hidden": "true", children: "\uC77D\uAE30" })
   ] }) });
 }
 function defaultHref(post) {
@@ -44,8 +48,11 @@ import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function RootTaleTableOfContents(props) {
   const { entries, title = "\uBAA9\uCC28" } = props;
   if (entries.length === 0) return null;
-  return /* @__PURE__ */ jsxs2("nav", { "data-roottale-cms": "toc", className: "rt-cms-toc", "aria-label": title, children: [
-    title ? /* @__PURE__ */ jsx2("p", { className: "rt-cms-toc-title", children: title }) : null,
+  return /* @__PURE__ */ jsx2("nav", { "data-roottale-cms": "toc", className: "rt-cms-toc", "aria-label": title, children: /* @__PURE__ */ jsxs2("details", { className: "rt-cms-toc-details", open: true, children: [
+    /* @__PURE__ */ jsxs2("summary", { className: "rt-cms-toc-summary", children: [
+      title ? /* @__PURE__ */ jsx2("span", { className: "rt-cms-toc-title", children: title }) : null,
+      /* @__PURE__ */ jsx2("span", { className: "rt-cms-toc-toggle", "aria-hidden": "true" })
+    ] }),
     /* @__PURE__ */ jsx2("ol", { className: "rt-cms-toc-list", children: entries.map((entry) => /* @__PURE__ */ jsx2(
       "li",
       {
@@ -54,10 +61,15 @@ function RootTaleTableOfContents(props) {
       },
       entry.id
     )) })
-  ] });
+  ] }) });
 }
 
 // src/toc.ts
+function tocLevel(rawLevel) {
+  if (rawLevel < 1 || rawLevel > 4) return null;
+  if (rawLevel < 3) return 2;
+  return rawLevel === 3 ? 3 : 4;
+}
 function headingToId(text) {
   return text.trim().toLowerCase().replace(/[^\p{L}\p{N}\s-]/gu, "").replace(/\s+/g, "-").replace(/-+/g, "-").replace(/^-|-$/g, "");
 }
@@ -74,14 +86,15 @@ function extractToc(doc) {
   for (const node of content) {
     if (node?.type !== "heading") continue;
     const rawLevel = Number(node.attrs?.level ?? 2);
-    if (rawLevel !== 2 && rawLevel !== 3) continue;
+    const level = tocLevel(rawLevel);
+    if (level === null) continue;
     const text = textOf(node).trim();
     if (!text) continue;
     const base = headingToId(text) || "heading";
     const count = idCounts.get(base) ?? 0;
     const id = count === 0 ? base : `${base}-${count}`;
     idCounts.set(base, count + 1);
-    entries.push({ level: rawLevel, text, id });
+    entries.push({ level, text, id });
   }
   return entries;
 }
@@ -92,7 +105,7 @@ function attachHeadingIds(doc, entries) {
   const nextContent = content.map((node) => {
     if (node?.type !== "heading") return node;
     const rawLevel = Number(node.attrs?.level ?? 2);
-    if (rawLevel !== 2 && rawLevel !== 3) return node;
+    if (rawLevel < 1 || rawLevel > 4) return node;
     if (!textOf(node).trim()) return node;
     const entry = entries[cursor++];
     if (!entry) return node;
@@ -314,12 +327,13 @@ function RootTaleLeadForm(props) {
 }
 
 // src/block-to-react.tsx
+import { sanitizeHtml } from "@roottale/cms-core";
 import { jsx as jsx5, jsxs as jsxs5 } from "react/jsx-runtime";
 function isString(value) {
   return typeof value === "string";
 }
 function htmlContent(html) {
-  return { __html: html };
+  return { __html: sanitizeHtml(html) };
 }
 function renderInner(blocks) {
   return blocks.map((b, i) => renderBlock(b, i));
@@ -340,18 +354,15 @@ function renderBlock(block, key = 0) {
     }
     case "core/heading": {
       const levelRaw = block.attributes.level;
-      const level = typeof levelRaw === "number" && levelRaw >= 1 && levelRaw <= 6 ? levelRaw : 2;
+      const level = typeof levelRaw === "number" && levelRaw >= 2 && levelRaw <= 4 ? levelRaw : 2;
       const text = isString(block.attributes.content) ? block.attributes.content : block.rawHtml ?? "";
       const props = {
         "data-block-id": dataBlockId,
         dangerouslySetInnerHTML: htmlContent(text)
       };
-      if (level === 1) return /* @__PURE__ */ jsx5("h1", { ...props }, key);
       if (level === 2) return /* @__PURE__ */ jsx5("h2", { ...props }, key);
       if (level === 3) return /* @__PURE__ */ jsx5("h3", { ...props }, key);
-      if (level === 4) return /* @__PURE__ */ jsx5("h4", { ...props }, key);
-      if (level === 5) return /* @__PURE__ */ jsx5("h5", { ...props }, key);
-      return /* @__PURE__ */ jsx5("h6", { ...props }, key);
+      return /* @__PURE__ */ jsx5("h4", { ...props }, key);
     }
     case "core/image": {
       const src = isString(block.attributes.url) ? block.attributes.url : "";
@@ -513,10 +524,11 @@ async function RootTaleBlogPost(props) {
   const toc = display.showTableOfContents ? extractToc(post.bodyJson) : [];
   const renderDoc = toc.length > 0 ? attachHeadingIds(post.bodyJson, toc) : post.bodyJson;
   const authorName = post.authorName;
-  const meta = [
-    display.showDate ? formatPublishedDate2(post.publishedAt) : null,
-    display.showAuthor && authorName ? `\uC791\uC131\uC790 ${authorName}` : null
-  ].filter(Boolean).join(" \xB7 ");
+  const publishedDate = display.showDate ? formatPublishedDate2(post.publishedAt) : "";
+  const showTopAuthor = display.showAuthor && Boolean(authorName);
+  const displayAuthorName = display.authorProfileName ?? authorName;
+  const authorBio = display.authorProfileBio ?? display.authorCardDescription;
+  const showAuthorCard = display.showAuthorCard && Boolean(displayAuthorName);
   return /* @__PURE__ */ jsxs6(
     "article",
     {
@@ -524,17 +536,48 @@ async function RootTaleBlogPost(props) {
       className: "rt-cms-article",
       style: themeStyle ?? void 0,
       children: [
-        /* @__PURE__ */ jsxs6("header", { children: [
-          meta ? /* @__PURE__ */ jsx6("p", { className: "rt-cms-meta", children: meta }) : null,
+        /* @__PURE__ */ jsxs6("header", { className: "rt-cms-post-header", children: [
+          publishedDate || showTopAuthor ? /* @__PURE__ */ jsxs6("p", { className: "rt-cms-meta", children: [
+            publishedDate ? /* @__PURE__ */ jsx6("span", { className: "rt-cms-meta-item", "data-rt-cms-meta": "date", children: publishedDate }) : null,
+            showTopAuthor ? /* @__PURE__ */ jsxs6("span", { className: "rt-cms-meta-item", "data-rt-cms-meta": "author", children: [
+              "\uC791\uC131\uC790 ",
+              authorName
+            ] }) : null
+          ] }) : null,
           /* @__PURE__ */ jsx6("h1", { className: "rt-cms-title", children: post.title }),
           post.excerpt ? /* @__PURE__ */ jsx6("p", { className: "rt-cms-excerpt", children: post.excerpt }) : null
         ] }),
         toc.length > 0 ? /* @__PURE__ */ jsx6(RootTaleTableOfContents, { entries: toc, title: display.tocTitle }) : null,
-        /* @__PURE__ */ jsx6(RenderTiptap, { doc: renderDoc })
+        /* @__PURE__ */ jsx6(RenderTiptap, { doc: renderDoc }),
+        showAuthorCard && displayAuthorName ? /* @__PURE__ */ jsxs6("section", { className: "rt-cms-author-card", "aria-label": "\uC791\uC131\uC790", children: [
+          display.authorProfileImageUrl ? /* @__PURE__ */ jsx6(
+            "img",
+            {
+              className: "rt-cms-author-card__image",
+              src: display.authorProfileImageUrl,
+              alt: "",
+              loading: "lazy"
+            }
+          ) : /* @__PURE__ */ jsx6("div", { className: "rt-cms-author-card__avatar", "aria-hidden": "true", children: authorInitials(displayAuthorName) }),
+          /* @__PURE__ */ jsxs6("div", { className: "rt-cms-author-card__body", children: [
+            /* @__PURE__ */ jsx6("p", { className: "rt-cms-author-card__eyebrow", children: display.authorCardEyebrow }),
+            /* @__PURE__ */ jsx6("p", { className: "rt-cms-author-card__name", children: displayAuthorName }),
+            authorBio ? /* @__PURE__ */ jsx6("p", { className: "rt-cms-author-card__description", children: authorBio }) : null
+          ] })
+        ] }) : null
       ]
     }
   );
 }
+function authorInitials(name) {
+  const trimmed = name.trim();
+  if (!trimmed) return "";
+  const parts = trimmed.split(/\s+/).filter(Boolean);
+  if (parts.length >= 2) {
+    return `${parts[0]?.[0] ?? ""}${parts[1]?.[0] ?? ""}`.toUpperCase();
+  }
+  return [...trimmed].slice(0, 2).join("").toUpperCase();
+}
 async function resolveThemeStyle(input) {
   const { themeProp, apiKey, baseUrl } = input;
   if (themeProp === null) return null;
@@ -604,13 +647,14 @@ function renderNode(node, key) {
     case "paragraph":
       return /* @__PURE__ */ jsx6("p", { style: alignStyle(node), children }, key);
     case "heading": {
-      const level = Math.min(Math.max(Number(node.attrs?.level ?? 2), 1), 3);
+      const rawLevel = Number(node.attrs?.level ?? 2);
+      const level = Math.min(Math.max(Number.isFinite(rawLevel) ? rawLevel : 2, 2), 4);
       const idAttr = node.attrs?.id;
       const id = typeof idAttr === "string" && idAttr.length > 0 ? idAttr : void 0;
       const style = alignStyle(node);
-      if (level === 1) return /* @__PURE__ */ jsx6("h1", { id, style, children }, key);
       if (level === 2) return /* @__PURE__ */ jsx6("h2", { id, style, children }, key);
-      return /* @__PURE__ */ jsx6("h3", { id, style, children }, key);
+      if (level === 3) return /* @__PURE__ */ jsx6("h3", { id, style, children }, key);
+      return /* @__PURE__ */ jsx6("h4", { id, style, children }, key);
     }
     case "bulletList":
       return /* @__PURE__ */ jsx6("ul", { children }, key);