Make ease-linear a static utility (#14880)

This PR removes `--transition-timing-function-linear` from the default
theme in favor of a static `ease-linear` utility. Doesn't make sense for
this to be a design token since `linear` can only mean `linear`.

This is consistent with how we handle basically every other similar case
in the framework.

---------

Co-authored-by: Adam Wathan <[email protected]>

Author: adamwathan

CHANGELOG.md

@@ -29,6 +29,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - Rename `drop-shadow` to `drop-shadow-sm` and `drop-shadow-sm` to `drop-shadow-xs` ([#14849](https://github.com/tailwindlabs/tailwindcss/pull/14849))
 - Rename `rounded` to `rounded-sm` and `rounded-sm` to `rounded-xs` ([#14849](https://github.com/tailwindlabs/tailwindcss/pull/14849))
 - Rename `blur` to `blur-sm` and `blur-sm` to `blur-xs` ([#14849](https://github.com/tailwindlabs/tailwindcss/pull/14849))
+- Remove `--transition-timing-function-linear` from the default theme in favor of a static `ease-linear` utility ([#14880](https://github.com/tailwindlabs/tailwindcss/pull/14880))
 
 ## [4.0.0-alpha.31] - 2024-10-29
 

packages/@tailwindcss-postcss/src/__snapshots__/index.test.ts.snap

@@ -399,7 +399,6 @@ exports[`\`@import 'tailwindcss'\` is replaced with the generated CSS 1`] = `
     --perspective-normal: 500px;
     --perspective-midrange: 800px;
     --perspective-distant: 1200px;
-    --transition-timing-function-linear: linear;
     --transition-timing-function-in: cubic-bezier(.4, 0, 1, 1);
     --transition-timing-function-out: cubic-bezier(0, 0, .2, 1);
     --transition-timing-function-in-out: cubic-bezier(.4, 0, .2, 1);

packages/tailwindcss/src/__snapshots__/index.test.ts.snap

@@ -398,7 +398,6 @@ exports[`compiling CSS > \`@tailwind utilities\` is replaced by utilities using
   --perspective-normal: 500px;
   --perspective-midrange: 800px;
   --perspective-distant: 1200px;
-  --transition-timing-function-linear: linear;
   --transition-timing-function-in: cubic-bezier(.4, 0, 1, 1);
   --transition-timing-function-out: cubic-bezier(0, 0, .2, 1);
   --transition-timing-function-in-out: cubic-bezier(.4, 0, .2, 1);

packages/tailwindcss/src/__snapshots__/intellisense.test.ts.snap

@@ -1912,6 +1912,7 @@ exports[`getClassList 1`] = `
   "duration-75",
   "duration-initial",
   "ease-initial",
+  "ease-linear",
   "end-0.5",
   "end-1",
   "end-3",

packages/tailwindcss/src/utilities.ts

@@ -3792,7 +3792,11 @@ export function createUtilities(theme: Theme) {
     }
 
     staticUtility('ease-initial', [transitionTimingFunctionProperty, ['--tw-ease', 'initial']])
-
+    staticUtility('ease-linear', [
+      transitionTimingFunctionProperty,
+      ['--tw-ease', 'linear'],
+      ['transition-timing-function', 'linear'],
+    ])
     functionalUtility('ease', {
       themeKeys: ['--transition-timing-function'],
       handle: (value) => [

packages/tailwindcss/theme.css

@@ -452,7 +452,6 @@
   --perspective-distant: 1200px;
 
   /* Transition timing functions */
-  --transition-timing-function-linear: linear;
   --transition-timing-function-in: cubic-bezier(0.4, 0, 1, 1);
   --transition-timing-function-out: cubic-bezier(0, 0, 0.2, 1);
   --transition-timing-function-in-out: cubic-bezier(0.4, 0, 0.2, 1);