@machinerd/js-module 0.2.3 → 0.3.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.
@@ -1,19 +1,25 @@
1
- /*! tailwindcss v4.1.18 | MIT License | https://tailwindcss.com */
1
+ /*! tailwindcss v4.2.0 | MIT License | https://tailwindcss.com */
2
2
  @layer properties;
3
3
  @layer theme, base, components, utilities;
4
4
  @layer theme {
5
5
  :root, :host {
6
- --komc-color-red-500: oklch(63.7% 0.237 25.331);
6
+ --komc-color-sky-950: #006699;
7
7
  --komc-color-blue-500: oklch(62.3% 0.214 259.815);
8
- --komc-color-blue-600: oklch(54.6% 0.245 262.881);
8
+ --komc-color-indigo-600: oklch(51.1% 0.262 276.966);
9
+ --komc-color-indigo-700: oklch(45.7% 0.24 277.023);
10
+ --komc-color-gray-50: #fafafa;
9
11
  --komc-color-gray-100: oklch(96.7% 0.003 264.542);
10
- --komc-color-gray-200: oklch(92.8% 0.006 264.531);
12
+ --komc-color-gray-200: #f5f5f5;
13
+ --komc-color-gray-300: oklch(87.2% 0.01 258.338);
14
+ --komc-color-gray-500: #e5e5e5;
15
+ --komc-color-gray-600: oklch(44.6% 0.03 256.802);
16
+ --komc-color-gray-700: #cccccc;
17
+ --komc-color-gray-800: #808080;
11
18
  --komc-color-neutral-50: oklch(98.5% 0 0);
12
19
  --komc-color-neutral-100: oklch(97% 0 0);
13
20
  --komc-color-neutral-200: oklch(92.2% 0 0);
14
21
  --komc-color-neutral-300: oklch(87% 0 0);
15
22
  --komc-color-neutral-400: oklch(70.8% 0 0);
16
- --komc-color-neutral-900: oklch(20.5% 0 0);
17
23
  --komc-color-black: #000;
18
24
  --komc-color-white: #fff;
19
25
  --komc-spacing: 0.25rem;
@@ -36,9 +42,19 @@
36
42
  --komc-radius-xl: 0.75rem;
37
43
  --komc-radius-2xl: 1rem;
38
44
  --komc-radius-3xl: 1.5rem;
45
+ --komc-drop-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.15);
46
+ --komc-drop-shadow-md: 0 3px 3px rgb(0 0 0 / 0.12);
47
+ --komc-drop-shadow-lg: 0 4px 4px rgb(0 0 0 / 0.15);
48
+ --komc-drop-shadow-xl: 0 9px 7px rgb(0 0 0 / 0.1);
49
+ --komc-drop-shadow-2xl: 0 25px 25px rgb(0 0 0 / 0.15);
39
50
  --komc-animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
40
51
  --komc-default-transition-duration: 150ms;
41
52
  --komc-default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
53
+ --komc-color-night-700: #2c5cb7;
54
+ --komc-color-night-800: #22488e;
55
+ --komc-color-sky-450: #3aacd5;
56
+ --komc-color-sky-650: #0099cc;
57
+ --komc-color-sky-750: #0083b2;
42
58
  }
43
59
  }
44
60
  @layer utilities {
@@ -51,6 +67,9 @@
51
67
  .komc\:absolute {
52
68
  position: absolute;
53
69
  }
70
+ .komc\:fixed {
71
+ position: fixed;
72
+ }
54
73
  .komc\:relative {
55
74
  position: relative;
56
75
  }
@@ -61,7 +80,7 @@
61
80
  top: calc(var(--komc-spacing) * 0);
62
81
  }
63
82
  .komc\:top-1\/2 {
64
- top: calc(1/2 * 100%);
83
+ top: calc(1 / 2 * 100%);
65
84
  }
66
85
  .komc\:top-3 {
67
86
  top: calc(var(--komc-spacing) * 3);
@@ -91,7 +110,7 @@
91
110
  left: calc(var(--komc-spacing) * 0);
92
111
  }
93
112
  .komc\:left-1\/2 {
94
- left: calc(1/2 * 100%);
113
+ left: calc(1 / 2 * 100%);
95
114
  }
96
115
  .komc\:left-5 {
97
116
  left: calc(var(--komc-spacing) * 5);
@@ -111,9 +130,6 @@
111
130
  .komc\:mx-auto {
112
131
  margin-inline: auto;
113
132
  }
114
- .komc\:my-0 {
115
- margin-block: calc(var(--komc-spacing) * 0);
116
- }
117
133
  .komc\:-mt-1 {
118
134
  margin-top: calc(var(--komc-spacing) * -1);
119
135
  }
@@ -180,6 +196,9 @@
180
196
  .komc\:h-14 {
181
197
  height: calc(var(--komc-spacing) * 14);
182
198
  }
199
+ .komc\:h-15 {
200
+ height: calc(var(--komc-spacing) * 15);
201
+ }
183
202
  .komc\:h-16 {
184
203
  height: calc(var(--komc-spacing) * 16);
185
204
  }
@@ -222,15 +241,15 @@
222
241
  .komc\:h-full {
223
242
  height: 100%;
224
243
  }
225
- .komc\:h-screen {
226
- height: 100vh;
227
- }
228
244
  .komc\:min-h-10 {
229
245
  min-height: calc(var(--komc-spacing) * 10);
230
246
  }
231
247
  .komc\:min-h-15 {
232
248
  min-height: calc(var(--komc-spacing) * 15);
233
249
  }
250
+ .komc\:min-h-400 {
251
+ min-height: calc(var(--komc-spacing) * 400);
252
+ }
234
253
  .komc\:w-2 {
235
254
  width: calc(var(--komc-spacing) * 2);
236
255
  }
@@ -288,15 +307,9 @@
288
307
  .komc\:min-w-0 {
289
308
  min-width: calc(var(--komc-spacing) * 0);
290
309
  }
291
- .komc\:flex-1 {
292
- flex: 1;
293
- }
294
310
  .komc\:shrink-0 {
295
311
  flex-shrink: 0;
296
312
  }
297
- .komc\:grow {
298
- flex-grow: 1;
299
- }
300
313
  .komc\:grow-0 {
301
314
  flex-grow: 0;
302
315
  }
@@ -304,7 +317,7 @@
304
317
  flex-basis: 100%;
305
318
  }
306
319
  .komc\:-translate-x-1\/2 {
307
- --tw-translate-x: calc(calc(1/2 * 100%) * -1);
320
+ --tw-translate-x: calc(calc(1 / 2 * 100%) * -1);
308
321
  translate: var(--tw-translate-x) var(--tw-translate-y);
309
322
  }
310
323
  .komc\:-translate-x-2 {
@@ -316,7 +329,7 @@
316
329
  translate: var(--tw-translate-x) var(--tw-translate-y);
317
330
  }
318
331
  .komc\:-translate-y-1\/2 {
319
- --tw-translate-y: calc(calc(1/2 * 100%) * -1);
332
+ --tw-translate-y: calc(calc(1 / 2 * 100%) * -1);
320
333
  translate: var(--tw-translate-x) var(--tw-translate-y);
321
334
  }
322
335
  .komc\:-translate-y-2 {
@@ -336,6 +349,9 @@
336
349
  .komc\:grid-cols-4 {
337
350
  grid-template-columns: repeat(4, minmax(0, 1fr));
338
351
  }
352
+ .komc\:grid-cols-5 {
353
+ grid-template-columns: repeat(5, minmax(0, 1fr));
354
+ }
339
355
  .komc\:flex-col {
340
356
  flex-direction: column;
341
357
  }
@@ -366,6 +382,9 @@
366
382
  .komc\:gap-5 {
367
383
  gap: calc(var(--komc-spacing) * 5);
368
384
  }
385
+ .komc\:gap-x-2 {
386
+ column-gap: calc(var(--komc-spacing) * 2);
387
+ }
369
388
  .komc\:overflow-hidden {
370
389
  overflow: hidden;
371
390
  }
@@ -375,9 +394,6 @@
375
394
  .komc\:rounded-3xl {
376
395
  border-radius: var(--komc-radius-3xl);
377
396
  }
378
- .komc\:rounded-\[20px\] {
379
- border-radius: 20px;
380
- }
381
397
  .komc\:rounded-full {
382
398
  border-radius: calc(infinity * 1px);
383
399
  }
@@ -419,29 +435,23 @@
419
435
  .komc\:border-black {
420
436
  border-color: var(--komc-color-black);
421
437
  }
438
+ .komc\:border-blue-500 {
439
+ border-color: var(--komc-color-blue-500);
440
+ }
441
+ .komc\:border-gray-600 {
442
+ border-color: var(--komc-color-gray-600);
443
+ }
444
+ .komc\:border-gray-800 {
445
+ border-color: var(--komc-color-gray-800);
446
+ }
422
447
  .komc\:border-neutral-200 {
423
448
  border-color: var(--komc-color-neutral-200);
424
449
  }
425
- .komc\:border-red-500 {
426
- border-color: var(--komc-color-red-500);
427
- }
428
450
  .komc\:border-transparent {
429
451
  border-color: transparent;
430
452
  }
431
- .komc\:bg-\[\#2c5cb7\] {
432
- background-color: #2c5cb7;
433
- }
434
- .komc\:bg-\[\#4A5565\] {
435
- background-color: #4A5565;
436
- }
437
- .komc\:bg-\[\#36454F\] {
438
- background-color: #36454F;
439
- }
440
- .komc\:bg-\[\#C8313A\] {
441
- background-color: #C8313A;
442
- }
443
- .komc\:bg-\[\#E7FF14\] {
444
- background-color: #E7FF14;
453
+ .komc\:border-white {
454
+ border-color: var(--komc-color-white);
445
455
  }
446
456
  .komc\:bg-\[rgb\(95\,95\,96\)\] {
447
457
  background-color: rgb(95,95,96);
@@ -455,20 +465,29 @@
455
465
  .komc\:bg-gray-200 {
456
466
  background-color: var(--komc-color-gray-200);
457
467
  }
468
+ .komc\:bg-gray-300 {
469
+ background-color: var(--komc-color-gray-300);
470
+ }
471
+ .komc\:bg-indigo-600 {
472
+ background-color: var(--komc-color-indigo-600);
473
+ }
458
474
  .komc\:bg-inherit {
459
475
  background-color: inherit;
460
476
  }
461
477
  .komc\:bg-neutral-100 {
462
478
  background-color: var(--komc-color-neutral-100);
463
479
  }
464
- .komc\:bg-neutral-200 {
465
- background-color: var(--komc-color-neutral-200);
480
+ .komc\:bg-neutral-400 {
481
+ background-color: var(--komc-color-neutral-400);
466
482
  }
467
- .komc\:bg-neutral-300 {
468
- background-color: var(--komc-color-neutral-300);
483
+ .komc\:bg-night-700 {
484
+ background-color: var(--komc-color-night-700);
469
485
  }
470
- .komc\:bg-neutral-400\! {
471
- background-color: var(--komc-color-neutral-400) !important;
486
+ .komc\:bg-sky-450 {
487
+ background-color: var(--komc-color-sky-450);
488
+ }
489
+ .komc\:bg-sky-750 {
490
+ background-color: var(--komc-color-sky-750);
472
491
  }
473
492
  .komc\:bg-transparent {
474
493
  background-color: transparent;
@@ -485,9 +504,36 @@
485
504
  .komc\:p-4 {
486
505
  padding: calc(var(--komc-spacing) * 4);
487
506
  }
507
+ .komc\:p-40 {
508
+ padding: calc(var(--komc-spacing) * 40);
509
+ }
510
+ .komc\:px-0 {
511
+ padding-inline: calc(var(--komc-spacing) * 0);
512
+ }
513
+ .komc\:px-0\.5 {
514
+ padding-inline: calc(var(--komc-spacing) * 0.5);
515
+ }
516
+ .komc\:px-1 {
517
+ padding-inline: calc(var(--komc-spacing) * 1);
518
+ }
519
+ .komc\:px-1\.5 {
520
+ padding-inline: calc(var(--komc-spacing) * 1.5);
521
+ }
488
522
  .komc\:px-2 {
489
523
  padding-inline: calc(var(--komc-spacing) * 2);
490
524
  }
525
+ .komc\:px-3 {
526
+ padding-inline: calc(var(--komc-spacing) * 3);
527
+ }
528
+ .komc\:px-4 {
529
+ padding-inline: calc(var(--komc-spacing) * 4);
530
+ }
531
+ .komc\:px-5 {
532
+ padding-inline: calc(var(--komc-spacing) * 5);
533
+ }
534
+ .komc\:px-6 {
535
+ padding-inline: calc(var(--komc-spacing) * 6);
536
+ }
491
537
  .komc\:pt-4 {
492
538
  padding-top: calc(var(--komc-spacing) * 4);
493
539
  }
@@ -501,14 +547,17 @@
501
547
  .komc\:break-all {
502
548
  word-break: break-all;
503
549
  }
504
- .komc\:whitespace-nowrap {
505
- white-space: nowrap;
550
+ .komc\:text-\[\#1890FF\] {
551
+ color: #1890FF;
506
552
  }
507
553
  .komc\:text-black {
508
554
  color: var(--komc-color-black);
509
555
  }
510
- .komc\:text-neutral-900 {
511
- color: var(--komc-color-neutral-900);
556
+ .komc\:text-blue-500 {
557
+ color: var(--komc-color-blue-500);
558
+ }
559
+ .komc\:text-gray-800 {
560
+ color: var(--komc-color-gray-800);
512
561
  }
513
562
  .komc\:text-white {
514
563
  color: var(--komc-color-white);
@@ -519,11 +568,36 @@
519
568
  .komc\:opacity-100 {
520
569
  opacity: 100%;
521
570
  }
571
+ .komc\:drop-shadow-2xl {
572
+ --tw-drop-shadow-size: drop-shadow(0 25px 25px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
573
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-2xl));
574
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
575
+ }
522
576
  .komc\:drop-shadow-\[0px_0\.5px_3px_rgba\(0\,0\,0\,0\.2\)\] {
523
577
  --tw-drop-shadow-size: drop-shadow(0px 0.5px 3px var(--tw-drop-shadow-color, rgba(0,0,0,0.2)));
524
578
  --tw-drop-shadow: var(--tw-drop-shadow-size);
525
579
  filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
526
580
  }
581
+ .komc\:drop-shadow-lg {
582
+ --tw-drop-shadow-size: drop-shadow(0 4px 4px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
583
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-lg));
584
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
585
+ }
586
+ .komc\:drop-shadow-md {
587
+ --tw-drop-shadow-size: drop-shadow(0 3px 3px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.12)));
588
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-md));
589
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
590
+ }
591
+ .komc\:drop-shadow-sm {
592
+ --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
593
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-sm));
594
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
595
+ }
596
+ .komc\:drop-shadow-xl {
597
+ --tw-drop-shadow-size: drop-shadow(0 9px 7px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.1)));
598
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-xl));
599
+ filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
600
+ }
527
601
  .komc\:transition-all {
528
602
  transition-property: all;
529
603
  transition-timing-function: var(--tw-ease, var(--komc-default-transition-timing-function));
@@ -551,86 +625,129 @@
551
625
  --tw-outline-style: none;
552
626
  outline-style: none;
553
627
  }
554
- .komc\:\*\:transition-colors {
555
- :is(& > *) {
556
- transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
557
- transition-timing-function: var(--tw-ease, var(--komc-default-transition-timing-function));
558
- transition-duration: var(--tw-duration, var(--komc-default-transition-duration));
628
+ .komc\:hover\:border-transparent {
629
+ &:hover {
630
+ @media (hover: hover) {
631
+ border-color: transparent;
632
+ }
559
633
  }
560
634
  }
561
- .komc\:\*\:duration-200 {
562
- :is(& > *) {
563
- --tw-duration: 200ms;
564
- transition-duration: 200ms;
635
+ .komc\:hover\:bg-\[rgb\(76\,76\,77\)\] {
636
+ &:hover {
637
+ @media (hover: hover) {
638
+ background-color: rgb(76,76,77);
639
+ }
565
640
  }
566
641
  }
567
- .komc\:hover\:bg-\[\#2E3A43\] {
642
+ .komc\:hover\:bg-\[rgb\(199\,199\,199\)\] {
568
643
  &:hover {
569
644
  @media (hover: hover) {
570
- background-color: #2E3A43;
645
+ background-color: rgb(199,199,199);
571
646
  }
572
647
  }
573
648
  }
574
- .komc\:hover\:bg-\[\#424A57\] {
649
+ .komc\:hover\:bg-blue-500 {
575
650
  &:hover {
576
651
  @media (hover: hover) {
577
- background-color: #424A57;
652
+ background-color: var(--komc-color-blue-500);
578
653
  }
579
654
  }
580
655
  }
581
- .komc\:hover\:bg-\[\#26539F\] {
656
+ .komc\:hover\:bg-gray-200 {
582
657
  &:hover {
583
658
  @media (hover: hover) {
584
- background-color: #26539F;
659
+ background-color: var(--komc-color-gray-200);
585
660
  }
586
661
  }
587
662
  }
588
- .komc\:hover\:bg-\[\#B02B33\] {
663
+ .komc\:hover\:bg-indigo-700 {
589
664
  &:hover {
590
665
  @media (hover: hover) {
591
- background-color: #B02B33;
666
+ background-color: var(--komc-color-indigo-700);
592
667
  }
593
668
  }
594
669
  }
595
- .komc\:hover\:bg-\[\#D4E600\] {
670
+ .komc\:hover\:bg-neutral-50 {
596
671
  &:hover {
597
672
  @media (hover: hover) {
598
- background-color: #D4E600;
673
+ background-color: var(--komc-color-neutral-50);
599
674
  }
600
675
  }
601
676
  }
602
- .komc\:hover\:bg-\[rgb\(76\,76\,77\)\] {
677
+ .komc\:hover\:bg-neutral-200 {
603
678
  &:hover {
604
679
  @media (hover: hover) {
605
- background-color: rgb(76,76,77);
680
+ background-color: var(--komc-color-neutral-200);
606
681
  }
607
682
  }
608
683
  }
609
- .komc\:hover\:bg-blue-600 {
684
+ .komc\:hover\:bg-night-700 {
610
685
  &:hover {
611
686
  @media (hover: hover) {
612
- background-color: var(--komc-color-blue-600);
687
+ background-color: var(--komc-color-night-700);
613
688
  }
614
689
  }
615
690
  }
616
- .komc\:hover\:bg-neutral-50 {
691
+ .komc\:hover\:bg-night-800 {
617
692
  &:hover {
618
693
  @media (hover: hover) {
619
- background-color: var(--komc-color-neutral-50);
694
+ background-color: var(--komc-color-night-800);
620
695
  }
621
696
  }
622
697
  }
623
- .komc\:hover\:bg-neutral-100 {
698
+ .komc\:hover\:bg-sky-650 {
624
699
  &:hover {
625
700
  @media (hover: hover) {
626
- background-color: var(--komc-color-neutral-100);
701
+ background-color: var(--komc-color-sky-650);
627
702
  }
628
703
  }
629
704
  }
630
- .komc\:hover\:bg-neutral-200 {
705
+ .komc\:hover\:bg-sky-950 {
631
706
  &:hover {
632
707
  @media (hover: hover) {
633
- background-color: var(--komc-color-neutral-200);
708
+ background-color: var(--komc-color-sky-950);
709
+ }
710
+ }
711
+ }
712
+ .komc\:hover\:bg-transparent {
713
+ &:hover {
714
+ @media (hover: hover) {
715
+ background-color: transparent;
716
+ }
717
+ }
718
+ }
719
+ .komc\:hover\:text-\[\#1890FF\] {
720
+ &:hover {
721
+ @media (hover: hover) {
722
+ color: #1890FF;
723
+ }
724
+ }
725
+ }
726
+ .komc\:hover\:text-black {
727
+ &:hover {
728
+ @media (hover: hover) {
729
+ color: var(--komc-color-black);
730
+ }
731
+ }
732
+ }
733
+ .komc\:hover\:text-gray-800 {
734
+ &:hover {
735
+ @media (hover: hover) {
736
+ color: var(--komc-color-gray-800);
737
+ }
738
+ }
739
+ }
740
+ .komc\:hover\:text-white {
741
+ &:hover {
742
+ @media (hover: hover) {
743
+ color: var(--komc-color-white);
744
+ }
745
+ }
746
+ }
747
+ .komc\:hover\:underline {
748
+ &:hover {
749
+ @media (hover: hover) {
750
+ text-decoration-line: underline;
634
751
  }
635
752
  }
636
753
  }
@@ -639,14 +756,84 @@
639
756
  border-color: var(--komc-color-neutral-300);
640
757
  }
641
758
  }
759
+ .komc\:active\:border-transparent {
760
+ &:active {
761
+ border-color: transparent;
762
+ }
763
+ }
642
764
  .komc\:active\:bg-\[rgb\(76\,76\,77\)\] {
643
765
  &:active {
644
766
  background-color: rgb(76,76,77);
645
767
  }
646
768
  }
647
- .komc\:disabled\:pointer-events-none {
648
- &:disabled {
649
- pointer-events: none;
769
+ .komc\:active\:bg-\[rgb\(199\,199\,199\)\] {
770
+ &:active {
771
+ background-color: rgb(199,199,199);
772
+ }
773
+ }
774
+ .komc\:active\:bg-blue-500 {
775
+ &:active {
776
+ background-color: var(--komc-color-blue-500);
777
+ }
778
+ }
779
+ .komc\:active\:bg-gray-200 {
780
+ &:active {
781
+ background-color: var(--komc-color-gray-200);
782
+ }
783
+ }
784
+ .komc\:active\:bg-indigo-700 {
785
+ &:active {
786
+ background-color: var(--komc-color-indigo-700);
787
+ }
788
+ }
789
+ .komc\:active\:bg-night-700 {
790
+ &:active {
791
+ background-color: var(--komc-color-night-700);
792
+ }
793
+ }
794
+ .komc\:active\:bg-night-800 {
795
+ &:active {
796
+ background-color: var(--komc-color-night-800);
797
+ }
798
+ }
799
+ .komc\:active\:bg-sky-650 {
800
+ &:active {
801
+ background-color: var(--komc-color-sky-650);
802
+ }
803
+ }
804
+ .komc\:active\:bg-sky-950 {
805
+ &:active {
806
+ background-color: var(--komc-color-sky-950);
807
+ }
808
+ }
809
+ .komc\:active\:bg-transparent {
810
+ &:active {
811
+ background-color: transparent;
812
+ }
813
+ }
814
+ .komc\:active\:text-\[\#1890FF\] {
815
+ &:active {
816
+ color: #1890FF;
817
+ }
818
+ }
819
+ .komc\:active\:text-black {
820
+ &:active {
821
+ color: var(--komc-color-black);
822
+ }
823
+ }
824
+ .komc\:active\:text-gray-800 {
825
+ &:active {
826
+ color: var(--komc-color-gray-800);
827
+ }
828
+ }
829
+ .komc\:active\:text-white {
830
+ &:active {
831
+ color: var(--komc-color-white);
832
+ }
833
+ }
834
+ .komc\:active\:underline {
835
+ &:active {
836
+ text-decoration-line: underline;
650
837
  }
651
838
  }
652
839
  .komc\:disabled\:cursor-default {
@@ -654,14 +841,49 @@
654
841
  cursor: default;
655
842
  }
656
843
  }
657
- .komc\:disabled\:opacity-50 {
844
+ .komc\:disabled\:border-gray-500 {
658
845
  &:disabled {
659
- opacity: 50%;
846
+ border-color: var(--komc-color-gray-500);
660
847
  }
661
848
  }
662
- .komc\:xl\:max-w-full {
663
- @media (width >= 80rem) {
664
- max-width: 100%;
849
+ .komc\:disabled\:border-transparent {
850
+ &:disabled {
851
+ border-color: transparent;
852
+ }
853
+ }
854
+ .komc\:disabled\:border-white {
855
+ &:disabled {
856
+ border-color: var(--komc-color-white);
857
+ }
858
+ }
859
+ .komc\:disabled\:bg-gray-50 {
860
+ &:disabled {
861
+ background-color: var(--komc-color-gray-50);
862
+ }
863
+ }
864
+ .komc\:disabled\:bg-gray-700 {
865
+ &:disabled {
866
+ background-color: var(--komc-color-gray-700);
867
+ }
868
+ }
869
+ .komc\:disabled\:bg-transparent {
870
+ &:disabled {
871
+ background-color: transparent;
872
+ }
873
+ }
874
+ .komc\:disabled\:bg-white {
875
+ &:disabled {
876
+ background-color: var(--komc-color-white);
877
+ }
878
+ }
879
+ .komc\:disabled\:text-gray-500 {
880
+ &:disabled {
881
+ color: var(--komc-color-gray-500);
882
+ }
883
+ }
884
+ .komc\:disabled\:text-gray-800 {
885
+ &:disabled {
886
+ color: var(--komc-color-gray-800);
665
887
  }
666
888
  }
667
889
  .komc\:xl\:p-10 {
@@ -669,6 +891,19 @@
669
891
  padding: calc(var(--komc-spacing) * 10);
670
892
  }
671
893
  }
894
+ .komc\:\[\&_svg\]\:transition-colors {
895
+ & svg {
896
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
897
+ transition-timing-function: var(--tw-ease, var(--komc-default-transition-timing-function));
898
+ transition-duration: var(--tw-duration, var(--komc-default-transition-duration));
899
+ }
900
+ }
901
+ .komc\:\[\&_svg\]\:duration-200 {
902
+ & svg {
903
+ --tw-duration: 200ms;
904
+ transition-duration: 200ms;
905
+ }
906
+ }
672
907
  .komc\:\[\&\>input\]\:h-full {
673
908
  &>input {
674
909
  height: 100%;