@popcraft/kit 0.53.4 → 0.53.6

package/dist/chunks/chunk-SV2JCNNX.js

@@ -1,415 +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 {
-  sceneLengths,
-  type,
-  withSound
-} from "./chunk-6KMAJZO7.js";
-import {
-  END_CARD_PARTS,
-  captionParts,
-  column,
-  endCard,
-  rig,
-  size,
-  stage
-} from "./chunk-UWCYOIAK.js";
-import {
-  scrollingRows
-} from "./chunk-PQNDFOQT.js";
-import {
-  key
-} from "./chunk-LAPZ2X3J.js";
-import {
-  BASE,
-  LID,
-  deviceShadow,
-  devices
-} from "./chunk-WXWK2NO7.js";
-import {
-  DESKTOP_SCREEN
-} from "./chunk-2KFYCU3X.js";
-import {
-  MONO
-} from "./chunk-AXAAXHZF.js";
-import {
-  bed
-} from "./chunk-KHGNV7UQ.js";
-import {
-  glow,
-  grain
-} from "./chunk-YORIY3BT.js";
-import {
-  box
-} from "./chunk-EJLCQVQK.js";
-import {
-  into,
-  playScenes,
-  sceneSheets
-} from "./chunk-AEEWD2JG.js";
-import {
-  defineTemplate
-} from "./chunk-KGT34R7C.js";
-import {
-  Kit,
-  preset
-} from "./chunk-L5DTT5DC.js";
-import {
-  ease
-} from "./chunk-PLZLKHOI.js";
-import {
-  contextFrame,
-  init_scene3d,
-  sceneLayers
-} from "./chunk-NWNYARD6.js";
-import {
-  init_transform3d,
-  mul4,
-  transform4
-} from "./chunk-T2SCC6PU.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-WKDVCZ45.js";
-
-// templates/src/motion3d/saas-film-cinematic-trailer.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-init_scene3d();
-init_transform3d();
-var B = bed("trailer", 50);
-var { beat } = B;
-var ON = [0, 16, 30, 42];
-var OPEN_AT = beat(1);
-var OPENED = beat(5);
-var LIFT = beat(1);
-var SETTLED = beat(5);
-var LAYERS = [[90, "Every project, one sidebar"], [210, "The deploy queue"], [340, "Live traffic, per second"], [470, "The figures that page you"], [600, "Rollback in one click"]];
-var scenes = [
-  { sheet: "Laptop", cues: [
-    { layer: "Stamp", preset: "typewriter", at: 100, params: { duration: 1e3 } },
-    { layer: "Title", preset: "words-in", at: beat(4), params: { duration: 700, amount: Math.round(beat(1)) } },
-    { layer: "Title note", preset: "fade-in", at: beat(9), params: { duration: 600 } }
-  ] },
-  { sheet: "Layers", transition: into("DISSOLVE", 600), cues: [
-    { layer: "Layers title", preset: "words-in", at: 300, params: { duration: 650, amount: 90 } },
-    { layer: "Leader", preset: "slide-in", at: SETTLED, params: { duration: 500, direction: "left", distance: 80 }, stagger: { delay: Math.round(beat(1)) } }
-  ] },
-  { sheet: "Wall", transition: into("DISSOLVE", 600), cues: [
-    { layer: "Plate", preset: "rise-in", at: beat(2), params: { duration: 700, distance: 70 } },
-    { layer: "Wall title", preset: "words-in", at: beat(2) + 200, params: { duration: 650, amount: 90 } }
-  ] },
-  { sheet: "End card", transition: into("DISSOLVE", 700), cues: [
-    { layer: [...END_CARD_PARTS], preset: "rise-in", at: 300, params: { duration: 700 }, stagger: { delay: 150, order: "selection" } },
-    { layer: "End button", preset: "pulse", at: beat(5), params: { duration: 700, amount: 0.06 } }
-  ] }
-];
-var LENGTHS = sceneLengths(ON.map((b) => beat(b)), B.duration, scenes);
-var SW = DESKTOP_SCREEN.width;
-var SH = DESKTOP_SCREEN.height;
-var SIDE = 230;
-var DEPLOYS = [
-  ["Add annual billing toggle", "main", "16:58", "ok"],
-  ["Fix webhook retry backoff", "main", "15:12", "ok"],
-  ["Try edge cache for /pricing", "preview/edge-cache", "14:40", "warn"],
-  ["Bump Node to 24", "main", "11:03", "ok"]
-];
-var REGIONS = [["fra1", "Frankfurt", "38 ms", 0.3], ["iad1", "Washington", "41 ms", 0.34], ["sfo1", "San Francisco", "52 ms", 0.42], ["sin1", "Singapore", "77 ms", 0.62], ["syd1", "Sydney", "96 ms", 0.78], ["gru1", "S\xE3o Paulo", "88 ms", 0.7], ["hnd1", "Tokyo", "61 ms", 0.5], ["lhr1", "London", "36 ms", 0.28]];
-var LOGS = [
-  ["16:58:02", "INFO", "build #482 started (main@9f3c2e1)", "scrFaint"],
-  ["16:58:31", "INFO", "compiled 214 routes in 28.4 s", "scrFaint"],
-  ["16:58:33", " OK ", "health check passed in fra1, iad1, sfo1", "ok"],
-  ["16:58:34", "INFO", "shifting 10% of traffic to #482", "scrFaint"],
-  ["16:59:04", " OK ", "error rate 0.02%, p95 184 ms", "ok"],
-  ["16:59:05", "INFO", "shifting 100% of traffic to #482", "scrFaint"],
-  ["16:59:36", "WARN", "sin1 p95 above 250 ms for 12 s", "warn"],
-  ["16:59:48", " OK ", "sin1 recovered, no rollback needed", "ok"],
-  ["17:00:00", " OK ", "deploy #482 is live in 8 regions", "ok"]
-];
-var saas_film_cinematic_trailer_default = defineTemplate({
-  id: "motion-saas-film-cinematic-trailer",
-  meta: {
-    name: "SaaS film: product trailer, cinematic 3D",
-    description: "A 30-second cinematic product trailer in real 3D, dark and premium: a laptop opens on your product while the camera pushes in, the UI comes apart into labelled layers, a wall of screens scrolls past the camera, and the end card lands. Four scenes dissolving into each other at 1920\xD71080, with music; the screens are components, with a picture slot for your own screenshot",
-    category: "animation",
-    tags: ["animation", "saas", "saas film", "trailer", "product trailer", "3d", "cinematic", "dark", "laptop", "exploded", "screen wall", "scenes", "music", "audio", "16:9", "launch"],
-    platforms: ["youtube", "x", "linkedin", "web", "product-hunt"],
-    formats: ["video", "ad", "intro", "demo"],
-    useCases: ["launch", "announcement", "brand-intro"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  motion: { scenes },
-  build() {
-    const k = new Kit("SaaS film: product trailer, cinematic 3D", preset("video-1080p"));
-    k.quantizeGeometry = true;
-    k.brand(
-      {
-        background: "#05070B",
-        text: "#FFF9F0",
-        onBackground: "#C9CDD6",
-        primary: "#F2A257",
-        onPrimary: "#1A0F00",
-        accent: "#FFD3A1",
-        onAccent: "#1A0F00",
-        device: "#090B0F",
-        deviceEdge: "#C9B59B",
-        shell: "#3A3F49",
-        shellShade: "#23272E",
-        keys: "#12151A"
-      },
-      { name: "Halyard", tagline: "Deploys you can sleep through." }
-    );
-    k.palette({ scr: "#141B26", scrSide: "#0B1017", scrLine: "#2B3543", scrText: "#F1F3F6", scrFaint: "#98A1AF", ok: "#45DB98", warn: "#F2A257", onWarn: "#1A0F00", light: "#FFE3BD", cool: "#16233A", glowScreen: "#8FB4E8", rim: "#5B6676" });
-    const s = size("video-1080p");
-    const made = /* @__PURE__ */ new Set();
-    const T = (name, px, o = {}) => type(k, made, name, px, o);
-    const ui20 = () => T("UI", 20, { fontWeight: 500, leading: 1.3 });
-    const ui22 = () => T("UI strong", 22, { fontWeight: 600, leading: 1.3, tracking: -0.01 });
-    const mono18 = () => T("UI mono", 18, { fontWeight: 500, leading: 1.4, ...MONO });
-    const figure = () => T("UI figure", 46, { fontWeight: 700, leading: 1.1, tracking: -0.03, fontFeatures: { tnum: 1 } });
-    const sidebar = (parent, current, at) => {
-      const side = k.stack(parent, { width: SIDE, height: SH, fill: "scrSide", gap: 8, padding: { top: 30, right: 16, bottom: 28, left: 16 }, name: "Sidebar", ...at ? { absolute: at } : {} });
-      const mark = k.stack(side, { direction: "HORIZONTAL", gap: 12, align: "CENTER", padding: { top: 0, right: 0, bottom: 18, left: 10 }, name: "Console mark" });
-      k.ellipse(mark, 22, "warn", { name: "Mark" });
-      k.text(mark, "halyard", { style: T("UI brand", 24, { fontWeight: 700, leading: 1.2, ...MONO }), color: "scrText", autoWidth: true, name: "Console name" });
-      for (const item of ["Deploys", "Regions", "Logs", "Alerts", "Settings"]) {
-        const row = k.stack(side, { radius: 8, padding: { top: 9, right: 10, bottom: 9, left: 12 }, ...item === current ? { fill: "scrLine" } : {}, name: "Nav item" });
-        k.text(row, item, { style: item === current ? ui22() : ui20(), color: item === current ? "scrText" : "scrFaint", name: "Nav label" });
-      }
-      return side;
-    };
-    const tiles = (parent, o = {}) => {
-      const row = k.stack(parent, { direction: "HORIZONTAL", gap: 18, name: "Figures", ...o.width ? { width: o.width } : {}, ...o.at ? { absolute: o.at } : {} });
-      for (const [label, value, ink] of [["p95 latency", "184 ms", "scrText"], ["Error rate", "0.02%", "ok"], ["Deploys today", "14", "scrText"]]) {
-        const tile = k.stack(row, { gap: 4, fill: "scrSide", radius: 14, padding: { top: 18, right: 22, bottom: 20, left: 22 }, stroke: { color: "scrLine", width: 2, align: "INSIDE" }, name: "Figure tile" });
-        k.text(tile, label, { style: ui20(), color: "scrFaint", name: "Figure label" });
-        k.text(tile, value, { style: figure(), color: ink, name: "Figure value" });
-      }
-      return row;
-    };
-    const traffic = (parent, width, height, at) => {
-      const card = k.stack(parent, { width, height, fill: "scrSide", radius: 14, clip: true, stroke: { color: "scrLine", width: 2, align: "INSIDE" }, name: "Traffic", ...at ? { absolute: at } : {} });
-      const n = Math.floor((width - 40) / 16);
-      const bars = Array.from({ length: n }, (_, i) => {
-        const h = Math.round((height - 50) * (0.25 + 0.6 * Math.abs(Math.sin(i * 0.37) * Math.cos(i * 0.11 + 1)) + (i > n * 0.8 ? 0.12 : 0)));
-        return box(20 + i * 16, height - 20 - h, 9, h);
-      });
-      k.vector(card, width, height, bars, "warn", { name: "Requests", absolute: { x: 0, y: 0 } });
-      return card;
-    };
-    const queue = (parent, rows, o = {}) => {
-      const list = k.stack(parent, { gap: 10, name: "Deploy queue", ...o.width ? { width: o.width } : {}, ...o.at ? { absolute: o.at } : {} });
-      for (const [what, branch, when, state] of DEPLOYS.slice(0, rows)) {
-        const row = k.stack(list, { direction: "HORIZONTAL", gap: 16, align: "CENTER", fill: "scrSide", radius: 10, padding: { top: 14, right: 20, bottom: 14, left: 18 }, name: "Deploy" });
-        k.ellipse(row, 14, state, { name: "State" });
-        k.text(row, what, { style: ui22(), color: "scrText", name: "Deploy name" });
-        k.text(row, branch, { style: mono18(), color: "scrFaint", autoWidth: true, name: "Branch" });
-        k.text(row, when, { style: mono18(), color: "scrFaint", autoWidth: true, name: "Deployed at" });
-      }
-      return list;
-    };
-    const screen = (name, title2, description, build) => k.component(`Screen / ${name}`, { direction: "HORIZONTAL", width: SW, height: SH, fill: "scr", radius: DESKTOP_SCREEN.radius, clip: true, description }, (id) => {
-      sidebar(id, name);
-      const main = k.stack(id, { height: SH, gap: 22, padding: 36, name: "Main" });
-      const head = k.stack(main, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Head" });
-      k.text(head, title2, { style: T("UI title", 34, { fontWeight: 700, leading: 1.2, tracking: -0.025 }), color: "scrText", autoWidth: true, name: "Screen title" });
-      const env = k.stack(head, { direction: "HORIZONTAL", width: "HUG", gap: 10, align: "CENTER", fill: "scrLine", radius: 8, padding: { top: 6, right: 14, bottom: 6, left: 12 }, name: "Environment" });
-      k.ellipse(env, 12, "ok", { name: "Live dot" });
-      k.text(env, "production", { style: mono18(), color: "scrText", autoWidth: true, name: "Environment name" });
-      build(main);
-    });
-    const MAIN = SW - SIDE - 72;
-    screen("Deploys", "Deploys", "The deploy console: the figures, live traffic and the queue.", (main) => {
-      tiles(main);
-      traffic(main, MAIN, 170);
-      queue(main, 4);
-    });
-    screen("Regions", "Regions", "Latency in every region.", (main) => {
-      for (let r = 0; r < 2; r++) {
-        const row = k.stack(main, { direction: "HORIZONTAL", gap: 18, name: "Region row" });
-        for (const [code, city, ms, share] of REGIONS.slice(r * 4, r * 4 + 4)) {
-          const tile = k.stack(row, { gap: 8, fill: "scrSide", radius: 14, padding: 22, stroke: { color: "scrLine", width: 2, align: "INSIDE" }, name: "Region" });
-          k.text(tile, code, { style: T("UI brand", 24, { fontWeight: 700, leading: 1.2, ...MONO }), color: "scrText", name: "Region code" });
-          k.text(tile, city, { style: ui20(), color: "scrFaint", name: "Region city" });
-          k.text(tile, ms, { style: figure(), color: share > 0.6 ? "warn" : "scrText", name: "Region latency" });
-          const bar = k.stack(tile, { height: 10, fill: "scrLine", radius: 5, clip: true, name: "Region bar" });
-          k.rect(bar, Math.round(190 * share), 10, share > 0.6 ? "warn" : "ok", { name: "Region fill", radius: 5 });
-        }
-      }
-      queue(main, 2);
-    });
-    screen("Logs", "Logs", "The log of a deploy, line by line.", (main) => {
-      const lines = k.stack(main, { gap: 14, fill: "scrSide", radius: 14, padding: 26, stroke: { color: "scrLine", width: 2, align: "INSIDE" }, name: "Log" });
-      for (const [time, level, message, ink] of LOGS) {
-        const line = k.stack(lines, { direction: "HORIZONTAL", gap: 18, name: "Log line" });
-        k.text(line, time, { style: mono18(), color: "scrFaint", autoWidth: true, name: "Log time" });
-        k.text(line, level, { style: mono18(), color: ink, autoWidth: true, name: "Log level" });
-        k.text(line, message, { style: mono18(), color: "scrText", name: "Log message" });
-      }
-      tiles(main);
-    });
-    k.component("Screen / Your screenshot", { width: SW, height: SH, fill: "scr", radius: DESKTOP_SCREEN.radius, clip: true, description: "A picture slot the size of the laptop\u2019s screen: swap a display\u2019s Screen for this, and drop your screenshot on it." }, (id) => {
-      k.photo(id, SW, SH, { ground: "scrSide", name: "Your screenshot" });
-    });
-    devices(k, ["Laptop lid", "Laptop lid back", "Laptop base"], { laptop: "Screen / Deploys" });
-    const lit = (sheet, o) => {
-      k.rect(sheet, s.W, s.H, "background", { name: "Grain", effects: grain(0.07, 2, 23), absolute: { x: 0, y: 0 } });
-      glow(k, sheet, { x: o.x, y: o.y, w: o.pool * 2.1, h: o.pool * 1.3, role: "cool", alpha: 0.5, name: "Haze" });
-      glow(k, sheet, { x: o.x, y: o.y, w: o.pool, h: o.pool * 0.62, role: "light", alpha: 0.46, name: "Key light" });
-      if (o.shafts) for (const [x0, x1, a] of [[-0.34, -0.12, 0.1], [-0.08, 0.1, 0.14], [0.16, 0.36, 0.09]]) {
-        const top = o.x + 260, w = 900;
-        k.vector(sheet, s.W, o.horizon, [{ closed: true, points: [{ x: top - 30, y: 0 }, { x: top + 30, y: 0 }, { x: o.x + x1 * w, y: o.horizon }, { x: o.x + x0 * w, y: o.horizon }] }], [k.gradient({ from: "light", to: "light", fromOpacity: a, toOpacity: 0.015 })], { name: "Light shaft", absolute: { x: 0, y: 0 } });
-      }
-      k.rect(sheet, s.W, s.H - o.horizon, [k.gradient({ from: "light", to: "light", fromOpacity: 0.13, toOpacity: 0 })], { name: "Floor", absolute: { x: 0, y: o.horizon } });
-      glow(k, sheet, { x: o.x, y: o.horizon + 30, w: o.pool * 1.5, h: 150, role: "light", alpha: 0.3, name: "Floor pool" });
-      k.rect(sheet, s.W, 2, k.tint("text", 0.3), { name: "Horizon", absolute: { x: 0, y: o.horizon } });
-    };
-    const title = (px) => T("Title", px, { fontWeight: 800, leading: 0.98, tracking: -0.045 });
-    const lede = T("Lede", 34, { fontWeight: 500, leading: 1.35, tracking: -0.01 });
-    const sheets = sceneSheets(k, "video-1080p", scenes.map((x) => x.sheet));
-    const [open, layers, wallSheet, end] = sheets;
-    {
-      const CX = s.W * 0.665, HINGE = s.H * 0.7;
-      lit(open, { x: CX, y: HINGE - 250, pool: 1200, horizon: Math.round(HINGE + 40), shafts: true });
-      const halo = glow(k, open, { x: CX, y: HINGE - 300, w: 1300, h: 900, role: "glowScreen", alpha: 0.42, name: "Screen glow" });
-      const scene = stage(k, open, s, { duration: LENGTHS[0], fps: 30, perspective: 2400 });
-      const laptop = rig(k, scene, s, "Laptop", LID.width, LID.height, CX, HINGE - LID.height / 2);
-      k.patch(laptop, { scaleX: 0.64, scaleY: 0.64, rotateX: -13, rotateY: -14, anchorY: 1 });
-      const deck = k.instance(laptop, "Laptop base", {}, { name: "Keyboard deck" });
-      k.patch(deck, { x: Math.round((LID.width - BASE.width) / 2), y: LID.height, anchorY: 0, rotateX: 90, effects: [deviceShadow(0.7, 60, 110)] });
-      const spill = k.rect(laptop, BASE.width - 120, 420, [k.gradient({ from: "glowScreen", to: "glowScreen", fromOpacity: 0.5, toOpacity: 0 })], { name: "Screen spill" });
-      k.patch(spill, { x: Math.round((LID.width - BASE.width) / 2) + 60, y: LID.height, anchorY: 0, rotateX: 90, z: 3 });
-      const hinge = k.group(laptop, { x: 0, y: 0, width: LID.width, height: LID.height }, { name: "Hinge" });
-      k.patch(hinge, { anchorY: 1, rotateX: 10 });
-      const display = k.instance(hinge, "Laptop lid", {}, { name: "Display" });
-      k.patch(display, { z: 2 });
-      const off = k.rect(hinge, SW, SH, "device", { radius: DESKTOP_SCREEN.radius, name: "Screen off" });
-      k.patch(off, { x: (LID.width - SW) / 2, y: 24, z: 4, opacity: 0 });
-      const outside = k.instance(hinge, "Laptop lid back", {}, { name: "Lid outside" });
-      k.patch(outside, { z: -2, rotateY: 180 });
-      const wake = [OPEN_AT + 900, OPENED + 300];
-      key(k, hinge, "rotateX", [[OPEN_AT, -90, ease.out("expo")], [OPENED, 10]]);
-      key(k, off, "opacity", [[0, 1, ease.hold], [wake[0], 1, ease.out("cubic")], [wake[1], 0]]);
-      key(k, spill, "opacity", [[0, 0, ease.hold], [wake[0], 0, ease.out("cubic")], [wake[1], 1]]);
-      key(k, halo, "opacity", [[0, 0, ease.hold], [wake[0], 0, ease.out("cubic")], [wake[1], 1]]);
-      key(k, laptop, "rotateX", [[0, -3, ease.inOut("cubic")], [OPENED + 600, -13, ease.inOut("sine")], [LENGTHS[0], -16]]);
-      key(k, laptop, "rotateY", [[0, 12, ease.inOut("cubic")], [OPENED + 600, -8, ease.inOut("sine")], [LENGTHS[0], -18]]);
-      key(k, scene, "scene3d.camera.z", [[0, 320, ease.inOut("cubic")], [OPENED + 600, 60, ease.inOut("sine")], [LENGTHS[0], -160]]);
-      const words = k.stack(open, { width: 640, gap: 26, name: "Title card", absolute: { x: 110, y: 250 } });
-      k.text(words, "FRIDAY 16:58 \xB7 main to production", { style: T("Stamp", 26, { fontWeight: 700, leading: 1.3, tracking: 0.08, ...MONO }), color: "onBackground", name: "Stamp" });
-      k.text(words, "Ship on Friday. Sleep on Friday.", { style: title(128), color: "text", name: "Title" });
-      k.text(words, "Halyard rolls out in stages, watches every region, and rolls back on its own.", { style: lede, color: "onBackground", name: "Title note", width: 560 });
-    }
-    {
-      const CX = s.W * 0.66, CY = s.H * 0.64;
-      lit(layers, { x: CX, y: CY - 60, pool: 1300, horizon: 930 });
-      const scene = stage(k, layers, s, { duration: LENGTHS[1], fps: 30, perspective: 3e3 });
-      const iso = rig(k, scene, s, "Isometric", SW, SH, CX, CY);
-      k.patch(iso, { rotateX: 57, scaleX: 0.86, scaleY: 0.86 });
-      const turn = k.group(iso, { x: 0, y: 0, width: SW, height: SH }, { name: "Turn" });
-      k.patch(turn, { rotation: -34 });
-      const X = SIDE + 36;
-      const edge = { color: "rim", width: 2, align: "INSIDE" };
-      k.rect(turn, SW, SH, "scr", { radius: 16, name: "Window", stroke: edge, effects: [deviceShadow(0.7, 50, 110)] });
-      const side = sidebar(turn, "Deploys");
-      k.patch(side, { x: 0, y: 0, cornerRadius: 16 });
-      const q = queue(turn, 3, { width: MAIN });
-      k.patch(q, { x: X, y: 500 });
-      const tr = traffic(turn, MAIN, 190);
-      k.patch(tr, { x: X, y: 250 });
-      const ti = tiles(turn, { width: MAIN });
-      k.patch(ti, { x: X, y: 70 });
-      const toast = k.stack(turn, { direction: "HORIZONTAL", width: "HUG", gap: 12, align: "CENTER", fill: "warn", radius: 12, padding: { top: 14, right: 22, bottom: 14, left: 18 }, name: "Rollback toast" });
-      k.ellipse(toast, 14, "onWarn", { name: "Toast dot" });
-      k.text(toast, "Rolled back to #481 in 4 s", { style: ui22(), color: "onWarn", autoWidth: true, name: "Toast words" });
-      k.patch(toast, { x: X + 40, y: SH - 110 });
-      const parts = [side, q, tr, ti, toast];
-      parts.forEach((id, i) => {
-        const z = LAYERS[i][0];
-        k.patch(id, { z, effects: [deviceShadow(0.55, 22, 46)], strokes: k.node(k.named(turn, "Window")[0]).strokes });
-        key(k, id, "z", [[LIFT + i * 200, 0, ease.back(1.2)], [LIFT + 1400 + i * 200, z]]);
-      });
-      key(k, turn, "rotation", [[0, -78, ease.inOut("cubic")], [SETTLED - 200, -34]]);
-      key(k, iso, "rotateX", [[0, 68, ease.inOut("cubic")], [SETTLED - 200, 57]]);
-      const doc = k.finish();
-      const frame = contextFrame(doc.nodes[scene]);
-      const cards = sceneLayers(doc.nodes, scene);
-      const seen = (id, x, y) => {
-        const card = cards.find((l) => l.id === id);
-        const p = transform4(mul4(frame.projection, mul4(frame.view, card.model)), x, y, 0);
-        return { x: p[0] / p[3], y: p[1] / p[3] };
-      };
-      const LX = 110;
-      const style = T("Leader", 36, { fontWeight: 700, leading: 1.2, tracking: -0.015 });
-      const ends = parts.map((id) => seen(id, 0, k.node(id).height / 2)).map((p, i) => ({ ...p, i })).sort((a, b) => a.y - b.y);
-      let last = 250;
-      for (const e of ends) {
-        const y = Math.max(last + 62, Math.min(820, Math.round(e.y)));
-        last = y;
-        const row = k.stack(layers, { direction: "HORIZONTAL", width: "HUG", gap: 16, align: "CENTER", name: "Leader", absolute: { x: LX, y: y - 22 } });
-        const words = k.text(row, LAYERS[e.i][1], { style, color: "text", autoWidth: true, name: "Leader name" });
-        const rule = k.rect(row, 20, 4, "primary", { name: "Leader rule", radius: 2 });
-        k.ellipse(row, 14, "primary", { name: "Leader end" });
-        k.patch(rule, { width: Math.max(40, Math.round(e.x - LX - k.finish().nodes[words].width - 16 * 2 - 14)) });
-      }
-      k.text(layers, "Nothing hidden. One layer deep.", { style: title(92), color: "text", width: 900, name: "Layers title", absolute: { x: LX, y: 70 } });
-    }
-    {
-      lit(wallSheet, { x: s.W * 0.6, y: s.H * 0.55, pool: 1700, horizon: 1200 });
-      const scene = stage(k, wallSheet, s, { duration: LENGTHS[2], fps: 30, perspective: 1500 });
-      const SCREENS = ["Screen / Deploys", "Screen / Regions", "Screen / Logs"];
-      const rows = 4, perRow = 9, gap = 90;
-      const wall = rig(k, scene, s, "Wall", SW, SH, s.W * 0.56, s.H * 0.5);
-      k.patch(wall, { scaleX: 0.5, scaleY: 0.5, rotateX: 48 });
-      const turn = k.group(wall, { x: 0, y: 0, width: SW, height: SH }, { name: "Wall turn" });
-      k.patch(turn, { rotation: -14 });
-      const pitch = SW + gap;
-      scrollingRows(k, turn, {
-        rows,
-        perRow,
-        card: DESKTOP_SCREEN,
-        gap,
-        offset: true,
-        wrap: SCREENS.length,
-        x: () => Math.round(-(perRow * pitch) / 2 + SW / 2),
-        y: (r) => Math.round((r - (rows - 1) / 2) * (SH + gap)),
-        rate: (r) => (r % 2 ? 1 : -1) * (260 + r % 3 * 90),
-        make: (row, r, i) => {
-          const card = k.instance(row, SCREENS[(i + r) % SCREENS.length], {}, { name: `Screen ${r + 1}.${i + 1}` });
-          k.patch(card, { effects: [deviceShadow(0.6, 30, 70)] });
-          return card;
-        }
-      });
-      key(k, wall, "rotateX", [[0, 58, ease.out("expo")], [1500, 48, ease.inOut("sine")], [LENGTHS[2], 44]]);
-      key(k, scene, "scene3d.camera.x", [[0, -620, ease.inOut("sine")], [LENGTHS[2], 620]]);
-      key(k, scene, "scene3d.camera.z", [[0, 500, ease.out("cubic")], [LENGTHS[2], -200]]);
-      k.rect(wallSheet, s.W, 460, [k.gradient({ from: "background", to: "background", fromOpacity: 0.8, toOpacity: 0 })], { name: "Distance", absolute: { x: 0, y: 0 } });
-      const plate = k.stack(wallSheet, { width: 860, gap: 22, fill: "background", radius: 28, padding: { top: 44, right: 52, bottom: 48, left: 52 }, stroke: { color: "rim", width: 2, align: "INSIDE" }, effects: [deviceShadow(0.7, 30, 80)], name: "Plate", absolute: { x: 110, y: 0 } });
-      k.text(plate, "Every deploy. Every region. Every log line.", { style: title(92), color: "text", name: "Wall title" });
-      k.text(plate, "Preview builds, staged rollouts and one-click rollback, for teams of one to fifty.", { style: lede, color: "onBackground", name: "Wall note" });
-      k.patch(plate, { y: Math.round(s.H - 96 - k.finish().nodes[plate].height) });
-    }
-    {
-      k.flowSheet(end, 0, 0, "background", "CENTER", "CENTER");
-      k.patch(end, { clipsContent: true });
-      k.timeline(end, { duration: LENGTHS[3], fps: 30 });
-      lit(end, { x: s.W / 2, y: 1040, pool: 1200, horizon: 900, shafts: false });
-      const col = column(s, 200);
-      const bigger = { ...s, u: 1.4 };
-      captionParts(k, bigger, { cta: "Start free at halyard.example" });
-      const card = endCard(k, end, bigger, { cta: "Start free at halyard.example", y: 0, width: col.width });
-      k.patch(card, { y: Math.max(70, Math.round((880 - k.finish().nodes[card].height) / 2)) });
-    }
-    playScenes(k, "comp-cinematic-trailer", "Product trailer, cinematic", sheets, scenes, "background");
-    k.setCover(open);
-    return withSound(k.finish(), { "comp-cinematic-trailer": B.audio });
-  }
-});
-
-export {
-  saas_film_cinematic_trailer_default
-};

package/dist/chunks/chunk-SVSPYPBN.js

@@ -1,23 +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 {
-  FAMILY
-} from "./chunk-GNV3K2JP.js";
-import {
-  tierStory
-} from "./chunk-NHELNUSY.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-WKDVCZ45.js";
-
-// templates/src/motion/festival-presale-family-tier.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var festival_presale_family_tier_default = tierStory(FAMILY);
-
-export {
-  festival_presale_family_tier_default
-};

package/dist/chunks/chunk-SWFI4JYK.js

@@ -1,106 +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 {
-  COMIC,
-  benday,
-  captionBox,
-  comicBrand,
-  hero,
-  impact,
-  inkShadow,
-  issueBox,
-  rays,
-  streaks,
-  villain
-} from "./chunk-LGXTJGAN.js";
-import {
-  background,
-  refill
-} from "./chunk-75T3CFTH.js";
-import {
-  MONO
-} from "./chunk-AXAAXHZF.js";
-import {
-  sizeOf
-} from "./chunk-LWSZATOL.js";
-import {
-  pill
-} from "./chunk-KOAJ6HD2.js";
-import {
-  defineTemplate
-} from "./chunk-KGT34R7C.js";
-import {
-  Kit,
-  preset
-} from "./chunk-L5DTT5DC.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-WKDVCZ45.js";
-
-// templates/src/social/comic-book-cover-preview.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-function furnish(k, sheet) {
-  const { w, h } = sizeOf(k, sheet);
-  refill(k, sheet);
-  for (const id of k.named(sheet, "Border")) k.patch(id, { x: 0, y: 0, width: w, height: h });
-  for (const id of k.named(sheet, "Art")) k.patch(id, { x: w - 1200, y: h - 630 });
-}
-var comic_book_cover_preview_default = defineTemplate({
-  id: "social-comic-book-cover-preview",
-  meta: {
-    name: "Comic cover link preview",
-    description: 'A link preview drawn as the cover of a comic: a red masthead with your product\u2019s name, an issue box in the corner, the cover line in a caption box, and cover art of the hero on focus lines knocking the bug across the page with "ROLLED BACK!" in an impact burst. 1200 \xD7 630, with a 1280 \xD7 640 GitHub social preview',
-    category: "social",
-    tags: ["comic book", "cover", "masthead", "halftone", "ben-day dots", "impact", "link preview", "open graph", "og image", "github", "launch", "saas", "devtools"],
-    platforms: ["web", "x", "linkedin", "facebook", "github"],
-    formats: ["og-image"],
-    useCases: ["launch", "announcement", "comic"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  build() {
-    const k = new Kit("Comic cover link preview", preset("og-image"));
-    k.quantizeGeometry = true;
-    comicBrand(k, { tagline: "THE BUG THAT ATE CHECKOUT" });
-    k.textStyle("Masthead 104", { size: 104, fontWeight: 900, letterSpacing: -5, lineHeight: 96, textCase: "UPPER" });
-    k.textStyle("Issue 30", { size: 30, fontWeight: 900, letterSpacing: -0.5, lineHeight: 32 });
-    k.textStyle("Issue small 14", { ...MONO, size: 16, fontWeight: 800, letterSpacing: 0.5, lineHeight: 18 });
-    k.textStyle("Line 44", { size: 44, fontWeight: 900, letterSpacing: -1.6, lineHeight: 46 });
-    k.textStyle("Box 22", { size: 22, fontWeight: 800, letterSpacing: 0.3, lineHeight: 28 });
-    k.textStyle("Sound 84", { size: 84, fontWeight: 900, letterSpacing: -3.4, lineHeight: 76, textAlign: "CENTER" });
-    k.textStyle("Site 20", { ...MONO, size: 20, fontWeight: 800, lineHeight: 26 });
-    pill(k, "Label", { fill: "card", ink: "onCard", style: "Site 20", label: "{{brand.site}}", pad: [10, 18], radius: 0 });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 18, { top: 0, right: 0, bottom: 40, left: 0 }, "accent", "SPACE_BETWEEN", "MIN");
-    k.patch(sheet, { clipsContent: true });
-    background(k, sheet, "accent");
-    const art = k.frame(sheet, { x: 0, y: 0, width: 1200, height: 630 }, { name: "Art" });
-    rays(k, art, 1200, 630, { cx: 820, cy: 400, role: "primary", n: 46, inner: 250, seed: 12, thick: 0.9 });
-    benday(k, art, 520, 630, { role: "primary", dot: 20, angle: 180, from: 0, to: 0.6 });
-    villain(k, art, 250, { name: "Bug", absolute: { x: 950, y: 160 }, deg: 150 });
-    streaks(k, art, 260, 160, { role: "ink", n: 6, seed: 9, dir: -1, x: 700, y: 200 });
-    impact(k, art, 500, 270, "Rolled back!", { style: "Sound 84", fill: "primary", ink: "onPrimary", deg: -5, name: "Rolled back", seed: 21, points: 18, depth: 0.25, shadow: 12, line: 7, absolute: { x: 670, y: 345 } });
-    hero(k, art, 470, { name: "Hero", absolute: { x: 400, y: 150 }, deg: 10 });
-    const band = k.stack(sheet, { direction: "HORIZONTAL", gap: 28, align: "CENTER", fill: "primary", padding: { top: 22, right: 48, bottom: 22, left: 48 }, stroke: { color: "ink", width: 7, align: "INSIDE", join: "MITER" }, name: "Masthead band" });
-    issueBox(k, band, { number: "Issue 30", small: "Issue small 14", price: "OCT \xB7 FREE" });
-    k.text(band, "{{brand.name}}", { style: "Masthead 104", color: "onPrimary", name: "Masthead", effects: inkShadow(k, 7) });
-    k.instance(band, "Label", { Label: "{{brand.site}}" }, { name: "Site" });
-    const copy = k.stack(sheet, { gap: 16, width: 430, padding: { top: 0, right: 0, bottom: 0, left: 48 }, name: "Copy" });
-    const line = k.stack(copy, { fill: "card", stroke: { color: "ink", width: 5, align: "INSIDE", join: "MITER" }, padding: { top: 14, right: 18, bottom: 16, left: 18 }, effects: inkShadow(k, 8), name: "Cover line box" });
-    k.text(line, "{{brand.tagline}}", { style: "Line 44", color: "onCard", name: "Cover line" });
-    captionBox(k, copy, `Auto-rollback is here. A bad deploy is undone in ${COMIC.seconds} seconds.`, { style: "Box 22", width: "FILL", name: "Promise" });
-    k.rect(sheet, 1200, 630, [], { name: "Border", stroke: { color: "ink", width: 10, align: "INSIDE", join: "MITER" }, absolute: { x: 0, y: 0 } });
-    k.variants(sheet, [{ preset: "github-social", adjust: (kit, id) => furnish(kit, id) }]);
-    furnish(k, sheet);
-    return k.finish();
-  }
-});
-
-export {
-  comic_book_cover_preview_default
-};