@react-spring/shared - npm Package Compare versions

Comparing version 9.0.0-rc.2 to 9.0.0-rc.3

cjs/FrameLoop.d.ts

@@ -15,4 +15,3 @@ import { FrameRequestCallback } from './types';
  * FrameLoop executes its animations in order of lowest priority first.
- * Animations are released once idle. The loop is paused while no animations
- * exist.
+ * Animations are retained until idle.
  */
@@ -26,7 +25,5 @@ export declare class FrameLoop {
     /**
-     * Update every active animation.
-     *
-     * Can be passed to `requestAnimationFrame` without wrapping or binding.
+     * Advance the animations to the current time.
      */
-    update: () => void;
+    advance: () => void;
     /**
@@ -48,5 +45,5 @@ * Invoke the given `handler` on the soonest frame after the given
     onWrite: (cb: FrameRequestCallback) => void;
-    protected _idle: boolean;
+    protected _animations: OpaqueAnimation[];
     protected _dispose: () => void;
-    constructor(requestFrame?: RequestFrameFn);
+    constructor(raf?: RequestFrameFn);
 }

cjs/FrameLoop.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var G = require("./globals");
+// The global `requestAnimationFrame` must be dereferenced to avoid "Illegal invocation" errors
+var requestAnimationFrame = function (fn) {
+    return (void 0, G.requestAnimationFrame)(fn);
+};
 /**
  * FrameLoop executes its animations in order of lowest priority first.
- * Animations are released once idle. The loop is paused while no animations
- * exist.
+ * Animations are retained until idle.
  */
 var FrameLoop = /** @class */ (function () {
-    function FrameLoop(
-    // The global `requestAnimationFrame` must be dereferenced to avoid "Illegal invocation" errors
-    requestFrame) {
-        if (requestFrame === void 0) { requestFrame = function (fn) { return (void 0, G.requestAnimationFrame)(fn); }; }
+    function FrameLoop(raf) {
+        if (raf === void 0) { raf = requestAnimationFrame; }
         var idle = true;
@@ -41,2 +42,13 @@ var writing = false;
         };
+        var loop = function () {
+            if (idle)
+                return;
+            try {
+                advance();
+                raf(loop);
+            }
+            catch (e) {
+                console.error(e);
+            }
+        };
         // Start the frameloop
@@ -49,3 +61,3 @@ var kickoff = function () {
                     lastTime = G.now();
-                    requestFrame(catchErrors(update));
+                    raf(loop);
                 }
@@ -70,3 +82,3 @@ }
         // Process the current frame.
-        var update = (this.update = function () {
+        var advance = (this.advance = function () {
             var time = G.now();
@@ -85,5 +97,6 @@ // Start animations that were added during last frame.
             }
-            if (!idle && time > lastTime) {
+            if (time > lastTime) {
                 // http://gafferongames.com/game-physics/fix-your-timestep/
                 var dt_1 = Math.min(64, time - lastTime);
+                lastTime = time;
                 G.batchedUpdates(function () {
@@ -116,8 +129,3 @@ // Animations can be added while the frameloop is updating,
                 });
-                if (!animations.length) {
-                    idle = true;
-                }
             }
-            lastTime = time;
-            requestFrame(catchErrors(update));
         });
@@ -150,6 +158,5 @@ this.start = function (animation) {
                 timeoutQueue.length = 0;
-                requestFrame = function () { };
             };
             Object.defineProperties(this, {
-                _idle: { get: function () { return idle; } },
+                _animations: { get: function () { return animations; } },
                 _dispose: { get: function () { return dispose_1; } },
@@ -167,12 +174,2 @@ });
 }
-function catchErrors(effect) {
-    return function () {
-        try {
-            effect();
-        }
-        catch (e) {
-            console.error(e);
-        }
-    };
-}
 //# sourceMappingURL=FrameLoop.js.map

cjs/globals.d.ts

@@ -13,3 +13,3 @@ import { FluidValue } from 'fluids';
 export declare let skipAnimation: boolean;
-export declare let requestAnimationFrame: (cb: (time: number) => void) => number;
+export declare let requestAnimationFrame: (cb: (time: number) => void) => void;
 export declare let batchedUpdates: (callback: () => void) => void;
@@ -16,0 +16,0 @@ export declare let willAdvance: (animations: OpaqueAnimation[]) => void;

cjs/helpers.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { Lookup } from './types.util';
@@ -31,8 +30,5 @@ export declare const noop: () => void;
 export declare const toArray: <T>(a: T) => Exclude<T, void> extends readonly any[] ? (readonly any[] & Exclude<T, void>)[number][] extends readonly any[] & Exclude<T, void> ? readonly (Exclude<T, void> extends readonly (infer U)[] ? U : Exclude<T, void>)[] : readonly any[] & Exclude<T, void> : readonly (Exclude<T, void> extends readonly (infer U_1)[] ? U_1 : Exclude<T, void>)[];
-declare type UseOnce = (effect: React.EffectCallback) => void;
-export declare const useOnce: UseOnce;
-/** Return a function that re-renders this component, if still mounted */
-export declare const useForceUpdate: () => () => void;
-/** Use a value from the previous render */
-export declare function usePrev<T>(value: T): T | undefined;
+/** Copy the `queue`, then iterate it after the `queue` is cleared */
+export declare function flush<P, T>(queue: Map<P, T>, iterator: (entry: [P, T]) => void): void;
+export declare function flush<T>(queue: Set<T>, iterator: (value: T) => void): void;
 export {};

cjs/helpers.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var react_1 = require("react");
 var G = require("./globals");
@@ -54,25 +53,10 @@ exports.noop = function () { };
 };
-exports.useOnce = function (effect) { return react_1.useEffect(effect, []); };
-/** Return a function that re-renders this component, if still mounted */
-exports.useForceUpdate = function () {
-    var update = react_1.useState(0)[1];
-    var unmounted = react_1.useRef(false);
-    exports.useOnce(function () { return function () {
-        unmounted.current = true;
-    }; });
-    return function () {
-        if (!unmounted.current) {
-            update({});
-        }
-    };
-};
-/** Use a value from the previous render */
-function usePrev(value) {
-    var prevRef = react_1.useRef(undefined);
-    react_1.useEffect(function () {
-        prevRef.current = value;
-    });
-    return prevRef.current;
+function flush(queue, iterator) {
+    if (queue.size) {
+        var items = Array.from(queue);
+        queue.clear();
+        exports.each(items, iterator);
+    }
 }
-exports.usePrev = usePrev;
+exports.flush = flush;
 //# sourceMappingURL=helpers.js.map

cjs/index.d.ts

@@ -5,2 +5,3 @@ import * as Globals from './globals';
 export * from './types.util';
+export * from './hooks';
 export * from './helpers';
@@ -7,0 +8,0 @@ export * from './FrameLoop';

cjs/index.js

@@ -7,2 +7,3 @@ "use strict";
 tslib_1.__exportStar(require("./types.util"), exports);
+tslib_1.__exportStar(require("./hooks"), exports);
 tslib_1.__exportStar(require("./helpers"), exports);
@@ -9,0 +10,0 @@ tslib_1.__exportStar(require("./FrameLoop"), exports);

cjs/stringInterpolation.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 var tslib_1 = require("tslib");
+var fluids_1 = require("fluids");
 var createInterpolator_1 = require("./createInterpolator");
@@ -38,3 +39,5 @@ var colorToRgba_1 = require("./colorToRgba");
     var output = config.output.map(function (value) {
-        return value.replace(colorRegex, colorToRgba_1.colorToRgba).replace(colorNamesRegex, colorToRgba_1.colorToRgba);
+        return fluids_1.getFluidValue(value)
+            .replace(colorRegex, colorToRgba_1.colorToRgba)
+            .replace(colorNamesRegex, colorToRgba_1.colorToRgba);
     });
@@ -41,0 +44,0 @@ // Convert ["1px 2px", "0px 0px"] into [[1, 2], [0, 0]]

esm/FrameLoop.d.ts

@@ -15,4 +15,3 @@ import { FrameRequestCallback } from './types';
  * FrameLoop executes its animations in order of lowest priority first.
- * Animations are released once idle. The loop is paused while no animations
- * exist.
+ * Animations are retained until idle.
  */
@@ -26,7 +25,5 @@ export declare class FrameLoop {
     /**
-     * Update every active animation.
-     *
-     * Can be passed to `requestAnimationFrame` without wrapping or binding.
+     * Advance the animations to the current time.
      */
-    update: () => void;
+    advance: () => void;
     /**
@@ -48,5 +45,5 @@ * Invoke the given `handler` on the soonest frame after the given
     onWrite: (cb: FrameRequestCallback) => void;
-    protected _idle: boolean;
+    protected _animations: OpaqueAnimation[];
     protected _dispose: () => void;
-    constructor(requestFrame?: RequestFrameFn);
+    constructor(raf?: RequestFrameFn);
 }

esm/FrameLoop.js

 import * as G from './globals';
+// The global `requestAnimationFrame` must be dereferenced to avoid "Illegal invocation" errors
+var requestAnimationFrame = function (fn) {
+    return (void 0, G.requestAnimationFrame)(fn);
+};
 /**
  * FrameLoop executes its animations in order of lowest priority first.
- * Animations are released once idle. The loop is paused while no animations
- * exist.
+ * Animations are retained until idle.
  */
 var FrameLoop = /** @class */ (function () {
-    function FrameLoop(
-    // The global `requestAnimationFrame` must be dereferenced to avoid "Illegal invocation" errors
-    requestFrame) {
-        if (requestFrame === void 0) { requestFrame = function (fn) { return (void 0, G.requestAnimationFrame)(fn); }; }
+    function FrameLoop(raf) {
+        if (raf === void 0) { raf = requestAnimationFrame; }
         var idle = true;
@@ -39,2 +40,13 @@ var writing = false;
         };
+        var loop = function () {
+            if (idle)
+                return;
+            try {
+                advance();
+                raf(loop);
+            }
+            catch (e) {
+                console.error(e);
+            }
+        };
         // Start the frameloop
@@ -47,3 +59,3 @@ var kickoff = function () {
                     lastTime = G.now();
-                    requestFrame(catchErrors(update));
+                    raf(loop);
                 }
@@ -68,3 +80,3 @@ }
         // Process the current frame.
-        var update = (this.update = function () {
+        var advance = (this.advance = function () {
             var time = G.now();
@@ -83,5 +95,6 @@ // Start animations that were added during last frame.
             }
-            if (!idle && time > lastTime) {
+            if (time > lastTime) {
                 // http://gafferongames.com/game-physics/fix-your-timestep/
                 var dt_1 = Math.min(64, time - lastTime);
+                lastTime = time;
                 G.batchedUpdates(function () {
@@ -114,8 +127,3 @@ // Animations can be added while the frameloop is updating,
                 });
-                if (!animations.length) {
-                    idle = true;
-                }
             }
-            lastTime = time;
-            requestFrame(catchErrors(update));
         });
@@ -148,6 +156,5 @@ this.start = function (animation) {
                 timeoutQueue.length = 0;
-                requestFrame = function () { };
             };
             Object.defineProperties(this, {
-                _idle: { get: function () { return idle; } },
+                _animations: { get: function () { return animations; } },
                 _dispose: { get: function () { return dispose_1; } },
@@ -165,12 +172,2 @@ });
 }
-function catchErrors(effect) {
-    return function () {
-        try {
-            effect();
-        }
-        catch (e) {
-            console.error(e);
-        }
-    };
-}
 //# sourceMappingURL=FrameLoop.js.map

esm/globals.d.ts

@@ -13,3 +13,3 @@ import { FluidValue } from 'fluids';
 export declare let skipAnimation: boolean;
-export declare let requestAnimationFrame: (cb: (time: number) => void) => number;
+export declare let requestAnimationFrame: (cb: (time: number) => void) => void;
 export declare let batchedUpdates: (callback: () => void) => void;
@@ -16,0 +16,0 @@ export declare let willAdvance: (animations: OpaqueAnimation[]) => void;

esm/helpers.d.ts

@@ -1,2 +0,1 @@
-/// <reference types="react" />
 import { Lookup } from './types.util';
@@ -31,8 +30,5 @@ export declare const noop: () => void;
 export declare const toArray: <T>(a: T) => Exclude<T, void> extends readonly any[] ? (readonly any[] & Exclude<T, void>)[number][] extends readonly any[] & Exclude<T, void> ? readonly (Exclude<T, void> extends readonly (infer U)[] ? U : Exclude<T, void>)[] : readonly any[] & Exclude<T, void> : readonly (Exclude<T, void> extends readonly (infer U_1)[] ? U_1 : Exclude<T, void>)[];
-declare type UseOnce = (effect: React.EffectCallback) => void;
-export declare const useOnce: UseOnce;
-/** Return a function that re-renders this component, if still mounted */
-export declare const useForceUpdate: () => () => void;
-/** Use a value from the previous render */
-export declare function usePrev<T>(value: T): T | undefined;
+/** Copy the `queue`, then iterate it after the `queue` is cleared */
+export declare function flush<P, T>(queue: Map<P, T>, iterator: (entry: [P, T]) => void): void;
+export declare function flush<T>(queue: Set<T>, iterator: (value: T) => void): void;
 export {};

esm/helpers.js

@@ -1,2 +0,1 @@
-import { useEffect, useRef, useState } from 'react';
 import * as G from './globals';
@@ -51,24 +50,9 @@ export var noop = function () { };
 };
-export var useOnce = function (effect) { return useEffect(effect, []); };
-/** Return a function that re-renders this component, if still mounted */
-export var useForceUpdate = function () {
-    var update = useState(0)[1];
-    var unmounted = useRef(false);
-    useOnce(function () { return function () {
-        unmounted.current = true;
-    }; });
-    return function () {
-        if (!unmounted.current) {
-            update({});
-        }
-    };
-};
-/** Use a value from the previous render */
-export function usePrev(value) {
-    var prevRef = useRef(undefined);
-    useEffect(function () {
-        prevRef.current = value;
-    });
-    return prevRef.current;
+export function flush(queue, iterator) {
+    if (queue.size) {
+        var items = Array.from(queue);
+        queue.clear();
+        each(items, iterator);
+    }
 }
 //# sourceMappingURL=helpers.js.map

esm/index.d.ts

@@ -5,2 +5,3 @@ import * as Globals from './globals';
 export * from './types.util';
+export * from './hooks';
 export * from './helpers';
@@ -7,0 +8,0 @@ export * from './FrameLoop';

esm/index.js

 import * as Globals from './globals';
 export { Globals };
 export * from './types.util';
+export * from './hooks';
 export * from './helpers';
@@ -5,0 +6,0 @@ export * from './FrameLoop';

esm/stringInterpolation.js

 import { __assign } from "tslib";
+import { getFluidValue } from 'fluids';
 import { createInterpolator } from './createInterpolator';
@@ -36,3 +37,5 @@ import { colorToRgba } from './colorToRgba';
     var output = config.output.map(function (value) {
-        return value.replace(colorRegex, colorToRgba).replace(colorNamesRegex, colorToRgba);
+        return getFluidValue(value)
+            .replace(colorRegex, colorToRgba)
+            .replace(colorNamesRegex, colorToRgba);
     });
@@ -39,0 +42,0 @@ // Convert ["1px 2px", "0px 0px"] into [[1, 2], [0, 0]]

package.json

 {
   "name": "@react-spring/shared",
-  "version": "9.0.0-rc.2",
+  "version": "9.0.0-rc.3",
   "description": "Globals and shared modules",
@@ -5,0 +5,0 @@ "homepage": "https://github.com/react-spring/react-spring/tree/master/packages/shared#readme",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

208923

increased by1.02%

Number of package files

101

increased by7.45%

Lines of code

2362

increased by0.98%

No dependency changes