@shopify/react-native-skia 0.1.123 → 0.1.126

package/src/values/types.ts

@@ -30,7 +30,7 @@ export interface SkiaClockValue extends SkiaReadonlyValue<number> {
   stop: () => void;
 }
 
-export interface SkiaAnimation {
+export interface SkiaAnimation extends SkiaClockValue {
   cancel: () => void;
 }
 
@@ -38,3 +38,32 @@ export interface AnimationState {
   current: number;
   finished: boolean;
 }
+
+export interface ISkiaValueApi {
+  /**
+   * Creates a new value that holds the initial value and that
+   * can be changed.
+   */
+  createValue: <T>(initialValue: T) => SkiaValue<T>;
+  /**
+   * Creates a derived value. This is a calculated value that returns the result of
+   * a function that is called with the values of the dependencies.
+   */
+  createDerivedValue: <R>(
+    cb: () => R,
+    values: Array<SkiaReadonlyValue<unknown>>
+  ) => SkiaReadonlyValue<R>;
+  /**
+   * Creates a clock value where the value is the number of milliseconds elapsed
+   * since the clock was created
+   */
+  createClockValue: () => SkiaClockValue;
+  /**
+   * Creates an animation that is driven from a clock and updated every frame.
+   * @param cb Callback to calculate next value from time.
+   * @returns An animation object that can control a value.
+   */
+  createAnimation: <S extends AnimationState = AnimationState>(
+    cb: (t: number, state: S | undefined) => S
+  ) => SkiaAnimation;
+}

package/src/values/web/RNSkAnimation.ts

@@ -0,0 +1,33 @@
+import type { AnimationState, SkiaAnimation } from "../types";
+
+import { RNSkClockValue } from "./RNSkClockValue";
+
+export class RNSkAnimation<S extends AnimationState = AnimationState>
+  extends RNSkClockValue
+  implements SkiaAnimation
+{
+  constructor(
+    callback: (t: number, state: S | undefined) => S,
+    raf: (callback: (time: number) => void) => number
+  ) {
+    super(raf);
+    this._callback = callback;
+  }
+
+  private _callback: (t: number, state: S | undefined) => S;
+  private _animationState: S | undefined = undefined;
+
+  public cancel() {
+    this.stop();
+  }
+
+  protected update(nextValue: number): void {
+    if (this._callback) {
+      this._animationState = this._callback(nextValue, this._animationState);
+      if (this._animationState?.finished) {
+        this.stop();
+      }
+    }
+    super.update(this._animationState?.current ?? nextValue);
+  }
+}

package/src/values/web/RNSkClockValue.ts

@@ -0,0 +1,58 @@
+import type { SkiaClockValue } from "../types";
+
+import { RNSkReadonlyValue } from "./RNSkReadonlyValue";
+
+enum RNSkClockState {
+  NotStarted = 0,
+  Running = 1,
+  Stopped = 2,
+}
+
+export class RNSkClockValue
+  extends RNSkReadonlyValue<number>
+  implements SkiaClockValue
+{
+  constructor(raf: (callback: (time: number) => void) => number) {
+    super(0);
+    this._raf = raf;
+    this.update(0);
+  }
+
+  private _raf: (callback: (time: number) => void) => number;
+  private _start: number | undefined;
+  private _stop: number | undefined;
+  private _state: RNSkClockState = RNSkClockState.NotStarted;
+
+  private notifyUpdate = (_: number) => {
+    if (this._state === RNSkClockState.Running) {
+      const now = Date.now();
+      const deltaFromStart = now - this._start!;
+      this.tick(deltaFromStart);
+      this._raf(this.notifyUpdate);
+    }
+  };
+
+  protected tick(value: number) {
+    this.update(value);
+  }
+
+  public start() {
+    if (this._state === RNSkClockState.NotStarted) {
+      this._start = Date.now();
+      this._stop = this._start;
+    }
+    // Subtract pause time from start
+    const timeSinceStop = Date.now() - this._stop!;
+    this._start! += timeSinceStop;
+
+    this._state = RNSkClockState.Running;
+    this._raf(this.notifyUpdate);
+  }
+
+  public stop() {
+    if (this._state === RNSkClockState.Running) {
+      this._state = RNSkClockState.Stopped;
+      this._stop = Date.now();
+    }
+  }
+}

package/src/values/web/RNSkDerivedValue.ts

@@ -0,0 +1,38 @@
+import type { DependencyList } from "react";
+
+import { RNSkReadonlyValue } from "./RNSkReadonlyValue";
+
+export class RNSkDerivedValue<T> extends RNSkReadonlyValue<T> {
+  constructor(callback: () => T, dependencies: DependencyList) {
+    // Initialize dependencies - we can't call this yet, since
+    // super if not called and it requires a start value to be set.
+    const unsubscribers: Array<() => void> = [];
+    const notifyUpdateRef: { current: (() => void) | undefined } = {
+      current: undefined,
+    };
+    dependencies.forEach((dep) => {
+      if ("__typename__" in dep && "addListener" in dep) {
+        unsubscribers.push(
+          (dep as RNSkReadonlyValue<unknown>).addListener(() =>
+            notifyUpdateRef.current?.()
+          )
+        );
+      }
+    });
+    super(callback());
+    this._unsubscribers = unsubscribers;
+    notifyUpdateRef.current = this.dependecyUpdated.bind(this);
+    this._callback = callback;
+  }
+
+  private dependecyUpdated() {
+    this.update(this._callback());
+  }
+
+  private _callback: () => T;
+  private _unsubscribers: Array<() => void>;
+
+  public unsubscribe() {
+    this._unsubscribers.forEach((unsubscribe) => unsubscribe());
+  }
+}

package/src/values/web/RNSkReadonlyValue.ts

@@ -0,0 +1,32 @@
+import type { SkiaReadonlyValue } from "../types";
+
+export class RNSkReadonlyValue<T> implements SkiaReadonlyValue<T> {
+  constructor(value: T) {
+    this._current = value;
+  }
+
+  private _current: T;
+  private _listeners: Array<(value: T) => void> = [];
+
+  private notifyListeners(): void {
+    this._listeners.forEach((cb) => cb(this._current));
+  }
+
+  protected update(nextValue: T): void {
+    this._current = nextValue;
+    this.notifyListeners();
+  }
+
+  public readonly __typename__ = "RNSkValue";
+
+  public get current(): T {
+    return this._current;
+  }
+
+  public addListener(cb: (value: T) => void) {
+    this._listeners.push(cb);
+    return () => {
+      this._listeners.splice(this._listeners.indexOf(cb), 1);
+    };
+  }
+}

package/src/values/web/RNSkValue.ts

@@ -0,0 +1,57 @@
+import type { SkiaAnimation, SkiaValue } from "../types";
+
+import { RNSkReadonlyValue } from "./RNSkReadonlyValue";
+
+export class RNSkValue<T> extends RNSkReadonlyValue<T> implements SkiaValue<T> {
+  constructor(value: T) {
+    super(value);
+    this._unsubscribe = undefined;
+  }
+
+  public set current(value: T) {
+    this.update(value);
+  }
+
+  public get current(): T {
+    return super.current;
+  }
+
+  private _unsubscribe: (() => void) | undefined;
+
+  private unsubscribe() {
+    if (this._unsubscribe) {
+      this._unsubscribe();
+      this._unsubscribe = undefined;
+    }
+    if (this._animation) {
+      this._animation.cancel();
+      this._animation = undefined;
+    }
+  }
+
+  private subscribe(animation: SkiaAnimation | undefined) {
+    this.unsubscribe();
+    if (animation) {
+      this._animation = animation;
+      this._unsubscribe = animation.addListener(
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        this.animationDidUpdate.bind(this)
+      );
+      this._animation.start();
+    }
+  }
+
+  private animationDidUpdate(value: T) {
+    this.update(value);
+  }
+
+  private _animation: SkiaAnimation | undefined;
+  public get animation(): SkiaAnimation | undefined {
+    return this._animation;
+  }
+
+  public set animation(v: SkiaAnimation | undefined) {
+    this.subscribe(v);
+  }
+}

package/src/values/web/__tests__/RNSkAnimation.spec.ts

@@ -0,0 +1,21 @@
+import { RNSkAnimation } from "../RNSkAnimation";
+import { RNSkValue } from "../RNSkValue";
+
+describe("RNSkAnimation", () => {
+  it("should update a value", () => {
+    const valueToTest = new RNSkValue(0);
+    const raf = (cb: (t: number) => void) => {
+      cb(1);
+      return 1;
+    };
+    valueToTest.animation = new RNSkAnimation(
+      () => ({
+        finished: true,
+        current: 1,
+      }),
+      raf
+    );
+    valueToTest.animation.stop();
+    expect(valueToTest.current).toBe(1);
+  });
+});

package/src/values/web/__tests__/RNSkDerivedValue.spec.ts

@@ -0,0 +1,15 @@
+import { RNSkDerivedValue } from "../RNSkDerivedValue";
+import { RNSkValue } from "../RNSkValue";
+
+describe("RNSkDerivedValue", () => {
+  it("should update when dependency changes", () => {
+    const dependency = new RNSkValue(10);
+    const derived = new RNSkDerivedValue(
+      () => 10 * dependency.current,
+      [dependency]
+    );
+    expect(derived.current).toBe(100);
+    dependency.current = 20;
+    expect(derived.current).toBe(200);
+  });
+});

package/src/values/web/__tests__/RNSkReadonlyValue.spec.ts

@@ -0,0 +1,8 @@
+import { RNSkReadonlyValue } from "../RNSkReadonlyValue";
+
+describe("RNSkReadonlyValue", () => {
+  it("should expose __typename as RNSkValue", () => {
+    const valueToTest = new RNSkReadonlyValue(100);
+    expect(valueToTest.__typename__).toEqual("RNSkValue");
+  });
+});

package/src/values/web/__tests__/RNSkValue.spec.ts

@@ -0,0 +1,11 @@
+import { RNSkValue } from "../RNSkValue";
+
+describe("RNSkValue", () => {
+  it("should notify on change", () => {
+    const valueToTest = new RNSkValue(100);
+    const spy = jest.fn();
+    valueToTest.addListener(spy);
+    valueToTest.current = 200;
+    expect(spy).toHaveBeenCalledWith(200);
+  });
+});

package/src/values/web/api.ts

@@ -0,0 +1,33 @@
+import type {
+  ISkiaValueApi,
+  SkiaValue,
+  SkiaReadonlyValue,
+  SkiaClockValue,
+  AnimationState,
+  SkiaAnimation,
+} from "../types";
+
+import { RNSkAnimation } from "./RNSkAnimation";
+import { RNSkClockValue } from "./RNSkClockValue";
+import { RNSkDerivedValue } from "./RNSkDerivedValue";
+import { RNSkValue } from "./RNSkValue";
+
+export const ValueApi: ISkiaValueApi = {
+  createValue: function <T>(initialValue: T): SkiaValue<T> {
+    return new RNSkValue(initialValue);
+  },
+  createDerivedValue: function <R>(
+    cb: () => R,
+    values: SkiaReadonlyValue<unknown>[]
+  ): SkiaReadonlyValue<R> {
+    return new RNSkDerivedValue(cb, values);
+  },
+  createClockValue: function (): SkiaClockValue {
+    return new RNSkClockValue(requestAnimationFrame);
+  },
+  createAnimation: function <S extends AnimationState = AnimationState>(
+    cb: (t: number, state: S | undefined) => S
+  ): SkiaAnimation {
+    return new RNSkAnimation(cb, requestAnimationFrame);
+  },
+};

package/src/values/web/index.ts

@@ -0,0 +1 @@
+export * from "./api";

package/src/views/SkiaView.tsx

@@ -1,15 +1,11 @@
 import React from "react";
-import type { ViewProps } from "react-native";
 import { requireNativeComponent } from "react-native";
 
-import type { SkImage, SkRect } from "../skia";
+import type { SkRect } from "../skia";
 import type { SkiaReadonlyValue } from "../values";
 
-import type {
-  DrawMode,
-  RNSkiaDrawCallback,
-  NativeSkiaViewProps,
-} from "./types";
+import { SkiaViewApi } from "./api";
+import type { DrawMode, NativeSkiaViewProps, SkiaViewProps } from "./types";
 
 let SkiaViewNativeId = 1000;
 
@@ -17,48 +13,6 @@ const NativeSkiaView = requireNativeComponent<NativeSkiaViewProps>(
   "ReactNativeSkiaView"
 );
 
-declare global {
-  var SkiaViewApi: {
-    invalidateSkiaView: (nativeId: number) => void;
-    makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;
-    setDrawCallback: (
-      nativeId: number,
-      callback: RNSkiaDrawCallback | undefined
-    ) => void;
-    setDrawMode: (nativeId: number, mode: DrawMode) => void;
-    registerValuesInView: (
-      nativeId: number,
-      values: SkiaReadonlyValue<unknown>[]
-    ) => () => void;
-  };
-}
-
-const { SkiaViewApi } = global;
-
-export interface SkiaViewProps extends ViewProps {
-  /**
-   * Sets the drawing mode for the skia view. There are two drawing
-   * modes, "continuous" and "default", where the continuous mode will
-   * continuously redraw the view, and the default mode will only
-   * redraw when any of the regular react properties are changed like
-   * sizes and margins.
-   */
-  mode?: DrawMode;
-  /**
-   * When set to true the view will display information about the
-   * average time it takes to render.
-   */
-  debug?: boolean;
-  /**
-   * Draw callback. Will be called whenever the view is invalidated and
-   * needs to redraw. This is either caused by a change in a react
-   * property, a touch event, or a call to redraw. If the view is in
-   * continuous mode the callback will be called 60 frames per second
-   * by the native view.
-   */
-  onDraw?: RNSkiaDrawCallback;
-}
-
 export class SkiaView extends React.Component<SkiaViewProps> {
   constructor(props: SkiaViewProps) {
     super(props);

package/src/views/api.ts

@@ -0,0 +1,7 @@
+import type { ISkiaViewApi } from "./types";
+
+declare global {
+  var SkiaViewApi: ISkiaViewApi;
+}
+
+export const { SkiaViewApi } = global;

package/src/views/types.ts

@@ -1,6 +1,8 @@
 import type { ViewProps } from "react-native";
 
+import type { SkImage, SkRect } from "../skia";
 import type { SkCanvas } from "../skia/Canvas";
+import type { SkiaReadonlyValue } from "../values";
 
 export type DrawMode = "continuous" | "default";
 
@@ -54,3 +56,41 @@ export interface ValueListener {
   addListener: (callback: () => void) => number;
   removeListener: (id: number) => void;
 }
+
+export interface ISkiaViewApi {
+  invalidateSkiaView: (nativeId: number) => void;
+  makeImageSnapshot: (nativeId: number, rect?: SkRect) => SkImage;
+  setDrawCallback: (
+    nativeId: number,
+    callback: RNSkiaDrawCallback | undefined
+  ) => void;
+  setDrawMode: (nativeId: number, mode: DrawMode) => void;
+  registerValuesInView: (
+    nativeId: number,
+    values: SkiaReadonlyValue<unknown>[]
+  ) => () => void;
+}
+
+export interface SkiaViewProps extends ViewProps {
+  /**
+   * Sets the drawing mode for the skia view. There are two drawing
+   * modes, "continuous" and "default", where the continuous mode will
+   * continuously redraw the view, and the default mode will only
+   * redraw when any of the regular react properties are changed like
+   * sizes and margins.
+   */
+  mode?: DrawMode;
+  /**
+   * When set to true the view will display information about the
+   * average time it takes to render.
+   */
+  debug?: boolean;
+  /**
+   * Draw callback. Will be called whenever the view is invalidated and
+   * needs to redraw. This is either caused by a change in a react
+   * property, a touch event, or a call to redraw. If the view is in
+   * continuous mode the callback will be called 60 frames per second
+   * by the native view.
+   */
+  onDraw?: RNSkiaDrawCallback;
+}

package/lib/commonjs/values/animation/decay/runDecay.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["runDecay.ts"],"names":["runDecay","value","config","resolvedConfig","deceleration","velocityFactor","velocity","from","current","updateFunction","t","state","finished","lastTimestamp","startTimestamp","initialVelocity","animation","ValueApi","createAnimation"],"mappings":";;;;;;;AAAA;;AAGA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,QAAQ,GAAG,CAACC,KAAD,EAA2BC,MAA3B,KAAoD;AAC1E,QAAMC,cAAkC,GAAG;AACzCC,IAAAA,YAAY,EAAE,KAD2B;AAEzCC,IAAAA,cAAc,EAAE,CAFyB;AAGzCC,IAAAA,QAAQ,EAAE,CAH+B;AAIzCC,IAAAA,IAAI,EAAEN,KAAK,CAACO,OAJ6B;AAKzC,OAAGN;AALsC,GAA3C;;AAOA,QAAMO,cAAc,GAAG,CAACC,CAAD,EAAYC,KAAZ,KAA8C;AACnE,QAAI,CAACA,KAAL,EAAY;AACV,aAAO;AACLH,QAAAA,OAAO,EAAEL,cAAc,CAACI,IADnB;AAELK,QAAAA,QAAQ,EAAE,KAFL;AAGLC,QAAAA,aAAa,EAAEH,CAHV;AAILI,QAAAA,cAAc,EAAEJ,CAJX;AAKLK,QAAAA,eAAe,EAAEZ,cAAc,CAACG,QAL3B;AAMLA,QAAAA,QAAQ,EAAEH,cAAc,CAACG;AANpB,OAAP;AAQD;;AACD,WAAO,kBAAMI,CAAN,EAASC,KAAT,EAAgBR,cAAhB,CAAP;AACD,GAZD;;AAaAF,EAAAA,KAAK,CAACe,SAAN,GAAkBC,cAASC,eAAT,CAAyBT,cAAzB,CAAlB;AACA,SAAOR,KAAK,CAACe,SAAb;AACD,CAvBM","sourcesContent":["import { ValueApi } from \"../../api\";\nimport type { SkiaValue } from \"../../types\";\n\nimport { decay } from \"./decay\";\nimport type { DecayConfig, DefaultDecayConfig, DecayState } from \"./types\";\n\n/**\n * Runs a decay animation from the current value to zero with the given decay\n * configuration.\n * @param value value to animate\n * @param config Configuration or default configuration\n * @returns Animation\n */\nexport const runDecay = (value: SkiaValue<number>, config?: DecayConfig) => {\n  const resolvedConfig: DefaultDecayConfig = {\n    deceleration: 0.998,\n    velocityFactor: 1,\n    velocity: 0,\n    from: value.current,\n    ...config,\n  };\n  const updateFunction = (t: number, state: DecayState | undefined) => {\n    if (!state) {\n      return {\n        current: resolvedConfig.from,\n        finished: false,\n        lastTimestamp: t,\n        startTimestamp: t,\n        initialVelocity: resolvedConfig.velocity,\n        velocity: resolvedConfig.velocity,\n      };\n    }\n    return decay(t, state, resolvedConfig);\n  };\n  value.animation = ValueApi.createAnimation(updateFunction);\n  return value.animation;\n};\n"]}

package/lib/commonjs/values/animation/functions/interpolate.js

@@ -1,139 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.interpolate = interpolate;
-
-// eslint-disable-next-line max-len
-// Taken from https://github.com/facebook/react-native/blob/0b9ea60b4fee8cacc36e7160e31b91fc114dbc0d/Libraries/Animated/src/nodes/AnimatedInterpolation.js
-function interpolateFunction(input, inputRange, outputRange, options) {
-  const {
-    extrapolateLeft,
-    extrapolateRight,
-    easing
-  } = options;
-  let result = input;
-  const [inputMin, inputMax] = inputRange;
-  const [outputMin, outputMax] = outputRange;
-
-  if (result < inputMin) {
-    if (extrapolateLeft === "identity") {
-      return result;
-    }
-
-    if (extrapolateLeft === "clamp") {
-      result = inputMin;
-    } else if (extrapolateLeft === "extend") {// noop
-    }
-  }
-
-  if (result > inputMax) {
-    if (extrapolateRight === "identity") {
-      return result;
-    }
-
-    if (extrapolateRight === "clamp") {
-      result = inputMax;
-    } else if (extrapolateRight === "extend") {// noop
-    }
-  }
-
-  if (outputMin === outputMax) {
-    return outputMin;
-  } // Input Range
-
-
-  result = (result - inputMin) / (inputMax - inputMin); // Easing
-
-  result = easing(result); // Output Range
-
-  result = result * (outputMax - outputMin) + outputMin;
-  return result;
-}
-
-function findRange(input, inputRange) {
-  let i;
-
-  for (i = 1; i < inputRange.length - 1; ++i) {
-    if (inputRange[i] >= input) {
-      break;
-    }
-  }
-
-  return i - 1;
-}
-
-function checkValidInputRange(arr) {
-  for (let i = 1; i < arr.length; ++i) {
-    if (!(arr[i] > arr[i - 1])) {
-      throw new Error(`inputRange must be strictly monotonically non-decreasing but got [${arr.join(",")}]`);
-    }
-  }
-}
-
-function checkInfiniteRange(name, arr) {
-  if (arr.length < 2) {
-    throw new Error(name + " must have at least 2 elements");
-  }
-
-  for (const index in arr) {
-    if (typeof arr[index] !== "number") {
-      throw new Error(`${name} must contain only numbers`);
-    }
-
-    if (arr[index] === -Infinity || arr[index] === Infinity) {
-      throw new Error(`${name} must contain only finite numbers, but got [${arr.join(",")}]`);
-    }
-  }
-}
-
-function interpolate(input, inputRange, outputRange, options) {
-  var _options$easing;
-
-  if (typeof input === "undefined") {
-    throw new Error("input can not be undefined");
-  }
-
-  if (typeof inputRange === "undefined") {
-    throw new Error("inputRange can not be undefined");
-  }
-
-  if (typeof outputRange === "undefined") {
-    throw new Error("outputRange can not be undefined");
-  }
-
-  if (inputRange.length !== outputRange.length) {
-    throw new Error("inputRange (" + inputRange.length + ") and outputRange (" + outputRange.length + ") must have the same length");
-  }
-
-  checkInfiniteRange("inputRange", inputRange);
-  checkInfiniteRange("outputRange", outputRange);
-  checkValidInputRange(inputRange);
-  const easing = (_options$easing = options === null || options === void 0 ? void 0 : options.easing) !== null && _options$easing !== void 0 ? _options$easing : num => num;
-  let extrapolateLeft = "extend";
-
-  if ((options === null || options === void 0 ? void 0 : options.extrapolateLeft) !== undefined) {
-    // eslint-disable-next-line prefer-destructuring
-    extrapolateLeft = options.extrapolateLeft;
-  }
-
-  let extrapolateRight = "extend";
-
-  if ((options === null || options === void 0 ? void 0 : options.extrapolateRight) !== undefined) {
-    // eslint-disable-next-line prefer-destructuring
-    extrapolateRight = options.extrapolateRight;
-  }
-
-  if (typeof input !== "number") {
-    throw new TypeError("Cannot interpolate an input which is not a number");
-  }
-
-  const range = findRange(input, inputRange);
-  return interpolateFunction(input, [inputRange[range], inputRange[range + 1]], [outputRange[range], outputRange[range + 1]], {
-    easing,
-    extrapolateLeft,
-    extrapolateRight
-  });
-}
-//# sourceMappingURL=interpolate.js.map

package/lib/commonjs/values/animation/functions/interpolate.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["interpolate.ts"],"names":["interpolateFunction","input","inputRange","outputRange","options","extrapolateLeft","extrapolateRight","easing","result","inputMin","inputMax","outputMin","outputMax","findRange","i","length","checkValidInputRange","arr","Error","join","checkInfiniteRange","name","index","Infinity","interpolate","num","undefined","TypeError","range"],"mappings":"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","sourcesContent":["// eslint-disable-next-line max-len\n// Taken from https://github.com/facebook/react-native/blob/0b9ea60b4fee8cacc36e7160e31b91fc114dbc0d/Libraries/Animated/src/nodes/AnimatedInterpolation.js\n\ntype ExtrapolateType = \"extend\" | \"identity\" | \"clamp\";\n\nfunction interpolateFunction(\n  input: number,\n  inputRange: [number, number],\n  outputRange: [number, number],\n  options: {\n    easing: (input: number) => number;\n    extrapolateLeft: ExtrapolateType;\n    extrapolateRight: ExtrapolateType;\n  }\n): number {\n  const { extrapolateLeft, extrapolateRight, easing } = options;\n\n  let result = input;\n  const [inputMin, inputMax] = inputRange;\n  const [outputMin, outputMax] = outputRange;\n\n  if (result < inputMin) {\n    if (extrapolateLeft === \"identity\") {\n      return result;\n    }\n\n    if (extrapolateLeft === \"clamp\") {\n      result = inputMin;\n    } else if (extrapolateLeft === \"extend\") {\n      // noop\n    }\n  }\n\n  if (result > inputMax) {\n    if (extrapolateRight === \"identity\") {\n      return result;\n    }\n\n    if (extrapolateRight === \"clamp\") {\n      result = inputMax;\n    } else if (extrapolateRight === \"extend\") {\n      // noop\n    }\n  }\n\n  if (outputMin === outputMax) {\n    return outputMin;\n  }\n\n  // Input Range\n  result = (result - inputMin) / (inputMax - inputMin);\n\n  // Easing\n  result = easing(result);\n\n  // Output Range\n  result = result * (outputMax - outputMin) + outputMin;\n\n  return result;\n}\n\nfunction findRange(input: number, inputRange: readonly number[]) {\n  let i;\n  for (i = 1; i < inputRange.length - 1; ++i) {\n    if (inputRange[i] >= input) {\n      break;\n    }\n  }\n\n  return i - 1;\n}\n\nfunction checkValidInputRange(arr: readonly number[]) {\n  for (let i = 1; i < arr.length; ++i) {\n    if (!(arr[i] > arr[i - 1])) {\n      throw new Error(\n        `inputRange must be strictly monotonically non-decreasing but got [${arr.join(\n          \",\"\n        )}]`\n      );\n    }\n  }\n}\n\nfunction checkInfiniteRange(name: string, arr: readonly number[]) {\n  if (arr.length < 2) {\n    throw new Error(name + \" must have at least 2 elements\");\n  }\n\n  for (const index in arr) {\n    if (typeof arr[index] !== \"number\") {\n      throw new Error(`${name} must contain only numbers`);\n    }\n\n    if (arr[index] === -Infinity || arr[index] === Infinity) {\n      throw new Error(\n        `${name} must contain only finite numbers, but got [${arr.join(\",\")}]`\n      );\n    }\n  }\n}\n\nexport function interpolate(\n  input: number,\n  inputRange: readonly number[],\n  outputRange: readonly number[],\n  options?: {\n    easing?: (input: number) => number;\n    extrapolateLeft?: ExtrapolateType;\n    extrapolateRight?: ExtrapolateType;\n  }\n): number {\n  if (typeof input === \"undefined\") {\n    throw new Error(\"input can not be undefined\");\n  }\n\n  if (typeof inputRange === \"undefined\") {\n    throw new Error(\"inputRange can not be undefined\");\n  }\n\n  if (typeof outputRange === \"undefined\") {\n    throw new Error(\"outputRange can not be undefined\");\n  }\n\n  if (inputRange.length !== outputRange.length) {\n    throw new Error(\n      \"inputRange (\" +\n        inputRange.length +\n        \") and outputRange (\" +\n        outputRange.length +\n        \") must have the same length\"\n    );\n  }\n\n  checkInfiniteRange(\"inputRange\", inputRange);\n  checkInfiniteRange(\"outputRange\", outputRange);\n\n  checkValidInputRange(inputRange);\n\n  const easing = options?.easing ?? ((num: number): number => num);\n\n  let extrapolateLeft: ExtrapolateType = \"extend\";\n  if (options?.extrapolateLeft !== undefined) {\n    // eslint-disable-next-line prefer-destructuring\n    extrapolateLeft = options.extrapolateLeft;\n  }\n\n  let extrapolateRight: ExtrapolateType = \"extend\";\n  if (options?.extrapolateRight !== undefined) {\n    // eslint-disable-next-line prefer-destructuring\n    extrapolateRight = options.extrapolateRight;\n  }\n\n  if (typeof input !== \"number\") {\n    throw new TypeError(\"Cannot interpolate an input which is not a number\");\n  }\n\n  const range = findRange(input, inputRange);\n  return interpolateFunction(\n    input,\n    [inputRange[range], inputRange[range + 1]],\n    [outputRange[range], outputRange[range + 1]],\n    {\n      easing,\n      extrapolateLeft,\n      extrapolateRight,\n    }\n  );\n}\n"]}