@blueking/bk-user-selector 0.0.39-beta.3 → 0.1.1-beta.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.
- package/README.md +316 -88
- package/package.json +2 -2
- package/typings/api/user.d.ts +42 -21
- package/typings/components/me-tag.vue.d.ts +14 -35
- package/typings/components/selection-popover.vue.d.ts +48 -197
- package/typings/components/user-render.d.ts +20 -1
- package/typings/components/user-selector.vue.d.ts +23 -29
- package/typings/components/user-tag.vue.d.ts +16 -0
- package/typings/constants/index.d.ts +25 -0
- package/typings/hooks/use-current-user.d.ts +30 -0
- package/typings/hooks/use-focus-state.d.ts +48 -0
- package/typings/hooks/use-input-handler.d.ts +44 -0
- package/typings/hooks/use-resize-observer.d.ts +17 -0
- package/typings/hooks/use-selected-users.d.ts +78 -0
- package/typings/hooks/use-sortable.d.ts +41 -0
- package/typings/hooks/use-tenant-data.d.ts +17 -0
- package/typings/hooks/use-user-search.d.ts +38 -0
- package/typings/hooks/use-user-selection.d.ts +32 -0
- package/typings/hooks/use-visible-tags.d.ts +51 -0
- package/typings/types/index.d.ts +127 -98
- package/typings/utils/logger.d.ts +47 -0
- package/vue2/index.es.min.js +3308 -4631
- package/vue2/index.iife.min.js +4610 -5899
- package/vue2/index.umd.min.js +3300 -4623
- package/vue2/vue2.css +34 -81
- package/vue3/index.es.min.js +1393 -1597
- package/vue3/index.iife.min.js +3298 -4621
- package/vue3/index.umd.min.js +1392 -1596
- package/vue3/vue3.css +34 -67
package/vue2/vue2.css
CHANGED
|
@@ -649,20 +649,6 @@ optgroup {
|
|
|
649
649
|
.bk-user-selector-popover.bk-user-selector-pop2-content[data-theme^='light'] .bk-user-selector-pop2-arrow {
|
|
650
650
|
background-color: #fff;
|
|
651
651
|
}
|
|
652
|
-
.text-ov {
|
|
653
|
-
overflow: hidden;
|
|
654
|
-
text-overflow: ellipsis;
|
|
655
|
-
white-space: nowrap;
|
|
656
|
-
}
|
|
657
|
-
.position-relative {
|
|
658
|
-
position: relative;
|
|
659
|
-
}
|
|
660
|
-
.position-absolute {
|
|
661
|
-
position: absolute;
|
|
662
|
-
}
|
|
663
|
-
.overflow-popover-reference {
|
|
664
|
-
width: 100%;
|
|
665
|
-
}
|
|
666
652
|
.bk-user-selector-tag {
|
|
667
653
|
display: inline-flex;
|
|
668
654
|
align-items: center;
|
|
@@ -797,7 +783,7 @@ optgroup {
|
|
|
797
783
|
line-height: 0;
|
|
798
784
|
cursor: pointer;
|
|
799
785
|
}
|
|
800
|
-
.me-tag[data-v-
|
|
786
|
+
.me-tag[data-v-4f251ce1] {
|
|
801
787
|
position: absolute;
|
|
802
788
|
top: 50%;
|
|
803
789
|
right: 8px;
|
|
@@ -816,75 +802,80 @@ optgroup {
|
|
|
816
802
|
border-radius: 50%;
|
|
817
803
|
transform: translateY(-50%);
|
|
818
804
|
}
|
|
819
|
-
.me-tag[data-v-
|
|
805
|
+
.me-tag[data-v-4f251ce1]:hover {
|
|
820
806
|
color: #3a84ff;
|
|
821
807
|
background-color: #cddffe;
|
|
822
808
|
}
|
|
823
|
-
.me-tag.disabled[data-v-
|
|
809
|
+
.me-tag.disabled[data-v-4f251ce1] {
|
|
824
810
|
color: #c4c6cc;
|
|
825
811
|
cursor: not-allowed;
|
|
826
812
|
background-color: #f0f1f5;
|
|
827
|
-
}.dropdown-content[data-v-
|
|
813
|
+
}.dropdown-content[data-v-d5a338f0] {
|
|
828
814
|
min-height: 40px;
|
|
829
815
|
max-height: 300px;
|
|
830
816
|
padding: 5px 0;
|
|
831
817
|
overflow-y: auto;
|
|
832
818
|
}
|
|
833
|
-
.dropdown-content .no-data[data-v-
|
|
819
|
+
.dropdown-content .no-data[data-v-d5a338f0] {
|
|
834
820
|
padding: 10px;
|
|
835
821
|
color: #979ba5;
|
|
836
822
|
text-align: center;
|
|
837
823
|
}
|
|
838
|
-
.dropdown-content .user-group .group-header[data-v-
|
|
824
|
+
.dropdown-content .user-group .group-header[data-v-d5a338f0] {
|
|
839
825
|
display: flex;
|
|
840
826
|
align-items: center;
|
|
841
827
|
padding: 8px 12px;
|
|
842
828
|
color: #979ba5;
|
|
843
829
|
}
|
|
844
|
-
.dropdown-content .user-group .group-header .group-count[data-v-
|
|
830
|
+
.dropdown-content .user-group .group-header .group-count[data-v-d5a338f0] {
|
|
845
831
|
margin-left: 4px;
|
|
846
832
|
}
|
|
847
|
-
.dropdown-content .user-option[data-v-
|
|
833
|
+
.dropdown-content .user-option[data-v-d5a338f0] {
|
|
848
834
|
display: flex;
|
|
849
835
|
align-items: center;
|
|
850
836
|
height: 32px;
|
|
851
837
|
padding: 8px 12px;
|
|
852
838
|
cursor: pointer;
|
|
853
839
|
}
|
|
854
|
-
.dropdown-content .user-option[data-v-
|
|
840
|
+
.dropdown-content .user-option[data-v-d5a338f0]:hover {
|
|
855
841
|
background-color: #f5f7fa;
|
|
856
|
-
}.user-tag[data-v-
|
|
842
|
+
}.user-tag[data-v-1f2e0737] {
|
|
857
843
|
margin-right: 4px;
|
|
858
844
|
margin-left: 0;
|
|
859
845
|
}
|
|
860
|
-
.user-tag.draggable[data-v-
|
|
846
|
+
.user-tag.draggable[data-v-1f2e0737] {
|
|
861
847
|
cursor: move;
|
|
862
848
|
}
|
|
863
|
-
.user-tag.active[data-v-
|
|
849
|
+
.user-tag.active[data-v-1f2e0737] {
|
|
864
850
|
background-color: #e1ecff;
|
|
865
851
|
border-color: #3a84ff;
|
|
866
852
|
}
|
|
867
|
-
.user-tag.is-custom[data-v-
|
|
853
|
+
.user-tag.is-custom[data-v-1f2e0737] {
|
|
868
854
|
color: #ea3636;
|
|
869
855
|
background-color: #feebea;
|
|
870
856
|
border-color: rgba(234, 53, 54, 0.3019607843);
|
|
871
857
|
}
|
|
872
|
-
.user-tag.is-custom[data-v-
|
|
858
|
+
.user-tag.is-custom[data-v-1f2e0737]:hover {
|
|
873
859
|
background-color: #fedddc;
|
|
874
860
|
}
|
|
875
|
-
.user-tag .tag-content .user-name[data-v-
|
|
861
|
+
.user-tag .tag-content .user-name[data-v-1f2e0737] {
|
|
876
862
|
overflow: hidden;
|
|
877
863
|
text-overflow: ellipsis;
|
|
878
864
|
font-size: 12px;
|
|
879
865
|
white-space: nowrap;
|
|
880
|
-
}.
|
|
866
|
+
}.bk-user-selector[data-v-9975c7e1] {
|
|
881
867
|
position: relative;
|
|
882
868
|
width: 100%;
|
|
869
|
+
height: 32px;
|
|
870
|
+
font-size: 12px;
|
|
883
871
|
}
|
|
884
|
-
.
|
|
872
|
+
.bk-user-selector.is-disabled[data-v-9975c7e1] {
|
|
885
873
|
pointer-events: none;
|
|
874
|
+
cursor: not-allowed;
|
|
875
|
+
background-color: #dcdee5;
|
|
886
876
|
}
|
|
887
|
-
.
|
|
877
|
+
.bk-user-selector .tags-container[data-v-9975c7e1] {
|
|
878
|
+
position: relative;
|
|
888
879
|
min-height: 32px;
|
|
889
880
|
padding: 1px 10px 1px 8px;
|
|
890
881
|
background-color: #fff;
|
|
@@ -892,81 +883,43 @@ optgroup {
|
|
|
892
883
|
border-radius: 2px;
|
|
893
884
|
transition: all 0.2s ease;
|
|
894
885
|
}
|
|
895
|
-
.
|
|
886
|
+
.bk-user-selector .tags-container.focused[data-v-9975c7e1] {
|
|
896
887
|
border-color: #3a84ff;
|
|
897
888
|
box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
|
|
898
889
|
}
|
|
899
|
-
.
|
|
890
|
+
.bk-user-selector .tags-container.tags-container-collapsed[data-v-9975c7e1] {
|
|
900
891
|
display: flex;
|
|
901
892
|
flex-wrap: wrap;
|
|
902
893
|
align-items: center;
|
|
903
894
|
}
|
|
904
|
-
.
|
|
895
|
+
.bk-user-selector .tag-list[data-v-9975c7e1] {
|
|
905
896
|
display: flex;
|
|
906
897
|
flex-wrap: wrap;
|
|
907
898
|
align-items: center;
|
|
908
899
|
}
|
|
909
|
-
.
|
|
900
|
+
.bk-user-selector .tag-wrapper[data-v-9975c7e1] {
|
|
910
901
|
display: inline-flex;
|
|
911
902
|
align-items: center;
|
|
912
903
|
max-width: 100%;
|
|
913
904
|
}
|
|
914
|
-
.
|
|
915
|
-
min-width:
|
|
905
|
+
.bk-user-selector .search-input[data-v-9975c7e1] {
|
|
906
|
+
min-width: 20px;
|
|
916
907
|
height: 28px;
|
|
917
908
|
outline: none;
|
|
918
909
|
background: transparent;
|
|
919
910
|
border: none;
|
|
920
911
|
}
|
|
921
|
-
.
|
|
912
|
+
.bk-user-selector .search-input[data-v-9975c7e1]::placeholder {
|
|
922
913
|
color: #c4c6cc;
|
|
923
914
|
}
|
|
924
|
-
.
|
|
925
|
-
min-width:
|
|
915
|
+
.bk-user-selector .search-input.input-inline[data-v-9975c7e1] {
|
|
916
|
+
min-width: 20px;
|
|
926
917
|
}
|
|
927
|
-
.
|
|
918
|
+
.bk-user-selector .search-input.input-last[data-v-9975c7e1], .bk-user-selector .search-input.search-input-collapsed[data-v-9975c7e1] {
|
|
928
919
|
flex: 1;
|
|
929
920
|
}
|
|
930
|
-
.hidden-users[data-v-
|
|
921
|
+
.hidden-users[data-v-9975c7e1] {
|
|
931
922
|
padding: 6px 10px;
|
|
932
|
-
}.single-selector[data-v-cbe352a6] {
|
|
933
|
-
position: relative;
|
|
934
|
-
width: 100%;
|
|
935
|
-
}
|
|
936
|
-
.single-selector.is-disabled[data-v-cbe352a6] {
|
|
937
|
-
pointer-events: none;
|
|
938
|
-
}
|
|
939
|
-
.input-container[data-v-cbe352a6] {
|
|
940
|
-
position: relative;
|
|
941
|
-
display: flex;
|
|
942
|
-
align-items: center;
|
|
943
|
-
min-height: 32px;
|
|
944
|
-
padding: 0 8px;
|
|
945
|
-
background-color: #fff;
|
|
946
|
-
border: 1px solid #c4c6cc;
|
|
947
|
-
border-radius: 2px;
|
|
948
|
-
}
|
|
949
|
-
.input-container[data-v-cbe352a6]:focus-within {
|
|
950
|
-
border-color: #3a84ff;
|
|
951
|
-
box-shadow: 0 0 0 2px rgba(58, 132, 255, 0.1);
|
|
952
|
-
}
|
|
953
|
-
.search-input[data-v-cbe352a6] {
|
|
954
|
-
flex: 1;
|
|
955
|
-
height: 30px;
|
|
956
|
-
outline: none;
|
|
957
|
-
background: transparent;
|
|
958
|
-
border: none;
|
|
959
|
-
}
|
|
960
|
-
.search-input[data-v-cbe352a6]::placeholder {
|
|
961
|
-
color: #c4c6cc;
|
|
962
|
-
}.bk-user-selector[data-v-9c628c83] {
|
|
963
|
-
position: relative;
|
|
964
|
-
width: 100%;
|
|
965
|
-
font-size: 12px;
|
|
966
|
-
}
|
|
967
|
-
.bk-user-selector.is-disabled[data-v-9c628c83] {
|
|
968
|
-
cursor: not-allowed;
|
|
969
|
-
background-color: #dcdee5;
|
|
970
923
|
}.bk-user-selector-popover {
|
|
971
924
|
padding: 0 !important;
|
|
972
925
|
}
|