@douyinfe/semi-ui 2.0.8 → 2.0.9-alpha.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.
package/dist/css/semi.css CHANGED
@@ -639,25 +639,99 @@ body[theme-mode=dark], body .semi-always-dark {
639
639
  padding-left: auto;
640
640
  }
641
641
 
642
- .semi-autocomplete {
642
+ .semi-select-option {
643
+ font-size: 14px;
644
+ line-height: 20px;
645
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
646
+ word-break: break-all;
647
+ padding-left: 12px;
648
+ padding-right: 12px;
649
+ padding-top: 8px;
650
+ padding-bottom: 8px;
651
+ color: var(--semi-color-text-0);
652
+ position: relative;
653
+ display: flex;
654
+ flex-wrap: nowrap;
655
+ align-items: center;
656
+ cursor: pointer;
657
+ box-sizing: border-box;
658
+ }
659
+ .semi-select-option-icon {
660
+ width: 12px;
661
+ color: transparent;
662
+ visibility: hidden;
663
+ margin-right: 8px;
664
+ display: flex;
665
+ justify-content: center;
666
+ align-content: center;
667
+ }
668
+ .semi-select-option-text {
669
+ display: flex;
670
+ flex-wrap: wrap;
671
+ white-space: pre;
672
+ }
673
+ .semi-select-option-keyword {
674
+ color: var(--semi-color-primary);
675
+ background-color: inherit;
676
+ font-weight: 600;
677
+ }
678
+ .semi-select-option:active {
679
+ background-color: var(--semi-color-fill-1);
680
+ }
681
+ .semi-select-option-empty {
682
+ cursor: not-allowed;
683
+ color: var(--semi-color-disabled-text);
684
+ justify-content: center;
685
+ }
686
+ .semi-select-option-empty:hover {
687
+ background-color: inherit;
688
+ }
689
+ .semi-select-option-empty:active {
690
+ background-color: inherit;
691
+ }
692
+ .semi-select-option-disabled {
693
+ color: var(--semi-color-disabled-text);
694
+ cursor: not-allowed;
695
+ }
696
+ .semi-select-option-disabled:hover {
697
+ background-color: var(--semi-color-fill-0);
698
+ }
699
+ .semi-select-option-selected {
700
+ font-weight: 600;
701
+ }
702
+ .semi-select-option-selected .semi-select-option-icon {
703
+ visibility: visible;
704
+ color: var(--semi-color-text-2);
705
+ }
706
+ .semi-select-option-focused {
707
+ background-color: var(--semi-color-fill-0);
708
+ }
709
+ .semi-select-option:first-of-type {
710
+ margin-top: 4px;
711
+ }
712
+ .semi-select-option:last-of-type {
713
+ margin-bottom: 4px;
714
+ }
715
+
716
+ .semi-select {
643
717
  cursor: text;
644
718
  display: inline-flex;
645
719
  vertical-align: middle;
646
720
  box-sizing: border-box;
647
721
  }
648
- .semi-autocomplete-option-list {
722
+ .semi-select-option-list {
649
723
  overflow-x: hidden;
650
724
  overflow-y: auto;
651
725
  }
652
- .semi-autocomplete-option-list-chosen .semi-autocomplete-option-icon {
726
+ .semi-select-option-list-chosen .semi-select-option-icon {
653
727
  display: flex;
654
728
  }
655
- .semi-autocomplete-loading-wrapper {
729
+ .semi-select-loading-wrapper {
656
730
  padding-top: 8px;
657
731
  padding-bottom: 8px;
658
732
  cursor: not-allowed;
659
733
  }
660
- .semi-autocomplete-loading-wrapper .semi-spin {
734
+ .semi-select-loading-wrapper .semi-spin {
661
735
  width: 100%;
662
736
  }
663
737
 
@@ -14196,6 +14270,80 @@ body[theme-mode=dark], body .semi-always-dark {
14196
14270
  padding-left: 18px;
14197
14271
  }
14198
14272
 
14273
+ .semi-select-option {
14274
+ font-size: 14px;
14275
+ line-height: 20px;
14276
+ font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
14277
+ word-break: break-all;
14278
+ padding-left: 12px;
14279
+ padding-right: 12px;
14280
+ padding-top: 8px;
14281
+ padding-bottom: 8px;
14282
+ color: var(--semi-color-text-0);
14283
+ position: relative;
14284
+ display: flex;
14285
+ flex-wrap: nowrap;
14286
+ align-items: center;
14287
+ cursor: pointer;
14288
+ box-sizing: border-box;
14289
+ }
14290
+ .semi-select-option-icon {
14291
+ width: 12px;
14292
+ color: transparent;
14293
+ visibility: hidden;
14294
+ margin-right: 8px;
14295
+ display: flex;
14296
+ justify-content: center;
14297
+ align-content: center;
14298
+ }
14299
+ .semi-select-option-text {
14300
+ display: flex;
14301
+ flex-wrap: wrap;
14302
+ white-space: pre;
14303
+ }
14304
+ .semi-select-option-keyword {
14305
+ color: var(--semi-color-primary);
14306
+ background-color: inherit;
14307
+ font-weight: 600;
14308
+ }
14309
+ .semi-select-option:active {
14310
+ background-color: var(--semi-color-fill-1);
14311
+ }
14312
+ .semi-select-option-empty {
14313
+ cursor: not-allowed;
14314
+ color: var(--semi-color-disabled-text);
14315
+ justify-content: center;
14316
+ }
14317
+ .semi-select-option-empty:hover {
14318
+ background-color: inherit;
14319
+ }
14320
+ .semi-select-option-empty:active {
14321
+ background-color: inherit;
14322
+ }
14323
+ .semi-select-option-disabled {
14324
+ color: var(--semi-color-disabled-text);
14325
+ cursor: not-allowed;
14326
+ }
14327
+ .semi-select-option-disabled:hover {
14328
+ background-color: var(--semi-color-fill-0);
14329
+ }
14330
+ .semi-select-option-selected {
14331
+ font-weight: 600;
14332
+ }
14333
+ .semi-select-option-selected .semi-select-option-icon {
14334
+ visibility: visible;
14335
+ color: var(--semi-color-text-2);
14336
+ }
14337
+ .semi-select-option-focused {
14338
+ background-color: var(--semi-color-fill-0);
14339
+ }
14340
+ .semi-select-option:first-of-type {
14341
+ margin-top: 4px;
14342
+ }
14343
+ .semi-select-option:last-of-type {
14344
+ margin-bottom: 4px;
14345
+ }
14346
+
14199
14347
  .semi-select {
14200
14348
  box-sizing: border-box;
14201
14349
  border-radius: var(--semi-border-radius-small);