@open-condo/ui 1.20.3 → 1.21.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,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Mon, 27 Feb 2023 12:52:56 GMT
3
+ * Generated on Fri, 10 Mar 2023 08:28:32 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -1,6 +1,6 @@
1
1
 
2
2
  // Do not edit directly
3
- // Generated on Mon, 27 Feb 2023 12:52:56 GMT
3
+ // Generated on Fri, 10 Mar 2023 08:28:32 GMT
4
4
 
5
5
  @condo-global-spacing-4: 4px;
6
6
  @condo-global-spacing-8: 8px;
package/dist/styles.css CHANGED
@@ -6562,79 +6562,159 @@ span.condo-typography-ellipsis-single-line {
6562
6562
  .condo-select {
6563
6563
  align-items: center;
6564
6564
  }
6565
+ .condo-select:hover .condo-select-clear {
6566
+ opacity: 1;
6567
+ }
6565
6568
  .condo-select-fit-content {
6566
- display: inline-flex;
6567
- width: -webkit-min-content;
6568
- width: -moz-min-content;
6569
- width: min-content;
6569
+ max-width: 100%;
6570
6570
  }
6571
6571
  .condo-select-fill-parent {
6572
- display: flex;
6573
6572
  width: 100%;
6574
6573
  }
6575
- .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector {
6576
- border-color: transparent;
6577
- background: #ff3b30;
6578
- }
6579
- .condo-select-success:not(.condo-select-customize-input) .condo-select-selector {
6580
- border-color: transparent;
6581
- background: #39ce66;
6582
- }
6583
- .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector {
6584
- border-color: transparent;
6585
- background: #ff9500;
6586
- }
6587
- .condo-select-info:not(.condo-select-customize-input) .condo-select-selector {
6588
- border-color: transparent;
6589
- background: #2696f3;
6590
- }
6591
- .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector {
6592
- border-color: transparent;
6593
- background: #707695;
6594
- }
6595
- .condo-select-danger > .condo-select-arrow,
6596
- .condo-select-warning > .condo-select-arrow,
6597
- .condo-select-info > .condo-select-arrow,
6598
- .condo-select-secondary > .condo-select-arrow,
6599
- .condo-select-success > .condo-select-arrow {
6600
- color: #fff;
6601
- }
6602
- .condo-select-danger .condo-select-selection-item > *,
6603
- .condo-select-warning .condo-select-selection-item > *,
6604
- .condo-select-info .condo-select-selection-item > *,
6605
- .condo-select-secondary .condo-select-selection-item > *,
6606
- .condo-select-success .condo-select-selection-item > * {
6607
- color: #fff;
6608
- }
6609
- .condo-select-arrow {
6574
+ .condo-select-arrow,
6575
+ .condo-select-clear {
6610
6576
  position: absolute;
6611
- top: 16px;
6577
+ top: 50%;
6612
6578
  right: 12px;
6613
- height: inherit;
6579
+ display: flex;
6580
+ width: auto;
6581
+ height: auto;
6614
6582
  margin: 0;
6615
6583
  color: #222;
6584
+ background-color: transparent;
6585
+ transform: translateY(-50%);
6586
+ }
6587
+ .condo-select-clear {
6588
+ background-color: #fff;
6616
6589
  }
6617
6590
  .condo-select-disabled:not(.condo-select-customize-input) .condo-select-arrow {
6618
6591
  color: #e1e5ed;
6619
6592
  }
6620
6593
  .condo-select-open .condo-select-arrow {
6621
- transform: rotate(180deg);
6594
+ transform: translateY(-50%) rotate(180deg);
6595
+ }
6596
+ .condo-select .condo-select-selection-item {
6597
+ color: #222;
6598
+ }
6599
+ .condo-select .condo-select-selection-placeholder {
6600
+ color: #707695;
6622
6601
  }
6623
6602
  .condo-select:not(.condo-select-customize-input) .condo-select-selector {
6624
- height: 46px;
6603
+ box-sizing: border-box;
6604
+ width: auto;
6605
+ height: 48px;
6625
6606
  padding: 0 36px 0 12px;
6626
6607
  border-radius: 8px;
6627
6608
  }
6609
+ .condo-select:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input {
6610
+ margin: 0;
6611
+ font-weight: 400;
6612
+ font-size: 16px;
6613
+ font-family: "Open Sans", var(--condo-font-fallback);
6614
+ line-height: 24px;
6615
+ letter-spacing: -0.01em;
6616
+ color: #222;
6617
+ }
6628
6618
  .condo-select:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6629
6619
  .condo-select:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder {
6620
+ margin: 0;
6621
+ font-weight: 400;
6622
+ font-size: 16px;
6623
+ font-family: "Open Sans", var(--condo-font-fallback);
6624
+ line-height: 24px;
6625
+ letter-spacing: -0.01em;
6626
+ display: inline-flex;
6627
+ align-items: center;
6628
+ width: calc(100% - 36px - 12px);
6629
+ padding-right: 0;
6630
+ overflow: hidden;
6631
+ text-overflow: ellipsis;
6632
+ }
6633
+ .condo-select:not(.condo-select-customize-input):not(.condo-select-multiple) .condo-select-selector .condo-select-selection-search {
6634
+ position: absolute;
6635
+ left: 12px;
6636
+ display: inline-block;
6637
+ width: calc(100% - 36px - 12px);
6638
+ line-height: 48px;
6639
+ }
6640
+ .condo-select:not(.condo-select-customize-input):not(.condo-select-multiple) .condo-select-selector .condo-select-selection-search-input {
6641
+ position: absolute;
6642
+ top: 50%;
6643
+ height: 48px;
6644
+ line-height: 48px;
6645
+ transform: translateY(-50%);
6646
+ }
6647
+ .condo-select:not(.condo-select-customize-input):not(.condo-select-multiple) .condo-select-selector .condo-select-selection-item {
6648
+ display: flex;
6649
+ align-items: center;
6650
+ }
6651
+ .condo-select:not(.condo-select-customize-input):not(.condo-select-multiple) .condo-select-selector .condo-select-selection-item .condo-typography {
6652
+ margin: 0;
6653
+ font-weight: 400;
6654
+ font-size: 16px;
6655
+ font-family: "Open Sans", var(--condo-font-fallback);
6656
+ line-height: 24px;
6657
+ letter-spacing: -0.01em;
6658
+ flex: 1;
6659
+ overflow: hidden;
6660
+ font-weight: normal;
6661
+ white-space: nowrap;
6662
+ text-overflow: ellipsis;
6663
+ }
6664
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector {
6665
+ height: inherit;
6666
+ min-height: 48px;
6667
+ padding-top: calc(4px - 1px);
6668
+ padding-bottom: calc(4px - 1px);
6669
+ }
6670
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item {
6630
6671
  display: flex;
6631
6672
  align-items: center;
6632
6673
  justify-content: flex-start;
6633
- width: 100%;
6634
- padding-right: 0;
6674
+ width: inherit;
6675
+ height: 32px;
6676
+ margin: 4px 8px 4px 0;
6677
+ padding: 0 8px;
6678
+ background-color: #f2f4f6;
6679
+ border: none;
6680
+ border-radius: 4px;
6681
+ }
6682
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-content {
6683
+ display: inline-flex;
6684
+ }
6685
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-select-selection-item-remove {
6686
+ display: flex;
6687
+ align-items: center;
6635
6688
  color: #222;
6689
+ }
6690
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item .condo-typography {
6691
+ margin: 0;
6692
+ font-weight: 400;
6636
6693
  font-size: 14px;
6637
6694
  font-family: "Open Sans", var(--condo-font-fallback);
6695
+ line-height: 22px;
6696
+ letter-spacing: -0.01em;
6697
+ overflow: hidden;
6698
+ color: #222;
6699
+ white-space: pre;
6700
+ text-overflow: ellipsis;
6701
+ }
6702
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-overflow-item-suffix {
6703
+ display: flex;
6704
+ align-items: center;
6705
+ height: 40px;
6706
+ }
6707
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder {
6708
+ left: 12px;
6709
+ display: inline-block;
6710
+ }
6711
+ .condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-mirror {
6712
+ margin: 0;
6713
+ font-weight: 400;
6714
+ font-size: 16px;
6715
+ font-family: "Open Sans", var(--condo-font-fallback);
6716
+ line-height: 24px;
6717
+ letter-spacing: -0.01em;
6638
6718
  }
6639
6719
  .condo-select:not(.condo-select-disabled):hover .condo-select-selector {
6640
6720
  border-color: transparent;
@@ -6642,7 +6722,77 @@ span.condo-typography-ellipsis-single-line {
6642
6722
  .condo-select:not(.condo-select-disabled):hover:not(.condo-select-success):not(.condo-select-warning):not(.condo-select-secondary):not(.condo-select-danger):not(.condo-select-info) .condo-select-selector {
6643
6723
  border-color: #707695;
6644
6724
  }
6645
- .condo-select-disabled.condo-select:not(.condo-select-customize-input) .condo-select-selector {
6725
+ .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector {
6726
+ border-color: transparent;
6727
+ background: #ff3b30;
6728
+ }
6729
+ .condo-select-success:not(.condo-select-customize-input) .condo-select-selector {
6730
+ border-color: transparent;
6731
+ background: #39ce66;
6732
+ }
6733
+ .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector {
6734
+ border-color: transparent;
6735
+ background: #ff9500;
6736
+ }
6737
+ .condo-select-info:not(.condo-select-customize-input) .condo-select-selector {
6738
+ border-color: transparent;
6739
+ background: #2696f3;
6740
+ }
6741
+ .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector {
6742
+ border-color: transparent;
6743
+ background: #707695;
6744
+ }
6745
+ .condo-select-danger .condo-select-arrow,
6746
+ .condo-select-warning .condo-select-arrow,
6747
+ .condo-select-info .condo-select-arrow,
6748
+ .condo-select-secondary .condo-select-arrow,
6749
+ .condo-select-success .condo-select-arrow,
6750
+ .condo-select-danger .condo-select-clear,
6751
+ .condo-select-warning .condo-select-clear,
6752
+ .condo-select-info .condo-select-clear,
6753
+ .condo-select-secondary .condo-select-clear,
6754
+ .condo-select-success .condo-select-clear {
6755
+ color: #fff;
6756
+ }
6757
+ .condo-select-danger .condo-select-clear {
6758
+ background-color: #ff3b30;
6759
+ }
6760
+ .condo-select-warning .condo-select-clear {
6761
+ background-color: #ff9500;
6762
+ }
6763
+ .condo-select-info .condo-select-clear {
6764
+ background-color: #2696f3;
6765
+ }
6766
+ .condo-select-secondary .condo-select-clear {
6767
+ background-color: #707695;
6768
+ }
6769
+ .condo-select-success .condo-select-clear {
6770
+ background-color: #39ce66;
6771
+ }
6772
+ .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder,
6773
+ .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder,
6774
+ .condo-select-info:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder,
6775
+ .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder,
6776
+ .condo-select-success:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-placeholder,
6777
+ .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input,
6778
+ .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input,
6779
+ .condo-select-info:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input,
6780
+ .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input,
6781
+ .condo-select-success:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-search-input,
6782
+ .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6783
+ .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6784
+ .condo-select-info:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6785
+ .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6786
+ .condo-select-success:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item,
6787
+ .condo-select-danger:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > *,
6788
+ .condo-select-warning:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > *,
6789
+ .condo-select-info:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > *,
6790
+ .condo-select-secondary:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > *,
6791
+ .condo-select-success:not(.condo-select-customize-input) .condo-select-selector .condo-select-selection-item > * {
6792
+ color: #fff;
6793
+ }
6794
+ .condo-select-disabled.condo-select:not(.condo-select-customize-input) .condo-select-selector,
6795
+ .condo-select-disabled.condo-select.condo-select-multiple:not(.condo-select-customize-input) .condo-select-selector {
6646
6796
  background: #fff;
6647
6797
  opacity: 0.5;
6648
6798
  }
@@ -6677,11 +6827,32 @@ span.condo-typography-ellipsis-single-line {
6677
6827
  border-radius: 8px;
6678
6828
  box-shadow: 0 4px 14px 0 rgba(178,185,217,0.4);
6679
6829
  }
6830
+ .condo-select-dropdown .condo-select-item-empty {
6831
+ display: flex;
6832
+ align-items: center;
6833
+ justify-content: center;
6834
+ padding: 20px;
6835
+ color: #707695;
6836
+ }
6837
+ .condo-select-dropdown .condo-select-item-empty .condo-typography {
6838
+ margin-left: 8px;
6839
+ color: #707695;
6840
+ }
6841
+ .condo-select-dropdown .condo-select-item-option-state {
6842
+ display: flex;
6843
+ align-items: center;
6844
+ }
6680
6845
  .condo-select-dropdown .condo-select-item {
6681
6846
  min-height: 22px;
6682
6847
  line-height: 20px;
6683
6848
  }
6684
- .condo-select-dropdown .condo-select-item.condo-select-item-option-active {
6849
+ .condo-select-dropdown .condo-select-item-option-selected:not(.condo-select-item-option-disabled) {
6850
+ background-color: #ebfaef;
6851
+ }
6852
+ .condo-select-dropdown .condo-select-item-option-selected:not(.condo-select-item-option-disabled) .condo-select-item-option-state {
6853
+ color: #39ce66;
6854
+ }
6855
+ .condo-select-dropdown .condo-select-item-option-active:not(.condo-select-item-option-disabled) {
6685
6856
  background-color: #f2f4f6;
6686
6857
  }
6687
6858
  .condo-select-dropdown .condo-select-item.condo-select-item-group {