@appinternalleads/ui 0.4.0 → 0.4.2

package/dist/esm/motion/paperfold/presets.js

@@ -0,0 +1,115 @@
+/* eslint-disable comppack/no-raw-colour -- preset colours are content, set through the same config as any edit (DECISIONS §25–§27). */
+import { applyPatch, defaultConfig } from './config';
+/**
+ * **Presets** — named patches over the neutral default config. Applying one is the same operation as
+ * any agent or person edit. The reference copy (the tixdoor launch) exists only here, in the
+ * `reference` patch, never in the implementation.
+ */
+const REFERENCE = {
+    'content.logo': 'tixdoor',
+    'logo.markText': 'T',
+    'content.top.headline': 'We are launching soon',
+    'content.middle.headline': 'Ready for a Better Way to Attend Events?',
+    'content.bottom.body': 'We\'re building the smarter way to discover, create, and attend events.',
+    'content.cta.text': 'Join Our Waitlist',
+    'background.backgroundTypography.text': 'LAUNCH',
+};
+const canvas = (aspectRatio, width, height) => ({ 'canvas.aspectRatio': aspectRatio, 'canvas.width': width, 'canvas.height': height });
+/** A second campaign on the same template: different words, palette, background word, hands, speed and CTA. */
+const DEMO = {
+    'content.logo': 'Northstar',
+    'logo.markText': 'N',
+    'logo.markColor': '#ffcc4d',
+    'logo.markColorEnd': '#ff9f1c',
+    'logo.markTextColor': '#10324a',
+    'content.top.headline': 'Your next idea starts here',
+    'content.middle.headline': 'Design. Build. Launch.',
+    'content.bottom.body': 'Everything you need to move from concept to product.',
+    'content.back.text': 'Northstar',
+    'content.back.panel': 'top',
+    'content.cta.text': 'Get Started',
+    'typography.topHeadline.color': '#10324a',
+    'typography.topHeadline.fontStyle': 'normal',
+    'typography.topHeadline.fontWeight': 800,
+    'typography.topHeadline.skew': 0,
+    'typography.topHeadline.fontFamily': 'Space Grotesk',
+    'typography.topHeadline.fontSize': 96,
+    'typography.middleHeadline.color': '#10324a',
+    'typography.middleHeadline.fontFamily': 'Space Grotesk',
+    'typography.middleHeadline.fontWeight': 700,
+    'typography.middleHeadline.fontSize': 92,
+    'typography.middleHeadline.maxWidth': 0.62,
+    'typography.bottomBody.color': '#2b4a60',
+    'typography.bottomBody.fontStyle': 'normal',
+    'typography.back.color': '#10324a',
+    'typography.back.fontFamily': 'Space Grotesk',
+    'typography.logo.fontFamily': 'Space Grotesk',
+    'typography.logo.fontWeight': 700,
+    'typography.cta.color': '#10324a',
+    'typography.cta.fontWeight': 700,
+    'foldLighting.ambient': 0.62,
+    'foldLighting.diffuse': 0.46,
+    'paperMaterial.baseColor': '#f3ede2',
+    'paperMaterial.backColor': '#e4d8c4',
+    'paperMaterial.secondaryColor': '#ece3d3',
+    'paperMaterial.textureOpacity': 0.12,
+    'paperMaterial.edgeShadow': 0.12,
+    'creases.0.color': '#9c8d74',
+    'creases.1.color': '#9c8d74',
+    'creases.0.highlightColor': '#ffffff',
+    'creases.1.highlightColor': '#ffffff',
+    'paper.shadow.color': '#04121c',
+    'paper.shadow.opacity': 0.45,
+    'background.baseColor': '#10324a',
+    'background.gradient.stops': [{ offset: 0, color: '#123a55' }, { offset: 1, color: '#0a2233' }],
+    'background.backgroundTypography.text': 'CREATE',
+    'background.backgroundTypography.color': '#174765',
+    'background.backgroundTypography.weight': 800,
+    'background.backgroundTypography.fontFamily': 'Space Grotesk',
+    'background.backgroundTypography.drift': 24,
+    'background.backgroundTypography.repeat': 2,
+    'background.glow.color': '#3fb6c9',
+    'background.glow.opacity': 0.22,
+    'hands.style.baseColor': '#d9976f',
+    'hands.style.midtoneColor': '#b9744c',
+    'hands.style.shadowColor': '#8a4f31',
+    'hands.style.highlightColor': '#eab08a',
+    'hands.style.nailColor': '#f5cdb7',
+    'hands.style.sleeve.enabled': true,
+    'hands.style.sleeve.color': '#2f6f8f',
+    'hands.top.x': 0.62,
+    'hands.bottom.x': 0.34,
+    'folds.0.peakAngle': 170,
+    'folds.0.durationFrames': 40,
+    'folds.0.unfoldDurationFrames': 36,
+    'folds.0.easing': 'easeInOutQuart',
+    'folds.1.peakAngle': 164,
+    'folds.1.durationFrames': 38,
+    'folds.1.unfoldDurationFrames': 34,
+    'folds.1.easing': 'easeInOutQuart',
+    'timeline.foldedHold.durationFrames': 48,
+    'cta.backgroundColor': '#ffcc4d',
+    'cta.borderColor': '#ffcc4d',
+    'cta.rotation': 3,
+    'cta.radius': 40,
+    'cta.shadowColor': '#04121c',
+    'cta.shadowOpacity': 0.35,
+};
+export const PRESET_PATCHES = {
+    reference: { description: 'The reference: a purple tixdoor launch sheet, Z-folded by two brown hands in front of a LAUNCH wall, 9:16 at 2160 × 3840, 60 fps.', patch: REFERENCE },
+    portrait: { description: '9:16, 2160 × 3840 (layout.portrait) — the reference shape.', patch: { ...REFERENCE, ...canvas('9:16', 2160, 3840) } },
+    landscape: { description: '16:9, 3840 × 2160 (layout.landscape): the sheet on the left, the logo and CTA on the right.', patch: { ...REFERENCE, ...canvas('16:9', 3840, 2160) } },
+    square: { description: '1:1, 2160 × 2160 (layout.square).', patch: { ...REFERENCE, ...canvas('1:1', 2160, 2160) } },
+    demo: { description: 'Northstar: a cream sheet on deep teal, CREATE drifting behind, lighter hands in sleeves, deeper and quicker folds, a yellow Get Started button.', patch: DEMO },
+};
+/** A preset as a complete, valid config. */
+export function presetConfig(name) {
+    const p = PRESET_PATCHES[name];
+    if (!p)
+        throw new Error(`Unknown paper-fold-promo preset "${name}". Available: ${Object.keys(PRESET_PATCHES).join(', ')}.`);
+    const r = applyPatch(defaultConfig(), { patch: p.patch });
+    if (!r.valid)
+        throw new Error(`Preset "${name}" is invalid: ${r.errors.map((e) => e.message).join(' ')}`);
+    return r.config;
+}
+//# sourceMappingURL=presets.js.map

package/dist/esm/motion/paperfold/presets.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"presets.js","sourceRoot":"","sources":["../../../../src/motion/paperfold/presets.ts"],"names":[],"mappings":"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"}

package/dist/esm/motion/paperfold/template.d.ts

@@ -0,0 +1,3 @@
+import type { ConfigurableMotionTemplate } from '../types';
+export declare const paperFoldPromo: ConfigurableMotionTemplate;
+//# sourceMappingURL=template.d.ts.map

package/dist/esm/motion/paperfold/template.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"template.d.ts","sourceRoot":"","sources":["../../../../src/motion/paperfold/template.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,0BAA0B,EAAE,MAAM,UAAU,CAAC;AAa3D,eAAO,MAAM,cAAc,EAAE,0BAwB5B,CAAC"}

package/dist/esm/motion/paperfold/template.js

@@ -0,0 +1,37 @@
+import { configJsonSchema } from './config';
+import { allControls, GROUPS } from './controls';
+import { outputDuration } from './engine';
+import { PRESET_PATCHES, presetConfig } from './presets';
+/**
+ * **paper-fold-promo in the motion registry.** A configurable-motion template (DECISIONS §25–§27) drawn
+ * procedurally by React/DOM — three perspective panels hinged at real creases, vector hands, live
+ * text — and rendered to video by Remotion. People and agents edit the same canonical config. Plain
+ * data — safe to JSON-serialise.
+ */
+const reference = presetConfig('reference');
+export const paperFoldPromo = {
+    id: 'paper-fold-promo',
+    version: '1.0.0',
+    kind: 'configurableMotion',
+    renderer: 'remotion',
+    title: 'Paper fold promo — a printed sheet folded and opened by two hands',
+    description: 'A vertical promotional sheet in three panels, held by two illustrated hands in front of a wall of large type. The top panel folds over along its crease in true perspective, then the bottom one; the paper holds folded, then unfolds back to the open sheet. Every word, colour, crease, fold angle, timing, easing, hand pose and light is configurable; 9:16, 16:9 and 1:1 each have their own layout.',
+    fps: 60,
+    formats: [
+        { id: 'portrait', aspectRatio: '9:16', width: 2160, height: 3840 },
+        { id: 'landscape', aspectRatio: '16:9', width: 3840, height: 2160 },
+        { id: 'square', aspectRatio: '1:1', width: 2160, height: 2160 },
+    ],
+    durationInFrames: outputDuration(reference),
+    groups: [...GROUPS],
+    controls: allControls(),
+    schema: configJsonSchema(),
+    presets: PRESET_PATCHES,
+    remotion: {
+        project: 'remotion-prototype',
+        compositions: ['PaperFoldPromoPortrait', 'PaperFoldPromoLandscape', 'PaperFoldPromoSquare'],
+        reference: 'remotion-prototype/content/paper-fold-promo/reference.json',
+    },
+    exampleContent: reference,
+};
+//# sourceMappingURL=template.js.map

package/dist/esm/motion/paperfold/template.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"template.js","sourceRoot":"","sources":["../../../../src/motion/paperfold/template.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAEzD;;;;;GAKG;AACH,MAAM,SAAS,GAAG,YAAY,CAAC,WAAW,CAAC,CAAC;AAC5C,MAAM,CAAC,MAAM,cAAc,GAA+B;IACxD,EAAE,EAAE,kBAAkB;IACtB,OAAO,EAAE,OAAO;IAChB,IAAI,EAAE,oBAAoB;IAC1B,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,mEAAmE;IAC1E,WAAW,EAAE,4YAA4Y;IACzZ,GAAG,EAAE,EAAE;IACP,OAAO,EAAE;QACP,EAAE,EAAE,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE;QAClE,EAAE,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE;QACnE,EAAE,EAAE,EAAE,QAAQ,EAAE,WAAW,EAAE,KAAK,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE;KAChE;IACD,gBAAgB,EAAE,cAAc,CAAC,SAAS,CAAC;IAC3C,MAAM,EAAE,CAAC,GAAG,MAAM,CAAC;IACnB,QAAQ,EAAE,WAAW,EAAE;IACvB,MAAM,EAAE,gBAAgB,EAAE;IAC1B,OAAO,EAAE,cAAc;IACvB,QAAQ,EAAE;QACR,OAAO,EAAE,oBAAoB;QAC7B,YAAY,EAAE,CAAC,wBAAwB,EAAE,yBAAyB,EAAE,sBAAsB,CAAC;QAC3F,SAAS,EAAE,4DAA4D;KACxE;IACD,cAAc,EAAE,SAAS;CAC1B,CAAC"}

package/dist/esm/motion/player.d.ts

@@ -0,0 +1,35 @@
+import type { MotionTemplate } from './types';
+import { type MotionContentError } from './validate';
+export declare class MotionContentValidationError extends Error {
+    readonly errors: MotionContentError[];
+    constructor(errors: MotionContentError[]);
+}
+export type MotionController = {
+    seek(frame: number): void;
+    play(): void;
+    pause(): void;
+    readonly frame: number;
+    readonly playing: boolean;
+    readonly fps: number;
+    readonly durationInFrames: number;
+    /** The canvas this content plays on (its format's size). */
+    readonly width: number;
+    readonly height: number;
+    /** Resolves once fonts are loaded and text has been fitted. Seek/play are safe before it. */
+    readonly ready: Promise<void>;
+    destroy(): void;
+};
+/**
+ * Add the template's font and style sheets to the document once. Resolves when the font faces are
+ * usable: text is measured for auto-fit, and a measurement taken in a fallback font would be wrong.
+ */
+export declare function installMotionStyles(template: MotionTemplate, doc?: Document): Promise<void>;
+export type MountOptions = {
+    loop?: boolean;
+    autoPlay?: boolean;
+    onFrame?: (frame: number) => void;
+    onEnd?: () => void;
+};
+/** Mount a template into `root` with validated content. Throws `MotionContentValidationError`. */
+export declare function mountMotion(root: HTMLElement, template: MotionTemplate, content: unknown, options?: MountOptions): MotionController;
+//# sourceMappingURL=player.d.ts.map

package/dist/esm/motion/player.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"player.d.ts","sourceRoot":"","sources":["../../../src/motion/player.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAAyB,KAAK,kBAAkB,EAAE,MAAM,YAAY,CAAC;AAE5E,qBAAa,4BAA6B,SAAQ,KAAK;IACzC,QAAQ,CAAC,MAAM,EAAE,kBAAkB,EAAE;gBAA5B,MAAM,EAAE,kBAAkB,EAAE;CAIlD;AAED,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,IAAI,IAAI,IAAI,CAAC;IACb,KAAK,IAAI,IAAI,CAAC;IACd,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,OAAO,EAAE,OAAO,CAAC;IAC1B,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,gBAAgB,EAAE,MAAM,CAAC;IAClC,4DAA4D;IAC5D,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;IACvB,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;IACxB,6FAA6F;IAC7F,QAAQ,CAAC,KAAK,EAAE,OAAO,CAAC,IAAI,CAAC,CAAC;IAC9B,OAAO,IAAI,IAAI,CAAC;CACjB,CAAC;AAKF;;;GAGG;AACH,wBAAgB,mBAAmB,CAAC,QAAQ,EAAE,cAAc,EAAE,GAAG,GAAE,QAAmB,GAAG,OAAO,CAAC,IAAI,CAAC,CA4BrG;AAED,MAAM,MAAM,YAAY,GAAG;IAAE,IAAI,CAAC,EAAE,OAAO,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAAC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,CAAC;AAmCzH,kGAAkG;AAClG,wBAAgB,WAAW,CAAC,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,cAAc,EAAE,OAAO,EAAE,OAAO,EAAE,OAAO,GAAE,YAAiB,GAAG,gBAAgB,CAgGvI"}

package/dist/esm/motion/player.js

@@ -0,0 +1,197 @@
+/**
+ * **The HTML runtime** — plays a motion template in any web page.
+ *
+ *   content JSON → validate against the template's schema → template markup → bind [data-content]
+ *   → apply theme → fit text → animate [data-target] from the motion contract
+ *
+ * It knows nothing about any particular template. Content is written with `textContent` only, so text
+ * from an agent can never become markup; theme values are checked hex colours.
+ */
+import { fitScale } from './fit';
+import { createSampler, durationFor, formatFor, itemScene, sceneAt, themeVariables } from './sample';
+import { validateMotionContent } from './validate';
+export class MotionContentValidationError extends Error {
+    errors;
+    constructor(errors) {
+        super(`Invalid content:\n${errors.map((e) => `  - ${e.message}`).join('\n')}`);
+        this.errors = errors;
+        this.name = 'MotionContentValidationError';
+    }
+}
+const read = (content, path) => path.split('.').reduce((v, k) => (v && typeof v === 'object' ? v[k] : undefined), content);
+/**
+ * Add the template's font and style sheets to the document once. Resolves when the font faces are
+ * usable: text is measured for auto-fit, and a measurement taken in a fallback font would be wrong.
+ */
+export function installMotionStyles(template, doc = document) {
+    const loads = [];
+    for (const f of template.fonts) {
+        const key = `font:${f.family}`;
+        let link = doc.head.querySelector(`[data-motion-styles="${key}"]`);
+        if (!link) {
+            link = Object.assign(doc.createElement('link'), { rel: 'stylesheet', href: f.css });
+            link.dataset.motionStyles = key;
+            link.dataset.loaded = 'false';
+            link.addEventListener('load', () => (link.dataset.loaded = 'true'), { once: true });
+            doc.head.append(link);
+        }
+        if (link.dataset.loaded === 'false') {
+            const l = link;
+            loads.push(new Promise((r) => { l.addEventListener('load', r, { once: true }); l.addEventListener('error', r, { once: true }); }));
+        }
+    }
+    const key = `${template.id}@${template.version}`;
+    if (!doc.head.querySelector(`[data-motion-styles="${key}"]`)) {
+        const style = Object.assign(doc.createElement('style'), { textContent: template.styles });
+        style.dataset.motionStyles = key;
+        doc.head.append(style);
+    }
+    if (!doc.fonts)
+        return Promise.resolve();
+    return Promise.all(loads)
+        .then(() => Promise.all(template.fonts.flatMap((f) => f.weights.map((w) => doc.fonts.load(`${w} ${f.stretch ? `${f.stretch} ` : ''}16px "${f.family}"`)))))
+        .then(() => doc.fonts.ready)
+        .then(() => undefined, () => undefined);
+}
+/**
+ * A sequence template's markup holds ONE item scene, `[data-scene="<list>.$"]`. It is cloned once per
+ * item, in order: `$` in `data-scene` and `data-content` becomes the index, and each item choice is
+ * written as `data-<field>` (a validated enum value; unset choices get the schema default). Parts
+ * marked `data-when="<field>=<value>"` stay only in items with that choice.
+ */
+function expandSequence(canvas, template, content) {
+    const seq = template.motion.sequence;
+    const proto = canvas.querySelector(`[data-scene="${seq.path}.$"]`);
+    if (!proto)
+        return;
+    const items = read(content, seq.path) ?? [];
+    const defaults = Object.fromEntries((template.choices ?? []).map((c) => [c.field, c.default]));
+    const clones = items.map((item, i) => {
+        const el = proto.cloneNode(true);
+        el.dataset.scene = `${seq.path}.${i}`;
+        for (const field of Object.keys(seq.options)) {
+            const v = field === seq.motionField ? itemScene(template.motion, item) : item[field] ?? defaults[field];
+            if (v !== undefined)
+                el.setAttribute(`data-${field}`, String(v));
+        }
+        /* `data-when="field=value"` keeps a part only for items that chose that value (e.g. a layout). */
+        for (const part of Array.from(el.querySelectorAll('[data-when]'))) {
+            const [field, value] = part.dataset.when.split('=');
+            if (el.getAttribute(`data-${field}`) !== value)
+                part.remove();
+        }
+        for (const node of [el, ...Array.from(el.querySelectorAll('[data-content],[data-if]'))]) {
+            if (node.dataset.content)
+                node.dataset.content = node.dataset.content.replace(`${seq.path}.$.`, `${seq.path}.${i}.`);
+            if (node.dataset.if)
+                node.dataset.if = node.dataset.if.replace(`${seq.path}.$.`, `${seq.path}.${i}.`);
+        }
+        return el;
+    });
+    proto.replaceWith(...clones);
+}
+/** Mount a template into `root` with validated content. Throws `MotionContentValidationError`. */
+export function mountMotion(root, template, content, options = {}) {
+    const result = validateMotionContent(template.schema, content);
+    if (!result.valid)
+        throw new MotionContentValidationError(result.errors);
+    const stylesReady = installMotionStyles(template, root.ownerDocument);
+    root.innerHTML = template.template;
+    const canvas = root.firstElementChild;
+    const { motion } = template;
+    const format = formatFor(motion, content);
+    if (motion.formats)
+        canvas.dataset.format = format.id;
+    for (const [k, v] of Object.entries(themeVariables(content.theme)))
+        canvas.style.setProperty(k, v);
+    if (motion.sequence)
+        expandSequence(canvas, template, content);
+    /* An optional part whose content is absent is removed (`data-if` names the content path). */
+    for (const el of Array.from(root.querySelectorAll('[data-if]'))) {
+        const v = read(content, el.dataset.if);
+        if (v === undefined || v === null || v === '' || v === false)
+            el.remove();
+    }
+    for (const el of Array.from(root.querySelectorAll('[data-content]')))
+        el.textContent = String(read(content, el.dataset.content) ?? '');
+    const sample = createSampler(motion);
+    const durationInFrames = durationFor(motion, content);
+    const scenes = Array.from(root.querySelectorAll('[data-scene]'));
+    const targets = new Map(scenes.map((s) => [s.dataset.scene, Array.from(s.querySelectorAll('[data-target]'))]));
+    /* Fit widths may differ per format: `data-fit-<format id>` overrides `data-fit`. */
+    const fitKey = `fit${format.id.charAt(0).toUpperCase()}${format.id.slice(1)}`;
+    let current = 0;
+    let destroyed = false;
+    const seek = (frame) => {
+        const f = Math.max(0, Math.min(durationInFrames - 1, Math.floor(frame)));
+        current = f;
+        const at = sceneAt(motion, f, content);
+        for (const s of scenes)
+            s.style.display = s.dataset.scene === at?.id ? '' : 'none';
+        for (const el of (at && targets.get(at.id)) ?? []) {
+            el.removeAttribute('style');
+            Object.assign(el.style, sample(el.dataset.target, at.frame, at.scene));
+        }
+        options.onFrame?.(f);
+    };
+    /* Fit needs real layout: show every scene for the measurement, then put the frame back. */
+    const fit = () => {
+        if (destroyed)
+            return;
+        for (const s of scenes)
+            s.style.display = '';
+        const spans = Array.from(root.querySelectorAll('[data-fit]'));
+        for (const el of spans)
+            el.style.removeProperty('--fit');
+        const scales = spans.map((el) => fitScale(el.offsetWidth, Number(el.dataset[fitKey] ?? el.dataset.fit)));
+        spans.forEach((el, i) => scales[i] < 1 && el.style.setProperty('--fit', String(scales[i])));
+        seek(current);
+    };
+    let raf = 0;
+    let startedAt = 0;
+    const tick = (now) => {
+        const frame = Math.floor(((now - startedAt) / 1000) * motion.fps);
+        if (frame >= durationInFrames && !options.loop) {
+            seek(durationInFrames - 1);
+            raf = 0;
+            options.onEnd?.();
+            return;
+        }
+        seek(frame % durationInFrames);
+        raf = requestAnimationFrame(tick);
+    };
+    const play = () => {
+        if (raf || destroyed)
+            return;
+        if (current >= durationInFrames - 1)
+            current = 0;
+        startedAt = performance.now() - (current / motion.fps) * 1000;
+        raf = requestAnimationFrame(tick);
+    };
+    const pause = () => {
+        cancelAnimationFrame(raf);
+        raf = 0;
+    };
+    seek(0);
+    const ready = stylesReady.then(() => fit());
+    if (options.autoPlay)
+        void ready.then(play);
+    return {
+        seek,
+        play,
+        pause,
+        get frame() { return current; },
+        get playing() { return raf !== 0; },
+        fps: motion.fps,
+        durationInFrames,
+        width: format.width,
+        height: format.height,
+        ready,
+        destroy() {
+            destroyed = true;
+            pause();
+            root.innerHTML = '';
+        },
+    };
+}
+//# sourceMappingURL=player.js.map

package/dist/esm/motion/player.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"player.js","sourceRoot":"","sources":["../../../src/motion/player.ts"],"names":[],"mappings":"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"}

package/dist/esm/motion/promo/PromoFrame.d.ts

@@ -0,0 +1,31 @@
+import type { ComponentType, CSSProperties } from 'react';
+import { type PromoConfig } from './config';
+/**
+ * **The procedural renderer.** Draws one frame of promo-product-showcase from the engine's state:
+ * plain DOM (divs, CSS gradients and filters, one generated SVG turbulence for grain). No Remotion,
+ * no clock: the Remotion composition passes `useCurrentFrame()`, the web player a rAF clock, and both
+ * get the same pixels. Everything is laid out at the render size itself, so a 4K render is 4K
+ * vector drawing, never an enlarged raster.
+ *
+ * Copy is rendered as React text (escaped); images only from validated asset references.
+ */
+export type ImageProps = {
+    src: string;
+    style?: CSSProperties;
+    alt: string;
+};
+export type PromoFrameProps = {
+    /** A validated, complete config (resolveConfig). */
+    config: PromoConfig;
+    /** Motion frame (60 fps). */
+    frame: number;
+    width: number;
+    height: number;
+    /** Turns an asset reference into a URL: `static:x.png` → where the host serves it. Defaults to `/x.png`. */
+    resolveAsset?: (ref: string) => string;
+    /** The image element; Remotion passes its `Img` so renders wait for images to load. */
+    ImageComponent?: ComponentType<ImageProps>;
+};
+export declare const FONT_STACK: (family: string) => string;
+export declare function PromoFrame({ config, frame, width, height, resolveAsset, ImageComponent }: PromoFrameProps): import("react").JSX.Element;
+//# sourceMappingURL=PromoFrame.d.ts.map

package/dist/esm/motion/promo/PromoFrame.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PromoFrame.d.ts","sourceRoot":"","sources":["../../../../src/motion/promo/PromoFrame.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAa,MAAM,OAAO,CAAC;AACrE,OAAO,EAAW,KAAK,WAAW,EAAE,MAAM,UAAU,CAAC;AAIrD;;;;;;;;GAQG;AACH,MAAM,MAAM,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,aAAa,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAC7E,MAAM,MAAM,eAAe,GAAG;IAC5B,oDAAoD;IACpD,MAAM,EAAE,WAAW,CAAC;IACpB,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,4GAA4G;IAC5G,YAAY,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,MAAM,CAAC;IACvC,uFAAuF;IACvF,cAAc,CAAC,EAAE,aAAa,CAAC,UAAU,CAAC,CAAC;CAC5C,CAAC;AAIF,eAAO,MAAM,UAAU,GAAI,QAAQ,MAAM,WAA6E,CAAC;AAQvH,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,YAA6B,EAAE,cAA6B,EAAE,EAAE,eAAe,+BAoCzI"}