@popcraft/kit 0.35.0 → 0.35.2

package/dist/chunks/chunk-GQ55RNME.js

@@ -1,83 +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 {
-  androidVariant,
-  screen,
-  statusBar
-} from "./chunk-7CP7EPNG.js";
-import {
-  defineTemplate
-} from "./chunk-7NJ3DMKZ.js";
-import {
-  Kit,
-  preset
-} from "./chunk-H3WQXGHA.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-APZ7CG5P.js";
-
-// templates/src/app/splash.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var cues = [
-  { layer: "Wash", preset: "scale-in", at: 0, params: { duration: 900 } },
-  { layer: "Leaf", preset: "pop-in", at: 250, stagger: { delay: 120 } },
-  { layer: "Mark", preset: "pop-in", at: 300, params: { duration: 600 } },
-  { layer: "Wordmark", preset: "rise-in", at: 700 },
-  { layer: "Tagline", preset: "fade-in", at: 950, params: { duration: 500 } },
-  { layer: "Dot", preset: "pop-in", at: 1300, params: { duration: 400 }, stagger: { delay: 120 } },
-  { layer: "Mark", preset: "pulse", at: 2100, params: { amount: 0.06 } }
-];
-var splash_default = defineTemplate({
-  id: "app-splash-launch",
-  meta: {
-    name: "App launch animation",
-    description: "A 3.2-second splash screen for a mobile app: a colour wash blooms, leaves pop out around the logo tile, the name rises and loading dots appear \u2014 iPhone with an Android copy",
-    category: "app",
-    tags: ["animation", "splash screen", "launch screen", "app", "logo", "mobile", "ios", "android"],
-    platforms: ["ios", "android"],
-    formats: ["screen", "logo-sting"],
-    useCases: ["brand-intro", "onboarding"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  breakpoints: true,
-  motion: { cues },
-  build() {
-    const k = new Kit("App launch animation", preset("iphone-17"));
-    k.brand({ paper: "#F2F7EF", text: "#18301F", onPaper: "#4B5E4F", primary: "#2E7D4F", accent: "#8CC084", leaf: "#5FA36C" }, { name: "Sprout", tagline: "Every plant, watered on time" });
-    k.textStyle("Status 15", { size: 15, fontWeight: 600, lineHeight: 20 });
-    k.textStyle("Wordmark 44", { size: 44, fontWeight: 800, letterSpacing: -1.2, lineHeight: 50, textAlign: "CENTER" });
-    k.textStyle("Tagline 17", { size: 17, fontWeight: 500, lineHeight: 24, textAlign: "CENTER" });
-    const sheet = k.sheet;
-    k.nameSheet(sheet, "Launch");
-    screen(k, sheet, { justify: "SPACE_BETWEEN", align: "CENTER", gap: 0 });
-    k.timeline(sheet, { duration: 3200, fps: 30 });
-    k.ellipse(sheet, 620, "accent", { name: "Wash", opacity: 0.35, absolute: { x: -109, y: 127 } });
-    statusBar(k, sheet, { style: "Status 15" });
-    const center = k.stack(sheet, { gap: 20, align: "CENTER", name: "Lockup" });
-    const art = k.stack(center, { width: "HUG", align: "CENTER", name: "Art" });
-    for (const [x, y, r, s] of [[-58, -26, -35, 64], [118, -40, 40, 56], [96, 104, 115, 48]]) {
-      const leaf = k.ellipse(art, s, "leaf", { name: "Leaf", absolute: { x, y } });
-      k.patch(leaf, { height: Math.round(s * 0.55), rotation: r });
-    }
-    k.component("Mark", { direction: "HORIZONTAL", width: "HUG", fill: "primary", radius: 40, padding: 26, description: "The app icon: the brand logo on its tile." }, (id) => {
-      k.logo(id, 88, 88);
-    });
-    k.instance(art, "Mark", {}, { name: "Mark" });
-    k.text(center, "{{brand.name}}", { style: "Wordmark 44", color: "text", name: "Wordmark" });
-    k.text(center, "{{brand.tagline}}", { style: "Tagline 17", color: "onPaper", name: "Tagline" });
-    const dots = k.stack(sheet, { direction: "HORIZONTAL", width: "HUG", gap: 8, padding: { top: 0, right: 0, bottom: 28, left: 0 }, name: "Loading" });
-    for (let i = 0; i < 3; i++) k.ellipse(dots, 8, "primary", { name: "Dot" });
-    k.cues(sheet, cues);
-    k.variants(sheet, [androidVariant("Launch")]);
-    return k.finish();
-  }
-});
-
-export {
-  splash_default
-};

package/dist/chunks/chunk-GRBN32MT.js

@@ -1,443 +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 {
-  MONO
-} from "./chunk-4DM3IHDI.js";
-import {
-  pt3,
-  r3
-} from "./chunk-47NL7EPT.js";
-import {
-  ease
-} from "./chunk-CPRMGKSL.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-APZ7CG5P.js";
-
-// templates/src/saas/style-gradient-shared.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var SPOOL = {
-  name: "Spool",
-  site: "spool.example",
-  version: "Spool 3",
-  feature: "Batch renders",
-  tagline: "Send JSON. Get video.",
-  pitch: "A video rendering API. Send a template and a row of JSON; get a finished MP4 back in seconds.",
-  /** A 60-second 1080p video, rendered on Spool 3's edge workers; and the same video on Spool 2. */
-  render: 4.2,
-  before: 38,
-  clip: "1 min \xB7 1080p",
-  region: "Edge \xB7 fra1",
-  template: "weekly-recap",
-  /** The batch every demo runs: rows in the CSV, and how long all of them took. */
-  rows: 2400,
-  batchTime: "3 min 12 s",
-  /** Videos rendered since launch, and in September (the milestone). */
-  total: 1e7,
-  before10m: 942e4,
-  september: "1.8M",
-  /** Plans: a month, and a month billed yearly. */
-  studio: 49,
-  studioYear: 39,
-  scale: 299,
-  scaleYear: 239,
-  minutes: 200,
-  overage: "$0.04",
-  trial: "200 render minutes free. No card."
-};
-var JOBS = [
-  { file: "recap-ana-ruiz.mp4", meta: "60 s \xB7 1080p", time: "4.2 s" },
-  { file: "recap-tom-hale.mp4", meta: "60 s \xB7 1080p", time: "4.0 s" },
-  { file: "recap-li-wei.mp4", meta: "45 s \xB7 1080p", time: "3.1 s" },
-  { file: "recap-sam-ode.mp4", meta: "60 s \xB7 4K", time: "9.8 s" }
-];
-var BRAND = {
-  night: "#041A24",
-  onNight: "#FFF6EE",
-  nightMuted: "#BDD3D6",
-  plate: "#08222D",
-  onPlate: "#FFFFFF",
-  plateMuted: "#A3C2C8",
-  primary: "#D4FF4F",
-  onPrimary: "#0B1F14"
-};
-var SCENERY = {
-  abyss: "#03141C",
-  ocean: "#0A3D50",
-  kelp: "#0D4A52",
-  coral: "#FF6B4A",
-  apricot: "#FFB07A",
-  lagoon: "#14A3A0",
-  haze: "#FFE2C4",
-  rim: "#FFFFFF",
-  shade: "#010A0E",
-  clipA: "#FF8A66",
-  clipB: "#2CC4BC",
-  clipC: "#FFC48F"
-};
-function gradientBrand(k, fields = {}) {
-  k.brand({ ...BRAND }, { name: SPOOL.name, site: SPOOL.site, ...fields });
-  k.palette({ ...SCENERY });
-}
-var tenth = (v) => Math.round(v * 10) / 10 + 0;
-var display = (size, o = {}) => ({ size, fontWeight: o.weight ?? 700, letterSpacing: tenth(-size * 0.045), lineHeight: Math.round(size * (o.lead ?? 1.02)), ...o.center ? { textAlign: "CENTER" } : {} });
-var body = (size, weight = 400) => ({ size, fontWeight: weight, lineHeight: Math.round(size * 1.45), letterSpacing: size >= 24 ? tenth(-size * 0.012) : 0 });
-var label = (size) => ({ size, fontWeight: 600, letterSpacing: tenth(size * 0.1), lineHeight: Math.round(size * 1.3) });
-var code = (size, weight = 500) => ({ ...MONO, size, fontWeight: weight, lineHeight: Math.round(size * 1.4) });
-var figure = (size, weight = 700) => ({ size, fontWeight: weight, letterSpacing: tenth(-size * 0.05), lineHeight: Math.round(size * 1), fontFeatures: { tnum: 1 } });
-function ts(k, name, def) {
-  k.textStyle(name, def);
-  return name;
-}
-var DEEP = `struct Params {
-  phase: f32,   // @range 0 31.415927 @default 0
-  grain: f32,   // @range 0 0.2 @default 0.05
-  abyss: vec4f, // @default #03141c
-  ocean: vec4f, // @default #0a3d50
-  kelp: vec4f,  // @default #0d4a52
-}
-
-fn dp_hash(q: vec2<f32>) -> f32 { return fract(sin(dot(q, vec2<f32>(127.1, 311.7))) * 43758.5453); }
-
-fn shade(uv: vec2<f32>, res: vec2<f32>, time: f32) -> vec4<f32> {
-  let asp = res.x / max(res.y, 1.0);
-  let q = vec2<f32>(uv.x * asp, uv.y);
-  let ph = p.phase;
-  let a = 0.5 + 0.5 * sin(q.x * 1.7 + q.y * 2.3 + ph);
-  let b = 0.5 + 0.5 * sin(q.x * -2.1 + q.y * 1.3 - ph + 1.7);
-  let c = 0.5 + 0.5 * sin(length(q - vec2<f32>(0.3 * asp + 0.2 * sin(ph), 0.7)) * 3.1 - ph);
-  var col = p.abyss.rgb;
-  col = mix(col, p.ocean.rgb, clamp(a * b * 1.3, 0.0, 1.0));
-  col = mix(col, p.kelp.rgb, clamp(c * c * 0.75, 0.0, 1.0));
-  let v = length((uv - vec2<f32>(0.5, 0.45)) * vec2<f32>(1.0, 1.2));
-  col = mix(col, p.abyss.rgb, smoothstep(0.35, 0.95, v) * 0.7);
-  let n = (dp_hash(floor(uv * res / 1.5)) - 0.5) * p.grain;
-  return vec4<f32>(col + vec3<f32>(n), 1.0);
-}`;
-function deep(k, sheet, o = {}) {
-  const { width: w, height: h } = k.node(sheet);
-  const id = k.rect(sheet, w, h, k.shader("Deep ocean", { phase: 0, grain: 0, abyss: k.color("abyss"), ocean: k.color("ocean"), kelp: k.color("kelp") }, DEEP), { name: o.name ?? "Deep", absolute: { x: 0, y: 0 } });
-  if (o.duration) k.animateShader(id, "phase", [{ t: 0, v: 0, ease: ease.linear }, { t: o.duration, v: r3(Math.PI * 2 * (o.turns ?? 1)) }]);
-  return id;
-}
-var MESH = `struct Params {
-  phase: f32,    // @range 0 31.415927 @default 0
-  bloom: f32,    // @range 0 1 @default 0
-  grain: f32,    // @range 0 0.2 @default 0.06
-  coral: vec4f,  // @default #ff6b4a
-  apricot: vec4f,// @default #ffb07a
-  lagoon: vec4f, // @default #14a3a0
-  ocean: vec4f,  // @default #0a3d50
-}
-
-fn ms_hash(q: vec2<f32>) -> f32 { return fract(sin(dot(q, vec2<f32>(269.5, 183.3))) * 43758.5453); }
-fn ms_blob(q: vec2<f32>, c: vec2<f32>, r: f32) -> f32 { let d = length(q - c) / r; return exp(-d * d); }
-
-fn shade(uv: vec2<f32>, res: vec2<f32>, time: f32) -> vec4<f32> {
-  let asp = res.x / max(res.y, 1.0);
-  let q = vec2<f32>(uv.x * asp, uv.y);
-  let ph = p.phase;
-  let c1 = vec2<f32>((0.32 + 0.1 * sin(ph)) * asp, 0.55 + 0.08 * cos(ph * 1.0 + 0.4));
-  let c2 = vec2<f32>((0.66 + 0.09 * cos(ph + 1.2)) * asp, 0.42 + 0.1 * sin(ph + 2.0));
-  let c3 = vec2<f32>((0.52 + 0.12 * sin(ph + 3.4)) * asp, 0.7 + 0.06 * sin(ph * 2.0));
-  let c4 = vec2<f32>((0.18 + 0.08 * cos(ph + 4.1)) * asp, 0.32 + 0.07 * cos(ph + 1.0));
-  let s = min(asp, 1.0);
-  let w1 = ms_blob(q, c1, 0.34 * s + 0.12);
-  let w2 = ms_blob(q, c2, 0.3 * s + 0.12);
-  let w3 = ms_blob(q, c3, 0.26 * s + 0.1);
-  let w4 = ms_blob(q, c4, 0.28 * s + 0.1);
-  var col = p.ocean.rgb;
-  let tot = w1 + w2 + w3 + w4 + 0.0001;
-  col = (p.coral.rgb * w1 + p.lagoon.rgb * w2 + p.apricot.rgb * w3 + p.ocean.rgb * w4) / tot;
-  let e = smoothstep(0.0, 0.32, uv.x) * smoothstep(0.0, 0.32, 1.0 - uv.x) * smoothstep(0.0, 0.3, uv.y) * smoothstep(0.0, 0.3, 1.0 - uv.y);
-  let a = clamp(max(max(w1, w2), max(w3, w4)) * 1.15, 0.0, 1.0) * e * (0.78 + 0.22 * p.bloom);
-  let n = (ms_hash(floor(uv * res / 1.5)) - 0.5) * p.grain;
-  return vec4<f32>(col + vec3<f32>(n), a);
-}`;
-function mesh(k, parent, o) {
-  const id = k.rect(parent, Math.round(o.w), Math.round(o.h), k.shader("Sunrise mesh", { phase: o.phase ?? 0, bloom: o.bloom ?? 0, grain: 0, coral: k.color("coral"), apricot: k.color("apricot"), lagoon: k.color("lagoon"), ocean: k.color("ocean") }, MESH), { name: o.name ?? "Mesh", absolute: { x: Math.round(o.x), y: Math.round(o.y) } });
-  if (o.duration) {
-    const p0 = o.phase ?? 0;
-    k.animateShader(id, "phase", [{ t: 0, v: p0, ease: ease.linear }, { t: o.duration, v: r3(p0 + Math.PI * 2 * (o.turns ?? 1)) }]);
-  }
-  return id;
-}
-function bloomAt(k, id, at, rise = 700, fall = 2600) {
-  k.animateShader(id, "bloom", [{ t: at, v: 0, ease: ease.out("cubic") }, { t: at + rise, v: 1, ease: ease.inOut("sine") }, { t: at + rise + fall, v: 0 }]);
-}
-var GRAIN = `struct Params {
-  amount: f32, // @range 0 0.3 @default 0.07
-  size: f32,   // @range 1 4 @default 1.5
-}
-
-fn gr_hash(q: vec2<f32>) -> f32 { return fract(sin(dot(q, vec2<f32>(12.9898, 78.233))) * 43758.5453); }
-
-fn shade(uv: vec2<f32>, res: vec2<f32>, time: f32) -> vec4<f32> {
-  let n = gr_hash(floor(uv * res / p.size));
-  let v = select(0.0, 1.0, n > 0.5);
-  return vec4<f32>(vec3<f32>(v), abs(n - 0.5) * 2.0 * p.amount);
-}`;
-function grainOver(k, sheet, amount = 0.06) {
-  const { width: w, height: h } = k.node(sheet);
-  return k.rect(sheet, w, h, k.shader("Film grain", { amount, size: 1.5 }, GRAIN), { name: "Grain", absolute: { x: 0, y: 0 } });
-}
-function fitFull(k, sheet, names = ["Deep", "Grain"]) {
-  const { width: w, height: h } = k.node(sheet);
-  for (const n of names) for (const id of k.named(sheet, n)) k.patch(id, { x: 0, y: 0, width: w, height: h });
-}
-var longShadow = (k, a = 0.55, y = 48, blur = 90) => ({ type: "DROP_SHADOW", color: k.color("shade", a), offset: { x: 0, y }, blur, spread: 0, visible: true });
-var rimLight = (k, a = 0.14) => [
-  { type: "INNER_SHADOW", color: k.color("rim", a), offset: { x: 0, y: 0 }, blur: 0, spread: 1, visible: true },
-  { type: "INNER_SHADOW", color: k.color("rim", a * 2.4), offset: { x: 0, y: 1.5 }, blur: 0, spread: 0, visible: true }
-];
-var linear = (stops, from, to) => ({ type: "GRADIENT_LINEAR", gradientStops: stops.map(([position, color]) => ({ position, color })), gradientHandlePositions: [from, to, { x: from.x + (to.y - from.y), y: from.y - (to.x - from.x) }], opacity: 1, visible: true });
-function specular(k, plate, w, h, sweeps, o = {}) {
-  const bw = o.width ?? Math.max(140, Math.round(w * 0.24)), d = o.duration ?? 1500;
-  const paint = linear([[0, k.color("rim", 0)], [0.5, k.color("rim", o.alpha ?? 0.16)], [1, k.color("rim", 0)]], { x: 0, y: 0.5 }, { x: 1, y: 0.5 });
-  const hh = Math.round(h * 1.6), x0 = -bw * 2;
-  const id = k.rect(plate, bw, hh, [paint], { name: "Specular", absolute: { x: x0, y: Math.round(-h * 0.3) } });
-  k.patch(id, { rotation: 20 });
-  if (sweeps.length) {
-    const keys = [];
-    for (const t of sweeps) keys.push({ t, v: 0, ease: ease.inOut("sine") }, { t: t + d, v: w + bw * 3, ease: ease.hold }, { t: t + d + 1, v: 0, ease: ease.hold });
-    keys[keys.length - 1] = { t: keys[keys.length - 1].t, v: 0 };
-    k.animate(id, "translateX", keys);
-  }
-  return id;
-}
-var WIN = { w: 960, h: 640 };
-function spoolWindow(k, parent, o) {
-  const s = o.styles;
-  const W = o.width ?? WIN.w, f = W / WIN.w, PWD = W - 642;
-  const win = k.stack(parent, { width: W, height: WIN.h, fill: "plate", radius: 26, clip: true, name: o.name ?? "Window", effects: rimLight(k), ...o.absolute ? { absolute: o.absolute } : {} });
-  const top = k.stack(win, { direction: "HORIZONTAL", align: "CENTER", justify: "SPACE_BETWEEN", height: 64, padding: { top: 0, right: 22, bottom: 0, left: 24 }, name: "Title bar" });
-  const left = k.stack(top, { direction: "HORIZONTAL", width: "HUG", align: "CENTER", gap: 18, name: "Title left" });
-  const lights = k.stack(left, { direction: "HORIZONTAL", width: "HUG", gap: 9, name: "Lights" });
-  for (const role of ["coral", "apricot", "lagoon"]) k.ellipse(lights, 14, role, { name: "Light" });
-  k.text(left, `${SPOOL.template}.json`, { style: s.title, color: "onPlate", autoWidth: true, name: "Window title" });
-  const chip = k.stack(top, { direction: "HORIZONTAL", width: "HUG", align: "CENTER", gap: 8, radius: 999, fill: k.tint("rim", 0.08), padding: { top: 7, right: 14, bottom: 7, left: 12 }, name: "Region chip" });
-  k.ellipse(chip, 10, "primary", { name: "Region dot" });
-  k.text(chip, SPOOL.region, { style: s.small, color: "onPlate", autoWidth: true, name: "Region" });
-  k.rect(win, "FILL", 1, k.tint("rim", 0.1), { name: "Title rule" });
-  const mid = k.stack(win, { direction: "HORIZONTAL", gap: 22, padding: { top: 22, right: 24, bottom: 0, left: 24 }, name: "Middle" });
-  const pv = k.stack(mid, { width: 548, gap: 12, name: "Preview column" });
-  const PW = 548, PH = 308;
-  const preview = k.stack(pv, { width: PW, height: PH, name: "Preview", fill: "ocean", clip: true, radius: 16 });
-  mesh(k, preview, { x: 0, y: 0, w: PW, h: PH, duration: o.duration, phase: 1.2, name: "Preview light" });
-  const route = { closed: false, points: [pt3(60, 236), pt3(120, 190), pt3(176, 214), pt3(236, 150), pt3(300, 168), pt3(352, 104), pt3(420, 126), pt3(488, 74)].map((p, i, a) => {
-    const prev = a[i - 1] ?? p, next = a[i + 1] ?? p;
-    return { ...p, ...i > 0 ? { handleIn: pt3(p.x - (next.x - prev.x) / 6, p.y - (next.y - prev.y) / 6) } : {}, ...i < a.length - 1 ? { handleOut: pt3(p.x + (next.x - prev.x) / 6, p.y + (next.y - prev.y) / 6) } : {} };
-  }) };
-  k.vector(preview, PW, PH, [route], [], { name: "Route", absolute: { x: 0, y: 0 }, stroke: { color: "rim", width: 6, cap: "ROUND", join: "ROUND" } });
-  k.ellipse(preview, 22, "rim", { name: "Route end", absolute: { x: 477, y: 63 }, stroke: { color: "coral", width: 5, align: "INSIDE" } });
-  const tag = k.stack(preview, { width: "HUG", gap: 2, radius: 14, fill: "plate", padding: { top: 12, right: 18, bottom: 12, left: 18 }, name: "Preview tag", absolute: { x: 20, y: PH - 98 } });
-  k.text(tag, "Ana \xB7 week 39", { style: s.small, color: "plateMuted", autoWidth: true, name: "Preview who" });
-  k.text(tag, "42.6 km", { style: s.big, color: "onPlate", autoWidth: true, name: "Preview distance" });
-  const scrubRow = k.stack(pv, { direction: "HORIZONTAL", align: "CENTER", gap: 14, name: "Scrub row" });
-  const scrub = k.stack(scrubRow, { width: 380, height: 8, name: "Scrub", fill: k.tint("rim", 0.12), radius: 4 });
-  const played = k.rect(scrub, 380, 8, "primary", { name: "Played", radius: 4, absolute: { x: 0, y: 0 } });
-  k.patch(played, { anchorX: 0 });
-  k.text(scrubRow, "0:12 / 1:00", { style: s.small, color: "plateMuted", autoWidth: true, name: "Scrub time" });
-  const panel = k.stack(mid, { width: "FILL", gap: 10, name: "Render panel" });
-  k.text(panel, "RENDERED IN", { style: s.label, color: "plateMuted", name: "Render label" });
-  const fig = k.text(panel, `${SPOOL.render} s`, { style: s.figure, color: "onPlate", width: Math.min(300, PWD), name: "Render figure" });
-  k.text(panel, SPOOL.clip, { style: s.small, color: "plateMuted", name: "Render clip" });
-  const track = k.stack(panel, { width: PWD, height: 10, name: "Progress", fill: k.tint("rim", 0.12), radius: 5 });
-  const bar = k.rect(track, PWD, 10, "primary", { name: "Progress bar", radius: 5, absolute: { x: 0, y: 0 } });
-  k.patch(bar, { anchorX: 0 });
-  const status = k.text(panel, "Done \xB7 MP4 ready", { style: s.small, color: "onPlate", name: "Render status" });
-  const queue = k.stack(panel, { gap: 0, name: "Queue" });
-  const jobs = [];
-  JOBS.slice(0, o.jobs ?? 3).forEach((j) => {
-    k.rect(queue, "FILL", 1, k.tint("rim", 0.09), { name: "Job rule" });
-    const r = k.stack(queue, { direction: "HORIZONTAL", align: "CENTER", justify: "SPACE_BETWEEN", height: 44, name: "Job" });
-    k.text(r, j.file.replace(".mp4", ""), { style: s.small, color: "onPlate", autoWidth: true, name: "Job file" });
-    k.text(r, j.time, { style: s.small, color: "onPlate", autoWidth: true, name: "Job time" });
-    jobs.push(r);
-  });
-  const tl = k.frame(win, { x: 0, y: 0, width: W, height: 150 }, { name: "Timeline" });
-  k.patch(tl, { layoutPositioning: "ABSOLUTE", x: 0, y: WIN.h - 150 });
-  k.rect(tl, W, 150, k.tint("shade", 0.35), { name: "Timeline ground", absolute: { x: 0, y: 0 } });
-  k.rect(tl, W, 1, k.tint("rim", 0.1), { name: "Timeline rule", absolute: { x: 0, y: 0 } });
-  const CLIPS = [
-    [0, 24, 250, "clipA"],
-    [0, 286, 210, "clipC"],
-    [0, 508, 300, "clipA"],
-    [0, 820, 116, "clipC"],
-    [1, 24, 180, "clipB"],
-    [1, 216, 360, "clipB"],
-    [1, 588, 220, "clipB"],
-    [2, 24, 912, "kelp"]
-  ];
-  const clips = [];
-  for (const [row, x, w, role] of CLIPS) clips.push(k.rect(tl, Math.round(w * f), 28, k.tint(role, row === 2 ? 1 : 0.85), { name: "Clip", radius: 7, absolute: { x: Math.round(x * f), y: 22 + row * 40 } }));
-  const wave = [];
-  for (let i = 0; i < Math.floor((W - 60) / 10); i++) {
-    const x = 30 + i * 10, hh = 4 + Math.abs(Math.sin(i * 0.7) * 9 + Math.sin(i * 0.23) * 6);
-    wave.push({ closed: true, points: [pt3(x, 14 - hh / 2), pt3(x + 4, 14 - hh / 2), pt3(x + 4, 14 + hh / 2), pt3(x, 14 + hh / 2)] });
-  }
-  k.vector(tl, W, 28, wave, k.tint("lagoon", 0.9), { name: "Waveform", absolute: { x: 0, y: 102 } });
-  const playhead = k.stack(tl, { width: 4, height: 150, fill: "primary", radius: 2, name: "Playhead", absolute: { x: 300, y: 0 } });
-  return { win, preview, playhead, bar, figure: fig, status, jobs, clips, scrub: played };
-}
-function winStyles(k) {
-  return {
-    title: ts(k, "Win title 22", code(22)),
-    small: ts(k, "Win small 20", code(20)),
-    big: ts(k, "Win big 34", display(34)),
-    label: ts(k, "Win label 18", label(18)),
-    figure: ts(k, "Win figure 96", figure(96))
-  };
-}
-function renderRun(k, w, at, run, o = {}) {
-  const end = at + run;
-  k.animate(w.playhead, "translateX", [{ t: at, v: -276, ease: ease.inOut("sine") }, { t: end, v: 600, ...o.loopEnd ? { ease: ease.inOut("sine") } : {} }, ...o.loopEnd ? [{ t: o.loopEnd, v: -276 }] : []]);
-  for (const id of [w.bar, w.scrub]) k.animate(id, "scaleX", [{ t: at, v: 0.02, ease: ease.inOut("cubic") }, { t: end, v: 1, ...o.loopEnd ? { ease: ease.inOut("sine") } : {} }, ...o.loopEnd ? [{ t: o.loopEnd, v: 0.02 }] : []]);
-  k.animate(w.status, "text.content", [{ t: 0, v: "Rendering\u2026", ease: ease.hold }, { t: end, v: "Done \xB7 MP4 ready", ...o.loopEnd ? { ease: ease.hold } : {} }, ...o.loopEnd ? [{ t: o.loopEnd - 300, v: "Rendering\u2026" }] : []]);
-}
-function tilted(k, parent, o) {
-  const scene = k.group(parent, { x: Math.round(o.x), y: Math.round(o.y), width: Math.round(o.w), height: Math.round(o.h) }, { name: o.name ?? "Scene", absolute: true });
-  k.scene3d(scene, { camera: { focalLength: r3(36 * (o.perspective ?? 1800) / Math.max(1, o.w)) } });
-  const s = o.scale;
-  const WW = o.width ?? WIN.w, HH = o.height ?? WIN.h;
-  const gx = Math.round((o.w - WW) / 2), gy = Math.round((o.h - HH) / 2);
-  const fx = o.safe ? Math.round(o.safe.x - o.x + (o.safe.w - WW) / 2) : gx, fy = o.safe ? Math.round(o.safe.y - o.y + (o.safe.h - HH) / 2) : gy;
-  const rig = k.group(scene, { x: fx, y: fy, width: WW, height: HH }, { name: "Rig" });
-  if (fx !== gx || fy !== gy) k.patch(rig, { translateX: gx - fx, translateY: gy - fy });
-  k.patch(rig, { rotateY: o.rotateY ?? -24, rotateX: o.rotateX ?? 12, scaleX: s, scaleY: s });
-  const planes = [];
-  if (o.planes !== false) {
-    const codePlane = k.stack(rig, { width: 520, height: 330, fill: "plate", radius: 22, padding: 30, gap: 16, clip: true, name: "Code plane", effects: rimLight(k, 0.1) });
-    k.patch(codePlane, { x: -240, y: -150, z: -260 });
-    for (const [indent, segs] of [[0, [["primary", 150], ["plateMuted", 120]]], [0, [["plateMuted", 20]]], [1, [["clipB", 130], ["clipC", 170]]], [1, [["clipB", 80], ["clipC", 110], ["clipB", 60]]], [2, [["clipB", 60], ["clipA", 70]]], [1, [["clipB", 100], ["clipC", 70]]], [0, [["plateMuted", 20]]]]) {
-      const ln = k.stack(codePlane, { direction: "HORIZONTAL", gap: 10, padding: { top: 0, right: 0, bottom: 0, left: indent * 32 }, name: "Code line" });
-      for (const [role, w] of segs) k.rect(ln, w, 14, k.tint(role, 0.8), { radius: 7, name: "Code token" });
-    }
-    const queuePlane = k.stack(rig, { width: 400, height: 250, fill: "plate", radius: 22, padding: 28, gap: 18, clip: true, name: "Queue plane", effects: rimLight(k, 0.1) });
-    k.patch(queuePlane, { x: WW - 40, y: 330, z: -220 });
-    k.rect(queuePlane, 120, 12, k.tint("plateMuted", 0.7), { radius: 6, name: "Plane label" });
-    const bars = k.stack(queuePlane, { direction: "HORIZONTAL", gap: 10, align: "MAX", height: 140, name: "Plane bars" });
-    for (const v of [52, 70, 62, 92, 84, 124, 110]) k.rect(bars, 36, v, k.tint("lagoon", 0.9), { name: "Plane bar", radius: 6 });
-    planes.push(codePlane, queuePlane);
-  }
-  const shadow = k.rect(rig, WW, HH, "shade", { radius: 30, name: "Cast shadow", opacity: 0.6, effects: [{ type: "LAYER_BLUR", radius: 60, visible: true }] });
-  k.patch(shadow, { z: -120, x: 40, y: 70 });
-  let reflection = "";
-  if (o.reflection !== false) {
-    const paint = linear([[0, k.color("lagoon", 0.28)], [0.35, k.color("coral", 0.1)], [1, k.color("ocean", 0)]], { x: 0.5, y: 0 }, { x: 0.5, y: 1 });
-    reflection = k.rect(rig, WW, Math.round(HH * 0.42), [paint], { radius: 26, name: "Reflection", opacity: 0.9 });
-    k.patch(reflection, { x: 0, y: HH + 18 });
-  }
-  if (o.make) {
-    const id = o.make(rig);
-    return { scene, rig, win: { win: id }, shadow, reflection, planes, sweep: specular(k, id, WW, HH, o.sweeps ?? []) };
-  }
-  const win = spoolWindow(k, rig, { styles: o.styles, width: WW, jobs: o.jobs, duration: o.duration, absolute: { x: 0, y: 0 } });
-  const sweep = specular(k, win.win, WW, HH, o.sweeps ?? []);
-  return { scene, rig, win, shadow, reflection, planes, sweep };
-}
-function orbitCam(k, scene, o) {
-  const io = ease.inOut("sine");
-  k.animate(scene, "scene3d.camera.orbit", [{ t: o.at, v: o.from, ease: io }, { t: o.until, v: o.to, ...o.back ? { ease: io } : {} }, ...o.back ? [{ t: o.back, v: o.from }] : []]);
-  if (o.z0 !== void 0 && o.z1 !== void 0) k.animate(scene, "scene3d.camera.z", [{ t: o.at, v: o.z0, ease: io }, { t: o.until, v: o.z1, ...o.back ? { ease: io } : {} }, ...o.back ? [{ t: o.back, v: o.z0 }] : []]);
-}
-function parallax(k, t, loop, amp = 18) {
-  t.planes.forEach((id, i) => {
-    k.behave(id, "translateY", [{ kind: "sine", amp: r3(amp * (i ? -1 : 1)), freq: r3(1e3 / loop), phase: r3(i * 0.3) }]);
-  });
-}
-function lockup(k, parent, o) {
-  const row = k.stack(parent, { direction: "HORIZONTAL", width: "HUG", align: "CENTER", gap: Math.round(o.size * 0.36), name: o.name ?? "Lockup", ...o.absolute ? { absolute: o.absolute } : {} });
-  const tile = k.stack(row, { width: "HUG", fill: "primary", radius: Math.round(o.size * 0.3), padding: Math.round(o.size * 0.2), name: "Logo tile" });
-  k.logo(tile, Math.round(o.size * 0.6), Math.round(o.size * 0.6));
-  k.text(row, "{{brand.name}}", { style: o.style, color: "onNight", autoWidth: true, name: "Brand name" });
-  return row;
-}
-function button(k, name, o) {
-  const [v, h] = o.pad ?? [20, 34];
-  k.component(name, { direction: "HORIZONTAL", width: "HUG", fill: "primary", radius: 999, align: "CENTER", padding: { top: v, right: h, bottom: v, left: h }, props: { Label: o.label }, effects: [longShadow(k, 0.5, 18, 40)] }, (id) => {
-    k.propText(id, "Label", { style: o.style, color: "onPrimary", autoWidth: true });
-  });
-}
-function plateChip(k, parent, words, o) {
-  const [v, h] = o.pad ?? [10, 18];
-  const c = k.stack(parent, { direction: "HORIZONTAL", width: "HUG", align: "CENTER", gap: Math.round(h * 0.6), radius: 999, fill: "plate", padding: { top: v, right: h, bottom: v, left: h }, name: o.name ?? "Chip", effects: rimLight(k, 0.12), ...o.absolute ? { absolute: o.absolute } : {} });
-  if (o.dot) k.ellipse(c, Math.round(v * 1.1), o.dot, { name: "Chip dot" });
-  k.text(c, words, { style: o.style, color: o.ink ?? "onPlate", autoWidth: true, name: `${o.name ?? "Chip"} words` });
-  return c;
-}
-var MONTHLY = [310, 420, 560, 690, 840, 1020, 1240, 1510, 1800];
-var MONTHS = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep"];
-function monthlyLine(w, h, top = 2e3) {
-  const pts = MONTHLY.map((v, i) => ({ x: i / (MONTHLY.length - 1) * w, y: h - v / top * h }));
-  return { closed: false, points: pts.map((p, i) => {
-    const prev = pts[i - 1] ?? p, next = pts[i + 1] ?? p, dx = (next.x - prev.x) / 6, dy = (next.y - prev.y) / 6;
-    return { ...pt3(p.x, p.y), ...i > 0 ? { handleIn: pt3(p.x - dx, p.y - dy) } : {}, ...i < pts.length - 1 ? { handleOut: pt3(p.x + dx, p.y + dy) } : {} };
-  }) };
-}
-function monthlyArea(w, h, top = 2e3) {
-  const l = monthlyLine(w, h, top);
-  return { closed: true, points: [...l.points, pt3(w, h), pt3(0, h)] };
-}
-var areaPaint = (k) => [linear([[0, k.color("lagoon", 0.45)], [1, k.color("lagoon", 0)]], { x: 0.5, y: 0 }, { x: 0.5, y: 1 })];
-function sitePill(k, o) {
-  const [v, h] = o.pad ?? [14, 22];
-  k.component("Site pill", { direction: "HORIZONTAL", width: "HUG", radius: 999, align: "CENTER", fill: "plate", padding: { top: v, right: h, bottom: v, left: h }, effects: rimLight(k, 0.14), props: { Label: o.label ?? SPOOL.site } }, (id) => {
-    k.propText(id, "Label", { style: o.style, color: "onPlate", autoWidth: true });
-  });
-}
-function videoFoot(k, sheet, y, o = {}) {
-  const n = o.n ?? 6, w = o.w ?? 160, gap = o.gap ?? 28, h = Math.round(w * 16 / 9);
-  const x0 = Math.round((k.node(sheet).width - (n * w + (n - 1) * gap)) / 2);
-  const row = k.frame(sheet, { x: 0, y, width: k.node(sheet).width, height: h }, { name: "Video foot" });
-  k.patch(row, { opacity: o.opacity ?? 0.6 });
-  for (let i = 0; i < n; i++) {
-    const tile = k.stack(row, { width: w, height: h, radius: 16, clip: true, fill: [k.gradient({ from: ["lagoon", "coral", "apricot"][i % 3], to: "ocean", angle: 64 + i * 14 })], name: "Foot video", absolute: { x: x0 + i * (w + gap), y: 0 } });
-    k.vector(tile, w, h, [{ closed: false, points: [pt3(w * 0.16, h * 0.74), pt3(w * 0.4, h * 0.52), pt3(w * 0.6, h * 0.6), pt3(w * 0.86, h * 0.28)] }], [], { name: "Foot route", absolute: { x: 0, y: 0 }, stroke: { color: "rim", width: 3, cap: "ROUND", join: "ROUND" } });
-  }
-  return row;
-}
-
-export {
-  SPOOL,
-  JOBS,
-  gradientBrand,
-  display,
-  body,
-  label,
-  code,
-  figure,
-  ts,
-  DEEP,
-  deep,
-  MESH,
-  mesh,
-  bloomAt,
-  GRAIN,
-  grainOver,
-  fitFull,
-  longShadow,
-  rimLight,
-  specular,
-  WIN,
-  spoolWindow,
-  winStyles,
-  renderRun,
-  tilted,
-  orbitCam,
-  parallax,
-  lockup,
-  button,
-  plateChip,
-  MONTHLY,
-  MONTHS,
-  monthlyLine,
-  monthlyArea,
-  areaPaint,
-  sitePill,
-  videoFoot
-};

package/dist/chunks/chunk-GREJE6J4.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 {
-  clouds,
-  envelope,
-  hangings,
-  lunarBrand,
-  reburst,
-  sky
-} from "./chunk-EZR2P4KS.js";
-import {
-  EMAIL_FPS,
-  HEADER
-} from "./chunk-T3BMZ4BY.js";
-import {
-  SERIF
-} from "./chunk-4DM3IHDI.js";
-import {
-  pill
-} from "./chunk-ZCPFVBC3.js";
-import {
-  defineTemplate
-} from "./chunk-7NJ3DMKZ.js";
-import {
-  Kit
-} from "./chunk-H3WQXGHA.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-APZ7CG5P.js";
-
-// templates/src/email/lunar-new-year-header.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var DURATION = 4800;
-var cues = [
-  { layer: "Envelope", preset: "wobble", at: 1200, params: { duration: 800 } },
-  { layer: "Button", preset: "pulse", at: 3e3, params: { duration: 800, amount: 0.06 } }
-];
-var lunar_new_year_header_default = defineTemplate({
-  id: "email-lunar-new-year-header",
-  meta: {
-    name: "Lunar New Year email header (animated GIF)",
-    description: "A 600 \xD7 300 animated header for a Lunar New Year email: the gift, the code and the button are all on the first frame (for Outlook), beside a cut-paper night where a red envelope shows its voucher before a paper moon; then lanterns sway and fireworks burst again \u2014 a seamless 4.8-second GIF loop with no zodiac animal, so it works every year",
-    category: "email",
-    tags: ["email", "gif", "animated", "header", "banner", "lunar new year", "chinese new year", "spring festival", "red envelope", "lantern", "fireworks", "offer", "saas", "seasonal"],
-    platforms: ["email"],
-    formats: ["email", "banner"],
-    useCases: ["sale", "newsletter", "announcement"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  motion: { cues, loop: true },
-  build() {
-    const k = new Kit("Lunar New Year email header", HEADER);
-    k.quantizeGeometry = true;
-    lunarBrand(k, { offer: "Your red envelope: 88 days free." });
-    k.textStyle("Eyebrow 12", { size: 12, fontWeight: 700, letterSpacing: 2.4, lineHeight: 16, textCase: "UPPER" });
-    k.textStyle("Offer 30", { ...SERIF, size: 30, fontWeight: 900, letterSpacing: -0.9, lineHeight: 33 });
-    k.textStyle("Account 14", { size: 14, fontWeight: 500, lineHeight: 21 });
-    k.textStyle("Button 14", { size: 14, fontWeight: 800, lineHeight: 20 });
-    k.textStyle("Figure 36", { ...SERIF, size: 36, fontWeight: 900, letterSpacing: -1, lineHeight: 34, textAlign: "CENTER" });
-    k.textStyle("Days 12", { ...SERIF, size: 12, fontWeight: 700, lineHeight: 14, textAlign: "CENTER" });
-    pill(k, "Button pill", { fill: "primary", ink: "onPrimary", style: "Button 14", label: "Open the envelope", pad: [9, 20], radius: 6 });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 9, { top: 20, right: 292, bottom: 60, left: 30 }, "paper", "CENTER", "MIN");
-    k.patch(sheet, { clipsContent: true });
-    k.timeline(sheet, { duration: DURATION, fps: EMAIL_FPS });
-    const s = {
-      w: 600,
-      h: 300,
-      u: 0.4,
-      loopMs: DURATION,
-      moon: { x: 468, y: 128, size: 180 },
-      lanterns: [{ x: 352, drop: 8, size: 44 }, { x: 566, drop: 20, size: 56 }],
-      fireworks: [{ x: 366, y: 150, r: 46 }, { x: 562, y: 176, r: 38 }, { x: 428, y: 44, r: 26 }],
-      clouds: [246, 262, 276, 288, 400, 400],
-      dust: { top: 10, bottom: 220 }
-    };
-    sky(k, sheet, s);
-    clouds(k, sheet, s, 0, 3);
-    envelope(k, sheet, {
-      w: 124,
-      u: 0.5,
-      tilt: 5,
-      absolute: { x: 406, y: 44 },
-      lines: [{ text: "88", style: "Figure 36", name: "Figure" }, { text: "days free", style: "Days 12", name: "Days" }]
-    });
-    clouds(k, sheet, s, 3, 6);
-    hangings(k, sheet, s);
-    k.named(sheet, "Firework").forEach((f, i) => reburst(k, f, [1500, 2600, 3500][i], s.u));
-    k.text(sheet, "Lunar New Year \xB7 a gift inside", { style: "Eyebrow 12", color: "onPaper", name: "Eyebrow" });
-    k.text(sheet, "{{brand.offer}}", { style: "Offer 30", color: "text", name: "Offer" });
-    k.text(sheet, "Start the new year square: {{brand.name}} chases your unpaid invoices. Code FRESH88, until the Lantern Festival.", { style: "Account 14", color: "onPaper", name: "Account" });
-    k.instance(sheet, "Button pill", { Label: "Open the envelope" }, { name: "Button" });
-    k.cues(sheet, cues);
-    return k.finish();
-  }
-});
-
-export {
-  lunar_new_year_header_default
-};