@power-seo/content-analysis 1.0.0

package/dist/react.cjs

@@ -0,0 +1,677 @@
+'use strict';
+
+var react = require('react');
+var core = require('@power-seo/core');
+
+// src/react.ts
+function checkTitle(input) {
+  const results = [];
+  const { title, focusKeyphrase } = input;
+  if (!title || title.trim().length === 0) {
+    results.push({
+      id: "title-presence",
+      title: "SEO title",
+      description: "No title has been set. Add a title to improve search visibility.",
+      status: "poor",
+      score: 0,
+      maxScore: 5
+    });
+    return results;
+  }
+  const validation = core.validateTitle(title);
+  if (!validation.valid) {
+    results.push({
+      id: "title-presence",
+      title: "SEO title",
+      description: validation.message,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else if (validation.severity === "warning") {
+    results.push({
+      id: "title-presence",
+      title: "SEO title",
+      description: validation.message,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "title-presence",
+      title: "SEO title",
+      description: validation.message,
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  }
+  if (focusKeyphrase && focusKeyphrase.trim().length > 0) {
+    const kp = focusKeyphrase.toLowerCase().trim();
+    const titleLower = title.toLowerCase();
+    if (titleLower.includes(kp)) {
+      results.push({
+        id: "title-keyphrase",
+        title: "Keyphrase in title",
+        description: "The focus keyphrase appears in the SEO title. Good job!",
+        status: "good",
+        score: 5,
+        maxScore: 5
+      });
+    } else {
+      results.push({
+        id: "title-keyphrase",
+        title: "Keyphrase in title",
+        description: "The focus keyphrase does not appear in the SEO title. Add it to improve relevance.",
+        status: "ok",
+        score: 2,
+        maxScore: 5
+      });
+    }
+  }
+  return results;
+}
+function checkMetaDescription(input) {
+  const results = [];
+  const { metaDescription, focusKeyphrase } = input;
+  if (!metaDescription || metaDescription.trim().length === 0) {
+    results.push({
+      id: "meta-description-presence",
+      title: "Meta description",
+      description: "No meta description has been set. Add one to control how your page appears in search results.",
+      status: "poor",
+      score: 0,
+      maxScore: 5
+    });
+    return results;
+  }
+  const validation = core.validateMetaDescription(metaDescription);
+  if (!validation.valid) {
+    results.push({
+      id: "meta-description-presence",
+      title: "Meta description",
+      description: validation.message,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else if (validation.severity === "warning") {
+    results.push({
+      id: "meta-description-presence",
+      title: "Meta description",
+      description: validation.message,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "meta-description-presence",
+      title: "Meta description",
+      description: validation.message,
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  }
+  if (focusKeyphrase && focusKeyphrase.trim().length > 0) {
+    const kp = focusKeyphrase.toLowerCase().trim();
+    const descLower = metaDescription.toLowerCase();
+    if (descLower.includes(kp)) {
+      results.push({
+        id: "meta-description-keyphrase",
+        title: "Keyphrase in meta description",
+        description: "The focus keyphrase appears in the meta description. Well done!",
+        status: "good",
+        score: 5,
+        maxScore: 5
+      });
+    } else {
+      results.push({
+        id: "meta-description-keyphrase",
+        title: "Keyphrase in meta description",
+        description: "The focus keyphrase does not appear in the meta description. Add it to improve click-through rate.",
+        status: "ok",
+        score: 2,
+        maxScore: 5
+      });
+    }
+  }
+  return results;
+}
+function checkKeyphraseUsage(input) {
+  const results = [];
+  const { focusKeyphrase, title, metaDescription, content, slug, images } = input;
+  if (!focusKeyphrase || focusKeyphrase.trim().length === 0) {
+    results.push({
+      id: "keyphrase-density",
+      title: "Keyphrase density",
+      description: "No focus keyphrase set. Set one to get keyphrase analysis.",
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+    return results;
+  }
+  const occurrences = core.analyzeKeyphraseOccurrences({
+    keyphrase: focusKeyphrase,
+    title,
+    metaDescription,
+    content,
+    slug,
+    images
+  });
+  const densityResult = core.calculateKeywordDensity(focusKeyphrase, content);
+  if (densityResult.density < core.KEYWORD_DENSITY.MIN) {
+    results.push({
+      id: "keyphrase-density",
+      title: "Keyphrase density",
+      description: `Keyphrase density is ${densityResult.density}%, which is below the recommended minimum of ${core.KEYWORD_DENSITY.MIN}%. Use the keyphrase more often.`,
+      status: "poor",
+      score: 1,
+      maxScore: 5
+    });
+  } else if (densityResult.density > core.KEYWORD_DENSITY.MAX) {
+    results.push({
+      id: "keyphrase-density",
+      title: "Keyphrase density",
+      description: `Keyphrase density is ${densityResult.density}%, which exceeds the recommended maximum of ${core.KEYWORD_DENSITY.MAX}%. Reduce usage to avoid keyword stuffing.`,
+      status: "poor",
+      score: 1,
+      maxScore: 5
+    });
+  } else if (densityResult.density >= core.KEYWORD_DENSITY.MIN && densityResult.density <= core.KEYWORD_DENSITY.MAX) {
+    const isOptimal = Math.abs(densityResult.density - core.KEYWORD_DENSITY.OPTIMAL) < 0.5;
+    results.push({
+      id: "keyphrase-density",
+      title: "Keyphrase density",
+      description: `Keyphrase density is ${densityResult.density}%.${isOptimal ? " Great \u2014 this is close to the optimal density." : " This is within the recommended range."}`,
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  }
+  const distributionPoints = [];
+  if (!occurrences.inFirstParagraph) distributionPoints.push("introduction");
+  if (!occurrences.inH1 && occurrences.inHeadings === 0) distributionPoints.push("headings");
+  if (!occurrences.inSlug) distributionPoints.push("slug");
+  if (occurrences.inAltText === 0 && images && images.length > 0)
+    distributionPoints.push("image alt text");
+  if (distributionPoints.length === 0) {
+    results.push({
+      id: "keyphrase-distribution",
+      title: "Keyphrase distribution",
+      description: "The focus keyphrase is well-distributed across the introduction, headings, slug, and image alt text.",
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  } else if (distributionPoints.length <= 2) {
+    results.push({
+      id: "keyphrase-distribution",
+      title: "Keyphrase distribution",
+      description: `Consider adding the keyphrase to: ${distributionPoints.join(", ")}.`,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "keyphrase-distribution",
+      title: "Keyphrase distribution",
+      description: `The keyphrase is missing from: ${distributionPoints.join(", ")}. Distribute it more broadly.`,
+      status: "poor",
+      score: 1,
+      maxScore: 5
+    });
+  }
+  return results;
+}
+function parseHeadings(html) {
+  const headings = [];
+  const regex = /<h([1-6])[^>]*>([\s\S]*?)<\/h\1>/gi;
+  let match;
+  while ((match = regex.exec(html)) !== null) {
+    headings.push({
+      level: parseInt(match[1], 10),
+      text: core.stripHtml(match[2])
+    });
+  }
+  return headings;
+}
+function checkHeadings(input) {
+  const results = [];
+  const { content, focusKeyphrase } = input;
+  const headings = parseHeadings(content);
+  const h1s = headings.filter((h) => h.level === 1);
+  if (h1s.length === 0) {
+    results.push({
+      id: "heading-structure",
+      title: "Heading structure",
+      description: "No H1 heading found. Add exactly one H1 as the main heading of your page.",
+      status: "poor",
+      score: 0,
+      maxScore: 5
+    });
+  } else if (h1s.length > 1) {
+    results.push({
+      id: "heading-structure",
+      title: "Heading structure",
+      description: `Found ${h1s.length} H1 headings. Use exactly one H1 per page for proper SEO.`,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+  } else {
+    let hasSkippedLevel = false;
+    for (let i = 1; i < headings.length; i++) {
+      const prev = headings[i - 1];
+      const curr = headings[i];
+      if (curr.level > prev.level + 1) {
+        hasSkippedLevel = true;
+        break;
+      }
+    }
+    if (hasSkippedLevel) {
+      results.push({
+        id: "heading-structure",
+        title: "Heading structure",
+        description: "The heading hierarchy skips levels (e.g., H2 to H4). Use sequential heading levels for better accessibility and SEO.",
+        status: "ok",
+        score: 3,
+        maxScore: 5
+      });
+    } else {
+      results.push({
+        id: "heading-structure",
+        title: "Heading structure",
+        description: "The heading structure looks good with a single H1 and proper hierarchy.",
+        status: "good",
+        score: 5,
+        maxScore: 5
+      });
+    }
+  }
+  if (focusKeyphrase && focusKeyphrase.trim().length > 0) {
+    const kp = focusKeyphrase.toLowerCase().trim();
+    const subheadings = headings.filter((h) => h.level >= 2);
+    const hasKeyphraseInSubheading = subheadings.some((h) => h.text.toLowerCase().includes(kp));
+    if (subheadings.length === 0) {
+      results.push({
+        id: "heading-keyphrase",
+        title: "Keyphrase in subheadings",
+        description: "No subheadings (H2-H6) found. Add subheadings to structure your content and include the focus keyphrase.",
+        status: "ok",
+        score: 2,
+        maxScore: 5
+      });
+    } else if (hasKeyphraseInSubheading) {
+      results.push({
+        id: "heading-keyphrase",
+        title: "Keyphrase in subheadings",
+        description: "The focus keyphrase appears in at least one subheading. Nice!",
+        status: "good",
+        score: 5,
+        maxScore: 5
+      });
+    } else {
+      results.push({
+        id: "heading-keyphrase",
+        title: "Keyphrase in subheadings",
+        description: "The focus keyphrase does not appear in any subheading. Consider adding it to an H2 or H3.",
+        status: "ok",
+        score: 2,
+        maxScore: 5
+      });
+    }
+  }
+  return results;
+}
+function checkWordCount(input) {
+  const words = core.getWords(input.content);
+  const count = words.length;
+  if (count < core.MIN_WORD_COUNT) {
+    return {
+      id: "word-count",
+      title: "Word count",
+      description: `The content is ${count} words, which is below the recommended minimum of ${core.MIN_WORD_COUNT}. Add more content to improve SEO.`,
+      status: "poor",
+      score: 1,
+      maxScore: 5
+    };
+  }
+  if (count < core.RECOMMENDED_WORD_COUNT) {
+    return {
+      id: "word-count",
+      title: "Word count",
+      description: `The content is ${count} words. Consider expanding to at least ${core.RECOMMENDED_WORD_COUNT} words for more comprehensive coverage.`,
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    };
+  }
+  return {
+    id: "word-count",
+    title: "Word count",
+    description: `The content is ${count} words. Good \u2014 this provides enough depth for search engines.`,
+    status: "good",
+    score: 5,
+    maxScore: 5
+  };
+}
+
+// src/checks/images.ts
+function checkImages(input) {
+  const results = [];
+  const { images, focusKeyphrase } = input;
+  if (!images || images.length === 0) {
+    results.push({
+      id: "image-alt",
+      title: "Image alt attributes",
+      description: "No images found. Consider adding images to make your content more engaging.",
+      status: "ok",
+      score: 3,
+      maxScore: 5
+    });
+    return results;
+  }
+  const missingAlt = images.filter((img) => !img.alt || img.alt.trim().length === 0);
+  if (missingAlt.length === 0) {
+    results.push({
+      id: "image-alt",
+      title: "Image alt attributes",
+      description: "All images have alt text. Great for accessibility and SEO!",
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  } else if (missingAlt.length === images.length) {
+    results.push({
+      id: "image-alt",
+      title: "Image alt attributes",
+      description: "None of the images have alt text. Add descriptive alt attributes for accessibility and SEO.",
+      status: "poor",
+      score: 0,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "image-alt",
+      title: "Image alt attributes",
+      description: `${missingAlt.length} of ${images.length} images are missing alt text. Add alt attributes to all images.`,
+      status: "ok",
+      score: 2,
+      maxScore: 5
+    });
+  }
+  if (focusKeyphrase && focusKeyphrase.trim().length > 0) {
+    const kp = focusKeyphrase.toLowerCase().trim();
+    const hasKeyphraseInAlt = images.some(
+      (img) => img.alt && img.alt.toLowerCase().includes(kp)
+    );
+    if (hasKeyphraseInAlt) {
+      results.push({
+        id: "image-keyphrase",
+        title: "Keyphrase in image alt",
+        description: "The focus keyphrase appears in at least one image alt attribute.",
+        status: "good",
+        score: 5,
+        maxScore: 5
+      });
+    } else {
+      results.push({
+        id: "image-keyphrase",
+        title: "Keyphrase in image alt",
+        description: "The focus keyphrase does not appear in any image alt attribute. Add it to at least one image.",
+        status: "ok",
+        score: 2,
+        maxScore: 5
+      });
+    }
+  }
+  return results;
+}
+
+// src/checks/links.ts
+function checkLinks(input) {
+  const results = [];
+  const { internalLinks, externalLinks } = input;
+  const hasInternal = internalLinks && internalLinks.length > 0;
+  const hasExternal = externalLinks && externalLinks.length > 0;
+  if (!hasInternal) {
+    results.push({
+      id: "internal-links",
+      title: "Internal links",
+      description: "No internal links found. Add links to other pages on your site to improve crawlability and distribute link equity.",
+      status: "ok",
+      score: 2,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "internal-links",
+      title: "Internal links",
+      description: `Found ${internalLinks.length} internal link${internalLinks.length === 1 ? "" : "s"}. Good for site structure and SEO.`,
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  }
+  if (!hasExternal) {
+    results.push({
+      id: "external-links",
+      title: "External links",
+      description: "No external links found. Consider adding outbound links to authoritative sources to strengthen your content.",
+      status: "ok",
+      score: 2,
+      maxScore: 5
+    });
+  } else {
+    results.push({
+      id: "external-links",
+      title: "External links",
+      description: `Found ${externalLinks.length} external link${externalLinks.length === 1 ? "" : "s"}. Linking to quality sources adds credibility.`,
+      status: "good",
+      score: 5,
+      maxScore: 5
+    });
+  }
+  return results;
+}
+
+// src/analyzer.ts
+function analyzeContent(input, config) {
+  const disabled = new Set(config?.disabledChecks ?? []);
+  const allResults = [];
+  const titleResults = checkTitle(input);
+  const metaResults = checkMetaDescription(input);
+  const keyphraseResults = checkKeyphraseUsage(input);
+  const headingResults = checkHeadings(input);
+  const wordCountResult = checkWordCount(input);
+  const imageResults = checkImages(input);
+  const linkResults = checkLinks(input);
+  const candidateResults = [
+    ...titleResults,
+    ...metaResults,
+    ...keyphraseResults,
+    ...headingResults,
+    wordCountResult,
+    ...imageResults,
+    ...linkResults
+  ];
+  for (const result of candidateResults) {
+    if (!disabled.has(result.id)) {
+      allResults.push(result);
+    }
+  }
+  const score = allResults.reduce((sum, r) => sum + r.score, 0);
+  const maxScore = allResults.reduce((sum, r) => sum + r.maxScore, 0);
+  const recommendations = allResults.filter((r) => r.status === "poor" || r.status === "ok").map((r) => r.description);
+  return {
+    score,
+    maxScore,
+    results: allResults,
+    recommendations
+  };
+}
+
+// src/react.ts
+function getScoreColor(percentage) {
+  if (percentage >= 70) return "#1e8e3e";
+  if (percentage >= 40) return "#f29900";
+  return "#d93025";
+}
+function getScoreLabel(percentage) {
+  if (percentage >= 70) return "Good";
+  if (percentage >= 40) return "OK";
+  return "Needs improvement";
+}
+function ScorePanel({ score, maxScore }) {
+  const percentage = maxScore > 0 ? Math.round(score / maxScore * 100) : 0;
+  const color = getScoreColor(percentage);
+  const label = getScoreLabel(percentage);
+  return react.createElement(
+    "div",
+    {
+      style: {
+        fontFamily: "system-ui, -apple-system, sans-serif",
+        padding: "16px",
+        borderRadius: "8px",
+        border: "1px solid #e0e0e0",
+        backgroundColor: "#fff"
+      }
+    },
+    react.createElement(
+      "div",
+      {
+        style: {
+          display: "flex",
+          justifyContent: "space-between",
+          alignItems: "center",
+          marginBottom: "8px"
+        }
+      },
+      react.createElement(
+        "span",
+        { style: { fontWeight: 600, fontSize: "14px", color: "#333" } },
+        "SEO Score"
+      ),
+      react.createElement(
+        "span",
+        { style: { fontWeight: 700, fontSize: "18px", color } },
+        `${percentage}%`
+      )
+    ),
+    react.createElement(
+      "div",
+      {
+        style: {
+          width: "100%",
+          height: "8px",
+          backgroundColor: "#e8e8e8",
+          borderRadius: "4px",
+          overflow: "hidden"
+        }
+      },
+      react.createElement("div", {
+        style: {
+          width: `${percentage}%`,
+          height: "100%",
+          backgroundColor: color,
+          borderRadius: "4px",
+          transition: "width 0.3s ease"
+        }
+      })
+    ),
+    react.createElement(
+      "div",
+      { style: { marginTop: "4px", fontSize: "12px", color: "#666" } },
+      `${label} \u2014 ${score}/${maxScore} points`
+    )
+  );
+}
+var STATUS_ICONS = {
+  good: "\u2705",
+  ok: "\u26A0\uFE0F",
+  poor: "\u274C"
+};
+var STATUS_COLORS = {
+  good: "#1e8e3e",
+  ok: "#f29900",
+  poor: "#d93025"
+};
+function CheckList({ results }) {
+  return react.createElement(
+    "ul",
+    {
+      style: {
+        listStyle: "none",
+        padding: 0,
+        margin: 0,
+        fontFamily: "system-ui, -apple-system, sans-serif"
+      }
+    },
+    ...results.map(
+      (result) => react.createElement(
+        "li",
+        {
+          key: result.id,
+          style: {
+            padding: "10px 12px",
+            borderBottom: "1px solid #f0f0f0",
+            display: "flex",
+            gap: "10px",
+            alignItems: "flex-start"
+          }
+        },
+        react.createElement(
+          "span",
+          { style: { flexShrink: 0, fontSize: "14px" } },
+          STATUS_ICONS[result.status] ?? ""
+        ),
+        react.createElement(
+          "div",
+          { style: { flex: 1 } },
+          react.createElement(
+            "div",
+            {
+              style: {
+                fontWeight: 600,
+                fontSize: "13px",
+                color: STATUS_COLORS[result.status] ?? "#333"
+              }
+            },
+            result.title
+          ),
+          react.createElement(
+            "div",
+            { style: { fontSize: "12px", color: "#555", marginTop: "2px" } },
+            result.description
+          )
+        )
+      )
+    )
+  );
+}
+function ContentAnalyzer({ input, config, children }) {
+  const output = react.useMemo(() => analyzeContent(input, config), [input, config]);
+  return react.createElement(
+    "div",
+    {
+      style: {
+        fontFamily: "system-ui, -apple-system, sans-serif"
+      }
+    },
+    react.createElement(ScorePanel, { score: output.score, maxScore: output.maxScore }),
+    react.createElement("div", { style: { height: "12px" } }),
+    react.createElement(CheckList, { results: output.results }),
+    children ?? null
+  );
+}
+
+exports.CheckList = CheckList;
+exports.ContentAnalyzer = ContentAnalyzer;
+exports.ScorePanel = ScorePanel;
+//# sourceMappingURL=react.cjs.map
+//# sourceMappingURL=react.cjs.map