@popcraft/kit 0.32.0 → 0.32.1

package/dist/chunks/chunk-YMVKPMZO.js

@@ -1,368 +0,0 @@
-import { createRequire as __popcraftRequire } from 'node:module';
-import { fileURLToPath as __popcraftPath } from 'node:url';
-import { dirname as __popcraftDirname } from 'node:path';
-const require = __popcraftRequire(import.meta.url);
-const __filename = __popcraftPath(import.meta.url);
-const __dirname = __popcraftDirname(__filename);
-import {
-  tick
-} from "./chunk-UDE42EDS.js";
-import {
-  MONO,
-  SERIF
-} from "./chunk-PFCHOCEN.js";
-import {
-  compactNav,
-  footer,
-  linePath,
-  respond,
-  rule,
-  soft,
-  typeScale
-} from "./chunk-DAF5SK5X.js";
-import {
-  buttons,
-  nav,
-  page
-} from "./chunk-TF2MO3UA.js";
-import {
-  defineTemplate
-} from "./chunk-HLBQLOTA.js";
-import {
-  Kit,
-  preset
-} from "./chunk-2P7ISWIA.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/web/saas-data-landing.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var KPIS = [
-  { id: "MRR", label: "MRR", value: "$1,284,300", delta: "+3.3% vs Aug", up: true, counter: { from: 118e4, to: 1284300, prefix: "$" } },
-  { id: "Net new", label: "Net new MRR", value: "+$41,200", delta: "+$6,900 vs Aug", up: true, counter: { from: 0, to: 41200, prefix: "+$" } },
-  { id: "NRR", label: "Net retention", value: "112%", delta: "+2 pts vs Q2", up: true, counter: { from: 100, to: 112, suffix: "%" } },
-  { id: "Churn", label: "Logo churn", value: "1.3%", delta: "\u22120.4 pts vs Q2", up: true, counter: { from: 2.4, to: 1.3, decimals: 1, suffix: "%" } }
-];
-var MRR = [0.3, 0.33, 0.37, 0.36, 0.43, 0.5, 0.49, 0.58, 0.66, 0.72, 0.83, 0.92];
-var MONTHS = ["Oct", "Dec", "Feb", "Apr", "Jun", "Aug", "Sep"];
-var PLANS = [["Enterprise", "84", "$612,400", 0.48], ["Growth", "412", "$438,900", 0.34], ["Starter", "1,960", "$233,000", 0.18]];
-var LOGOS = [
-  ["Northgate", { ...SERIF, fontWeight: 700, letterSpacing: -0.6 }],
-  ["HALCYON", { fontWeight: 800, letterSpacing: 5 }],
-  ["brightwell.", { fontWeight: 700, letterSpacing: -1.2 }],
-  ["Okapi Labs", { ...MONO, fontWeight: 700, letterSpacing: -0.8 }],
-  ["Meridian & Nine", { ...SERIF, fontWeight: 500, fontStyle: "italic" }],
-  ["FENNEL", { fontWeight: 900, letterSpacing: 1 }]
-];
-var SOURCES = [["Stripe", "Billing", "48,212 invoices", "02:04"], ["Chargebee", "Billing", "9,870 invoices", "02:06"], ["NetSuite", "General ledger", "131,440 lines", "02:11"], ["Salesforce", "CRM", "6,304 opportunities", "02:13"], ["Snowflake", "Warehouse", "14 models", "02:19"]];
-var WATERFALL = [["New", "+$62k", 124, "up"], ["Upgrade", "+$38k", 76, "up"], ["Shrink", "\u2212$21k", 42, "down"], ["Churn", "\u2212$38k", 76, "down"], ["Net new", "+$41k", 82, "accent"]];
-var RISK = [["Halden Freight", "$18,400", "Usage down 61%"], ["Pico Health", "$9,200", "Champion left"], ["Arbor Schools", "$6,750", "3 failed payments"]];
-var SEALS = [["SOC 2", "Type II"], ["ISO", "27001"], ["GDPR", "DPA"], ["SSO", "SCIM"]];
-var cues = [
-  { layer: "Nav", preset: "fade-in", at: 0, params: { duration: 400 } },
-  { layer: "Eyebrow", preset: "fade-in", at: 100, params: { duration: 500 } },
-  { layer: "Headline", preset: "rise-in", at: 200, params: { duration: 700 } },
-  { layer: "Lead", preset: "rise-in", at: 350 },
-  { layer: ["CTA primary", "CTA quiet"], preset: "rise-in", at: 500, stagger: { delay: 100 } },
-  { layer: "Proof", preset: "fade-in", at: 800, params: { duration: 500 } },
-  { layer: "Dashboard", preset: "rise-in", at: 350, params: { duration: 800 } },
-  { layer: "KPI", preset: "fade-in", at: 900, params: { duration: 350 }, stagger: { delay: 140 } },
-  { layer: "Line", preset: "wipe-in", at: 1500, params: { duration: 1700, ease: { kind: "linear" } } },
-  { layer: "Area", preset: "fade-in", at: 3e3, params: { duration: 700 } },
-  { layer: "Mark", preset: "pop-in", at: 3200, params: { duration: 400 } },
-  { layer: "Plan row", preset: "fade-in", at: 3300, params: { duration: 300 }, stagger: { delay: 160 } },
-  { layer: "Delta", preset: "pop-in", at: 2500, params: { duration: 350 }, stagger: { delay: 100 } }
-];
-var counts = KPIS.map((kpi, i) => ({ layer: `${kpi.id} figure`, at: 1e3 + i * 140, duration: 1500, counter: kpi.counter }));
-var saas_data_landing_default = defineTemplate({
-  id: "web-saas-data-landing",
-  meta: {
-    name: "SaaS B2B data product landing page",
-    description: "A data-dense landing page for a B2B analytics product: the hero dashboard counts its KPIs up, draws a twelve-month revenue line and fills its plan table. Then a customer logo row, a reconciliation ledger, a waterfall chart, accounts at risk, security seals on a dark band, a case study in numbers and a demo band. Desktop to phone",
-    category: "web",
-    tags: ["saas", "b2b", "analytics", "dashboard", "data", "chart", "kpi", "enterprise", "security", "logos", "landing page", "hero", "website", "animation", "responsive"],
-    platforms: ["web"],
-    formats: ["page", "demo"],
-    useCases: ["launch", "brand-intro", "stats"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  breakpoints: true,
-  motion: { cues, counts },
-  build() {
-    const k = new Kit("SaaS B2B data product landing page", preset("web-desktop"));
-    k.quantizeGeometry = true;
-    k.brand(
-      { paper: "#F5F5F1", text: "#14171A", onPaper: "#4D545B", primary: "#14171A", onPrimary: "#FFFFFF", accent: "#E8590C", card: "#FFFFFF", onCard: "#14171A", cardMuted: "#5B626A", cardUp: "#0B6B3A", cardDown: "#B42318", hairline: "#D6D7CF", panel: "#16191D", onPanel: "#F5F5F1", panelMuted: "#A9AEB4", panelLine: "#3A4047" },
-      { name: "Plumb" }
-    );
-    k.palette({ up: "#1E8E53", down: "#D4483B", wash: "#FBE3D2", band: "#ECECE6" });
-    const num = { fontFeatures: { tnum: 1 } };
-    const s = typeScale(k, {
-      "Nav 15": { size: 15, fontWeight: 500, lineHeight: 24 },
-      "Brand 20": { size: 20, fontWeight: 800, letterSpacing: -0.5, lineHeight: 28 },
-      "Button 15": { size: 15, fontWeight: 600, lineHeight: 22 },
-      "Eyebrow 12": { ...MONO, size: 12, fontWeight: 600, letterSpacing: 1.4, lineHeight: 18, textCase: "UPPER" },
-      "Display 60": { size: 60, fontWeight: 700, letterSpacing: -2.6, lineHeight: 62 },
-      "Display 52": { size: 52, fontWeight: 700, letterSpacing: -2.2, lineHeight: 54 },
-      "Display 44": { size: 44, fontWeight: 700, letterSpacing: -1.8, lineHeight: 48 },
-      "Display 34": { size: 34, fontWeight: 700, letterSpacing: -1.2, lineHeight: 38 },
-      "Lead 18": { size: 18, fontWeight: 400, lineHeight: 28 },
-      "Lead 16": { size: 16, fontWeight: 400, lineHeight: 25 },
-      "Proof 13": { size: 13, fontWeight: 500, lineHeight: 20 },
-      "Tab 13": { size: 13, fontWeight: 600, lineHeight: 18 },
-      "KPI label 12": { size: 12, fontWeight: 500, lineHeight: 16 },
-      "KPI 24": { size: 24, fontWeight: 700, letterSpacing: -0.8, lineHeight: 30, ...num },
-      "KPI 18": { size: 18, fontWeight: 700, letterSpacing: -0.4, lineHeight: 24, ...num },
-      "Delta 12": { ...MONO, size: 12, fontWeight: 600, lineHeight: 16 },
-      "Axis 12": { ...MONO, size: 12, fontWeight: 500, lineHeight: 16 },
-      "Cell 13": { size: 13, fontWeight: 500, lineHeight: 20, ...num },
-      "Logo 24": { size: 24, fontWeight: 700, lineHeight: 30 },
-      "Section 36": { size: 36, fontWeight: 700, letterSpacing: -1.4, lineHeight: 40 },
-      "Section 26": { size: 26, fontWeight: 700, letterSpacing: -0.8, lineHeight: 31 },
-      "Body 16": { size: 16, fontWeight: 400, lineHeight: 25 },
-      "Ledger 14": { size: 14, fontWeight: 500, lineHeight: 20, ...num },
-      "Ledger mono 13": { ...MONO, size: 13, fontWeight: 500, lineHeight: 20 },
-      "Cell title 20": { size: 20, fontWeight: 700, letterSpacing: -0.4, lineHeight: 26 },
-      "Bar 12": { ...MONO, size: 12, fontWeight: 600, lineHeight: 16, textAlign: "CENTER" },
-      "Seal 15": { size: 15, fontWeight: 800, letterSpacing: 0.4, lineHeight: 18, textAlign: "CENTER" },
-      "Seal 12": { ...MONO, size: 12, fontWeight: 500, lineHeight: 14, textAlign: "CENTER" },
-      "Stat 56": { size: 56, fontWeight: 700, letterSpacing: -2.4, lineHeight: 58, ...num },
-      "Stat 40": { size: 40, fontWeight: 700, letterSpacing: -1.6, lineHeight: 44, ...num },
-      "Quote 24": { ...SERIF, size: 24, fontWeight: 400, lineHeight: 35 },
-      "Quote 19": { ...SERIF, size: 19, fontWeight: 400, lineHeight: 29 },
-      "Small 14": { size: 14, fontWeight: 400, lineHeight: 22 },
-      "Foot head 14": { size: 14, fontWeight: 700, lineHeight: 22 }
-    });
-    buttons(k, { style: s("Button 15"), pad: [12, 20], radius: 6 });
-    k.component("Button light", { direction: "HORIZONTAL", width: "HUG", radius: 6, align: "CENTER", fill: "card", padding: { top: 12, right: 20, bottom: 12, left: 20 }, props: { Label: "Book a demo" } }, (id) => {
-      k.propText(id, "Label", { style: s("Button 15"), color: "onCard", autoWidth: true });
-    });
-    const sheet = k.sheet;
-    page(k, sheet, { gap: 80, top: 24 });
-    k.timeline(sheet, { duration: 6e3, fps: 30 });
-    nav(k, sheet, { links: ["Product", "Integrations", "Security", "Customers", "Pricing"], cta: "Book a demo", style: s("Nav 15"), brandStyle: s("Brand 20") });
-    const hero = k.stack(sheet, { direction: "HORIZONTAL", gap: 56, align: "CENTER", name: "Hero" });
-    const copy = k.stack(hero, { width: 520, gap: 22, name: "Copy" });
-    k.text(copy, "Revenue analytics for finance teams", { style: s("Eyebrow 12"), color: "onPaper", name: "Eyebrow" });
-    k.text(copy, "One MRR number, in every tab.", { style: s("Display 60"), color: "text", name: "Headline" });
-    k.text(copy, "Plumb reconciles billing, the ledger and the CRM every night, so the figure in the board deck matches the one in the bank. When it moves, you can see which invoices moved it.", { style: s("Lead 18"), color: "onPaper", name: "Lead" });
-    const cta = k.stack(copy, { direction: "HORIZONTAL", gap: 10, wrap: true, name: "CTAs" });
-    k.instance(cta, "Button", { Label: "Book a 30-minute demo" }, { name: "CTA primary" });
-    k.instance(cta, "Button quiet", { Label: "See a sample close" }, { name: "CTA quiet" });
-    k.text(copy, "Connected in an afternoon. Read-only access, no engineering ticket.", { style: s("Proof 13"), color: "onPaper", name: "Proof" });
-    const dash = k.stack(hero, { fill: "card", radius: 10, stroke: { color: "hairline", width: 1 }, clip: true, effects: [soft(0.1, 24, 56)], name: "Dashboard" });
-    const tabs = k.stack(dash, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", gap: 12, padding: { top: 12, right: 18, bottom: 12, left: 18 }, name: "Tabs" });
-    const left = k.stack(tabs, { direction: "HORIZONTAL", width: "HUG", gap: 6, align: "CENTER", name: "Tab list" });
-    const on = k.stack(left, { direction: "HORIZONTAL", width: "HUG", fill: "primary", radius: 5, padding: { top: 5, right: 10, bottom: 5, left: 10 }, name: "Tab on" });
-    k.text(on, "Revenue", { style: s("Tab 13"), color: "onPrimary", autoWidth: true, name: "Tab name" });
-    for (const t of ["Retention", "Cash"]) {
-      const tab = k.stack(left, { direction: "HORIZONTAL", width: "HUG", padding: { top: 5, right: 10, bottom: 5, left: 10 }, name: "Tab" });
-      k.text(tab, t, { style: s("Tab 13"), color: "cardMuted", autoWidth: true, name: "Tab name" });
-    }
-    k.text(tabs, "Sep 2026 \xB7 closed", { style: s("Delta 12"), color: "cardMuted", autoWidth: true, name: "Period" });
-    rule(k, dash, "hairline");
-    const kpis = k.stack(dash, { direction: "HORIZONTAL", gap: 0, name: "KPIs" });
-    for (const kpi of KPIS) {
-      const tile = k.stack(kpis, { gap: 4, padding: { top: 16, right: 14, bottom: 16, left: 18 }, name: "KPI" });
-      k.text(tile, kpi.label, { style: s("KPI label 12"), color: "cardMuted", name: "KPI label" });
-      k.text(tile, kpi.value, { style: s("KPI 24"), color: "onCard", name: `${kpi.id} figure` });
-      k.text(tile, kpi.delta, { style: s("Delta 12"), color: "cardUp", name: "Delta" });
-    }
-    rule(k, dash, "hairline");
-    const plot = k.stack(dash, { gap: 8, padding: { top: 16, right: 18, bottom: 14, left: 18 }, name: "Plot" });
-    const plotHead = k.stack(plot, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", gap: 12, name: "Plot head" });
-    k.text(plotHead, "MRR, trailing 12 months", { style: s("Tab 13"), color: "onCard", autoWidth: true, name: "Plot title" });
-    k.text(plotHead, "$0.94M to $1.28M", { style: s("Delta 12"), color: "cardMuted", autoWidth: true, name: "Plot range" });
-    const W = 720, H = 170;
-    const win = k.stack(plot, { direction: "HORIZONTAL", height: H, justify: "MAX", clip: true, name: "Window" });
-    const layers = k.stack(win, { width: W, height: H, name: "Series" });
-    k.vector(layers, W, H, [0.25, 0.5, 0.75].map((f) => ({ closed: false, points: [{ x: 0, y: H * f }, { x: W, y: H * f }] })), "hairline", { name: "Gridlines", strokeWidth: 1, absolute: { x: 0, y: 0 } });
-    k.vector(layers, W, H, [linePath(MRR, W - 8, H - 8, true)], "wash", { name: "Area", absolute: { x: 0, y: 8 } });
-    k.vector(layers, W, H, [linePath(MRR, W - 8, H - 8)], "accent", { name: "Line", strokeWidth: 3, absolute: { x: 0, y: 8 } });
-    k.ellipse(layers, 12, "accent", { name: "Mark", stroke: { color: "card", width: 3 }, absolute: { x: W - 14, y: 8 + (1 - MRR[MRR.length - 1]) * (H - 8) - 6 } });
-    rule(k, plot, "hairline");
-    const axis = k.stack(plot, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", name: "Axis" });
-    for (const m of MONTHS) k.text(axis, m, { style: s("Axis 12"), color: "cardMuted", autoWidth: true, name: "Month" });
-    const table = k.stack(dash, { fill: "band", padding: { top: 6, right: 18, bottom: 8, left: 18 }, name: "Plan table" });
-    for (const [plan, n, mrr, share] of PLANS) {
-      const r = k.stack(table, { direction: "HORIZONTAL", gap: 14, align: "CENTER", padding: { top: 7, right: 0, bottom: 7, left: 0 }, name: "Plan row" });
-      k.text(r, plan, { style: s("Cell 13"), color: "onCard", name: "Plan name" });
-      k.text(r, `${n} accounts`, { style: s("Cell 13"), color: "cardMuted", width: 104, name: "Plan accounts" });
-      const lane = k.stack(r, { direction: "HORIZONTAL", width: 120, height: 6, fill: "hairline", radius: 3, name: "Share lane" });
-      k.rect(lane, Math.round(120 * share), 6, "primary", { radius: 3, name: "Share" });
-      k.text(r, mrr, { style: s("Cell 13"), color: "onCard", width: 70, align: "RIGHT", name: "Plan MRR" });
-    }
-    const logos = k.stack(sheet, { gap: 20, name: "Customers" });
-    rule(k, logos, "hairline");
-    const logoRow = k.stack(logos, { direction: "HORIZONTAL", gap: 28, align: "CENTER", justify: "SPACE_BETWEEN", wrap: true, name: "Logo row" });
-    k.text(logoRow, "Closing the books at", { style: s("Eyebrow 12"), color: "onPaper", autoWidth: true, name: "Logos label" });
-    LOGOS.forEach(([name, face], i) => {
-      k.textStyle(`Wordmark ${i + 1}`, { size: 24, lineHeight: 30, ...face });
-      k.text(logoRow, name, { style: `Wordmark ${i + 1}`, color: "onPaper", autoWidth: true, name: "Wordmark" });
-    });
-    rule(k, logos, "hairline");
-    const recon = k.stack(sheet, { direction: "HORIZONTAL", gap: 56, name: "Reconciliation" });
-    const reconCopy = k.stack(recon, { width: 380, gap: 16, name: "Recon copy" });
-    k.text(reconCopy, "01 \xB7 Reconciliation", { style: s("Eyebrow 12"), color: "onPaper", name: "Recon label" });
-    k.text(reconCopy, "Every source, tied out to the cent by 02:30.", { style: s("Section 36"), color: "text", name: "Recon title" });
-    k.text(reconCopy, "Plumb matches each invoice to its ledger line and its opportunity. What does not match is listed with the reason, not averaged away. Last night there were four exceptions, all refunds issued after close.", { style: s("Body 16"), color: "onPaper", name: "Recon text" });
-    const ledger = k.stack(recon, { fill: "card", radius: 10, stroke: { color: "hairline", width: 1 }, clip: true, name: "Ledger" });
-    const cols = (parent, cells, head) => {
-      const r = k.stack(parent, { direction: "HORIZONTAL", gap: 16, align: "CENTER", padding: { top: head ? 10 : 13, right: 18, bottom: head ? 10 : 13, left: 18 }, ...head ? { fill: "band" } : {}, name: head ? "Ledger head" : "Ledger row" });
-      k.text(r, cells[0], { style: s(head ? "KPI label 12" : "Ledger 14"), color: head ? "cardMuted" : "onCard", name: "Source" });
-      k.text(r, cells[1], { style: s(head ? "KPI label 12" : "Ledger 14"), color: "cardMuted", width: 120, name: "Kind" });
-      k.text(r, cells[2], { style: s(head ? "KPI label 12" : "Ledger 14"), color: head ? "cardMuted" : "onCard", width: 150, name: "Records" });
-      k.text(r, cells[3], { style: s(head ? "KPI label 12" : "Ledger mono 13"), color: "cardMuted", width: 64, name: "Synced" });
-      const drift = k.stack(r, { direction: "HORIZONTAL", width: 86, gap: 6, align: "CENTER", name: "Drift" });
-      if (!head) tick(k, drift, 14, "up");
-      k.text(drift, head ? "Drift" : "$0.00", { style: s(head ? "KPI label 12" : "Ledger mono 13"), color: head ? "cardMuted" : "cardUp", autoWidth: true, name: "Drift figure" });
-    };
-    cols(ledger, ["Source", "Kind", "Records matched", "Synced", "Drift"], true);
-    for (const row of SOURCES) {
-      rule(k, ledger, "hairline");
-      cols(ledger, row, false);
-    }
-    rule(k, ledger, "hairline");
-    const exc = k.stack(ledger, { direction: "HORIZONTAL", gap: 12, justify: "SPACE_BETWEEN", padding: { top: 12, right: 18, bottom: 12, left: 18 }, name: "Exceptions" });
-    k.text(exc, "4 exceptions \xB7 $1,912.40 in refunds issued after close", { style: s("Ledger 14"), color: "onCard", name: "Exceptions text" });
-    k.text(exc, "Review", { style: s("Tab 13"), color: "onCard", autoWidth: true, name: "Review link" });
-    const ask = k.stack(sheet, { gap: 24, name: "Questions" });
-    k.text(ask, "02 \xB7 The questions finance gets asked", { style: s("Eyebrow 12"), color: "onPaper", name: "Questions label" });
-    const grid = k.stack(ask, { direction: "HORIZONTAL", gap: 20, name: "Grid" });
-    const wide = k.stack(grid, { gap: 18, fill: "card", radius: 10, stroke: { color: "hairline", width: 1 }, padding: 28, name: "Waterfall cell" });
-    k.text(wide, "Why did MRR move in September?", { style: s("Section 26"), color: "onCard", name: "Waterfall title" });
-    k.text(wide, "Every bar opens to the accounts behind it. Expansion was eleven seat upgrades; most of the churn was one logistics customer.", { style: s("Body 16"), color: "cardMuted", name: "Waterfall text" });
-    const fall = k.stack(wide, { direction: "HORIZONTAL", gap: 12, align: "MAX", height: 190, padding: { top: 8, right: 0, bottom: 0, left: 0 }, name: "Waterfall" });
-    for (const [name, value, h, tone] of WATERFALL) {
-      const col = k.stack(fall, { gap: 6, name: "Fall column" });
-      k.text(col, value, { style: s("Bar 12"), color: "onCard", name: "Fall value" });
-      k.rect(col, "FILL", h, tone, { radius: 3, name: "Fall bar" });
-      k.text(col, name, { style: s("Bar 12"), color: "cardMuted", name: "Fall name" });
-    }
-    const side = k.stack(grid, { width: 440, gap: 20, name: "Side cells" });
-    const risk = k.stack(side, { gap: 10, fill: "card", radius: 10, stroke: { color: "hairline", width: 1 }, padding: 24, name: "Risk cell" });
-    k.text(risk, "Who is about to leave?", { style: s("Cell title 20"), color: "onCard", name: "Risk title" });
-    for (const [account, mrr, why] of RISK) {
-      rule(k, risk, "hairline");
-      const r = k.stack(risk, { direction: "HORIZONTAL", gap: 12, align: "CENTER", name: "Risk row" });
-      k.ellipse(r, 8, "down", { name: "Risk dot" });
-      k.text(r, account, { style: s("Ledger 14"), color: "onCard", name: "Account" });
-      k.text(r, why, { style: s("Cell 13"), color: "cardDown", autoWidth: true, name: "Reason" });
-      k.text(r, mrr, { style: s("Ledger mono 13"), color: "cardMuted", width: 62, align: "RIGHT", name: "At risk" });
-    }
-    const board = k.stack(side, { gap: 10, fill: "primary", radius: 10, padding: 24, name: "Board cell" });
-    k.text(board, "What do we tell the board?", { style: s("Cell title 20"), color: "onPrimary", name: "Board title" });
-    k.text(board, "The pack writes itself on the first working day: twelve charts, the variance notes and the appendix, as slides or a PDF.", { style: s("Body 16"), color: "onPrimary", name: "Board text" });
-    const sec = k.stack(sheet, { direction: "HORIZONTAL", gap: 56, align: "CENTER", fill: "panel", radius: 10, padding: 48, name: "Security" });
-    const secCopy = k.stack(sec, { gap: 14, name: "Security copy" });
-    k.text(secCopy, "03 \xB7 Security", { style: s("Eyebrow 12"), color: "panelMuted", name: "Security label" });
-    k.text(secCopy, "Read-only by design. Your numbers never leave your region.", { style: s("Section 36"), color: "onPanel", name: "Security title" });
-    k.text(secCopy, "Plumb never writes to a source system. Data is encrypted with keys you can revoke, stored in the EU or the US as you choose, and deleted within 30 days of a contract ending. The latest pen-test report is on the trust page.", { style: s("Body 16"), color: "panelMuted", name: "Security text" });
-    const seals = k.stack(sec, { direction: "HORIZONTAL", width: "HUG", gap: 16, name: "Seals" });
-    for (const [a, b] of SEALS) {
-      const seal = k.stack(seals, { width: 104, height: 104, radius: 52, stroke: { color: "onPanel", width: 1.5 }, align: "CENTER", justify: "CENTER", gap: 2, name: "Seal" });
-      k.ellipse(seal, 92, [], { name: "Seal ring", stroke: { color: "panelLine", width: 1 }, absolute: { x: 6, y: 6 } });
-      k.text(seal, a, { style: s("Seal 15"), color: "onPanel", name: "Seal name" });
-      k.text(seal, b, { style: s("Seal 12"), color: "panelMuted", name: "Seal kind" });
-    }
-    const story = k.stack(sheet, { direction: "HORIZONTAL", gap: 56, name: "Story" });
-    const stats = k.stack(story, { width: 380, gap: 0, name: "Story stats" });
-    for (const [figure, what] of [["9 to 3 days", "Month-end close at Northgate, within two quarters"], ["$0", "Unexplained variance between billing and the ledger since March"]]) {
-      rule(k, stats, "text");
-      const st = k.stack(stats, { gap: 4, padding: { top: 14, right: 0, bottom: 24, left: 0 }, name: "Story stat" });
-      k.text(st, figure, { style: s("Stat 56"), color: "text", name: "Stat figure" });
-      k.text(st, what, { style: s("Small 14"), color: "onPaper", name: "Stat text" });
-    }
-    const quote = k.stack(story, { gap: 18, name: "Story quote" });
-    rule(k, quote, "text");
-    k.text(quote, "\u201CThe audit committee used to ask why the deck and the ledger disagreed by forty thousand dollars. They have stopped asking, because they no longer do. I got my first week of the month back.\u201D", { style: s("Quote 24"), color: "text", name: "Quote" });
-    k.text(quote, "Priya Raman, VP Finance, Northgate", { style: s("Proof 13"), color: "onPaper", name: "Quote name" });
-    const band = k.stack(sheet, { direction: "HORIZONTAL", gap: 32, align: "CENTER", justify: "SPACE_BETWEEN", fill: "primary", radius: 10, padding: 40, name: "Band" });
-    const bandCopy = k.stack(band, { gap: 6, name: "Band copy" });
-    k.text(bandCopy, "Bring last month\u2019s close. We will reconcile it on the call.", { style: s("Section 26"), color: "onPrimary", name: "Band title" });
-    k.text(bandCopy, "Thirty minutes, your data, read-only. From $1,200 a month, by revenue under management.", { style: s("Body 16"), color: "onPrimary", name: "Band text" });
-    k.instance(band, "Button light", { Label: "Book a demo" }, { name: "Band button" });
-    footer(k, sheet, {
-      about: "Revenue analytics that ties out. Built in Toronto and Lisbon.",
-      columns: [["Product", ["Revenue", "Retention", "Cash", "Board pack"]], ["Trust", ["Security", "Sub-processors", "Status", "DPA"]], ["Company", ["Customers", "Pricing", "Careers", "Contact"]]],
-      legal: "\xA9 2026 Plumb Analytics Inc. SOC 2 Type II report available under NDA.",
-      brandStyle: s("Brand 20"),
-      headStyle: s("Foot head 14"),
-      linkStyle: s("Small 14"),
-      ruleColor: "hairline"
-    });
-    k.counts(sheet, counts);
-    k.cues(sheet, cues);
-    respond(k, sheet, s, {
-      stack: ["Hero", "Reconciliation", "Grid", "Security", "Story", "Band", "Footer columns"],
-      stackMobile: ["KPIs"],
-      restyle: {
-        "Display 60": { laptop: "Display 52", tablet: "Display 44", mobile: "Display 34" },
-        "Section 36": { mobile: "Section 26" },
-        "Lead 18": { mobile: "Lead 16" },
-        "KPI 24": { laptop: "KPI 18", mobile: "KPI 18" },
-        "Stat 56": { mobile: "Stat 40" },
-        "Quote 24": { mobile: "Quote 19" }
-      },
-      gap: { tablet: 64, mobile: 52 },
-      tweak: (kit, id, size) => {
-        const each = (name, props) => {
-          for (const n of kit.named(id, name)) kit.patch(n, props);
-        };
-        const pad = (v, h = v) => ({ top: v, right: h, bottom: v, left: h });
-        if (size === "laptop") {
-          each("Hero", { itemSpacing: 40 });
-          each("Copy", { width: 440 });
-          each("Side cells", { width: 400 });
-        }
-        if (size === "tablet") compactNav(kit, id, ["Integrations", "Customers"], 24);
-        if (size === "tablet" || size === "mobile") {
-          each("Hero", { itemSpacing: 36 });
-          each("Reconciliation", { itemSpacing: 28 });
-          each("Story", { itemSpacing: 28 });
-          each("Security", { itemSpacing: 32, padding: pad(32) });
-          each("Band", { itemSpacing: 20, padding: pad(28) });
-          each("Seals", { layoutSizingHorizontal: "HUG" });
-          each("Logo row", { primaryAxisAlignItems: "MIN" });
-        }
-        if (size === "mobile") {
-          each("KPI", { layoutMode: "HORIZONTAL", counterAxisAlignItems: "CENTER", itemSpacing: 10, padding: { top: 9, right: 16, bottom: 9, left: 16 } });
-          each("Delta", { visible: false });
-          each("Period", { visible: false });
-          for (const kpi of KPIS) each(`${kpi.id} figure`, { layoutSizingHorizontal: "HUG", textAutoResize: "WIDTH_AND_HEIGHT" });
-          each("Plan accounts", { visible: false });
-          each("Share lane", { visible: false });
-          each("Kind", { visible: false });
-          each("Synced", { visible: false });
-          each("Records", { width: 116 });
-          each("Plot", { padding: { top: 14, right: 16, bottom: 12, left: 16 } });
-          each("Plan table", { padding: { top: 6, right: 16, bottom: 8, left: 16 } });
-          each("Ledger head", { padding: pad(10, 14) });
-          each("Ledger row", { padding: pad(12, 14) });
-          each("Exceptions", { padding: pad(12, 14) });
-          each("Waterfall cell", { padding: pad(20, 16) });
-          each("Risk cell", { padding: pad(20, 16) });
-          each("Board cell", { padding: pad(20, 16) });
-          each("Waterfall", { itemSpacing: 6 });
-          each("Reason", { visible: false });
-          each("Security", { padding: pad(24, 20) });
-          each("Seals", { itemSpacing: 8 });
-          each("Seal", { width: 66, height: 66 });
-          each("Seal ring", { visible: false });
-          each("Seal kind", { visible: false });
-          each("Band", { padding: pad(24, 20) });
-          each("Footer lists", { itemSpacing: 16 });
-          each("Review link", { visible: false });
-        }
-      }
-    });
-    return k.finish();
-  }
-});
-
-export {
-  saas_data_landing_default
-};

package/dist/chunks/chunk-YNAICOB2.js

@@ -1,187 +0,0 @@
-import { createRequire as __popcraftRequire } from 'node:module';
-import { fileURLToPath as __popcraftPath } from 'node:url';
-import { dirname as __popcraftDirname } from 'node:path';
-const require = __popcraftRequire(import.meta.url);
-const __filename = __popcraftPath(import.meta.url);
-const __dirname = __popcraftDirname(__filename);
-import {
-  SALE,
-  drain,
-  fitRays,
-  liveBadge,
-  liveBrand,
-  nightPill,
-  numerals,
-  numeralsWidth,
-  parcel,
-  pennants,
-  pinned,
-  rays,
-  reactions
-} from "./chunk-ZEOKTCQW.js";
-import {
-  MONO
-} from "./chunk-PFCHOCEN.js";
-import {
-  outro,
-  pill,
-  postVariants
-} from "./chunk-LEKU2ZW3.js";
-import {
-  defineTemplate
-} from "./chunk-HLBQLOTA.js";
-import {
-  Kit,
-  preset
-} from "./chunk-2P7ISWIA.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/motion/singles-day-flash-post.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var LOOP = 8e3;
-var TICKS = 6;
-var SELLING = 1600;
-var SOLD = 11;
-var EVERY = 500;
-var CONTENT = ["Top", "Headline", "Skyline", "Deal", "Button"];
-var TOWER = 296;
-var DEPTH = 32;
-var SKY = { w: Math.round(numeralsWidth(TOWER)) + DEPTH, h: 372 };
-var HEAP_H = 400;
-var HEAP = [
-  { x: -30, w: 250, h: 210, label: true },
-  { x: 20, w: 150, h: 120, on: 210 },
-  { x: 236, w: 190, h: 140 },
-  { x: 270, w: 110, h: 84, on: 140 },
-  { x: 444, w: 230, h: 104, label: true },
-  { x: 690, w: 170, h: 170 },
-  { x: 842, w: 270, h: 240, label: true },
-  { x: 900, w: 150, h: 104, on: 240 },
-  { x: 716, w: 110, h: 80, on: 170 }
-];
-var cues = [
-  { layer: "Top", preset: "fade-in", at: 0, params: { duration: 300 } },
-  { layer: "Headline", preset: "drop-in", at: 0, params: { duration: 450 } },
-  { layer: "Skyline", preset: "fade-in", at: 0, params: { duration: 200 } },
-  { layer: "Numeral", preset: "rise-in", at: 120, params: { duration: 520 }, stagger: { delay: 110 } },
-  { layer: "Bunting", preset: "fade-in", at: 900, params: { duration: 400 } },
-  { layer: "Deal", preset: "rise-in", at: 500, params: { duration: 550 } },
-  { layer: "Was strike", preset: "wipe-in", at: 1200, params: { duration: 280 } },
-  { layer: "Off chip", preset: "pop-in", at: 2e3, params: { duration: 320 } },
-  { layer: "Price figure", preset: "pulse", at: 2e3, params: { duration: 500, amount: 0.1 } },
-  { layer: "Button", preset: "pop-in", at: 1e3, params: { duration: 380 } },
-  { layer: "Button", preset: "pulse", at: 4600, params: { duration: 600, amount: 0.06 } },
-  outro(CONTENT, 7200)
-];
-var counts = [
-  { layer: "Watching figure", at: 0, duration: 2400, counter: { from: 1011, to: 1111, suffix: " watching" } },
-  { layer: "Price figure", at: 1200, duration: 800, counter: { from: SALE.was, to: SALE.now, prefix: "$" } },
-  { layer: "Seconds figure", at: 1e3, duration: TICKS * 1e3, tick: 1e3, counter: { from: SALE.seconds, to: SALE.seconds - TICKS } },
-  { layer: "Stock figure", at: SELLING, duration: SOLD * EVERY, tick: EVERY, counter: { from: SALE.left + SOLD, to: SALE.left, suffix: ` of ${SALE.seats} seats left` } }
-];
-var singles_day_flash_post_default = defineTemplate({
-  id: "motion-singles-day-flash-post",
-  meta: {
-    name: "Singles Day flash deal countdown post",
-    description: "A last-call post for an 11.11 SaaS sale on a ground of mint: the date rises as four tower blocks with their lights on, parcels at their feet and hearts floating up, over a pinned deal whose price counts from $29 to $11 while a flash clock ticks real seconds and a \u201Cselling fast\u201D bar runs down a seat every half second. Eight seconds, looping, square with 4:5 and 9:16 cuts",
-    category: "animation",
-    tags: ["animation", "singles day", "11.11", "double eleven", "flash sale", "countdown", "timer", "stock", "selling fast", "solo founder", "saas", "post", "deadline", "seasonal"],
-    platforms: ["instagram", "x", "linkedin", "facebook", "threads"],
-    formats: ["post", "portrait-post", "story", "ad"],
-    useCases: ["countdown", "sale", "pricing"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  motion: { cues, counts, loop: true },
-  build() {
-    const k = new Kit("Singles Day flash deal countdown post", preset("ig-post"));
-    k.quantizeGeometry = true;
-    liveBrand(k, {}, ["primary", "onPrimary", "accent", "onAccent", "card", "onCard", "cardMuted"]);
-    k.textStyle("Live 24", { ...MONO, size: 24, fontWeight: 800, letterSpacing: 2, lineHeight: 30 });
-    k.textStyle("Watching 22", { ...MONO, size: 22, fontWeight: 700, lineHeight: 30, fontFeatures: { tnum: 1 } });
-    k.textStyle("Display 104", { size: 104, fontWeight: 900, letterSpacing: -4.6, lineHeight: 100 });
-    k.textStyle("Display 88", { size: 88, fontWeight: 900, letterSpacing: -3.8, lineHeight: 88 });
-    k.textStyle("Lot 20", { ...MONO, size: 20, fontWeight: 700, letterSpacing: 1.4, lineHeight: 26 });
-    k.textStyle("Title 30", { size: 30, fontWeight: 800, letterSpacing: -0.6, lineHeight: 36 });
-    k.textStyle("Price 96", { size: 96, fontWeight: 900, letterSpacing: -4.6, lineHeight: 92, fontFeatures: { tnum: 1 } });
-    k.textStyle("Was 42", { size: 42, fontWeight: 700, letterSpacing: -1.4, lineHeight: 48 });
-    k.textStyle("Chip 24", { ...MONO, size: 24, fontWeight: 800, lineHeight: 30 });
-    k.textStyle("Clock 52", { ...MONO, size: 52, fontWeight: 800, letterSpacing: -1.4, lineHeight: 54, fontFeatures: { tnum: 1 } });
-    k.textStyle("Unit 18", { ...MONO, size: 18, fontWeight: 700, letterSpacing: 1.8, lineHeight: 22 });
-    k.textStyle("Stock 22", { ...MONO, size: 22, fontWeight: 800, letterSpacing: 0.6, lineHeight: 28, fontFeatures: { tnum: 1 } });
-    k.textStyle("Button 32", { size: 32, fontWeight: 800, letterSpacing: -0.4, lineHeight: 40 });
-    pill(k, "Seat button", { fill: "primary", ink: "onPrimary", style: "Button 32", label: `Grab a seat \xB7 ${SALE.link}`, pad: [20, 40] });
-    pill(k, "Chip", { fill: "accent", ink: "onAccent", style: "Chip 24", label: `\u2212${SALE.off}%`, pad: [6, 14], radius: 10 });
-    const sheet = k.sheet;
-    k.nameSheet(sheet, "Flash post");
-    k.flowSheet(sheet, 14, 56, "accent", "CENTER", "CENTER");
-    k.patch(sheet, { clipsContent: true });
-    k.timeline(sheet, { duration: LOOP, fps: 30 });
-    rays(k, sheet, { w: 1080, h: 1080, cx: 540, cy: 470, opacity: 0.07 });
-    const flagsTop = k.frame(sheet, { x: 0, y: 0, width: 1080, height: 240 }, { name: "Tall bunting" });
-    pennants(k, flagsTop, { x: -20, y: 64, w: 1120, sag: 60, u: 1.3, colors: ["primary", "white", "night", "heart"] });
-    const heap = k.frame(sheet, { x: 0, y: 1080, width: 1080, height: HEAP_H }, { name: "Tall parcels" });
-    for (const p of HEAP) parcel(k, heap, p.x, HEAP_H - (p.on ?? 0), p, 1);
-    for (const n of [flagsTop, heap]) k.patch(n, { visible: false });
-    const top = k.stack(sheet, { direction: "HORIZONTAL", gap: 12, align: "CENTER", justify: "CENTER", name: "Top" });
-    liveBadge(k, top, { style: "Live 24", loopMs: LOOP, dark: true });
-    nightPill(k, top, "1,111 watching", { style: "Watching 22", name: "Watching" });
-    nightPill(k, top, "SINGLES\u2019 DAY \xB7 11.11", { style: "Watching 22", name: "Day" });
-    k.text(sheet, "Party of one? $11.", { style: "Display 104", color: "onAccent", align: "CENTER", name: "Headline" });
-    const sky = k.stack(sheet, { width: SKY.w, height: SKY.h, name: "Skyline" });
-    numerals(k, sky, { h: TOWER, absolute: { x: 0, y: SKY.h - TOWER - DEPTH }, depth: DEPTH, loopMs: LOOP });
-    reactions(k, sky, { w: SKY.w - 60, h: 360, n: 10, u: 1.1, loopMs: LOOP, from: 900, seed: 7, absolute: { x: 30, y: -30 }, colors: ["heart", "white", "night", "heart", "primary", "white"] });
-    const flags = k.frame(sky, { x: 0, y: 0, width: SKY.w, height: 120 }, { name: "Bunting" });
-    pennants(k, flags, { x: TOWER * 0.32, y: SKY.h - TOWER - DEPTH - 6, w: SKY.w - DEPTH - TOWER * 0.5, sag: 30, u: 0.6, colors: ["white", "heart", "night", "foil"] });
-    const foot = SKY.h - DEPTH + 10;
-    parcel(k, sky, TOWER * 1.42 + 8, SKY.h - DEPTH - TOWER * 0.2 + 2, { x: 0, w: 44, h: 36 }, 1);
-    parcel(k, sky, -34, foot, { x: 0, w: 96, h: 84, label: true }, 1);
-    parcel(k, sky, SKY.w - 96, foot, { x: 0, w: 110, h: 70 }, 1);
-    parcel(k, sky, SKY.w - 70, foot - 70, { x: 0, w: 64, h: 52 }, 1);
-    pinned(k, sheet, {
-      lot: "PINNED \xB7 LOT 01 \xB7 FLASH DEAL",
-      title: "{{brand.name}} Solo, first month",
-      price: `$${SALE.now}`,
-      was: `$${SALE.was}`,
-      chip: "Chip",
-      saving: `\u2212${SALE.off}%`,
-      left: SALE.left,
-      total: SALE.seats,
-      suffix: ` of ${SALE.seats} seats left`,
-      seconds: SALE.seconds - TICKS,
-      styles: { lot: "Lot 20", title: "Title 30", price: "Price 96", was: "Was 42", stock: "Stock 22", clock: "Clock 52", unit: "Unit 18" },
-      pad: { top: 22, right: 28, bottom: 24, left: 28 },
-      gap: 12,
-      radius: 32,
-      bar: 22
-    });
-    k.instance(sheet, "Seat button", { Label: `Grab a seat \xB7 ${SALE.link}` }, { name: "Button" });
-    drain(k, sheet, { from: (SALE.left + SOLD) / SALE.seats, to: SALE.left / SALE.seats, at: SELLING, duration: SOLD * EVERY });
-    k.counts(sheet, counts);
-    k.cues(sheet, cues);
-    k.variants(sheet, postVariants({ portrait: 72 }, {
-      portrait: (kit, id) => {
-        kit.patch(id, { itemSpacing: 34, counterAxisSpacing: 34 });
-        fitRays(kit, id, { w: 1080, h: 1350, cx: 540, cy: 600 });
-      },
-      // Inside the vertical apps' safe area the column is 800 wide: the headline steps down, the towers stand a little
-      // into the margins, and the pennants and the parcels fill what the square has no room for.
-      vertical: (kit, id) => {
-        kit.patch(id, { itemSpacing: 38, counterAxisSpacing: 38 });
-        fitRays(kit, id, { w: 1080, h: 1920, cx: 540, cy: 760 });
-        for (const n of kit.named(id, "Headline")) kit.restyle(n, "Display 88");
-        for (const n of kit.named(id, "Tall bunting")) kit.patch(n, { visible: true, x: 0, y: 0, width: 1080, height: 240 });
-        for (const n of kit.named(id, "Tall parcels")) kit.patch(n, { visible: true, x: 0, y: 1920 - HEAP_H, width: 1080, height: HEAP_H });
-      }
-    }));
-    k.setCover(sheet);
-    return k.finish();
-  }
-});
-
-export {
-  singles_day_flash_post_default
-};