@tamagui/animations-css 2.0.0-1768326993354 → 2.0.0-1768530912818

package/dist/cjs/createAnimations.cjs

@@ -34,7 +34,8 @@ __export(createAnimations_exports, {
   createAnimations: () => createAnimations
 });
 module.exports = __toCommonJS(createAnimations_exports);
-var import_constants = require("@tamagui/constants"),
+var import_animation_helpers = require("@tamagui/animation-helpers"),
+  import_constants = require("@tamagui/constants"),
   import_use_presence = require("@tamagui/use-presence"),
   import_web = require("@tamagui/web"),
   import_react = __toESM(require("react"), 1);
@@ -98,15 +99,16 @@ function createAnimations(animations) {
       const isEntering = !!componentState.unmounted,
         isExiting = presence?.[0] === !1,
         sendExitComplete = presence?.[1],
-        [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition],
-        animation = animations[animationKey],
-        keys = props.animateOnly ?? ["all"];
+        normalized = (0, import_animation_helpers.normalizeTransition)(props.transition),
+        defaultAnimation = normalized.default ? animations[normalized.default] : null,
+        animatedProperties = (0, import_animation_helpers.getAnimatedProperties)(normalized),
+        keys = animatedProperties.length > 0 ? animatedProperties : props.animateOnly ?? ["all"];
       if ((0, import_constants.useIsomorphicLayoutEffect)(() => {
         const host = stateRef.current.host;
         if (!sendExitComplete || !isExiting || !host) return;
         const node = host,
-          animationDuration = animation ? extractDuration(animation) : 200,
-          delay = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0,
+          animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200,
+          delay = normalized.delay ?? 0,
           fallbackTimeout = animationDuration + delay,
           timeoutId = setTimeout(() => {
             sendExitComplete?.();
@@ -117,26 +119,25 @@ function createAnimations(animations) {
         return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
           clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
         };
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
-        const delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map(key => {
-          const override = animations[animationConfig?.[key]] ?? animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !(0, import_animation_helpers.hasAnimation)(normalized)) return null;
+      Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
+      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map(key => {
+        const propAnimation = normalized.properties[key];
+        let animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && typeof propAnimation == "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? {
+      }), {
         style,
         className: isEntering ? "t_unmounted" : ""
-      } : null;
+      };
     }
   };
 }

package/dist/cjs/createAnimations.js

@@ -25,7 +25,7 @@ __export(createAnimations_exports, {
   createAnimations: () => createAnimations
 });
 module.exports = __toCommonJS(createAnimations_exports);
-var import_constants = require("@tamagui/constants"), import_use_presence = require("@tamagui/use-presence"), import_web = require("@tamagui/web"), import_react = __toESM(require("react"), 1);
+var import_animation_helpers = require("@tamagui/animation-helpers"), import_constants = require("@tamagui/constants"), import_use_presence = require("@tamagui/use-presence"), import_web = require("@tamagui/web"), import_react = __toESM(require("react"), 1);
 function extractDuration(animation) {
   const msMatch = animation.match(/(\d+(?:\.\d+)?)\s*ms/);
   if (msMatch)
@@ -76,11 +76,11 @@ function createAnimations(animations) {
       return getStyle(val.getValue());
     },
     useAnimations: ({ props, presence, style, componentState, stateRef }) => {
-      const isEntering = !!componentState.unmounted, isExiting = presence?.[0] === !1, sendExitComplete = presence?.[1], [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition], animation = animations[animationKey], keys = props.animateOnly ?? ["all"];
+      const isEntering = !!componentState.unmounted, isExiting = presence?.[0] === !1, sendExitComplete = presence?.[1], normalized = (0, import_animation_helpers.normalizeTransition)(props.transition), defaultAnimation = normalized.default ? animations[normalized.default] : null, animatedProperties = (0, import_animation_helpers.getAnimatedProperties)(normalized), keys = animatedProperties.length > 0 ? animatedProperties : props.animateOnly ?? ["all"];
       if ((0, import_constants.useIsomorphicLayoutEffect)(() => {
         const host = stateRef.current.host;
         if (!sendExitComplete || !isExiting || !host) return;
-        const node = host, animationDuration = animation ? extractDuration(animation) : 200, delay = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0, fallbackTimeout = animationDuration + delay, timeoutId = setTimeout(() => {
+        const node = host, animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200, delay = normalized.delay ?? 0, fallbackTimeout = animationDuration + delay, timeoutId = setTimeout(() => {
           sendExitComplete?.();
         }, fallbackTimeout), onFinishAnimation = () => {
           clearTimeout(timeoutId), sendExitComplete?.();
@@ -88,23 +88,23 @@ function createAnimations(animations) {
         return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
           clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
         };
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
-        const delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map((key) => {
-          const override = animations[animationConfig?.[key]] ?? animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !(0, import_animation_helpers.hasAnimation)(normalized))
+        return null;
+      Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
+      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map((key) => {
+        const propAnimation = normalized.properties[key];
+        let animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && typeof propAnimation == "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? { style, className: isEntering ? "t_unmounted" : "" } : null;
+      }), { style, className: isEntering ? "t_unmounted" : "" };
     }
   };
 }

package/dist/cjs/createAnimations.js.map

@@ -1,6 +1,6 @@
 {
   "version": 3,
   "sources": ["../../src/createAnimations.tsx"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAA0C,+BAC1C,sBAA2C,kCAE3C,aAAmC,yBACnC,eAAgC;AAOhC,SAAS,gBAAgB,WAA2B;AAElD,QAAM,UAAU,UAAU,MAAM,sBAAsB;AACtD,MAAI;AACF,WAAO,OAAO,SAAS,QAAQ,CAAC,GAAG,EAAE;AAIvC,QAAM,SAAS,UAAU,MAAM,qBAAqB;AACpD,SAAI,SACK,KAAK,MAAM,OAAO,WAAW,OAAO,CAAC,CAAC,IAAI,GAAI,IAIhD;AACT;AAEO,SAAS,iBAAmC,YAAmC;AACpF,QAAM,oBAAoB,oBAAI,QAA4B;AAE1D,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA,aAAa;AAAA,IACb,oBAAoB;AAAA,IAEpB,kBAAkB,SAA4C;AAC5D,YAAM,CAAC,KAAK,MAAM,IAAI,aAAAA,QAAM,SAAS,OAAO,GACtC,CAAC,UAAU,WAAW,QAAI,uBAA+B;AAE/D,6DAA0B,MAAM;AAC9B,QAAI,aACF,WAAW,GACX,YAAY,MAAS;AAAA,MAEzB,GAAG,CAAC,QAAQ,CAAC,GAEN;AAAA,QACL,cAAc;AACZ,iBAAO;AAAA,QACT;AAAA,QACA,WAAW;AACT,iBAAO;AAAA,QACT;AAAA,QACA,SAAS,MAAM,QAAQC,WAAU;AAC/B,iBAAO,IAAI,GACX,YAAYA,SAAQ;AAAA,QACtB;AAAA,QACA,OAAO;AAAA,QAAC;AAAA,MACV;AAAA,IACF;AAAA,IAEA,0BAA0B,EAAE,MAAM,GAAG,SAAS;AAC5C,mBAAAD,QAAM,UAAU,MAAM;AACpB,cAAM,WAAW,MAAM,YAAY;AACnC,YAAI,QAAQ,kBAAkB,IAAI,QAAQ;AAC1C,YAAI,CAAC,OAAO;AACV,gBAAM,OAAO,oBAAI,IAAc;AAC/B,4BAAkB,IAAI,UAAU,IAAI,GACpC,QAAQ;AAAA,QACV;AACA,qBAAM,IAAI,OAAO,GACV,MAAM;AACX,iBAAO,OAAO,OAAO;AAAA,QACvB;AAAA,MACF,GAAG,CAAC,CAAC;AAAA,IACP;AAAA,IAEA,uBAAuB,KAAK,UAAU;AACpC,aAAO,SAAS,IAAI,SAAS,CAAC;AAAA,IAChC;AAAA,IAEA,eAAe,CAAC,EAAE,OAAO,UAAU,OAAO,gBAAgB,SAAS,MAAM;AACvE,YAAM,aAAa,CAAC,CAAC,eAAe,WAC9B,YAAY,WAAW,CAAC,MAAM,IAC9B,mBAAmB,WAAW,CAAC,GAE/B,CAAC,cAAc,eAAe,IAAI,MAAM,QAAQ,MAAM,UAAU,IAClE,MAAM,aACN,CAAC,MAAM,UAAU,GACf,YAAY,WAAW,YAAY,GACnC,OAAO,MAAM,eAAe,CAAC,KAAK;AA0CxC,cAxCA,4CAA0B,MAAM;AAC9B,cAAM,OAAO,SAAS,QAAQ;AAC9B,YAAI,CAAC,oBAAoB,CAAC,aAAa,CAAC,KAAM;AAC9C,cAAM,OAAO,MAYP,oBAAoB,YAAY,gBAAgB,SAAS,IAAI,KAC7D,QACJ,OAAO,iBAAiB,SAAU,WAAW,gBAAgB,QAAQ,GACjE,kBAAkB,oBAAoB,OAEtC,YAAY,WAAW,MAAM;AACjC,6BAAmB;AAAA,QACrB,GAAG,eAAe,GAGZ,oBAAoB,MAAM;AAC9B,uBAAa,SAAS,GACtB,mBAAmB;AAAA,QACrB;AAEA,oBAAK,iBAAiB,iBAAiB,iBAAiB,GACxD,KAAK,iBAAiB,oBAAoB,iBAAiB,GAEpD,MAAM;AACX,uBAAa,SAAS,GACtB,KAAK,oBAAoB,iBAAiB,iBAAiB,GAC3D,KAAK,oBAAoB,oBAAoB,iBAAiB;AAAA,QAChE;AAAA,MACF,GAAG,CAAC,kBAAkB,SAAS,CAAC,GAE5B,WAAW;AACb,QAAI,MAAM,QAAQ,MAAM,SAAS,MAC/B,MAAM,gBAAY,+BAAmB,MAAM,SAAS;AAMtD,cAAM,QACJ,OAAO,iBAAiB,SAAU,WAAW,IAAI,gBAAgB,KAAK,OAAO;AAC/E,cAAM,aAAa,KAChB,IAAI,CAAC,QAAQ;AACZ,gBAAM,WAAW,WAAW,kBAAkB,GAAG,CAAC,KAAK;AACvD,iBAAO,GAAG,GAAG,IAAI,QAAQ,GAAG,KAAK;AAAA,QACnC,CAAC,EACA,KAAK,IAAI;AAAA,MACd;AAcA,aAZI,QAAQ,IAAI,aAAa,iBAAiB,MAAM,UAAa,aAC/D,QAAQ,KAAK,iBAAiB;AAAA,QAC5B;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF,CAAC,GAGE,YAIE,EAAE,OAAO,WAAW,aAAa,gBAAgB,GAAG,IAHlD;AAAA,IAIX;AAAA,EACF;AACF;",
-  "names": ["React", "onFinish"]
+  "mappings": "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",
+  "names": ["React", "onFinish", "hasNormalizedAnimation"]
 }

package/dist/cjs/createAnimations.native.js

@@ -36,10 +36,16 @@ __export(createAnimations_exports, {
   createAnimations: () => createAnimations
 });
 module.exports = __toCommonJS(createAnimations_exports);
-var import_constants = require("@tamagui/constants"),
+var import_animation_helpers = require("@tamagui/animation-helpers"),
+  import_constants = require("@tamagui/constants"),
   import_use_presence = require("@tamagui/use-presence"),
   import_web = require("@tamagui/web"),
   import_react = __toESM(require("react"), 1);
+function _type_of(obj) {
+  "@swc/helpers - typeof";
+
+  return obj && typeof Symbol < "u" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
 function extractDuration(animation) {
   var msMatch = animation.match(/(\d+(?:\.\d+)?)\s*ms/);
   if (msMatch) return Number.parseInt(msMatch[1], 10);
@@ -102,17 +108,19 @@ function createAnimations(animations) {
         isEntering = !!componentState.unmounted,
         isExiting = presence?.[0] === !1,
         sendExitComplete = presence?.[1],
-        [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition],
-        animation = animations[animationKey],
+        normalized = (0, import_animation_helpers.normalizeTransition)(props.transition),
+        defaultAnimation = normalized.default ? animations[normalized.default] : null,
+        animatedProperties = (0, import_animation_helpers.getAnimatedProperties)(normalized),
         _props_animateOnly,
-        keys = (_props_animateOnly = props.animateOnly) !== null && _props_animateOnly !== void 0 ? _props_animateOnly : ["all"];
+        keys = animatedProperties.length > 0 ? animatedProperties : (_props_animateOnly = props.animateOnly) !== null && _props_animateOnly !== void 0 ? _props_animateOnly : ["all"];
       if ((0, import_constants.useIsomorphicLayoutEffect)(function () {
         var host = stateRef.current.host;
         if (!(!sendExitComplete || !isExiting || !host)) {
           var node = host,
-            animationDuration = animation ? extractDuration(animation) : 200,
-            delay2 = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0,
-            fallbackTimeout = animationDuration + delay2,
+            animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200,
+            _normalized_delay,
+            delay = (_normalized_delay = normalized.delay) !== null && _normalized_delay !== void 0 ? _normalized_delay : 0,
+            fallbackTimeout = animationDuration + delay,
             timeoutId = setTimeout(function () {
               sendExitComplete?.();
             }, fallbackTimeout),
@@ -123,27 +131,25 @@ function createAnimations(animations) {
             clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
           };
         }
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
-        var delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map(function (key) {
-          var _animations_animationConfig_key,
-            override = (_animations_animationConfig_key = animations[animationConfig?.[key]]) !== null && _animations_animationConfig_key !== void 0 ? _animations_animationConfig_key : animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !(0, import_animation_helpers.hasAnimation)(normalized)) return null;
+      Array.isArray(style.transform) && (style.transform = (0, import_web.transformsToString)(style.transform));
+      var delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map(function (key) {
+        var propAnimation = normalized.properties[key],
+          animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && (typeof propAnimation > "u" ? "undefined" : _type_of(propAnimation)) === "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? {
+      }), {
         style,
         className: isEntering ? "t_unmounted" : ""
-      } : null;
+      };
     }
   };
 }

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

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","createAnimations_exports","__export","createAnimations","module","exports","import_constants","require","import_use_presence","import_web","import_react","__toESM","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","animations","reactionListeners","WeakMap","usePresence","ResetPresence","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","default","useState","onFinish","setOnFinish","useIsomorphicLayoutEffect","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","param","onValue","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","animationKey","animationConfig","Array","isArray","transition","_props_animateOnly","keys","animateOnly","host","current","node","animationDuration","delay2","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","transform","transformsToString","map","key","_animations_animationConfig_key","override","join","process","env","NODE_ENV","debug","console","info"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","createAnimations_exports","__export","createAnimations","module","exports","import_animation_helpers","require","import_constants","import_use_presence","import_web","import_react","__toESM","_type_of","obj","Symbol","constructor","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","animations","reactionListeners","WeakMap","usePresence","ResetPresence","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","default","useState","onFinish","setOnFinish","useIsomorphicLayoutEffect","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","param","onValue","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","normalized","normalizeTransition","transition","defaultAnimation","animatedProperties","getAnimatedProperties","_props_animateOnly","keys","length","animateOnly","host","current","node","animationDuration","_normalized_delay","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","hasAnimation","Array","isArray","transform","transformsToString","delayStr","map","key","propAnimation","properties","animationValue","type"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/createAnimations.js

@@ -1,3 +1,8 @@
+import {
+  normalizeTransition,
+  getAnimatedProperties,
+  hasAnimation as hasNormalizedAnimation
+} from "@tamagui/animation-helpers";
 import { useIsomorphicLayoutEffect } from "@tamagui/constants";
 import { ResetPresence, usePresence } from "@tamagui/use-presence";
 import { transformsToString } from "@tamagui/web";
@@ -52,11 +57,11 @@ function createAnimations(animations) {
       return getStyle(val.getValue());
     },
     useAnimations: ({ props, presence, style, componentState, stateRef }) => {
-      const isEntering = !!componentState.unmounted, isExiting = presence?.[0] === !1, sendExitComplete = presence?.[1], [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition], animation = animations[animationKey], keys = props.animateOnly ?? ["all"];
+      const isEntering = !!componentState.unmounted, isExiting = presence?.[0] === !1, sendExitComplete = presence?.[1], normalized = normalizeTransition(props.transition), defaultAnimation = normalized.default ? animations[normalized.default] : null, animatedProperties = getAnimatedProperties(normalized), keys = animatedProperties.length > 0 ? animatedProperties : props.animateOnly ?? ["all"];
       if (useIsomorphicLayoutEffect(() => {
         const host = stateRef.current.host;
         if (!sendExitComplete || !isExiting || !host) return;
-        const node = host, animationDuration = animation ? extractDuration(animation) : 200, delay = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0, fallbackTimeout = animationDuration + delay, timeoutId = setTimeout(() => {
+        const node = host, animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200, delay = normalized.delay ?? 0, fallbackTimeout = animationDuration + delay, timeoutId = setTimeout(() => {
           sendExitComplete?.();
         }, fallbackTimeout), onFinishAnimation = () => {
           clearTimeout(timeoutId), sendExitComplete?.();
@@ -64,23 +69,23 @@ function createAnimations(animations) {
         return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
           clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
         };
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
-        const delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map((key) => {
-          const override = animations[animationConfig?.[key]] ?? animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !hasNormalizedAnimation(normalized))
+        return null;
+      Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
+      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map((key) => {
+        const propAnimation = normalized.properties[key];
+        let animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && typeof propAnimation == "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? { style, className: isEntering ? "t_unmounted" : "" } : null;
+      }), { style, className: isEntering ? "t_unmounted" : "" };
     }
   };
 }

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": ["onFinish"]
 }

package/dist/esm/createAnimations.mjs

@@ -1,3 +1,4 @@
+import { normalizeTransition, getAnimatedProperties, hasAnimation as hasNormalizedAnimation } from "@tamagui/animation-helpers";
 import { useIsomorphicLayoutEffect } from "@tamagui/constants";
 import { ResetPresence, usePresence } from "@tamagui/use-presence";
 import { transformsToString } from "@tamagui/web";
@@ -62,15 +63,16 @@ function createAnimations(animations) {
       const isEntering = !!componentState.unmounted,
         isExiting = presence?.[0] === !1,
         sendExitComplete = presence?.[1],
-        [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition],
-        animation = animations[animationKey],
-        keys = props.animateOnly ?? ["all"];
+        normalized = normalizeTransition(props.transition),
+        defaultAnimation = normalized.default ? animations[normalized.default] : null,
+        animatedProperties = getAnimatedProperties(normalized),
+        keys = animatedProperties.length > 0 ? animatedProperties : props.animateOnly ?? ["all"];
       if (useIsomorphicLayoutEffect(() => {
         const host = stateRef.current.host;
         if (!sendExitComplete || !isExiting || !host) return;
         const node = host,
-          animationDuration = animation ? extractDuration(animation) : 200,
-          delay = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0,
+          animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200,
+          delay = normalized.delay ?? 0,
           fallbackTimeout = animationDuration + delay,
           timeoutId = setTimeout(() => {
             sendExitComplete?.();
@@ -81,26 +83,25 @@ function createAnimations(animations) {
         return node.addEventListener("transitionend", onFinishAnimation), node.addEventListener("transitioncancel", onFinishAnimation), () => {
           clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
         };
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
-        const delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map(key => {
-          const override = animations[animationConfig?.[key]] ?? animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !hasNormalizedAnimation(normalized)) return null;
+      Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
+      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map(key => {
+        const propAnimation = normalized.properties[key];
+        let animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && typeof propAnimation == "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? {
+      }), {
         style,
         className: isEntering ? "t_unmounted" : ""
-      } : null;
+      };
     }
   };
 }

package/dist/esm/createAnimations.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["useIsomorphicLayoutEffect","ResetPresence","usePresence","transformsToString","React","useState","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","createAnimations","animations","reactionListeners","WeakMap","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","onFinish","setOnFinish","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","value","onValue","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","animationKey","animationConfig","Array","isArray","transition","keys","animateOnly","host","current","node","animationDuration","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","transform","map","key","override","join","process","env","NODE_ENV","debug","console","info","className"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["normalizeTransition","getAnimatedProperties","hasAnimation","hasNormalizedAnimation","useIsomorphicLayoutEffect","ResetPresence","usePresence","transformsToString","React","useState","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","createAnimations","animations","reactionListeners","WeakMap","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","onFinish","setOnFinish","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","value","onValue","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","normalized","transition","defaultAnimation","default","animatedProperties","keys","length","animateOnly","host","current","node","animationDuration","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","Array","isArray","transform","delayStr","map","key","propAnimation","properties","animationValue","type","filter","Boolean","join","process","env","NODE_ENV","debug","console","info","className"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/esm/createAnimations.native.js

@@ -1,7 +1,13 @@
+import { normalizeTransition, getAnimatedProperties, hasAnimation as hasNormalizedAnimation } from "@tamagui/animation-helpers";
 import { useIsomorphicLayoutEffect } from "@tamagui/constants";
 import { ResetPresence, usePresence } from "@tamagui/use-presence";
 import { transformsToString } from "@tamagui/web";
 import React, { useState } from "react";
+function _type_of(obj) {
+  "@swc/helpers - typeof";
+
+  return obj && typeof Symbol < "u" && obj.constructor === Symbol ? "symbol" : typeof obj;
+}
 function extractDuration(animation) {
   var msMatch = animation.match(/(\d+(?:\.\d+)?)\s*ms/);
   if (msMatch) return Number.parseInt(msMatch[1], 10);
@@ -64,17 +70,19 @@ function createAnimations(animations) {
         isEntering = !!componentState.unmounted,
         isExiting = presence?.[0] === !1,
         sendExitComplete = presence?.[1],
-        [animationKey, animationConfig] = Array.isArray(props.transition) ? props.transition : [props.transition],
-        animation = animations[animationKey],
+        normalized = normalizeTransition(props.transition),
+        defaultAnimation = normalized.default ? animations[normalized.default] : null,
+        animatedProperties = getAnimatedProperties(normalized),
         _props_animateOnly,
-        keys = (_props_animateOnly = props.animateOnly) !== null && _props_animateOnly !== void 0 ? _props_animateOnly : ["all"];
+        keys = animatedProperties.length > 0 ? animatedProperties : (_props_animateOnly = props.animateOnly) !== null && _props_animateOnly !== void 0 ? _props_animateOnly : ["all"];
       if (useIsomorphicLayoutEffect(function () {
         var host = stateRef.current.host;
         if (!(!sendExitComplete || !isExiting || !host)) {
           var node = host,
-            animationDuration = animation ? extractDuration(animation) : 200,
-            delay2 = typeof animationConfig?.delay == "number" ? animationConfig.delay : 0,
-            fallbackTimeout = animationDuration + delay2,
+            animationDuration = defaultAnimation ? extractDuration(defaultAnimation) : 200,
+            _normalized_delay,
+            delay = (_normalized_delay = normalized.delay) !== null && _normalized_delay !== void 0 ? _normalized_delay : 0,
+            fallbackTimeout = animationDuration + delay,
             timeoutId = setTimeout(function () {
               sendExitComplete?.();
             }, fallbackTimeout),
@@ -85,27 +93,25 @@ function createAnimations(animations) {
             clearTimeout(timeoutId), node.removeEventListener("transitionend", onFinishAnimation), node.removeEventListener("transitioncancel", onFinishAnimation);
           };
         }
-      }, [sendExitComplete, isExiting]), animation) {
-        Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
-        var delay = typeof animationConfig?.delay == "number" ? ` ${animationConfig.delay}ms` : "";
-        style.transition = keys.map(function (key) {
-          var _animations_animationConfig_key,
-            override = (_animations_animationConfig_key = animations[animationConfig?.[key]]) !== null && _animations_animationConfig_key !== void 0 ? _animations_animationConfig_key : animation;
-          return `${key} ${override}${delay}`;
-        }).join(", ");
-      }
-      return process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
+      }, [sendExitComplete, isExiting]), !hasNormalizedAnimation(normalized)) return null;
+      Array.isArray(style.transform) && (style.transform = transformsToString(style.transform));
+      var delayStr = normalized.delay ? ` ${normalized.delay}ms` : "";
+      return style.transition = keys.map(function (key) {
+        var propAnimation = normalized.properties[key],
+          animationValue = null;
+        return typeof propAnimation == "string" ? animationValue = animations[propAnimation] : propAnimation && (typeof propAnimation > "u" ? "undefined" : _type_of(propAnimation)) === "object" && propAnimation.type ? animationValue = animations[propAnimation.type] : defaultAnimation && (animationValue = defaultAnimation), animationValue ? `${key} ${animationValue}${delayStr}` : null;
+      }).filter(Boolean).join(", "), process.env.NODE_ENV === "development" && props.debug === "verbose" && console.info("CSS animation", {
         props,
         animations,
-        animation,
-        animationKey,
+        normalized,
+        defaultAnimation,
         style,
         isEntering,
         isExiting
-      }), animation ? {
+      }), {
         style,
         className: isEntering ? "t_unmounted" : ""
-      } : null;
+      };
     }
   };
 }

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

@@ -1 +1 @@
-{"version":3,"names":["useIsomorphicLayoutEffect","ResetPresence","usePresence","transformsToString","React","useState","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","createAnimations","animations","reactionListeners","WeakMap","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","onFinish","setOnFinish","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","param","onValue","value","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","animationKey","animationConfig","Array","isArray","transition","_props_animateOnly","keys","animateOnly","host","current","node","animationDuration","delay2","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","transform","map","key","_animations_animationConfig_key","override","join","process","env","NODE_ENV","debug","console","info"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["normalizeTransition","getAnimatedProperties","hasAnimation","hasNormalizedAnimation","useIsomorphicLayoutEffect","ResetPresence","usePresence","transformsToString","React","useState","_type_of","obj","Symbol","constructor","extractDuration","animation","msMatch","match","Number","parseInt","sMatch","Math","round","parseFloat","createAnimations","animations","reactionListeners","WeakMap","supportsCSS","classNameAnimation","useAnimatedNumber","initial","val","setVal","onFinish","setOnFinish","getInstance","getValue","setValue","next","config","onFinish2","stop","useAnimatedNumberReaction","param","onValue","value","useEffect","instance","queue","get","Set","set","add","delete","useAnimatedNumberStyle","getStyle","useAnimations","props","presence","style","componentState","stateRef","isEntering","unmounted","isExiting","sendExitComplete","normalized","transition","defaultAnimation","default","animatedProperties","_props_animateOnly","keys","length","animateOnly","host","current","node","animationDuration","_normalized_delay","delay","fallbackTimeout","timeoutId","setTimeout","onFinishAnimation","clearTimeout","addEventListener","removeEventListener","Array","isArray","transform","delayStr","map","key","propAnimation","properties","animationValue","type","filter","Boolean","join","process","env","NODE_ENV","debug","console","info"],"sources":["../../src/createAnimations.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/animations-css",
-  "version": "2.0.0-1768326993354",
+  "version": "2.0.0-1768530912818",
   "type": "module",
   "source": "src/index.ts",
   "sideEffects": false,
@@ -29,13 +29,14 @@
     }
   },
   "dependencies": {
-    "@tamagui/constants": "2.0.0-1768326993354",
-    "@tamagui/cubic-bezier-animator": "2.0.0-1768326993354",
-    "@tamagui/use-presence": "2.0.0-1768326993354",
-    "@tamagui/web": "2.0.0-1768326993354"
+    "@tamagui/animation-helpers": "2.0.0-1768530912818",
+    "@tamagui/constants": "2.0.0-1768530912818",
+    "@tamagui/cubic-bezier-animator": "2.0.0-1768530912818",
+    "@tamagui/use-presence": "2.0.0-1768530912818",
+    "@tamagui/web": "2.0.0-1768530912818"
   },
   "devDependencies": {
-    "@tamagui/build": "2.0.0-1768326993354",
+    "@tamagui/build": "2.0.0-1768530912818",
     "react": "*",
     "react-dom": "*"
   },

package/src/createAnimations.tsx

@@ -1,3 +1,8 @@
+import {
+  normalizeTransition,
+  getAnimatedProperties,
+  hasAnimation as hasNormalizedAnimation,
+} from '@tamagui/animation-helpers'
 import { useIsomorphicLayoutEffect } from '@tamagui/constants'
 import { ResetPresence, usePresence } from '@tamagui/use-presence'
 import type { AnimationDriver, UniversalAnimatedNumber } from '@tamagui/web'
@@ -86,12 +91,17 @@ export function createAnimations<A extends Object>(animations: A): AnimationDriv
       const isEntering = !!componentState.unmounted
       const isExiting = presence?.[0] === false
       const sendExitComplete = presence?.[1]
-      // const initialPositionRef = useRef<any>(null)
-      const [animationKey, animationConfig] = Array.isArray(props.transition)
-        ? props.transition
-        : [props.transition]
-      const animation = animations[animationKey]
-      const keys = props.animateOnly ?? ['all']
+      // Normalize the transition prop to a consistent format
+      const normalized = normalizeTransition(props.transition)
+      const defaultAnimation = normalized.default ? animations[normalized.default] : null
+      const animatedProperties = getAnimatedProperties(normalized)
+
+      // Determine which properties to animate
+      // If object format with properties specified, use those; otherwise use animateOnly or 'all'
+      const keys =
+        animatedProperties.length > 0
+          ? animatedProperties
+          : (props.animateOnly ?? ['all'])
 
       useIsomorphicLayoutEffect(() => {
         const host = stateRef.current.host
@@ -108,9 +118,10 @@ export function createAnimations<A extends Object>(animations: A): AnimationDriv
          */
 
         // Use timeout as primary, transition events as backup for reliable exit handling
-        const animationDuration = animation ? extractDuration(animation) : 200
-        const delay =
-          typeof animationConfig?.delay === 'number' ? animationConfig.delay : 0
+        const animationDuration = defaultAnimation
+          ? extractDuration(defaultAnimation)
+          : 200
+        const delay = normalized.delay ?? 0
         const fallbackTimeout = animationDuration + delay
 
         const timeoutId = setTimeout(() => {
@@ -133,40 +144,54 @@ export function createAnimations<A extends Object>(animations: A): AnimationDriv
         }
       }, [sendExitComplete, isExiting])
 
-      if (animation) {
-        if (Array.isArray(style.transform)) {
-          style.transform = transformsToString(style.transform)
-        }
+      // Check if we have any animation to apply
+      if (!hasNormalizedAnimation(normalized)) {
+        return null
+      }
 
-        // add css transition
-        // TODO: we disabled the transform transition, because it will create issue for inverse function and animate function
-        // for non layout transform properties either use animate function or find a workaround to do it with css
-        const delay =
-          typeof animationConfig?.delay === 'number' ? ` ${animationConfig.delay}ms` : ''
-        style.transition = keys
-          .map((key) => {
-            const override = animations[animationConfig?.[key]] ?? animation
-            return `${key} ${override}${delay}`
-          })
-          .join(', ')
+      if (Array.isArray(style.transform)) {
+        style.transform = transformsToString(style.transform)
       }
 
+      // Build CSS transition string
+      // TODO: we disabled the transform transition, because it will create issue for inverse function and animate function
+      // for non layout transform properties either use animate function or find a workaround to do it with css
+      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : ''
+      style.transition = keys
+        .map((key) => {
+          // Check for property-specific animation, fall back to default
+          const propAnimation = normalized.properties[key]
+          let animationValue: string | null = null
+
+          if (typeof propAnimation === 'string') {
+            animationValue = animations[propAnimation]
+          } else if (
+            propAnimation &&
+            typeof propAnimation === 'object' &&
+            propAnimation.type
+          ) {
+            animationValue = animations[propAnimation.type]
+          } else if (defaultAnimation) {
+            animationValue = defaultAnimation
+          }
+
+          return animationValue ? `${key} ${animationValue}${delayStr}` : null
+        })
+        .filter(Boolean)
+        .join(', ')
+
       if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {
         console.info('CSS animation', {
           props,
           animations,
-          animation,
-          animationKey,
+          normalized,
+          defaultAnimation,
           style,
           isEntering,
           isExiting,
         })
       }
 
-      if (!animation) {
-        return null
-      }
-
       return { style, className: isEntering ? 't_unmounted' : '' }
     },
   }

package/types/createAnimations.d.ts.map

@@ -1,11 +1,11 @@
 {
-  "mappings": "AAEA,cAAc,uBAAgD;AA0B9D,OAAO,iBAAS,iBAAiB,UAAU,QAAQ,YAAY,IAAI,gBAAgB",
+  "mappings": "AAOA,cAAc,uBAAgD;AA0B9D,OAAO,iBAAS,iBAAiB,UAAU,QAAQ,YAAY,IAAI,gBAAgB",
   "names": [],
   "sources": [
     "src/createAnimations.tsx"
   ],
   "sourcesContent": [
-    "import { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { ResetPresence, usePresence } from '@tamagui/use-presence'\nimport type { AnimationDriver, UniversalAnimatedNumber } from '@tamagui/web'\nimport { transformsToString } from '@tamagui/web'\nimport React, { useState } from 'react' // import { animate } from '@tamagui/cubic-bezier-animator'\n\n/**\n * Helper function to extract duration from CSS animation string\n * Examples: \"ease-in 200ms\" -> 200, \"cubic-bezier(0.215, 0.610, 0.355, 1.000) 400ms\" -> 400\n * \"ease-in 0.5s\" -> 500, \"slow 2s\" -> 2000\n */\nfunction extractDuration(animation: string): number {\n  // Try to match milliseconds first\n  const msMatch = animation.match(/(\\d+(?:\\.\\d+)?)\\s*ms/)\n  if (msMatch) {\n    return Number.parseInt(msMatch[1], 10)\n  }\n\n  // Try to match seconds and convert to milliseconds\n  const sMatch = animation.match(/(\\d+(?:\\.\\d+)?)\\s*s/)\n  if (sMatch) {\n    return Math.round(Number.parseFloat(sMatch[1]) * 1000)\n  }\n\n  // Default to 300ms if no duration found\n  return 300\n}\n\nexport function createAnimations<A extends Object>(animations: A): AnimationDriver<A> {\n  const reactionListeners = new WeakMap<any, Set<Function>>()\n\n  return {\n    animations,\n    usePresence,\n    ResetPresence,\n    supportsCSS: true,\n    classNameAnimation: true,\n\n    useAnimatedNumber(initial): UniversalAnimatedNumber<Function> {\n      const [val, setVal] = React.useState(initial)\n      const [onFinish, setOnFinish] = useState<Function | undefined>()\n\n      useIsomorphicLayoutEffect(() => {\n        if (onFinish) {\n          onFinish?.()\n          setOnFinish(undefined)\n        }\n      }, [onFinish])\n\n      return {\n        getInstance() {\n          return setVal\n        },\n        getValue() {\n          return val\n        },\n        setValue(next, config, onFinish) {\n          setVal(next)\n          setOnFinish(onFinish)\n        },\n        stop() {},\n      }\n    },\n\n    useAnimatedNumberReaction({ value }, onValue) {\n      React.useEffect(() => {\n        const instance = value.getInstance()\n        let queue = reactionListeners.get(instance)\n        if (!queue) {\n          const next = new Set<Function>()\n          reactionListeners.set(instance, next)\n          queue = next!\n        }\n        queue.add(onValue)\n        return () => {\n          queue?.delete(onValue)\n        }\n      }, [])\n    },\n\n    useAnimatedNumberStyle(val, getStyle) {\n      return getStyle(val.getValue())\n    },\n\n    useAnimations: ({ props, presence, style, componentState, stateRef }) => {\n      const isEntering = !!componentState.unmounted\n      const isExiting = presence?.[0] === false\n      const sendExitComplete = presence?.[1]\n      // const initialPositionRef = useRef<any>(null)\n      const [animationKey, animationConfig] = Array.isArray(props.transition)\n        ? props.transition\n        : [props.transition]\n      const animation = animations[animationKey]\n      const keys = props.animateOnly ?? ['all']\n\n      useIsomorphicLayoutEffect(() => {\n        const host = stateRef.current.host\n        if (!sendExitComplete || !isExiting || !host) return\n        const node = host as HTMLElement\n\n        /**\n         * Exit animation handling for Dialog/Modal components\n         *\n         * The Challenge: When users close dialogs (via Escape key or clicking outside),\n         * the element can disappear from the DOM before CSS transitions finish, which causes:\n         * 1. Dialogs to stick around on screen\n         * 2. Event handlers to stop working\n         */\n\n        // Use timeout as primary, transition events as backup for reliable exit handling\n        const animationDuration = animation ? extractDuration(animation) : 200\n        const delay =\n          typeof animationConfig?.delay === 'number' ? animationConfig.delay : 0\n        const fallbackTimeout = animationDuration + delay\n\n        const timeoutId = setTimeout(() => {\n          sendExitComplete?.()\n        }, fallbackTimeout)\n\n        // Listen for transition completion events as backup\n        const onFinishAnimation = () => {\n          clearTimeout(timeoutId)\n          sendExitComplete?.()\n        }\n\n        node.addEventListener('transitionend', onFinishAnimation)\n        node.addEventListener('transitioncancel', onFinishAnimation)\n\n        return () => {\n          clearTimeout(timeoutId)\n          node.removeEventListener('transitionend', onFinishAnimation)\n          node.removeEventListener('transitioncancel', onFinishAnimation)\n        }\n      }, [sendExitComplete, isExiting])\n\n      if (animation) {\n        if (Array.isArray(style.transform)) {\n          style.transform = transformsToString(style.transform)\n        }\n\n        // add css transition\n        // TODO: we disabled the transform transition, because it will create issue for inverse function and animate function\n        // for non layout transform properties either use animate function or find a workaround to do it with css\n        const delay =\n          typeof animationConfig?.delay === 'number' ? ` ${animationConfig.delay}ms` : ''\n        style.transition = keys\n          .map((key) => {\n            const override = animations[animationConfig?.[key]] ?? animation\n            return `${key} ${override}${delay}`\n          })\n          .join(', ')\n      }\n\n      if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n        console.info('CSS animation', {\n          props,\n          animations,\n          animation,\n          animationKey,\n          style,\n          isEntering,\n          isExiting,\n        })\n      }\n\n      if (!animation) {\n        return null\n      }\n\n      return { style, className: isEntering ? 't_unmounted' : '' }\n    },\n  }\n}\n\n// layout animations\n// useIsomorphicLayoutEffect(() => {\n//   if (!host || !props.layout) {\n//     return\n//   }\n//   // @ts-ignore\n//   const boundingBox = host?.getBoundingClientRect()\n//   if (isChanged(initialPositionRef.current, boundingBox)) {\n//     const transform = invert(\n//       host,\n//       boundingBox,\n//       initialPositionRef.current\n//     )\n\n//     animate({\n//       from: transform,\n//       to: { x: 0, y: 0, scaleX: 1, scaleY: 1 },\n//       duration: 1000,\n//       onUpdate: ({ x, y, scaleX, scaleY }) => {\n//         // @ts-ignore\n//         host.style.transform = `translate(${x}px, ${y}px) scaleX(${scaleX}) scaleY(${scaleY})`\n//         // TODO: handle childRef inverse scale\n//         //   childRef.current.style.transform = `scaleX(${1 / scaleX}) scaleY(${\n//         //     1 / scaleY\n//         //   })`\n//       },\n//       // TODO: extract ease-in from string and convert/map it to a cubicBezier array\n//       cubicBezier: [0, 1.38, 1, -0.41],\n//     })\n//   }\n//   initialPositionRef.current = boundingBox\n// })\n\n// style.transition = `${keys} ${animation}${\n//   props.layout ? ',width 0s, height 0s, margin 0s, padding 0s, transform' : ''\n// }`\n\n// const isChanged = (initialBox: any, finalBox: any) => {\n//   // we just mounted, so we don't have complete data yet\n//   if (!initialBox || !finalBox) return false\n\n//   // deep compare the two boxes\n//   return JSON.stringify(initialBox) !== JSON.stringify(finalBox)\n// }\n\n// const invert = (el, from, to) => {\n//   const { x: fromX, y: fromY, width: fromWidth, height: fromHeight } = from\n//   const { x, y, width, height } = to\n\n//   const transform = {\n//     x: x - fromX - (fromWidth - width) / 2,\n//     y: y - fromY - (fromHeight - height) / 2,\n//     scaleX: width / fromWidth,\n//     scaleY: height / fromHeight,\n//   }\n\n//   el.style.transform = `\n"
+    "import {\n  normalizeTransition,\n  getAnimatedProperties,\n  hasAnimation as hasNormalizedAnimation,\n} from '@tamagui/animation-helpers'\nimport { useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport { ResetPresence, usePresence } from '@tamagui/use-presence'\nimport type { AnimationDriver, UniversalAnimatedNumber } from '@tamagui/web'\nimport { transformsToString } from '@tamagui/web'\nimport React, { useState } from 'react' // import { animate } from '@tamagui/cubic-bezier-animator'\n\n/**\n * Helper function to extract duration from CSS animation string\n * Examples: \"ease-in 200ms\" -> 200, \"cubic-bezier(0.215, 0.610, 0.355, 1.000) 400ms\" -> 400\n * \"ease-in 0.5s\" -> 500, \"slow 2s\" -> 2000\n */\nfunction extractDuration(animation: string): number {\n  // Try to match milliseconds first\n  const msMatch = animation.match(/(\\d+(?:\\.\\d+)?)\\s*ms/)\n  if (msMatch) {\n    return Number.parseInt(msMatch[1], 10)\n  }\n\n  // Try to match seconds and convert to milliseconds\n  const sMatch = animation.match(/(\\d+(?:\\.\\d+)?)\\s*s/)\n  if (sMatch) {\n    return Math.round(Number.parseFloat(sMatch[1]) * 1000)\n  }\n\n  // Default to 300ms if no duration found\n  return 300\n}\n\nexport function createAnimations<A extends Object>(animations: A): AnimationDriver<A> {\n  const reactionListeners = new WeakMap<any, Set<Function>>()\n\n  return {\n    animations,\n    usePresence,\n    ResetPresence,\n    supportsCSS: true,\n    classNameAnimation: true,\n\n    useAnimatedNumber(initial): UniversalAnimatedNumber<Function> {\n      const [val, setVal] = React.useState(initial)\n      const [onFinish, setOnFinish] = useState<Function | undefined>()\n\n      useIsomorphicLayoutEffect(() => {\n        if (onFinish) {\n          onFinish?.()\n          setOnFinish(undefined)\n        }\n      }, [onFinish])\n\n      return {\n        getInstance() {\n          return setVal\n        },\n        getValue() {\n          return val\n        },\n        setValue(next, config, onFinish) {\n          setVal(next)\n          setOnFinish(onFinish)\n        },\n        stop() {},\n      }\n    },\n\n    useAnimatedNumberReaction({ value }, onValue) {\n      React.useEffect(() => {\n        const instance = value.getInstance()\n        let queue = reactionListeners.get(instance)\n        if (!queue) {\n          const next = new Set<Function>()\n          reactionListeners.set(instance, next)\n          queue = next!\n        }\n        queue.add(onValue)\n        return () => {\n          queue?.delete(onValue)\n        }\n      }, [])\n    },\n\n    useAnimatedNumberStyle(val, getStyle) {\n      return getStyle(val.getValue())\n    },\n\n    useAnimations: ({ props, presence, style, componentState, stateRef }) => {\n      const isEntering = !!componentState.unmounted\n      const isExiting = presence?.[0] === false\n      const sendExitComplete = presence?.[1]\n      // Normalize the transition prop to a consistent format\n      const normalized = normalizeTransition(props.transition)\n      const defaultAnimation = normalized.default ? animations[normalized.default] : null\n      const animatedProperties = getAnimatedProperties(normalized)\n\n      // Determine which properties to animate\n      // If object format with properties specified, use those; otherwise use animateOnly or 'all'\n      const keys =\n        animatedProperties.length > 0\n          ? animatedProperties\n          : (props.animateOnly ?? ['all'])\n\n      useIsomorphicLayoutEffect(() => {\n        const host = stateRef.current.host\n        if (!sendExitComplete || !isExiting || !host) return\n        const node = host as HTMLElement\n\n        /**\n         * Exit animation handling for Dialog/Modal components\n         *\n         * The Challenge: When users close dialogs (via Escape key or clicking outside),\n         * the element can disappear from the DOM before CSS transitions finish, which causes:\n         * 1. Dialogs to stick around on screen\n         * 2. Event handlers to stop working\n         */\n\n        // Use timeout as primary, transition events as backup for reliable exit handling\n        const animationDuration = defaultAnimation\n          ? extractDuration(defaultAnimation)\n          : 200\n        const delay = normalized.delay ?? 0\n        const fallbackTimeout = animationDuration + delay\n\n        const timeoutId = setTimeout(() => {\n          sendExitComplete?.()\n        }, fallbackTimeout)\n\n        // Listen for transition completion events as backup\n        const onFinishAnimation = () => {\n          clearTimeout(timeoutId)\n          sendExitComplete?.()\n        }\n\n        node.addEventListener('transitionend', onFinishAnimation)\n        node.addEventListener('transitioncancel', onFinishAnimation)\n\n        return () => {\n          clearTimeout(timeoutId)\n          node.removeEventListener('transitionend', onFinishAnimation)\n          node.removeEventListener('transitioncancel', onFinishAnimation)\n        }\n      }, [sendExitComplete, isExiting])\n\n      // Check if we have any animation to apply\n      if (!hasNormalizedAnimation(normalized)) {\n        return null\n      }\n\n      if (Array.isArray(style.transform)) {\n        style.transform = transformsToString(style.transform)\n      }\n\n      // Build CSS transition string\n      // TODO: we disabled the transform transition, because it will create issue for inverse function and animate function\n      // for non layout transform properties either use animate function or find a workaround to do it with css\n      const delayStr = normalized.delay ? ` ${normalized.delay}ms` : ''\n      style.transition = keys\n        .map((key) => {\n          // Check for property-specific animation, fall back to default\n          const propAnimation = normalized.properties[key]\n          let animationValue: string | null = null\n\n          if (typeof propAnimation === 'string') {\n            animationValue = animations[propAnimation]\n          } else if (\n            propAnimation &&\n            typeof propAnimation === 'object' &&\n            propAnimation.type\n          ) {\n            animationValue = animations[propAnimation.type]\n          } else if (defaultAnimation) {\n            animationValue = defaultAnimation\n          }\n\n          return animationValue ? `${key} ${animationValue}${delayStr}` : null\n        })\n        .filter(Boolean)\n        .join(', ')\n\n      if (process.env.NODE_ENV === 'development' && props['debug'] === 'verbose') {\n        console.info('CSS animation', {\n          props,\n          animations,\n          normalized,\n          defaultAnimation,\n          style,\n          isEntering,\n          isExiting,\n        })\n      }\n\n      return { style, className: isEntering ? 't_unmounted' : '' }\n    },\n  }\n}\n\n// layout animations\n// useIsomorphicLayoutEffect(() => {\n//   if (!host || !props.layout) {\n//     return\n//   }\n//   // @ts-ignore\n//   const boundingBox = host?.getBoundingClientRect()\n//   if (isChanged(initialPositionRef.current, boundingBox)) {\n//     const transform = invert(\n//       host,\n//       boundingBox,\n//       initialPositionRef.current\n//     )\n\n//     animate({\n//       from: transform,\n//       to: { x: 0, y: 0, scaleX: 1, scaleY: 1 },\n//       duration: 1000,\n//       onUpdate: ({ x, y, scaleX, scaleY }) => {\n//         // @ts-ignore\n//         host.style.transform = `translate(${x}px, ${y}px) scaleX(${scaleX}) scaleY(${scaleY})`\n//         // TODO: handle childRef inverse scale\n//         //   childRef.current.style.transform = `scaleX(${1 / scaleX}) scaleY(${\n//         //     1 / scaleY\n//         //   })`\n//       },\n//       // TODO: extract ease-in from string and convert/map it to a cubicBezier array\n//       cubicBezier: [0, 1.38, 1, -0.41],\n//     })\n//   }\n//   initialPositionRef.current = boundingBox\n// })\n\n// style.transition = `${keys} ${animation}${\n//   props.layout ? ',width 0s, height 0s, margin 0s, padding 0s, transform' : ''\n// }`\n\n// const isChanged = (initialBox: any, finalBox: any) => {\n//   // we just mounted, so we don't have complete data yet\n//   if (!initialBox || !finalBox) return false\n\n//   // deep compare the two boxes\n//   return JSON.stringify(initialBox) !== JSON.stringify(finalBox)\n// }\n\n// const invert = (el, from, to) => {\n//   const { x: fromX, y: fromY, width: fromWidth, height: fromHeight } = from\n//   const { x, y, width, height } = to\n\n//   const transform = {\n//     x: x - fromX - (fromWidth - width) / 2,\n//     y: y - fromY - (fromHeight - height) / 2,\n//     scaleX: width / fromWidth,\n//     scaleY: height / fromHeight,\n//   }\n\n//   el.style.transform = `\n"
   ],
   "version": 3
 }