@vchasno/ui-kit 0.2.13 → 0.2.15
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/CHANGELOG.md +13 -0
- package/dist/Datepicker/index.cjs.js +13548 -8319
- package/dist/Datepicker/index.cjs.js.map +1 -1
- package/dist/Datepicker/index.js +13552 -8323
- package/dist/Datepicker/index.js.map +1 -1
- package/dist/Datepicker/types/components/BlackTooltip/BlackTooltip.d.ts +5 -0
- package/dist/Datepicker/types/components/BlackTooltip/index.d.ts +2 -0
- package/dist/Datepicker/types/components/ProjectsPopover/ProductLink.d.ts +12 -0
- package/dist/Datepicker/types/components/ProjectsPopover/ProjectsPopover.d.ts +13 -0
- package/dist/Datepicker/types/components/ProjectsPopover/index.d.ts +2 -0
- package/dist/Datepicker/types/components/ProjectsPopover/mappers.d.ts +6 -0
- package/dist/Datepicker/types/components/ProjectsPopover/types.d.ts +7 -0
- package/dist/Datepicker/types/components/ProjectsPopover/utils.d.ts +10 -0
- package/dist/Datepicker/types/components/Select/Select.d.ts +1 -1
- package/dist/Datepicker/types/components/index.d.ts +2 -0
- package/dist/ProjectsPopover/index.cjs.js +12650 -0
- package/dist/ProjectsPopover/index.cjs.js.map +1 -0
- package/dist/ProjectsPopover/index.d.ts +27 -0
- package/dist/ProjectsPopover/index.js +12630 -0
- package/dist/ProjectsPopover/index.js.map +1 -0
- package/dist/ProjectsPopover/types/components/Alert/Alert.d.ts +16 -0
- package/dist/ProjectsPopover/types/components/Alert/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/BlackTooltip/BlackTooltip.d.ts +5 -0
- package/dist/ProjectsPopover/types/components/BlackTooltip/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/BubbleBox/BubbleBox.d.ts +17 -0
- package/dist/ProjectsPopover/types/components/BubbleBox/index.d.ts +3 -0
- package/dist/ProjectsPopover/types/components/BubbleBox/utils.d.ts +1 -0
- package/dist/ProjectsPopover/types/components/Button/Button.d.ts +12 -0
- package/dist/ProjectsPopover/types/components/Button/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Checkbox/Checkbox.d.ts +11 -0
- package/dist/ProjectsPopover/types/components/Checkbox/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Datepicker/DatePicker.d.ts +15 -0
- package/dist/ProjectsPopover/types/components/Datepicker/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/FlexBox/FlexBox.d.ts +15 -0
- package/dist/ProjectsPopover/types/components/FlexBox/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Input/Input.d.ts +15 -0
- package/dist/ProjectsPopover/types/components/Input/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/InputMeta/InputMeta.d.ts +8 -0
- package/dist/ProjectsPopover/types/components/InputMeta/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/LabelText/LabelText.d.ts +8 -0
- package/dist/ProjectsPopover/types/components/LabelText/index.d.ts +1 -0
- package/dist/ProjectsPopover/types/components/MaskInput/MaskInput.d.ts +10 -0
- package/dist/ProjectsPopover/types/components/MaskInput/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Pagination/Pagination.d.ts +16 -0
- package/dist/ProjectsPopover/types/components/Pagination/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Pagination/utils.d.ts +1 -0
- package/dist/ProjectsPopover/types/components/Paragraph/Paragraph.d.ts +9 -0
- package/dist/ProjectsPopover/types/components/Paragraph/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/ProductLink.d.ts +12 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/ProjectsPopover.d.ts +13 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/mappers.d.ts +6 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/types.d.ts +7 -0
- package/dist/ProjectsPopover/types/components/ProjectsPopover/utils.d.ts +10 -0
- package/dist/ProjectsPopover/types/components/PulseDot/PulseDot.d.ts +22 -0
- package/dist/ProjectsPopover/types/components/PulseDot/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Select/Select.d.ts +39 -0
- package/dist/ProjectsPopover/types/components/Select/SelectCreatable.d.ts +14 -0
- package/dist/ProjectsPopover/types/components/Select/customComponents.d.ts +9 -0
- package/dist/ProjectsPopover/types/components/Select/defaultProps.d.ts +6 -0
- package/dist/ProjectsPopover/types/components/Select/index.d.ts +5 -0
- package/dist/ProjectsPopover/types/components/Select/types.d.ts +4 -0
- package/dist/ProjectsPopover/types/components/Spinner/Spinner.d.ts +18 -0
- package/dist/ProjectsPopover/types/components/Spinner/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/SplashLogo/SplashLogo.d.ts +12 -0
- package/dist/ProjectsPopover/types/components/SplashLogo/dataUrls.d.ts +6 -0
- package/dist/ProjectsPopover/types/components/SplashLogo/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/SvgBorder/SvgBorder.d.ts +18 -0
- package/dist/ProjectsPopover/types/components/SvgBorder/index.d.ts +3 -0
- package/dist/ProjectsPopover/types/components/SvgBorder/utils.d.ts +1 -0
- package/dist/ProjectsPopover/types/components/Switch/Switch.d.ts +14 -0
- package/dist/ProjectsPopover/types/components/Switch/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Tabs/Tabs.d.ts +19 -0
- package/dist/ProjectsPopover/types/components/Tabs/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Text/Text.d.ts +14 -0
- package/dist/ProjectsPopover/types/components/Text/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/TextAreaInput/TextAreaInput.d.ts +10 -0
- package/dist/ProjectsPopover/types/components/TextAreaInput/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/TextInput/TextInput.d.ts +9 -0
- package/dist/ProjectsPopover/types/components/TextInput/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/Title/Title.d.ts +9 -0
- package/dist/ProjectsPopover/types/components/Title/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/components/index.d.ts +42 -0
- package/dist/ProjectsPopover/types/components/types.d.ts +24 -0
- package/dist/ProjectsPopover/types/hooks/useClientRect.d.ts +5 -0
- package/dist/ProjectsPopover/types/index.d.ts +2 -0
- package/dist/ProjectsPopover/types/utils/react.d.ts +6 -0
- package/dist/Select/index.cjs.js +195 -92
- package/dist/Select/index.cjs.js.map +1 -1
- package/dist/Select/index.d.ts +1 -1
- package/dist/Select/index.js +195 -92
- package/dist/Select/index.js.map +1 -1
- package/dist/Select/types/components/BlackTooltip/BlackTooltip.d.ts +5 -0
- package/dist/Select/types/components/BlackTooltip/index.d.ts +2 -0
- package/dist/Select/types/components/ProjectsPopover/ProductLink.d.ts +12 -0
- package/dist/Select/types/components/ProjectsPopover/ProjectsPopover.d.ts +13 -0
- package/dist/Select/types/components/ProjectsPopover/index.d.ts +2 -0
- package/dist/Select/types/components/ProjectsPopover/mappers.d.ts +6 -0
- package/dist/Select/types/components/ProjectsPopover/types.d.ts +7 -0
- package/dist/Select/types/components/ProjectsPopover/utils.d.ts +10 -0
- package/dist/Select/types/components/Select/Select.d.ts +1 -1
- package/dist/Select/types/components/index.d.ts +2 -0
- package/dist/SelectCreatable/index.cjs.js +195 -92
- package/dist/SelectCreatable/index.cjs.js.map +1 -1
- package/dist/SelectCreatable/index.js +195 -92
- package/dist/SelectCreatable/index.js.map +1 -1
- package/dist/SelectCreatable/types/components/BlackTooltip/BlackTooltip.d.ts +5 -0
- package/dist/SelectCreatable/types/components/BlackTooltip/index.d.ts +2 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/ProductLink.d.ts +12 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/ProjectsPopover.d.ts +13 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/index.d.ts +2 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/mappers.d.ts +6 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/types.d.ts +7 -0
- package/dist/SelectCreatable/types/components/ProjectsPopover/utils.d.ts +10 -0
- package/dist/SelectCreatable/types/components/Select/Select.d.ts +1 -1
- package/dist/SelectCreatable/types/components/index.d.ts +2 -0
- package/dist/index.d.ts +9 -1
- package/dist/index.js +12451 -365
- package/dist/index.js.map +1 -1
- package/dist/types/components/BlackTooltip/BlackTooltip.d.ts +5 -0
- package/dist/types/components/BlackTooltip/index.d.ts +2 -0
- package/dist/types/components/ProjectsPopover/ProductLink.d.ts +12 -0
- package/dist/types/components/ProjectsPopover/ProjectsPopover.d.ts +13 -0
- package/dist/types/components/ProjectsPopover/index.d.ts +2 -0
- package/dist/types/components/ProjectsPopover/mappers.d.ts +6 -0
- package/dist/types/components/ProjectsPopover/types.d.ts +7 -0
- package/dist/types/components/ProjectsPopover/utils.d.ts +10 -0
- package/dist/types/components/Select/Select.d.ts +1 -1
- package/dist/types/components/index.d.ts +2 -0
- package/package.json +45 -37
package/dist/Select/index.cjs.js
CHANGED
|
@@ -79,24 +79,24 @@ function _typeof(o) {
|
|
|
79
79
|
}, _typeof(o);
|
|
80
80
|
}
|
|
81
81
|
|
|
82
|
-
function
|
|
83
|
-
if (
|
|
84
|
-
var
|
|
85
|
-
if (
|
|
86
|
-
var
|
|
87
|
-
if (
|
|
82
|
+
function toPrimitive(t, r) {
|
|
83
|
+
if ("object" != _typeof(t) || !t) return t;
|
|
84
|
+
var e = t[Symbol.toPrimitive];
|
|
85
|
+
if (void 0 !== e) {
|
|
86
|
+
var i = e.call(t, r || "default");
|
|
87
|
+
if ("object" != _typeof(i)) return i;
|
|
88
88
|
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
89
89
|
}
|
|
90
|
-
return (
|
|
90
|
+
return ("string" === r ? String : Number)(t);
|
|
91
91
|
}
|
|
92
92
|
|
|
93
|
-
function
|
|
94
|
-
var
|
|
95
|
-
return _typeof(
|
|
93
|
+
function toPropertyKey(t) {
|
|
94
|
+
var i = toPrimitive(t, "string");
|
|
95
|
+
return "symbol" == _typeof(i) ? i : i + "";
|
|
96
96
|
}
|
|
97
97
|
|
|
98
98
|
function _defineProperty(obj, key, value) {
|
|
99
|
-
key =
|
|
99
|
+
key = toPropertyKey(key);
|
|
100
100
|
if (key in obj) {
|
|
101
101
|
Object.defineProperty(obj, key, {
|
|
102
102
|
value: value,
|
|
@@ -190,12 +190,11 @@ function _slicedToArray(arr, i) {
|
|
|
190
190
|
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
191
191
|
if (source == null) return {};
|
|
192
192
|
var target = {};
|
|
193
|
-
var
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
target[key] = source[key];
|
|
193
|
+
for (var key in source) {
|
|
194
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
195
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
196
|
+
target[key] = source[key];
|
|
197
|
+
}
|
|
199
198
|
}
|
|
200
199
|
return target;
|
|
201
200
|
}
|
|
@@ -310,7 +309,7 @@ function _defineProperties(target, props) {
|
|
|
310
309
|
descriptor.enumerable = descriptor.enumerable || false;
|
|
311
310
|
descriptor.configurable = true;
|
|
312
311
|
if ("value" in descriptor) descriptor.writable = true;
|
|
313
|
-
Object.defineProperty(target,
|
|
312
|
+
Object.defineProperty(target, toPropertyKey(descriptor.key), descriptor);
|
|
314
313
|
}
|
|
315
314
|
}
|
|
316
315
|
function _createClass(Constructor, protoProps, staticProps) {
|
|
@@ -355,15 +354,12 @@ function _getPrototypeOf(o) {
|
|
|
355
354
|
}
|
|
356
355
|
|
|
357
356
|
function _isNativeReflectConstruct() {
|
|
358
|
-
if (typeof Reflect === "undefined" || !Reflect.construct) return false;
|
|
359
|
-
if (Reflect.construct.sham) return false;
|
|
360
|
-
if (typeof Proxy === "function") return true;
|
|
361
357
|
try {
|
|
362
|
-
Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
return
|
|
366
|
-
}
|
|
358
|
+
var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {}));
|
|
359
|
+
} catch (t) {}
|
|
360
|
+
return (_isNativeReflectConstruct = function _isNativeReflectConstruct() {
|
|
361
|
+
return !!t;
|
|
362
|
+
})();
|
|
367
363
|
}
|
|
368
364
|
|
|
369
365
|
function _assertThisInitialized(self) {
|
|
@@ -4626,7 +4622,9 @@ var Control = function Control(props) {
|
|
|
4626
4622
|
'control--is-disabled': isDisabled,
|
|
4627
4623
|
'control--is-focused': isFocused,
|
|
4628
4624
|
'control--menu-is-open': menuIsOpen
|
|
4629
|
-
}), innerProps
|
|
4625
|
+
}), innerProps, {
|
|
4626
|
+
"aria-disabled": isDisabled || undefined
|
|
4627
|
+
}), children);
|
|
4630
4628
|
};
|
|
4631
4629
|
var Control$1 = Control;
|
|
4632
4630
|
|
|
@@ -5062,14 +5060,14 @@ var defaultAriaLiveMessages = {
|
|
|
5062
5060
|
guidance: function guidance(props) {
|
|
5063
5061
|
var isSearchable = props.isSearchable,
|
|
5064
5062
|
isMulti = props.isMulti,
|
|
5065
|
-
isDisabled = props.isDisabled,
|
|
5066
5063
|
tabSelectsValue = props.tabSelectsValue,
|
|
5067
|
-
context = props.context
|
|
5064
|
+
context = props.context,
|
|
5065
|
+
isInitialFocus = props.isInitialFocus;
|
|
5068
5066
|
switch (context) {
|
|
5069
5067
|
case 'menu':
|
|
5070
|
-
return "Use Up and Down to choose options
|
|
5068
|
+
return "Use Up and Down to choose options, press Enter to select the currently focused option, press Escape to exit the menu".concat(tabSelectsValue ? ', press Tab to select the option and exit the menu' : '', ".");
|
|
5071
5069
|
case 'input':
|
|
5072
|
-
return "".concat(props['aria-label'] || 'Select', " is focused ").concat(isSearchable ? ',type to refine list' : '', ", press Down to open the menu, ").concat(isMulti ? ' press left to focus selected values' : '');
|
|
5070
|
+
return isInitialFocus ? "".concat(props['aria-label'] || 'Select', " is focused ").concat(isSearchable ? ',type to refine list' : '', ", press Down to open the menu, ").concat(isMulti ? ' press left to focus selected values' : '') : '';
|
|
5073
5071
|
case 'value':
|
|
5074
5072
|
return 'Use left and right to toggle between focused values, press Backspace to remove the currently focused value';
|
|
5075
5073
|
default:
|
|
@@ -5105,17 +5103,18 @@ var defaultAriaLiveMessages = {
|
|
|
5105
5103
|
label = _props$label2 === void 0 ? '' : _props$label2,
|
|
5106
5104
|
selectValue = props.selectValue,
|
|
5107
5105
|
isDisabled = props.isDisabled,
|
|
5108
|
-
isSelected = props.isSelected
|
|
5106
|
+
isSelected = props.isSelected,
|
|
5107
|
+
isAppleDevice = props.isAppleDevice;
|
|
5109
5108
|
var getArrayIndex = function getArrayIndex(arr, item) {
|
|
5110
5109
|
return arr && arr.length ? "".concat(arr.indexOf(item) + 1, " of ").concat(arr.length) : '';
|
|
5111
5110
|
};
|
|
5112
5111
|
if (context === 'value' && selectValue) {
|
|
5113
5112
|
return "value ".concat(label, " focused, ").concat(getArrayIndex(selectValue, focused), ".");
|
|
5114
5113
|
}
|
|
5115
|
-
if (context === 'menu') {
|
|
5114
|
+
if (context === 'menu' && isAppleDevice) {
|
|
5116
5115
|
var disabled = isDisabled ? ' disabled' : '';
|
|
5117
|
-
var status = "".concat(isSelected ? 'selected' : '
|
|
5118
|
-
return "
|
|
5116
|
+
var status = "".concat(isSelected ? ' selected' : '').concat(disabled);
|
|
5117
|
+
return "".concat(label).concat(status, ", ").concat(getArrayIndex(options, focused), ".");
|
|
5119
5118
|
}
|
|
5120
5119
|
return '';
|
|
5121
5120
|
},
|
|
@@ -5134,7 +5133,8 @@ var LiveRegion = function LiveRegion(props) {
|
|
|
5134
5133
|
isFocused = props.isFocused,
|
|
5135
5134
|
selectValue = props.selectValue,
|
|
5136
5135
|
selectProps = props.selectProps,
|
|
5137
|
-
id = props.id
|
|
5136
|
+
id = props.id,
|
|
5137
|
+
isAppleDevice = props.isAppleDevice;
|
|
5138
5138
|
var ariaLiveMessages = selectProps.ariaLiveMessages,
|
|
5139
5139
|
getOptionLabel = selectProps.getOptionLabel,
|
|
5140
5140
|
inputValue = selectProps.inputValue,
|
|
@@ -5144,7 +5144,8 @@ var LiveRegion = function LiveRegion(props) {
|
|
|
5144
5144
|
menuIsOpen = selectProps.menuIsOpen,
|
|
5145
5145
|
options = selectProps.options,
|
|
5146
5146
|
screenReaderStatus = selectProps.screenReaderStatus,
|
|
5147
|
-
tabSelectsValue = selectProps.tabSelectsValue
|
|
5147
|
+
tabSelectsValue = selectProps.tabSelectsValue,
|
|
5148
|
+
isLoading = selectProps.isLoading;
|
|
5148
5149
|
var ariaLabel = selectProps['aria-label'];
|
|
5149
5150
|
var ariaLive = selectProps['aria-live'];
|
|
5150
5151
|
|
|
@@ -5197,15 +5198,16 @@ var LiveRegion = function LiveRegion(props) {
|
|
|
5197
5198
|
isSelected: isSelected,
|
|
5198
5199
|
options: focusableOptions,
|
|
5199
5200
|
context: focused === focusedOption ? 'menu' : 'value',
|
|
5200
|
-
selectValue: selectValue
|
|
5201
|
+
selectValue: selectValue,
|
|
5202
|
+
isAppleDevice: isAppleDevice
|
|
5201
5203
|
};
|
|
5202
5204
|
focusMsg = messages.onFocus(onFocusProps);
|
|
5203
5205
|
}
|
|
5204
5206
|
return focusMsg;
|
|
5205
|
-
}, [focusedOption, focusedValue, getOptionLabel, isOptionDisabled, messages, focusableOptions, selectValue]);
|
|
5207
|
+
}, [focusedOption, focusedValue, getOptionLabel, isOptionDisabled, messages, focusableOptions, selectValue, isAppleDevice]);
|
|
5206
5208
|
var ariaResults = React.useMemo(function () {
|
|
5207
5209
|
var resultsMsg = '';
|
|
5208
|
-
if (menuIsOpen && options.length && messages.onFilter) {
|
|
5210
|
+
if (menuIsOpen && options.length && !isLoading && messages.onFilter) {
|
|
5209
5211
|
var resultsMessage = screenReaderStatus({
|
|
5210
5212
|
count: focusableOptions.length
|
|
5211
5213
|
});
|
|
@@ -5215,7 +5217,8 @@ var LiveRegion = function LiveRegion(props) {
|
|
|
5215
5217
|
});
|
|
5216
5218
|
}
|
|
5217
5219
|
return resultsMsg;
|
|
5218
|
-
}, [focusableOptions, inputValue, menuIsOpen, messages, options, screenReaderStatus]);
|
|
5220
|
+
}, [focusableOptions, inputValue, menuIsOpen, messages, options, screenReaderStatus, isLoading]);
|
|
5221
|
+
var isInitialFocus = (ariaSelection === null || ariaSelection === void 0 ? void 0 : ariaSelection.action) === 'initial-input-focus';
|
|
5219
5222
|
var ariaGuidance = React.useMemo(function () {
|
|
5220
5223
|
var guidanceMsg = '';
|
|
5221
5224
|
if (messages.guidance) {
|
|
@@ -5226,24 +5229,28 @@ var LiveRegion = function LiveRegion(props) {
|
|
|
5226
5229
|
isDisabled: focusedOption && isOptionDisabled(focusedOption, selectValue),
|
|
5227
5230
|
isMulti: isMulti,
|
|
5228
5231
|
isSearchable: isSearchable,
|
|
5229
|
-
tabSelectsValue: tabSelectsValue
|
|
5232
|
+
tabSelectsValue: tabSelectsValue,
|
|
5233
|
+
isInitialFocus: isInitialFocus
|
|
5230
5234
|
});
|
|
5231
5235
|
}
|
|
5232
5236
|
return guidanceMsg;
|
|
5233
|
-
}, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue]);
|
|
5234
|
-
var ariaContext = "".concat(ariaFocused, " ").concat(ariaResults, " ").concat(ariaGuidance);
|
|
5237
|
+
}, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue, isInitialFocus]);
|
|
5235
5238
|
var ScreenReaderText = jsx(React.Fragment, null, jsx("span", {
|
|
5236
5239
|
id: "aria-selection"
|
|
5237
5240
|
}, ariaSelected), jsx("span", {
|
|
5238
|
-
id: "aria-
|
|
5239
|
-
},
|
|
5240
|
-
|
|
5241
|
+
id: "aria-focused"
|
|
5242
|
+
}, ariaFocused), jsx("span", {
|
|
5243
|
+
id: "aria-results"
|
|
5244
|
+
}, ariaResults), jsx("span", {
|
|
5245
|
+
id: "aria-guidance"
|
|
5246
|
+
}, ariaGuidance));
|
|
5241
5247
|
return jsx(React.Fragment, null, jsx(A11yText$1, {
|
|
5242
5248
|
id: id
|
|
5243
5249
|
}, isInitialFocus && ScreenReaderText), jsx(A11yText$1, {
|
|
5244
5250
|
"aria-live": ariaLive,
|
|
5245
5251
|
"aria-atomic": "false",
|
|
5246
|
-
"aria-relevant": "additions text"
|
|
5252
|
+
"aria-relevant": "additions text",
|
|
5253
|
+
role: "log"
|
|
5247
5254
|
}, isFocused && !isInitialFocus && ScreenReaderText));
|
|
5248
5255
|
};
|
|
5249
5256
|
var LiveRegion$1 = LiveRegion;
|
|
@@ -5588,7 +5595,7 @@ function DummyInput(_ref) {
|
|
|
5588
5595
|
}
|
|
5589
5596
|
|
|
5590
5597
|
var cancelScroll = function cancelScroll(event) {
|
|
5591
|
-
event.preventDefault();
|
|
5598
|
+
if (event.cancelable) event.preventDefault();
|
|
5592
5599
|
event.stopPropagation();
|
|
5593
5600
|
};
|
|
5594
5601
|
function useScrollCapture(_ref) {
|
|
@@ -5883,6 +5890,30 @@ var RequiredInput = function RequiredInput(_ref) {
|
|
|
5883
5890
|
};
|
|
5884
5891
|
var RequiredInput$1 = RequiredInput;
|
|
5885
5892
|
|
|
5893
|
+
/// <reference types="user-agent-data-types" />
|
|
5894
|
+
|
|
5895
|
+
function testPlatform(re) {
|
|
5896
|
+
var _window$navigator$use;
|
|
5897
|
+
return typeof window !== 'undefined' && window.navigator != null ? re.test(((_window$navigator$use = window.navigator['userAgentData']) === null || _window$navigator$use === void 0 ? void 0 : _window$navigator$use.platform) || window.navigator.platform) : false;
|
|
5898
|
+
}
|
|
5899
|
+
function isIPhone() {
|
|
5900
|
+
return testPlatform(/^iPhone/i);
|
|
5901
|
+
}
|
|
5902
|
+
function isMac() {
|
|
5903
|
+
return testPlatform(/^Mac/i);
|
|
5904
|
+
}
|
|
5905
|
+
function isIPad() {
|
|
5906
|
+
return testPlatform(/^iPad/i) ||
|
|
5907
|
+
// iPadOS 13 lies and says it's a Mac, but we can distinguish by detecting touch support.
|
|
5908
|
+
isMac() && navigator.maxTouchPoints > 1;
|
|
5909
|
+
}
|
|
5910
|
+
function isIOS() {
|
|
5911
|
+
return isIPhone() || isIPad();
|
|
5912
|
+
}
|
|
5913
|
+
function isAppleDevice() {
|
|
5914
|
+
return isMac() || isIOS();
|
|
5915
|
+
}
|
|
5916
|
+
|
|
5886
5917
|
var formatGroupLabel = function formatGroupLabel(group) {
|
|
5887
5918
|
return group.label;
|
|
5888
5919
|
};
|
|
@@ -6052,6 +6083,24 @@ function buildFocusableOptionsFromCategorizedOptions(categorizedOptions) {
|
|
|
6052
6083
|
return optionsAccumulator;
|
|
6053
6084
|
}, []);
|
|
6054
6085
|
}
|
|
6086
|
+
function buildFocusableOptionsWithIds(categorizedOptions, optionId) {
|
|
6087
|
+
return categorizedOptions.reduce(function (optionsAccumulator, categorizedOption) {
|
|
6088
|
+
if (categorizedOption.type === 'group') {
|
|
6089
|
+
optionsAccumulator.push.apply(optionsAccumulator, _toConsumableArray(categorizedOption.options.map(function (option) {
|
|
6090
|
+
return {
|
|
6091
|
+
data: option.data,
|
|
6092
|
+
id: "".concat(optionId, "-").concat(categorizedOption.index, "-").concat(option.index)
|
|
6093
|
+
};
|
|
6094
|
+
})));
|
|
6095
|
+
} else {
|
|
6096
|
+
optionsAccumulator.push({
|
|
6097
|
+
data: categorizedOption.data,
|
|
6098
|
+
id: "".concat(optionId, "-").concat(categorizedOption.index)
|
|
6099
|
+
});
|
|
6100
|
+
}
|
|
6101
|
+
return optionsAccumulator;
|
|
6102
|
+
}, []);
|
|
6103
|
+
}
|
|
6055
6104
|
function buildFocusableOptions(props, selectValue) {
|
|
6056
6105
|
return buildFocusableOptionsFromCategorizedOptions(buildCategorizedOptions(props, selectValue));
|
|
6057
6106
|
}
|
|
@@ -6089,6 +6138,13 @@ function getNextFocusedOption(state, options) {
|
|
|
6089
6138
|
var lastFocusedOption = state.focusedOption;
|
|
6090
6139
|
return lastFocusedOption && options.indexOf(lastFocusedOption) > -1 ? lastFocusedOption : options[0];
|
|
6091
6140
|
}
|
|
6141
|
+
var getFocusedOptionId = function getFocusedOptionId(focusableOptionsWithIds, focusedOption) {
|
|
6142
|
+
var _focusableOptionsWith;
|
|
6143
|
+
var focusedOptionId = (_focusableOptionsWith = focusableOptionsWithIds.find(function (option) {
|
|
6144
|
+
return option.data === focusedOption;
|
|
6145
|
+
})) === null || _focusableOptionsWith === void 0 ? void 0 : _focusableOptionsWith.id;
|
|
6146
|
+
return focusedOptionId || null;
|
|
6147
|
+
};
|
|
6092
6148
|
var getOptionLabel = function getOptionLabel(props, data) {
|
|
6093
6149
|
return props.getOptionLabel(data);
|
|
6094
6150
|
};
|
|
@@ -6139,6 +6195,8 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6139
6195
|
_this.state = {
|
|
6140
6196
|
ariaSelection: null,
|
|
6141
6197
|
focusedOption: null,
|
|
6198
|
+
focusedOptionId: null,
|
|
6199
|
+
focusableOptionsWithIds: [],
|
|
6142
6200
|
focusedValue: null,
|
|
6143
6201
|
inputIsHidden: false,
|
|
6144
6202
|
isFocused: false,
|
|
@@ -6146,17 +6204,18 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6146
6204
|
clearFocusValueOnUpdate: false,
|
|
6147
6205
|
prevWasFocused: false,
|
|
6148
6206
|
inputIsHiddenAfterUpdate: undefined,
|
|
6149
|
-
prevProps: undefined
|
|
6207
|
+
prevProps: undefined,
|
|
6208
|
+
instancePrefix: ''
|
|
6150
6209
|
};
|
|
6151
6210
|
_this.blockOptionHover = false;
|
|
6152
6211
|
_this.isComposing = false;
|
|
6153
6212
|
_this.commonProps = void 0;
|
|
6154
6213
|
_this.initialTouchX = 0;
|
|
6155
6214
|
_this.initialTouchY = 0;
|
|
6156
|
-
_this.instancePrefix = '';
|
|
6157
6215
|
_this.openAfterFocus = false;
|
|
6158
6216
|
_this.scrollToFocusedOptionOnUpdate = false;
|
|
6159
6217
|
_this.userIsDragging = void 0;
|
|
6218
|
+
_this.isAppleDevice = isAppleDevice();
|
|
6160
6219
|
_this.controlRef = null;
|
|
6161
6220
|
_this.getControlRef = function (ref) {
|
|
6162
6221
|
_this.controlRef = ref;
|
|
@@ -6271,6 +6330,12 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6271
6330
|
removedValue: lastSelectedValue
|
|
6272
6331
|
});
|
|
6273
6332
|
};
|
|
6333
|
+
_this.getFocusedOptionId = function (focusedOption) {
|
|
6334
|
+
return getFocusedOptionId(_this.state.focusableOptionsWithIds, focusedOption);
|
|
6335
|
+
};
|
|
6336
|
+
_this.getFocusableOptionsWithIds = function () {
|
|
6337
|
+
return buildFocusableOptionsWithIds(buildCategorizedOptions(_this.props, _this.state.selectValue), _this.getElementId('option'));
|
|
6338
|
+
};
|
|
6274
6339
|
_this.getValue = function () {
|
|
6275
6340
|
return _this.state.selectValue;
|
|
6276
6341
|
};
|
|
@@ -6298,7 +6363,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6298
6363
|
return (_this$props$className = (_this$props$className2 = _this.props.classNames)[key]) === null || _this$props$className === void 0 ? void 0 : _this$props$className.call(_this$props$className2, props);
|
|
6299
6364
|
};
|
|
6300
6365
|
_this.getElementId = function (element) {
|
|
6301
|
-
return "".concat(_this.instancePrefix, "-").concat(element);
|
|
6366
|
+
return "".concat(_this.state.instancePrefix, "-").concat(element);
|
|
6302
6367
|
};
|
|
6303
6368
|
_this.getComponents = function () {
|
|
6304
6369
|
return defaultComponents(_this.props);
|
|
@@ -6507,8 +6572,11 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6507
6572
|
if (_this.blockOptionHover || _this.state.focusedOption === focusedOption) {
|
|
6508
6573
|
return;
|
|
6509
6574
|
}
|
|
6575
|
+
var options = _this.getFocusableOptions();
|
|
6576
|
+
var focusedOptionIndex = options.indexOf(focusedOption);
|
|
6510
6577
|
_this.setState({
|
|
6511
|
-
focusedOption: focusedOption
|
|
6578
|
+
focusedOption: focusedOption,
|
|
6579
|
+
focusedOptionId: focusedOptionIndex > -1 ? _this.getFocusedOptionId(focusedOption) : null
|
|
6512
6580
|
});
|
|
6513
6581
|
};
|
|
6514
6582
|
_this.shouldHideSelectedOptions = function () {
|
|
@@ -6652,14 +6720,16 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6652
6720
|
}
|
|
6653
6721
|
event.preventDefault();
|
|
6654
6722
|
};
|
|
6655
|
-
_this.instancePrefix = 'react-select-' + (_this.props.instanceId || ++instanceId);
|
|
6723
|
+
_this.state.instancePrefix = 'react-select-' + (_this.props.instanceId || ++instanceId);
|
|
6656
6724
|
_this.state.selectValue = cleanValue(_props.value);
|
|
6657
|
-
|
|
6658
6725
|
// Set focusedOption if menuIsOpen is set on init (e.g. defaultMenuIsOpen)
|
|
6659
6726
|
if (_props.menuIsOpen && _this.state.selectValue.length) {
|
|
6727
|
+
var focusableOptionsWithIds = _this.getFocusableOptionsWithIds();
|
|
6660
6728
|
var focusableOptions = _this.buildFocusableOptions();
|
|
6661
6729
|
var optionIndex = focusableOptions.indexOf(_this.state.selectValue[0]);
|
|
6730
|
+
_this.state.focusableOptionsWithIds = focusableOptionsWithIds;
|
|
6662
6731
|
_this.state.focusedOption = focusableOptions[optionIndex];
|
|
6732
|
+
_this.state.focusedOptionId = getFocusedOptionId(focusableOptionsWithIds, focusableOptions[optionIndex]);
|
|
6663
6733
|
}
|
|
6664
6734
|
return _this;
|
|
6665
6735
|
}
|
|
@@ -6784,7 +6854,8 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6784
6854
|
this.setState({
|
|
6785
6855
|
inputIsHiddenAfterUpdate: false,
|
|
6786
6856
|
focusedValue: null,
|
|
6787
|
-
focusedOption: focusableOptions[openAtIndex]
|
|
6857
|
+
focusedOption: focusableOptions[openAtIndex],
|
|
6858
|
+
focusedOptionId: this.getFocusedOptionId(focusableOptions[openAtIndex])
|
|
6788
6859
|
}, function () {
|
|
6789
6860
|
return _this2.onMenuOpen();
|
|
6790
6861
|
});
|
|
@@ -6860,7 +6931,8 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
6860
6931
|
this.scrollToFocusedOptionOnUpdate = true;
|
|
6861
6932
|
this.setState({
|
|
6862
6933
|
focusedOption: options[nextFocus],
|
|
6863
|
-
focusedValue: null
|
|
6934
|
+
focusedValue: null,
|
|
6935
|
+
focusedOptionId: this.getFocusedOptionId(options[nextFocus])
|
|
6864
6936
|
});
|
|
6865
6937
|
}
|
|
6866
6938
|
}, {
|
|
@@ -7056,10 +7128,10 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7056
7128
|
'aria-label': this.props['aria-label'],
|
|
7057
7129
|
'aria-labelledby': this.props['aria-labelledby'],
|
|
7058
7130
|
'aria-required': required,
|
|
7059
|
-
role: 'combobox'
|
|
7131
|
+
role: 'combobox',
|
|
7132
|
+
'aria-activedescendant': this.isAppleDevice ? undefined : this.state.focusedOptionId || ''
|
|
7060
7133
|
}, menuIsOpen && {
|
|
7061
|
-
'aria-controls': this.getElementId('listbox')
|
|
7062
|
-
'aria-owns': this.getElementId('listbox')
|
|
7134
|
+
'aria-controls': this.getElementId('listbox')
|
|
7063
7135
|
}), !isSearchable && {
|
|
7064
7136
|
'aria-readonly': true
|
|
7065
7137
|
}), this.hasValue() ? (ariaSelection === null || ariaSelection === void 0 ? void 0 : ariaSelection.action) === 'initial-input-focus' && {
|
|
@@ -7304,8 +7376,11 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7304
7376
|
onClick: onSelect,
|
|
7305
7377
|
onMouseMove: onHover,
|
|
7306
7378
|
onMouseOver: onHover,
|
|
7307
|
-
tabIndex: -1
|
|
7379
|
+
tabIndex: -1,
|
|
7380
|
+
role: 'option',
|
|
7381
|
+
'aria-selected': _this4.isAppleDevice ? undefined : isSelected // is not supported on Apple devices
|
|
7308
7382
|
};
|
|
7383
|
+
|
|
7309
7384
|
return /*#__PURE__*/React__namespace.createElement(Option, _extends({}, commonProps, {
|
|
7310
7385
|
innerProps: innerProps,
|
|
7311
7386
|
data: data,
|
|
@@ -7374,8 +7449,7 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7374
7449
|
innerRef: ref,
|
|
7375
7450
|
innerProps: {
|
|
7376
7451
|
onMouseDown: _this4.onMenuMouseDown,
|
|
7377
|
-
onMouseMove: _this4.onMenuMouseMove
|
|
7378
|
-
id: _this4.getElementId('listbox')
|
|
7452
|
+
onMouseMove: _this4.onMenuMouseMove
|
|
7379
7453
|
},
|
|
7380
7454
|
isLoading: isLoading,
|
|
7381
7455
|
placement: placement
|
|
@@ -7390,6 +7464,11 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7390
7464
|
_this4.getMenuListRef(instance);
|
|
7391
7465
|
scrollTargetRef(instance);
|
|
7392
7466
|
},
|
|
7467
|
+
innerProps: {
|
|
7468
|
+
role: 'listbox',
|
|
7469
|
+
'aria-multiselectable': commonProps.isMulti,
|
|
7470
|
+
id: _this4.getElementId('listbox')
|
|
7471
|
+
},
|
|
7393
7472
|
isLoading: isLoading,
|
|
7394
7473
|
maxHeight: maxHeight,
|
|
7395
7474
|
focusedOption: focusedOption
|
|
@@ -7477,7 +7556,8 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7477
7556
|
focusedValue: focusedValue,
|
|
7478
7557
|
isFocused: isFocused,
|
|
7479
7558
|
selectValue: selectValue,
|
|
7480
|
-
focusableOptions: focusableOptions
|
|
7559
|
+
focusableOptions: focusableOptions,
|
|
7560
|
+
isAppleDevice: this.isAppleDevice
|
|
7481
7561
|
}));
|
|
7482
7562
|
}
|
|
7483
7563
|
}, {
|
|
@@ -7526,7 +7606,8 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7526
7606
|
inputIsHiddenAfterUpdate = state.inputIsHiddenAfterUpdate,
|
|
7527
7607
|
ariaSelection = state.ariaSelection,
|
|
7528
7608
|
isFocused = state.isFocused,
|
|
7529
|
-
prevWasFocused = state.prevWasFocused
|
|
7609
|
+
prevWasFocused = state.prevWasFocused,
|
|
7610
|
+
instancePrefix = state.instancePrefix;
|
|
7530
7611
|
var options = props.options,
|
|
7531
7612
|
value = props.value,
|
|
7532
7613
|
menuIsOpen = props.menuIsOpen,
|
|
@@ -7536,11 +7617,15 @@ var Select$1 = /*#__PURE__*/function (_Component) {
|
|
|
7536
7617
|
var newMenuOptionsState = {};
|
|
7537
7618
|
if (prevProps && (value !== prevProps.value || options !== prevProps.options || menuIsOpen !== prevProps.menuIsOpen || inputValue !== prevProps.inputValue)) {
|
|
7538
7619
|
var focusableOptions = menuIsOpen ? buildFocusableOptions(props, selectValue) : [];
|
|
7620
|
+
var focusableOptionsWithIds = menuIsOpen ? buildFocusableOptionsWithIds(buildCategorizedOptions(props, selectValue), "".concat(instancePrefix, "-option")) : [];
|
|
7539
7621
|
var focusedValue = clearFocusValueOnUpdate ? getNextFocusedValue(state, selectValue) : null;
|
|
7540
7622
|
var focusedOption = getNextFocusedOption(state, focusableOptions);
|
|
7623
|
+
var focusedOptionId = getFocusedOptionId(focusableOptionsWithIds, focusedOption);
|
|
7541
7624
|
newMenuOptionsState = {
|
|
7542
7625
|
selectValue: selectValue,
|
|
7543
7626
|
focusedOption: focusedOption,
|
|
7627
|
+
focusedOptionId: focusedOptionId,
|
|
7628
|
+
focusableOptionsWithIds: focusableOptionsWithIds,
|
|
7544
7629
|
focusedValue: focusedValue,
|
|
7545
7630
|
clearFocusValueOnUpdate: false
|
|
7546
7631
|
};
|
|
@@ -7602,39 +7687,57 @@ var classnames = {exports: {}};
|
|
|
7602
7687
|
|
|
7603
7688
|
var hasOwn = {}.hasOwnProperty;
|
|
7604
7689
|
|
|
7605
|
-
function classNames() {
|
|
7606
|
-
var classes =
|
|
7690
|
+
function classNames () {
|
|
7691
|
+
var classes = '';
|
|
7607
7692
|
|
|
7608
7693
|
for (var i = 0; i < arguments.length; i++) {
|
|
7609
7694
|
var arg = arguments[i];
|
|
7610
|
-
if (
|
|
7611
|
-
|
|
7612
|
-
var argType = typeof arg;
|
|
7613
|
-
|
|
7614
|
-
if (argType === 'string' || argType === 'number') {
|
|
7615
|
-
classes.push(arg);
|
|
7616
|
-
} else if (Array.isArray(arg)) {
|
|
7617
|
-
if (arg.length) {
|
|
7618
|
-
var inner = classNames.apply(null, arg);
|
|
7619
|
-
if (inner) {
|
|
7620
|
-
classes.push(inner);
|
|
7621
|
-
}
|
|
7622
|
-
}
|
|
7623
|
-
} else if (argType === 'object') {
|
|
7624
|
-
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
|
|
7625
|
-
classes.push(arg.toString());
|
|
7626
|
-
continue;
|
|
7627
|
-
}
|
|
7628
|
-
|
|
7629
|
-
for (var key in arg) {
|
|
7630
|
-
if (hasOwn.call(arg, key) && arg[key]) {
|
|
7631
|
-
classes.push(key);
|
|
7632
|
-
}
|
|
7633
|
-
}
|
|
7695
|
+
if (arg) {
|
|
7696
|
+
classes = appendClass(classes, parseValue(arg));
|
|
7634
7697
|
}
|
|
7635
7698
|
}
|
|
7636
7699
|
|
|
7637
|
-
return classes
|
|
7700
|
+
return classes;
|
|
7701
|
+
}
|
|
7702
|
+
|
|
7703
|
+
function parseValue (arg) {
|
|
7704
|
+
if (typeof arg === 'string' || typeof arg === 'number') {
|
|
7705
|
+
return arg;
|
|
7706
|
+
}
|
|
7707
|
+
|
|
7708
|
+
if (typeof arg !== 'object') {
|
|
7709
|
+
return '';
|
|
7710
|
+
}
|
|
7711
|
+
|
|
7712
|
+
if (Array.isArray(arg)) {
|
|
7713
|
+
return classNames.apply(null, arg);
|
|
7714
|
+
}
|
|
7715
|
+
|
|
7716
|
+
if (arg.toString !== Object.prototype.toString && !arg.toString.toString().includes('[native code]')) {
|
|
7717
|
+
return arg.toString();
|
|
7718
|
+
}
|
|
7719
|
+
|
|
7720
|
+
var classes = '';
|
|
7721
|
+
|
|
7722
|
+
for (var key in arg) {
|
|
7723
|
+
if (hasOwn.call(arg, key) && arg[key]) {
|
|
7724
|
+
classes = appendClass(classes, key);
|
|
7725
|
+
}
|
|
7726
|
+
}
|
|
7727
|
+
|
|
7728
|
+
return classes;
|
|
7729
|
+
}
|
|
7730
|
+
|
|
7731
|
+
function appendClass (value, newClass) {
|
|
7732
|
+
if (!newClass) {
|
|
7733
|
+
return value;
|
|
7734
|
+
}
|
|
7735
|
+
|
|
7736
|
+
if (value) {
|
|
7737
|
+
return value + ' ' + newClass;
|
|
7738
|
+
}
|
|
7739
|
+
|
|
7740
|
+
return value + newClass;
|
|
7638
7741
|
}
|
|
7639
7742
|
|
|
7640
7743
|
if (module.exports) {
|