@nd-storybook/storybook 0.3.0 → 0.3.4

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 (17) hide show
  1. package/dist/css/tailwind.css +0 -4
  2. package/dist/css/tokens.css +57 -274
  3. package/dist/index.cjs.js +32 -32
  4. package/dist/index.d.ts +20 -26
  5. package/dist/index.es.js +3306 -3040
  6. package/dist/tailwind.config.js +1 -11
  7. package/dist/tailwind.tokens.js +9 -206
  8. package/dist/tokens.utilities.js +211 -383
  9. package/package.json +1 -1
  10. package/tailwind.config.js +1 -1
  11. package/tailwind.tokens.js +5 -2
  12. package/tokens.utilities.js +1 -1
  13. package/dist/css/badge.css +0 -20
  14. package/dist/css/button.css +0 -0
  15. package/dist/css/components/.DS_Store +0 -0
  16. package/dist/css/components/portal/tabs.css +0 -220
  17. package/dist/css/experimental/collapsed-card.css +0 -16
package/dist/tailwind.config.js CHANGED
@@ -3,11 +3,6 @@ import {
3
3
  semanticColors,
4
4
  componentColors,
5
5
  spacing,
6
- fontFamilies,
7
- fontWeights,
8
- fontSizes,
9
- lineHeights,
10
- letterSpacings,
11
6
  primitiveFontFamilies,
12
7
  primitiveFontSizes,
13
8
  primitiveFontWeights,
@@ -26,7 +21,7 @@ export default {
26
21
  "./src/**/*.{vue,js,ts,jsx,tsx,stories.js}",
27
22
  "./storybook/**/*.{mdx,vue,js,ts,jsx,tsx,stories.js}",
28
23
  ],
29
- darkMode: 'class',
24
+ darkMode: 'media',
30
25
  theme: {
31
26
  extend: {
32
27
  colors: {
@@ -45,15 +40,12 @@ export default {
45
40
  },
46
41
 
47
42
  fontFamily: {
48
- ...fontFamilies,
49
43
  ...primitiveFontFamilies
50
44
  },
51
45
  fontWeight: {
52
- ...fontWeights,
53
46
  ...primitiveFontWeights
54
47
  },
55
48
  fontSize: {
56
- ...fontSizes,
57
49
  ...primitiveFontSizes,
58
50
  'heading-xs': 'var(--font-size-heading-xs)',
59
51
  'heading-s': 'var(--font-size-heading-s)',
@@ -69,9 +61,7 @@ export default {
69
61
  'body-drop-cap': 'var(--font-size-body-drop-cap)',
70
62
  'meta': 'var(--font-size-meta)'
71
63
  },
72
- lineHeight: lineHeights,
73
64
  letterSpacing: {
74
- ...letterSpacings,
75
65
  ...primitiveLetterSpacings,
76
66
  '0': 'var(--typography-letter-spacing-0)',
77
67
  's': 'var(--typography-letter-spacing-s)',
package/dist/tailwind.tokens.js CHANGED
@@ -1,5 +1,5 @@
1
1
  // Generated from design tokens - DO NOT EDIT DIRECTLY
2
- // Last generated: 2025-08-25T13:26:41.756Z
2
+ // Last generated: 2025-12-08T13:56:43.110Z
3
3
 
4
4
  export const primitiveColors = {
5
5
  "blue-400": "var(--color-blue-400)",
@@ -10,6 +10,7 @@ export const primitiveColors = {
10
10
  "pink-400": "var(--color-pink-400)",
11
11
  "pink-600": "var(--color-pink-600)",
12
12
  "pink-700": "var(--color-pink-700)",
13
+ "pink-800": "var(--color-pink-800)",
13
14
  "brown-500": "var(--color-brown-500)",
14
15
  "brown-800": "var(--color-brown-800)",
15
16
  "brown-900": "var(--color-brown-900)",
@@ -63,7 +64,9 @@ export const semanticColors = {
63
64
  "icons-brand": "var(--color-icons-brand)",
64
65
  "icons-warning": "var(--color-icons-warning)",
65
66
  "icons-inverse": "var(--color-icons-inverse)",
66
- "shadow-default": "var(--color-shadow-default)"
67
+ "shadow-default": "var(--color-shadow-default)",
68
+ "dnk-brand": "var(--color-dnk-brand)",
69
+ "dnk-background": "var(--color-dnk-background)"
67
70
  };
68
71
  export const componentColors = {
69
72
  "form-background-input-field": "var(--color-form-background-input-field-default)",
@@ -149,10 +152,6 @@ export const componentColors = {
149
152
  };
150
153
  export const spacing = {
151
154
  "0": "var(--spacing-0)",
152
- "spacing-layout-breakpoints": "var(--spacing-layout-breakpoints)",
153
- "spacing-layout-columns": "var(--spacing-layout-columns)",
154
- "spacing-layout-padding": "var(--spacing-layout-padding)",
155
- "spacing-layout-gutter": "var(--spacing-layout-gutter)",
156
155
  "xxs": "var(--spacing-xxs)",
157
156
  "xs": "var(--spacing-xs)",
158
157
  "s": "var(--spacing-s)",
@@ -182,6 +181,7 @@ export const typographyStyles = {
182
181
  "body-uppercase": "var(--body-uppercase)",
183
182
  "body-uppercase-bold": "var(--body-uppercase-bold)",
184
183
  "body-uppercase-bold-small": "var(--body-uppercase-bold-small)",
184
+ "body-gulliver-semibold": "var(--body-gulliver-semibold)",
185
185
  "heading-2": "var(--heading-2)",
186
186
  "heading-3": "var(--heading-3)",
187
187
  "heading-page": "var(--heading-page)",
@@ -190,217 +190,20 @@ export const typographyStyles = {
190
190
  "meta-light": "var(--meta-light)",
191
191
  "meta-regular": "var(--meta-regular)",
192
192
  "meta-bold": "var(--meta-bold)",
193
+ "meta-uppercase": "var(--meta-uppercase)",
193
194
  "menu-menu-primary": "var(--menu-menu-primary)",
194
195
  "menu-menu-secondary": "var(--menu-menu-secondary)",
195
196
  "menu-menu-submenu": "var(--menu-menu-submenu)",
196
197
  "menu-menu-tabbar": "var(--menu-menu-tabbar)",
197
198
  "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active)",
198
199
  "menu-menu-tab-item": "var(--menu-menu-tab-item)",
199
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active)",
200
- "mijn-nd-heading": "var(--mijn-nd-heading)",
201
- "mijn-nd-description": "var(--mijn-nd-description)"
202
- };
203
- export const fontFamilies = {
204
- "article-heading": "var(--article-heading-fontFamily)",
205
- "article-heading-light": "var(--article-heading-light-fontFamily)",
206
- "article-heading-alternate": "var(--article-heading-alternate-fontFamily)",
207
- "article-heading-2": "var(--article-heading-2-fontFamily)",
208
- "article-heading-2-light": "var(--article-heading-2-light-fontFamily)",
209
- "article-heading-2-alternate": "var(--article-heading-2-alternate-fontFamily)",
210
- "article-body": "var(--article-body-fontFamily)",
211
- "article-type": "var(--article-type-fontFamily)",
212
- "article-intro": "var(--article-intro-fontFamily)",
213
- "article-city": "var(--article-city-fontFamily)",
214
- "article-quote": "var(--article-quote-fontFamily)",
215
- "article-question": "var(--article-question-fontFamily)",
216
- "article-drop-cap": "var(--article-drop-cap-fontFamily)",
217
- "article-drop-cap-alternate": "var(--article-drop-cap-alternate-fontFamily)",
218
- "body-light": "var(--body-light-fontFamily)",
219
- "body-regular": "var(--body-regular-fontFamily)",
220
- "body-bold": "var(--body-bold-fontFamily)",
221
- "body-uppercase": "var(--body-uppercase-fontFamily)",
222
- "body-uppercase-bold": "var(--body-uppercase-bold-fontFamily)",
223
- "body-uppercase-bold-small": "var(--body-uppercase-bold-small-fontFamily)",
224
- "heading-2": "var(--heading-2-fontFamily)",
225
- "heading-3": "var(--heading-3-fontFamily)",
226
- "heading-page": "var(--heading-page-fontFamily)",
227
- "heading-subheading": "var(--heading-subheading-fontFamily)",
228
- "heading-uppercase": "var(--heading-uppercase-fontFamily)",
229
- "meta-light": "var(--meta-light-fontFamily)",
230
- "meta-regular": "var(--meta-regular-fontFamily)",
231
- "meta-bold": "var(--meta-bold-fontFamily)",
232
- "menu-menu-primary": "var(--menu-menu-primary-fontFamily)",
233
- "menu-menu-secondary": "var(--menu-menu-secondary-fontFamily)",
234
- "menu-menu-submenu": "var(--menu-menu-submenu-fontFamily)",
235
- "menu-menu-tabbar": "var(--menu-menu-tabbar-fontFamily)",
236
- "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active-fontFamily)",
237
- "menu-menu-tab-item": "var(--menu-menu-tab-item-fontFamily)",
238
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active-fontFamily)",
239
- "mijn-nd-heading": "var(--mijn-nd-heading-fontFamily)",
240
- "mijn-nd-description": "var(--mijn-nd-description-fontFamily)"
241
- };
242
- export const fontWeights = {
243
- "article-heading": "var(--article-heading-fontWeight)",
244
- "article-heading-light": "var(--article-heading-light-fontWeight)",
245
- "article-heading-alternate": "var(--article-heading-alternate-fontWeight)",
246
- "article-heading-2": "var(--article-heading-2-fontWeight)",
247
- "article-heading-2-light": "var(--article-heading-2-light-fontWeight)",
248
- "article-heading-2-alternate": "var(--article-heading-2-alternate-fontWeight)",
249
- "article-body": "var(--article-body-fontWeight)",
250
- "article-type": "var(--article-type-fontWeight)",
251
- "article-intro": "var(--article-intro-fontWeight)",
252
- "article-city": "var(--article-city-fontWeight)",
253
- "article-quote": "var(--article-quote-fontWeight)",
254
- "article-question": "var(--article-question-fontWeight)",
255
- "article-drop-cap": "var(--article-drop-cap-fontWeight)",
256
- "article-drop-cap-alternate": "var(--article-drop-cap-alternate-fontWeight)",
257
- "body-light": "var(--body-light-fontWeight)",
258
- "body-regular": "var(--body-regular-fontWeight)",
259
- "body-bold": "var(--body-bold-fontWeight)",
260
- "body-uppercase": "var(--body-uppercase-fontWeight)",
261
- "body-uppercase-bold": "var(--body-uppercase-bold-fontWeight)",
262
- "body-uppercase-bold-small": "var(--body-uppercase-bold-small-fontWeight)",
263
- "heading-2": "var(--heading-2-fontWeight)",
264
- "heading-3": "var(--heading-3-fontWeight)",
265
- "heading-page": "var(--heading-page-fontWeight)",
266
- "heading-subheading": "var(--heading-subheading-fontWeight)",
267
- "heading-uppercase": "var(--heading-uppercase-fontWeight)",
268
- "meta-light": "var(--meta-light-fontWeight)",
269
- "meta-regular": "var(--meta-regular-fontWeight)",
270
- "meta-bold": "var(--meta-bold-fontWeight)",
271
- "menu-menu-primary": "var(--menu-menu-primary-fontWeight)",
272
- "menu-menu-secondary": "var(--menu-menu-secondary-fontWeight)",
273
- "menu-menu-submenu": "var(--menu-menu-submenu-fontWeight)",
274
- "menu-menu-tabbar": "var(--menu-menu-tabbar-fontWeight)",
275
- "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active-fontWeight)",
276
- "menu-menu-tab-item": "var(--menu-menu-tab-item-fontWeight)",
277
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active-fontWeight)",
278
- "mijn-nd-heading": "var(--mijn-nd-heading-fontWeight)",
279
- "mijn-nd-description": "var(--mijn-nd-description-fontWeight)"
280
- };
281
- export const fontSizes = {
282
- "article-heading": "var(--article-heading-fontSize)",
283
- "article-heading-light": "var(--article-heading-light-fontSize)",
284
- "article-heading-alternate": "var(--article-heading-alternate-fontSize)",
285
- "article-heading-2": "var(--article-heading-2-fontSize)",
286
- "article-heading-2-light": "var(--article-heading-2-light-fontSize)",
287
- "article-heading-2-alternate": "var(--article-heading-2-alternate-fontSize)",
288
- "article-body": "var(--article-body-fontSize)",
289
- "article-type": "var(--article-type-fontSize)",
290
- "article-intro": "var(--article-intro-fontSize)",
291
- "article-city": "var(--article-city-fontSize)",
292
- "article-quote": "var(--article-quote-fontSize)",
293
- "article-question": "var(--article-question-fontSize)",
294
- "article-drop-cap": "var(--article-drop-cap-fontSize)",
295
- "article-drop-cap-alternate": "var(--article-drop-cap-alternate-fontSize)",
296
- "body-light": "var(--body-light-fontSize)",
297
- "body-regular": "var(--body-regular-fontSize)",
298
- "body-bold": "var(--body-bold-fontSize)",
299
- "body-uppercase": "var(--body-uppercase-fontSize)",
300
- "body-uppercase-bold": "var(--body-uppercase-bold-fontSize)",
301
- "body-uppercase-bold-small": "var(--body-uppercase-bold-small-fontSize)",
302
- "heading-2": "var(--heading-2-fontSize)",
303
- "heading-3": "var(--heading-3-fontSize)",
304
- "heading-page": "var(--heading-page-fontSize)",
305
- "heading-subheading": "var(--heading-subheading-fontSize)",
306
- "heading-uppercase": "var(--heading-uppercase-fontSize)",
307
- "meta-light": "var(--meta-light-fontSize)",
308
- "meta-regular": "var(--meta-regular-fontSize)",
309
- "meta-bold": "var(--meta-bold-fontSize)",
310
- "menu-menu-primary": "var(--menu-menu-primary-fontSize)",
311
- "menu-menu-secondary": "var(--menu-menu-secondary-fontSize)",
312
- "menu-menu-submenu": "var(--menu-menu-submenu-fontSize)",
313
- "menu-menu-tabbar": "var(--menu-menu-tabbar-fontSize)",
314
- "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active-fontSize)",
315
- "menu-menu-tab-item": "var(--menu-menu-tab-item-fontSize)",
316
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active-fontSize)",
317
- "mijn-nd-heading": "var(--mijn-nd-heading-fontSize)",
318
- "mijn-nd-description": "var(--mijn-nd-description-fontSize)"
319
- };
320
- export const lineHeights = {
321
- "article-heading": "var(--article-heading-lineHeight)",
322
- "article-heading-light": "var(--article-heading-light-lineHeight)",
323
- "article-heading-alternate": "var(--article-heading-alternate-lineHeight)",
324
- "article-heading-2": "var(--article-heading-2-lineHeight)",
325
- "article-heading-2-light": "var(--article-heading-2-light-lineHeight)",
326
- "article-heading-2-alternate": "var(--article-heading-2-alternate-lineHeight)",
327
- "article-body": "var(--article-body-lineHeight)",
328
- "article-type": "var(--article-type-lineHeight)",
329
- "article-intro": "var(--article-intro-lineHeight)",
330
- "article-city": "var(--article-city-lineHeight)",
331
- "article-quote": "var(--article-quote-lineHeight)",
332
- "article-question": "var(--article-question-lineHeight)",
333
- "article-drop-cap": "var(--article-drop-cap-lineHeight)",
334
- "article-drop-cap-alternate": "var(--article-drop-cap-alternate-lineHeight)",
335
- "body-light": "var(--body-light-lineHeight)",
336
- "body-regular": "var(--body-regular-lineHeight)",
337
- "body-bold": "var(--body-bold-lineHeight)",
338
- "body-uppercase": "var(--body-uppercase-lineHeight)",
339
- "body-uppercase-bold": "var(--body-uppercase-bold-lineHeight)",
340
- "body-uppercase-bold-small": "var(--body-uppercase-bold-small-lineHeight)",
341
- "heading-2": "var(--heading-2-lineHeight)",
342
- "heading-3": "var(--heading-3-lineHeight)",
343
- "heading-page": "var(--heading-page-lineHeight)",
344
- "heading-subheading": "var(--heading-subheading-lineHeight)",
345
- "heading-uppercase": "var(--heading-uppercase-lineHeight)",
346
- "meta-light": "var(--meta-light-lineHeight)",
347
- "meta-regular": "var(--meta-regular-lineHeight)",
348
- "meta-bold": "var(--meta-bold-lineHeight)",
349
- "menu-menu-primary": "var(--menu-menu-primary-lineHeight)",
350
- "menu-menu-secondary": "var(--menu-menu-secondary-lineHeight)",
351
- "menu-menu-submenu": "var(--menu-menu-submenu-lineHeight)",
352
- "menu-menu-tabbar": "var(--menu-menu-tabbar-lineHeight)",
353
- "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active-lineHeight)",
354
- "menu-menu-tab-item": "var(--menu-menu-tab-item-lineHeight)",
355
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active-lineHeight)",
356
- "mijn-nd-heading": "var(--mijn-nd-heading-lineHeight)",
357
- "mijn-nd-description": "var(--mijn-nd-description-lineHeight)"
358
- };
359
- export const letterSpacings = {
360
- "article-heading": "var(--article-heading-letterSpacing)",
361
- "article-heading-light": "var(--article-heading-light-letterSpacing)",
362
- "article-heading-alternate": "var(--article-heading-alternate-letterSpacing)",
363
- "article-heading-2": "var(--article-heading-2-letterSpacing)",
364
- "article-heading-2-light": "var(--article-heading-2-light-letterSpacing)",
365
- "article-heading-2-alternate": "var(--article-heading-2-alternate-letterSpacing)",
366
- "article-body": "var(--article-body-letterSpacing)",
367
- "article-type": "var(--article-type-letterSpacing)",
368
- "article-intro": "var(--article-intro-letterSpacing)",
369
- "article-city": "var(--article-city-letterSpacing)",
370
- "article-quote": "var(--article-quote-letterSpacing)",
371
- "article-question": "var(--article-question-letterSpacing)",
372
- "article-drop-cap": "var(--article-drop-cap-letterSpacing)",
373
- "article-drop-cap-alternate": "var(--article-drop-cap-alternate-letterSpacing)",
374
- "body-light": "var(--body-light-letterSpacing)",
375
- "body-regular": "var(--body-regular-letterSpacing)",
376
- "body-bold": "var(--body-bold-letterSpacing)",
377
- "body-uppercase": "var(--body-uppercase-letterSpacing)",
378
- "body-uppercase-bold": "var(--body-uppercase-bold-letterSpacing)",
379
- "body-uppercase-bold-small": "var(--body-uppercase-bold-small-letterSpacing)",
380
- "heading-2": "var(--heading-2-letterSpacing)",
381
- "heading-3": "var(--heading-3-letterSpacing)",
382
- "heading-page": "var(--heading-page-letterSpacing)",
383
- "heading-subheading": "var(--heading-subheading-letterSpacing)",
384
- "heading-uppercase": "var(--heading-uppercase-letterSpacing)",
385
- "meta-light": "var(--meta-light-letterSpacing)",
386
- "meta-regular": "var(--meta-regular-letterSpacing)",
387
- "meta-bold": "var(--meta-bold-letterSpacing)",
388
- "menu-menu-primary": "var(--menu-menu-primary-letterSpacing)",
389
- "menu-menu-secondary": "var(--menu-menu-secondary-letterSpacing)",
390
- "menu-menu-submenu": "var(--menu-menu-submenu-letterSpacing)",
391
- "menu-menu-tabbar": "var(--menu-menu-tabbar-letterSpacing)",
392
- "menu-menu-tabbar-active": "var(--menu-menu-tabbar-active-letterSpacing)",
393
- "menu-menu-tab-item": "var(--menu-menu-tab-item-letterSpacing)",
394
- "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active-letterSpacing)",
395
- "mijn-nd-heading": "var(--mijn-nd-heading-letterSpacing)",
396
- "mijn-nd-description": "var(--mijn-nd-description-letterSpacing)"
200
+ "menu-menu-tab-item-active": "var(--menu-menu-tab-item-active)"
397
201
  };
398
202
  export const primitiveFontFamilies = {
399
203
  "gulliver": "var(--font-family-gulliver)",
400
204
  "fira-sans": "var(--font-family-fira-sans)",
401
205
  "montserrat": "var(--font-family-montserrat)",
402
- "abril-fatface": "var(--font-family-abril-fatface)",
403
- "gulliver-semibold": "var(--font-family-gulliver-semibold)"
206
+ "abril-fatface": "var(--font-family-abril-fatface)"
404
207
  };
405
208
  export const primitiveFontSizes = {
406
209
  "12": "var(--font-size-12)",