@popcraft/kit 0.44.0 → 0.45.0

package/dist/chunks/chunk-43KZRXA4.js

@@ -1,69 +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 {
-  FOLIO,
-  caption,
-  comicMeta,
-  comicSetup,
-  folio,
-  pageGrid,
-  panel,
-  rows,
-  say,
-  sfx,
-  slantTier,
-  tierBox,
-  tilted
-} from "./chunk-ANDXJQ7W.js";
-import {
-  defineTemplate
-} from "./chunk-FC6VBE7Y.js";
-import {
-  Kit,
-  preset
-} from "./chunk-E3A22XSE.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-W5QYHNL2.js";
-
-// templates/src/print/comic-hero-manga-action.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var comic_hero_manga_action_default = defineTemplate({
-  id: "comic-manga-action",
-  meta: comicMeta("Manga action page", 'Page nine of "Nightstar: Blackout": the finishing blow on steep diagonal frames, Nightstar coming straight at the reader, Voltrix out of power, the punch through his armour with "KRAKKOOM!" and him flying through a truck', ["manga", "action", "diagonal", "speed", "sound effects"]),
-  stableNumbers: true,
-  build() {
-    const k = new Kit("Manga action page", preset("comic-page"));
-    comicSetup(k);
-    drawPage(k);
-    return k.finish();
-  }
-});
-function drawPage(k) {
-  const g = 12, { W, H } = pageGrid(k, k.sheet, 36, g);
-  const [h1, h2, h3] = rows(H - FOLIO, g, [38, 34, 28]);
-  const t1 = tierBox(k, k.sheet, W, h1, "Tier 1");
-  const [a, b] = slantTier(W, h1, [3, 2], 44, g);
-  panel(k, t1, a, "manga-1", { ground: "heroG1", name: "Straight at him" });
-  panel(k, t1, b, "manga-2", { ground: "heroG2", name: "No power left" });
-  say(k, t1, "This one\u2019s for the city.", { x: 10, y: 10, width: 128, to: { x: a.width * 0.4, y: h1 * 0.3 } });
-  say(k, t1, "W-wait\u2014", { x: W - 108, y: h1 - 80, width: 96, to: { x: b.x + b.width * 0.6, y: h1 * 0.4 } });
-  const t2 = tierBox(k, k.sheet, W, h2, "Tier 2");
-  panel(k, t2, tilted(0, 0, W, h2, -30, 30), "manga-3", { ground: "heroG3", name: "The hit" });
-  sfx(k, t2, "Krakkoom!", { x: 20, y: h2 - 150, w: 480, h: 140, deg: -7, big: true, fill: "primary", seed: 23 });
-  const t3 = tierBox(k, k.sheet, W, h3, "Tier 3");
-  const [c, d] = slantTier(W, h3, [2, 3], -30, g);
-  panel(k, t3, c, "manga-4", { ground: "heroG1", name: "His eyes" });
-  panel(k, t3, d, "manga-5", { ground: "heroG2", name: "Through the truck" });
-  caption(k, t3, "Lights out, Voltrix.", { x: W - 170, y: h3 - 44, width: 160 });
-  folio(k, k.sheet, "Nightstar: Blackout \u2014 page 9");
-}
-
-export {
-  comic_hero_manga_action_default,
-  drawPage
-};

package/dist/chunks/chunk-44QBLQ7X.js

@@ -1,317 +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,
-  chat,
-  clock,
-  drain,
-  lift,
-  liveBadge,
-  liveBrand,
-  nightPill,
-  numerals,
-  pinned,
-  reactions,
-  room
-} from "./chunk-5CKIBZLE.js";
-import {
-  MONO
-} from "./chunk-5OTEBTMU.js";
-import {
-  buttons,
-  nav,
-  page,
-  webResponsive
-} from "./chunk-IPGCJWVL.js";
-import {
-  pill
-} from "./chunk-IL2F4BKM.js";
-import {
-  defineTemplate
-} from "./chunk-FC6VBE7Y.js";
-import {
-  Kit,
-  preset
-} from "./chunk-E3A22XSE.js";
-import {
-  ease
-} from "./chunk-6VIYCRKB.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-W5QYHNL2.js";
-
-// templates/src/web/singles-day-landing.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var LOOP = 1e4;
-var TICKS = 8;
-var W = 480;
-var H = 680;
-var BEZEL = 10;
-var ROOM = {
-  w: W,
-  h: H,
-  u: 0.56,
-  cx: 262,
-  headY: 292,
-  deskY: 468,
-  hand: "left",
-  loopMs: LOOP,
-  bunting: 16,
-  radius: 36,
-  ring: { x: 262, y: 284, r: 124 },
-  balloons: { x: 344, y: 124, h: 140 },
-  parcels: [{ x: 372, w: 150, h: 120, label: true }, { x: 396, w: 96, h: 70, on: 120 }]
-};
-var pct = (l) => Math.round((l.was - l.now) / l.was * 100);
-var money = (n) => `$${n.toLocaleString("en-US")}`;
-var LOTS = [
-  { id: "Month", tag: "LOT 01 \xB7 PINNED", title: "Solo, first month", pitch: "The whole back office for one person. Then $29 a month, and cancelling takes two clicks.", was: SALE.was, now: SALE.now, total: SALE.seats, left: SALE.left, label: "SELLING FAST", includes: ["Invoices chased until they are paid", "Support inbox answered in your voice", "Books closed on the 1st"], cta: "Grab a seat for $11" },
-  { id: "Year", tag: "LOT 02", title: "Solo, a whole year", pitch: "Twelve months of somebody else doing the invoices. Year two renews at the list price.", was: SALE.yearWas, now: SALE.yearNow, total: SALE.seats, left: 57, label: "GOING", includes: ["Everything in the first lot", "A quarterly tax pack for your accountant", "Priority queue"], cta: "Take the year for $111" },
-  { id: "Life", tag: "LOT 03 \xB7 11 ONLY", title: "Solo, for life", pitch: "Pay once and never read a renewal email again. Priced against five years of Solo at the list price.", was: 1740, now: SALE.lifetime, total: SALE.lifetimeSeats, left: 4, label: "NEARLY GONE", includes: ["Every update, for as long as Tandem runs", "A direct line to the founder", "No renewal, ever"], cta: "Claim one of eleven" }
-];
-var ASKED = [
-  ["kai_ships", "heart", "Do I need a code?", "No. The $11 is already on the pinned lot. At 22:11 UTC it goes back to $29, whether or not anyone is watching."],
-  ["ops_of_one", "kraft", "What does it actually do?", "Chases unpaid invoices until they are paid, answers the easy support mail in your voice, and closes the month\u2019s books on the 1st. You approve; it does the typing."],
-  ["marta.dev", "accent", "What if my team of one becomes two?", "Congratulations. Add a seat at the list price whenever you like. Your own first month stays $11."],
-  ["solo_sam", "foilShade", "And when the seats run out?", "Then they are out: 111 first months, 111 years, 11 lifetimes. There is no second batch and no \u201Cextended by popular demand\u201D."]
-];
-var cues = [
-  { layer: "Offer bar", preset: "drop-in", at: 0, params: { duration: 500 } },
-  { 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: "Ends", preset: "rise-in", at: 500 },
-  { layer: ["CTA primary", "CTA quiet"], preset: "rise-in", at: 650, stagger: { delay: 100 } },
-  { layer: "Note", preset: "fade-in", at: 900, params: { duration: 500 } },
-  { layer: "Visual", preset: "pop-in", at: 200, params: { duration: 600, amount: 0.92 } },
-  { layer: "Hero deal", preset: "rise-in", at: 700, params: { duration: 500 } },
-  { layer: "Hero was strike", preset: "wipe-in", at: 1300, params: { duration: 300 } },
-  { layer: "Hero off chip", preset: "pop-in", at: 2200, params: { duration: 350 } },
-  { layer: "Hero price figure", preset: "pulse", at: 2200, params: { duration: 500, amount: 0.1 } },
-  { layer: "Chat 1", preset: "pop-in", at: 2600, params: { duration: 300 } },
-  { layer: "Chat 2", preset: "pop-in", at: 4200, params: { duration: 300 } }
-];
-var counts = [
-  { layer: "Watching figure", at: 300, duration: 2600, counter: { from: 1011, to: 1111, suffix: " watching" } },
-  { layer: "Hero price figure", at: 1300, duration: 900, counter: { from: SALE.was, to: SALE.now, prefix: "$" } },
-  // The flash 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: SALE.seconds, to: SALE.seconds - TICKS } },
-  { layer: "Hero stock figure", at: 1600, duration: 8e3, ease: ease.linear, counter: { from: SALE.left + 26, to: SALE.left, suffix: ` of ${SALE.seats} left` } },
-  ...LOTS.map((l, i) => ({ layer: `${l.id} price figure`, at: 1400 + i * 200, duration: 1400, counter: { from: l.was, to: l.now, prefix: "$" } })),
-  ...LOTS.map((l, i) => ({ layer: `${l.id} stock figure`, at: 1800 + i * 200, duration: 3200, ease: ease.linear, counter: { from: l.total, to: l.left, suffix: ` of ${l.total} left` } }))
-];
-var singles_day_landing_default = defineTemplate({
-  id: "web-singles-day-landing",
-  meta: {
-    name: "Singles Day flash sale landing page",
-    description: "An 11.11 landing page for a SaaS sold to solo founders, run as a live-shopping stream: beside the offer and a flash clock that ticks, a phone shows the stream with the founder as host, a viewer count, floating hearts, chat and a pinned deal whose price counts from $29 to $11 while its \u201Cselling fast\u201D bar runs down. Three lots ($11, $111 and $1,111) with their own stock, and the chat\u2019s questions answered. Desktop to phone",
-    category: "web",
-    tags: ["singles day", "11.11", "double eleven", "flash sale", "landing page", "live shopping", "countdown", "stock", "pricing", "solo founder", "saas", "animation", "website", "responsive", "seasonal"],
-    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("Singles Day flash sale landing page", preset("web-desktop"));
-    k.quantizeGeometry = true;
-    liveBrand(k);
-    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("Bar 14", { ...MONO, size: 14, fontWeight: 700, letterSpacing: 0.4, lineHeight: 20, textAlign: "CENTER" });
-    k.textStyle("Eyebrow 14", { ...MONO, size: 14, fontWeight: 700, letterSpacing: 0.8, lineHeight: 20 });
-    k.textStyle("Display 88", { size: 88, fontWeight: 900, letterSpacing: -3.6, lineHeight: 86 });
-    k.textStyle("Display 72", { size: 72, fontWeight: 900, letterSpacing: -2.8, lineHeight: 72 });
-    k.textStyle("Display 60", { size: 60, fontWeight: 900, letterSpacing: -2.2, lineHeight: 62 });
-    k.textStyle("Display 42", { size: 42, fontWeight: 900, letterSpacing: -1.4, lineHeight: 44 });
-    k.textStyle("Lead 20", { size: 20, fontWeight: 400, lineHeight: 31 });
-    k.textStyle("Lead 17", { size: 17, fontWeight: 400, lineHeight: 26 });
-    k.textStyle("Ends 13", { ...MONO, size: 13, fontWeight: 700, letterSpacing: 1.2, lineHeight: 18 });
-    k.textStyle("Clock 44", { ...MONO, size: 44, fontWeight: 800, letterSpacing: -1, lineHeight: 48, fontFeatures: { tnum: 1 } });
-    k.textStyle("Clock 30", { ...MONO, size: 30, fontWeight: 800, lineHeight: 34, fontFeatures: { tnum: 1 } });
-    k.textStyle("Unit 12", { ...MONO, size: 12, fontWeight: 700, letterSpacing: 1.2, lineHeight: 16 });
-    k.textStyle("Note 15", { size: 15, fontWeight: 400, lineHeight: 22 });
-    k.textStyle("Section 40", { size: 40, fontWeight: 900, letterSpacing: -1.4, lineHeight: 44 });
-    k.textStyle("Section 30", { size: 30, fontWeight: 900, letterSpacing: -1, lineHeight: 34 });
-    k.textStyle("Section lead 17", { size: 17, fontWeight: 400, lineHeight: 26 });
-    k.textStyle("Body 15", { size: 15, fontWeight: 400, lineHeight: 23 });
-    k.textStyle("Include 14", { size: 14, fontWeight: 600, lineHeight: 20 });
-    k.textStyle("Asker 13", { ...MONO, size: 13, fontWeight: 700, lineHeight: 18 });
-    k.textStyle("Ask 18", { size: 18, fontWeight: 700, lineHeight: 26 });
-    k.textStyle("Answer 16", { size: 16, fontWeight: 400, lineHeight: 25 });
-    k.textStyle("Footer 14", { size: 14, fontWeight: 400, lineHeight: 20 });
-    k.textStyle("Live 13", { ...MONO, size: 13, fontWeight: 800, letterSpacing: 1.2, lineHeight: 16 });
-    k.textStyle("Watching 13", { ...MONO, size: 13, fontWeight: 700, lineHeight: 16, fontFeatures: { tnum: 1 } });
-    k.textStyle("Chat 14", { size: 14, fontWeight: 600, lineHeight: 18 });
-    k.textStyle("Chat who 12", { ...MONO, size: 12, fontWeight: 700, lineHeight: 18 });
-    k.textStyle("Lot 12", { ...MONO, size: 12, fontWeight: 700, letterSpacing: 0.6, lineHeight: 16 });
-    k.textStyle("Title 17", { size: 17, fontWeight: 800, letterSpacing: -0.3, lineHeight: 22 });
-    k.textStyle("Price 56", { size: 56, fontWeight: 900, letterSpacing: -2.6, lineHeight: 56, fontFeatures: { tnum: 1 } });
-    k.textStyle("Was 24", { size: 24, fontWeight: 700, letterSpacing: -0.6, lineHeight: 28 });
-    k.textStyle("Stock 12", { ...MONO, size: 12, fontWeight: 800, letterSpacing: 0.4, lineHeight: 16, fontFeatures: { tnum: 1 } });
-    k.textStyle("Chip 14", { ...MONO, size: 14, fontWeight: 800, lineHeight: 18 });
-    k.textStyle("Lot 13", { ...MONO, size: 13, fontWeight: 700, letterSpacing: 1, lineHeight: 18 });
-    k.textStyle("Title 24", { size: 24, fontWeight: 800, letterSpacing: -0.6, lineHeight: 30 });
-    k.textStyle("Price 64", { size: 64, fontWeight: 900, letterSpacing: -3, lineHeight: 66, fontFeatures: { tnum: 1 } });
-    k.textStyle("Stock 13", { ...MONO, size: 13, fontWeight: 800, letterSpacing: 0.4, lineHeight: 18, fontFeatures: { tnum: 1 } });
-    buttons(k, { style: "Button 16", pad: [14, 24], radius: 999 });
-    pill(k, "Marker", { fill: "accent", ink: "onAccent", style: "Eyebrow 14", label: "SINGLES\u2019 DAY \xB7 11.11", pad: [6, 14] });
-    pill(k, "Chip", { fill: "accent", ink: "onAccent", style: "Chip 14", label: "\u221262%", pad: [3, 8], radius: 6 });
-    const sheet = k.sheet;
-    page(k, sheet, { gap: 56, top: 24 });
-    k.timeline(sheet, { duration: LOOP, fps: 30 });
-    const offer = k.stack(sheet, { fill: "primary", radius: 999, padding: { top: 10, right: 20, bottom: 10, left: 20 }, align: "CENTER", name: "Offer bar" });
-    k.text(offer, `LIVE NOW \xB7 Singles\u2019 Day, 11.11 \xB7 Solo\u2019s first month is $${SALE.now} for the first ${SALE.seats} founders \xB7 ends ${SALE.closes}`, { style: "Bar 14", color: "onPrimary", name: "Offer bar text" });
-    nav(k, sheet, { links: ["The stream", "The lots", "The chat", "Sign in"], cta: "Grab a seat", style: "Nav 16", brandStyle: "Brand 20" });
-    const hero = k.stack(sheet, { direction: "HORIZONTAL", gap: 72, align: "CENTER", padding: { top: 8, right: 0, bottom: 16, left: 0 }, name: "Hero" });
-    const copy = k.stack(hero, { gap: 24, name: "Copy" });
-    k.instance(copy, "Marker", { Label: "SINGLES\u2019 DAY \xB7 11.11 \xB7 LIVE NOW" }, { name: "Eyebrow" });
-    k.text(copy, "A sale for the team of one.", { style: "Display 88", color: "text", name: "Headline" });
-    k.text(copy, `{{brand.name}} is the back office for a company of one: it chases your invoices, answers the support inbox and closes the month\u2019s books. For eleven hours the Solo plan\u2019s first month is $${SALE.now}, not $${SALE.was}, for the first ${SALE.seats} founders. Treat yourself. Nobody else is going to expense it.`, { style: "Lead 20", color: "onPaper", name: "Lead" });
-    const ends = k.stack(copy, { gap: 8, name: "Ends" });
-    k.text(ends, "THE FLASH DEAL ENDS IN", { style: "Ends 13", color: "onPaper", name: "Ends label" });
-    clock(k, ends, { style: "Clock 44", unit: "Unit 12", seconds: SALE.seconds - TICKS, gap: 10, pad: [12, 0], radius: 14, tile: 104 });
-    const cta = k.stack(copy, { direction: "HORIZONTAL", gap: 12, wrap: true, name: "CTAs" });
-    k.instance(cta, "Button", { Label: `Grab a seat for $${SALE.now}` }, { name: "CTA primary" });
-    k.instance(cta, "Button quiet", { Label: "See what it takes off your desk" }, { name: "CTA quiet" });
-    k.text(copy, `Then $${SALE.was} a month. No code to paste, no card until the eleven hours are up, and cancelling takes two clicks.`, { style: "Note 15", color: "onPaper", name: "Note" });
-    const visual = k.stack(hero, { width: W + BEZEL * 2, height: H + BEZEL * 2, name: "Visual" });
-    const phone = k.frame(visual, { x: 0, y: 0, width: W + BEZEL * 2, height: H + BEZEL * 2 }, { name: "Phone", fill: "night", radius: 36 + BEZEL, effects: lift(k, 1.4, 0.34) });
-    const stream = k.frame(phone, { x: BEZEL, y: BEZEL, width: W, height: H }, { name: "Stream" });
-    room(k, stream, ROOM);
-    reactions(k, stream, { w: 76, h: 300, n: 8, u: 0.6, loopMs: LOOP, from: 1800, absolute: { x: 392, y: 150 } });
-    const over = k.stack(stream, { width: W - 36, height: H - 36, justify: "SPACE_BETWEEN", absolute: { x: 18, y: 18 }, name: "Overlay" });
-    const bar = k.stack(over, { direction: "HORIZONTAL", gap: 8, align: "CENTER", name: "Stream bar" });
-    liveBadge(k, bar, { style: "Live 13", dot: 9, pad: [5, 12], loopMs: LOOP });
-    nightPill(k, bar, "1,111 watching", { style: "Watching 13", name: "Watching", pad: [5, 12] });
-    const under = k.stack(over, { gap: 8, name: "Stream foot" });
-    chat(k, under, "lena", "no team? sold.", { style: "Chat 14", whoStyle: "Chat who 12", face: "heart", dot: 20, pad: [6, 12], shadow: 0.3, name: "Chat 1" });
-    chat(k, under, "", "Seat 74 of 111 just went", { style: "Chat 14", whoStyle: "Chat who 12", face: "primary", dot: 20, pad: [6, 12], shadow: 0.3, system: true, name: "Chat 2" });
-    pinned(k, under, {
-      prefix: "Hero",
-      lot: "PINNED \xB7 LOT 01 \xB7 FLASH DEAL",
-      title: "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} left`,
-      styles: { lot: "Lot 12", title: "Title 17", price: "Price 56", was: "Was 24", stock: "Stock 12" },
-      pad: { top: 14, right: 16, bottom: 16, left: 16 },
-      gap: 8,
-      radius: 20,
-      bar: 12,
-      shadow: 0.5,
-      priceGap: 10
-    });
-    const band = k.stack(sheet, { fill: "primary", radius: 28, padding: { top: 48, right: 48, bottom: 52, left: 48 }, gap: 32, name: "Lots band" });
-    const title = k.stack(band, { gap: 8, name: "Lots head" });
-    k.text(title, "Three lots on the shelf. All of them elevens.", { style: "Section 40", color: "onPrimary", name: "Lots title" });
-    k.text(title, "Pick one. The price is already marked down, the bars are real, and the list price comes back when the stream ends.", { style: "Section lead 17", color: "onPrimary", name: "Lots lead" });
-    const lots = k.stack(band, { direction: "HORIZONTAL", gap: 24, name: "Lots" });
-    for (const l of LOTS) {
-      const card = pinned(k, lots, {
-        prefix: l.id,
-        name: "Lot card",
-        lot: l.tag,
-        title: l.title,
-        pitch: l.pitch,
-        price: money(l.now),
-        was: money(l.was),
-        chip: "Chip",
-        saving: l.now < 1e3 ? `\u2212${pct(l)}%` : "",
-        left: l.left,
-        total: l.total,
-        suffix: ` of ${l.total} left`,
-        stockLabel: l.label,
-        styles: { lot: "Lot 13", title: "Title 24", pitch: "Body 15", price: "Price 64", was: "Was 24", stock: "Stock 13" },
-        pad: { top: 26, right: 26, bottom: 26, left: 26 },
-        gap: 14,
-        radius: 24,
-        bar: 14,
-        shadow: 0.7,
-        priceGap: 12
-      });
-      const inc = k.stack(card, { gap: 8, padding: { top: 4, right: 0, bottom: 4, left: 0 }, name: "Includes" });
-      for (const line of l.includes) {
-        const row = k.stack(inc, { direction: "HORIZONTAL", gap: 10, align: "CENTER", name: "Include" });
-        k.ellipse(row, 8, "primary", { name: "Include dot" });
-        k.text(row, line, { style: "Include 14", color: "onCard", name: "Include text" });
-      }
-      k.instance(card, "Button", { Label: l.cta }, { name: "Lot button" });
-    }
-    const asked = k.stack(sheet, { direction: "HORIZONTAL", gap: 64, name: "Asked" });
-    const askedHead = k.stack(asked, { width: 380, gap: 12, name: "Asked head" });
-    k.text(askedHead, "The chat asked. The host answered.", { style: "Section 40", color: "text", name: "Asked title" });
-    k.text(askedHead, "The small print, read out loud. If yours is not here, the support inbox is answered by the product you are about to buy.", { style: "Section lead 17", color: "onPaper", name: "Asked lead" });
-    const date = k.stack(askedHead, { width: 380, height: 150, padding: { top: 16, right: 0, bottom: 0, left: 0 }, name: "Date" });
-    numerals(k, date, { h: 112, absolute: { x: 0, y: 24 }, depth: 12 });
-    const thread = k.stack(asked, { gap: 14, name: "Thread" });
-    for (const [who, face, q, a] of ASKED) {
-      const ask = k.stack(thread, { padding: { top: 0, right: 96, bottom: 0, left: 0 }, name: "Ask row" });
-      const bubble = k.stack(ask, { direction: "HORIZONTAL", gap: 12, align: "CENTER", fill: "card", radius: 22, padding: { top: 12, right: 20, bottom: 12, left: 14 }, effects: lift(k, 0.4, 0.16), name: "Ask" });
-      k.ellipse(bubble, 32, face, { name: "Ask face" });
-      const words = k.stack(bubble, { name: "Ask words" });
-      k.text(words, who, { style: "Asker 13", color: "cardMuted", name: "Asker" });
-      k.text(words, q, { style: "Ask 18", color: "onCard", name: "Question" });
-      const reply = k.stack(thread, { padding: { top: 0, right: 0, bottom: 6, left: 96 }, name: "Answer row" });
-      const said = k.stack(reply, { fill: "night", radius: 22, padding: { top: 14, right: 20, bottom: 16, left: 20 }, gap: 2, name: "Answer" });
-      k.text(said, "HOST", { style: "Asker 13", color: "nightMuted", name: "Host" });
-      k.text(said, a, { style: "Answer 16", color: "nightInk", name: "Answer text" });
-    }
-    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. The first month is $11 once per account; monthly and annual plans renew at the list price unless you cancel. Lifetime seats never renew.", { style: "Footer 14", color: "onPaper", name: "Legal" });
-    k.text(foot, "hello@{{brand.site}}", { style: "Footer 14", color: "onPaper", autoWidth: true, name: "Email" });
-    drain(k, sheet, { name: "Hero stock", from: (SALE.left + 26) / SALE.seats, to: SALE.left / SALE.seats, at: 1600, duration: 8e3 });
-    LOTS.forEach((l, i) => drain(k, sheet, { name: `${l.id} stock`, from: 1, to: l.left / l.total, at: 1800 + i * 200, duration: 3200 }));
-    k.counts(sheet, counts);
-    k.cues(sheet, cues);
-    webResponsive(k, sheet, {
-      stack: ["Hero", "Lots", "Asked", "Footer"],
-      restyle: { "Display 88": { laptop: "Display 72", tablet: "Display 60", mobile: "Display 42" }, "Lead 20": { mobile: "Lead 17" }, "Clock 44": { mobile: "Clock 30" }, "Section 40": { mobile: "Section 30" } },
-      gap: { mobile: 40 },
-      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, "Lots band")) kit.patch(n, { padding: { top: 40, right: 32, bottom: 44, left: 32 } });
-          for (const n of kit.named(id, "Lots")) kit.patch(n, { itemSpacing: 18 });
-          for (const n of kit.named(id, "Asked")) kit.patch(n, { itemSpacing: 48 });
-        }
-        const narrow = size === "tablet" || size === "mobile";
-        if (narrow) {
-          for (const n of kit.named(id, "Hero")) kit.patch(n, { itemSpacing: 40, counterAxisAlignItems: "CENTER" });
-          for (const n of kit.named(id, "Asked")) kit.patch(n, { itemSpacing: 28 });
-          for (const n of kit.named(id, "Asked head")) kit.patch(n, { layoutSizingHorizontal: "FILL" });
-        }
-        if (size === "mobile") {
-          for (const n of kit.named(id, "Offer bar")) kit.patch(n, { cornerRadius: 18 });
-          for (const n of kit.named(id, "Lots band")) kit.patch(n, { padding: { top: 28, right: 12, bottom: 28, left: 12 }, itemSpacing: 22, cornerRadius: 22 });
-          for (const n of kit.named(id, "Lot card")) kit.patch(n, { padding: { top: 22, right: 20, bottom: 22, left: 20 } });
-          for (const n of kit.named(id, "Ask row")) kit.patch(n, { padding: { top: 0, right: 24, bottom: 0, left: 0 } });
-          for (const n of kit.named(id, "Answer row")) kit.patch(n, { padding: { top: 0, right: 0, bottom: 6, left: 24 } });
-          for (const n of kit.named(id, "Clock tile")) kit.patch(n, { width: 88 });
-        }
-        const pw = W + BEZEL * 2, ph = H + BEZEL * 2, s = size === "mobile" ? 335 / pw : 1;
-        for (const box of kit.named(id, "Visual")) kit.patch(box, { layoutSizingHorizontal: "FIXED", width: Math.round(pw * s), height: Math.round(ph * s) });
-        for (const st of kit.named(id, "Phone")) kit.patch(st, { layoutPositioning: "ABSOLUTE", width: pw, height: ph, x: Math.round(-pw / 2 * (1 - s)), y: Math.round(-ph / 2 * (1 - s)), scaleX: s, scaleY: s });
-      }
-    });
-    return k.finish();
-  }
-});
-
-export {
-  singles_day_landing_default
-};

package/dist/chunks/chunk-4AT5HGDT.js

@@ -1,260 +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 {
-  TESSERA,
-  assemble,
-  avatarSlice,
-  bentoBrand,
-  calendarSlice,
-  cellBox,
-  chartSlice,
-  chatSlice,
-  drawChart,
-  fillWeek,
-  fitAvatars,
-  fitCalendar,
-  fitChart,
-  fitSwitch,
-  flip,
-  grot,
-  lockup,
-  nowDrift,
-  placeTiles,
-  radiusFor,
-  switchSlice,
-  tile,
-  tileLabel,
-  typeOut
-} from "./chunk-633CZYOG.js";
-import {
-  section
-} from "./chunk-7LZFBGFD.js";
-import {
-  captionSwap
-} from "./chunk-WO4SSPCC.js";
-import {
-  pill
-} from "./chunk-IL2F4BKM.js";
-import {
-  defineTemplate
-} from "./chunk-FC6VBE7Y.js";
-import {
-  Kit,
-  preset
-} from "./chunk-E3A22XSE.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-W5QYHNL2.js";
-
-// templates/src/motion/style-bento-launch-reel.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var S = section("edm", 0, 8);
-var { beat } = S;
-var NAME = "Bento SaaS launch reel";
-var DROP = beat(16);
-var END = beat(25);
-var TILES = ["Chat tile", "Stat tile", "Switch tile", "Week tile", "Team tile", "Chart tile"];
-var LAYOUT = {
-  // Words stay inside x 64–940 and above y 1440: the right column holds short labels, the bottom two rows only drawings.
-  story: {
-    grid: { x: 64, y: 520, w: 952, h: 1336, cols: 4, rows: 8, gap: 16 },
-    top: { x: 64, y: 250, w: 876 },
-    pad: 28,
-    caption: "Caption 64",
-    stat: "Stat 124",
-    reply: "Reply 42",
-    story: true,
-    cells: { "Chat tile": { c: 0, r: 0, cw: 3, rh: 4 }, "Switch tile": { c: 3, r: 0, cw: 1, rh: 2 }, "Team tile": { c: 3, r: 2, cw: 1, rh: 2 }, "Week tile": { c: 0, r: 4, cw: 2, rh: 4 }, "Stat tile": { c: 2, r: 4, cw: 2, rh: 2 }, "Chart tile": { c: 2, r: 6, cw: 2, rh: 2 } }
-  },
-  post: {
-    grid: { x: 48, y: 196, w: 984, h: 836, cols: 4, rows: 5, gap: 14 },
-    top: { x: 48, y: 44, w: 984 },
-    pad: 22,
-    caption: "Caption 52",
-    stat: "Stat 72",
-    reply: "Reply 28",
-    cells: { "Chat tile": { c: 0, r: 0, cw: 3, rh: 3 }, "Switch tile": { c: 3, r: 0, cw: 1, rh: 2 }, "Team tile": { c: 3, r: 2, cw: 1, rh: 1 }, "Week tile": { c: 0, r: 3, cw: 2, rh: 2 }, "Stat tile": { c: 2, r: 3, cw: 1, rh: 2 }, "Chart tile": { c: 3, r: 3, cw: 1, rh: 2 } }
-  },
-  portrait: {
-    grid: { x: 48, y: 204, w: 984, h: 1098, cols: 4, rows: 6, gap: 14 },
-    top: { x: 48, y: 52, w: 984 },
-    pad: 24,
-    caption: "Caption 56",
-    stat: "Stat 100",
-    reply: "Reply 34",
-    cells: { "Chat tile": { c: 0, r: 0, cw: 3, rh: 3 }, "Switch tile": { c: 3, r: 0, cw: 1, rh: 2 }, "Team tile": { c: 3, r: 2, cw: 1, rh: 1 }, "Week tile": { c: 0, r: 3, cw: 2, rh: 3 }, "Stat tile": { c: 2, r: 3, cw: 2, rh: 2 }, "Chart tile": { c: 2, r: 5, cw: 2, rh: 1 } }
-  },
-  // Landscape: the head in the top-left cell, the hero tall in the middle, every cell filled.
-  wide: {
-    grid: { x: 96, y: 64, w: 1728, h: 952, cols: 6, rows: 4, gap: 18 },
-    top: { x: 96, y: 72, w: 564 },
-    pad: 28,
-    caption: "Caption 56",
-    stat: "Stat 84",
-    reply: "Reply 38",
-    cells: { "Chat tile": { c: 2, r: 0, cw: 2, rh: 3 }, "Switch tile": { c: 4, r: 0, cw: 1, rh: 1 }, "Team tile": { c: 5, r: 0, cw: 1, rh: 1 }, "Week tile": { c: 0, r: 1, cw: 2, rh: 3 }, "Stat tile": { c: 2, r: 3, cw: 2, rh: 1 }, "Chart tile": { c: 4, r: 1, cw: 2, rh: 3 } }
-  }
-};
-var LABEL = 30;
-var DAYS = 26;
-var GAP = 14;
-var cues = [
-  assemble(TILES, 120, 90),
-  typeOut("Reply", beat(3), beat(9)),
-  { layer: "Chip", preset: "pop-in", at: beat(12), stagger: { delay: 140, order: "selection" }, params: { duration: 500, amount: 0.7 } },
-  { layer: "Face", preset: "slide-in", at: beat(6), stagger: { delay: 90, order: "selection" }, params: { direction: "left", duration: 450 } },
-  { layer: [...TILES], preset: "pulse", at: DROP, stagger: { delay: 40, order: "selection" }, params: { duration: 600, amount: 0.025 } },
-  { layer: "Chip", preset: "pulse", at: beat(20), stagger: { delay: 90, order: "selection" }, params: { duration: 400, amount: 0.06 } },
-  { layer: "Face", preset: "pulse", at: beat(18), stagger: { delay: 70, order: "selection" }, params: { duration: 400, amount: 0.08 } },
-  { layer: "Call row", preset: "rise-in", at: END, params: { duration: 700, distance: 40 } },
-  // The last bars keep moving: the figure, the chips and the call each answer a beat in turn.
-  { layer: "Stat tile", preset: "pulse", at: beat(26), params: { duration: 600, amount: 0.03 } },
-  { layer: "Chip", preset: "pulse", at: beat(28), stagger: { delay: 90, order: "selection" }, params: { duration: 400, amount: 0.06 } },
-  { layer: "Call", preset: "pulse", at: beat(30), params: { duration: 800, amount: 0.06 } }
-];
-var counts = [
-  { layer: "Stat figure", at: DROP, duration: beat(3), counter: { from: 0, to: TESSERA.saved, decimals: 1, suffix: " h" } },
-  { layer: "Team figure", at: beat(6), duration: beat(4), tick: 75, counter: { from: 0, to: 12 } }
-];
-var swaps = [captionSwap([
-  "Your week, planned before Monday.",
-  "Ask once. Tessera books it.",
-  "Follow-ups drafted while you talk.",
-  "6.5 hours back every week.",
-  "Your whole team, in sync.",
-  "Tessera 2.0 is out today."
-], 0, S.duration - 30, { stagger: 50, in: 240, out: 160, rise: 20 })];
-var style_bento_launch_reel_default = defineTemplate({
-  id: "motion-saas-style-bento-launch-reel",
-  meta: {
-    name: NAME,
-    description: "A 15-second launch video in the bento grid look for an AI workspace: rounded tiles assemble into an uneven grid, then each runs live \u2014 a reply streams into the night hero tile, a week fills with blocks under a drifting now line, a switch flips on, a team stacks up and a focus line draws itself. On the drop every tile swells and the figure counts to 6.5 hours back, and the call to start free rises at the foot of the hero tile. One lime accent, captions as the headline, music cut on the beat. 9:16 with square, 4:5 and 16:9 layouts",
-    category: "animation",
-    tags: ["animation", "saas", "bento", "bento grid", "dashboard", "tiles", "ai", "productivity", "workspace", "launch", "reel", "counter", "chart", "captions", "music", "audio", "tiktok", "shorts"],
-    platforms: ["tiktok", "instagram", "youtube", "x", "linkedin"],
-    formats: ["reel", "short", "story", "post", "portrait-post", "video"],
-    useCases: ["launch", "announcement"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  motion: { cues, counts, swaps },
-  build() {
-    const k = new Kit(NAME, preset("ig-story"));
-    k.quantizeGeometry = true;
-    bentoBrand(k);
-    grot(k, "Brand 34", 34, { weight: 700, lead: 1.1, spacing: -0.02 });
-    grot(k, "Site 24", 24, { weight: 500, lead: 1.3 });
-    for (const [n, sz] of [["Caption 64", 64], ["Caption 56", 56], ["Caption 52", 52]]) grot(k, n, sz, { weight: 700, lead: 1.06, spacing: -0.035 });
-    grot(k, "Label 22", 22, { weight: 500, lead: 1.3 });
-    grot(k, "Ask 24", 24, { weight: 600, lead: 1.3 });
-    for (const [n, sz] of [["Reply 42", 42], ["Reply 38", 38], ["Reply 34", 34], ["Reply 28", 28]]) grot(k, n, sz, { weight: 500, lead: 1.3, spacing: -0.01 });
-    grot(k, "Chip 20", 20, { weight: 600, lead: 1.2 });
-    grot(k, "Day 20", 20, { weight: 600, lead: 1.3 });
-    for (const [n, sz] of [["Stat 124", 124], ["Stat 100", 100], ["Stat 84", 84], ["Stat 72", 72]]) grot(k, n, sz, { weight: 700, lead: 1, spacing: -0.05 });
-    grot(k, "Figure 60", 60, { weight: 700, lead: 1, spacing: -0.04 });
-    grot(k, "Button 26", 26, { weight: 700, lead: 1.2 });
-    pill(k, "Call", { fill: "primary", ink: "onPrimary", style: "Button 26", label: "Start free", pad: [18, 30] });
-    const sheet = k.sheet;
-    k.nameSheet(sheet, "Launch reel");
-    k.flowSheet(sheet, 0, 0, "paper", "MIN", "MIN");
-    k.patch(sheet, { clipsContent: true });
-    k.timeline(sheet, { duration: S.duration, fps: 30, audio: S.audio });
-    const L = LAYOUT.story, g = L.grid;
-    const strip = k.frame(sheet, { x: g.x, y: 64, width: g.w, height: 150 }, { name: "Top strip" });
-    ["sky", "mint", "sand", "rose"].forEach((role, i) => {
-      const w = (g.w - g.gap * 3) / 4;
-      k.rect(strip, Math.round(w), 150, role, { radius: radiusFor(g.gap), name: "Strip tile", absolute: { x: Math.round(i * (w + g.gap)), y: 0 } });
-    });
-    const top = k.stack(sheet, { width: L.top.w, gap: 22, name: "Top", absolute: { x: L.top.x, y: L.top.y } });
-    const bar = k.stack(top, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Brand row" });
-    lockup(k, bar, { size: 40, style: "Brand 34" });
-    k.text(bar, "{{brand.site}}", { style: "Site 24", color: "onPaper", autoWidth: true, name: "Site" });
-    k.text(top, swaps[0].words[0], { style: L.caption, color: "text", width: "FILL", name: "Caption" });
-    const chatT = tile(k, sheet, g, L.cells["Chat tile"], { name: "Chat tile", surface: "night", pad: L.pad, justify: "SPACE_BETWEEN", gap: 22 });
-    const chatTop = k.stack(chatT, { gap: 22, name: "Chat body" });
-    tileLabel(k, chatTop, `${TESSERA.name} ${TESSERA.version}`, { style: "Label 22", surface: "night", size: 22, right: TESSERA.feature, name: "Chat label" });
-    chatSlice(k, chatTop, { prompt: TESSERA.prompt, reply: TESSERA.reply, chips: [`${TESSERA.focus} focus blocks`, `${TESSERA.followUps} follow-ups`, "1:1 moved to Fri"], ask: "Ask 24", body: L.reply, chip: "Chip 20" });
-    const callRow = k.stack(chatT, { direction: "HORIZONTAL", gap: 20, align: "CENTER", name: "Call row" });
-    k.instance(callRow, "Call", { Label: "Start free" }, { name: "Call" });
-    k.text(callRow, TESSERA.trial, { style: "Label 22", color: "nightMuted", width: "FILL", name: "Call line" });
-    const swT = tile(k, sheet, g, L.cells["Switch tile"], { name: "Switch tile", surface: "mint", pad: L.pad });
-    tileLabel(k, swT, TESSERA.feature, { style: "Label 22", surface: "mint", size: 22 });
-    switchSlice(k, swT, { w: 150, ink: "onMint" });
-    k.text(swT, "Team-wide", { style: "Label 22", color: "onMint", autoWidth: true, name: "Switch state" });
-    const teamT = tile(k, sheet, g, L.cells["Team tile"], { name: "Team tile", surface: "sand", pad: L.pad });
-    tileLabel(k, teamT, "In sync", { style: "Label 22", surface: "sand", size: 22 });
-    k.text(teamT, "12", { style: "Figure 60", color: "onSand", width: 120, name: "Team figure" });
-    avatarSlice(k, teamT, { d: 64, n: 4, ring: "sand", overlap: 0.38 });
-    const weekT = tile(k, sheet, g, L.cells["Week tile"], { name: "Week tile", surface: "card", pad: L.pad, justify: "MIN", gap: GAP });
-    tileLabel(k, weekT, "This week", { style: "Label 22", surface: "card", size: 22, right: `${TESSERA.focus} focus` });
-    calendarSlice(k, weekT, { w: 100, h: 100, day: "Day 20", ink: "onCard" });
-    const statT = tile(k, sheet, g, L.cells["Stat tile"], { name: "Stat tile", surface: "primary", pad: L.pad, justify: "MIN", gap: 10 });
-    tileLabel(k, statT, "Back each week", { style: "Label 22", surface: "primary", size: 22 });
-    const statBody = k.stack(statT, { gap: 6, name: "Stat body" });
-    k.text(statBody, `${TESSERA.saved} h`, { style: L.stat, color: "onPrimary", width: "FILL", name: "Stat figure" });
-    k.text(statBody, `per person, across ${TESSERA.teams} teams`, { style: "Label 22", color: "onPrimary", width: "FILL", name: "Stat line" });
-    const chartT = tile(k, sheet, g, L.cells["Chart tile"], { name: "Chart tile", surface: "sky", pad: L.pad, justify: "SPACE_BETWEEN" });
-    tileLabel(k, chartT, "Focus hours", { style: "Label 22", surface: "sky", size: 22, right: "12 wk", name: "Chart label" });
-    chartSlice(k, chartT, { w: 100, h: 100, ink: "onSky", weight: 6 });
-    const fit = (kit, root, l) => {
-      placeTiles(kit, root, l.grid, l.cells, { pad: l.pad });
-      for (const id of kit.named(root, "Top")) kit.patch(id, { x: l.top.x, y: l.top.y, width: l.top.w });
-      for (const id of kit.named(root, "Caption")) kit.restyle(id, l.caption);
-      for (const id of kit.named(root, "Stat figure")) kit.restyle(id, l.stat);
-      for (const id of kit.named(root, "Reply")) kit.restyle(id, l.reply);
-      for (const id of kit.named(root, "Chart label")) kit.patch(id, { visible: !l.story });
-      for (const id of kit.named(root, "Stat tile")) kit.patch(id, { primaryAxisAlignItems: l.story ? "MIN" : "SPACE_BETWEEN" });
-      const box = (n) => cellBox(l.grid, l.cells[n]);
-      const w = box("Week tile");
-      fitCalendar(kit, root, w.w - 2 * l.pad, w.h - 2 * l.pad - LABEL - DAYS - 12 - 2 * GAP);
-      const ch = box("Chart tile"), cw = ch.w - 2 * l.pad;
-      fitChart(kit, root, cw, Math.min(ch.h - 2 * l.pad - (l.story ? 0 : LABEL + GAP), Math.round(cw * 0.9)));
-      const st = box("Stat tile"), sIn = st.w - 2 * l.pad;
-      for (const id of kit.named(root, "Stat figure")) kit.patch(id, { width: Math.min(sIn, 340), layoutSizingHorizontal: "FIXED" });
-      for (const id of kit.named(root, "Stat line")) kit.patch(id, { width: Math.min(sIn, 360), layoutSizingHorizontal: "FIXED" });
-      const sw = box("Switch tile"), tm = box("Team tile");
-      fitSwitch(kit, root, Math.min(150, sw.w - 2 * l.pad, Math.round((sw.h - 2 * l.pad - LABEL - GAP) / 0.56)));
-      fitAvatars(kit, root, Math.min(64, tm.h - 2 * l.pad - LABEL - GAP));
-    };
-    fit(k, sheet, L);
-    k.counts(sheet, counts);
-    k.swaps(sheet, swaps);
-    k.cues(sheet, cues);
-    fillWeek(k, sheet, beat(5), 100);
-    drawChart(k, sheet, beat(8), beat(7));
-    flip(k, sheet, [beat(4), beat(20), beat(22)]);
-    nowDrift(k, sheet, beat(5), S.duration);
-    const hide = (kit, id, names) => {
-      for (const n of names) for (const x of kit.named(id, n)) kit.patch(x, { visible: false });
-    };
-    k.variants(sheet, [
-      { preset: "ig-post", adjust: (kit, id) => {
-        fit(kit, id, LAYOUT.post);
-        hide(kit, id, ["Top strip"]);
-        for (const c of kit.named(id, "Chart label")) hide(kit, c, ["Label right"]);
-        hide(kit, id, ["Team figure"]);
-      } },
-      { preset: "ig-portrait", adjust: (kit, id) => {
-        fit(kit, id, LAYOUT.portrait);
-        hide(kit, id, ["Top strip"]);
-        hide(kit, id, ["Team figure"]);
-      } },
-      { preset: "video-1080p", adjust: (kit, id) => {
-        fit(kit, id, LAYOUT.wide);
-        hide(kit, id, ["Top strip"]);
-        hide(kit, id, ["Team figure", "Switch state"]);
-      } }
-    ]);
-    k.setCover(sheet);
-    return k.finish();
-  }
-});
-
-export {
-  style_bento_launch_reel_default
-};