@tamagui/static 2.4.6 → 2.5.0

package/dist/extractor/createExtractor.cjs

@@ -1266,9 +1266,11 @@ function createExtractor({
           const inlineProps = /* @__PURE__ */new Set([
           // adding some always inline props
           ...(restProps.inlineProps || []), ...(staticConfig.inlineProps || [])]);
+          const canFlattenTransition = isTargetingHTML && tamaguiConfig?.animations.outputStyle === "css" && !tamaguiConfig.animationDrivers;
           const deoptProps = /* @__PURE__ */new Set([
-          // always de-opt animation these
-          "animation", "animateOnly", "animatePresence", "disableOptimization", ...(!isTargetingHTML ? [
+          // css-only transitions lower to ordinary css; every runtime driver
+          // needs the component preserved so it can respond to prop changes.
+          "animation", ...(canFlattenTransition ? [] : ["transition"]), "animateOnly", "animatePresence", "disableOptimization", ...(!isTargetingHTML ? [
           // native has no css pseudo selectors; these are runtime-only on
           // rn (event listeners + style merge in createComponent), and if
           // we let them flatten into the stylesheet they get written

package/dist/extractor/extractToClassNames.cjs

@@ -160,11 +160,13 @@ async function extractToClassNames({
           cssMap.get(containerSelector).commentTexts.push(comment);
         }
       }
+      const hasCSSOnlyAnimationDriver = tamaguiConfig.animations.outputStyle === "css" && !tamaguiConfig.animationDrivers;
       let elementIsAnimated = false;
       for (const attr of jsxPath.node.openingElement.attributes) {
         if (!t.isJSXAttribute(attr) || !t.isJSXIdentifier(attr.name)) continue;
         const n = attr.name.name;
-        if (n === "animation" || n === "animateOnly" || n === "animatePresence" || n === "animatedBy" || n === "enterStyle" || n === "exitStyle") {
+        if (n === "transition" && hasCSSOnlyAnimationDriver) continue;
+        if (n === "animation" || n === "transition" || n === "animateOnly" || n === "animatePresence" || n === "animatedBy" || n === "enterStyle" || n === "exitStyle") {
           elementIsAnimated = true;
           break;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/static",
-  "version": "2.4.6",
+  "version": "2.5.0",
   "gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
   "license": "MIT",
   "source": "src/index.ts",
@@ -50,19 +50,19 @@
     "@babel/template": "^7.25.0",
     "@babel/traverse": "^7.25.4",
     "@babel/types": "^7.25.4",
-    "@tamagui/cli-color": "2.4.6",
-    "@tamagui/config-default": "2.4.6",
-    "@tamagui/core": "2.4.6",
-    "@tamagui/fake-react-native": "2.4.6",
-    "@tamagui/generate-themes": "2.4.6",
-    "@tamagui/helpers": "2.4.6",
-    "@tamagui/helpers-node": "2.4.6",
-    "@tamagui/proxy-worm": "2.4.6",
-    "@tamagui/react-native-web-internals": "2.4.6",
-    "@tamagui/react-native-web-lite": "2.4.6",
-    "@tamagui/shorthands": "2.4.6",
-    "@tamagui/types": "2.4.6",
-    "@tamagui/web": "2.4.6",
+    "@tamagui/cli-color": "2.5.0",
+    "@tamagui/config-default": "2.5.0",
+    "@tamagui/core": "2.5.0",
+    "@tamagui/fake-react-native": "2.5.0",
+    "@tamagui/generate-themes": "2.5.0",
+    "@tamagui/helpers": "2.5.0",
+    "@tamagui/helpers-node": "2.5.0",
+    "@tamagui/proxy-worm": "2.5.0",
+    "@tamagui/react-native-web-internals": "2.5.0",
+    "@tamagui/react-native-web-lite": "2.5.0",
+    "@tamagui/shorthands": "2.5.0",
+    "@tamagui/types": "2.5.0",
+    "@tamagui/web": "2.5.0",
     "babel-literal-to-ast": "^2.1.0",
     "browserslist": "^4.28.1",
     "check-dependency-version-consistency": "^4.1.0",
@@ -79,7 +79,7 @@
   },
   "devDependencies": {
     "@babel/plugin-syntax-typescript": "^7.25.4",
-    "@tamagui/build": "2.4.6",
+    "@tamagui/build": "2.5.0",
     "@types/babel__core": "^7.20.5",
     "@types/find-root": "^1.1.2",
     "@types/node": "^22.1.0",
@@ -96,5 +96,10 @@
   },
   "tests": {
     "parallel": true
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/tamagui/tamagui.git",
+    "directory": "code/compiler/static"
   }
 }

package/src/extractor/createExtractor.ts

@@ -1149,9 +1149,16 @@ export function createExtractor(
             ...(staticConfig.inlineProps || []),
           ])
 
+          const canFlattenTransition =
+            isTargetingHTML &&
+            tamaguiConfig?.animations.outputStyle === 'css' &&
+            !tamaguiConfig.animationDrivers
+
           const deoptProps = new Set([
-            // always de-opt animation these
+            // css-only transitions lower to ordinary css; every runtime driver
+            // needs the component preserved so it can respond to prop changes.
             'animation',
+            ...(canFlattenTransition ? [] : ['transition']),
             'animateOnly',
             'animatePresence',
             'disableOptimization',

package/src/extractor/extractToClassNames.ts

@@ -214,17 +214,20 @@ export async function extractToClassNames({
       // is isReactNative:false yet still needs JS.
       //
       // in practice createExtractor's deoptProps already de-opts every animated
-      // element upstream (`animation`/`animateOnly`/`animatePresence` always;
-      // enterStyle/exitStyle on RN drivers), so a flattened element reaching here
-      // is normally non-animated and this never fires. it keeps the invariant
-      // local and correct regardless of future deoptProps changes — it only ever
-      // bails the animated case to runtime, never widens what extracts.
+      // element upstream except CSS-only transitions, which lower to ordinary
+      // CSS. it keeps the invariant local and correct regardless of future
+      // deoptProps changes — it only ever bails the animated case to runtime,
+      // never widens what extracts.
+      const hasCSSOnlyAnimationDriver =
+        tamaguiConfig.animations.outputStyle === 'css' && !tamaguiConfig.animationDrivers
       let elementIsAnimated = false
       for (const attr of jsxPath.node.openingElement.attributes) {
         if (!t.isJSXAttribute(attr) || !t.isJSXIdentifier(attr.name)) continue
         const n = attr.name.name
+        if (n === 'transition' && hasCSSOnlyAnimationDriver) continue
         if (
           n === 'animation' ||
+          n === 'transition' ||
           n === 'animateOnly' ||
           n === 'animatePresence' ||
           n === 'animatedBy' ||

package/types/extractor/createExtractor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createExtractor.d.ts","sourceRoot":"","sources":["../../src/extractor/createExtractor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAmB,MAAM,iBAAiB,CAAA;AAEhE,OAAO,KAAK,CAAC,MAAM,cAAc,CAAA;AAmBjC,OAAO,KAAK,EAGV,gBAAgB,EAChB,mBAAmB,EACnB,cAAc,EAGf,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAoB,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAc1E,OAAO,EAAE,iBAAiB,EAA6B,MAAM,6BAA6B,CAAA;AAwB1F,MAAM,MAAM,SAAS,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAA;AAE1D,KAAK,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,CAAA;AAuD9C,wBAAgB,eAAe,CAC7B,EAAE,MAAgB,EAAE,QAAgB,EAAE,GAAE,gBAAsC;;;;;yBAsJnD,cAAc;6BAPhB,cAAc;;mBAwBtB,UAAU,SAAS,mBAAmB;;;;;;;eAKpC,UAAU,SAAS,mBAAmB;;;;;;;EA4lF1D"}
+{"version":3,"file":"createExtractor.d.ts","sourceRoot":"","sources":["../../src/extractor/createExtractor.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAmB,MAAM,iBAAiB,CAAA;AAEhE,OAAO,KAAK,CAAC,MAAM,cAAc,CAAA;AAmBjC,OAAO,KAAK,EAGV,gBAAgB,EAChB,mBAAmB,EACnB,cAAc,EAGf,MAAM,UAAU,CAAA;AACjB,OAAO,KAAK,EAAoB,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AAc1E,OAAO,EAAE,iBAAiB,EAA6B,MAAM,6BAA6B,CAAA;AAwB1F,MAAM,MAAM,SAAS,GAAG,UAAU,CAAC,OAAO,eAAe,CAAC,CAAA;AAE1D,KAAK,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,IAAI,CAAA;AAuD9C,wBAAgB,eAAe,CAC7B,EAAE,MAAgB,EAAE,QAAgB,EAAE,GAAE,gBAAsC;;;;;yBAsJnD,cAAc;6BAPhB,cAAc;;mBAwBtB,UAAU,SAAS,mBAAmB;;;;;;;eAKpC,UAAU,SAAS,mBAAmB;;;;;;;EAmmF1D"}

package/types/extractor/extractToClassNames.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extractToClassNames.d.ts","sourceRoot":"","sources":["../../src/extractor/extractToClassNames.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,CAAC,MAAM,cAAc,CAAA;AAKjC,OAAO,KAAK,EAAe,cAAc,EAAW,MAAM,UAAU,CAAA;AAEpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAYlD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,CAAC,CAAC,IAAI,CAAA;IACX,GAAG,EAAE,GAAG,CAAA;IACR,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAA;QACd,SAAS,EAAE,MAAM,CAAA;QACjB,SAAS,EAAE,MAAM,CAAA;QACjB,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;CACF,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,SAAS,CAAA;IACpB,MAAM,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,cAAc,CAAA;IACvB,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAA;CACtC,CAAA;AAQD,wBAAsB,mBAAmB,CAAC,EACxC,SAAS,EACT,MAAM,EACN,UAAe,EACf,OAAO,EACP,gBAAgB,GACjB,EAAE,wBAAwB,GAAG,OAAO,CAAC,iBAAiB,GAAG,IAAI,CAAC,CA8mB9D"}
+{"version":3,"file":"extractToClassNames.d.ts","sourceRoot":"","sources":["../../src/extractor/extractToClassNames.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,CAAC,MAAM,cAAc,CAAA;AAKjC,OAAO,KAAK,EAAe,cAAc,EAAW,MAAM,UAAU,CAAA;AAEpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAYlD,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,GAAG,MAAM,CAAA;IACnB,MAAM,EAAE,MAAM,CAAA;IACd,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,GAAG,EAAE,CAAC,CAAC,IAAI,CAAA;IACX,GAAG,EAAE,GAAG,CAAA;IACR,KAAK,EAAE;QACL,MAAM,EAAE,MAAM,CAAA;QACd,SAAS,EAAE,MAAM,CAAA;QACjB,SAAS,EAAE,MAAM,CAAA;QACjB,KAAK,EAAE,MAAM,CAAA;KACd,CAAA;CACF,CAAA;AAED,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,SAAS,CAAA;IACpB,MAAM,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,cAAc,CAAA;IACvB,gBAAgB,EAAE,OAAO,GAAG,SAAS,CAAA;CACtC,CAAA;AAQD,wBAAsB,mBAAmB,CAAC,EACxC,SAAS,EACT,MAAM,EACN,UAAe,EACf,OAAO,EACP,gBAAgB,GACjB,EAAE,wBAAwB,GAAG,OAAO,CAAC,iBAAiB,GAAG,IAAI,CAAC,CAinB9D"}