@nova-design-system/nova-base 3.1.0 → 3.2.0

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 (21) hide show
  1. package/assets/icons/icon-sprite.svg +1 -1
  2. package/dist/cjs/plugin/nova-plugin.js +188 -0
  3. package/dist/css/mccs.css +3 -0
  4. package/dist/css/ocean.css +3 -0
  5. package/dist/css/spark.css +3 -0
  6. package/dist/js/mccs_dark.d.ts +1 -0
  7. package/dist/js/mccs_dark.js +1 -0
  8. package/dist/js/mccs_light.d.ts +1 -0
  9. package/dist/js/mccs_light.js +1 -0
  10. package/dist/js/ocean_dark.d.ts +1 -0
  11. package/dist/js/ocean_dark.js +1 -0
  12. package/dist/js/ocean_light.d.ts +1 -0
  13. package/dist/js/ocean_light.js +1 -0
  14. package/dist/js/spacings.d.ts +1 -0
  15. package/dist/js/spacings.js +1 -0
  16. package/dist/js/spark_dark.d.ts +1 -0
  17. package/dist/js/spark_dark.js +1 -0
  18. package/dist/js/spark_light.d.ts +1 -0
  19. package/dist/js/spark_light.js +1 -0
  20. package/dist/plugin/nova-plugin.js +224 -0
  21. package/package.json +1 -1
package/dist/cjs/plugin/nova-plugin.js CHANGED
@@ -100,6 +100,194 @@ exports.novaTailwindPlugin = (0, plugin_js_1.default)(function (_a) {
100
100
  width: 'revert',
101
101
  }, '.w-unset': {
102
102
  width: 'unset',
103
+ },
104
+ // Typography utilities
105
+ // .typo-{type}-{size}-{weight}
106
+ // Headings
107
+ '.typo-heading-xl-regular': {
108
+ 'font-size': 'var(--font-size-4xl)',
109
+ 'font-weight': '400',
110
+ 'line-height': 'var(--leading-px-10)',
111
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
112
+ }, '.typo-heading-xl-medium': {
113
+ 'font-size': 'var(--font-size-4xl)',
114
+ 'font-weight': '500',
115
+ 'line-height': 'var(--leading-px-10)',
116
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
117
+ }, '.typo-heading-xl-bold': {
118
+ 'font-size': 'var(--font-size-4xl)',
119
+ 'font-weight': '700',
120
+ 'line-height': 'var(--leading-px-10)',
121
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
122
+ }, '.typo-heading-lg-regular': {
123
+ 'font-size': 'var(--font-size-3xl)',
124
+ 'font-weight': '400',
125
+ 'line-height': 'var(--leading-px-8)',
126
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
127
+ }, '.typo-heading-lg-medium': {
128
+ 'font-size': 'var(--font-size-3xl)',
129
+ 'font-weight': '500',
130
+ 'line-height': 'var(--leading-px-8)',
131
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
132
+ }, '.typo-heading-lg-bold': {
133
+ 'font-size': 'var(--font-size-3xl)',
134
+ 'font-weight': '700',
135
+ 'line-height': 'var(--leading-px-8)',
136
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
137
+ }, '.typo-heading-md-regular': {
138
+ 'font-size': 'var(--font-size-2xl)',
139
+ 'font-weight': '400',
140
+ 'line-height': 'var(--leading-px-7)',
141
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
142
+ }, '.typo-heading-md-medium': {
143
+ 'font-size': 'var(--font-size-2xl)',
144
+ 'font-weight': '500',
145
+ 'line-height': 'var(--leading-px-7)',
146
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
147
+ }, '.typo-heading-md-bold': {
148
+ 'font-size': 'var(--font-size-2xl)',
149
+ 'font-weight': '700',
150
+ 'line-height': 'var(--leading-px-7)',
151
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
152
+ }, '.typo-heading-sm-regular': {
153
+ 'font-size': 'var(--font-size-xl)',
154
+ 'font-weight': '400',
155
+ 'line-height': 'var(--leading-px-6)',
156
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
157
+ }, '.typo-heading-sm-medium': {
158
+ 'font-size': 'var(--font-size-xl)',
159
+ 'font-weight': '500',
160
+ 'line-height': 'var(--leading-px-6)',
161
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
162
+ }, '.typo-heading-sm-bold': {
163
+ 'font-size': 'var(--font-size-xl)',
164
+ 'font-weight': '700',
165
+ 'line-height': 'var(--leading-px-6)',
166
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
167
+ }, '.typo-heading-xs-regular': {
168
+ 'font-size': 'var(--font-size-lg)',
169
+ 'font-weight': '400',
170
+ 'line-height': 'var(--leading-px-6)',
171
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
172
+ }, '.typo-heading-xs-medium': {
173
+ 'font-size': 'var(--font-size-lg)',
174
+ 'font-weight': '500',
175
+ 'line-height': 'var(--leading-px-6)',
176
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
177
+ }, '.typo-heading-xs-bold': {
178
+ 'font-size': 'var(--font-size-lg)',
179
+ 'font-weight': '700',
180
+ 'line-height': 'var(--leading-px-6)',
181
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
182
+ },
183
+ // Text
184
+ '.typo-text-xl-regular': {
185
+ 'font-size': 'var(--font-size-xl)',
186
+ 'font-weight': '400',
187
+ 'line-height': 'var(--line-height-xl)',
188
+ }, '.typo-text-xl-medium': {
189
+ 'font-size': 'var(--font-size-xl)',
190
+ 'font-weight': '500',
191
+ 'line-height': 'var(--line-height-xl)',
192
+ }, '.typo-text-xl-bold': {
193
+ 'font-size': 'var(--font-size-xl)',
194
+ 'font-weight': '700',
195
+ 'line-height': 'var(--line-height-xl)',
196
+ }, '.typo-text-lg-regular': {
197
+ 'font-size': 'var(--font-size-lg)',
198
+ 'font-weight': '400',
199
+ 'line-height': 'var(--line-height-lg)',
200
+ }, '.typo-text-lg-medium': {
201
+ 'font-size': 'var(--font-size-lg)',
202
+ 'font-weight': '500',
203
+ 'line-height': 'var(--line-height-lg)',
204
+ }, '.typo-text-lg-bold': {
205
+ 'font-size': 'var(--font-size-lg)',
206
+ 'font-weight': '700',
207
+ 'line-height': 'var(--line-height-lg)',
208
+ }, '.typo-text-md-regular': {
209
+ 'font-size': 'var(--font-size-md)',
210
+ 'font-weight': '400',
211
+ 'line-height': 'var(--line-height-b ase)',
212
+ }, '.typo-text-md-medium': {
213
+ 'font-size': 'var(--font-size-md)',
214
+ 'font-weight': '500',
215
+ 'line-height': 'var(--line-height-base)',
216
+ }, '.typo-text-md-bold': {
217
+ 'font-size': 'var(--font-size-md)',
218
+ 'font-weight': '700',
219
+ 'line-height': 'var(--line-height-base)',
220
+ }, '.typo-text-sm-regular': {
221
+ 'font-size': 'var(--font-size-sm)',
222
+ 'font-weight': '400',
223
+ 'line-height': 'var(--line-height-sm)',
224
+ }, '.typo-text-sm-medium': {
225
+ 'font-size': 'var(--font-size-sm)',
226
+ 'font-weight': '500',
227
+ 'line-height': 'var(--line-height-sm)',
228
+ }, '.typo-text-sm-bold': {
229
+ 'font-size': 'var(--font-size-sm)',
230
+ 'font-weight': '700',
231
+ 'line-height': 'var(--line-height-sm)',
232
+ }, '.typo-text-xs-regular': {
233
+ 'font-size': 'var(--font-size-xs)',
234
+ 'font-weight': '400',
235
+ 'line-height': 'var(--line-height-xs)',
236
+ }, '.typo-text-xs-medium': {
237
+ 'font-size': 'var(--font-size-xs)',
238
+ 'font-weight': '500',
239
+ 'line-height': 'var(--line-height-xs)',
240
+ }, '.typo-text-xs-bold': {
241
+ 'font-size': 'var(--font-size-xs)',
242
+ 'font-weight': '700',
243
+ 'line-height': 'var(--line-height-xs)',
244
+ },
245
+ // Mono
246
+ '.typo-mono-md-regular': {
247
+ 'font-family': 'TT Norms Pro Mono',
248
+ 'font-size': 'var(--font-size-md)',
249
+ 'font-weight': '400',
250
+ 'line-height': 'var(--line-height-base)',
251
+ }, '.typo-mono-md-medium': {
252
+ 'font-family': 'TT Norms Pro Mono',
253
+ 'font-size': 'var(--font-size-md)',
254
+ 'font-weight': '500',
255
+ 'line-height': 'var(--line-height-base)',
256
+ }, '.typo-mono-md-bold': {
257
+ 'font-family': 'TT Norms Pro Mono',
258
+ 'font-size': 'var(--font-size-md)',
259
+ 'font-weight': '700',
260
+ 'line-height': 'var(--line-height-base)',
261
+ }, '.typo-mono-sm-regular': {
262
+ 'font-family': 'TT Norms Pro Mono',
263
+ 'font-size': 'var(--font-size-sm)',
264
+ 'font-weight': '400',
265
+ 'line-height': 'var(--line-height-sm)',
266
+ }, '.typo-mono-sm-medium': {
267
+ 'font-family': 'TT Norms Pro Mono',
268
+ 'font-size': 'var(--font-size-sm)',
269
+ 'font-weight': '500',
270
+ 'line-height': 'var(--line-height-sm)',
271
+ }, '.typo-mono-sm-bold': {
272
+ 'font-family': 'TT Norms Pro Mono',
273
+ 'font-size': 'var(--font-size-sm)',
274
+ 'font-weight': '700',
275
+ 'line-height': 'var(--line-height-sm)',
276
+ }, '.typo-mono-xs-regular': {
277
+ 'font-family': 'TT Norms Pro Mono',
278
+ 'font-size': 'var(--font-size-xs)',
279
+ 'font-weight': '400',
280
+ 'line-height': 'var(--line-height-xs)',
281
+ }, '.typo-mono-xs-medium': {
282
+ 'font-family': 'TT Norms Pro Mono',
283
+ 'font-size': 'var(--font-size-xs)',
284
+ 'font-weight': '500',
285
+ 'line-height': 'var(--line-height-xs)',
286
+ }, '.typo-mono-xs-bold': {
287
+ 'font-family': 'TT Norms Pro Mono',
288
+ 'font-size': 'var(--font-size-xs)',
289
+ 'font-weight': '700',
290
+ 'line-height': 'var(--line-height-xs)',
103
291
  } }));
104
292
  });
105
293
  exports.default = exports.novaTailwindPlugin;
package/dist/css/mccs.css CHANGED
@@ -494,6 +494,7 @@
494
494
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-hover);
495
495
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
496
496
  --color-focus-success: var(--color-feedback-success-low-border);
497
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
497
498
  --color-focus-destructive: var(--color-feedback-error-high-border);
498
499
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
499
500
  --color-focus-background: var(--color-level-00-background);
@@ -1019,6 +1020,7 @@
1019
1020
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-hover);
1020
1021
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
1021
1022
  --color-focus-success: var(--color-feedback-success-low-border);
1023
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
1022
1024
  --color-focus-destructive: var(--color-feedback-error-high-border);
1023
1025
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
1024
1026
  --color-focus-background: var(--color-level-00-background);
@@ -1349,6 +1351,7 @@
1349
1351
  --popover-font-weight: 500;
1350
1352
  --menu-contextual-item-font-weight: 500;
1351
1353
  --menu-contextual-divider-padding-bottom: 3px;
1354
+ --form-max-width: 480px;
1352
1355
  --form-field-badge-gap: 0px;
1353
1356
  --list-native-separator-padding-y: 3px;
1354
1357
  --list-native-separator-padding-x: 9px;
package/dist/css/ocean.css CHANGED
@@ -490,6 +490,7 @@
490
490
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
491
491
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
492
492
  --color-focus-success: var(--color-feedback-success-low-border);
493
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
493
494
  --color-focus-destructive: var(--color-feedback-error-high-border);
494
495
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
495
496
  --color-focus-background: var(--color-level-00-background);
@@ -1037,6 +1038,7 @@
1037
1038
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
1038
1039
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
1039
1040
  --color-focus-success: var(--color-feedback-success-low-border);
1041
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
1040
1042
  --color-focus-destructive: var(--color-feedback-error-high-border);
1041
1043
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
1042
1044
  --color-focus-background: var(--color-level-00-background);
@@ -1370,6 +1372,7 @@
1370
1372
  --popover-font-weight: 500;
1371
1373
  --menu-contextual-item-font-weight: 500;
1372
1374
  --menu-contextual-divider-padding-bottom: 3px;
1375
+ --form-max-width: 480px;
1373
1376
  --form-field-badge-gap: 0px;
1374
1377
  --list-native-separator-padding-y: 3px;
1375
1378
  --list-native-separator-padding-x: 9px;
package/dist/css/spark.css CHANGED
@@ -490,6 +490,7 @@
490
490
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
491
491
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
492
492
  --color-focus-success: var(--color-feedback-success-low-border);
493
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
493
494
  --color-focus-destructive: var(--color-feedback-error-high-border);
494
495
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
495
496
  --color-focus-background: var(--color-level-00-background);
@@ -1036,6 +1037,7 @@
1036
1037
  --components-button-high-background-active: var(--color-interaction-container-branded-high-background-active);
1037
1038
  --components-button-high-background: var(--color-interaction-container-branded-high-background);
1038
1039
  --color-focus-success: var(--color-feedback-success-low-border);
1040
+ --color-focus-destructive-in-field: var(--color-feedback-error-low-border);
1039
1041
  --color-focus-destructive: var(--color-feedback-error-high-border);
1040
1042
  --color-focus-background-inverted: var(--color-level-inverted-00-background);
1041
1043
  --color-focus-background: var(--color-level-00-background);
@@ -1370,6 +1372,7 @@
1370
1372
  --popover-font-weight: 500;
1371
1373
  --menu-contextual-item-font-weight: 500;
1372
1374
  --menu-contextual-divider-padding-bottom: 3px;
1375
+ --form-max-width: 480px;
1373
1376
  --form-field-badge-gap: 0px;
1374
1377
  --list-native-separator-padding-y: 3px;
1375
1378
  --list-native-separator-padding-x: 9px;
package/dist/js/mccs_dark.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/mccs_dark.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#4b9eaa";
159
159
  export const ColorFocusBackground = "#0b0f11";
160
160
  export const ColorFocusBackgroundInverted = "#ffffff";
161
161
  export const ColorFocusDestructive = "#ff3d3d";
162
+ export const ColorFocusDestructiveInField = "#ff3d3d";
162
163
  export const ColorFocusSuccess = "#6bde71";
163
164
  export const ColorRainbow1Background = "#432306";
164
165
  export const ColorRainbow1Border = "#f0801a";
package/dist/js/mccs_light.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/mccs_light.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#258998";
159
159
  export const ColorFocusBackground = "#ffffff";
160
160
  export const ColorFocusBackgroundInverted = "#0b0f11";
161
161
  export const ColorFocusDestructive = "#da2424";
162
+ export const ColorFocusDestructiveInField = "#da2424";
162
163
  export const ColorFocusSuccess = "#34ae3b";
163
164
  export const ColorRainbow1Background = "#fdefe2";
164
165
  export const ColorRainbow1Border = "#c66a15";
package/dist/js/ocean_dark.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/ocean_dark.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#258998";
159
159
  export const ColorFocusBackground = "#0b0f11";
160
160
  export const ColorFocusBackgroundInverted = "#ffffff";
161
161
  export const ColorFocusDestructive = "#ff6161";
162
+ export const ColorFocusDestructiveInField = "#ff6161";
162
163
  export const ColorFocusSuccess = "#45d24d";
163
164
  export const ColorRainbow1Background = "#432306";
164
165
  export const ColorRainbow1Border = "#f0801a";
package/dist/js/ocean_light.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/ocean_light.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#1f717d";
159
159
  export const ColorFocusBackground = "#ffffff";
160
160
  export const ColorFocusBackgroundInverted = "#0b0f11";
161
161
  export const ColorFocusDestructive = "#ff6161";
162
+ export const ColorFocusDestructiveInField = "#bb1919";
162
163
  export const ColorFocusSuccess = "#008207";
163
164
  export const ColorRainbow1Background = "#fdefe2";
164
165
  export const ColorRainbow1Border = "#9c5311";
package/dist/js/spacings.d.ts CHANGED
@@ -110,6 +110,7 @@ export const FormFieldLeadingTrailingLineHeight : string;
110
110
  export const FormFieldInnerButtonPaddingXExt : string;
111
111
  export const FormFieldInnerButtonPaddingXInt : string;
112
112
  export const FormFieldInnerButtonPaddingY : string;
113
+ export const FormMaxWidth : string;
113
114
  export const FormGapX : string;
114
115
  export const FormGapY : string;
115
116
  export const FormDescriptionFontSize : string;
package/dist/js/spacings.js CHANGED
@@ -110,6 +110,7 @@ export const FormFieldLeadingTrailingLineHeight = "24px";
110
110
  export const FormFieldInnerButtonPaddingXExt = "10px";
111
111
  export const FormFieldInnerButtonPaddingXInt = "6px";
112
112
  export const FormFieldInnerButtonPaddingY = "10px";
113
+ export const FormMaxWidth = "480px";
113
114
  export const FormGapX = "12px";
114
115
  export const FormGapY = "4px";
115
116
  export const FormDescriptionFontSize = "14px";
package/dist/js/spark_dark.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/spark_dark.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#e75420";
159
159
  export const ColorFocusBackground = "#0e0e0e";
160
160
  export const ColorFocusBackgroundInverted = "#ffffff";
161
161
  export const ColorFocusDestructive = "#ff6161";
162
+ export const ColorFocusDestructiveInField = "#ff6161";
162
163
  export const ColorFocusSuccess = "#45d24d";
163
164
  export const ColorRainbow1Background = "#432306";
164
165
  export const ColorRainbow1Border = "#f0801a";
package/dist/js/spark_light.d.ts CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand : string;
159
159
  export const ColorFocusBackground : string;
160
160
  export const ColorFocusBackgroundInverted : string;
161
161
  export const ColorFocusDestructive : string;
162
+ export const ColorFocusDestructiveInField : string;
162
163
  export const ColorFocusSuccess : string;
163
164
  export const ColorRainbow1Background : string;
164
165
  export const ColorRainbow1Border : string;
package/dist/js/spark_light.js CHANGED
@@ -159,6 +159,7 @@ export const ColorFocusBrand = "#e75420";
159
159
  export const ColorFocusBackground = "#ffffff";
160
160
  export const ColorFocusBackgroundInverted = "#0e0e0e";
161
161
  export const ColorFocusDestructive = "#ff6161";
162
+ export const ColorFocusDestructiveInField = "#bb1919";
162
163
  export const ColorFocusSuccess = "#008207";
163
164
  export const ColorRainbow1Background = "#fdefe2";
164
165
  export const ColorRainbow1Border = "#9c5311";
package/dist/plugin/nova-plugin.js CHANGED
@@ -92,6 +92,230 @@ export const novaTailwindPlugin = plugin(({ addUtilities, addComponents, addBase
92
92
  '.w-unset': {
93
93
  width: 'unset',
94
94
  },
95
+ // Typography utilities
96
+ // .typo-{type}-{size}-{weight}
97
+ // Headings
98
+ '.typo-heading-xl-regular': {
99
+ 'font-size': 'var(--font-size-4xl)',
100
+ 'font-weight': '400',
101
+ 'line-height': 'var(--leading-px-10)',
102
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
103
+ },
104
+ '.typo-heading-xl-medium': {
105
+ 'font-size': 'var(--font-size-4xl)',
106
+ 'font-weight': '500',
107
+ 'line-height': 'var(--leading-px-10)',
108
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
109
+ },
110
+ '.typo-heading-xl-bold': {
111
+ 'font-size': 'var(--font-size-4xl)',
112
+ 'font-weight': '700',
113
+ 'line-height': 'var(--leading-px-10)',
114
+ 'letter-spacing': 'var(--letter-spacing-heading-xl)',
115
+ },
116
+ '.typo-heading-lg-regular': {
117
+ 'font-size': 'var(--font-size-3xl)',
118
+ 'font-weight': '400',
119
+ 'line-height': 'var(--leading-px-8)',
120
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
121
+ },
122
+ '.typo-heading-lg-medium': {
123
+ 'font-size': 'var(--font-size-3xl)',
124
+ 'font-weight': '500',
125
+ 'line-height': 'var(--leading-px-8)',
126
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
127
+ },
128
+ '.typo-heading-lg-bold': {
129
+ 'font-size': 'var(--font-size-3xl)',
130
+ 'font-weight': '700',
131
+ 'line-height': 'var(--leading-px-8)',
132
+ 'letter-spacing': 'var(--letter-spacing-heading-lg)',
133
+ },
134
+ '.typo-heading-md-regular': {
135
+ 'font-size': 'var(--font-size-2xl)',
136
+ 'font-weight': '400',
137
+ 'line-height': 'var(--leading-px-7)',
138
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
139
+ },
140
+ '.typo-heading-md-medium': {
141
+ 'font-size': 'var(--font-size-2xl)',
142
+ 'font-weight': '500',
143
+ 'line-height': 'var(--leading-px-7)',
144
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
145
+ },
146
+ '.typo-heading-md-bold': {
147
+ 'font-size': 'var(--font-size-2xl)',
148
+ 'font-weight': '700',
149
+ 'line-height': 'var(--leading-px-7)',
150
+ 'letter-spacing': 'var(--letter-spacing-heading-md)',
151
+ },
152
+ '.typo-heading-sm-regular': {
153
+ 'font-size': 'var(--font-size-xl)',
154
+ 'font-weight': '400',
155
+ 'line-height': 'var(--leading-px-6)',
156
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
157
+ },
158
+ '.typo-heading-sm-medium': {
159
+ 'font-size': 'var(--font-size-xl)',
160
+ 'font-weight': '500',
161
+ 'line-height': 'var(--leading-px-6)',
162
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
163
+ },
164
+ '.typo-heading-sm-bold': {
165
+ 'font-size': 'var(--font-size-xl)',
166
+ 'font-weight': '700',
167
+ 'line-height': 'var(--leading-px-6)',
168
+ 'letter-spacing': 'var(--letter-spacing-heading-sm)',
169
+ },
170
+ '.typo-heading-xs-regular': {
171
+ 'font-size': 'var(--font-size-lg)',
172
+ 'font-weight': '400',
173
+ 'line-height': 'var(--leading-px-6)',
174
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
175
+ },
176
+ '.typo-heading-xs-medium': {
177
+ 'font-size': 'var(--font-size-lg)',
178
+ 'font-weight': '500',
179
+ 'line-height': 'var(--leading-px-6)',
180
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
181
+ },
182
+ '.typo-heading-xs-bold': {
183
+ 'font-size': 'var(--font-size-lg)',
184
+ 'font-weight': '700',
185
+ 'line-height': 'var(--leading-px-6)',
186
+ 'letter-spacing': 'var(--letter-spacing-heading-xs)',
187
+ },
188
+ // Text
189
+ '.typo-text-xl-regular': {
190
+ 'font-size': 'var(--font-size-xl)',
191
+ 'font-weight': '400',
192
+ 'line-height': 'var(--line-height-xl)',
193
+ },
194
+ '.typo-text-xl-medium': {
195
+ 'font-size': 'var(--font-size-xl)',
196
+ 'font-weight': '500',
197
+ 'line-height': 'var(--line-height-xl)',
198
+ },
199
+ '.typo-text-xl-bold': {
200
+ 'font-size': 'var(--font-size-xl)',
201
+ 'font-weight': '700',
202
+ 'line-height': 'var(--line-height-xl)',
203
+ },
204
+ '.typo-text-lg-regular': {
205
+ 'font-size': 'var(--font-size-lg)',
206
+ 'font-weight': '400',
207
+ 'line-height': 'var(--line-height-lg)',
208
+ },
209
+ '.typo-text-lg-medium': {
210
+ 'font-size': 'var(--font-size-lg)',
211
+ 'font-weight': '500',
212
+ 'line-height': 'var(--line-height-lg)',
213
+ },
214
+ '.typo-text-lg-bold': {
215
+ 'font-size': 'var(--font-size-lg)',
216
+ 'font-weight': '700',
217
+ 'line-height': 'var(--line-height-lg)',
218
+ },
219
+ '.typo-text-md-regular': {
220
+ 'font-size': 'var(--font-size-md)',
221
+ 'font-weight': '400',
222
+ 'line-height': 'var(--line-height-b ase)',
223
+ },
224
+ '.typo-text-md-medium': {
225
+ 'font-size': 'var(--font-size-md)',
226
+ 'font-weight': '500',
227
+ 'line-height': 'var(--line-height-base)',
228
+ },
229
+ '.typo-text-md-bold': {
230
+ 'font-size': 'var(--font-size-md)',
231
+ 'font-weight': '700',
232
+ 'line-height': 'var(--line-height-base)',
233
+ },
234
+ '.typo-text-sm-regular': {
235
+ 'font-size': 'var(--font-size-sm)',
236
+ 'font-weight': '400',
237
+ 'line-height': 'var(--line-height-sm)',
238
+ },
239
+ '.typo-text-sm-medium': {
240
+ 'font-size': 'var(--font-size-sm)',
241
+ 'font-weight': '500',
242
+ 'line-height': 'var(--line-height-sm)',
243
+ },
244
+ '.typo-text-sm-bold': {
245
+ 'font-size': 'var(--font-size-sm)',
246
+ 'font-weight': '700',
247
+ 'line-height': 'var(--line-height-sm)',
248
+ },
249
+ '.typo-text-xs-regular': {
250
+ 'font-size': 'var(--font-size-xs)',
251
+ 'font-weight': '400',
252
+ 'line-height': 'var(--line-height-xs)',
253
+ },
254
+ '.typo-text-xs-medium': {
255
+ 'font-size': 'var(--font-size-xs)',
256
+ 'font-weight': '500',
257
+ 'line-height': 'var(--line-height-xs)',
258
+ },
259
+ '.typo-text-xs-bold': {
260
+ 'font-size': 'var(--font-size-xs)',
261
+ 'font-weight': '700',
262
+ 'line-height': 'var(--line-height-xs)',
263
+ },
264
+ // Mono
265
+ '.typo-mono-md-regular': {
266
+ 'font-family': 'TT Norms Pro Mono',
267
+ 'font-size': 'var(--font-size-md)',
268
+ 'font-weight': '400',
269
+ 'line-height': 'var(--line-height-base)',
270
+ },
271
+ '.typo-mono-md-medium': {
272
+ 'font-family': 'TT Norms Pro Mono',
273
+ 'font-size': 'var(--font-size-md)',
274
+ 'font-weight': '500',
275
+ 'line-height': 'var(--line-height-base)',
276
+ },
277
+ '.typo-mono-md-bold': {
278
+ 'font-family': 'TT Norms Pro Mono',
279
+ 'font-size': 'var(--font-size-md)',
280
+ 'font-weight': '700',
281
+ 'line-height': 'var(--line-height-base)',
282
+ },
283
+ '.typo-mono-sm-regular': {
284
+ 'font-family': 'TT Norms Pro Mono',
285
+ 'font-size': 'var(--font-size-sm)',
286
+ 'font-weight': '400',
287
+ 'line-height': 'var(--line-height-sm)',
288
+ },
289
+ '.typo-mono-sm-medium': {
290
+ 'font-family': 'TT Norms Pro Mono',
291
+ 'font-size': 'var(--font-size-sm)',
292
+ 'font-weight': '500',
293
+ 'line-height': 'var(--line-height-sm)',
294
+ },
295
+ '.typo-mono-sm-bold': {
296
+ 'font-family': 'TT Norms Pro Mono',
297
+ 'font-size': 'var(--font-size-sm)',
298
+ 'font-weight': '700',
299
+ 'line-height': 'var(--line-height-sm)',
300
+ },
301
+ '.typo-mono-xs-regular': {
302
+ 'font-family': 'TT Norms Pro Mono',
303
+ 'font-size': 'var(--font-size-xs)',
304
+ 'font-weight': '400',
305
+ 'line-height': 'var(--line-height-xs)',
306
+ },
307
+ '.typo-mono-xs-medium': {
308
+ 'font-family': 'TT Norms Pro Mono',
309
+ 'font-size': 'var(--font-size-xs)',
310
+ 'font-weight': '500',
311
+ 'line-height': 'var(--line-height-xs)',
312
+ },
313
+ '.typo-mono-xs-bold': {
314
+ 'font-family': 'TT Norms Pro Mono',
315
+ 'font-size': 'var(--font-size-xs)',
316
+ 'font-weight': '700',
317
+ 'line-height': 'var(--line-height-xs)',
318
+ },
95
319
  });
96
320
  });
97
321
  export default novaTailwindPlugin;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nova-design-system/nova-base",
3
- "version": "3.1.0",
3
+ "version": "3.2.0",
4
4
  "description": "Nova is a design system created by Elia Group to empower creators to efficiently build solutions that people love to use.",
5
5
  "author": "Elia Group",
6
6
  "homepage": "https://nova.eliagroup.io",