Skip to content

Commit 60649d3

Browse files
tenphitenphi
committed
chore: migrate to new mod value syntax
1 parent b9149f2 commit 60649d3

File tree

20 files changed

+115
-117
lines changed

20 files changed

+115
-117
lines changed

‎src/components/actions/Button/Button.tsx‎

Lines changed: 21 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -105,12 +105,12 @@ export const DEFAULT_BUTTON_STYLES = {
105105
},
106106
gap: {
107107
'': '.75x',
108-
'[data-size="small"]': '.5x',
108+
'size=small': '.5x',
109109
},
110110
preset: {
111111
'': 't3m',
112-
'[data-size="xsmall"]': 't4',
113-
'[data-size="xlarge"]': 't2m',
112+
'size=xsmall': 't4',
113+
'size=xlarge': 't2m',
114114
},
115115
textDecoration: 'none',
116116
transition: 'theme',
@@ -119,34 +119,34 @@ export const DEFAULT_BUTTON_STYLES = {
119119
outlineOffset: 1,
120120
padding: {
121121
'': '.5x (1.5x - 1bw)',
122-
'[data-size="small"] | [data-size="xsmall"]': '.5x (1.25x - 1bw)',
123-
'[data-size="medium"]': '.5x (1.5x - 1bw)',
124-
'[data-size="large"]': '.5x (1.75x - 1bw)',
125-
'[data-size="xlarge"]': '.5x (2x - 1bw)',
126-
'single-icon | [data-type="link"]': 0,
122+
'size=small | size=xsmall': '.5x (1.25x - 1bw)',
123+
'size=medium': '.5x (1.5x - 1bw)',
124+
'size=large': '.5x (1.75x - 1bw)',
125+
'size=xlarge': '.5x (2x - 1bw)',
126+
'single-icon | type=link': 0,
127127
},
128128
width: {
129129
'': 'initial',
130-
'[data-size="xsmall"] & single-icon': '$size-xs $size-xs',
131-
'[data-size="small"] & single-icon': '$size-sm $size-sm',
132-
'[data-size="medium"] & single-icon': '$size-md $size-md',
133-
'[data-size="large"] & single-icon': '$size-lg $size-lg',
134-
'[data-size="xlarge"] & single-icon': '$size-xl $size-xl',
135-
'[data-type="link"]': 'initial',
130+
'size=xsmall & single-icon': '$size-xs $size-xs',
131+
'size=small & single-icon': '$size-sm $size-sm',
132+
'size=medium & single-icon': '$size-md $size-md',
133+
'size=large & single-icon': '$size-lg $size-lg',
134+
'size=xlarge & single-icon': '$size-xl $size-xl',
135+
'type=link': 'initial',
136136
},
137137
height: {
138138
'': 'initial',
139-
'[data-size="xsmall"]': '$size-xs $size-xs',
140-
'[data-size="small"]': '$size-sm $size-sm',
141-
'[data-size="medium"]': '$size-md $size-md',
142-
'[data-size="large"]': '$size-lg $size-lg',
143-
'[data-size="xlarge"]': '$size-xl $size-xl',
144-
'[data-type="link"]': 'initial',
139+
'size=xsmall': '$size-xs $size-xs',
140+
'size=small': '$size-sm $size-sm',
141+
'size=medium': '$size-md $size-md',
142+
'size=large': '$size-lg $size-lg',
143+
'size=xlarge': '$size-xl $size-xl',
144+
'type=link': 'initial',
145145
},
146146
whiteSpace: 'nowrap',
147147
radius: {
148148
'': true,
149-
'[data-type="link"] & !focused': 0,
149+
'type=link & !focused': 0,
150150
},
151151

152152
ButtonIcon: {

‎src/components/actions/CommandMenu/styled.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,9 @@ export const StyledSearchInput = tasty({
5757

5858
$size: {
5959
'': '$size-md',
60-
'[data-size="small"]': '$size-sm',
61-
'[data-size="medium"]': '$size-md',
62-
'[data-size="large"]': '$size-lg',
60+
'size=small': '$size-sm',
61+
'size=medium': '$size-md',
62+
'size=large': '$size-lg',
6363
},
6464
},
6565
});

‎src/components/actions/ItemAction/ItemAction.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -86,7 +86,7 @@ const ItemActionElement = tasty({
8686

8787
'$inline-padding': {
8888
'': 'max($min-inline-padding, (($action-size - 1lh - 2bw) / 2 + $inline-compensation))',
89-
'[data-size="inline"]': '.25x',
89+
'size=inline': '.25x',
9090
},
9191
'$inline-compensation': '.5x',
9292
'$min-inline-padding': '(.5x - 1bw)',

‎src/components/actions/Menu/styled.tsx‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -83,9 +83,9 @@ export const StyledHeader = tasty(Space, {
8383

8484
$size: {
8585
'': '$size-md',
86-
'[data-size="small"]': '$size-sm',
87-
'[data-size="medium"]': '$size-md',
88-
'[data-size="large"]': '$size-lg',
86+
'size=small': '$size-sm',
87+
'size=medium': '$size-md',
88+
'size=large': '$size-lg',
8989
},
9090
},
9191
});
@@ -103,7 +103,7 @@ export const StyledFooter = tasty(Space, {
103103
padding: '.5x 1.5x',
104104
height: {
105105
'': 'min $size-md',
106-
'[data-size="large"]': 'min $size-lg',
106+
'size=large': 'min $size-lg',
107107
},
108108
boxSizing: 'border-box',
109109
border: 'top',
@@ -140,7 +140,7 @@ export const StyledItem = tasty({
140140
flexShrink: 0,
141141
height: {
142142
'': 'min $size-md',
143-
'[data-size="large"]': 'min $size-lg',
143+
'size=large': 'min $size-lg',
144144
},
145145
border: false,
146146
boxSizing: 'border-box',
@@ -218,9 +218,9 @@ export const StyledSectionHeading = tasty(Space, {
218218

219219
$size: {
220220
'': '$size-md',
221-
'[data-size="small"]': '$size-sm',
222-
'[data-size="medium"]': '$size-md',
223-
'[data-size="large"]': '$size-lg',
221+
'size=small': '$size-sm',
222+
'size=medium': '$size-md',
223+
'size=large': '$size-lg',
224224
},
225225
},
226226
});

‎src/components/content/Alert/Alert.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -18,12 +18,12 @@ const AlertElement = tasty({
1818
preset: 't3',
1919
color: {
2020
'': '#dark-02',
21-
'[data-type="disabled"]': THEMES.disabled.color,
21+
'type=disabled': THEMES.disabled.color,
2222
},
2323
fill: {
2424
'': '#clear',
2525
...Object.keys(THEMES).reduce((map, type) => {
26-
map[`[data-type="${type}"]`] = THEMES[type].fill;
26+
map[`type=${type}`] = THEMES[type].fill;
2727

2828
return map;
2929
}, {}),

‎src/components/content/Badge/Badge.tsx‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@ const BadgeElement = tasty(Item, {
1313
fill: {
1414
'': '#purple',
1515
...Object.keys(THEMES).reduce((map, type) => {
16-
map[`[data-theme="${type}"]`] =
16+
map[`theme=${type}`] =
1717
type === 'special' ? THEMES[type].fill : THEMES[type].color;
1818

1919
return map;
@@ -22,7 +22,7 @@ const BadgeElement = tasty(Item, {
2222

2323
'$inline-padding': {
2424
'': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',
25-
'[data-size="inline"]': '.5x',
25+
'size=inline': '.5x',
2626
},
2727

2828
Label: {

‎src/components/content/CopyPasteBlock/CopyPasteBlock.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -63,12 +63,12 @@ const CopyPasteBlockElement = tasty(Card, {
6363
cursor: 'pointer',
6464
preset: {
6565
'': 't3',
66-
'[data-size="large"]': 't2',
66+
'size=large': 't2',
6767
},
6868
height: {
6969
'': '5x',
70-
'[data-size="small"]': '4x',
71-
'[data-size="large"]': '6x',
70+
'size=small': '4x',
71+
'size=large': '6x',
7272
},
7373
boxSizing: 'border-box',
7474

‎src/components/content/HotKeys/HotKeys.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,15 +41,15 @@ const KeyElement = tasty({
4141
padding: '0 (.5x - 1bw)',
4242
color: {
4343
'': '#dark.65',
44-
'[data-type="primary"]': '#white',
44+
'type=primary': '#white',
4545
},
4646
fill: {
4747
'': '#dark.04',
48-
'[data-type="primary"]': '#clear',
48+
'type=primary': '#clear',
4949
},
5050
border: {
5151
'': true,
52-
'[data-type="primary"]': '#white',
52+
'type=primary': '#white',
5353
},
5454
},
5555
});

‎src/components/content/Tag/Tag.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -12,23 +12,23 @@ const TagElement = tasty(Item, {
1212
fill: {
1313
'': '#dark.04',
1414
...Object.keys(THEMES).reduce((map, type) => {
15-
map[`[data-type="${type}"]`] = THEMES[type].fill;
15+
map[`type=${type}`] = THEMES[type].fill;
1616

1717
return map;
1818
}, {}),
1919
},
2020
color: {
2121
'': '#dark.65',
2222
...Object.keys(THEMES).reduce((map, type) => {
23-
map[`[data-type="${type}"]`] = THEMES[type].color;
23+
map[`type=${type}`] = THEMES[type].color;
2424

2525
return map;
2626
}, {}),
2727
},
2828
border: {
2929
'': true,
3030
...Object.keys(THEMES).reduce((map, type) => {
31-
map[`[data-type="${type}"]`] = THEMES[type].border;
31+
map[`type=${type}`] = THEMES[type].border;
3232

3333
return map;
3434
}, {}),

‎src/components/content/Title.tsx‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -34,12 +34,12 @@ const TitleElement = tasty({
3434
color: '#dark',
3535
preset: {
3636
'': 'h6',
37-
'[data-level="1"]': 'h1',
38-
'[data-level="2"]': 'h2',
39-
'[data-level="3"]': 'h3',
40-
'[data-level="4"]': 'h4',
41-
'[data-level="5"]': 'h5',
42-
'[data-level="6"]': 'h6',
37+
'level=1': 'h1',
38+
'level=2': 'h2',
39+
'level=3': 'h3',
40+
'level=4': 'h4',
41+
'level=5': 'h5',
42+
'level=6': 'h6',
4343
},
4444
margin: '0',
4545
whiteSpace: {

0 commit comments

Comments
 (0)