@popcraft/kit 0.24.3 → 0.26.0

package/dist/chunks/chunk-FOHHZR6N.js

@@ -0,0 +1,257 @@
+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 {
+  cased,
+  st
+} from "./chunk-ZJZ6HKBP.js";
+import {
+  disc,
+  shape,
+  sway,
+  turn
+} from "./chunk-EB663FLR.js";
+import {
+  burstPath
+} from "./chunk-YNOCYFZ4.js";
+import {
+  SERIF
+} from "./chunk-X23ZWFW2.js";
+import {
+  bloom,
+  glow,
+  grain,
+  hardShadow
+} from "./chunk-HVK5T4I5.js";
+import {
+  box,
+  curve3,
+  line,
+  poly,
+  pt3,
+  rng
+} from "./chunk-BNVLVZUT.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/themes/festival-presale-food-kit.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var W = 3e3;
+var mover = (k, still) => (id, path, amp, cycles = 1, phase = 0) => {
+  if (!still) sway(k, id, path, amp, cycles, phase);
+};
+function wall(k, f, still) {
+  const move = mover(k, still);
+  const planks = [], grainLines = [], knots = [];
+  const r = rng(17);
+  for (let x = 0; x <= W; x += 96) planks.push(line(x, 0, x, 3e3));
+  for (let i = 0; i < 160; i++) {
+    const x = Math.floor(r() * 31) * 96 + 14 + r() * 60, y = r() * 2900, len = 90 + r() * 200;
+    grainLines.push(curve3([{ x, y }, { x: x + 6, y: y + len * 0.5 }, { x: x - 2, y: y + len }], 0.3));
+    if (i % 5 === 0) knots.push(disc(x + 10, y + len * 0.4, 7, 12));
+  }
+  shape(k, f, grainLines, "kraft", { name: "Wood grain", strokeWidth: 3, opacity: 0.9 });
+  shape(k, f, knots, "crust", { name: "Knots", opacity: 0.35 });
+  shape(k, f, planks, "crateDark", { name: "Plank seams", strokeWidth: 3, opacity: 0.32 });
+  const warm = glow(k, f, { x: 1500, y: 800, w: 3400, h: 1300, role: "bulb", alpha: 0.35, name: "Bulb light" });
+  move(warm, "opacity", 0.12, 2);
+  glow(k, f, { x: 1500, y: 2700, w: 3600, h: 900, role: "ink", alpha: 0.18, name: "Table shade" });
+  k.patch(f, { effects: grain(0.07, 2, 23) });
+}
+function awning(k, f, still) {
+  const move = mover(k, still);
+  const sw = 110, drop = 200, scallop = 60;
+  const stripe = (x) => ({ closed: true, points: [pt3(x, -10), pt3(x + sw, -10), { ...pt3(x + sw, drop), handleOut: pt3(x + sw, drop + scallop) }, { ...pt3(x, drop), handleIn: pt3(x, drop + scallop) }] });
+  const red = [], cream = [];
+  for (let i = 0, x = 0; x < W; i++, x += sw) (i % 2 ? cream : red).push(stripe(x));
+  k.rect(f, W, 70, [k.gradient({ from: "ink", to: "ink", fromOpacity: 0.3, toOpacity: 0, angle: 90 })], { name: "Awning shade", absolute: { x: 0, y: drop + 10 } });
+  for (const [paths, role] of [[cream, "awningCream"], [red, "awningRed"]]) for (const half of [0, 1]) {
+    const id = shape(k, f, paths.filter((p) => (p.points[0].x < W / 2 ? 0 : 1) === half), role, { name: "Awning stripes", effects: [hardShadow(k, "ink", 0, 6, 0.28)] });
+    move(id, "translateY", 2.5, 2, role === "awningRed" ? 0 : 0.12);
+  }
+  shape(k, f, [box(0, 0, W, 26)], "wine", { name: "Awning rail" });
+  const folds = [];
+  for (let x = sw; x < W; x += sw) folds.push(line(x, 26, x, drop));
+  shape(k, f, folds, "ink", { name: "Awning folds", strokeWidth: 2, opacity: 0.15 });
+  const at = (t) => ({ x: W * t, y: 262 + 44 * Math.sin(t * Math.PI * 6 - Math.PI / 2) * 0.5 + 22 });
+  shape(k, f, [curve3(Array.from({ length: 61 }, (_, i) => at(i / 60)), 0.2)], "ink", { name: "Bulb wire", strokeWidth: 3 });
+  for (let g = 0; g < 3; g++) {
+    const bulbs = [], caps = [];
+    for (let i = g; i < 40; i += 3) {
+      const p = at((i + 0.5) / 40);
+      bulbs.push(disc(p.x, p.y + 16, 10, 13));
+      caps.push(box(p.x - 5, p.y, 10, 7));
+    }
+    shape(k, f, caps, "ink", { name: "Bulb caps" });
+    const id = shape(k, f, bulbs, "bulb", { name: "Bulbs", effects: [bloom(k, "bulb", 22, 0.95)] });
+    k.patch(id, { opacity: 0.72 });
+    move(id, "opacity", 0.28, 2 + g, g / 3);
+  }
+}
+function table(k, f, still) {
+  const move = mover(k, still);
+  const T = 200, S = 1.3;
+  const X = (x) => 900 + x * S;
+  const bottle = (x, h, w, glass2, label) => {
+    shape(k, f, [poly([[x - w / 2, T], [x - w / 2, T - h * 0.56], [x - w * 0.17, T - h * 0.74], [x - w * 0.17, T - h], [x + w * 0.17, T - h], [x + w * 0.17, T - h * 0.74], [x + w / 2, T - h * 0.56], [x + w / 2, T]])], glass2, { name: "Bottle" });
+    shape(k, f, [box(x - w / 2, T - h * 0.46, w, h * 0.28)], label, { name: "Bottle label" });
+    shape(k, f, [line(x - w * 0.36, T - h * 0.42, x + w * 0.36, T - h * 0.42), line(x - w * 0.36, T - h * 0.22, x + w * 0.36, T - h * 0.22)], "wine", { name: "Label rules", strokeWidth: 2, opacity: 0.6 });
+    shape(k, f, [box(x - w * 0.17, T - h, w * 0.34, h * 0.1)], "wine", { name: "Capsule" });
+    shape(k, f, [line(x - w * 0.3, T - h * 0.52, x - w * 0.3, T - 10)], "label", { name: "Bottle shine", strokeWidth: 4, opacity: 0.28 });
+  };
+  const glass = (x, s, role) => {
+    const bowl = { closed: true, points: [pt3(x - 22 * s, T - 96 * s), pt3(x + 22 * s, T - 96 * s), { ...pt3(x + 4 * s, T - 46 * s), handleIn: pt3(x + 26 * s, T - 58 * s) }, pt3(x - 4 * s, T - 46 * s), { ...pt3(x - 22 * s, T - 96 * s), handleIn: pt3(x - 26 * s, T - 58 * s) }] };
+    shape(k, f, [{ closed: true, points: [pt3(x - 24 * s, T - 78 * s), pt3(x + 24 * s, T - 78 * s), { ...pt3(x + 4 * s, T - 46 * s), handleIn: pt3(x + 24 * s, T - 56 * s) }, pt3(x - 4 * s, T - 46 * s), { ...pt3(x - 24 * s, T - 78 * s), handleIn: pt3(x - 24 * s, T - 56 * s) }] }], role, { name: "Wine" });
+    shape(k, f, [bowl, line(x, T - 46 * s, x, T - 4), line(x - 18 * s, T - 2, x + 18 * s, T - 2)], "ink", { name: "Glass", strokeWidth: 3 });
+    shape(k, f, [line(x - 12 * s, T - 90 * s, x - 15 * s, T - 70 * s)], "label", { name: "Glass shine", strokeWidth: 3, opacity: 0.7 });
+  };
+  const crate = (x, y, w, h) => {
+    shape(k, f, [box(x, y, w, h)], "crate", { name: "Crate front" });
+    shape(k, f, [line(x, y + h * 0.33, x + w, y + h * 0.33), line(x, y + h * 0.66, x + w, y + h * 0.66), line(x + w * 0.17, y, x + w * 0.17, y + h), line(x + w * 0.83, y, x + w * 0.83, y + h)], "crateDark", { name: "Crate slats", strokeWidth: 4 });
+  };
+  const stripesV = [], stripesH = [];
+  for (let x = 0; x < W; x += 56) stripesV.push(box(x, T + 18, 28, 200));
+  for (let y = T + 18; y < 400; y += 56) stripesH.push(box(0, y, W, 28));
+  shape(k, f, [box(0, T + 18, W, 200)], "awningCream", { name: "Cloth" });
+  shape(k, f, stripesV, "awningRed", { name: "Gingham", opacity: 0.42 });
+  shape(k, f, stripesH, "awningRed", { name: "Gingham", opacity: 0.42 });
+  shape(k, f, [box(0, T, W, 20)], "crateDark", { name: "Table top" });
+  k.rect(f, W, 40, [k.gradient({ from: "ink", to: "ink", fromOpacity: 0.25, toOpacity: 0, angle: 90 })], { name: "Cloth shade", absolute: { x: 0, y: T + 18 } });
+  shape(k, f, [{ closed: true, points: [pt3(620, T), { ...pt3(610, T - 110), handleIn: pt3(596, T - 40), handleOut: pt3(596, T - 150) }, pt3(620, T - 220), pt3(800, T - 220), { ...pt3(810, T - 110), handleIn: pt3(824, T - 150), handleOut: pt3(824, T - 40) }, pt3(800, T)] }], "crate", { name: "Barrel" });
+  shape(k, f, [line(604, T - 60, 816, T - 60), line(604, T - 160, 816, T - 160)], "ink", { name: "Barrel hoops", strokeWidth: 8 });
+  shape(k, f, [box(696, T - 112, 30, 16), box(712, T - 100, 10, 26)], "mustard", { name: "Tap" });
+  for (let i = 0; i < 3; i++) shape(k, f, [disc(450, T - 22 - i * 40, 64, 20)], i === 1 ? "cheeseTop" : "cheese", { name: "Cheese wheels" });
+  bottle(X(64), 168 * S, 40 * S, "bottle", "label");
+  bottle(X(120), 150 * S, 40 * S, "wine", "mustard");
+  bottle(X(176), 172 * S, 40 * S, "bottle", "label");
+  crate(X(28), T - 74 * S, 190 * S, 74 * S);
+  shape(k, f, [{ closed: true, points: [pt3(X(250), T - 8), pt3(X(250), T - 52 * S), { ...pt3(X(330), T - 70 * S), handleIn: pt3(X(262), T - 72 * S), handleOut: pt3(X(398), T - 72 * S) }, pt3(X(410), T - 52 * S), pt3(X(410), T - 8), { ...pt3(X(330), T + 2), handleIn: pt3(X(390), T + 2), handleOut: pt3(X(270), T + 2) }] }], "cheese", { name: "Cheese" });
+  shape(k, f, [disc(X(330), T - 52 * S, 80 * S, 18 * S)], "cheeseTop", { name: "Cheese top" });
+  shape(k, f, [disc(X(296), T - 26 * S, 7 * S, 5 * S), disc(X(350), T - 18 * S, 9 * S, 6 * S), disc(X(384), T - 30 * S, 5 * S, 4 * S), disc(X(322), T - 54 * S, 8 * S, 3 * S)], "crust", { name: "Cheese holes", opacity: 0.6 });
+  const grapes = [];
+  [[0, 0], [22, 0], [44, 0], [66, 0], [11, 18], [33, 18], [55, 18], [22, 36], [44, 36], [33, 54]].forEach(([dx, dy]) => grapes.push(disc(X(432 + dx), T - (64 - dy) * S, 12 * S)));
+  shape(k, f, grapes, "grape", { name: "Grapes" });
+  shape(k, f, grapes.slice(0, 7).map((g) => disc(g.points[0].x - 4, g.points[1].y - 6, 3.5)), "label", { name: "Grape shine", opacity: 0.5 });
+  shape(k, f, [{ closed: true, points: [pt3(X(462), T - 78 * S), { ...pt3(X(498), T - 104 * S), handleIn: pt3(X(470), T - 104 * S) }, { ...pt3(X(520), T - 74 * S), handleIn: pt3(X(522), T - 100 * S) }, { ...pt3(X(480), T - 66 * S), handleIn: pt3(X(506), T - 60 * S) }] }], "leaf", { name: "Vine leaf" });
+  glass(X(566), S, "wine");
+  glass(X(630), 0.86 * S, "mustard");
+  shape(k, f, [disc(X(730), T - 26 * S, 70 * S, 28 * S)], "crust", { name: "Loaf" });
+  shape(k, f, [line(X(690), T - 40 * S, X(706), T - 20 * S), line(X(720), T - 46 * S, X(736), T - 24 * S), line(X(752), T - 44 * S, X(768), T - 24 * S)], "label", { name: "Loaf cuts", strokeWidth: 5, opacity: 0.8 });
+  bottle(X(822), 132 * S, 30 * S, "oil", "label");
+  shape(k, f, [{ closed: true, points: [pt3(X(868), T - 72 * S), pt3(X(1004), T - 72 * S), { ...pt3(X(990), T), handleIn: pt3(X(1004), T - 14 * S) }, { ...pt3(X(882), T), handleOut: pt3(X(868), T - 14 * S) }] }], "pot", { name: "Pot" });
+  shape(k, f, [box(X(860), T - 80 * S, 152 * S, 12 * S), box(X(846), T - 58 * S, 22 * S, 10 * S), box(X(1004), T - 58 * S, 22 * S, 10 * S)], "ink", { name: "Pot rim" });
+  for (let i = 0; i < 3; i++) {
+    const x = X(902 + i * 34);
+    const wisp = shape(k, f, [curve3([{ x, y: T - 92 * S }, { x: x - 12, y: T - 118 * S }, { x: x + 10, y: T - 140 * S }, { x: x - 7, y: T - 162 * S }, { x: x + 5, y: T - 180 * S }], 0.3)], "steam", { name: "Steam", strokeWidth: 8, opacity: 0.6 });
+    move(wisp, "translateY", 10, 2, i / 3);
+    move(wisp, "opacity", 0.35, 2, i / 3 + 0.25);
+    move(wisp, "translateX", 6, 1, i / 3);
+  }
+  const r = rng(4), lemons = [], toms = [];
+  for (let i = 0; i < 9; i++) (i % 2 ? toms : lemons).push(disc(X(1056 + i * 15) + r() * 6, T - (58 + i % 3 * 9) * S, 15 * S, (i % 2 ? 15 : 12) * S));
+  shape(k, f, lemons, "mustard", { name: "Lemons" });
+  shape(k, f, toms, "tomato", { name: "Tomatoes" });
+  crate(X(1040), T - 44 * S, 150 * S, 44 * S);
+  shape(k, f, [poly([[2160, T], [2140, T - 90], [2380, T - 90], [2360, T]])], "crust", { name: "Basket" });
+  const weave = [];
+  for (let x = 2150; x < 2380; x += 22) weave.push(line(x, T - 88, x + 8, T - 2));
+  shape(k, f, weave, "crateDark", { name: "Basket weave", strokeWidth: 3, opacity: 0.7 });
+  shape(k, f, [disc(2200, T - 104, 50, 22), disc(2300, T - 112, 56, 24), disc(2252, T - 128, 44, 20)], "cheese", { name: "Loaves" });
+  shape(k, f, [box(2410, T - 110, 60, 110)], "pot", { name: "Jar", opacity: 0.8 });
+  shape(k, f, [line(2425, T - 100, 2412, T - 230), line(2440, T - 100, 2446, T - 260), line(2455, T - 100, 2480, T - 210)], "leaf", { name: "Stems", strokeWidth: 5 });
+  const heads = shape(k, f, [disc(2412, T - 236, 22), disc(2446, T - 266, 24), disc(2480, T - 216, 20)], "mustard", { name: "Sunflowers", stroke: { color: "crust", width: 6 } });
+  move(heads, "rotation", 2, 1);
+  bottle(170, 210, 52, "wine", "label");
+  bottle(240, 230, 52, "bottle", "mustard");
+  bottle(310, 200, 52, "wine", "label");
+  bottle(380, 225, 52, "bottle", "label");
+  crate(130, T - 96, 290, 96);
+  glass(2640, 1.4, "wine");
+  glass(2720, 1.2, "wine");
+  shape(k, f, [disc(2850, T - 60, 74, 60)], "leaf", { name: "Melon" });
+  shape(k, f, [curve3([{ x: 2790, y: T - 80 }, { x: 2850, y: T - 118 }, { x: 2910, y: T - 80 }], 0.3), curve3([{ x: 2786, y: T - 40 }, { x: 2850, y: T - 70 }, { x: 2914, y: T - 40 }], 0.3)], "oil", { name: "Melon stripes", strokeWidth: 6, opacity: 0.7 });
+  for (let i = 0; i < 5; i++) shape(k, f, [disc(2520, T - 8 - i * 12, 62, 9)], i % 2 ? "label" : "awningCream", { name: "Plates", stroke: { color: "crateDark", width: 2 } });
+}
+function seal(k, parent, o) {
+  const s = o.size;
+  const id = k.stack(parent, { width: s, height: s, align: "CENTER", justify: "CENTER", gap: 0, name: o.name, ...o.absolute ? { absolute: o.absolute } : {} });
+  const burst = k.vector(id, s, s, [burstPath(s, 20, 0.1)], "accent", { name: `${o.name} burst`, absolute: { x: 0, y: 0 }, effects: [hardShadow(k, "ink", 3, 4, 0.55)] });
+  k.vector(id, s * 0.78, s * 0.78, [disc(s * 0.39, s * 0.39, s * 0.37)], "accent", { name: `${o.name} ring`, stroke: { color: "onAccent", width: 1.5 }, absolute: { x: s * 0.11, y: s * 0.11 } });
+  if (!o.still) turn(k, burst, 1 / 20);
+  const size = Math.max(16, Math.round(s * 0.13));
+  k.text(id, cased(FOOD, "Sticker", `${o.lines[0]}
+${o.lines[1]}`), { style: st(k, FOOD, "Sticker", size, "CENTER"), color: "onAccent", align: "CENTER", name: `${o.name} words` });
+  return id;
+}
+var FOOD = {
+  slug: "food",
+  name: "Salt & Vine",
+  brand: (k) => {
+    k.brand(
+      { paper: "#F7F0E1", text: "#2A1D16", onPaper: "#5F4E42", primary: "#7A1F2B", onPrimary: "#FBF3E2", accent: "#D8A33B", onAccent: "#2A1D16", card: "#FFFBF0", onCard: "#2A1D16", cardMuted: "#5F4E42", panel: "#2F3A1D", onPanel: "#F7F0E1", panelMuted: "#D2D6BC", chip: "#EDE2C8", onChip: "#2A1D16", stage: "#EFDFBB", onStage: "#2A1D16", stageMuted: "#5F4E42" },
+      { name: "Salt & Vine" }
+    );
+    k.palette({ ink: "#2A1D16", kraft: "#E4D1A6", awningRed: "#B8322A", awningCream: "#FFF6E0", bulb: "#FFD66B", wine: "#7A1F2B", bottle: "#2F4A2C", oil: "#8E8A2A", mustard: "#D8A33B", label: "#FFFBF0", cheese: "#E8B24A", cheeseTop: "#F3CB6C", crust: "#B97A3C", grape: "#5B2A5E", leaf: "#4E6B2A", tomato: "#D6452E", crate: "#C19A62", crateDark: "#8B633A", pot: "#34506B", steam: "#FFFFFF" });
+  },
+  type: {
+    Name: { ...SERIF, fontWeight: 800, ls: -0.035, lh: 0.96 },
+    Head: { ...SERIF, fontWeight: 800, ls: -0.025, lh: 1.04 },
+    Act: { ...SERIF, fontWeight: 500, ls: 0, lh: 1.35 },
+    More: { fontWeight: 700, ls: 0.1, lh: 1.6, upper: true },
+    Kicker: { fontWeight: 700, ls: 0.2, lh: 1.4, upper: true },
+    Clock: { ...SERIF, fontWeight: 800, ls: -0.025, lh: 1.04, tnum: true },
+    Unit: { fontWeight: 700, ls: 0.16, lh: 1.3, upper: true },
+    Body: { fontWeight: 400, ls: 0, lh: 1.45 },
+    Button: { fontWeight: 700, ls: 0.01, lh: 1.3 },
+    Caption: { ...SERIF, fontWeight: 700, ls: -0.01, lh: 1.2 },
+    Price: { ...SERIF, fontWeight: 800, ls: -0.03, lh: 1, tnum: true },
+    Sticker: { fontWeight: 800, ls: 0.06, lh: 1.12, upper: true }
+  },
+  look: {
+    plate: { fill: "card", ink: "onCard", muted: "cardMuted", radius: 6, stroke: { color: "primary", width: 3, align: "INSIDE" }, effects: (k) => [hardShadow(k, "ink", 8, 10, 0.8)] },
+    tiles: [["primary", "onPrimary"]],
+    tileRadius: 6,
+    button: 8,
+    chip: 4,
+    nameOn: "stage",
+    enter: "drop-in",
+    sep: "\xB7",
+    nameEffects: (k) => [hardShadow(k, "awningCream", 0, 4, 1)]
+  },
+  parts: [
+    { name: "Wall", w: 3e3, h: 3e3, anchor: "cover", draw: wall },
+    { name: "Awning", w: 3e3, h: 330, anchor: "top", draw: awning },
+    { name: "Table", w: 3e3, h: 400, anchor: "foot", draw: table }
+  ],
+  sticker: seal,
+  dates: "3 \u2013 5 September 2027",
+  place: "The Old Cattle Market, Castelmare",
+  kicker: "The harvest festival of food & wine",
+  billLabel: "The first cooks, cellars and bands",
+  heads: ["Noor Haddad", "Matteo Riccivale", "Ilse Brandt"],
+  acts: ["Cantina Ferramonte", "Clos des Hirondelles", "Weingut Altenbach", "Brine & Shell"],
+  more: ["The Copper Kettles", "Luc\xEDa y Los Faroles", "Harbour Street Brass"],
+  tba: "Sixty more names on 1 June",
+  presale: { by: "Sun 21 March", code: "Tue 23 March", opens: "Thu 25 March, 12:00", short: "25 March, noon", queue: "11:30", limit: "up to six tickets" },
+  clock: { days: "17", hours: "08", minutes: "54", from: 29, to: 23 },
+  tier: { tag: "First pressing", name: "Weekend ticket, all three days", price: "\u20AC68", was: "\u20AC58", wasTag: "Early harvest", next: "\u20AC78", nextTag: "Second pressing", sold: "Early harvest sold out", note: "On sale now to newsletter readers. What is left opens to presale codes on 25 March.", stock: { label: "Selling fast", from: 2140, left: 2118, total: 9e3 } },
+  seal: ["Presale", "25 March"],
+  code: "SV27-PRE-7KQ2",
+  gate: "South gate",
+  holder: "Giulia Marchetti",
+  pass: "Weekend ticket",
+  track: "acoustic",
+  beats: 24,
+  step: 1,
+  captions: ["The first cooks are in.", "Presale opens Thursday 25 March.", "Sign up by 21 March.", "Sign up for a code."],
+  picture: "a market stall under a striped awning and twinkling bulbs, its table laid with wine, cheese, bread and a steaming pot",
+  tags: ["food", "wine", "market", "harvest", "serif", "illustration"]
+};
+
+export {
+  FOOD
+};

package/dist/chunks/chunk-FOM33PRI.js

@@ -0,0 +1,33 @@
+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 {
+  april_fools_landing_default
+} from "./chunk-6XTIWLHK.js";
+import {
+  april_fools_link_preview_default
+} from "./chunk-GNMYTM2B.js";
+import {
+  april_fools_price_slash_post_default
+} from "./chunk-VCKAFPUH.js";
+import {
+  april_fools_infomercial_reel_default
+} from "./chunk-N63AM3TR.js";
+import {
+  april_fools_header_default
+} from "./chunk-CA2XT44T.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/themes/april-fools.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var pack = [april_fools_infomercial_reel_default, april_fools_landing_default, april_fools_price_slash_post_default, april_fools_header_default, april_fools_link_preview_default];
+var april_fools_default = pack;
+
+export {
+  april_fools_default
+};

package/dist/chunks/chunk-FP7A5CNE.js

@@ -0,0 +1,299 @@
+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 {
+  sceneLengths,
+  type,
+  withSound
+} from "./chunk-MZODLFLE.js";
+import {
+  clicks,
+  glide,
+  touch
+} from "./chunk-DYNJDZ4J.js";
+import {
+  bed
+} from "./chunk-52GCV7N5.js";
+import {
+  shadow
+} from "./chunk-HVK5T4I5.js";
+import {
+  pill
+} from "./chunk-EK5CFFJO.js";
+import {
+  into,
+  playScenes,
+  sceneSheets
+} from "./chunk-3HDJLLZM.js";
+import {
+  defineTemplate
+} from "./chunk-A44WEVKR.js";
+import {
+  Kit,
+  preset
+} from "./chunk-T3SGRYUX.js";
+import {
+  ease
+} from "./chunk-6DWY3DOQ.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/scenes/saas-film-app-preview.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var B = bed("acoustic", 32);
+var { beat } = B;
+var ON = [0, 8, 16, 24];
+var W = 886;
+var H = 1920;
+var SIDE = 48;
+var TABS = ["Today", "Identify", "Plan", "Growth"];
+var CAPTIONS = ["See who\u2019s thirsty today.", "Point, snap, know your plant.", "A watering plan that runs itself.", "Watch them grow, week by week."];
+var PLANTS = [
+  ["Dolores", "Monstera", "Water today \xB7 250 ml", "monstera", "sage"],
+  ["Fernando", "Boston fern", "Water today \xB7 150 ml", "fern", "peach"],
+  ["Sid", "Snake plant", "Due Friday \xB7 100 ml", "snake", "sky"],
+  ["Polly", "Golden pothos", "Mist today", "pothos", "sage"]
+];
+var PLAN = [["Mon", "Dolores, Fernando", "400 ml"], ["Wed", "Polly (mist)", "2 min"], ["Fri", "Sid", "100 ml"], ["Sun", "Feed everyone", "Monthly"]];
+var WET = [0, 2, 4, 6];
+var GROWTH = [0.32, 0.4, 0.46, 0.58, 0.66, 0.8, 0.92];
+var caption = [{ layer: "Caption", preset: "rise-in", at: 350, params: { duration: 500 } }];
+var scenes = [
+  { sheet: "Today", cues: [
+    ...caption,
+    { layer: "Plant card", preset: "rise-in", at: 80, params: { duration: 450 }, stagger: { delay: 90 } },
+    { layer: "Done 1", preset: "pop-in", at: beat(3) + 120, params: { duration: 300 } },
+    { layer: "Done 2", preset: "pop-in", at: beat(6) + 120, params: { duration: 300 } },
+    { layer: "Thirsty count", preset: "pulse", at: beat(6) + 200, params: { duration: 500, amount: 0.06 } }
+  ] },
+  { sheet: "Identify", transition: into("PUSH_FROM_RIGHT", 400), cues: [
+    ...caption,
+    { layer: "Viewfinder", preset: "pulse", at: beat(3) + 60, params: { duration: 480, amount: 0.04 } },
+    { layer: "Result", preset: "rise-in", at: beat(4), params: { duration: 550 } },
+    { layer: "Added", preset: "pop-in", at: beat(7) + 120, params: { duration: 320 } }
+  ] },
+  { sheet: "Plan", transition: into("PUSH_FROM_RIGHT", 400), cues: [
+    ...caption,
+    { layer: "Day", preset: "pop-in", at: 300, params: { duration: 300 }, stagger: { delay: 60 } },
+    { layer: "Toggle on", preset: "fade-in", at: beat(3) + 80, params: { duration: 220 } },
+    { layer: "Drop", preset: "pop-in", at: beat(4), params: { duration: 300 }, stagger: { delay: 160 } },
+    { layer: "Plan row", preset: "rise-in", at: beat(5), params: { duration: 420 }, stagger: { delay: 150 } }
+  ] },
+  { sheet: "Growth", transition: into("PUSH_FROM_RIGHT", 400), cues: [
+    ...caption,
+    { layer: "Growth bar", preset: "rise-in", at: 400, params: { duration: 500 }, stagger: { delay: 90 } },
+    { layer: "Streak", preset: "pop-in", at: beat(2), params: { duration: 380 } },
+    { layer: "Snapshot", preset: "pop-in", at: beat(4), params: { duration: 340 }, stagger: { delay: 200 } },
+    { layer: "Share", preset: "pulse", at: beat(7) + 100, params: { duration: 500, amount: 0.07 } }
+  ], counts: [{ layer: "Streak figure", at: beat(2), duration: beat(4), counter: { from: 0, to: 12, suffix: " weeks" } }] }
+];
+var LENGTHS = sceneLengths(ON.map((b) => beat(b)), B.duration, scenes);
+function leaf(x, y, len, wide, deg) {
+  const a = deg * Math.PI / 180, ux = Math.sin(a), uy = -Math.cos(a), px = Math.cos(a), py = Math.sin(a);
+  const at = (along, across) => ({ x: x + ux * len * along + px * wide * across, y: y + uy * len * along + py * wide * across });
+  const tip = at(1, 0);
+  return { closed: true, points: [{ x, y, handleOut: at(0.3, 0.62) }, { ...tip, handleIn: at(0.75, 0.5), handleOut: at(0.75, -0.5) }, { x, y, handleIn: at(0.3, -0.62) }] };
+}
+var LEAVES = {
+  monstera: [[50, 52, 30, -38], [50, 60, 34, 4], [50, 50, 28, 44], [46, 36, 20, -74], [54, 34, 20, 78]],
+  fern: [[50, 58, 9, -52], [50, 62, 9, -30], [50, 66, 9, -10], [50, 66, 9, 10], [50, 62, 9, 30], [50, 58, 9, 52], [50, 44, 8, -76], [50, 44, 8, 76]],
+  snake: [[40, 56, 11, -9], [48, 66, 12, -2], [56, 60, 11, 6], [63, 46, 10, 13], [34, 40, 9, -15]],
+  pothos: [[50, 36, 22, -60], [50, 40, 24, -20], [50, 40, 24, 24], [50, 36, 22, 62], [44, 24, 16, -100], [56, 24, 16, 102]]
+};
+var saas_film_app_preview_default = defineTemplate({
+  id: "motion-saas-film-app-preview",
+  meta: {
+    name: "SaaS film: App Store preview video",
+    description: "A 20-second App Store preview at the iPhone size (886\xD71920), in the screen-recording style Apple asks for: four app screens fill the frame one after another, a touch indicator taps through them and a short caption sits over each. Every screen is a picture slot for your own recording, with a drawn pastel plant-care app as the placeholder. Music, a screen every two bars",
+    category: "animation",
+    tags: ["animation", "saas", "saas film", "app store", "app preview", "ios", "iphone", "mobile", "screen recording", "touch", "captions", "pastel", "scenes", "music", "audio"],
+    platforms: ["app-store", "ios", "google-play", "android"],
+    formats: ["video", "demo", "screen", "ad"],
+    useCases: ["launch", "onboarding"],
+    created: "2026-10-02",
+    updated: "2026-10-02"
+  },
+  stableNumbers: true,
+  motion: { scenes },
+  build() {
+    const k = new Kit("SaaS film: App Store preview video", preset("video-app-preview-iphone"));
+    k.quantizeGeometry = true;
+    k.brand(
+      { paper: "#FFF6EC", text: "#1D2B22", onPaper: "#2A7148", primary: "#2F7D4F", onPrimary: "#FFFFFF", card: "#FFFFFF", onCard: "#1D2B22", accent: "#FF8A3D", onAccent: "#2A1200" },
+      { name: "Mossy" }
+    );
+    k.palette({ leaf: "#2F7D4F", leafDark: "#1F5B3A", sage: "#DCEBD9", peach: "#FFE1C7", sky: "#D6ECF5", faint: "#5F6B62", line: "#EFE3D3", pot: "#C9764A", potShade: "#A85C36", water: "#3D8FD1", ink: "#1D2B22", caption: "#14221A", onCaption: "#FFFFFF", off: "#D9D2C6", knob: "#FFFFFF" });
+    const made = /* @__PURE__ */ new Set();
+    const T = (name2, px, o = {}) => type(k, made, name2, px, o);
+    const big = T("Screen title", 72, { fontWeight: 800, leading: 1.04, tracking: -0.04 });
+    const name = T("Name", 40, { fontWeight: 800, leading: 1.15, tracking: -0.025 });
+    const note = T("Note", 28, { fontWeight: 500, leading: 1.3 });
+    const strong = T("Strong", 30, { fontWeight: 700, leading: 1.25, tracking: -0.01 });
+    const tab = T("Tab", 22, { fontWeight: 700, leading: 1.2 });
+    const clock = T("Clock", 30, { fontWeight: 700, leading: 1.2, tracking: -0.01 });
+    pill(k, "Chip", { fill: "accent", ink: "onAccent", style: T("Chip", 26, { fontWeight: 800, leading: 1.2, tracking: -0.01 }), label: "Added", pad: [10, 22], radius: 999 });
+    pill(k, "Button", { fill: "primary", ink: "onPrimary", style: T("Button", 34, { fontWeight: 800, leading: 1.2, tracking: -0.02 }), label: "Add to my plants", pad: [24, 44], radius: 28 });
+    const plant = (parent, size, kind, at) => {
+      const u = size / 100;
+      const art = k.stack(parent, { width: size, height: size, name: "Plant", ...at ? { absolute: at } : {} });
+      k.vector(art, size, size, LEAVES[kind].map(([x, len, wide, deg]) => leaf(x * u, 70 * u, len * u, wide * u, deg)), "leaf", { name: "Leaves", absolute: { x: 0, y: 0 } });
+      k.vector(art, size, size, LEAVES[kind].slice(1, 3).map(([x, len, wide, deg]) => leaf(x * u, 70 * u, len * u * 0.62, wide * u * 0.34, deg)), "leafDark", { name: "Leaf veins", absolute: { x: 0, y: 0 }, opacity: 0.5 });
+      k.vector(art, size, size, [{ closed: true, points: [{ x: 30 * u, y: 70 * u }, { x: 70 * u, y: 70 * u }, { x: 64 * u, y: 96 * u }, { x: 36 * u, y: 96 * u }] }], "pot", { name: "Pot", absolute: { x: 0, y: 0 } });
+      k.rect(art, 46 * u, 7 * u, "potShade", { name: "Pot rim", radius: 3 * u, absolute: { x: 27 * u, y: 67 * u } });
+      return art;
+    };
+    const tick = (s) => ({ closed: false, points: [{ x: s * 0.26, y: s * 0.52 }, { x: s * 0.44, y: s * 0.7 }, { x: s * 0.76, y: s * 0.32 }] });
+    const drop = (s) => ({ closed: true, points: [{ x: s / 2, y: s * 0.12, handleOut: { x: s * 0.62, y: s * 0.3 } }, { x: s * 0.78, y: s * 0.62, handleIn: { x: s * 0.78, y: s * 0.46 }, handleOut: { x: s * 0.78, y: s * 0.96 } }, { x: s * 0.22, y: s * 0.62, handleIn: { x: s * 0.22, y: s * 0.96 }, handleOut: { x: s * 0.22, y: s * 0.46 } }, { x: s / 2, y: s * 0.12, handleIn: { x: s * 0.38, y: s * 0.3 } }] });
+    const sheets = sceneSheets(k, "video-app-preview-iphone", scenes.map((s) => s.sheet));
+    const screens = sheets.map((sheet, i) => {
+      k.flowSheet(sheet, 0, 0, "paper", "MIN", "MIN");
+      k.timeline(sheet, { duration: LENGTHS[i], fps: 30 });
+      k.photo(sheet, W, H, { ground: "peach", name: "Your screen recording", absolute: { x: 0, y: 0 } });
+      const ui = k.stack(sheet, { width: W, height: H, gap: 30, fill: "paper", padding: { top: 44, right: SIDE, bottom: 0, left: SIDE }, name: "Placeholder screen", absolute: { x: 0, y: 0 } });
+      const status = k.stack(ui, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", height: 56, padding: { top: 0, right: 14, bottom: 0, left: 22 }, name: "Status bar" });
+      k.text(status, "9:41", { style: clock, color: "text", autoWidth: true, name: "Time" });
+      const signs = k.stack(status, { direction: "HORIZONTAL", width: "HUG", gap: 10, align: "MAX", name: "Signal" });
+      for (const h of [12, 17, 22, 27]) k.rect(signs, 7, h, "text", { name: "Signal bar", radius: 2 });
+      k.rect(signs, 46, 24, "text", { name: "Battery", radius: 8 });
+      const tabs = k.stack(sheet, { direction: "HORIZONTAL", width: W, height: 170, fill: "card", padding: { top: 22, right: 30, bottom: 0, left: 30 }, stroke: { color: "line", width: 3, align: "INSIDE" }, name: "Tab bar", absolute: { x: 0, y: H - 170 } });
+      TABS.forEach((t, j) => {
+        const item = k.stack(tabs, { gap: 8, align: "CENTER", name: "Tab" });
+        k.rect(item, 44, 44, j === i ? "leaf" : "off", { name: "Tab icon", radius: j === 1 ? 22 : 12 });
+        k.text(item, t, { style: tab, color: j === i ? "leaf" : "faint", align: "CENTER", name: "Tab label" });
+      });
+      const cap = k.stack(sheet, { width: W - 2 * SIDE, fill: "caption", radius: 36, padding: { top: 30, right: 36, bottom: 34, left: 36 }, effects: [shadow(k, "caption", 0.35, 20, 40)], name: "Caption", absolute: { x: SIDE, y: 1500 } });
+      k.text(cap, CAPTIONS[i], { style: T("Caption", 54, { fontWeight: 800, leading: 1.1, tracking: -0.035, textAlign: "CENTER" }), color: "onCaption", name: "Caption words" });
+      return { sheet, ui };
+    });
+    const [today, identify, plan, growth] = screens;
+    const finger = (sheet, rest, taps) => {
+      const p = touch(k, sheet, { ...rest, size: 104, fill: "ink", ring: "ink" });
+      const stops = taps.flatMap((t, i) => {
+        const from = i === 0 ? rest : taps[i - 1];
+        return [{ t: t.at - beat(1.4), dx: from.x - rest.x, dy: from.y - rest.y }, { t: t.at, dx: t.x - rest.x, dy: t.y - rest.y }];
+      });
+      glide(k, p, stops);
+      clicks(k, p, taps.map((t) => t.at));
+    };
+    {
+      const { ui, sheet } = today;
+      const head = k.stack(ui, { gap: 6, padding: { top: 10, right: 0, bottom: 4, left: 6 }, name: "Heading" });
+      k.text(head, "Thursday 2 October", { style: note, color: "text", name: "Date" });
+      k.text(head, "3 plants are thirsty", { style: big, color: "text", name: "Thirsty count" });
+      const taps = [];
+      PLANTS.forEach(([plantName, species, what, kind, tile], i) => {
+        const card = k.stack(ui, { direction: "HORIZONTAL", gap: 26, align: "CENTER", fill: "card", radius: 44, padding: 26, effects: [shadow(k, "pot", 0.12, 12, 30)], name: "Plant card" });
+        const pic = k.stack(card, { width: 190, height: 190, fill: tile, radius: 32, clip: true, name: "Plant tile" });
+        plant(pic, 190, kind, { x: 0, y: 0 });
+        const words = k.stack(card, { gap: 4, name: "Plant words" });
+        k.text(words, plantName, { style: name, color: "onCard", name: "Plant name" });
+        k.text(words, species, { style: note, color: "faint", name: "Species" });
+        k.text(words, what, { style: strong, color: i === 2 ? "faint" : "leaf", name: "Plant note" });
+        const button = k.stack(card, { width: 104, height: 104, fill: i === 2 ? "line" : "sky", radius: 52, name: "Water button" });
+        k.vector(button, 104, 104, [drop(104)], i === 2 ? "off" : "water", { name: "Water drop", absolute: { x: 0, y: 0 } });
+        if (i < 2) {
+          const done = k.stack(button, { width: 104, height: 104, fill: "leaf", radius: 52, name: `Done ${i + 1}`, absolute: { x: 0, y: 0 } });
+          k.vector(done, 104, 104, [tick(104)], "knob", { name: "Done tick", strokeWidth: 10, absolute: { x: 0, y: 0 } });
+          taps.push({ x: W - SIDE - 26 - 52, y: 0 });
+        }
+      });
+      const laid = k.finish();
+      const cards = k.named(ui, "Plant card");
+      taps.forEach((t, i) => {
+        const c = laid.nodes[cards[i]];
+        t.y = c.y + c.height / 2;
+      });
+      finger(sheet, { x: 640, y: 1330 }, [{ at: beat(3), ...taps[0] }, { at: beat(6), ...taps[1] }]);
+    }
+    {
+      const { ui, sheet } = identify;
+      k.text(ui, "What is this one?", { style: big, color: "text", name: "Identify title" });
+      const VW = W - 2 * SIDE, VH = 760;
+      const view = k.stack(ui, { width: VW, height: VH, fill: "sage", radius: 48, clip: true, name: "Viewfinder" });
+      k.photo(view, VW, VH, { ground: "sage", name: "Camera photo", absolute: { x: 0, y: 0 } });
+      const art = k.stack(view, { width: VW, height: VH, fill: "sage", name: "Placeholder plant", absolute: { x: 0, y: 0 } });
+      k.ellipse(art, 620, "peach", { name: "Light", absolute: { x: 85, y: 40 } });
+      plant(art, 700, "monstera", { x: 45, y: 50 });
+      const L = 90, Wt = 12, m = 46;
+      const corner = (x, y, sx, sy) => [{ closed: true, points: [{ x, y }, { x: x + sx * L, y }, { x: x + sx * L, y: y + sy * Wt }, { x: x + sx * Wt, y: y + sy * Wt }, { x: x + sx * Wt, y: y + sy * L }, { x, y: y + sy * L }] }];
+      k.vector(view, VW, VH, [...corner(m, m, 1, 1), ...corner(VW - m, m, -1, 1), ...corner(m, VH - m, 1, -1), ...corner(VW - m, VH - m, -1, -1)], "knob", { name: "Brackets", absolute: { x: 0, y: 0 } });
+      k.stack(view, { width: 120, height: 120, fill: "knob", radius: 60, stroke: { color: "leaf", width: 8, align: "INSIDE" }, name: "Shutter", absolute: { x: VW / 2 - 60, y: VH - 160 } });
+      const result = k.stack(ui, { gap: 18, fill: "card", radius: 40, padding: 34, effects: [shadow(k, "pot", 0.16, 16, 36)], name: "Result" });
+      const top = k.stack(result, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Result top" });
+      k.text(top, "Monstera deliciosa", { style: T("Result", 48, { fontWeight: 800, leading: 1.1, tracking: -0.035 }), color: "onCard", autoWidth: true, name: "Result name" });
+      k.instance(top, "Chip", { Label: "Added" }, { name: "Added" });
+      k.text(result, "97% match \xB7 Bright, indirect light \xB7 Water weekly", { style: note, color: "faint", name: "Result note" });
+      k.instance(result, "Button", { Label: "Add to my plants" }, { name: "Add button" });
+      const laid = k.finish();
+      const r = laid.nodes[result], v = laid.nodes[view];
+      finger(sheet, { x: 680, y: 1340 }, [{ at: beat(3), x: W / 2, y: v.y + VH - 100 }, { at: beat(7), x: SIDE + 34 + 170, y: r.y + r.height - 34 - 44 }]);
+    }
+    {
+      const { ui, sheet } = plan;
+      k.text(ui, "This week\u2019s plan", { style: big, color: "text", name: "Plan title" });
+      const week = k.stack(ui, { direction: "HORIZONTAL", gap: 10, fill: "card", radius: 40, padding: 22, effects: [shadow(k, "pot", 0.12, 12, 30)], name: "Week" });
+      ["M", "T", "W", "T", "F", "S", "S"].forEach((d, i) => {
+        const day = k.stack(week, { gap: 14, align: "CENTER", fill: i === 3 ? "sage" : "paper", radius: 26, padding: { top: 18, right: 0, bottom: 18, left: 0 }, name: "Day" });
+        k.text(day, d, { style: strong, color: i === 3 ? "leaf" : "text", align: "CENTER", name: "Day letter" });
+        const slot = k.stack(day, { width: 56, height: 56, name: "Drop slot" });
+        if (WET.includes(i)) k.vector(slot, 56, 56, [drop(56)], "water", { name: "Drop", absolute: { x: 0, y: 0 } });
+      });
+      const remind = k.stack(ui, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", fill: "card", radius: 40, padding: { top: 30, right: 30, bottom: 30, left: 34 }, effects: [shadow(k, "pot", 0.12, 12, 30)], name: "Reminder" });
+      const rw = k.stack(remind, { width: "HUG", gap: 4, name: "Reminder words" });
+      k.text(rw, "Remind me at 8:00", { style: name, color: "onCard", autoWidth: true, name: "Reminder title" });
+      k.text(rw, "Only on watering days", { style: note, color: "faint", autoWidth: true, name: "Reminder note" });
+      const toggle = k.stack(remind, { width: 136, height: 80, fill: "off", radius: 40, name: "Toggle" });
+      k.rect(toggle, 136, 80, "leaf", { name: "Toggle on", radius: 40, absolute: { x: 0, y: 0 } });
+      const knob = k.ellipse(toggle, 64, "knob", { name: "Toggle knob", absolute: { x: 64, y: 8 } });
+      k.animate(knob, "translateX", [{ t: 0, v: -56, ease: ease.hold }, { t: beat(3) + 60, v: -56, ease: ease.out("cubic") }, { t: beat(3) + 300, v: 0 }]);
+      for (const [day, who, amount] of PLAN) {
+        const item = k.stack(ui, { direction: "HORIZONTAL", gap: 22, align: "CENTER", fill: "card", radius: 30, padding: { top: 22, right: 30, bottom: 22, left: 22 }, name: "Plan row" });
+        const tag = k.stack(item, { width: 96, height: 72, fill: "sky", radius: 20, justify: "CENTER", align: "CENTER", name: "Plan day" });
+        k.text(tag, day, { style: strong, color: "ink", autoWidth: true, name: "Plan day label" });
+        k.text(item, who, { style: strong, color: "onCard", name: "Plan who" });
+        k.text(item, amount, { style: note, color: "faint", autoWidth: true, name: "Plan amount" });
+      }
+      const laid = k.finish();
+      const r = laid.nodes[remind];
+      finger(sheet, { x: 620, y: 1360 }, [{ at: beat(3), x: W - SIDE - 30 - 68, y: r.y + r.height / 2 }]);
+    }
+    {
+      const { ui, sheet } = growth;
+      const head = k.stack(ui, { direction: "HORIZONTAL", gap: 24, align: "CENTER", name: "Growth head" });
+      const pic = k.stack(head, { width: 150, height: 150, fill: "sage", radius: 75, clip: true, name: "Growth plant" });
+      plant(pic, 150, "monstera", { x: 0, y: 6 });
+      const words = k.stack(head, { gap: 2, name: "Growth words" });
+      k.text(words, "Dolores", { style: big, color: "text", name: "Growth name" });
+      k.text(words, "Monstera \xB7 7 new leaves", { style: note, color: "text", name: "Growth note" });
+      const streak = k.stack(ui, { gap: 4, fill: "primary", radius: 40, padding: { top: 30, right: 36, bottom: 34, left: 36 }, name: "Streak" });
+      k.text(streak, "WATERED ON TIME FOR", { style: T("Label", 24, { fontWeight: 800, leading: 1.25, tracking: 0.1 }), color: "onPrimary", name: "Streak label" });
+      k.text(streak, "12 weeks", { style: T("Figure", 120, { fontWeight: 800, leading: 1, tracking: -0.05, fontFeatures: { tnum: 1 } }), color: "onPrimary", name: "Streak figure" });
+      const CHH = 300;
+      const chart = k.stack(ui, { direction: "HORIZONTAL", gap: 16, align: "MAX", height: CHH + 60, fill: "card", radius: 40, padding: 30, effects: [shadow(k, "pot", 0.12, 12, 30)], name: "Chart" });
+      GROWTH.forEach((g, i) => k.stack(chart, { height: Math.round(CHH * g), fill: i === GROWTH.length - 1 ? "accent" : "sage", radius: 18, name: "Growth bar" }));
+      const shots = k.stack(ui, { direction: "HORIZONTAL", gap: 16, name: "Snapshots" });
+      const SWd = Math.floor((W - 2 * SIDE - 32) / 3);
+      ["sky", "peach", "sage"].forEach((g, i) => {
+        const shot = k.stack(shots, { width: SWd, height: 250, radius: 30, clip: true, name: "Snapshot" });
+        k.photo(shot, SWd, 250, { ground: g, name: "Progress photo", absolute: { x: 0, y: 0 } });
+        const art = k.stack(shot, { width: SWd, height: 250, fill: g, name: "Placeholder photo", absolute: { x: 0, y: 0 } });
+        const s = 150 + i * 40;
+        plant(art, s, "monstera", { x: (SWd - s) / 2, y: 250 - s - 4 });
+      });
+      const share = k.stack(sheet, { width: "HUG", fill: "accent", radius: 999, padding: { top: 14, right: 30, bottom: 14, left: 30 }, name: "Share", absolute: { x: W - SIDE - 190, y: 138 } });
+      k.text(share, "Share", { style: strong, color: "onAccent", autoWidth: true, name: "Share label" });
+      finger(sheet, { x: 600, y: 1340 }, [{ at: beat(7), x: W - SIDE - 95, y: 170 }]);
+    }
+    playScenes(k, "comp-app-preview", "App Store preview", sheets, scenes, "paper");
+    k.setCover(sheets[0]);
+    return withSound(k.finish(), { "comp-app-preview": B.audio });
+  }
+});
+
+export {
+  saas_film_app_preview_default
+};

package/dist/chunks/chunk-FRXYC2BB.js

@@ -0,0 +1,39 @@
+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 {
+  defineDeck
+} from "./chunk-VYEHEIHO.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/slides/title-card.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var title_card_default = defineDeck({
+  id: "motion-slide-title",
+  meta: {
+    name: "Animated title card",
+    description: "A 16:9 opening slide for a talk that plays as the show arrives: logo, event chip, title, a wiping rule, the line and the speaker \u2014 about three seconds",
+    category: "animation",
+    tags: ["animation", "title card", "slides", "talk", "conference", "presentation"],
+    platforms: ["slides"],
+    formats: ["slide-deck", "title-card"],
+    useCases: ["title", "event"],
+    created: "2026-09-29",
+    updated: "2026-09-29"
+  },
+  colors: { primary: "#2B2D42", onPrimary: "#FFFFFF", accent: "#C8553D", onAccent: "#FFFFFF" },
+  fields: { company: "Northfield Libraries" },
+  options: { footer: false },
+  slides: [
+    { kind: "cover", name: "Title card", kicker: "LIBRARY FUTURES \xB7 LEEDS \xB7 14 MAY", title: "Quiet rooms, loud ideas", lead: "What happened when we turned the reading room into a makerspace", speaker: "Priya Anand \xB7 Head of Community Learning, {{brand.company}}" }
+  ]
+});
+
+export {
+  title_card_default
+};