@aveonline/ui-react 2.31.0 → 2.31.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/tailwind.config.js +258 -258
  2. package/dist/tokens.css +168 -168
  3. package/dist/ui/atoms/Typography/Text/IText.d.ts +1 -0
  4. package/dist/ui-react.mjs +182 -182
  5. package/package.json +1 -1
package/dist/tailwind.config.js CHANGED
@@ -1,258 +1,258 @@
1
- /* eslint-disable @typescript-eslint/no-var-requires */
2
- /** @type {import('tailwindcss').Config} */
3
- const defaultTheme = require('tailwindcss/defaultTheme')
4
-
5
- module.exports = {
6
- content: [
7
- './src/ui/atoms/**/*.{ts,tsx}',
8
- './src/ui/molecules/**/*.{ts,tsx}',
9
- './src/ui/templates/**/*.{ts,tsx}'
10
- ],
11
- theme: {
12
- screens: {
13
- sm: '489px',
14
- md: '768px',
15
- lg: '1039px',
16
- xl: '1440px'
17
- },
18
- extend: {
19
- colors: {
20
- ave: {
21
- white: 'var(--ave-white)',
22
- gray: 'var(--ave-gray)',
23
- primary: 'var(--ave-primary)',
24
- secondary: 'var(--ave-secondary)',
25
- active: 'var(--ave-active)'
26
- },
27
- letter: {
28
- default: 'var(--colors-letter-default)',
29
- subdued: 'var(--colors-letter-subdued)',
30
- disabled: 'var(--colors-letter-disabled)',
31
- warning: 'var(--colors-letter-warning)',
32
- critical: 'var(--colors-letter-critical)',
33
- success: 'var(--colors-letter-success)',
34
- brand: 'var(--colors-letter-brand)',
35
- on: 'var(--colors-letter-on)'
36
- },
37
- action: {
38
- primary: {
39
- default: 'var(--colors-action-primary-default)',
40
- hovered: 'var(--colors-action-primary-hovered)',
41
- active: 'var(--colors-action-primary-active)',
42
- pressed: 'var(--colors-action-primary-pressed)',
43
- disabled: 'var(--colors-action-primary-disabled)',
44
- brand: 'var(--colors-action-primary-brand)'
45
- },
46
- secondary: {
47
- default: 'var(--colors-action-secondary-default)',
48
- hovered: 'var(--colors-action-secondary-hovered)',
49
- active: 'var(--colors-action-secondary-active)',
50
- pressed: 'var(--colors-action-secondary-pressed)',
51
- disabled: 'var(--colors-action-secondary-disabled)',
52
- subdued: 'var(--colors-action-secondary-subdued)'
53
- },
54
- critical: {
55
- default: 'var(--colors-action-critical-default)',
56
- hovered: 'var(--colors-action-critical-hovered)',
57
- active: 'var(--colors-action-critical-active)',
58
- pressed: 'var(--colors-action-critical-pressed)',
59
- disabled: 'var(--colors-action-critical-disabled)'
60
- },
61
- opacity: {
62
- default: 'var(--colors-action-opacity-default)',
63
- hovered: 'var(--colors-action-opacity-hovered)',
64
- active: 'var(--colors-action-opacity-active)',
65
- disabled: 'var(--colors-action-opacity-disabled)'
66
- }
67
- },
68
- border: {
69
- default: 'var(--colors-border-default)',
70
- subdued: 'var(--colors-border-subdued)',
71
- hovered: 'var(--colors-border-hovered)',
72
- active: 'var(--colors-border-active)',
73
- disabled: 'var(--colors-border-disabled)',
74
- brand: 'var(--colors-action-primary-brand)',
75
- success: {
76
- default: 'var(--colors-border-success-default)',
77
- subdued: 'var(--colors-border-success-subdued)'
78
- },
79
- critical: {
80
- default: 'var(--colors-border-critical-default)',
81
- subdued: 'var(--colors-border-critical-subdued)',
82
- disabled: 'var(--colors-border-critical-disabled)'
83
- },
84
- shadow: {
85
- subdued: 'var(--colors-border-shadow-subdued)'
86
- }
87
- },
88
- interactive: {
89
- default: 'var(--colors-interactive-default)',
90
- hovered: 'var(--colors-interactive-hovered)',
91
- active: 'var(--colors-interactive-active)',
92
- disabled: 'var(--colors-interactive-disabled)',
93
- critical: {
94
- default: 'var(--colors-interactive-critical-default)',
95
- hovered: 'var(--colors-interactive-critical-hovered)',
96
- active: 'var(--colors-interactive-critical-active)',
97
- disabled: 'var(--colors-interactive-critical-disabled)'
98
- }
99
- },
100
- icon: {
101
- default: 'var(--colors-icon-default)',
102
- subdued: 'var(--colors-icon-subdued)',
103
- hovered: 'var(--colors-icon-hovered)',
104
- active: 'var(--colors-icon-active)',
105
- disabled: 'var(--colors-icon-disabled)',
106
- critical: 'var(--colors-icon-critical)',
107
- warning: 'var(--colors-icon-warning)',
108
- success: 'var(--colors-icon-success)',
109
- on: 'var(--colors-icon-on)',
110
- brand: 'var(--colors-icon-brand)'
111
- },
112
- focused: {
113
- default: 'var(--colors-focused-default)'
114
- },
115
- surface: {
116
- default: 'var(--colors-surface-default)',
117
- subdued: 'var(--colors-surface-subdued)',
118
- hovered: 'var(--colors-surface-hovered)',
119
- active: 'var(--colors-surface-active)',
120
- pressed: 'var(--colors-surface-pressed)',
121
- disabled: 'var(--colors-surface-disabled)',
122
- brand: 'var(--colors-surface-brand)',
123
- action: {
124
- default: 'var(--colors-surface-action-default)',
125
- subdued: 'var(--colors-surface-action-subdued)',
126
- hovered: 'var(--colors-surface-action-hovered)',
127
- active: 'var(--colors-surface-action-active)',
128
- disabled: 'var(--colors-surface-action-disabled)'
129
- },
130
- warning: {
131
- default: 'var(--colors-surface-warning-default)',
132
- subdued: 'var(--colors-surface-warning-subdued)',
133
- hovered: 'var(--colors-surface-warning-hovered)',
134
- active: 'var(--colors-surface-warning-active)'
135
- },
136
- success: {
137
- default: 'var(--colors-surface-success-default)',
138
- subdued: 'var(--colors-surface-success-subdued)',
139
- hovered: 'var(--colors-surface-success-hovered)',
140
- active: 'var(--colors-surface-success-active)'
141
- },
142
- critical: {
143
- default: 'var(--colors-surface-critical-default)',
144
- subdued: 'var(--colors-surface-critical-subdued)',
145
- hovered: 'var(--colors-surface-critical-hovered)',
146
- active: 'var(--colors-surface-critical-active)',
147
- disabled: 'var(--colors-surface-critical-disabled)'
148
- },
149
- neutral: {
150
- default: 'var(--colors-surface-neutral-default)',
151
- subdued: 'var(--colors-surface-neutral-subdued)',
152
- hovered: 'var(--colors-surface-neutral-hovered)',
153
- active: 'var(--colors-surface-neutral-active)',
154
- disabled: 'var(--colors-surface-neutral-disabled)'
155
- }
156
- },
157
- background: {
158
- default: 'var(--colors-background-default)',
159
- hovered: 'var(--colors-background-hovered)',
160
- active: 'var(--colors-background-active)',
161
- selected: 'var(--colors-background-selected)',
162
- modal: 'var(--colors-background-modal)'
163
- },
164
- radial: {
165
- 10: 'var(--colors-radial-10)',
166
- 20: 'var(--colors-radial-20)',
167
- 30: 'var(--colors-radial-30)',
168
- 40: 'var(--colors-radial-40)',
169
- 50: 'var(--colors-radial-50)',
170
- 60: 'var(--colors-radial-60)',
171
- 70: 'var(--colors-radial-70)',
172
- 80: 'var(--colors-radial-80)',
173
- 90: 'var(--colors-radial-90)',
174
- 100: 'var(--colors-radial-100)'
175
- },
176
- base: {
177
- surface: 'var(--colors-base-surface)',
178
- primary: 'var(--colors-base-primary)',
179
- secondary: 'var(--colors-base-secondary)',
180
- interactive: 'var(--colors-base-interactive)',
181
- brand: 'var(--colors-base-brand)',
182
- critical: 'var(--colors-base-critical)',
183
- warning: 'var(--colors-base-warning)',
184
- success: 'var(--colors-base-success)'
185
- },
186
- special: {
187
- one: 'var(--colors-special-one)',
188
- oneBack: 'var(--colors-special-one-back)',
189
- two: 'var(--colors-special-two)',
190
- twoBack: 'var(--colors-special-two-back)',
191
- three: 'var(--colors-special-three)',
192
- threeBack: 'var(--colors-special-three-back)',
193
- four: 'var(--colors-special-four)',
194
- fourBack: 'var(--colors-special-four-back)'
195
- }
196
- },
197
- fontSize: {
198
- xxs: 'var(--font-size-xxs)',
199
- xs: 'var(--font-size-xs)',
200
- sm: 'var(--font-size-sm)',
201
- md: 'var(--font-size-md)',
202
- lg: 'var(--font-size-lg)',
203
- xl: 'var(--font-size-xl)',
204
- xxl: 'var(--font-size-xxl)'
205
- },
206
- lineHeight: {
207
- xxs: 'var(--line-height-xxs)',
208
- xs: 'var(--line-height-xs)',
209
- sm: 'var(--line-height-sm)',
210
- md: 'var(--line-height-md)',
211
- lg: 'var(--line-height-lg)',
212
- xl: 'var(--line-height-xl)',
213
- xxl: 'var(--line-height-xxl)'
214
- },
215
- fontWeight: {
216
- regular: 'var(--font-weight-regular)',
217
- medium: 'var(--font-weight-medium)',
218
- bold: 'var(--font-weight-bold)'
219
- },
220
- borderRadius: {
221
- xs: 'var(--border-radius-xs)',
222
- sm: 'var(--border-radius-sm)',
223
- md: 'var(--border-radius-md)'
224
- },
225
- boxShadow: {
226
- card: 'var(--box-shadow-card)',
227
- popover: 'var(--box-shadow-popover)',
228
- popup: 'var(--box-shadow-popup)',
229
- pressed: 'var(--box-shadow-pressed)'
230
- },
231
- spacing: {
232
- xxs: 'var(--spacing-xxs)',
233
- xs: 'var(--spacing-xs)',
234
- sm: 'var(--spacing-sm)',
235
- md: 'var(--spacing-md)',
236
- lg: 'var(--spacing-lg)',
237
- xl: 'var(--spacing-xl)',
238
- xxl: 'var(--spacing-xxl)',
239
- '1xl': 'var(--spacing-1xl)'
240
- },
241
- fontFamily: {
242
- sans: ['Inter', ...defaultTheme.fontFamily.sans]
243
- },
244
- animation: {
245
- 'spin-slow': 'spin 3s linear infinite'
246
- }
247
- }
248
- },
249
- variants: {
250
- extend: {
251
- backgroundColor: ['checked', 'active'],
252
- textColor: ['checked', 'active'],
253
- borderColor: ['checked', 'hover', 'active'],
254
- fill: ['hover', 'focus']
255
- }
256
- },
257
- plugins: [require('@tailwindcss/forms')]
258
- }
1
+ /* eslint-disable @typescript-eslint/no-var-requires */
2
+ /** @type {import('tailwindcss').Config} */
3
+ const defaultTheme = require('tailwindcss/defaultTheme')
4
+
5
+ module.exports = {
6
+ content: [
7
+ './src/ui/atoms/**/*.{ts,tsx}',
8
+ './src/ui/molecules/**/*.{ts,tsx}',
9
+ './src/ui/templates/**/*.{ts,tsx}'
10
+ ],
11
+ theme: {
12
+ screens: {
13
+ sm: '489px',
14
+ md: '768px',
15
+ lg: '1039px',
16
+ xl: '1440px'
17
+ },
18
+ extend: {
19
+ colors: {
20
+ ave: {
21
+ white: 'var(--ave-white)',
22
+ gray: 'var(--ave-gray)',
23
+ primary: 'var(--ave-primary)',
24
+ secondary: 'var(--ave-secondary)',
25
+ active: 'var(--ave-active)'
26
+ },
27
+ letter: {
28
+ default: 'var(--colors-letter-default)',
29
+ subdued: 'var(--colors-letter-subdued)',
30
+ disabled: 'var(--colors-letter-disabled)',
31
+ warning: 'var(--colors-letter-warning)',
32
+ critical: 'var(--colors-letter-critical)',
33
+ success: 'var(--colors-letter-success)',
34
+ brand: 'var(--colors-letter-brand)',
35
+ on: 'var(--colors-letter-on)'
36
+ },
37
+ action: {
38
+ primary: {
39
+ default: 'var(--colors-action-primary-default)',
40
+ hovered: 'var(--colors-action-primary-hovered)',
41
+ active: 'var(--colors-action-primary-active)',
42
+ pressed: 'var(--colors-action-primary-pressed)',
43
+ disabled: 'var(--colors-action-primary-disabled)',
44
+ brand: 'var(--colors-action-primary-brand)'
45
+ },
46
+ secondary: {
47
+ default: 'var(--colors-action-secondary-default)',
48
+ hovered: 'var(--colors-action-secondary-hovered)',
49
+ active: 'var(--colors-action-secondary-active)',
50
+ pressed: 'var(--colors-action-secondary-pressed)',
51
+ disabled: 'var(--colors-action-secondary-disabled)',
52
+ subdued: 'var(--colors-action-secondary-subdued)'
53
+ },
54
+ critical: {
55
+ default: 'var(--colors-action-critical-default)',
56
+ hovered: 'var(--colors-action-critical-hovered)',
57
+ active: 'var(--colors-action-critical-active)',
58
+ pressed: 'var(--colors-action-critical-pressed)',
59
+ disabled: 'var(--colors-action-critical-disabled)'
60
+ },
61
+ opacity: {
62
+ default: 'var(--colors-action-opacity-default)',
63
+ hovered: 'var(--colors-action-opacity-hovered)',
64
+ active: 'var(--colors-action-opacity-active)',
65
+ disabled: 'var(--colors-action-opacity-disabled)'
66
+ }
67
+ },
68
+ border: {
69
+ default: 'var(--colors-border-default)',
70
+ subdued: 'var(--colors-border-subdued)',
71
+ hovered: 'var(--colors-border-hovered)',
72
+ active: 'var(--colors-border-active)',
73
+ disabled: 'var(--colors-border-disabled)',
74
+ brand: 'var(--colors-action-primary-brand)',
75
+ success: {
76
+ default: 'var(--colors-border-success-default)',
77
+ subdued: 'var(--colors-border-success-subdued)'
78
+ },
79
+ critical: {
80
+ default: 'var(--colors-border-critical-default)',
81
+ subdued: 'var(--colors-border-critical-subdued)',
82
+ disabled: 'var(--colors-border-critical-disabled)'
83
+ },
84
+ shadow: {
85
+ subdued: 'var(--colors-border-shadow-subdued)'
86
+ }
87
+ },
88
+ interactive: {
89
+ default: 'var(--colors-interactive-default)',
90
+ hovered: 'var(--colors-interactive-hovered)',
91
+ active: 'var(--colors-interactive-active)',
92
+ disabled: 'var(--colors-interactive-disabled)',
93
+ critical: {
94
+ default: 'var(--colors-interactive-critical-default)',
95
+ hovered: 'var(--colors-interactive-critical-hovered)',
96
+ active: 'var(--colors-interactive-critical-active)',
97
+ disabled: 'var(--colors-interactive-critical-disabled)'
98
+ }
99
+ },
100
+ icon: {
101
+ default: 'var(--colors-icon-default)',
102
+ subdued: 'var(--colors-icon-subdued)',
103
+ hovered: 'var(--colors-icon-hovered)',
104
+ active: 'var(--colors-icon-active)',
105
+ disabled: 'var(--colors-icon-disabled)',
106
+ critical: 'var(--colors-icon-critical)',
107
+ warning: 'var(--colors-icon-warning)',
108
+ success: 'var(--colors-icon-success)',
109
+ on: 'var(--colors-icon-on)',
110
+ brand: 'var(--colors-icon-brand)'
111
+ },
112
+ focused: {
113
+ default: 'var(--colors-focused-default)'
114
+ },
115
+ surface: {
116
+ default: 'var(--colors-surface-default)',
117
+ subdued: 'var(--colors-surface-subdued)',
118
+ hovered: 'var(--colors-surface-hovered)',
119
+ active: 'var(--colors-surface-active)',
120
+ pressed: 'var(--colors-surface-pressed)',
121
+ disabled: 'var(--colors-surface-disabled)',
122
+ brand: 'var(--colors-surface-brand)',
123
+ action: {
124
+ default: 'var(--colors-surface-action-default)',
125
+ subdued: 'var(--colors-surface-action-subdued)',
126
+ hovered: 'var(--colors-surface-action-hovered)',
127
+ active: 'var(--colors-surface-action-active)',
128
+ disabled: 'var(--colors-surface-action-disabled)'
129
+ },
130
+ warning: {
131
+ default: 'var(--colors-surface-warning-default)',
132
+ subdued: 'var(--colors-surface-warning-subdued)',
133
+ hovered: 'var(--colors-surface-warning-hovered)',
134
+ active: 'var(--colors-surface-warning-active)'
135
+ },
136
+ success: {
137
+ default: 'var(--colors-surface-success-default)',
138
+ subdued: 'var(--colors-surface-success-subdued)',
139
+ hovered: 'var(--colors-surface-success-hovered)',
140
+ active: 'var(--colors-surface-success-active)'
141
+ },
142
+ critical: {
143
+ default: 'var(--colors-surface-critical-default)',
144
+ subdued: 'var(--colors-surface-critical-subdued)',
145
+ hovered: 'var(--colors-surface-critical-hovered)',
146
+ active: 'var(--colors-surface-critical-active)',
147
+ disabled: 'var(--colors-surface-critical-disabled)'
148
+ },
149
+ neutral: {
150
+ default: 'var(--colors-surface-neutral-default)',
151
+ subdued: 'var(--colors-surface-neutral-subdued)',
152
+ hovered: 'var(--colors-surface-neutral-hovered)',
153
+ active: 'var(--colors-surface-neutral-active)',
154
+ disabled: 'var(--colors-surface-neutral-disabled)'
155
+ }
156
+ },
157
+ background: {
158
+ default: 'var(--colors-background-default)',
159
+ hovered: 'var(--colors-background-hovered)',
160
+ active: 'var(--colors-background-active)',
161
+ selected: 'var(--colors-background-selected)',
162
+ modal: 'var(--colors-background-modal)'
163
+ },
164
+ radial: {
165
+ 10: 'var(--colors-radial-10)',
166
+ 20: 'var(--colors-radial-20)',
167
+ 30: 'var(--colors-radial-30)',
168
+ 40: 'var(--colors-radial-40)',
169
+ 50: 'var(--colors-radial-50)',
170
+ 60: 'var(--colors-radial-60)',
171
+ 70: 'var(--colors-radial-70)',
172
+ 80: 'var(--colors-radial-80)',
173
+ 90: 'var(--colors-radial-90)',
174
+ 100: 'var(--colors-radial-100)'
175
+ },
176
+ base: {
177
+ surface: 'var(--colors-base-surface)',
178
+ primary: 'var(--colors-base-primary)',
179
+ secondary: 'var(--colors-base-secondary)',
180
+ interactive: 'var(--colors-base-interactive)',
181
+ brand: 'var(--colors-base-brand)',
182
+ critical: 'var(--colors-base-critical)',
183
+ warning: 'var(--colors-base-warning)',
184
+ success: 'var(--colors-base-success)'
185
+ },
186
+ special: {
187
+ one: 'var(--colors-special-one)',
188
+ oneBack: 'var(--colors-special-one-back)',
189
+ two: 'var(--colors-special-two)',
190
+ twoBack: 'var(--colors-special-two-back)',
191
+ three: 'var(--colors-special-three)',
192
+ threeBack: 'var(--colors-special-three-back)',
193
+ four: 'var(--colors-special-four)',
194
+ fourBack: 'var(--colors-special-four-back)'
195
+ }
196
+ },
197
+ fontSize: {
198
+ xxs: 'var(--font-size-xxs)',
199
+ xs: 'var(--font-size-xs)',
200
+ sm: 'var(--font-size-sm)',
201
+ md: 'var(--font-size-md)',
202
+ lg: 'var(--font-size-lg)',
203
+ xl: 'var(--font-size-xl)',
204
+ xxl: 'var(--font-size-xxl)'
205
+ },
206
+ lineHeight: {
207
+ xxs: 'var(--line-height-xxs)',
208
+ xs: 'var(--line-height-xs)',
209
+ sm: 'var(--line-height-sm)',
210
+ md: 'var(--line-height-md)',
211
+ lg: 'var(--line-height-lg)',
212
+ xl: 'var(--line-height-xl)',
213
+ xxl: 'var(--line-height-xxl)'
214
+ },
215
+ fontWeight: {
216
+ regular: 'var(--font-weight-regular)',
217
+ medium: 'var(--font-weight-medium)',
218
+ bold: 'var(--font-weight-bold)'
219
+ },
220
+ borderRadius: {
221
+ xs: 'var(--border-radius-xs)',
222
+ sm: 'var(--border-radius-sm)',
223
+ md: 'var(--border-radius-md)'
224
+ },
225
+ boxShadow: {
226
+ card: 'var(--box-shadow-card)',
227
+ popover: 'var(--box-shadow-popover)',
228
+ popup: 'var(--box-shadow-popup)',
229
+ pressed: 'var(--box-shadow-pressed)'
230
+ },
231
+ spacing: {
232
+ xxs: 'var(--spacing-xxs)',
233
+ xs: 'var(--spacing-xs)',
234
+ sm: 'var(--spacing-sm)',
235
+ md: 'var(--spacing-md)',
236
+ lg: 'var(--spacing-lg)',
237
+ xl: 'var(--spacing-xl)',
238
+ xxl: 'var(--spacing-xxl)',
239
+ '1xl': 'var(--spacing-1xl)'
240
+ },
241
+ fontFamily: {
242
+ sans: ['Inter', ...defaultTheme.fontFamily.sans]
243
+ },
244
+ animation: {
245
+ 'spin-slow': 'spin 3s linear infinite'
246
+ }
247
+ }
248
+ },
249
+ variants: {
250
+ extend: {
251
+ backgroundColor: ['checked', 'active'],
252
+ textColor: ['checked', 'active'],
253
+ borderColor: ['checked', 'hover', 'active'],
254
+ fill: ['hover', 'focus']
255
+ }
256
+ },
257
+ plugins: [require('@tailwindcss/forms')]
258
+ }