Add support for arbitrary transition delay

src/corePlugins/transitionDelay.js

@@ -1,17 +1,15 @@
-const { nameClass } = require('../pluginUtils')
+const { nameClass, asValue } = require('../pluginUtils')
 
 module.exports = function ({ matchUtilities, jit: { theme } }) {
   matchUtilities({
     delay: (modifier, { theme }) => {
-      let value = theme.transitionDelay[modifier]
+      let value = asValue(modifier, theme.transitionDelay)
 
       if (value === undefined) {
         return []
       }
 
-      return {
-        [nameClass('delay', modifier)]: { 'transition-delay': value },
-      }
+      return { [nameClass('delay', modifier)]: { 'transition-delay': value } }
     },
   })
 }

tests/arbitrary-values.test.css

@@ -136,6 +136,9 @@
 .text-\[2\.23rem\] {
   font-size: 2.23rem;
 }
+.delay-\[0ms\] {
+  transition-delay: 0ms;
+}
 .duration-\[2s\] {
   transition-duration: 2s;
 }

tests/arbitrary-values.test.html

@@ -43,5 +43,6 @@
     <div class="duration-[var(--app-duration)]"></div>
     <div class="p-[var(--app-padding)]"></div>
     <div class="inset-[11px]"></div>
+    <div class="delay-[0ms]"></div>
   </body>
 </html>