@webnumseoagent/next 0.2.2 → 0.3.0

package/bin/cli.mjs

@@ -35,6 +35,19 @@ async function ensureFile(p, content) {
   ok(path.relative(root, p));
   return true;
 }
+async function anyExistsRel(paths) {
+  for (const p of paths) if (await exists(path.join(root, p))) return true;
+  return false;
+}
+// Переименовывает файл в *.bak (не удаляя) — сохраняем чужой robots/sitemap при takeover.
+async function backupIfExists(p) {
+  if (!(await exists(p))) return false;
+  let bak = `${p}.bak`, i = 1;
+  while (await exists(bak)) bak = `${p}.bak${i++}`;
+  await fs.rename(p, bak);
+  ok(`${path.relative(root, p)} → ${path.relative(root, bak)} (бэкап)`);
+  return true;
+}
 
 async function findAppDir() {
   for (const c of ["app", "src/app"]) {
@@ -469,10 +482,156 @@ async function findMetadataPages(dir, acc = []) {
   return acc;
 }
 
+// takeover — передать robots.txt и/или sitemap.xml под управление платформы, даже если у сайта
+// уже есть свои (статический public/robots.txt|sitemap.xml или app/robots.ts|sitemap.ts). Чужие
+// файлы бэкапим в *.bak и ставим наши динамические роуты (их отдаёт адаптер, контентом рулит платформа).
+// Флаги: --robots и/или --sitemap (без флагов — оба). Требует, чтобы адаптер уже был установлен (init).
+async function takeover() {
+  log("\n\x1b[1m@webnumseoagent/next — takeover robots/sitemap\x1b[0m\n");
+  if (!isGitClean() && !args.includes("--force")) {
+    console.error("  ✗ Рабочее дерево git не чистое. Закоммить/откатись (или добавь --force), чтобы дифф был обозрим.");
+    process.exit(1);
+  }
+  const appDir = await findAppDir();
+  if (!appDir) {
+    console.error("  ✗ Не найдена папка app/ или src/app/. Запусти из корня Next.js-проекта.");
+    process.exit(1);
+  }
+  ok(`Найден app-каталог: ${appDir}/`);
+  const ext = (await exists(path.join(root, "tsconfig.json"))) ? "ts" : "js";
+
+  // Импорт клиента: пакет установлен → из пакета; иначе — из вендор-папки seoagent/ (её создаёт init).
+  const pkgMode = await exists(path.join(root, "node_modules/@webnumseoagent/next/package.json"));
+  if (!pkgMode && !(await exists(path.join(root, "seoagent", "client.ts")))) {
+    console.error("  ✗ Адаптер не установлен (нет пакета и нет seoagent/client.ts). Сначала запусти init.");
+    process.exit(1);
+  }
+  const clientFor = (file) => (pkgMode ? "@webnumseoagent/next" : `${importPath(appDir, file)}/client`);
+
+  // Без флагов — оба; иначе только выбранные.
+  const only = args.includes("--robots") || args.includes("--sitemap");
+  const doRobots = !only || args.includes("--robots");
+  const doSitemap = !only || args.includes("--sitemap");
+
+  const hdr = `{ "content-type": "application/xml; charset=utf-8", "x-seoagent-sitemap": "1" }`;
+  const childSig = ext === "ts" ? "_req: Request, { params }: { params: { name: string } }" : "_req, { params }";
+
+  if (doRobots) {
+    if (await anyExistsRel([`${appDir}/robots.txt/route.ts`, `${appDir}/robots.txt/route.js`])) {
+      skip("robots (наш роут уже есть)");
+    } else {
+      // Бэкапим чужой robots: статический public/robots.txt, метаданные app/robots.ts|js И статический
+      // app/robots.txt (Next-конвенция). Последний критично отодвинуть: иначе mkdir("app/robots.txt")
+      // для нашего роут-каталога упадёт с EEXIST (по этому пути уже лежит ФАЙЛ).
+      await backupIfExists(path.join(root, "public", "robots.txt"));
+      await backupIfExists(path.join(root, appDir, "robots.ts"));
+      await backupIfExists(path.join(root, appDir, "robots.js"));
+      await backupIfExists(path.join(root, appDir, "robots.txt"));
+      await ensureFile(
+        path.join(root, appDir, `robots.txt/route.${ext}`),
+        `import { seoRobotsTxt } from "${clientFor("robots.txt/route.ts")}";\nexport const revalidate = 300;\nexport async function GET() {\n  return new Response(await seoRobotsTxt(), { headers: { "content-type": "text/plain; charset=utf-8", "x-seoagent-robots": "1" } });\n}\n`,
+      );
+      ok("robots.txt → под управлением платформы");
+    }
+  }
+
+  if (doSitemap) {
+    if (await anyExistsRel([`${appDir}/sitemap.xml/route.ts`, `${appDir}/sitemap.xml/route.js`])) {
+      skip("sitemap (наш роут уже есть)");
+    } else {
+      const xslRoute = () => ensureFile(
+        path.join(root, appDir, `sitemap.xsl/route.${ext}`),
+        `import { SITEMAP_XSL } from "${clientFor("sitemap.xsl/route.ts")}";\nexport function GET() {\n  return new Response(SITEMAP_XSL, { headers: { "content-type": "text/xsl; charset=utf-8" } });\n}\n`,
+      );
+      // Конфликт: у сайта уже есть app/sitemap/[иной-сегмент] — тогда свой [name] не создаём.
+      let dynConflict = false;
+      const smDir = path.join(root, appDir, "sitemap");
+      if (await exists(smDir)) {
+        const names = await fs.readdir(smDir).catch(() => []);
+        dynConflict = names.some((n) => /^\[.*\]$/.test(n) && n !== "[name]");
+      }
+      // Роуты-обёртки (зовут переименованную карту сайта sitemap.source + добавляют стиль/разбивку).
+      const genWrapRoutes = async () => {
+        await ensureFile(
+          path.join(root, appDir, `sitemap.xml/route.${ext}`),
+          `import original from "../sitemap.source";\nimport { seoWrapSitemap } from "${clientFor("sitemap.xml/route.ts")}";\nexport const revalidate = 300;\nexport async function GET() {\n  return new Response(await seoWrapSitemap(original, "${dynConflict ? "flat" : "index"}"), { headers: ${hdr} });\n}\n`,
+        );
+        if (!dynConflict)
+          await ensureFile(
+            path.join(root, appDir, `sitemap/[name]/route.${ext}`),
+            `import original from "../../sitemap.source";\nimport { seoWrapSitemap } from "${clientFor("sitemap/[name]/route.ts")}";\nexport const revalidate = 300;\nexport async function GET(${childSig}) {\n  return new Response(await seoWrapSitemap(original, "child", params.name), { headers: ${hdr} });\n}\n`,
+          );
+        await xslRoute();
+      };
+      // Роуты-генерации (карту собирает платформа).
+      const genGenerateRoutes = async () => {
+        await ensureFile(
+          path.join(root, appDir, `sitemap.xml/route.${ext}`),
+          `import { seoSitemapXml } from "${clientFor("sitemap.xml/route.ts")}";\nexport const revalidate = 300;\nexport async function GET() {\n  return new Response(await seoSitemapXml("/sitemap.xml"), { headers: ${hdr} });\n}\n`,
+        );
+        if (!dynConflict)
+          await ensureFile(
+            path.join(root, appDir, `sitemap/[name]/route.${ext}`),
+            `import { seoSitemapXml } from "${clientFor("sitemap/[name]/route.ts")}";\nexport const revalidate = 300;\nexport async function GET(${childSig}) {\n  return new Response(await seoSitemapXml("/sitemap/" + params.name), { headers: ${hdr} });\n}\n`,
+          );
+        await xslRoute();
+      };
+
+      // Возобновление прерванной обёртки: карта уже переименована в sitemap.source.* (а роутов ещё нет) —
+      // просто доделываем wrap-роуты. Иначе повторный запуск ушёл бы в «генерацию» и осиротил бы URL сайта.
+      let sourceExt = null;
+      for (const e of ["ts", "js", "tsx", "jsx"]) {
+        if (await exists(path.join(root, appDir, `sitemap.source.${e}`))) { sourceExt = e; break; }
+      }
+      if (sourceExt) {
+        await genWrapRoutes();
+        ok("sitemap.xml → под управлением платформы (обёртка — докрутка после прерывания)");
+      } else {
+        // Динамическая карта сайта (app/sitemap.ts|js) со СВОИМИ URL: не теряем её — оборачиваем.
+        // Только стандартный default-export без generateSitemaps.
+        let metaSitemap = null;
+        for (const e of ["ts", "js", "tsx", "jsx"]) {
+          const p = path.join(root, appDir, `sitemap.${e}`);
+          if (await exists(p)) { metaSitemap = { p, e }; break; }
+        }
+        let wrap = false;
+        if (metaSitemap) {
+          const code = await fs.readFile(metaSitemap.p, "utf8");
+          wrap = !/\bgenerateSitemaps\b/.test(code) &&
+            (/export\s+default\s+(async\s+)?function/.test(code) || /export\s+default\s+\w/.test(code));
+        }
+        // Чужую статическую карту (public/sitemap*.xml и статический app/sitemap.xml) бэкапим в любом
+        // случае — иначе она перекроет наш роут; app/sitemap.xml критично отодвинуть (иначе mkdir EEXIST).
+        await backupIfExists(path.join(root, "public", "sitemap.xml"));
+        await backupIfExists(path.join(root, "public", "sitemap_index.xml"));
+        await backupIfExists(path.join(root, appDir, "sitemap.xml"));
+        if (wrap) {
+          await fs.rename(metaSitemap.p, path.join(root, appDir, `sitemap.source.${metaSitemap.e}`));
+          ok(`${appDir}/sitemap.${metaSitemap.e} → ${appDir}/sitemap.source.${metaSitemap.e} (оборачиваем существующую карту)`);
+          await genWrapRoutes();
+          ok("sitemap.xml → под управлением платформы (обёртка карты сайта)");
+        } else {
+          if (metaSitemap) await backupIfExists(metaSitemap.p); // нестандартный app/sitemap.* (напр. generateSitemaps)
+          await genGenerateRoutes();
+          ok("sitemap.xml → под управлением платформы (генерация с платформы)");
+        }
+      }
+    }
+  }
+
+  log("\n\x1b[1mЗатем:\x1b[0m проверь \x1b[36mgit diff\x1b[0m, затем \x1b[36mgit add -A && git commit && git push\x1b[0m. Убедись, что env SEOAGENT_* заданы в Vercel.\n");
+}
+
 if (cmd === "init") {
   init().catch((e) => { console.error(e); process.exit(1); });
+} else if (cmd === "takeover") {
+  takeover().catch((e) => { console.error(e); process.exit(1); });
 } else {
-  log("Использование: npx @webnumseoagent/next init [--wrap] [--no-blog] [--site <id>] [--token <t>] [--api <url>] [--revalidate-secret <s>]");
-  log("  --wrap     — авто-обернуть generateMetadata страниц (иначе печатает сниппеты)");
-  log("  --no-blog  — не создавать роуты блога /blog (по умолчанию блог создаётся)");
+  log("Использование: npx @webnumseoagent/next <init|takeover> [опции]");
+  log("  init [--wrap] [--no-blog] [--site <id>] [--token <t>] [--api <url>] [--revalidate-secret <s>]");
+  log("    --wrap     — авто-обернуть generateMetadata страниц (иначе печатает сниппеты)");
+  log("    --no-blog  — не создавать роуты блога /blog (по умолчанию блог создаётся)");
+  log("  takeover [--robots] [--sitemap] [--force]");
+  log("    передать robots.txt/sitemap.xml под управление платформы (бэкап чужих в *.bak);");
+  log("    без флагов — оба. Требует уже установленного адаптера (init).");
 }

package/blog.tsx

@@ -14,6 +14,8 @@
 //   app/blog/[slug]/page.tsx:     const post = await seoBlogPost(params.slug); if(!post) notFound();
 //                                 return <SeoBlogArticle post={post} />
 
+import type { CSSProperties } from "react";
+
 const API = process.env.SEOAGENT_API_BASE ?? "";
 const SITE = process.env.SEOAGENT_SITE_ID ?? "";
 const TOKEN = process.env.SEOAGENT_TOKEN ?? "";
@@ -23,12 +25,16 @@ export interface SeoBlogMapping {
   title: string; excerpt?: string; body: string;
   id?: string; image?: string; published?: string; publishedAt?: string;
 }
+// Тема блога от платформы (config-API): цвета/скругления как ВАЛИДНЫЕ CSS-значения, которые пакет
+// кладёт в свои переменные --sa-*. Сейчас платформа шлёт только accent (бренд-цвет владельца);
+// border/surface/muted/radius зарезервированы под будущий ИИ-профиль дизайна сайта.
+export interface SeoBlogTheme { accent?: string; border?: string; muted?: string; surface?: string; thBg?: string; radius?: string }
 export interface SeoBlogConfig {
   supabaseUrl: string; anonKey: string; table: string;
-  format: "html" | "minimarkup"; locales: string[]; mapping: SeoBlogMapping;
+  format: "html" | "minimarkup"; locales: string[]; mapping: SeoBlogMapping; theme?: SeoBlogTheme;
 }
 export interface SeoBlogSummary { slug: string; title: string; excerpt: string; cover: string | null; date: string | null }
-export interface SeoBlogPostFull extends SeoBlogSummary { bodyHtml: string }
+export interface SeoBlogPostFull extends SeoBlogSummary { bodyHtml: string; theme?: SeoBlogTheme }
 
 function firstLocale(cfg: SeoBlogConfig): string {
   return (cfg.locales ?? []).filter(Boolean)[0] ?? "";
@@ -113,6 +119,7 @@ async function fetchPost(cfg: SeoBlogConfig, slug: string, locale: string): Prom
     cover: m.image ? (r[m.image] as string | null) ?? null : null,
     date: m.publishedAt ? (r[m.publishedAt] as string | null) ?? null : null,
     bodyHtml: cfg.format === "minimarkup" ? miniMarkupToHtml(rawBody) : sanitizeDeliveryHtml(rawBody),
+    theme: cfg.theme, // тему тащим с постом — чтобы SeoBlogArticle применил её без отдельного запроса
   };
 }
 
@@ -209,17 +216,37 @@ function sanitizeDeliveryHtml(html: string): string {
 }
 
 // ── Компоненты (серверные) ──────────────────────────────────────────────────────────────────
-const BODY_CSS = `.seoagent-blog-body img{max-width:100%;height:auto;border-radius:8px;margin:1rem 0}
+// Цвета/рамки/скругления — через СОБСТВЕННЫЕ переменные пакета (--sa-*) с нейтральным дефолтом.
+// НЕ ссылаемся на токены сайта напрямую: shadcn/Tailwind хранят их как сырые HSL-компоненты
+// (--primary: 222 47% 11%), в color/border это невалидно и ломает вид. Реальные цвета сайта
+// проставит платформа: config-API отдаст профиль, а хост-обёртка выставит --sa-* валидными цветами.
+// Шрифт и базовый цвет текста наследуются от layout сайта (color:inherit, без font-family).
+const BODY_CSS = `.seoagent-blog-body{color:inherit}
+.seoagent-blog-body img{max-width:100%;height:auto;border-radius:var(--sa-radius,8px);margin:1rem 0}
 .seoagent-blog-body table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.95em}
-.seoagent-blog-body th,.seoagent-blog-body td{border:1px solid #e5e7eb;padding:.5rem .75rem;text-align:left}
-.seoagent-blog-body th{background:#f8fafc}
+.seoagent-blog-body th,.seoagent-blog-body td{border:1px solid var(--sa-border,#e5e7eb);padding:.5rem .75rem;text-align:left}
+.seoagent-blog-body th{background:var(--sa-th-bg,#f8fafc)}
 .seoagent-blog-body h2{margin:1.75rem 0 .75rem;font-size:1.5rem;line-height:1.3}
 .seoagent-blog-body h3{margin:1.4rem 0 .6rem;font-size:1.2rem}
 .seoagent-blog-body p{margin:0 0 1rem}
-.seoagent-blog-body a{color:#2563eb}
+.seoagent-blog-body a{color:var(--sa-accent,#2563eb)}
 .seoagent-blog-body figure{margin:1.25rem 0}
-.seoagent-blog-body figcaption{color:#94a3b8;font-size:.85em;text-align:center;margin-top:.4rem}
-.seoagent-blog-body blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:3px solid #e5e7eb;color:#475569}`;
+.seoagent-blog-body figcaption{color:var(--sa-muted,#94a3b8);font-size:.85em;text-align:center;margin-top:.4rem}
+.seoagent-blog-body blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:3px solid var(--sa-border,#e5e7eb);color:var(--sa-muted,#475569)}`;
+
+// Тема → CSS-переменные пакета (--sa-*). Кладём на корень блока — они каскадируются вниз к
+// ссылкам/карточкам/телу. Отдаём только заданные ключи (пустые не трогаем → останется fallback).
+function themeStyle(theme?: SeoBlogTheme): Record<string, string> {
+  const t = theme ?? {};
+  const out: Record<string, string> = {};
+  if (t.accent) out["--sa-accent"] = t.accent;
+  if (t.border) out["--sa-border"] = t.border;
+  if (t.muted) out["--sa-muted"] = t.muted;
+  if (t.surface) out["--sa-surface"] = t.surface;
+  if (t.thBg) out["--sa-th-bg"] = t.thBg;
+  if (t.radius) out["--sa-radius"] = t.radius;
+  return out;
+}
 
 // Список статей блога. Сам тянет конфиг+статьи. Пусто/ошибка → null (ничего не ломаем).
 export async function SeoBlogIndex(props: { locale?: string; basePath?: string; limit?: number; title?: string }) {
@@ -230,16 +257,16 @@ export async function SeoBlogIndex(props: { locale?: string; basePath?: string;
   if (!posts.length) return null;
   const basePath = (props.basePath ?? "/blog").replace(/\/+$/, "");
   return (
-    <div style={{ maxWidth: 1080, margin: "0 auto", padding: "1.5rem" }}>
+    <div style={{ maxWidth: 1080, margin: "0 auto", padding: "1.5rem", ...themeStyle(cfg.theme) } as CSSProperties}>
       {props.title ? <h1 style={{ fontSize: "2rem", margin: "0 0 1.5rem" }}>{props.title}</h1> : null}
       <div style={{ display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(280px, 1fr))", gap: "1.5rem" }}>
         {posts.map((p) => (
           <a key={p.slug} href={`${basePath}/${p.slug}`}
-            style={{ display: "block", textDecoration: "none", color: "inherit", border: "1px solid #e5e7eb", borderRadius: 12, overflow: "hidden" }}>
+            style={{ display: "block", textDecoration: "none", color: "inherit", border: "1px solid var(--sa-border, #e5e7eb)", borderRadius: "var(--sa-radius, 12px)", overflow: "hidden", background: "var(--sa-surface, transparent)" }}>
             {p.cover ? <img src={p.cover} alt={p.title} style={{ width: "100%", height: 180, objectFit: "cover", display: "block" }} /> : null}
             <div style={{ padding: "1rem" }}>
               <h2 style={{ fontSize: "1.1rem", margin: "0 0 .5rem", lineHeight: 1.3 }}>{p.title}</h2>
-              {p.excerpt ? <p style={{ margin: 0, color: "#64748b", fontSize: ".9rem", lineHeight: 1.5 }}>{p.excerpt}</p> : null}
+              {p.excerpt ? <p style={{ margin: 0, color: "var(--sa-muted, #64748b)", fontSize: ".9rem", lineHeight: 1.5 }}>{p.excerpt}</p> : null}
             </div>
           </a>
         ))}
@@ -251,11 +278,11 @@ export async function SeoBlogIndex(props: { locale?: string; basePath?: string;
 // Одна статья. Принимает пост (из seoBlogPost) — так страница может сделать notFound()/метаданные.
 export function SeoBlogArticle({ post, locale }: { post: SeoBlogPostFull; locale?: string }) {
   return (
-    <article style={{ maxWidth: 760, margin: "0 auto", padding: "1.5rem", lineHeight: 1.7 }}>
+    <article style={{ maxWidth: 760, margin: "0 auto", padding: "1.5rem", lineHeight: 1.7, ...themeStyle(post.theme) } as CSSProperties}>
       <style dangerouslySetInnerHTML={{ __html: BODY_CSS }} />
-      {post.cover ? <img src={post.cover} alt={post.title} style={{ width: "100%", borderRadius: 12, marginBottom: "1.5rem" }} /> : null}
+      {post.cover ? <img src={post.cover} alt={post.title} style={{ width: "100%", borderRadius: "var(--sa-radius, 12px)", marginBottom: "1.5rem" }} /> : null}
       <h1 style={{ fontSize: "2.2rem", lineHeight: 1.2, margin: "0 0 1rem" }}>{post.title}</h1>
-      {post.date ? <p style={{ color: "#94a3b8", margin: "0 0 1.5rem" }}>{fmtDate(post.date, locale)}</p> : null}
+      {post.date ? <p style={{ color: "var(--sa-muted, #94a3b8)", margin: "0 0 1.5rem" }}>{fmtDate(post.date, locale)}</p> : null}
       {/* Тело уже санитайзено при доставке (Фаза 3.1b) — рендерим как HTML. */}
       <div className="seoagent-blog-body" dangerouslySetInnerHTML={{ __html: post.bodyHtml }} />
     </article>

package/dist/blog.d.ts

@@ -7,6 +7,14 @@ export interface SeoBlogMapping {
     published?: string;
     publishedAt?: string;
 }
+export interface SeoBlogTheme {
+    accent?: string;
+    border?: string;
+    muted?: string;
+    surface?: string;
+    thBg?: string;
+    radius?: string;
+}
 export interface SeoBlogConfig {
     supabaseUrl: string;
     anonKey: string;
@@ -14,6 +22,7 @@ export interface SeoBlogConfig {
     format: "html" | "minimarkup";
     locales: string[];
     mapping: SeoBlogMapping;
+    theme?: SeoBlogTheme;
 }
 export interface SeoBlogSummary {
     slug: string;
@@ -24,6 +33,7 @@ export interface SeoBlogSummary {
 }
 export interface SeoBlogPostFull extends SeoBlogSummary {
     bodyHtml: string;
+    theme?: SeoBlogTheme;
 }
 export declare function seoBlogList(opts?: {
     locale?: string;

package/dist/blog.js

@@ -5,21 +5,6 @@ exports.seoBlogPost = seoBlogPost;
 exports.SeoBlogIndex = SeoBlogIndex;
 exports.SeoBlogArticle = SeoBlogArticle;
 const jsx_runtime_1 = require("react/jsx-runtime");
-// @webnumseoagent/next/blog — рендер блога код-сайта (Фаза 3.1c).
-// Пакет тянет ПУБЛИЧНЫЙ конфиг блога с платформы (config-API /blog: supabaseUrl + anonKey +
-// таблица/формат/локали/маппинг), затем читает ОПУБЛИКОВАННЫЕ статьи прямо из Supabase клиента
-// (anon-ключ + public-read RLS) и рендерит обложку + заголовок + тело (картинки/таблицы/ссылки).
-//
-// Тело статьи уже САНИТАЙЗЕНО на стороне платформы при доставке (Фаза 3.1b), поэтому здесь оно
-// рендерится как HTML (dangerouslySetInnerHTML) — граница доверия проходит по доставке, не по рендеру.
-//
-// Все функции FAIL-SAFE: при ошибке/таймауте возвращают пусто — блог просто не покажет контент,
-// сборка/рендер сайта НИКОГДА не падает.
-//
-// Использование (роуты ставит `npx @webnumseoagent/next init --blog`):
-//   app/blog/page.tsx:            export default () => <SeoBlogIndex title="Блог" />
-//   app/blog/[slug]/page.tsx:     const post = await seoBlogPost(params.slug); if(!post) notFound();
-//                                 return <SeoBlogArticle post={post} />
 const API = process.env.SEOAGENT_API_BASE ?? "";
 const SITE = process.env.SEOAGENT_SITE_ID ?? "";
 const TOKEN = process.env.SEOAGENT_TOKEN ?? "";
@@ -114,6 +99,7 @@ async function fetchPost(cfg, slug, locale) {
         cover: m.image ? r[m.image] ?? null : null,
         date: m.publishedAt ? r[m.publishedAt] ?? null : null,
         bodyHtml: cfg.format === "minimarkup" ? miniMarkupToHtml(rawBody) : sanitizeDeliveryHtml(rawBody),
+        theme: cfg.theme, // тему тащим с постом — чтобы SeoBlogArticle применил её без отдельного запроса
     };
 }
 // ── Публичные data-функции (для generateMetadata / generateStaticParams) ──
@@ -229,17 +215,42 @@ function sanitizeDeliveryHtml(html) {
     return s.trim();
 }
 // ── Компоненты (серверные) ──────────────────────────────────────────────────────────────────
-const BODY_CSS = `.seoagent-blog-body img{max-width:100%;height:auto;border-radius:8px;margin:1rem 0}
+// Цвета/рамки/скругления — через СОБСТВЕННЫЕ переменные пакета (--sa-*) с нейтральным дефолтом.
+// НЕ ссылаемся на токены сайта напрямую: shadcn/Tailwind хранят их как сырые HSL-компоненты
+// (--primary: 222 47% 11%), в color/border это невалидно и ломает вид. Реальные цвета сайта
+// проставит платформа: config-API отдаст профиль, а хост-обёртка выставит --sa-* валидными цветами.
+// Шрифт и базовый цвет текста наследуются от layout сайта (color:inherit, без font-family).
+const BODY_CSS = `.seoagent-blog-body{color:inherit}
+.seoagent-blog-body img{max-width:100%;height:auto;border-radius:var(--sa-radius,8px);margin:1rem 0}
 .seoagent-blog-body table{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.95em}
-.seoagent-blog-body th,.seoagent-blog-body td{border:1px solid #e5e7eb;padding:.5rem .75rem;text-align:left}
-.seoagent-blog-body th{background:#f8fafc}
+.seoagent-blog-body th,.seoagent-blog-body td{border:1px solid var(--sa-border,#e5e7eb);padding:.5rem .75rem;text-align:left}
+.seoagent-blog-body th{background:var(--sa-th-bg,#f8fafc)}
 .seoagent-blog-body h2{margin:1.75rem 0 .75rem;font-size:1.5rem;line-height:1.3}
 .seoagent-blog-body h3{margin:1.4rem 0 .6rem;font-size:1.2rem}
 .seoagent-blog-body p{margin:0 0 1rem}
-.seoagent-blog-body a{color:#2563eb}
+.seoagent-blog-body a{color:var(--sa-accent,#2563eb)}
 .seoagent-blog-body figure{margin:1.25rem 0}
-.seoagent-blog-body figcaption{color:#94a3b8;font-size:.85em;text-align:center;margin-top:.4rem}
-.seoagent-blog-body blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:3px solid #e5e7eb;color:#475569}`;
+.seoagent-blog-body figcaption{color:var(--sa-muted,#94a3b8);font-size:.85em;text-align:center;margin-top:.4rem}
+.seoagent-blog-body blockquote{margin:1rem 0;padding:.5rem 1rem;border-left:3px solid var(--sa-border,#e5e7eb);color:var(--sa-muted,#475569)}`;
+// Тема → CSS-переменные пакета (--sa-*). Кладём на корень блока — они каскадируются вниз к
+// ссылкам/карточкам/телу. Отдаём только заданные ключи (пустые не трогаем → останется fallback).
+function themeStyle(theme) {
+    const t = theme ?? {};
+    const out = {};
+    if (t.accent)
+        out["--sa-accent"] = t.accent;
+    if (t.border)
+        out["--sa-border"] = t.border;
+    if (t.muted)
+        out["--sa-muted"] = t.muted;
+    if (t.surface)
+        out["--sa-surface"] = t.surface;
+    if (t.thBg)
+        out["--sa-th-bg"] = t.thBg;
+    if (t.radius)
+        out["--sa-radius"] = t.radius;
+    return out;
+}
 // Список статей блога. Сам тянет конфиг+статьи. Пусто/ошибка → null (ничего не ломаем).
 async function SeoBlogIndex(props) {
     const cfg = await fetchBlogConfig();
@@ -250,11 +261,11 @@ async function SeoBlogIndex(props) {
     if (!posts.length)
         return null;
     const basePath = (props.basePath ?? "/blog").replace(/\/+$/, "");
-    return ((0, jsx_runtime_1.jsxs)("div", { style: { maxWidth: 1080, margin: "0 auto", padding: "1.5rem" }, children: [props.title ? (0, jsx_runtime_1.jsx)("h1", { style: { fontSize: "2rem", margin: "0 0 1.5rem" }, children: props.title }) : null, (0, jsx_runtime_1.jsx)("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(280px, 1fr))", gap: "1.5rem" }, children: posts.map((p) => ((0, jsx_runtime_1.jsxs)("a", { href: `${basePath}/${p.slug}`, style: { display: "block", textDecoration: "none", color: "inherit", border: "1px solid #e5e7eb", borderRadius: 12, overflow: "hidden" }, children: [p.cover ? (0, jsx_runtime_1.jsx)("img", { src: p.cover, alt: p.title, style: { width: "100%", height: 180, objectFit: "cover", display: "block" } }) : null, (0, jsx_runtime_1.jsxs)("div", { style: { padding: "1rem" }, children: [(0, jsx_runtime_1.jsx)("h2", { style: { fontSize: "1.1rem", margin: "0 0 .5rem", lineHeight: 1.3 }, children: p.title }), p.excerpt ? (0, jsx_runtime_1.jsx)("p", { style: { margin: 0, color: "#64748b", fontSize: ".9rem", lineHeight: 1.5 }, children: p.excerpt }) : null] })] }, p.slug))) })] }));
+    return ((0, jsx_runtime_1.jsxs)("div", { style: { maxWidth: 1080, margin: "0 auto", padding: "1.5rem", ...themeStyle(cfg.theme) }, children: [props.title ? (0, jsx_runtime_1.jsx)("h1", { style: { fontSize: "2rem", margin: "0 0 1.5rem" }, children: props.title }) : null, (0, jsx_runtime_1.jsx)("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fill, minmax(280px, 1fr))", gap: "1.5rem" }, children: posts.map((p) => ((0, jsx_runtime_1.jsxs)("a", { href: `${basePath}/${p.slug}`, style: { display: "block", textDecoration: "none", color: "inherit", border: "1px solid var(--sa-border, #e5e7eb)", borderRadius: "var(--sa-radius, 12px)", overflow: "hidden", background: "var(--sa-surface, transparent)" }, children: [p.cover ? (0, jsx_runtime_1.jsx)("img", { src: p.cover, alt: p.title, style: { width: "100%", height: 180, objectFit: "cover", display: "block" } }) : null, (0, jsx_runtime_1.jsxs)("div", { style: { padding: "1rem" }, children: [(0, jsx_runtime_1.jsx)("h2", { style: { fontSize: "1.1rem", margin: "0 0 .5rem", lineHeight: 1.3 }, children: p.title }), p.excerpt ? (0, jsx_runtime_1.jsx)("p", { style: { margin: 0, color: "var(--sa-muted, #64748b)", fontSize: ".9rem", lineHeight: 1.5 }, children: p.excerpt }) : null] })] }, p.slug))) })] }));
 }
 // Одна статья. Принимает пост (из seoBlogPost) — так страница может сделать notFound()/метаданные.
 function SeoBlogArticle({ post, locale }) {
-    return ((0, jsx_runtime_1.jsxs)("article", { style: { maxWidth: 760, margin: "0 auto", padding: "1.5rem", lineHeight: 1.7 }, children: [(0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: BODY_CSS } }), post.cover ? (0, jsx_runtime_1.jsx)("img", { src: post.cover, alt: post.title, style: { width: "100%", borderRadius: 12, marginBottom: "1.5rem" } }) : null, (0, jsx_runtime_1.jsx)("h1", { style: { fontSize: "2.2rem", lineHeight: 1.2, margin: "0 0 1rem" }, children: post.title }), post.date ? (0, jsx_runtime_1.jsx)("p", { style: { color: "#94a3b8", margin: "0 0 1.5rem" }, children: fmtDate(post.date, locale) }) : null, (0, jsx_runtime_1.jsx)("div", { className: "seoagent-blog-body", dangerouslySetInnerHTML: { __html: post.bodyHtml } })] }));
+    return ((0, jsx_runtime_1.jsxs)("article", { style: { maxWidth: 760, margin: "0 auto", padding: "1.5rem", lineHeight: 1.7, ...themeStyle(post.theme) }, children: [(0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: { __html: BODY_CSS } }), post.cover ? (0, jsx_runtime_1.jsx)("img", { src: post.cover, alt: post.title, style: { width: "100%", borderRadius: "var(--sa-radius, 12px)", marginBottom: "1.5rem" } }) : null, (0, jsx_runtime_1.jsx)("h1", { style: { fontSize: "2.2rem", lineHeight: 1.2, margin: "0 0 1rem" }, children: post.title }), post.date ? (0, jsx_runtime_1.jsx)("p", { style: { color: "var(--sa-muted, #94a3b8)", margin: "0 0 1.5rem" }, children: fmtDate(post.date, locale) }) : null, (0, jsx_runtime_1.jsx)("div", { className: "seoagent-blog-body", dangerouslySetInnerHTML: { __html: post.bodyHtml } })] }));
 }
 function fmtDate(d, locale) {
     try {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webnumseoagent/next",
-  "version": "0.2.2",
+  "version": "0.3.0",
   "description": "Runtime SEO adapter + installer for Next.js App Router sites (SEO Agent platform)",
   "main": "dist/client.js",
   "types": "dist/client.d.ts",