@popcraft/kit 0.53.15 → 0.53.16

package/dist/chunks/chunk-FKXNWGPJ.js

@@ -1,396 +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 {
-  pill
-} from "./chunk-FYXK7W3C.js";
-import {
-  defineTemplate
-} from "./chunk-UU6U4UDR.js";
-import {
-  Kit,
-  preset
-} from "./chunk-FJACE5LJ.js";
-import {
-  init_page_presets,
-  presetPx
-} from "./chunk-JSLFV5Q5.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-63KP74KB.js";
-
-// templates/src/slides/deck.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-init_page_presets();
-var even = (n) => ({ top: n, right: n, bottom: n, left: n });
-var WIDE = {
-  preset: "slide-16x9",
-  suffix: "",
-  pad: { top: 112, right: 160, bottom: 160, left: 160 },
-  hero: even(160),
-  footerInset: 56,
-  gap: 48,
-  type: { title: 112, lead: 44, heading: 72, body: 40, subhead: 44, kicker: 24, figure: 104, label: 32, footer: 22, quote: 76, number: 220, index: 32 },
-  logo: 96
-};
-var STANDARD = {
-  preset: "slide-4x3",
-  suffix: " \xB7 4:3",
-  pad: { top: 64, right: 80, bottom: 96, left: 80 },
-  hero: even(88),
-  footerInset: 32,
-  gap: 28,
-  type: { title: 60, lead: 26, heading: 40, body: 24, subhead: 26, kicker: 19, figure: 56, label: 18, footer: 14, quote: 40, number: 120, index: 19 },
-  logo: 56
-};
-var SET = {
-  title: { weight: 800, track: -3, leading: 1.08, name: "Slide title" },
-  lead: { weight: 400, track: 0, leading: 1.3, name: "Slide lead" },
-  heading: { weight: 800, track: -2, leading: 1.12, name: "Slide heading" },
-  body: { weight: 400, track: 0, leading: 1.3, name: "Slide body" },
-  subhead: { weight: 700, track: -1, leading: 1.2, name: "Slide subhead" },
-  kicker: { weight: 800, track: 12, leading: 1.25, name: "Slide kicker" },
-  figure: { weight: 900, track: -3, leading: 1.05, name: "Slide figure" },
-  label: { weight: 500, track: 0, leading: 1.3, name: "Slide label" },
-  footer: { weight: 500, track: 0, leading: 1.3, name: "Slide footer" },
-  quote: { weight: 700, track: -2, leading: 1.2, name: "Slide quote" },
-  number: { weight: 900, track: -4, leading: 1, name: "Slide number" },
-  index: { weight: 800, track: 0, leading: 1.25, name: "Slide index" }
-};
-var TRANSITIONS = {
-  title: ["DISSOLVE", 600],
-  cover: ["DISSOLVE", 600],
-  section: ["PUSH_FROM_RIGHT", 500],
-  closing: ["DISSOLVE", 700],
-  agenda: ["DISSOLVE", 400],
-  points: ["DISSOLVE", 400],
-  stats: ["DISSOLVE", 400],
-  panels: ["DISSOLVE", 400],
-  quote: ["DISSOLVE", 400],
-  steps: ["DISSOLVE", 400],
-  check: ["SLIDE_FROM_BOTTOM", 400]
-};
-function cuesFor(s) {
-  const heading = { layer: "Heading", preset: "rise-in", at: 0 };
-  switch (s.kind) {
-    case "title":
-      return [
-        { layer: "{{brand.logo}}", preset: "pop-in", at: 0 },
-        ...s.kicker ? [{ layer: "Kicker", preset: "drop-in", at: 150 }] : [],
-        { layer: "Title", preset: "rise-in", at: 300, params: { duration: 700 } },
-        { layer: "Lead", preset: "fade-in", at: 750, params: { duration: 500 } }
-      ];
-    case "cover":
-      return [
-        { layer: "{{brand.logo}}", preset: "pop-in", at: 0, params: { duration: 600 } },
-        { layer: "Kicker", preset: "drop-in", at: 200 },
-        { layer: "Title", preset: "rise-in", at: 400, params: { duration: 800 } },
-        { layer: "Rule", preset: "wipe-in", at: 900, params: { duration: 600 } },
-        { layer: "Lead", preset: "blur-in", at: 1100, params: { duration: 700 } },
-        { layer: "Speaker", preset: "fade-in", at: 1600, params: { duration: 500 } },
-        { layer: "{{brand.logo}}", preset: "pulse", at: 2600, params: { amount: 0.06 } }
-      ];
-    case "section":
-      return [
-        { layer: "Number", preset: "scale-in", at: 0, params: { duration: 700, amount: 0.6 } },
-        { layer: "Rule", preset: "wipe-in", at: 300, params: { duration: 600 } },
-        { layer: "Title", preset: "rise-in", at: 450, params: { duration: 700 } },
-        ...s.kicker ? [{ layer: "Kicker", preset: "fade-in", at: 900 }] : [],
-        // The number keeps drifting while the presenter talks over the divider.
-        { layer: "Number", preset: "drift", at: 700 }
-      ];
-    case "agenda":
-      return [heading, { layer: "Item", preset: "slide-in", at: 350, params: { direction: "left", distance: 120, duration: 600 }, stagger: { delay: 140 } }];
-    case "points":
-      return (s.build ?? "click") === "click" ? [heading, ...s.points.map((_, i) => ({ layer: `Point ${i + 1}`, preset: "rise-in", at: 700 + i * 700, onClick: true }))] : [heading, { layer: "Point", preset: "rise-in", at: 400, stagger: { delay: 160 } }];
-    case "stats":
-      return [heading, { layer: "Stat", preset: "pop-in", at: 700, stagger: { delay: 180 }, onClick: true }];
-    case "panels":
-      return [heading, ...s.panels.map((_, i) => ({ layer: `Panel ${i + 1}`, preset: "rise-in", at: 700 + i * 700, onClick: true }))];
-    case "quote":
-      return [{ layer: "Quote", preset: "blur-in", at: 0, params: { duration: 800 } }, { layer: "By", preset: "fade-in", at: 700 }];
-    case "steps":
-      return [
-        heading,
-        { layer: "Step", preset: "rise-in", at: 700, stagger: { delay: 220 }, onClick: true },
-        { layer: "Track", preset: "wipe-in", at: 800, params: { duration: 500 }, stagger: { delay: 220 } }
-      ];
-    case "check":
-      return [
-        { layer: "Kicker", preset: "drop-in", at: 0 },
-        { layer: "Question", preset: "rise-in", at: 150 },
-        { layer: "Answer", preset: "scale-in", at: 900, params: { amount: 0.9 }, onClick: true }
-      ];
-    case "closing":
-      return [
-        { layer: "Title", preset: "rise-in", at: 0, params: { duration: 700 } },
-        { layer: "Line", preset: "fade-in", at: 500 },
-        { layer: "{{brand.logo}}", preset: "pop-in", at: 800 }
-      ];
-  }
-}
-var on = (role) => `on${role[0].toUpperCase()}${role.slice(1)}`;
-var Deck = class {
-  /** `row`: where on the canvas this size's slides sit (y); the first size is the one the document was made with. */
-  constructor(k, size, o = {}, row) {
-    this.k = k;
-    this.size = size;
-    this.o = o;
-    this.row = row;
-    this.pending = [];
-    this.master = null;
-    this.made = /* @__PURE__ */ new Set();
-    this.used = 0;
-    this.hi = o.accent ?? "accent";
-    this.onHi = on(this.hi);
-  }
-  get width() {
-    const w = presetPx(preset(this.size.preset)).width;
-    return w - this.size.pad.left - this.size.pad.right;
-  }
-  /** The text style for `role` at this size (defined the first time a slide uses it). */
-  style(role) {
-    const px = this.size.type[role], s = SET[role];
-    const name = `${s.name} ${px}`;
-    this.k.textStyle(name, { size: px, fontWeight: s.weight, letterSpacing: Math.round(s.track * px / 10) / 10, lineHeight: Math.round(px * s.leading) });
-    return name;
-  }
-  once(name, make) {
-    const full = name + this.size.suffix;
-    if (!this.made.has(full)) {
-      this.made.add(full);
-      make(full);
-    }
-    return full;
-  }
-  /** The chip a title, section or check wears: a hugging pill in the accent and its on-colour. */
-  chip() {
-    return this.once("Chip", (full) => pill(this.k, full, { fill: this.hi, ink: this.onHi, style: this.style("kicker"), label: "SECTION", pad: [Math.round(this.size.type.kicker * 0.45), this.size.type.kicker] }));
-  }
-  /** The chip on a section slide, whose ground is the accent: the colours swapped, so it still reads as a chip. */
-  chipOnAccent() {
-    return this.once("Chip on accent", (full) => pill(this.k, full, { fill: this.onHi, ink: this.hi, style: this.style("kicker"), label: "SECTION", pad: [Math.round(this.size.type.kicker * 0.45), this.size.type.kicker] }));
-  }
-  /** A point: the accent bar and the words, laid out from the left so an instance can fill any width. */
-  point() {
-    return this.once("Point", (full) => {
-      const t = this.size.type.body;
-      this.k.component(full, { direction: "HORIZONTAL", width: this.width, gap: Math.round(t * 0.6), align: "CENTER", props: { Text: "A point" } }, (id) => {
-        this.k.rect(id, Math.round(t * 0.25), Math.round(t * 1.4), this.hi, { radius: Math.round(t * 0.12), name: "Bar" });
-        this.k.propText(id, "Text", { style: this.style("body"), color: "text", width: "FILL" });
-      });
-    });
-  }
-  stat() {
-    return this.once("Stat", (full) => {
-      const t = this.size.type.figure;
-      this.k.component(full, { width: Math.round(this.width / 3), gap: Math.round(t * 0.12), props: { Figure: "00", Label: "Label" } }, (id) => {
-        this.k.rect(id, Math.round(t * 0.6), Math.round(t * 0.08), this.hi, { radius: Math.round(t * 0.04), name: "Rule" });
-        this.k.propText(id, "Figure", { style: this.style("figure"), color: this.o.figure ?? this.hi, width: "FILL" });
-        this.k.propText(id, "Label", { style: this.style("label"), color: "onPaper", width: "FILL" });
-      });
-    });
-  }
-  agendaItem() {
-    return this.once("Agenda item", (full) => {
-      const t = this.size.type.index;
-      this.k.component(full, { direction: "HORIZONTAL", width: this.width, gap: Math.round(t * 0.9), align: "CENTER", props: { Number: "01", Label: "An item" } }, (id) => {
-        const badge = this.k.stack(id, { direction: "HORIZONTAL", width: Math.round(t * 2.6), height: Math.round(t * 2.6), fill: this.hi, radius: Math.round(t * 1.3), align: "CENTER", justify: "CENTER", name: "Badge" });
-        this.k.propText(badge, "Number", { style: this.style("index"), color: this.onHi, autoWidth: true });
-        this.k.propText(id, "Label", { style: this.style("subhead"), color: "text", width: "FILL" });
-      });
-    });
-  }
-  // ── Sheets ──
-  sheet(s) {
-    const k = this.k;
-    const id = this.used === 0 && this.row === void 0 ? k.sheet : k.addSheet(preset(this.size.preset));
-    this.used++;
-    k.nameSheet(id, s.name);
-    const print = k.node(id).print;
-    if (print?.masterId) {
-      const { masterId: _m, ...rest } = print;
-      void _m;
-      k.patch(id, { print: rest });
-    }
-    if (this.row !== void 0) k.patch(id, { x: (this.used - 1) * (k.node(id).width + 120), y: this.row });
-    const [type, ms] = TRANSITIONS[s.kind];
-    k.transition(id, type, ms);
-    k.timeline(id, { duration: 1e3, fps: 30 });
-    this.pending.push({ sheet: id, cues: cuesFor(s) });
-    return id;
-  }
-  /** The footer every content slide shares: the brand logo and name, and the page number, on a master. */
-  footer(sheetId) {
-    if (this.o.footer === false) return;
-    const k = this.k;
-    if (!this.master) {
-      const m = k.addMaster();
-      const sheet = k.node(sheetId);
-      k.patch(m, { width: sheet.width, height: sheet.height, ...this.row !== void 0 ? { x: 0, y: this.row + sheet.height + 120 } : {} });
-      k.flowSheet(m, 0, { top: 0, right: this.size.pad.right, bottom: this.size.footerInset, left: this.size.pad.left }, "paper", "MAX", "MIN");
-      k.patch(m, { fills: [] });
-      const bar = k.stack(m, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Footer" });
-      const left = k.stack(bar, { direction: "HORIZONTAL", width: "HUG", gap: Math.round(this.size.type.footer * 0.6), align: "CENTER", name: "Brand" });
-      const mark = Math.round(this.size.type.footer * 1.4);
-      k.logo(left, mark, mark, { placeholder: "tile" });
-      k.text(left, "{{brand.company}}", { style: this.style("footer"), color: "onPaper", autoWidth: true, name: "Company" });
-      k.text(bar, "{{page}} / {{pageCount}}", { style: this.style("footer"), color: "onPaper", autoWidth: true, name: "Page number" });
-      this.master = m;
-    }
-    k.useMaster([sheetId], this.master);
-  }
-  content(s) {
-    const id = this.sheet(s);
-    this.k.flowSheet(id, this.size.gap, this.size.pad, "paper", "MIN", "MIN");
-    this.footer(id);
-    this.k.text(id, s.heading, { style: this.style("heading"), color: "text", name: "Heading" });
-    return id;
-  }
-  add(s) {
-    const k = this.k, z = this.size;
-    switch (s.kind) {
-      case "title":
-      case "closing": {
-        const ground = s.ground ?? "primary", ink = on(ground);
-        const id = this.sheet(s);
-        k.flowSheet(id, Math.round(z.gap * (s.kind === "title" ? 0.7 : 0.6)), z.hero, ground, "CENTER", "MIN");
-        if (s.kind === "title") {
-          k.logo(id, z.logo, z.logo);
-          if (s.kicker) k.instance(id, this.chip(), { Label: s.kicker }, { name: "Kicker" });
-          k.text(id, s.title, { style: this.style("title"), color: ink, name: "Title" });
-          k.text(id, s.lead, { style: this.style("lead"), color: ink, name: "Lead" });
-        } else {
-          k.text(id, s.title, { style: this.style("title"), color: ink, name: "Title" });
-          k.text(id, s.line, { style: this.style("lead"), color: ink, name: "Line" });
-          k.logo(id, z.logo, z.logo);
-        }
-        return id;
-      }
-      case "cover": {
-        const ground = s.ground ?? "primary", ink = on(ground);
-        const id = this.sheet(s);
-        k.flowSheet(id, Math.round(z.gap * 0.6), z.hero, ground, "CENTER", "MIN");
-        k.logo(id, z.logo, z.logo);
-        k.instance(id, this.chip(), { Label: s.kicker }, { name: "Kicker" });
-        k.text(id, s.title, { style: this.style("title"), color: ink, name: "Title" });
-        k.stack(id, { width: Math.round(z.type.heading * 2.4), height: Math.max(6, Math.round(z.type.heading * 0.12)), fill: this.hi, radius: 6, clip: true, name: "Rule" });
-        k.text(id, s.lead, { style: this.style("lead"), color: ink, name: "Lead" });
-        k.text(id, s.speaker, { style: this.style("label"), color: ink, name: "Speaker" });
-        return id;
-      }
-      case "section": {
-        const id = this.sheet(s);
-        k.flowSheet(id, Math.round(z.gap * 0.6), z.hero, this.hi, "CENTER", "MIN");
-        const numeral = k.stack(id, { direction: "HORIZONTAL", width: "HUG", name: "Number" });
-        k.text(numeral, s.number, { style: this.style("number"), color: this.onHi, autoWidth: true, name: "Numeral" });
-        k.stack(id, { width: Math.round(z.type.heading * 2.4), height: Math.max(6, Math.round(z.type.heading * 0.14)), fill: this.onHi, radius: 6, clip: true, name: "Rule" });
-        k.text(id, s.title, { style: this.style("title"), color: this.onHi, name: "Title" });
-        if (s.kicker) k.instance(id, this.chipOnAccent(), { Label: s.kicker }, { name: "Kicker" });
-        return id;
-      }
-      case "agenda": {
-        const id = this.content(s);
-        const list = k.stack(id, { gap: Math.round(z.gap * 0.55), name: "Items" });
-        s.items.forEach((label, i) => k.instance(list, this.agendaItem(), { Number: String(i + 1).padStart(2, "0"), Label: label }, { name: "Item", width: "FILL" }));
-        return id;
-      }
-      case "points": {
-        const id = this.content(s);
-        const list = k.stack(id, { gap: Math.round(z.gap * 0.6), name: "Points" });
-        const click = (s.build ?? "click") === "click";
-        s.points.forEach((text, i) => k.instance(list, this.point(), { Text: text }, { name: click ? `Point ${i + 1}` : "Point", width: "FILL" }));
-        return id;
-      }
-      case "stats": {
-        const id = this.content(s);
-        const row = k.stack(id, { direction: "HORIZONTAL", gap: z.gap, name: "Stats" });
-        for (const st of s.stats) k.instance(row, this.stat(), { Figure: st.figure, Label: st.label }, { name: "Stat", width: "FILL" });
-        return id;
-      }
-      case "panels": {
-        const id = this.content(s);
-        const row = k.stack(id, { direction: "HORIZONTAL", gap: Math.round(z.gap * (s.filled ? 0.8 : 1.3)), name: "Panels" });
-        const p = Math.round(z.type.body * 1.2);
-        s.panels.forEach((panel, i) => {
-          const ground = !s.filled ? void 0 : i % 2 ? this.hi : "tint";
-          const head = ground ? on(ground) : "text";
-          const box = k.stack(row, { width: "FILL", gap: Math.round(z.gap * 0.35), name: `Panel ${i + 1}`, ...ground ? { fill: ground, radius: Math.round(p * 0.5), padding: p } : {} });
-          k.text(box, panel.title, { style: this.style("subhead"), color: head, name: "Panel title" });
-          k.text(box, panel.body, { style: this.style("body"), color: ground ? head : "onPaper", name: "Panel body" });
-        });
-        return id;
-      }
-      case "quote": {
-        const id = this.sheet(s);
-        k.flowSheet(id, z.gap, { ...z.hero, left: z.hero.left + z.pad.left / 2, right: z.hero.right + z.pad.right / 2 }, "paper", "CENTER", "MIN");
-        this.footer(id);
-        k.text(id, s.quote, { style: this.style("quote"), color: "text", name: "Quote" });
-        k.text(id, s.by, { style: this.style("label"), color: "onPaper", name: "By" });
-        return id;
-      }
-      case "steps": {
-        const id = this.content(s);
-        const row = k.stack(id, { direction: "HORIZONTAL", gap: Math.round(z.gap * 0.7), name: "Steps" });
-        const t = z.type.body;
-        for (const st of s.steps) {
-          const step = k.stack(row, { width: "FILL", gap: Math.round(t * 0.35), name: "Step" });
-          k.stack(step, { height: Math.max(5, Math.round(t * 0.25)), fill: this.hi, radius: Math.round(t * 0.12), clip: true, name: "Track" });
-          k.text(step, st.title, { style: this.style("subhead"), color: "text", name: "Step title" });
-          k.text(step, st.body, { style: this.style("body"), color: "onPaper", name: "Step body" });
-        }
-        return id;
-      }
-      case "check": {
-        const id = this.sheet(s);
-        k.flowSheet(id, z.gap, z.pad, "paper", "CENTER", "MIN");
-        this.footer(id);
-        k.instance(id, this.chip(), { Label: s.kicker }, { name: "Kicker" });
-        k.text(id, s.question, { style: this.style("heading"), color: "text", name: "Question" });
-        const p = Math.round(z.type.body * 1.1);
-        const box = k.stack(id, { fill: "tint", radius: Math.round(p * 0.5), padding: p, name: "Answer" });
-        k.text(box, s.answer, { style: this.style("subhead"), color: "onTint", name: "Answer text" });
-        return id;
-      }
-    }
-  }
-  /** Apply every slide's cues, once the whole deck is laid out (a preset measures the layer it lands on). */
-  finish() {
-    for (const p of this.pending) this.k.cues(p.sheet, p.cues);
-    this.pending = [];
-  }
-};
-function defineDeck(d) {
-  const names = d.slides.map((s) => s.name);
-  if (new Set(names).size !== names.length) throw new Error(`${d.id}: two slides share a name`);
-  const sizes = d.sizes ?? [WIDE];
-  return defineTemplate({
-    id: d.id,
-    meta: d.meta,
-    motion: { slides: d.slides.map((s) => ({ slide: s.name, cues: cuesFor(s) })) },
-    build() {
-      const k = new Kit(d.meta.name, preset(sizes[0].preset));
-      k.brand(d.colors, d.fields);
-      let row;
-      for (const z of sizes) {
-        const deck = new Deck(k, z, d.options, row);
-        for (const s of d.slides) deck.add(s);
-        deck.finish();
-        row = (row ?? 0) + presetPx(preset(z.preset)).height * 2 + 480;
-      }
-      return k.finish();
-    }
-  });
-}
-
-export {
-  WIDE,
-  STANDARD,
-  cuesFor,
-  on,
-  Deck,
-  defineDeck
-};

package/dist/chunks/chunk-FKZ47PUG.js

@@ -1,255 +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 {
-  DEAL,
-  board as board2,
-  boardHead,
-  change,
-  chart,
-  dashRule,
-  floorBrand,
-  ledWell,
-  playChart,
-  row,
-  tape,
-  two
-} from "./chunk-2HJJBZRB.js";
-import {
-  MONO,
-  SERIF
-} from "./chunk-MPRWXHPJ.js";
-import {
-  buttons,
-  nav,
-  page,
-  webResponsive
-} from "./chunk-KLAIZ7BD.js";
-import {
-  board,
-  reboard
-} from "./chunk-T43CHLBH.js";
-import {
-  pill
-} from "./chunk-FYXK7W3C.js";
-import {
-  defineTemplate
-} from "./chunk-UU6U4UDR.js";
-import {
-  Kit,
-  preset
-} from "./chunk-FJACE5LJ.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-63KP74KB.js";
-
-// templates/src/web/black-friday-ticker-landing.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var PLANS = [
-  { id: "Solo", symbol: "SOLO", name: "Solo, annual", pitch: "One status page and on-call alerts for one person.", wasLabel: "PREV CLOSE, 12 MONTHS", was: DEAL.soloWas, now: DEAL.soloNow, fall: `${DEAL.off}%`, includes: ["1 STATUS PAGE", "20 MONITORS, 1 MIN", "EMAIL + SMS ALERTS"], cta: `BUY SOLO @ $${DEAL.soloNow}` },
-  { id: "Team", symbol: "TEAM", name: "Team, annual", pitch: "Five seats, an on-call rota and a page per product.", wasLabel: "PREV CLOSE, 12 MONTHS", was: DEAL.teamWas, now: DEAL.teamNow, fall: `${DEAL.off}%`, includes: ["5 SEATS, 5 PAGES", "100 MONITORS, 30 SEC", "ON-CALL ROTA + SLACK"], cta: `BUY TEAM @ $${DEAL.teamNow}` },
-  { id: "Life", symbol: "LIFE", name: "Solo, lifetime", pitch: "Solo for as long as {{brand.name}} runs. One fill, no renewal.", wasLabel: "FIVE YEARS AT LIST", was: DEAL.soloWas * 5, now: DEAL.lifetime, fall: "69%", includes: ["EVERY UPDATE", "NO RENEWAL, EVER"], cta: `BUY LIFETIME @ $${DEAL.lifetime}` }
-];
-var FAQ = [
-  ["Do I need a code?", "No. The board already shows the sale price on every annual plan until the closing bell: Monday 30 November, 23:59 Pacific."],
-  ["What happens at renewal?", "Year two renews at the list price. We email you 30 days before, and cancelling takes two clicks."],
-  ["Is lifetime really lifetime?", "One payment, Solo for as long as {{brand.name}} runs, every update included. 150 seats are listed and there is no second issue."]
-];
-var TICKS = 8;
-var cues = [
-  { layer: "Nav", preset: "fade-in", at: 0, params: { duration: 400 } },
-  { layer: "Eyebrow", preset: "rise-in", at: 100 },
-  { layer: "Headline", preset: "rise-in", at: 200, params: { duration: 700 } },
-  { layer: "Lead", preset: "rise-in", at: 350 },
-  { layer: "Clock", preset: "rise-in", at: 500 },
-  { layer: ["CTA primary", "CTA quiet"], preset: "rise-in", at: 650, stagger: { delay: 100 } },
-  { layer: "Deadline", preset: "fade-in", at: 900, params: { duration: 500 } },
-  { layer: "Hero board", preset: "drop-in", at: 150, params: { duration: 600 } },
-  { layer: "Candles before", preset: "wipe-in", at: 500, params: { duration: 900 } },
-  { layer: "Bell marker", preset: "fade-in", at: 1300, params: { duration: 200 } },
-  { layer: "Candle fall", preset: "wipe-in", at: 1500, params: { duration: 500, direction: "down" } },
-  { layer: "Hero change", preset: "pop-in", at: 1900, params: { duration: 400 } },
-  { layer: "Candles after", preset: "wipe-in", at: 2e3, params: { duration: 1200 } },
-  { layer: "Now level", preset: "fade-in", at: 2400, params: { duration: 300 } },
-  { layer: "Hero figure", preset: "pulse", at: 2700, params: { duration: 600, amount: 0.05 } }
-];
-var counts = [
-  { layer: "Hero figure", at: 1500, duration: 1e3, counter: { from: DEAL.teamWas, to: DEAL.teamNow, prefix: "$" } },
-  // The closing bell's clock: the seconds tick down once a second for as long as the hero plays.
-  { layer: "Seconds figure", at: 1e3, duration: TICKS * 1e3, tick: 1e3, counter: { from: DEAL.seconds, to: DEAL.seconds - TICKS } },
-  ...PLANS.map((p, i) => ({ layer: `${p.id} figure`, at: 1700 + i * 200, duration: 1400, counter: { from: p.was, to: p.now, prefix: "$", separator: "" } })),
-  { layer: "Seats row figure", at: 2e3, duration: 2400, counter: { from: DEAL.seats, to: DEAL.seatsLeft } }
-];
-var NAME = "Black Friday ticker sale landing page";
-var CHART = { w: 496, h: 230 };
-var DURATION = 1e4;
-var black_friday_ticker_landing_default = defineTemplate({
-  id: "web-black-friday-ticker-landing",
-  meta: {
-    name: NAME,
-    description: "A Black Friday landing page for a SaaS product, drawn as a trading floor on salmon newspaper paper: a scrolling ticker tape, a hero LED board whose candlestick chart falls off a cliff as the annual price counts down 60%, a live closing-bell clock, and a big board of three plans (two annual plans and a lifetime deal with its seats counting down), each with an order ticket. FAQ included. Desktop to phone",
-    category: "web",
-    tags: ["black friday", "cyber monday", "sale", "landing page", "pricing", "plans", "lifetime deal", "countdown", "stock ticker", "trading floor", "chart", "faq", "saas", "animation", "website", "responsive"],
-    platforms: ["web"],
-    formats: ["page"],
-    useCases: ["sale", "pricing", "countdown"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  breakpoints: true,
-  motion: { cues, counts },
-  build() {
-    const k = new Kit(NAME, preset("web-desktop"));
-    k.quantizeGeometry = true;
-    floorBrand(k, { name: DEAL.product, site: DEAL.site, symbol: DEAL.symbol });
-    k.textStyle("Nav 16", { size: 16, fontWeight: 500, lineHeight: 24 });
-    k.textStyle("Brand 20", { size: 20, fontWeight: 800, letterSpacing: -0.3, lineHeight: 28 });
-    k.textStyle("Button 16", { size: 16, fontWeight: 700, lineHeight: 24 });
-    k.textStyle("Tape 16", { ...MONO, size: 16, fontWeight: 800, letterSpacing: 0.6, lineHeight: 20 });
-    k.textStyle("Eyebrow 14", { ...MONO, size: 14, fontWeight: 800, letterSpacing: 1, lineHeight: 20 });
-    k.textStyle("Display 84", { ...SERIF, size: 84, fontWeight: 900, letterSpacing: -2.8, lineHeight: 84 });
-    k.textStyle("Display 64", { ...SERIF, size: 64, fontWeight: 900, letterSpacing: -2, lineHeight: 66 });
-    k.textStyle("Display 52", { ...SERIF, size: 52, fontWeight: 900, letterSpacing: -1.5, lineHeight: 54 });
-    k.textStyle("Display 40", { ...SERIF, size: 40, fontWeight: 900, letterSpacing: -1, lineHeight: 44 });
-    k.textStyle("Lead 20", { size: 20, fontWeight: 400, lineHeight: 30 });
-    k.textStyle("Lead 17", { size: 17, fontWeight: 400, lineHeight: 26 });
-    k.textStyle("Clock 44", { ...MONO, size: 44, fontWeight: 800, letterSpacing: -1, lineHeight: 48, textAlign: "CENTER", fontFeatures: { tnum: 1 } });
-    k.textStyle("Clock 30", { ...MONO, size: 30, fontWeight: 800, lineHeight: 34, textAlign: "CENTER", fontFeatures: { tnum: 1 } });
-    k.textStyle("Unit 12", { ...MONO, size: 12, fontWeight: 700, letterSpacing: 1.4, lineHeight: 16, textAlign: "CENTER" });
-    k.textStyle("Note 15", { size: 15, fontWeight: 400, lineHeight: 22 });
-    k.textStyle("Label 13", { ...MONO, size: 13, fontWeight: 700, letterSpacing: 1.4, lineHeight: 18 });
-    k.textStyle("Figure 96", { ...MONO, size: 96, fontWeight: 800, letterSpacing: -3, lineHeight: 104, fontFeatures: { tnum: 1 } });
-    k.textStyle("Figure 72", { ...MONO, size: 72, fontWeight: 800, letterSpacing: -2.4, lineHeight: 80, fontFeatures: { tnum: 1 } });
-    k.textStyle("Figure 64", { ...MONO, size: 64, fontWeight: 800, letterSpacing: -2, lineHeight: 72, fontFeatures: { tnum: 1 } });
-    k.textStyle("Change 26", { ...MONO, size: 26, fontWeight: 800, lineHeight: 30 });
-    k.textStyle("Change 18", { ...MONO, size: 18, fontWeight: 800, lineHeight: 22 });
-    k.textStyle("Axis 12", { ...MONO, size: 12, fontWeight: 700, letterSpacing: 0.6, lineHeight: 16 });
-    k.textStyle("Row 15", { ...MONO, size: 15, fontWeight: 600, lineHeight: 22, fontFeatures: { tnum: 1 } });
-    k.textStyle("Plan 24", { size: 24, fontWeight: 800, letterSpacing: -0.4, lineHeight: 30 });
-    k.textStyle("Section 40", { ...SERIF, size: 40, fontWeight: 900, letterSpacing: -1.2, lineHeight: 46 });
-    k.textStyle("Section lead 17", { size: 17, fontWeight: 400, lineHeight: 26 });
-    k.textStyle("Question 20", { ...SERIF, size: 20, fontWeight: 700, lineHeight: 26 });
-    k.textStyle("Body 15", { size: 15, fontWeight: 400, lineHeight: 23 });
-    k.textStyle("Footer 14", { size: 14, fontWeight: 400, lineHeight: 20 });
-    k.textStyle("Order 15", { ...MONO, size: 15, fontWeight: 800, letterSpacing: 0.4, lineHeight: 22 });
-    buttons(k, { style: "Button 16", pad: [14, 24], radius: 6 });
-    pill(k, "Marker", { fill: "accent", ink: "onAccent", style: "Eyebrow 14", label: "BLACK FRIDAY SELL-OFF \xB7 27\u201330 NOV", pad: [6, 12], radius: 3 });
-    pill(k, "Order", { fill: "ticket", ink: "ticketInk", style: "Order 15", label: "BUY TEAM @ $236", pad: [12, 18], radius: 4 });
-    const sheet = k.sheet;
-    page(k, sheet, { gap: 48, top: 28 });
-    k.timeline(sheet, { duration: DURATION, fps: 30 });
-    tape(k, sheet, { item: 300, height: 44, style: "Tape 16", rate: 90, radius: 6, span: 1300 });
-    nav(k, sheet, { links: ["The crash", "The board", "Questions", "Sign in"], cta: "Buy the dip", style: "Nav 16", brandStyle: "Brand 20" });
-    const dateline = k.stack(sheet, { gap: 8, name: "Dateline" });
-    k.rect(dateline, "FILL", 4, "text", { name: "Heavy rule" });
-    const date = k.stack(dateline, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", gap: 12, name: "Dateline row" });
-    k.text(date, "THE {{brand.symbol}} EXCHANGE", { style: "Eyebrow 14", color: "text", autoWidth: true, name: "Edition" });
-    k.text(date, `OPENING BELL ${DEAL.opens.toUpperCase()} \xB7 CLOSING BELL ${DEAL.ends.toUpperCase()}`, { style: "Eyebrow 14", color: "onPaper", autoWidth: true, name: "Session" });
-    k.rect(dateline, "FILL", 1, "text", { name: "Light rule" });
-    const hero = k.stack(sheet, { direction: "HORIZONTAL", gap: 64, align: "CENTER", padding: { top: 8, right: 0, bottom: 16, left: 0 }, name: "Hero" });
-    const copy = k.stack(hero, { gap: 22, name: "Copy" });
-    k.instance(copy, "Marker", { Label: "BLACK FRIDAY SELL-OFF \xB7 27\u201330 NOV" }, { name: "Eyebrow" });
-    k.text(copy, "Our prices just crashed. Buy the dip.", { style: "Display 84", color: "text", name: "Headline" });
-    k.text(copy, `{{brand.name}} runs your status page and wakes the right person when something breaks. From the opening bell on Friday to the closing bell on Monday night, every annual plan trades ${DEAL.off}% under list, and ${DEAL.seats} lifetime seats are listed.`, { style: "Lead 20", color: "onPaper", name: "Lead" });
-    const clock = board2(k, copy, { width: 472, pad: 12, gap: 8, radius: 14, u: 0.5, name: "Clock" });
-    k.text(clock, "CLOSING BELL IN", { style: "Label 13", color: "amber", name: "Clock label" });
-    const tiles = k.stack(clock, { direction: "HORIZONTAL", gap: 8, name: "Tiles" });
-    for (const [name, value] of [["Days", DEAL.days], ["Hours", DEAL.hours], ["Minutes", DEAL.minutes], ["Seconds", DEAL.seconds - TICKS]]) {
-      const tile = k.stack(tiles, { gap: 4, align: "CENTER", name: "Tile" });
-      ledWell(k, tile, { height: 64, span: 240, step: 4, weight: 1, align: "CENTER", name: "Tile well" }, (well) => {
-        k.text(well, two(value), { style: "Clock 44", color: "led", autoWidth: true, name: `${name} figure` });
-      });
-      k.text(tile, name.toUpperCase(), { style: "Unit 12", color: "cardMuted", name: `${name} unit` });
-    }
-    const cta = k.stack(copy, { direction: "HORIZONTAL", gap: 12, wrap: true, name: "CTAs" });
-    k.instance(cta, "Button", { Label: `Buy the dip, ${DEAL.off}% off` }, { name: "CTA primary" });
-    k.instance(cta, "Button quiet", { Label: "See the board" }, { name: "CTA quiet" });
-    k.text(copy, `Closing bell: ${DEAL.ends}. No code to paste: the board already shows the sale price.`, { style: "Note 15", color: "onPaper", name: "Deadline" });
-    const hb = board2(k, hero, { width: 560, pad: 28, gap: 14, radius: 22, u: 0.8, name: "Hero board" });
-    boardHead(k, hb, { label: "{{brand.symbol}}.TEAM \xB7 ANNUAL", note: "BLACK FRIDAY SESSION", style: "Label 13", lamp: 10 });
-    ledWell(k, hb, { height: 124, span: 700, step: 5, weight: 1, pad: 18, align: "SPACE_BETWEEN", name: "Hero well" }, (well) => {
-      k.text(well, `$${DEAL.teamNow}`, { style: "Figure 96", color: "led", autoWidth: true, name: "Hero figure" });
-      const side = k.stack(well, { width: "HUG", gap: 4, align: "MAX", name: "Hero change" });
-      change(k, side, `${DEAL.off}%`, { style: "Change 26", size: 18, name: "Hero fall", glow: 8 });
-      k.text(side, `LIST $${DEAL.teamWas}`, { style: "Label 13", color: "cardMuted", autoWidth: true, name: "Hero list" });
-    });
-    const c = chart(k, board(k, hb, CHART.w, CHART.h, 1, "Chart board"), { ...CHART, u: 0.7, was: `$${DEAL.teamWas}`, now: `$${DEAL.teamNow}`, style: "Axis 12", absolute: { x: 0, y: 0 } });
-    row(k, hb, "YOU KEEP, THIS YEAR", `$${DEAL.teamWas - DEAL.teamNow}`, { style: "Row 15", color: "onCard", figureColor: "led", name: "Keep row" });
-    const band = board2(k, sheet, { pad: { top: 44, right: 44, bottom: 48, left: 44 }, gap: 28, radius: 24, name: "Big board" });
-    boardHead(k, band, { label: "{{brand.symbol}} \xB7 THE BIG BOARD", note: "USD \xB7 BEFORE SALES TAX", style: "Label 13", lamp: 10, name: "Big board head" });
-    const title = k.stack(band, { gap: 8, name: "Plans head" });
-    k.text(title, "Three listings, all of them down", { style: "Section 40", color: "onCard", name: "Plans title" });
-    k.text(title, "Pick one and hand in the ticket. The price on the board is the price at checkout, and list comes back at the closing bell.", { style: "Section lead 17", color: "cardMuted", name: "Plans lead" });
-    const plans = k.stack(band, { direction: "HORIZONTAL", gap: 20, name: "Plans" });
-    for (const p of PLANS) {
-      const panel = k.stack(plans, { fill: "well", radius: 14, padding: 24, gap: 12, stroke: { color: "bezel", width: 2, align: "INSIDE" }, name: "Plan" });
-      const top = k.stack(panel, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Plan top" });
-      k.text(top, `{{brand.symbol}}.${p.symbol}`, { style: "Label 13", color: "amber", autoWidth: true, name: "Plan symbol" });
-      change(k, top, p.fall, { style: "Change 18", size: 13, name: `${p.id} fall`, glow: 6 });
-      k.text(panel, p.name, { style: "Plan 24", color: "onCard", name: "Plan name" });
-      k.text(panel, p.pitch, { style: "Note 15", color: "cardMuted", name: "Pitch" });
-      ledWell(k, panel, { height: 96, span: 700, step: 4, weight: 1, pad: 14, name: "Plan well" }, (well) => {
-        k.text(well, `$${p.now}`, { style: "Figure 64", color: "led", autoWidth: true, name: `${p.id} figure` });
-      });
-      row(k, panel, p.wasLabel, `$${p.was}`, { style: "Row 15", color: "cardMuted", name: `${p.id} was row` });
-      dashRule(k, panel, "bezel");
-      for (const inc of p.includes) row(k, panel, inc, "INCL.", { style: "Row 15", color: "onCard", figureColor: "cardMuted", name: "Included row" });
-      if (p.id === "Life") row(k, panel, `SEATS LEFT OF ${DEAL.seats}`, String(DEAL.seatsLeft), { style: "Row 15", color: "onCard", figureColor: "amber", name: "Seats row" });
-      k.instance(panel, "Order", { Label: p.cta }, { name: "Plan order" });
-    }
-    const faq = k.stack(sheet, { gap: 24, name: "FAQ" });
-    k.text(faq, "Questions from the floor", { style: "Section 40", color: "text", name: "FAQ title" });
-    const qs = k.stack(faq, { direction: "HORIZONTAL", gap: 32, name: "FAQ list" });
-    for (const [q, a] of FAQ) {
-      const item = k.stack(qs, { gap: 10, name: "Question" });
-      k.rect(item, "FILL", 3, "text", { name: "Column rule" });
-      k.text(item, q, { style: "Question 20", color: "text", name: "Q" });
-      k.text(item, a, { style: "Body 15", color: "onPaper", name: "A" });
-    }
-    const foot = k.stack(sheet, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", gap: 16, padding: { top: 8, right: 0, bottom: 0, left: 0 }, name: "Footer" });
-    k.text(foot, "Prices in US dollars, before sales tax. Annual plans renew at the list price unless you cancel; lifetime seats never renew. Not investment advice: it is a status page.", { style: "Footer 14", color: "onPaper", name: "Legal" });
-    k.text(foot, "hello@{{brand.site}}", { style: "Footer 14", color: "onPaper", autoWidth: true, name: "Email" });
-    k.counts(sheet, counts);
-    k.cues(sheet, cues);
-    playChart(k, c, { at: 500, drop: 1500, fall: 500, settle: 1200 });
-    webResponsive(k, sheet, {
-      stack: ["Hero", "Plans", "FAQ list", "Footer"],
-      restyle: { "Display 84": { laptop: "Display 64", tablet: "Display 52", mobile: "Display 40" }, "Lead 20": { mobile: "Lead 17" }, "Clock 44": { mobile: "Clock 30" }, "Figure 96": { mobile: "Figure 72" } },
-      hide: { mobile: ["Nav links", "Session"] },
-      gap: { mobile: 36 },
-      tweak: (kit, id, size) => {
-        if (size === "laptop") {
-          for (const n of kit.named(id, "Hero")) kit.patch(n, { itemSpacing: 48 });
-          for (const n of kit.named(id, "Hero board")) kit.patch(n, { width: 500 });
-          reboard(kit, id, "Chart board", 0.895);
-          for (const n of kit.named(id, "Big board")) kit.patch(n, { padding: { top: 36, right: 28, bottom: 36, left: 28 } });
-          for (const n of kit.named(id, "Plans")) kit.patch(n, { itemSpacing: 16 });
-          for (const n of kit.named(id, "Plan")) kit.patch(n, { padding: { top: 20, right: 20, bottom: 20, left: 20 } });
-        }
-        if (size === "tablet" || size === "mobile") {
-          for (const n of kit.named(id, "Hero")) kit.patch(n, { itemSpacing: 36, padding: { top: 0, right: 0, bottom: 8, left: 0 } });
-          for (const n of kit.named(id, "Clock")) kit.patch(n, { layoutSizingHorizontal: "FILL" });
-        }
-        if (size === "tablet") reboard(kit, id, "Chart board", 1.24);
-        if (size === "mobile") {
-          for (const n of kit.named(id, "Hero board")) kit.patch(n, { padding: { top: 16, right: 16, bottom: 16, left: 16 } });
-          for (const n of kit.named(id, "Hero well")) kit.patch(n, { height: 100, padding: { top: 0, right: 10, bottom: 0, left: 10 } });
-          reboard(kit, id, "Chart board", 0.61);
-          for (const n of kit.named(id, "Tile well")) kit.patch(n, { height: 48 });
-          for (const n of kit.named(id, "Big board")) kit.patch(n, { padding: { top: 24, right: 14, bottom: 24, left: 14 }, itemSpacing: 22 });
-          for (const n of kit.named(id, "Plan")) kit.patch(n, { padding: { top: 18, right: 16, bottom: 18, left: 16 } });
-          for (const n of kit.named(id, "Board note")) kit.patch(n, { visible: false });
-        }
-      }
-    });
-    return k.finish();
-  }
-});
-
-export {
-  black_friday_ticker_landing_default
-};