@focus-reactive/payload-plugin-seo 1.0.0 → 1.0.2

package/dist/components/SeoDrawer/components/SerpPreview/variants.js

@@ -0,0 +1,58 @@
+import { cva } from "class-variance-authority";
+const serpContainer = cva("", {
+  variants: {
+    mode: {
+      desktop: "w-[600px] font-[arial,sans-serif]",
+      mobile: "max-w-[368px] font-[Arial,Roboto-Regular,HelveticaNeue,sans-serif]"
+    }
+  }
+});
+const serpUrlRow = cva("flex items-center gap-x-[12px] mb-[12px] pt-[1px] overflow-hidden whitespace-nowrap text-ellipsis", {
+  variants: {
+    mode: {
+      desktop: "",
+      mobile: ""
+    }
+  }
+});
+const serpSiteName = cva("text-[14px] leading-[18px] text-serp-sitename font-normal", {
+  variants: {
+    mode: {
+      desktop: "",
+      mobile: "max-w-[300px]"
+    }
+  }
+});
+const serpHostname = cva("", {
+  variants: {
+    mode: {
+      desktop: "text-[14px] leading-[1.3] text-serp-hostname",
+      mobile: "text-[12px] leading-[20px] text-serp-hostname-mobile"
+    }
+  }
+});
+const serpTitle = cva("text-[20px] font-normal", {
+  variants: {
+    mode: {
+      desktop: "block leading-[1.3] text-serp-title max-w-[600px] overflow-hidden text-ellipsis whitespace-nowrap",
+      mobile: "leading-[26px] text-serp-title-mobile line-clamp-2 max-h-[52px] overflow-hidden"
+    }
+  }
+});
+const serpDescription = cva("text-[14px] [&_strong]:font-bold", {
+  variants: {
+    mode: {
+      desktop: "leading-[1.58] text-serp-description max-w-[600px]",
+      mobile: "leading-[1.4] text-serp-description-mobile"
+    }
+  }
+});
+export {
+  serpContainer,
+  serpDescription,
+  serpHostname,
+  serpSiteName,
+  serpTitle,
+  serpUrlRow
+};
+//# sourceMappingURL=variants.js.map

package/dist/components/SeoDrawer/components/SerpPreview/variants.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../src/components/SeoDrawer/components/SerpPreview/variants.ts"],"sourcesContent":["import { cva } from \"class-variance-authority\";\n\nexport const serpContainer = cva(\"\", {\n  variants: {\n    mode: {\n      desktop: \"w-[600px] font-[arial,sans-serif]\",\n      mobile: \"max-w-[368px] font-[Arial,Roboto-Regular,HelveticaNeue,sans-serif]\",\n    },\n  },\n});\n\nexport const serpUrlRow = cva(\"flex items-center gap-x-[12px] mb-[12px] pt-[1px] overflow-hidden whitespace-nowrap text-ellipsis\", {\n  variants: {\n    mode: {\n      desktop: \"\",\n      mobile: \"\",\n    },\n  },\n});\n\nexport const serpSiteName = cva(\"text-[14px] leading-[18px] text-serp-sitename font-normal\", {\n  variants: {\n    mode: {\n      desktop: \"\",\n      mobile: \"max-w-[300px]\",\n    },\n  },\n});\n\nexport const serpHostname = cva(\"\", {\n  variants: {\n    mode: {\n      desktop: \"text-[14px] leading-[1.3] text-serp-hostname\",\n      mobile: \"text-[12px] leading-[20px] text-serp-hostname-mobile\",\n    },\n  },\n});\n\nexport const serpTitle = cva(\"text-[20px] font-normal\", {\n  variants: {\n    mode: {\n      desktop: \"block leading-[1.3] text-serp-title max-w-[600px] overflow-hidden text-ellipsis whitespace-nowrap\",\n      mobile: \"leading-[26px] text-serp-title-mobile line-clamp-2 max-h-[52px] overflow-hidden\",\n    },\n  },\n});\n\nexport const serpDescription = cva(\"text-[14px] [&_strong]:font-bold\", {\n  variants: {\n    mode: {\n      desktop: \"leading-[1.58] text-serp-description max-w-[600px]\",\n      mobile: \"leading-[1.4] text-serp-description-mobile\",\n    },\n  },\n});\n"],"mappings":"AAAA,SAAS,WAAW;AAEb,MAAM,gBAAgB,IAAI,IAAI;AAAA,EACnC,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;AAEM,MAAM,aAAa,IAAI,qGAAqG;AAAA,EACjI,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;AAEM,MAAM,eAAe,IAAI,6DAA6D;AAAA,EAC3F,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;AAEM,MAAM,eAAe,IAAI,IAAI;AAAA,EAClC,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;AAEM,MAAM,YAAY,IAAI,2BAA2B;AAAA,EACtD,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;AAEM,MAAM,kBAAkB,IAAI,oCAAoC;AAAA,EACrE,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,QAAQ;AAAA,IACV;AAAA,EACF;AACF,CAAC;","names":[]}

package/dist/components/SeoDrawer/index.d.ts

@@ -0,0 +1,18 @@
+import type { AnalysisResult } from "../../engine/types/analysis";
+import "../../admin.css";
+export interface SeoDrawerProps {
+    drawerSlug: string;
+    keyphrase: string;
+    setKeyphrase: (keyphrase: string) => void;
+    result: AnalysisResult | null;
+    analyzing: boolean;
+    keyphrasePending: boolean;
+    analyzeNow: () => void;
+    site: {
+        name: string;
+        baseUrl: string;
+        faviconUrl: string;
+    };
+}
+export declare const SeoDrawer: import("react").NamedExoticComponent<SeoDrawerProps>;
+//# sourceMappingURL=index.d.ts.map

package/dist/components/SeoDrawer/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/SeoDrawer/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAe,MAAM,6BAA6B,CAAC;AAW/E,OAAO,iBAAiB,CAAC;AAEzB,MAAM,WAAW,cAAc;IAC7B,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,MAAM,EAAE,cAAc,GAAG,IAAI,CAAC;IAC9B,SAAS,EAAE,OAAO,CAAC;IACnB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,IAAI,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,MAAM,CAAC;QAAC,UAAU,EAAE,MAAM,CAAA;KAAE,CAAC;CAC7D;AAED,eAAO,MAAM,SAAS,sDAiCpB,CAAC"}

package/dist/components/SeoDrawer/index.js

@@ -0,0 +1,37 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Drawer } from "@payloadcms/ui";
+import { Loader2 } from "lucide-react";
+import { memo, useState } from "react";
+import { Header } from "./components/Header";
+import { TabsNav } from "./TabsNav";
+import { KeyphraseTab } from "./tabs/KeyphraseTab";
+import { OnPageTab } from "./tabs/OnPageTab";
+import { ReadabilityTab } from "./tabs/ReadabilityTab";
+import { InclusiveTab } from "./tabs/InclusiveTab";
+import { SerpTab } from "./tabs/SerpTab";
+import { VitalsTab } from "./tabs/VitalsTab";
+import "../../admin.css";
+const SeoDrawer = memo(function SeoDrawer2({ drawerSlug, keyphrase, setKeyphrase, result, analyzing, keyphrasePending, analyzeNow, site }) {
+  const [tab, setTab] = useState("keyphrase");
+  const total = result?.overall.seoScore ?? 0;
+  const totalStatus = result ? result.overall.status : "idle";
+  return /* @__PURE__ */ jsx(Drawer, { slug: drawerSlug, className: "seo-drawer", Header: /* @__PURE__ */ jsx(Header, { drawerSlug, total, totalStatus }), children: /* @__PURE__ */ jsxs("div", { className: "seo-root relative text-neutral-800", "data-status": totalStatus, children: [
+    /* @__PURE__ */ jsx(TabsNav, { active: tab, onChange: setTab }),
+    /* @__PURE__ */ jsx("div", { className: "py-[18px]", children: result === null ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[8px] text-neutral-500 text-[13px]", role: "status", "aria-live": "polite", children: [
+      /* @__PURE__ */ jsx(Loader2, { "aria-hidden": "true", className: "w-[14px] h-[14px] animate-spin" }),
+      "Analyzing\u2026"
+    ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+      tab === "keyphrase" && /* @__PURE__ */ jsx(KeyphraseTab, { data: result.keyphrase, keyphrase, setKeyphrase, analyzing, keyphrasePending, analyzeNow }),
+      tab === "onpage" && /* @__PURE__ */ jsx(OnPageTab, { data: result.onPage }),
+      tab === "readability" && /* @__PURE__ */ jsx(ReadabilityTab, { data: result.readability }),
+      tab === "inclusive" && /* @__PURE__ */ jsx(InclusiveTab, { data: result.inclusive }),
+      tab === "vitals" && /* @__PURE__ */ jsx(VitalsTab, { data: result.vitals, onRequestKeyphrase: () => setTab("keyphrase") }),
+      tab === "serp" && /* @__PURE__ */ jsx(SerpTab, { data: result.serp, keyphrase, faviconUrl: site.faviconUrl })
+    ] }) })
+  ] }) });
+});
+export {
+  SeoDrawer
+};
+//# sourceMappingURL=index.js.map

package/dist/components/SeoDrawer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/SeoDrawer/index.tsx"],"sourcesContent":["\"use client\";\n\nimport { Drawer } from \"@payloadcms/ui\";\nimport { Loader2 } from \"lucide-react\";\nimport { memo, useState } from \"react\";\nimport type { AnalysisResult, TotalStatus } from \"../../engine/types/analysis\";\nimport { Header } from \"./components/Header\";\nimport { TabsNav } from \"./TabsNav\";\nimport type { TabKey } from \"./TabsNav\";\nimport { KeyphraseTab } from \"./tabs/KeyphraseTab\";\nimport { OnPageTab } from \"./tabs/OnPageTab\";\nimport { ReadabilityTab } from \"./tabs/ReadabilityTab\";\nimport { InclusiveTab } from \"./tabs/InclusiveTab\";\nimport { SerpTab } from \"./tabs/SerpTab\";\nimport { VitalsTab } from \"./tabs/VitalsTab\";\n\nimport \"../../admin.css\";\n\nexport interface SeoDrawerProps {\n  drawerSlug: string;\n  keyphrase: string;\n  setKeyphrase: (keyphrase: string) => void;\n  result: AnalysisResult | null;\n  analyzing: boolean;\n  keyphrasePending: boolean;\n  analyzeNow: () => void;\n  site: { name: string; baseUrl: string; faviconUrl: string };\n}\n\nexport const SeoDrawer = memo(function SeoDrawer({ drawerSlug, keyphrase, setKeyphrase, result, analyzing, keyphrasePending, analyzeNow, site }: SeoDrawerProps) {\n  const [tab, setTab] = useState<TabKey>(\"keyphrase\");\n\n  const total = result?.overall.seoScore ?? 0;\n  const totalStatus: TotalStatus = result ? result.overall.status : \"idle\";\n\n  return (\n    <Drawer slug={drawerSlug} className=\"seo-drawer\" Header={<Header drawerSlug={drawerSlug} total={total} totalStatus={totalStatus} />}>\n      <div className=\"seo-root relative text-neutral-800\" data-status={totalStatus}>\n        <TabsNav active={tab} onChange={setTab} />\n\n        <div className=\"py-[18px]\">\n          {result === null ? (\n            <div className=\"flex items-center gap-[8px] text-neutral-500 text-[13px]\" role=\"status\" aria-live=\"polite\">\n              <Loader2 aria-hidden=\"true\" className=\"w-[14px] h-[14px] animate-spin\" />\n              Analyzing…\n            </div>\n          ) : (\n            <>\n              {tab === \"keyphrase\" && (\n                <KeyphraseTab data={result.keyphrase} keyphrase={keyphrase} setKeyphrase={setKeyphrase} analyzing={analyzing} keyphrasePending={keyphrasePending} analyzeNow={analyzeNow} />\n              )}\n              {tab === \"onpage\" && <OnPageTab data={result.onPage} />}\n              {tab === \"readability\" && <ReadabilityTab data={result.readability} />}\n              {tab === \"inclusive\" && <InclusiveTab data={result.inclusive} />}\n              {tab === \"vitals\" && <VitalsTab data={result.vitals} onRequestKeyphrase={() => setTab(\"keyphrase\")} />}\n              {tab === \"serp\" && <SerpTab data={result.serp} keyphrase={keyphrase} faviconUrl={site.faviconUrl} />}\n            </>\n          )}\n        </div>\n      </div>\n    </Drawer>\n  );\n});\n"],"mappings":";AAoC6D,SAWjD,UAXiD,KAMjD,YANiD;AAlC7D,SAAS,cAAc;AACvB,SAAS,eAAe;AACxB,SAAS,MAAM,gBAAgB;AAE/B,SAAS,cAAc;AACvB,SAAS,eAAe;AAExB,SAAS,oBAAoB;AAC7B,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAE1B,OAAO;AAaA,MAAM,YAAY,KAAK,SAASA,WAAU,EAAE,YAAY,WAAW,cAAc,QAAQ,WAAW,kBAAkB,YAAY,KAAK,GAAmB;AAC/J,QAAM,CAAC,KAAK,MAAM,IAAI,SAAiB,WAAW;AAElD,QAAM,QAAQ,QAAQ,QAAQ,YAAY;AAC1C,QAAM,cAA2B,SAAS,OAAO,QAAQ,SAAS;AAElE,SACE,oBAAC,UAAO,MAAM,YAAY,WAAU,cAAa,QAAQ,oBAAC,UAAO,YAAwB,OAAc,aAA0B,GAC/H,+BAAC,SAAI,WAAU,sCAAqC,eAAa,aAC/D;AAAA,wBAAC,WAAQ,QAAQ,KAAK,UAAU,QAAQ;AAAA,IAExC,oBAAC,SAAI,WAAU,aACZ,qBAAW,OACV,qBAAC,SAAI,WAAU,4DAA2D,MAAK,UAAS,aAAU,UAChG;AAAA,0BAAC,WAAQ,eAAY,QAAO,WAAU,kCAAiC;AAAA,MAAE;AAAA,OAE3E,IAEA,iCACG;AAAA,cAAQ,eACP,oBAAC,gBAAa,MAAM,OAAO,WAAW,WAAsB,cAA4B,WAAsB,kBAAoC,YAAwB;AAAA,MAE3K,QAAQ,YAAY,oBAAC,aAAU,MAAM,OAAO,QAAQ;AAAA,MACpD,QAAQ,iBAAiB,oBAAC,kBAAe,MAAM,OAAO,aAAa;AAAA,MACnE,QAAQ,eAAe,oBAAC,gBAAa,MAAM,OAAO,WAAW;AAAA,MAC7D,QAAQ,YAAY,oBAAC,aAAU,MAAM,OAAO,QAAQ,oBAAoB,MAAM,OAAO,WAAW,GAAG;AAAA,MACnG,QAAQ,UAAU,oBAAC,WAAQ,MAAM,OAAO,MAAM,WAAsB,YAAY,KAAK,YAAY;AAAA,OACpG,GAEJ;AAAA,KACF,GACF;AAEJ,CAAC;","names":["SeoDrawer"]}

package/dist/components/SeoDrawer/keyphrasePending.d.ts

@@ -0,0 +1,2 @@
+export declare function isKeyphrasePending(liveKeyphrase: string, analyzedKeyphrase: string | null): boolean;
+//# sourceMappingURL=keyphrasePending.d.ts.map

package/dist/components/SeoDrawer/keyphrasePending.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyphrasePending.d.ts","sourceRoot":"","sources":["../../../src/components/SeoDrawer/keyphrasePending.ts"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,CAAC,aAAa,EAAE,MAAM,EAAE,iBAAiB,EAAE,MAAM,GAAG,IAAI,GAAG,OAAO,CAGnG"}

package/dist/components/SeoDrawer/keyphrasePending.js

@@ -0,0 +1,9 @@
+function isKeyphrasePending(liveKeyphrase, analyzedKeyphrase) {
+  if (liveKeyphrase.trim().length === 0)
+    return false;
+  return liveKeyphrase !== analyzedKeyphrase;
+}
+export {
+  isKeyphrasePending
+};
+//# sourceMappingURL=keyphrasePending.js.map

package/dist/components/SeoDrawer/keyphrasePending.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/SeoDrawer/keyphrasePending.ts"],"sourcesContent":["export function isKeyphrasePending(liveKeyphrase: string, analyzedKeyphrase: string | null): boolean {\n  if (liveKeyphrase.trim().length === 0) return false;\n  return liveKeyphrase !== analyzedKeyphrase;\n}\n"],"mappings":"AAAO,SAAS,mBAAmB,eAAuB,mBAA2C;AACnG,MAAI,cAAc,KAAK,EAAE,WAAW;AAAG,WAAO;AAC9C,SAAO,kBAAkB;AAC3B;","names":[]}

package/dist/components/SeoDrawer/languagePacks.d.ts

@@ -0,0 +1,2 @@
+export declare function ensureLanguagePack(locale: string, supported: string[]): Promise<void>;
+//# sourceMappingURL=languagePacks.d.ts.map

package/dist/components/SeoDrawer/languagePacks.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"languagePacks.d.ts","sourceRoot":"","sources":["../../../src/components/SeoDrawer/languagePacks.ts"],"names":[],"mappings":"AAIA,wBAAsB,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,CAU3F"}

package/dist/components/SeoDrawer/languagePacks.js

@@ -0,0 +1,19 @@
+"use client";
+const loaded = /* @__PURE__ */ new Set(["en"]);
+async function ensureLanguagePack(locale, supported) {
+  const lang = locale.split("_")[0] ?? "en";
+  if (lang === "en" || loaded.has(lang) || !supported.includes(lang))
+    return;
+  try {
+    await import(
+      /* @vite-ignore */
+      `yoastseo/build/languageProcessing/languages/${lang}/Researcher`
+    );
+    loaded.add(lang);
+  } catch {
+  }
+}
+export {
+  ensureLanguagePack
+};
+//# sourceMappingURL=languagePacks.js.map

package/dist/components/SeoDrawer/languagePacks.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/SeoDrawer/languagePacks.ts"],"sourcesContent":["\"use client\";\n\nconst loaded = new Set<string>([\"en\"]);\n\nexport async function ensureLanguagePack(locale: string, supported: string[]): Promise<void> {\n  const lang = locale.split(\"_\")[0] ?? \"en\";\n\n  if (lang === \"en\" || loaded.has(lang) || !supported.includes(lang)) return;\n\n  try {\n    await import(/* @vite-ignore */ `yoastseo/build/languageProcessing/languages/${lang}/Researcher`);\n\n    loaded.add(lang);\n  } catch {}\n}\n"],"mappings":";AAEA,MAAM,SAAS,oBAAI,IAAY,CAAC,IAAI,CAAC;AAErC,eAAsB,mBAAmB,QAAgB,WAAoC;AAC3F,QAAM,OAAO,OAAO,MAAM,GAAG,EAAE,CAAC,KAAK;AAErC,MAAI,SAAS,QAAQ,OAAO,IAAI,IAAI,KAAK,CAAC,UAAU,SAAS,IAAI;AAAG;AAEpE,MAAI;AACF,UAAM;AAAA;AAAA,MAA0B,+CAA+C,IAAI;AAAA;AAEnF,WAAO,IAAI,IAAI;AAAA,EACjB,QAAQ;AAAA,EAAC;AACX;","names":[]}

package/dist/components/SeoDrawer/tabs/InclusiveTab.d.ts

@@ -0,0 +1,5 @@
+import type { AnalysisResult } from "../../../engine/types/analysis";
+export declare function InclusiveTab({ data }: {
+    data: AnalysisResult["inclusive"];
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=InclusiveTab.d.ts.map

package/dist/components/SeoDrawer/tabs/InclusiveTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InclusiveTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/InclusiveTab.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAMrE,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;CAAE,2CAmD3E"}

package/dist/components/SeoDrawer/tabs/InclusiveTab.js

@@ -0,0 +1,46 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { cn, ROW_SEPARATOR } from "../../../utils/style";
+import { TabHeader } from "../../../ui/TabHeader";
+import { SectionCard } from "../../../ui/SectionCard";
+import { Pill } from "../../../ui/Pill";
+function InclusiveTab({ data }) {
+  const flagged = data.categories.reduce((n, c) => n + c.flags.length, 0);
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-[13px]", children: [
+    /* @__PURE__ */ jsx(
+      TabHeader,
+      {
+        title: "Inclusive language",
+        score: data.ringScore,
+        status: data.status,
+        statusLabel: data.status === "good" ? "Good" : "Needs work",
+        subtitle: /* @__PURE__ */ jsxs(Fragment, { children: [
+          flagged,
+          " phrases flagged across ",
+          data.categories.length,
+          " categories"
+        ] })
+      }
+    ),
+    data.categories.length > 0 && /* @__PURE__ */ jsx(SectionCard, { title: "Marked by category", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: flagged }), children: data.categories.map((cat) => /* @__PURE__ */ jsxs("div", { className: cn("relative px-[15px] py-[12px]", ROW_SEPARATOR), children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[8px] mb-[9px]", children: [
+        /* @__PURE__ */ jsx("span", { className: "font-bold text-[12.5px]", children: cat.name }),
+        /* @__PURE__ */ jsx(Pill, { variant: "bad", children: cat.flags.length })
+      ] }),
+      cat.flags.map((f, i) => /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[9px] py-[6px] text-[12px]", children: [
+        /* @__PURE__ */ jsx("span", { className: "text-seo-bad font-medium whitespace-nowrap", children: f.term }),
+        /* @__PURE__ */ jsx("span", { className: "text-neutral-300", children: "\u203A" }),
+        /* @__PURE__ */ jsx("span", { className: "text-seo-good font-medium flex-1", children: f.suggestion }),
+        /* @__PURE__ */ jsx("span", { className: "text-neutral-500 font-mono text-[10.5px] whitespace-nowrap", children: f.location })
+      ] }, `${f.term}-${i}`))
+    ] }, cat.name)) }),
+    data.cleanCategories.length > 0 && /* @__PURE__ */ jsx(SectionCard, { title: "No issues found", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: data.cleanCategories.length }), children: /* @__PURE__ */ jsx("div", { className: "flex gap-[8px] flex-wrap px-[15px] py-[13px]", children: data.cleanCategories.map((n) => /* @__PURE__ */ jsxs("span", { className: "inline-flex items-center gap-[6px] text-[11.5px] text-seo-good bg-seo-good-100 border border-seo-good-200 rounded-[20px] px-[11px] py-[4px] font-medium", children: [
+      "\u2713 ",
+      n
+    ] }, n)) }) })
+  ] });
+}
+export {
+  InclusiveTab
+};
+//# sourceMappingURL=InclusiveTab.js.map

package/dist/components/SeoDrawer/tabs/InclusiveTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SeoDrawer/tabs/InclusiveTab.tsx"],"sourcesContent":["\"use client\";\n\nimport type { AnalysisResult } from \"../../../engine/types/analysis\";\nimport { cn, ROW_SEPARATOR } from \"../../../utils/style\";\nimport { TabHeader } from \"../../../ui/TabHeader\";\nimport { SectionCard } from \"../../../ui/SectionCard\";\nimport { Pill } from \"../../../ui/Pill\";\n\nexport function InclusiveTab({ data }: { data: AnalysisResult[\"inclusive\"] }) {\n  const flagged = data.categories.reduce((n, c) => n + c.flags.length, 0);\n\n  return (\n    <section className=\"flex flex-col gap-[13px]\">\n      <TabHeader\n        title=\"Inclusive language\"\n        score={data.ringScore}\n        status={data.status}\n        statusLabel={data.status === \"good\" ? \"Good\" : \"Needs work\"}\n        subtitle={\n          <>\n            {flagged} phrases flagged across {data.categories.length} categories\n          </>\n        }\n      />\n\n      {data.categories.length > 0 && (\n        <SectionCard title=\"Marked by category\" widget={<Pill variant=\"neutral\">{flagged}</Pill>}>\n          {data.categories.map((cat) => (\n            <div className={cn(\"relative px-[15px] py-[12px]\", ROW_SEPARATOR)} key={cat.name}>\n              <div className=\"flex items-center gap-[8px] mb-[9px]\">\n                <span className=\"font-bold text-[12.5px]\">{cat.name}</span>\n                <Pill variant=\"bad\">{cat.flags.length}</Pill>\n              </div>\n              {cat.flags.map((f, i) => (\n                <div className=\"flex items-center gap-[9px] py-[6px] text-[12px]\" key={`${f.term}-${i}`}>\n                  <span className=\"text-seo-bad font-medium whitespace-nowrap\">{f.term}</span>\n                  <span className=\"text-neutral-300\">›</span>\n                  <span className=\"text-seo-good font-medium flex-1\">{f.suggestion}</span>\n                  <span className=\"text-neutral-500 font-mono text-[10.5px] whitespace-nowrap\">{f.location}</span>\n                </div>\n              ))}\n            </div>\n          ))}\n        </SectionCard>\n      )}\n\n      {data.cleanCategories.length > 0 && (\n        <SectionCard title=\"No issues found\" widget={<Pill variant=\"neutral\">{data.cleanCategories.length}</Pill>}>\n          <div className=\"flex gap-[8px] flex-wrap px-[15px] py-[13px]\">\n            {data.cleanCategories.map((n) => (\n              <span className=\"inline-flex items-center gap-[6px] text-[11.5px] text-seo-good bg-seo-good-100 border border-seo-good-200 rounded-[20px] px-[11px] py-[4px] font-medium\" key={n}>\n                ✓ {n}\n              </span>\n            ))}\n          </div>\n        </SectionCard>\n      )}\n    </section>\n  );\n}\n"],"mappings":";AAaM,SAMI,UANJ,KAMI,YANJ;AAVN,SAAS,IAAI,qBAAqB;AAClC,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AAEd,SAAS,aAAa,EAAE,KAAK,GAA0C;AAC5E,QAAM,UAAU,KAAK,WAAW,OAAO,CAAC,GAAG,MAAM,IAAI,EAAE,MAAM,QAAQ,CAAC;AAEtE,SACE,qBAAC,aAAQ,WAAU,4BACjB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,KAAK;AAAA,QACZ,QAAQ,KAAK;AAAA,QACb,aAAa,KAAK,WAAW,SAAS,SAAS;AAAA,QAC/C,UACE,iCACG;AAAA;AAAA,UAAQ;AAAA,UAAyB,KAAK,WAAW;AAAA,UAAO;AAAA,WAC3D;AAAA;AAAA,IAEJ;AAAA,IAEC,KAAK,WAAW,SAAS,KACxB,oBAAC,eAAY,OAAM,sBAAqB,QAAQ,oBAAC,QAAK,SAAQ,WAAW,mBAAQ,GAC9E,eAAK,WAAW,IAAI,CAAC,QACpB,qBAAC,SAAI,WAAW,GAAG,gCAAgC,aAAa,GAC9D;AAAA,2BAAC,SAAI,WAAU,wCACb;AAAA,4BAAC,UAAK,WAAU,2BAA2B,cAAI,MAAK;AAAA,QACpD,oBAAC,QAAK,SAAQ,OAAO,cAAI,MAAM,QAAO;AAAA,SACxC;AAAA,MACC,IAAI,MAAM,IAAI,CAAC,GAAG,MACjB,qBAAC,SAAI,WAAU,oDACb;AAAA,4BAAC,UAAK,WAAU,8CAA8C,YAAE,MAAK;AAAA,QACrE,oBAAC,UAAK,WAAU,oBAAmB,oBAAC;AAAA,QACpC,oBAAC,UAAK,WAAU,oCAAoC,YAAE,YAAW;AAAA,QACjE,oBAAC,UAAK,WAAU,8DAA8D,YAAE,UAAS;AAAA,WAJpB,GAAG,EAAE,IAAI,IAAI,CAAC,EAKrF,CACD;AAAA,SAZqE,IAAI,IAa5E,CACD,GACH;AAAA,IAGD,KAAK,gBAAgB,SAAS,KAC7B,oBAAC,eAAY,OAAM,mBAAkB,QAAQ,oBAAC,QAAK,SAAQ,WAAW,eAAK,gBAAgB,QAAO,GAChG,8BAAC,SAAI,WAAU,gDACZ,eAAK,gBAAgB,IAAI,CAAC,MACzB,qBAAC,UAAK,WAAU,2JAAkK;AAAA;AAAA,MAC7K;AAAA,SAD0K,CAE/K,CACD,GACH,GACF;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/SeoDrawer/tabs/KeyphraseTab.d.ts

@@ -0,0 +1,11 @@
+import type { CategoryResult } from "../../../engine/types/analysis";
+export interface KeyphraseTabProps {
+    data: CategoryResult;
+    keyphrase: string;
+    setKeyphrase: (keyphrase: string) => void;
+    analyzing: boolean;
+    keyphrasePending: boolean;
+    analyzeNow: () => void;
+}
+export declare function KeyphraseTab({ data, keyphrase, setKeyphrase, analyzing, keyphrasePending, analyzeNow }: KeyphraseTabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=KeyphraseTab.d.ts.map

package/dist/components/SeoDrawer/tabs/KeyphraseTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"KeyphraseTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/KeyphraseTab.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAQrE,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,cAAc,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC1C,SAAS,EAAE,OAAO,CAAC;IACnB,gBAAgB,EAAE,OAAO,CAAC;IAC1B,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAED,wBAAgB,YAAY,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,YAAY,EAAE,SAAS,EAAE,gBAAgB,EAAE,UAAU,EAAE,EAAE,iBAAiB,2CAiEzH"}

package/dist/components/SeoDrawer/tabs/KeyphraseTab.js

@@ -0,0 +1,72 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { Loader2 } from "lucide-react";
+import { useState } from "react";
+import { hasKeyphrase } from "../../../engine/helpers/has-keyphrase";
+import { TabHeader } from "../../../ui/TabHeader";
+import { SectionCard } from "../../../ui/SectionCard";
+import { Pill } from "../../../ui/Pill";
+import { FilterPills } from "../../../ui/FilterPills";
+import { CheckRow } from "../../../ui/CheckRow";
+function KeyphraseTab({ data, keyphrase, setKeyphrase, analyzing, keyphrasePending, analyzeNow }) {
+  const [filter, setFilter] = useState("all");
+  const visible = data.checks.filter((c) => filter === "all" || c.status === filter);
+  const passing = data.checks.filter((c) => c.status === "good").length;
+  const keyphrasePresent = hasKeyphrase(keyphrase);
+  const checksReady = keyphrasePresent && !keyphrasePending && !analyzing && data.checks.length > 0;
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-[13px]", children: [
+    /* @__PURE__ */ jsxs("div", { className: "flex gap-[8px]", children: [
+      /* @__PURE__ */ jsx("label", { className: "flex-1 flex items-center gap-[8px] px-[12px] py-[9px] border border-neutral-200 rounded-rs bg-neutral-0", children: /* @__PURE__ */ jsx(
+        "input",
+        {
+          type: "text",
+          className: "border-0 outline-none flex-1 text-[13px] text-neutral-800 bg-transparent",
+          value: keyphrase,
+          onChange: (e) => setKeyphrase(e.target.value),
+          placeholder: "Focus keyphrase",
+          "aria-label": "Focus keyphrase"
+        }
+      ) }),
+      /* @__PURE__ */ jsx("span", { "aria-live": "polite", className: "sr-only", role: "status", children: keyphrasePending ? "Analyzing keyphrase\u2026" : "" }),
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          type: "button",
+          className: "px-[18px] py-[9px] bg-neutral-1000 text-neutral-0 border-0 rounded-rs font-medium text-[13px] cursor-pointer disabled:opacity-50",
+          disabled: !keyphrasePresent,
+          onClick: () => analyzeNow(),
+          children: analyzing ? "Analyzing\u2026" : "Analyze"
+        }
+      )
+    ] }),
+    !keyphrasePresent && /* @__PURE__ */ jsx("p", { className: "text-neutral-500 text-[13px]", children: "Enter a focus keyphrase to analyze how well your content targets it." }),
+    keyphrasePresent && !checksReady && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-[8px] text-neutral-500 text-[13px]", children: [
+      /* @__PURE__ */ jsx(Loader2, { "aria-hidden": "true", className: "w-[14px] h-[14px] animate-spin" }),
+      "Analyzing keyphrase\u2026"
+    ] }),
+    checksReady && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        TabHeader,
+        {
+          title: "Keyphrase optimization",
+          score: data.ringScore,
+          status: data.status,
+          subtitle: /* @__PURE__ */ jsxs(Fragment, { children: [
+            passing,
+            " / ",
+            data.checks.length,
+            " checks passing"
+          ] })
+        }
+      ),
+      /* @__PURE__ */ jsxs(SectionCard, { title: "Checks", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: data.checks.length }), children: [
+        /* @__PURE__ */ jsx(FilterPills, { checks: data.checks, value: filter, onChange: setFilter }),
+        visible.map((c) => /* @__PURE__ */ jsx(CheckRow, { check: c }, c.id))
+      ] })
+    ] })
+  ] });
+}
+export {
+  KeyphraseTab
+};
+//# sourceMappingURL=KeyphraseTab.js.map

package/dist/components/SeoDrawer/tabs/KeyphraseTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SeoDrawer/tabs/KeyphraseTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { Loader2 } from \"lucide-react\";\nimport { useState } from \"react\";\nimport { hasKeyphrase } from \"../../../engine/helpers/has-keyphrase\";\nimport type { CategoryResult } from \"../../../engine/types/analysis\";\nimport { TabHeader } from \"../../../ui/TabHeader\";\nimport { SectionCard } from \"../../../ui/SectionCard\";\nimport { Pill } from \"../../../ui/Pill\";\nimport { FilterPills } from \"../../../ui/FilterPills\";\nimport type { Filter } from \"../../../ui/FilterPills\";\nimport { CheckRow } from \"../../../ui/CheckRow\";\n\nexport interface KeyphraseTabProps {\n  data: CategoryResult;\n  keyphrase: string;\n  setKeyphrase: (keyphrase: string) => void;\n  analyzing: boolean;\n  keyphrasePending: boolean;\n  analyzeNow: () => void;\n}\n\nexport function KeyphraseTab({ data, keyphrase, setKeyphrase, analyzing, keyphrasePending, analyzeNow }: KeyphraseTabProps) {\n  const [filter, setFilter] = useState<Filter>(\"all\");\n  const visible = data.checks.filter((c) => filter === \"all\" || c.status === filter);\n  const passing = data.checks.filter((c) => c.status === \"good\").length;\n  const keyphrasePresent = hasKeyphrase(keyphrase);\n  const checksReady = keyphrasePresent && !keyphrasePending && !analyzing && data.checks.length > 0;\n\n  return (\n    <section className=\"flex flex-col gap-[13px]\">\n      <div className=\"flex gap-[8px]\">\n        <label className=\"flex-1 flex items-center gap-[8px] px-[12px] py-[9px] border border-neutral-200 rounded-rs bg-neutral-0\">\n          <input\n            type=\"text\"\n            className=\"border-0 outline-none flex-1 text-[13px] text-neutral-800 bg-transparent\"\n            value={keyphrase}\n            onChange={(e) => setKeyphrase(e.target.value)}\n            placeholder=\"Focus keyphrase\"\n            aria-label=\"Focus keyphrase\"\n          />\n        </label>\n        <span aria-live=\"polite\" className=\"sr-only\" role=\"status\">\n          {keyphrasePending ? \"Analyzing keyphrase…\" : \"\"}\n        </span>\n        <button\n          type=\"button\"\n          className=\"px-[18px] py-[9px] bg-neutral-1000 text-neutral-0 border-0 rounded-rs font-medium text-[13px] cursor-pointer disabled:opacity-50\"\n          disabled={!keyphrasePresent}\n          onClick={() => analyzeNow()}\n        >\n          {analyzing ? \"Analyzing…\" : \"Analyze\"}\n        </button>\n      </div>\n\n      {!keyphrasePresent && <p className=\"text-neutral-500 text-[13px]\">Enter a focus keyphrase to analyze how well your content targets it.</p>}\n\n      {keyphrasePresent && !checksReady && (\n        <div className=\"flex items-center gap-[8px] text-neutral-500 text-[13px]\">\n          <Loader2 aria-hidden=\"true\" className=\"w-[14px] h-[14px] animate-spin\" />\n          Analyzing keyphrase…\n        </div>\n      )}\n\n      {checksReady && (\n        <>\n          <TabHeader\n            title=\"Keyphrase optimization\"\n            score={data.ringScore}\n            status={data.status}\n            subtitle={\n              <>\n                {passing} / {data.checks.length} checks passing\n              </>\n            }\n          />\n\n          <SectionCard title=\"Checks\" widget={<Pill variant=\"neutral\">{data.checks.length}</Pill>}>\n            <FilterPills checks={data.checks} value={filter} onChange={setFilter} />\n            {visible.map((c) => (\n              <CheckRow key={c.id} check={c} />\n            ))}\n          </SectionCard>\n        </>\n      )}\n    </section>\n  );\n}\n"],"mappings":";AA+BM,SAwCQ,UAtCJ,KAFJ;AA7BN,SAAS,eAAe;AACxB,SAAS,gBAAgB;AACzB,SAAS,oBAAoB;AAE7B,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB;AAWlB,SAAS,aAAa,EAAE,MAAM,WAAW,cAAc,WAAW,kBAAkB,WAAW,GAAsB;AAC1H,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,KAAK;AAClD,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,WAAW,SAAS,EAAE,WAAW,MAAM;AACjF,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,EAAE,WAAW,MAAM,EAAE;AAC/D,QAAM,mBAAmB,aAAa,SAAS;AAC/C,QAAM,cAAc,oBAAoB,CAAC,oBAAoB,CAAC,aAAa,KAAK,OAAO,SAAS;AAEhG,SACE,qBAAC,aAAQ,WAAU,4BACjB;AAAA,yBAAC,SAAI,WAAU,kBACb;AAAA,0BAAC,WAAM,WAAU,2GACf;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,OAAO;AAAA,UACP,UAAU,CAAC,MAAM,aAAa,EAAE,OAAO,KAAK;AAAA,UAC5C,aAAY;AAAA,UACZ,cAAW;AAAA;AAAA,MACb,GACF;AAAA,MACA,oBAAC,UAAK,aAAU,UAAS,WAAU,WAAU,MAAK,UAC/C,6BAAmB,8BAAyB,IAC/C;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,UAAU,CAAC;AAAA,UACX,SAAS,MAAM,WAAW;AAAA,UAEzB,sBAAY,oBAAe;AAAA;AAAA,MAC9B;AAAA,OACF;AAAA,IAEC,CAAC,oBAAoB,oBAAC,OAAE,WAAU,gCAA+B,kFAAoE;AAAA,IAErI,oBAAoB,CAAC,eACpB,qBAAC,SAAI,WAAU,4DACb;AAAA,0BAAC,WAAQ,eAAY,QAAO,WAAU,kCAAiC;AAAA,MAAE;AAAA,OAE3E;AAAA,IAGD,eACC,iCACE;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,OAAM;AAAA,UACN,OAAO,KAAK;AAAA,UACZ,QAAQ,KAAK;AAAA,UACb,UACE,iCACG;AAAA;AAAA,YAAQ;AAAA,YAAI,KAAK,OAAO;AAAA,YAAO;AAAA,aAClC;AAAA;AAAA,MAEJ;AAAA,MAEA,qBAAC,eAAY,OAAM,UAAS,QAAQ,oBAAC,QAAK,SAAQ,WAAW,eAAK,OAAO,QAAO,GAC9E;AAAA,4BAAC,eAAY,QAAQ,KAAK,QAAQ,OAAO,QAAQ,UAAU,WAAW;AAAA,QACrE,QAAQ,IAAI,CAAC,MACZ,oBAAC,YAAoB,OAAO,KAAb,EAAE,EAAc,CAChC;AAAA,SACH;AAAA,OACF;AAAA,KAEJ;AAEJ;","names":[]}

package/dist/components/SeoDrawer/tabs/OnPageTab.d.ts

@@ -0,0 +1,5 @@
+import type { CategoryResult } from "../../../engine/types/analysis";
+export declare function OnPageTab({ data }: {
+    data: CategoryResult;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OnPageTab.d.ts.map

package/dist/components/SeoDrawer/tabs/OnPageTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OnPageTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/OnPageTab.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAQrE,wBAAgB,SAAS,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,cAAc,CAAA;CAAE,2CA0B3D"}

package/dist/components/SeoDrawer/tabs/OnPageTab.js

@@ -0,0 +1,37 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { TabHeader } from "../../../ui/TabHeader";
+import { SectionCard } from "../../../ui/SectionCard";
+import { Pill } from "../../../ui/Pill";
+import { FilterPills } from "../../../ui/FilterPills";
+import { CheckRow } from "../../../ui/CheckRow";
+function OnPageTab({ data }) {
+  const [filter, setFilter] = useState("all");
+  const visible = data.checks.filter((c) => filter === "all" || c.status === filter);
+  const passing = data.checks.filter((c) => c.status === "good").length;
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-[13px]", children: [
+    /* @__PURE__ */ jsx(
+      TabHeader,
+      {
+        title: "On-page structure",
+        score: data.ringScore,
+        status: data.status,
+        subtitle: /* @__PURE__ */ jsxs(Fragment, { children: [
+          passing,
+          " / ",
+          data.checks.length,
+          " checks passing"
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxs(SectionCard, { title: "Checks", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: data.checks.length }), children: [
+      /* @__PURE__ */ jsx(FilterPills, { checks: data.checks, value: filter, onChange: setFilter }),
+      visible.map((c) => /* @__PURE__ */ jsx(CheckRow, { check: c }, c.id))
+    ] })
+  ] });
+}
+export {
+  OnPageTab
+};
+//# sourceMappingURL=OnPageTab.js.map

package/dist/components/SeoDrawer/tabs/OnPageTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SeoDrawer/tabs/OnPageTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport type { CategoryResult } from \"../../../engine/types/analysis\";\nimport { TabHeader } from \"../../../ui/TabHeader\";\nimport { SectionCard } from \"../../../ui/SectionCard\";\nimport { Pill } from \"../../../ui/Pill\";\nimport { FilterPills } from \"../../../ui/FilterPills\";\nimport type { Filter } from \"../../../ui/FilterPills\";\nimport { CheckRow } from \"../../../ui/CheckRow\";\n\nexport function OnPageTab({ data }: { data: CategoryResult }) {\n  const [filter, setFilter] = useState<Filter>(\"all\");\n  const visible = data.checks.filter((c) => filter === \"all\" || c.status === filter);\n  const passing = data.checks.filter((c) => c.status === \"good\").length;\n\n  return (\n    <section className=\"flex flex-col gap-[13px]\">\n      <TabHeader\n        title=\"On-page structure\"\n        score={data.ringScore}\n        status={data.status}\n        subtitle={\n          <>\n            {passing} / {data.checks.length} checks passing\n          </>\n        }\n      />\n\n      <SectionCard title=\"Checks\" widget={<Pill variant=\"neutral\">{data.checks.length}</Pill>}>\n        <FilterPills checks={data.checks} value={filter} onChange={setFilter} />\n        {visible.map((c) => (\n          <CheckRow key={c.id} check={c} />\n        ))}\n      </SectionCard>\n    </section>\n  );\n}\n"],"mappings":";AAkBM,SAKI,UALJ,KAKI,YALJ;AAhBN,SAAS,gBAAgB;AAEzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB;AAElB,SAAS,UAAU,EAAE,KAAK,GAA6B;AAC5D,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,KAAK;AAClD,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,WAAW,SAAS,EAAE,WAAW,MAAM;AACjF,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,EAAE,WAAW,MAAM,EAAE;AAE/D,SACE,qBAAC,aAAQ,WAAU,4BACjB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,KAAK;AAAA,QACZ,QAAQ,KAAK;AAAA,QACb,UACE,iCACG;AAAA;AAAA,UAAQ;AAAA,UAAI,KAAK,OAAO;AAAA,UAAO;AAAA,WAClC;AAAA;AAAA,IAEJ;AAAA,IAEA,qBAAC,eAAY,OAAM,UAAS,QAAQ,oBAAC,QAAK,SAAQ,WAAW,eAAK,OAAO,QAAO,GAC9E;AAAA,0BAAC,eAAY,QAAQ,KAAK,QAAQ,OAAO,QAAQ,UAAU,WAAW;AAAA,MACrE,QAAQ,IAAI,CAAC,MACZ,oBAAC,YAAoB,OAAO,KAAb,EAAE,EAAc,CAChC;AAAA,OACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/SeoDrawer/tabs/ReadabilityTab.d.ts

@@ -0,0 +1,5 @@
+import type { CategoryResult } from "../../../engine/types/analysis";
+export declare function ReadabilityTab({ data }: {
+    data: CategoryResult;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=ReadabilityTab.d.ts.map

package/dist/components/SeoDrawer/tabs/ReadabilityTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReadabilityTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/ReadabilityTab.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAQrE,wBAAgB,cAAc,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,cAAc,CAAA;CAAE,2CA0BhE"}

package/dist/components/SeoDrawer/tabs/ReadabilityTab.js

@@ -0,0 +1,37 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { TabHeader } from "../../../ui/TabHeader";
+import { SectionCard } from "../../../ui/SectionCard";
+import { Pill } from "../../../ui/Pill";
+import { FilterPills } from "../../../ui/FilterPills";
+import { CheckRow } from "../../../ui/CheckRow";
+function ReadabilityTab({ data }) {
+  const [filter, setFilter] = useState("all");
+  const visible = data.checks.filter((c) => filter === "all" || c.status === filter);
+  const passing = data.checks.filter((c) => c.status === "good").length;
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-[13px]", children: [
+    /* @__PURE__ */ jsx(
+      TabHeader,
+      {
+        title: "Readability",
+        score: data.ringScore,
+        status: data.status,
+        subtitle: /* @__PURE__ */ jsxs(Fragment, { children: [
+          passing,
+          " / ",
+          data.checks.length,
+          " checks passing"
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsxs(SectionCard, { title: "Checks", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: data.checks.length }), children: [
+      /* @__PURE__ */ jsx(FilterPills, { checks: data.checks, value: filter, onChange: setFilter }),
+      visible.map((c) => /* @__PURE__ */ jsx(CheckRow, { check: c }, c.id))
+    ] })
+  ] });
+}
+export {
+  ReadabilityTab
+};
+//# sourceMappingURL=ReadabilityTab.js.map

package/dist/components/SeoDrawer/tabs/ReadabilityTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SeoDrawer/tabs/ReadabilityTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport type { CategoryResult } from \"../../../engine/types/analysis\";\nimport { TabHeader } from \"../../../ui/TabHeader\";\nimport { SectionCard } from \"../../../ui/SectionCard\";\nimport { Pill } from \"../../../ui/Pill\";\nimport { FilterPills } from \"../../../ui/FilterPills\";\nimport type { Filter } from \"../../../ui/FilterPills\";\nimport { CheckRow } from \"../../../ui/CheckRow\";\n\nexport function ReadabilityTab({ data }: { data: CategoryResult }) {\n  const [filter, setFilter] = useState<Filter>(\"all\");\n  const visible = data.checks.filter((c) => filter === \"all\" || c.status === filter);\n  const passing = data.checks.filter((c) => c.status === \"good\").length;\n\n  return (\n    <section className=\"flex flex-col gap-[13px]\">\n      <TabHeader\n        title=\"Readability\"\n        score={data.ringScore}\n        status={data.status}\n        subtitle={\n          <>\n            {passing} / {data.checks.length} checks passing\n          </>\n        }\n      />\n\n      <SectionCard title=\"Checks\" widget={<Pill variant=\"neutral\">{data.checks.length}</Pill>}>\n        <FilterPills checks={data.checks} value={filter} onChange={setFilter} />\n        {visible.map((c) => (\n          <CheckRow key={c.id} check={c} />\n        ))}\n      </SectionCard>\n    </section>\n  );\n}\n"],"mappings":";AAkBM,SAKI,UALJ,KAKI,YALJ;AAhBN,SAAS,gBAAgB;AAEzB,SAAS,iBAAiB;AAC1B,SAAS,mBAAmB;AAC5B,SAAS,YAAY;AACrB,SAAS,mBAAmB;AAE5B,SAAS,gBAAgB;AAElB,SAAS,eAAe,EAAE,KAAK,GAA6B;AACjE,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAiB,KAAK;AAClD,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,WAAW,SAAS,EAAE,WAAW,MAAM;AACjF,QAAM,UAAU,KAAK,OAAO,OAAO,CAAC,MAAM,EAAE,WAAW,MAAM,EAAE;AAE/D,SACE,qBAAC,aAAQ,WAAU,4BACjB;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,OAAM;AAAA,QACN,OAAO,KAAK;AAAA,QACZ,QAAQ,KAAK;AAAA,QACb,UACE,iCACG;AAAA;AAAA,UAAQ;AAAA,UAAI,KAAK,OAAO;AAAA,UAAO;AAAA,WAClC;AAAA;AAAA,IAEJ;AAAA,IAEA,qBAAC,eAAY,OAAM,UAAS,QAAQ,oBAAC,QAAK,SAAQ,WAAW,eAAK,OAAO,QAAO,GAC9E;AAAA,0BAAC,eAAY,QAAQ,KAAK,QAAQ,OAAO,QAAQ,UAAU,WAAW;AAAA,MACrE,QAAQ,IAAI,CAAC,MACZ,oBAAC,YAAoB,OAAO,KAAb,EAAE,EAAc,CAChC;AAAA,OACH;AAAA,KACF;AAEJ;","names":[]}

package/dist/components/SeoDrawer/tabs/SerpTab.d.ts

@@ -0,0 +1,7 @@
+import type { SerpResult } from "../../../engine/types/analysis";
+export declare function SerpTab({ data, keyphrase, faviconUrl }: {
+    data: SerpResult;
+    keyphrase: string;
+    faviconUrl: string;
+}): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SerpTab.d.ts.map

package/dist/components/SeoDrawer/tabs/SerpTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SerpTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/SerpTab.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gCAAgC,CAAC;AAMjE,wBAAgB,OAAO,CAAC,EAAE,IAAI,EAAE,SAAS,EAAE,UAAU,EAAE,EAAE;IAAE,IAAI,EAAE,UAAU,CAAC;IAAC,SAAS,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAA;CAAE,2CAiCnH"}

package/dist/components/SeoDrawer/tabs/SerpTab.js

@@ -0,0 +1,41 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { Monitor, Smartphone } from "lucide-react";
+import { useState } from "react";
+import { SectionCard } from "../../../ui/SectionCard";
+import { SegmentedControl } from "../../../ui/SegmentedControl";
+import { SerpPreview } from "../components/SerpPreview";
+function SerpTab({ data, keyphrase, faviconUrl }) {
+  const [mode, setMode] = useState("mobile");
+  return /* @__PURE__ */ jsx("section", { className: "flex flex-col gap-[13px]", children: /* @__PURE__ */ jsx(
+    SectionCard,
+    {
+      title: "Search result preview",
+      widget: /* @__PURE__ */ jsx(
+        SegmentedControl,
+        {
+          options: [
+            {
+              value: "mobile",
+              label: "Mobile",
+              icon: /* @__PURE__ */ jsx(Smartphone, { "aria-hidden": "true", className: "w-[13px] h-[13px]" })
+            },
+            {
+              value: "desktop",
+              label: "Desktop",
+              icon: /* @__PURE__ */ jsx(Monitor, { "aria-hidden": "true", className: "w-[13px] h-[13px]" })
+            }
+          ],
+          value: mode,
+          onChange: setMode,
+          label: "Preview device"
+        }
+      ),
+      children: /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx(SerpPreview, { data, keyphrase, faviconUrl, mode }) })
+    }
+  ) });
+}
+export {
+  SerpTab
+};
+//# sourceMappingURL=SerpTab.js.map

package/dist/components/SeoDrawer/tabs/SerpTab.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SeoDrawer/tabs/SerpTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { Monitor, Smartphone } from \"lucide-react\";\nimport { useState } from \"react\";\n\nimport type { SerpResult } from \"../../../engine/types/analysis\";\nimport { SectionCard } from \"../../../ui/SectionCard\";\nimport { SegmentedControl } from \"../../../ui/SegmentedControl\";\nimport { SerpPreview } from \"../components/SerpPreview\";\nimport type { SerpMode } from \"../components/SerpPreview\";\n\nexport function SerpTab({ data, keyphrase, faviconUrl }: { data: SerpResult; keyphrase: string; faviconUrl: string }) {\n  const [mode, setMode] = useState<SerpMode>(\"mobile\");\n\n  return (\n    <section className=\"flex flex-col gap-[13px]\">\n      <SectionCard\n        title=\"Search result preview\"\n        widget={\n          <SegmentedControl\n            options={[\n              {\n                value: \"mobile\",\n                label: \"Mobile\",\n                icon: <Smartphone aria-hidden=\"true\" className=\"w-[13px] h-[13px]\" />,\n              },\n              {\n                value: \"desktop\",\n                label: \"Desktop\",\n                icon: <Monitor aria-hidden=\"true\" className=\"w-[13px] h-[13px]\" />,\n              },\n            ]}\n            value={mode}\n            onChange={setMode}\n            label=\"Preview device\"\n          />\n        }\n      >\n        <div className=\"p-4\">\n          <SerpPreview data={data} keyphrase={keyphrase} faviconUrl={faviconUrl} mode={mode} />\n        </div>\n      </SectionCard>\n    </section>\n  );\n}\n"],"mappings":";AAwBsB;AAtBtB,SAAS,SAAS,kBAAkB;AACpC,SAAS,gBAAgB;AAGzB,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAGrB,SAAS,QAAQ,EAAE,MAAM,WAAW,WAAW,GAAgE;AACpH,QAAM,CAAC,MAAM,OAAO,IAAI,SAAmB,QAAQ;AAEnD,SACE,oBAAC,aAAQ,WAAU,4BACjB;AAAA,IAAC;AAAA;AAAA,MACC,OAAM;AAAA,MACN,QACE;AAAA,QAAC;AAAA;AAAA,UACC,SAAS;AAAA,YACP;AAAA,cACE,OAAO;AAAA,cACP,OAAO;AAAA,cACP,MAAM,oBAAC,cAAW,eAAY,QAAO,WAAU,qBAAoB;AAAA,YACrE;AAAA,YACA;AAAA,cACE,OAAO;AAAA,cACP,OAAO;AAAA,cACP,MAAM,oBAAC,WAAQ,eAAY,QAAO,WAAU,qBAAoB;AAAA,YAClE;AAAA,UACF;AAAA,UACA,OAAO;AAAA,UACP,UAAU;AAAA,UACV,OAAM;AAAA;AAAA,MACR;AAAA,MAGF,8BAAC,SAAI,WAAU,OACb,8BAAC,eAAY,MAAY,WAAsB,YAAwB,MAAY,GACrF;AAAA;AAAA,EACF,GACF;AAEJ;","names":[]}

package/dist/components/SeoDrawer/tabs/VitalsTab.d.ts

@@ -0,0 +1,7 @@
+import type { VitalsResult } from "../../../engine/types/analysis";
+export interface VitalsTabProps {
+    data: VitalsResult;
+    onRequestKeyphrase: () => void;
+}
+export declare function VitalsTab({ data, onRequestKeyphrase }: VitalsTabProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=VitalsTab.d.ts.map

package/dist/components/SeoDrawer/tabs/VitalsTab.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VitalsTab.d.ts","sourceRoot":"","sources":["../../../../src/components/SeoDrawer/tabs/VitalsTab.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gCAAgC,CAAC;AAMnE,MAAM,WAAW,cAAc;IAC7B,IAAI,EAAE,YAAY,CAAC;IACnB,kBAAkB,EAAE,MAAM,IAAI,CAAC;CAChC;AAED,wBAAgB,SAAS,CAAC,EAAE,IAAI,EAAE,kBAAkB,EAAE,EAAE,cAAc,2CAwCrE"}

package/dist/components/SeoDrawer/tabs/VitalsTab.js

@@ -0,0 +1,42 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn, ROW_SEPARATOR } from "../../../utils/style";
+import { KpiCard } from "../../../ui/KpiCard";
+import { SectionCard } from "../../../ui/SectionCard";
+import { Pill } from "../../../ui/Pill";
+function VitalsTab({ data, onRequestKeyphrase }) {
+  const max = Math.max(1, ...data.prominentWords.map((w) => w.count));
+  const noKeyphraseMatch = data.prominentWords.every((w) => !w.isKeyphrase);
+  return /* @__PURE__ */ jsxs("section", { className: "flex flex-col gap-[13px]", children: [
+    /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-[9px]", children: [
+      /* @__PURE__ */ jsx(KpiCard, { label: "Words", value: data.words.toLocaleString() }),
+      /* @__PURE__ */ jsx(KpiCard, { label: "Sentences", value: data.sentences }),
+      /* @__PURE__ */ jsx(KpiCard, { label: "Paragraphs", value: data.paragraphs }),
+      /* @__PURE__ */ jsx(KpiCard, { label: "Images", value: data.images }),
+      /* @__PURE__ */ jsx(KpiCard, { label: "Videos", value: data.videos }),
+      /* @__PURE__ */ jsx(KpiCard, { label: "Reading time", value: data.readingTimeMinutes, suffix: "min" })
+    ] }),
+    /* @__PURE__ */ jsx(SectionCard, { title: "Prominent words", widget: /* @__PURE__ */ jsx(Pill, { variant: "neutral", children: data.prominentWords.length }), children: data.prominentWords.map((w) => /* @__PURE__ */ jsxs("div", { className: cn("relative flex items-center gap-[12px] px-[15px] py-[9px]", ROW_SEPARATOR), children: [
+      /* @__PURE__ */ jsxs("div", { className: "w-[120px] flex-none text-[12px] font-medium flex items-center gap-[6px]", children: [
+        w.word,
+        " ",
+        w.isKeyphrase && /* @__PURE__ */ jsx("span", { className: "text-[9px] font-bold uppercase tracking-[0.04em] text-neutral-1000 bg-neutral-150 rounded-[3px] px-[5px] py-[1px]", children: "Key" })
+      ] }),
+      /* @__PURE__ */ jsx("div", { className: "flex-1 h-[6px] rounded-[3px] bg-neutral-100 overflow-hidden", children: /* @__PURE__ */ jsx("i", { className: cn("block h-full", w.isKeyphrase ? "bg-neutral-1000" : "bg-neutral-400"), style: { width: `${w.count / max * 100}%` } }) }),
+      /* @__PURE__ */ jsx("div", { className: "w-[30px] text-right font-mono text-[11px] font-semibold text-neutral-700", children: w.count })
+    ] }, w.word)) }),
+    noKeyphraseMatch && /* @__PURE__ */ jsx(
+      "button",
+      {
+        type: "button",
+        onClick: onRequestKeyphrase,
+        className: "self-start text-[12px] text-neutral-600 underline underline-offset-2 hover:text-neutral-800 cursor-pointer bg-transparent border-0 p-0",
+        children: "Set a focus keyphrase to see which prominent words match it"
+      }
+    )
+  ] });
+}
+export {
+  VitalsTab
+};
+//# sourceMappingURL=VitalsTab.js.map