@tamagui/animations-moti 1.90.2 → 1.90.4

package/dist/cjs/createAnimations.js

@@ -25,11 +25,53 @@ __export(createAnimations_exports, {
   createAnimations: () => createAnimations
 });
 module.exports = __toCommonJS(createAnimations_exports);
-var import_use_presence = require("@tamagui/use-presence"), import_author = require("moti/author"), import_react = require("react"), import_react_native_reanimated = __toESM(require("react-native-reanimated"));
+var import_use_presence = require("@tamagui/use-presence"), import_web = require("@tamagui/web"), import_author = require("moti/author"), import_react = require("react"), import_react_native_reanimated = __toESM(require("react-native-reanimated")), import_jsx_runtime = require("react/jsx-runtime");
+function createTamaguiAnimatedComponent(tag = "div") {
+  const Component = import_react_native_reanimated.default.createAnimatedComponent(
+    (0, import_react.forwardRef)(({ forwardedRef, style, ...props }, ref) => {
+      const composedRefs = (0, import_web.useComposedRefs)(forwardedRef, ref), Element = props.tag || tag;
+      return style && Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform)), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Element, { ...props, style, ref: composedRefs });
+    })
+  );
+  return Component.acceptTagProp = !0, Component;
+}
+const AnimatedView = createTamaguiAnimatedComponent("div"), AnimatedText = createTamaguiAnimatedComponent("span"), neverAnimate = {
+  alignItems: !0,
+  backdropFilter: !0,
+  borderBottomStyle: !0,
+  borderLeftStyle: !0,
+  borderRightStyle: !0,
+  borderStyle: !0,
+  borderTopStyle: !0,
+  boxSizing: !0,
+  contain: !0,
+  cursor: !0,
+  display: !0,
+  flexBasis: !0,
+  flexDirection: !0,
+  flexShrink: !0,
+  justifyContent: !0,
+  maxHeight: !0,
+  maxWidth: !0,
+  minHeight: !0,
+  minWidth: !0,
+  outlineStyle: !0,
+  overflow: !0,
+  overflowX: !0,
+  overflowY: !0,
+  pointerEvents: !0,
+  position: !0,
+  shadowColor: !0,
+  textAlign: !0,
+  textOverflow: !0,
+  whiteSpace: !0,
+  wordWrap: !0,
+  zIndex: !0
+};
 function createAnimations(animations) {
   return {
-    View: import_react_native_reanimated.default.View,
-    Text: import_react_native_reanimated.default.Text,
+    View: import_web.isWeb ? AnimatedView : import_react_native_reanimated.default.View,
+    Text: import_web.isWeb ? AnimatedText : import_react_native_reanimated.default.Text,
     isReactNative: !0,
     animations,
     usePresence: import_use_presence.usePresence,
@@ -83,26 +125,14 @@ function createAnimations(animations) {
         dontAnimate = style;
       else {
         const animateOnly = props.animateOnly;
-        if (animateOnly) {
-          dontAnimate = { ...style };
-          for (const key of animateOnly)
-            key in style && (animate[key] = style[key], delete dontAnimate[key]);
-        } else
-          animate = style;
+        for (const key in style)
+          !import_web.stylePropsAll[key] || neverAnimate[key] || animateOnly && !animateOnly.includes(key) ? dontAnimate[key] = style[key] : animate[key] = style[key];
       }
-      const animateStr = JSON.stringify(animate), styles = (0, import_react.useMemo)(() => JSON.parse(animateStr), [animateStr]), isExiting = !!presence?.[1], sendExitComplete = presence?.[1], onDidAnimateCombined = (0, import_react.useCallback)(() => {
-        onDidAnimate?.(), sendExitComplete?.();
-      }, []), motiProps = {
+      const animateStr = JSON.stringify(animate), styles = (0, import_react.useMemo)(() => JSON.parse(animateStr), [animateStr]), isExiting = !!presence?.[1], presenceContext = (0, import_react.useContext)(import_use_presence.PresenceContext), usePresenceValue = presence || void 0, motiProps = {
         animate: isExiting || isHydrating ? {} : styles,
         transition: animations[animationKey],
-        // isHydrating
-        //   ? ({ type: 'timing', duration: 0 } as const)
-        //   : componentState.unmounted
-        //     ? { type: 'timing', duration: 0 }
-        //     : animations[animationKey as keyof typeof animations]
-        onDidAnimate: onDidAnimateCombined,
-        usePresenceValue: presence,
-        presenceContext: (0, import_react.useContext)(import_use_presence.PresenceContext),
+        usePresenceValue,
+        presenceContext,
         exit: isExiting ? styles : void 0
       }, moti = (0, import_author.useMotify)(motiProps);
       return process.env.NODE_ENV === "development" && props.debug && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {

package/dist/cjs/createAnimations.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/createAnimations.tsx"],
-  "mappings": "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",
+  "mappings": "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",
   "names": ["Animated"]
 }

package/dist/cjs/createAnimations.native.js

@@ -26,7 +26,7 @@ __export(createAnimations_exports, {
   createAnimations: () => createAnimations
 });
 module.exports = __toCommonJS(createAnimations_exports);
-var import_use_presence = require("@tamagui/use-presence"), import_author = require("moti/author"), import_react = require("react"), import_react_native_reanimated = __toESM(require("react-native-reanimated"));
+var import_jsx_runtime = require("react/jsx-runtime"), import_use_presence = require("@tamagui/use-presence"), import_web = require("@tamagui/web"), import_author = require("moti/author"), import_react = require("react"), import_react_native_reanimated = __toESM(require("react-native-reanimated"));
 function _define_property(obj, key, value) {
   return key in obj ? Object.defineProperty(obj, key, {
     value,
@@ -37,19 +37,99 @@ function _define_property(obj, key, value) {
 }
 function _object_spread(target) {
   for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {}, ownKeys = Object.keys(source);
-    typeof Object.getOwnPropertySymbols == "function" && (ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+    var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
+    typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
       return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-    }))), ownKeys.forEach(function(key) {
+    }))), ownKeys2.forEach(function(key) {
       _define_property(target, key, source[key]);
     });
   }
   return target;
 }
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _object_spread_props(target, source) {
+  return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+    Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+  }), target;
+}
+function _object_without_properties(source, excluded) {
+  if (source == null)
+    return {};
+  var target = _object_without_properties_loose(source, excluded), key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++)
+      key = sourceSymbolKeys[i], !(excluded.indexOf(key) >= 0) && Object.prototype.propertyIsEnumerable.call(source, key) && (target[key] = source[key]);
+  }
+  return target;
+}
+function _object_without_properties_loose(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {}, sourceKeys = Object.keys(source), key, i;
+  for (i = 0; i < sourceKeys.length; i++)
+    key = sourceKeys[i], !(excluded.indexOf(key) >= 0) && (target[key] = source[key]);
+  return target;
+}
+function createTamaguiAnimatedComponent() {
+  var tag = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "div", Component = import_react_native_reanimated.default.createAnimatedComponent(/* @__PURE__ */ (0, import_react.forwardRef)(function(_param, ref) {
+    var forwardedRef = _param.forwardedRef, style = _param.style, props = _object_without_properties(_param, [
+      "forwardedRef",
+      "style"
+    ]), composedRefs = (0, import_web.useComposedRefs)(forwardedRef, ref), Element = props.tag || tag;
+    return style && Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform)), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Element, _object_spread_props(_object_spread({}, props), {
+      style,
+      ref: composedRefs
+    }));
+  }));
+  return Component.acceptTagProp = !0, Component;
+}
+var AnimatedView = createTamaguiAnimatedComponent("div"), AnimatedText = createTamaguiAnimatedComponent("span"), neverAnimate = {
+  alignItems: !0,
+  backdropFilter: !0,
+  borderBottomStyle: !0,
+  borderLeftStyle: !0,
+  borderRightStyle: !0,
+  borderStyle: !0,
+  borderTopStyle: !0,
+  boxSizing: !0,
+  contain: !0,
+  cursor: !0,
+  display: !0,
+  flexBasis: !0,
+  flexDirection: !0,
+  flexShrink: !0,
+  justifyContent: !0,
+  maxHeight: !0,
+  maxWidth: !0,
+  minHeight: !0,
+  minWidth: !0,
+  outlineStyle: !0,
+  overflow: !0,
+  overflowX: !0,
+  overflowY: !0,
+  pointerEvents: !0,
+  position: !0,
+  shadowColor: !0,
+  textAlign: !0,
+  textOverflow: !0,
+  whiteSpace: !0,
+  wordWrap: !0,
+  zIndex: !0
+};
 function createAnimations(animations) {
   return {
-    View: import_react_native_reanimated.default.View,
-    Text: import_react_native_reanimated.default.Text,
+    View: import_web.isWeb ? AnimatedView : import_react_native_reanimated.default.View,
+    Text: import_web.isWeb ? AnimatedText : import_react_native_reanimated.default.Text,
     isReactNative: !0,
     animations,
     usePresence: import_use_presence.usePresence,
@@ -131,44 +211,18 @@ function createAnimations(animations) {
         dontAnimate = style;
       else {
         var animateOnly = props.animateOnly;
-        if (animateOnly) {
-          dontAnimate = _object_spread({}, style);
-          var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
-          try {
-            for (var _iterator = animateOnly[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
-              var key = _step.value;
-              key in style && (animate[key] = style[key], delete dontAnimate[key]);
-            }
-          } catch (err) {
-            _didIteratorError = !0, _iteratorError = err;
-          } finally {
-            try {
-              !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
-            } finally {
-              if (_didIteratorError)
-                throw _iteratorError;
-            }
-          }
-        } else
-          animate = style;
+        for (var key in style)
+          !import_web.stylePropsAll[key] || neverAnimate[key] || animateOnly && !animateOnly.includes(key) ? dontAnimate[key] = style[key] : animate[key] = style[key];
       }
       var animateStr = JSON.stringify(animate), styles = (0, import_react.useMemo)(function() {
         return JSON.parse(animateStr);
       }, [
         animateStr
-      ]), isExiting = !!(presence != null && presence[1]), sendExitComplete = presence == null ? void 0 : presence[1], onDidAnimateCombined = (0, import_react.useCallback)(function() {
-        onDidAnimate == null || onDidAnimate(), sendExitComplete == null || sendExitComplete();
-      }, []), motiProps = {
+      ]), isExiting = !!(presence != null && presence[1]), presenceContext = (0, import_react.useContext)(import_use_presence.PresenceContext), usePresenceValue = presence || void 0, motiProps = {
         animate: isExiting || isHydrating ? {} : styles,
         transition: animations[animationKey],
-        // isHydrating
-        //   ? ({ type: 'timing', duration: 0 } as const)
-        //   : componentState.unmounted
-        //     ? { type: 'timing', duration: 0 }
-        //     : animations[animationKey as keyof typeof animations]
-        onDidAnimate: onDidAnimateCombined,
-        usePresenceValue: presence,
-        presenceContext: (0, import_react.useContext)(import_use_presence.PresenceContext),
+        usePresenceValue,
+        presenceContext,
         exit: isExiting ? styles : void 0
       }, moti = (0, import_author.useMotify)(motiProps);
       return process.env.NODE_ENV === "development" && props.debug && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {

package/dist/cjs/createAnimations.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/packages/animations-moti/src/createAnimations.tsx"],
-  "mappings": "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",
-  "names": ["createAnimations", "animations", "View", "Animated", "Text", "isReactNative", "usePresence", "ResetPresence", "useAnimatedNumber", "initial", "sharedValue", "useSharedValue", "useMemo", "getInstance", "getValue", "value", "setValue", "next", "config", "type", "withSpring", "withTiming", "stop", "cancelAnimation", "useAnimatedNumberReaction", "onValue", "instance", "useAnimatedReaction", "prev", "runOnJS", "useAnimatedNumberStyle", "val", "getStyle", "derivedValue", "useDerivedValue", "useAnimatedStyle", "useAnimations", "animationProps", "props", "presence", "style", "onDidAnimate", "componentState", "animationKey", "Array", "isArray", "animation", "isHydrating", "unmounted", "animate", "dontAnimate", "animateOnly", "key", "animateStr", "JSON", "stringify", "styles", "parse", "isExiting", "Boolean", "sendExitComplete", "onDidAnimateCombined", "useCallback", "motiProps", "transition", "usePresenceValue", "presenceContext", "useContext", "PresenceContext", "exit", "undefined", "moti", "useMotify", "process", "env", "NODE_ENV", "console", "info"]
+  "mappings": "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",
+  "names": ["createTamaguiAnimatedComponent", "tag", "Component", "Animated", "createAnimatedComponent", "forwardRef", "ref", "forwardedRef", "style", "props", "composedRefs", "useComposedRefs", "Element", "Array", "isArray", "transform", "transformsToString", "_jsx", "AnimatedView", "AnimatedText", "neverAnimate", "alignItems", "backdropFilter", "borderBottomStyle", "borderLeftStyle", "borderRightStyle", "borderStyle", "borderTopStyle", "boxSizing", "contain", "cursor", "display", "flexBasis", "flexDirection", "flexShrink", "justifyContent", "maxHeight", "maxWidth", "minHeight", "minWidth", "outlineStyle", "overflow", "overflowX", "overflowY", "pointerEvents", "position", "shadowColor", "textAlign", "textOverflow", "whiteSpace", "wordWrap", "zIndex", "createAnimations", "animations", "View", "isWeb", "Text", "isReactNative", "usePresence", "ResetPresence", "useAnimatedNumber", "initial", "sharedValue", "useSharedValue", "useMemo", "getInstance", "getValue", "value", "setValue", "next", "config", "type", "withSpring", "withTiming", "stop", "cancelAnimation", "useAnimatedNumberReaction", "onValue", "instance", "useAnimatedReaction", "prev", "runOnJS", "useAnimatedNumberStyle", "val", "getStyle", "derivedValue", "useDerivedValue", "useAnimatedStyle", "useAnimations", "animationProps", "presence", "onDidAnimate", "componentState", "animationKey", "animation", "isHydrating", "unmounted", "animate", "dontAnimate", "animateOnly", "key", "stylePropsAll", "includes", "animateStr", "JSON", "stringify", "styles", "parse", "isExiting", "Boolean", "presenceContext", "useContext", "PresenceContext", "usePresenceValue", "undefined", "motiProps", "transition", "exit", "moti", "useMotify", "process", "env", "NODE_ENV", "console", "info"]
 }

package/dist/esm/createAnimations.js

@@ -1,6 +1,12 @@
 import { PresenceContext, ResetPresence, usePresence } from "@tamagui/use-presence";
+import {
+  isWeb,
+  transformsToString,
+  useComposedRefs,
+  stylePropsAll
+} from "@tamagui/web";
 import { useMotify } from "moti/author";
-import { useCallback, useContext, useMemo } from "react";
+import { forwardRef, useContext, useMemo } from "react";
 import Animated, {
   cancelAnimation,
   runOnJS,
@@ -11,10 +17,53 @@ import Animated, {
   withSpring,
   withTiming
 } from "react-native-reanimated";
+import { jsx } from "react/jsx-runtime";
+function createTamaguiAnimatedComponent(tag = "div") {
+  const Component = Animated.createAnimatedComponent(
+    forwardRef(({ forwardedRef, style, ...props }, ref) => {
+      const composedRefs = useComposedRefs(forwardedRef, ref), Element = props.tag || tag;
+      return style && Array.isArray(style.transform) && (style.transform = transformsToString(style.transform)), /* @__PURE__ */ jsx(Element, { ...props, style, ref: composedRefs });
+    })
+  );
+  return Component.acceptTagProp = !0, Component;
+}
+const AnimatedView = createTamaguiAnimatedComponent("div"), AnimatedText = createTamaguiAnimatedComponent("span"), neverAnimate = {
+  alignItems: !0,
+  backdropFilter: !0,
+  borderBottomStyle: !0,
+  borderLeftStyle: !0,
+  borderRightStyle: !0,
+  borderStyle: !0,
+  borderTopStyle: !0,
+  boxSizing: !0,
+  contain: !0,
+  cursor: !0,
+  display: !0,
+  flexBasis: !0,
+  flexDirection: !0,
+  flexShrink: !0,
+  justifyContent: !0,
+  maxHeight: !0,
+  maxWidth: !0,
+  minHeight: !0,
+  minWidth: !0,
+  outlineStyle: !0,
+  overflow: !0,
+  overflowX: !0,
+  overflowY: !0,
+  pointerEvents: !0,
+  position: !0,
+  shadowColor: !0,
+  textAlign: !0,
+  textOverflow: !0,
+  whiteSpace: !0,
+  wordWrap: !0,
+  zIndex: !0
+};
 function createAnimations(animations) {
   return {
-    View: Animated.View,
-    Text: Animated.Text,
+    View: isWeb ? AnimatedView : Animated.View,
+    Text: isWeb ? AnimatedText : Animated.Text,
     isReactNative: !0,
     animations,
     usePresence,
@@ -68,26 +117,14 @@ function createAnimations(animations) {
         dontAnimate = style;
       else {
         const animateOnly = props.animateOnly;
-        if (animateOnly) {
-          dontAnimate = { ...style };
-          for (const key of animateOnly)
-            key in style && (animate[key] = style[key], delete dontAnimate[key]);
-        } else
-          animate = style;
+        for (const key in style)
+          !stylePropsAll[key] || neverAnimate[key] || animateOnly && !animateOnly.includes(key) ? dontAnimate[key] = style[key] : animate[key] = style[key];
       }
-      const animateStr = JSON.stringify(animate), styles = useMemo(() => JSON.parse(animateStr), [animateStr]), isExiting = !!presence?.[1], sendExitComplete = presence?.[1], onDidAnimateCombined = useCallback(() => {
-        onDidAnimate?.(), sendExitComplete?.();
-      }, []), motiProps = {
+      const animateStr = JSON.stringify(animate), styles = useMemo(() => JSON.parse(animateStr), [animateStr]), isExiting = !!presence?.[1], presenceContext = useContext(PresenceContext), usePresenceValue = presence || void 0, motiProps = {
         animate: isExiting || isHydrating ? {} : styles,
         transition: animations[animationKey],
-        // isHydrating
-        //   ? ({ type: 'timing', duration: 0 } as const)
-        //   : componentState.unmounted
-        //     ? { type: 'timing', duration: 0 }
-        //     : animations[animationKey as keyof typeof animations]
-        onDidAnimate: onDidAnimateCombined,
-        usePresenceValue: presence,
-        presenceContext: useContext(PresenceContext),
+        usePresenceValue,
+        presenceContext,
         exit: isExiting ? styles : void 0
       }, moti = useMotify(motiProps);
       return process.env.NODE_ENV === "development" && props.debug && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {

package/dist/esm/createAnimations.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/createAnimations.tsx"],
-  "mappings": "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",
+  "mappings": "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",
   "names": []
 }

package/dist/esm/createAnimations.mjs

@@ -1,11 +1,64 @@
 import { PresenceContext, ResetPresence, usePresence } from "@tamagui/use-presence";
+import { isWeb, transformsToString, useComposedRefs, stylePropsAll } from "@tamagui/web";
 import { useMotify } from "moti/author";
-import { useCallback, useContext, useMemo } from "react";
+import { forwardRef, useContext, useMemo } from "react";
 import Animated, { cancelAnimation, runOnJS, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from "react-native-reanimated";
+import { jsx } from "react/jsx-runtime";
+function createTamaguiAnimatedComponent(tag = "div") {
+  const Component = Animated.createAnimatedComponent(forwardRef(({
+    forwardedRef,
+    style,
+    ...props
+  }, ref) => {
+    const composedRefs = useComposedRefs(forwardedRef, ref),
+      Element = props.tag || tag;
+    return style && Array.isArray(style.transform) && (style.transform = transformsToString(style.transform)), /* @__PURE__ */jsx(Element, {
+      ...props,
+      style,
+      ref: composedRefs
+    });
+  }));
+  return Component.acceptTagProp = !0, Component;
+}
+const AnimatedView = createTamaguiAnimatedComponent("div"),
+  AnimatedText = createTamaguiAnimatedComponent("span"),
+  neverAnimate = {
+    alignItems: !0,
+    backdropFilter: !0,
+    borderBottomStyle: !0,
+    borderLeftStyle: !0,
+    borderRightStyle: !0,
+    borderStyle: !0,
+    borderTopStyle: !0,
+    boxSizing: !0,
+    contain: !0,
+    cursor: !0,
+    display: !0,
+    flexBasis: !0,
+    flexDirection: !0,
+    flexShrink: !0,
+    justifyContent: !0,
+    maxHeight: !0,
+    maxWidth: !0,
+    minHeight: !0,
+    minWidth: !0,
+    outlineStyle: !0,
+    overflow: !0,
+    overflowX: !0,
+    overflowY: !0,
+    pointerEvents: !0,
+    position: !0,
+    shadowColor: !0,
+    textAlign: !0,
+    textOverflow: !0,
+    whiteSpace: !0,
+    wordWrap: !0,
+    zIndex: !0
+  };
 function createAnimations(animations) {
   return {
-    View: Animated.View,
-    Text: Animated.Text,
+    View: isWeb ? AnimatedView : Animated.View,
+    Text: isWeb ? AnimatedText : Animated.Text,
     isReactNative: !0,
     animations,
     usePresence,
@@ -69,31 +122,18 @@ function createAnimations(animations) {
         dontAnimate = {};
       if (isHydrating) dontAnimate = style;else {
         const animateOnly = props.animateOnly;
-        if (animateOnly) {
-          dontAnimate = {
-            ...style
-          };
-          for (const key of animateOnly) key in style && (animate[key] = style[key], delete dontAnimate[key]);
-        } else animate = style;
+        for (const key in style) !stylePropsAll[key] || neverAnimate[key] || animateOnly && !animateOnly.includes(key) ? dontAnimate[key] = style[key] : animate[key] = style[key];
       }
       const animateStr = JSON.stringify(animate),
         styles = useMemo(() => JSON.parse(animateStr), [animateStr]),
         isExiting = !!presence?.[1],
-        sendExitComplete = presence?.[1],
-        onDidAnimateCombined = useCallback(() => {
-          onDidAnimate?.(), sendExitComplete?.();
-        }, []),
+        presenceContext = useContext(PresenceContext),
+        usePresenceValue = presence || void 0,
         motiProps = {
           animate: isExiting || isHydrating ? {} : styles,
           transition: animations[animationKey],
-          // isHydrating
-          //   ? ({ type: 'timing', duration: 0 } as const)
-          //   : componentState.unmounted
-          //     ? { type: 'timing', duration: 0 }
-          //     : animations[animationKey as keyof typeof animations]
-          onDidAnimate: onDidAnimateCombined,
-          usePresenceValue: presence,
-          presenceContext: useContext(PresenceContext),
+          usePresenceValue,
+          presenceContext,
           exit: isExiting ? styles : void 0
         },
         moti = useMotify(motiProps);

package/dist/esm/createAnimations.native.js

@@ -1,6 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
 import { PresenceContext, ResetPresence, usePresence } from "@tamagui/use-presence";
+import { isWeb, transformsToString, useComposedRefs, stylePropsAll } from "@tamagui/web";
 import { useMotify } from "moti/author";
-import { useCallback, useContext, useMemo } from "react";
+import { forwardRef, useContext, useMemo } from "react";
 import Animated, { cancelAnimation, runOnJS, useAnimatedReaction, useAnimatedStyle, useDerivedValue, useSharedValue, withSpring, withTiming } from "react-native-reanimated";
 function _define_property(obj, key, value) {
   return key in obj ? Object.defineProperty(obj, key, {
@@ -12,19 +14,99 @@ function _define_property(obj, key, value) {
 }
 function _object_spread(target) {
   for (var i = 1; i < arguments.length; i++) {
-    var source = arguments[i] != null ? arguments[i] : {}, ownKeys = Object.keys(source);
-    typeof Object.getOwnPropertySymbols == "function" && (ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+    var source = arguments[i] != null ? arguments[i] : {}, ownKeys2 = Object.keys(source);
+    typeof Object.getOwnPropertySymbols == "function" && (ownKeys2 = ownKeys2.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
       return Object.getOwnPropertyDescriptor(source, sym).enumerable;
-    }))), ownKeys.forEach(function(key) {
+    }))), ownKeys2.forEach(function(key) {
       _define_property(target, key, source[key]);
     });
   }
   return target;
 }
+function ownKeys(object, enumerableOnly) {
+  var keys = Object.keys(object);
+  if (Object.getOwnPropertySymbols) {
+    var symbols = Object.getOwnPropertySymbols(object);
+    enumerableOnly && (symbols = symbols.filter(function(sym) {
+      return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+    })), keys.push.apply(keys, symbols);
+  }
+  return keys;
+}
+function _object_spread_props(target, source) {
+  return source = source ?? {}, Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function(key) {
+    Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+  }), target;
+}
+function _object_without_properties(source, excluded) {
+  if (source == null)
+    return {};
+  var target = _object_without_properties_loose(source, excluded), key, i;
+  if (Object.getOwnPropertySymbols) {
+    var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
+    for (i = 0; i < sourceSymbolKeys.length; i++)
+      key = sourceSymbolKeys[i], !(excluded.indexOf(key) >= 0) && Object.prototype.propertyIsEnumerable.call(source, key) && (target[key] = source[key]);
+  }
+  return target;
+}
+function _object_without_properties_loose(source, excluded) {
+  if (source == null)
+    return {};
+  var target = {}, sourceKeys = Object.keys(source), key, i;
+  for (i = 0; i < sourceKeys.length; i++)
+    key = sourceKeys[i], !(excluded.indexOf(key) >= 0) && (target[key] = source[key]);
+  return target;
+}
+function createTamaguiAnimatedComponent() {
+  var tag = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "div", Component = Animated.createAnimatedComponent(/* @__PURE__ */ forwardRef(function(_param, ref) {
+    var forwardedRef = _param.forwardedRef, style = _param.style, props = _object_without_properties(_param, [
+      "forwardedRef",
+      "style"
+    ]), composedRefs = useComposedRefs(forwardedRef, ref), Element = props.tag || tag;
+    return style && Array.isArray(style.transform) && (style.transform = transformsToString(style.transform)), /* @__PURE__ */ _jsx(Element, _object_spread_props(_object_spread({}, props), {
+      style,
+      ref: composedRefs
+    }));
+  }));
+  return Component.acceptTagProp = !0, Component;
+}
+var AnimatedView = createTamaguiAnimatedComponent("div"), AnimatedText = createTamaguiAnimatedComponent("span"), neverAnimate = {
+  alignItems: !0,
+  backdropFilter: !0,
+  borderBottomStyle: !0,
+  borderLeftStyle: !0,
+  borderRightStyle: !0,
+  borderStyle: !0,
+  borderTopStyle: !0,
+  boxSizing: !0,
+  contain: !0,
+  cursor: !0,
+  display: !0,
+  flexBasis: !0,
+  flexDirection: !0,
+  flexShrink: !0,
+  justifyContent: !0,
+  maxHeight: !0,
+  maxWidth: !0,
+  minHeight: !0,
+  minWidth: !0,
+  outlineStyle: !0,
+  overflow: !0,
+  overflowX: !0,
+  overflowY: !0,
+  pointerEvents: !0,
+  position: !0,
+  shadowColor: !0,
+  textAlign: !0,
+  textOverflow: !0,
+  whiteSpace: !0,
+  wordWrap: !0,
+  zIndex: !0
+};
 function createAnimations(animations) {
   return {
-    View: Animated.View,
-    Text: Animated.Text,
+    View: isWeb ? AnimatedView : Animated.View,
+    Text: isWeb ? AnimatedText : Animated.Text,
     isReactNative: !0,
     animations,
     usePresence,
@@ -106,44 +188,18 @@ function createAnimations(animations) {
         dontAnimate = style;
       else {
         var animateOnly = props.animateOnly;
-        if (animateOnly) {
-          dontAnimate = _object_spread({}, style);
-          var _iteratorNormalCompletion = !0, _didIteratorError = !1, _iteratorError = void 0;
-          try {
-            for (var _iterator = animateOnly[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = !0) {
-              var key = _step.value;
-              key in style && (animate[key] = style[key], delete dontAnimate[key]);
-            }
-          } catch (err) {
-            _didIteratorError = !0, _iteratorError = err;
-          } finally {
-            try {
-              !_iteratorNormalCompletion && _iterator.return != null && _iterator.return();
-            } finally {
-              if (_didIteratorError)
-                throw _iteratorError;
-            }
-          }
-        } else
-          animate = style;
+        for (var key in style)
+          !stylePropsAll[key] || neverAnimate[key] || animateOnly && !animateOnly.includes(key) ? dontAnimate[key] = style[key] : animate[key] = style[key];
       }
       var animateStr = JSON.stringify(animate), styles = useMemo(function() {
         return JSON.parse(animateStr);
       }, [
         animateStr
-      ]), isExiting = !!(presence != null && presence[1]), sendExitComplete = presence == null ? void 0 : presence[1], onDidAnimateCombined = useCallback(function() {
-        onDidAnimate == null || onDidAnimate(), sendExitComplete == null || sendExitComplete();
-      }, []), motiProps = {
+      ]), isExiting = !!(presence != null && presence[1]), presenceContext = useContext(PresenceContext), usePresenceValue = presence || void 0, motiProps = {
         animate: isExiting || isHydrating ? {} : styles,
         transition: animations[animationKey],
-        // isHydrating
-        //   ? ({ type: 'timing', duration: 0 } as const)
-        //   : componentState.unmounted
-        //     ? { type: 'timing', duration: 0 }
-        //     : animations[animationKey as keyof typeof animations]
-        onDidAnimate: onDidAnimateCombined,
-        usePresenceValue: presence,
-        presenceContext: useContext(PresenceContext),
+        usePresenceValue,
+        presenceContext,
         exit: isExiting ? styles : void 0
       }, moti = useMotify(motiProps);
       return process.env.NODE_ENV === "development" && props.debug && console.info("useMotify(", JSON.stringify(motiProps, null, 2) + ")", {

package/dist/esm/createAnimations.native.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/Users/n8/tamagui/packages/animations-moti/src/createAnimations.tsx"],
-  "mappings": "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",
-  "names": ["PresenceContext", "ResetPresence", "usePresence", "useMotify", "useCallback", "useContext", "useMemo", "Animated", "cancelAnimation", "runOnJS", "useAnimatedReaction", "useAnimatedStyle", "useDerivedValue", "useSharedValue", "withSpring", "withTiming", "createAnimations", "animations", "View", "Text", "isReactNative", "useAnimatedNumber", "initial", "sharedValue", "getInstance", "getValue", "value", "setValue", "next", "config", "type", "stop", "useAnimatedNumberReaction", "onValue", "instance", "prev", "useAnimatedNumberStyle", "val", "getStyle", "derivedValue", "useAnimations", "animationProps", "props", "presence", "style", "onDidAnimate", "componentState", "animationKey", "Array", "isArray", "animation", "isHydrating", "unmounted", "animate", "dontAnimate", "animateOnly", "key", "animateStr", "JSON", "stringify", "styles", "parse", "isExiting", "Boolean", "sendExitComplete", "onDidAnimateCombined", "motiProps", "transition", "usePresenceValue", "presenceContext", "exit", "undefined", "moti", "process", "env", "NODE_ENV", "console", "info"]
+  "mappings": ";AAAA,SAASA,iBAAiBC,eAAeC,mBAAmB;AAC5D,SACEC,OACAC,oBACAC,iBACAC,qBAGK;AAEP,SAASC,iBAAiB;AAC1B,SAASC,YAAYC,YAAYC,eAAe;AAEhD,OAAOC,YACLC,iBACAC,SACAC,qBACAC,kBACAC,iBACAC,gBACAC,YACAC,kBACK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIP,SAASC,iCAAAA;MAA+BC,MAAAA,UAAAA,SAAAA,KAAAA,UAAAA,CAAAA,MAAAA,SAAAA,UAAAA,CAAAA,IAAM,OACtCC,YAAYX,SAASY,wBACzBf,2BAAW,SAAA,QAAyCgB,KAAAA;QAAtCC,eAAAA,OAAAA,cAAcC,QAAAA,OAAAA,OAAUC,QAAAA,2BAAAA,QAAAA;MAAxBF;MAAcC;QACpBE,eAAevB,gBAAgBoB,cAAcD,GAAAA,GAC7CK,UAAUF,MAAMN,OAAOA;AAE7B,WAAIK,SAASI,MAAMC,QAAQL,MAAMM,SAAS,MACxCN,MAAMM,YAAY5B,mBAAmBsB,MAAMM,SAAS,IAE/C,qBAACH,SAAAA,qBAAAA,eAAAA,CAAAA,GAAYF,KAAAA,GAAAA;MAAOD;MAAcF,KAAKI;;EAChD,CAAA,CAAA;AAEFN,mBAAU,gBAAmB,IACtBA;AACT;AAEA,IAAMW,eAAeb,+BAA+B,KAAA,GAC9Cc,eAAed,+BAA+B,MAAA,GAE9Ce,eAAe;EACnBC,YAAY;EACZC,gBAAgB;EAChBC,mBAAmB;EACnBC,iBAAiB;EACjBC,kBAAkB;EAClBC,aAAa;EACbC,gBAAgB;EAChBC,WAAW;EACXC,SAAS;EACTC,QAAQ;EACRC,SAAS;EACTC,WAAW;EACXC,eAAe;EACfC,YAAY;EACZC,gBAAgB;EAChBC,WAAW;EACXC,UAAU;EACVC,WAAW;EACXC,UAAU;EACVC,cAAc;EACdC,UAAU;EACVC,WAAW;EACXC,WAAW;EACXC,eAAe;EACfC,UAAU;EACVC,aAAa;EACbC,WAAW;EACXC,cAAc;EACdC,YAAY;EACZC,UAAU;EACVC,QAAQ;AACV;AAEO,SAASC,iBACdC,YAAa;AAEb,SAAO;IACLC,MAAMlE,QAAQ8B,eAAetB,SAAS0D;IACtCC,MAAMnE,QAAQ+B,eAAevB,SAAS2D;IACtCC,eAAe;IACfH;IACAlE;IACAD;IAEAuE,mBAAAA,SAAkBC,SAAO;AACvB,UAAMC,cAAczD,eAAewD,OAAAA;AAEnC,aAAO/D,QACL,WAAA;eAAO;UACLiE,aAAAA,WAAAA;AACE;AACA,mBAAOD;UACT;UACAE,UAAAA,WAAAA;AACE;AACA,mBAAOF,YAAYG;UACrB;UACAC,UAAAA,SAASC,MAAI;AACX;gBADaC,SAAAA,UAAAA,SAAAA,KAAAA,UAAAA,CAAAA,MAAAA,SAAAA,UAAAA,CAAAA,IAAS;cAAEC,MAAM;YAAS;AAEvC,YAAID,OAAOC,SAAS,WAClBP,YAAYG,QAAQE,OACXC,OAAOC,SAAS,WACzBP,YAAYG,QAAQ3D,WAAW6D,MAAMC,MAAAA,IAErCN,YAAYG,QAAQ1D,WAAW4D,MAAMC,MAAAA;UAEzC;UACAE,MAAAA,WAAAA;AACE;AACAtE,4BAAgB8D,WAAAA;UAClB;QACF;SACA;QAACA;OAAY;IAEjB;IAEAS,2BAAAA,SAA0B,OAAWC,SAAO;UAAhBP,QAAF,MAAEA,OACpBQ,WAAWR,MAAMF,YAAW;AAClC,aAAO7D;QACL,WAAA;AACE,iBAAOuE,SAASR;QAClB;QACA,SAACE,MAAMO,MAAAA;AACL,UAAIA,SAASP,QAGXlE,QAAQuE,OAAAA,EAASL,IAAAA;QAErB;;QAEA;UAACK;UAASC;;MAAS;IAEvB;;;;IAKAE,wBAAAA,SAAuBC,KAAKC,UAAQ;AAClC,UAAMJ,WAAWG,IAAIb,YAAW,GAG1Be,eAAe1E;QAAgB,WAAA;AACnC,iBAAOqE,SAASR;QAElB;;QAAG;UAACQ;UAAUI;;MAAS;AAEvB,aAAO1E;QAAiB,WAAA;AACtB,iBAAO0E,SAASC,aAAab,KAAK;QAEpC;;QAAG;UAACW;UAAKC;UAAUC;UAAcL;;MAAS;IAC5C;IAEAM,eAAe,SAACC,gBAAAA;AACd,UAAQjE,QAAyDiE,eAAzDjE,OAAOkE,WAAkDD,eAAlDC,UAAUnE,QAAwCkE,eAAxClE,OAAOoE,eAAiCF,eAAjCE,cAAcC,iBAAmBH,eAAnBG,gBACxCC,eAAelE,MAAMC,QAAQJ,MAAMsE,SAAS,IAC9CtE,MAAMsE,UAAU,CAAA,IAChBtE,MAAMsE,WAEJC,cAAcH,eAAeI,cAAc,gBAC7CC,UAAU,CAAC,GACXC,cAAc,CAAC;AAEnB,UAAIH;AACFG,sBAAc3E;WACT;AACL,YAAM4E,cAAc3E,MAAM2E;AAC1B,iBAAWC,OAAO7E;AAChB,UACE,CAACpB,cAAciG,GAAAA,KACfpE,aAAaoE,GAAAA,KACZD,eAAe,CAACA,YAAYE,SAASD,GAAAA,IAEtCF,YAAYE,GAAAA,IAAO7E,MAAM6E,GAAAA,IAEzBH,QAAQG,GAAAA,IAAO7E,MAAM6E,GAAAA;MAG3B;AAIA,UAAME,aAAaC,KAAKC,UAAUP,OAAAA,GAC5BQ,SAASlG,QAAQ,WAAA;eAAMgG,KAAKG,MAAMJ,UAAAA;SAAa;QAACA;OAAW,GAE3DK,YAAYC,GAAQlB,YAAAA,QAAAA,SAAW,CAAA,IAC/BmB,kBAAkBvG,WAAWT,eAAAA,GAC7BiH,mBAAoBpB,YAAYqB,QAIhCC,YAAY;QAChBf,SAASU,aAAaZ,cAAc,CAAC,IAAIU;QACzCQ,YAAYhD,WAAW4B,YAAAA;QACvBiB;QACAD;QACAK,MAAMP,YAAYF,SAASM;MAC7B,GAEMI,OAAO/G,UAAU4G,SAAAA;AAEvB,aAAII,QAAQC,IAAIC,aAAa,iBAAiB9F,MAAM,SAClD+F,QAAQC,KAAM,cAAajB,KAAKC,UAAUQ,WAAW,MAAM,CAAA,IAAK,KAAK;QACnEvB;QACAuB;QACAG;QACA5F,OAAO;UAAC2E;UAAaiB,KAAK5F;;MAC5B,CAAA,GAGK;QACLA,OAAO;UAAC2E;UAAaiB,KAAK5F;;MAC5B;IACF;EACF;AACF;",
+  "names": ["PresenceContext", "ResetPresence", "usePresence", "isWeb", "transformsToString", "useComposedRefs", "stylePropsAll", "useMotify", "forwardRef", "useContext", "useMemo", "Animated", "cancelAnimation", "runOnJS", "useAnimatedReaction", "useAnimatedStyle", "useDerivedValue", "useSharedValue", "withSpring", "withTiming", "createTamaguiAnimatedComponent", "tag", "Component", "createAnimatedComponent", "ref", "forwardedRef", "style", "props", "composedRefs", "Element", "Array", "isArray", "transform", "AnimatedView", "AnimatedText", "neverAnimate", "alignItems", "backdropFilter", "borderBottomStyle", "borderLeftStyle", "borderRightStyle", "borderStyle", "borderTopStyle", "boxSizing", "contain", "cursor", "display", "flexBasis", "flexDirection", "flexShrink", "justifyContent", "maxHeight", "maxWidth", "minHeight", "minWidth", "outlineStyle", "overflow", "overflowX", "overflowY", "pointerEvents", "position", "shadowColor", "textAlign", "textOverflow", "whiteSpace", "wordWrap", "zIndex", "createAnimations", "animations", "View", "Text", "isReactNative", "useAnimatedNumber", "initial", "sharedValue", "getInstance", "getValue", "value", "setValue", "next", "config", "type", "stop", "useAnimatedNumberReaction", "onValue", "instance", "prev", "useAnimatedNumberStyle", "val", "getStyle", "derivedValue", "useAnimations", "animationProps", "presence", "onDidAnimate", "componentState", "animationKey", "animation", "isHydrating", "unmounted", "animate", "dontAnimate", "animateOnly", "key", "includes", "animateStr", "JSON", "stringify", "styles", "parse", "isExiting", "Boolean", "presenceContext", "usePresenceValue", "undefined", "motiProps", "transition", "exit", "moti", "process", "env", "NODE_ENV", "console", "info"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/animations-moti",
-  "version": "1.90.2",
+  "version": "1.90.4",
   "source": "src/index.ts",
   "license": "MIT",
   "types": "./types/index.d.ts",
@@ -15,13 +15,13 @@
     "dist"
   ],
   "dependencies": {
-    "@tamagui/use-presence": "1.90.2",
-    "@tamagui/web": "1.90.2",
-    "moti": "^0.27.2",
+    "@tamagui/use-presence": "1.90.4",
+    "@tamagui/web": "1.90.4",
+    "moti": "^0.27.4",
     "react": "^18.2.0"
   },
   "devDependencies": {
-    "@tamagui/build": "1.90.2",
+    "@tamagui/build": "1.90.4",
     "react-native-reanimated": "~3.6.2"
   },
   "scripts": {

package/src/createAnimations.tsx

@@ -1,8 +1,15 @@
 import { PresenceContext, ResetPresence, usePresence } from '@tamagui/use-presence'
-import type { AnimationDriver, UniversalAnimatedNumber } from '@tamagui/web'
+import {
+  isWeb,
+  transformsToString,
+  useComposedRefs,
+  stylePropsAll,
+  type AnimationDriver,
+  type UniversalAnimatedNumber,
+} from '@tamagui/web'
 import type { MotiTransition } from 'moti'
 import { useMotify } from 'moti/author'
-import { useCallback, useContext, useMemo } from 'react'
+import { forwardRef, useContext, useMemo } from 'react'
 import type { SharedValue } from 'react-native-reanimated'
 import Animated, {
   cancelAnimation,
@@ -17,12 +24,65 @@ import Animated, {
 
 type ReanimatedAnimatedNumber = SharedValue<number>
 
+function createTamaguiAnimatedComponent(tag = 'div') {
+  const Component = Animated.createAnimatedComponent(
+    forwardRef(({ forwardedRef, style, ...props }: any, ref) => {
+      const composedRefs = useComposedRefs(forwardedRef, ref)
+      const Element = props.tag || tag
+      // we can probably just use stringifyTransforms? it seems almost fully normalized
+      if (style && Array.isArray(style.transform)) {
+        style.transform = transformsToString(style.transform)
+      }
+      return <Element {...props} style={style} ref={composedRefs} />
+    })
+  )
+  Component['acceptTagProp'] = true
+  return Component
+}
+
+const AnimatedView = createTamaguiAnimatedComponent('div')
+const AnimatedText = createTamaguiAnimatedComponent('span')
+
+const neverAnimate = {
+  alignItems: true,
+  backdropFilter: true,
+  borderBottomStyle: true,
+  borderLeftStyle: true,
+  borderRightStyle: true,
+  borderStyle: true,
+  borderTopStyle: true,
+  boxSizing: true,
+  contain: true,
+  cursor: true,
+  display: true,
+  flexBasis: true,
+  flexDirection: true,
+  flexShrink: true,
+  justifyContent: true,
+  maxHeight: true,
+  maxWidth: true,
+  minHeight: true,
+  minWidth: true,
+  outlineStyle: true,
+  overflow: true,
+  overflowX: true,
+  overflowY: true,
+  pointerEvents: true,
+  position: true,
+  shadowColor: true,
+  textAlign: true,
+  textOverflow: true,
+  whiteSpace: true,
+  wordWrap: true,
+  zIndex: true,
+}
+
 export function createAnimations<A extends Record<string, MotiTransition>>(
   animations: A
 ): AnimationDriver<A> {
   return {
-    View: Animated.View,
-    Text: Animated.Text,
+    View: isWeb ? AnimatedView : Animated.View,
+    Text: isWeb ? AnimatedText : Animated.Text,
     isReactNative: true,
     animations,
     usePresence,
@@ -109,17 +169,17 @@ export function createAnimations<A extends Record<string, MotiTransition>>(
       if (isHydrating) {
         dontAnimate = style
       } else {
-        const animateOnly = props.animateOnly
-        if (animateOnly) {
-          dontAnimate = { ...style }
-          for (const key of animateOnly) {
-            if (key in style) {
-              animate[key] = style[key]
-              delete dontAnimate[key]
-            }
+        const animateOnly = props.animateOnly as string[]
+        for (const key in style) {
+          if (
+            !stylePropsAll[key] ||
+            neverAnimate[key] ||
+            (animateOnly && !animateOnly.includes(key))
+          ) {
+            dontAnimate[key] = style[key]
+          } else {
+            animate[key] = style[key]
           }
-        } else {
-          animate = style
         }
       }
 
@@ -129,26 +189,16 @@ export function createAnimations<A extends Record<string, MotiTransition>>(
       const styles = useMemo(() => JSON.parse(animateStr), [animateStr])
 
       const isExiting = Boolean(presence?.[1])
-      const sendExitComplete = presence?.[1]
-
-      const onDidAnimateCombined = useCallback(() => {
-        onDidAnimate?.()
-        sendExitComplete?.()
-      }, [])
+      const presenceContext = useContext(PresenceContext)
+      const usePresenceValue = (presence || undefined) as any
 
       type UseMotiProps = Parameters<typeof useMotify>[0]
 
       const motiProps = {
         animate: isExiting || isHydrating ? {} : styles,
         transition: animations[animationKey as keyof typeof animations],
-        // isHydrating
-        //   ? ({ type: 'timing', duration: 0 } as const)
-        //   : componentState.unmounted
-        //     ? { type: 'timing', duration: 0 }
-        //     : animations[animationKey as keyof typeof animations]
-        onDidAnimate: onDidAnimateCombined,
-        usePresenceValue: presence as any,
-        presenceContext: useContext(PresenceContext),
+        usePresenceValue,
+        presenceContext,
         exit: isExiting ? styles : undefined,
       } satisfies UseMotiProps
 

package/types/createAnimations.d.ts

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

package/types/createAnimations.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createAnimations.d.ts","sourceRoot":"","sources":["../src/createAnimations.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAA2B,MAAM,cAAc,CAAA;AAC5E,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,MAAM,CAAA;AAiB1C,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,EACvE,UAAU,EAAE,CAAC,GACZ,eAAe,CAAC,CAAC,CAAC,CAqJpB"}
+{"version":3,"file":"createAnimations.d.ts","sourceRoot":"","sources":["../src/createAnimations.tsx"],"names":[],"mappings":"AACA,OAAO,EAKL,KAAK,eAAe,EAErB,MAAM,cAAc,CAAA;AACrB,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,MAAM,CAAA;AAsE1C,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,EACvE,UAAU,EAAE,CAAC,GACZ,eAAe,CAAC,CAAC,CAAC,CA2IpB"}