@react-spring/shared - npm Package Compare versions

Comparing version 9.0.0-beta.33 to 9.0.0-canary.809.1.aa2db98.0

createInterpolator.d.ts

@@ -1,8 +0,2 @@
-import { Animatable, InterpolatorFn, ExtrapolateType, InterpolatorConfig, Interpolatable } from './types';
-interface InterpolatorFactory {
-    <In extends Interpolatable, Out extends Animatable>(interpolator: InterpolatorFn<In, Out>): typeof interpolator;
-    <In extends Interpolatable, Out extends Animatable>(config: InterpolatorConfig<Out>): (input: number) => Animatable<Out>;
-    <Out extends Animatable>(range: readonly number[], output: readonly Out[], extrapolate?: ExtrapolateType): (input: number) => Animatable<Out>;
-}
+import { InterpolatorFactory } from './types';
 export declare const createInterpolator: InterpolatorFactory;
-export {};

deprecations.js

@@ -8,3 +8,4 @@ "use strict";
         flagInterpolate = true;
-        console.warn(prefix + 'interpolate() will be deprecated in v10, use .to()');
+        console.warn(prefix +
+            'The "interpolate" function is deprecated in v10 (use "to" instead)');
     }
@@ -11,0 +12,0 @@ }

globals.d.ts

@@ -1,2 +0,2 @@
-import { SpringInterpolator, InterpolatorConfig } from './types';
+import { InterpolatorConfig, FrameRequestCallback, InterpolatorArgs, FluidValue, OneOrMore } from './types';
 import { ElementType } from 'react';
@@ -10,4 +10,2 @@ declare const window: {
 export declare let applyAnimatedValues: (node: any, props: any) => boolean | void;
-/** Provide a custom `interpolate` function */
-export declare let createAnimatedInterpolation: SpringInterpolator;
 /** Provide custom logic for string interpolation */
@@ -17,8 +15,14 @@ export declare let createStringInterpolator: (config: InterpolatorConfig<string>) => (input: number) => string;
 export declare let frameLoop: {
-    update: () => boolean;
-    controllers: Map<number, any>;
-    start(controller: any): void;
-    stop(controller: any): void;
+    active: boolean;
+    update: (time?: number) => boolean;
+    onFrame(cb: FrameRequestCallback, next?: boolean): void;
+    onWrite(cb: FrameRequestCallback): void;
+    start(spring: any): void;
+    stop(spring: any): typeof frameLoop;
 };
+export declare let to: <In, Out>(source: OneOrMore<FluidValue>, args: InterpolatorArgs<In, Out>) => FluidValue<Out>;
+/** Used for timestamps in milliseconds. Read more [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now) */
 export declare let now: () => number;
+/** Used to measure frame length. Read more [here](https://developer.mozilla.org/en-US/docs/Web/API/Performance/now) */
+export declare let performanceNow: () => number;
 /** Provide custom color names for interpolation */
@@ -39,2 +43,3 @@ export declare let colorNames: {
 export interface AnimatedGlobals {
+    to?: typeof to;
     now?: typeof now;
@@ -45,6 +50,6 @@ frameLoop?: typeof frameLoop;
     defaultElement?: typeof defaultElement;
+    performanceNow?: typeof performanceNow;
     getComponentProps?: typeof getComponentProps;
     applyAnimatedValues?: typeof applyAnimatedValues;
     createStringInterpolator?: typeof createStringInterpolator;
-    createAnimatedInterpolation?: typeof createAnimatedInterpolation;
     createAnimatedTransform?: typeof createAnimatedTransform;
@@ -51,0 +56,0 @@ createAnimatedStyle?: typeof createAnimatedStyle;

globals.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-//
-// Optional
-//
+/** Used for timestamps in milliseconds. Read more [here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/now) */
 exports.now = function () { return Date.now(); };
+/** Used to measure frame length. Read more [here](https://developer.mozilla.org/en-US/docs/Web/API/Performance/now) */
+exports.performanceNow = function () { return performance.now(); };
 /** Provide custom color names for interpolation */
@@ -22,2 +22,3 @@ exports.colorNames = null;
     return (_a = Object.assign({
+        to: exports.to,
         now: exports.now,
@@ -28,6 +29,6 @@ frameLoop: exports.frameLoop,
         defaultElement: exports.defaultElement,
+        performanceNow: exports.performanceNow,
         getComponentProps: exports.getComponentProps,
         applyAnimatedValues: exports.applyAnimatedValues,
         createStringInterpolator: exports.createStringInterpolator,
-        createAnimatedInterpolation: exports.createAnimatedInterpolation,
         createAnimatedTransform: exports.createAnimatedTransform,
@@ -37,3 +38,3 @@ createAnimatedStyle: exports.createAnimatedStyle,
         cancelAnimationFrame: exports.cancelAnimationFrame,
-    }, pluckDefined(globals)), exports.now = _a.now, exports.frameLoop = _a.frameLoop, exports.colorNames = _a.colorNames, exports.skipAnimation = _a.skipAnimation, exports.defaultElement = _a.defaultElement, exports.getComponentProps = _a.getComponentProps, exports.applyAnimatedValues = _a.applyAnimatedValues, exports.createStringInterpolator = _a.createStringInterpolator, exports.createAnimatedInterpolation = _a.createAnimatedInterpolation, exports.createAnimatedTransform = _a.createAnimatedTransform, exports.createAnimatedStyle = _a.createAnimatedStyle, exports.requestAnimationFrame = _a.requestAnimationFrame, exports.cancelAnimationFrame = _a.cancelAnimationFrame, _a);
+    }, pluckDefined(globals)), exports.to = _a.to, exports.now = _a.now, exports.frameLoop = _a.frameLoop, exports.colorNames = _a.colorNames, exports.skipAnimation = _a.skipAnimation, exports.defaultElement = _a.defaultElement, exports.performanceNow = _a.performanceNow, exports.getComponentProps = _a.getComponentProps, exports.applyAnimatedValues = _a.applyAnimatedValues, exports.createStringInterpolator = _a.createStringInterpolator, exports.createAnimatedTransform = _a.createAnimatedTransform, exports.createAnimatedStyle = _a.createAnimatedStyle, exports.requestAnimationFrame = _a.requestAnimationFrame, exports.cancelAnimationFrame = _a.cancelAnimationFrame, _a);
 };
@@ -44,3 +45,3 @@ // Ignore undefined values
     for (var key in globals) {
-        if (globals[key] !== void 0)
+        if (globals[key] !== undefined)
             defined[key] = globals[key];
@@ -47,0 +48,0 @@ }

helpers.d.ts

 /// <reference types="react" />
-import { Indexable } from './types';
+import { Indexable, FluidValue } from './types';
+export declare const FluidType = "__$FluidType";
+/** Let the given object be observed by any `FluidObserver` */
+export declare const makeFluidValue: <T extends Indexable<any>>(value: T) => T;
+export declare const isFluidValue: (value: any) => value is FluidValue<any>;
+export declare const defineHidden: (obj: any, key: any, value: any) => any;
 interface IsArray {
@@ -14,10 +19,14 @@ <T>(a: T): a is T & readonly any[];
 };
+/** Compare animatable values */
+export declare function isEqual(a: any, b: any): boolean;
+export declare const needsInterpolation: (value: unknown) => value is string;
 interface EachFn {
     <T = any, This = any>(obj: ReadonlySet<T>, cb: (this: This, value: T) => void, ctx?: This): void;
+    <P = any, T = any, This = any>(obj: ReadonlyMap<P, T>, cb: (this: This, value: T, key: P) => void, ctx?: This): void;
     <T = any, This = any>(arr: readonly T[], cb: (this: This, value: T, index: number) => void, ctx?: This): void;
-    <T = any, This = any>(obj: Indexable<T>, cb: (this: This, value: T, key: string) => void, ctx?: This): void;
+    <T extends Indexable = any, This = any>(obj: T, cb: (this: This, value: T[keyof T], key: keyof T) => void, ctx?: This): void;
 }
 /** An unsafe object/array/set iterator that allows for better minification */
 export declare const each: EachFn;
-export declare const toArray: <T>(a?: T | readonly T[] | undefined) => T[];
+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>)[];
 export declare const useOnce: (effect: import("react").EffectCallback) => void;
@@ -24,0 +33,0 @@ export declare const useForceUpdate: () => () => void;

helpers.js

 "use strict";
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 var react_1 = require("react");
+var G = __importStar(require("./globals"));
+exports.FluidType = '__$FluidType';
+/** Let the given object be observed by any `FluidObserver` */
+exports.makeFluidValue = function (value) {
+    return Object.defineProperty(value, exports.FluidType, { value: 1, writable: true });
+};
+exports.isFluidValue = function (value) {
+    return (value && value[exports.FluidType]) > 0;
+};
+exports.defineHidden = function (obj, key, value) {
+    return Object.defineProperty(obj, key, { value: value, writable: true, configurable: true });
+};
 exports.is = {
@@ -12,4 +31,25 @@ arr: Array.isArray,
     num: function (a) { return typeof a === 'number'; },
-    und: function (a) { return a === void 0; },
+    und: function (a) { return a === undefined; },
 };
+/** Compare animatable values */
+function isEqual(a, b) {
+    if (exports.is.arr(a)) {
+        if (!exports.is.arr(b) || a.length !== b.length)
+            return false;
+        for (var i = 0; i < a.length; i++) {
+            if (a[i] !== b[i])
+                return false;
+        }
+        return true;
+    }
+    return a === b;
+}
+exports.isEqual = isEqual;
+// Not all strings can be animated (eg: {display: "none"})
+exports.needsInterpolation = function (value) {
+    return exports.is.str(value) &&
+        (value[0] == '#' ||
+            /\d/.test(value) ||
+            !!(G.colorNames && G.colorNames[value]));
+};
 /** An unsafe object/array/set iterator that allows for better minification */
@@ -25,3 +65,3 @@ exports.each = function (obj, cb, ctx) {
 exports.toArray = function (a) {
-    return exports.is.und(a) ? [] : Array.isArray(a) ? a : [a];
+    return exports.is.und(a) ? [] : exports.is.arr(a) ? a : [a];
 };
@@ -28,0 +68,0 @@ exports.useOnce = function (effect) { return react_1.useEffect(effect, []); };

index.js

@@ -15,4 +15,5 @@ "use strict";
 exports.Globals = Globals;
+__export(require("./types"));
 __export(require("./helpers"));
 __export(require("./createInterpolator"));
 //# sourceMappingURL=index.js.map

normalizeColor.js

@@ -55,3 +55,3 @@ "use strict";
         return parseInt(match[1] + 'ff', 16) >>> 0;
-    if (G.colorNames && G.colorNames[color] !== void 0) {
+    if (G.colorNames && G.colorNames[color] !== undefined) {
         return G.colorNames[color];
@@ -58,0 +58,0 @@ }

package.json

 {
   "name": "@react-spring/shared",
-  "version": "9.0.0-beta.33",
+  "version": "9.0.0-canary.809.1.aa2db98.0",
   "description": "Globals and shared modules",
@@ -17,4 +17,3 @@ "homepage": "https://github.com/react-spring/react-spring/tree/master/packages/shared#readme",
   "dependencies": {
-    "@babel/runtime": "^7.3.1",
-    "tiny-invariant": "^1.0.4"
+    "@babel/runtime": "^7.3.1"
   },
@@ -21,0 +20,0 @@ "publishConfig": {

stringInterpolation.js

@@ -13,5 +13,2 @@ "use strict";
 };
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 var __importStar = (this && this.__importStar) || function (mod) {
@@ -27,3 +24,2 @@ if (mod && mod.__esModule) return mod;
 var colorToRgba_1 = require("./colorToRgba");
-var tiny_invariant_1 = __importDefault(require("tiny-invariant"));
 var G = __importStar(require("./globals"));
@@ -68,3 +64,5 @@ // Problem: https://github.com/animatedjs/animated/pull/102
         return keyframes.map(function (values) {
-            tiny_invariant_1.default(i in values, 'The arity of each "output" value must be equal');
+            if (!(i in values)) {
+                throw Error('The arity of each "output" value must be equal');
+            }
             return values[i];
@@ -75,3 +73,3 @@ });
     var interpolators = outputRanges.map(function (output) {
-        return createInterpolator_1.createInterpolator(__assign({}, config, { output: output }));
+        return createInterpolator_1.createInterpolator(__assign(__assign({}, config), { output: output }));
     });
@@ -78,0 +76,0 @@ // Use the first `output` as a template for each call

types/animated.d.ts

@@ -1,47 +0,25 @@
-import { Interpolator, ExtrapolateType, InterpolatorConfig } from './interpolation';
-import { Arrify, OneOrMore } from './common';
+/** @internal A value that changes over time (possibly every frame) */
+export interface FluidValue<T = any> {
+    get: () => T;
+    priority?: number;
+    addChild: (child: FluidObserver) => void;
+    removeChild: (child: FluidObserver) => void;
+}
+/** @internal An object that observes a `FluidValue` over time */
+export interface FluidObserver<T = any> {
+    /** An observed `FluidValue` had its value changed */
+    onParentChange(value: T, idle: boolean, parent: FluidValue<T>): void;
+    /** An observed `FluidValue` had its priority changed */
+    onParentPriorityChange(priority: number, parent: FluidValue<T>): void;
+}
+/** Add the `FluidValue` type to every property */
+export declare type FluidProps<T> = T extends object ? {
+    [P in keyof T]: T[P] | FluidValue<T[P]>;
+} : unknown;
 /** These types can be animated */
-export declare type Animatable<T = any> = T extends number ? number : T extends string ? string : T extends ReadonlyArray<any> ? ReadonlyArray<any> extends T ? ReadonlyArray<number | string> : {
+export declare type Animatable<T = any> = T extends number ? number : T extends string ? string : T extends ReadonlyArray<number | string> ? Array<number | string> extends T ? ReadonlyArray<number | string> : {
     [P in keyof T]: Animatable<T[P]>;
 } : never;
-/** An animated value which can be passed into an `animated` component */
-export interface SpringValue<T = any> {
-    /**
-     * Get the animated value. Automatically invoked when an `AnimatedValue`
-     * is assigned to a property of an `animated` element.
-     */
-    getValue(): T;
-    /**
-     * Interpolate the value with a custom interpolation function,
-     * a configuration object, or keyframe-like ranges.
-     *
-     * @example
-     *
-     * value.to(alpha => `rgba(255, 165, 0, ${alpha})`)
-     * value.to({ range: [0, 1], output: ['yellow', 'red'], extrapolate: 'clamp' })
-     * value.to([0, 0.25, 1], ['yellow', 'orange', 'red'])
-     */
-    to: Interpolator<Arrify<T>>;
-    /**
-     * @deprecated Use the `to` method instead. This will be removed in v10.
-     */
-    interpolate: Interpolator<Arrify<T>>;
-}
-export declare type RawValues<T extends ReadonlyArray<any>> = {
-    [P in keyof T]: T[P] extends {
-        getValue(): infer U;
-    } ? U : never;
-};
 export interface FrameRequestCallback {
-    (time: number): void;
+    (time?: number): void;
 }
-/**
- * This interpolates one or more `SpringValue` objects.
- * The exported `interpolate` function uses this type.
- */
-export interface SpringInterpolator {
-    <In extends Animatable, Out extends Animatable>(parent: SpringValue<In>, interpolator: (...args: Arrify<In>) => Out): SpringValue<Out>;
-    <In extends ReadonlyArray<SpringValue>, Out extends Animatable>(parents: In, interpolator: (...args: RawValues<In>) => Out): SpringValue<Out>;
-    <Out extends Animatable>(parents: OneOrMore<SpringValue>, config: InterpolatorConfig<Out>): SpringValue<Animatable<Out>>;
-    <Out extends Animatable>(parents: OneOrMore<SpringValue>, range: ReadonlyArray<number>, output: ReadonlyArray<Out>, extrapolate?: ExtrapolateType): SpringValue<Animatable<Out>>;
-}

types/common.d.ts

 export declare type Indexable<T = any> = {
     [key: string]: T;
+    [i: number]: T;
 };
 export declare type OneOrMore<T> = T | readonly T[];
 /** Ensure each type of `T` is an array */
-export declare type Arrify<T> = T extends ReadonlyArray<any> ? T : Readonly<[T]>;
+export declare type Arrify<T> = [T, T] extends [infer T, infer DT] ? DT extends ReadonlyArray<any> ? Array<DT[number]> extends DT ? ReadonlyArray<T extends ReadonlyArray<infer U> ? U : T> : DT : ReadonlyArray<T extends ReadonlyArray<infer U> ? U : T> : never;
 export declare type Falsy = false | null | undefined;
-export declare type OnEnd = () => void;
+export declare type AnyFn<In extends ReadonlyArray<any> = any[], Out = any> = (...args: In) => Out;
 /** For solving generic types */
@@ -16,3 +17,11 @@ export declare type Solve<T> = T;
 /** Override the property types of `A` with `B` and merge any new properties */
-export declare type Merge<A, B> = Remap<Omit<A, keyof B> & B>;
+export declare type Merge<A, B> = {
+    [P in keyof A]: P extends keyof B ? B[P] : A[P];
+} & Omit<B, keyof A>;
+/** Same as `Merge<A, B>` except the property descriptions from `B` override those of `A` */
+export declare type Overwrite<A, B> = Omit<A, keyof B> & B;
+/** An object partial with the same type for every value */
+export declare type KeyedPartial<K extends string | number, T> = {
+    [P in K]?: T;
+};
 /** Return the keys of `T` with values that are assignable to `U` */
@@ -22,1 +31,22 @@ export declare type AssignableKeys<T, U> = T extends object ? U extends object ? {
 }[Extract<keyof T, keyof U>] : never : never;
+/** Give "any" its own class */
+export declare class Any {
+    _: never;
+}
+/** Better type errors for overloads with generic types */
+export declare type Constrain<T, U> = [T] extends [Any] ? U : [T] extends [U] ? T : U;
+/** Ensure the given type is an object type */
+export declare type ObjectType<T> = T extends {} ? T : {};
+/** Intersected with other object types to allow for unknown properties */
+export declare type UnknownProps = Indexable<unknown>;
+export declare type UnknownPartial<T> = UnknownProps & Partial<T>;
+/** Extract string keys from an object type */
+export declare type StringKeys<T> = T extends object ? Extract<keyof T, string> : string;
+export declare type NoInfer<T> = [T][T extends any ? 0 : never];
+/** Intersect a union of objects but merge property types with _unions_ */
+export declare type ObjectFromUnion<T extends object> = Remap<{
+    [P in keyof Intersect<T>]: T extends infer U ? P extends keyof U ? U[P] : never : never;
+}>;
+/** Convert a union to an intersection */
+declare type Intersect<U> = (U extends any ? (k: U) => void : never) extends ((k: infer I) => void) ? I : never;
+export {};

types/index.js

 "use strict";
+function __export(m) {
+    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
+}
 Object.defineProperty(exports, "__esModule", { value: true });
+__export(require("./common"));
 //# sourceMappingURL=index.js.map

types/interpolation.d.ts

@@ -1,28 +0,13 @@
-import { Animatable, SpringValue } from './animated';
-import { Arrify } from './common';
+import { Arrify, Constrain, Animatable } from '../types';
 export declare type EasingFunction = (t: number) => number;
 export declare type ExtrapolateType = 'identity' | 'clamp' | 'extend';
-/** These types can be interpolated */
-export declare type Interpolatable = ReadonlyArray<number | string>;
-/**
- * Interpolate the value with a custom interpolation function,
- * a configuration object or keyframe-like ranges.
- *
- * @example
- *
- * interpolate(alpha => `rgba(255, 165, 0, ${alpha})`)
- * interpolate({ range: [0, 1], output: ['yellow', 'red'], extrapolate: 'clamp' })
- * interpolate([0, 0.25, 1], ['yellow', 'orange', 'red'])
- */
-export interface Interpolator<In extends ReadonlyArray<any> = any[]> {
-    <Out extends Animatable = Animatable>(range: readonly number[], output: readonly Out[], extrapolate?: ExtrapolateType): SpringValue<Animatable<Out>>;
-    <Out extends Animatable = Animatable>(config: InterpolatorConfig<Out> | InterpolatorFn<In, Out>): SpringValue<Out>;
+export interface InterpolatorFactory {
+    <In, Out>(interpolator: InterpolatorFn<In, Out>): typeof interpolator;
+    <Out>(config: InterpolatorConfig<Out>): (input: number) => Animatable<Out>;
+    <Out>(range: readonly number[], output: readonly Constrain<Out, Animatable>[], extrapolate?: ExtrapolateType): (input: number) => Animatable<Out>;
+    <In, Out>(...args: InterpolatorArgs<In, Out>): InterpolatorFn<In, Out>;
 }
-export declare type InterpolatorArgs<In = any, Out extends Animatable = Animatable> = [InterpolatorConfig<Out> | InterpolatorFn<Arrify<In>, Out>] | [readonly number[], readonly Out[], (ExtrapolateType | undefined)?];
-/**
- * An "interpolator" transforms an animated value. Animated arrays are spread
- * into the interpolator.
- */
-export declare type InterpolatorFn<In extends ReadonlyArray<any> = any[], Out = any> = (...input: In) => Out;
-export declare type InterpolatorConfig<Out extends Animatable = Animatable> = {
+export declare type InterpolatorArgs<In = any, Out = any> = [InterpolatorFn<Arrify<In>, Out>] | [InterpolatorConfig<Out>] | [readonly number[], readonly Constrain<Out, Animatable>[], (ExtrapolateType | undefined)?];
+export declare type InterpolatorFn<In, Out> = (...inputs: Arrify<In>) => Out;
+export declare type InterpolatorConfig<Out = Animatable> = {
     /**
@@ -72,3 +57,3 @@ * What happens when the spring goes below its target value.
      */
-    output: readonly Out[];
+    output: readonly Constrain<Out, Animatable>[];
     /**
@@ -75,0 +60,0 @@ * Transformation to apply to the value before interpolation.

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

95919

increased by6.03%

Dependency count

1

decreased by-50%

Lines of code

1105

increased by4.44%

Dependency changes

• - Removedtiny-invariant@^1.0.4

• - Removedtiny-invariant@1.3.3(transitive)