react-core-ts 1.2.26 → 1.2.28

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.
@@ -1,617 +0,0 @@
1
- body * {
2
- box-sizing: border-box;
3
- }
4
- :root {
5
- --grey-dark: #4a4a4a;
6
- --grey-light: #d3d3d3;
7
- --blue-navy: #001f3f;
8
- --input-disabled: #a9a9a9;
9
- --error-light: #f08080;
10
- --error-extra-light: #fddede;
11
- --success: #28a745;
12
- --success-light: #d4edda;
13
- --blue-light: #add8e6;
14
- }
15
- :root {
16
- --blue-navy: #001f3f;
17
- --table-hover: #your-hover-color; /* Replace with your actual color code */
18
- }
19
-
20
- .custom-spinner {
21
- width: 24px !important; /* w-6 */
22
- height: 24px; /* h-6 */
23
- color: transparent; /* text-table-hover */
24
- fill: var(--blue-navy); /* fill-blue-navy */
25
- animation: spin 1s linear infinite; /* animate-spin */
26
- width: 15px;
27
- position: relative;
28
- top: 1px;
29
- }
30
-
31
- @keyframes spin {
32
- 0% {
33
- transform: rotate(0deg);
34
- }
35
- 100% {
36
- transform: rotate(360deg);
37
- }
38
- }
39
-
40
- .textfield,
41
- .textfield-big {
42
- outline: none;
43
- color: var(--grey-dark);
44
- border-color: var(--grey-light);
45
- background-color: white;
46
- }
47
-
48
- .textfield:focus,
49
- .textfield-big:focus {
50
- border-color: var(--blue-navy);
51
- }
52
-
53
- .textfield:disabled,
54
- .textfield-big:disabled {
55
- color: var(--input-disabled);
56
- }
57
-
58
- .textfield-error,
59
- .textfield-big-error {
60
- outline: none;
61
- color: var(--error-light) !important;
62
- border-color: var(--error-light) !important;
63
- background-color: var(--error-extra-light) !important ;
64
- }
65
-
66
- .textfield-error::placeholder,
67
- .textfield-big-error::placeholder {
68
- color: var(--error-light);
69
- }
70
-
71
- .textfield-success {
72
- outline: none;
73
- color: var(--success);
74
- border-color: var(--success);
75
- background-color: var(--success-light);
76
- }
77
-
78
- .textfield-success:focus {
79
- ring-width: 0;
80
- }
81
-
82
- .textfield-success::placeholder {
83
- color: var(--success);
84
- }
85
-
86
- .textfield-editable {
87
- outline: none;
88
- color: var(--grey-dark);
89
- border-color: var(--blue-navy);
90
- background-color: var(--blue-light);
91
- }
92
-
93
- .textfield-editable::placeholder {
94
- color: var(--grey-dark);
95
- }
96
-
97
- .qbs-autocomplete-suggestions {
98
- position: absolute;
99
- height: auto;
100
- width: 100%;
101
- padding: 8px; /* Corresponding to p-1.5 in Tailwind */
102
- z-index: 39;
103
- margin-top: 4px;
104
- margin-bottom: 0;
105
- border-radius: 8px;
106
- background: #fff;
107
- box-shadow: 0px 8px 20px 0px rgba(0, 0, 0, 0.15);
108
- transition: transform 0.2s ease-out, opacity 0.2s ease-out;
109
- }
110
- .qbs-autocomplete-suggestions.bottom {
111
- top: 100%; /* Position below the input */
112
- /* Other styling */
113
- }
114
-
115
- .qbs-autocomplete-suggestions.top {
116
- bottom: 100%; /* Position above the input */
117
- /* Other styling */
118
- }
119
- .qbs-autocomplete-suggestions-item {
120
- cursor: pointer;
121
- padding: 6px 8px;
122
- border-radius: 6px;
123
- color: #222;
124
- font-size: 14px;
125
- font-weight: 500;
126
- line-height: 20px; /* 142.857% */
127
- width: 100%;
128
- display: flex;
129
- align-items: flex-start;
130
- gap: 8px;
131
- }
132
- .qbs-autocomplete-suggestions-item:hover {
133
- background: #f8f8f8;
134
- border-radius: 6px;
135
- }
136
-
137
- /* When value.id is equal to suggestion.id */
138
- .is-selected {
139
- border-radius: 6px;
140
- background: var(--neutrals-grey-20, #f4f4f4);
141
- }
142
-
143
- /* When value.id is NOT equal to suggestion.id */
144
- .qbs-autocomplete-suggestions-item .is-not-selected:hover {
145
- background-color: #f1f5f9; /* Replace with actual color code for 'hover:bg-table-hover' */
146
- }
147
-
148
- .qbs-autocomplete-notfound {
149
- cursor: pointer;
150
- padding: 6px 8px;
151
- border-radius: 6px;
152
- font-size: 12px;
153
- font-weight: 500;
154
- }
155
- .qbs-autocomplete-witherror-close-icon {
156
- position: absolute;
157
- top: calc(50% - 8px);
158
- right: 22px; /* right-1 */
159
- padding-left: 0.25rem; /* px-1 */
160
- padding-right: 0.25rem; /* px-1 */
161
- display: flex;
162
- justify-content: center;
163
- align-items: center;
164
- background-color: white; /* bg-white */
165
- }
166
- .qbs-autocomplete-close-icon {
167
- position: absolute;
168
- top: calc(50% - 8px);
169
- right: 2px; /* right-1 */
170
- padding-left: 0.25rem; /* px-1 */
171
- padding-right: 0.25rem; /* px-1 */
172
- display: flex;
173
- justify-content: center;
174
- align-items: center;
175
- }
176
- .qbs-textfield-default {
177
- width: 100%;
178
- position: relative;
179
- padding-right: 8px;
180
- min-height: 36px;
181
- height: 36px;
182
- border-radius: 6px;
183
- padding-left: 8px;
184
- border: 1px solid #d6d8dc;
185
- background: #fff;
186
- box-sizing: border-box;
187
- font-size: 14px;
188
- font-style: normal;
189
- font-weight: 500;
190
- line-height: 20px;
191
- color: #313131;
192
- }
193
-
194
- .qbs-expandable-container {
195
- border: 1px solid #d6d8dc;
196
- background: #fff;
197
- box-sizing: border-box;
198
- padding: 5px;
199
- display: flex;
200
- flex-wrap: wrap;
201
- flex: 1 1 0%;
202
- gap: 5px;
203
- }
204
-
205
- .qbs-dropdown-selected-container {
206
- border: 0px;
207
- border-top: 1px solid #d6d8dc;
208
- min-height: 35px;
209
- margin-top: 2px;
210
- padding-top: 10px;
211
- }
212
- .qbs-dropdown-selected-preview {
213
- .qbs-dropdown-selected-container {
214
- border-top: 0px;
215
- }
216
- }
217
-
218
- .qbs-dropdown-selected-container .qbs-clear-link {
219
- color: #e76458;
220
- }
221
-
222
- .qbs-textfield-default.expandable {
223
- height: auto;
224
- border: none;
225
- }
226
-
227
- .qbs-expandable-container .qbs-textfield-expandable {
228
- flex: 1 1 auto;
229
- display: inline-grid;
230
- grid-template-columns: 0px min-content;
231
- grid-area: 1 / 1 / 2 / 3;
232
- overflow: hidden;
233
- }
234
- .qbs-expandable-container .qbs-textfield-expandable::after {
235
- content: attr(data-value) ' ';
236
- visibility: hidden;
237
- white-space: pre;
238
- grid-area: 1 / 2;
239
- font: inherit;
240
- min-width: 2px;
241
- border: 0px;
242
- margin: 0px;
243
- outline: 0px;
244
- padding: 0px;
245
- }
246
- .qbs-expandable-container .qbs-textfield-expandable input {
247
- opacity: 1;
248
- width: auto;
249
- grid-area: 1 / 2;
250
- min-width: 10px;
251
- border: 0px;
252
- margin: 0px;
253
- outline: 0px;
254
- padding: 0px;
255
- height: auto;
256
- min-height: auto;
257
- border-radius: 0;
258
- }
259
-
260
- .qbs-textfield-default::placeholder {
261
- font-size: 14px;
262
- font-style: normal;
263
- font-weight: 500;
264
- line-height: 20px;
265
- }
266
-
267
- .qbs-autocomplete-close-icon button:focus-within {
268
- outline: none;
269
- }
270
-
271
- .fullWidth {
272
- width: 100%;
273
- }
274
-
275
- .autoWidth {
276
- width: auto;
277
- }
278
- .icon-button {
279
- background: transparent;
280
- border: none;
281
- display: inline-flex;
282
- cursor: pointer;
283
- padding: 0px 1px;
284
- }
285
- .icon-button-rotate {
286
- rotate: 180deg;
287
- }
288
- .labels {
289
- font-size: 12px;
290
- }
291
- .dropdown-search-input {
292
- min-width: -webkit-fill-available;
293
- border-radius: 6px;
294
- border: 1px solid var(--border-card-color-default, #d6d8dc);
295
- background: var(--surface-input-bg-color-default, #fff);
296
- color: #313131;
297
- font-size: 14px;
298
- height: 36px;
299
- padding: 0px 8px;
300
- font-style: normal;
301
- font-weight: 500;
302
- line-height: 20px;
303
- padding-left: 32px;
304
- }
305
- .qbs-autocomplete-suggestions-sub {
306
- position: relative;
307
- overflow: auto;
308
- max-height: 184px;
309
- top: 0;
310
- display: flex;
311
- flex-direction: column;
312
- gap: 4px;
313
- }
314
- .qbs-autocomplete-listitem-container {
315
- display: flex;
316
- align-items: center;
317
- gap: 0px;
318
- }
319
- ul {
320
- list-style-type: none;
321
- }
322
-
323
- .react-core-ts-search-container {
324
- display: flex;
325
- align-items: center;
326
- gap: var(--spacing-4, 4px);
327
- align-self: stretch;
328
- margin-bottom: 4px;
329
- }
330
- .selected-item {
331
- display: flex;
332
- align-items: center;
333
- justify-content: space-between;
334
- padding: 3px 6px;
335
- margin: 0;
336
- background-color: #e0e0e0;
337
- color: #333;
338
- border-radius: 6px;
339
- border: 1px solid rgba(231, 100, 88, 0.1);
340
- background: rgba(231, 100, 88, 0.1);
341
- font-size: 12px;
342
- font-style: normal;
343
- font-weight: 500;
344
- line-height: 16px;
345
- color: #e76458;
346
- gap: 6px;
347
- height: 22px;
348
- }
349
-
350
- .remove-item-btn {
351
- background-color: transparent;
352
- border: none;
353
- color: #e76458;
354
- cursor: pointer;
355
- }
356
-
357
- .remove-item-btn:hover {
358
- color: #e76458;
359
- }
360
-
361
- .selected-items-container {
362
- display: flex;
363
- gap: 12px;
364
- align-items: center;
365
- position: absolute;
366
- left: 8px;
367
- z-index: 39;
368
- top: 6.5px;
369
- flex-wrap: wrap;
370
- }
371
-
372
- .qbs-expandable-container .selected-items-container {
373
- position: relative;
374
- top: 0;
375
- left: 0;
376
- }
377
-
378
- .selected-items-container .badge {
379
- background-color: #c63a3a;
380
- color: #fff;
381
- }
382
-
383
- .selected-item-more {
384
- display: flex;
385
- align-items: center;
386
- justify-content: center;
387
- padding: 3px 8px;
388
- margin: 0;
389
- border-radius: 6px;
390
- background: #c63a3a;
391
- font-size: 12px;
392
- font-style: normal;
393
- font-weight: 500;
394
- line-height: 16px;
395
- color: #fff;
396
- height: 22px;
397
- }
398
-
399
- .loadMoreSection {
400
- margin: 0;
401
- cursor: pointer;
402
- display: flex;
403
- justify-content: flex-start;
404
- padding: 8px;
405
- }
406
- .loadMoreSection p {
407
- color: #336cfc;
408
- font-size: 14px;
409
- font-style: normal;
410
- font-weight: 500;
411
- line-height: 20px;
412
- margin: 0;
413
- }
414
- ::-webkit-scrollbar-track {
415
- -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
416
- border-radius: 0px;
417
- background-color: transparent;
418
- }
419
-
420
- ::-webkit-scrollbar {
421
- width: 6px;
422
- height: 4px;
423
- background-color: transparent;
424
- }
425
-
426
- ::-webkit-scrollbar-thumb {
427
- border-radius: 100px;
428
- -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0);
429
- background-color: #ddd;
430
- }
431
-
432
- .qbs-autocomplete-suggestions-item.is-selected {
433
- color: #e76458;
434
- background: #f8f8f8;
435
- }
436
-
437
- span.dropdown-search-icon {
438
- position: absolute;
439
- left: 8px;
440
- top: 10px;
441
- }
442
-
443
- .dropdown-search-input:focus {
444
- outline: none;
445
- border: 1px solid #222;
446
- }
447
-
448
- .qbs-autocomplete-checkbox-container {
449
- gap: 8px;
450
- padding: 6px 8px;
451
- display: flex;
452
- align-items: flex-start;
453
- }
454
-
455
- .qbs-autocomplete-checkbox-container .qbs-autocomplete-suggestions-item {
456
- padding: 0;
457
- /* pointer-events: none; */
458
- }
459
-
460
- .qbs-autocomplete-checkbox-container:hover {
461
- background: #f8f8f8;
462
- border-radius: 6px;
463
- }
464
-
465
- .qbs-autocomplete-checkbox-container.is-selected {
466
- background: #f8f8f8;
467
- border-radius: 6px;
468
- }
469
-
470
- .qbs-autocomplete-checkbox {
471
- position: relative;
472
- display: flex;
473
- align-items: center;
474
- justify-content: center;
475
- }
476
-
477
- .qbs-autocomplete-checkbox input {
478
- opacity: 0;
479
- }
480
-
481
- .qbs-autocomplete-checkbox input ~ label {
482
- position: absolute;
483
- border-radius: 3px;
484
- border: 1px solid #999696;
485
- width: 16px;
486
- height: 16px;
487
- top: 3px;
488
- transition: all 0.2s ease;
489
- cursor: pointer;
490
- }
491
-
492
- .qbs-autocomplete-checkbox input ~ label svg {
493
- opacity: 0;
494
- transition: all 0.2s ease;
495
- position: absolute;
496
- left: 3px;
497
- top: 3px;
498
- width: 9px;
499
- height: 9px;
500
- }
501
-
502
- .qbs-autocomplete-checkbox input:checked ~ label {
503
- transition: all 0.2s ease;
504
- border-radius: 3px;
505
- background: #e76458;
506
- border-color: #e76458;
507
- }
508
- .qbs-autocomplete-checkbox input:checked ~ label svg {
509
- opacity: 1;
510
- transition: all 0.2s ease;
511
- }
512
-
513
- .action_label {
514
- font-size: 14px;
515
- color: #4c7ad6;
516
- }
517
- /* Tooltip.css */
518
- /* .tooltip-wrapper {
519
- position: relative;
520
- display: inline-block;
521
- }
522
-
523
- .tooltip-content {
524
- visibility: hidden;
525
- width: max-content;
526
- background-color: black;
527
- color: white;
528
- text-align: center;
529
- max-width: 150px;
530
- padding: 5px 10px;
531
- border-radius: 6px;
532
- position: absolute;
533
- z-index: 1;
534
- bottom: 125%;
535
- left: 50%;
536
- transform: translateX(-50%);
537
- transition: visibility 0.2s ease-in-out;
538
- }
539
-
540
- .tooltip-content::after {
541
- content: '';
542
- position: absolute;
543
- top: 100%;
544
- left: 50%;
545
- margin-left: -5px;
546
- border-width: 5px;
547
- border-style: solid;
548
- border-color: black transparent transparent transparent;
549
- }
550
-
551
- .tooltip-wrapper:hover .tooltip-content {
552
- visibility: visible;
553
- } */
554
- .qbs-table-tooltip {
555
- position: relative;
556
- display: contents;
557
- cursor: pointer;
558
- }
559
-
560
- .qbs-table-tooltip .tooltiptext,
561
- .tooltiptext {
562
- visibility: hidden;
563
- background-color: #000;
564
- color: #fff;
565
- text-align: center;
566
- padding: 6px;
567
- border-radius: 4px;
568
- position: absolute;
569
- z-index: 9999;
570
- opacity: 0;
571
- transition: opacity 0.3s;
572
- font-size: 14px;
573
- font-style: normal;
574
- font-weight: 400;
575
- line-height: 16px;
576
- max-width: 300px;
577
- }
578
-
579
- .qbs-table-tooltip.up .tooltiptext {
580
- bottom: 125%;
581
- left: 0%;
582
- }
583
-
584
- .qbs-table-tooltip.down .tooltiptext {
585
- top: 125%;
586
- right: 0px;
587
- left: auto;
588
- }
589
-
590
- .qbs-table-tooltip:hover .tooltiptext {
591
- visibility: visible;
592
- opacity: 1;
593
- }
594
-
595
- .qbs-table-tooltip .tooltiptext::after,
596
- .tooltiptext::after {
597
- content: '';
598
- position: absolute;
599
- border-width: 5px;
600
- border-style: solid;
601
- }
602
-
603
- .qbs-table-tooltip.up .tooltiptext::after,
604
- .up.tooltiptext::after {
605
- top: 100%;
606
- left: 50%;
607
- margin-left: -5px;
608
- border-color: #000 transparent transparent transparent;
609
- }
610
-
611
- .qbs-table-tooltip.down .tooltiptext::after,
612
- .down.tooltiptext::after {
613
- bottom: 100%;
614
- left: 50%;
615
- margin-left: -5px;
616
- border-color: transparent transparent #000 transparent;
617
- }
@@ -1,128 +0,0 @@
1
- .qbs-flex {
2
- display: flex;
3
- }
4
- .qbs-flex-wrap {
5
- flex-wrap: wrap;
6
- }
7
- .qbs-w-full {
8
- width: 100%;
9
- }
10
- .qbs-mb-2 {
11
- margin-bottom: 0.5rem;
12
- }
13
- .-qbs-mt-2 {
14
- margin-top: -0.5rem;
15
- }
16
- .qbs-flex-1 {
17
- flex: 1 1 0%;
18
- }
19
- .qbs-inline-block {
20
- display: inline-block;
21
- }
22
- .qbs-text-sm {
23
- font-size: 0.875rem;
24
- }
25
- .qbs-cursor-pointer {
26
- cursor: pointer;
27
- }
28
- .qbs-text-center {
29
- text-align: center;
30
- }
31
- .qbs-p-1 {
32
- padding: 0.25rem;
33
- }
34
- .qbs-border-b-2 {
35
- border-bottom-width: 2px;
36
- }
37
- .qbs-tab-item {
38
- color: #4b5563;
39
- border-color: #d1d5db;
40
- }
41
- .qbs-tab-item:hover {
42
- color: #2563eb;
43
- }
44
- .qbs-tab-active-item {
45
- color: #2563eb;
46
- border-color: #2563eb;
47
- }
48
- .qbs-relative {
49
- position: relative;
50
- }
51
- .qbs-gap-1 {
52
- gap: 0.25rem;
53
- }
54
- .qbs-rounded-full {
55
- border-radius: 9999px;
56
- }
57
- .qbs-text-xs {
58
- font-size: 0.75rem;
59
- }
60
- .qbs-inline-flex {
61
- display: inline-flex;
62
- }
63
- .qbs-items-center {
64
- align-items: center;
65
- }
66
- .qbs-justify-center {
67
- justify-content: center;
68
- }
69
- .qbs-px-2 {
70
- padding-left: 0.5rem;
71
- padding-right: 0.5rem;
72
- }
73
- .qbs-py-1 {
74
- padding-top: 0.25rem;
75
- padding-bottom: 0.25rem;
76
- }
77
- .qbs-leading-none {
78
- line-height: 1;
79
- }
80
- .qbs-min-w-6 {
81
- min-width: 1.5rem;
82
- }
83
- .qbs-min-h-6 {
84
- min-height: 1.5rem;
85
- }
86
- .qbs-align-middle {
87
- vertical-align: middle;
88
- }
89
- .qbs-min-emp-h {
90
- min-height: 183px;
91
- padding-top: 80px;
92
- padding-bottom: 80px;
93
- }
94
- .qbs-flex-grow {
95
- flex-grow: 1;
96
- }
97
- .qbs-text-right {
98
- text-align: right;
99
- }
100
- .qbs-readmore-collapse {
101
- cursor: pointer;
102
- width: 100%;
103
- text-align: center;
104
- display: flex;
105
- justify-content: center;
106
- margin-top: 5px;
107
- }
108
- .qbs-readmore-collapse div {
109
- border-radius: 9999px;
110
- min-width: 1.5rem;
111
- min-height: 1.5rem;
112
- padding: 5px;
113
- }
114
- .qbs-more-collapse:hover {
115
- background-color: #d1d5db;
116
- }
117
- .qbs-hidden {
118
- display: none;
119
- }
120
- .qbs-autocomplete-selected-suggestions .qbs-autocomplete-suggestions-sub {
121
- min-height: 184px;
122
- }
123
- .selected-items-outer-container {
124
- display: flex;
125
- gap: 5px;
126
- flex-wrap: wrap;
127
- overflow-x: auto;
128
- }