@machinerd/js-module 0.2.4 → 0.3.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.
@@ -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 {
@@ -64,7 +80,7 @@
64
80
  top: calc(var(--komc-spacing) * 0);
65
81
  }
66
82
  .komc\:top-1\/2 {
67
- top: calc(1/2 * 100%);
83
+ top: calc(1 / 2 * 100%);
68
84
  }
69
85
  .komc\:top-3 {
70
86
  top: calc(var(--komc-spacing) * 3);
@@ -94,7 +110,7 @@
94
110
  left: calc(var(--komc-spacing) * 0);
95
111
  }
96
112
  .komc\:left-1\/2 {
97
- left: calc(1/2 * 100%);
113
+ left: calc(1 / 2 * 100%);
98
114
  }
99
115
  .komc\:left-5 {
100
116
  left: calc(var(--komc-spacing) * 5);
@@ -114,9 +130,6 @@
114
130
  .komc\:mx-auto {
115
131
  margin-inline: auto;
116
132
  }
117
- .komc\:my-0 {
118
- margin-block: calc(var(--komc-spacing) * 0);
119
- }
120
133
  .komc\:-mt-1 {
121
134
  margin-top: calc(var(--komc-spacing) * -1);
122
135
  }
@@ -183,6 +196,9 @@
183
196
  .komc\:h-14 {
184
197
  height: calc(var(--komc-spacing) * 14);
185
198
  }
199
+ .komc\:h-15 {
200
+ height: calc(var(--komc-spacing) * 15);
201
+ }
186
202
  .komc\:h-16 {
187
203
  height: calc(var(--komc-spacing) * 16);
188
204
  }
@@ -225,15 +241,15 @@
225
241
  .komc\:h-full {
226
242
  height: 100%;
227
243
  }
228
- .komc\:h-screen {
229
- height: 100vh;
230
- }
231
244
  .komc\:min-h-10 {
232
245
  min-height: calc(var(--komc-spacing) * 10);
233
246
  }
234
247
  .komc\:min-h-15 {
235
248
  min-height: calc(var(--komc-spacing) * 15);
236
249
  }
250
+ .komc\:min-h-400 {
251
+ min-height: calc(var(--komc-spacing) * 400);
252
+ }
237
253
  .komc\:w-2 {
238
254
  width: calc(var(--komc-spacing) * 2);
239
255
  }
@@ -294,9 +310,6 @@
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,29 @@
419
435
  .komc\:border-black {
420
436
  border-color: var(--komc-color-black);
421
437
  }
422
- .komc\:border-neutral-200 {
423
- border-color: var(--komc-color-neutral-200);
438
+ .komc\:border-blue-500 {
439
+ border-color: var(--komc-color-blue-500);
424
440
  }
425
- .komc\:border-red-500 {
426
- border-color: var(--komc-color-red-500);
441
+ .komc\:border-gray-600 {
442
+ border-color: var(--komc-color-gray-600);
427
443
  }
428
- .komc\:border-transparent {
429
- border-color: transparent;
444
+ .komc\:border-gray-800 {
445
+ border-color: var(--komc-color-gray-800);
430
446
  }
431
- .komc\:bg-\[\#2c5cb7\] {
432
- background-color: #2c5cb7;
447
+ .komc\:border-neutral-200 {
448
+ border-color: var(--komc-color-neutral-200);
433
449
  }
434
- .komc\:bg-\[\#4A5565\] {
435
- background-color: #4A5565;
450
+ .komc\:border-sky-450 {
451
+ border-color: var(--komc-color-sky-450);
436
452
  }
437
- .komc\:bg-\[\#36454F\] {
438
- background-color: #36454F;
453
+ .komc\:border-sky-750 {
454
+ border-color: var(--komc-color-sky-750);
439
455
  }
440
- .komc\:bg-\[\#C8313A\] {
441
- background-color: #C8313A;
456
+ .komc\:border-transparent {
457
+ border-color: transparent;
442
458
  }
443
- .komc\:bg-\[\#E7FF14\] {
444
- background-color: #E7FF14;
459
+ .komc\:border-white {
460
+ border-color: var(--komc-color-white);
445
461
  }
446
462
  .komc\:bg-\[rgb\(95\,95\,96\)\] {
447
463
  background-color: rgb(95,95,96);
@@ -455,20 +471,29 @@
455
471
  .komc\:bg-gray-200 {
456
472
  background-color: var(--komc-color-gray-200);
457
473
  }
474
+ .komc\:bg-gray-300 {
475
+ background-color: var(--komc-color-gray-300);
476
+ }
477
+ .komc\:bg-indigo-600 {
478
+ background-color: var(--komc-color-indigo-600);
479
+ }
458
480
  .komc\:bg-inherit {
459
481
  background-color: inherit;
460
482
  }
461
483
  .komc\:bg-neutral-100 {
462
484
  background-color: var(--komc-color-neutral-100);
463
485
  }
464
- .komc\:bg-neutral-200 {
465
- background-color: var(--komc-color-neutral-200);
486
+ .komc\:bg-neutral-400 {
487
+ background-color: var(--komc-color-neutral-400);
466
488
  }
467
- .komc\:bg-neutral-300 {
468
- background-color: var(--komc-color-neutral-300);
489
+ .komc\:bg-night-700 {
490
+ background-color: var(--komc-color-night-700);
469
491
  }
470
- .komc\:bg-neutral-400\! {
471
- background-color: var(--komc-color-neutral-400) !important;
492
+ .komc\:bg-sky-450 {
493
+ background-color: var(--komc-color-sky-450);
494
+ }
495
+ .komc\:bg-sky-750 {
496
+ background-color: var(--komc-color-sky-750);
472
497
  }
473
498
  .komc\:bg-transparent {
474
499
  background-color: transparent;
@@ -485,9 +510,36 @@
485
510
  .komc\:p-4 {
486
511
  padding: calc(var(--komc-spacing) * 4);
487
512
  }
513
+ .komc\:p-40 {
514
+ padding: calc(var(--komc-spacing) * 40);
515
+ }
516
+ .komc\:px-0 {
517
+ padding-inline: calc(var(--komc-spacing) * 0);
518
+ }
519
+ .komc\:px-0\.5 {
520
+ padding-inline: calc(var(--komc-spacing) * 0.5);
521
+ }
522
+ .komc\:px-1 {
523
+ padding-inline: calc(var(--komc-spacing) * 1);
524
+ }
525
+ .komc\:px-1\.5 {
526
+ padding-inline: calc(var(--komc-spacing) * 1.5);
527
+ }
488
528
  .komc\:px-2 {
489
529
  padding-inline: calc(var(--komc-spacing) * 2);
490
530
  }
531
+ .komc\:px-3 {
532
+ padding-inline: calc(var(--komc-spacing) * 3);
533
+ }
534
+ .komc\:px-4 {
535
+ padding-inline: calc(var(--komc-spacing) * 4);
536
+ }
537
+ .komc\:px-5 {
538
+ padding-inline: calc(var(--komc-spacing) * 5);
539
+ }
540
+ .komc\:px-6 {
541
+ padding-inline: calc(var(--komc-spacing) * 6);
542
+ }
491
543
  .komc\:pt-4 {
492
544
  padding-top: calc(var(--komc-spacing) * 4);
493
545
  }
@@ -501,14 +553,17 @@
501
553
  .komc\:break-all {
502
554
  word-break: break-all;
503
555
  }
504
- .komc\:whitespace-nowrap {
505
- white-space: nowrap;
556
+ .komc\:text-\[\#1890FF\] {
557
+ color: #1890FF;
506
558
  }
507
559
  .komc\:text-black {
508
560
  color: var(--komc-color-black);
509
561
  }
510
- .komc\:text-neutral-900 {
511
- color: var(--komc-color-neutral-900);
562
+ .komc\:text-blue-500 {
563
+ color: var(--komc-color-blue-500);
564
+ }
565
+ .komc\:text-gray-800 {
566
+ color: var(--komc-color-gray-800);
512
567
  }
513
568
  .komc\:text-white {
514
569
  color: var(--komc-color-white);
@@ -519,11 +574,36 @@
519
574
  .komc\:opacity-100 {
520
575
  opacity: 100%;
521
576
  }
577
+ .komc\:drop-shadow-2xl {
578
+ --tw-drop-shadow-size: drop-shadow(0 25px 25px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
579
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-2xl));
580
+ 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,);
581
+ }
522
582
  .komc\:drop-shadow-\[0px_0\.5px_3px_rgba\(0\,0\,0\,0\.2\)\] {
523
583
  --tw-drop-shadow-size: drop-shadow(0px 0.5px 3px var(--tw-drop-shadow-color, rgba(0,0,0,0.2)));
524
584
  --tw-drop-shadow: var(--tw-drop-shadow-size);
525
585
  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
586
  }
587
+ .komc\:drop-shadow-lg {
588
+ --tw-drop-shadow-size: drop-shadow(0 4px 4px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
589
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-lg));
590
+ 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,);
591
+ }
592
+ .komc\:drop-shadow-md {
593
+ --tw-drop-shadow-size: drop-shadow(0 3px 3px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.12)));
594
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-md));
595
+ 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,);
596
+ }
597
+ .komc\:drop-shadow-sm {
598
+ --tw-drop-shadow-size: drop-shadow(0 1px 2px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.15)));
599
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-sm));
600
+ 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,);
601
+ }
602
+ .komc\:drop-shadow-xl {
603
+ --tw-drop-shadow-size: drop-shadow(0 9px 7px var(--tw-drop-shadow-color, rgb(0 0 0 / 0.1)));
604
+ --tw-drop-shadow: drop-shadow(var(--komc-drop-shadow-xl));
605
+ 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,);
606
+ }
527
607
  .komc\:transition-all {
528
608
  transition-property: all;
529
609
  transition-timing-function: var(--tw-ease, var(--komc-default-transition-timing-function));
@@ -551,86 +631,143 @@
551
631
  --tw-outline-style: none;
552
632
  outline-style: none;
553
633
  }
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));
634
+ .komc\:hover\:border-transparent {
635
+ &:hover {
636
+ @media (hover: hover) {
637
+ border-color: transparent;
638
+ }
559
639
  }
560
640
  }
561
- .komc\:\*\:duration-200 {
562
- :is(& > *) {
563
- --tw-duration: 200ms;
564
- transition-duration: 200ms;
641
+ .komc\:hover\:bg-\[rgb\(76\,76\,77\)\] {
642
+ &:hover {
643
+ @media (hover: hover) {
644
+ background-color: rgb(76,76,77);
645
+ }
565
646
  }
566
647
  }
567
- .komc\:hover\:bg-\[\#2E3A43\] {
648
+ .komc\:hover\:bg-\[rgb\(199\,199\,199\)\] {
568
649
  &:hover {
569
650
  @media (hover: hover) {
570
- background-color: #2E3A43;
651
+ background-color: rgb(199,199,199);
571
652
  }
572
653
  }
573
654
  }
574
- .komc\:hover\:bg-\[\#424A57\] {
655
+ .komc\:hover\:bg-blue-500 {
575
656
  &:hover {
576
657
  @media (hover: hover) {
577
- background-color: #424A57;
658
+ background-color: var(--komc-color-blue-500);
578
659
  }
579
660
  }
580
661
  }
581
- .komc\:hover\:bg-\[\#26539F\] {
662
+ .komc\:hover\:bg-gray-200 {
582
663
  &:hover {
583
664
  @media (hover: hover) {
584
- background-color: #26539F;
665
+ background-color: var(--komc-color-gray-200);
585
666
  }
586
667
  }
587
668
  }
588
- .komc\:hover\:bg-\[\#B02B33\] {
669
+ .komc\:hover\:bg-indigo-700 {
589
670
  &:hover {
590
671
  @media (hover: hover) {
591
- background-color: #B02B33;
672
+ background-color: var(--komc-color-indigo-700);
592
673
  }
593
674
  }
594
675
  }
595
- .komc\:hover\:bg-\[\#D4E600\] {
676
+ .komc\:hover\:bg-neutral-50 {
596
677
  &:hover {
597
678
  @media (hover: hover) {
598
- background-color: #D4E600;
679
+ background-color: var(--komc-color-neutral-50);
599
680
  }
600
681
  }
601
682
  }
602
- .komc\:hover\:bg-\[rgb\(76\,76\,77\)\] {
683
+ .komc\:hover\:bg-neutral-200 {
603
684
  &:hover {
604
685
  @media (hover: hover) {
605
- background-color: rgb(76,76,77);
686
+ background-color: var(--komc-color-neutral-200);
606
687
  }
607
688
  }
608
689
  }
609
- .komc\:hover\:bg-blue-600 {
690
+ .komc\:hover\:bg-night-700 {
610
691
  &:hover {
611
692
  @media (hover: hover) {
612
- background-color: var(--komc-color-blue-600);
693
+ background-color: var(--komc-color-night-700);
613
694
  }
614
695
  }
615
696
  }
616
- .komc\:hover\:bg-neutral-50 {
697
+ .komc\:hover\:bg-night-800 {
617
698
  &:hover {
618
699
  @media (hover: hover) {
619
- background-color: var(--komc-color-neutral-50);
700
+ background-color: var(--komc-color-night-800);
620
701
  }
621
702
  }
622
703
  }
623
- .komc\:hover\:bg-neutral-100 {
704
+ .komc\:hover\:bg-sky-450 {
624
705
  &:hover {
625
706
  @media (hover: hover) {
626
- background-color: var(--komc-color-neutral-100);
707
+ background-color: var(--komc-color-sky-450);
627
708
  }
628
709
  }
629
710
  }
630
- .komc\:hover\:bg-neutral-200 {
711
+ .komc\:hover\:bg-sky-650 {
631
712
  &:hover {
632
713
  @media (hover: hover) {
633
- background-color: var(--komc-color-neutral-200);
714
+ background-color: var(--komc-color-sky-650);
715
+ }
716
+ }
717
+ }
718
+ .komc\:hover\:bg-sky-750 {
719
+ &:hover {
720
+ @media (hover: hover) {
721
+ background-color: var(--komc-color-sky-750);
722
+ }
723
+ }
724
+ }
725
+ .komc\:hover\:bg-sky-950 {
726
+ &:hover {
727
+ @media (hover: hover) {
728
+ background-color: var(--komc-color-sky-950);
729
+ }
730
+ }
731
+ }
732
+ .komc\:hover\:bg-transparent {
733
+ &:hover {
734
+ @media (hover: hover) {
735
+ background-color: transparent;
736
+ }
737
+ }
738
+ }
739
+ .komc\:hover\:text-\[\#1890FF\] {
740
+ &:hover {
741
+ @media (hover: hover) {
742
+ color: #1890FF;
743
+ }
744
+ }
745
+ }
746
+ .komc\:hover\:text-black {
747
+ &:hover {
748
+ @media (hover: hover) {
749
+ color: var(--komc-color-black);
750
+ }
751
+ }
752
+ }
753
+ .komc\:hover\:text-gray-800 {
754
+ &:hover {
755
+ @media (hover: hover) {
756
+ color: var(--komc-color-gray-800);
757
+ }
758
+ }
759
+ }
760
+ .komc\:hover\:text-white {
761
+ &:hover {
762
+ @media (hover: hover) {
763
+ color: var(--komc-color-white);
764
+ }
765
+ }
766
+ }
767
+ .komc\:hover\:underline {
768
+ &:hover {
769
+ @media (hover: hover) {
770
+ text-decoration-line: underline;
634
771
  }
635
772
  }
636
773
  }
@@ -639,14 +776,94 @@
639
776
  border-color: var(--komc-color-neutral-300);
640
777
  }
641
778
  }
779
+ .komc\:active\:border-transparent {
780
+ &:active {
781
+ border-color: transparent;
782
+ }
783
+ }
642
784
  .komc\:active\:bg-\[rgb\(76\,76\,77\)\] {
643
785
  &:active {
644
786
  background-color: rgb(76,76,77);
645
787
  }
646
788
  }
647
- .komc\:disabled\:pointer-events-none {
648
- &:disabled {
649
- pointer-events: none;
789
+ .komc\:active\:bg-\[rgb\(199\,199\,199\)\] {
790
+ &:active {
791
+ background-color: rgb(199,199,199);
792
+ }
793
+ }
794
+ .komc\:active\:bg-blue-500 {
795
+ &:active {
796
+ background-color: var(--komc-color-blue-500);
797
+ }
798
+ }
799
+ .komc\:active\:bg-gray-200 {
800
+ &:active {
801
+ background-color: var(--komc-color-gray-200);
802
+ }
803
+ }
804
+ .komc\:active\:bg-indigo-700 {
805
+ &:active {
806
+ background-color: var(--komc-color-indigo-700);
807
+ }
808
+ }
809
+ .komc\:active\:bg-night-700 {
810
+ &:active {
811
+ background-color: var(--komc-color-night-700);
812
+ }
813
+ }
814
+ .komc\:active\:bg-night-800 {
815
+ &:active {
816
+ background-color: var(--komc-color-night-800);
817
+ }
818
+ }
819
+ .komc\:active\:bg-sky-450 {
820
+ &:active {
821
+ background-color: var(--komc-color-sky-450);
822
+ }
823
+ }
824
+ .komc\:active\:bg-sky-650 {
825
+ &:active {
826
+ background-color: var(--komc-color-sky-650);
827
+ }
828
+ }
829
+ .komc\:active\:bg-sky-750 {
830
+ &:active {
831
+ background-color: var(--komc-color-sky-750);
832
+ }
833
+ }
834
+ .komc\:active\:bg-sky-950 {
835
+ &:active {
836
+ background-color: var(--komc-color-sky-950);
837
+ }
838
+ }
839
+ .komc\:active\:bg-transparent {
840
+ &:active {
841
+ background-color: transparent;
842
+ }
843
+ }
844
+ .komc\:active\:text-\[\#1890FF\] {
845
+ &:active {
846
+ color: #1890FF;
847
+ }
848
+ }
849
+ .komc\:active\:text-black {
850
+ &:active {
851
+ color: var(--komc-color-black);
852
+ }
853
+ }
854
+ .komc\:active\:text-gray-800 {
855
+ &:active {
856
+ color: var(--komc-color-gray-800);
857
+ }
858
+ }
859
+ .komc\:active\:text-white {
860
+ &:active {
861
+ color: var(--komc-color-white);
862
+ }
863
+ }
864
+ .komc\:active\:underline {
865
+ &:active {
866
+ text-decoration-line: underline;
650
867
  }
651
868
  }
652
869
  .komc\:disabled\:cursor-default {
@@ -654,14 +871,49 @@
654
871
  cursor: default;
655
872
  }
656
873
  }
657
- .komc\:disabled\:opacity-50 {
874
+ .komc\:disabled\:border-gray-500 {
658
875
  &:disabled {
659
- opacity: 50%;
876
+ border-color: var(--komc-color-gray-500);
660
877
  }
661
878
  }
662
- .komc\:xl\:max-w-full {
663
- @media (width >= 80rem) {
664
- max-width: 100%;
879
+ .komc\:disabled\:border-transparent {
880
+ &:disabled {
881
+ border-color: transparent;
882
+ }
883
+ }
884
+ .komc\:disabled\:border-white {
885
+ &:disabled {
886
+ border-color: var(--komc-color-white);
887
+ }
888
+ }
889
+ .komc\:disabled\:bg-gray-50 {
890
+ &:disabled {
891
+ background-color: var(--komc-color-gray-50);
892
+ }
893
+ }
894
+ .komc\:disabled\:bg-gray-700 {
895
+ &:disabled {
896
+ background-color: var(--komc-color-gray-700);
897
+ }
898
+ }
899
+ .komc\:disabled\:bg-transparent {
900
+ &:disabled {
901
+ background-color: transparent;
902
+ }
903
+ }
904
+ .komc\:disabled\:bg-white {
905
+ &:disabled {
906
+ background-color: var(--komc-color-white);
907
+ }
908
+ }
909
+ .komc\:disabled\:text-gray-500 {
910
+ &:disabled {
911
+ color: var(--komc-color-gray-500);
912
+ }
913
+ }
914
+ .komc\:disabled\:text-gray-800 {
915
+ &:disabled {
916
+ color: var(--komc-color-gray-800);
665
917
  }
666
918
  }
667
919
  .komc\:xl\:p-10 {
@@ -669,6 +921,19 @@
669
921
  padding: calc(var(--komc-spacing) * 10);
670
922
  }
671
923
  }
924
+ .komc\:\[\&_svg\]\:transition-colors {
925
+ & svg {
926
+ transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
927
+ transition-timing-function: var(--tw-ease, var(--komc-default-transition-timing-function));
928
+ transition-duration: var(--tw-duration, var(--komc-default-transition-duration));
929
+ }
930
+ }
931
+ .komc\:\[\&_svg\]\:duration-200 {
932
+ & svg {
933
+ --tw-duration: 200ms;
934
+ transition-duration: 200ms;
935
+ }
936
+ }
672
937
  .komc\:\[\&\>input\]\:h-full {
673
938
  &>input {
674
939
  height: 100%;