@pixerate/flair 0.8.0 → 0.10.0

package/dist/clock-BhdXWH-n.d.ts

@@ -1,47 +0,0 @@
-/**
- * Time source for generative animations and playback.
- * By default that is real time (animation frames and timers).
- * A ManualClock instead moves only when told to, enabling frame-exact
- * rendering, video recording, scrubbing, or fast simulation without waiting.
- */
-interface Clock {
-    /** Current time in milliseconds. */
-    now(): number;
-    /** Resolves on the next frame. */
-    frame(): Promise<void>;
-    /** Resolves after `ms` milliseconds of this clock's time. */
-    sleep(ms: number): Promise<void>;
-    /**
-     * Whether the clock follows wall time. Live clocks stop when the tab is in
-     * the background (browsers pause animation frames there).
-     */
-    readonly live: boolean;
-}
-declare const pageHidden: () => boolean;
-declare const realClock: Clock;
-/**
- * A clock that only moves when {@link advance} or {@link tick} is called.
- * Each call fires the sleeps that fall due, in order, letting awaiting code
- * run before the next sleep fires, then resolves pending frames.
- */
-declare class ManualClock implements Clock {
-    readonly live = false;
-    private time;
-    private frames;
-    private sleepers;
-    private seq;
-    constructor(start?: number);
-    now(): number;
-    frame(): Promise<void>;
-    sleep(ms: number): Promise<void>;
-    get pending(): boolean;
-    advance(ms: number): Promise<void>;
-    tick(fps?: number): Promise<void>;
-}
-/**
- * A repeatable pseudo-random number in [0, 1) for a key and index.
- * Useful for deterministic, reproducible animations.
- */
-declare function jitter(key: string, n: number): number;
-
-export { type Clock as C, ManualClock as M, jitter as j, pageHidden as p, realClock as r };

package/dist/motion-Ce0lmzm3.d.ts

@@ -1,179 +0,0 @@
-/**
- * Vector motion: animated SVG pictures described as data. A picture changes in
- * steps (step 0 when it starts, step n at `steps[n - 1]` ms), and everything
- * here is a pure function of its arguments, so a frame comes out the same
- * however it is reached (played, stepped for a recording, or seeked).
- */
-/** Easing curves by name. */
-declare const EASES: {
-    readonly linear: (t: number) => number;
-    readonly "in-out": (t: number) => number;
-    readonly out: (t: number) => number;
-};
-type EaseName = keyof typeof EASES;
-/** How long a change takes by default, in ms. */
-declare const STEP_MS = 800;
-/**
- * When `step` starts, in ms since the media started (step 0 at 0, step n at
- * `steps[n - 1]`), or undefined if it has not started yet.
- */
-declare function stepStart(steps: readonly number[], step: number): number | undefined;
-/**
- * How far a change that plays on `step` (after `delay` ms, over `ms`) has
- * got at `timeMs`, eased: 0 before it starts, 1 once it is over.
- */
-declare function stepProgress(steps: readonly number[], timeMs: number, step: number, options?: {
-    delay?: number;
-    ms?: number;
-    ease?: EaseName;
-}): number;
-/** The key an item in a list of data keeps from one state to the next. */
-type DataKey = (item: unknown, index: number) => string;
-/**
- * Keys items by their `id`, `key`, `name` or `label` (or a link's `source`
- * and `target`), else by position.
- */
-declare const defaultDataKey: DataKey;
-/**
- * Data between two states, `u` of the way from `a` to `b`. Numbers blend;
- * lists match their items by key (`keyOf`), so each keeps its identity and
- * moves rather than jumping, with items only in `b` growing from nothing and
- * items only in `a` shrinking away; objects blend field by field; anything
- * else changes halfway.
- */
-declare function lerpData<D>(a: D, b: D, u: number, keyOf?: DataKey): D;
-/**
- * The data to show at `timeMs`, for media whose data has a state per step:
- * `states[n]` is shown from step n (the last one stays), reached by moving
- * from the state before it over `ms`.
- */
-declare function stepData<D>(states: readonly D[], steps: readonly number[], timeMs: number, options?: {
-    ms?: number;
-    ease?: EaseName;
-    keyOf?: DataKey;
-}): D;
-/**
- * An animated SVG picture: markup plus changes to its elements. Draw it with
- * `SvgPlayer` (or `svgView`), or compute frames yourself with `svgFrame`.
- */
-interface SvgMotion {
-    /** One self-contained `<svg>` with a `viewBox`: no scripts, no outside links. */
-    svg: string;
-    /** Changes to its elements, each on a step. */
-    animate?: SvgAnimation[];
-}
-/** A box in an SVG's `viewBox` units: `[x, y, width, height]`. */
-type SvgBox = readonly [number, number, number, number];
-/** A change to one element of an {@link SvgMotion}, or (with `view`) to the whole picture. */
-interface SvgAnimation {
-    /** The element's `id` in the SVG (not needed for `view`). */
-    id?: string;
-    /** The step it plays on: 0 (default) when the media starts, 1 with the next shot, and so on. */
-    step?: number;
-    /** Ms after the step starts. */
-    delay?: number;
-    /** How long it takes, in ms (default {@link STEP_MS}). */
-    ms?: number;
-    ease?: EaseName;
-    /**
-     * Attributes from one value to another: numbers, colours (`#rrggbb`), or
-     * strings whose numbers change while the rest stays the same (a path's
-     * `d`, a `transform`, `points`).
-     */
-    attrs?: Record<string, readonly [string | number, string | number]>;
-    /** Draws a line or outline on along its length, from 0 to 1 (or between two fractions). */
-    draw?: boolean | readonly [number, number];
-    /**
-     * Zooms and pans the whole picture to frame a box (`[x, y, width, height]`
-     * in the `viewBox`'s units) or an element by id (with a margin round it),
-     * from where the last `view` left it (at first, the whole `viewBox`).
-     */
-    view?: SvgBox | string;
-    /**
-     * Moves the element along a path (by id) from its start to its end, or
-     * between the fractions in `at`; draw the element round (0, 0), like a
-     * circle at `cx="0" cy="0"`.
-     */
-    along?: string;
-    /** How far along the path `along` moves the element, from and to (default [0, 1]). */
-    at?: readonly [number, number];
-    /** Counts the element's text from one number to the other. */
-    count?: readonly [number, number];
-    /** How a count is written: `{n}` stands for the number ("{n}%", "$ {n}M"). */
-    format?: string;
-    /** Decimals in a count (default 0). */
-    decimals?: number;
-    /**
-     * Writes this text into the element letter by letter: none of it when the
-     * change starts, all of it when it ends (a typewriter).
-     */
-    write?: string;
-    /**
-     * With `write`: letters not yet written show characters picked from this
-     * string, changing every {@link SCRAMBLE_MS} ms, so the text decodes
-     * rather than types. The same time always picks the same characters.
-     */
-    scramble?: string;
-    /** With `write`: shown after the written letters while it writes ("▌", "|"). */
-    caret?: string;
-}
-/** How often scrambled letters change, in ms (see `SvgAnimation.scramble`). */
-declare const SCRAMBLE_MS = 50;
-/**
- * `text` with `u` (0–1) of its letters written (see `SvgAnimation.write`):
- * the rest scrambled from `scramble` (picked by `timeMs`) or left off, then
- * the caret while it is unfinished. Letters are code points, so emoji and
- * accents are never split.
- */
-declare function writtenText(text: string, u: number, options?: {
-    scramble?: string;
-    caret?: string;
-    timeMs?: number;
-}): string;
-/** What one element of an animated SVG shows at a time. */
-interface SvgElementFrame {
-    attrs: Record<string, string>;
-    /** How much of its length is drawn, 0–1. */
-    draw?: number;
-    text?: string;
-    /** Where it is along a path: the path's id and the fraction of its length. */
-    along?: {
-        path: string;
-        at: number;
-    };
-    /**
-     * The whole picture's framing (on the frame for {@link SVG_PICTURE}): `u`
-     * of the way from one view to the next, `null` being the whole `viewBox`.
-     */
-    view?: {
-        from: SvgBox | string | null;
-        to: SvgBox | string;
-        u: number;
-    };
-}
-/** The key of the whole picture's frame in {@link svgFrame}'s result (for `view`). */
-declare const SVG_PICTURE = "";
-/** A value `u` of the way between two attribute values (see `SvgAnimation.attrs`). */
-declare function lerpAttr(a: string | number, b: string | number, u: number): string;
-/** Formats a number for a count animation (`{n}` stands for the rounded number). */
-declare function formatCount(value: number, options?: {
-    decimals?: number;
-    format?: string;
-}): string;
-/**
- * What each animated element shows at `timeMs`. For each attribute (or
- * line, count or writing) the latest change to have started wins; before the first
- * one starts, the element shows that change's starting value, so something
- * that grows in later is hidden until then.
- */
-declare function svgFrame(animations: readonly SvgAnimation[], steps: readonly number[], timeMs: number): Map<string, SvgElementFrame>;
-/**
- * The opening tag of the root element at the start of `markup` (up to its
- * first `>`), cut out without a regular expression, so checks on it stay
- * linear however long or odd the markup is.
- */
-declare function svgOpeningTag(markup: string): string;
-/** Problems with an {@link SvgMotion}, as sentences; none when it can be drawn. */
-declare function svgMotionIssues(motion: unknown): string[];
-
-export { type DataKey as D, EASES as E, type SvgMotion as S, type EaseName as a, SCRAMBLE_MS as b, STEP_MS as c, SVG_PICTURE as d, type SvgAnimation as e, type SvgBox as f, type SvgElementFrame as g, defaultDataKey as h, formatCount as i, lerpData as j, stepProgress as k, lerpAttr as l, stepStart as m, svgFrame as n, svgMotionIssues as o, svgOpeningTag as p, stepData as s, writtenText as w };