@popcraft/kit 0.29.0 → 0.30.0

package/dist/chunks/chunk-VYY4DVU7.js

@@ -1,122 +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
-} from "./chunk-T5EUIGII.js";
-import {
-  key
-} from "./chunk-OTE5FUDA.js";
-import {
-  PHONE,
-  deviceShadow,
-  devices
-} from "./chunk-IGV5QPFA.js";
-import {
-  appScreens
-} from "./chunk-MZVIWZ2V.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  Kit,
-  preset
-} from "./chunk-OFAIOFJQ.js";
-import {
-  ease
-} from "./chunk-MFBWT2Y7.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/motion3d/vertical-promo.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var DURATION = 12e3;
-var FPS = 30;
-var SIZES = ["ig-story"];
-var SPIN = 1500;
-var POP = 1900;
-var CAPTION = { name: "Headline", kicker: "Free on iPhone & Android", title: "Your money, finally makes sense." };
-var CTA = { name: "Call to action", title: "Link in bio. It\u2019s free.", cta: "Download Fern" };
-var CUES = [
-  ...captionCues(CAPTION, 400, 8200),
-  ...captionCues(CTA, 8700),
-  { layer: "Call to action button", preset: "pulse", at: 10400, params: { amount: 0.06 } }
-];
-var POPS = [
-  { name: "Balance", component: "Balance card", x: -270, y: -300, z: 260, ry: 16, rz: -6 },
-  { name: "Payment", component: "Transaction", x: 280, y: -20, z: 320, ry: -18, rz: 4 },
-  { name: "Chart", component: "Bar chart", x: -250, y: 250, z: 200, ry: 14, rz: 3 }
-];
-function build(k, sheet, s) {
-  k.nameSheet(sheet, `Vertical app promo \xB7 ${preset(s.preset).name}`);
-  glow(k, sheet, "primary", Math.round(1200 * s.u), s.W * 0.5, s.H * 0.55, 0.6);
-  glow(k, sheet, "accent", Math.round(560 * s.u), s.W * 0.2, s.H * 0.4, 0.2, "Glow accent");
-  const scene = stage(k, sheet, s, { duration: DURATION, fps: FPS, perspective: 2400 * s.u });
-  const col = column(s);
-  const cy = col.top + 610;
-  const phoneRig = rig(k, scene, s, "Phone", PHONE.width, PHONE.height, s.W / 2, cy);
-  k.patch(phoneRig, { scaleX: 0.78, scaleY: 0.78 });
-  const phone = k.instance(phoneRig, "Phone", { Screen: { swap: "Screen / Home" } }, { name: "Handset" });
-  k.patch(phone, { effects: [deviceShadow(0.45, 50, 100)] });
-  key(k, phoneRig, "rotateY", [[0, -540, ease.out("expo")], [SPIN, 0]]);
-  key(k, phoneRig, "translateY", [[0, k.node(phoneRig).translateY + 900, ease.out("expo")], [SPIN, k.node(phoneRig).translateY]]);
-  k.behave(phoneRig, "rotateY", [{ kind: "sine", amp: 8, freq: 1 / 7 }]);
-  POPS.forEach((p, i) => {
-    const plate = k.stack(phoneRig, { width: "HUG", fill: "surface", radius: 28, padding: 14, name: p.name, effects: [deviceShadow(0.35, 30, 60)] });
-    k.instance(plate, p.component, {}, { name: p.component });
-    const box = k.finish().nodes[plate];
-    k.patch(plate, { x: Math.round((PHONE.width - box.width) / 2), y: Math.round((PHONE.height - box.height) / 2), translateX: p.x, translateY: p.y, z: p.z, rotateY: p.ry, rotation: p.rz });
-    const at = POP + i * 220;
-    key(k, plate, "z", [[at, 0, ease.back(1.6)], [at + 700, p.z]]);
-    key(k, plate, "translateX", [[at, 0, ease.back(1.6)], [at + 700, p.x]]);
-    key(k, plate, "translateY", [[at, 0, ease.back(1.6)], [at + 700, p.y]]);
-    key(k, plate, "opacity", [[at, 0, ease.out("cubic")], [at + 250, 1]]);
-    k.behave(plate, "z", [{ kind: "sine", amp: 24, freq: 0.35, phase: i / 3 }]);
-  });
-  captionParts(k, s, { kicker: CAPTION.kicker, cta: CTA.cta });
-  caption(k, sheet, s, { ...CAPTION, width: col.width, align: "CENTER", at: { x: col.x, y: col.top + 10 } });
-  const end = caption(k, sheet, s, { ...CTA, width: col.width, align: "CENTER", at: { x: col.x, y: 0 } });
-  const laid = k.finish().nodes[end];
-  k.patch(end, { y: Math.round(col.bottom - laid.height - 10) });
-  k.cues(sheet, CUES);
-}
-var vertical_promo_default = defineTemplate({
-  id: "motion-3d-vertical-promo",
-  meta: {
-    name: "Vertical app promo",
-    description: "A 12-second 9:16 reel: a phone spins in and the parts of its screen pop out toward you in 3D \u2014 balance, payment, weekly chart \u2014 under a headline, then the call to action lands. 30 fps, kept clear of the TikTok, Reels and Shorts interface",
-    category: "animation",
-    tags: ["animation", "3d", "app", "phone", "reel", "tiktok", "shorts", "vertical", "pop out", "promo"],
-    platforms: ["tiktok", "instagram", "youtube", "snapchat"],
-    formats: ["reel", "short", "story", "ad"],
-    useCases: ["launch", "announcement"],
-    created: "2026-09-29",
-    updated: "2026-09-29"
-  },
-  motion: { cues: CUES },
-  build() {
-    const k = new Kit("Vertical app promo", preset(SIZES[0]));
-    brand(k, "dark");
-    appScreens(k, ["Home", "Insights", "Screenshot"]);
-    devices(k, ["Phone"]);
-    const [cover] = sizes(k, SIZES, (sheet, s) => build(k, sheet, s));
-    k.setCover(cover);
-    return k.finish();
-  }
-});
-
-export {
-  vertical_promo_default
-};

package/dist/chunks/chunk-VZXUJ7I3.js

@@ -1,399 +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 {
-  PLOTLINE,
-  WEB_STEPS,
-  WEB_TYPE,
-  arrow,
-  arrowAt,
-  board as board2,
-  boxPaths,
-  dots,
-  draw,
-  keyWordmark,
-  marker,
-  marquee,
-  miniNote,
-  outline,
-  pen,
-  redots,
-  refitBoard,
-  refitWindow,
-  scribbleCircle,
-  sketchBrand,
-  sketchWindow,
-  sparkle,
-  sticky,
-  tick,
-  tidyKeys,
-  underline,
-  wobblyBox
-} from "./chunk-TV4GTCQI.js";
-import {
-  portraitSlot
-} from "./chunk-24GVH2SQ.js";
-import {
-  clicks,
-  glide
-} from "./chunk-SJ7465NW.js";
-import {
-  CONTENT,
-  columns,
-  compactNav,
-  footer,
-  respond,
-  typeScale
-} from "./chunk-UOQIT6VU.js";
-import {
-  buttons,
-  nav
-} from "./chunk-TF2MO3UA.js";
-import {
-  board,
-  reboard
-} from "./chunk-YHBAWSDX.js";
-import {
-  defineTemplate
-} from "./chunk-PMGFSLPU.js";
-import {
-  Kit,
-  preset
-} from "./chunk-OFAIOFJQ.js";
-import {
-  measureTextWidth
-} from "./chunk-CGIPDP5Y.js";
-import {
-  ease
-} from "./chunk-MFBWT2Y7.js";
-import {
-  init_define_POPCRAFT_COMPONENT_IDS
-} from "./chunk-FFS4SO7R.js";
-
-// templates/src/web/style-sketch-landing.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var NAME = "Sketch SaaS landing page";
-var DURATION = 6e3;
-var TAP = 1800;
-var TIDY = 2e3;
-var UNTIDY = 5e3;
-var TIMING = { tidyAt: TIDY, untidyAt: UNTIDY, spread: 40, fly: 560 };
-var TEAMS = ["Fernhill Bikes", "Okapi Studio", "Lanternfish", "Brightwater Clinic", "Paper Crane Games", "Northbeam"];
-var HEADLINE = "Your whiteboard,\nsorted into a plan.";
-var HERO = {
-  desktop: { w: 620, h: 500, geo: { noteH: 96, headH: 40, rowGap: 14 } },
-  laptop: { w: 600, h: 500, geo: { noteH: 96, headH: 40, rowGap: 14 } },
-  tablet: { w: CONTENT.tablet, h: 500, geo: { noteH: 96, headH: 40, rowGap: 14 } },
-  mobile: { w: CONTENT.mobile, h: 520, geo: { noteH: 106, headH: 40, rowGap: 12, cols: 2 } }
-};
-var BAR = 74;
-var WEEKS = [41, 44, 39, 43, 47, 58, 66, 71, 78, 82, 85, 87];
-var CHART = { h: 300 };
-var WALL = { w: 440, h: 300 };
-var PLAN_W = Math.floor((CONTENT.desktop - 32) / 3);
-var cues = [
-  { layer: "Headline", preset: "words-in", at: 100, params: { duration: 600 } },
-  { layer: "Kicker", preset: "pop-in", at: 0, params: { duration: 420, amount: 0.6 } },
-  { layer: "Feature note", preset: "pop-in", at: 900, stagger: { delay: 160, order: "selection" }, params: { duration: 460, amount: 0.7 } },
-  { layer: "Mini note", preset: "pop-in", at: 300, stagger: { delay: 60, order: "selection" }, params: { duration: 360, amount: 0.6 } }
-];
-var counts = [
-  { layer: "Result figure", at: 1200, duration: 2400, counter: { from: 41, to: 87, suffix: "%" } },
-  { layer: "Minutes figure", at: 1600, duration: 1750, tick: 50, counter: { from: PLOTLINE.before, to: PLOTLINE.after, suffix: " min" } }
-];
-var style_sketch_landing_default = defineTemplate({
-  id: "web-saas-style-sketch-landing",
-  meta: {
-    name: NAME,
-    description: "A full landing page drawn with a marker in a dotted notebook, for a planning whiteboard. The hero plays the product on a loop: sticky notes in a heap, a marker pen taps Tidy up and they fly into three columns with a person and a date each. Under it a running band of teams, a wall of stickies turning into a plan with a red arrow that draws itself, a hand-drawn chart with a counting figure and a circled last point, features as sticky notes slapped on at angles, a quote beside a taped photo slot, the plans, a big closing line and a footer. Desktop to phone",
-    category: "web",
-    tags: ["landing page", "saas", "sketch", "hand-drawn", "whiteboard", "sticky notes", "doodle", "planning", "productivity", "hero", "chart", "counter", "marquee", "testimonial", "pricing", "animation", "website", "responsive"],
-    platforms: ["web"],
-    formats: ["page"],
-    useCases: ["launch", "brand-intro"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  breakpoints: true,
-  motion: { cues, counts },
-  build() {
-    const k = new Kit(NAME, preset("web-desktop"));
-    k.quantizeGeometry = true;
-    sketchBrand(k, { tagline: HEADLINE });
-    const s = typeScale(k, { ...WEB_TYPE });
-    buttons(k, { style: s("Button 16"), pad: [14, 22], radius: 12 });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 112, { top: 28, right: 120, bottom: 56, left: 120 }, "paper", "MIN", "MIN");
-    k.patch(sheet, { layoutSizingVertical: "HUG", minHeight: 1024, clipsContent: true });
-    k.timeline(sheet, { duration: DURATION, fps: 30 });
-    k.patch(sheet, { height: 7400 });
-    dots(k, sheet, { step: 32, size: 3, opacity: 0.14 });
-    const top = k.stack(sheet, { gap: 40, name: "Top" });
-    nav(k, top, { links: ["Product", "Templates", "Pricing", "Customers", "Sign in"], cta: "Start a free board", style: s("Nav 15"), brandStyle: s("Brand 20") });
-    const hero = k.stack(top, { direction: "HORIZONTAL", gap: 40, align: "CENTER", padding: { top: 24, right: 0, bottom: 0, left: 0 }, name: "Hero" });
-    const copy = k.stack(hero, { width: 540, gap: 26, name: "Copy" });
-    const kicker = sticky(k, copy, { width: 210, color: "sticky", text: `New in ${PLOTLINE.version}: ${PLOTLINE.feature}`, style: s("Ui 15"), pad: 12, name: "Kicker" });
-    k.patch(kicker.note, { rotation: -2 });
-    const headBox = k.stack(copy, { name: "Headline box" });
-    const headline = k.text(headBox, "{{brand.tagline}}", { style: s("Display 64"), color: "text", name: "Headline" });
-    const headLine = marker(k, headBox, 200, 22, underline(200, 22, { seed: 12 }), { name: "Headline line", color: "red", width: 7, absolute: { x: 0, y: 0 } });
-    k.text(copy, "Plotline is the whiteboard your team already plans on, with one extra button. Tap Tidy up and every sticky lands in This week, Next week or Later, with a person and a date on it.", { style: s("Lead 20"), color: "onPaper", name: "Lead" });
-    const ctas = k.stack(copy, { direction: "HORIZONTAL", gap: 12, wrap: true, name: "Ctas" });
-    k.instance(ctas, "Button", { Label: "Start a free board" }, { name: "CTA primary" });
-    k.instance(ctas, "Button quiet", { Label: "Watch the 40 s demo" }, { name: "CTA quiet" });
-    k.text(copy, PLOTLINE.trial, { style: s("Small 14"), color: "onPaper", name: "Terms" });
-    const H0 = HERO.desktop;
-    const w = sketchWindow(k, hero, { w: H0.w, h: H0.h, title: "Launch plan, week 41", style: s("Ui 15"), button: PLOTLINE.feature, buttonStyle: s("Button 16"), name: "Hero window", seed: 5, bar: BAR - 10 });
-    const b = board2(k, w.body, { w: H0.w, h: H0.h - w.bar, noteStyle: s("Note 15"), metaStyle: s("Meta 12"), headStyle: s("Head 17"), geo: H0.geo });
-    const p = pen(k, w.win, { x: H0.w - 70, y: H0.h - 60, size: 96 });
-    const heroArrow = arrowAt(k, hero, { x: 400, y: 476 }, { x: 568, y: 392 }, { name: "Hero arrow", bend: 0.35, seed: 21, width: 5 });
-    const band = k.stack(sheet, { gap: 14, name: "Band" });
-    k.text(band, "Teams planning on Plotline this week", { style: s("Label 14"), color: "onPaper", name: "Band label" });
-    marquee(k, band, { names: TEAMS, item: 250, height: 64, style: s("Brand 20"), duration: DURATION });
-    const wall = k.stack(sheet, { gap: 36, name: "Wall section" });
-    const wallHead = k.stack(wall, { direction: "HORIZONTAL", gap: 40, name: "Wall head" });
-    k.text(wallHead, "From a wall of stickies to a plan, in one tap.", { style: s("Section 44"), color: "text", width: 560, name: "Wall title" });
-    k.text(wallHead, "Tidy up reads every note, folds the duplicates together, puts each one in This week, Next week or Later and suggests a person and a date from your team's calendar. Drag anything to change it: it is still your whiteboard.", { style: s("Body 16"), color: "onPaper", name: "Wall body" });
-    const wallRow = k.stack(wall, { direction: "HORIZONTAL", gap: 20, align: "CENTER", justify: "SPACE_BETWEEN", name: "Wall row" });
-    const heap = board(k, wallRow, WALL.w, WALL.h, 1, "Heap");
-    heapNotes(k, heap);
-    const mid = k.stack(wallRow, { width: 240, gap: 6, align: "CENTER", name: "Wall arrow" });
-    k.text(mid, "one tap", { style: s("Sticky 22"), color: "text", autoWidth: true, name: "Wall arrow label" });
-    const big = arrow({ x: 10, y: 70 }, { x: 230, y: 70 }, { bend: 0.22, head: 38, seed: 31 });
-    const bigArrow = marker(k, mid, big.w, big.h, big.paths, { name: "Wall arrow line", color: "red", width: 8, sequential: true });
-    const plan = board(k, wallRow, WALL.w, WALL.h, 1, "Plan");
-    planNotes(k, plan);
-    const results = k.stack(sheet, { direction: "HORIZONTAL", gap: 40, name: "Results row" });
-    const rCopy = k.stack(results, { width: 440, gap: 18, name: "Results copy" });
-    k.text(rCopy, "Follow-ups that actually happen", { style: s("Section 34"), color: "text", name: "Results title" });
-    k.text(rCopy, "87%", { style: s("Figure 96"), color: "text", width: 300, name: "Result figure" });
-    k.text(rCopy, "of the action items from Fernhill Bikes' Monday retros were done within a week once they planned on Plotline, up from 41%. Same team, same meetings; every note left the room with a name on it.", { style: s("Lead 17"), color: "onPaper", name: "Result body" });
-    const chart = k.stack(results, { gap: 10, name: "Chart" });
-    const chartW = CONTENT.desktop - 440 - 40;
-    const area = k.stack(chart, { height: CHART.h, name: "Chart area" });
-    const cp = chartPaths(chartW, CHART.h);
-    marker(k, area, chartW, CHART.h, cp.axes, { name: "Chart axes", color: "text", width: 3, absolute: { x: 0, y: 0 } });
-    marker(k, area, chartW, CHART.h, cp.levels, { name: "Chart levels", color: "text", width: 1.5, opacity: 0.25, absolute: { x: 0, y: 0 } });
-    const line = marker(k, area, chartW, CHART.h, [cp.line], { name: "Chart line", color: "primary", width: 6, absolute: { x: 0, y: 0 } });
-    const ring = marker(k, area, 64, 64, scribbleCircle(64, 64, { seed: 44, turns: 1.25 }), { name: "Chart ring", color: "red", width: 5, absolute: { x: cp.end.x - 32, y: cp.end.y - 32 } });
-    k.text(area, "moved to Plotline", { style: s("Ui 15"), color: "text", autoWidth: true, name: "Chart note", absolute: { x: cp.at5.x - 150, y: 6 } });
-    const noteArrow = arrowAt(k, area, { x: cp.at5.x - 60, y: 34 }, { x: cp.at5.x - 6, y: cp.at5.y - 14 }, { name: "Chart note arrow", bend: -0.3, seed: 45, width: 3.5, head: 14, color: "text" });
-    const axis = k.stack(chart, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", name: "Chart axis" });
-    for (const a of ["Week 1", "Week 6", "Week 12"]) k.text(axis, a, { style: s("Small 14"), color: "onPaper", autoWidth: true, name: "Axis label" });
-    const feats = k.stack(sheet, { gap: 32, name: "Features" });
-    const fHead = k.stack(feats, { gap: 4, name: "Features head" });
-    k.text(fHead, "Everything else on the board", { style: s("Section 44"), color: "text", name: "Features title" });
-    const fLine = marker(k, fHead, 300, 20, underline(300, 20, { seed: 51 }), { name: "Features line", color: "primary", width: 6 });
-    const grid = k.stack(feats, { direction: "HORIZONTAL", gap: 20, wrap: true, name: "Feature grid" });
-    const FEATS = [
-      ["Dot vote", "Everyone gets three dots. The board re-sorts itself by what the team actually wants.", "mint", doodleDots()],
-      ["Owners and dates", "Tidy up suggests who and when from your team's calendar. Confirm with one tap.", "sticky", tick(40)],
-      ["Timeline view", "Flip any board into weeks to see what lands when, and drag a note to move it.", "peach", doodleTimeline()],
-      ["Draw anywhere", "Pen, highlighter and arrows that snap to stickies, on a laptop or a tablet, even offline.", "sticky", sparkle(40)]
-    ];
-    FEATS.forEach(([title, body, color, doodle], i) => {
-      const n = k.stack(grid, { width: 285, fill: color, padding: 22, gap: 12, effects: [{ type: "DROP_SHADOW", color: { r: 0, g: 0, b: 0, a: 0.16 }, offset: { x: 0, y: 6 }, blur: 10, spread: 0, visible: true }], name: "Feature note" });
-      k.patch(n, { rotation: [-1.6, 1.2, -0.9, 1.7][i] });
-      marker(k, n, 40, 40, doodle, { name: "Feature doodle", color: i % 2 ? "red" : "primary", width: 4 });
-      k.text(n, title, { style: s("Sticky 22"), color: "stickyInk", name: "Feature title" });
-      k.text(n, body, { style: s("Body 16"), color: "stickyInk", name: "Feature body" });
-    });
-    const quote = k.stack(sheet, { direction: "HORIZONTAL", gap: 48, align: "CENTER", name: "Quote" });
-    const photo = k.stack(quote, { width: 280, height: 320, fill: "card", padding: 14, effects: [{ type: "DROP_SHADOW", color: { r: 0, g: 0, b: 0, a: 0.14 }, offset: { x: 0, y: 8 }, blur: 16, spread: 0, visible: true }], name: "Photo card" });
-    portraitSlot(k, photo, 252, 252, { radius: 4, ground: "peach", skin: "sticky", top: "primary", halo: "mint", name: "Portrait", photo: "Customer photo" });
-    k.rect(photo, 110, 30, k.tint("hi", 0.8), { name: "Tape", absolute: { x: 85, y: -12 } });
-    const qMain = k.stack(quote, { gap: 22, name: "Quote main" });
-    k.text(qMain, '"Our Monday retro used to end with forty stickies and no plan. Now Tidy up hands out the follow-ups before anyone has left the room."', { style: s("Quote 30"), color: "text", name: "Quote words" });
-    const who = k.stack(qMain, { direction: "HORIZONTAL", gap: 40, align: "CENTER", wrap: true, name: "Quote foot" });
-    const name = k.stack(who, { gap: 2, width: "HUG", name: "Quote who" });
-    k.text(name, "Priya Raman", { style: s("Ui 15"), color: "text", autoWidth: true, name: "Quote name" });
-    k.text(name, "Engineering manager, Fernhill Bikes", { style: s("Small 14"), color: "onPaper", autoWidth: true, name: "Quote role" });
-    const mins = k.stack(who, { direction: "HORIZONTAL", gap: 12, width: "HUG", align: "CENTER", name: "Quote stat" });
-    k.text(mins, `${PLOTLINE.after} min`, { style: s("Section 34"), color: "text", width: 120, name: "Minutes figure" });
-    k.text(mins, `retro follow-up,
-down from ${PLOTLINE.before}`, { style: s("Small 14"), color: "onPaper", autoWidth: true, name: "Minutes label" });
-    const plans = k.stack(sheet, { gap: 24, name: "Plans" });
-    k.text(plans, "Free for small boards. Paid when the team grows.", { style: s("Section 34"), color: "text", name: "Plans title" });
-    const strip = k.stack(plans, { direction: "HORIZONTAL", gap: 16, name: "Plan strip" });
-    let planRing = "";
-    for (const [plan2, price, line2] of [["Free", "$0", "3 boards, every feature, up to 5 editors"], ["Team", `$${PLOTLINE.team}`, "an editor a month, unlimited boards"], ["Business", `$${PLOTLINE.business}`, "an editor a month, plus SSO and audit log"]]) {
-      const c = k.stack(strip, { gap: 8, height: 150, padding: { top: 22, right: 24, bottom: 22, left: 24 }, name: "Plan cell" });
-      k.text(c, plan2, { style: s("Head 17"), color: "text", name: "Plan name" });
-      k.text(c, price, { style: s("Price 52"), color: "text", name: "Plan price" });
-      k.text(c, line2, { style: s("Small 14"), color: "onPaper", name: "Plan line" });
-      outline(k, c, PLAN_W, 150, { seed: plan2.length * 7, width: 2.5, name: "Plan outline" });
-      if (plan2 === "Team") planRing = marker(k, c, 96, 64, scribbleCircle(96, 64, { seed: 47, turns: 1.2 }), { name: "Plan ring", color: "red", width: 4.5, absolute: { x: 12, y: 46 } });
-    }
-    k.instance(plans, "Button quiet", { Label: "Compare plans" }, { name: "Plans link" });
-    const closing = k.stack(sheet, { gap: 28, name: "Close" });
-    k.text(closing, "Plan it before you\nleave the room.", { style: s("Hand 120"), color: "text", name: "Close title" });
-    const closeRow = k.stack(closing, { direction: "HORIZONTAL", gap: 20, align: "CENTER", wrap: true, name: "Close row" });
-    k.instance(closeRow, "Button", { Label: "Start a free board" }, { name: "Close button" });
-    k.text(closeRow, "Bring your stickies from Miro, FigJam or a photo of the wall.", { style: s("Body 16"), color: "onPaper", autoWidth: true, name: "Close line" });
-    footer(k, sheet, {
-      about: PLOTLINE.pitch,
-      legal: "\xA9 2026 {{brand.name}} Labs. Made in Bristol and Lisbon.",
-      columns: [["Product", ["Tidy up", "Dot vote", "Timeline", "Templates"]], ["Company", ["Customers", "Pricing", "Careers", "Press kit"]], ["Help", ["Guides", "Status", "Security"]]],
-      brandStyle: s("Brand 20"),
-      headStyle: s("Label 14"),
-      linkStyle: s("Small 14"),
-      ruleColor: "text"
-    });
-    k.counts(sheet, counts);
-    k.cues(sheet, cues);
-    heroLoop(k, sheet, w.win, b.notes, b.geo, p);
-    draw(k, k.named(w.win, "Window outline")[0], 0, 700);
-    draw(k, headLine, 700, 500);
-    draw(k, heroArrow, 1e3, 600);
-    draw(k, bigArrow, 800, 900);
-    draw(k, line, 900, 2600);
-    draw(k, ring, 3500, 600);
-    draw(k, noteArrow, 1500, 400);
-    if (planRing) draw(k, planRing, 2e3, 600);
-    draw(k, fLine, 600, 500);
-    placeHeadLine(k, headline, headLine);
-    respond(k, sheet, s, {
-      stack: ["Hero", "Wall head", "Wall row", "Results row", "Quote", "Footer columns", "Plan strip"],
-      restyle: { ...WEB_STEPS },
-      hide: { tablet: ["Hero arrow"], mobile: ["Nav links", "Hero arrow", "Close line"] },
-      gap: { tablet: 96, mobile: 72 },
-      tweak: (kit, id, size) => {
-        redots(kit, id, 32, 3);
-        const cw = CONTENT[size], narrow = size === "tablet" || size === "mobile";
-        const side = narrow ? cw : size === "laptop" ? 470 : 540;
-        for (const n of kit.named(id, "Copy")) kit.patch(n, narrow ? { layoutSizingHorizontal: "FILL" } : { width: side });
-        const hz = HERO[size];
-        refitWindow(kit, id, "Hero window", hz.w, hz.h, 5);
-        refitBoard(kit, id, "Board", hz.w, hz.h - BAR, hz.geo, TIMING);
-        for (const win of kit.named(id, "Hero window")) for (const pid of kit.named(win, "Pen")) penKeys(kit, id, win, pid, hz.w, hz.h);
-        for (const t of kit.named(id, "Headline")) for (const l of kit.named(id, "Headline line")) placeHeadLine(kit, t, l, narrow ? cw : side);
-        const wallScale = size === "mobile" ? 0.72 : size === "laptop" ? 0.92 : 1;
-        reboard(kit, id, "Heap", wallScale);
-        reboard(kit, id, "Plan", wallScale);
-        if (narrow) for (const n of kit.named(id, "Wall row")) kit.patch(n, { counterAxisAlignItems: "CENTER", itemSpacing: 8 });
-        if (narrow) for (const n of kit.named(id, "Wall arrow")) kit.patch(n, { height: 230, layoutSizingVertical: "FIXED", primaryAxisAlignItems: "CENTER" });
-        if (narrow) for (const n of kit.named(id, "Wall arrow line")) kit.patch(n, { rotation: 90 });
-        if (narrow) for (const n of kit.named(id, "Wall arrow label")) kit.patch(n, { visible: false });
-        if (size === "mobile") {
-          for (const n of kit.named(id, "Window title")) kit.patch(n, { characters: "Week 41" });
-          for (const strip2 of kit.named(id, "Marquee")) kit.node(strip2).childIds.forEach((c, i, all) => {
-            keyWordmark(kit, c, i, all.length, 180, DURATION);
-            for (const t of kit.named(c, "Wordmark name")) kit.restyle(t, s("Ui 15"));
-          });
-          for (const bar of kit.named(id, "Nav")) for (const n of kit.named(bar, "Brand name")) kit.patch(n, { visible: true });
-        }
-        for (const n of kit.named(id, "Wall title")) kit.patch(n, narrow ? { layoutSizingHorizontal: "FILL" } : { width: size === "laptop" ? 520 : 560 });
-        const rSide = narrow ? cw : size === "laptop" ? 420 : 440;
-        for (const n of kit.named(id, "Results copy")) kit.patch(n, narrow ? { layoutSizingHorizontal: "FILL" } : { width: rSide });
-        const chW = narrow ? cw : cw - rSide - 40, chH = size === "mobile" ? 220 : CHART.h;
-        const q = chartPaths(chW, chH);
-        for (const n of kit.named(id, "Chart area")) kit.patch(n, { height: chH });
-        for (const n of kit.named(id, "Chart axes")) kit.patch(n, { width: chW, height: chH, paths: q.axes });
-        for (const n of kit.named(id, "Chart levels")) kit.patch(n, { width: chW, height: chH, paths: q.levels });
-        for (const n of kit.named(id, "Chart line")) kit.patch(n, { width: chW, height: chH, paths: [q.line] });
-        for (const n of kit.named(id, "Chart ring")) kit.patch(n, { x: q.end.x - 32, y: q.end.y - 32 });
-        for (const n of kit.named(id, "Chart note")) kit.patch(n, { x: Math.max(0, q.at5.x - 150) });
-        for (const n of kit.named(id, "Chart note arrow")) {
-          const a = arrow({ x: q.at5.x - 60, y: 34 }, { x: q.at5.x - 6, y: q.at5.y - 14 }, { bend: -0.3, seed: 45, head: 14 });
-          kit.patch(n, { x: a.x, y: a.y, width: a.w, height: a.h, paths: a.paths });
-        }
-        columns(kit, id, "Feature note", size === "mobile" ? 1 : size === "tablet" ? 2 : 4, 20, cw);
-        for (const n of kit.named(id, "Quote words")) kit.patch(n, { layoutSizingHorizontal: "FILL" });
-        if (size === "laptop") for (const n of kit.named(id, "Hero arrow")) kit.patch(n, { x: kit.node(n).x - 70 });
-        if (size === "tablet") compactNav(kit, id, ["Customers", "Sign in"], 22);
-        const pw = narrow ? cw : Math.floor((cw - 32) / 3);
-        kit.named(id, "Plan outline").forEach((n, i) => kit.patch(n, { width: pw, paths: wobblyBox(pw, 150, { seed: [4, 4, 8][i] * 7 }) }));
-      }
-    });
-    return k.finish();
-  }
-});
-function heroLoop(k, sheet, win, notes, g, p) {
-  tidyKeys(k, notes, g, TIMING);
-  for (const id of k.named(win, "Column line")) draw(k, id, TIDY + 400, 400, { out: UNTIDY - 300, outDuration: 300 });
-  for (const id of k.named(win, "Column head")) k.animate(id, "opacity", [{ t: 0, v: 0, ease: ease.hold }, { t: TIDY + 300, v: 0, ease: ease.linear }, { t: TIDY + 500, v: 1, ease: ease.hold }, { t: UNTIDY - 200, v: 1, ease: ease.linear }, { t: UNTIDY, v: 0 }]);
-  for (const id of k.named(win, "Note meta")) k.animate(id, "opacity", [{ t: 0, v: 0, ease: ease.hold }, { t: TIDY + 700, v: 0, ease: ease.linear }, { t: TIDY + 900, v: 1, ease: ease.hold }, { t: UNTIDY - 200, v: 1, ease: ease.linear }, { t: UNTIDY, v: 0 }]);
-  penKeys(k, sheet, win, p.arrow, HERO.desktop.w, HERO.desktop.h, p.ring);
-  void sheet;
-}
-function penKeys(k, root, win, penId, w, h, ringId) {
-  const ring = ringId ?? k.named(win, "Tap ring")[0];
-  const rest = { x: w - 70, y: h - 60 }, button = { x: w - 70, y: 34 };
-  k.patch(penId, { x: rest.x, y: rest.y });
-  if (ring) {
-    const r = k.node(ring);
-    k.patch(ring, { x: rest.x - r.width / 2, y: rest.y - r.height / 2 });
-  }
-  const p = { arrow: penId, ring };
-  const d = { dx: button.x - rest.x, dy: button.y - rest.y };
-  glide(k, p, [{ t: 0, dx: 0, dy: 0 }, { t: 500, dx: 0, dy: 0 }, { t: TAP - 100, ...d }, { t: TIDY + 300, ...d }, { t: TIDY + 1100, dx: 0, dy: 0 }]);
-  clicks(k, p, [TAP]);
-  void root;
-}
-function placeHeadLine(k, headline, lineId, width) {
-  const n = k.node(headline);
-  const lines = HEADLINE.split("\n");
-  const m = (str) => measureTextWidth(str, n.fontFamily, n.fontWeight, n.fontSize, n.fontStyle, n.letterSpacing ?? 0);
-  const lh = typeof n.lineHeight === "number" ? n.lineHeight : n.fontSize * 1.1;
-  const room = width ?? n.width;
-  if (m(lines[0]) > room || m(lines[1]) > room) {
-    k.patch(lineId, { visible: false });
-    return;
-  }
-  const x = m("sorted into "), wd = Math.round(m("a plan.") + 8);
-  k.patch(lineId, { visible: true, x: Math.round(x - 4), y: Math.round(2 * lh - n.fontSize * 0.12), width: wd, paths: underline(wd, 22, { seed: 12 }) });
-}
-function heapNotes(k, f) {
-  const spots = [
-    [30, 40, -9, "sticky"],
-    [120, 20, 7, "mint"],
-    [230, 50, -4, "peach"],
-    [320, 26, 11, "sticky"],
-    [60, 140, 6, "peach"],
-    [170, 120, -12, "sticky"],
-    [270, 150, 5, "mint"],
-    [350, 130, -7, "peach"],
-    [20, 220, -3, "mint"],
-    [140, 210, 9, "sticky"],
-    [250, 225, -8, "sticky"]
-  ];
-  spots.forEach(([x, y, r, c], i) => miniNote(k, f, { s: 76, color: c, x, y, rot: r, seed: 200 + i }));
-}
-function planNotes(k, f) {
-  const cols = [4, 4, 3];
-  cols.forEach((n, c) => {
-    const x = 18 + c * 142;
-    marker(k, f, 110, 12, underline(110, 12, { seed: 300 + c, flick: false }), { name: "Plan head", color: "primary", width: 5, absolute: { x, y: 14 } });
-    for (let r = 0; r < n; r++) miniNote(k, f, { s: 60, color: ["sticky", "mint", "peach"][(c + r) % 3], x: x + r % 2 * 66, y: 44 + Math.floor(r / 2) * 70, seed: 400 + c * 10 + r, name: "Plan note" });
-  });
-}
-function chartPaths(w, h) {
-  const lo = 30, hi = 95;
-  const pt = (i, v) => ({ x: Math.round(24 + i / (WEEKS.length - 1) * (w - 64)), y: Math.round(h - 16 - (v - lo) / (hi - lo) * (h - 40)) });
-  const pts = WEEKS.map((v, i) => pt(i, v));
-  const axes = [
-    ...underline(w, 16, { seed: 61, flick: false }).map((p) => ({ ...p, points: p.points.map((q) => ({ ...q, y: q.y + h - 16, ...q.handleIn ? { handleIn: { x: q.handleIn.x, y: q.handleIn.y + h - 16 } } : {}, ...q.handleOut ? { handleOut: { x: q.handleOut.x, y: q.handleOut.y + h - 16 } } : {} })) })),
-    { closed: false, points: [{ x: 8, y: 6 }, { x: 10, y: h - 8 }] }
-  ];
-  const levels = [50, 70, 90].map((v) => ({ closed: false, points: [{ x: 18, y: pt(0, v).y }, { x: w - 20, y: pt(0, v).y + 2 }] }));
-  const line = { closed: false, points: pts.map((q, i) => {
-    const a = pts[Math.max(0, i - 1)], c = pts[Math.min(pts.length - 1, i + 1)], tx = (c.x - a.x) * 0.18, ty = (c.y - a.y) * 0.18;
-    return { ...q, handleIn: { x: q.x - tx, y: q.y - ty }, handleOut: { x: q.x + tx, y: q.y + ty } };
-  }) };
-  return { axes, levels, line, end: pts[pts.length - 1], at5: pts[5] };
-}
-function doodleDots() {
-  const ring = (cx, cy) => scribbleCircle(12, 12, { seed: cx, turns: 1.4, inset: 1 }).map((p) => ({ ...p, points: p.points.map((q) => ({ ...q, x: q.x + cx, y: q.y + cy, ...q.handleIn ? { handleIn: { x: q.handleIn.x + cx, y: q.handleIn.y + cy } } : {}, ...q.handleOut ? { handleOut: { x: q.handleOut.x + cx, y: q.handleOut.y + cy } } : {} })) }));
-  return [...ring(2, 22), ...ring(14, 6), ...ring(26, 22)];
-}
-function doodleTimeline() {
-  return boxPaths([{ closed: false, points: [{ x: 2, y: 22 }, { x: 38, y: 20 }] }, ...[8, 20, 32].map((x) => ({ closed: false, points: [{ x, y: 12 }, { x: x + 1, y: 30 }] }))]).paths;
-}
-
-export {
-  style_sketch_landing_default
-};

package/dist/chunks/chunk-W34UY22G.js

@@ -1,113 +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 {
-  SALE,
-  lift,
-  liveBadge,
-  liveBrand,
-  nightPill,
-  pinned,
-  reactions,
-  room
-} from "./chunk-OFCFZHWA.js";
-import {
-  MONO
-} from "./chunk-PFCHOCEN.js";
-import {
-  pill
-} 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/singles-day-link-preview.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-var ROOM = {
-  w: 1200,
-  h: 630,
-  u: 0.8,
-  cx: 884,
-  headY: 300,
-  deskY: 520,
-  bunting: -30,
-  ring: { x: 884, y: 288, r: 172 },
-  balloons: { x: 620, y: 96, h: 176 },
-  parcels: [{ x: 1050, w: 170, h: 130, label: true }, { x: 1080, w: 110, h: 76, on: 130 }, { x: 610, w: 120, h: 96 }]
-};
-var singles_day_link_preview_default = defineTemplate({
-  id: "social-singles-day-link-preview",
-  meta: {
-    name: "Singles Day live sale link preview",
-    description: "A 1200 \xD7 630 link preview for an 11.11 SaaS sale, as a frame of a live-shopping stream: the solo founder in a party hat under a ring light holding up an 11, foil balloons and the day\u2019s parcels behind, and over it a LIVE badge, the viewer count, \u201CParty of one? Month one is $11.\u201D on the title bar and the pinned deal with its old price struck and its \u201Cselling fast\u201D bar part-way down",
-    category: "social",
-    tags: ["singles day", "11.11", "double eleven", "flash sale", "live shopping", "link preview", "open graph", "og image", "solo founder", "saas", "seasonal"],
-    platforms: ["web", "x", "linkedin", "facebook"],
-    formats: ["og-image"],
-    useCases: ["sale", "pricing", "announcement"],
-    created: "2026-10-02",
-    updated: "2026-10-02"
-  },
-  stableNumbers: true,
-  build() {
-    const k = new Kit("Singles Day live sale link preview", preset("og-image"));
-    k.quantizeGeometry = true;
-    liveBrand(k, { tagline: "Party of one? Month one is $11." }, ["primary", "onPrimary", "accent", "onAccent", "card", "onCard", "cardMuted"]);
-    k.textStyle("Live 20", { ...MONO, size: 20, fontWeight: 800, letterSpacing: 1.8, lineHeight: 26 });
-    k.textStyle("Watching 18", { ...MONO, size: 18, fontWeight: 700, lineHeight: 26 });
-    k.textStyle("Eyebrow 17", { ...MONO, size: 17, fontWeight: 700, letterSpacing: 1.4, lineHeight: 22 });
-    k.textStyle("Display 58", { size: 58, fontWeight: 900, letterSpacing: -2.4, lineHeight: 60 });
-    k.textStyle("Lot 16", { ...MONO, size: 16, fontWeight: 700, letterSpacing: 0.8, lineHeight: 20 });
-    k.textStyle("Title 22", { size: 22, fontWeight: 800, letterSpacing: -0.4, lineHeight: 28 });
-    k.textStyle("Price 68", { size: 68, fontWeight: 900, letterSpacing: -3.2, lineHeight: 66 });
-    k.textStyle("Was 30", { size: 30, fontWeight: 700, letterSpacing: -0.8, lineHeight: 36 });
-    k.textStyle("Chip 18", { ...MONO, size: 18, fontWeight: 800, lineHeight: 24 });
-    k.textStyle("Stock 16", { ...MONO, size: 16, fontWeight: 800, letterSpacing: 0.4, lineHeight: 22 });
-    pill(k, "Chip", { fill: "accent", ink: "onAccent", style: "Chip 18", label: `\u2212${SALE.off}%`, pad: [4, 10], radius: 8 });
-    const sheet = k.sheet;
-    k.flowSheet(sheet, 16, { top: 46, right: 580, bottom: 40, left: 56 }, "primary", "SPACE_BETWEEN", "MIN");
-    k.patch(sheet, { clipsContent: true });
-    room(k, sheet, ROOM);
-    reactions(k, sheet, { w: 84, h: 330, n: 8, u: 0.8, absolute: { x: 1104, y: 120 } });
-    const top = k.stack(sheet, { gap: 14, name: "Top" });
-    const bar = k.stack(top, { direction: "HORIZONTAL", gap: 10, align: "CENTER", name: "Stream bar" });
-    liveBadge(k, bar, { style: "Live 20", dot: 13, pad: [7, 16] });
-    nightPill(k, bar, "1,111 watching", { style: "Watching 18", name: "Watching", pad: [7, 16] });
-    const banner = k.stack(top, { fill: "night", radius: 24, gap: 8, padding: { top: 20, right: 26, bottom: 24, left: 26 }, effects: lift(k, 0.8, 0.45), name: "Banner" });
-    k.text(banner, "SINGLES\u2019 DAY \xB7 11.11 \xB7 {{brand.name}} LIVE", { style: "Eyebrow 17", color: "nightMuted", name: "Eyebrow" });
-    k.text(banner, "{{brand.tagline}}", { style: "Display 58", color: "nightInk", name: "Headline" });
-    pinned(k, sheet, {
-      lot: `PINNED \xB7 LOT 01 \xB7 ${SALE.link}`,
-      title: "Solo, first month",
-      price: `$${SALE.now}`,
-      was: `$${SALE.was}`,
-      chip: "Chip",
-      saving: `\u2212${SALE.off}%`,
-      left: SALE.left,
-      total: SALE.seats,
-      suffix: ` of ${SALE.seats} seats left`,
-      styles: { lot: "Lot 16", title: "Title 22", price: "Price 68", was: "Was 30", stock: "Stock 16" },
-      pad: { top: 16, right: 22, bottom: 20, left: 22 },
-      gap: 8,
-      radius: 24,
-      bar: 16,
-      shadow: 0.8,
-      priceGap: 14
-    });
-    return k.finish();
-  }
-});
-
-export {
-  singles_day_link_preview_default
-};