@ikatec/nebula-react 0.0.1-alpha.25 → 1.0.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/index.d.mts +54 -3
  2. package/dist/index.d.ts +54 -3
  3. package/dist/index.js +299 -28
  4. package/dist/index.mjs +290 -29
  5. package/package.json +2 -1
  6. package/dist/tokens.css +0 -521
package/dist/tokens.css DELETED
@@ -1,521 +0,0 @@
1
- :root {
2
- --primary-50: #f2f7fc;
3
- --primary-100: #e1edf8;
4
- --primary-200: #cadff3;
5
- --primary-300: #a5cbeb;
6
- --primary-400: #7ab0e0;
7
- --primary-500: #5a92d7;
8
- --primary-600: #4679ca;
9
- --primary-700: #3c66b9;
10
- --primary-800: #365497;
11
- --primary-900: #324b7d;
12
- --primary-950: #212e4a;
13
- --success-50: #e9ffe5;
14
- --success-100: #cdffc7;
15
- --success-200: #9fff95;
16
- --success-300: #63fe58;
17
- --success-400: #32f526;
18
- --success-500: #0edc06;
19
- --success-600: #04b100;
20
- --success-700: #068506;
21
- --success-800: #0b690b;
22
- --success-900: #0f5811;
23
- --success-950: #013204;
24
- --warning-50: #fdfbe9;
25
- --warning-100: #fcf9c5;
26
- --warning-200: #fbef8d;
27
- --warning-300: #f8df4c;
28
- --warning-400: #f3cb1c;
29
- --warning-500: #e3b30f;
30
- --warning-600: #c48b0a;
31
- --warning-700: #9c630c;
32
- --warning-800: #814f12;
33
- --warning-900: #6f4115;
34
- --warning-950: #402108;
35
- --danger-50: #fef2f2;
36
- --danger-100: #fee2e2;
37
- --danger-200: #fecaca;
38
- --danger-300: #fba6a6;
39
- --danger-400: #f77272;
40
- --danger-500: #ee4545;
41
- --danger-600: #db2727;
42
- --danger-700: #b81d1d;
43
- --danger-800: #981c1c;
44
- --danger-900: #801e1e;
45
- --danger-950: #450a0a;
46
- --neutral-white: #ffffff;
47
- --neutral-50: #f7f8f8;
48
- --neutral-100: #edeef1;
49
- --neutral-200: #d7dbe0;
50
- --neutral-300: #b4bbc5;
51
- --neutral-400: #8c97a4;
52
- --neutral-500: #6e7a89;
53
- --neutral-600: #586171;
54
- --neutral-700: #4c5461;
55
- --neutral-800: #3e444e;
56
- --neutral-900: #373c43;
57
- --neutral-950: #24272d;
58
- --neutral-1000: #1d1f24;
59
-
60
- --button-primary-background-default: var(--primary-900);
61
- --button-primary-background-hover: var(--primary-800);
62
- --button-primary-background-active: var(--primary-950);
63
- --button-primary-background-focus: var(--primary-800);
64
- --button-primary-border-focus: var(--primary-300);
65
- --button-primary-text: var(--neutral-50);
66
-
67
- --button-secondary-background-default: white;
68
- --button-secondary-background-hover: var(--neutral-50);
69
- --button-secondary-background-active: var(--neutral-100);
70
- --button-secondary-background-focus: white;
71
- --button-secondary-border-default: var(--neutral-300);
72
- --button-secondary-border-focus: var(--primary-300);
73
- --button-secondary-text: var(--neutral-1000);
74
-
75
- --button-ghost-background-hover: var(--neutral-100);
76
- --button-ghost-background-active: var(--neutral-200);
77
- --button-ghost-background-focus: var(--neutral-100);
78
- --button-ghost-border-focus: var(--primary-300);
79
- --button-ghost-text: var(--neutral-1000);
80
-
81
- --button-danger-background-default: var(--danger-700);
82
- --button-danger-background-hover: var(--danger-600);
83
- --button-danger-background-active: var(--danger-800);
84
- --button-danger-background-focus: var(--danger-600);
85
- --button-danger-border-focus: var(--danger-300);
86
- --button-danger-text: var(--neutral-50);
87
-
88
- --button-disabled-background: var(--neutral-200);
89
- --button-disabled-text: var(--neutral-500);
90
-
91
- /* badge styles */
92
- --badge-primary-background: var(--primary-900);
93
- --badge-primary-text: var(--neutral-white);
94
-
95
- --badge-secondary-background: var(--neutral-200);
96
- --badge-secondary-text: var(--neutral-1000);
97
-
98
- --badge-alert-background-default: var(--danger-600);
99
- --badge-alert-text: var(--neutral-white);
100
-
101
- --separator-border-default: var(--neutral-300);
102
-
103
- --alert-success-background: var(--success-50);
104
- --alert-success-border: var(--success-600);
105
- --alert-success-text: var(--neutral-950);
106
- --alert-success-icon: var(--success-700);
107
- --alert-success-button-color: var(--primary-900);
108
-
109
- --alert-info-background: var(--primary-50);
110
- --alert-info-border: var(--primary-600);
111
- --alert-info-text: var(--neutral-950);
112
- --alert-info-icon: var(--primary-700);
113
- --alert-info-button-color: var(--primary-900);
114
-
115
- --alert-default-background: var(--neutral-50);
116
- --alert-default-border: var(--primary-600);
117
- --alert-default-text: var(--neutral-950);
118
- --alert-default-icon: var(--primary-700);
119
- --alert-default-button-color: var(--primary-900);
120
-
121
- --alert-warning-background: var(--warning-50);
122
- --alert-warning-border: var(--warning-600);
123
- --alert-warning-text: var(--neutral-950);
124
- --alert-warning-icon: var(--warning-700);
125
- --alert-warning-button-color: var(--primary-900);
126
-
127
- --alert-danger-background: var(--danger-50);
128
- --alert-danger-border: var(--danger-600);
129
- --alert-danger-text: var(--neutral-950);
130
- --alert-danger-icon: var(--danger-700);
131
- --alert-danger-button-color: var(--primary-900);
132
-
133
- --label-text-default: var(--neutral-500);
134
- --label-text-active: var(--neutral-950);
135
-
136
- --input-background: white;
137
- --input-border-default: var(--neutral-300);
138
- --input-border-focus: var(--primary-950);
139
- --input-text: var(--neutral-950);
140
- --input-placeholder: var(--neutral-500);
141
- --input-helper-text-default: var(--neutral-500);
142
- --input-helper-text-error: var(--danger-500);
143
-
144
- /* Dropdown styles */
145
- --dropdown-background: white;
146
- --dropdown-border: var(--neutral-200);
147
- --dropdown-shadow: rgba(166, 184, 230, 0.32);
148
-
149
- /* Popover styles */
150
- --popover-background: var(--neutral-white);
151
- --popover-border-color: var(--neutral-200);
152
- --popover-shadow-color: rgba(166, 184, 230, 0.32);
153
-
154
- /* listItem styles */
155
- --listItem-background: white;
156
- --listItem-background-hover: var(--neutral-50);
157
- --listItem-border: var(--neutral-200);
158
- --listItem-text-header: var(--neutral-400);
159
- --listItem-text: var(--neutral-600);
160
- --listItem-text-selected: var(--neutral-950);
161
- --listItem-icon: var(--neutral-600);
162
- --listItem-icon-selected: var(--neutral-950);
163
-
164
- /* Pagination styles */
165
- --pagination-text: var(--neutral-600);
166
- --pagination-background-default: var(--neutral-white);
167
- --pagination-background-hover: var(--neutral-50);
168
- --pagination-background-disabled: var(--neutral-white);
169
- --pagination-border-default: var(--neutral-200);
170
- --pagination-border-disabled: var(--neutral-100);
171
- --pagination-icon-default: var(--neutral-600);
172
- --pagination-icon-disabled: var(--neutral-300);
173
-
174
- /* Tag styles */
175
- --tag-border: var(--neutral-200);
176
- --tag-icon: var(--neutral-400);
177
- --tag-text: var(--neutral-600);
178
- --tag-background-hover: var(--neutral-100);
179
- --tag-colorIndicator-yellow: #f3cb1c;
180
- --tag-colorIndicator-blue: #40c3ff;
181
- --tag-colorIndicator-red: #f77272;
182
- --tag-colorIndicator-green: #6ee566;
183
- --tag-colorIndicator-gray: #8c97a4;
184
- --tag-colorIndicator-orange: #ff7f29;
185
-
186
- /* Table styles */
187
- --table-background: white;
188
- --table-border: var(--neutral-200);
189
- /* --table-header-background: white; */
190
- /* --table-header-border: var(--neutral-200); */
191
- --table-header-text: var(--neutral-800);
192
- /* --table-header-helper: var(--neutral-300); */
193
- --table-cell-background-first-layer: white;
194
- --table-cell-background-second-layer: var(--neutral-50);
195
- --table-cell-border: var(--neutral-200);
196
- --table-cell-text: var(--neutral-950);
197
- --table-cell-link: var(--primary-700);
198
- --table-cell-icon: var(--primary-950);
199
-
200
- /* Input select styles */
201
- /* default */
202
- --inputSelect-background-default: var(--neutral-white);
203
- --inputSelect-border-default: var(--neutral-300);
204
- --inputSelect-text-default: var(--neutral-500);
205
- --inputSelect-icon-default: var(--neutral-500);
206
-
207
- /* Focus */
208
- --inputSelect-border-focus: var(--primary-300);
209
- --inputSelect-text-focus: var(--neutral-950);
210
-
211
- /* Active */
212
- --inputSelect-border-active: var(--neutral-950);
213
- --inputSelect-text-active: var(--neutral-950);
214
- --inputSelect-icon-active: var(--neutral-950);
215
-
216
- /* Filled */
217
- --inputSelect-border-filled: var(--primary-300);
218
- --inputSelect-text-filled: var(--neutral-950);
219
- --inputSelect-icon-filled: var(--neutral-950);
220
-
221
- /* Disabled */
222
- --inputSelect-background-disabled: var(--neutral-100);
223
-
224
- /* Danger */
225
- --inputSelect-border-danger: var(--danger-600);
226
- --inputSelect-icon-danger: var(--danger-600);
227
-
228
- /* Input-text styles */
229
- --inputText-background-default: white;
230
- --inputText-background-disabled: var(--neutral-100);
231
- --inputText-border-default: var(--neutral-300);
232
- --inputText-border-focus: var(--primary-300);
233
- --inputText-border-active: var(--neutral-950);
234
- --inputText-border-danger: var(--danger-600);
235
- --inputText-border-filled: var(--neutral-950);
236
- --inputText-text-default: var(--neutral-500);
237
- --inputText-text-focus: var(--neutral-950);
238
- /* --inputText-text-active: var(--primary-950); */
239
- --inputText-text-filled: var(--neutral-950);
240
- --inputText-text-disabled: var(--neutral-500);
241
- --inputText-icon-default: var(--neutral-500);
242
- --inputText-icon-focus: var(--neutral-950);
243
- /* --inputText-icon-active: var(--primary-950); */
244
- --inputText-icon-filled: var(--neutral-950);
245
- --inputText-icon-danger: var(--danger-600);
246
- --inputText-icon-disabled: var(--neutral-500);
247
-
248
- /* Dialog styles */
249
- --dialog-background-default: white;
250
- --dialog-background-overlay: rgba(0, 0, 0, 0.5);
251
- --dialog-title: var(--primary-950);
252
- --dialog-text: var(--neutral-600);
253
- --dialog-icon: var(--primary-950);
254
-
255
- /* Checkbox styles */
256
- --checkbox-unselected-background-default: white;
257
- --checkbox-unselected-background-hover: var(--neutral-50);
258
- --checkbox-unselected-background-focus: var(--neutral-50);
259
- --checkbox-unselected-background-disabled: var(--neutral-200);
260
- --checkbox-unselected-border-default: var(--neutral-200);
261
- --checkbox-unselected-border-hover: var(--neutral-400);
262
- --checkbox-unselected-border-focus: var(--neutral-400);
263
- --checkbox-unselected-border-disabled: var(--neutral-300);
264
- --checkbox-unselected-border-external-focus: var(--primary-300);
265
- --checkbox-selected-background-default: var(--primary-800);
266
- --checkbox-selected-background-hover: var(--primary-900);
267
- --checkbox-selected-background-focus: var(--primary-900);
268
- --checkbox-selected-background-disabled: var(--neutral-200);
269
- --checkbox-selected-border-focus: var(--primary-800);
270
- --checkbox-selected-icon-default: white;
271
- --checkbox-selected-icon-disabled: var(--neutral-500);
272
-
273
- /* Drawer styles */
274
-
275
- --drawer-header-background: white;
276
- --drawer-header-border: var(--neutral-100);
277
- --drawer-header-title: var(--neutral-950);
278
- --drawer-header-description: var(--neutral-600);
279
- --drawer-footer-background: white;
280
- --drawer-footer-border: var(--neutral-100);
281
- --drawer-footer-label: var(--neutral-950);
282
- --drawer-body-background: white;
283
- --drawer-body-text: var(--neutral-950);
284
- --drawer-background-overlay: rgba(0, 0, 0, 0.5);
285
-
286
- /* Breadcrumb styles */
287
- --breadcrumb-text-default: var(--neutral-600);
288
- --breadcrumb-text-hover: var(--neutral-950);
289
- --breadcrumb-text-active: var(--primary-700);
290
- --breadcrumb-ellipsis-bg-hover: var(--neutral-100);
291
-
292
- /* Switch styles */
293
- --switch-background-off-default: var(--neutral-200);
294
- --switch-background-off-hover: var(--neutral-300);
295
- --switch-background-off-focus: var(--neutral-300);
296
- --switch-background-off-disabled: var(--neutral-200);
297
- --switch-background-on-default: var(--primary-800);
298
- --switch-background-on-hover: var(--primary-900);
299
- --switch-background-on-focus: var(--primary-900);
300
- --switch-background-on-disabled: var(--primary-800);
301
- --switch-ring: var(--primary-300);
302
- --switch-circle: white;
303
-
304
- /* Tooltip styles */
305
- --tooltip-background: var(--neutral-950);
306
- --tooltip-text: var(--neutral-50);
307
-
308
- /* Tabs styles */
309
- --tabs-border-default: var(--neutral-200);
310
- --tabs-border-active: var(--primary-700);
311
- --tabs-text-default: var(--neutral-600);
312
- --tabs-text-active: var(--neutral-950);
313
- }
314
-
315
- .dark {
316
- --button-primary-background-default: var(--primary-200);
317
- --button-primary-background-hover: var(--primary-300);
318
- --button-primary-background-active: var(--primary-400);
319
- --button-primary-background-focus: var(--primary-300);
320
- --button-primary-border-focus: var(--primary-500);
321
- --button-primary-text: var(--neutral-950);
322
-
323
- --button-secondary-background-default: var(--neutral-950);
324
- --button-secondary-background-hover: var(--neutral-900);
325
- --button-secondary-background-active: var(--neutral-800);
326
- --button-secondary-background-focus: var(--neutral-950);
327
- --button-secondary-border-default: var(--neutral-500);
328
- --button-secondary-border-focus: var(--primary-500);
329
- --button-secondary-text: var(--neutral-200);
330
-
331
- --button-ghost-background-hover: var(--neutral-800);
332
- --button-ghost-background-active: var(--neutral-900);
333
- --button-ghost-background-focus: var(--neutral-800);
334
- --button-ghost-border-focus: var(--primary-500);
335
- --button-ghost-text: var(--neutral-200);
336
-
337
- --button-danger-background-default: var(--danger-300);
338
- --button-danger-background-hover: var(--danger-400);
339
- --button-danger-background-active: var(--danger-500);
340
- --button-danger-background-focus: var(--danger-400);
341
- --button-danger-border-focus: var(--danger-300);
342
- --button-danger-text: var(--neutral-950);
343
-
344
- --button-disabled-background: var(--neutral-800);
345
- --button-disabled-text: var(--neutral-400);
346
-
347
- /* badge styles */
348
- --badge-primary-background: var(--primary-200);
349
- --badge-primary-text: var(--neutral-950);
350
-
351
- --badge-secondary-background: var(--neutral-200);
352
- --badge-secondary-text: var(--neutral-950);
353
-
354
- --badge-alert-background-default: var(--danger-600);
355
- --badge-alert-text: var(--neutral-white);
356
-
357
- /* Pagination styles */
358
- --pagination-text: var(--neutral-600);
359
- --pagination-background-hover: var(--neutral-800);
360
- --pagination-background-default: var(--neutral-950);
361
- --pagination-border-default: var(--neutral-800);
362
- --pagination-icon-default: var(--neutral-500);
363
- --pagination-icon-disabled: var(--neutral-800);
364
- --pagination-background-disabled: var(--neutral-950);
365
- --pagination-border-disabled: var(--neutral-900);
366
-
367
- /* Dropdown styles */
368
- --dropdown-background: var(--neutral-900);
369
- --dropdown-border: var(--neutral-800);
370
- --dropdown-shadow: rgba(0, 0, 0, 0.5);
371
-
372
- /* listItem styles */
373
- --listItem-background: var(--neutral-900);
374
- --listItem-background-hover: var(--neutral-800);
375
- --listItem-border: var(--neutral-800);
376
- --listItem-text-header: var(--neutral-500);
377
- --listItem-text: var(--neutral-300);
378
- --listItem-text-selected: var(--neutral-200);
379
- --listItem-icon: var(--neutral-300);
380
- --listItem-icon-selected: var(--neutral-200);
381
-
382
- /* Tag styles */
383
- --tag-border: var(--neutral-800);
384
- --tag-icon: var(--neutral-500);
385
- --tag-text: var(--neutral-200);
386
- --tag-background-hover: var(--neutral-800);
387
- --tag-colorIndicator-yellow: #f3cb1c;
388
- --tag-colorIndicator-blue: #40c3ff;
389
- --tag-colorIndicator-red: #f77272;
390
- --tag-colorIndicator-green: #6ee566;
391
- --tag-colorIndicator-gray: #8c97a4;
392
- --tag-colorIndicator-orange: #ff7f29;
393
-
394
- /* Table styles */
395
- --table-background: var(--neutral-900);
396
- --table-border: var(--neutral-800);
397
- /* --table-header-background: white; */
398
- /* --table-header-border: var(--neutral-200); */
399
- --table-header-text: var(--neutral-400);
400
- /* --table-header-helper: var(--neutral-300); */
401
- --table-cell-background-first-layer: var(--neutral-950);
402
- --table-cell-background-second-layer: var(--neutral-1000);
403
- --table-cell-border: var(--neutral-800);
404
- --table-cell-text: var(--neutral-200);
405
- --table-cell-link: var(--primary-300);
406
- --table-cell-icon: var(--primary-500);
407
-
408
- /* Input select styles */
409
- /* Default */
410
- --inputSelect-background-default: var(--neutral-900);
411
- --inputSelect-border-default: var(--neutral-500);
412
- --inputSelect-text-default: var(--neutral-500);
413
- --inputSelect-icon-default: var(--neutral-500);
414
-
415
- /* Focus */
416
- --inputSelect-border-focus: var(--primary-400);
417
- --inputSelect-text-focus: var(--neutral-200);
418
-
419
- /* Active */
420
- --inputSelect-border-active: var(--primary-200);
421
- --inputSelect-text-active: var(--neutral-200);
422
- --inputSelect-icon-active: var(--neutral-200);
423
-
424
- /* Filled */
425
- --inputSelect-border-filled: var(--primary-500);
426
- --inputSelect-text-filled: var(--neutral-200);
427
- --inputSelect-icon-filled: var(--neutral-200);
428
-
429
- /* Disabled */
430
- --inputSelect-background-disabled: var(--primary-500);
431
-
432
- /* Danger */
433
- --inputSelect-border-danger: var(--danger-300);
434
- --inputSelect-icon-danger: var(--danger-300);
435
-
436
- /* Input-text styles */
437
- --inputText-background-default: var(--neutral-900);
438
- --inputText-background-disabled: var(--neutral-700);
439
- --inputText-border-default: var(--neutral-500);
440
- --inputText-border-focus: var(--primary-300);
441
- --inputText-border-active: var(--neutral-200);
442
- --inputText-border-danger: var(--danger-300);
443
- --inputText-border-filled: var(--neutral-200);
444
- --inputText-text-default: var(--neutral-500);
445
- --inputText-text-focus: var(--neutral-200);
446
- /* --inputText-text-active: var(--primary-950); */
447
- --inputText-text-filled: var(--neutral-200);
448
- --inputText-text-disabled: var(--neutral-400);
449
- --inputText-icon-default: var(--neutral-500);
450
- --inputText-icon-focus: var(--primary-950);
451
- /* --inputText-icon-active: var(--primary-950); */
452
- --inputText-icon-filled: var(--neutral-200);
453
- --inputText-icon-danger: var(--danger-300);
454
- --inputText-icon-disabled: var(--neutral-400);
455
-
456
- /* Dialog styles */
457
- --dialog-background-default: var(--neutral-950);
458
- --dialog-background-overlay: rgba(0, 0, 0, 0.5);
459
- --dialog-title: var(--neutral-200);
460
- --dialog-text: var(--neutral-400);
461
- --dialog-icon: var(--neutral-200);
462
-
463
- /* Checkbox styles */
464
- --checkbox-unselected-background-default: var(--neutral-900);
465
- --checkbox-unselected-background-hover: var(--neutral-800);
466
- --checkbox-unselected-background-focus: var(--neutral-800);
467
- --checkbox-unselected-background-disabled: var(--neutral-500);
468
- --checkbox-unselected-border-default: var(--neutral-800);
469
- --checkbox-unselected-border-hover: var(--neutral-500);
470
- --checkbox-unselected-border-focus: var(--neutral-500);
471
- --checkbox-unselected-border-external-focus: var(--primary-300);
472
- --checkbox-unselected-border-disabled: var(--neutral-700);
473
- --checkbox-selected-background-default: var(--primary-100);
474
- --checkbox-selected-background-hover: var(--primary-200);
475
- --checkbox-selected-background-focus: var(--primary-200);
476
- --checkbox-selected-background-disabled: var(--neutral-500);
477
- --checkbox-selected-border-focus: var(--primary-100);
478
- --checkbox-selected-icon-default: var(--neutral-950);
479
- --checkbox-selected-icon-disabled: var(--neutral-800);
480
-
481
- /* Drawer styles */
482
-
483
- --drawer-header-background: var(--neutral-900);
484
- --drawer-header-border: var(--neutral-800);
485
- --drawer-header-title: var(--neutral-200);
486
- --drawer-header-description: var(--neutral-400);
487
- --drawer-footer-background: var(--neutral-900);
488
- --drawer-footer-border: var(--neutral-800);
489
- --drawer-footer-label: var(--neutral-200);
490
- --drawer-body-background: var(--neutral-900);
491
- --drawer-body-text: var(--neutral-200);
492
- --drawer-background-overlay: rgba(0, 0, 0, 0.5);
493
-
494
- /* Breadcrumb styles */
495
- --breadcrumb-text-default: var(--neutral-400);
496
- --breadcrumb-text-hover: var(--neutral-50);
497
- --breadcrumb-text-active: var(--primary-500);
498
- --breadcrumb-ellipsis-bg-hover: var(--neutral-800);
499
-
500
- /* Switch styles */
501
- --switch-background-off-default: var(--neutral-800);
502
- --switch-background-off-hover: var(--neutral-700);
503
- --switch-background-off-focus: var(--neutral-700);
504
- --switch-background-off-disabled: var(--neutral-800);
505
- --switch-background-on-default: var(--primary-500);
506
- --switch-background-on-hover: var(--primary-400);
507
- --switch-background-on-focus: var(--primary-400);
508
- --switch-background-on-disabled: var(--primary-500);
509
- --switch-ring: var(--primary-100);
510
- --switch-circle: white;
511
-
512
- /* Tooltip styles */
513
- --tooltip-background: var(--neutral-700);
514
- --tooltip-text: var(--neutral-50);
515
-
516
- /* Tabs styles */
517
- --tabs-border-default: var(--neutral-800);
518
- --tabs-border-active: var(--primary-200);
519
- --tabs-text-default: var(--neutral-500);
520
- --tabs-text-active: var(--neutral-200);
521
- }