@motionscript/audio 0.1.0-alpha.3 → 0.1.0-alpha.6

package/dist/waveform/full-waveform.d.ts

@@ -1,34 +1,5 @@
-import { Node2D, type AssetScope, type CommandArgs, type Fill, type Node2DProps, type RenderContext2D } from "@motionscript/sdk";
-import type { Seekable } from "@motionscript/sdk/component";
+import { type Fill, type FillResolved, type NodeOf, type Node2D as _Node2D, type Node2DProps as _Node2DProps } from "@motionscript/sdk";
 import { type AudioEnvelope } from "./envelope.js";
-import { type WaveformAlignment } from "./shared.js";
-export interface FullWaveformProps extends Node2DProps {
-    /** The baked recording. See {@link AudioEnvelope} for why it is baked. */
-    envelope: AudioEnvelope;
-    /** How many columns the whole file is drawn as. */
-    bars: number;
-    /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */
-    gap: number;
-    /** Corner radius of a bar, capped at half its width. */
-    radius: number;
-    /** How much of the file reads as played, `0`–`1`. Tweenable. */
-    progress: number;
-    /** Drive {@link progress} from the node's own clock instead of the prop. */
-    follow: boolean;
-    /** Multiplies every magnitude — a quiet track pulled up to fill its box. */
-    gain: number;
-    /** How much of the box a silent bar still occupies, `0`–`1`. */
-    floor: number;
-    align: WaveformAlignment;
-    /** Colour each voice's turns rather than splitting on played / not played. */
-    byVoice: boolean;
-    /** A colour per voice index. Short or empty falls back to the palette. */
-    voiceColors: string[];
-    /** The bars ahead of the playhead. */
-    fill: Fill;
-    /** …and the bars behind it. */
-    playedFill: Fill;
-}
 /**
  * A **waveform overview**: the whole recording's shape, drawn at once.
  *
@@ -40,7 +11,7 @@ export interface FullWaveformProps extends Node2DProps {
  *
  * ## Progress is authored, not assumed
  *
- * {@link follow} is off by default, and that default is the considered one. A
+ * `follow` is off by default, and that default is the considered one. A
  * scene has no idea where the recording it is drawing sits on the video's audio
  * lane — a clip is placed, trimmed and sped up out there, and none of that is
  * visible from in here. So the honest default is that the fill is *animation*:
@@ -52,53 +23,68 @@ export interface FullWaveformProps extends Node2DProps {
  *
  * ## Voices instead of progress
  *
- * With {@link byVoice} on, the played/ahead split is replaced by one colour per
- * speaking voice — the drawing the timeline's clip bars already make, at a size
- * you can read. For a two-hander it is a map of the conversation: who has the
+ * With `byVoice` on, the played/ahead split is replaced by one colour per
+ * speaking voice, at a size you can read. For a two-hander it is a map of the conversation: who has the
  * floor, where the turns are, how long each one ran. It replaces the progress
  * colours rather than combining with them, because a bar cannot mean two things
  * at once and "played, and also Grace" is a legend nobody can hold in their
  * head.
  */
-export declare class FullWaveform extends Node2D<FullWaveformProps> {
-    envelope: AudioEnvelope;
-    bars: number;
-    gap: number;
-    radius: number;
-    progress: number;
-    follow: boolean;
-    gain: number;
-    floor: number;
-    align: WaveformAlignment;
-    byVoice: boolean;
-    voiceColors: string[];
-    fill: Fill;
-    playedFill: Fill;
-    /**
-     * Fill the waveform in, left to right — the node's one command, since
-     * everything else about it is expressible as an ordinary `to`.
-     */
-    sweep(args: CommandArgs<Record<string, never>> & {
-        duration: number;
-    }): Seekable;
-    /**
-     * This node extends `Node2D` rather than `ShapeNode`, so nothing declares the
-     * paint props it carries — see {@link declarePaints}. `playedFill` is named
-     * past the conventional slots, so it is passed explicitly.
-     */
-    declareAssets(assets: AssetScope): void;
-    /** Where the fill has reached, from whichever source is in charge. */
-    private get played();
-    protected renderSelf(ctx: RenderContext2D): void;
-    /**
-     * The paint a group takes.
-     *
-     * A voice's colour is a **colour string**, never one of the node's two fill
-     * props, and that is deliberate: a voice is identified by hue, so a gradient
-     * or an image there would defeat the only thing the colour is for. It also
-     * means these paints declare no assets, which is why {@link declareAssets}
-     * only has to account for the two real fill props.
-     */
-    private paintFor;
-}
+export declare const FullWaveform: import("@motionscript/sdk").Component<"fullWaveform", import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    /** The baked recording. See {@link AudioEnvelope} for why it is baked. */
+    readonly envelope: import("@motionscript/sdk").Type<AudioEnvelope, AudioEnvelope, false>;
+    /** How many columns the whole file is drawn as. */
+    readonly bars: 120;
+    /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */
+    readonly gap: 0.3;
+    /** Corner radius of a bar, capped at half its width. */
+    readonly radius: 2;
+    /** How much of the file reads as played, `0`–`1`. Tweenable. */
+    readonly progress: 0;
+    /** Drive `progress` from the node's own clock instead of the prop. */
+    readonly follow: false;
+    /** Multiplies every magnitude — a quiet track pulled up to fill its box. */
+    readonly gain: 1;
+    /** How much of the box a silent bar still occupies, `0`–`1`. */
+    readonly floor: 0.015;
+    readonly align: import("@motionscript/sdk").Type<"center" | "bottom", "center" | "bottom", false>;
+    /** Colour each voice's turns rather than splitting on played / not played. */
+    readonly byVoice: false;
+    /** A colour per voice index. Short or empty falls back to the palette. */
+    readonly voiceColors: import("@motionscript/sdk").Type<string[], string[], false>;
+    /** The bars ahead of the playhead. */
+    readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
+    /** …and the bars behind it. */
+    readonly playedFill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
+}>, {
+    readonly sweep: unknown;
+}, null, _Node2D<_Node2DProps>, import("@motionscript/sdk").CallProps<import("@motionscript/sdk").Merge<import("@motionscript/sdk").Box2DState, {
+    /** The baked recording. See {@link AudioEnvelope} for why it is baked. */
+    readonly envelope: import("@motionscript/sdk").Type<AudioEnvelope, AudioEnvelope, false>;
+    /** How many columns the whole file is drawn as. */
+    readonly bars: 120;
+    /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */
+    readonly gap: 0.3;
+    /** Corner radius of a bar, capped at half its width. */
+    readonly radius: 2;
+    /** How much of the file reads as played, `0`–`1`. Tweenable. */
+    readonly progress: 0;
+    /** Drive `progress` from the node's own clock instead of the prop. */
+    readonly follow: false;
+    /** Multiplies every magnitude — a quiet track pulled up to fill its box. */
+    readonly gain: 1;
+    /** How much of the box a silent bar still occupies, `0`–`1`. */
+    readonly floor: 0.015;
+    readonly align: import("@motionscript/sdk").Type<"center" | "bottom", "center" | "bottom", false>;
+    /** Colour each voice's turns rather than splitting on played / not played. */
+    readonly byVoice: false;
+    /** A colour per voice index. Short or empty falls back to the palette. */
+    readonly voiceColors: import("@motionscript/sdk").Type<string[], string[], false>;
+    /** The bars ahead of the playhead. */
+    readonly fill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
+    /** …and the bars behind it. */
+    readonly playedFill: import("@motionscript/sdk").Type<Fill, FillResolved[], false>;
+}>, null>>;
+export type FullWaveform = NodeOf<typeof FullWaveform>;
+export type FullWaveformProps = NonNullable<Parameters<typeof FullWaveform>[0]>;
 //# sourceMappingURL=full-waveform.d.ts.map

package/dist/waveform/full-waveform.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"full-waveform.d.ts","sourceRoot":"","sources":["../../src/waveform/full-waveform.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,MAAM,EAMN,KAAK,UAAU,EACf,KAAK,WAAW,EAChB,KAAK,IAAI,EAET,KAAK,WAAW,EAChB,KAAK,eAAe,EACrB,MAAM,mBAAmB,CAAA;AAG1B,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAC3D,OAAO,EAAkC,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AAC/E,OAAO,EAML,KAAK,iBAAiB,EACvB,MAAM,UAAU,CAAA;AAEjB,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD,0EAA0E;IAC1E,QAAQ,EAAE,aAAa,CAAA;IACvB,mDAAmD;IACnD,IAAI,EAAE,MAAM,CAAA;IACZ,8EAA8E;IAC9E,GAAG,EAAE,MAAM,CAAA;IACX,wDAAwD;IACxD,MAAM,EAAE,MAAM,CAAA;IACd,gEAAgE;IAChE,QAAQ,EAAE,MAAM,CAAA;IAChB,4EAA4E;IAC5E,MAAM,EAAE,OAAO,CAAA;IACf,4EAA4E;IAC5E,IAAI,EAAE,MAAM,CAAA;IACZ,gEAAgE;IAChE,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,iBAAiB,CAAA;IACxB,8EAA8E;IAC9E,OAAO,EAAE,OAAO,CAAA;IAChB,0EAA0E;IAC1E,WAAW,EAAE,MAAM,EAAE,CAAA;IACrB,sCAAsC;IACtC,IAAI,EAAE,IAAI,CAAA;IACV,+BAA+B;IAC/B,UAAU,EAAE,IAAI,CAAA;CACjB;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BG;AACH,qBAea,YAAa,SAAQ,MAAM,CAAC,iBAAiB,CAAC;IACV,QAAQ,EAAE,aAAa,CAAA;IAClC,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,QAAQ,EAAE,MAAM,CAAA;IACZ,MAAM,EAAE,OAAO,CAAA;IACnB,IAAI,EAAE,MAAM,CAAA;IACR,KAAK,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,iBAAiB,CAAA;IAC3B,OAAO,EAAE,OAAO,CAAA;IACnB,WAAW,EAAE,MAAM,EAAE,CAAA;IAOhD,IAAI,EAAE,IAAI,CAAA;IAOV,UAAU,EAAE,IAAI,CAAA;IAExB;;;OAGG;IAEH,KAAK,CAAC,IAAI,EAAE,WAAW,CAAC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,GAAG;QAAE,QAAQ,EAAE,MAAM,CAAA;KAAE,GAAG,QAAQ;IAQhF;;;;OAIG;IACM,aAAa,CAAC,MAAM,EAAE,UAAU,GAAG,IAAI;IAKhD,sEAAsE;IACtE,OAAO,KAAK,MAAM,GAKjB;IAED,SAAS,CAAC,UAAU,CAAC,GAAG,EAAE,eAAe,GAAG,IAAI;IAyChD;;;;;;;;OAQG;IACH,OAAO,CAAC,QAAQ;CAQjB"}
+{"version":3,"file":"full-waveform.d.ts","sourceRoot":"","sources":["../../src/waveform/full-waveform.ts"],"names":[],"mappings":"AAAA,OAAO,EAKL,KAAK,IAAI,EACT,KAAK,YAAY,EACjB,KAAK,MAAM,EAGX,KAAK,MAAM,IAAI,OAAO,EACtB,KAAK,WAAW,IAAI,YAAY,EACjC,MAAM,mBAAmB,CAAA;AAE1B,OAAO,EAAkC,KAAK,aAAa,EAAE,MAAM,YAAY,CAAA;AAc/E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6BG;AACH,eAAO,MAAM,YAAY;IAGrB,0EAA0E;;IAE1E,mDAAmD;;IAEnD,8EAA8E;;IAE9E,wDAAwD;;IAExD,gEAAgE;;IAEhE,sEAAsE;;IAEtE,4EAA4E;;IAE5E,gEAAgE;;;IAGhE,8EAA8E;;IAE9E,0EAA0E;;IAE1E,sCAAsC;;IAEtC,+BAA+B;;;;;IAvB/B,0EAA0E;;IAE1E,mDAAmD;;IAEnD,8EAA8E;;IAE9E,wDAAwD;;IAExD,gEAAgE;;IAEhE,sEAAsE;;IAEtE,4EAA4E;;IAE5E,gEAAgE;;;IAGhE,8EAA8E;;IAE9E,0EAA0E;;IAE1E,sCAAsC;;IAEtC,+BAA+B;;UAwBjC,CAAA;AAEF,MAAM,MAAM,YAAY,GAAG,MAAM,CAAC,OAAO,YAAY,CAAC,CAAA;AACtD,MAAM,MAAM,iBAAiB,GAAG,WAAW,CAAC,UAAU,CAAC,OAAO,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA"}

package/dist/waveform/full-waveform.js

@@ -1,13 +1,8 @@
-var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
-    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-    return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-import { Node2D, node, command, easeInOut, fillOps, property, } from "@motionscript/sdk";
-import { declarePaints } from "@motionscript/sdk/component";
+import { Types, component2d, easeInOut, fillOps, } from "@motionscript/sdk";
 import { EMPTY_ENVELOPE, sampleEnvelope } from "./envelope.js";
 import { clamp01, groupByPaint, layOutBars, paintBars, voiceColor, } from "./shared.js";
+/** A paint entry as the waveforms declare theirs: resolved and tweened like a fill, its kind read off the default. */
+const paint = (initial) => Types.custom(initial, { resolve: fillOps.resolve, lerp: fillOps.lerp });
 /**
  * A **waveform overview**: the whole recording's shape, drawn at once.
  *
@@ -19,7 +14,7 @@ import { clamp01, groupByPaint, layOutBars, paintBars, voiceColor, } from "./sha
  *
  * ## Progress is authored, not assumed
  *
- * {@link follow} is off by default, and that default is the considered one. A
+ * `follow` is off by default, and that default is the considered one. A
  * scene has no idea where the recording it is drawing sits on the video's audio
  * lane — a clip is placed, trimmed and sped up out there, and none of that is
  * visible from in here. So the honest default is that the fill is *animation*:
@@ -31,163 +26,121 @@ import { clamp01, groupByPaint, layOutBars, paintBars, voiceColor, } from "./sha
  *
  * ## Voices instead of progress
  *
- * With {@link byVoice} on, the played/ahead split is replaced by one colour per
- * speaking voice — the drawing the timeline's clip bars already make, at a size
- * you can read. For a two-hander it is a map of the conversation: who has the
+ * With `byVoice` on, the played/ahead split is replaced by one colour per
+ * speaking voice, at a size you can read. For a two-hander it is a map of the conversation: who has the
  * floor, where the turns are, how long each one ran. It replaces the progress
  * colours rather than combining with them, because a bar cannot mean two things
  * at once and "played, and also Grace" is a legend nobody can hold in their
  * head.
  */
-let FullWaveform = class FullWaveform extends Node2D {
-    /**
-     * Fill the waveform in, left to right — the node's one command, since
-     * everything else about it is expressible as an ordinary `to`.
-     */
-    sweep(args) {
-        return this.to({
-            data: { progress: 1 },
-            duration: args.duration,
-            easing: args.easing ?? easeInOut(),
-        });
-    }
-    /**
-     * This node extends `Node2D` rather than `ShapeNode`, so nothing declares the
-     * paint props it carries — see {@link declarePaints}. `playedFill` is named
-     * past the conventional slots, so it is passed explicitly.
-     */
-    declareAssets(assets) {
-        super.declareAssets(assets);
-        declarePaints(this, assets, { fills: [this.playedFill] });
-    }
-    /** Where the fill has reached, from whichever source is in charge. */
-    get played() {
-        if (!this.follow)
-            return clamp01(this.progress);
-        const length = this.envelope.duration;
-        if (length <= 0)
-            return 0;
-        return clamp01(this.time.elapsed / length);
-    }
-    renderSelf(ctx) {
-        const rect = this.layoutBounds;
-        const width = rect?.width ?? 0;
-        const height = rect?.height ?? 0;
-        if (width <= 0 || height <= 0)
-            return;
-        const count = Math.max(1, Math.round(this.bars));
-        const sampled = sampleEnvelope(this.envelope, 0, this.envelope.duration, count);
-        const boxes = layOutBars(sampled, {
-            width,
-            height,
-            gap: this.gap,
-            align: this.align,
-            gain: this.gain,
-            floor: this.floor,
-        });
-        if (boxes.length === 0)
-            return;
-        // One draw per colour rather than per bar — see {@link paintBars}. The key
-        // is a string because it has to be comparable; the paint it stands for is
-        // resolved after the grouping.
-        const edge = this.played * boxes.length;
-        const groups = groupByPaint(boxes, (i) => this.byVoice
-            ? `voice:${sampled[i].speaker}`
-            : i < edge
-                ? "played"
-                : "ahead");
-        for (const [key, run] of groups) {
-            const graphics = paintBars(run, this.paintFor(key), this.radius);
-            if (graphics)
-                ctx.draw(graphics);
-        }
-    }
-    /**
-     * The paint a group takes.
-     *
-     * A voice's colour is a **colour string**, never one of the node's two fill
-     * props, and that is deliberate: a voice is identified by hue, so a gradient
-     * or an image there would defeat the only thing the colour is for. It also
-     * means these paints declare no assets, which is why {@link declareAssets}
-     * only has to account for the two real fill props.
-     */
-    paintFor(key) {
-        if (key === "played")
-            return this.playedFill;
-        if (key === "ahead")
-            return this.fill;
-        const voice = Number(key.slice("voice:".length));
-        if (!Number.isFinite(voice) || voice < 0)
-            return this.fill;
-        return this.voiceColors[voice] ?? voiceColor(voice);
-    }
-};
-__decorate([
-    property({ default: EMPTY_ENVELOPE })
-], FullWaveform.prototype, "envelope", void 0);
-__decorate([
-    property({ default: 120 })
-], FullWaveform.prototype, "bars", void 0);
-__decorate([
-    property({ default: 0.3 })
-], FullWaveform.prototype, "gap", void 0);
-__decorate([
-    property({ default: 2 })
-], FullWaveform.prototype, "radius", void 0);
-__decorate([
-    property({ default: 0 })
-], FullWaveform.prototype, "progress", void 0);
-__decorate([
-    property({ default: false })
-], FullWaveform.prototype, "follow", void 0);
-__decorate([
-    property({ default: 1 })
-], FullWaveform.prototype, "gain", void 0);
-__decorate([
-    property({ default: 0.015 })
-], FullWaveform.prototype, "floor", void 0);
-__decorate([
-    property({ default: "center" })
-], FullWaveform.prototype, "align", void 0);
-__decorate([
-    property({ default: false })
-], FullWaveform.prototype, "byVoice", void 0);
-__decorate([
-    property({ default: [] })
-], FullWaveform.prototype, "voiceColors", void 0);
-__decorate([
-    property({
-        default: "#5b5b7a",
-        mapper: fillOps.resolve,
-        tween: fillOps.lerp,
-    })
-], FullWaveform.prototype, "fill", void 0);
-__decorate([
-    property({
-        default: "#6366f1",
-        mapper: fillOps.resolve,
-        tween: fillOps.lerp,
-    })
-], FullWaveform.prototype, "playedFill", void 0);
-__decorate([
-    command()
-], FullWaveform.prototype, "sweep", null);
-FullWaveform = __decorate([
-    node({
-        key: "fullWaveform",
-        parentKey: "node",
-        forkable: true,
-        layout: {
-            children: "freeform",
-            defaultWidthMode: "fixed",
-            defaultHeightMode: "fixed",
-            acceptsChildren: true,
+export const FullWaveform = component2d({
+    key: "fullWaveform",
+    state: {
+        /** The baked recording. See {@link AudioEnvelope} for why it is baked. */
+        envelope: Types.custom(EMPTY_ENVELOPE),
+        /** How many columns the whole file is drawn as. */
+        bars: 120,
+        /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */
+        gap: 0.3,
+        /** Corner radius of a bar, capped at half its width. */
+        radius: 2,
+        /** How much of the file reads as played, `0`–`1`. Tweenable. */
+        progress: 0,
+        /** Drive `progress` from the node's own clock instead of the prop. */
+        follow: false,
+        /** Multiplies every magnitude — a quiet track pulled up to fill its box. */
+        gain: 1,
+        /** How much of the box a silent bar still occupies, `0`–`1`. */
+        floor: 0.015,
+        align: Types.custom("center"),
+        /** Colour each voice's turns rather than splitting on played / not played. */
+        byVoice: false,
+        /** A colour per voice index. Short or empty falls back to the palette. */
+        voiceColors: Types.custom([]),
+        /** The bars ahead of the playhead. */
+        fill: paint("#5b5b7a"),
+        /** …and the bars behind it. */
+        playedFill: paint("#6366f1"),
+    },
+    // Nothing declares a component's paints but itself: `fill` and `playedFill` both.
+    load: (loader, state) => {
+        loader.fill(state.fill);
+        loader.fill(state.playedFill);
+    },
+    commands: {
+        /**
+         * Fill the waveform in, left to right — the node's one command, since
+         * everything else about it is expressible as an ordinary `to`. Eased in-out
+         * unless it is given an easing of its own.
+         */
+        sweep: (timeline, state) => {
+            const ease = timeline.easing ? null : easeInOut();
+            const from = state.progress;
+            return timeline.animate((t) => ({ progress: from + (1 - from) * (ease ? ease(t) : t) }));
         },
-        seed: {
-            width: 900,
-            height: 160,
-        },
-    })
-], FullWaveform);
-export { FullWaveform };
+    },
+    render: (ctx, state) => {
+        drawBars(ctx, state);
+        ctx.children();
+    },
+});
+function drawBars(ctx, s) {
+    const { width, height } = ctx.size;
+    if (width <= 0 || height <= 0)
+        return;
+    const count = Math.max(1, Math.round(s.bars));
+    const sampled = sampleEnvelope(s.envelope, 0, s.envelope.duration, count);
+    const boxes = layOutBars(sampled, {
+        width,
+        height,
+        gap: s.gap,
+        align: s.align,
+        gain: s.gain,
+        floor: s.floor,
+    });
+    if (boxes.length === 0)
+        return;
+    // One draw per colour rather than per bar — see {@link paintBars}. The key
+    // is a string because it has to be comparable; the paint it stands for is
+    // resolved after the grouping.
+    const edge = played(ctx, s) * boxes.length;
+    const groups = groupByPaint(boxes, (i) => s.byVoice
+        ? `voice:${sampled[i].speaker}`
+        : i < edge
+            ? "played"
+            : "ahead");
+    for (const [key, run] of groups) {
+        const graphics = paintBars(run, paintFor(s, key), s.radius);
+        if (graphics)
+            ctx.draw(graphics);
+    }
+}
+/** Where the fill has reached, from whichever source is in charge. */
+function played(ctx, s) {
+    if (!s.follow)
+        return clamp01(s.progress);
+    const length = s.envelope.duration;
+    if (length <= 0)
+        return 0;
+    return clamp01(ctx.time.elapsed / length);
+}
+/**
+ * The paint a group takes.
+ *
+ * A voice's colour is a **colour string**, never one of the node's two fill
+ * props, and that is deliberate: a voice is identified by hue, so a gradient
+ * or an image there would defeat the only thing the colour is for. It also
+ * means these paints declare no assets, which is why `load` only has to account
+ * for the two real fill props.
+ */
+function paintFor(s, key) {
+    if (key === "played")
+        return s.playedFill;
+    if (key === "ahead")
+        return s.fill;
+    const voice = Number(key.slice("voice:".length));
+    if (!Number.isFinite(voice) || voice < 0)
+        return s.fill;
+    return s.voiceColors[voice] ?? voiceColor(voice);
+}
 //# sourceMappingURL=full-waveform.js.map

package/dist/waveform/full-waveform.js.map

@@ -1 +1 @@
-{"version":3,"file":"full-waveform.js","sourceRoot":"","sources":["../../src/waveform/full-waveform.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Node2D,\n  node,\n  command,\n  easeInOut,\n  fillOps,\n  property,\n  type AssetScope,\n  type CommandArgs,\n  type Fill,\n  type FillResolved,\n  type Node2DProps,\n  type RenderContext2D,\n} from \"@motionscript/sdk\"\n\nimport { declarePaints } from \"@motionscript/sdk/component\"\nimport type { Seekable } from \"@motionscript/sdk/component\"\nimport { EMPTY_ENVELOPE, sampleEnvelope, type AudioEnvelope } from \"./envelope\"\nimport {\n  clamp01,\n  groupByPaint,\n  layOutBars,\n  paintBars,\n  voiceColor,\n  type WaveformAlignment,\n} from \"./shared\"\n\nexport interface FullWaveformProps extends Node2DProps {\n  /** The baked recording. See {@link AudioEnvelope} for why it is baked. */\n  envelope: AudioEnvelope\n  /** How many columns the whole file is drawn as. */\n  bars: number\n  /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */\n  gap: number\n  /** Corner radius of a bar, capped at half its width. */\n  radius: number\n  /** How much of the file reads as played, `0`–`1`. Tweenable. */\n  progress: number\n  /** Drive {@link progress} from the node's own clock instead of the prop. */\n  follow: boolean\n  /** Multiplies every magnitude — a quiet track pulled up to fill its box. */\n  gain: number\n  /** How much of the box a silent bar still occupies, `0`–`1`. */\n  floor: number\n  align: WaveformAlignment\n  /** Colour each voice's turns rather than splitting on played / not played. */\n  byVoice: boolean\n  /** A colour per voice index. Short or empty falls back to the palette. */\n  voiceColors: string[]\n  /** The bars ahead of the playhead. */\n  fill: Fill\n  /** …and the bars behind it. */\n  playedFill: Fill\n}\n\n/**\n * A **waveform overview**: the whole recording's shape, drawn at once.\n *\n * The picture every audio editor opens with, and the one a podcast clip puts\n * under its caption — a static silhouette of the file, with a played portion\n * that advances. It answers \"how long is this and where are the loud parts\",\n * which is a question about the *file*, not about the moment; its sibling\n * {@link LiveWaveform} answers the other one.\n *\n * ## Progress is authored, not assumed\n *\n * {@link follow} is off by default, and that default is the considered one. A\n * scene has no idea where the recording it is drawing sits on the video's audio\n * lane — a clip is placed, trimmed and sped up out there, and none of that is\n * visible from in here. So the honest default is that the fill is *animation*:\n * the author sweeps it with a command, the same as any other tween, and it lands\n * wherever they put it. `follow` is the shortcut for the common arrangement\n * where the node appears exactly as the track starts, and it says so by being a\n * switch someone has to turn on rather than a behaviour that quietly disagrees\n * with the mix.\n *\n * ## Voices instead of progress\n *\n * With {@link byVoice} on, the played/ahead split is replaced by one colour per\n * speaking voice — the drawing the timeline's clip bars already make, at a size\n * you can read. For a two-hander it is a map of the conversation: who has the\n * floor, where the turns are, how long each one ran. It replaces the progress\n * colours rather than combining with them, because a bar cannot mean two things\n * at once and \"played, and also Grace\" is a legend nobody can hold in their\n * head.\n */\n@node({\n  key: \"fullWaveform\",\n  parentKey: \"node\",\n  forkable: true,\n  layout: {\n    children: \"freeform\",\n    defaultWidthMode: \"fixed\",\n    defaultHeightMode: \"fixed\",\n    acceptsChildren: true,\n  },\n  seed: {\n    width: 900,\n    height: 160,\n  },\n})\nexport class FullWaveform extends Node2D<FullWaveformProps> {\n  @property({ default: EMPTY_ENVELOPE }) declare envelope: AudioEnvelope\n  @property({ default: 120 }) declare bars: number\n  @property({ default: 0.3 }) declare gap: number\n  @property({ default: 2 }) declare radius: number\n  @property({ default: 0 }) declare progress: number\n  @property({ default: false }) declare follow: boolean\n  @property({ default: 1 }) declare gain: number\n  @property({ default: 0.015 }) declare floor: number\n  @property({ default: \"center\" }) declare align: WaveformAlignment\n  @property({ default: false }) declare byVoice: boolean\n  @property({ default: [] }) declare voiceColors: string[]\n\n  @property({\n    default: \"#5b5b7a\",\n    mapper: fillOps.resolve,\n    tween: fillOps.lerp,\n  })\n  declare fill: Fill\n\n  @property({\n    default: \"#6366f1\",\n    mapper: fillOps.resolve,\n    tween: fillOps.lerp,\n  })\n  declare playedFill: Fill\n\n  /**\n   * Fill the waveform in, left to right — the node's one command, since\n   * everything else about it is expressible as an ordinary `to`.\n   */\n  @command()\n  sweep(args: CommandArgs<Record<string, never>> & { duration: number }): Seekable {\n    return this.to({\n      data: { progress: 1 } as Partial<FullWaveformProps>,\n      duration: args.duration,\n      easing: args.easing ?? easeInOut(),\n    })\n  }\n\n  /**\n   * This node extends `Node2D` rather than `ShapeNode`, so nothing declares the\n   * paint props it carries — see {@link declarePaints}. `playedFill` is named\n   * past the conventional slots, so it is passed explicitly.\n   */\n  override declareAssets(assets: AssetScope): void {\n    super.declareAssets(assets)\n    declarePaints(this, assets, { fills: [this.playedFill as FillResolved[]] })\n  }\n\n  /** Where the fill has reached, from whichever source is in charge. */\n  private get played(): number {\n    if (!this.follow) return clamp01(this.progress)\n    const length = this.envelope.duration\n    if (length <= 0) return 0\n    return clamp01(this.time.elapsed / length)\n  }\n\n  protected renderSelf(ctx: RenderContext2D): void {\n    const rect = this.layoutBounds\n    const width = rect?.width ?? 0\n    const height = rect?.height ?? 0\n    if (width <= 0 || height <= 0) return\n\n    const count = Math.max(1, Math.round(this.bars))\n    const sampled = sampleEnvelope(\n      this.envelope,\n      0,\n      this.envelope.duration,\n      count\n    )\n    const boxes = layOutBars(sampled, {\n      width,\n      height,\n      gap: this.gap,\n      align: this.align,\n      gain: this.gain,\n      floor: this.floor,\n    })\n    if (boxes.length === 0) return\n\n    // One draw per colour rather than per bar — see {@link paintBars}. The key\n    // is a string because it has to be comparable; the paint it stands for is\n    // resolved after the grouping.\n    const edge = this.played * boxes.length\n    const groups = groupByPaint(boxes, (i) =>\n      this.byVoice\n        ? `voice:${sampled[i].speaker}`\n        : i < edge\n          ? \"played\"\n          : \"ahead\"\n    )\n\n    for (const [key, run] of groups) {\n      const graphics = paintBars(run, this.paintFor(key), this.radius)\n      if (graphics) ctx.draw(graphics)\n    }\n  }\n\n  /**\n   * The paint a group takes.\n   *\n   * A voice's colour is a **colour string**, never one of the node's two fill\n   * props, and that is deliberate: a voice is identified by hue, so a gradient\n   * or an image there would defeat the only thing the colour is for. It also\n   * means these paints declare no assets, which is why {@link declareAssets}\n   * only has to account for the two real fill props.\n   */\n  private paintFor(key: string): Fill {\n    if (key === \"played\") return this.playedFill\n    if (key === \"ahead\") return this.fill\n\n    const voice = Number(key.slice(\"voice:\".length))\n    if (!Number.isFinite(voice) || voice < 0) return this.fill\n    return this.voiceColors[voice] ?? voiceColor(voice)\n  }\n}\n"]}
+{"version":3,"file":"full-waveform.js","sourceRoot":"","sources":["../../src/waveform/full-waveform.ts"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  Types,\r\n  component2d,\r\n  easeInOut,\r\n  fillOps,\r\n  type Fill,\r\n  type FillResolved,\r\n  type NodeOf,\r\n  type RenderContext,\r\n  // Named so the emitted declaration reaches these through the sdk, not core.\r\n  type Node2D as _Node2D,\r\n  type Node2DProps as _Node2DProps,\r\n} from \"@motionscript/sdk\"\r\n\r\nimport { EMPTY_ENVELOPE, sampleEnvelope, type AudioEnvelope } from \"./envelope\"\r\nimport {\r\n  clamp01,\r\n  groupByPaint,\r\n  layOutBars,\r\n  paintBars,\r\n  voiceColor,\r\n  type WaveformAlignment,\r\n} from \"./shared\"\r\n\r\n/** A paint entry as the waveforms declare theirs: resolved and tweened like a fill, its kind read off the default. */\r\nconst paint = (initial: string) =>\r\n  Types.custom<Fill, FillResolved[]>(initial, { resolve: fillOps.resolve, lerp: fillOps.lerp })\r\n\r\n/**\r\n * A **waveform overview**: the whole recording's shape, drawn at once.\r\n *\r\n * The picture every audio editor opens with, and the one a podcast clip puts\r\n * under its caption — a static silhouette of the file, with a played portion\r\n * that advances. It answers \"how long is this and where are the loud parts\",\r\n * which is a question about the *file*, not about the moment; its sibling\r\n * {@link LiveWaveform} answers the other one.\r\n *\r\n * ## Progress is authored, not assumed\r\n *\r\n * `follow` is off by default, and that default is the considered one. A\r\n * scene has no idea where the recording it is drawing sits on the video's audio\r\n * lane — a clip is placed, trimmed and sped up out there, and none of that is\r\n * visible from in here. So the honest default is that the fill is *animation*:\r\n * the author sweeps it with a command, the same as any other tween, and it lands\r\n * wherever they put it. `follow` is the shortcut for the common arrangement\r\n * where the node appears exactly as the track starts, and it says so by being a\r\n * switch someone has to turn on rather than a behaviour that quietly disagrees\r\n * with the mix.\r\n *\r\n * ## Voices instead of progress\r\n *\r\n * With `byVoice` on, the played/ahead split is replaced by one colour per\r\n * speaking voice, at a size you can read. For a two-hander it is a map of the conversation: who has the\r\n * floor, where the turns are, how long each one ran. It replaces the progress\r\n * colours rather than combining with them, because a bar cannot mean two things\r\n * at once and \"played, and also Grace\" is a legend nobody can hold in their\r\n * head.\r\n */\r\nexport const FullWaveform = component2d({\r\n  key: \"fullWaveform\",\r\n  state: {\r\n    /** The baked recording. See {@link AudioEnvelope} for why it is baked. */\r\n    envelope: Types.custom<AudioEnvelope>(EMPTY_ENVELOPE),\r\n    /** How many columns the whole file is drawn as. */\r\n    bars: 120,\r\n    /** Space between bars, as a fraction of the pitch. See {@link layOutBars}. */\r\n    gap: 0.3,\r\n    /** Corner radius of a bar, capped at half its width. */\r\n    radius: 2,\r\n    /** How much of the file reads as played, `0`–`1`. Tweenable. */\r\n    progress: 0,\r\n    /** Drive `progress` from the node's own clock instead of the prop. */\r\n    follow: false,\r\n    /** Multiplies every magnitude — a quiet track pulled up to fill its box. */\r\n    gain: 1,\r\n    /** How much of the box a silent bar still occupies, `0`–`1`. */\r\n    floor: 0.015,\r\n    align: Types.custom<WaveformAlignment>(\"center\"),\r\n    /** Colour each voice's turns rather than splitting on played / not played. */\r\n    byVoice: false,\r\n    /** A colour per voice index. Short or empty falls back to the palette. */\r\n    voiceColors: Types.custom<string[]>([]),\r\n    /** The bars ahead of the playhead. */\r\n    fill: paint(\"#5b5b7a\"),\r\n    /** …and the bars behind it. */\r\n    playedFill: paint(\"#6366f1\"),\r\n  },\r\n  // Nothing declares a component's paints but itself: `fill` and `playedFill` both.\r\n  load: (loader, state) => {\r\n    loader.fill(state.fill)\r\n    loader.fill(state.playedFill)\r\n  },\r\n  commands: {\r\n    /**\r\n     * Fill the waveform in, left to right — the node's one command, since\r\n     * everything else about it is expressible as an ordinary `to`. Eased in-out\r\n     * unless it is given an easing of its own.\r\n     */\r\n    sweep: (timeline, state) => {\r\n      const ease = timeline.easing ? null : easeInOut()\r\n      const from = state.progress\r\n      return timeline.animate((t) => ({ progress: from + (1 - from) * (ease ? ease(t) : t) }))\r\n    },\r\n  },\r\n  render: (ctx, state) => {\r\n    drawBars(ctx, state)\r\n    ctx.children()\r\n  },\r\n})\r\n\r\nexport type FullWaveform = NodeOf<typeof FullWaveform>\r\nexport type FullWaveformProps = NonNullable<Parameters<typeof FullWaveform>[0]>\r\n\r\ninterface FullState {\r\n  readonly envelope: AudioEnvelope\r\n  readonly bars: number\r\n  readonly gap: number\r\n  readonly radius: number\r\n  readonly progress: number\r\n  readonly follow: boolean\r\n  readonly gain: number\r\n  readonly floor: number\r\n  readonly align: WaveformAlignment\r\n  readonly byVoice: boolean\r\n  readonly voiceColors: string[]\r\n  readonly fill: FillResolved[]\r\n  readonly playedFill: FillResolved[]\r\n}\r\n\r\nfunction drawBars(ctx: RenderContext, s: FullState): void {\r\n  const { width, height } = ctx.size\r\n  if (width <= 0 || height <= 0) return\r\n\r\n  const count = Math.max(1, Math.round(s.bars))\r\n  const sampled = sampleEnvelope(s.envelope, 0, s.envelope.duration, count)\r\n  const boxes = layOutBars(sampled, {\r\n    width,\r\n    height,\r\n    gap: s.gap,\r\n    align: s.align,\r\n    gain: s.gain,\r\n    floor: s.floor,\r\n  })\r\n  if (boxes.length === 0) return\r\n\r\n  // One draw per colour rather than per bar — see {@link paintBars}. The key\r\n  // is a string because it has to be comparable; the paint it stands for is\r\n  // resolved after the grouping.\r\n  const edge = played(ctx, s) * boxes.length\r\n  const groups = groupByPaint(boxes, (i) =>\r\n    s.byVoice\r\n      ? `voice:${sampled[i].speaker}`\r\n      : i < edge\r\n        ? \"played\"\r\n        : \"ahead\"\r\n  )\r\n\r\n  for (const [key, run] of groups) {\r\n    const graphics = paintBars(run, paintFor(s, key), s.radius)\r\n    if (graphics) ctx.draw(graphics)\r\n  }\r\n}\r\n\r\n/** Where the fill has reached, from whichever source is in charge. */\r\nfunction played(ctx: RenderContext, s: FullState): number {\r\n  if (!s.follow) return clamp01(s.progress)\r\n  const length = s.envelope.duration\r\n  if (length <= 0) return 0\r\n  return clamp01(ctx.time.elapsed / length)\r\n}\r\n\r\n/**\r\n * The paint a group takes.\r\n *\r\n * A voice's colour is a **colour string**, never one of the node's two fill\r\n * props, and that is deliberate: a voice is identified by hue, so a gradient\r\n * or an image there would defeat the only thing the colour is for. It also\r\n * means these paints declare no assets, which is why `load` only has to account\r\n * for the two real fill props.\r\n */\r\nfunction paintFor(s: FullState, key: string): Fill {\r\n  if (key === \"played\") return s.playedFill\r\n  if (key === \"ahead\") return s.fill\r\n\r\n  const voice = Number(key.slice(\"voice:\".length))\r\n  if (!Number.isFinite(voice) || voice < 0) return s.fill\r\n  return s.voiceColors[voice] ?? voiceColor(voice)\r\n}\r\n"]}

package/dist/waveform/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/waveform/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,YAAY,CAAA;AAEvE,OAAO,EACL,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,YAAY,EACZ,UAAU,EACV,SAAS,EACT,UAAU,GACX,MAAM,UAAU,CAAA","sourcesContent":["/**\n * The waveform family: one subject, two questions.\n *\n * - {@link FullWaveform} draws the **file** — the whole recording's silhouette,\n *   with a played portion that advances. \"How long is this, and where are the\n *   loud parts.\"\n * - {@link LiveWaveform} draws the **moment** — bars moving with playback, the\n *   visualiser a podcast clip puts beside the artwork. \"Is anything happening\n *   right now, and whose voice is it.\"\n *\n * Both read the same baked {@link AudioEnvelope}, which is why they cannot\n * disagree about a recording, and why neither listens to anything — see that\n * module for why a scene that has to export cannot use a live analyser.\n */\nexport { FullWaveform } from \"./full-waveform\"\nexport type { FullWaveformProps } from \"./full-waveform\"\nexport { LiveWaveform } from \"./live-waveform\"\nexport type { LiveWaveformProps } from \"./live-waveform\"\nexport { EMPTY_ENVELOPE, forSpeaker, sampleEnvelope } from \"./envelope\"\nexport type { AudioEnvelope, EnvelopeBar } from \"./envelope\"\nexport {\n  VOICE_PALETTE,\n  WAVEFORM_ALIGNMENTS,\n  WAVEFORM_STYLES,\n  groupByPaint,\n  layOutBars,\n  paintBars,\n  voiceColor,\n} from \"./shared\"\nexport type { BarBox, WaveformAlignment, WaveformStyle } from \"./shared\"\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/waveform/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;GAaG;AACH,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AAE9C,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,YAAY,CAAA;AAEvE,OAAO,EACL,aAAa,EACb,mBAAmB,EACnB,eAAe,EACf,YAAY,EACZ,UAAU,EACV,SAAS,EACT,UAAU,GACX,MAAM,UAAU,CAAA","sourcesContent":["/**\r\n * The waveform family: one subject, two questions.\r\n *\r\n * - {@link FullWaveform} draws the **file** — the whole recording's silhouette,\r\n *   with a played portion that advances. \"How long is this, and where are the\r\n *   loud parts.\"\r\n * - {@link LiveWaveform} draws the **moment** — bars moving with playback, the\r\n *   visualiser a podcast clip puts beside the artwork. \"Is anything happening\r\n *   right now, and whose voice is it.\"\r\n *\r\n * Both read the same baked {@link AudioEnvelope}, which is why they cannot\r\n * disagree about a recording, and why neither listens to anything — see that\r\n * module for why a scene that has to export cannot use a live analyser.\r\n */\r\nexport { FullWaveform } from \"./full-waveform\"\r\nexport type { FullWaveformProps } from \"./full-waveform\"\r\nexport { LiveWaveform } from \"./live-waveform\"\r\nexport type { LiveWaveformProps } from \"./live-waveform\"\r\nexport { EMPTY_ENVELOPE, forSpeaker, sampleEnvelope } from \"./envelope\"\r\nexport type { AudioEnvelope, EnvelopeBar } from \"./envelope\"\r\nexport {\r\n  VOICE_PALETTE,\r\n  WAVEFORM_ALIGNMENTS,\r\n  WAVEFORM_STYLES,\r\n  groupByPaint,\r\n  layOutBars,\r\n  paintBars,\r\n  voiceColor,\r\n} from \"./shared\"\r\nexport type { BarBox, WaveformAlignment, WaveformStyle } from \"./shared\"\r\n"]}