Replace readability analysis with categorized document metrics (#25)

Author: arthurkowalsky

RELEASES.md

@@ -9,6 +9,7 @@
 - **DOCX table formatting** — Header row is now properly bold in exported DOCX. Table spans full document width with column widths proportional to content length.
 
 ### Changed
+- **Document metrics** — Readability panel (Flesch-Kincaid score, passive voice) replaced with practical document metrics. Shows character counts (with and without spaces) and word counts broken down by content category: title page, headings, body text, lists, tables, and code blocks. Useful for formal documents with character or page limits where different elements may count differently. Badge in the preview header shows total character count. Heading hierarchy validation preserved.
 - **Honest title page preview** — Live preview now shows title page only from explicit YAML frontmatter instead of auto-generating phantom titles and dates from H1 headings and `new Date()`. When no frontmatter is present, a clickable placeholder guides users to add metadata. DOCX/PDF/HTML export retains auto-fallback behavior for professional output.
 - **Document Options** — "Export Options" renamed to "Document Options". Toggles (Title Page, ToC, Header, Footer) now affect both live preview and export, making the editor truly WYSIWYG.
 

index.html

@@ -210,23 +210,41 @@
         max-height: 600px;
       }
 
-      .metric-row {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        padding: 0.375rem 0;
-        border-bottom: 1px solid #f3f4f6;
+      .metrics-table {
+        width: 100%;
+        border-collapse: collapse;
         font-size: 0.8rem;
       }
-      .metric-row:last-child {
-        border-bottom: none;
-      }
-      .metric-label {
+      .metrics-table th {
+        text-align: left;
         color: #6b7280;
+        font-weight: 500;
+        padding: 0.25rem 0.5rem;
+        border-bottom: 2px solid #e5e7eb;
+        font-size: 0.7rem;
+        text-transform: uppercase;
+        letter-spacing: 0.05em;
       }
-      .metric-value {
-        font-weight: 600;
+      .metrics-table th:not(:first-child) {
+        text-align: right;
+      }
+      .metrics-table td {
+        padding: 0.2rem 0.5rem;
+        border-bottom: 1px solid #f3f4f6;
+      }
+      .metrics-table td:not(:first-child) {
+        text-align: right;
         font-family: monospace;
+        font-weight: 500;
+      }
+      .metrics-table .metrics-total td {
+        border-top: 2px solid #e5e7eb;
+        border-bottom: none;
+        font-weight: 700;
+        padding-top: 0.375rem;
+      }
+      .metrics-table .metrics-zero td:not(:first-child) {
+        color: #d1d5db;
       }
 
       .toggle-switch {

src/ai/document-metrics.js

@@ -0,0 +1,118 @@
+import { parseInlineSegments } from "../inline-formatting.js";
+
+const RE_HEADING = /^h([1-4])$/;
+const RE_HAS_INLINE_MARKERS = /[*_`\[]/;
+
+function zeroCounts() {
+  return { chars: 0, charsNoSpaces: 0, words: 0 };
+}
+
+function stripInlineMarkdown(text) {
+  if (!RE_HAS_INLINE_MARKERS.test(text)) return text;
+  const segments = parseInlineSegments(text);
+  let result = "";
+  for (const s of segments) result += s.text;
+  return result;
+}
+
+function countText(cleanText) {
+  const len = cleanText.length;
+  let charsNoSpaces = 0;
+  let words = 0;
+  let inWord = false;
+  for (let i = 0; i < len; i++) {
+    const ch = cleanText.charCodeAt(i);
+    const isSpace = ch === 32 || ch === 9 || ch === 10 || ch === 13;
+    if (!isSpace) {
+      charsNoSpaces++;
+      if (!inWord) {
+        words++;
+        inWord = true;
+      }
+    } else {
+      inWord = false;
+    }
+  }
+  return { chars: len, charsNoSpaces, words };
+}
+
+function addCounts(target, source) {
+  target.chars += source.chars;
+  target.charsNoSpaces += source.charsNoSpaces;
+  target.words += source.words;
+}
+
+function countAndAdd(target, text, strip = true) {
+  addCounts(target, countText(strip ? stripInlineMarkdown(text) : text));
+}
+
+function validateHeadingHierarchy(elements) {
+  const issues = [];
+  let lastLevel = 0;
+  for (const el of elements) {
+    const match = el.type.match(RE_HEADING);
+    if (!match) continue;
+    const level = parseInt(match[1]);
+    if (lastLevel > 0 && level > lastLevel + 1) {
+      issues.push({
+        content: el.content,
+        expected: `h${lastLevel + 1}`,
+        got: el.type,
+        line: el.line,
+      });
+    }
+    lastLevel = level;
+  }
+  return issues;
+}
+
+export function analyzeDocumentMetrics(elements, metadata) {
+  const categories = {
+    titlePage: zeroCounts(),
+    headings: zeroCounts(),
+    body: zeroCounts(),
+    lists: zeroCounts(),
+    tables: zeroCounts(),
+    code: zeroCounts(),
+  };
+  let diagrams = 0;
+
+  for (const el of elements) {
+    if (RE_HEADING.test(el.type)) {
+      countAndAdd(categories.headings, el.content);
+    } else if (el.type === "paragraph") {
+      countAndAdd(categories.body, el.content);
+    } else if (el.type === "bulletlist" || el.type === "numlist") {
+      for (const item of el.items) countAndAdd(categories.lists, item);
+    } else if (el.type === "checklist") {
+      for (const item of el.items) countAndAdd(categories.lists, item.text || "");
+    } else if (el.type === "table") {
+      for (const row of el.rows) {
+        for (const cell of row) countAndAdd(categories.tables, cell);
+      }
+    } else if (el.type === "codeblock") {
+      countAndAdd(categories.code, el.content, false);
+    } else if (el.type === "mermaid") {
+      diagrams++;
+    }
+  }
+
+  if (metadata?._hasExplicitFrontmatter) {
+    const fields = [metadata.title, metadata.subtitle, metadata.author, metadata.date].filter(
+      Boolean
+    );
+    categories.titlePage = countText(fields.join(" "));
+  }
+
+  const totals = zeroCounts();
+  for (const cat of Object.values(categories)) {
+    addCounts(totals, cat);
+  }
+
+  return {
+    categories,
+    totals,
+    diagrams,
+    headingIssues: validateHeadingHierarchy(elements),
+  };
+}