@popcraft/kit 0.26.1 → 0.28.0

package/dist/chunks/chunk-UY3CLQDP.js

@@ -1,272 +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 {
-  SERVICES,
-  SPANWISE,
-  body,
-  code,
-  dataBrand,
-  dataButton,
-  display,
-  extendSparks,
-  figure,
-  filterChip,
-  heatMap,
-  kpiRow,
-  label,
-  lockup,
-  panel,
-  rangePicker,
-  resort,
-  servicesTable,
-  sortedByP99,
-  spikeRow,
-  ts,
-  widenConsole
-} from "./chunk-23QLVI6N.js";
-import {
-  camera,
-  float,
-  reelCuts,
-  reelSheet,
-  section,
-  wideCut
-} from "./chunk-D7LV62QH.js";
-import {
-  clicks,
-  glide,
-  pointer
-} from "./chunk-L23WDECU.js";
-import {
-  captionStrip,
-  captionSwap
-} from "./chunk-C7BYFVZT.js";
-import {
-  hide,
-  restyle
-} from "./chunk-QLV6445V.js";
-import {
-  defineTemplate
-} from "./chunk-QBBW3JXO.js";
-import {
-  Kit,
-  preset
-} from "./chunk-SOHOKD4X.js";
-import {
-  ease
-} from "./chunk-NKAPBBXH.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/motion/style-data-launch-reel.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var S = section("tension", 0, 8);
-var { beat } = S;
-var NAME = "Data SaaS launch reel";
-var WIN = { w: 800, h: 680 };
-var ROW_H = 60;
-var ROWS = 150;
-var SPIKE = beat(8);
-var PUSH = beat(9);
-var SORT = beat(14);
-var FIX = beat(20);
-var CLOSE = beat(24);
-var HOOKS = ["Checkout just got 13\xD7 slower.", "Spanwise flagged it in 38 seconds.", "See the regression before your customers do."];
-var KICKERS = [`${SPANWISE.service} \xB7 ${SPANWISE.region} \xB7 ${SPANWISE.at}`, `cause: ${SPANWISE.deploy}, deployed 14:02:11`, `${SPANWISE.name} ${SPANWISE.version} \xB7 observability at scale`];
-var ROWS_SHOWN = SERVICES.slice(0, 6);
-var TABLE_TOP = 56 + 1 + 52 + 116 + 1 + 36 + 1;
-var ANOMALY = ROWS_SHOWN.findIndex((s) => s.anomaly);
-var SHOTS = [
-  { t: PUSH, duration: 700, zoom: 1.4, x: 286, y: TABLE_TOP + ANOMALY * ROW_H + ROW_H / 2 },
-  { t: beat(13), duration: 700, zoom: 1 }
-];
-var cues = [
-  { layer: "Brand row", preset: "fade-in", at: 0, params: { duration: 500 } },
-  { layer: "Hook", preset: "words-in", at: 0, params: { duration: 650 } },
-  { layer: "Hook kicker", preset: "typewriter", at: 150, params: { duration: 700 } },
-  { layer: ["Service row", "Anomaly row"], preset: "slide-in", at: ROWS, stagger: { delay: 90, order: "selection" }, params: { direction: "left", distance: 60, duration: 450 } },
-  { layer: "Heat cell", preset: "fade-in", at: 100, stagger: { delay: 4, order: "selection" }, params: { duration: 260 } },
-  { layer: "Hot cell", preset: "pop-in", at: SPIKE, stagger: { delay: 70, order: "selection" }, params: { duration: 360 } },
-  { layer: "Sort chip", preset: "pop-in", at: SORT, params: { duration: 420 } },
-  { layer: "Toast", preset: "pulse", at: beat(17), params: { duration: 800, amount: 0.03 } },
-  { layer: "Call", preset: "pulse", at: CLOSE + beat(2), params: { duration: 1600, amount: 0.05 } }
-];
-var counts = [
-  { layer: "Requests figure", at: ROWS, duration: beat(6), counter: { from: 48.1, to: 52.6, decimals: 1, suffix: "k" } },
-  { layer: "Apdex figure", at: SPIKE, duration: beat(2), counter: { from: 0.97, to: 0.81, decimals: 2, value: 0.96 } }
-];
-var swaps = [captionSwap(["Checkout went 13\xD7 slower, instantly.", "Spanwise flagged it in seconds.", "It named the guilty deploy.", "Rolled back before customers noticed."], 0, S.duration - 30, { stagger: 50, in: 240, out: 180, rise: 10 })];
-var style_data_launch_reel_default = defineTemplate({
-  id: "motion-saas-style-data-launch-reel",
-  meta: {
-    name: NAME,
-    description: "A 16-second launch video in a data-dense enterprise look for an observability platform: a live services console with sparklines in every row, KPI tiles that tick and a heat map that lights cell by cell. A checkout service spikes from 182 ms to 2,340 ms, the row is flagged and the camera pushes in, a sort by p99 slides the rows to new places and a rollback brings it back. Semantic colour only, tabular figures, music and burned-in captions. 9:16 with square, 4:5 and 16:9 cuts",
-    category: "animation",
-    tags: ["animation", "saas", "data", "dashboard", "enterprise", "observability", "devops", "b2b", "table", "heat map", "sparkline", "launch", "reel", "counter", "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;
-    dataBrand(k);
-    ts(k, "Brand 30", display(30));
-    ts(k, "Live 18", label(18));
-    ts(k, "Kicker 22", code(22));
-    ts(k, "Hook 60", display(60, { lead: 1.08 }));
-    ts(k, "Hook 50", display(50, { lead: 1.08 }));
-    ts(k, "Hook 68", display(68, { lead: 1.08 }));
-    ts(k, "Panel 20", label(20));
-    ts(k, "Panel sub 18", code(18));
-    ts(k, "Chip 18", code(18));
-    ts(k, "Head 16", label(16));
-    ts(k, "Name 22", code(22));
-    ts(k, "Sub 17", code(17));
-    ts(k, "Cell 22", figure(22, 500));
-    ts(k, "Kpi fig 36", figure(36));
-    ts(k, "Delta 17", figure(17, 600));
-    ts(k, "Toast 19", body(19, 500));
-    ts(k, "Caption 34", display(34, { lead: 1.3 }));
-    ts(k, "Button 28", display(28));
-    ts(k, "Site 22", code(22));
-    dataButton(k, "Call", { style: "Button 28", label: "Start a 14-day trial", pad: [20, 32] });
-    dataButton(k, "Mini", { style: "Panel sub 18", label: "Roll back", pad: [8, 14] });
-    const sheet = reelSheet(k, S, { name: "Launch reel", gap: 22, justify: "MIN" });
-    heatMap(k, sheet, { cols: 36, rows: 14, cell: 26, gap: 4, hotRow: 4, hotCol: 28, name: "Heat foot", absolute: { x: 2, y: 1474 }, dim: 0.85 });
-    const brandRow = k.stack(sheet, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Brand row" });
-    lockup(k, brandRow, { size: 44, style: "Brand 30" });
-    const live = k.stack(brandRow, { direction: "HORIZONTAL", width: "HUG", gap: 10, align: "CENTER", name: "Live" });
-    const liveDot = k.ellipse(live, 10, "up", { name: "Live dot" });
-    k.text(live, `LIVE \xB7 ${SPANWISE.regions} REGIONS`, { style: "Live 18", color: "onPaper", autoWidth: true, name: "Live words" });
-    const hookBox = k.stack(sheet, { gap: 10, name: "Hook box" });
-    const kicker = k.text(hookBox, KICKERS[0], { style: "Kicker 22", color: "onPaper", name: "Hook kicker" });
-    const hook = k.text(hookBox, HOOKS[0], { style: "Hook 60", color: "text", name: "Hook" });
-    const stage = k.stack(sheet, { width: WIN.w, height: WIN.h, clip: true, radius: 10, name: "Stage" });
-    const cam = k.frame(stage, { x: 0, y: 0, width: WIN.w, height: WIN.h }, { name: "Camera" });
-    const win = panel(k, cam, { width: WIN.w, height: WIN.h, name: "Console", absolute: { x: 0, y: 0 } });
-    const bar = k.stack(win, { direction: "HORIZONTAL", height: 56, align: "CENTER", justify: "SPACE_BETWEEN", padding: { top: 0, right: 20, bottom: 0, left: 20 }, name: "Title bar" });
-    const tl = k.stack(bar, { direction: "HORIZONTAL", width: "HUG", gap: 12, align: "CENTER", name: "Title left" });
-    k.text(tl, "SERVICES", { style: "Panel 20", color: "onCard", autoWidth: true, name: "Panel title" });
-    k.text(tl, `prod \xB7 ${SPANWISE.services.toLocaleString("en-US")} services`, { style: "Panel sub 18", color: "cardMuted", autoWidth: true, name: "Panel sub" });
-    rangePicker(k, bar, "Last 15 min", { style: "Chip 18" });
-    k.rect(win, "FILL", 1, "line", { name: "Bar rule" });
-    const chips = k.stack(win, { direction: "HORIZONTAL", height: 52, gap: 8, align: "CENTER", padding: { top: 0, right: 20, bottom: 0, left: 20 }, name: "Chips" });
-    filterChip(k, chips, "env", "prod", { style: "Chip 18" });
-    filterChip(k, chips, "team", "commerce", { style: "Chip 18" });
-    filterChip(k, chips, "region", "all", { style: "Chip 18" });
-    filterChip(k, chips, "sort", "p99 \u2193", { style: "Chip 18", on: true, name: "Sort chip" });
-    const kpis = kpiRow(k, win, [
-      { label: "REQUESTS/S", value: "52.6k", delta: "\u2191 3.1% vs 1 h", tone: "up", name: "Requests figure" },
-      { label: "ERROR RATE", value: "0.42%", delta: "steady", tone: "warn", name: "Errors figure" },
-      { label: "P99, CHECKOUT", value: "182 ms", delta: "steady", tone: "warn", name: "P99 figure" },
-      { label: "APDEX", value: "0.96", delta: "target 0.94", tone: "up", name: "Apdex figure" }
-    ], { labelStyle: "Head 16", figStyle: "Kpi fig 36", deltaStyle: "Delta 17", figW: 164 });
-    for (const t of k.named(kpis.row, "Kpi tile")) k.patch(t, { height: 116 });
-    k.rect(win, "FILL", 1, "line", { name: "Kpi rule bottom" });
-    const table = servicesTable(k, win, { w: WIN.w, rowH: ROW_H, rows: ROWS_SHOWN, cols: ["service", "p99", "err", "trend", "state"], widths: { p99: 124, err: 92, trend: 168, state: 16 }, styles: { head: "Head 16", name: "Name 22", sub: "Sub 17", fig: "Cell 22" }, sortCaret: true });
-    k.rect(win, "FILL", 1, "line", { name: "Toast rule" });
-    const toast = k.stack(win, { direction: "HORIZONTAL", height: 56, gap: 12, align: "CENTER", justify: "SPACE_BETWEEN", padding: { top: 0, right: 20, bottom: 0, left: 20 }, fill: "well", name: "Toast" });
-    const toastWords = k.text(toast, "Rolled back at 14:06 \xB7 checkout-api p99 182 ms", { style: "Toast 19", color: "onCard", width: 560, name: "Toast words" });
-    k.instance(toast, "Mini", { Label: "Roll back" }, { name: "Roll back" });
-    captionStrip(k, sheet, swaps[0].words[0], { style: "Caption 34", fill: "card", ink: "onCard", radius: 10, pad: [18, 26], stroke: { color: "line", width: 1, align: "INSIDE" } });
-    const call = k.stack(sheet, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", name: "Close row" });
-    k.instance(call, "Call", { Label: "Start a 14-day trial" }, { name: "Call" });
-    k.text(call, "{{brand.site}}", { style: "Site 22", color: "onPaper", autoWidth: true, name: "Site" });
-    k.counts(sheet, counts);
-    k.swaps(sheet, swaps);
-    k.cues(sheet, cues);
-    extendSparks(k, table.rows, ROWS, beat(7));
-    const anomaly = table.rows[ANOMALY];
-    spikeRow(k, anomaly, SPIKE, { recover: FIX, loop: true });
-    resort(k, table.rows, sortedByP99(ROWS_SHOWN), ROW_H, SORT + 200, { duration: 650 });
-    if (table.caret) k.animate(table.caret, "opacity", [{ t: SORT, v: 0, ease: ease.out("cubic") }, { t: SORT + 300, v: 1 }]);
-    const redDot = k.ellipse(k.node(anomaly.dot).parentId, 10, "down", { name: "Down dot", absolute: { x: 6, y: Math.round(ROW_H / 2 - 5) } });
-    k.patch(k.node(anomaly.dot).parentId, { primaryAxisAlignItems: "MAX" });
-    k.animate(redDot, "opacity", [{ t: SPIKE, v: 0, ease: ease.hold }, { t: SPIKE + 1, v: 1, ease: ease.hold }, { t: FIX + 400, v: 1, ease: ease.inOut("sine") }, { t: FIX + 700, v: 0 }]);
-    k.patch(redDot, { opacity: 0 });
-    const p99Fig = k.named(win, "P99 figure")[0], p99Delta = k.named(win, "P99 figure delta")[0];
-    const errFig = k.named(win, "Errors figure")[0], errDelta = k.named(win, "Errors figure delta")[0];
-    const ticks = (_id, vals, at, step = 90) => vals.map((v, i) => ({ t: at + i * step, v, ease: ease.hold }));
-    const strip = (keys) => {
-      delete keys[keys.length - 1].ease;
-      return keys;
-    };
-    k.animate(p99Fig, "text.content", strip([...ticks(p99Fig, ["182 ms", "390 ms", "860 ms", "1,480 ms", "2,340 ms"], SPIKE + 60), ...ticks(p99Fig, ["1,720 ms", "940 ms", "410 ms", "236 ms", "182 ms"], FIX)]));
-    k.patch(p99Fig, { characters: "182 ms" });
-    k.animate(p99Delta, "text.content", strip([{ t: 0, v: "steady", ease: ease.hold }, { t: SPIKE + 300, v: "\u2191 12.9\xD7 at 14:02", ease: ease.hold }, { t: FIX + 400, v: "down from 2,340 at 14:06" }]));
-    k.patch(p99Delta, { characters: "down from 2,340 at 14:06" });
-    k.animate(errFig, "text.content", strip([...ticks(errFig, ["0.42%", "0.9%", "1.6%", "1.9%"], SPIKE + 120), ...ticks(errFig, ["1.2%", "0.6%", "0.44%"], FIX + 60)]));
-    k.patch(errFig, { characters: "0.44%" });
-    k.animate(errDelta, "text.content", strip([{ t: 0, v: "steady", ease: ease.hold }, { t: SPIKE + 300, v: "\u2191 4.5\xD7 at 14:02", ease: ease.hold }, { t: FIX + 400, v: "down from 1.9% at 14:06" }]));
-    k.patch(errDelta, { characters: "down from 1.9% at 14:06" });
-    const ALARM = [SPIKE + 300, FIX + 400];
-    const redTwin = (amber, words) => {
-      const tile = k.node(amber).parentId;
-      const red = k.text(tile, words, { style: "Delta 17", color: "down", autoWidth: true, name: "Alarm delta", absolute: { x: 18, y: 84 } });
-      const swap = (on, off) => [{ t: ALARM[0] - 1, v: off, ease: ease.hold }, { t: ALARM[0], v: on, ease: ease.hold }, { t: ALARM[1] - 1, v: on, ease: ease.hold }, { t: ALARM[1], v: off }];
-      k.animate(red, "opacity", swap(1, 0));
-      k.animate(red, "text.content", [{ t: ALARM[0] - 1, v: "", ease: ease.hold }, { t: ALARM[0], v: words, ease: ease.hold }, { t: ALARM[1], v: "" }]);
-      k.patch(red, { characters: "" });
-      k.animate(amber, "opacity", swap(0, 1));
-    };
-    redTwin(p99Delta, "\u2191 12.9\xD7 at 14:02");
-    redTwin(errDelta, "\u2191 4.5\xD7 at 14:02");
-    k.animate(toastWords, "text.content", strip([
-      { t: 0, v: "No regressions in the last 15 min", ease: ease.hold },
-      { t: SPIKE + 900, v: `Likely cause: ${SPANWISE.deploy}, 38 s before`, ease: ease.hold },
-      { t: FIX + 300, v: "Rolled back at 14:06 \xB7 checkout-api p99 182 ms" }
-    ]));
-    k.animate(hook, "text.content", strip([{ t: 0, v: HOOKS[0], ease: ease.hold }, { t: beat(10), v: HOOKS[1], ease: ease.hold }, { t: CLOSE, v: HOOKS[2] }]));
-    k.animate(kicker, "text.content", strip([{ t: 0, v: KICKERS[0], ease: ease.hold }, { t: beat(10), v: KICKERS[1], ease: ease.hold }, { t: CLOSE, v: KICKERS[2] }]));
-    for (const id of [hook, kicker]) k.animate(id, "opacity", [
-      { t: beat(10) - 300, v: 1, ease: ease.out("cubic") },
-      { t: beat(10) - 40, v: 0, ease: ease.hold },
-      { t: beat(10), v: 0, ease: ease.out("cubic") },
-      { t: beat(10) + 400, v: 1, ease: ease.hold },
-      { t: CLOSE - 300, v: 1, ease: ease.out("cubic") },
-      { t: CLOSE - 40, v: 0, ease: ease.hold },
-      { t: CLOSE, v: 0, ease: ease.out("cubic") },
-      { t: CLOSE + 400, v: 1 }
-    ]);
-    k.animate(liveDot, "opacity", strip(Array.from({ length: S.beats + 1 }, (_, i) => ({ t: beat(i), v: i % 2 ? 0.35 : 1, ease: ease.hold }))));
-    const hand = pointer(k, cam, { x: 736, y: 652, size: 40, fill: "onCard", edge: "well", ring: "primary" });
-    glide(k, hand, [{ t: beat(18), dx: 160, dy: 120 }, { t: FIX - 200, dx: 0, dy: 0 }]);
-    clicks(k, hand, [FIX - 100]);
-    camera(k, cam, WIN.w, WIN.h, SHOTS);
-    k.variants(sheet, [...reelCuts({ post: 48, portrait: 60 }, {
-      post: (kit, id) => {
-        kit.patch(id, { itemSpacing: 18, counterAxisSpacing: 18, padding: { top: 44, right: 40, bottom: 44, left: 40 } });
-        hide(kit, id, ["Heat foot", "Brand row"]);
-        widenConsole(kit, id, 200);
-        for (const n of ["Pointer", "Click ring"]) for (const h of kit.named(id, n)) kit.patch(h, { x: kit.node(h).x + 200 });
-        restyle(kit, id, "Hook", "Hook 50");
-      },
-      portrait: (kit, id) => {
-        kit.patch(id, { itemSpacing: 26, counterAxisSpacing: 26, padding: { top: 64, right: 140, bottom: 64, left: 140 }, primaryAxisAlignItems: "SPACE_BETWEEN" });
-        hide(kit, id, ["Heat foot"]);
-      }
-    }), wideCut(700, (kit, id, right) => {
-      kit.patch(id, { primaryAxisAlignItems: "MIN" });
-      const s = Math.min(right.width / WIN.w, right.height / WIN.h, 1.2);
-      float(kit, id, "Stage", right.x + Math.round((right.width - WIN.w * s) / 2), right.y + Math.round((right.height - WIN.h * s) / 2), { scale: s });
-      for (const h of kit.named(id, "Heat foot")) kit.patch(h, { x: 110, y: 640, scaleX: 0.65, scaleY: 0.65, anchorX: 0, anchorY: 0 });
-      restyle(kit, id, "Hook", "Hook 68");
-    })]);
-    k.setCover(sheet);
-    return k.finish();
-  }
-});
-
-export {
-  style_data_launch_reel_default
-};

package/dist/chunks/chunk-UYAA3T6B.js

@@ -1,120 +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 {
-  brand,
-  column,
-  glow,
-  phrases,
-  rig,
-  sizes,
-  stage,
-  typeStep
-} from "./chunk-5RBWERLP.js";
-import {
-  key
-} from "./chunk-FAAVZ2GX.js";
-import {
-  PHONE,
-  TABLET,
-  deviceShadow,
-  devices
-} from "./chunk-SKMGZGNY.js";
-import {
-  appScreens
-} from "./chunk-7LNASDR7.js";
-import {
-  defineTemplate
-} from "./chunk-QBBW3JXO.js";
-import {
-  Kit,
-  preset
-} from "./chunk-SOHOKD4X.js";
-import {
-  ease
-} from "./chunk-NKAPBBXH.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/motion3d/app-store-preview.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var DURATION = 15e3;
-var FPS = 30;
-var BEAT = 3e3;
-var FLIP = 700;
-var SIZES = ["video-app-preview-iphone", "video-app-preview-ipad"];
-var BEATS = [
-  ["Screen / Welcome", "Money, sorted."],
-  ["Screen / Home", "All your accounts in one place"],
-  ["Screen / Insights", "See where every dollar goes"],
-  ["Screen / Goals", "Save for the things you love"],
-  ["Screen / Send", "Split the bill in seconds"]
-];
-var STILL = 1;
-var CUES = [{ layer: "Headline", preset: "rise-in", at: 150, params: { duration: 700 } }];
-function build(k, sheet, s) {
-  const ipad = s.preset === "video-app-preview-ipad";
-  k.nameSheet(sheet, `App Store preview \xB7 ${preset(s.preset).name}`);
-  glow(k, sheet, "accent", Math.round(900 * s.u), s.W * 0.5, s.H * 0.66, 0.3);
-  const scene = stage(k, sheet, s, { duration: DURATION, fps: FPS, perspective: 2600 * s.u, ground: "primary" });
-  if (ipad) {
-    const tablet = rig(k, scene, s, "Tablet", TABLET.width, TABLET.height, s.W * 0.46, s.H * 0.61);
-    k.patch(tablet, { scaleX: 0.84, scaleY: 0.84, rotateY: 14, rotateX: 4 });
-    const t = k.instance(tablet, "Tablet", {}, { name: "iPad" });
-    k.patch(t, { effects: [deviceShadow(0.35, 40, 90)] });
-    key(k, tablet, "rotateY", [...BEATS.map((_, i) => [i * BEAT, i % 2 ? -8 : 14, ease.inOut("cubic")]), [DURATION, 10]]);
-  }
-  const at = ipad ? { x: s.W * 0.76, y: s.H * 0.7, scale: 0.62 } : { x: s.W / 2, y: s.H * 0.585, scale: 1.16 };
-  const phoneRig = rig(k, scene, s, "Phone", PHONE.width, PHONE.height, at.x, at.y);
-  k.patch(phoneRig, { scaleX: at.scale, scaleY: at.scale, ...ipad ? { z: 220 } : {} });
-  k.behave(phoneRig, "rotateY", [{ kind: "sine", amp: 9, freq: 1 / 6 }]);
-  k.behave(phoneRig, "rotateX", [{ kind: "sine", amp: 4, freq: 1 / 5, phase: 0.25 }]);
-  BEATS.forEach(([screen], i) => {
-    const phone = k.instance(phoneRig, "Phone", { Screen: { swap: screen } }, { name: `Beat ${i + 1}` });
-    k.patch(phone, { effects: [deviceShadow(0.4, 40, 80)], ...i === STILL ? {} : { opacity: 0 } });
-    const start = i * BEAT, end = (i + 1) * BEAT;
-    const inKeys = i === 0 ? [[0, 0, ease.hold]] : [[start, 90, ease.out("cubic")], [start + FLIP / 2, 0, ease.hold]];
-    const outKeys = i === BEATS.length - 1 ? [] : [[end - FLIP / 2, 0, ease.named("cubic", "in")], [end, -90, ease.hold]];
-    key(k, phone, "rotateY", [...inKeys, ...outKeys]);
-    const on = start, off = i === BEATS.length - 1 ? DURATION : end;
-    key(k, phone, "opacity", [[0, i === 0 ? 1 : 0, ease.hold], ...i === 0 ? [] : [[on, 1, ease.hold]], ...off < DURATION ? [[off, 0, ease.hold]] : []]);
-  });
-  key(k, phoneRig, "translateY", [[0, k.node(phoneRig).translateY + Math.round(900 * s.u), ease.out("expo")], [1100, k.node(phoneRig).translateY]]);
-  const col = column(s, 80);
-  const head = k.stack(sheet, { width: col.width, align: "CENTER", absolute: { x: col.x, y: Math.round((ipad ? 110 : 150) * s.u) }, name: "Headline" });
-  const line = k.text(head, BEATS[STILL][1], { style: typeStep(k, s, "display"), color: "onPrimary", align: "CENTER", name: "Headline title" });
-  phrases(k, line, BEATS.map(([, l], i) => [i * BEAT, l]), { rise: Math.round(30 * s.u) });
-  k.cues(sheet, CUES);
-}
-var app_store_preview_default = defineTemplate({
-  id: "motion-3d-app-store-preview",
-  meta: {
-    name: "App Store preview",
-    description: "A 15-second App Store preview at the iPhone (886 \xD7 1920) and iPad (1200 \xD7 1600) sizes, 30 fps: five three-second beats, each a headline on your app's colour over a 3D phone that flips to the next screen. Swap in your screens or screen recordings",
-    category: "animation",
-    tags: ["animation", "3d", "app store", "app preview", "ios", "iphone", "ipad", "phone", "mockup", "launch"],
-    platforms: ["ios", "web"],
-    formats: ["video", "ad"],
-    useCases: ["launch", "onboarding"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  motion: { cues: CUES },
-  build() {
-    const k = new Kit("App Store preview", preset(SIZES[0]));
-    brand(k, "light");
-    appScreens(k, ["Welcome", "Home", "Insights", "Goals", "Send", "Tablet", "Screenshot"]);
-    devices(k, ["Phone", "Tablet"]);
-    const [cover] = sizes(k, SIZES, (sheet, s) => build(k, sheet, s));
-    k.setCover(cover);
-    return k.finish();
-  }
-});
-
-export {
-  app_store_preview_default
-};

package/dist/chunks/chunk-V3LQLKM6.js

@@ -1,170 +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 {
-  Deck,
-  WIDE,
-  cuesFor
-} from "./chunk-WKKRQKXU.js";
-import {
-  blackShadow
-} from "./chunk-HVK5T4I5.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/saas/email-decks-shared.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var ARIAL = { fontFamily: "Arial" };
-var GEORGIA = { fontFamily: "Georgia" };
-var COURIER = { fontFamily: "Courier New" };
-var MAIL_FPS = 30;
-var MAIL_W = 600;
-var pad4 = ([top, right, bottom, left]) => ({ top, right, bottom, left });
-function mailSheet(k, o) {
-  const sheet = k.sheet;
-  k.flowSheet(sheet, 0, 0, o.paper, "MIN", "MIN");
-  k.patch(sheet, { clipsContent: true });
-  k.timeline(sheet, { duration: o.duration, fps: MAIL_FPS });
-  return sheet;
-}
-function mailHeader(k, sheet, height, fill, name = "Header") {
-  return k.stack(sheet, { height, fill, clip: true, name });
-}
-function section(k, sheet, o) {
-  return k.stack(sheet, { name: o.name, padding: pad4(o.pad), gap: o.gap ?? 0, ...o.fill ? { fill: o.fill } : {}, ...o.align ? { align: o.align } : {} });
-}
-function mailButton(k, name, o) {
-  k.component(name, { direction: "HORIZONTAL", width: o.width, height: o.height ?? 48, fill: o.fill, align: "CENTER", justify: "CENTER", props: { Label: o.label } }, (id) => {
-    k.propText(id, "Label", { style: o.style, color: o.ink, autoWidth: true });
-  });
-}
-function callToAction(k, sheet, o) {
-  const s = section(k, sheet, { name: "Call to action", pad: o.pad, gap: o.gap ?? 14, align: "CENTER", ...o.fill ? { fill: o.fill } : {} });
-  k.instance(s, o.button, { Label: o.label }, { name: "Button" });
-  if (o.note) k.text(s, o.note, { style: o.noteStyle, color: o.noteInk, align: "CENTER", name: "Button note" });
-  return s;
-}
-function mailFooter(k, sheet, o) {
-  const s = section(k, sheet, { name: "Footer", pad: o.pad ?? [24, 40, 32, 40], gap: 6, ...o.fill ? { fill: o.fill } : {} });
-  if (o.rule) {
-    k.rect(s, "FILL", 1, o.rule, { name: "Footer rule" });
-    k.rect(s, "FILL", 10, o.fill ?? "paper", { name: "Footer space" });
-  }
-  const t = { style: o.style, color: o.ink, align: o.align ?? "LEFT" };
-  k.text(s, o.why, { ...t, name: "Why" });
-  k.text(s, "{{brand.company}} \xB7 {{brand.address}}", { ...t, name: "Address" });
-  k.text(s, o.links ?? "Unsubscribe \xB7 Email preferences", { ...t, name: o.links ? "Account email" : "Unsubscribe" });
-  return s;
-}
-function mailRow(k, parent, o) {
-  return k.stack(parent, { direction: "HORIZONTAL", name: o.name, gap: o.gap ?? 0, align: o.align ?? "MIN", ...o.fill ? { fill: o.fill } : {}, ...o.padding !== void 0 ? { padding: o.padding } : {} });
-}
-function tag(k, parent, label, o) {
-  const [v, h] = o.pad ?? [3, 8];
-  const box = k.stack(parent, { direction: "HORIZONTAL", width: "HUG", fill: o.fill, padding: { top: v, right: h, bottom: v, left: h }, name: o.name ?? "Tag" });
-  k.text(box, label, { style: o.style, color: o.ink, autoWidth: true, name: "Tag label" });
-  return box;
-}
-function finishMail(k, sheet) {
-  k.finish();
-  const s = k.node(sheet);
-  const bottom = Math.max(...s.childIds.map((id) => k.node(id)).filter((n) => n.layoutPositioning !== "ABSOLUTE").map((n) => n.y + n.height));
-  k.patch(sheet, { height: Math.ceil(bottom), layoutSizingVertical: "HUG" });
-  return k.finish();
-}
-function swell(k, id, path, o) {
-  k.behave(id, path, [{ kind: "sine", amp: o.amp, freq: (o.cycles ?? 1) * 1e3 / o.loopMs, ...o.phase !== void 0 ? { phase: o.phase } : {} }]);
-}
-var drop = (a = 0.18, y = 10, blur = 28) => blackShadow(a, y, blur);
-function fitted(paths) {
-  const all = paths.flatMap((p) => p.points.flatMap((q) => [q, ...q.handleIn ? [q.handleIn] : [], ...q.handleOut ? [q.handleOut] : []]));
-  const x = Math.min(...all.map((q) => q.x)), y = Math.min(...all.map((q) => q.y));
-  const move = (q) => ({ ...q, x: q.x - x, y: q.y - y });
-  return {
-    x,
-    y,
-    width: Math.max(...all.map((q) => q.x)) - x,
-    height: Math.max(...all.map((q) => q.y)) - y,
-    paths: paths.map((p) => ({ ...p, points: p.points.map((q) => ({ ...move(q), ...q.handleIn ? { handleIn: move(q.handleIn) } : {}, ...q.handleOut ? { handleOut: move(q.handleOut) } : {} })) }))
-  };
-}
-function deckType(k, faces) {
-  for (const [name, s] of Object.entries(faces)) {
-    const size = Number(name.split(" ").pop());
-    k.textStyle(name, { size, lineHeight: Math.round(size * 1.15), ...s });
-  }
-}
-var specOf = (s) => "spec" in s ? s.spec : { kind: "points", name: s.canvas.name, heading: s.canvas.heading, points: [] };
-var founderCues = (slides) => slides.map((s) => {
-  const spec = specOf(s);
-  return { slide: spec.name, cues: [...cuesFor(spec), ...s.extra ?? []] };
-});
-var SLIDE = { width: 1920 - WIDE.pad.left - WIDE.pad.right, area: 1080 - WIDE.pad.top - WIDE.pad.bottom - Math.round(72 * 1.12) - WIDE.gap, full: { w: 1920, h: 1080 }, pad: WIDE.pad };
-function founderDeck(k, slides, options) {
-  const deck = new Deck(k, WIDE, options);
-  const made = [];
-  for (const s of slides) {
-    const sheet = deck.add(specOf(s));
-    if (s.duration) k.timeline(sheet, { duration: s.duration, fps: 30 });
-    if ("canvas" in s) {
-      const area = k.named(sheet, "Points")[0];
-      k.patch(area, { name: "Canvas", height: SLIDE.area, layoutSizingVertical: "FIXED", itemSpacing: 0 });
-      s.draw(k, area, sheet);
-    }
-    s.more?.(k, sheet);
-    if (s.dress) {
-      const before = new Set(k.node(sheet).childIds);
-      s.dress(k, sheet);
-      const all = k.node(sheet).childIds;
-      k.patch(sheet, { childIds: [...all.filter((id) => !before.has(id)), ...all.filter((id) => before.has(id))] });
-    }
-    made.push({ sheet, s });
-  }
-  deck.finish();
-  for (const { sheet, s } of made) {
-    if (s.extra?.length) k.cues(sheet, s.extra);
-    if (s.counts?.length) k.counts(sheet, s.counts);
-  }
-}
-function evenRows(k, names) {
-  for (const n of Object.values(k.doc.nodes)) if (n.type === "FRAME" && names.includes(n.name)) k.patch(n.id, { layoutSizingVertical: "FILL" });
-}
-function levelRows(k, names) {
-  k.finish();
-  const rows = /* @__PURE__ */ new Map();
-  for (const n of Object.values(k.doc.nodes)) if (n.type === "FRAME" && names.includes(n.name) && n.parentId) rows.set(n.parentId, [...rows.get(n.parentId) ?? [], { id: n.id, height: n.height }]);
-  for (const row of rows.values()) {
-    const height = Math.ceil(Math.max(...row.map((r) => r.height)));
-    for (const r of row) k.patch(r.id, { height, layoutSizingVertical: "FIXED" });
-  }
-}
-
-export {
-  ARIAL,
-  GEORGIA,
-  COURIER,
-  MAIL_FPS,
-  MAIL_W,
-  mailSheet,
-  mailHeader,
-  section,
-  mailButton,
-  callToAction,
-  mailFooter,
-  mailRow,
-  tag,
-  finishMail,
-  swell,
-  drop,
-  fitted,
-  deckType,
-  founderCues,
-  SLIDE,
-  founderDeck,
-  evenRows,
-  levelRows
-};

package/dist/chunks/chunk-V5DCDOVY.js

@@ -1,88 +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 {
-  outro,
-  pill,
-  postVariants,
-  resizePhoto
-} from "./chunk-EK5CFFJO.js";
-import {
-  defineTemplate
-} from "./chunk-QBBW3JXO.js";
-import {
-  Kit,
-  preset
-} from "./chunk-SOHOKD4X.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/social/post-podcast.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var WAVE = [28, 52, 40, 76, 60, 96, 72, 120, 88, 64, 104, 80, 56, 92, 68, 44, 84, 60, 36, 52];
-var CONTENT = ["Guest photo", "Show", "Episode", "Title", "Guest", "Wave", "Listen"];
-var cues = [
-  { layer: "Guest photo", preset: "scale-in", at: 100, params: { duration: 700, amount: 0.6 } },
-  { layer: ["Show", "Episode", "Title", "Guest"], preset: "rise-in", at: 300, stagger: { delay: 120 } },
-  { layer: "Wave", preset: "fade-in", at: 900 },
-  { layer: "Bar", preset: "pulse", at: 1100, params: { amount: 0.35, duration: 700 }, stagger: { delay: 60 } },
-  { layer: "Bar", preset: "pulse", at: 3600, params: { amount: 0.25, duration: 700 }, stagger: { delay: 60 } },
-  { layer: "Listen", preset: "slide-in", at: 1400, params: { direction: "left", distance: 80 } },
-  outro(CONTENT, 6800)
-];
-var post_podcast_default = defineTemplate({
-  id: "motion-social-podcast",
-  meta: {
-    name: "Podcast episode post (animated)",
-    description: "The podcast episode post in motion: the guest photo scales in, the show, episode and title rise, and the waveform swells bar by bar like a level meter \u2014 eight seconds, square with 4:5 and 9:16 cuts",
-    category: "animation",
-    tags: ["animation", "podcast", "episode", "audio", "waveform", "instagram", "post", "photo"],
-    platforms: ["instagram", "linkedin", "x", "threads"],
-    formats: ["post", "portrait-post", "story"],
-    useCases: ["podcast", "interview"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  motion: { cues, loop: true },
-  build() {
-    const k = new Kit("Podcast episode post (animated)", preset("ig-post"));
-    k.brand(
-      { paper: "#1A1033", text: "#FFFFFF", onPaper: "#C9BFE6", primary: "#FF5C8A", onPrimary: "#1A1033", muted: "#3A2A66" },
-      { show: "Small Batch", title: "How a two-person studio ships a game every year", guest: "with Lena Park, co-founder of Tinfoil Games" }
-    );
-    k.textStyle("Show 30", { size: 30, fontWeight: 800, letterSpacing: 2, lineHeight: 36 });
-    k.textStyle("Title 60", { size: 60, fontWeight: 800, letterSpacing: -1.5, lineHeight: 66 });
-    k.textStyle("Guest 32", { size: 32, fontWeight: 500, lineHeight: 40 });
-    k.textStyle("Tag 24", { size: 24, fontWeight: 800, letterSpacing: 2, lineHeight: 28 });
-    k.textStyle("Listen 26", { size: 26, fontWeight: 600, lineHeight: 32 });
-    pill(k, "Episode tag", { fill: "primary", ink: "onPrimary", style: "Tag 24", label: "EP. 48", pad: [8, 18] });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 28, 80, "paper", "CENTER", "MIN");
-    k.timeline(sheet, { duration: 8e3, fps: 30 });
-    const top = k.stack(sheet, { direction: "HORIZONTAL", gap: 36, align: "CENTER", name: "Top" });
-    k.photo(top, 240, 240, { radius: 120, ground: "muted", name: "Guest photo" });
-    const info = k.stack(top, { gap: 14, name: "Info" });
-    k.text(info, "{{brand.show}}", { style: "Show 30", color: "onPaper", name: "Show" });
-    k.instance(info, "Episode tag", { Label: "EP. 48" }, { name: "Episode" });
-    k.text(sheet, "{{brand.title}}", { style: "Title 60", color: "text", name: "Title" });
-    k.text(sheet, "{{brand.guest}}", { style: "Guest 32", color: "onPaper", name: "Guest" });
-    const wave = k.stack(sheet, { direction: "HORIZONTAL", height: 140, gap: 14, align: "CENTER", name: "Wave" });
-    for (const h of WAVE) k.rect(wave, 22, h, "primary", { radius: 11, name: "Bar" });
-    k.text(sheet, "Listen on Spotify, Apple Podcasts and YouTube", { style: "Listen 26", color: "onPaper", name: "Listen" });
-    k.cues(sheet, cues);
-    k.variants(sheet, postVariants({ portrait: 88 }, {
-      vertical: (kit, id) => {
-        for (const p of kit.named(id, "Guest photo")) resizePhoto(kit, p, 200, 200);
-      }
-    }));
-    return k.finish();
-  }
-});
-
-export {
-  post_podcast_default
-};