@popcraft/kit 0.26.0 → 0.26.1

package/dist/chunks/chunk-PZB7QVR2.js

@@ -1,135 +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 {
-  confirms,
-  field,
-  formStyles,
-  select,
-  submit
-} from "./chunk-BDP4IUZA.js";
-import {
-  buttons,
-  nav,
-  page,
-  webResponsive
-} from "./chunk-YKXCPYWJ.js";
-import {
-  defineTemplate
-} from "./chunk-A44WEVKR.js";
-import {
-  Kit,
-  preset
-} from "./chunk-T3SGRYUX.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/web/launch-waitlist.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var cues = [
-  { layer: "Nav", preset: "fade-in", at: 0, params: { duration: 500 } },
-  { layer: "Eyebrow", preset: "rise-in", at: 150 },
-  { layer: "Headline", preset: "rise-in", at: 300, params: { duration: 700 } },
-  { layer: "Lead", preset: "rise-in", at: 450 },
-  { layer: "Waitlist card", preset: "rise-in", at: 650, params: { duration: 700 } },
-  { layer: "Proof", preset: "fade-in", at: 1100, params: { duration: 500 } },
-  { layer: "Spend card", preset: "slide-in", at: 500, params: { direction: "right" }, stagger: { delay: 180 } },
-  { layer: "Ring", preset: "pop-in", at: 1300 },
-  { layer: "Ring", preset: "pulse", at: 2400, params: { amount: 0.08 } }
-];
-var SPEND = [["Groceries", "$312 of $400", "ok"], ["Eating out", "$148 of $120", "over"], ["Transport", "$64 of $150", "ok"]];
-var launch_waitlist_default = defineTemplate({
-  id: "web-launch-waitlist",
-  meta: {
-    name: "Animated launch page with a working waitlist",
-    description: "A launch page that builds itself \u2014 headline and lead rise in, the waitlist form follows, spending cards slide in \u2014 and whose waitlist works: name, email and a goal, then a thank-you message in its place. Attach a database when you publish and every sign-up is saved",
-    category: "web",
-    tags: ["animation", "waitlist", "launch", "form", "database", "landing page", "sign-up", "entrance", "app launch", "responsive"],
-    platforms: ["web"],
-    formats: ["page"],
-    useCases: ["launch", "announcement"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  breakpoints: true,
-  motion: { cues },
-  build() {
-    const k = new Kit("Launch page with a waitlist", preset("web-desktop"));
-    k.brand(
-      { paper: "#F4F1FB", text: "#17132B", onPaper: "#544E70", primary: "#5B3FD6", onPrimary: "#FFFFFF", card: "#FFFFFF", onCard: "#17132B", cardMuted: "#6B6585", field: "#FFFFFF", onField: "#6B6585", line: "#D9D3EE", tint: "#E6DFFB", onTint: "#3F2A9E", good: "#1E8F5E", over: "#C8472B", track: "#E9E5F5" },
-      { name: "Tally" }
-    );
-    k.textStyle("Nav 16", { size: 16, fontWeight: 500, lineHeight: 24 });
-    k.textStyle("Brand 20", { size: 20, fontWeight: 800, letterSpacing: -0.3, lineHeight: 28 });
-    k.textStyle("Button 16", { size: 16, fontWeight: 600, lineHeight: 24 });
-    k.textStyle("Eyebrow 14", { size: 14, fontWeight: 600, lineHeight: 20 });
-    k.textStyle("Display 68", { size: 68, fontWeight: 800, letterSpacing: -2.2, lineHeight: 72 });
-    k.textStyle("Display 56", { size: 56, fontWeight: 800, letterSpacing: -1.8, lineHeight: 60 });
-    k.textStyle("Display 44", { size: 44, fontWeight: 800, letterSpacing: -1.2, lineHeight: 50 });
-    k.textStyle("Display 36", { size: 36, fontWeight: 800, letterSpacing: -0.9, lineHeight: 42 });
-    k.textStyle("Lead 20", { size: 20, fontWeight: 400, lineHeight: 30 });
-    k.textStyle("Lead 17", { size: 17, fontWeight: 400, lineHeight: 26 });
-    k.textStyle("Proof 15", { size: 15, fontWeight: 500, lineHeight: 22 });
-    k.textStyle("Card title 16", { size: 16, fontWeight: 700, lineHeight: 22 });
-    k.textStyle("Card meta 14", { size: 14, fontWeight: 500, lineHeight: 20 });
-    k.textStyle("Ring 28", { size: 28, fontWeight: 800, letterSpacing: -0.6, lineHeight: 32, textAlign: "CENTER" });
-    formStyles(k);
-    buttons(k, { style: "Button 16" });
-    k.component("Badge", { direction: "HORIZONTAL", width: "HUG", fill: "tint", radius: 999, padding: { top: 7, right: 14, bottom: 7, left: 14 }, props: { Label: "New" } }, (id) => {
-      k.propText(id, "Label", { style: "Eyebrow 14", color: "onTint", autoWidth: true });
-    });
-    const sheet = k.sheet;
-    page(k, sheet, { gap: 40, top: 32 });
-    k.timeline(sheet, { duration: 4e3, fps: 30 });
-    nav(k, sheet, { links: ["How it works", "Pricing", "Security"], cta: "Join the waitlist", style: "Nav 16", brandStyle: "Brand 20", quiet: true });
-    const hero = k.stack(sheet, { direction: "HORIZONTAL", gap: 72, align: "CENTER", padding: { top: 32, right: 0, bottom: 48, left: 0 }, name: "Hero" });
-    const copy = k.stack(hero, { gap: 22, name: "Copy" });
-    k.instance(copy, "Badge", { Label: "Opening in November \xB7 4,200 people waiting" }, { name: "Eyebrow" });
-    k.text(copy, "Know where the month went before it is gone.", { style: "Display 68", color: "text", name: "Headline" });
-    k.text(copy, "Tally sorts what you spend as you spend it and tells you, in one line a day, what is left for the things you care about. No spreadsheets, no bank passwords.", { style: "Lead 20", color: "onPaper", name: "Lead" });
-    const panel = k.stack(copy, { fill: "card", radius: 18, stroke: { color: "line", width: 1 }, padding: 24, name: "Waitlist card" });
-    const form = k.stack(panel, { gap: 14, name: "Waitlist form" });
-    const row = k.stack(form, { direction: "HORIZONTAL", gap: 12, name: "Name and email" });
-    field(k, row, { card: true, label: "First name", name: "name", placeholder: "Sam", required: true });
-    field(k, row, { card: true, label: "Email", name: "email", placeholder: "sam@example.com", type: "email", required: true });
-    select(k, form, { card: true, label: "What do you want help with first?", name: "goal", options: ["Spending less on eating out", "Saving for something", "Paying off a card", "Just seeing where it goes"] });
-    submit(k, form, "Join the waitlist");
-    k.text(copy, "Free for the first year for everyone on the list. One email when it opens.", { style: "Proof 15", color: "onPaper", name: "Proof" });
-    const visual = k.stack(hero, { width: 380, gap: 14, name: "Visual" });
-    for (const [what, amount, state] of SPEND) {
-      const c = k.stack(visual, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "CENTER", fill: "card", radius: 16, padding: { top: 16, right: 18, bottom: 16, left: 18 }, effects: [{ type: "DROP_SHADOW", color: k.color("text", 0.1), offset: { x: 0, y: 10 }, blur: 26, spread: 0, visible: true }], name: "Spend card" });
-      const words = k.stack(c, { gap: 2, name: "Spend words" });
-      k.text(words, what, { style: "Card title 16", color: "onCard", name: "Spend name" });
-      k.text(words, amount, { style: "Card meta 14", color: "cardMuted", name: "Spend amount" });
-      k.ellipse(c, 14, state === "over" ? "over" : "good", { name: "Spend state" });
-    }
-    const ring = k.stack(visual, { direction: "HORIZONTAL", width: "HUG", gap: 16, align: "CENTER", fill: "card", radius: 16, padding: { top: 16, right: 22, bottom: 16, left: 16 }, name: "Ring" });
-    const dial = k.stack(ring, { width: 84, height: 84, radius: 42, stroke: { color: "primary", width: 8 }, fill: "track", align: "CENTER", justify: "CENTER", name: "Dial" });
-    k.text(dial, "62%", { style: "Ring 28", color: "onCard", autoWidth: true, name: "Ring value" });
-    const ringWords = k.stack(ring, { width: "HUG", gap: 2, name: "Ring words" });
-    k.text(ringWords, "$1,140 left", { style: "Card title 16", color: "onCard", autoWidth: true, name: "Left" });
-    k.text(ringWords, "12 days to go this month", { style: "Card meta 14", color: "cardMuted", autoWidth: true, name: "Days" });
-    k.cues(sheet, cues);
-    confirms(k, panel, form, { title: "You are on the list.", body: "We will email you once, the day Tally opens, with your first year free. Until then: nothing from us.", titleStyle: "Thanks 24", bodyStyle: "Field 16", card: true });
-    webResponsive(k, sheet, {
-      stack: ["Hero"],
-      stackMobile: ["Name and email"],
-      restyle: { "Display 68": { laptop: "Display 56", tablet: "Display 44", mobile: "Display 36" }, "Lead 20": { mobile: "Lead 17" } },
-      hide: { mobile: ["Nav links"] },
-      tweak: (kit, id, size) => {
-        if (size === "laptop") for (const n of kit.named(id, "Hero")) kit.patch(n, { itemSpacing: 48 });
-        if (size === "tablet" || size === "mobile") for (const n of kit.named(id, "Hero")) kit.patch(n, { itemSpacing: 40 });
-        if (size === "mobile") for (const n of kit.named(id, "Waitlist card")) kit.patch(n, { padding: { top: 18, right: 18, bottom: 18, left: 18 } });
-      }
-    });
-    return k.finish();
-  }
-});
-
-export {
-  launch_waitlist_default
-};

package/dist/chunks/chunk-Q2ML7IIN.js

@@ -1,163 +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 {
-  showcase,
-  showcaseStyles,
-  specimenRow
-} from "./chunk-JZ4SIJCP.js";
-import {
-  defineLibrary
-} from "./chunk-A44WEVKR.js";
-import {
-  Kit,
-  hex,
-  preset
-} from "./chunk-T3SGRYUX.js";
-import {
-  ease
-} from "./chunk-6DWY3DOQ.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/libraries/micro-interactions.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var TOGGLE_ON = [{ layer: "Knob", preset: "pulse", at: 120, params: { amount: 0.15, duration: 420 } }];
-var CHECKED = [
-  { layer: "Check", preset: "pop-in", at: 0, params: { duration: 360 } },
-  { layer: "Box", preset: "pulse", at: 60, params: { amount: 0.12, duration: 420 } }
-];
-var TAB_W = 132;
-var TABS = ["First", "Second", "Third"];
-var shadow = (blur, y, a) => ({ type: "DROP_SHADOW", color: hex("#101828", a), offset: { x: 0, y }, blur, spread: 0, visible: true });
-var micro_interactions_default = defineLibrary({
-  id: "lib-micro-interactions",
-  version: 1,
-  meta: {
-    name: "Micro-interactions",
-    description: "Interactive components with animated states \u2014 a button that lifts on hover and gives on press, a gliding toggle, a checkbox that ticks, tabs with a sliding underline \u2014 with text and colour inputs",
-    tags: ["animation", "micro-interactions", "components", "ui kit", "button", "toggle", "checkbox", "tabs", "hover"],
-    created: "2026-09-29",
-    updated: "2026-09-29",
-    aliases: ["web-kit-micro-interactions"]
-  },
-  motion: { components: [{ component: "Toggle/On", cues: TOGGLE_ON }, { component: "Checkbox/Checked", cues: CHECKED }] },
-  build() {
-    const k = new Kit("Micro-interaction kit", preset("web-desktop"));
-    k.brand({ paper: "#F6F7FB", text: "#141A2E", onPaper: "#5A6275", primary: "#2352D8", onPrimary: "#FFFFFF", track: "#C9CFDC", card: "#FFFFFF", boxLine: "#8A93A8", shade: "#0B1020", line: "#DDE1EA" }, { name: "Tally" });
-    showcaseStyles(k);
-    k.textStyle("Button 16", { size: 16, fontWeight: 600, lineHeight: 24 });
-    k.textStyle("Control 16", { size: 16, fontWeight: 500, lineHeight: 24 });
-    k.textStyle("Check 14", { size: 14, fontWeight: 800, lineHeight: 16, textAlign: "CENTER" });
-    k.textStyle("Tab 15", { size: 15, fontWeight: 500, lineHeight: 20, textAlign: "CENTER" });
-    k.textStyle("Tab selected 15", { size: 15, fontWeight: 700, lineHeight: 20, textAlign: "CENTER" });
-    k.textStyle("Panel title 22", { size: 22, fontWeight: 700, letterSpacing: -0.3, lineHeight: 28 });
-    k.textStyle("Panel body 15", { size: 15, fontWeight: 400, lineHeight: 22 });
-    const button = k.variantSet("Button", "State", ["Idle", "Hover", "Pressed"], {
-      direction: "HORIZONTAL",
-      width: "HUG",
-      align: "CENTER",
-      padding: 8,
-      description: "A call to action: it lifts and its shadow blooms on hover, and gives a little when pressed. Label and Accent are inputs.",
-      props: { Label: "Save changes", Accent: { color: "primary" } }
-    }, (state, id) => {
-      const bg = k.stack(id, { direction: "HORIZONTAL", width: "HUG", fill: "primary", radius: 10, align: "CENTER", padding: { top: 12, right: 22, bottom: 12, left: 22 }, effects: [shadow(state === "Hover" ? 18 : 6, state === "Hover" ? 8 : 2, state === "Pressed" ? 0.06 : 0.14)], name: "Background" });
-      k.propText(bg, "Label", { style: "Button 16", color: "onPrimary", autoWidth: true });
-      k.bindPath(bg, "fills[#0].color", "Accent");
-      if (state === "Pressed") k.rect(bg, 1, 1, "shade", { opacity: 0.16, name: "Shade", absolute: { x: 0, y: 0 } });
-    }, (state) => state === "Hover" ? { timeline: { duration: 420 } } : state === "Pressed" ? { timeline: { duration: 180 } } : {});
-    k.changeTo("Button/Idle", "ON_HOVER", "Button/Hover", 160);
-    k.changeTo("Button/Hover", "ON_PRESS", "Button/Pressed", 80);
-    const toggle = k.variantSet("Toggle", "State", ["Off", "On"], {
-      direction: "HORIZONTAL",
-      width: "HUG",
-      gap: 12,
-      align: "CENTER",
-      padding: 4,
-      description: "An on/off switch: click it and the knob glides across as the track takes the brand colour. Label is an input.",
-      props: { Label: "Weekly summary email" }
-    }, (state, id) => {
-      const track = k.stack(id, { direction: "HORIZONTAL", width: 44, height: 24, radius: 12, padding: 3, align: "CENTER", justify: state === "On" ? "MAX" : "MIN", fill: state === "On" ? "primary" : "track", name: "Track" });
-      k.ellipse(track, 18, "card", { name: "Knob", effects: [shadow(3, 1, 0.2)] });
-      k.propText(id, "Label", { style: "Control 16", color: "text", autoWidth: true });
-    }, (state) => state === "On" ? { timeline: { duration: 600 } } : {});
-    k.changeTo("Toggle/Off", "ON_CLICK", "Toggle/On", 220, "EASE_IN_OUT");
-    k.changeTo("Toggle/On", "ON_CLICK", "Toggle/Off", 220, "EASE_IN_OUT");
-    const checkbox = k.variantSet("Checkbox", "State", ["Unchecked", "Checked"], {
-      direction: "HORIZONTAL",
-      width: "HUG",
-      gap: 10,
-      align: "CENTER",
-      padding: 4,
-      description: "A checkbox: click it and the box fills as the tick pops in. Label is an input.",
-      props: { Label: "Send me product updates" }
-    }, (state, id) => {
-      const box = k.stack(id, { direction: "HORIZONTAL", width: 20, height: 20, radius: 5, align: "CENTER", justify: "CENTER", fill: state === "Checked" ? "primary" : "card", ...state === "Checked" ? {} : { stroke: { color: "boxLine", width: 1.5 } }, name: "Box" });
-      if (state === "Checked") k.text(box, "\u2714", { style: "Check 14", color: "onPrimary", autoWidth: true, name: "Check" });
-      k.propText(id, "Label", { style: "Control 16", color: "text", autoWidth: true });
-    }, (state) => state === "Checked" ? { timeline: { duration: 600 } } : {});
-    k.changeTo("Checkbox/Unchecked", "ON_CLICK", "Checkbox/Checked", 160);
-    k.changeTo("Checkbox/Checked", "ON_CLICK", "Checkbox/Unchecked", 160);
-    const tabs = k.variantSet("Tabs", "Selected", TABS, {
-      direction: "VERTICAL",
-      width: "HUG",
-      description: "Three tabs with a sliding underline: click a tab and the underline glides under it. The tab names are inputs.",
-      props: { First: "Overview", Second: "Activity", Third: "Settings" }
-    }, (state, id) => {
-      const bar = k.stack(id, { direction: "HORIZONTAL", width: "HUG", name: "Bar" });
-      TABS.forEach((t) => {
-        const cell = k.stack(bar, { direction: "HORIZONTAL", width: TAB_W, align: "CENTER", justify: "CENTER", padding: { top: 14, right: 8, bottom: 14, left: 8 }, name: `Tab ${t}` });
-        k.propText(cell, t, { style: t === state ? "Tab selected 15" : "Tab 15", color: t === state ? "text" : "onPaper", autoWidth: true, name: t });
-      });
-      k.rect(id, TAB_W * TABS.length, 1, "line", { name: "Rule" });
-      k.rect(id, TAB_W, 3, "primary", { radius: 2, name: "Indicator", absolute: { x: TABS.indexOf(state) * TAB_W, y: 45 } });
-    });
-    for (const state of TABS) for (const t of TABS) if (t !== state) {
-      const cell = k.named(tabs[state], `Tab ${t}`)[0];
-      k.changeTo(`Tabs/${state}`, "ON_CLICK", `Tabs/${t}`, 260, "EASE_IN_OUT", cell);
-    }
-    k.finish();
-    for (const bg of k.named(button.Pressed, "Background")) for (const s of k.named(bg, "Shade")) k.patch(s, { width: k.node(bg).width, height: k.node(bg).height, cornerRadius: 10 });
-    const hoverBg = k.named(button.Hover, "Background")[0], pressedBg = k.named(button.Pressed, "Background")[0];
-    k.animate(hoverBg, "translateY", [{ t: 0, v: 0, ease: ease.out("cubic") }, { t: 220, v: -2 }]);
-    k.animate(hoverBg, "effects[#0].blur", [{ t: 0, v: 6, ease: ease.out("expo") }, { t: 420, v: 18 }]);
-    k.animate(pressedBg, "scaleX", [{ t: 0, v: 1, ease: ease.out("quad") }, { t: 90, v: 0.97 }]);
-    k.animate(pressedBg, "scaleY", [{ t: 0, v: 1, ease: ease.out("quad") }, { t: 90, v: 0.97 }]);
-    k.cues(toggle.On, TOGGLE_ON);
-    k.cues(checkbox.Checked, CHECKED);
-    const sheet = k.sheet;
-    showcase(k, sheet, { title: "Micro-interaction kit", intro: "Every state of every control, playing its own move. Present the file and hover or press the buttons, flip the toggles, tick the boxes and pick a tab. Drop the components from Assets into any screen; the labels and the button colour are inputs.", duration: 4e3 });
-    const buttons = specimenRow(k, sheet, "Button \u2014 idle, hover, pressed");
-    k.instance(buttons, "Button/Idle", { Label: "Save changes" }, { name: "Button" });
-    k.instance(buttons, "Button/Hover", { Label: "Save changes" }, { name: "Button hover", playback: { loop: "pingpong", start: 300 } });
-    k.instance(buttons, "Button/Pressed", { Label: "Save changes" }, { name: "Button pressed", playback: { loop: "pingpong", start: 600 } });
-    k.instance(buttons, "Button/Idle", { Label: "Invite a teammate", Accent: hex("#0F7B4E") }, { name: "Button" });
-    const toggles = specimenRow(k, sheet, "Toggle \u2014 off, on");
-    k.instance(toggles, "Toggle/Off", { Label: "Weekly summary email" }, { name: "Toggle" });
-    k.instance(toggles, "Toggle/On", { Label: "Friday timesheet reminder" }, { name: "Toggle on", playback: { start: 400 } });
-    const checks = specimenRow(k, sheet, "Checkbox \u2014 unchecked, checked");
-    k.instance(checks, "Checkbox/Unchecked", { Label: "Send me product updates" }, { name: "Checkbox" });
-    k.instance(checks, "Checkbox/Checked", { Label: "Round entries to 15 minutes" }, { name: "Checkbox checked", playback: { start: 700 } });
-    const tabRow = specimenRow(k, sheet, "Tabs", { gap: 48 });
-    k.instance(tabRow, "Tabs/First", { First: "Overview", Second: "Timesheets", Third: "Settings" }, { name: "Tabs" });
-    k.instance(tabRow, "Tabs/Third", { First: "Week", Second: "Month", Third: "Year" }, { name: "Tabs" });
-    const panel = k.stack(sheet, { width: 760, gap: 20, radius: 16, stroke: { color: "line", width: 1 }, padding: 32, name: "Settings panel" });
-    k.text(panel, "Notification settings", { style: "Panel title 22", color: "text", name: "Panel title" });
-    k.instance(panel, "Tabs/First", { First: "Email", Second: "Mobile", Third: "Slack" }, { name: "Panel tabs" });
-    k.text(panel, "Choose what Tally sends you about your team\u2019s hours. You can change this at any time.", { style: "Panel body 15", color: "onPaper", name: "Panel body" });
-    k.instance(panel, "Toggle/On", { Label: "Weekly summary every Monday at 9:00" }, { name: "Setting" });
-    k.instance(panel, "Toggle/Off", { Label: "A reminder when a timesheet is late" }, { name: "Setting" });
-    k.instance(panel, "Checkbox/Checked", { Label: "Include billable hours by client" }, { name: "Setting check" });
-    const actions = k.stack(panel, { direction: "HORIZONTAL", gap: 12, justify: "MAX", name: "Actions" });
-    k.instance(actions, "Button/Idle", { Label: "Save changes" }, { name: "Save" });
-    return k.finish();
-  }
-});
-
-export {
-  micro_interactions_default
-};

package/dist/chunks/chunk-Q463ARD6.js

@@ -1,92 +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 {
-  TIMETABLE_BRAND,
-  TIMETABLE_FIELDS,
-  classComponents,
-  legend,
-  week
-} from "./chunk-DEU2ENBD.js";
-import {
-  defineTemplate
-} from "./chunk-A44WEVKR.js";
-import {
-  Kit,
-  preset
-} from "./chunk-T3SGRYUX.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/print/studio-class-timetable-poster.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var SIDE = 48;
-var studio_class_timetable_poster_default = defineTemplate({
-  id: "print-studio-class-timetable",
-  meta: {
-    name: "Studio class timetable poster",
-    description: "An A3 poster of a yoga, strength and dance studio\u2019s week: seven day columns of classes coloured by kind, a key, and the prices, booking and first-visit notes. Each class is a component with its time, name and teacher, so next week is typed in rather than redrawn. Prints with bleed",
-    category: "poster",
-    tags: ["timetable", "schedule", "class schedule", "weekly", "gym", "yoga", "fitness", "dance", "studio", "noticeboard", "a3"],
-    platforms: ["print"],
-    formats: ["poster"],
-    useCases: ["planning", "announcement", "event"],
-    created: "2026-10-10",
-    updated: "2026-10-10"
-  },
-  build() {
-    const k = new Kit("Studio class timetable poster", preset("a3"));
-    k.brand({ ...TIMETABLE_BRAND }, { ...TIMETABLE_FIELDS });
-    k.textStyle("Brand 26", { size: 26, fontWeight: 800, letterSpacing: 0.5, lineHeight: 32 });
-    k.textStyle("Title 120", { size: 120, fontWeight: 900, letterSpacing: -4.5, lineHeight: 112 });
-    k.textStyle("Week 32", { size: 32, fontWeight: 600, lineHeight: 40 });
-    k.textStyle("Day 24", { size: 24, fontWeight: 900, letterSpacing: 2, lineHeight: 28 });
-    k.textStyle("Time 18", { size: 18, fontWeight: 700, letterSpacing: 0.4, lineHeight: 22 });
-    k.textStyle("Class 20", { size: 20, fontWeight: 800, letterSpacing: -0.3, lineHeight: 23 });
-    k.textStyle("Teacher 16", { size: 16, fontWeight: 500, lineHeight: 20 });
-    k.textStyle("Key 20", { size: 20, fontWeight: 700, lineHeight: 24 });
-    k.textStyle("Note title 20", { size: 20, fontWeight: 800, letterSpacing: 1.6, lineHeight: 24 });
-    k.textStyle("Note 19", { size: 19, fontWeight: 500, lineHeight: 27 });
-    const type = { time: "Time 18", name: "Class 20", teacher: "Teacher 16", day: "Day 24", key: "Key 20" };
-    classComponents(k, { width: 136, pad: 14, radius: 12, type });
-    const sheet = k.sheet;
-    k.nameSheet(sheet, "Poster");
-    k.flowSheet(sheet, 40, { top: SIDE, right: SIDE, bottom: SIDE, left: SIDE }, "paper", "SPACE_BETWEEN", "MIN");
-    const head = k.stack(sheet, { direction: "HORIZONTAL", gap: 32, justify: "SPACE_BETWEEN", align: "MAX", fill: "primary", radius: 24, padding: 44, name: "Header" });
-    const words = k.stack(head, { gap: 16, name: "Header words" });
-    k.patch(words, { layoutSizingHorizontal: "FILL" });
-    const brand = k.stack(words, { direction: "HORIZONTAL", gap: 14, align: "CENTER", name: "Brand" });
-    k.logo(brand, 44, 44);
-    k.text(brand, "{{brand.name}}", { style: "Brand 26", color: "onPrimary", width: "FILL", name: "Studio" });
-    k.text(words, "This week\nat the studio", { style: "Title 120", color: "onPrimary", width: "FILL", name: "Title" });
-    k.text(words, "{{brand.week}}", { style: "Week 32", color: "onPrimary", width: "FILL", name: "Week of" });
-    const mark = k.frame(head, { x: 0, y: 0, width: 300, height: 300 }, { name: "Kinds mark" });
-    k.patch(mark, { layoutPositioning: "AUTO" });
-    ["card", "accent", "secondary", "paper"].forEach((role, i) => k.ellipse(mark, 150, role, { name: "Disc", absolute: { x: i % 2 * 150, y: Math.floor(i / 2) * 150 } }));
-    const body = k.stack(sheet, { gap: 28, name: "Body" });
-    legend(k, body, 32);
-    week(k, body, { gap: 12, rowGap: 12, type });
-    const notes = k.stack(sheet, { gap: 20, name: "Notes" });
-    k.rect(notes, "FILL", 3, "text", { name: "Notes rule" });
-    const cols = k.stack(notes, { direction: "HORIZONTAL", gap: 40, name: "Note columns" });
-    const note = (title, text) => {
-      const c = k.stack(cols, { gap: 8, name: "Note" });
-      k.patch(c, { layoutSizingHorizontal: "FILL" });
-      k.text(c, title, { style: "Note title 20", color: "text", width: "FILL", name: "Note title" });
-      k.text(c, text, { style: "Note 19", color: "onPaper", width: "FILL", name: "Note text" });
-    };
-    note("NEW HERE?", "Come ten minutes early and say hello. Mats, blocks and towels are on us; bring water.");
-    note("PRICES", "Drop in \xA312. Ten classes \xA3100, valid three months. Unlimited \xA368 a month.");
-    note("BOOKING", "{{brand.book}} or at the desk. Cancel up to two hours before and keep your credit.");
-    k.text(notes, "{{brand.address}}", { style: "Note title 20", color: "text", width: "FILL", name: "Address" });
-    return k.finish();
-  }
-});
-
-export {
-  studio_class_timetable_poster_default
-};

package/dist/chunks/chunk-Q67L2B7C.js

@@ -1,166 +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 {
-  dotGrid,
-  reelCuts,
-  reelSheet,
-  section
-} from "./chunk-UD3JVCFG.js";
-import {
-  tickPath
-} from "./chunk-YNOCYFZ4.js";
-import {
-  captionStrip,
-  captionSwap
-} from "./chunk-C7BYFVZT.js";
-import {
-  hide,
-  patchAll,
-  restyle
-} from "./chunk-QLV6445V.js";
-import {
-  hardShadow
-} from "./chunk-HVK5T4I5.js";
-import {
-  logoBadge,
-  pill
-} from "./chunk-EK5CFFJO.js";
-import {
-  box
-} from "./chunk-BNVLVZUT.js";
-import {
-  defineTemplate
-} from "./chunk-A44WEVKR.js";
-import {
-  Kit,
-  preset
-} from "./chunk-T3SGRYUX.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/motion/saas-hook-features.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var S = section("launch", 11, 5);
-var { beat } = S;
-var FEATURES = [
-  { title: "One question at a time", note: "People finish what feels short.", fill: "card", ink: "onCard", from: "left" },
-  { title: "Every answer autosaves", note: "Close the tab. Nothing is lost.", fill: "mint", ink: "onMint", from: "right" },
-  { title: "Straight into your CRM", note: "HubSpot, Attio, Sheets. No Zap.", fill: "accent", ink: "onAccent", from: "left" }
-];
-var swaps = [captionSwap(["Long forms lose people.", "Ask one thing first.", "Every answer saves itself.", "Leads reach your CRM.", "Build yours in minutes."], beat(1), S.duration - 30)];
-var cues = [
-  { layer: "Hook top", preset: "pop-in", at: 0, params: { duration: 280 } },
-  { layer: "Hook block", preset: "drop-in", at: 250, params: { duration: 300 } },
-  { layer: "Hook end", preset: "pop-in", at: 520, params: { duration: 300 } },
-  { layer: "Burst", preset: "scale-in", at: 0, params: { duration: 500 } },
-  { layer: "Hook block", preset: "wobble", at: beat(2), params: { duration: 600, amount: 5 } },
-  { layer: "Caption strip", preset: "rise-in", at: beat(1), params: { duration: 300 } },
-  ...FEATURES.map((f, i) => ({ layer: `Feature ${i + 1}`, preset: "slide-in", at: beat(4 + i * 4), params: { duration: 380, direction: f.from } })),
-  ...FEATURES.map((_, i) => ({ layer: `Feature ${i + 1}`, preset: "shake", at: beat(4 + i * 4) + 380, params: { duration: 320, distance: 10 } })),
-  { layer: "Call row", preset: "pop-in", at: beat(16), params: { duration: 400 } },
-  { layer: "Call row", preset: "pulse", at: beat(17.5), params: { duration: 500, amount: 0.05 } },
-  { layer: "Call row", preset: "pulse", at: beat(19), params: { duration: 500, amount: 0.05 } }
-];
-var saas_hook_features_default = defineTemplate({
-  id: "motion-saas-hook-features",
-  meta: {
-    name: "SaaS short: hook and three features",
-    description: "A 10-second neo-brutalist reel: a blunt question lands in the first second, three feature blocks slam in on the downbeats (each its own colour and drawing), and the call to action pops. Music, burned-in captions, 9:16 with square and 4:5 cuts",
-    category: "animation",
-    tags: ["animation", "saas", "hook", "features", "neo-brutalist", "brutalism", "bold", "captions", "music", "audio", "reel", "tiktok", "shorts", "ad"],
-    platforms: ["tiktok", "instagram", "youtube", "x", "linkedin"],
-    formats: ["reel", "short", "story", "post", "portrait-post", "ad"],
-    useCases: ["launch", "announcement", "tips"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  motion: { cues, swaps },
-  build() {
-    const k = new Kit("SaaS short: hook and three features", preset("ig-story"));
-    k.quantizeGeometry = true;
-    k.brand(
-      { paper: "#FFE03A", text: "#0D0D0D", primary: "#FF4F9A", onPrimary: "#0D0D0D", accent: "#2447F0", onAccent: "#FFFFFF", card: "#FFFFFF", onCard: "#0D0D0D" },
-      { name: "Punchform", site: "punchform.example" }
-    );
-    k.palette({ ink: "#0D0D0D", onInk: "#FFFFFF", mint: "#7CF2C0", onMint: "#0D0D0D", field: "#FFF6C2" });
-    k.textStyle("Hook 100", { size: 100, fontWeight: 900, letterSpacing: -4, lineHeight: 98, textCase: "UPPER" });
-    k.textStyle("Hook 76", { size: 76, fontWeight: 900, letterSpacing: -3, lineHeight: 74, textCase: "UPPER" });
-    k.textStyle("Feature 46", { size: 46, fontWeight: 900, letterSpacing: -1.6, lineHeight: 48 });
-    k.textStyle("Note 28", { size: 28, fontWeight: 600, lineHeight: 34 });
-    k.textStyle("Caption 40", { size: 40, fontWeight: 800, letterSpacing: -0.8, lineHeight: 48 });
-    k.textStyle("Button 34", { size: 34, fontWeight: 900, letterSpacing: -0.6, lineHeight: 42 });
-    pill(k, "Button", { fill: "primary", ink: "onPrimary", style: "Button 34", label: "Build one free at punchform.example", pad: [20, 30], radius: 0 });
-    const rule = { color: "ink", width: 6, align: "INSIDE", join: "MITER" };
-    const sheet = reelSheet(k, S, { name: "Hook and features", gap: 22 });
-    dotGrid(k, sheet, "ink", { step: 36, size: 5, opacity: 0.1 });
-    const burst = k.star(sheet, 420, "accent", { name: "Burst", absolute: { x: 800, y: -40 } });
-    k.patch(burst, { rotation: 14, pointCount: 12, innerRadius: 0.72 });
-    const form = k.frame(sheet, { x: 140, y: 1500, width: 900, height: 440 }, { name: "Long form" });
-    [0, 1, 2].forEach((i) => {
-      k.rect(form, i === 2 ? 520 : 800, 96, "field", { name: "Empty field", stroke: rule, effects: [hardShadow(k, "ink", 10, 10)], absolute: { x: i * 34, y: i * 136 } });
-      k.rect(form, 6, 52, "ink", { name: "Caret", absolute: { x: i * 34 + 30, y: i * 136 + 22 }, opacity: i === 0 ? 1 : 0.25 });
-    });
-    const hook = k.stack(sheet, { gap: 8, name: "Hook" });
-    k.text(hook, "Still using a", { style: "Hook 100", color: "text", name: "Hook top" });
-    const block = k.stack(hook, { width: "HUG", fill: "primary", stroke: rule, effects: [hardShadow(k, "ink", 10, 10)], padding: { top: 6, right: 22, bottom: 12, left: 22 }, name: "Hook block" });
-    k.text(block, "23-field", { style: "Hook 100", color: "onPrimary", autoWidth: true, name: "Hook number" });
-    k.text(hook, "form?", { style: "Hook 100", color: "text", name: "Hook end" });
-    FEATURES.forEach((f, i) => {
-      const card = k.stack(sheet, { direction: "HORIZONTAL", gap: 22, align: "CENTER", fill: f.fill, stroke: rule, effects: [hardShadow(k, "ink", 10, 10)], padding: { top: 38, right: 28, bottom: 42, left: 30 }, name: `Feature ${i + 1}` });
-      const words = k.stack(card, { gap: 6, name: "Feature words" });
-      k.text(words, f.title, { style: "Feature 46", color: f.ink, name: "Feature title" });
-      k.text(words, f.note, { style: "Note 28", color: f.ink, name: "Feature note" });
-      const art = k.stack(card, { width: 170, height: 112, name: "Feature drawing" });
-      if (i === 0) {
-        k.rect(art, 170, 62, "field", { name: "Field", stroke: { ...rule, width: 5 }, absolute: { x: 0, y: 0 } });
-        k.rect(art, 5, 34, "ink", { name: "Field caret", absolute: { x: 18, y: 14 } });
-        k.vector(art, 170, 16, [0, 1, 2, 3, 4, 5, 6].map((n) => box(n * 25, 0, 20, 16)), "ink", { name: "Steps", absolute: { x: 0, y: 86 }, opacity: 0.22 });
-        k.vector(art, 170, 16, [0, 1, 2].map((n) => box(n * 25, 0, 20, 16)), "primary", { name: "Steps done", absolute: { x: 0, y: 86 } });
-      } else if (i === 1) {
-        ;
-        [0, 1, 2].forEach((n) => {
-          k.rect(art, 124, 26, "card", { name: "Answer", stroke: { ...rule, width: 4 }, absolute: { x: 0, y: n * 42 } });
-          k.vector(art, 30, 22, [tickPath(30, 22)], "ink", { name: "Saved tick", strokeWidth: 7, absolute: { x: 138, y: n * 42 + 2 } });
-        });
-      } else {
-        const cells = [];
-        for (let r = 0; r < 4; r++) for (let c = 0; c < 3; c++) cells.push(box(c * 58, r * 29, 52, 23));
-        k.vector(art, 170, 112, cells, "card", { name: "CRM rows", absolute: { x: 0, y: 0 }, opacity: 0.35 });
-        k.vector(art, 170, 23, [0, 1, 2].map((c) => box(c * 58, 0, 52, 23)), "primary", { name: "New row", absolute: { x: 0, y: 29 }, stroke: { ...rule, width: 3 } });
-      }
-    });
-    captionStrip(k, sheet, swaps[0].words[0], { style: "Caption 40", fill: "ink", ink: "onInk", pad: [16, 26] });
-    const call = k.stack(sheet, { direction: "HORIZONTAL", width: "HUG", gap: 0, align: "CENTER", stroke: { ...rule, align: "OUTSIDE" }, effects: [hardShadow(k, "ink", 10, 10)], name: "Call row" });
-    logoBadge(k, call, { fill: "ink", size: 42, pad: 20, radius: 0 });
-    k.instance(call, "Button", { Label: "Build one free at {{brand.site}}" }, { name: "Call" });
-    k.swaps(sheet, swaps);
-    k.cues(sheet, cues);
-    k.variants(sheet, reelCuts({ post: 40, portrait: 80 }, {
-      post: (kit, id) => {
-        kit.patch(id, { itemSpacing: 16, counterAxisSpacing: 16, padding: { top: 44, right: 72, bottom: 50, left: 72 } });
-        hide(kit, id, ["Long form"]);
-        patchAll(kit, id, "Hook", { itemSpacing: 4, counterAxisSpacing: 4 });
-        for (const n of ["Hook top", "Hook number", "Hook end"]) restyle(kit, id, n, "Hook 76");
-        patchAll(kit, id, "Hook block", { padding: { top: 4, right: 16, bottom: 8, left: 16 } });
-        patchAll(kit, id, "Burst", { x: 740, y: -110 });
-        for (let i = 1; i <= 3; i++) patchAll(kit, id, `Feature ${i}`, { padding: { top: 22, right: 28, bottom: 26, left: 30 } });
-      },
-      portrait: (kit, id) => {
-        kit.patch(id, { itemSpacing: 22, counterAxisSpacing: 22, padding: { top: 64, right: 140, bottom: 64, left: 140 } });
-        hide(kit, id, ["Long form"]);
-      }
-    }));
-    k.setCover(sheet);
-    return k.finish();
-  }
-});
-
-export {
-  saas_hook_features_default
-};

package/dist/chunks/chunk-Q6VPPKMZ.js

@@ -1,86 +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 {
-  trackInfo
-} from "./chunk-SQCPEGOZ.js";
-import {
-  MUSIC_HASH,
-  shippedWav
-} from "./chunk-AXTNNHMG.js";
-import {
-  hex
-} from "./chunk-T3SGRYUX.js";
-import {
-  contrastRatio
-} from "./chunk-U4LTVSLE.js";
-import {
-  analyzeAudio
-} from "./chunk-3KX7WU34.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-6VMOKHMF.js";
-
-// templates/src/music/shared.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-function onColor(surface, candidates, ratio = 4.5) {
-  const s = hex(surface);
-  const pick = candidates.find((c) => contrastRatio(hex(c), s) >= ratio);
-  if (pick) return pick;
-  return contrastRatio(hex("#000000"), s) >= contrastRatio(hex("#FFFFFF"), s) ? "#000000" : "#FFFFFF";
-}
-function songClips(id, passes, fadeOut = 900) {
-  const info = trackInfo(id);
-  const n = Math.ceil(passes - 1e-9);
-  return Array.from({ length: n }, (_, p) => ({
-    id: `a${p + 1}`,
-    mediaHash: MUSIC_HASH[id],
-    name: `${info.title}${info.bpm ? ` (${info.bpm} BPM` : " ("}, made by PopCraft, CC0)`,
-    start: Math.round(p * info.durationMs * 1e3) / 1e3,
-    in: 0,
-    out: Math.round(Math.min(1, passes - p) * info.durationMs * 1e3) / 1e3,
-    lane: 0,
-    ...p === n - 1 && fadeOut ? { fadeOut } : {}
-  }));
-}
-var songLength = (id, passes) => Math.round(trackInfo(id).durationMs * passes);
-function withSong(k, sheet, id, passes, fadeOut) {
-  k.timeline(sheet, { duration: songLength(id, passes), fps: 30, audio: songClips(id, passes, fadeOut) });
-}
-var beatMemo = /* @__PURE__ */ new Map();
-function trackBeats(id) {
-  let b = beatMemo.get(id);
-  if (!b) {
-    const { channels, sampleRate } = shippedWav(MUSIC_HASH[id]);
-    b = [...analyzeAudio(channels, sampleRate).beats].map((t) => Math.round(t));
-    beatMemo.set(id, b);
-  }
-  return b;
-}
-function songBeats(id, passes) {
-  const one = trackBeats(id), len = trackInfo(id).durationMs;
-  return Array.from({ length: Math.ceil(passes - 1e-9) }, (_, p) => one.map((t) => Math.round(p * len + t))).flat().filter((t) => t < len * passes);
-}
-var SCRIM = 0.74;
-function scrim(k, parent, role, o = {}, alpha = SCRIM) {
-  return k.stack(parent, { radius: 36, padding: { top: 24, right: 32, bottom: 24, left: 32 }, align: "CENTER", ...o, fill: k.tint(role, alpha) });
-}
-function hexOf(c) {
-  const h = (v) => Math.round(Math.max(0, Math.min(1, v)) * 255).toString(16).padStart(2, "0");
-  return `#${h(c.r)}${h(c.g)}${h(c.b)}`;
-}
-
-export {
-  onColor,
-  songClips,
-  songLength,
-  withSong,
-  trackBeats,
-  songBeats,
-  SCRIM,
-  scrim,
-  hexOf
-};