@rakeyshgidwani/roger-ui-bank-theme-jeremy 0.6.0 → 0.7.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.
package/dist/theme.js CHANGED
@@ -163,19 +163,19 @@ export const jeremyTheme = {
163
163
  },
164
164
  colors: {
165
165
  primary: {
166
- '50': '#F4F1F1',
167
- '100': '#E9E2E2',
168
- '200': '#D6C2C2',
169
- '300': '#C69F9F',
166
+ '50': '#F2F2F2',
167
+ '100': '#E6E6E6',
168
+ '200': '#CCCCCC',
169
+ '300': '#B3B3B3',
170
170
  '400': '#999999',
171
171
  '500': '#1E1E1E',
172
172
  '600': '#666666',
173
- '700': '#603939',
174
- '800': '#432D2D',
175
- '900': '#291E1E',
173
+ '700': '#4D4D4D',
174
+ '800': '#383838',
175
+ '900': '#242424',
176
176
  '500-rgb': '30, 30, 30',
177
177
  '600-rgb': '102, 102, 102',
178
- '700-rgb': '96, 57, 57',
178
+ '700-rgb': '77, 77, 77',
179
179
  },
180
180
  secondary: {
181
181
  '50': '#F8F5EC',
@@ -222,41 +222,41 @@ export const jeremyTheme = {
222
222
  '900': '#201D1D',
223
223
  },
224
224
  surface: {
225
- background: '#FAF8F8',
225
+ background: '#F9F9F9',
226
226
  surface: '#FFFFFF',
227
227
  border: '#E9E1CB',
228
228
  divider: '#F4F0E6',
229
229
  },
230
230
  text: {
231
- primary: '#291E1E',
232
- secondary: '#603939',
231
+ primary: '#242424',
232
+ secondary: '#4D4D4D',
233
233
  muted: '#9E9494',
234
234
  inverse: '#FFFFFF',
235
235
  onPrimary: '#FFFFFF',
236
- onSecondary: '#291E1E',
237
- onSurface: '#291E1E',
236
+ onSecondary: '#242424',
237
+ onSurface: '#242424',
238
238
  },
239
239
  interactive: {
240
240
  hover: '#666666',
241
- active: '#432D2D',
241
+ active: '#383838',
242
242
  focus: '#1E1E1E',
243
243
  disabled: '#D3CFCF',
244
244
  },
245
245
  // Additional colors referenced in CSS
246
246
  accent: '#E2C983',
247
- 'bg-primary': '#F4F1F1',
247
+ 'bg-primary': '#F2F2F2',
248
248
  'bg-secondary': '#F3ECD8',
249
- 'surface-bg': '#FAF8F8',
249
+ 'surface-bg': '#F9F9F9',
250
250
  // Additional missing CSS variables
251
251
  'primary-hover': '#666666',
252
- 'primary-active': '#432D2D',
252
+ 'primary-active': '#383838',
253
253
  'accent-rgb': '226, 201, 131',
254
254
  'border': '#E9E1CB',
255
255
  // Border semantic variables
256
256
  'border-transparent': 'transparent',
257
257
  // Text colors referenced in CSS
258
- 'text-primary': '#291E1E',
259
- 'text-secondary': '#603939'
258
+ 'text-primary': '#242424',
259
+ 'text-secondary': '#4D4D4D'
260
260
  },
261
261
  navigation: {
262
262
  layout: 'horizontal',
@@ -321,15 +321,15 @@ export const jeremyTheme = {
321
321
  secondary: '#F8F5EC',
322
322
  tertiary: '#FAFAFA',
323
323
  light: '#ffffff',
324
- dark: '#291E1E',
324
+ dark: '#242424',
325
325
  contrast: '#000000',
326
326
  },
327
327
  text: {
328
- primary: '#291E1E',
329
- secondary: '#603939',
328
+ primary: '#242424',
329
+ secondary: '#4D4D4D',
330
330
  tertiary: '#9E9494',
331
331
  light: '#B9B1B1',
332
- dark: '#291E1E',
332
+ dark: '#242424',
333
333
  contrast: '#ffffff',
334
334
  },
335
335
  border: {
@@ -337,14 +337,14 @@ export const jeremyTheme = {
337
337
  secondary: '#F3ECD8',
338
338
  tertiary: '#B9B1B1',
339
339
  light: '#F5F4F4',
340
- dark: '#603939',
340
+ dark: '#4D4D4D',
341
341
  contrast: '#000000',
342
342
  },
343
343
  accent: {
344
344
  primary: '#1E1E1E',
345
345
  secondary: '#666666',
346
- tertiary: '#603939',
347
- light: '#D6C2C2',
346
+ tertiary: '#4D4D4D',
347
+ light: '#CCCCCC',
348
348
  dark: '#666666',
349
349
  contrast: '#ffffff',
350
350
  },
@@ -353,14 +353,14 @@ export const jeremyTheme = {
353
353
  secondary: '#FAFAFA',
354
354
  tertiary: '#F5F4F4',
355
355
  light: '#ffffff',
356
- dark: '#432D2D',
356
+ dark: '#383838',
357
357
  contrast: '#F8F5EC',
358
358
  },
359
359
  active: {
360
360
  primary: '#1E1E1E',
361
361
  secondary: '#666666',
362
- tertiary: '#603939',
363
- light: '#D6C2C2',
362
+ tertiary: '#4D4D4D',
363
+ light: '#CCCCCC',
364
364
  dark: '#666666',
365
365
  contrast: '#ffffff',
366
366
  },
@@ -375,8 +375,8 @@ export const jeremyTheme = {
375
375
  focus: {
376
376
  primary: '#1E1E1E',
377
377
  secondary: '#666666',
378
- tertiary: '#603939',
379
- light: '#D6C2C2',
378
+ tertiary: '#4D4D4D',
379
+ light: '#CCCCCC',
380
380
  dark: '#666666',
381
381
  contrast: '#ffffff',
382
382
  }
@@ -579,19 +579,19 @@ export const jeremyTheme = {
579
579
  dark: {
580
580
  colors: {
581
581
  primary: {
582
- '50': '#291E1E',
583
- '100': '#432D2D',
584
- '200': '#603939',
582
+ '50': '#242424',
583
+ '100': '#383838',
584
+ '200': '#4D4D4D',
585
585
  '300': '#666666',
586
586
  '400': '#1E1E1E',
587
587
  '500': '#1E1E1E',
588
588
  '600': '#999999',
589
- '700': '#C69F9F',
590
- '800': '#D6C2C2',
591
- '900': '#E9E2E2',
589
+ '700': '#B3B3B3',
590
+ '800': '#CCCCCC',
591
+ '900': '#E6E6E6',
592
592
  '500-rgb': '30, 30, 30',
593
593
  '600-rgb': '153, 153, 153',
594
- '700-rgb': '198, 159, 159',
594
+ '700-rgb': '179, 179, 179',
595
595
  },
596
596
  secondary: {
597
597
  '50': '#362C11',
@@ -642,9 +642,9 @@ export const jeremyTheme = {
642
642
  },
643
643
  surface: {
644
644
  background: '#1E1E1E',
645
- surface: '#291E1E',
646
- border: '#251818',
647
- divider: '#432D2D',
645
+ surface: '#242424',
646
+ border: '#1F1F1F',
647
+ divider: '#383838',
648
648
  },
649
649
  text: {
650
650
  primary: '#FFFFFF',
@@ -659,18 +659,18 @@ export const jeremyTheme = {
659
659
  hover: '#1E1E1E',
660
660
  active: '#666666',
661
661
  focus: '#999999',
662
- disabled: '#251818',
662
+ disabled: '#1F1F1F',
663
663
  },
664
664
  // Additional colors referenced in CSS
665
665
  accent: '#DDB955',
666
- 'bg-primary': '#291E1E',
666
+ 'bg-primary': '#242424',
667
667
  'bg-secondary': '#584718',
668
668
  'surface-bg': '#1E1E1E',
669
669
  // Additional missing CSS variables
670
670
  'primary-hover': '#999999',
671
- 'primary-active': '#C69F9F',
671
+ 'primary-active': '#B3B3B3',
672
672
  'accent-rgb': '221, 185, 85',
673
- 'border': '#251818',
673
+ 'border': '#1F1F1F',
674
674
  // Text colors referenced in CSS
675
675
  'text-primary': '#FFFFFF',
676
676
  'text-secondary': '#DDB955'
@@ -163,19 +163,19 @@ export const jeremyTheme = {
163
163
  },
164
164
  colors: {
165
165
  primary: {
166
- '50': '#F4F1F1',
167
- '100': '#E9E2E2',
168
- '200': '#D6C2C2',
169
- '300': '#C69F9F',
166
+ '50': '#F2F2F2',
167
+ '100': '#E6E6E6',
168
+ '200': '#CCCCCC',
169
+ '300': '#B3B3B3',
170
170
  '400': '#999999',
171
171
  '500': '#1E1E1E',
172
172
  '600': '#666666',
173
- '700': '#603939',
174
- '800': '#432D2D',
175
- '900': '#291E1E',
173
+ '700': '#4D4D4D',
174
+ '800': '#383838',
175
+ '900': '#242424',
176
176
  '500-rgb': '30, 30, 30',
177
177
  '600-rgb': '102, 102, 102',
178
- '700-rgb': '96, 57, 57',
178
+ '700-rgb': '77, 77, 77',
179
179
  },
180
180
  secondary: {
181
181
  '50': '#F8F5EC',
@@ -222,41 +222,41 @@ export const jeremyTheme = {
222
222
  '900': '#201D1D',
223
223
  },
224
224
  surface: {
225
- background: '#FAF8F8',
225
+ background: '#F9F9F9',
226
226
  surface: '#FFFFFF',
227
227
  border: '#E9E1CB',
228
228
  divider: '#F4F0E6',
229
229
  },
230
230
  text: {
231
- primary: '#291E1E',
232
- secondary: '#603939',
231
+ primary: '#242424',
232
+ secondary: '#4D4D4D',
233
233
  muted: '#9E9494',
234
234
  inverse: '#FFFFFF',
235
235
  onPrimary: '#FFFFFF',
236
- onSecondary: '#291E1E',
237
- onSurface: '#291E1E',
236
+ onSecondary: '#242424',
237
+ onSurface: '#242424',
238
238
  },
239
239
  interactive: {
240
240
  hover: '#666666',
241
- active: '#432D2D',
241
+ active: '#383838',
242
242
  focus: '#1E1E1E',
243
243
  disabled: '#D3CFCF',
244
244
  },
245
245
  // Additional colors referenced in CSS
246
246
  accent: '#E2C983',
247
- 'bg-primary': '#F4F1F1',
247
+ 'bg-primary': '#F2F2F2',
248
248
  'bg-secondary': '#F3ECD8',
249
- 'surface-bg': '#FAF8F8',
249
+ 'surface-bg': '#F9F9F9',
250
250
  // Additional missing CSS variables
251
251
  'primary-hover': '#666666',
252
- 'primary-active': '#432D2D',
252
+ 'primary-active': '#383838',
253
253
  'accent-rgb': '226, 201, 131',
254
254
  'border': '#E9E1CB',
255
255
  // Border semantic variables
256
256
  'border-transparent': 'transparent',
257
257
  // Text colors referenced in CSS
258
- 'text-primary': '#291E1E',
259
- 'text-secondary': '#603939'
258
+ 'text-primary': '#242424',
259
+ 'text-secondary': '#4D4D4D'
260
260
  },
261
261
  navigation: {
262
262
  layout: 'horizontal',
@@ -321,15 +321,15 @@ export const jeremyTheme = {
321
321
  secondary: '#F8F5EC',
322
322
  tertiary: '#FAFAFA',
323
323
  light: '#ffffff',
324
- dark: '#291E1E',
324
+ dark: '#242424',
325
325
  contrast: '#000000',
326
326
  },
327
327
  text: {
328
- primary: '#291E1E',
329
- secondary: '#603939',
328
+ primary: '#242424',
329
+ secondary: '#4D4D4D',
330
330
  tertiary: '#9E9494',
331
331
  light: '#B9B1B1',
332
- dark: '#291E1E',
332
+ dark: '#242424',
333
333
  contrast: '#ffffff',
334
334
  },
335
335
  border: {
@@ -337,14 +337,14 @@ export const jeremyTheme = {
337
337
  secondary: '#F3ECD8',
338
338
  tertiary: '#B9B1B1',
339
339
  light: '#F5F4F4',
340
- dark: '#603939',
340
+ dark: '#4D4D4D',
341
341
  contrast: '#000000',
342
342
  },
343
343
  accent: {
344
344
  primary: '#1E1E1E',
345
345
  secondary: '#666666',
346
- tertiary: '#603939',
347
- light: '#D6C2C2',
346
+ tertiary: '#4D4D4D',
347
+ light: '#CCCCCC',
348
348
  dark: '#666666',
349
349
  contrast: '#ffffff',
350
350
  },
@@ -353,14 +353,14 @@ export const jeremyTheme = {
353
353
  secondary: '#FAFAFA',
354
354
  tertiary: '#F5F4F4',
355
355
  light: '#ffffff',
356
- dark: '#432D2D',
356
+ dark: '#383838',
357
357
  contrast: '#F8F5EC',
358
358
  },
359
359
  active: {
360
360
  primary: '#1E1E1E',
361
361
  secondary: '#666666',
362
- tertiary: '#603939',
363
- light: '#D6C2C2',
362
+ tertiary: '#4D4D4D',
363
+ light: '#CCCCCC',
364
364
  dark: '#666666',
365
365
  contrast: '#ffffff',
366
366
  },
@@ -375,8 +375,8 @@ export const jeremyTheme = {
375
375
  focus: {
376
376
  primary: '#1E1E1E',
377
377
  secondary: '#666666',
378
- tertiary: '#603939',
379
- light: '#D6C2C2',
378
+ tertiary: '#4D4D4D',
379
+ light: '#CCCCCC',
380
380
  dark: '#666666',
381
381
  contrast: '#ffffff',
382
382
  }
@@ -579,19 +579,19 @@ export const jeremyTheme = {
579
579
  dark: {
580
580
  colors: {
581
581
  primary: {
582
- '50': '#291E1E',
583
- '100': '#432D2D',
584
- '200': '#603939',
582
+ '50': '#242424',
583
+ '100': '#383838',
584
+ '200': '#4D4D4D',
585
585
  '300': '#666666',
586
586
  '400': '#1E1E1E',
587
587
  '500': '#1E1E1E',
588
588
  '600': '#999999',
589
- '700': '#C69F9F',
590
- '800': '#D6C2C2',
591
- '900': '#E9E2E2',
589
+ '700': '#B3B3B3',
590
+ '800': '#CCCCCC',
591
+ '900': '#E6E6E6',
592
592
  '500-rgb': '30, 30, 30',
593
593
  '600-rgb': '153, 153, 153',
594
- '700-rgb': '198, 159, 159',
594
+ '700-rgb': '179, 179, 179',
595
595
  },
596
596
  secondary: {
597
597
  '50': '#362C11',
@@ -642,9 +642,9 @@ export const jeremyTheme = {
642
642
  },
643
643
  surface: {
644
644
  background: '#1E1E1E',
645
- surface: '#291E1E',
646
- border: '#251818',
647
- divider: '#432D2D',
645
+ surface: '#242424',
646
+ border: '#1F1F1F',
647
+ divider: '#383838',
648
648
  },
649
649
  text: {
650
650
  primary: '#FFFFFF',
@@ -659,18 +659,18 @@ export const jeremyTheme = {
659
659
  hover: '#1E1E1E',
660
660
  active: '#666666',
661
661
  focus: '#999999',
662
- disabled: '#251818',
662
+ disabled: '#1F1F1F',
663
663
  },
664
664
  // Additional colors referenced in CSS
665
665
  accent: '#DDB955',
666
- 'bg-primary': '#291E1E',
666
+ 'bg-primary': '#242424',
667
667
  'bg-secondary': '#584718',
668
668
  'surface-bg': '#1E1E1E',
669
669
  // Additional missing CSS variables
670
670
  'primary-hover': '#999999',
671
- 'primary-active': '#C69F9F',
671
+ 'primary-active': '#B3B3B3',
672
672
  'accent-rgb': '221, 185, 85',
673
- 'border': '#251818',
673
+ 'border': '#1F1F1F',
674
674
  // Text colors referenced in CSS
675
675
  'text-primary': '#FFFFFF',
676
676
  'text-secondary': '#DDB955'
@@ -163,19 +163,19 @@ export const jeremyTheme = {
163
163
  },
164
164
  colors: {
165
165
  primary: {
166
- '50': '#F4F1F1',
167
- '100': '#E9E2E2',
168
- '200': '#D6C2C2',
169
- '300': '#C69F9F',
166
+ '50': '#F2F2F2',
167
+ '100': '#E6E6E6',
168
+ '200': '#CCCCCC',
169
+ '300': '#B3B3B3',
170
170
  '400': '#999999',
171
171
  '500': '#1E1E1E',
172
172
  '600': '#666666',
173
- '700': '#603939',
174
- '800': '#432D2D',
175
- '900': '#291E1E',
173
+ '700': '#4D4D4D',
174
+ '800': '#383838',
175
+ '900': '#242424',
176
176
  '500-rgb': '30, 30, 30',
177
177
  '600-rgb': '102, 102, 102',
178
- '700-rgb': '96, 57, 57',
178
+ '700-rgb': '77, 77, 77',
179
179
  },
180
180
  secondary: {
181
181
  '50': '#F8F5EC',
@@ -222,41 +222,41 @@ export const jeremyTheme = {
222
222
  '900': '#201D1D',
223
223
  },
224
224
  surface: {
225
- background: '#FAF8F8',
225
+ background: '#F9F9F9',
226
226
  surface: '#FFFFFF',
227
227
  border: '#E9E1CB',
228
228
  divider: '#F4F0E6',
229
229
  },
230
230
  text: {
231
- primary: '#291E1E',
232
- secondary: '#603939',
231
+ primary: '#242424',
232
+ secondary: '#4D4D4D',
233
233
  muted: '#9E9494',
234
234
  inverse: '#FFFFFF',
235
235
  onPrimary: '#FFFFFF',
236
- onSecondary: '#291E1E',
237
- onSurface: '#291E1E',
236
+ onSecondary: '#242424',
237
+ onSurface: '#242424',
238
238
  },
239
239
  interactive: {
240
240
  hover: '#666666',
241
- active: '#432D2D',
241
+ active: '#383838',
242
242
  focus: '#1E1E1E',
243
243
  disabled: '#D3CFCF',
244
244
  },
245
245
  // Additional colors referenced in CSS
246
246
  accent: '#E2C983',
247
- 'bg-primary': '#F4F1F1',
247
+ 'bg-primary': '#F2F2F2',
248
248
  'bg-secondary': '#F3ECD8',
249
- 'surface-bg': '#FAF8F8',
249
+ 'surface-bg': '#F9F9F9',
250
250
  // Additional missing CSS variables
251
251
  'primary-hover': '#666666',
252
- 'primary-active': '#432D2D',
252
+ 'primary-active': '#383838',
253
253
  'accent-rgb': '226, 201, 131',
254
254
  'border': '#E9E1CB',
255
255
  // Border semantic variables
256
256
  'border-transparent': 'transparent',
257
257
  // Text colors referenced in CSS
258
- 'text-primary': '#291E1E',
259
- 'text-secondary': '#603939'
258
+ 'text-primary': '#242424',
259
+ 'text-secondary': '#4D4D4D'
260
260
  },
261
261
  navigation: {
262
262
  layout: 'horizontal',
@@ -321,15 +321,15 @@ export const jeremyTheme = {
321
321
  secondary: '#F8F5EC',
322
322
  tertiary: '#FAFAFA',
323
323
  light: '#ffffff',
324
- dark: '#291E1E',
324
+ dark: '#242424',
325
325
  contrast: '#000000',
326
326
  },
327
327
  text: {
328
- primary: '#291E1E',
329
- secondary: '#603939',
328
+ primary: '#242424',
329
+ secondary: '#4D4D4D',
330
330
  tertiary: '#9E9494',
331
331
  light: '#B9B1B1',
332
- dark: '#291E1E',
332
+ dark: '#242424',
333
333
  contrast: '#ffffff',
334
334
  },
335
335
  border: {
@@ -337,14 +337,14 @@ export const jeremyTheme = {
337
337
  secondary: '#F3ECD8',
338
338
  tertiary: '#B9B1B1',
339
339
  light: '#F5F4F4',
340
- dark: '#603939',
340
+ dark: '#4D4D4D',
341
341
  contrast: '#000000',
342
342
  },
343
343
  accent: {
344
344
  primary: '#1E1E1E',
345
345
  secondary: '#666666',
346
- tertiary: '#603939',
347
- light: '#D6C2C2',
346
+ tertiary: '#4D4D4D',
347
+ light: '#CCCCCC',
348
348
  dark: '#666666',
349
349
  contrast: '#ffffff',
350
350
  },
@@ -353,14 +353,14 @@ export const jeremyTheme = {
353
353
  secondary: '#FAFAFA',
354
354
  tertiary: '#F5F4F4',
355
355
  light: '#ffffff',
356
- dark: '#432D2D',
356
+ dark: '#383838',
357
357
  contrast: '#F8F5EC',
358
358
  },
359
359
  active: {
360
360
  primary: '#1E1E1E',
361
361
  secondary: '#666666',
362
- tertiary: '#603939',
363
- light: '#D6C2C2',
362
+ tertiary: '#4D4D4D',
363
+ light: '#CCCCCC',
364
364
  dark: '#666666',
365
365
  contrast: '#ffffff',
366
366
  },
@@ -375,8 +375,8 @@ export const jeremyTheme = {
375
375
  focus: {
376
376
  primary: '#1E1E1E',
377
377
  secondary: '#666666',
378
- tertiary: '#603939',
379
- light: '#D6C2C2',
378
+ tertiary: '#4D4D4D',
379
+ light: '#CCCCCC',
380
380
  dark: '#666666',
381
381
  contrast: '#ffffff',
382
382
  }
@@ -579,19 +579,19 @@ export const jeremyTheme = {
579
579
  dark: {
580
580
  colors: {
581
581
  primary: {
582
- '50': '#291E1E',
583
- '100': '#432D2D',
584
- '200': '#603939',
582
+ '50': '#242424',
583
+ '100': '#383838',
584
+ '200': '#4D4D4D',
585
585
  '300': '#666666',
586
586
  '400': '#1E1E1E',
587
587
  '500': '#1E1E1E',
588
588
  '600': '#999999',
589
- '700': '#C69F9F',
590
- '800': '#D6C2C2',
591
- '900': '#E9E2E2',
589
+ '700': '#B3B3B3',
590
+ '800': '#CCCCCC',
591
+ '900': '#E6E6E6',
592
592
  '500-rgb': '30, 30, 30',
593
593
  '600-rgb': '153, 153, 153',
594
- '700-rgb': '198, 159, 159',
594
+ '700-rgb': '179, 179, 179',
595
595
  },
596
596
  secondary: {
597
597
  '50': '#362C11',
@@ -642,9 +642,9 @@ export const jeremyTheme = {
642
642
  },
643
643
  surface: {
644
644
  background: '#1E1E1E',
645
- surface: '#291E1E',
646
- border: '#251818',
647
- divider: '#432D2D',
645
+ surface: '#242424',
646
+ border: '#1F1F1F',
647
+ divider: '#383838',
648
648
  },
649
649
  text: {
650
650
  primary: '#FFFFFF',
@@ -659,18 +659,18 @@ export const jeremyTheme = {
659
659
  hover: '#1E1E1E',
660
660
  active: '#666666',
661
661
  focus: '#999999',
662
- disabled: '#251818',
662
+ disabled: '#1F1F1F',
663
663
  },
664
664
  // Additional colors referenced in CSS
665
665
  accent: '#DDB955',
666
- 'bg-primary': '#291E1E',
666
+ 'bg-primary': '#242424',
667
667
  'bg-secondary': '#584718',
668
668
  'surface-bg': '#1E1E1E',
669
669
  // Additional missing CSS variables
670
670
  'primary-hover': '#999999',
671
- 'primary-active': '#C69F9F',
671
+ 'primary-active': '#B3B3B3',
672
672
  'accent-rgb': '221, 185, 85',
673
- 'border': '#251818',
673
+ 'border': '#1F1F1F',
674
674
  // Text colors referenced in CSS
675
675
  'text-primary': '#FFFFFF',
676
676
  'text-secondary': '#DDB955'
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rakeyshgidwani/roger-ui-bank-theme-jeremy",
3
- "version": "0.6.0",
3
+ "version": "0.7.0",
4
4
  "description": "Roger UI jeremy theme - Complete design system with components, styles, and utilities",
5
5
  "keywords": [
6
6
  "design-system",