react-core-ts 1.1.21 → 1.1.22

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