@popcraft/kit 0.32.0 → 0.33.0

package/dist/chunks/chunk-SISBABG6.js

@@ -0,0 +1,45 @@
+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 {
+  style_data_landing_default
+} from "./chunk-3FPD23CD.js";
+import {
+  style_data_pricing_default
+} from "./chunk-MEUNPZU6.js";
+import {
+  style_data_announcement_default
+} from "./chunk-WNW5NHDZ.js";
+import {
+  style_data_link_preview_default
+} from "./chunk-BYEMTIKK.js";
+import {
+  style_data_milestone_default
+} from "./chunk-UJ7JMU3N.js";
+import {
+  style_data_testimonial_default
+} from "./chunk-43LYX3AE.js";
+import {
+  style_data_feature_demo_default
+} from "./chunk-3XHIDRSY.js";
+import {
+  style_data_launch_reel_default
+} from "./chunk-MBIXCWJ6.js";
+import {
+  style_data_header_default
+} from "./chunk-3AUJ2UUM.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-FFS4SO7R.js";
+
+// templates/src/saas/style-data.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var pack = [style_data_launch_reel_default, style_data_feature_demo_default, style_data_landing_default, style_data_pricing_default, style_data_announcement_default, style_data_milestone_default, style_data_testimonial_default, style_data_header_default, style_data_link_preview_default];
+var style_data_default = pack;
+
+export {
+  style_data_default
+};

package/dist/chunks/chunk-SJ4CTSQZ.js

@@ -0,0 +1,77 @@
+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 {
+  standardStore
+} from "./chunk-QWUTBLC6.js";
+import {
+  defineTemplate
+} from "./chunk-YKWT2Q3P.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-FFS4SO7R.js";
+
+// templates/src/web/shop-circuit.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var PRODUCTS = [
+  { title: "Aria wireless headphones", handle: "aria-wireless-headphones", price: "$349.00", image: "ci-headphones", tags: "headphones", description: "Planar drivers, 40 hours of battery and noise cancelling you can turn down to a hush." },
+  { title: "Aria buds", handle: "aria-buds", price: "$199.00", image: "ci-earbuds", tags: "headphones", description: "Six millimetre graphene drivers and a case that charges on any pad." },
+  { title: "Pulse speaker", handle: "pulse-speaker", price: "$149.00", image: "ci-speaker", tags: "speakers", description: "360 degrees of sound from a can-sized speaker, waterproof to a metre." },
+  { title: "Groove turntable", handle: "groove-turntable", price: "$429.00", image: "ci-turntable", tags: "hifi", description: "A belt-drive turntable with a built-in phono stage and a carbon tonearm." },
+  { title: "Node desktop amp", handle: "node-desktop-amp", price: "$259.00", image: "ci-dac", tags: "hifi", description: "A balanced headphone amplifier and DAC with a knob that feels like a safe dial." },
+  { title: "Braided cable", handle: "braided-cable", price: "$29.00", image: "ci-cable", tags: "accessories", description: "A 1.5 metre braided cable, 3.5 mm to 4.4 mm balanced." }
+];
+var shop_circuit_default = defineTemplate({
+  id: "web-shop-circuit",
+  meta: {
+    name: "Circuit audio store",
+    description: "A hi-fi and audio electronics store, dark navy with an electric blue, a modern grotesk and mono details: a split hero, lively entrances, framed cards, a carousel, categories, a page per product with add to cart and a cart with checkout. Publishes as a Next.js Commerce store selling your Shopify products. Desktop, tablet and phone",
+    category: "storefront",
+    tags: ["ecommerce", "shop", "store", "storefront", "shopify", "next.js commerce", "product page", "cart", "electronics", "audio", "headphones", "tech", "dark", "modern", "website", "responsive", "animation"],
+    platforms: ["web"],
+    formats: ["page"],
+    useCases: ["launch", "sale"],
+    created: "2026-10-09",
+    updated: "2026-10-09"
+  },
+  breakpoints: true,
+  build: () => standardStore({
+    name: "Circuit audio store",
+    brand: { paper: "#0B1020", text: "#E9EEFA", onPaper: "#8A95B3", primary: "#2C62D9", onPrimary: "#FFFFFF", card: "#121A30", onCard: "#E9EEFA", cardMuted: "#8A95B3", tint: "#0F162A", onTint: "#E9EEFA", tintMuted: "#8A95B3", line: "#1F2A47" },
+    fields: { name: "Circuit Audio", email: "support@circuit.audio" },
+    styles: {
+      "Wordmark 22": { size: 22, fontFamily: "Space Grotesk", fontWeight: 700, letterSpacing: -0.4, lineHeight: 28 },
+      "Nav 14": { size: 14, fontFamily: "JetBrains Mono", fontWeight: 500, lineHeight: 20 },
+      "Display 76": { size: 76, fontFamily: "Space Grotesk", fontWeight: 700, letterSpacing: -2.4, lineHeight: 78 },
+      "Display 44": { size: 44, fontFamily: "Space Grotesk", fontWeight: 700, letterSpacing: -1, lineHeight: 48 },
+      "Section 32": { size: 32, fontFamily: "Space Grotesk", fontWeight: 600, letterSpacing: -0.6, lineHeight: 38 },
+      "Title 16": { size: 16, fontFamily: "Space Grotesk", fontWeight: 600, lineHeight: 22 },
+      "Price 14": { size: 14, fontFamily: "JetBrains Mono", fontWeight: 500, lineHeight: 20 },
+      "Body 17": { size: 17, fontWeight: 400, lineHeight: 27 },
+      "Small 13": { size: 13, fontFamily: "JetBrains Mono", fontWeight: 500, lineHeight: 18 },
+      "Button 15": { size: 15, fontFamily: "Space Grotesk", fontWeight: 600, lineHeight: 22 }
+    },
+    type: { wordmark: "Wordmark 22", nav: "Nav 14", display: "Display 76", displaySmall: "Display 44", section: "Section 32", title: "Title 16", price: "Price 14", body: "Body 17", small: "Small 13", button: "Button 15" },
+    products: PRODUCTS,
+    categories: [{ title: "Headphones", handle: "headphones", description: "Over-ear and in-ear, wired and not." }, { title: "Speakers", handle: "speakers", description: "Small boxes that fill rooms." }, { title: "Hi-fi", handle: "hifi", description: "Turntables, amps and DACs." }, { title: "Accessories", handle: "accessories", description: "Cables, cases and stands." }],
+    carousel: "The whole line-up",
+    menu: [["Shop all", "/search"], ["Headphones", "/search/headphones"], ["Hi-fi", "/search/hifi"]],
+    hero: { kicker: "NEW \xB7 ARIA WIRELESS", headline: "Hear the room the record was made in", lead: "Planar-magnetic drivers, forty hours of battery and noise cancelling tuned by the engineers who mix the records.", cta: "Shop headphones", image: "ci-hero", layout: "split" },
+    story: { title: "Measured, then listened to", body: "Every product is measured in an anechoic chamber and then lived with for a month by people who care more about music than numbers.", image: "ci-turntable" },
+    promise: ["Free 2-day shipping \xB7 60-night trial", "Two-year warranty, extendable to five"],
+    newsletter: { title: "Signal", body: "New gear, firmware and the records we test with. Twice a month." },
+    legal: "Prices in USD, sales tax at checkout.",
+    card: "framed",
+    motion: "lively",
+    float: true,
+    ratio: 1,
+    radius: 14
+  })
+});
+
+export {
+  shop_circuit_default
+};

package/dist/chunks/chunk-SLGZKSF7.js

@@ -0,0 +1,412 @@
+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 {
+  blurred,
+  noise
+} from "./chunk-M6VTXO6F.js";
+import {
+  curve3,
+  pt3,
+  r3,
+  rng
+} from "./chunk-6RCDZU4R.js";
+import {
+  ease
+} from "./chunk-AY2VBUGS.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-FFS4SO7R.js";
+
+// templates/src/themes/back-to-school-shared.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+function schoolBrand(k, fields = {}) {
+  k.brand(
+    { paper: "#21403A", text: "#F6F2E6", onPaper: "#C3D6CC", accent: "#F4CF5B", onAccent: "#1B261F", primary: "#F4CF5B", onPrimary: "#1B261F", card: "#172E29", onCard: "#F6F2E6" },
+    { name: "Quire", site: "quire.example", ...fields }
+  );
+  k.palette({
+    chalk: "#F6F2E6",
+    chalkYellow: "#F4CF5B",
+    chalkPink: "#F2A0A8",
+    chalkBlue: "#9CCBE6",
+    wood: "#B98A55",
+    woodLight: "#DDB684",
+    woodDeep: "#7B5631",
+    felt: "#2B3138",
+    feltLight: "#56606B",
+    sheet: "#FBF6E6",
+    sheetShade: "#E9DFC4",
+    rule: "#A9C3DA",
+    margin: "#DE6B62",
+    ink: "#1F2A37",
+    inkSoft: "#56616D",
+    hiYellow: "#FCE27A",
+    hiPink: "#F9B9C3",
+    hiBlue: "#B5DDF2",
+    hiGreen: "#C2E6B6",
+    stampRed: "#9E2416",
+    stampBlue: "#234A91",
+    gold: "#F2B531",
+    goldDeep: "#B97F12",
+    goldLight: "#FFE9A6",
+    tape: "#EFE3B8",
+    shade: "#08130F"
+  });
+}
+var cast = (u, a = 0.45) => ({ type: "DROP_SHADOW", color: { r: 0.02, g: 0.06, b: 0.05, a }, offset: { x: 0, y: r3(8 * u) }, blur: r3(22 * u), spread: 0, visible: true });
+var tooth = (u, amount = 0.07) => noise({ id: "grain", amount, size: Math.max(1, Math.round(3 * u)), seed: 13 });
+var poly = (points, closed = false) => ({ closed, points: points.map((p) => pt3(p.x, p.y)) });
+function boxed(part, paths) {
+  const all = paths.flatMap((p) => p.points.flatMap((q) => [q, ...q.handleIn ? [q.handleIn] : [], ...q.handleOut ? [q.handleOut] : []]));
+  const xs = all.map((p) => p.x), ys = all.map((p) => p.y), x0 = Math.min(...xs), y0 = Math.min(...ys);
+  const move = (q) => pt3(q.x - x0, q.y - y0);
+  return {
+    ...part,
+    x: r3(x0),
+    y: r3(y0),
+    w: r3(Math.max(1, Math.max(...xs) - x0)),
+    h: r3(Math.max(1, Math.max(...ys) - y0)),
+    paths: paths.map((p) => ({ closed: p.closed, points: p.points.map((q) => ({ ...move(q), ...q.handleIn ? { handleIn: move(q.handleIn) } : {}, ...q.handleOut ? { handleOut: move(q.handleOut) } : {} })) }))
+  };
+}
+function draw(k, parent, parts) {
+  for (const p of parts) {
+    const o = { name: p.name, absolute: { x: p.x, y: p.y }, ...p.opacity !== void 0 ? { opacity: p.opacity } : {}, ...p.radius ? { radius: p.radius } : {}, ...p.effects ? { effects: p.effects } : {} };
+    const fill = typeof p.ink === "string" ? p.ink : p.ink(k);
+    const id = p.shape === "rect" ? k.rect(parent, p.w, p.h, fill, o) : p.shape === "fill" ? k.vector(parent, p.w, p.h, p.paths ?? [], fill, o) : k.vector(parent, p.w, p.h, p.paths ?? [], p.ink, { ...o, strokeWidth: r3(p.width ?? 2) });
+    if (p.rotation) k.patch(id, { rotation: p.rotation });
+  }
+}
+function refit(k, root, parts, was = []) {
+  const kept = new Set(parts.map((p) => p.name));
+  for (const p of was) if (!kept.has(p.name)) for (const id of k.named(root, p.name)) k.patch(id, { visible: false });
+  for (const p of parts) for (const id of k.named(root, p.name)) k.patch(id, { visible: true, x: p.x, y: p.y, width: p.w, height: p.h, ...p.paths ? { paths: p.paths } : {}, ...p.rotation ? { rotation: p.rotation } : {} });
+}
+var dusty = (width) => noise({ id: "chalk", amount: 0.5, size: Math.max(1, Math.round(width * 0.3)), seed: 29, density: 0.6 });
+function chalk(name, paths, o) {
+  return [boxed({ name, shape: "line", ink: o.role ?? "text", width: o.width, opacity: o.opacity ?? 0.9, effects: [dusty(o.width)] }, paths)];
+}
+function drawOn(k, root, name, at, ms) {
+  for (const id of k.named(root, name)) k.animate(id, "trim.end", [{ t: at, v: 0, ease: ease.inOut("cubic") }, { t: at + ms, v: 1 }]);
+}
+function rubOut(k, root, name, at, ms) {
+  for (const id of k.named(root, name)) k.animate(id, "trim.start", [{ t: at, v: 0, ease: ease.inOut("cubic") }, { t: at + ms, v: 1 }]);
+}
+function doodle(d) {
+  const s = d.s, rand = rng(d.seed ?? 3), j = (v) => v + (rand() - 0.5) * 0.04;
+  const turn = (d.turn ?? 0) * Math.PI / 180, cos = Math.cos(turn), sin = Math.sin(turn);
+  const at = (ux, uy) => {
+    const x = (d.flip ? 1 - ux : ux) * s - s / 2, y = uy * s - s / 2;
+    return { x: d.x + s / 2 + x * cos - y * sin, y: d.y + s / 2 + x * sin + y * cos };
+  };
+  const tall = d.tall ?? 0.5;
+  let paths;
+  switch (d.kind) {
+    case "star": {
+      const pts = [];
+      for (let i = 0; i <= 5; i++) {
+        const a = -Math.PI / 2 + i * 4 * Math.PI / 5;
+        pts.push(at(j(0.5 + 0.5 * Math.cos(a)), j(0.5 + 0.5 * Math.sin(a))));
+      }
+      paths = [poly(pts)];
+      break;
+    }
+    case "arrow":
+      paths = [
+        curve3([at(0, 0.5 - tall * 0.5), at(0.3, j(0.5 - tall * 0.1)), at(0.65, j(0.5 + tall * 0.4)), at(1, 0.5 + tall * 0.5)], 0.25),
+        poly([at(0.8, 0.5 + tall * 0.5 - 0.2), at(1, 0.5 + tall * 0.5), at(0.78, 0.5 + tall * 0.5 + 0.1)])
+      ];
+      break;
+    case "underline":
+      paths = [curve3([at(0, 0.5), at(0.25, j(0.5 - tall * 0.3)), at(0.5, j(0.5 + tall * 0.2)), at(0.75, j(0.5 - tall * 0.2)), at(1, 0.5), at(0.6, j(0.5 + tall * 0.7)), at(0.12, 0.5 + tall * 0.6)], 0.22)];
+      break;
+    case "spark":
+      paths = [poly([at(0.5, 0), at(0.5, 0.32)]), poly([at(0.08, 0.2), at(0.28, 0.44)]), poly([at(0.92, 0.2), at(0.72, 0.44)])];
+      break;
+    case "plane":
+      paths = [poly([at(0, 0.42), at(1, 0.1), at(0.56, 0.9), at(0.44, 0.56), at(0, 0.42)]), poly([at(0.44, 0.56), at(1, 0.1)]), poly([at(0.44, 0.56), at(0.4, 0.8), at(0.5, 0.67)])];
+      break;
+    case "trail": {
+      const pts = [];
+      for (let i = 0; i <= 220; i++) {
+        const t = i / 220, q = Math.min(1, Math.max(0, (t - 0.3) / 0.36)) * Math.PI * 2;
+        pts.push(at(t + 0.075 * Math.sin(q), 0.5 + tall * (1 - t) * (1 - t) - 0.075 * (1 - Math.cos(q))));
+      }
+      paths = [];
+      for (let i = 0; i + 4 <= 220; i += 9) paths.push(poly(pts.slice(i, i + 5)));
+      break;
+    }
+  }
+  return chalk(d.name, paths, { role: d.role, width: d.width ?? Math.max(2, s * 0.045) });
+}
+function underline(k, parent, o) {
+  const u = o.u, w = o.w, h = r3(26 * u), width = r3(7 * u);
+  const paths = [curve3([{ x: 4 * u, y: 9 * u }, { x: w * 0.3, y: 5 * u }, { x: w * 0.7, y: 10 * u }, { x: w - 4 * u, y: 6 * u }, { x: w * 0.62, y: 17 * u }, { x: w * 0.2, y: 20 * u }], 0.2)];
+  return k.vector(parent, w, h, paths, o.role ?? "accent", { name: o.name ?? "Chalk underline", strokeWidth: width, opacity: 0.9, effects: [dusty(width)] });
+}
+function clock(k, parent, c) {
+  const r = c.r, d = r3(2 * r), w = r3(Math.max(2.5, r * 0.06)), role = c.role ?? "text";
+  const id = k.frame(parent, { x: r3(c.x - r), y: r3(c.y - r), width: d, height: d }, { name: c.name ?? "Clock" });
+  const face = [];
+  for (let i = 0; i <= 40; i++) {
+    const a = -1.3 + i / 40 * Math.PI * 2 * 1.07, rr = r * (0.985 - i * 13e-4);
+    face.push({ x: r + rr * Math.cos(a), y: r + rr * Math.sin(a) });
+  }
+  k.vector(id, d, d, [curve3(face, 0.17)], role, { name: "Clock face", strokeWidth: w, opacity: 0.9, absolute: { x: 0, y: 0 }, effects: [dusty(w)] });
+  const ticks = [];
+  for (let i = 0; i < 12; i++) {
+    const a = i / 12 * Math.PI * 2, from = i % 3 ? 0.82 : 0.72;
+    ticks.push(poly([{ x: r + r * from * Math.cos(a), y: r + r * from * Math.sin(a) }, { x: r + r * 0.9 * Math.cos(a), y: r + r * 0.9 * Math.sin(a) }]));
+  }
+  k.vector(id, d, d, ticks, role, { name: "Clock ticks", strokeWidth: r3(w * 0.8), opacity: 0.9, absolute: { x: 0, y: 0 }, effects: [dusty(w)] });
+  for (const [name, len, angle, thick] of [["Hour hand", r * 0.46, c.hour, w * 1.5], ["Minute hand", r * 0.7, c.minute, w * 1.1]]) {
+    const pivot = k.frame(id, { x: r3(r), y: r3(r), width: 1, height: 1 }, { name });
+    k.vector(pivot, r3(thick * 2), r3(len), [poly([{ x: thick, y: len }, { x: thick, y: 0 }])], role, { name: `${name} line`, strokeWidth: r3(thick), opacity: 0.92, absolute: { x: r3(-thick), y: r3(-len) }, effects: [dusty(thick)] });
+    k.patch(pivot, { rotation: angle });
+  }
+  const hub = r3(w * 2.6);
+  k.rect(id, hub, hub, role, { name: "Clock hub", radius: 999, absolute: { x: r3(r - hub / 2), y: r3(r - hub / 2) } });
+  return id;
+}
+function sweep(k, root, from, to, at, ms) {
+  for (const id of k.named(root, "Minute hand")) k.animate(id, "rotation", [{ t: at, v: from, ease: ease.linear }, { t: at + ms, v: to }]);
+}
+function tally(o) {
+  const rand = rng(o.seed ?? 9), s = o.size, gap = s * 0.3, gate = gap * 4 + s * 0.55, out = [];
+  for (let i = 0; i < o.n; i++) {
+    const g = Math.floor(i / 5), in5 = i % 5, x0 = o.x + g * gate;
+    const lean = (rand() - 0.5) * s * 0.1;
+    const path = in5 < 4 ? poly([{ x: x0 + in5 * gap + lean, y: o.y + (rand() - 0.5) * s * 0.06 }, { x: x0 + in5 * gap - lean, y: o.y + s + (rand() - 0.5) * s * 0.06 }]) : poly([{ x: x0 - gap * 0.55, y: o.y + s * 0.78 }, { x: x0 + gap * 3.55, y: o.y + s * 0.2 }]);
+    out.push(...chalk(`Tally ${i + 1}`, [path], { role: o.role, width: o.width ?? Math.max(2, s * 0.085) }));
+  }
+  return out;
+}
+var STICKS = ["chalk", "chalkYellow", "chalkPink", "chalkBlue", "chalk"];
+function boardParts(b) {
+  const { w, h, u } = b, ground = b.ground ?? "paper", ch = b.chalk ?? "text", rand = rng(b.seed ?? 5), f = b.frame ?? 0;
+  const parts = [];
+  parts.push({ name: "Slate", shape: "rect", x: 0, y: 0, w, h, ink: ground, effects: [tooth(u)] });
+  parts.push({ name: "Board light", shape: "rect", x: 0, y: 0, w, h, ink: (k) => [k.gradient({ from: ch, to: ch, kind: "RADIAL", fromOpacity: 0.1, toOpacity: 0, handles: [{ x: 0.28, y: 0.2 }, { x: 1.1, y: 0.2 }, { x: 0.28, y: 0.95 }] })] });
+  parts.push({ name: "Board dark", shape: "rect", x: 0, y: 0, w, h, ink: (k) => [k.gradient({ from: "shade", to: "shade", kind: "RADIAL", fromOpacity: 0, toOpacity: 0.34, handles: [{ x: 0.45, y: 0.4 }, { x: 1.25, y: 0.4 }, { x: 0.45, y: 1.25 }] })] });
+  const smears = Math.max(4, Math.round(w * h / (26e4 * u * u)));
+  for (let i = 0; i < smears; i++) {
+    const sw2 = (300 + rand() * 380) * u, sh = (50 + rand() * 80) * u;
+    parts.push({ name: `Smear ${i + 1}`, shape: "rect", x: r3(rand() * (w - sw2 * 0.6) - sw2 * 0.2), y: r3((i + rand()) / smears * h), w: r3(sw2), h: r3(sh), ink: (k) => k.tint(ch, 0.035 + i % 3 * 0.018), radius: 999, rotation: r3((rand() - 0.5) * 24), effects: [blurred(26 * u)] });
+  }
+  const sw = b.swipe ?? { x: w * 0.62, y: h * 0.3, length: Math.min(w * 0.7, 640 * u), turn: -9 };
+  const a = sw.turn * Math.PI / 180, dx = Math.cos(a), dy = Math.sin(a), nx = -dy, ny = dx;
+  const streaks = [];
+  for (let i = 0; i < 9; i++) {
+    const off = (i - 4) * 11 * u + (rand() - 0.5) * 5 * u, len = sw.length * (0.72 + rand() * 0.28), shift = (rand() - 0.5) * sw.length * 0.14;
+    const mid = { x: sw.x + nx * off + dx * shift, y: sw.y + ny * off + dy * shift };
+    streaks.push(curve3([{ x: mid.x - dx * len / 2, y: mid.y - dy * len / 2 }, { x: mid.x + nx * 6 * u, y: mid.y + ny * 6 * u }, { x: mid.x + dx * len / 2, y: mid.y + dy * len / 2 }], 0.25));
+  }
+  parts.push(boxed({ name: "Swipe", shape: "line", ink: ch, width: 9 * u, opacity: 0.075, effects: [blurred(2.2 * u)] }, streaks));
+  const ghost = [];
+  const gx = b.ghost?.x ?? w * 0.12 + f, gy = b.ghost?.y ?? h * 0.62, gl = b.ghost?.length ?? Math.min(w * 0.5, 520 * u);
+  for (let i = 0; i <= 64; i++) {
+    const t = i / 64, q = t * Math.PI * 2 * 7;
+    ghost.push({ x: gx + t * gl - 15 * u * Math.sin(q), y: gy - 18 * u * (1 - Math.cos(q)) - t * 20 * u });
+  }
+  parts.push(boxed({ name: "Ghost", shape: "line", ink: ch, width: 4.5 * u, opacity: 0.085, effects: [blurred(1.6 * u)] }, [curve3(ghost, 0.17)]));
+  if (f > 0) {
+    const lip = Math.max(2, r3(f * 0.16));
+    parts.push({ name: "Frame shadow top", shape: "rect", x: f, y: f, w: r3(w - 2 * f), h: r3(f * 0.9), ink: (k) => [k.gradient({ from: "shade", to: "shade", angle: 90, fromOpacity: 0.5, toOpacity: 0 })] });
+    parts.push({ name: "Frame shadow left", shape: "rect", x: f, y: f, w: r3(f * 0.7), h: r3(h - 2 * f), ink: (k) => [k.gradient({ from: "shade", to: "shade", angle: 0, fromOpacity: 0.4, toOpacity: 0 })] });
+    parts.push({ name: "Frame top", shape: "rect", x: 0, y: 0, w, h: f, ink: "wood" });
+    parts.push({ name: "Frame bottom", shape: "rect", x: 0, y: r3(h - f), w, h: f, ink: "wood" });
+    parts.push({ name: "Frame left", shape: "rect", x: 0, y: 0, w: f, h, ink: "wood" });
+    parts.push({ name: "Frame right", shape: "rect", x: r3(w - f), y: 0, w: f, h, ink: "wood" });
+    parts.push({ name: "Frame light top", shape: "rect", x: 0, y: 0, w, h: lip, ink: "woodLight" });
+    parts.push({ name: "Frame light left", shape: "rect", x: 0, y: 0, w: lip, h, ink: "woodLight" });
+    parts.push({ name: "Frame lip top", shape: "rect", x: r3(f - lip), y: r3(f - lip), w: r3(w - 2 * (f - lip)), h: lip, ink: "woodDeep" });
+    parts.push({ name: "Frame lip bottom", shape: "rect", x: r3(f - lip), y: r3(h - f), w: r3(w - 2 * (f - lip)), h: lip, ink: "woodDeep" });
+    parts.push({ name: "Frame lip left", shape: "rect", x: r3(f - lip), y: r3(f - lip), w: lip, h: r3(h - 2 * (f - lip)), ink: "woodDeep" });
+    parts.push({ name: "Frame lip right", shape: "rect", x: r3(w - f), y: r3(f - lip), w: lip, h: r3(h - 2 * (f - lip)), ink: "woodDeep" });
+  }
+  if (b.tray) {
+    const th = 44 * u, ty = h - f - th, tx = f, tw = w - 2 * f;
+    parts.push({ name: "Tray shadow", shape: "rect", x: r3(tx), y: r3(ty - 46 * u), w: r3(tw), h: r3(46 * u), ink: (k) => [k.gradient({ from: "shade", to: "shade", angle: 90, fromOpacity: 0, toOpacity: 0.42 })] });
+    for (let i = 0; i < 3; i++) {
+      const dw2 = (150 + rand() * 170) * u;
+      parts.push({ name: `Dust ${i + 1}`, shape: "rect", x: r3(tx + (0.1 + i * 0.3 + rand() * 0.1) * tw), y: r3(ty - 10 * u), w: r3(dw2), h: r3(14 * u), ink: (k) => k.tint("chalk", 0.2), radius: 999, effects: [blurred(11 * u)] });
+    }
+    const sticks = b.sticks ?? 0.56;
+    let sx = tx + sticks * tw;
+    STICKS.forEach((role, i) => {
+      const len = (i === 4 ? 40 : 96 - i * 11) * u, x = sx;
+      sx += len + (i === 1 ? 34 : 12) * u;
+      parts.push({ name: `Chalk stick ${i + 1}`, shape: "rect", x: r3(x), y: r3(ty - 18 * u), w: r3(len), h: r3(18 * u), ink: role, radius: r3(4 * u), rotation: i === 1 ? -3 : i === 3 ? 2 : 0, effects: [cast(u * 0.35, 0.5)] });
+    });
+    const dw = 210 * u, dxx = tx + (b.duster ?? 0.12) * tw;
+    parts.push({ name: "Duster felt", shape: "rect", x: r3(dxx), y: r3(ty - 34 * u), w: r3(dw), h: r3(34 * u), ink: "felt", radius: r3(5 * u), effects: [cast(u * 0.4, 0.55)] });
+    for (let i = 0; i < 5; i++) parts.push({ name: `Duster rib ${i + 1}`, shape: "rect", x: r3(dxx + (i + 0.5) * (dw / 5) - 2 * u), y: r3(ty - 32 * u), w: r3(4 * u), h: r3(30 * u), ink: "feltLight", opacity: 0.55 });
+    parts.push({ name: "Duster chalk", shape: "rect", x: r3(dxx + 6 * u), y: r3(ty - 14 * u), w: r3(dw - 12 * u), h: r3(12 * u), ink: (k) => k.tint("chalk", 0.5), radius: 999, effects: [blurred(4 * u)] });
+    parts.push({ name: "Duster back", shape: "rect", x: r3(dxx - 4 * u), y: r3(ty - 62 * u), w: r3(dw + 8 * u), h: r3(30 * u), ink: "woodLight", radius: r3(7 * u) });
+    parts.push({ name: "Duster back shade", shape: "rect", x: r3(dxx - 4 * u), y: r3(ty - 44 * u), w: r3(dw + 8 * u), h: r3(12 * u), ink: "wood", radius: r3(5 * u) });
+    parts.push({ name: "Tray", shape: "rect", x: r3(tx), y: r3(ty), w: r3(tw), h: r3(th), ink: "wood" });
+    parts.push({ name: "Tray light", shape: "rect", x: r3(tx), y: r3(ty), w: r3(tw), h: r3(8 * u), ink: "woodLight" });
+    parts.push({ name: "Tray lip", shape: "rect", x: r3(tx), y: r3(ty + th - 6 * u), w: r3(tw), h: r3(6 * u), ink: "woodDeep" });
+  }
+  return parts;
+}
+function sticker(k, parent, o) {
+  const s = o.size;
+  const id = k.stack(parent, { width: s, height: s, name: o.name, ...o.absolute ? { absolute: o.absolute } : {} });
+  const edge = k.star(id, s, "goldDeep", { name: "Star edge", absolute: { x: 0, y: r3(s * 0.045) } });
+  k.patch(edge, { effects: [cast(s / 110, 0.5)] });
+  k.star(id, s, "gold", { name: "Star foil", absolute: { x: 0, y: 0 } });
+  k.star(id, r3(s * 0.66), [k.gradient({ from: "goldLight", to: "goldLight", angle: 55, fromOpacity: 0.95, toOpacity: 0 })], { name: "Star shine", absolute: { x: r3(s * 0.17), y: r3(s * 0.19) } });
+  k.ellipse(id, r3(s * 0.09), "goldLight", { name: "Star glint", absolute: { x: r3(s * 0.36), y: r3(s * 0.3) } });
+  if (o.tilt) k.patch(id, { rotation: o.tilt });
+  return id;
+}
+function pressStar(k, root, name, at, ms = 340) {
+  for (const id of k.named(root, name)) {
+    const rest = k.node(id).rotation ?? 0;
+    for (const axis of ["scaleX", "scaleY"]) k.animate(id, axis, [{ t: at, v: 2, ease: ease.back(2.4) }, { t: at + ms, v: 1 }]);
+    k.animate(id, "rotation", [{ t: at, v: rest - 40, ease: ease.out("cubic") }, { t: at + ms, v: rest }]);
+    k.animate(id, "opacity", [{ t: at, v: 0, ease: ease.out("cubic") }, { t: at + 110, v: 1 }]);
+  }
+}
+function stamp(k, parent, o) {
+  const u = o.u, role = o.role ?? "stampRed";
+  const id = k.stack(parent, { width: "HUG", padding: r3(5 * u), radius: r3(9 * u), stroke: { color: role, width: r3(Math.max(1.5, 4 * u)) }, name: o.name ?? "Stamp", ...o.absolute ? { absolute: o.absolute } : {} });
+  const face = k.stack(id, { width: "HUG", align: "CENTER", gap: 0, padding: { top: r3(6 * u), right: r3(16 * u), bottom: r3(6 * u), left: r3(16 * u) }, radius: r3(5 * u), stroke: { color: role, width: r3(Math.max(1, 1.5 * u)) }, name: "Stamp face" });
+  k.text(face, o.label, { style: o.styles.label, color: role, autoWidth: true, name: "Stamp label" });
+  if (o.sub && o.styles.sub) k.text(face, o.sub, { style: o.styles.sub, color: role, autoWidth: true, name: "Stamp sub" });
+  k.patch(id, { opacity: 0.95, ...o.tilt ? { rotation: o.tilt } : {} });
+  return id;
+}
+function landStamp(k, root, name, at, ms = 200) {
+  for (const id of k.named(root, name)) {
+    const rest = k.node(id).opacity ?? 1;
+    for (const axis of ["scaleX", "scaleY"]) k.animate(id, axis, [{ t: at, v: 2.3, ease: ease.named("cubic", "in") }, { t: at + ms, v: 0.94, ease: ease.out("cubic") }, { t: at + ms + 140, v: 1 }]);
+    k.animate(id, "opacity", [{ t: at, v: 0, ease: ease.out("cubic") }, { t: at + ms * 0.7, v: rest }]);
+  }
+}
+function timetable(k, parent, t) {
+  const u = t.u, w = t.w, pad = r3(26 * u), times = r3(t.times ?? 96 * u), gap = r3(20 * u);
+  const id = k.stack(parent, { width: w, name: t.name ?? "Timetable", ...t.absolute ? { absolute: t.absolute } : {} });
+  const sheet = k.stack(id, { width: w, fill: "sheet", radius: r3(5 * u), clip: true, padding: { top: r3(34 * u), right: pad, bottom: r3(18 * u), left: pad }, name: "Sheet", effects: [cast(u)] });
+  k.rect(sheet, w, r3(200 * u), [k.gradient({ from: "sheetShade", to: "sheetShade", angle: 90, fromOpacity: 0.7, toOpacity: 0 })], { name: "Sheet fold", absolute: { x: 0, y: 0 } });
+  k.rect(sheet, r3(Math.max(1, 2 * u)), r3((70 + t.lessons.length * 110) * u), "margin", { name: "Margin line", opacity: 0.75, absolute: { x: r3(pad + times + gap / 2), y: 0 } });
+  const head = k.stack(sheet, { direction: "HORIZONTAL", gap: r3(14 * u), align: "MAX", padding: { top: 0, right: 0, bottom: r3(12 * u), left: 0 }, name: "Sheet head" });
+  k.text(head, t.title, { style: t.styles.title, color: "ink", name: "Sheet title" });
+  if (t.form && t.styles.form) k.text(head, t.form, { style: t.styles.form, color: "inkSoft", autoWidth: true, name: "Form" });
+  k.rect(sheet, "FILL", r3(Math.max(1.5, 3 * u)), "ink", { name: "Head rule" });
+  t.lessons.forEach((l, i) => {
+    if (i) k.rect(sheet, "FILL", r3(Math.max(1, 1.5 * u)), "rule", { name: "Ruled line" });
+    const row = k.stack(sheet, { direction: "HORIZONTAL", gap, align: "CENTER", padding: { top: r3(11 * u), right: 0, bottom: r3(11 * u), left: 0 }, name: `Row ${l.n}` });
+    k.text(row, l.time, { style: t.styles.time, color: "inkSoft", width: times, name: `Time ${l.n}` });
+    const cell = k.stack(row, { fill: l.hi, radius: r3(5 * u), gap: r3(1 * u), padding: { top: r3(8 * u), right: r3(14 * u), bottom: r3(9 * u), left: r3(14 * u) }, name: `Cell ${l.n}` });
+    k.patch(cell, { anchorX: 0, anchorY: 0.5 });
+    k.text(cell, l.title, { style: t.styles.lesson, color: "ink", name: `Lesson ${l.n}` });
+    if (l.note && t.styles.note) k.text(cell, l.note, { style: t.styles.note, color: "ink", name: `Note ${l.n}` });
+    if (t.star) sticker(k, row, { size: t.star, name: `Star ${l.n}`, tilt: [-9, 7, -4, 11, -7, 5][i % 6] });
+  });
+  if (t.tape !== false) {
+    const tw = r3(128 * u), th = r3(36 * u);
+    for (const [x, turn] of [[w * 0.1, -5], [w * 0.9 - 128 * u, 4]]) {
+      const tape = k.rect(id, tw, th, k.tint("tape", 0.86), { name: "Tape", absolute: { x: r3(x), y: r3(-th * 0.45) }, effects: [cast(u * 0.3, 0.3)] });
+      k.patch(tape, { rotation: turn });
+    }
+  }
+  return id;
+}
+function fillLesson(k, root, n, at, ms = 420) {
+  for (const id of k.named(root, `Cell ${n}`)) {
+    k.animate(id, "scaleX", [{ t: at, v: 0, ease: ease.out("expo") }, { t: at + ms, v: 1 }]);
+    k.animate(id, "opacity", [{ t: at, v: 0, ease: ease.out("cubic") }, { t: at + 90, v: 1 }]);
+  }
+}
+function dueCard(k, parent, c) {
+  const u = c.u, w = c.w, cellH = r3(40 * u);
+  const id = k.stack(parent, { width: w, fill: "sheet", radius: r3(6 * u), clip: true, padding: { top: r3(16 * u), right: r3(16 * u), bottom: r3(14 * u), left: r3(16 * u) }, name: c.name ?? "Due card", effects: [cast(u)], ...c.absolute ? { absolute: c.absolute } : {} });
+  k.rect(id, w, r3(120 * u), [k.gradient({ from: "sheetShade", to: "sheetShade", angle: 90, fromOpacity: 0.7, toOpacity: 0 })], { name: "Card fold", absolute: { x: 0, y: 0 } });
+  k.text(id, c.title, { style: c.styles.title, color: "ink", align: "CENTER", name: "Card title" });
+  k.stack(id, { height: r3(8 * u), name: "Card gap" });
+  k.rect(id, "FILL", r3(Math.max(1.5, 2.5 * u)), "ink", { name: "Card rule" });
+  const heads = k.stack(id, { direction: "HORIZONTAL", padding: { top: r3(5 * u), right: 0, bottom: r3(5 * u), left: 0 }, name: "Card heads" });
+  for (let i = 0; i < 2; i++) k.text(heads, c.head, { style: c.styles.head, color: "inkSoft", align: "CENTER", name: "Card head" });
+  k.rect(id, "FILL", r3(Math.max(1, 1.5 * u)), "ink", { name: "Card rule" });
+  const grid = k.stack(id, { name: "Card grid" });
+  for (let r = 0; r < c.rows; r++) {
+    const row = k.stack(grid, { direction: "HORIZONTAL", height: cellH, align: "CENTER", name: "Card row" });
+    for (let col = 0; col < 2; col++) {
+      const cell = k.stack(row, { height: cellH, align: "CENTER", justify: "CENTER", name: "Card cell" });
+      const d = c.dates[r * 2 + col];
+      if (!d) continue;
+      const date = k.text(cell, d.label, { style: c.styles.date, color: d.role ?? "stampBlue", autoWidth: true, name: `Date ${d.n}` });
+      k.patch(date, { rotation: d.tilt ?? 0, ...d.faded ? { opacity: 0.86 } : {} });
+      if (d.ring) {
+        const cw = (w - 32 * u) / 2, ring = [];
+        for (let i = 0; i <= 30; i++) {
+          const a = -2.6 + i / 30 * Math.PI * 2 * 1.1, f = 0.96 - i * 2e-3;
+          ring.push({ x: cw / 2 + (cw / 2 - 5 * u) * f * Math.cos(a), y: cellH / 2 + (cellH / 2 - 3 * u) * f * Math.sin(a) });
+        }
+        k.vector(cell, r3(cw), cellH, [curve3(ring, 0.17)], "stampRed", { name: "Date ring", strokeWidth: r3(Math.max(1.5, 2.6 * u)), opacity: 0.9, absolute: { x: 0, y: 0 } });
+      }
+    }
+    k.rect(grid, "FILL", r3(Math.max(1, 1.5 * u)), "rule", { name: "Ruled line" });
+  }
+  k.rect(grid, r3(Math.max(1, 1.5 * u)), r3(c.rows * (cellH + 1.5 * u) + 34 * u), "rule", { name: "Card column", absolute: { x: r3((w - 32 * u) / 2), y: r3(-34 * u) } });
+  return id;
+}
+function reportCard(k, parent, c) {
+  const u = c.u, w = c.w, pad = r3(34 * u);
+  const id = k.stack(parent, { width: w, name: c.name ?? "Report card", ...c.absolute ? { absolute: c.absolute } : {} });
+  const sheet = k.stack(id, { width: w, fill: "sheet", radius: r3(5 * u), clip: true, padding: { top: r3(36 * u), right: pad, bottom: r3(16 * u), left: pad }, name: "Sheet", effects: [cast(u)] });
+  k.rect(sheet, w, r3(220 * u), [k.gradient({ from: "sheetShade", to: "sheetShade", angle: 90, fromOpacity: 0.7, toOpacity: 0 })], { name: "Sheet fold", absolute: { x: 0, y: 0 } });
+  const head = k.stack(sheet, { direction: "HORIZONTAL", gap: r3(16 * u), align: "MAX", padding: { top: 0, right: 0, bottom: r3(12 * u), left: 0 }, name: "Sheet head" });
+  k.text(head, c.title, { style: c.styles.title, color: "ink", name: "Sheet title" });
+  k.text(head, c.meta, { style: c.styles.meta, color: "inkSoft", autoWidth: true, name: "Sheet meta" });
+  k.rect(sheet, "FILL", r3(Math.max(1.5, 3 * u)), "ink", { name: "Head rule" });
+  k.stack(sheet, { height: r3(Math.max(2, 3 * u)), name: "Rule gap" });
+  k.rect(sheet, "FILL", r3(Math.max(1, 1.2 * u)), "ink", { name: "Head rule thin" });
+  c.grades.forEach((g, i) => {
+    if (i) k.rect(sheet, "FILL", r3(Math.max(1, 1.5 * u)), "rule", { name: "Ruled line" });
+    const row = k.stack(sheet, { direction: "HORIZONTAL", gap: r3(22 * u), align: "CENTER", padding: { top: r3(14 * u), right: 0, bottom: r3(14 * u), left: 0 }, name: `Subject ${g.n}` });
+    const words = k.stack(row, { gap: r3(2 * u), name: "Subject words" });
+    k.text(words, g.subject, { style: c.styles.subject, color: "ink", name: "Subject name" });
+    k.text(words, g.comment, { style: c.styles.comment, color: "ink", name: "Comment" });
+    if (g.who && c.styles.who) k.text(words, g.who, { style: c.styles.who, color: "inkSoft", name: "Comment by" });
+    const ring = k.stack(row, { width: c.ring, height: c.ring, radius: 999, align: "CENTER", justify: "CENTER", stroke: { color: "stampRed", width: r3(Math.max(2, 5 * u)) }, name: `Grade ${g.n}` });
+    k.text(ring, g.grade, { style: c.styles.grade, color: "stampRed", autoWidth: true, name: "Grade letter" });
+    k.patch(ring, { rotation: [-7, 5, -4, 8][i % 4], opacity: 0.92 });
+  });
+  if (c.tape !== false) {
+    const tw = r3(128 * u), th = r3(36 * u);
+    for (const [x, turn] of [[w * 0.1, 4], [w * 0.9 - 128 * u, -5]]) {
+      const tape = k.rect(id, tw, th, k.tint("tape", 0.86), { name: "Tape", absolute: { x: r3(x), y: r3(-th * 0.45) }, effects: [cast(u * 0.3, 0.3)] });
+      k.patch(tape, { rotation: turn });
+    }
+  }
+  return id;
+}
+
+export {
+  schoolBrand,
+  draw,
+  refit,
+  drawOn,
+  rubOut,
+  doodle,
+  underline,
+  clock,
+  sweep,
+  tally,
+  boardParts,
+  sticker,
+  pressStar,
+  stamp,
+  landStamp,
+  timetable,
+  fillLesson,
+  dueCard,
+  reportCard
+};

package/dist/chunks/chunk-SMNCGK3V.js

@@ -0,0 +1,92 @@
+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 {
+  psyBrand,
+  stage,
+  throb
+} from "./chunk-SYPH2PQ2.js";
+import {
+  EMAIL_FPS,
+  HEADER
+} from "./chunk-62LBY7TV.js";
+import {
+  pill
+} from "./chunk-LEKU2ZW3.js";
+import {
+  defineTemplate
+} from "./chunk-YKWT2Q3P.js";
+import {
+  Kit
+} from "./chunk-SHOYVADV.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-FFS4SO7R.js";
+
+// templates/src/email/psychedelic-header.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var DURATION = 4800;
+var cues = [
+  { layer: "Button", preset: "pulse", at: 3e3, params: { duration: 800, amount: 0.06 } }
+];
+var psychedelic_header_default = defineTemplate({
+  id: "email-psychedelic-header",
+  meta: {
+    name: "Psychedelic email header (animated GIF)",
+    description: "A 600 \xD7 300 animated header for a launch email, as a 1970s gig poster: the night, the bill and the button are all on the first frame (for Outlook), beside a sun of bands that ripple outward round a watching eye, with turning rays, blobs, a daisy and mushrooms \u2014 a seamless 4.8-second GIF loop",
+    category: "email",
+    tags: ["email", "gif", "animated", "header", "banner", "psychedelic", "1970s", "concert poster", "gig poster", "launch", "release", "retro", "saas"],
+    platforms: ["email"],
+    formats: ["email", "banner"],
+    useCases: ["launch", "newsletter", "announcement"],
+    created: "2026-10-02",
+    updated: "2026-10-02"
+  },
+  stableNumbers: true,
+  motion: { cues, loop: true },
+  build() {
+    const k = new Kit("Psychedelic email header", HEADER);
+    k.quantizeGeometry = true;
+    psyBrand(k, { offer: "One night only: v2.0" });
+    k.textStyle("Eyebrow 12", { size: 12, fontWeight: 800, letterSpacing: 2.2, lineHeight: 16, textCase: "UPPER" });
+    k.textStyle("Offer 42", { size: 42, fontWeight: 900, letterSpacing: -1.9, lineHeight: 38, textCase: "UPPER" });
+    k.textStyle("Account 14", { size: 14, fontWeight: 500, lineHeight: 21 });
+    k.textStyle("Button 14", { size: 14, fontWeight: 800, lineHeight: 20 });
+    pill(k, "Button pill", { fill: "primary", ink: "onPrimary", style: "Button 14", label: "Get on the list", pad: [9, 20] });
+    const sheet = k.sheet;
+    k.flowSheet(sheet, 9, { top: 24, right: 300, bottom: 24, 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.36,
+      loopMs: DURATION,
+      rays: { x: 452, y: 138, size: 900, rays: 16, twist: 0.8, opacity: 0.5 },
+      sun: { x: 452, y: 138, size: 290 },
+      eye: { x: 452, y: 138, w: 132 },
+      hills: 262,
+      mushrooms: [{ x: 322, y: 206, w: 50 }, { x: 552, y: 222, w: 38, cap: "orange" }],
+      blobs: [{ x: 330, y: 60, r: 22, color: "magenta" }, { x: 580, y: 150, r: 20, color: "orange" }],
+      flowers: [{ x: 566, y: 50, size: 58 }, { x: 330, y: 150, size: 44, petal: "mustard", heart: "magenta" }]
+    };
+    const side = k.stack(sheet, { width: 316, height: 300, clip: true, name: "Poster side", absolute: { x: 284, y: 0 } });
+    const shift = (g) => ({ ...g, x: g.x - 284 });
+    stage(k, side, { ...s, w: 316, rays: { ...s.rays, ...shift(s.rays) }, sun: { ...s.sun, ...shift(s.sun) }, eye: { ...s.eye, ...shift(s.eye) }, mushrooms: s.mushrooms.map((m) => ({ ...m, ...shift(m) })), blobs: s.blobs.map((b) => ({ ...b, ...shift(b) })), flowers: s.flowers.map((f) => ({ ...f, ...shift(f) })) });
+    k.rect(side, 70, 300, [k.gradient({ from: "paper", to: "paper", fromOpacity: 1, toOpacity: 0, angle: 0 })], { name: "Soft edge", absolute: { x: 0, y: 0 } });
+    throb(k, side, "Pupil", 600, 600, 6, 0.2);
+    k.text(sheet, "{{brand.name}} 2.0 \xB7 Tue 14 Oct", { style: "Eyebrow 12", color: "text", name: "Eyebrow" });
+    k.text(sheet, "{{brand.offer}}", { style: "Offer 42", color: "text", name: "Offer" });
+    k.text(sheet, "On the bill: Door Mode, Split Payouts and Fair Resale. Doors at 7 pm.", { style: "Account 14", color: "onPaper", name: "Account" });
+    k.instance(sheet, "Button pill", { Label: "Get on the list" }, { name: "Button" });
+    k.cues(sheet, cues);
+    return k.finish();
+  }
+});
+
+export {
+  psychedelic_header_default
+};