@popcraft/kit 0.29.0 → 0.30.0

package/dist/chunks/chunk-AHPGU5PG.js

@@ -1,172 +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,
-  caption,
-  captionCues,
-  captionParts,
-  column,
-  glow,
-  rig,
-  sizes,
-  stage,
-  typeStep
-} from "./chunk-T5EUIGII.js";
-import {
-  key
-} from "./chunk-OTE5FUDA.js";
-import {
-  PHONE,
-  deviceShadow
-} from "./chunk-IGV5QPFA.js";
-import {
-  HOME_PARTS,
-  PHONE_SCREEN,
-  appScreens,
-  homePart
-} from "./chunk-MZVIWZ2V.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  Kit,
-  preset
-} from "./chunk-OFAIOFJQ.js";
-import {
-  ease
-} from "./chunk-MFBWT2Y7.js";
-import {
-  contextFrame,
-  init_scene3d,
-  sceneLayers
-} from "./chunk-NMFXCSU4.js";
-import {
-  init_transform3d,
-  mul4,
-  transform4
-} from "./chunk-CK43FENV.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/motion3d/exploded-ui.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-init_scene3d();
-init_transform3d();
-var DURATION = 8e3;
-var FPS = 30;
-var SIZES = ["video-square", "video-1080p"];
-var BEZEL = (PHONE.width - PHONE_SCREEN.width) / 2;
-var LIFT = 70;
-var PLATE = 10;
-var OPEN = 900;
-var OPENED = 2300;
-var CLOSE = 6300;
-var CLOSED = 7500;
-var LABELS = { Greeting: "Personal greeting", Balance: "Live balance", Shortcuts: "One-tap shortcuts", Activity: "Every transaction", "Tab bar": "Four tabs, that\u2019s all" };
-var CAPTION = { name: "Caption", kicker: "Inside Fern", title: "Everything you need. Nothing you don\u2019t.", body: "Your balance, shortcuts, activity and navigation \u2014 each one tap away." };
-var CUES = [
-  ...captionCues(CAPTION, 300),
-  { layer: "Caption", preset: "fade-out", at: CLOSED, params: { duration: 400 } }
-];
-function build(k, sheet, s) {
-  k.nameSheet(sheet, `Exploded UI \xB7 ${preset(s.preset).name}`);
-  glow(k, sheet, "primary", Math.round(1100 * s.u), s.wide ? s.W * 0.66 : s.W / 2, s.wide ? s.H * 0.55 : s.H * 0.64, 0.5);
-  const scene = stage(k, sheet, s, { duration: DURATION, fps: FPS, perspective: 3200 * s.u });
-  const iso = rig(k, scene, s, "Isometric", PHONE.width, PHONE.height, s.wide ? s.W * 0.7 : s.W * 0.61, s.wide ? s.H * 0.62 : s.H * 0.8);
-  const zoom = s.wide ? 0.8 : 0.54;
-  k.patch(iso, { rotateX: 58, scaleX: zoom, scaleY: zoom });
-  const turn = k.group(iso, { x: 0, y: 0, width: PHONE.width, height: PHONE.height }, { name: "Turn" });
-  k.patch(turn, { rotation: -42 });
-  const home = k.finish().nodes[k.componentIdOf("Screen / Home")];
-  const place = (name) => {
-    const n = Object.values(k.doc.nodes).find((x) => x.parentId === home.id && x.name === name);
-    return { x: BEZEL + n.x, y: BEZEL + n.y };
-  };
-  const layers = [];
-  layers.push({ id: k.rect(turn, PHONE.width, PHONE.height, "device", { radius: PHONE.radius, name: "Phone", stroke: { color: "deviceEdge", width: 3, align: "INSIDE" } }) });
-  const glass = k.rect(turn, PHONE_SCREEN.width, PHONE_SCREEN.height, "screen", { radius: PHONE_SCREEN.radius, name: "Screen" });
-  k.patch(glass, { x: BEZEL, y: BEZEL });
-  layers.push({ id: glass });
-  for (const part of HOME_PARTS) {
-    const card = k.stack(turn, { width: PHONE_SCREEN.width - 48 + 2 * PLATE, fill: "screen", radius: 18, padding: PLATE, name: `${part} layer`, effects: [deviceShadow(0.18, 12, 30)] });
-    homePart(k, card, part);
-    const at = place(part);
-    k.patch(card, { x: at.x - PLATE, y: at.y - PLATE });
-    layers.push({ id: card, label: LABELS[part] });
-  }
-  const tabs = k.instance(turn, "Tab bar/Home", {}, { name: "Tab bar" });
-  k.patch(tabs, { x: BEZEL, y: BEZEL + PHONE_SCREEN.height - 84 });
-  layers.push({ id: tabs, label: LABELS["Tab bar"] });
-  const RANK = [0, 1, 7, 6, 5, 4, 3, 2];
-  layers.forEach(({ id }, i) => {
-    const z = RANK[i] * LIFT, d = RANK[i] * 60;
-    k.patch(id, { z });
-    key(k, id, "z", [[OPEN + d, 0, ease.back(1.4)], [OPENED + d, z, ease.hold], [CLOSE - d, z, ease.inOut("cubic")], [CLOSED - d, 0]]);
-  });
-  const doc = k.finish();
-  const frame = contextFrame(doc.nodes[scene]);
-  const cards = sceneLayers(doc.nodes, scene);
-  const seen = (id, x, y) => {
-    const c = cards.find((l) => l.id === id);
-    const p = transform4(mul4(frame.projection, mul4(frame.view, c.model)), x, y, 0);
-    return { x: p[0] / p[3], y: p[1] / p[3] };
-  };
-  const phone = layers[0].id;
-  const left = Math.min(...[[0, 0], [PHONE.width, 0], [0, PHONE.height], [PHONE.width, PHONE.height]].map(([x, y]) => seen(phone, x, y).x));
-  const labelStyle = typeStep(k, s, "label");
-  const gap = Math.round(14 * s.u);
-  layers.forEach(({ id, label }, i) => {
-    if (!label) return;
-    const n = k.node(id);
-    const at = seen(id, 0, Math.min(n.height, 90) / 2);
-    const edge = Math.min(left, at.x) - Math.round(40 * s.u);
-    const tag = k.stack(sheet, { direction: "HORIZONTAL", width: "HUG", gap, align: "CENTER", name: `${label} label` });
-    k.text(tag, label, { style: labelStyle, color: "text", autoWidth: true, name: "Label" });
-    k.rect(tag, Math.max(Math.round(24 * s.u), Math.round(at.x - edge - gap)), 3, "accent", { radius: 2, name: "Rule" });
-    const box = k.finish().nodes[tag];
-    const text = k.node(k.node(tag).childIds[0]);
-    k.patch(tag, { layoutPositioning: "ABSOLUTE", x: Math.round(edge - text.width), y: Math.round(at.y - box.height / 2) });
-    const d = RANK[i] * 60;
-    key(k, tag, "opacity", [[OPENED + d - 200, 0, ease.out("cubic")], [OPENED + d + 200, 1, ease.hold], [CLOSE - d - 300, 1, ease.out("cubic")], [CLOSE - d, 0]]);
-    key(k, tag, "translateX", [[OPENED + d - 200, Math.round(-30 * s.u), ease.out("cubic")], [OPENED + d + 200, 0]]);
-  });
-  const col = column(s, s.wide ? 120 : 90);
-  captionParts(k, s, { kicker: CAPTION.kicker });
-  const width = s.wide ? Math.round(460 * s.u) : col.width;
-  const block = caption(k, sheet, s, { ...CAPTION, step: "subtitle", width, align: s.wide ? "LEFT" : "CENTER", at: { x: s.wide ? Math.round(130 * s.u) : col.x, y: 0 } });
-  const laid = k.finish().nodes[block];
-  k.patch(block, { y: Math.round(s.wide ? (s.H - laid.height) / 2 - 40 * s.u : 70 * s.u) });
-  k.cues(sheet, CUES);
-}
-var exploded_ui_default = defineTemplate({
-  id: "motion-3d-exploded-ui",
-  meta: {
-    name: "Exploded UI",
-    description: "An app screen seen from above in isometric 3D comes apart into its layers \u2014 screen, greeting, balance, shortcuts, activity, tab bar \u2014 each labelled, then snaps back together. An 8-second loop, square and 16:9 at 30 fps; the layers are your screen's own components",
-    category: "animation",
-    tags: ["animation", "3d", "app", "isometric", "exploded", "layers", "ui", "features", "case study"],
-    platforms: ["instagram", "linkedin", "x", "youtube", "web"],
-    formats: ["post", "video", "ad"],
-    useCases: ["launch", "announcement"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  motion: { cues: CUES },
-  build() {
-    const k = new Kit("Exploded UI", preset(SIZES[0]));
-    brand(k, "dark");
-    appScreens(k, ["Home"]);
-    const [cover] = sizes(k, SIZES, (sheet, s) => build(k, sheet, s));
-    k.setCover(cover);
-    return k.finish();
-  }
-});
-
-export {
-  exploded_ui_default
-};

package/dist/chunks/chunk-AI5HKNKJ.js

@@ -1,95 +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 {
-  feedVariants,
-  outro,
-  pill,
-  verticalPadding
-} from "./chunk-LEKU2ZW3.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  Kit,
-  preset
-} from "./chunk-OFAIOFJQ.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/social/promo-tip-list.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var TIPS = [
-  ["1", "Turn the thermostat down 1 \xB0C \u2014 it can cut heating use by up to 10%"],
-  ["2", "Seal drafts around doors, windows and the letterbox"],
-  ["3", "Bleed the radiators so every one heats evenly"],
-  ["4", "Close the curtains at dusk to keep the warmth in"],
-  ["5", "Heat the rooms you use, and shut the doors to the rest"]
-];
-var cues = [
-  { layer: "Series tag", preset: "drop-in", at: 100 },
-  { layer: "Headline", preset: "rise-in", at: 300, params: { duration: 700 } },
-  { layer: "Tip", preset: "slide-in", at: 1e3, params: { direction: "left", distance: 160 }, stagger: { delay: 320 } },
-  { layer: "Handle", preset: "fade-in", at: 2600 },
-  { layer: "Tip", preset: "pulse", at: 4400, params: { amount: 0.03, duration: 700 }, stagger: { delay: 1300 } },
-  outro(["Series tag", "Headline", "Tip", "Handle"], 12400, { preset: "rise-out", gap: 90 })
-];
-var promo_tip_list_default = defineTemplate({
-  id: "motion-promo-tip-list",
-  meta: {
-    name: "Tip list promo",
-    description: "A 14-second vertical explainer: a headline rises and five tips slide in one after another from one tip component, each nudged in turn as it is read \u2014 9:16 with square and 4:5 cuts",
-    category: "animation",
-    tags: ["animation", "tips", "list", "how to", "reel", "tiktok", "shorts", "education", "stagger"],
-    platforms: ["instagram", "tiktok", "youtube", "linkedin", "facebook"],
-    formats: ["reel", "short", "story", "post", "portrait-post"],
-    useCases: ["tips", "education"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  motion: { cues, loop: true },
-  build() {
-    const k = new Kit("Tip list promo", preset("ig-story"));
-    k.brand(
-      { paper: "#EEF6EE", text: "#10301F", onPaper: "#43604F", primary: "#1F6F4A", onPrimary: "#FFFFFF", accent: "#F4C542", onAccent: "#10301F", card: "#FFFFFF", onCard: "#10301F" },
-      { headline: "5 ways to cut your heating bill this winter", handle: "@greenlineenergy \xB7 greenline.coop/save" }
-    );
-    k.textStyle("Headline 76", { size: 76, fontWeight: 800, letterSpacing: -2, lineHeight: 80 });
-    k.textStyle("Headline 60", { size: 60, fontWeight: 800, letterSpacing: -2, lineHeight: 64 });
-    k.textStyle("Tag 28", { size: 28, fontWeight: 800, letterSpacing: 3, lineHeight: 32 });
-    k.textStyle("Number 40", { size: 40, fontWeight: 800, lineHeight: 44, textAlign: "CENTER" });
-    k.textStyle("Tip 34", { size: 34, fontWeight: 600, lineHeight: 42 });
-    k.textStyle("Handle 28", { size: 28, fontWeight: 600, lineHeight: 36 });
-    pill(k, "Tag", { fill: "accent", ink: "onAccent", style: "Tag 28", label: "WINTER SAVINGS" });
-    k.component("Tip row", { direction: "HORIZONTAL", width: 800, fill: "card", radius: 28, gap: 24, align: "CENTER", padding: { top: 22, right: 28, bottom: 22, left: 22 }, props: { N: "1", Tip: "A tip" } }, (id) => {
-      const disc = k.stack(id, { width: 72, height: 72, fill: "primary", radius: 36, justify: "CENTER", align: "CENTER", name: "Disc" });
-      k.propText(disc, "N", { style: "Number 40", color: "onPrimary", width: 72 });
-      k.propText(id, "Tip", { style: "Tip 34", color: "onCard", width: "FILL" });
-    });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 20, verticalPadding(), "paper", "CENTER", "MIN");
-    k.timeline(sheet, { duration: 14e3, fps: 30 });
-    k.instance(sheet, "Tag", { Label: "WINTER SAVINGS" }, { name: "Series tag" });
-    k.text(sheet, "{{brand.headline}}", { style: "Headline 76", color: "text", name: "Headline" });
-    const list = k.stack(sheet, { gap: 16, name: "Tips" });
-    for (const [n, tip] of TIPS) k.instance(list, "Tip row", { N: n, Tip: tip }, { width: "FILL", name: "Tip" });
-    k.text(sheet, "{{brand.handle}}", { style: "Handle 28", color: "onPaper", name: "Handle" });
-    k.cues(sheet, cues);
-    k.variants(sheet, feedVariants({ post: 56, portrait: 72 }, {
-      post: (kit, id) => {
-        kit.patch(id, { itemSpacing: 14, counterAxisSpacing: 14 });
-        for (const n of kit.named(id, "Headline")) kit.restyle(n, "Headline 60");
-        for (const n of kit.named(id, "Tips")) kit.patch(n, { itemSpacing: 10, counterAxisSpacing: 10 });
-      }
-    }));
-    return k.finish();
-  }
-});
-
-export {
-  promo_tip_list_default
-};

package/dist/chunks/chunk-AJDY5EE2.js

@@ -1,90 +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 {
-  EMAIL_FPS,
-  HEADER,
-  sparkle
-} from "./chunk-MUCU3TXB.js";
-import {
-  pill
-} from "./chunk-LEKU2ZW3.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  Kit
-} from "./chunk-OFAIOFJQ.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/email/header-launch.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var LAUNCH_HEADER = {
-  duration: 4800,
-  sparkles: [
-    { x: 36, y: 40, size: 20, phase: 0 },
-    { x: 540, y: 52, size: 24, phase: 0.25 },
-    { x: 60, y: 236, size: 14, phase: 0.5 },
-    { x: 526, y: 226, size: 16, phase: 0.75 }
-  ]
-};
-var LAUNCH_CUES = [
-  { layer: "New chip", preset: "wobble", at: 300, params: { duration: 800 } },
-  { layer: "Spec", preset: "pulse", at: 1400, params: { duration: 600, amount: 0.08 }, stagger: { delay: 450 } },
-  { layer: "Button", preset: "pulse", at: 3300, params: { duration: 700, amount: 0.07 } }
-];
-var header_launch_default = defineTemplate({
-  id: "email-header-launch",
-  meta: {
-    name: "Launch email header (animated GIF)",
-    description: "A 600 \xD7 300 animated header for a product launch email: the new product, its pitch, three numbers and the button are all on the first frame (for Outlook), then the NEW chip wobbles, the numbers light up in turn and sparkles turn \u2014 a seamless 4.8-second GIF loop",
-    category: "email",
-    tags: ["email", "gif", "animated", "header", "banner", "launch", "new product", "announcement", "outdoor"],
-    platforms: ["email"],
-    formats: ["email", "banner"],
-    useCases: ["launch", "announcement"],
-    created: "2026-09-30",
-    updated: "2026-09-30"
-  },
-  motion: { cues: LAUNCH_CUES, loop: true },
-  build() {
-    const L = LAUNCH_HEADER;
-    const k = new Kit("Launch email header", HEADER);
-    k.brand(
-      { paper: "#F3EEE4", text: "#1B2430", onPaper: "#4A5563", primary: "#E4572E", onPrimary: "#12161C", card: "#1B2430", onCard: "#F3EEE4", sparkle: "#E4572E" },
-      { product: "Meet the Trailhead 2", pitch: "Our lightest daypack yet, made from recycled sailcloth" }
-    );
-    k.textStyle("Chip 12", { size: 12, fontWeight: 800, letterSpacing: 2.5, lineHeight: 14 });
-    k.textStyle("Product 50", { size: 50, fontWeight: 900, letterSpacing: -1.5, lineHeight: 54, textAlign: "CENTER" });
-    k.textStyle("Pitch 16", { size: 16, fontWeight: 500, lineHeight: 22, textAlign: "CENTER" });
-    k.textStyle("Spec 14", { size: 14, fontWeight: 800, lineHeight: 18 });
-    k.textStyle("Button 16", { size: 16, fontWeight: 800, lineHeight: 20 });
-    pill(k, "Chip", { fill: "primary", ink: "onPrimary", style: "Chip 12", label: "NEW", pad: [5, 14] });
-    pill(k, "Spec pill", { fill: "card", ink: "onCard", style: "Spec 14", label: "610 g", pad: [6, 14] });
-    pill(k, "Button pill", { fill: "primary", ink: "onPrimary", style: "Button 16", label: "See the Trailhead 2", pad: [10, 26] });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 10, { top: 30, right: 40, bottom: 30, left: 40 }, "paper", "CENTER", "CENTER");
-    k.patch(sheet, { clipsContent: true });
-    k.timeline(sheet, { duration: L.duration, fps: EMAIL_FPS });
-    for (const [i, s] of L.sparkles.entries()) sparkle(k, sheet, { ...s, color: "sparkle", loopMs: L.duration, cycles: 2, name: `Sparkle ${i + 1}` });
-    k.instance(sheet, "Chip", { Label: "NEW" }, { name: "New chip" });
-    k.text(sheet, "{{brand.product}}", { style: "Product 50", color: "text", name: "Product" });
-    k.text(sheet, "{{brand.pitch}}", { style: "Pitch 16", color: "onPaper", name: "Pitch" });
-    const specs = k.stack(sheet, { direction: "HORIZONTAL", width: "HUG", gap: 8, name: "Specs" });
-    for (const s of ["610 g", "22 litres", "100% recycled"]) k.instance(specs, "Spec pill", { Label: s }, { name: "Spec" });
-    k.instance(sheet, "Button pill", { Label: "See the Trailhead 2" }, { name: "Button" });
-    k.cues(sheet, LAUNCH_CUES);
-    return k.finish();
-  }
-});
-
-export {
-  LAUNCH_HEADER,
-  LAUNCH_CUES,
-  header_launch_default
-};

package/dist/chunks/chunk-AJTPNLBZ.js

@@ -1,160 +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 {
-  bindShaderAudio
-} from "./chunk-HLOZ3NNW.js";
-import {
-  init_shader_params,
-  reflectShader
-} from "./chunk-TSWHCDM7.js";
-import {
-  graphColors,
-  shaderPreset
-} from "./chunk-PD6JKRYP.js";
-import {
-  graphPaint
-} from "./chunk-P3462NFV.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/music/parts.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-init_shader_params();
-var audio = (m) => ({ kind: "audio", ...m });
-var at = (x, y) => ({ x, y });
-var restShape = (i, n) => {
-  const u = i / Math.max(1, n - 1);
-  const v = 0.35 + 0.4 * Math.abs(Math.sin(i * 0.61) * Math.cos(i * 0.23 + 0.7)) + 0.25 * Math.sin(Math.PI * u);
-  return Math.round(Math.max(0.12, Math.min(1, v)) * 100) / 100;
-};
-function bindColour(k, id, prop) {
-  if (prop) k.bindPath(id, "fills[#0].color", prop);
-}
-function waveform(k, parent, o) {
-  const n = o.count ?? 48;
-  const history = o.history ?? 2400;
-  const box = k.stack(parent, { width: o.width, height: o.height, name: o.name ?? "Waveform", ...o.at ? { absolute: at(o.at.x, o.at.y) } : {} });
-  const step = o.width / n;
-  const w = o.style === "line" ? Math.min(step * 0.9, 10) : Math.max(2, step * 0.62);
-  for (let i = 0; i < n; i++) {
-    const lag = Math.round((n - 1 - i) / (n - 1) * history);
-    const x = i * step + (step - w) / 2;
-    const signal = audio({ signal: "level", gain: o.gain ?? 1, from: 0, to: 1, lag, attack: o.style === "line" ? 40 : 0, release: o.style === "line" ? 180 : 90 });
-    if (o.style === "line") {
-      const dot = k.ellipse(box, w, o.color, { name: "Dot", absolute: at(x, o.height - w) });
-      bindColour(k, dot, o.colorProp);
-      k.patch(dot, { translateY: -Math.round(restShape(i, n) * (o.height - w)) });
-      k.behave(dot, "translateY", [{ ...signal, mode: "set", from: 0, to: -(o.height - w) }]);
-    } else {
-      const bar = k.rect(box, w, o.height, o.color, { radius: w / 2, name: "Bar", absolute: at(x, 0) });
-      bindColour(k, bar, o.colorProp);
-      k.patch(bar, { anchorY: o.style === "bars" ? 1 : 0.5, scaleY: restShape(i, n) });
-      k.behave(bar, "scaleY", [{ ...signal, mode: "set", from: 0.06, to: 1 }]);
-    }
-  }
-  return box;
-}
-function spectrumBars(k, parent, o) {
-  const n = o.count ?? 32;
-  const [lo, hi] = o.range ?? [0, 0.9];
-  const box = k.stack(parent, { width: o.width, height: o.height, name: o.name ?? "Spectrum", ...o.at ? { absolute: at(o.at.x, o.at.y) } : {} });
-  const step = o.width / n, w = step * 0.7;
-  for (let i = 0; i < n; i++) {
-    const bar = k.rect(box, w, o.height, o.color, { radius: Math.min(6, w / 3), name: "Band", absolute: at(i * step + (step - w) / 2, 0) });
-    bindColour(k, bar, o.colorProp);
-    k.patch(bar, { anchorY: 1, scaleY: Math.round(Math.max(0.1, (0.95 - 0.6 * i / n) * (0.75 + 0.25 * restShape(i, n))) * 100) / 100 });
-    const bin = Math.round((lo + (hi - lo) * i / Math.max(1, n - 1)) * 100) / 100;
-    k.behave(bar, "scaleY", [audio({ signal: "spectrum", bin, gain: o.gain ?? 1.15, mode: "set", from: 0.03, to: 1, attack: 10, release: 200 })]);
-  }
-  return box;
-}
-function circularSpectrum(k, parent, o) {
-  const n = o.count ?? 48;
-  const D = 2 * (o.radius + o.length);
-  const box = k.stack(parent, { width: D, height: D, name: o.name ?? "Circular spectrum", ...o.at ? { absolute: at(o.at.x, o.at.y) } : {} });
-  const bw = o.barWidth ?? Math.max(3, 2 * Math.PI * o.radius / n * 0.55);
-  for (let i = 0; i < n; i++) {
-    const spoke = k.stack(box, { width: D, height: D, name: "Spoke", absolute: at(0, 0) });
-    k.patch(spoke, { rotation: 180 + i * 360 / n });
-    const bar = k.rect(spoke, bw, o.length, o.color, { radius: bw / 2, name: "Band", absolute: at(D / 2 - bw / 2, D / 2 - o.radius - o.length) });
-    bindColour(k, bar, o.colorProp);
-    k.patch(bar, { anchorY: 1, scaleY: restShape(Math.min(i, n - i), n / 2) });
-    const bin = Math.round(Math.min(i, n - i) / (n / 2) * 0.8 * 100) / 100;
-    k.behave(bar, "scaleY", [audio({ signal: "spectrum", bin, gain: o.gain ?? 1.2, mode: "set", from: 0.08, to: 1, attack: 10, release: 170 })]);
-  }
-  return box;
-}
-function pulseRing(k, parent, o) {
-  const box = k.stack(parent, { width: o.size, height: o.size, name: o.name ?? "Pulse ring", ...o.at ? { absolute: at(o.at.x, o.at.y) } : {} });
-  const sw = o.stroke ?? Math.max(4, o.size / 40);
-  const ring = (name) => k.ellipse(box, o.size * 0.6, [], { stroke: { color: o.color, width: sw, align: "CENTER" }, name, absolute: at(o.size * 0.2, o.size * 0.2) });
-  const echo = ring("Echo");
-  const main = ring("Ring");
-  if (o.colorProp) for (const id of [echo, main]) k.bindPath(id, "strokes[#0].color", o.colorProp);
-  for (const axis of ["scaleX", "scaleY"]) {
-    k.behave(main, axis, [audio({ signal: "bass", gain: 1, from: 0, to: 0.22, attack: 5, release: 140 })]);
-    k.behave(echo, axis, [audio({ signal: "beat", gain: 1, from: 0.6, to: 0, release: 320 })]);
-  }
-  k.behave(echo, "opacity", [audio({ signal: "beat", gain: 1, mode: "set", from: 0, to: 0.85, release: 320 })]);
-  k.patch(echo, { opacity: 0.35, scaleX: 1.3, scaleY: 1.3 });
-  return box;
-}
-function vuMeter(k, parent, o) {
-  const n = o.segments ?? 16;
-  const box = k.stack(parent, { width: o.width, height: o.height, name: o.name ?? "VU meter", ...o.at ? { absolute: at(o.at.x, o.at.y) } : {} });
-  const along = o.vertical ? o.height : o.width;
-  const step = along / n, len = step * 0.78;
-  const SLOPE = 14;
-  for (let i = 0; i < n; i++) {
-    const role = i >= n - 2 ? o.colors[2] : i >= n - 5 ? o.colors[1] : o.colors[0];
-    const pos = o.vertical ? at(0, o.height - (i + 1) * step) : at(i * step, 0);
-    const seg = k.rect(box, o.vertical ? o.width : len, o.vertical ? len : o.height, role, { radius: 3, name: "Segment", absolute: pos });
-    const th = (i + 0.5) / n;
-    k.patch(seg, { opacity: th < 0.7 ? 1 : 0.15 });
-    k.behave(seg, "opacity", [
-      audio({ signal: "level", gain: 1, mode: "set", from: 0.15 - SLOPE * th, to: 0.15 + SLOPE * (1 - th), attack: 8, release: 300 }),
-      { kind: "clamp", min: 0.15, max: 1 }
-    ]);
-  }
-  return box;
-}
-function beatFlash(k, id, peak = 0.7, release = 200) {
-  k.patch(id, { opacity: 0 });
-  k.behave(id, "opacity", [audio({ signal: "beat", gain: 1, mode: "set", from: 0, to: peak, release })]);
-}
-function bassKick(k, id, amount = 0.12, release = 120) {
-  for (const axis of ["scaleX", "scaleY"]) k.behave(id, axis, [audio({ signal: "bass", gain: 1, mode: "multiply", from: 1, to: 1 + amount, attack: 5, release })]);
-}
-function visualizer(k, parent, preset, colors, o = {}) {
-  const p = shaderPreset(preset);
-  if (!p) throw new Error(`no visualizer "${preset}"`);
-  const f = k.node(parent);
-  const role = (r) => r ? k.color(r) : void 0;
-  const params = { ...graphColors(p, { bg: role(colors.bg), a: role(colors.a), b: role(colors.b), c: role(colors.c) }), ...o.knobs };
-  const fill = graphPaint({ id: "f1", type: "SHADER", visible: true, opacity: 1, shaderParams: params }, p.graph, p.name);
-  const fields = reflectShader(fill.shaderCode).params;
-  for (const key of Object.keys(o.knobs ?? {})) if (!fields.some((q) => q.name === key)) throw new Error(`visualizer ${preset}: no knob "${key}" (it has ${fields.map((q) => q.name).join(", ")})`);
-  for (const q of fields) if (q.audio) fill.shaderParams[q.name] = o.rest ?? 0.45;
-  const b = o.box ?? { x: 0, y: 0, width: f.width, height: f.height };
-  const opts = { name: o.name ?? "Visualizer", absolute: at(b.x, b.y) };
-  const id = o.ellipse ? k.ellipse(parent, b.width, [fill], opts) : k.rect(parent, b.width, b.height, [fill], opts);
-  k.apply(id, bindShaderAudio);
-  return id;
-}
-
-export {
-  restShape,
-  waveform,
-  spectrumBars,
-  circularSpectrum,
-  pulseRing,
-  vuMeter,
-  beatFlash,
-  bassKick,
-  visualizer
-};

package/dist/chunks/chunk-AJUJ262D.js

@@ -1,80 +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 {
-  standardPortfolio
-} from "./chunk-JI3GJNDK.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/web/portfolio-flip-wall.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var WORK = [
-  { title: "Moon Moggy", client: "Pocket Planet Toys", year: "2026", kind: "Vinyl figure", cover: "flip-00", summary: "A sleepy astronaut cat in a fishbowl helmet, the lead of a space toy line.", story: "Modelled for 3D print and vinyl from one sculpt. The helmet is a separate clear part that pops off for the cat to nap.", credits: "Character design, sculpt \u2014 Kiko Hart" },
-  { title: "Sir Berry", client: "Fruit Guard Club", year: "2026", kind: "Mascot", cover: "flip-01", summary: "A tiny knight who is also a strawberry, for a children\u2019s smoothie brand.", story: "Thirty expressions, a turnaround and the first animated short for the brand\u2019s launch.", credits: "Character design \u2014 Kiko Hart \xB7 Animation \u2014 Bounce Studio" },
-  { title: "Se\xF1or Spike", client: "Desert Bloom Caf\xE9", year: "2025", kind: "Mascot", cover: "flip-02", summary: "A grumpy cactus in a sombrero and tiny boots.", story: "He appears on the caf\xE9\u2019s cups, scowling more as the cup gets bigger.", credits: "Character design \u2014 Kiko Hart" },
-  { title: "Sprout Bot", client: "Greenhouse Kids", year: "2025", kind: "Game character", cover: "flip-03", summary: "A gardener robot with a watering-can head, for a farming game.", story: "Rigged for the game engine with twelve emotes; the watering can tips when it is happy.", credits: "Character design, model \u2014 Kiko Hart" },
-  { title: "Chef Boo", client: "Haunted Bakery", year: "2024", kind: "Vinyl figure", cover: "flip-04", summary: "A ghost chef with a steaming pie, glow-in-the-dark edition.", story: "A limited run of 500; the steam is a separate translucent part.", credits: "Character design, sculpt \u2014 Kiko Hart" },
-  { title: "DJ Ribbit", client: "Pond Records", year: "2024", kind: "Album mascot", cover: "flip-05", summary: "A frog DJ with headphones too big for him, for a label\u2019s compilation series.", story: "One pose per volume; volume six is him asleep on the decks.", credits: "Character design \u2014 Kiko Hart" },
-  { title: "Morel the Wise", client: "Forest Quest", year: "2023", kind: "Game character", cover: "flip-06", summary: "A mushroom wizard whose staff lights the way through a dark level.", story: "The staff is the player\u2019s only light source, so its glow had to read at every size.", credits: "Character design \u2014 Kiko Hart" },
-  { title: "Penny Post", client: "Snowmail", year: "2023", kind: "App mascot", cover: "flip-07", summary: "A penguin mail carrier on roller skates, for a messaging app.", story: "She skates in when a message arrives and falls over when it fails to send.", credits: "Character design, animation \u2014 Kiko Hart" }
-];
-var portfolio_flip_wall_default = defineTemplate({
-  id: "web-portfolio-flip-wall",
-  meta: {
-    name: "Flip card portfolio",
-    description: "A character designer\u2019s portfolio where every card flips over in 3D into its page: square renders four across on a pastel ground, a page per character, and a studio page. The flip is drawn on the GPU with WebGPU, in CSS 3D elsewhere. The characters are a collection you edit as a table. Desktop, tablet and phone",
-    category: "web",
-    tags: ["portfolio", "3d", "flip", "transition", "webgpu", "character design", "toys", "playful", "cms", "website", "responsive"],
-    platforms: ["web"],
-    formats: ["page"],
-    useCases: ["portfolio"],
-    created: "2026-10-05",
-    updated: "2026-10-05"
-  },
-  breakpoints: true,
-  build: () => standardPortfolio({
-    name: "Flip cards",
-    brand: { paper: "#F6E7F0", text: "#2B1B3D", onPaper: "#665673", primary: "#6B4BFF", onPrimary: "#FFFFFF", card: "#FFFFFF", onCard: "#2B1B3D", cardMuted: "#665673", line: "#E9D3E2" },
-    fields: { name: "Kiko Hart", email: "kiko@kikohart.toys" },
-    styles: {
-      "Wordmark 20": { size: 20, fontWeight: 800, letterSpacing: -0.4, lineHeight: 26 },
-      "Small 14": { size: 14, fontWeight: 600, lineHeight: 20 },
-      "Meta 13": { size: 13, fontWeight: 500, lineHeight: 18 },
-      "Title 17": { size: 17, fontWeight: 800, letterSpacing: -0.2, lineHeight: 22 },
-      "Lead 22": { size: 22, fontWeight: 600, letterSpacing: -0.3, lineHeight: 30 },
-      "Body 17": { size: 17, fontWeight: 400, lineHeight: 27 },
-      "Display 64": { size: 64, fontWeight: 800, letterSpacing: -2.4, lineHeight: 66 },
-      "Display 40": { size: 40, fontWeight: 800, letterSpacing: -1.2, lineHeight: 44 }
-    },
-    type: { wordmark: "Wordmark 20", small: "Small 14", meta: "Meta 13", title: "Title 17", lead: "Lead 22", body: "Body 17", display: "Display 64", displaySmall: "Display 40" },
-    projects: WORK,
-    go: "FLIP_HORIZONTAL",
-    back: "FLIP_HORIZONTAL",
-    links: [["work", "Characters"], ["studio", "Studio"]],
-    lead: { headline: "Characters you want to keep on your desk.", intro: "Kiko Hart designs mascots, game characters and vinyl toys, and sculpts every one of them before it is drawn flat.", center: true, width: 900 },
-    grid: { cols: 4, gap: 20, ratio: 1, radius: 18, card: { fill: "card", pad: 10, radius: 26 }, meta: "{{item.kind}}", center: true, tablet: 2, mobile: 2 },
-    project: { ratio: 1, split: true, kicker: "Character", more: { cols: 4, ratio: 1, label: "More characters" } },
-    studio: {
-      statement: "One designer, one 3D printer and a shelf of very small friends.",
-      about: "I design characters for toy companies, games and brands that want a face. I sculpt in 3D first, print a test, and only then draw the turnarounds.",
-      picture: "flip-05",
-      ratio: 0.45,
-      services: ["Character design", "Mascots and brand characters", "Vinyl and resin toys", "Game-ready models"],
-      clients: "Pocket Planet Toys, Fruit Guard Club, Greenhouse Kids, Pond Records, Forest Quest and Snowmail.",
-      contact: "Open for two characters a quarter."
-    },
-    elsewhere: "Instagram \xB7 ArtStation"
-  })
-});
-
-export {
-  portfolio_flip_wall_default
-};