@shopify/react-native-skia 0.1.124 → 0.1.127

package/lib/module/values/animation/spring/useSpring.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["useSpring.ts"],"names":["useTiming","Spring","createSpringEasing","useSpring","toOrParams","config","callback","Config","Default"],"mappings":"AAMA,SAASA,SAAT,QAA0B,WAA1B;AAEA,SAASC,MAAT,QAAuB,UAAvB;AACA,SAASC,kBAAT,QAAmC,oBAAnC;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,SAAS,GAAG,CACvBC,UADuB,EAEvBC,MAFuB,EAGvBC,QAHuB,KAKvBN,SAAS,CACPI,UADO,EAEPF,kBAAkB,CAACG,MAAD,aAACA,MAAD,cAACA,MAAD,GAAWJ,MAAM,CAACM,MAAP,CAAcC,OAAzB,CAFX,EAGPF,QAHO,CALJ","sourcesContent":["import type { SkiaReadonlyValue } from \"../../types\";\nimport type {\n  SpringConfig,\n  AnimationParams,\n  AnimationCallback,\n} from \"../types\";\nimport { useTiming } from \"../timing\";\n\nimport { Spring } from \"./Spring\";\nimport { createSpringEasing } from \"./functions/spring\";\n\n/**\n * Creats a spring based animation value that will run whenever\n * the animation parameters change.\n * @param toOrParams\n * @param config\n * @returns\n */\nexport const useSpring = (\n  toOrParams: number | AnimationParams,\n  config?: SpringConfig,\n  callback?: AnimationCallback\n): SkiaReadonlyValue<number> =>\n  useTiming(\n    toOrParams,\n    createSpringEasing(config ?? Spring.Config.Default),\n    callback\n  );\n"]}

package/lib/module/values/animation/timing/createTiming.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["createTiming.ts"],"names":["ValueApi","timing","createTiming","params","value","callback","resolvedParams","from","current","animationFunction","t","state","nextState","duration","easing","loop","yoyo","finished","to","createAnimation"],"mappings":"AAMA,SAASA,QAAT,QAAyB,WAAzB;AAEA,SAASC,MAAT,QAAuB,aAAvB;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,YAAY,GAAG,CAC1BC,MAD0B,EAE1BC,KAF0B,EAG1BC,QAH0B,KAIvB;AAAA;;AACH;AACA;AACA,QAAMC,cAAc,GAAG,EACrB,GAAGH,MADkB;AAErBI,IAAAA,IAAI,0BAAEJ,MAAM,CAACI,IAAT,uDAAiBH,KAAjB,aAAiBA,KAAjB,uBAAiBA,KAAK,CAAEI,OAAxB,uCAAmC;AAFlB,GAAvB,CAHG,CAQH;;AACA,QAAMC,iBAAiB,GAAG,CAACC,CAAD,EAAYC,KAAZ,KAAkD;AAAA;;AAC1E;AACA,UAAMC,SAAS,GAAGX,MAAM,CACtBS,CADsB,EAEtBP,MAAM,CAACU,QAFe,EAGtBV,MAAM,CAACW,MAHe,kBAItBX,MAAM,CAACY,IAJe,uDAIP,KAJO,kBAKtBZ,MAAM,CAACa,IALe,uDAKP,KALO,EAMtBL,KANsB,aAMtBA,KANsB,cAMtBA,KANsB,GAMb;AAAEH,MAAAA,OAAO,EAAEL,MAAM,CAACI,IAAlB;AAAyBU,MAAAA,QAAQ,EAAE;AAAnC,KANa,CAAxB;AAQA,UAAMT,OAAO,GACXI,SAAS,CAACJ,OAAV,IAAqBF,cAAc,CAACY,EAAf,GAAoBZ,cAAc,CAACC,IAAxD,IACAD,cAAc,CAACC,IAFjB;;AAGA,QAAIF,QAAQ,IAAIO,SAAS,CAACK,QAAV,KAAuB,IAAvC,EAA6C;AAC3CZ,MAAAA,QAAQ,CAACG,OAAD,CAAR;AACD;;AACD,WAAO,EACL,GAAGI,SADE;AAELJ,MAAAA;AAFK,KAAP;AAID,GApBD,CATG,CA+BH;;;AACA,SAAOR,QAAQ,CAACmB,eAAT,CAAyBV,iBAAzB,CAAP;AACD,CArCM","sourcesContent":["import type {\n  TimingConfig,\n  RequiredAnimationParams,\n  AnimationCallback,\n} from \"../types\";\nimport type { AnimationState, SkiaValue } from \"../../types\";\nimport { ValueApi } from \"../../api\";\n\nimport { timing } from \"./functions\";\n\n/**\n * Creates an animation that is driven by a clock value.\n * The value will be run from / to the value in params and modified\n * by the provided easing curve for the length of the duration. When\n * the value has reached its desired \"to\" value the animation\n * will be stopped. If loop is set to true, the animation will continue\n * to run until stopped.\n *\n * @param params Animation parameters\n * @param config Spring or timing configuration\n * @param value Optional value that the animation will update\n * @params an animation value that can be used to start/stop\n * the animation.\n */\nexport const createTiming = (\n  params: RequiredAnimationParams & Required<TimingConfig>,\n  value?: SkiaValue<number>,\n  callback?: AnimationCallback\n) => {\n  // Update from to be either the declared from value,\n  // the current value of the value or zero\n  const resolvedParams = {\n    ...params,\n    from: params.from ?? value?.current ?? 0,\n  };\n\n  // Update function for the animation value\n  const animationFunction = (t: number, state: AnimationState | undefined) => {\n    // Update the input value using the provided update function\n    const nextState = timing(\n      t,\n      params.duration,\n      params.easing,\n      params.loop ?? false,\n      params.yoyo ?? false,\n      state ?? { current: params.from!, finished: false }\n    );\n    const current =\n      nextState.current * (resolvedParams.to - resolvedParams.from!) +\n      resolvedParams.from!;\n    if (callback && nextState.finished === true) {\n      callback(current);\n    }\n    return {\n      ...nextState,\n      current,\n    };\n  };\n\n  // Create animation value\n  return ValueApi.createAnimation(animationFunction);\n};\n"]}

package/lib/module/values/animation/timing/runTiming.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["runTiming.ts"],"names":["getResolvedParams","createTiming","runTiming","value","toOrParams","config","callback","resolvedParameters","animation"],"mappings":"AAOA,SAASA,iBAAT,QAAkC,aAAlC;AACA,SAASC,YAAT,QAA6B,gBAA7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,SAAS,GAAG,CACvBC,KADuB,EAEvBC,UAFuB,EAGvBC,MAHuB,EAIvBC,QAJuB,KAKL;AAClB,QAAMC,kBAAkB,GAAGP,iBAAiB,CAACI,UAAD,EAAaC,MAAb,CAA5C;AACA,QAAMG,SAAS,GAAGP,YAAY,CAACM,kBAAD,EAAqBJ,KAArB,EAA4BG,QAA5B,CAA9B;AACAH,EAAAA,KAAK,CAACK,SAAN,GAAkBA,SAAlB;AACA,SAAOA,SAAP;AACD,CAVM","sourcesContent":["import type { SkiaValue, SkiaAnimation } from \"../../types\";\nimport type {\n  AnimationParams,\n  TimingConfig,\n  AnimationCallback,\n} from \"../types\";\n\nimport { getResolvedParams } from \"./functions\";\nimport { createTiming } from \"./createTiming\";\n/**\n * Creates a new animation on an existing value that will be driven by\n * an animation value. The value will be run from / to the value in\n * params and modified by the provided easing curve for the length of\n * the duration. When the value has reached its desired \"to\" value the\n * animation will be stopped.\n *\n * @param value The value to animate\n * @param toOrParams To value or Animation parameters\n * @param config Spring or timing configuration\n * @returns an animation value that can be used to start/stop\n * the animation.\n */\nexport const runTiming = (\n  value: SkiaValue<number>,\n  toOrParams: number | AnimationParams,\n  config?: TimingConfig,\n  callback?: AnimationCallback\n): SkiaAnimation => {\n  const resolvedParameters = getResolvedParams(toOrParams, config);\n  const animation = createTiming(resolvedParameters, value, callback);\n  value.animation = animation;\n  return animation;\n};\n"]}

package/lib/module/values/animation/timing/useTiming.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["useTiming.ts"],"names":["useEffect","useMemo","useRef","useValue","getResolvedParams","createTiming","useTiming","toOrParams","config","callback","prevCfgRef","resolvedParameters","nextParams","equals","current","value","from","prevAnimationRef","prevParamsRef","animation","undefined","a","b","JSON","stringify"],"mappings":"AAAA,SAASA,SAAT,EAAoBC,OAApB,EAA6BC,MAA7B,QAA2C,OAA3C;AAQA,SAASC,QAAT,QAAyB,sBAAzB;AAEA,SAASC,iBAAT,QAAkC,aAAlC;AACA,SAASC,YAAT,QAA6B,gBAA7B;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,OAAO,MAAMC,SAAS,GAAG,CACvBC,UADuB,EAEvBC,MAFuB,EAGvBC,QAHuB,KAIO;AAAA;;AAC9B;AACA;AACA,QAAMC,UAAU,GAAGR,MAAM,EAAzB;AACA,QAAMS,kBAAkB,GAAGV,OAAO,CAAC,MAAM;AACvC,UAAMW,UAAU,GAAGR,iBAAiB,CAACG,UAAD,EAAaC,MAAb,CAApC;;AACA,QAAI,CAACK,MAAM,CAACH,UAAU,CAACI,OAAZ,EAAqBF,UAArB,CAAX,EAA6C;AAC3CF,MAAAA,UAAU,CAACI,OAAX,GAAqBF,UAArB;AACD;;AACD,WAAOF,UAAU,CAACI,OAAlB;AACD,GANiC,EAM/B,CAACN,MAAD,EAASD,UAAT,CAN+B,CAAlC,CAJ8B,CAY9B;;AACA,QAAMQ,KAAK,GAAGZ,QAAQ,0BAACQ,kBAAkB,CAACK,IAApB,yEAA4B,CAA5B,CAAtB,CAb8B,CAe9B;AACA;;AACA,QAAMC,gBAAgB,GAAGf,MAAM,EAA/B;AACA,QAAMgB,aAAa,GAAGhB,MAAM,EAA5B;AACA,QAAMiB,SAAS,GAAGlB,OAAO,CAAC,MAAM;AAC9B,QAAI,CAACY,MAAM,CAACK,aAAa,CAACJ,OAAf,EAAwBH,kBAAxB,CAAX,EAAwD;AACtDO,MAAAA,aAAa,CAACJ,OAAd,GAAwBH,kBAAxB;AACAM,MAAAA,gBAAgB,CAACH,OAAjB,GAA2BT,YAAY,CACrCM,kBADqC,EAErCI,KAFqC,EAGrCN,QAHqC,CAAvC;AAKD;;AACD,WAAOQ,gBAAgB,CAACH,OAAxB;AACD,GAVwB,EAUtB,CAACL,QAAD,EAAWE,kBAAX,EAA+BI,KAA/B,CAVsB,CAAzB,CAnB8B,CA+B9B;;AACAf,EAAAA,SAAS,CAAC,MAAM;AACde,IAAAA,KAAK,CAACI,SAAN,GAAkBA,SAAlB;AACA,WAAO,MAAOJ,KAAK,CAACI,SAAN,GAAkBC,SAAhC;AACD,GAHQ,EAGN,CAACD,SAAD,EAAYJ,KAAZ,CAHM,CAAT,CAhC8B,CAqC9B;;AACA,SAAOA,KAAP;AACD,CA3CM;;AA6CP,MAAMF,MAAM,GAAG,CAASQ,CAAT,EAAgBC,CAAhB,KAA0B;AACvC,SAAOC,IAAI,CAACC,SAAL,CAAeH,CAAf,MAAsBE,IAAI,CAACC,SAAL,CAAeF,CAAf,CAA7B;AACD,CAFD","sourcesContent":["import { useEffect, useMemo, useRef } from \"react\";\n\nimport type { SkiaReadonlyValue, SkiaAnimation } from \"../../types\";\nimport type {\n  AnimationParams,\n  TimingConfig,\n  AnimationCallback,\n} from \"../types\";\nimport { useValue } from \"../../hooks/useValue\";\n\nimport { getResolvedParams } from \"./functions\";\nimport { createTiming } from \"./createTiming\";\n\n/**\n * Creats an animation value that will run whenever\n * the animation parameters change. The animation start immediately.\n * @param toOrParams\n * @param config\n * @returns A value that is animated\n */\nexport const useTiming = (\n  toOrParams: number | AnimationParams,\n  config?: TimingConfig,\n  callback?: AnimationCallback\n): SkiaReadonlyValue<number> => {\n  // Resolve parameters - keep a cached version to avoid\n  // unnecesary re-renders.\n  const prevCfgRef = useRef<ReturnType<typeof getResolvedParams>>();\n  const resolvedParameters = useMemo(() => {\n    const nextParams = getResolvedParams(toOrParams, config);\n    if (!equals(prevCfgRef.current, nextParams)) {\n      prevCfgRef.current = nextParams;\n    }\n    return prevCfgRef.current!;\n  }, [config, toOrParams]);\n\n  // Create value\n  const value = useValue(resolvedParameters.from ?? 0);\n\n  // Create timing animation - keep a cached version to avoid\n  // uneccessary recreation of animations\n  const prevAnimationRef = useRef<SkiaAnimation>();\n  const prevParamsRef = useRef<typeof resolvedParameters>();\n  const animation = useMemo(() => {\n    if (!equals(prevParamsRef.current, resolvedParameters)) {\n      prevParamsRef.current = resolvedParameters;\n      prevAnimationRef.current = createTiming(\n        resolvedParameters,\n        value,\n        callback\n      );\n    }\n    return prevAnimationRef.current!;\n  }, [callback, resolvedParameters, value]);\n\n  // Run animation on the value - and stop it on unmount\n  useEffect(() => {\n    value.animation = animation;\n    return () => (value.animation = undefined);\n  }, [animation, value]);\n\n  // Return the value that is animated\n  return value;\n};\n\nconst equals = <T1, T2>(a: T1, b: T2) => {\n  return JSON.stringify(a) === JSON.stringify(b);\n};\n"]}

package/lib/typescript/scripts/install-npm.d.ts

@@ -1 +0,0 @@
-export {};

package/lib/typescript/src/values/animation/functions/interpolate.d.ts

@@ -1,7 +0,0 @@
-declare type ExtrapolateType = "extend" | "identity" | "clamp";
-export declare function interpolate(input: number, inputRange: readonly number[], outputRange: readonly number[], options?: {
-    easing?: (input: number) => number;
-    extrapolateLeft?: ExtrapolateType;
-    extrapolateRight?: ExtrapolateType;
-}): number;
-export {};

package/lib/typescript/src/values/animation/functions/interpolateColors.d.ts

@@ -1,3 +0,0 @@
-import type { Color } from "../../../skia";
-export declare const interpolateColors: (value: number, inputRange: number[], _outputRange: Color[]) => number;
-export declare const mixColors: (value: number, x: number, y: number) => number;

package/src/values/animation/functions/interpolate.ts

@@ -1,169 +0,0 @@
-// eslint-disable-next-line max-len
-// Taken from https://github.com/facebook/react-native/blob/0b9ea60b4fee8cacc36e7160e31b91fc114dbc0d/Libraries/Animated/src/nodes/AnimatedInterpolation.js
-
-type ExtrapolateType = "extend" | "identity" | "clamp";
-
-function interpolateFunction(
-  input: number,
-  inputRange: [number, number],
-  outputRange: [number, number],
-  options: {
-    easing: (input: number) => number;
-    extrapolateLeft: ExtrapolateType;
-    extrapolateRight: ExtrapolateType;
-  }
-): number {
-  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: number, inputRange: readonly number[]) {
-  let i;
-  for (i = 1; i < inputRange.length - 1; ++i) {
-    if (inputRange[i] >= input) {
-      break;
-    }
-  }
-
-  return i - 1;
-}
-
-function checkValidInputRange(arr: readonly number[]) {
-  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: string, arr: readonly number[]) {
-  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(",")}]`
-      );
-    }
-  }
-}
-
-export function interpolate(
-  input: number,
-  inputRange: readonly number[],
-  outputRange: readonly number[],
-  options?: {
-    easing?: (input: number) => number;
-    extrapolateLeft?: ExtrapolateType;
-    extrapolateRight?: ExtrapolateType;
-  }
-): number {
-  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 ?? ((num: number): number => num);
-
-  let extrapolateLeft: ExtrapolateType = "extend";
-  if (options?.extrapolateLeft !== undefined) {
-    // eslint-disable-next-line prefer-destructuring
-    extrapolateLeft = options.extrapolateLeft;
-  }
-
-  let extrapolateRight: ExtrapolateType = "extend";
-  if (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,
-    }
-  );
-}

package/src/values/animation/functions/interpolateColors.ts

@@ -1,62 +0,0 @@
-import { mix } from "../../../renderer";
-import type { Color } from "../../../skia";
-import { alphaf, blue, green, red, rgbaColor, Skia } from "../../../skia";
-
-import { interpolate } from "./interpolate";
-
-const CLAMP = {
-  extrapolateLeft: "clamp",
-  extrapolateRight: "clamp",
-} as const;
-
-const interpolateColorsRGB = (
-  value: number,
-  inputRange: number[],
-  outputRange: number[]
-) => {
-  const r = interpolate(
-    value,
-    inputRange,
-    outputRange.map((c) => red(c)),
-    CLAMP
-  );
-  const g = interpolate(
-    value,
-    inputRange,
-    outputRange.map((c) => green(c)),
-    CLAMP
-  );
-  const b = interpolate(
-    value,
-    inputRange,
-    outputRange.map((c) => blue(c)),
-    CLAMP
-  );
-  const a = interpolate(
-    value,
-    inputRange,
-    outputRange.map((c) => alphaf(c)),
-    CLAMP
-  );
-  return rgbaColor(r, g, b, a);
-};
-
-export const interpolateColors = (
-  value: number,
-  inputRange: number[],
-  _outputRange: Color[]
-) => {
-  const outputRange = _outputRange.map((cl) => Skia.Color(cl));
-  return interpolateColorsRGB(value, inputRange, outputRange);
-};
-
-// This is fast. To be reconcilled with interpolateColors
-// it looks like interpolateColors may not be working as expected
-// these functions need to be tested more thoroughly on both platform
-export const mixColors = (value: number, x: number, y: number) => {
-  const r = mix(value, red(x), red(y));
-  const g = mix(value, green(x), green(y));
-  const b = mix(value, blue(x), blue(y));
-  const a = mix(value, alphaf(x), alphaf(y));
-  return rgbaColor(r, g, b, a);
-};