@ikatec/nebula-tokens 0.0.1-alpha.7 → 1.0.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 (5) hide show
  1. package/dist/index.d.mts +154 -77
  2. package/dist/index.d.ts +154 -77
  3. package/dist/index.js +167 -85
  4. package/dist/index.mjs +167 -85
  5. package/package.json +1 -1
package/dist/index.d.mts CHANGED
@@ -53,80 +53,16 @@ interface Button {
53
53
  };
54
54
  }
55
55
  interface Badge {
56
- info: {
57
- background: {
58
- default: string;
59
- hover: string;
60
- };
61
- text: string;
62
- };
63
- 'info-soft': {
64
- background: {
65
- default: string;
66
- hover: string;
67
- };
68
- text: string;
69
- };
70
- warning: {
71
- background: {
72
- default: string;
73
- hover: string;
74
- };
75
- text: string;
76
- };
77
- 'warning-soft': {
78
- background: {
79
- default: string;
80
- hover: string;
81
- };
82
- text: string;
83
- };
84
- neutral: {
85
- background: {
86
- default: string;
87
- hover: string;
88
- };
89
- text: string;
90
- };
91
- 'neutral-soft': {
92
- background: {
93
- default: string;
94
- hover: string;
95
- };
96
- text: string;
97
- };
98
- success: {
99
- background: {
100
- default: string;
101
- hover: string;
102
- };
103
- text: string;
104
- };
105
- 'success-soft': {
106
- background: {
107
- default: string;
108
- hover: string;
109
- };
110
- text: string;
111
- };
112
- danger: {
113
- background: {
114
- default: string;
115
- hover: string;
116
- };
56
+ primary: {
57
+ background: string;
117
58
  text: string;
118
59
  };
119
- 'danger-soft': {
120
- background: {
121
- default: string;
122
- hover: string;
123
- };
60
+ secondary: {
61
+ background: string;
124
62
  text: string;
125
63
  };
126
- outline: {
127
- border: {
128
- default: string;
129
- };
64
+ alert: {
65
+ background: string;
130
66
  text: string;
131
67
  };
132
68
  }
@@ -198,17 +134,33 @@ interface Label {
198
134
  active: string;
199
135
  };
200
136
  }
201
- interface Input {
202
- background: string;
137
+ interface InputText {
138
+ background: {
139
+ default: string;
140
+ disabled: string;
141
+ };
203
142
  border: {
204
143
  default: string;
205
144
  focus: string;
145
+ active: string;
146
+ danger: string;
147
+ disabled: string;
148
+ filled: string;
206
149
  };
207
- text: string;
208
- placeholder: string;
209
- 'helper-text': {
150
+ text: {
210
151
  default: string;
211
- error: string;
152
+ focus: string;
153
+ active: string;
154
+ filled: string;
155
+ disabled: string;
156
+ };
157
+ icon: {
158
+ default: string;
159
+ focus: string;
160
+ active: string;
161
+ filled: string;
162
+ danger: string;
163
+ disabled: string;
212
164
  };
213
165
  }
214
166
  interface Pagination {
@@ -286,6 +238,11 @@ interface Table {
286
238
  icon: string;
287
239
  };
288
240
  }
241
+ interface InputSelectState {
242
+ border: string;
243
+ text: string;
244
+ icon: string;
245
+ }
289
246
  interface Dialog {
290
247
  background: {
291
248
  default: string;
@@ -295,6 +252,24 @@ interface Dialog {
295
252
  text: string;
296
253
  icon: string;
297
254
  }
255
+ interface InputSelect {
256
+ default: {
257
+ background: string;
258
+ border: string;
259
+ text: string;
260
+ icon: string;
261
+ };
262
+ focus: InputSelectState;
263
+ active: InputSelectState;
264
+ filled: InputSelectState;
265
+ disabled: {
266
+ background: string;
267
+ };
268
+ danger: {
269
+ icon: string;
270
+ border: string;
271
+ };
272
+ }
298
273
  interface Checkbox {
299
274
  unselected: {
300
275
  background: {
@@ -329,6 +304,98 @@ interface Checkbox {
329
304
  };
330
305
  };
331
306
  }
307
+ interface Drawer {
308
+ overlay: string;
309
+ header: {
310
+ background: string;
311
+ border: string;
312
+ title: string;
313
+ description: string;
314
+ };
315
+ body: {
316
+ background: string;
317
+ text: string;
318
+ };
319
+ footer: {
320
+ background: string;
321
+ label: string;
322
+ border: string;
323
+ };
324
+ }
325
+ interface Breadcrumb {
326
+ text: {
327
+ default: string;
328
+ hover: string;
329
+ active: string;
330
+ };
331
+ ellipsis: {
332
+ background: {
333
+ hover: string;
334
+ };
335
+ };
336
+ }
337
+ interface Switch {
338
+ background: {
339
+ off: {
340
+ default: string;
341
+ hover: string;
342
+ focus: string;
343
+ disabled: string;
344
+ };
345
+ on: {
346
+ default: string;
347
+ hover: string;
348
+ focus: string;
349
+ disabled: string;
350
+ };
351
+ };
352
+ ring: string;
353
+ circle: string;
354
+ }
355
+ interface Tooltip {
356
+ background: string;
357
+ text: string;
358
+ }
359
+ interface Accordion {
360
+ background: string;
361
+ icon: string;
362
+ border: string;
363
+ text: {
364
+ title: string;
365
+ description: string;
366
+ };
367
+ }
368
+ interface Tabs {
369
+ border: {
370
+ default: string;
371
+ active: string;
372
+ };
373
+ text: {
374
+ default: string;
375
+ active: string;
376
+ };
377
+ }
378
+ interface Box {
379
+ background: {
380
+ primary: string;
381
+ secondary: string;
382
+ };
383
+ border: string;
384
+ }
385
+ interface Toast {
386
+ title: string;
387
+ border: string;
388
+ description: string;
389
+ icon: {
390
+ default: string;
391
+ error: string;
392
+ };
393
+ background: string;
394
+ shadow: string;
395
+ }
396
+ interface ActionBar {
397
+ divider: string;
398
+ }
332
399
  declare const colors: {
333
400
  primary: {
334
401
  50: string;
@@ -401,14 +468,24 @@ declare const colors: {
401
468
  separator: Separator;
402
469
  alert: Alert;
403
470
  label: Label;
404
- input: Input;
405
471
  dropdownMenu: DropdownMenu;
406
472
  pagination: Pagination;
407
473
  listItem: ListItem;
408
474
  tag: Tag;
409
475
  table: Table;
476
+ inputSelect: InputSelect;
477
+ inputText: InputText;
410
478
  dialog: Dialog;
411
479
  checkbox: Checkbox;
480
+ drawer: Drawer;
481
+ breadcrumb: Breadcrumb;
482
+ switch: Switch;
483
+ tooltip: Tooltip;
484
+ accordion: Accordion;
485
+ tabs: Tabs;
486
+ box: Box;
487
+ toast: Toast;
488
+ actionBar: ActionBar;
412
489
  };
413
490
 
414
491
  declare const space: {
package/dist/index.d.ts CHANGED
@@ -53,80 +53,16 @@ interface Button {
53
53
  };
54
54
  }
55
55
  interface Badge {
56
- info: {
57
- background: {
58
- default: string;
59
- hover: string;
60
- };
61
- text: string;
62
- };
63
- 'info-soft': {
64
- background: {
65
- default: string;
66
- hover: string;
67
- };
68
- text: string;
69
- };
70
- warning: {
71
- background: {
72
- default: string;
73
- hover: string;
74
- };
75
- text: string;
76
- };
77
- 'warning-soft': {
78
- background: {
79
- default: string;
80
- hover: string;
81
- };
82
- text: string;
83
- };
84
- neutral: {
85
- background: {
86
- default: string;
87
- hover: string;
88
- };
89
- text: string;
90
- };
91
- 'neutral-soft': {
92
- background: {
93
- default: string;
94
- hover: string;
95
- };
96
- text: string;
97
- };
98
- success: {
99
- background: {
100
- default: string;
101
- hover: string;
102
- };
103
- text: string;
104
- };
105
- 'success-soft': {
106
- background: {
107
- default: string;
108
- hover: string;
109
- };
110
- text: string;
111
- };
112
- danger: {
113
- background: {
114
- default: string;
115
- hover: string;
116
- };
56
+ primary: {
57
+ background: string;
117
58
  text: string;
118
59
  };
119
- 'danger-soft': {
120
- background: {
121
- default: string;
122
- hover: string;
123
- };
60
+ secondary: {
61
+ background: string;
124
62
  text: string;
125
63
  };
126
- outline: {
127
- border: {
128
- default: string;
129
- };
64
+ alert: {
65
+ background: string;
130
66
  text: string;
131
67
  };
132
68
  }
@@ -198,17 +134,33 @@ interface Label {
198
134
  active: string;
199
135
  };
200
136
  }
201
- interface Input {
202
- background: string;
137
+ interface InputText {
138
+ background: {
139
+ default: string;
140
+ disabled: string;
141
+ };
203
142
  border: {
204
143
  default: string;
205
144
  focus: string;
145
+ active: string;
146
+ danger: string;
147
+ disabled: string;
148
+ filled: string;
206
149
  };
207
- text: string;
208
- placeholder: string;
209
- 'helper-text': {
150
+ text: {
210
151
  default: string;
211
- error: string;
152
+ focus: string;
153
+ active: string;
154
+ filled: string;
155
+ disabled: string;
156
+ };
157
+ icon: {
158
+ default: string;
159
+ focus: string;
160
+ active: string;
161
+ filled: string;
162
+ danger: string;
163
+ disabled: string;
212
164
  };
213
165
  }
214
166
  interface Pagination {
@@ -286,6 +238,11 @@ interface Table {
286
238
  icon: string;
287
239
  };
288
240
  }
241
+ interface InputSelectState {
242
+ border: string;
243
+ text: string;
244
+ icon: string;
245
+ }
289
246
  interface Dialog {
290
247
  background: {
291
248
  default: string;
@@ -295,6 +252,24 @@ interface Dialog {
295
252
  text: string;
296
253
  icon: string;
297
254
  }
255
+ interface InputSelect {
256
+ default: {
257
+ background: string;
258
+ border: string;
259
+ text: string;
260
+ icon: string;
261
+ };
262
+ focus: InputSelectState;
263
+ active: InputSelectState;
264
+ filled: InputSelectState;
265
+ disabled: {
266
+ background: string;
267
+ };
268
+ danger: {
269
+ icon: string;
270
+ border: string;
271
+ };
272
+ }
298
273
  interface Checkbox {
299
274
  unselected: {
300
275
  background: {
@@ -329,6 +304,98 @@ interface Checkbox {
329
304
  };
330
305
  };
331
306
  }
307
+ interface Drawer {
308
+ overlay: string;
309
+ header: {
310
+ background: string;
311
+ border: string;
312
+ title: string;
313
+ description: string;
314
+ };
315
+ body: {
316
+ background: string;
317
+ text: string;
318
+ };
319
+ footer: {
320
+ background: string;
321
+ label: string;
322
+ border: string;
323
+ };
324
+ }
325
+ interface Breadcrumb {
326
+ text: {
327
+ default: string;
328
+ hover: string;
329
+ active: string;
330
+ };
331
+ ellipsis: {
332
+ background: {
333
+ hover: string;
334
+ };
335
+ };
336
+ }
337
+ interface Switch {
338
+ background: {
339
+ off: {
340
+ default: string;
341
+ hover: string;
342
+ focus: string;
343
+ disabled: string;
344
+ };
345
+ on: {
346
+ default: string;
347
+ hover: string;
348
+ focus: string;
349
+ disabled: string;
350
+ };
351
+ };
352
+ ring: string;
353
+ circle: string;
354
+ }
355
+ interface Tooltip {
356
+ background: string;
357
+ text: string;
358
+ }
359
+ interface Accordion {
360
+ background: string;
361
+ icon: string;
362
+ border: string;
363
+ text: {
364
+ title: string;
365
+ description: string;
366
+ };
367
+ }
368
+ interface Tabs {
369
+ border: {
370
+ default: string;
371
+ active: string;
372
+ };
373
+ text: {
374
+ default: string;
375
+ active: string;
376
+ };
377
+ }
378
+ interface Box {
379
+ background: {
380
+ primary: string;
381
+ secondary: string;
382
+ };
383
+ border: string;
384
+ }
385
+ interface Toast {
386
+ title: string;
387
+ border: string;
388
+ description: string;
389
+ icon: {
390
+ default: string;
391
+ error: string;
392
+ };
393
+ background: string;
394
+ shadow: string;
395
+ }
396
+ interface ActionBar {
397
+ divider: string;
398
+ }
332
399
  declare const colors: {
333
400
  primary: {
334
401
  50: string;
@@ -401,14 +468,24 @@ declare const colors: {
401
468
  separator: Separator;
402
469
  alert: Alert;
403
470
  label: Label;
404
- input: Input;
405
471
  dropdownMenu: DropdownMenu;
406
472
  pagination: Pagination;
407
473
  listItem: ListItem;
408
474
  tag: Tag;
409
475
  table: Table;
476
+ inputSelect: InputSelect;
477
+ inputText: InputText;
410
478
  dialog: Dialog;
411
479
  checkbox: Checkbox;
480
+ drawer: Drawer;
481
+ breadcrumb: Breadcrumb;
482
+ switch: Switch;
483
+ tooltip: Tooltip;
484
+ accordion: Accordion;
485
+ tabs: Tabs;
486
+ box: Box;
487
+ toast: Toast;
488
+ actionBar: ActionBar;
412
489
  };
413
490
 
414
491
  declare const space: {
package/dist/index.js CHANGED
@@ -86,81 +86,17 @@ var button = {
86
86
  }
87
87
  };
88
88
  var badge = {
89
- info: {
90
- background: {
91
- default: "var(--badge-info-background-default)",
92
- hover: "var(--badge-info-background-hover)"
93
- },
94
- text: "var(--badge-info-text)"
95
- },
96
- "info-soft": {
97
- background: {
98
- default: "var(--badge-info-soft-background-default)",
99
- hover: "var(--badge-info-soft-background-hover)"
100
- },
101
- text: "var(--badge-info-soft-text)"
102
- },
103
- warning: {
104
- background: {
105
- default: "var(--badge-warning-background-default)",
106
- hover: "var(--badge-warning-background-hover)"
107
- },
108
- text: "var(--badge-warning-text)"
109
- },
110
- "warning-soft": {
111
- background: {
112
- default: "var(--badge-warning-soft-background-default)",
113
- hover: "var(--badge-warning-soft-background-hover)"
114
- },
115
- text: "var(--badge-warning-soft-text)"
116
- },
117
- neutral: {
118
- background: {
119
- default: "var(--badge-neutral-background-default)",
120
- hover: "var(--badge-neutral-background-hover)"
121
- },
122
- text: "var(--badge-neutral-text)"
123
- },
124
- "neutral-soft": {
125
- background: {
126
- default: "var(--badge-neutral-soft-background-default)",
127
- hover: "var(--badge-neutral-soft-background-hover)"
128
- },
129
- text: "var(--badge-neutral-soft-text)"
130
- },
131
- success: {
132
- background: {
133
- default: "var(--badge-success-background-default)",
134
- hover: "var(--badge-success-background-hover)"
135
- },
136
- text: "var(--badge-success-text)"
137
- },
138
- "success-soft": {
139
- background: {
140
- default: "var(--badge-success-soft-background-default)",
141
- hover: "var(--badge-success-soft-background-hover)"
142
- },
143
- text: "var(--badge-success-soft-text)"
144
- },
145
- danger: {
146
- background: {
147
- default: "var(--badge-danger-background-default)",
148
- hover: "var(--badge-danger-background-hover)"
149
- },
150
- text: "var(--badge-danger-text)"
89
+ primary: {
90
+ background: "var(--badge-primary-background)",
91
+ text: "var(--badge-primary-text)"
151
92
  },
152
- "danger-soft": {
153
- background: {
154
- default: "var(--badge-danger-soft-background-default)",
155
- hover: "var(--badge-danger-soft-background-hover)"
156
- },
157
- text: "var(--badge-danger-soft-text)"
93
+ secondary: {
94
+ background: "var(--badge-secondary-background)",
95
+ text: "var(--badge-secondary-text)"
158
96
  },
159
- outline: {
160
- border: {
161
- default: "var(--badge-outline-border-default)"
162
- },
163
- text: "var(--badge-outline-text)"
97
+ alert: {
98
+ background: "var(--badge-alert-background-default)",
99
+ text: "var(--badge-alert-text)"
164
100
  }
165
101
  };
166
102
  var separator = {
@@ -231,17 +167,33 @@ var label = {
231
167
  active: "var(--label-text-active)"
232
168
  }
233
169
  };
234
- var input = {
235
- background: "var(--input-background)",
170
+ var inputText = {
171
+ background: {
172
+ default: "var(--inputText-background-default)",
173
+ disabled: "var(--inputText-background-disabled)"
174
+ },
236
175
  border: {
237
- default: "var(--input-border-default)",
238
- focus: "var(--input-border-focus)"
239
- },
240
- text: "var(--input-text)",
241
- placeholder: "var(--input-placeholder)",
242
- "helper-text": {
243
- default: "var(--input-helper-text-default)",
244
- error: "var(--input-helper-text-error)"
176
+ default: "var(--inputText-border-default)",
177
+ focus: "var(--inputText-border-focus)",
178
+ active: "var(--inputText-border-active)",
179
+ danger: "var(--inputText-border-danger)",
180
+ disabled: "var(--inputText-border-disabled)",
181
+ filled: "var(--inputText-border-filled)"
182
+ },
183
+ text: {
184
+ default: "var(--inputText-text-default)",
185
+ focus: "var(--inputText-text-focus)",
186
+ active: "var(--inputText-text-active)",
187
+ filled: "var(--inputText-text-filled)",
188
+ disabled: "var(--inputText-text-disabled)"
189
+ },
190
+ icon: {
191
+ default: "var(--inputText-icon-default)",
192
+ focus: "var(--inputText-icon-focus)",
193
+ active: "var(--inputText-icon-active)",
194
+ filled: "var(--inputText-icon-filled)",
195
+ danger: "var(--inputText-icon-danger)",
196
+ disabled: "var(--inputText-icon-disabled)"
245
197
  }
246
198
  };
247
199
  var dropdownMenu = {
@@ -319,6 +271,36 @@ var table = {
319
271
  icon: "var(--table-cell-icon)"
320
272
  }
321
273
  };
274
+ var inputSelect = {
275
+ default: {
276
+ background: "var(--inputSelect-background-default)",
277
+ border: "var(--inputSelect-border-default)",
278
+ text: "var(--inputSelect-text-default)",
279
+ icon: "var(--inputSelect-icon-default)"
280
+ },
281
+ focus: {
282
+ border: "var(--inputSelect-border-focus)",
283
+ text: "var(--inputSelect-text-focus)",
284
+ icon: "var(--inputSelect-icon-focus)"
285
+ },
286
+ active: {
287
+ border: "var(--inputSelect-border-active)",
288
+ text: "var(--inputSelect-text-active)",
289
+ icon: "var(--inputSelect-icon-active)"
290
+ },
291
+ filled: {
292
+ border: "var(--inputSelect-border-filled)",
293
+ text: "var(--inputSelect-text-filled)",
294
+ icon: "var(--inputSelect-icon-filled)"
295
+ },
296
+ disabled: {
297
+ background: "var(--inputSelect-background-disabled)"
298
+ },
299
+ danger: {
300
+ icon: "var(--inputSelect-icon-danger)",
301
+ border: "var(--inputSelect-border-danger)"
302
+ }
303
+ };
322
304
  var dialog = {
323
305
  background: {
324
306
  default: "var(--dialog-background-default)",
@@ -362,6 +344,96 @@ var checkbox = {
362
344
  }
363
345
  }
364
346
  };
347
+ var drawer = {
348
+ overlay: "var(--drawer-background-overlay)",
349
+ header: {
350
+ background: "var(--drawer-header-background)",
351
+ border: "var(--drawer-header-border)",
352
+ title: "var(--drawer-header-title)",
353
+ description: "var(--drawer-header-description)"
354
+ },
355
+ body: {
356
+ background: "var(--drawer-body-background)",
357
+ text: "var(--drawer-body-text)"
358
+ },
359
+ footer: {
360
+ background: "var(--drawer-footer-background)",
361
+ label: "var(--drawer-footer-label)",
362
+ border: "var(--drawer-footer-border)"
363
+ }
364
+ };
365
+ var breadcrumb = {
366
+ text: {
367
+ default: "var(--breadcrumb-text-default)",
368
+ hover: "var(--breadcrumb-text-hover)",
369
+ active: "var(--breadcrumb-text-active)"
370
+ },
371
+ ellipsis: {
372
+ background: { hover: "var(--breadcrumb-ellipsis-bg-hover)" }
373
+ }
374
+ };
375
+ var switchColors = {
376
+ background: {
377
+ off: {
378
+ default: "var(--switch-background-off-default)",
379
+ hover: "var(--switch-background-off-hover)",
380
+ focus: "var(--switch-background-off-focus)",
381
+ disabled: "var(--switch-background-off-disabled)"
382
+ },
383
+ on: {
384
+ default: "var(--switch-background-on-default)",
385
+ hover: "var(--switch-background-on-hover)",
386
+ focus: "var(--switch-background-on-focus)",
387
+ disabled: "var(--switch-background-on-disabled)"
388
+ }
389
+ },
390
+ ring: "var(--switch-ring)",
391
+ circle: "var(--switch-circle)"
392
+ };
393
+ var tooltip = {
394
+ background: "var(--tooltip-background)",
395
+ text: "var(--tooltip-text)"
396
+ };
397
+ var accordion = {
398
+ background: "var(--accordion-background)",
399
+ icon: "var(--accordion-icon)",
400
+ border: "var(--accordion-border)",
401
+ text: {
402
+ title: "var(--accordion-text-title)",
403
+ description: "var(--accordion-text-description)"
404
+ }
405
+ };
406
+ var tabs = {
407
+ border: {
408
+ default: "var(--tabs-border-default)",
409
+ active: "var(--tabs-border-active)"
410
+ },
411
+ text: {
412
+ default: "var(--tabs-text-default)",
413
+ active: "var(--tabs-text-active)"
414
+ }
415
+ };
416
+ var box = {
417
+ background: {
418
+ primary: "var(--box-background)",
419
+ secondary: "var(--box-secondary-background)"
420
+ },
421
+ border: "var(--box-border)"
422
+ };
423
+ var toast = {
424
+ title: "var(--toast-title)",
425
+ description: "var(--toast-description)",
426
+ border: "var(--toast-border)",
427
+ icon: {
428
+ default: "var(--toast-icon-default)",
429
+ error: "var(--toast-icon-error)"
430
+ },
431
+ background: "var(--toast-background)",
432
+ shadow: "var(--toast-shadow)"
433
+ };
434
+ var actionBar = {
435
+ divider: "var(--actionBar-background-divider)"
436
+ };
365
437
  var colors = {
366
438
  primary: {
367
439
  50: "var(--primary-50)",
@@ -434,14 +506,24 @@ var colors = {
434
506
  separator,
435
507
  alert,
436
508
  label,
437
- input,
438
509
  dropdownMenu,
439
510
  pagination,
440
511
  listItem,
441
512
  tag,
442
513
  table,
514
+ inputSelect,
515
+ inputText,
443
516
  dialog,
444
- checkbox
517
+ checkbox,
518
+ drawer,
519
+ breadcrumb,
520
+ switch: switchColors,
521
+ tooltip,
522
+ accordion,
523
+ tabs,
524
+ box,
525
+ toast,
526
+ actionBar
445
527
  };
446
528
 
447
529
  // src/space.ts
package/dist/index.mjs CHANGED
@@ -54,81 +54,17 @@ var button = {
54
54
  }
55
55
  };
56
56
  var badge = {
57
- info: {
58
- background: {
59
- default: "var(--badge-info-background-default)",
60
- hover: "var(--badge-info-background-hover)"
61
- },
62
- text: "var(--badge-info-text)"
63
- },
64
- "info-soft": {
65
- background: {
66
- default: "var(--badge-info-soft-background-default)",
67
- hover: "var(--badge-info-soft-background-hover)"
68
- },
69
- text: "var(--badge-info-soft-text)"
70
- },
71
- warning: {
72
- background: {
73
- default: "var(--badge-warning-background-default)",
74
- hover: "var(--badge-warning-background-hover)"
75
- },
76
- text: "var(--badge-warning-text)"
77
- },
78
- "warning-soft": {
79
- background: {
80
- default: "var(--badge-warning-soft-background-default)",
81
- hover: "var(--badge-warning-soft-background-hover)"
82
- },
83
- text: "var(--badge-warning-soft-text)"
84
- },
85
- neutral: {
86
- background: {
87
- default: "var(--badge-neutral-background-default)",
88
- hover: "var(--badge-neutral-background-hover)"
89
- },
90
- text: "var(--badge-neutral-text)"
91
- },
92
- "neutral-soft": {
93
- background: {
94
- default: "var(--badge-neutral-soft-background-default)",
95
- hover: "var(--badge-neutral-soft-background-hover)"
96
- },
97
- text: "var(--badge-neutral-soft-text)"
98
- },
99
- success: {
100
- background: {
101
- default: "var(--badge-success-background-default)",
102
- hover: "var(--badge-success-background-hover)"
103
- },
104
- text: "var(--badge-success-text)"
105
- },
106
- "success-soft": {
107
- background: {
108
- default: "var(--badge-success-soft-background-default)",
109
- hover: "var(--badge-success-soft-background-hover)"
110
- },
111
- text: "var(--badge-success-soft-text)"
112
- },
113
- danger: {
114
- background: {
115
- default: "var(--badge-danger-background-default)",
116
- hover: "var(--badge-danger-background-hover)"
117
- },
118
- text: "var(--badge-danger-text)"
57
+ primary: {
58
+ background: "var(--badge-primary-background)",
59
+ text: "var(--badge-primary-text)"
119
60
  },
120
- "danger-soft": {
121
- background: {
122
- default: "var(--badge-danger-soft-background-default)",
123
- hover: "var(--badge-danger-soft-background-hover)"
124
- },
125
- text: "var(--badge-danger-soft-text)"
61
+ secondary: {
62
+ background: "var(--badge-secondary-background)",
63
+ text: "var(--badge-secondary-text)"
126
64
  },
127
- outline: {
128
- border: {
129
- default: "var(--badge-outline-border-default)"
130
- },
131
- text: "var(--badge-outline-text)"
65
+ alert: {
66
+ background: "var(--badge-alert-background-default)",
67
+ text: "var(--badge-alert-text)"
132
68
  }
133
69
  };
134
70
  var separator = {
@@ -199,17 +135,33 @@ var label = {
199
135
  active: "var(--label-text-active)"
200
136
  }
201
137
  };
202
- var input = {
203
- background: "var(--input-background)",
138
+ var inputText = {
139
+ background: {
140
+ default: "var(--inputText-background-default)",
141
+ disabled: "var(--inputText-background-disabled)"
142
+ },
204
143
  border: {
205
- default: "var(--input-border-default)",
206
- focus: "var(--input-border-focus)"
207
- },
208
- text: "var(--input-text)",
209
- placeholder: "var(--input-placeholder)",
210
- "helper-text": {
211
- default: "var(--input-helper-text-default)",
212
- error: "var(--input-helper-text-error)"
144
+ default: "var(--inputText-border-default)",
145
+ focus: "var(--inputText-border-focus)",
146
+ active: "var(--inputText-border-active)",
147
+ danger: "var(--inputText-border-danger)",
148
+ disabled: "var(--inputText-border-disabled)",
149
+ filled: "var(--inputText-border-filled)"
150
+ },
151
+ text: {
152
+ default: "var(--inputText-text-default)",
153
+ focus: "var(--inputText-text-focus)",
154
+ active: "var(--inputText-text-active)",
155
+ filled: "var(--inputText-text-filled)",
156
+ disabled: "var(--inputText-text-disabled)"
157
+ },
158
+ icon: {
159
+ default: "var(--inputText-icon-default)",
160
+ focus: "var(--inputText-icon-focus)",
161
+ active: "var(--inputText-icon-active)",
162
+ filled: "var(--inputText-icon-filled)",
163
+ danger: "var(--inputText-icon-danger)",
164
+ disabled: "var(--inputText-icon-disabled)"
213
165
  }
214
166
  };
215
167
  var dropdownMenu = {
@@ -287,6 +239,36 @@ var table = {
287
239
  icon: "var(--table-cell-icon)"
288
240
  }
289
241
  };
242
+ var inputSelect = {
243
+ default: {
244
+ background: "var(--inputSelect-background-default)",
245
+ border: "var(--inputSelect-border-default)",
246
+ text: "var(--inputSelect-text-default)",
247
+ icon: "var(--inputSelect-icon-default)"
248
+ },
249
+ focus: {
250
+ border: "var(--inputSelect-border-focus)",
251
+ text: "var(--inputSelect-text-focus)",
252
+ icon: "var(--inputSelect-icon-focus)"
253
+ },
254
+ active: {
255
+ border: "var(--inputSelect-border-active)",
256
+ text: "var(--inputSelect-text-active)",
257
+ icon: "var(--inputSelect-icon-active)"
258
+ },
259
+ filled: {
260
+ border: "var(--inputSelect-border-filled)",
261
+ text: "var(--inputSelect-text-filled)",
262
+ icon: "var(--inputSelect-icon-filled)"
263
+ },
264
+ disabled: {
265
+ background: "var(--inputSelect-background-disabled)"
266
+ },
267
+ danger: {
268
+ icon: "var(--inputSelect-icon-danger)",
269
+ border: "var(--inputSelect-border-danger)"
270
+ }
271
+ };
290
272
  var dialog = {
291
273
  background: {
292
274
  default: "var(--dialog-background-default)",
@@ -330,6 +312,96 @@ var checkbox = {
330
312
  }
331
313
  }
332
314
  };
315
+ var drawer = {
316
+ overlay: "var(--drawer-background-overlay)",
317
+ header: {
318
+ background: "var(--drawer-header-background)",
319
+ border: "var(--drawer-header-border)",
320
+ title: "var(--drawer-header-title)",
321
+ description: "var(--drawer-header-description)"
322
+ },
323
+ body: {
324
+ background: "var(--drawer-body-background)",
325
+ text: "var(--drawer-body-text)"
326
+ },
327
+ footer: {
328
+ background: "var(--drawer-footer-background)",
329
+ label: "var(--drawer-footer-label)",
330
+ border: "var(--drawer-footer-border)"
331
+ }
332
+ };
333
+ var breadcrumb = {
334
+ text: {
335
+ default: "var(--breadcrumb-text-default)",
336
+ hover: "var(--breadcrumb-text-hover)",
337
+ active: "var(--breadcrumb-text-active)"
338
+ },
339
+ ellipsis: {
340
+ background: { hover: "var(--breadcrumb-ellipsis-bg-hover)" }
341
+ }
342
+ };
343
+ var switchColors = {
344
+ background: {
345
+ off: {
346
+ default: "var(--switch-background-off-default)",
347
+ hover: "var(--switch-background-off-hover)",
348
+ focus: "var(--switch-background-off-focus)",
349
+ disabled: "var(--switch-background-off-disabled)"
350
+ },
351
+ on: {
352
+ default: "var(--switch-background-on-default)",
353
+ hover: "var(--switch-background-on-hover)",
354
+ focus: "var(--switch-background-on-focus)",
355
+ disabled: "var(--switch-background-on-disabled)"
356
+ }
357
+ },
358
+ ring: "var(--switch-ring)",
359
+ circle: "var(--switch-circle)"
360
+ };
361
+ var tooltip = {
362
+ background: "var(--tooltip-background)",
363
+ text: "var(--tooltip-text)"
364
+ };
365
+ var accordion = {
366
+ background: "var(--accordion-background)",
367
+ icon: "var(--accordion-icon)",
368
+ border: "var(--accordion-border)",
369
+ text: {
370
+ title: "var(--accordion-text-title)",
371
+ description: "var(--accordion-text-description)"
372
+ }
373
+ };
374
+ var tabs = {
375
+ border: {
376
+ default: "var(--tabs-border-default)",
377
+ active: "var(--tabs-border-active)"
378
+ },
379
+ text: {
380
+ default: "var(--tabs-text-default)",
381
+ active: "var(--tabs-text-active)"
382
+ }
383
+ };
384
+ var box = {
385
+ background: {
386
+ primary: "var(--box-background)",
387
+ secondary: "var(--box-secondary-background)"
388
+ },
389
+ border: "var(--box-border)"
390
+ };
391
+ var toast = {
392
+ title: "var(--toast-title)",
393
+ description: "var(--toast-description)",
394
+ border: "var(--toast-border)",
395
+ icon: {
396
+ default: "var(--toast-icon-default)",
397
+ error: "var(--toast-icon-error)"
398
+ },
399
+ background: "var(--toast-background)",
400
+ shadow: "var(--toast-shadow)"
401
+ };
402
+ var actionBar = {
403
+ divider: "var(--actionBar-background-divider)"
404
+ };
333
405
  var colors = {
334
406
  primary: {
335
407
  50: "var(--primary-50)",
@@ -402,14 +474,24 @@ var colors = {
402
474
  separator,
403
475
  alert,
404
476
  label,
405
- input,
406
477
  dropdownMenu,
407
478
  pagination,
408
479
  listItem,
409
480
  tag,
410
481
  table,
482
+ inputSelect,
483
+ inputText,
411
484
  dialog,
412
- checkbox
485
+ checkbox,
486
+ drawer,
487
+ breadcrumb,
488
+ switch: switchColors,
489
+ tooltip,
490
+ accordion,
491
+ tabs,
492
+ box,
493
+ toast,
494
+ actionBar
413
495
  };
414
496
 
415
497
  // src/space.ts
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ikatec/nebula-tokens",
3
- "version": "0.0.1-alpha.7",
3
+ "version": "1.0.0",
4
4
  "description": "Design tokens",
5
5
  "publishConfig": {
6
6
  "access": "public"