@transferwise/components 46.6.0 → 46.8.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/build/index.esm.js +290 -346
- package/build/index.esm.js.map +1 -1
- package/build/index.js +290 -345
- package/build/index.js.map +1 -1
- package/build/main.css +107 -17
- package/build/styles/inputs/Input.css +0 -4
- package/build/styles/inputs/SelectInput.css +6 -1
- package/build/styles/inputs/TextArea.css +0 -4
- package/build/styles/main.css +107 -17
- package/build/styles/segmentedControl/SegmentedControl.css +101 -0
- package/build/styles/select/Select.css +0 -4
- package/build/types/common/locale/index.d.ts +26 -43
- package/build/types/common/locale/index.d.ts.map +1 -1
- package/build/types/index.d.ts +3 -0
- package/build/types/index.d.ts.map +1 -1
- package/build/types/inputs/SelectInput.d.ts +6 -5
- package/build/types/inputs/SelectInput.d.ts.map +1 -1
- package/build/types/phoneNumberInput/PhoneNumberInput.d.ts +22 -27
- package/build/types/phoneNumberInput/PhoneNumberInput.d.ts.map +1 -1
- package/build/types/phoneNumberInput/data/countries.d.ts +5 -10
- package/build/types/phoneNumberInput/data/countries.d.ts.map +1 -1
- package/build/types/phoneNumberInput/index.d.ts +1 -1
- package/build/types/phoneNumberInput/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/cleanNumber/cleanNumber.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/cleanNumber/cleanNumber.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/cleanNumber/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/cleanNumber/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/excludeCountries/excludeCountries.d.ts +8 -1
- package/build/types/phoneNumberInput/utils/excludeCountries/excludeCountries.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/excludeCountries/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/excludeCountries/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/explodeNumberModel/index.d.ts +8 -4
- package/build/types/phoneNumberInput/utils/explodeNumberModel/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/findCountryByCode/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/findCountryByCode/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/findCountryByPrefix/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/findCountryByPrefix/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.d.ts +2 -1
- package/build/types/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/groupCountriesByPrefix/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/groupCountriesByPrefix/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/index.d.ts +11 -13
- package/build/types/phoneNumberInput/utils/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/isStringNumeric/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/isStringNumeric/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/isStringNumeric/isStringNumeric.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/isStringNumeric/isStringNumeric.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/isValidPhoneNumber/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/isValidPhoneNumber/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.d.ts +6 -1
- package/build/types/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/longestMatchingPrefix/index.d.ts +2 -1
- package/build/types/phoneNumberInput/utils/longestMatchingPrefix/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/setDefaultPrefix/index.d.ts +7 -1
- package/build/types/phoneNumberInput/utils/setDefaultPrefix/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/sortArrayByProperty/index.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/sortArrayByProperty/index.d.ts.map +1 -1
- package/build/types/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.d.ts +1 -1
- package/build/types/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.d.ts.map +1 -1
- package/build/types/segmentedControl/SegmentedControl.d.ts +31 -0
- package/build/types/segmentedControl/SegmentedControl.d.ts.map +1 -0
- package/build/types/segmentedControl/index.d.ts +3 -0
- package/build/types/segmentedControl/index.d.ts.map +1 -0
- package/package.json +7 -17
- package/src/common/locale/{index.spec.js → index.spec.ts} +4 -4
- package/src/common/locale/index.ts +96 -0
- package/src/index.ts +3 -0
- package/src/inputs/Input.css +0 -4
- package/src/inputs/SelectInput.css +6 -1
- package/src/inputs/SelectInput.less +8 -1
- package/src/inputs/SelectInput.spec.tsx +26 -0
- package/src/inputs/SelectInput.story.tsx +73 -1
- package/src/inputs/SelectInput.tsx +104 -85
- package/src/inputs/TextArea.css +0 -4
- package/src/main.css +107 -17
- package/src/main.less +1 -0
- package/src/phoneNumberInput/PhoneNumberInput.spec.js +18 -22
- package/src/phoneNumberInput/PhoneNumberInput.tsx +193 -0
- package/src/phoneNumberInput/data/{countries.js → countries.ts} +9 -1
- package/src/phoneNumberInput/utils/cleanNumber/cleanNumber.ts +3 -0
- package/src/phoneNumberInput/utils/excludeCountries/{excludeCountries.spec.js → excludeCountries.spec.ts} +1 -1
- package/src/phoneNumberInput/utils/excludeCountries/{excludeCountries.js → excludeCountries.ts} +6 -5
- package/src/phoneNumberInput/utils/explodeNumberModel/{explodeNumberModel.spec.js → explodeNumberModel.spec.ts} +1 -1
- package/src/phoneNumberInput/utils/explodeNumberModel/index.ts +24 -0
- package/src/phoneNumberInput/utils/findCountryByCode/{findCountryByCode.spec.js → findCountryByCode.spec.ts} +0 -1
- package/src/phoneNumberInput/utils/findCountryByCode/index.ts +12 -0
- package/src/phoneNumberInput/utils/findCountryByPrefix/index.ts +12 -0
- package/src/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.spec.ts +102 -0
- package/src/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.ts +12 -0
- package/src/phoneNumberInput/utils/{index.js → index.ts} +0 -2
- package/src/phoneNumberInput/utils/isStringNumeric/{isStringNumeric.spec.js → isStringNumeric.spec.ts} +0 -1
- package/src/phoneNumberInput/utils/isStringNumeric/isStringNumeric.ts +1 -0
- package/src/phoneNumberInput/utils/isValidPhoneNumber/{isValidPhoneNumber.spec.js → isValidPhoneNumber.spec.ts} +1 -1
- package/src/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.ts +7 -0
- package/src/phoneNumberInput/utils/longestMatchingPrefix/index.ts +4 -0
- package/src/phoneNumberInput/utils/setDefaultPrefix/index.ts +20 -0
- package/src/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.ts +6 -0
- package/src/segmentedControl/SegmentedControl.css +101 -0
- package/src/segmentedControl/SegmentedControl.less +101 -0
- package/src/segmentedControl/SegmentedControl.spec.tsx +106 -0
- package/src/segmentedControl/SegmentedControl.story.tsx +55 -0
- package/src/segmentedControl/SegmentedControl.tsx +175 -0
- package/src/segmentedControl/index.ts +2 -0
- package/src/select/Select.css +0 -4
- package/src/ssr.spec.js +17 -0
- package/src/withDisplayFormat/WithDisplayFormat.spec.js +1 -1
- package/src/withDisplayFormat/WithDisplayFormat.tsx +1 -1
- package/build/types/phoneNumberInput/utils/filterOptionsForQuery/index.d.ts +0 -2
- package/build/types/phoneNumberInput/utils/filterOptionsForQuery/index.d.ts.map +0 -1
- package/build/types/phoneNumberInput/utils/isOptionAndFitsQuery/index.d.ts +0 -2
- package/build/types/phoneNumberInput/utils/isOptionAndFitsQuery/index.d.ts.map +0 -1
- package/build/types/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.d.ts +0 -3
- package/build/types/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.d.ts.map +0 -1
- package/build/types/utilities/wrapInFragment.d.ts +0 -3
- package/build/types/utilities/wrapInFragment.d.ts.map +0 -1
- package/src/common/locale/index.js +0 -139
- package/src/phoneNumberInput/PhoneNumberInput.js +0 -210
- package/src/phoneNumberInput/data/countries.spec.js +0 -12
- package/src/phoneNumberInput/utils/cleanNumber/cleanNumber.js +0 -4
- package/src/phoneNumberInput/utils/explodeNumberModel/index.js +0 -27
- package/src/phoneNumberInput/utils/filterOptionsForQuery/filterOptionsForQuery.spec.js +0 -36
- package/src/phoneNumberInput/utils/filterOptionsForQuery/index.js +0 -11
- package/src/phoneNumberInput/utils/findCountryByCode/index.js +0 -10
- package/src/phoneNumberInput/utils/findCountryByPrefix/index.js +0 -11
- package/src/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.js +0 -26
- package/src/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.spec.js +0 -67
- package/src/phoneNumberInput/utils/isOptionAndFitsQuery/index.js +0 -1
- package/src/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.js +0 -25
- package/src/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.spec.js +0 -66
- package/src/phoneNumberInput/utils/isStringNumeric/isStringNumeric.js +0 -1
- package/src/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.js +0 -10
- package/src/phoneNumberInput/utils/longestMatchingPrefix/index.js +0 -2
- package/src/phoneNumberInput/utils/setDefaultPrefix/index.js +0 -25
- package/src/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.js +0 -3
- package/src/utilities/wrapInFragment.tsx +0 -3
- /package/src/phoneNumberInput/{PhoneNumberInput.story.js → PhoneNumberInput.story.tsx} +0 -0
- /package/src/phoneNumberInput/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/cleanNumber/{cleanNumber.spec.js → cleanNumber.spec.ts} +0 -0
- /package/src/phoneNumberInput/utils/cleanNumber/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/excludeCountries/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/findCountryByPrefix/{findCountryByPrefix.spec.js → findCountryByPrefix.spec.ts} +0 -0
- /package/src/phoneNumberInput/utils/groupCountriesByPrefix/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/isStringNumeric/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/isValidPhoneNumber/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/longestMatchingPrefix/{longestMatchingPrefix.spec.js → longestMatchingPrefix.spec.ts} +0 -0
- /package/src/phoneNumberInput/utils/setDefaultPrefix/{setDefaultPrefix.spec.js → setDefaultPrefix.spec.ts} +0 -0
- /package/src/phoneNumberInput/utils/sortArrayByProperty/{index.js → index.ts} +0 -0
- /package/src/phoneNumberInput/utils/sortArrayByProperty/{sortArrayByProperty.spec.js → sortArrayByProperty.spec.ts} +0 -0
package/build/main.css
CHANGED
|
@@ -74,14 +74,6 @@ div.critical-comms .critical-comms-body {
|
|
|
74
74
|
flex-wrap: wrap;
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
|
-
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
78
|
-
font-weight: 400;
|
|
79
|
-
font-weight: var(--font-weight-regular);line-height: 1.5;line-height: var(--line-height-body);
|
|
80
|
-
}
|
|
81
|
-
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
82
|
-
font-size: 1rem;
|
|
83
|
-
font-size: var(--font-size-16);
|
|
84
|
-
}
|
|
85
77
|
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
86
78
|
font-size: 0.875rem;
|
|
87
79
|
font-size: var(--font-size-14);line-height: 155%;letter-spacing: -0.006em;font-weight: 400;font-weight: var(--font-weight-regular);
|
|
@@ -2226,10 +2218,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2226
2218
|
padding-bottom: 0 !important;
|
|
2227
2219
|
}
|
|
2228
2220
|
.np-form-control--size-sm {
|
|
2229
|
-
line-height: 1.5;
|
|
2230
|
-
line-height: var(--line-height-body);
|
|
2231
|
-
font-size: 1rem;
|
|
2232
|
-
font-size: var(--font-size-16);
|
|
2233
2221
|
font-size: 0.875rem;
|
|
2234
2222
|
font-size: var(--font-size-14);
|
|
2235
2223
|
line-height: 155%;
|
|
@@ -2511,10 +2499,12 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2511
2499
|
color: #5d7079;
|
|
2512
2500
|
color: var(--color-content-secondary);
|
|
2513
2501
|
}
|
|
2514
|
-
.np-select-input-
|
|
2502
|
+
.np-select-input-content {
|
|
2515
2503
|
overflow: hidden;
|
|
2516
2504
|
text-overflow: ellipsis;
|
|
2517
2505
|
white-space: nowrap;
|
|
2506
|
+
}
|
|
2507
|
+
.np-select-input-placeholder {
|
|
2518
2508
|
color: #768e9c;
|
|
2519
2509
|
color: var(--color-content-tertiary);
|
|
2520
2510
|
}
|
|
@@ -2622,6 +2612,9 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2622
2612
|
padding: var(--size-12) var(--size-16);
|
|
2623
2613
|
color: var(--color-interactive-primary);
|
|
2624
2614
|
}
|
|
2615
|
+
.np-select-input-option-container:focus {
|
|
2616
|
+
outline: none;
|
|
2617
|
+
}
|
|
2625
2618
|
.np-select-input-option-container--active {
|
|
2626
2619
|
box-shadow: inset 0 0 0 1px #c9cbce;
|
|
2627
2620
|
box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
|
|
@@ -4455,10 +4448,6 @@ html:not([dir="rtl"]) .np-navigation-option {
|
|
|
4455
4448
|
border-radius: var(--radius-small);
|
|
4456
4449
|
color: #37517e;
|
|
4457
4450
|
color: var(--color-content-primary);
|
|
4458
|
-
line-height: 1.5;
|
|
4459
|
-
line-height: var(--line-height-body);
|
|
4460
|
-
font-size: 1rem;
|
|
4461
|
-
font-size: var(--font-size-16);
|
|
4462
4451
|
font-size: 0.875rem;
|
|
4463
4452
|
font-size: var(--font-size-14);
|
|
4464
4453
|
line-height: 155%;
|
|
@@ -4640,6 +4629,107 @@ html:not([dir="rtl"]) .np-navigation-option {
|
|
|
4640
4629
|
.np-theme-personal .np-dropdown-menu .np-dropdown-item--focused {
|
|
4641
4630
|
box-shadow: inset 0 0 0 2px var(--color-interactive-primary);
|
|
4642
4631
|
}
|
|
4632
|
+
.segmented-control {
|
|
4633
|
+
box-sizing: border-box;
|
|
4634
|
+
--segment-highlight-width: 0;
|
|
4635
|
+
--segment-highlight-x: var(--size-4);
|
|
4636
|
+
}
|
|
4637
|
+
.segmented-control__segments {
|
|
4638
|
+
display: inline-flex;
|
|
4639
|
+
position: relative;
|
|
4640
|
+
padding: 4px;
|
|
4641
|
+
padding: var(--size-4);
|
|
4642
|
+
width: 100%;
|
|
4643
|
+
justify-content: center;
|
|
4644
|
+
align-items: center;
|
|
4645
|
+
background: rgba(134,167,189,0.10196);
|
|
4646
|
+
background: var(--color-background-neutral);
|
|
4647
|
+
border-radius: 24px;
|
|
4648
|
+
border-radius: var(--size-24);
|
|
4649
|
+
transition: outline 300ms;
|
|
4650
|
+
outline: 2px solid transparent;
|
|
4651
|
+
}
|
|
4652
|
+
.segmented-control--input:has(:focus-visible) > .segmented-control__segments::after {
|
|
4653
|
+
outline: 2px solid var(--color-interactive-primary);
|
|
4654
|
+
}
|
|
4655
|
+
.segmented-control__segments::after {
|
|
4656
|
+
content: "";
|
|
4657
|
+
position: absolute;
|
|
4658
|
+
width: var(--segment-highlight-width);
|
|
4659
|
+
top: 4px;
|
|
4660
|
+
top: var(--size-4);
|
|
4661
|
+
bottom: 4px;
|
|
4662
|
+
bottom: var(--size-4);
|
|
4663
|
+
left: var(--segment-highlight-x);
|
|
4664
|
+
z-index: 0;
|
|
4665
|
+
background: #ffffff;
|
|
4666
|
+
background: var(--color-background-screen);
|
|
4667
|
+
border-radius: 24px;
|
|
4668
|
+
border-radius: var(--size-24);
|
|
4669
|
+
transition: left 300ms;
|
|
4670
|
+
}
|
|
4671
|
+
.segmented-control__segments--no-animate::after {
|
|
4672
|
+
transition: none !important;
|
|
4673
|
+
}
|
|
4674
|
+
.segmented-control__segment {
|
|
4675
|
+
position: relative;
|
|
4676
|
+
flex: 1 1 100%;
|
|
4677
|
+
flex-flow: column;
|
|
4678
|
+
padding: 8px 16px;
|
|
4679
|
+
padding: var(--size-8) var(--size-16);
|
|
4680
|
+
margin: 0 0 0 4px;
|
|
4681
|
+
margin: 0 0 0 var(--size-4);
|
|
4682
|
+
min-width: 0;
|
|
4683
|
+
line-height: inherit;
|
|
4684
|
+
align-items: center;
|
|
4685
|
+
text-align: center;
|
|
4686
|
+
vertical-align: middle;
|
|
4687
|
+
border-radius: 24px;
|
|
4688
|
+
border-radius: var(--size-24);
|
|
4689
|
+
z-index: 1;
|
|
4690
|
+
cursor: pointer;
|
|
4691
|
+
transition: background 300ms;
|
|
4692
|
+
color: var(--color-interactive-primary);
|
|
4693
|
+
}
|
|
4694
|
+
.segmented-control__segment:first-child {
|
|
4695
|
+
margin-left: 0;
|
|
4696
|
+
}
|
|
4697
|
+
.segmented-control__segment:hover {
|
|
4698
|
+
background: rgba(0,0,0,0.10196);
|
|
4699
|
+
background: var(--color-background-overlay);
|
|
4700
|
+
}
|
|
4701
|
+
.segmented-control__radio-input {
|
|
4702
|
+
position: fixed;
|
|
4703
|
+
opacity: 0;
|
|
4704
|
+
pointer-events: none;
|
|
4705
|
+
}
|
|
4706
|
+
.segmented-control__button {
|
|
4707
|
+
width: 100%;
|
|
4708
|
+
height: 100%;
|
|
4709
|
+
background: none;
|
|
4710
|
+
-webkit-appearance: none;
|
|
4711
|
+
-moz-appearance: none;
|
|
4712
|
+
appearance: none;
|
|
4713
|
+
border: none;
|
|
4714
|
+
outline: none;
|
|
4715
|
+
font: inherit;
|
|
4716
|
+
outline: 2px solid transparent;
|
|
4717
|
+
}
|
|
4718
|
+
.segmented-control__button:focus {
|
|
4719
|
+
outline-offset: 0px;
|
|
4720
|
+
}
|
|
4721
|
+
.segmented-control__button:focus-visible {
|
|
4722
|
+
outline-color: var(--color-interactive-primary);
|
|
4723
|
+
}
|
|
4724
|
+
.segmented-control__selected-segment:hover {
|
|
4725
|
+
background: transparent;
|
|
4726
|
+
}
|
|
4727
|
+
.segmented-control__text {
|
|
4728
|
+
word-wrap: break-word;
|
|
4729
|
+
word-break: break-word;
|
|
4730
|
+
color: var(--color-interactive-primary);
|
|
4731
|
+
transition: font-weight 300ms;
|
|
4732
|
+
}
|
|
4643
4733
|
.np-summary {
|
|
4644
4734
|
min-width: 280px;
|
|
4645
4735
|
}
|
|
@@ -47,10 +47,6 @@
|
|
|
47
47
|
padding-top: 0 !important;
|
|
48
48
|
padding-bottom: 0 !important;
|
|
49
49
|
}.np-form-control--size-sm {
|
|
50
|
-
line-height: 1.5;
|
|
51
|
-
line-height: var(--line-height-body);
|
|
52
|
-
font-size: 1rem;
|
|
53
|
-
font-size: var(--font-size-16);
|
|
54
50
|
font-size: 0.875rem;
|
|
55
51
|
font-size: var(--font-size-14);
|
|
56
52
|
line-height: 155%;
|
|
@@ -158,10 +158,12 @@
|
|
|
158
158
|
color: #5d7079;
|
|
159
159
|
color: var(--color-content-secondary);
|
|
160
160
|
}
|
|
161
|
-
.np-select-input-
|
|
161
|
+
.np-select-input-content {
|
|
162
162
|
overflow: hidden;
|
|
163
163
|
text-overflow: ellipsis;
|
|
164
164
|
white-space: nowrap;
|
|
165
|
+
}
|
|
166
|
+
.np-select-input-placeholder {
|
|
165
167
|
color: #768e9c;
|
|
166
168
|
color: var(--color-content-tertiary);
|
|
167
169
|
}
|
|
@@ -269,6 +271,9 @@
|
|
|
269
271
|
padding: var(--size-12) var(--size-16);
|
|
270
272
|
color: var(--color-interactive-primary);
|
|
271
273
|
}
|
|
274
|
+
.np-select-input-option-container:focus {
|
|
275
|
+
outline: none;
|
|
276
|
+
}
|
|
272
277
|
.np-select-input-option-container--active {
|
|
273
278
|
box-shadow: inset 0 0 0 1px #c9cbce;
|
|
274
279
|
box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
|
|
@@ -47,10 +47,6 @@
|
|
|
47
47
|
padding-top: 0 !important;
|
|
48
48
|
padding-bottom: 0 !important;
|
|
49
49
|
}.np-form-control--size-sm {
|
|
50
|
-
line-height: 1.5;
|
|
51
|
-
line-height: var(--line-height-body);
|
|
52
|
-
font-size: 1rem;
|
|
53
|
-
font-size: var(--font-size-16);
|
|
54
50
|
font-size: 0.875rem;
|
|
55
51
|
font-size: var(--font-size-14);
|
|
56
52
|
line-height: 155%;
|
package/build/styles/main.css
CHANGED
|
@@ -74,14 +74,6 @@ div.critical-comms .critical-comms-body {
|
|
|
74
74
|
flex-wrap: wrap;
|
|
75
75
|
}
|
|
76
76
|
}
|
|
77
|
-
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
78
|
-
font-weight: 400;
|
|
79
|
-
font-weight: var(--font-weight-regular);line-height: 1.5;line-height: var(--line-height-body);
|
|
80
|
-
}
|
|
81
|
-
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
82
|
-
font-size: 1rem;
|
|
83
|
-
font-size: var(--font-size-16);
|
|
84
|
-
}
|
|
85
77
|
.tw-date-lookup-calendar > tbody > tr > td.weekend button {
|
|
86
78
|
font-size: 0.875rem;
|
|
87
79
|
font-size: var(--font-size-14);line-height: 155%;letter-spacing: -0.006em;font-weight: 400;font-weight: var(--font-weight-regular);
|
|
@@ -2226,10 +2218,6 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2226
2218
|
padding-bottom: 0 !important;
|
|
2227
2219
|
}
|
|
2228
2220
|
.np-form-control--size-sm {
|
|
2229
|
-
line-height: 1.5;
|
|
2230
|
-
line-height: var(--line-height-body);
|
|
2231
|
-
font-size: 1rem;
|
|
2232
|
-
font-size: var(--font-size-16);
|
|
2233
2221
|
font-size: 0.875rem;
|
|
2234
2222
|
font-size: var(--font-size-14);
|
|
2235
2223
|
line-height: 155%;
|
|
@@ -2511,10 +2499,12 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2511
2499
|
color: #5d7079;
|
|
2512
2500
|
color: var(--color-content-secondary);
|
|
2513
2501
|
}
|
|
2514
|
-
.np-select-input-
|
|
2502
|
+
.np-select-input-content {
|
|
2515
2503
|
overflow: hidden;
|
|
2516
2504
|
text-overflow: ellipsis;
|
|
2517
2505
|
white-space: nowrap;
|
|
2506
|
+
}
|
|
2507
|
+
.np-select-input-placeholder {
|
|
2518
2508
|
color: #768e9c;
|
|
2519
2509
|
color: var(--color-content-tertiary);
|
|
2520
2510
|
}
|
|
@@ -2622,6 +2612,9 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
|
|
|
2622
2612
|
padding: var(--size-12) var(--size-16);
|
|
2623
2613
|
color: var(--color-interactive-primary);
|
|
2624
2614
|
}
|
|
2615
|
+
.np-select-input-option-container:focus {
|
|
2616
|
+
outline: none;
|
|
2617
|
+
}
|
|
2625
2618
|
.np-select-input-option-container--active {
|
|
2626
2619
|
box-shadow: inset 0 0 0 1px #c9cbce;
|
|
2627
2620
|
box-shadow: inset 0 0 0 1px var(--color-interactive-secondary);
|
|
@@ -4455,10 +4448,6 @@ html:not([dir="rtl"]) .np-navigation-option {
|
|
|
4455
4448
|
border-radius: var(--radius-small);
|
|
4456
4449
|
color: #37517e;
|
|
4457
4450
|
color: var(--color-content-primary);
|
|
4458
|
-
line-height: 1.5;
|
|
4459
|
-
line-height: var(--line-height-body);
|
|
4460
|
-
font-size: 1rem;
|
|
4461
|
-
font-size: var(--font-size-16);
|
|
4462
4451
|
font-size: 0.875rem;
|
|
4463
4452
|
font-size: var(--font-size-14);
|
|
4464
4453
|
line-height: 155%;
|
|
@@ -4640,6 +4629,107 @@ html:not([dir="rtl"]) .np-navigation-option {
|
|
|
4640
4629
|
.np-theme-personal .np-dropdown-menu .np-dropdown-item--focused {
|
|
4641
4630
|
box-shadow: inset 0 0 0 2px var(--color-interactive-primary);
|
|
4642
4631
|
}
|
|
4632
|
+
.segmented-control {
|
|
4633
|
+
box-sizing: border-box;
|
|
4634
|
+
--segment-highlight-width: 0;
|
|
4635
|
+
--segment-highlight-x: var(--size-4);
|
|
4636
|
+
}
|
|
4637
|
+
.segmented-control__segments {
|
|
4638
|
+
display: inline-flex;
|
|
4639
|
+
position: relative;
|
|
4640
|
+
padding: 4px;
|
|
4641
|
+
padding: var(--size-4);
|
|
4642
|
+
width: 100%;
|
|
4643
|
+
justify-content: center;
|
|
4644
|
+
align-items: center;
|
|
4645
|
+
background: rgba(134,167,189,0.10196);
|
|
4646
|
+
background: var(--color-background-neutral);
|
|
4647
|
+
border-radius: 24px;
|
|
4648
|
+
border-radius: var(--size-24);
|
|
4649
|
+
transition: outline 300ms;
|
|
4650
|
+
outline: 2px solid transparent;
|
|
4651
|
+
}
|
|
4652
|
+
.segmented-control--input:has(:focus-visible) > .segmented-control__segments::after {
|
|
4653
|
+
outline: 2px solid var(--color-interactive-primary);
|
|
4654
|
+
}
|
|
4655
|
+
.segmented-control__segments::after {
|
|
4656
|
+
content: "";
|
|
4657
|
+
position: absolute;
|
|
4658
|
+
width: var(--segment-highlight-width);
|
|
4659
|
+
top: 4px;
|
|
4660
|
+
top: var(--size-4);
|
|
4661
|
+
bottom: 4px;
|
|
4662
|
+
bottom: var(--size-4);
|
|
4663
|
+
left: var(--segment-highlight-x);
|
|
4664
|
+
z-index: 0;
|
|
4665
|
+
background: #ffffff;
|
|
4666
|
+
background: var(--color-background-screen);
|
|
4667
|
+
border-radius: 24px;
|
|
4668
|
+
border-radius: var(--size-24);
|
|
4669
|
+
transition: left 300ms;
|
|
4670
|
+
}
|
|
4671
|
+
.segmented-control__segments--no-animate::after {
|
|
4672
|
+
transition: none !important;
|
|
4673
|
+
}
|
|
4674
|
+
.segmented-control__segment {
|
|
4675
|
+
position: relative;
|
|
4676
|
+
flex: 1 1 100%;
|
|
4677
|
+
flex-flow: column;
|
|
4678
|
+
padding: 8px 16px;
|
|
4679
|
+
padding: var(--size-8) var(--size-16);
|
|
4680
|
+
margin: 0 0 0 4px;
|
|
4681
|
+
margin: 0 0 0 var(--size-4);
|
|
4682
|
+
min-width: 0;
|
|
4683
|
+
line-height: inherit;
|
|
4684
|
+
align-items: center;
|
|
4685
|
+
text-align: center;
|
|
4686
|
+
vertical-align: middle;
|
|
4687
|
+
border-radius: 24px;
|
|
4688
|
+
border-radius: var(--size-24);
|
|
4689
|
+
z-index: 1;
|
|
4690
|
+
cursor: pointer;
|
|
4691
|
+
transition: background 300ms;
|
|
4692
|
+
color: var(--color-interactive-primary);
|
|
4693
|
+
}
|
|
4694
|
+
.segmented-control__segment:first-child {
|
|
4695
|
+
margin-left: 0;
|
|
4696
|
+
}
|
|
4697
|
+
.segmented-control__segment:hover {
|
|
4698
|
+
background: rgba(0,0,0,0.10196);
|
|
4699
|
+
background: var(--color-background-overlay);
|
|
4700
|
+
}
|
|
4701
|
+
.segmented-control__radio-input {
|
|
4702
|
+
position: fixed;
|
|
4703
|
+
opacity: 0;
|
|
4704
|
+
pointer-events: none;
|
|
4705
|
+
}
|
|
4706
|
+
.segmented-control__button {
|
|
4707
|
+
width: 100%;
|
|
4708
|
+
height: 100%;
|
|
4709
|
+
background: none;
|
|
4710
|
+
-webkit-appearance: none;
|
|
4711
|
+
-moz-appearance: none;
|
|
4712
|
+
appearance: none;
|
|
4713
|
+
border: none;
|
|
4714
|
+
outline: none;
|
|
4715
|
+
font: inherit;
|
|
4716
|
+
outline: 2px solid transparent;
|
|
4717
|
+
}
|
|
4718
|
+
.segmented-control__button:focus {
|
|
4719
|
+
outline-offset: 0px;
|
|
4720
|
+
}
|
|
4721
|
+
.segmented-control__button:focus-visible {
|
|
4722
|
+
outline-color: var(--color-interactive-primary);
|
|
4723
|
+
}
|
|
4724
|
+
.segmented-control__selected-segment:hover {
|
|
4725
|
+
background: transparent;
|
|
4726
|
+
}
|
|
4727
|
+
.segmented-control__text {
|
|
4728
|
+
word-wrap: break-word;
|
|
4729
|
+
word-break: break-word;
|
|
4730
|
+
color: var(--color-interactive-primary);
|
|
4731
|
+
transition: font-weight 300ms;
|
|
4732
|
+
}
|
|
4643
4733
|
.np-summary {
|
|
4644
4734
|
min-width: 280px;
|
|
4645
4735
|
}
|
|
@@ -0,0 +1,101 @@
|
|
|
1
|
+
.segmented-control {
|
|
2
|
+
box-sizing: border-box;
|
|
3
|
+
--segment-highlight-width: 0;
|
|
4
|
+
--segment-highlight-x: var(--size-4);
|
|
5
|
+
}
|
|
6
|
+
.segmented-control__segments {
|
|
7
|
+
display: inline-flex;
|
|
8
|
+
position: relative;
|
|
9
|
+
padding: 4px;
|
|
10
|
+
padding: var(--size-4);
|
|
11
|
+
width: 100%;
|
|
12
|
+
justify-content: center;
|
|
13
|
+
align-items: center;
|
|
14
|
+
background: rgba(134,167,189,0.10196);
|
|
15
|
+
background: var(--color-background-neutral);
|
|
16
|
+
border-radius: 24px;
|
|
17
|
+
border-radius: var(--size-24);
|
|
18
|
+
transition: outline 300ms;
|
|
19
|
+
outline: 2px solid transparent;
|
|
20
|
+
}
|
|
21
|
+
.segmented-control--input:has(:focus-visible) > .segmented-control__segments::after {
|
|
22
|
+
outline: 2px solid var(--color-interactive-primary);
|
|
23
|
+
}
|
|
24
|
+
.segmented-control__segments::after {
|
|
25
|
+
content: "";
|
|
26
|
+
position: absolute;
|
|
27
|
+
width: var(--segment-highlight-width);
|
|
28
|
+
top: 4px;
|
|
29
|
+
top: var(--size-4);
|
|
30
|
+
bottom: 4px;
|
|
31
|
+
bottom: var(--size-4);
|
|
32
|
+
left: var(--segment-highlight-x);
|
|
33
|
+
z-index: 0;
|
|
34
|
+
background: #ffffff;
|
|
35
|
+
background: var(--color-background-screen);
|
|
36
|
+
border-radius: 24px;
|
|
37
|
+
border-radius: var(--size-24);
|
|
38
|
+
transition: left 300ms;
|
|
39
|
+
}
|
|
40
|
+
.segmented-control__segments--no-animate::after {
|
|
41
|
+
transition: none !important;
|
|
42
|
+
}
|
|
43
|
+
.segmented-control__segment {
|
|
44
|
+
position: relative;
|
|
45
|
+
flex: 1 1 100%;
|
|
46
|
+
flex-flow: column;
|
|
47
|
+
padding: 8px 16px;
|
|
48
|
+
padding: var(--size-8) var(--size-16);
|
|
49
|
+
margin: 0 0 0 4px;
|
|
50
|
+
margin: 0 0 0 var(--size-4);
|
|
51
|
+
min-width: 0;
|
|
52
|
+
line-height: inherit;
|
|
53
|
+
align-items: center;
|
|
54
|
+
text-align: center;
|
|
55
|
+
vertical-align: middle;
|
|
56
|
+
border-radius: 24px;
|
|
57
|
+
border-radius: var(--size-24);
|
|
58
|
+
z-index: 1;
|
|
59
|
+
cursor: pointer;
|
|
60
|
+
transition: background 300ms;
|
|
61
|
+
color: var(--color-interactive-primary);
|
|
62
|
+
}
|
|
63
|
+
.segmented-control__segment:first-child {
|
|
64
|
+
margin-left: 0;
|
|
65
|
+
}
|
|
66
|
+
.segmented-control__segment:hover {
|
|
67
|
+
background: rgba(0,0,0,0.10196);
|
|
68
|
+
background: var(--color-background-overlay);
|
|
69
|
+
}
|
|
70
|
+
.segmented-control__radio-input {
|
|
71
|
+
position: fixed;
|
|
72
|
+
opacity: 0;
|
|
73
|
+
pointer-events: none;
|
|
74
|
+
}
|
|
75
|
+
.segmented-control__button {
|
|
76
|
+
width: 100%;
|
|
77
|
+
height: 100%;
|
|
78
|
+
background: none;
|
|
79
|
+
-webkit-appearance: none;
|
|
80
|
+
-moz-appearance: none;
|
|
81
|
+
appearance: none;
|
|
82
|
+
border: none;
|
|
83
|
+
outline: none;
|
|
84
|
+
font: inherit;
|
|
85
|
+
outline: 2px solid transparent;
|
|
86
|
+
}
|
|
87
|
+
.segmented-control__button:focus {
|
|
88
|
+
outline-offset: 0px;
|
|
89
|
+
}
|
|
90
|
+
.segmented-control__button:focus-visible {
|
|
91
|
+
outline-color: var(--color-interactive-primary);
|
|
92
|
+
}
|
|
93
|
+
.segmented-control__selected-segment:hover {
|
|
94
|
+
background: transparent;
|
|
95
|
+
}
|
|
96
|
+
.segmented-control__text {
|
|
97
|
+
word-wrap: break-word;
|
|
98
|
+
word-break: break-word;
|
|
99
|
+
color: var(--color-interactive-primary);
|
|
100
|
+
transition: font-weight 300ms;
|
|
101
|
+
}
|
|
@@ -152,10 +152,6 @@
|
|
|
152
152
|
border-radius: var(--radius-small);
|
|
153
153
|
color: #37517e;
|
|
154
154
|
color: var(--color-content-primary);
|
|
155
|
-
line-height: 1.5;
|
|
156
|
-
line-height: var(--line-height-body);
|
|
157
|
-
font-size: 1rem;
|
|
158
|
-
font-size: var(--font-size-16);
|
|
159
155
|
font-size: 0.875rem;
|
|
160
156
|
font-size: var(--font-size-14);
|
|
161
157
|
line-height: 155%;
|
|
@@ -1,62 +1,45 @@
|
|
|
1
|
+
import { Direction } from '..';
|
|
2
|
+
export declare const DEFAULT_LANG = "en";
|
|
3
|
+
export declare const DEFAULT_LOCALE = "en-GB";
|
|
1
4
|
/**
|
|
2
|
-
*
|
|
3
|
-
|
|
5
|
+
* Languages written right-to-left.
|
|
6
|
+
*/
|
|
7
|
+
export declare const RTL_LANGUAGES: string[];
|
|
8
|
+
/**
|
|
9
|
+
* @deprecated The source of truth for supported languages lives in Crab.
|
|
10
|
+
*/
|
|
11
|
+
export declare const SUPPORTED_LANGUAGES: string[];
|
|
12
|
+
/**
|
|
13
|
+
* Verifies and adjusts locale, replacing `_` with `-`.
|
|
4
14
|
*
|
|
5
|
-
* @param
|
|
6
|
-
* @returns
|
|
15
|
+
* @param locale `es`, `es_ES`, `en-GB`, `en`, `ja`, `ja-JP`, etc.
|
|
16
|
+
* @returns `null` if locale is unrecognized by `Intl.Locale`.
|
|
7
17
|
*/
|
|
8
|
-
export function adjustLocale(locale: string): string | null;
|
|
18
|
+
export declare function adjustLocale(locale: string): string | null;
|
|
9
19
|
/**
|
|
10
|
-
* Provides corresponding lang (iso2) for provided locale
|
|
11
|
-
* if locale is invalid or language is unsupported returns null
|
|
20
|
+
* Provides corresponding lang (iso2) for provided locale.
|
|
12
21
|
*
|
|
13
22
|
* @deprecated The use of this function almost always breaks language variants
|
|
14
23
|
* e.g. Simplified and Traditional Chinese.
|
|
15
24
|
* There should be no use case for this function.
|
|
16
25
|
* To select the correct translations from a translations object, pass the
|
|
17
26
|
* locale directly into Crab's getLocalisedMessages.
|
|
18
|
-
* @param
|
|
19
|
-
* @returns
|
|
27
|
+
* @param locale `es`, `es-ES`, `en-GB`, `en`, `ja`, `ja-JP`, etc.
|
|
28
|
+
* @returns Two-letter ISO 639-1 language code, falling back to `null` if locale is invalid or language is unsupported.
|
|
20
29
|
*/
|
|
21
|
-
export function getLangFromLocale(locale: string): string | null;
|
|
30
|
+
export declare function getLangFromLocale(locale: string): string | null;
|
|
22
31
|
/**
|
|
23
|
-
* Provides corresponding country code (iso2) for locales code with explicit region value
|
|
24
|
-
* if the value is invalid or missing region it returns null
|
|
32
|
+
* Provides corresponding country code (iso2) for locales code with explicit region value.
|
|
25
33
|
*
|
|
26
|
-
* @param
|
|
27
|
-
* @returns
|
|
34
|
+
* @param locale `es-ES`, `en-GB`, `ja-JP`, etc.
|
|
35
|
+
* @returns `null` if the locale is invalid or the region can‘t be identified.
|
|
28
36
|
*/
|
|
29
|
-
export function getCountryFromLocale(locale: string): string | null;
|
|
37
|
+
export declare function getCountryFromLocale(locale: string): string | null;
|
|
30
38
|
/**
|
|
31
39
|
* Provides the layout direction for a given locale.
|
|
32
|
-
* If locale is invalid or language is unsupported returns Direction.LTR
|
|
33
40
|
*
|
|
34
|
-
* @param
|
|
35
|
-
* @returns
|
|
36
|
-
*/
|
|
37
|
-
export function getDirectionFromLocale(locale: string): Direction;
|
|
38
|
-
/**
|
|
39
|
-
* Default language
|
|
40
|
-
*
|
|
41
|
-
* @type {string}
|
|
42
|
-
*/
|
|
43
|
-
export const DEFAULT_LANG: string;
|
|
44
|
-
/**
|
|
45
|
-
* Default locale
|
|
46
|
-
*
|
|
47
|
-
* @type {string}
|
|
48
|
-
*/
|
|
49
|
-
export const DEFAULT_LOCALE: string;
|
|
50
|
-
/**
|
|
51
|
-
* Array of languages that are written from the right to the left
|
|
52
|
-
*
|
|
53
|
-
* @type {string[]}
|
|
54
|
-
*/
|
|
55
|
-
export const RTL_LANGUAGES: string[];
|
|
56
|
-
/**
|
|
57
|
-
* @deprecated The source of truth for supported languages lives in Crab.
|
|
58
|
-
* @type {string[]}
|
|
41
|
+
* @param locale `es`, `es-ES`, `en-GB`, `en`, `ja`, `ja-JP`, etc.
|
|
42
|
+
* @returns The layout direction based on the locale, falling back to `Direction.LTR` if the locale is invalid or unsupported.
|
|
59
43
|
*/
|
|
60
|
-
export
|
|
61
|
-
import { Direction } from "../direction";
|
|
44
|
+
export declare function getDirectionFromLocale(locale: string): Direction.RTL | Direction.LTR;
|
|
62
45
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/common/locale/index.
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/common/locale/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,IAAI,CAAC;AAE/B,eAAO,MAAM,YAAY,OAAO,CAAC;AACjC,eAAO,MAAM,cAAc,UAAU,CAAC;AAEtC;;GAEG;AACH,eAAO,MAAM,aAAa,UAAe,CAAC;AAE1C;;GAEG;AACH,eAAO,MAAM,mBAAmB,UAiB/B,CAAC;AAEF;;;;;GAKG;AACH,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,iBAW1C;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAAC,MAAM,EAAE,MAAM,iBAS/C;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,MAAM,EAAE,MAAM,iBAGlD;AAED;;;;;GAKG;AACH,wBAAgB,sBAAsB,CAAC,MAAM,EAAE,MAAM,iCAKpD"}
|
package/build/types/index.d.ts
CHANGED
|
@@ -7,11 +7,13 @@ export type { InputGroupProps } from './inputs/InputGroup';
|
|
|
7
7
|
export type { SearchInputProps } from './inputs/SearchInput';
|
|
8
8
|
export type { SelectInputGroupItem, SelectInputItem, SelectInputOptionContentProps, SelectInputOptionItem, SelectInputProps, SelectInputSeparatorItem, SelectInputTriggerButtonProps, } from './inputs/SelectInput';
|
|
9
9
|
export type { TextAreaProps } from './inputs/TextArea';
|
|
10
|
+
export type { PhoneNumberInputProps } from './phoneNumberInput/PhoneNumberInput';
|
|
10
11
|
export type { TextareaWithDisplayFormatProps } from './textareaWithDisplayFormat';
|
|
11
12
|
export type { UploadedFile, UploadError, UploadResponse } from './uploadInput/types';
|
|
12
13
|
export type { ModalProps } from './modal';
|
|
13
14
|
export type { CurrencyHeaderItem, CurrencyItem, CurrencyOptionItem, MoneyInputProps, } from './moneyInput';
|
|
14
15
|
export type { LayoutDirection, TypographyTypes, TitleTypes, BodyTypes, LinkTypes, DisplayTypes, } from './common';
|
|
16
|
+
export type { SegmentedControlProps } from './segmentedControl';
|
|
15
17
|
/**
|
|
16
18
|
* Components
|
|
17
19
|
*/
|
|
@@ -81,6 +83,7 @@ export { default as RadioGroup } from './radioGroup';
|
|
|
81
83
|
export { default as RadioOption } from './radioOption';
|
|
82
84
|
export { default as Section } from './section';
|
|
83
85
|
export { default as Select } from './select';
|
|
86
|
+
export { default as SegmentedControl } from './segmentedControl';
|
|
84
87
|
export { default as SlidingPanel } from './slidingPanel';
|
|
85
88
|
export { default as SnackbarPortal } from './snackbar/Snackbar';
|
|
86
89
|
export { default as SnackbarProvider } from './snackbar/SnackbarProvider';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,YAAY,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,YAAY,EAAE,2BAA2B,EAAE,MAAM,0BAA0B,CAAC;AAC5E,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,YAAY,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAC;AAC7D,YAAY,EACV,oBAAoB,EACpB,eAAe,EACf,6BAA6B,EAC7B,qBAAqB,EACrB,gBAAgB,EAChB,wBAAwB,EACxB,6BAA6B,GAC9B,MAAM,sBAAsB,CAAC;AAC9B,YAAY,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,YAAY,EAAE,8BAA8B,EAAE,MAAM,6BAA6B,CAAC;AAClF,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrF,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1C,YAAY,EACV,kBAAkB,EAClB,YAAY,EACZ,kBAAkB,EAClB,eAAe,GAChB,MAAM,cAAc,CAAC;AACtB,YAAY,EACV,eAAe,EACf,eAAe,EACf,UAAU,EACV,SAAS,EACT,SAAS,EACT,YAAY,GACb,MAAM,UAAU,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -15,12 +15,13 @@ export interface SelectInputSeparatorItem {
|
|
|
15
15
|
type: 'separator';
|
|
16
16
|
}
|
|
17
17
|
export type SelectInputItem<T = string> = SelectInputOptionItem<T> | SelectInputGroupItem<T> | SelectInputSeparatorItem;
|
|
18
|
-
export interface SelectInputProps<T = string> {
|
|
18
|
+
export interface SelectInputProps<T = string, M extends boolean = false> {
|
|
19
19
|
name?: string;
|
|
20
|
+
multiple?: M;
|
|
20
21
|
placeholder?: string;
|
|
21
22
|
items: readonly SelectInputItem<NonNullable<T>>[];
|
|
22
|
-
defaultValue?: T;
|
|
23
|
-
value?: T;
|
|
23
|
+
defaultValue?: M extends true ? readonly T[] : T;
|
|
24
|
+
value?: M extends true ? readonly T[] : T;
|
|
24
25
|
compareValues?: (keyof NonNullable<T> & string) | ((a: T | undefined, b: T | undefined) => boolean);
|
|
25
26
|
renderValue?: (value: NonNullable<T>, withinTrigger: boolean) => React.ReactNode;
|
|
26
27
|
renderFooter?: (args: {
|
|
@@ -44,10 +45,10 @@ export interface SelectInputProps<T = string> {
|
|
|
44
45
|
query: string;
|
|
45
46
|
queryNormalized: string | null;
|
|
46
47
|
}) => void;
|
|
47
|
-
onChange?: (value: T) => void;
|
|
48
|
+
onChange?: (value: M extends true ? T[] : T) => void;
|
|
48
49
|
onClear?: () => void;
|
|
49
50
|
}
|
|
50
|
-
export declare function SelectInput<T = string>({ name, placeholder, items, defaultValue, value: controlledValue, compareValues, renderValue, renderFooter, renderTrigger, filterable, filterPlaceholder, disabled, size, className, onFilterChange, onChange, onClear, }: SelectInputProps<T>): import("react").JSX.Element;
|
|
51
|
+
export declare function SelectInput<T = string, M extends boolean = false>({ name, multiple, placeholder, items, defaultValue, value: controlledValue, compareValues, renderValue, renderFooter, renderTrigger, filterable, filterPlaceholder, disabled, size, className, onFilterChange, onChange, onClear, }: SelectInputProps<T, M>): import("react").JSX.Element;
|
|
51
52
|
type SelectInputTriggerButtonElementType = 'button' | React.ComponentType;
|
|
52
53
|
export type SelectInputTriggerButtonProps<T extends SelectInputTriggerButtonElementType = 'button'> = Merge<React.ComponentPropsWithoutRef<T>, {
|
|
53
54
|
as?: T;
|