Skip to content

Commit f564ff1

Browse files
giaBaoJSzyyv
andauthored
fix(preset-wind3,preset-wind4): match global keywords in prefixed animate utilities (#5302)
Co-authored-by: Chris <hizyyv@gmail.com>
1 parent 6ec81db commit f564ff1

7 files changed

Lines changed: 26 additions & 6 deletions

File tree

packages-presets/preset-wind3/src/rules/animation.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const animations: Rule<Theme>[] = [
3838
[/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ 'animation-timing-function': theme.easing?.[d || 'DEFAULT'] ?? h.bracket.cssvar(d) }), { autocomplete: ['animate-ease', 'animate-ease-$easing'] }],
3939

4040
// fill mode
41-
[/^animate-(fill-mode-|fill-|mode-)?(.+)$/, ([, t, d]) => ['none', 'forwards', 'backwards', 'both', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-fill-mode': d } : undefined, {
41+
[/^animate-(fill-mode-|fill-|mode-)?(.+)$/, ([, t, d]) => ['none', 'forwards', 'backwards', 'both', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-fill-mode': d } : undefined, {
4242
autocomplete: [
4343
'animate-(fill|mode|fill-mode)',
4444
'animate-(fill|mode|fill-mode)-(none|forwards|backwards|both|inherit|initial|revert|revert-layer|unset)',
@@ -47,7 +47,7 @@ export const animations: Rule<Theme>[] = [
4747
}],
4848

4949
// direction
50-
[/^animate-(direction-)?(.+)$/, ([, t, d]) => ['normal', 'reverse', 'alternate', 'alternate-reverse', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-direction': d } : undefined, {
50+
[/^animate-(direction-)?(.+)$/, ([, t, d]) => ['normal', 'reverse', 'alternate', 'alternate-reverse', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-direction': d } : undefined, {
5151
autocomplete: [
5252
'animate-direction',
5353
'animate-direction-(normal|reverse|alternate|alternate-reverse|inherit|initial|revert|revert-layer|unset)',
@@ -57,7 +57,7 @@ export const animations: Rule<Theme>[] = [
5757

5858
// others
5959
[/^animate-(?:iteration-count-|iteration-|count-)(.+)$/, ([, d]) => ({ 'animation-iteration-count': h.bracket.cssvar(d) ?? d.replace(/-/g, ',') }), { autocomplete: ['animate-(iteration|count|iteration-count)', 'animate-(iteration|count|iteration-count)-<num>'] }],
60-
[/^animate-(play-state-|play-|state-)?(.+)$/, ([, t, d]) => ['paused', 'running', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-play-state': d } : undefined, {
60+
[/^animate-(play-state-|play-|state-)?(.+)$/, ([, t, d]) => ['paused', 'running', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-play-state': d } : undefined, {
6161
autocomplete: [
6262
'animate-(play|state|play-state)',
6363
'animate-(play|state|play-state)-(paused|running|inherit|initial|revert|revert-layer|unset)',

packages-presets/preset-wind4/src/rules/animation.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ export const animations: Rule<Theme>[] = [
3838
[/^animate-ease(?:-(.+))?$/, ([, d], { theme }) => ({ 'animation-timing-function': theme.ease?.[d || 'DEFAULT'] ?? h.bracket.cssvar(d, theme) }), { autocomplete: ['animate-ease', 'animate-ease-$ease'] }],
3939

4040
// fill mode
41-
[/^animate-(fill-mode-|fill-|mode-)?(.+)$/, ([, t, d]) => ['none', 'forwards', 'backwards', 'both', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-fill-mode': d } : undefined, {
41+
[/^animate-(fill-mode-|fill-|mode-)?(.+)$/, ([, t, d]) => ['none', 'forwards', 'backwards', 'both', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-fill-mode': d } : undefined, {
4242
autocomplete: [
4343
'animate-(fill|mode|fill-mode)',
4444
'animate-(fill|mode|fill-mode)-(none|forwards|backwards|both|inherit|initial|revert|revert-layer|unset)',
@@ -47,7 +47,7 @@ export const animations: Rule<Theme>[] = [
4747
}],
4848

4949
// direction
50-
[/^animate-(direction-)?(.+)$/, ([, t, d]) => ['normal', 'reverse', 'alternate', 'alternate-reverse', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-direction': d } : undefined, {
50+
[/^animate-(direction-)?(.+)$/, ([, t, d]) => ['normal', 'reverse', 'alternate', 'alternate-reverse', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-direction': d } : undefined, {
5151
autocomplete: [
5252
'animate-direction',
5353
'animate-direction-(normal|reverse|alternate|alternate-reverse|inherit|initial|revert|revert-layer|unset)',
@@ -57,7 +57,7 @@ export const animations: Rule<Theme>[] = [
5757

5858
// others
5959
[/^animate-(?:iteration-count-|iteration-|count-)(.+)$/, ([, d], { theme }) => ({ 'animation-iteration-count': h.bracket.cssvar(d, theme) ?? d.replace(/-/g, ',') }), { autocomplete: ['animate-(iteration|count|iteration-count)', 'animate-(iteration|count|iteration-count)-<num>'] }],
60-
[/^animate-(play-state-|play-|state-)?(.+)$/, ([, t, d]) => ['paused', 'running', ...[t ? globalKeywords : []]].includes(d) ? { 'animation-play-state': d } : undefined, {
60+
[/^animate-(play-state-|play-|state-)?(.+)$/, ([, t, d]) => ['paused', 'running', ...(t ? globalKeywords : [])].includes(d) ? { 'animation-play-state': d } : undefined, {
6161
autocomplete: [
6262
'animate-(play|state|play-state)',
6363
'animate-(play|state|play-state)-(paused|running|inherit|initial|revert|revert-layer|unset)',

test/__snapshots__/postcss.test.ts.snap

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -82,8 +82,11 @@ exports[`postcss > @unocss 1`] = `
8282
.animate-ease-linear{animation-timing-function:linear;}
8383
.animate-fill-backwards{animation-fill-mode:backwards;}
8484
.animate-fill-mode-both{animation-fill-mode:both;}
85+
.animate-fill-mode-inherit{animation-fill-mode:inherit;}
8586
.animate-mode-none{animation-fill-mode:none;}
87+
.animate-mode-unset{animation-fill-mode:unset;}
8688
.animate-direction-alternate-reverse{animation-direction:alternate-reverse;}
89+
.animate-direction-revert{animation-direction:revert;}
8790
.animate-normal{animation-direction:normal;}
8891
.animate-reverse{animation-direction:reverse;}
8992
.animate-count-2\\.4{animation-iteration-count:2.4;}
@@ -94,6 +97,7 @@ exports[`postcss > @unocss 1`] = `
9497
.animate-iteration-count-\\$variable{animation-iteration-count:var(--variable);}
9598
.animate-paused,
9699
.animate-play-paused{animation-play-state:paused;}
100+
.animate-play-state-initial{animation-play-state:initial;}
97101
.animate-play-state-running,
98102
.animate-state-running{animation-play-state:running;}
99103
.animate-none{animation:none;}

test/assets/output/preset-wind3-targets.css

Lines changed: 4 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

test/assets/output/preset-wind4-targets.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1422,8 +1422,11 @@ unocss .scope-\[unocss\]\:block{display:block;}
14221422
.animate-ease-linear{animation-timing-function:linear;}
14231423
.animate-fill-backwards{animation-fill-mode:backwards;}
14241424
.animate-fill-mode-both{animation-fill-mode:both;}
1425+
.animate-fill-mode-inherit{animation-fill-mode:inherit;}
14251426
.animate-mode-none{animation-fill-mode:none;}
1427+
.animate-mode-unset{animation-fill-mode:unset;}
14261428
.animate-direction-alternate-reverse{animation-direction:alternate-reverse;}
1429+
.animate-direction-revert{animation-direction:revert;}
14271430
.animate-normal{animation-direction:normal;}
14281431
.animate-reverse{animation-direction:reverse;}
14291432
.animate-count-2\.4{animation-iteration-count:2.4;}
@@ -1434,6 +1437,7 @@ unocss .scope-\[unocss\]\:block{display:block;}
14341437
.animate-iteration-count-\$variable{animation-iteration-count:var(--variable);}
14351438
.animate-paused,
14361439
.animate-play-paused{animation-play-state:paused;}
1440+
.animate-play-state-initial{animation-play-state:initial;}
14371441
.animate-play-state-running,
14381442
.animate-state-running{animation-play-state:running;}
14391443
.animate-none{animation:none;}

test/assets/preset-wind3-targets.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,10 @@ export const targets = [
4646
'animate-fill-backwards',
4747
'animate-reverse',
4848
'animate-direction-alternate-reverse',
49+
'animate-fill-mode-inherit',
50+
'animate-mode-unset',
51+
'animate-direction-revert',
52+
'animate-play-state-initial',
4953
'animate-count-2.4',
5054
'animate-iteration-2',
5155
'animate-iteration-count-2',

test/assets/preset-wind4-targets.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -62,6 +62,10 @@ export const presetWind4Targets: string[] = [
6262
'animate-fill-backwards',
6363
'animate-reverse',
6464
'animate-direction-alternate-reverse',
65+
'animate-fill-mode-inherit',
66+
'animate-mode-unset',
67+
'animate-direction-revert',
68+
'animate-play-state-initial',
6569
'animate-count-2.4',
6670
'animate-iteration-2',
6771
'animate-iteration-count-2',

0 commit comments

Comments
 (0)
Sponsor
SponsoredKunjungi sekarang
Promo