@popcraft/kit 0.26.1 → 0.28.0

package/dist/chunks/chunk-3LVNM5W5.js

@@ -0,0 +1,95 @@
+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 {
+  KITTY,
+  blink,
+  coin,
+  jar,
+  lockup,
+  mochi,
+  pastelBrand,
+  pastelButton,
+  pillowCard,
+  softGround,
+  ts,
+  wave
+} from "./chunk-R43R37VW.js";
+import {
+  EMAIL_FPS,
+  HEADER
+} from "./chunk-LU2IMHZ2.js";
+import {
+  hz
+} from "./chunk-API2DUG7.js";
+import {
+  defineTemplate
+} from "./chunk-WBZ6O2YF.js";
+import {
+  Kit
+} from "./chunk-MTD3UAQT.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/email/style-pastel-header.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var NAME = "Pastel SaaS email header";
+var DURATION = 6e3;
+var cues = [
+  { layer: "Open button", preset: "pulse", at: 2400, params: { duration: 600, amount: 0.05 } }
+];
+var style_pastel_header_default = defineTemplate({
+  id: "email-saas-style-pastel-header",
+  meta: {
+    name: `${NAME} (animated GIF)`,
+    description: "A 600 \xD7 300 animated header for a product-news email in the pastel soft UI look: the sender, the news, the button, a savings jar and a round cat mascot are all on the first frame (for Outlook), then the jar\u2019s liquid rolls, a coin bobs, the mascot blinks and waves and the button nudges, all returning to where they began. A seamless 6-second GIF",
+    category: "email",
+    tags: ["email", "gif", "animated", "header", "banner", "saas", "pastel", "soft ui", "playful", "mascot", "announcement", "feature", "newsletter", "fintech", "loop"],
+    platforms: ["email"],
+    formats: ["email", "banner"],
+    useCases: ["announcement", "newsletter", "changelog"],
+    created: "2026-10-02",
+    updated: "2026-10-02"
+  },
+  stableNumbers: true,
+  motion: { cues },
+  build() {
+    const k = new Kit(NAME, HEADER);
+    k.quantizeGeometry = true;
+    pastelBrand(k, { offer: "Spare change, now saved.", when: "Round-ups drop the change from every card payment into a jar you choose." });
+    pastelButton(k, "Button", { style: ts(k, "title", 14), label: "Turn on round-ups", pad: [10, 18], d: 0.5 });
+    const sheet = k.sheet;
+    k.flowSheet(sheet, 0, { top: 0, right: 24, bottom: 0, left: 30 }, "paper", "CENTER", "MIN");
+    k.patch(sheet, { clipsContent: true });
+    k.timeline(sheet, { duration: DURATION, fps: EMAIL_FPS });
+    softGround(k, sheet, 600, 300, { loop: DURATION, seed: 29, sparkles: 5, scale: 0.35 });
+    for (const n of k.named(sheet, "Blob 1")) k.patch(n, { x: -140, y: -160 });
+    const main = k.stack(sheet, { direction: "HORIZONTAL", gap: 18, align: "CENTER", name: "Main" });
+    const copy = k.stack(main, { gap: 10, name: "Copy" });
+    lockup(k, copy, { size: 16, style: ts(k, "title", 16), name: "Lockup" });
+    k.text(copy, "{{brand.offer}}", { style: ts(k, "display", 38), color: "text", name: "Offer" });
+    k.text(copy, "{{brand.when}}", { style: ts(k, "body", 14), color: "onPaper", name: "When" });
+    k.instance(copy, "Button", { Label: "Turn on round-ups" }, { name: "Open button" });
+    const art = k.stack(main, { width: 220, height: 260, name: "Art" });
+    const tag = pillowCard(k, art, { width: "HUG", gap: 0, padding: { top: 6, right: 12, bottom: 7, left: 12 }, radius: 16, depth: 0.4, align: "CENTER", name: "Jar tag", absolute: { x: 6, y: 196 } });
+    k.text(tag, `$${KITTY.jar.saved.toLocaleString("en-US")}`, { style: ts(k, "figure", 20), color: "onCard", autoWidth: true, name: "Jar figure" });
+    k.text(tag, "Lisbon in May", { style: ts(k, "soft", 12), color: "cardMuted", autoWidth: true, name: "Jar name" });
+    jar(k, art, { w: 100, h: 136, level: KITTY.jar.percent / 100, absolute: { x: 16, y: 54 }, loop: DURATION });
+    const c = coin(k, art, 34, { name: "Bob coin", absolute: { x: 48, y: 10 } });
+    k.behave(c, "translateY", [{ kind: "sine", amp: 6, freq: hz(2, DURATION) }]);
+    k.behave(c, "rotation", [{ kind: "sine", amp: 10, freq: hz(1, DURATION) }]);
+    const m = mochi(k, art, 104, { absolute: { x: 116, y: 140 } });
+    k.cues(sheet, cues);
+    blink(k, m, [1200, 4300]);
+    wave(k, m, 2600, 2);
+    return k.finish();
+  }
+});
+
+export {
+  style_pastel_header_default
+};

package/dist/chunks/chunk-3MKVAIUO.js

@@ -0,0 +1,163 @@
+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 {
+  MONTHLY,
+  MONTHS,
+  SPOOL,
+  areaPaint,
+  bloomAt,
+  body,
+  code,
+  deep,
+  display,
+  figure,
+  gradientBrand,
+  label,
+  lockup,
+  longShadow,
+  mesh,
+  monthlyArea,
+  monthlyLine,
+  orbitCam,
+  plateChip,
+  rimLight,
+  sitePill,
+  tilted,
+  ts,
+  videoFoot
+} from "./chunk-BWK7XM43.js";
+import {
+  drawOn
+} from "./chunk-API2DUG7.js";
+import {
+  presetSafeRect
+} from "./chunk-GUR6XRHF.js";
+import {
+  defineTemplate
+} from "./chunk-WBZ6O2YF.js";
+import {
+  Kit,
+  preset
+} from "./chunk-MTD3UAQT.js";
+import {
+  ease
+} from "./chunk-37IU3FCE.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/social/style-gradient-milestone.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var NAME = "Gradient SaaS milestone post";
+var DURATION = 8e3;
+var COUNT = 400;
+var LAND = 3400;
+var P = { w: 860, h: 560 };
+var CH = { w: 760, h: 300 };
+var cues = [
+  { layer: "Figure wrap", preset: "blur-in", at: 0, params: { duration: 800, amount: 24 } },
+  { layer: "Thanks", preset: "words-in", at: LAND, params: { duration: 900 } },
+  { layer: "Chart area", preset: "fade-in", at: LAND - 1400, params: { duration: 1800 } },
+  { layer: "Peak", preset: "pop-in", at: LAND, params: { duration: 500 } },
+  { layer: "Site chip", preset: "pulse", at: 5600, params: { duration: 1400, amount: 0.04 } }
+];
+var counts = [{ layer: "Total", at: COUNT, duration: LAND - COUNT, ease: ease.out("cubic"), counter: { from: SPOOL.before10m, to: SPOOL.total } }];
+var LAYS = {
+  "ig-post": { x: 72, w: 936, brandY: 64, figY: 150, fig: "Figure 156", thanks: "Thanks 30", scene: { x: 120, y: 470, w: 960, h: 600 }, scale: 0.86, mesh: { x: 100, y: 520, w: 1e3, h: 580 }, footY: 980 },
+  "ig-portrait": { x: 72, w: 936, brandY: 72, figY: 170, fig: "Figure 156", thanks: "Thanks 32", scene: { x: 60, y: 560, w: 1020, h: 700 }, scale: 0.98, mesh: { x: 0, y: 620, w: 1080, h: 730 }, footY: 1240 },
+  "ig-story": { x: 140, w: 800, brandY: 260, figY: 370, fig: "Figure 150", thanks: "Thanks 32", scene: { x: 0, y: 610, w: 1080, h: 760 }, scale: 1.04, mesh: { x: -120, y: 760, w: 1320, h: 1160 }, footY: 1376 }
+};
+var style_gradient_milestone_default = defineTemplate({
+  id: "social-saas-style-gradient-milestone",
+  meta: {
+    name: NAME,
+    description: "An eight-second milestone post in the gradient and depth look for a video rendering API: ten million videos counting up on a deep ocean ground while the year's monthly renders draw themselves on a plate tilted in 3D space over a warm coral-to-lagoon mesh. The mesh blooms as the count lands, the last month lights, light crosses the plate and the camera keeps swinging round it. Square with 4:5 and 9:16 cuts",
+    category: "social",
+    tags: ["social", "post", "milestone", "stats", "counter", "chart", "build in public", "saas", "gradient", "mesh gradient", "depth", "3d", "shader", "developer", "api", "video", "animation", "instagram", "linkedin"],
+    platforms: ["instagram", "linkedin", "x", "threads"],
+    formats: ["post", "portrait-post", "story"],
+    useCases: ["milestone", "stats", "announcement"],
+    created: "2026-10-02",
+    updated: "2026-10-02"
+  },
+  stableNumbers: true,
+  motion: { cues, counts },
+  build() {
+    const k = new Kit(NAME, preset("ig-post"));
+    k.quantizeGeometry = true;
+    gradientBrand(k);
+    ts(k, "Brand 30", display(30));
+    ts(k, "Kicker 22", code(22));
+    ts(k, "Figure 156", figure(156, 800));
+    ts(k, "Figure 150", figure(150, 800));
+    ts(k, "Thanks 30", body(30, 500));
+    ts(k, "Thanks 32", body(32, 500));
+    ts(k, "Plate label 20", label(20));
+    ts(k, "Plate big 34", display(34));
+    ts(k, "Axis 20", code(20));
+    ts(k, "Site 24", code(24));
+    sitePill(k, { style: "Site 24", pad: [16, 24] });
+    const sheets = ["ig-post", "ig-portrait", "ig-story"].map((id, i) => {
+      const sheet = i === 0 ? k.sheet : k.addSheet(preset(id));
+      lay(k, sheet, id);
+      return sheet;
+    });
+    k.setCover(sheets[0]);
+    return k.finish();
+  }
+});
+function chartPlate(k, rig) {
+  const plate = k.stack(rig, { width: P.w, height: P.h, fill: "plate", radius: 28, clip: true, padding: { top: 30, right: 50, bottom: 30, left: 50 }, gap: 22, name: "Chart plate", effects: rimLight(k), absolute: { x: 0, y: 0 } });
+  const head = k.stack(plate, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", align: "MAX", name: "Plate head" });
+  const l = k.stack(head, { width: "HUG", gap: 4, name: "Plate title" });
+  k.text(l, "VIDEOS RENDERED A MONTH", { style: "Plate label 20", color: "plateMuted", autoWidth: true, name: "Plate label" });
+  k.text(l, `${SPOOL.september} in September`, { style: "Plate big 34", color: "onPlate", autoWidth: true, name: "Plate figure" });
+  k.text(head, "2026", { style: "Axis 20", color: "plateMuted", autoWidth: true, name: "Plate year" });
+  const box = k.stack(plate, { width: CH.w, height: CH.h, name: "Chart box" });
+  for (const lv of [0.25, 0.5, 0.75, 1]) k.rect(box, CH.w, 1, k.tint("rim", 0.1), { name: "Chart level", absolute: { x: 0, y: Math.round(CH.h * (1 - lv)) } });
+  k.vector(box, CH.w, CH.h, [monthlyArea(CH.w, CH.h)], areaPaint(k), { name: "Chart area", absolute: { x: 0, y: 0 } });
+  const line = k.vector(box, CH.w, CH.h, [monthlyLine(CH.w, CH.h)], [], { name: "Chart line", absolute: { x: 0, y: 0 }, stroke: { color: "primary", width: 6, cap: "ROUND" } });
+  const py = CH.h - MONTHLY[MONTHLY.length - 1] / 2e3 * CH.h;
+  k.ellipse(box, 28, "primary", { name: "Peak", absolute: { x: CH.w - 14, y: Math.round(py - 14) }, effects: [longShadow(k, 0.5, 6, 18)] });
+  const axis = k.stack(plate, { direction: "HORIZONTAL", justify: "SPACE_BETWEEN", width: CH.w, name: "Axis" });
+  for (const m of MONTHS) k.text(axis, m, { style: "Axis 20", color: "plateMuted", autoWidth: true, name: "Axis label" });
+  return { plate, line };
+}
+function lay(k, sheet, id) {
+  const L = LAYS[id];
+  k.nameSheet(sheet, `Milestone \xB7 ${preset(id).name}`);
+  k.flowSheet(sheet, 0, 0, "night", "MIN", "MIN");
+  k.patch(sheet, { clipsContent: true });
+  k.timeline(sheet, { duration: DURATION, fps: 30 });
+  deep(k, sheet, { duration: DURATION });
+  const glow = mesh(k, sheet, { ...L.mesh, duration: DURATION, phase: 0.8 });
+  bloomAt(k, glow, LAND - 200, 700, 3e3);
+  const { width, height } = k.node(sheet);
+  const r = presetSafeRect(id, width, height);
+  let c;
+  const t = tilted(k, sheet, { ...L.scene, width: P.w, height: P.h, scale: L.scale, rotateY: -20, rotateX: 14, styles: {}, planes: false, sweeps: [LAND + 100], safe: r ? { x: Math.ceil(r.x), y: Math.ceil(r.y), w: Math.floor(r.width), h: Math.floor(r.height) } : void 0, make: (rig) => {
+    c = chartPlate(k, rig);
+    return c.plate;
+  } });
+  orbitCam(k, t.scene, { at: 0, until: DURATION, from: -10, to: 10, z0: 120, z1: -40 });
+  drawOn(k, c.line, COUNT, LAND - COUNT);
+  const brandRow = k.stack(sheet, { direction: "HORIZONTAL", width: L.w, justify: "SPACE_BETWEEN", align: "CENTER", name: "Brand row", absolute: { x: L.x, y: L.brandY } });
+  lockup(k, brandRow, { size: 52, style: "Brand 30" });
+  plateChip(k, brandRow, "Milestone \xB7 Sept 2026", { style: "Kicker 22", name: "Kicker", dot: "primary" });
+  const words = k.stack(sheet, { width: L.w, gap: 14, name: "Words", absolute: { x: L.x, y: L.figY } });
+  const fw = k.stack(words, { width: L.w, name: "Figure wrap" });
+  k.text(fw, "10,000,000", { style: L.fig, color: "onNight", width: L.w, name: "Total" });
+  k.text(words, "videos rendered. Thank you to the 2,300 teams who sent them.", { style: L.thanks, color: "nightMuted", name: "Thanks" });
+  k.instance(sheet, "Site pill", {}, { name: "Site chip", absolute: { x: L.x, y: L.footY } });
+  if (id === "ig-story") videoFoot(k, sheet, L.footY + 110);
+  k.counts(sheet, counts);
+  k.cues(sheet, cues);
+}
+
+export {
+  style_gradient_milestone_default
+};

package/dist/chunks/chunk-3MPKI6AV.js

@@ -0,0 +1,103 @@
+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 {
+  festival_presale_folk_ads_default
+} from "./chunk-ROZF74YL.js";
+import {
+  festival_presale_jazz_ads_default
+} from "./chunk-GW6HJZVI.js";
+import {
+  festival_presale_electronic_ads_default
+} from "./chunk-VODMRVJ2.js";
+import {
+  festival_presale_jazz_countdown_default
+} from "./chunk-EOKX5ZAA.js";
+import {
+  festival_presale_jazz_lineup_default
+} from "./chunk-Y5XMMBAT.js";
+import {
+  festival_presale_jazz_reel_default
+} from "./chunk-LLAUFEJ2.js";
+import {
+  festival_presale_jazz_tier_default
+} from "./chunk-NPPBZLKV.js";
+import {
+  festival_presale_folk_countdown_default
+} from "./chunk-EBRLEQLX.js";
+import {
+  festival_presale_folk_lineup_default
+} from "./chunk-3ZLFSO5W.js";
+import {
+  festival_presale_folk_reel_default
+} from "./chunk-IGGMWNOE.js";
+import {
+  festival_presale_folk_tier_default
+} from "./chunk-YJM44O6J.js";
+import {
+  festival_presale_electronic_countdown_default
+} from "./chunk-VIZLCLW6.js";
+import {
+  festival_presale_electronic_lineup_default
+} from "./chunk-6DHLGDGF.js";
+import {
+  festival_presale_electronic_reel_default
+} from "./chunk-I37J5BFJ.js";
+import {
+  festival_presale_electronic_tier_default
+} from "./chunk-YKCKOAYX.js";
+import {
+  festival_presale_jazz_header_default
+} from "./chunk-N3NKWOAO.js";
+import {
+  festival_presale_electronic_header_default
+} from "./chunk-WSZEVKC4.js";
+import {
+  festival_presale_folk_header_default
+} from "./chunk-2EYT3ITU.js";
+import {
+  festival_presale_electronic_ticket_default
+} from "./chunk-NCHRPDBI.js";
+import {
+  festival_presale_folk_ticket_default
+} from "./chunk-Z7OQUTVR.js";
+import {
+  festival_presale_jazz_ticket_default
+} from "./chunk-RCXRHBXV.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/themes/festival-presale-family-a.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var pack = [
+  festival_presale_electronic_reel_default,
+  festival_presale_electronic_lineup_default,
+  festival_presale_electronic_countdown_default,
+  festival_presale_electronic_tier_default,
+  festival_presale_electronic_header_default,
+  festival_presale_electronic_ads_default,
+  festival_presale_electronic_ticket_default,
+  festival_presale_folk_reel_default,
+  festival_presale_folk_lineup_default,
+  festival_presale_folk_countdown_default,
+  festival_presale_folk_tier_default,
+  festival_presale_folk_header_default,
+  festival_presale_folk_ads_default,
+  festival_presale_folk_ticket_default,
+  festival_presale_jazz_reel_default,
+  festival_presale_jazz_lineup_default,
+  festival_presale_jazz_countdown_default,
+  festival_presale_jazz_tier_default,
+  festival_presale_jazz_header_default,
+  festival_presale_jazz_ads_default,
+  festival_presale_jazz_ticket_default
+];
+var festival_presale_family_a_default = pack;
+
+export {
+  festival_presale_family_a_default
+};

package/dist/chunks/chunk-3NG7VCLV.js

@@ -0,0 +1,33 @@
+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 {
+  lunar_new_year_landing_default
+} from "./chunk-LXMFPWZL.js";
+import {
+  lunar_new_year_greeting_post_default
+} from "./chunk-EJSUNHTY.js";
+import {
+  lunar_new_year_link_preview_default
+} from "./chunk-5OIUSDRS.js";
+import {
+  lunar_new_year_envelope_reel_default
+} from "./chunk-RJKVDAMS.js";
+import {
+  lunar_new_year_header_default
+} from "./chunk-7JS3643N.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/themes/lunar-new-year.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var pack = [lunar_new_year_envelope_reel_default, lunar_new_year_landing_default, lunar_new_year_greeting_post_default, lunar_new_year_header_default, lunar_new_year_link_preview_default];
+var lunar_new_year_default = pack;
+
+export {
+  lunar_new_year_default
+};

package/dist/chunks/chunk-3OBWHBPC.js

@@ -0,0 +1,265 @@
+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 {
+  defineTemplate
+} from "./chunk-WBZ6O2YF.js";
+import {
+  Kit,
+  preset
+} from "./chunk-MTD3UAQT.js";
+import {
+  ease
+} from "./chunk-37IU3FCE.js";
+import {
+  init_define_POPCRAFT_COMPONENT_IDS
+} from "./chunk-6VMOKHMF.js";
+
+// templates/src/lottie/lottie-kit.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var SECTORS = {
+  ai: "AI",
+  fintech: "Fintech",
+  health: "Health",
+  commerce: "E-commerce",
+  saas: "SaaS",
+  education: "Education",
+  travel: "Travel",
+  food: "Food delivery",
+  realestate: "Real estate",
+  security: "Security",
+  climate: "Climate",
+  techniques: "Techniques"
+};
+var SIZES = { icon: "lottie-icon", button: "lottie-button", spot: "lottie-spot", hero: "lottie-hero" };
+var ROLES = {
+  hero: "Hero loop",
+  icon: "Animated icon",
+  loader: "Loader",
+  "empty-state": "Empty state",
+  success: "Success state",
+  error: "Error state",
+  onboarding: "Onboarding illustration",
+  explainer: "Feature explainer",
+  stat: "Chart animation",
+  "micro-interaction": "Micro-interaction"
+};
+var E = {
+  /** Fast, then settling: an entrance. */
+  out: ease.bezier(0.22, 1, 0.36, 1),
+  /** Slow, then fast: an exit. */
+  in: ease.bezier(0.55, 0, 1, 0.45),
+  /** Both ends soft: a breath, a sway, a travel between two rests. */
+  inOut: ease.bezier(0.65, 0, 0.35, 1),
+  /** Overshoots and settles back: a pop. */
+  pop: ease.bezier(0.34, 1.56, 0.64, 1),
+  linear: ease.linear,
+  hold: ease.hold
+};
+var lottieId = (s) => `motion-lottie-${s.sector}-${s.slug}`;
+function lottieTemplate(s) {
+  const src = defineTemplate({
+    id: lottieId(s),
+    meta: {
+      name: s.name,
+      description: s.description,
+      category: "animation",
+      tags: ["lottie", s.sector === "ai" ? "ai" : SECTORS[s.sector].toLowerCase(), s.role, ...s.loop ? ["loop"] : [], ...s.tags ?? []],
+      platforms: ["web", "ios", "android"],
+      formats: [],
+      useCases: s.useCases ?? [],
+      created: "2026-09-29",
+      updated: "2026-09-29"
+    },
+    motion: { cues: [], loop: s.loop },
+    build() {
+      const k = new Kit(s.name, preset(SIZES[s.size]));
+      k.brand(s.colors);
+      const sheet = k.sheet;
+      k.patch(sheet, { name: s.name, fills: s.ground ? k.paint(s.ground) : [], clipsContent: true, layoutMode: "VERTICAL", layoutSizingHorizontal: "FIXED", layoutSizingVertical: "FIXED", padding: { top: 0, right: 0, bottom: 0, left: 0 }, itemSpacing: 0 });
+      k.timeline(sheet, { duration: s.duration, fps: s.fps ?? 30 });
+      s.build(new Lot(k, sheet, s.duration));
+      return k.finish();
+    }
+  });
+  return { ...src, lottie: s };
+}
+var Lot = class {
+  constructor(k, sheet, duration) {
+    this.k = k;
+    this.sheet = sheet;
+    this.duration = duration;
+  }
+  // ── Shapes ──
+  /** A plain frame (no layout) at a box, to group, clip or mask what goes in it; it turns and scales about its centre. */
+  box(parent, x, y, w, h, name, o = {}) {
+    return this.k.stack(parent, { name, width: w, height: h, absolute: { x, y }, clip: o.clip ?? false, ...o.fill ? { fill: o.fill } : {}, ...o.stroke ? { stroke: o.stroke } : {}, radius: o.radius ?? 0 });
+  }
+  rect(parent, x, y, w, h, fill, o = {}) {
+    return this.k.rect(parent, w, h, fill, { ...o, absolute: { x, y } });
+  }
+  /** A circle by its centre and radius. */
+  circle(parent, cx, cy, r, fill, o = {}) {
+    return this.k.ellipse(parent, r * 2, fill, { ...o, absolute: { x: cx - r, y: cy - r } });
+  }
+  /** A ring: a circle's outline, `width` wide, centred on radius `r`. */
+  ring(parent, cx, cy, r, color, width, o = {}) {
+    return this.k.ellipse(parent, r * 2, [], { ...o, stroke: { color, width }, absolute: { x: cx - r, y: cy - r } });
+  }
+  /** A filled shape through `pts` (sheet or parent px), with an optional outline. */
+  shape(parent, pts, fill, o = {}) {
+    return this.vector(parent, [{ pts, closed: o.closed ?? true }], fill, o);
+  }
+  /**
+   * A line through `pts`, stroked `width` wide with round caps and joins. A straight segment (two points) is a bar
+   * with round ends, turned along it: the canvas draws a vector's stroke with its fill, and a two-point path has none.
+   */
+  line(parent, pts, color, width, o = {}) {
+    const two = pts.map(point);
+    if (two.length === 2 && !o.closed && !two.some((q) => q.handleIn || q.handleOut)) {
+      const [a, b] = two;
+      const len = Math.hypot(b.x - a.x, b.y - a.y) + width;
+      const id = this.rect(parent, (a.x + b.x) / 2 - len / 2, (a.y + b.y) / 2 - width / 2, len, width, color, { ...o, radius: width / 2 });
+      this.k.patch(id, { rotation: Math.atan2(b.y - a.y, b.x - a.x) * 180 / Math.PI });
+      return id;
+    }
+    return this.vector(parent, [{ pts, closed: o.closed ?? false }], color, { ...o, strokeWidth: width });
+  }
+  /** Several contours in one layer (a glyph with a hole: even-odd is not needed, the packs cut nothing). */
+  vector(parent, contours, fill, o = {}) {
+    const all = contours.flatMap((c) => c.pts.flatMap((p) => {
+      const q = point(p);
+      return [q, ...q.handleIn ? [q.handleIn] : [], ...q.handleOut ? [q.handleOut] : []];
+    }));
+    const minX = Math.min(...all.map((p) => p.x)), minY = Math.min(...all.map((p) => p.y));
+    const maxX = Math.max(...all.map((p) => p.x)), maxY = Math.max(...all.map((p) => p.y));
+    const rel = (p) => ({ x: p.x - minX, y: p.y - minY });
+    const paths = contours.map((c) => ({
+      closed: c.closed,
+      points: c.pts.map((p) => {
+        const q = point(p);
+        return { ...rel(q), ...q.handleIn ? { handleIn: rel(q.handleIn) } : {}, ...q.handleOut ? { handleOut: rel(q.handleOut) } : {} };
+      })
+    }));
+    return this.k.vector(parent, Math.max(1, maxX - minX), Math.max(1, maxY - minY), paths, fill, { ...o, absolute: { x: minX, y: minY } });
+  }
+  // ── Motion ──
+  /** Key `path` on `id`. */
+  keys(id, path, ks) {
+    const once = ks.filter((key, i) => !ks.slice(i + 1).some((o) => Math.abs(o[0] - key[0]) < 1));
+    this.k.animate(id, path, once.map(([t, v, e], i) => ({ t, v, ...i < once.length - 1 ? { ease: e ?? E.inOut } : {} })));
+    return id;
+  }
+  /** Scale on both axes. */
+  scale(id, ks) {
+    this.keys(id, "scaleX", ks);
+    return this.keys(id, "scaleY", ks);
+  }
+  /** Turn `turns` whole turns over the timeline at an even rate (a loop that meets itself). */
+  spin(id, turns, from = 0) {
+    return this.keys(id, "rotation", [[0, from, E.linear], [this.duration, from + 360 * turns]]);
+  }
+  /** Where its turns and scales pivot, as a fraction of its box (0.5, 0.5 is the centre). */
+  pivot(id, ax, ay) {
+    this.k.patch(id, { anchorX: ax, anchorY: ay });
+    return id;
+  }
+  /** Hidden until `t`, then shown (an opacity hold): a layer that pops in later. */
+  opacity(id, ks) {
+    return this.keys(id, "opacity", ks);
+  }
+};
+var point = (p) => Array.isArray(p) ? { x: p[0], y: p[1] } : p;
+function around(cx, cy, r, n, start = 0, inner) {
+  const out = [];
+  const count = inner === void 0 ? n : n * 2;
+  for (let i = 0; i < count; i++) {
+    const a = (start + 360 * i / count) * Math.PI / 180;
+    const rr = inner !== void 0 && i % 2 ? inner : r;
+    out.push([cx + rr * Math.sin(a), cy - rr * Math.cos(a)]);
+  }
+  return out;
+}
+function sparkle(cx, cy, r) {
+  const k = r * 0.14;
+  const pinchOf = (q) => [{ x: cx + k, y: cy - k }, { x: cx + k, y: cy + k }, { x: cx - k, y: cy + k }, { x: cx - k, y: cy - k }][q];
+  const tips = [{ x: cx, y: cy - r }, { x: cx + r, y: cy }, { x: cx, y: cy + r }, { x: cx - r, y: cy }];
+  return tips.map((t, q) => ({ ...t, handleIn: pinchOf((q + 3) % 4), handleOut: pinchOf(q) }));
+}
+function heart(cx, y, w) {
+  const h = w * 0.9, s = w / 2;
+  return [
+    { x: cx, y: y + h * 0.28, handleIn: { x: cx - s * 0.1, y }, handleOut: { x: cx + s * 0.1, y } },
+    { x: cx + s, y: y + h * 0.3, handleIn: { x: cx + s, y: y - h * 0.02 }, handleOut: { x: cx + s, y: y + h * 0.55 } },
+    { x: cx, y: y + h, handleIn: { x: cx + s * 0.5, y: y + h * 0.75 }, handleOut: { x: cx - s * 0.5, y: y + h * 0.75 } },
+    { x: cx - s, y: y + h * 0.3, handleIn: { x: cx - s, y: y + h * 0.55 }, handleOut: { x: cx - s, y: y - h * 0.02 } }
+  ];
+}
+function pin(cx, tipY, w) {
+  const r = w / 2, top = tipY - w * 1.35, c = 0.5523 * r;
+  const cy = top + r;
+  return [
+    { x: cx, y: tipY, handleIn: { x: cx + r * 0.25, y: tipY - r * 0.35 }, handleOut: { x: cx - r * 0.25, y: tipY - r * 0.35 } },
+    { x: cx - r, y: cy, handleIn: { x: cx - r, y: cy + r * 0.8 }, handleOut: { x: cx - r, y: cy - c } },
+    { x: cx, y: top, handleIn: { x: cx - c, y: top }, handleOut: { x: cx + c, y: top } },
+    { x: cx + r, y: cy, handleIn: { x: cx + r, y: cy - c }, handleOut: { x: cx + r, y: cy + r * 0.8 } }
+  ];
+}
+function roundRect(x, y, w, h, r) {
+  const rr = Math.min(r, w / 2, h / 2), c = 0.5523 * rr;
+  return [
+    { x: x + rr, y, handleIn: { x: x + rr - c, y } },
+    { x: x + w - rr, y, handleOut: { x: x + w - rr + c, y } },
+    { x: x + w, y: y + rr, handleIn: { x: x + w, y: y + rr - c } },
+    { x: x + w, y: y + h - rr, handleOut: { x: x + w, y: y + h - rr + c } },
+    { x: x + w - rr, y: y + h, handleIn: { x: x + w - rr + c, y: y + h } },
+    { x: x + rr, y: y + h, handleOut: { x: x + rr - c, y: y + h } },
+    { x, y: y + h - rr, handleIn: { x, y: y + h - rr + c } },
+    { x, y: y + rr, handleOut: { x, y: y + rr - c } }
+  ];
+}
+function arc(cx, cy, r, a0, a1) {
+  const n = Math.max(1, Math.ceil(Math.abs(a1 - a0) / 90));
+  const step = (a1 - a0) / n;
+  const k = 4 / 3 * Math.tan(step * Math.PI / 720) * r;
+  const at = (deg) => {
+    const a = deg * Math.PI / 180;
+    return { x: cx + r * Math.sin(a), y: cy - r * Math.cos(a), tx: Math.cos(a), ty: Math.sin(a) };
+  };
+  return Array.from({ length: n + 1 }, (_, i) => {
+    const p = at(a0 + i * step);
+    return {
+      x: p.x,
+      y: p.y,
+      ...i > 0 ? { handleIn: { x: p.x - p.tx * k, y: p.y - p.ty * k } } : {},
+      ...i < n ? { handleOut: { x: p.x + p.tx * k, y: p.y + p.ty * k } } : {}
+    };
+  });
+}
+function cloud(l, parent, x, y, s, color = "white") {
+  const c = l.box(parent, x, y, 220 * s, 100 * s, "Cloud");
+  l.vector(c, [{ pts: roundRect(0, 50 * s, 220 * s, 50 * s, 25 * s), closed: true }], color, { name: "Cloud base" });
+  l.circle(c, 70 * s, 55 * s, 40 * s, color, { name: "Cloud puff" });
+  l.circle(c, 130 * s, 45 * s, 45 * s, color, { name: "Cloud puff" });
+  return c;
+}
+
+export {
+  SECTORS,
+  SIZES,
+  ROLES,
+  E,
+  lottieId,
+  lottieTemplate,
+  Lot,
+  around,
+  sparkle,
+  heart,
+  pin,
+  roundRect,
+  arc,
+  cloud
+};