sdtk-design-kit 0.2.1 → 0.3.1

package/src/lib/prototype-component-map.js

@@ -1,219 +0,0 @@
-"use strict";
-
-const ROLE_CTA_DEFAULTS = {
-  home: "Start shopping",
-  category: "Browse products",
-  "product-detail": "Add to cart",
-  cart: "Checkout",
-  checkout: "Place order",
-  search: "Search",
-  "order-history": "View orders",
-  "order-detail": "View detail",
-  "account-info": "Save changes",
-  "configurator-bom": "Open configurator",
-  "mode-b-configurator": "Open configurator",
-};
-
-function truncatePrimaryAction(value, role) {
-  const text = String(value || "").trim();
-  if (text.length > 0 && text.length <= 60) return text;
-  return ROLE_CTA_DEFAULTS[role] || "Continue";
-}
-
-function classForComponent(componentId) {
-  const id = String(componentId || "").toLowerCase();
-  if (id === "configurator-cta" || id.includes("configurator-cta")) return "btn-primary";
-  if (id.includes("cta-secondary")) return "btn-secondary";
-  if (id.includes("cta-primary")) return "btn-primary";
-  if (id.includes("hero")) return "hero-section";
-  if (id.includes("feature")) return "feature-card";
-  if (id.includes("category")) return "category-card";
-  if (id.includes("product")) return "product-card";
-  if (id.includes("cart-table")) return "cart-table";
-  if (id.includes("bom-table")) return "cart-table bom-table";
-  if (id.includes("spec-table")) return "spec-table";
-  if (id.includes("qty-stepper") || id.includes("quantity")) return "qty-stepper";
-  if (id.includes("checkout-stepper") || id.includes("stepper") || id.includes("wizard")) return "checkout-stepper";
-  if (id.includes("summary")) return "summary-panel";
-  if (id.includes("preview")) return "preview-panel";
-  if (id.includes("detail")) return "detail-summary";
-  if (id.includes("filter") || id.includes("sidebar")) return "filter-sidebar account-sidebar";
-  if (id.includes("search-toolbar")) return "search-toolbar";
-  if (id.includes("result-list")) return "result-list";
-  if (id.includes("no-result")) return "no-result";
-  if (id.includes("history")) return "history-row";
-  if (id.includes("timeline")) return "timeline";
-  if (id.includes("form")) return "form-grid";
-  return "component-placeholder";
-}
-
-function componentClassFor(componentId) {
-  return classForComponent(componentId);
-}
-
-function renderDataSlotPlaceholder({ slot, section, escapeHtml }) {
-  const id = slot && slot.id ? slot.id : "slot";
-  const label = slot && slot.label ? slot.label : id;
-  return `<span class="data-slot-placeholder" data-slot-id="${escapeHtml(id)}" data-slot-label="${escapeHtml(label)}">${escapeHtml(label)} --</span>`;
-}
-
-function renderSlotList({ section, escapeHtml }) {
-  const slots = Array.isArray(section && section.data_slots) ? section.data_slots : [];
-  if (slots.length === 0) return "";
-  return `<div class="chip-row data-slot-row">${slots.map((slot) => renderDataSlotPlaceholder({ slot, section, escapeHtml })).join("")}</div>`;
-}
-
-function structuralSlots(slots, labels) {
-  const values = Array.isArray(slots) && slots.length > 0 ? slots.slice() : [];
-  for (const label of labels) {
-    if (values.length >= labels.length) break;
-    values.push({ id: label.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, ""), label });
-  }
-  return values;
-}
-
-function renderRolePrimary({ role, section, brief, traceAttrs, slots, escapeHtml }) {
-  if (role === "home") {
-    const cards = structuralSlots(slots, ["Category range", "Featured selection", "Configurator quick start"]);
-    return `<div class="feature-grid product-grid" ${traceAttrs}><h3>Featured products</h3><p class="support">Configurator quick start</p>${cards
-      .slice(0, 3)
-      .map((slot) => `<article class="feature-card category-card product-card" data-component-id="feature-card" data-slot-id="${escapeHtml(slot.id)}"><h3>${escapeHtml(slot.label)}</h3><p>${escapeHtml(section.purpose)}</p></article>`)
-      .join("")}<div class="button-row" data-component-id="cta-pair"><a class="btn btn-primary" href="#" data-static-action data-component-id="cta-primary">${escapeHtml(truncatePrimaryAction(brief.primary_action, role))}</a><a class="btn btn-secondary" href="#" data-static-action data-component-id="cta-secondary">Review options</a></div></div>`;
-  }
-  if (role === "category") {
-    const cards = structuralSlots(slots, ["Category option", "Availability option", "Material option", "Size option", "Price option", "Delivery option"]);
-    return `<div class="screen-layout" ${traceAttrs}><aside class="panel filter-sidebar" data-component-id="filter-sidebar"><h3>Filter sidebar</h3>${cards
-      .slice(0, 6)
-      .map((slot) => `<label>${escapeHtml(slot.label)}<select data-slot-id="${escapeHtml(slot.id)}"><option>${escapeHtml(slot.label)}</option></select></label>`)
-      .join("")}</aside><div class="panel"><h3>Product grid</h3><div class="product-grid">${cards
-      .slice(0, 6)
-      .map((slot) => `<article class="product-card" data-component-id="product-card" data-slot-id="${escapeHtml(slot.id)}"><h3>${escapeHtml(slot.label)}</h3><p>${escapeHtml(section.purpose)}</p></article>`)
-      .join("")}</div></div></div>`;
-  }
-  if (role === "product-detail") {
-    const rows = structuralSlots(slots, ["Voltage", "Length", "Material", "Finish"]);
-    return `<div class="split-layout" ${traceAttrs}><div class="panel"><table class="table spec-table" data-component-id="spec-table"><tbody>${rows
-      .slice(0, 4)
-      .map((slot) => `<tr><th>${escapeHtml(slot.label)}</th><td data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(section.title)}</td></tr>`)
-      .join("")}</tbody></table></div><aside class="panel"><div class="qty-stepper" data-component-id="qty-stepper"><button>-</button><span>${escapeHtml(rows[0].label)}</span><button>+</button></div><a class="btn btn-primary" href="#" data-static-action data-component-id="cta-primary">Add to cart</a></aside></div>`;
-  }
-  if (role === "search") {
-    const rows = structuralSlots(slots, ["Search query", "Matched term", "Category", "Availability", "Support route"]);
-    return `<div class="panel" ${traceAttrs}><div class="search-toolbar" data-component-id="search-toolbar"><input aria-label="Search query" data-slot-id="${escapeHtml(rows[0].id)}" placeholder="${escapeHtml(rows[0].label)}"><select><option>${escapeHtml(section.title)}</option></select><button class="btn btn-primary">Search</button></div><div class="result-list" data-component-id="result-list">${rows
-      .slice(1, 4)
-      .map((slot) => `<article class="result-row" data-slot-id="${escapeHtml(slot.id)}"><h4>${escapeHtml(slot.label)}</h4><p>${escapeHtml(section.purpose)}</p></article>`)
-      .join("")}<article class="result-row no-result" data-component-id="no-result"><h4>No-result state</h4><p>${escapeHtml(section.purpose)}</p></article></div></div>`;
-  }
-  if (role === "cart") {
-    const rows = structuralSlots(slots, ["Cart item", "Quantity", "Unit", "Total"]);
-    return `<div class="split-layout" ${traceAttrs}><div class="panel"><table class="table cart-table" data-component-id="cart-table"><thead><tr><th>Item</th><th>Qty</th><th>Unit</th><th>Total</th><th>Action</th></tr></thead><tbody>${rows
-      .slice(0, 4)
-      .map((slot) => `<tr><td data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(slot.label)}</td><td><div class="qty-stepper"><button>-</button><span>Qty</span><button>+</button></div></td><td>Unit</td><td>Total</td><td><button>Remove</button></td></tr>`)
-      .join("")}</tbody></table></div><aside class="panel summary-panel" data-component-id="summary-panel"><h3>Summary panel</h3><a class="btn btn-primary" href="#" data-static-action data-component-id="cta-primary">Checkout</a></aside></div>`;
-  }
-  if (role === "checkout") {
-    const rows = structuralSlots(slots, ["Recipient", "Address", "Phone", "Purchase order"]);
-    return `<div class="split-layout" ${traceAttrs}><div class="panel"><ol class="checkout-stepper" data-component-id="checkout-stepper">${["Information", "Delivery", "Payment"].map((step) => `<li class="stepper-step" data-component-id="stepper-step">${escapeHtml(step)}</li>`).join("")}</ol><form class="form-grid" data-component-id="form">${rows
-      .slice(0, 4)
-      .map((slot) => `<label>${escapeHtml(slot.label)}<input type="text" data-slot-id="${escapeHtml(slot.id)}" value="${escapeHtml(slot.label)}"></label>`)
-      .join("")}</form></div><aside class="panel summary-panel" data-component-id="summary-panel"><h3>Summary card</h3><button class="btn btn-primary">Place order</button></aside></div>`;
-  }
-  if (role === "order-history") {
-    const rows = structuralSlots(slots, ["Order status", "Order total", "Order action"]);
-    return `<div ${traceAttrs}><h3>Order history list</h3><table class="table" data-component-id="history-row"><tbody>${rows
-      .slice(0, 3)
-      .map((slot) => `<tr class="history-row"><td data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(slot.label)}</td><td>${escapeHtml(section.title)}</td><td><a href="#" data-static-action>Open detail</a></td></tr>`)
-      .join("")}</tbody></table></div>`;
-  }
-  if (role === "order-detail") {
-    const rows = structuralSlots(slots, ["Placed", "Approved", "Delivered"]);
-    return `<div class="split-layout" ${traceAttrs}><ol class="timeline" data-component-id="timeline">${rows
-      .slice(0, 3)
-      .map((slot) => `<li data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(slot.label)}</li>`)
-      .join("")}</ol><aside class="panel detail-summary" data-component-id="detail-summary"><h3>Detail summary</h3><p>${escapeHtml(section.purpose)}</p></aside></div>`;
-  }
-  if (role === "account-info") {
-    const rows = structuralSlots(slots, ["Company", "Contact", "Email", "Phone"]);
-    return `<div class="screen-layout" ${traceAttrs}><aside class="panel account-sidebar" data-component-id="account-sidebar"><h3>Account sidebar</h3><nav class="screen-nav"><a href="#">Company</a><a href="#">Users</a></nav></aside><form class="form-grid" data-component-id="form"><h3>View or edit form</h3>${rows
-      .slice(0, 4)
-      .map((slot) => `<label>${escapeHtml(slot.label)}<input type="text" data-slot-id="${escapeHtml(slot.id)}" value="${escapeHtml(slot.label)}"></label>`)
-      .join("")}</form></div>`;
-  }
-  if (role === "configurator-bom" || role === "mode-b-configurator") {
-    const rows = structuralSlots(slots, ["Project", "Assembly", "Construction", "Review", "Material"]);
-    return `<div class="panel" ${traceAttrs}><h3>Configurator wizard</h3><ol class="checkout-stepper" data-component-id="configurator-wizard">${rows
-      .slice(0, 4)
-      .map((slot) => `<li class="stepper-step" data-component-id="stepper-step" data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(slot.label)}</li>`)
-      .join("")}</ol><div class="button-row"><a class="btn btn-secondary" href="#" data-static-action>Recalculate</a><a class="btn btn-primary" href="#" data-static-action>Add BOM to cart</a></div><div class="split-layout"><aside class="panel preview-panel" data-component-id="preview-panel"><h4>Preview panel</h4><p>${escapeHtml(section.purpose)}</p></aside><div class="panel"><h4>BOM table</h4><table class="table cart-table bom-table" data-component-id="bom-table"><thead><tr><th>Material</th><th>Spec</th><th>Qty</th><th>Unit</th><th>Action</th></tr></thead><tbody>${rows
-      .map((slot) => `<tr><td data-slot-id="${escapeHtml(slot.id)}">${escapeHtml(slot.label)}</td><td>${escapeHtml(section.title)}</td><td>Qty</td><td>Unit</td><td><button>Exclude</button></td></tr>`)
-      .join("")}</tbody></table></div></div></div>`;
-  }
-  return null;
-}
-
-function renderBriefComponent({ componentId, section, brief, role, slotLookup, escapeHtml }) {
-  const id = componentId && componentId.id ? componentId.id : String(componentId || "component");
-  const label = componentId && componentId.label ? componentId.label : id;
-  const klass = componentClassFor(id);
-  const traceAttrs = `data-component-id="${escapeHtml(id)}" data-section-id="${escapeHtml(section.id)}"`;
-  const slots = Array.isArray(section.data_slots) && section.data_slots.length > 0 ? section.data_slots : Array.from((slotLookup || new Map()).values());
-  const isButtonComponent = klass === "btn-primary" || klass === "btn-secondary";
-  const rolePrimary = !isButtonComponent && /primary|work-area|action-toolbar|header-navigation|status-chips|panel|toolbar|navigation/i.test(`${id} ${label}`)
-    ? renderRolePrimary({ role, section, brief, traceAttrs, slots, escapeHtml })
-    : null;
-  if (rolePrimary) return rolePrimary;
-  const slotRows = slots.slice(0, 6).map((slot) => `<tr><td>${renderDataSlotPlaceholder({ slot, section, escapeHtml })}</td><td>${escapeHtml(section.title)}</td></tr>`).join("");
-  const slotCards = slots.slice(0, 6).map((slot) => `<article class="feature-card category-card product-card" ${traceAttrs} data-slot-id="${escapeHtml(slot.id)}"><h3>${escapeHtml(slot.label)}</h3><p>${escapeHtml(section.purpose)}</p></article>`).join("");
-
-  if (klass === "hero-section") {
-    return `<header class="panel hero-section" ${traceAttrs}><h1>${escapeHtml(brief.screen_title || section.title)}</h1><p class="support">${escapeHtml(section.purpose || brief.purpose || brief.user_intent)}</p><div class="button-row"><a class="btn btn-primary" href="#" data-static-action data-component-id="cta-primary">${escapeHtml(truncatePrimaryAction(brief.primary_action, role))}</a></div></header>`;
-  }
-  if (klass === "btn-primary") {
-    return `<a class="btn btn-primary" href="#" data-static-action ${traceAttrs}>${escapeHtml(truncatePrimaryAction(brief.primary_action, role))}</a>`;
-  }
-  if (klass === "btn-secondary") {
-    return `<a class="btn btn-secondary" href="#" data-static-action ${traceAttrs}>${escapeHtml(section.title || "Review options")}</a>`;
-  }
-  if (klass.includes("product-card") || klass.includes("feature-card") || klass.includes("category-card")) {
-    return `<div class="feature-grid product-grid" ${traceAttrs}>${slotCards || `<article class="${escapeHtml(klass)}" ${traceAttrs}><h3>${escapeHtml(label)}</h3><p>${escapeHtml(section.purpose)}</p></article>`}</div>`;
-  }
-  if (klass.includes("cart-table") || klass.includes("bom-table") || klass.includes("spec-table")) {
-    return `<table class="table ${escapeHtml(klass)}" ${traceAttrs}><thead><tr><th>Data slot</th><th>Section</th><th>Status</th><th>Action</th><th>Trace</th></tr></thead><tbody>${slotRows || `<tr><td>${escapeHtml(label)}</td><td>${escapeHtml(section.title)}</td><td>Ready</td><td>Review</td><td>${escapeHtml(role)}</td></tr>`}</tbody></table>`;
-  }
-  if (klass === "qty-stepper") {
-    return `<div class="qty-stepper" ${traceAttrs}><button>-</button><span>${escapeHtml(label)}</span><button>+</button></div>`;
-  }
-  if (klass === "checkout-stepper") {
-    const steps = (Array.isArray(section.interactions) && section.interactions.length > 0 ? section.interactions : [section.title, "Review", "Confirm", "Complete"]).slice(0, 5);
-    return `<ol class="checkout-stepper" ${traceAttrs}>${steps.map((step) => `<li class="stepper-step" data-component-id="${escapeHtml(id)}">${escapeHtml(step)}</li>`).join("")}</ol>`;
-  }
-  if (klass === "form-grid") {
-    return `<form class="form-grid" ${traceAttrs}>${slots.slice(0, 6).map((slot) => `<label>${escapeHtml(slot.label)}<input type="text" value="${escapeHtml(slot.label)}"></label>`).join("")}</form>`;
-  }
-  if (klass.includes("filter-sidebar") || klass.includes("summary-panel") || klass.includes("preview-panel") || klass.includes("detail-summary")) {
-    return `<aside class="panel ${escapeHtml(klass)}" ${traceAttrs}><h3>${escapeHtml(label)}</h3><p>${escapeHtml(section.purpose)}</p>${renderSlotList({ section, escapeHtml })}</aside>`;
-  }
-  if (klass === "search-toolbar") {
-    return `<div class="search-toolbar" ${traceAttrs}><input aria-label="Search query" placeholder="${escapeHtml(label)}"><select><option>${escapeHtml(section.title)}</option></select><button class="btn btn-primary">Search</button></div>`;
-  }
-  if (klass === "result-list") {
-    return `<div class="result-list" ${traceAttrs}>${slots.slice(0, 5).map((slot) => `<article class="result-row" data-slot-id="${escapeHtml(slot.id)}"><h4>${escapeHtml(slot.label)}</h4><p>${escapeHtml(section.purpose)}</p></article>`).join("")}</div>`;
-  }
-  if (klass === "no-result") {
-    return `<article class="result-row no-result" ${traceAttrs}><h4>${escapeHtml(label)}</h4><p>${escapeHtml(section.purpose)}</p></article>`;
-  }
-  if (klass === "timeline") {
-    const steps = (Array.isArray(section.interactions) && section.interactions.length > 0 ? section.interactions : [section.title, "Review", "Complete"]).slice(0, 5);
-    return `<ol class="timeline" ${traceAttrs}>${steps.map((step) => `<li>${escapeHtml(step)}</li>`).join("")}</ol>`;
-  }
-  if (klass === "history-row") {
-    return `<table class="table" ${traceAttrs}><tbody>${slots.slice(0, 5).map((slot) => `<tr class="history-row"><td>${escapeHtml(slot.label)}</td><td>${escapeHtml(section.title)}</td><td><a href="#" data-static-action>Open detail</a></td></tr>`).join("")}</tbody></table>`;
-  }
-  return `<article class="component-placeholder" ${traceAttrs} data-component-status="unknown"><h3>${escapeHtml(label)}</h3><p>${escapeHtml(section.purpose)}</p>${renderSlotList({ section, escapeHtml })}</article>`;
-}
-
-module.exports = {
-  componentClassFor,
-  renderBriefComponent,
-  renderDataSlotPlaceholder,
-};

package/src/lib/prototype-density.js

@@ -1,377 +0,0 @@
-"use strict";
-
-const MIN_TOTAL_SEMANTIC_HTML_BYTES = 10 * 1024;
-
-const LEGACY_MIN_TOTAL_SCREEN_BYTES = 80 * 1024;
-
-const LEGACY_ROLE_FLOORS = {
-  home: { minBytes: 8 * 1024 },
-  category: { minBytes: 6 * 1024 },
-  "product-detail": { minBytes: 6 * 1024 },
-  search: { minBytes: 4 * 1024 },
-  cart: { minBytes: 5 * 1024 },
-  checkout: { minBytes: 5 * 1024 },
-  "order-history": { minBytes: 4 * 1024 },
-  "order-detail": { minBytes: 4 * 1024 },
-  "account-info": { minBytes: 4 * 1024 },
-  "configurator-bom": { minBytes: 15 * 1024 },
-  "mode-b-configurator": { minBytes: 15 * 1024 },
-};
-
-const STRUCTURAL_ROLE_FLOORS = {
-  home: {
-    minSections: 2,
-    minDataSlots: 1,
-    requiredComponents: ["hero", "feature-card"],
-    checks: { heroSection: true, featureOrCategoryCards: 3, ctaPair: 2 },
-  },
-  category: {
-    minSections: 2,
-    minDataSlots: 2,
-    requiredComponents: ["filter-sidebar", "product-card"],
-    checks: { filterSidebar: true, productCards: 6, resultGrid: true },
-  },
-  "product-detail": {
-    minSections: 2,
-    minDataSlots: 3,
-    requiredComponents: ["spec-table", "qty-stepper", "cta-primary"],
-    checks: { specTableRows: 4, quantityStepper: true, addToCartCta: true },
-  },
-  search: {
-    minSections: 2,
-    minDataSlots: 1,
-    requiredComponents: ["search-toolbar", "result-list", "no-result"],
-    checks: { searchToolbar: true, resultList: true, noResultState: true },
-  },
-  cart: {
-    minSections: 2,
-    minDataSlots: 3,
-    requiredComponents: ["cart-table", "summary-panel", "cta-primary"],
-    checks: { cartTableColumns: 3, summaryPanel: true, checkoutCta: true },
-  },
-  checkout: {
-    minSections: 2,
-    minDataSlots: 4,
-    requiredComponents: ["checkout-stepper", "form", "summary-panel"],
-    checks: { stepperSteps: 3, formFields: 4, summary: true },
-  },
-  "order-history": {
-    minSections: 1,
-    minDataSlots: 2,
-    requiredComponents: ["history-row"],
-    checks: { listOrTableRows: 3 },
-  },
-  "order-detail": {
-    minSections: 2,
-    minDataSlots: 2,
-    requiredComponents: ["timeline", "detail-summary"],
-    checks: { timelineSteps: 3, detailSummary: true },
-  },
-  "account-info": {
-    minSections: 2,
-    minDataSlots: 4,
-    requiredComponents: ["account-sidebar", "form"],
-    checks: { sidebarNav: true, formFields: 4 },
-  },
-  "configurator-bom": {
-    minSections: 3,
-    minDataSlots: 4,
-    requiredComponents: ["configurator-wizard", "bom-table", "preview-panel", "stepper-step"],
-    checks: { wizard: true, bomTableColumns: 5, previewPanel: true, stepperSteps: 4 },
-  },
-  "mode-b-configurator": {
-    minSections: 3,
-    minDataSlots: 4,
-    requiredComponents: ["configurator-wizard", "bom-table", "preview-panel", "stepper-step"],
-    checks: { wizard: true, bomTableColumns: 5, previewPanel: true, stepperSteps: 4 },
-  },
-};
-
-function normalizeScreenRole(screen) {
-  const token = `${screen && screen.screenId ? screen.screenId : ""} ${screen && screen.title ? screen.title : ""} ${screen && screen.template_role ? screen.template_role : ""}`.toLowerCase();
-  if (token.includes("home")) return "home";
-  if (token.includes("category") || token.includes("catalog")) return "category";
-  if (token.includes("product-detail") || token.includes("product detail") || token.includes("pdp")) return "product-detail";
-  if (token.includes("search")) return "search";
-  if (token.includes("cart") && !token.includes("checkout")) return "cart";
-  if (token.includes("checkout")) return "checkout";
-  if (token.includes("order-history") || token.includes("order history")) return "order-history";
-  if (token.includes("order-detail") || token.includes("order detail")) return "order-detail";
-  if (token.includes("account")) return "account-info";
-  if (token.includes("configurator") || token.includes("bom") || token.includes("mode-b")) return "configurator-bom";
-  return screen && screen.screenId ? screen.screenId : "generic";
-}
-
-function resolveDensityMode(env = process.env) {
-  return env && String(env.SDTK_DESIGN_DENSITY_MODE || "").toLowerCase() === "bytes" ? "bytes" : "semantic";
-}
-
-function countMatches(html, pattern) {
-  const matches = String(html || "").match(pattern);
-  return matches ? matches.length : 0;
-}
-
-function countTableColumns(html) {
-  const headerRows = String(html || "").match(/<tr[\s\S]*?<\/tr>/gi) || [];
-  let max = 0;
-  for (const row of headerRows) {
-    max = Math.max(max, countMatches(row, /<t[hd]\b/gi));
-  }
-  return max;
-}
-
-function hasClassToken(html, token) {
-  const pattern = new RegExp(`class="[^"]*\\b${token.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&")}\\b[^"]*"`, "i");
-  return pattern.test(String(html || ""));
-}
-
-function countClassToken(html, token) {
-  const pattern = new RegExp(`class="[^"]*\\b${token.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&")}\\b[^"]*"`, "gi");
-  return countMatches(html, pattern);
-}
-
-function countDataAttribute(html, attribute) {
-  const pattern = new RegExp(`\\s${attribute}=`, "gi");
-  return countMatches(html, pattern);
-}
-
-function countSections(html) {
-  return Math.max(countDataAttribute(html, "data-section-id"), countMatches(html, /<section\b/gi));
-}
-
-function countComponents(html) {
-  const dataComponents = countDataAttribute(html, "data-component-id");
-  if (dataComponents > 0) return dataComponents;
-  return countMatches(
-    html,
-    /class="[^"]*\b(hero|feature-card|category-card|product-card|filter-sidebar|spec-table|qty-stepper|search-toolbar|result-list|no-result|cart-table|summary-panel|checkout-stepper|stepper-step|history-row|timeline|detail-summary|account-sidebar|preview-panel)\b[^"]*"/gi
-  );
-}
-
-function countDataSlots(html) {
-  const dataSlots = countDataAttribute(html, "data-slot-id");
-  if (dataSlots > 0) return dataSlots;
-  return (
-    countMatches(html, /<(input|select|textarea)\b/gi) +
-    countMatches(html, /<tr\b/gi) +
-    countClassToken(html, "feature-card") +
-    countClassToken(html, "category-card") +
-    countClassToken(html, "product-card") +
-    countClassToken(html, "result-row") +
-    countClassToken(html, "history-row") +
-    countMatches(html, /<li\b/gi)
-  );
-}
-
-function countStates(html) {
-  return Math.max(countDataAttribute(html, "data-state-id"), countDataAttribute(html, "data-chip-type"));
-}
-
-function makeCheck(id, actual, expected, pass) {
-  return { id, actual, expected, pass: Boolean(pass) };
-}
-
-function roleStructuralChecks(role, html) {
-  const lower = String(html || "").toLowerCase();
-  const checks = [];
-  const textCheck = (id, text, expected = true) => {
-    checks.push(makeCheck(id, lower.includes(text), expected, lower.includes(text) === expected));
-  };
-  const minCountCheck = (id, pattern, minimum) => {
-    const actual = countMatches(html, pattern);
-    checks.push(makeCheck(id, actual, minimum, actual >= minimum));
-  };
-
-  if (role === "home") {
-    textCheck("heroSection", "hero");
-    minCountCheck("featureOrCategoryCards", /class="[^"]*(feature-card|category-card|product-card)[^"]*"/gi, 3);
-    minCountCheck("ctaPair", /class="[^"]*\bbtn\b[^"]*"/gi, 2);
-  } else if (role === "category") {
-    textCheck("filterSidebar", "filter sidebar");
-    minCountCheck("productCards", /class="[^"]*product-card[^"]*"/gi, 6);
-    const resultGridPass =
-      lower.includes("product grid") ||
-      hasClassToken(html, "product-grid") ||
-      /data-component-id="(product-card|result-grid)"/i.test(String(html || ""));
-    checks.push(makeCheck("resultGrid", resultGridPass, true, resultGridPass));
-  } else if (role === "product-detail") {
-    minCountCheck("specTableRows", /<tr\b/gi, 4);
-    textCheck("quantityStepper", "qty-stepper");
-    textCheck("addToCartCta", "add to cart");
-  } else if (role === "search") {
-    textCheck("searchToolbar", "search-toolbar");
-    textCheck("resultList", "result-list");
-    textCheck("noResultState", "no-result");
-  } else if (role === "cart") {
-    textCheck("cartTableColumns", "cart-table");
-    checks.push(makeCheck("cartTableColumns", countTableColumns(html), 3, countTableColumns(html) >= 3));
-    textCheck("summaryPanel", "summary panel");
-    textCheck("checkoutCta", "checkout");
-  } else if (role === "checkout") {
-    textCheck("stepperSteps", "checkout-stepper");
-    minCountCheck("stepperSteps", /class="[^"]*stepper-step[^"]*"/gi, 3);
-    minCountCheck("formFields", /<(input|select|textarea)\b/gi, 4);
-    textCheck("summary", "summary");
-  } else if (role === "order-history") {
-    minCountCheck("listOrTableRows", /<tr\b|class="[^"]*history-row/gi, 3);
-  } else if (role === "order-detail") {
-    textCheck("timelineSteps", "timeline");
-    minCountCheck("timelineSteps", /<li\b/gi, 3);
-    textCheck("detailSummary", "detail summary");
-  } else if (role === "account-info") {
-    textCheck("sidebarNav", "account sidebar");
-    minCountCheck("formFields", /<(input|select|textarea)\b/gi, 4);
-  } else if (role === "configurator-bom" || role === "mode-b-configurator") {
-    textCheck("wizard", "configurator wizard");
-    checks.push(makeCheck("bomTableColumns", countTableColumns(html), 5, countTableColumns(html) >= 5));
-    textCheck("previewPanel", "preview panel");
-    minCountCheck("stepperSteps", /class="[^"]*stepper-step[^"]*"/gi, 4);
-  }
-  return checks;
-}
-
-function requiredComponentPresent(html, component) {
-  const lower = String(html || "").toLowerCase();
-  if (countDataAttribute(html, "data-component-id") > 0) {
-    return new RegExp(`data-component-id="[^"]*${component.replace(/[-/\\^$*+?.()|[\]{}]/g, "\\$&")}[^"]*"`, "i").test(html);
-  }
-  if (component === "hero") return hasClassToken(html, "hero") || lower.includes("hero");
-  if (component === "filter-sidebar") return lower.includes("filter sidebar") || hasClassToken(html, "filter-sidebar");
-  if (component === "result-grid") return lower.includes("product grid");
-  if (component === "form") return /<(input|select|textarea)\b/i.test(html);
-  if (component === "cta-primary") return hasClassToken(html, "btn-primary");
-  if (component === "configurator-wizard") return lower.includes("configurator wizard");
-  if (component === "bom-table") return lower.includes("bom table") || hasClassToken(html, "cart-table");
-  return hasClassToken(html, component) || lower.includes(component.replace(/-/g, " "));
-}
-
-function assessSemanticPage({ screenId, title, role, relativePath, html }) {
-  const normalizedRole = role || normalizeScreenRole({ screenId, title });
-  const floor = STRUCTURAL_ROLE_FLOORS[normalizedRole] || { minSections: 1, minDataSlots: 0, requiredComponents: [], checks: {} };
-  const sectionCount = countSections(html);
-  const componentCount = countComponents(html);
-  const dataSlotCount = countDataSlots(html);
-  const stateCount = countStates(html);
-  const requiredComponents = floor.requiredComponents || [];
-  const missingComponents = requiredComponents.filter((component) => !requiredComponentPresent(String(html || ""), component));
-  const structuralChecks = roleStructuralChecks(normalizedRole, html);
-  const findings = [];
-  if (sectionCount < floor.minSections) findings.push(`section count ${sectionCount} < ${floor.minSections}`);
-  if (dataSlotCount < floor.minDataSlots) findings.push(`data slot count ${dataSlotCount} < ${floor.minDataSlots}`);
-  if (missingComponents.length > 0) findings.push(`missing components: ${missingComponents.join(", ")}`);
-  for (const check of structuralChecks) {
-    if (!check.pass) findings.push(`${check.id} ${check.actual} < ${check.expected}`);
-  }
-
-  return {
-    screenId,
-    title,
-    role: normalizedRole,
-    relativePath,
-    sectionCount,
-    componentCount,
-    dataSlotCount,
-    stateCount,
-    requiredComponents,
-    missingComponents,
-    structuralChecks,
-    pass: findings.length === 0,
-    findings,
-  };
-}
-
-function assessSemanticDensity(pageRecords) {
-  const pages = (Array.isArray(pageRecords) ? pageRecords : []).map(assessSemanticPage);
-  const aggregate = pages.reduce(
-    (acc, page) => {
-      acc.pageCount += 1;
-      acc.sectionCount += page.sectionCount;
-      acc.componentCount += page.componentCount;
-      acc.dataSlotCount += page.dataSlotCount;
-      acc.stateCount += page.stateCount;
-      return acc;
-    },
-    { pageCount: 0, sectionCount: 0, componentCount: 0, dataSlotCount: 0, stateCount: 0 }
-  );
-  const totalBytes = (Array.isArray(pageRecords) ? pageRecords : []).reduce((sum, page) => sum + Buffer.byteLength(String(page.html || ""), "utf8"), 0);
-  const findings = [];
-  if (pages.length === 0) findings.push("No per-screen prototype pages found.");
-  if (pages.length > 0 && totalBytes < MIN_TOTAL_SEMANTIC_HTML_BYTES) {
-    findings.push(`Total semantic HTML bytes ${totalBytes} < ${MIN_TOTAL_SEMANTIC_HTML_BYTES}`);
-  }
-  for (const page of pages) {
-    if (!page.pass) findings.push(`${page.screenId}: ${page.findings.join("; ")}`);
-  }
-  return {
-    mode: "semantic",
-    pass: findings.length === 0,
-    aggregate,
-    totalBytes,
-    minTotalBytes: MIN_TOTAL_SEMANTIC_HTML_BYTES,
-    pages,
-    findings,
-  };
-}
-
-function roleByteStructureFindings(role, html) {
-  return roleStructuralChecks(role, html)
-    .filter((check) => !check.pass)
-    .map((check) => `${check.id} ${check.actual} < ${check.expected}`);
-}
-
-function assessBytePage({ screenId, title, role, relativePath, html }) {
-  const normalizedRole = role || normalizeScreenRole({ screenId, title });
-  const byteLength = Buffer.byteLength(String(html || ""), "utf8");
-  const floor = LEGACY_ROLE_FLOORS[normalizedRole] || { minBytes: 0 };
-  const findings = [];
-  if (byteLength < floor.minBytes) findings.push(`HTML bytes ${byteLength} < ${floor.minBytes}`);
-  findings.push(...roleByteStructureFindings(normalizedRole, html));
-  return {
-    screenId,
-    title,
-    role: normalizedRole,
-    relativePath,
-    byteLength,
-    minBytes: floor.minBytes,
-    pass: findings.length === 0,
-    findings,
-  };
-}
-
-function assessByteDensity(pageRecords) {
-  const pages = (Array.isArray(pageRecords) ? pageRecords : []).map(assessBytePage);
-  const totalBytes = pages.reduce((sum, page) => sum + page.byteLength, 0);
-  const findings = [];
-  if (totalBytes < LEGACY_MIN_TOTAL_SCREEN_BYTES) {
-    findings.push(`Total per-screen HTML bytes ${totalBytes} < ${LEGACY_MIN_TOTAL_SCREEN_BYTES}`);
-  }
-  for (const page of pages) {
-    if (!page.pass) findings.push(`${page.screenId}: ${page.findings.join("; ")}`);
-  }
-  return {
-    mode: "bytes",
-    pass: findings.length === 0,
-    totalBytes,
-    minTotalBytes: LEGACY_MIN_TOTAL_SCREEN_BYTES,
-    pages,
-    findings,
-  };
-}
-
-function assessPrototypeDensity(pageRecords, options = {}) {
-  const mode = options.mode || resolveDensityMode();
-  return mode === "bytes" ? assessByteDensity(pageRecords) : assessSemanticDensity(pageRecords, options.briefIndex);
-}
-
-module.exports = {
-  LEGACY_MIN_TOTAL_SCREEN_BYTES,
-  LEGACY_ROLE_FLOORS,
-  MIN_TOTAL_SEMANTIC_HTML_BYTES,
-  ROLE_FLOORS: STRUCTURAL_ROLE_FLOORS,
-  STRUCTURAL_ROLE_FLOORS,
-  assessPrototypeDensity,
-  assessSemanticDensity,
-  assessSemanticPage,
-  normalizeScreenRole,
-  resolveDensityMode,
-};