@tamagui/animations-moti 1.15.34

package/dist/cjs/create-animations.js

@@ -0,0 +1,122 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var create_animations_exports = {};
+__export(create_animations_exports, {
+  createAnimations: () => createAnimations
+});
+module.exports = __toCommonJS(create_animations_exports);
+var import_use_presence = require("@tamagui/use-presence");
+var import_moti = require("moti");
+var import_react = require("react");
+var import_react_native_reanimated = __toESM(require("react-native-reanimated"));
+function createAnimations(animations) {
+  return {
+    View: import_react_native_reanimated.default.View,
+    Text: import_react_native_reanimated.default.Text,
+    isReactNative: true,
+    animations,
+    usePresence: import_use_presence.usePresence,
+    useAnimatedNumber(initial) {
+      const val = (0, import_react_native_reanimated.useSharedValue)(initial);
+      return (0, import_react.useMemo)(
+        () => ({
+          getInstance() {
+            "worklet";
+            return val.value;
+          },
+          getValue() {
+            "worklet";
+            return val.value;
+          },
+          setValue(next) {
+            "worklet";
+            val.value = next;
+          },
+          stop() {
+            "worklet";
+          }
+        }),
+        [val]
+      );
+    },
+    useAnimatedNumberReaction({ value }, onValue) {
+      return (0, import_react_native_reanimated.useAnimatedReaction)(
+        () => {
+          return value.getValue();
+        },
+        (next, prev) => {
+          if (prev !== next) {
+            (0, import_react_native_reanimated.runOnJS)(onValue)(next);
+          }
+        },
+        // dependency array is very important here
+        [value, onValue]
+      );
+    },
+    /**
+     * `getStyle` must be a worklet
+     */
+    useAnimatedNumberStyle(val, getStyle) {
+      return (0, import_react_native_reanimated.useDerivedValue)(() => {
+        return getStyle(val.getValue());
+      }, [val, getStyle]);
+    },
+    useAnimations: ({ props, presence, style, onDidAnimate }) => {
+      const animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation;
+      let animate = style;
+      const nonAnimatedStyle = { ...style };
+      const animateOnly = props.animateOnly ?? ["opacity", "transform"];
+      animate = {};
+      animateOnly.forEach((nonAnimatedKey) => {
+        if (!style[nonAnimatedKey])
+          return;
+        animate[nonAnimatedKey] = style[nonAnimatedKey];
+        delete style[nonAnimatedKey];
+      });
+      const animateStr = JSON.stringify(animate);
+      const moti = (0, import_moti.useMotify)({
+        // without this, the driver breaks on native
+        // stringifying -> parsing fixes that
+        animate: (0, import_react.useMemo)(() => JSON.parse(animateStr), [animateStr]),
+        transition: animations[animationKey],
+        onDidAnimate,
+        usePresenceValue: presence,
+        presenceContext: (0, import_react.useContext)(import_use_presence.PresenceContext)
+      });
+      return {
+        style: [nonAnimatedStyle, moti.style]
+      };
+    }
+  };
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  createAnimations
+});
+//# sourceMappingURL=create-animations.js.map

package/dist/cjs/create-animations.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/create-animations.tsx"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA6C;AAE7C,kBAA0C;AAC1C,mBAAoC;AACpC,qCAKO;AAEA,SAAS,iBACd,YACoB;AACpB,SAAO;AAAA,IACL,MAAM,+BAAAA,QAAS;AAAA,IACf,MAAM,+BAAAA,QAAS;AAAA,IACf,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IAEA,kBAAkB,SAA0C;AAC1D,YAAM,UAAM,+CAAe,OAAO;AAElC,iBAAO;AAAA,QACL,OAAO;AAAA,UACL,cAAc;AACZ;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,WAAW;AACT;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,SAAS,MAAM;AACb;AACA,gBAAI,QAAQ;AAAA,UACd;AAAA,UACA,OAAO;AACL;AAAA,UACF;AAAA,QACF;AAAA,QACA,CAAC,GAAG;AAAA,MACN;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,iBAAO;AAAA,QACL,MAAM;AACJ,iBAAO,MAAM,SAAS;AAAA,QACxB;AAAA,QACA,CAAC,MAAM,SAAS;AACd,cAAI,SAAS,MAAM;AAGjB,wDAAQ,OAAO,EAAE,IAAI;AAAA,UACvB;AAAA,QACF;AAAA;AAAA,QAEA,CAAC,OAAO,OAAO;AAAA,MACjB;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKA,uBAAuB,KAAK,UAAU;AACpC,iBAAO,gDAAgB,MAAM;AAC3B,eAAO,SAAS,IAAI,SAAS,CAAC;AAAA,MAEhC,GAAG,CAAC,KAAK,QAAQ,CAAC;AAAA,IACpB;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,aAAa,MAAM;AAC3D,YAAM,eAAe,MAAM,QAAQ,MAAM,SAAS,IAC9C,MAAM,UAAU,CAAC,IACjB,MAAM;AAEV,UAAI,UAAU;AACd,YAAM,mBAAuC,EAAE,GAAG,MAAM;AAExD,YAAM,cAAc,MAAM,eAAe,CAAC,WAAW,WAAW;AAEhE,gBAAU,CAAC;AACX,kBAAY,QAAQ,CAAC,mBAAmB;AACtC,YAAI,CAAC,MAAM,cAAc;AAAG;AAC5B,gBAAQ,cAAc,IAAI,MAAM,cAAc;AAC9C,eAAO,MAAM,cAAc;AAAA,MAC7B,CAAC;AAED,YAAM,aAAa,KAAK,UAAU,OAAO;AACzC,YAAM,WAAO,uBAAU;AAAA;AAAA;AAAA,QAGrB,aAAS,sBAAQ,MAAM,KAAK,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC;AAAA,QAC3D,YAAY,WAAW,YAAuC;AAAA,QAC9D;AAAA,QACA,kBAAkB;AAAA,QAClB,qBAAiB,yBAAW,mCAAe;AAAA,MAC7C,CAAC;AAED,aAAO;AAAA,QACL,OAAO,CAAC,kBAAkB,KAAK,KAAK;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AACF;",
+  "names": ["Animated"]
+}

package/dist/cjs/index.js

@@ -0,0 +1,24 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var src_exports = {};
+module.exports = __toCommonJS(src_exports);
+var import_polyfill = require("./polyfill");
+__reExport(src_exports, require("./create-animations"), module.exports);
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  ...require("./create-animations")
+});
+//# sourceMappingURL=index.js.map

package/dist/cjs/index.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/index.tsx"],
+  "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,sBAAO;AAEP,wBAAc,gCAFd;",
+  "names": []
+}

package/dist/cjs/polyfill.js

@@ -0,0 +1,5 @@
+"use strict";
+if (typeof requestAnimationFrame === "undefined") {
+  globalThis["requestAnimationFrame"] = setTimeout;
+}
+//# sourceMappingURL=polyfill.js.map

package/dist/cjs/polyfill.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/polyfill.ts"],
+  "mappings": ";AACA,IAAI,OAAO,0BAA0B,aAAa;AAChD,aAAW,uBAAuB,IAAI;AACxC;",
+  "names": []
+}

package/dist/esm/create-animations.js

@@ -0,0 +1,93 @@
+import { PresenceContext, usePresence } from "@tamagui/use-presence";
+import { useMotify } from "moti";
+import { useContext, useMemo } from "react";
+import Animated, {
+  runOnJS,
+  useAnimatedReaction,
+  useDerivedValue,
+  useSharedValue
+} from "react-native-reanimated";
+function createAnimations(animations) {
+  return {
+    View: Animated.View,
+    Text: Animated.Text,
+    isReactNative: true,
+    animations,
+    usePresence,
+    useAnimatedNumber(initial) {
+      const val = useSharedValue(initial);
+      return useMemo(
+        () => ({
+          getInstance() {
+            "worklet";
+            return val.value;
+          },
+          getValue() {
+            "worklet";
+            return val.value;
+          },
+          setValue(next) {
+            "worklet";
+            val.value = next;
+          },
+          stop() {
+            "worklet";
+          }
+        }),
+        [val]
+      );
+    },
+    useAnimatedNumberReaction({ value }, onValue) {
+      return useAnimatedReaction(
+        () => {
+          return value.getValue();
+        },
+        (next, prev) => {
+          if (prev !== next) {
+            runOnJS(onValue)(next);
+          }
+        },
+        // dependency array is very important here
+        [value, onValue]
+      );
+    },
+    /**
+     * `getStyle` must be a worklet
+     */
+    useAnimatedNumberStyle(val, getStyle) {
+      return useDerivedValue(() => {
+        return getStyle(val.getValue());
+      }, [val, getStyle]);
+    },
+    useAnimations: ({ props, presence, style, onDidAnimate }) => {
+      const animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation;
+      let animate = style;
+      const nonAnimatedStyle = { ...style };
+      const animateOnly = props.animateOnly ?? ["opacity", "transform"];
+      animate = {};
+      animateOnly.forEach((nonAnimatedKey) => {
+        if (!style[nonAnimatedKey])
+          return;
+        animate[nonAnimatedKey] = style[nonAnimatedKey];
+        delete style[nonAnimatedKey];
+      });
+      const animateStr = JSON.stringify(animate);
+      const moti = useMotify({
+        // without this, the driver breaks on native
+        // stringifying -> parsing fixes that
+        animate: useMemo(() => JSON.parse(animateStr), [animateStr]),
+        transition: animations[animationKey],
+        onDidAnimate,
+        usePresenceValue: presence,
+        presenceContext: useContext(PresenceContext)
+      });
+      return {
+        style: [nonAnimatedStyle, moti.style]
+      };
+    }
+  };
+}
+export {
+  createAnimations
+};
+//# sourceMappingURL=create-animations.js.map

package/dist/esm/create-animations.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/create-animations.tsx"],
+  "mappings": "AAAA,SAAS,iBAAiB,mBAAmB;AAE7C,SAAyB,iBAAiB;AAC1C,SAAS,YAAY,eAAe;AACpC,OAAO;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,iBACd,YACoB;AACpB,SAAO;AAAA,IACL,MAAM,SAAS;AAAA,IACf,MAAM,SAAS;AAAA,IACf,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IAEA,kBAAkB,SAA0C;AAC1D,YAAM,MAAM,eAAe,OAAO;AAElC,aAAO;AAAA,QACL,OAAO;AAAA,UACL,cAAc;AACZ;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,WAAW;AACT;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,SAAS,MAAM;AACb;AACA,gBAAI,QAAQ;AAAA,UACd;AAAA,UACA,OAAO;AACL;AAAA,UACF;AAAA,QACF;AAAA,QACA,CAAC,GAAG;AAAA,MACN;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,aAAO;AAAA,QACL,MAAM;AACJ,iBAAO,MAAM,SAAS;AAAA,QACxB;AAAA,QACA,CAAC,MAAM,SAAS;AACd,cAAI,SAAS,MAAM;AAGjB,oBAAQ,OAAO,EAAE,IAAI;AAAA,UACvB;AAAA,QACF;AAAA;AAAA,QAEA,CAAC,OAAO,OAAO;AAAA,MACjB;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKA,uBAAuB,KAAK,UAAU;AACpC,aAAO,gBAAgB,MAAM;AAC3B,eAAO,SAAS,IAAI,SAAS,CAAC;AAAA,MAEhC,GAAG,CAAC,KAAK,QAAQ,CAAC;AAAA,IACpB;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,aAAa,MAAM;AAC3D,YAAM,eAAe,MAAM,QAAQ,MAAM,SAAS,IAC9C,MAAM,UAAU,CAAC,IACjB,MAAM;AAEV,UAAI,UAAU;AACd,YAAM,mBAAuC,EAAE,GAAG,MAAM;AAExD,YAAM,cAAc,MAAM,eAAe,CAAC,WAAW,WAAW;AAEhE,gBAAU,CAAC;AACX,kBAAY,QAAQ,CAAC,mBAAmB;AACtC,YAAI,CAAC,MAAM,cAAc;AAAG;AAC5B,gBAAQ,cAAc,IAAI,MAAM,cAAc;AAC9C,eAAO,MAAM,cAAc;AAAA,MAC7B,CAAC;AAED,YAAM,aAAa,KAAK,UAAU,OAAO;AACzC,YAAM,OAAO,UAAU;AAAA;AAAA;AAAA,QAGrB,SAAS,QAAQ,MAAM,KAAK,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC;AAAA,QAC3D,YAAY,WAAW,YAAuC;AAAA,QAC9D;AAAA,QACA,kBAAkB;AAAA,QAClB,iBAAiB,WAAW,eAAe;AAAA,MAC7C,CAAC;AAED,aAAO;AAAA,QACL,OAAO,CAAC,kBAAkB,KAAK,KAAK;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AACF;",
+  "names": []
+}

package/dist/esm/create-animations.mjs

@@ -0,0 +1,93 @@
+import { PresenceContext, usePresence } from "@tamagui/use-presence";
+import { useMotify } from "moti";
+import { useContext, useMemo } from "react";
+import Animated, {
+  runOnJS,
+  useAnimatedReaction,
+  useDerivedValue,
+  useSharedValue
+} from "react-native-reanimated";
+function createAnimations(animations) {
+  return {
+    View: Animated.View,
+    Text: Animated.Text,
+    isReactNative: true,
+    animations,
+    usePresence,
+    useAnimatedNumber(initial) {
+      const val = useSharedValue(initial);
+      return useMemo(
+        () => ({
+          getInstance() {
+            "worklet";
+            return val.value;
+          },
+          getValue() {
+            "worklet";
+            return val.value;
+          },
+          setValue(next) {
+            "worklet";
+            val.value = next;
+          },
+          stop() {
+            "worklet";
+          }
+        }),
+        [val]
+      );
+    },
+    useAnimatedNumberReaction({ value }, onValue) {
+      return useAnimatedReaction(
+        () => {
+          return value.getValue();
+        },
+        (next, prev) => {
+          if (prev !== next) {
+            runOnJS(onValue)(next);
+          }
+        },
+        // dependency array is very important here
+        [value, onValue]
+      );
+    },
+    /**
+     * `getStyle` must be a worklet
+     */
+    useAnimatedNumberStyle(val, getStyle) {
+      return useDerivedValue(() => {
+        return getStyle(val.getValue());
+      }, [val, getStyle]);
+    },
+    useAnimations: ({ props, presence, style, onDidAnimate }) => {
+      const animationKey = Array.isArray(props.animation) ? props.animation[0] : props.animation;
+      let animate = style;
+      const nonAnimatedStyle = { ...style };
+      const animateOnly = props.animateOnly ?? ["opacity", "transform"];
+      animate = {};
+      animateOnly.forEach((nonAnimatedKey) => {
+        if (!style[nonAnimatedKey])
+          return;
+        animate[nonAnimatedKey] = style[nonAnimatedKey];
+        delete style[nonAnimatedKey];
+      });
+      const animateStr = JSON.stringify(animate);
+      const moti = useMotify({
+        // without this, the driver breaks on native
+        // stringifying -> parsing fixes that
+        animate: useMemo(() => JSON.parse(animateStr), [animateStr]),
+        transition: animations[animationKey],
+        onDidAnimate,
+        usePresenceValue: presence,
+        presenceContext: useContext(PresenceContext)
+      });
+      return {
+        style: [nonAnimatedStyle, moti.style]
+      };
+    }
+  };
+}
+export {
+  createAnimations
+};
+//# sourceMappingURL=create-animations.mjs.map

package/dist/esm/create-animations.mjs.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/create-animations.tsx"],
+  "mappings": "AAAA,SAAS,iBAAiB,mBAAmB;AAE7C,SAAyB,iBAAiB;AAC1C,SAAS,YAAY,eAAe;AACpC,OAAO;AAAA,EACL;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,iBACd,YACoB;AACpB,SAAO;AAAA,IACL,MAAM,SAAS;AAAA,IACf,MAAM,SAAS;AAAA,IACf,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IAEA,kBAAkB,SAA0C;AAC1D,YAAM,MAAM,eAAe,OAAO;AAElC,aAAO;AAAA,QACL,OAAO;AAAA,UACL,cAAc;AACZ;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,WAAW;AACT;AACA,mBAAO,IAAI;AAAA,UACb;AAAA,UACA,SAAS,MAAM;AACb;AACA,gBAAI,QAAQ;AAAA,UACd;AAAA,UACA,OAAO;AACL;AAAA,UACF;AAAA,QACF;AAAA,QACA,CAAC,GAAG;AAAA,MACN;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,aAAO;AAAA,QACL,MAAM;AACJ,iBAAO,MAAM,SAAS;AAAA,QACxB;AAAA,QACA,CAAC,MAAM,SAAS;AACd,cAAI,SAAS,MAAM;AAGjB,oBAAQ,OAAO,EAAE,IAAI;AAAA,UACvB;AAAA,QACF;AAAA;AAAA,QAEA,CAAC,OAAO,OAAO;AAAA,MACjB;AAAA,IACF;AAAA;AAAA;AAAA;AAAA,IAKA,uBAAuB,KAAK,UAAU;AACpC,aAAO,gBAAgB,MAAM;AAC3B,eAAO,SAAS,IAAI,SAAS,CAAC;AAAA,MAEhC,GAAG,CAAC,KAAK,QAAQ,CAAC;AAAA,IACpB;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,aAAa,MAAM;AAC3D,YAAM,eAAe,MAAM,QAAQ,MAAM,SAAS,IAC9C,MAAM,UAAU,CAAC,IACjB,MAAM;AAEV,UAAI,UAAU;AACd,YAAM,mBAAuC,EAAE,GAAG,MAAM;AAExD,YAAM,cAAc,MAAM,eAAe,CAAC,WAAW,WAAW;AAEhE,gBAAU,CAAC;AACX,kBAAY,QAAQ,CAAC,mBAAmB;AACtC,YAAI,CAAC,MAAM,cAAc;AAAG;AAC5B,gBAAQ,cAAc,IAAI,MAAM,cAAc;AAC9C,eAAO,MAAM,cAAc;AAAA,MAC7B,CAAC;AAED,YAAM,aAAa,KAAK,UAAU,OAAO;AACzC,YAAM,OAAO,UAAU;AAAA;AAAA;AAAA,QAGrB,SAAS,QAAQ,MAAM,KAAK,MAAM,UAAU,GAAG,CAAC,UAAU,CAAC;AAAA,QAC3D,YAAY,WAAW,YAAuC;AAAA,QAC9D;AAAA,QACA,kBAAkB;AAAA,QAClB,iBAAiB,WAAW,eAAe;AAAA,MAC7C,CAAC;AAED,aAAO;AAAA,QACL,OAAO,CAAC,kBAAkB,KAAK,KAAK;AAAA,MACtC;AAAA,IACF;AAAA,EACF;AACF;",
+  "names": []
+}

package/dist/esm/index.js

@@ -0,0 +1,3 @@
+import "./polyfill";
+export * from "./create-animations";
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/index.tsx"],
+  "mappings": "AAAA,OAAO;AAEP,cAAc;",
+  "names": []
+}

package/dist/esm/index.mjs

@@ -0,0 +1,3 @@
+import "./polyfill";
+export * from "./create-animations";
+//# sourceMappingURL=index.mjs.map

package/dist/esm/index.mjs.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/index.tsx"],
+  "mappings": "AAAA,OAAO;AAEP,cAAc;",
+  "names": []
+}

package/dist/esm/polyfill.js

@@ -0,0 +1,4 @@
+if (typeof requestAnimationFrame === "undefined") {
+  globalThis["requestAnimationFrame"] = setTimeout;
+}
+//# sourceMappingURL=polyfill.js.map

package/dist/esm/polyfill.js.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/polyfill.ts"],
+  "mappings": "AACA,IAAI,OAAO,0BAA0B,aAAa;AAChD,aAAW,uBAAuB,IAAI;AACxC;",
+  "names": []
+}

package/dist/esm/polyfill.mjs

@@ -0,0 +1,4 @@
+if (typeof requestAnimationFrame === "undefined") {
+  globalThis["requestAnimationFrame"] = setTimeout;
+}
+//# sourceMappingURL=polyfill.mjs.map

package/dist/esm/polyfill.mjs.map

@@ -0,0 +1,6 @@
+{
+  "version": 3,
+  "sources": ["../../src/polyfill.ts"],
+  "mappings": "AACA,IAAI,OAAO,0BAA0B,aAAa;AAChD,aAAW,uBAAuB,IAAI;AACxC;",
+  "names": []
+}

package/package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@tamagui/animations-moti",
+  "version": "1.15.34",
+  "source": "src/index.ts",
+  "license": "MIT",
+  "types": "./types/index.d.ts",
+  "main": "dist/cjs",
+  "module": "dist/esm",
+  "files": [
+    "src",
+    "types",
+    "dist"
+  ],
+  "dependencies": {
+    "@tamagui/use-presence": "1.15.34",
+    "@tamagui/web": "1.15.34"
+  },
+  "devDependencies": {
+    "@tamagui/build": "1.15.34",
+    "moti": "^0.25.1",
+    "react-native-reanimated": "^2.14.4"
+  },
+  "scripts": {
+    "build": "tamagui-build",
+    "watch": "tamagui-build --watch",
+    "clean": "tamagui-build clean",
+    "clean:build": "tamagui-build clean:build"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
+  "sideEffects": [
+    "./index.tsx",
+    "./polyfill.ts"
+  ]
+}

package/src/create-animations.tsx

@@ -0,0 +1,107 @@
+import { PresenceContext, usePresence } from '@tamagui/use-presence'
+import { AnimationDriver, UniversalAnimatedNumber } from '@tamagui/web'
+import { MotiTransition, useMotify } from 'moti'
+import { useContext, useMemo } from 'react'
+import Animated, {
+  runOnJS,
+  useAnimatedReaction,
+  useDerivedValue,
+  useSharedValue,
+} from 'react-native-reanimated'
+
+export function createAnimations<A extends Record<string, MotiTransition>>(
+  animations: A
+): AnimationDriver<A> {
+  return {
+    View: Animated.View,
+    Text: Animated.Text,
+    isReactNative: true,
+    animations,
+    usePresence,
+
+    useAnimatedNumber(initial): UniversalAnimatedNumber<number> {
+      const val = useSharedValue(initial)
+
+      return useMemo(
+        () => ({
+          getInstance() {
+            'worklet'
+            return val.value
+          },
+          getValue() {
+            'worklet'
+            return val.value
+          },
+          setValue(next) {
+            'worklet'
+            val.value = next
+          },
+          stop() {
+            'worklet'
+          },
+        }),
+        [val]
+      )
+    },
+
+    useAnimatedNumberReaction({ value }, onValue) {
+      return useAnimatedReaction(
+        () => {
+          return value.getValue()
+        },
+        (next, prev) => {
+          if (prev !== next) {
+            // @nate what is the point of this hook? is this necessary?
+            // without runOnJS, onValue would need to be a worklet
+            runOnJS(onValue)(next)
+          }
+        },
+        // dependency array is very important here
+        [value, onValue]
+      )
+    },
+
+    /**
+     * `getStyle` must be a worklet
+     */
+    useAnimatedNumberStyle(val, getStyle) {
+      return useDerivedValue(() => {
+        return getStyle(val.getValue())
+        // dependency array is very important here
+      }, [val, getStyle])
+    },
+
+    useAnimations: ({ props, presence, style, onDidAnimate }) => {
+      const animationKey = Array.isArray(props.animation)
+        ? props.animation[0]
+        : props.animation
+
+      let animate = style
+      const nonAnimatedStyle: object | undefined = { ...style }
+
+      const animateOnly = props.animateOnly ?? ['opacity', 'transform']
+
+      animate = {}
+      animateOnly.forEach((nonAnimatedKey) => {
+        if (!style[nonAnimatedKey]) return
+        animate[nonAnimatedKey] = style[nonAnimatedKey]
+        delete style[nonAnimatedKey]
+      })
+
+      const animateStr = JSON.stringify(animate)
+      const moti = useMotify({
+        // without this, the driver breaks on native
+        // stringifying -> parsing fixes that
+        animate: useMemo(() => JSON.parse(animateStr), [animateStr]),
+        transition: animations[animationKey as keyof typeof animations],
+        onDidAnimate,
+        usePresenceValue: presence as any,
+        presenceContext: useContext(PresenceContext),
+      })
+
+      return {
+        style: [nonAnimatedStyle, moti.style],
+      }
+    },
+  }
+}

package/src/index.tsx

@@ -0,0 +1,3 @@
+import './polyfill'
+
+export * from './create-animations'

package/src/polyfill.ts

@@ -0,0 +1,4 @@
+// for SSR
+if (typeof requestAnimationFrame === 'undefined') {
+  globalThis['requestAnimationFrame'] = setTimeout
+}

package/types/create-animations.d.ts

@@ -0,0 +1,4 @@
+import { AnimationDriver } from '@tamagui/web';
+import { MotiTransition } from 'moti';
+export declare function createAnimations<A extends Record<string, MotiTransition>>(animations: A): AnimationDriver<A>;
+//# sourceMappingURL=create-animations.d.ts.map

package/types/create-animations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"create-animations.d.ts","sourceRoot":"","sources":["../src/create-animations.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAA2B,MAAM,cAAc,CAAA;AACvE,OAAO,EAAE,cAAc,EAAa,MAAM,MAAM,CAAA;AAShD,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,EACvE,UAAU,EAAE,CAAC,GACZ,eAAe,CAAC,CAAC,CAAC,CA6FpB"}

package/types/index.d.ts

@@ -0,0 +1,3 @@
+import './polyfill';
+export * from './create-animations';
+//# sourceMappingURL=index.d.ts.map

package/types/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AAAA,OAAO,YAAY,CAAA;AAEnB,cAAc,qBAAqB,CAAA"}

package/types/polyfill.d.ts

@@ -0,0 +1 @@
+//# sourceMappingURL=polyfill.d.ts.map

package/types/polyfill.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"polyfill.d.ts","sourceRoot":"","sources":["../src/polyfill.ts"],"names":[],"mappings":""}