@codellyson/framely 0.1.0

package/dist/makeTransform.js

@@ -0,0 +1,287 @@
+/**
+ * makeTransform Utility
+ *
+ * Build CSS transform strings from an array of transform operations.
+ * Helps construct complex transforms in a readable, composable way.
+ *
+ * Usage:
+ *   const transform = makeTransform([
+ *     { translateX: '100px' },
+ *     { rotate: '45deg' },
+ *     { scale: 1.5 },
+ *   ]);
+ *   // => "translateX(100px) rotate(45deg) scale(1.5)"
+ *
+ *   // Or using the fluent API:
+ *   const transform = transform()
+ *     .translateX('100px')
+ *     .rotate('45deg')
+ *     .scale(1.5)
+ *     .toString();
+ */
+/**
+ * Supported transform operations with their CSS function names.
+ */
+const transformFunctions = {
+    // 2D Transforms
+    translateX: 'translateX',
+    translateY: 'translateY',
+    translate: 'translate',
+    scaleX: 'scaleX',
+    scaleY: 'scaleY',
+    scale: 'scale',
+    rotate: 'rotate',
+    skewX: 'skewX',
+    skewY: 'skewY',
+    skew: 'skew',
+    // 3D Transforms
+    translateZ: 'translateZ',
+    translate3d: 'translate3d',
+    scaleZ: 'scaleZ',
+    scale3d: 'scale3d',
+    rotateX: 'rotateX',
+    rotateY: 'rotateY',
+    rotateZ: 'rotateZ',
+    rotate3d: 'rotate3d',
+    perspective: 'perspective',
+    // Matrix
+    matrix: 'matrix',
+    matrix3d: 'matrix3d',
+};
+/**
+ * Format a value for CSS transform.
+ * Numbers are kept as-is for scale, strings are used directly.
+ */
+function formatValue(key, value) {
+    // Handle arrays (for translate, scale, rotate3d, etc.)
+    if (Array.isArray(value)) {
+        return value.join(', ');
+    }
+    // Handle numbers - add units where needed
+    if (typeof value === 'number') {
+        // Scale values don't need units
+        if (key.startsWith('scale') || key === 'matrix' || key === 'matrix3d') {
+            return String(value);
+        }
+        // Rotation needs deg
+        if (key.startsWith('rotate') || key.startsWith('skew')) {
+            return `${value}deg`;
+        }
+        // Translation needs px
+        if (key.startsWith('translate') || key === 'perspective') {
+            return `${value}px`;
+        }
+        return String(value);
+    }
+    return String(value);
+}
+/**
+ * Convert a transform operation object to CSS string.
+ */
+function operationToString(operation) {
+    const entries = Object.entries(operation);
+    if (entries.length === 0)
+        return '';
+    return entries
+        .map(([key, value]) => {
+        const fnName = transformFunctions[key] || key;
+        const formattedValue = formatValue(key, value);
+        return `${fnName}(${formattedValue})`;
+    })
+        .join(' ');
+}
+/**
+ * Build a CSS transform string from an array of transform operations.
+ *
+ * @param {TransformOperation | TransformOperation[]} operations - Array of transform operation objects
+ * @returns {string} CSS transform string
+ *
+ * @example
+ *   makeTransform([
+ *     { translateX: 100 },
+ *     { rotate: 45 },
+ *     { scale: 1.5 },
+ *   ])
+ *   // => "translateX(100px) rotate(45deg) scale(1.5)"
+ */
+export function makeTransform(operations) {
+    if (!Array.isArray(operations)) {
+        return operationToString(operations);
+    }
+    return operations
+        .map(operationToString)
+        .filter(Boolean)
+        .join(' ');
+}
+/**
+ * Fluent transform builder class.
+ */
+class TransformBuilder {
+    operations;
+    constructor() {
+        this.operations = [];
+    }
+    // 2D Transforms
+    translateX(value) {
+        this.operations.push({ translateX: value });
+        return this;
+    }
+    translateY(value) {
+        this.operations.push({ translateY: value });
+        return this;
+    }
+    translate(x, y) {
+        this.operations.push({ translate: y !== undefined ? [x, y] : x });
+        return this;
+    }
+    scaleX(value) {
+        this.operations.push({ scaleX: value });
+        return this;
+    }
+    scaleY(value) {
+        this.operations.push({ scaleY: value });
+        return this;
+    }
+    scale(x, y) {
+        this.operations.push({ scale: y !== undefined ? [x, y] : x });
+        return this;
+    }
+    rotate(value) {
+        this.operations.push({ rotate: value });
+        return this;
+    }
+    skewX(value) {
+        this.operations.push({ skewX: value });
+        return this;
+    }
+    skewY(value) {
+        this.operations.push({ skewY: value });
+        return this;
+    }
+    skew(x, y) {
+        this.operations.push({ skew: y !== undefined ? [x, y] : x });
+        return this;
+    }
+    // 3D Transforms
+    translateZ(value) {
+        this.operations.push({ translateZ: value });
+        return this;
+    }
+    translate3d(x, y, z) {
+        this.operations.push({ translate3d: [x, y, z] });
+        return this;
+    }
+    scaleZ(value) {
+        this.operations.push({ scaleZ: value });
+        return this;
+    }
+    scale3d(x, y, z) {
+        this.operations.push({ scale3d: [x, y, z] });
+        return this;
+    }
+    rotateX(value) {
+        this.operations.push({ rotateX: value });
+        return this;
+    }
+    rotateY(value) {
+        this.operations.push({ rotateY: value });
+        return this;
+    }
+    rotateZ(value) {
+        this.operations.push({ rotateZ: value });
+        return this;
+    }
+    rotate3d(x, y, z, angle) {
+        this.operations.push({ rotate3d: [x, y, z, angle] });
+        return this;
+    }
+    perspective(value) {
+        this.operations.push({ perspective: value });
+        return this;
+    }
+    // Matrix
+    matrix(...values) {
+        this.operations.push({ matrix: values });
+        return this;
+    }
+    matrix3d(...values) {
+        this.operations.push({ matrix3d: values });
+        return this;
+    }
+    // Build the transform string
+    toString() {
+        return makeTransform(this.operations);
+    }
+    // Get the operations array
+    toArray() {
+        return [...this.operations];
+    }
+    // Clear all operations
+    clear() {
+        this.operations = [];
+        return this;
+    }
+}
+/**
+ * Create a new transform builder for fluent API usage.
+ *
+ * @returns {TransformBuilder}
+ *
+ * @example
+ *   const transform = transform()
+ *     .translateX(100)
+ *     .rotate(45)
+ *     .scale(1.5)
+ *     .toString();
+ */
+export function transform() {
+    return new TransformBuilder();
+}
+/**
+ * Interpolate between two transform strings.
+ * Note: This is a simplified version that works best with matching operations.
+ *
+ * @param {number} progress - Interpolation progress (0-1)
+ * @param {TransformOperation[]} fromOps - Starting transform operations
+ * @param {TransformOperation[]} toOps - Ending transform operations
+ * @returns {string} Interpolated transform string
+ */
+export function interpolateTransform(progress, fromOps, toOps) {
+    const result = [];
+    const maxLength = Math.max(fromOps.length, toOps.length);
+    for (let i = 0; i < maxLength; i++) {
+        const fromOp = fromOps[i] || {};
+        const toOp = toOps[i] || {};
+        const interpolatedOp = {};
+        // Get all keys from both operations
+        const keys = new Set([...Object.keys(fromOp), ...Object.keys(toOp)]);
+        keys.forEach((key) => {
+            const fromValue = fromOp[key];
+            const toValue = toOp[key];
+            if (fromValue === undefined && toValue !== undefined) {
+                interpolatedOp[key] = toValue;
+            }
+            else if (toValue === undefined && fromValue !== undefined) {
+                interpolatedOp[key] = fromValue;
+            }
+            else if (typeof fromValue === 'number' && typeof toValue === 'number') {
+                interpolatedOp[key] = fromValue + (toValue - fromValue) * progress;
+            }
+            else if (Array.isArray(fromValue) && Array.isArray(toValue)) {
+                interpolatedOp[key] = fromValue.map((v, idx) => {
+                    const from = typeof v === 'number' ? v : parseFloat(v) || 0;
+                    const to = typeof toValue[idx] === 'number' ? toValue[idx] : parseFloat(toValue[idx]) || 0;
+                    return from + (to - from) * progress;
+                });
+            }
+            else {
+                // Can't interpolate, use the target value
+                interpolatedOp[key] = progress < 0.5 ? fromValue : toValue;
+            }
+        });
+        result.push(interpolatedOp);
+    }
+    return makeTransform(result);
+}
+export default makeTransform;
+//# sourceMappingURL=makeTransform.js.map

package/dist/makeTransform.js.map

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

package/dist/measureSpring.d.ts

@@ -0,0 +1,75 @@
+/**
+ * Interface for spring preset configuration values.
+ */
+export interface SpringPreset {
+    mass: number;
+    stiffness: number;
+    damping: number;
+}
+/**
+ * Options for the measureSpring function.
+ */
+export interface MeasureSpringOptions {
+    /** Frames per second (required) */
+    fps: number;
+    /** Controls animation speed (lower = faster). Defaults to 1. */
+    mass?: number;
+    /** Bounciness (higher = more bounce). Defaults to 100. */
+    stiffness?: number;
+    /** Deceleration (higher = less bounce). Defaults to 10. */
+    damping?: number;
+    /** How close to final value to consider "settled". Defaults to 0.001. */
+    threshold?: number;
+}
+/**
+ * Measures how many frames a spring animation takes to settle.
+ *
+ * This is useful for:
+ * - Determining the duration of a Sequence containing spring animations
+ * - Setting Loop durationInFrames to match spring completion
+ * - Calculating total video duration with springs
+ *
+ * Usage:
+ *   const frames = measureSpring({ fps: 30 });
+ *   const frames = measureSpring({ fps: 30, mass: 0.5, stiffness: 200 });
+ *
+ * @param {MeasureSpringOptions} options
+ * @param {number} options.fps - Frames per second (required)
+ * @param {number} [options.mass=1] - Controls animation speed (lower = faster)
+ * @param {number} [options.stiffness=100] - Bounciness (higher = more bounce)
+ * @param {number} [options.damping=10] - Deceleration (higher = less bounce)
+ * @param {number} [options.threshold=0.001] - How close to final value to consider "settled"
+ * @returns {number} Number of frames until the spring settles
+ */
+export declare function measureSpring(options: MeasureSpringOptions): number;
+/**
+ * Calculate the natural frequency of a spring.
+ *
+ * @param {number} stiffness
+ * @param {number} mass
+ * @returns {number} Natural frequency in radians per second
+ */
+export declare function springNaturalFrequency(stiffness: number, mass: number): number;
+/**
+ * Calculate the damping ratio of a spring.
+ *
+ * - zeta < 1: Underdamped (oscillates)
+ * - zeta = 1: Critically damped (fastest without oscillation)
+ * - zeta > 1: Overdamped (slow, no oscillation)
+ *
+ * @param {number} damping
+ * @param {number} stiffness
+ * @param {number} mass
+ * @returns {number} Damping ratio
+ */
+export declare function springDampingRatio(damping: number, stiffness: number, mass: number): number;
+/**
+ * Get spring configuration presets.
+ *
+ * Usage:
+ *   const config = springPresets.gentle;
+ *   spring(frame, { ...config, from: 0, to: 100 });
+ */
+export declare const springPresets: Record<string, SpringPreset>;
+export default measureSpring;
+//# sourceMappingURL=measureSpring.d.ts.map

package/dist/measureSpring.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"measureSpring.d.ts","sourceRoot":"","sources":["../src/measureSpring.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,IAAI,EAAE,MAAM,CAAC;IACb,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED;;GAEG;AACH,MAAM,WAAW,oBAAoB;IACnC,mCAAmC;IACnC,GAAG,EAAE,MAAM,CAAC;IACZ,gEAAgE;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,2DAA2D;IAC3D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,yEAAyE;IACzE,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;;;;;;;GAmBG;AACH,wBAAgB,aAAa,CAAC,OAAO,EAAE,oBAAoB,GAAG,MAAM,CAkDnE;AAED;;;;;;GAMG;AACH,wBAAgB,sBAAsB,CAAC,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAE9E;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAE3F;AAED;;;;;;GAMG;AACH,eAAO,MAAM,aAAa,EAAE,MAAM,CAAC,MAAM,EAAE,YAAY,CAkBtD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/measureSpring.js

@@ -0,0 +1,108 @@
+/**
+ * Measures how many frames a spring animation takes to settle.
+ *
+ * This is useful for:
+ * - Determining the duration of a Sequence containing spring animations
+ * - Setting Loop durationInFrames to match spring completion
+ * - Calculating total video duration with springs
+ *
+ * Usage:
+ *   const frames = measureSpring({ fps: 30 });
+ *   const frames = measureSpring({ fps: 30, mass: 0.5, stiffness: 200 });
+ *
+ * @param {MeasureSpringOptions} options
+ * @param {number} options.fps - Frames per second (required)
+ * @param {number} [options.mass=1] - Controls animation speed (lower = faster)
+ * @param {number} [options.stiffness=100] - Bounciness (higher = more bounce)
+ * @param {number} [options.damping=10] - Deceleration (higher = less bounce)
+ * @param {number} [options.threshold=0.001] - How close to final value to consider "settled"
+ * @returns {number} Number of frames until the spring settles
+ */
+export function measureSpring(options) {
+    const { fps, mass = 1, stiffness = 100, damping = 10, threshold = 0.001, } = options;
+    if (!fps || fps <= 0) {
+        throw new Error('measureSpring requires a positive fps value');
+    }
+    // Calculate spring physics parameters
+    const omega0 = Math.sqrt(stiffness / mass); // Natural frequency
+    const zeta = damping / (2 * Math.sqrt(stiffness * mass)); // Damping ratio
+    // Maximum time to search (10 seconds should be enough for any reasonable spring)
+    const maxTime = 10;
+    const maxFrames = Math.ceil(maxTime * fps);
+    // Simulate the spring frame by frame
+    for (let frame = 1; frame <= maxFrames; frame++) {
+        const t = frame / fps;
+        let displacement;
+        if (zeta < 1) {
+            // Underdamped (oscillates)
+            const omegaD = omega0 * Math.sqrt(1 - zeta * zeta);
+            displacement = Math.exp(-zeta * omega0 * t) *
+                (Math.cos(omegaD * t) + (zeta * omega0 / omegaD) * Math.sin(omegaD * t));
+        }
+        else if (zeta === 1) {
+            // Critically damped
+            displacement = Math.exp(-omega0 * t) * (1 + omega0 * t);
+        }
+        else {
+            // Overdamped
+            const s1 = -omega0 * (zeta - Math.sqrt(zeta * zeta - 1));
+            const s2 = -omega0 * (zeta + Math.sqrt(zeta * zeta - 1));
+            displacement = (s2 * Math.exp(s1 * t) - s1 * Math.exp(s2 * t)) / (s2 - s1);
+        }
+        // Check if we've settled (displacement from target is below threshold)
+        if (Math.abs(displacement) < threshold) {
+            return frame;
+        }
+    }
+    // If we didn't settle within maxFrames, return maxFrames
+    // This shouldn't happen with reasonable spring parameters
+    return maxFrames;
+}
+/**
+ * Calculate the natural frequency of a spring.
+ *
+ * @param {number} stiffness
+ * @param {number} mass
+ * @returns {number} Natural frequency in radians per second
+ */
+export function springNaturalFrequency(stiffness, mass) {
+    return Math.sqrt(stiffness / mass);
+}
+/**
+ * Calculate the damping ratio of a spring.
+ *
+ * - zeta < 1: Underdamped (oscillates)
+ * - zeta = 1: Critically damped (fastest without oscillation)
+ * - zeta > 1: Overdamped (slow, no oscillation)
+ *
+ * @param {number} damping
+ * @param {number} stiffness
+ * @param {number} mass
+ * @returns {number} Damping ratio
+ */
+export function springDampingRatio(damping, stiffness, mass) {
+    return damping / (2 * Math.sqrt(stiffness * mass));
+}
+/**
+ * Get spring configuration presets.
+ *
+ * Usage:
+ *   const config = springPresets.gentle;
+ *   spring(frame, { ...config, from: 0, to: 100 });
+ */
+export const springPresets = {
+    // Quick and snappy
+    snappy: { mass: 1, stiffness: 400, damping: 30 },
+    // Gentle, slow movement
+    gentle: { mass: 1, stiffness: 100, damping: 15 },
+    // Bouncy, playful
+    bouncy: { mass: 1, stiffness: 200, damping: 10 },
+    // Stiff, minimal overshoot
+    stiff: { mass: 1, stiffness: 300, damping: 25 },
+    // Slow, heavy feeling
+    slow: { mass: 2, stiffness: 100, damping: 20 },
+    // Default (matches Remotion)
+    default: { mass: 1, stiffness: 100, damping: 10 },
+};
+export default measureSpring;
+//# sourceMappingURL=measureSpring.js.map

package/dist/measureSpring.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"measureSpring.js","sourceRoot":"","sources":["../src/measureSpring.ts"],"names":[],"mappings":"AAyBA;;;;;;;;;;;;;;;;;;;GAmBG;AACH,MAAM,UAAU,aAAa,CAAC,OAA6B;IACzD,MAAM,EACJ,GAAG,EACH,IAAI,GAAG,CAAC,EACR,SAAS,GAAG,GAAG,EACf,OAAO,GAAG,EAAE,EACZ,SAAS,GAAG,KAAK,GAClB,GAAG,OAAO,CAAC;IAEZ,IAAI,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC,EAAE,CAAC;QACrB,MAAM,IAAI,KAAK,CAAC,6CAA6C,CAAC,CAAC;IACjE,CAAC;IAED,sCAAsC;IACtC,MAAM,MAAM,GAAW,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,oBAAoB;IACxE,MAAM,IAAI,GAAW,OAAO,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC,CAAC,gBAAgB;IAElF,iFAAiF;IACjF,MAAM,OAAO,GAAW,EAAE,CAAC;IAC3B,MAAM,SAAS,GAAW,IAAI,CAAC,IAAI,CAAC,OAAO,GAAG,GAAG,CAAC,CAAC;IAEnD,qCAAqC;IACrC,KAAK,IAAI,KAAK,GAAG,CAAC,EAAE,KAAK,IAAI,SAAS,EAAE,KAAK,EAAE,EAAE,CAAC;QAChD,MAAM,CAAC,GAAW,KAAK,GAAG,GAAG,CAAC;QAC9B,IAAI,YAAoB,CAAC;QAEzB,IAAI,IAAI,GAAG,CAAC,EAAE,CAAC;YACb,2BAA2B;YAC3B,MAAM,MAAM,GAAW,MAAM,GAAG,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;YAC3D,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,GAAG,MAAM,GAAG,CAAC,CAAC;gBACzC,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,IAAI,GAAG,MAAM,GAAG,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC;QAC7E,CAAC;aAAM,IAAI,IAAI,KAAK,CAAC,EAAE,CAAC;YACtB,oBAAoB;YACpB,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,MAAM,GAAG,CAAC,CAAC,CAAC;QAC1D,CAAC;aAAM,CAAC;YACN,aAAa;YACb,MAAM,EAAE,GAAW,CAAC,MAAM,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC;YACjE,MAAM,EAAE,GAAW,CAAC,MAAM,GAAG,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC,CAAC;YACjE,YAAY,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;QAC7E,CAAC;QAED,uEAAuE;QACvE,IAAI,IAAI,CAAC,GAAG,CAAC,YAAY,CAAC,GAAG,SAAS,EAAE,CAAC;YACvC,OAAO,KAAK,CAAC;QACf,CAAC;IACH,CAAC;IAED,yDAAyD;IACzD,0DAA0D;IAC1D,OAAO,SAAS,CAAC;AACnB,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,sBAAsB,CAAC,SAAiB,EAAE,IAAY;IACpE,OAAO,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC;AACrC,CAAC;AAED;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,kBAAkB,CAAC,OAAe,EAAE,SAAiB,EAAE,IAAY;IACjF,OAAO,OAAO,GAAG,CAAC,CAAC,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC,CAAC,CAAC;AACrD,CAAC;AAED;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAAiC;IACzD,mBAAmB;IACnB,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAEhD,wBAAwB;IACxB,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAEhD,kBAAkB;IAClB,MAAM,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAEhD,2BAA2B;IAC3B,KAAK,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAE/C,sBAAsB;IACtB,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;IAE9C,6BAA6B;IAC7B,OAAO,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE;CAClD,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/noise.d.ts

@@ -0,0 +1,110 @@
+/**
+ * Noise Utilities
+ *
+ * Deterministic noise and random functions for reproducible animations.
+ * All functions are pure — same inputs always produce same outputs.
+ */
+/**
+ * Options for 2D and 3D Perlin noise functions.
+ */
+interface NoiseOptions {
+    /** Seed for the permutation table */
+    seed?: number;
+    /** Scales the input coordinates */
+    frequency?: number;
+    /** Scales the output value */
+    amplitude?: number;
+}
+/**
+ * Options for Fractal Brownian Motion (fBm).
+ */
+interface FbmOptions extends NoiseOptions {
+    /** Number of noise layers */
+    octaves?: number;
+    /** Frequency multiplier per octave */
+    lacunarity?: number;
+    /** Amplitude multiplier per octave */
+    persistence?: number;
+}
+/**
+ * Generate a seeded pseudo-random number between 0 and 1.
+ *
+ * Uses a hash-based approach for single-call determinism (no state).
+ *
+ * @param {number} seed - Any number (typically frame number or index)
+ * @returns {number} Pseudo-random value in [0, 1)
+ */
+export declare function random(seed: number): number;
+/**
+ * Generate a seeded random number within a range.
+ *
+ * @param {number} seed - Seed value
+ * @param {number} min - Minimum value (inclusive)
+ * @param {number} max - Maximum value (exclusive)
+ * @returns {number} Random value in [min, max)
+ */
+export declare function randomRange(seed: number, min: number, max: number): number;
+/**
+ * Generate a seeded random integer within a range.
+ *
+ * @param {number} seed - Seed value
+ * @param {number} min - Minimum value (inclusive)
+ * @param {number} max - Maximum value (inclusive)
+ * @returns {number} Random integer in [min, max]
+ */
+export declare function randomInt(seed: number, min: number, max: number): number;
+/**
+ * 2D Perlin noise.
+ *
+ * Returns a smooth, continuous noise value for the given coordinates.
+ * Same inputs always produce the same output.
+ *
+ * @param {number} x - X coordinate
+ * @param {number} y - Y coordinate
+ * @param {object} [options]
+ * @param {number} [options.seed=0] - Seed for the permutation table
+ * @param {number} [options.frequency=1] - Scales the input coordinates
+ * @param {number} [options.amplitude=1] - Scales the output value
+ * @returns {number} Noise value in [-amplitude, amplitude]
+ */
+export declare function noise2D(x: number, y: number, options?: NoiseOptions): number;
+/**
+ * 3D Perlin noise.
+ *
+ * Useful for animated noise: use (x, y, frame * speed) as coordinates.
+ *
+ * @param {number} x - X coordinate
+ * @param {number} y - Y coordinate
+ * @param {number} z - Z coordinate (often frame * speed)
+ * @param {object} [options]
+ * @param {number} [options.seed=0] - Seed for the permutation table
+ * @param {number} [options.frequency=1] - Scales the input coordinates
+ * @param {number} [options.amplitude=1] - Scales the output value
+ * @returns {number} Noise value in [-amplitude, amplitude]
+ */
+export declare function noise3D(x: number, y: number, z: number, options?: NoiseOptions): number;
+/**
+ * Fractal Brownian Motion (fBm) — layered 2D noise for natural textures.
+ *
+ * @param {number} x - X coordinate
+ * @param {number} y - Y coordinate
+ * @param {object} [options]
+ * @param {number} [options.seed=0] - Seed
+ * @param {number} [options.octaves=4] - Number of noise layers
+ * @param {number} [options.frequency=1] - Base frequency
+ * @param {number} [options.amplitude=1] - Base amplitude
+ * @param {number} [options.lacunarity=2] - Frequency multiplier per octave
+ * @param {number} [options.persistence=0.5] - Amplitude multiplier per octave
+ * @returns {number} Noise value
+ */
+export declare function fbm2D(x: number, y: number, options?: FbmOptions): number;
+declare const _default: {
+    random: typeof random;
+    randomRange: typeof randomRange;
+    randomInt: typeof randomInt;
+    noise2D: typeof noise2D;
+    noise3D: typeof noise3D;
+    fbm2D: typeof fbm2D;
+};
+export default _default;
+//# sourceMappingURL=noise.d.ts.map

package/dist/noise.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"noise.d.ts","sourceRoot":"","sources":["../src/noise.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH;;GAEG;AACH,UAAU,YAAY;IACpB,qCAAqC;IACrC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,mCAAmC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;GAEG;AACH,UAAU,UAAW,SAAQ,YAAY;IACvC,6BAA6B;IAC7B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,sCAAsC;IACtC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAQD;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAM3C;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAE1E;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,MAAM,CAExE;AA6ED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,MAAM,CAqChF;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,OAAO,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,GAAE,YAAiB,GAAG,MAAM,CAiD3F;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,KAAK,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,EAAE,OAAO,GAAE,UAAe,GAAG,MAAM,CAqB5E;;;;;;;;;AAED,wBAA2E"}