mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
40 lines
1.0 KiB
JavaScript
40 lines
1.0 KiB
JavaScript
const { nameClass } = require('../pluginUtils')
|
|
const transformThemeValue = require('../../lib/util/transformThemeValue').default
|
|
const parseAnimationValue = require('../../lib/util/parseAnimationValue').default
|
|
|
|
module.exports = function ({ matchUtilities, theme }) {
|
|
let keyframes = Object.fromEntries(
|
|
Object.entries(theme('keyframes')).map(([key, value]) => {
|
|
return [
|
|
key,
|
|
[
|
|
{
|
|
[`@keyframes ${key}`]: value,
|
|
},
|
|
{ respectVariants: false },
|
|
],
|
|
]
|
|
})
|
|
)
|
|
|
|
let transformValue = transformThemeValue('animation')
|
|
matchUtilities({
|
|
animate: [
|
|
(modifier, { theme }) => {
|
|
let value = transformValue(theme.animation[modifier])
|
|
|
|
if (modifier === '' || value === undefined) {
|
|
return []
|
|
}
|
|
|
|
let { name: animationName } = parseAnimationValue(value)
|
|
|
|
return [
|
|
keyframes[animationName],
|
|
{ [nameClass('animate', modifier)]: { animation: value } },
|
|
].filter(Boolean)
|
|
},
|
|
],
|
|
})
|
|
}
|