superdesk-ui-framework 3.0.54 → 3.0.56
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/app/styles/_sd-tag-input.scss +213 -215
- package/app-typescript/components/DatePicker.tsx +8 -0
- package/app-typescript/components/Input.tsx +2 -0
- package/app-typescript/components/RadioButtonGroup.tsx +14 -4
- package/app-typescript/components/TabCustom.tsx +9 -2
- package/app-typescript/components/TimePicker.tsx +2 -0
- package/app-typescript/components/TreeSelect/TreeSelect.tsx +120 -107
- package/dist/examples.bundle.js +89 -79
- package/dist/superdesk-ui.bundle.css +183 -199
- package/dist/superdesk-ui.bundle.js +88 -78
- package/package.json +1 -1
- package/react/components/DatePicker.d.ts +1 -0
- package/react/components/DatePicker.js +4 -0
- package/react/components/Input.d.ts +1 -0
- package/react/components/Input.js +1 -1
- package/react/components/RadioButtonGroup.d.ts +1 -0
- package/react/components/RadioButtonGroup.js +3 -3
- package/react/components/TabCustom.d.ts +2 -1
- package/react/components/TabCustom.js +9 -9
- package/react/components/TimePicker.d.ts +1 -0
- package/react/components/TimePicker.js +1 -1
- package/react/components/TreeSelect/TreeSelect.d.ts +1 -0
- package/react/components/TreeSelect/TreeSelect.js +70 -64
@@ -35672,116 +35672,97 @@ tags-input,
|
|
35672
35672
|
tags-input .tags-input__remove-value:hover,
|
35673
35673
|
.tags-input .tags-input__remove-value:hover {
|
35674
35674
|
opacity: 1; }
|
35675
|
-
|
35676
|
-
|
35677
|
-
|
35678
|
-
|
35679
|
-
|
35680
|
-
|
35681
|
-
|
35682
|
-
|
35683
|
-
|
35684
|
-
|
35685
|
-
|
35686
|
-
|
35687
|
-
|
35688
|
-
|
35689
|
-
|
35675
|
+
|
35676
|
+
.autocomplete {
|
35677
|
+
position: absolute;
|
35678
|
+
padding: 0.5rem 0;
|
35679
|
+
z-index: 999;
|
35680
|
+
width: 100%;
|
35681
|
+
background-color: var(--color-dropdown-menu-Bg);
|
35682
|
+
box-shadow: var(--sd-shadow__dropdown); }
|
35683
|
+
.autocomplete .suggestion-list {
|
35684
|
+
margin: 0;
|
35685
|
+
padding: 0;
|
35686
|
+
list-style-type: none;
|
35687
|
+
max-height: 28rem;
|
35688
|
+
overflow-y: auto;
|
35689
|
+
position: relative; }
|
35690
|
+
.autocomplete .suggestion-list--multi-select {
|
35691
|
+
padding: 4px 0 !important;
|
35692
|
+
min-height: 40px; }
|
35693
|
+
.autocomplete .suggestion-list--loader {
|
35694
|
+
padding: 4px 0 !important;
|
35695
|
+
position: relative;
|
35696
|
+
min-height: 3.2rem; }
|
35697
|
+
.autocomplete .suggestion-list--loader > div {
|
35698
|
+
padding: 0.5rem 1rem;
|
35699
|
+
min-height: 3.2rem;
|
35690
35700
|
position: relative; }
|
35691
|
-
|
35692
|
-
|
35693
|
-
|
35694
|
-
|
35695
|
-
|
35696
|
-
|
35697
|
-
|
35698
|
-
|
35699
|
-
|
35700
|
-
|
35701
|
-
.
|
35702
|
-
|
35703
|
-
|
35704
|
-
|
35705
|
-
|
35706
|
-
|
35707
|
-
|
35708
|
-
|
35709
|
-
|
35710
|
-
text-overflow: ellipsis;
|
35711
|
-
color: var(--color-text);
|
35712
|
-
transition: all ease 0.2s;
|
35713
|
-
min-height: 3.2rem; }
|
35714
|
-
tags-input .autocomplete .suggestion-item.selected,
|
35715
|
-
.tags-input .autocomplete .suggestion-item.selected {
|
35716
|
-
background-color: var(--sd-colour-interactive--alpha-30); }
|
35717
|
-
tags-input .autocomplete .suggestion-item.selected:active,
|
35718
|
-
.tags-input .autocomplete .suggestion-item.selected:active {
|
35719
|
-
background-color: var(--sd-colour-interactive--alpha-70);
|
35720
|
-
color: white; }
|
35721
|
-
tags-input .autocomplete .suggestion-item[disabled], tags-input .autocomplete .suggestion-item[disabled]:hover, tags-input .autocomplete .suggestion-item[disabled]:active,
|
35722
|
-
.tags-input .autocomplete .suggestion-item[disabled],
|
35723
|
-
.tags-input .autocomplete .suggestion-item[disabled]:hover,
|
35724
|
-
.tags-input .autocomplete .suggestion-item[disabled]:active {
|
35725
|
-
background-color: transparent;
|
35726
|
-
opacity: 0.45;
|
35727
|
-
cursor: default;
|
35728
|
-
pointer-events: none; }
|
35729
|
-
tags-input .autocomplete .suggestion-item .suggestion-item__icon,
|
35730
|
-
.tags-input .autocomplete .suggestion-item .suggestion-item__icon {
|
35731
|
-
display: flex;
|
35732
|
-
align-items: center;
|
35733
|
-
justify-content: center;
|
35734
|
-
opacity: 0.5; }
|
35735
|
-
tags-input .autocomplete .suggestion-item--multi-select,
|
35736
|
-
.tags-input .autocomplete .suggestion-item--multi-select {
|
35737
|
-
display: flex;
|
35738
|
-
align-items: center; }
|
35739
|
-
tags-input .autocomplete .suggestion-item--btn,
|
35740
|
-
.tags-input .autocomplete .suggestion-item--btn {
|
35701
|
+
.autocomplete .suggestion-item {
|
35702
|
+
position: relative;
|
35703
|
+
white-space: nowrap;
|
35704
|
+
overflow: hidden;
|
35705
|
+
text-overflow: ellipsis;
|
35706
|
+
color: var(--color-text);
|
35707
|
+
transition: all ease 0.2s;
|
35708
|
+
min-height: 3.2rem; }
|
35709
|
+
.autocomplete .suggestion-item.selected {
|
35710
|
+
background-color: var(--sd-colour-interactive--alpha-30); }
|
35711
|
+
.autocomplete .suggestion-item.selected:active {
|
35712
|
+
background-color: var(--sd-colour-interactive--alpha-70);
|
35713
|
+
color: white; }
|
35714
|
+
.autocomplete .suggestion-item[disabled], .autocomplete .suggestion-item[disabled]:hover, .autocomplete .suggestion-item[disabled]:active {
|
35715
|
+
background-color: transparent;
|
35716
|
+
opacity: 0.45;
|
35717
|
+
cursor: default;
|
35718
|
+
pointer-events: none; }
|
35719
|
+
.autocomplete .suggestion-item .suggestion-item__icon {
|
35741
35720
|
display: flex;
|
35742
|
-
justify-content: space-between;
|
35743
35721
|
align-items: center;
|
35744
|
-
cursor: pointer;
|
35745
|
-
width: 100%;
|
35746
|
-
padding: 0.5rem 1rem; }
|
35747
|
-
tags-input .autocomplete .suggestion-item--btn:focus,
|
35748
|
-
.tags-input .autocomplete .suggestion-item--btn:focus {
|
35749
|
-
background-color: transparent;
|
35750
|
-
box-shadow: var(--sd-shadow__menu-item--focus-inner);
|
35751
|
-
text-decoration: none;
|
35752
|
-
outline: none; }
|
35753
|
-
tags-input .autocomplete .suggestion-item--btn:hover,
|
35754
|
-
.tags-input .autocomplete .suggestion-item--btn:hover {
|
35755
|
-
background-color: var(--sd-colour-interactive--alpha-10) !important; }
|
35756
|
-
tags-input .autocomplete .suggestion-item--bgcolor,
|
35757
|
-
.tags-input .autocomplete .suggestion-item--bgcolor {
|
35758
|
-
min-height: 1.5em;
|
35759
|
-
min-width: 1.5em;
|
35760
|
-
padding: 4px 0;
|
35761
|
-
display: inline-flex;
|
35762
35722
|
justify-content: center;
|
35763
|
-
align-items: center;
|
35764
|
-
border-radius: 99px;
|
35765
|
-
white-space: nowrap; }
|
35766
|
-
tags-input .autocomplete .suggestion-item--bgcolor[style*="background-color"],
|
35767
|
-
.tags-input .autocomplete .suggestion-item--bgcolor[style*="background-color"] {
|
35768
|
-
padding-inline: 8px; }
|
35769
|
-
tags-input .autocomplete .suggestion-item--disabled,
|
35770
|
-
.tags-input .autocomplete .suggestion-item--disabled {
|
35771
35723
|
opacity: 0.5; }
|
35772
|
-
|
35773
|
-
|
35774
|
-
|
35775
|
-
|
35776
|
-
|
35777
|
-
|
35778
|
-
|
35779
|
-
|
35780
|
-
|
35781
|
-
|
35782
|
-
|
35783
|
-
|
35784
|
-
|
35724
|
+
.autocomplete .suggestion-item--multi-select {
|
35725
|
+
display: flex;
|
35726
|
+
align-items: center; }
|
35727
|
+
.autocomplete .suggestion-item--btn {
|
35728
|
+
display: flex;
|
35729
|
+
justify-content: space-between;
|
35730
|
+
align-items: center;
|
35731
|
+
cursor: pointer;
|
35732
|
+
width: 100%;
|
35733
|
+
padding: 0.5rem 1rem; }
|
35734
|
+
.autocomplete .suggestion-item--btn:focus {
|
35735
|
+
background-color: transparent;
|
35736
|
+
box-shadow: var(--sd-shadow__menu-item--focus-inner);
|
35737
|
+
text-decoration: none;
|
35738
|
+
outline: none; }
|
35739
|
+
.autocomplete .suggestion-item--btn:hover {
|
35740
|
+
background-color: var(--sd-colour-interactive--alpha-10) !important; }
|
35741
|
+
.autocomplete .suggestion-item--bgcolor {
|
35742
|
+
min-height: 1.5em;
|
35743
|
+
min-width: 1.5em;
|
35744
|
+
padding: 4px 0;
|
35745
|
+
display: inline-flex;
|
35746
|
+
justify-content: center;
|
35747
|
+
align-items: center;
|
35748
|
+
border-radius: 99px;
|
35749
|
+
white-space: nowrap; }
|
35750
|
+
.autocomplete .suggestion-item--bgcolor[style*="background-color"] {
|
35751
|
+
padding-inline: 8px; }
|
35752
|
+
.autocomplete .suggestion-item--disabled {
|
35753
|
+
opacity: 0.5; }
|
35754
|
+
.autocomplete .suggestion-item--nothing-found {
|
35755
|
+
padding: 0.5rem 1rem;
|
35756
|
+
cursor: not-allowed;
|
35757
|
+
white-space: nowrap;
|
35758
|
+
overflow: hidden;
|
35759
|
+
text-overflow: ellipsis;
|
35760
|
+
color: var(--color-text-light);
|
35761
|
+
transition: all ease 0.2s;
|
35762
|
+
min-height: 3.2rem;
|
35763
|
+
display: flex;
|
35764
|
+
align-items: center;
|
35765
|
+
justify-content: center; }
|
35785
35766
|
|
35786
35767
|
.tags-input {
|
35787
35768
|
padding-inline: 0 !important;
|
@@ -35814,103 +35795,106 @@ tags-input,
|
|
35814
35795
|
.tags-input .tags-input__helper-box {
|
35815
35796
|
display: flex;
|
35816
35797
|
align-items: center; }
|
35817
|
-
|
35818
|
-
|
35798
|
+
|
35799
|
+
.autocomplete {
|
35800
|
+
position: absolute;
|
35801
|
+
padding: 0;
|
35802
|
+
padding-block-start: 0.5rem;
|
35803
|
+
padding-block-end: 0.5rem;
|
35804
|
+
z-index: 999;
|
35805
|
+
width: 100%;
|
35806
|
+
border-radius: var(--b-radius--small);
|
35807
|
+
background-color: var(--color-dropdown-menu-Bg);
|
35808
|
+
box-shadow: var(--sd-shadow__dropdown); }
|
35809
|
+
.autocomplete .autocomplete__header {
|
35810
|
+
display: flex;
|
35811
|
+
align-items: center;
|
35812
|
+
justify-content: center;
|
35813
|
+
gap: 4px;
|
35814
|
+
border-bottom: 1px solid var(--sd-colour-line--light);
|
35815
|
+
padding: 4px; }
|
35816
|
+
.autocomplete .autocomplete__category-header {
|
35817
|
+
display: flex;
|
35818
|
+
align-items: center;
|
35819
|
+
justify-content: center;
|
35820
|
+
gap: 4px;
|
35821
|
+
border-bottom: 1px solid var(--sd-colour-line--x-light);
|
35822
|
+
padding: 4px; }
|
35823
|
+
.autocomplete .autocomplete__icon {
|
35824
|
+
display: flex;
|
35825
|
+
align-items: center;
|
35826
|
+
justify-content: center;
|
35827
|
+
height: 35px;
|
35828
|
+
width: 35px; }
|
35829
|
+
.autocomplete .autocomplete__icon:hover .arrow-left {
|
35830
|
+
color: var(--sd-colour-interactive--alpha-70);
|
35831
|
+
transition: 0.2s;
|
35832
|
+
transform: translate(-3px); }
|
35833
|
+
.autocomplete .autocomplete__icon .arrow-left {
|
35834
|
+
cursor: pointer; }
|
35835
|
+
.autocomplete .autocomplete__icon .search {
|
35836
|
+
cursor: default;
|
35837
|
+
opacity: 0.65; }
|
35838
|
+
.autocomplete .autocomplete__filter {
|
35839
|
+
height: 32px;
|
35840
|
+
width: 100%;
|
35841
|
+
display: flex;
|
35842
|
+
align-items: center;
|
35843
|
+
gap: 4px; }
|
35844
|
+
.autocomplete .autocomplete__button {
|
35845
|
+
height: 32px;
|
35846
|
+
padding: 0 15px;
|
35847
|
+
font-weight: 600;
|
35848
|
+
width: auto;
|
35849
|
+
cursor: default;
|
35850
|
+
margin-inline-start: auto; }
|
35851
|
+
.autocomplete .autocomplete__category-title {
|
35852
|
+
font-weight: 600;
|
35819
35853
|
padding: 0;
|
35820
|
-
|
35821
|
-
|
35822
|
-
|
35854
|
+
cursor: default; }
|
35855
|
+
.autocomplete .autocomplete__input {
|
35856
|
+
height: 32px;
|
35823
35857
|
width: 100%;
|
35858
|
+
padding: 4px;
|
35859
|
+
border: none;
|
35860
|
+
background-color: transparent;
|
35861
|
+
color: var(--color-text); }
|
35862
|
+
.autocomplete .autocomplete__input::placeholder {
|
35863
|
+
color: var(--color-text-lighter);
|
35864
|
+
font-weight: 300; }
|
35865
|
+
.autocomplete .autocomplete__button--multi-select {
|
35866
|
+
background-color: transparent;
|
35867
|
+
border: 1px solid var(--sd-colour-interactive--alpha-50);
|
35824
35868
|
border-radius: var(--b-radius--small);
|
35825
|
-
|
35826
|
-
|
35827
|
-
|
35828
|
-
|
35829
|
-
|
35830
|
-
|
35831
|
-
|
35832
|
-
|
35833
|
-
|
35834
|
-
|
35835
|
-
|
35836
|
-
|
35837
|
-
|
35838
|
-
|
35839
|
-
border
|
35840
|
-
|
35841
|
-
.
|
35842
|
-
|
35843
|
-
|
35844
|
-
|
35845
|
-
|
35846
|
-
|
35847
|
-
|
35848
|
-
|
35849
|
-
|
35850
|
-
|
35851
|
-
|
35852
|
-
|
35853
|
-
|
35854
|
-
cursor: default;
|
35855
|
-
opacity: 0.65; }
|
35856
|
-
.tags-input .autocomplete .autocomplete__filter {
|
35857
|
-
height: 32px;
|
35858
|
-
width: 100%;
|
35859
|
-
display: flex;
|
35860
|
-
align-items: center;
|
35861
|
-
gap: 4px; }
|
35862
|
-
.tags-input .autocomplete .autocomplete__button {
|
35863
|
-
height: 32px;
|
35864
|
-
padding: 0 15px;
|
35865
|
-
font-weight: 600;
|
35866
|
-
width: auto;
|
35867
|
-
cursor: default;
|
35868
|
-
margin-inline-start: auto; }
|
35869
|
-
.tags-input .autocomplete .autocomplete__category-title {
|
35870
|
-
font-weight: 600;
|
35871
|
-
padding: 0;
|
35872
|
-
cursor: default; }
|
35873
|
-
.tags-input .autocomplete .autocomplete__input {
|
35874
|
-
height: 32px;
|
35875
|
-
width: 100%;
|
35876
|
-
padding: 4px;
|
35877
|
-
border: none;
|
35878
|
-
background-color: transparent;
|
35879
|
-
color: var(--color-text); }
|
35880
|
-
.tags-input .autocomplete .autocomplete__input::placeholder {
|
35881
|
-
color: var(--color-text-lighter);
|
35882
|
-
font-weight: 300; }
|
35883
|
-
.tags-input .autocomplete .autocomplete__button--multi-select {
|
35884
|
-
background-color: transparent;
|
35885
|
-
border: 1px solid var(--sd-colour-interactive--alpha-50);
|
35886
|
-
border-radius: var(--b-radius--small);
|
35887
|
-
color: var(--sd-colour-interactive);
|
35888
|
-
cursor: pointer;
|
35889
|
-
transition: all ease 0.2s;
|
35890
|
-
font-size: 1.3rem;
|
35891
|
-
font-weight: 400;
|
35892
|
-
margin-inline-end: 0.8rem;
|
35893
|
-
height: 2.8rem; }
|
35894
|
-
.tags-input .autocomplete .autocomplete__button--multi-select:hover {
|
35895
|
-
border: 1px solid var(--sd-colour-interactive);
|
35896
|
-
box-shadow: inset 0 0 0 2px var(--sd-colour-interactive--alpha-20); }
|
35897
|
-
.tags-input .autocomplete .autocomplete__button--multi-select:focus {
|
35898
|
-
border: 1px solid var(--sd-colour-interactive);
|
35899
|
-
box-shadow: inset 0 0 0 2px var(--sd-colour-interactive--alpha-20); }
|
35900
|
-
.tags-input .autocomplete .autocomplete__button--multi-select:active {
|
35901
|
-
border: 1px solid var(--sd-colour-interactive);
|
35902
|
-
box-shadow: inset 0 0 0 3px var(--sd-colour-interactive--alpha-30); }
|
35903
|
-
.tags-input .autocomplete .autocomplete__button--multi-select.autocomplete__button--disabled, .tags-input .autocomplete .autocomplete__button--multi-select.autocomplete__button--disabled:hover {
|
35904
|
-
opacity: 0.75;
|
35905
|
-
border: 1px solid var(--sd-colour-line--light);
|
35906
|
-
color: var(--color-text-light);
|
35907
|
-
cursor: not-allowed;
|
35908
|
-
box-shadow: none; }
|
35909
|
-
.tags-input .autocomplete--multi-select {
|
35910
|
-
padding: 0 !important;
|
35911
|
-
margin-block-start: 0; }
|
35912
|
-
.tags-input .autocomplete--fixed-width {
|
35913
|
-
width: 275px !important; }
|
35869
|
+
color: var(--sd-colour-interactive);
|
35870
|
+
cursor: pointer;
|
35871
|
+
transition: all ease 0.2s;
|
35872
|
+
font-size: 1.3rem;
|
35873
|
+
font-weight: 400;
|
35874
|
+
margin-inline-end: 0.8rem;
|
35875
|
+
height: 2.8rem; }
|
35876
|
+
.autocomplete .autocomplete__button--multi-select:hover {
|
35877
|
+
border: 1px solid var(--sd-colour-interactive);
|
35878
|
+
box-shadow: inset 0 0 0 2px var(--sd-colour-interactive--alpha-20); }
|
35879
|
+
.autocomplete .autocomplete__button--multi-select:focus {
|
35880
|
+
border: 1px solid var(--sd-colour-interactive);
|
35881
|
+
box-shadow: inset 0 0 0 2px var(--sd-colour-interactive--alpha-20); }
|
35882
|
+
.autocomplete .autocomplete__button--multi-select:active {
|
35883
|
+
border: 1px solid var(--sd-colour-interactive);
|
35884
|
+
box-shadow: inset 0 0 0 3px var(--sd-colour-interactive--alpha-30); }
|
35885
|
+
.autocomplete .autocomplete__button--multi-select.autocomplete__button--disabled, .autocomplete .autocomplete__button--multi-select.autocomplete__button--disabled:hover {
|
35886
|
+
opacity: 0.75;
|
35887
|
+
border: 1px solid var(--sd-colour-line--light);
|
35888
|
+
color: var(--color-text-light);
|
35889
|
+
cursor: not-allowed;
|
35890
|
+
box-shadow: none; }
|
35891
|
+
|
35892
|
+
.autocomplete--multi-select {
|
35893
|
+
padding: 0 !important;
|
35894
|
+
margin-block-start: 0; }
|
35895
|
+
|
35896
|
+
.autocomplete--fixed-width {
|
35897
|
+
width: 275px !important; }
|
35914
35898
|
|
35915
35899
|
.tags-input--single-select {
|
35916
35900
|
display: grid !important;
|