Add transition-behavior utilities

tailwindlabs · Oct 5, 2023 · 4498cad · 4498cad
1 parent 614c7e2
commit 4498cad
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 0 deletions.
diff --git a/src/corePlugins.js b/src/corePlugins.js
@@ -2860,6 +2860,12 @@ export let corePlugins = {
     )
   },
 
+  transitionBehavior: ({ addUtilities }) => {
+    addUtilities({
+      '.transition-allow-discrete': { 'transition-behavior': 'allow-discrete' },
+      '.transition-behavior-normal': { 'transition-behavior': 'normal' },
+    })
+  },
   transitionDelay: createUtilityPlugin('transitionDelay', [['delay', ['transitionDelay']]]),
   transitionDuration: createUtilityPlugin(
     'transitionDuration',

diff --git a/tests/plugins/transitionBehavior.js b/tests/plugins/transitionBehavior.js
@@ -0,0 +1,10 @@
+import { css, quickPluginTest } from '../util/run'
+
+quickPluginTest('transitionBehavior').toMatchFormattedCss(css`
+  .transition-allow-discrete {
+    transition-behavior: allow-discrete;
+  }
+  .transition-behavior-normal {
+    transition-behavior: normal;
+  }
+`)