@elliemae/ds-form 2.0.0-rc.9 → 2.0.2
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/cjs/Checkbox/DSCheckbox.js +2 -2
- package/cjs/CheckboxGroup/DSCheckboxGroup.js +2 -2
- package/cjs/ComboBox/v1/DSComboBox.js +20 -24
- package/cjs/ComboBox/v1/components/AllOption.js +2 -2
- package/cjs/ComboBox/v1/components/Control.js +2 -2
- package/cjs/ComboBox/v1/components/CustomOption.js +2 -2
- package/cjs/ComboBox/v1/components/CustomOptionMulti.js +2 -2
- package/cjs/ComboBox/v1/components/DropdownIndicator.js +2 -2
- package/cjs/ComboBox/v1/components/MenuList.js +2 -2
- package/cjs/ComboBox/v1/components/MultiValueRemove.js +2 -2
- package/cjs/ComboBox/v1/components/SelectMenu.js +2 -2
- package/cjs/ComboBox/v1/components/ValueContainer.js +2 -2
- package/cjs/ComboBox/v1/withSelectStringValueConverter.js +5 -6
- package/cjs/ComboBox/v2/Combobox.js +2 -2
- package/cjs/ComboBox/v2/components/AllOption.js +2 -2
- package/cjs/ComboBox/v2/components/ClearIndicator.js +2 -2
- package/cjs/ComboBox/v2/components/Content.js +2 -2
- package/cjs/ComboBox/v2/components/Control.js +2 -2
- package/cjs/ComboBox/v2/components/CustomOption.js +2 -2
- package/cjs/ComboBox/v2/components/CustomOptionMulti.js +2 -2
- package/cjs/ComboBox/v2/components/DropdownIndicator.js +2 -2
- package/cjs/ComboBox/v2/components/GroupHeading.js +2 -2
- package/cjs/ComboBox/v2/components/IndicatorSeparator.js +2 -2
- package/cjs/ComboBox/v2/components/MenuList.js +2 -2
- package/cjs/ComboBox/v2/components/MultiValueRemove.js +2 -2
- package/cjs/ComboBox/v2/components/SelectMenu.js +2 -2
- package/cjs/ComboBox/v2/components/ValueContainer.js +2 -2
- package/cjs/ComboBox/v3/ComboBoxCTX.js +16 -17
- package/cjs/ComboBox/v3/config/useComboBox.js +8 -8
- package/cjs/ComboBox/v3/parts/container/Container.js +1 -1
- package/cjs/ComboBox/v3/parts/controls-input/ControlsInput.js +5 -3
- package/cjs/ComboBox/v3/parts/controls-input/useControlsInput.js +8 -8
- package/cjs/ComboBox/v3/parts/header-list/HeaderList.js +5 -3
- package/cjs/ComboBox/v3/parts/menu-list/MenuList.js +7 -8
- package/cjs/ComboBox/v3/parts/menu-list/styled.js +8 -4
- package/cjs/ComboBox/v3/parts/menu-list/useItemRenderer.js +12 -11
- package/cjs/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +5 -5
- package/cjs/ComboBox/v3/utils/hooks/useOnElementResize.js +4 -4
- package/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +2 -2
- package/cjs/ComboBoxFreeSolo/components/MultiValueRemove.js +2 -2
- package/cjs/ComboBoxFreeSolo/components/SingleValue.js +2 -2
- package/cjs/ComboBoxFreeSolo/components/SingleValueRemove.js +2 -2
- package/cjs/DateInput/DSDateInput.js +2 -2
- package/cjs/DateInput/components/DateInputImpl.js +2 -2
- package/cjs/DateInput/components/DateInputs.js +2 -2
- package/cjs/DateInputV2/components/DateInputs.js +2 -2
- package/cjs/ExpandableInput/ExpandableInputImpl.js +2 -2
- package/cjs/FloatingLabelInput/FloatingLabelInputImpl.js +6 -9
- package/cjs/FormItem/DSFormItemLayout.js +2 -2
- package/cjs/FormItem/ValidationFieldWrapper.js +4 -5
- package/cjs/Input/DSInput.js +2 -2
- package/cjs/Input/InputAddonWrapper.js +4 -5
- package/cjs/Input/InputImpl.js +18 -20
- package/cjs/InputGroup/AddonWrapper.js +6 -8
- package/cjs/InputMask/DSInputMask.js +2 -2
- package/cjs/InputMask/DSInputMaskDeprecated.js +12 -14
- package/cjs/InputMask/MaskTypes.js +2 -2
- package/cjs/InputMask/mask_types/DateInputMask.js +2 -2
- package/cjs/InputMask/mask_types/DateTimeInputMask.js +2 -2
- package/cjs/InputMask/mask_types/DictionaryInputMask.js +2 -2
- package/cjs/InputMask/mask_types/NumberInputMask.js +2 -2
- package/cjs/InputMask/mask_types/PhoneInputMask.js +2 -2
- package/cjs/InputMask/mask_types/PhoneInternationalInputMask.js +2 -2
- package/cjs/InputMask/mask_types/SsnInputMask.js +2 -2
- package/cjs/InputMask/mask_types/UsZipCodeInputMask.js +2 -2
- package/cjs/InputMask/mask_types/ZipCodeSearchInputMask.js +2 -2
- package/cjs/InputMask/mask_types/index.js +2 -2
- package/cjs/InputProtected/DSInputProtected.js +2 -2
- package/cjs/LargeInputText/DSLargeInputText.js +2 -2
- package/cjs/MenuItem/components/SubmenuItem/index.js +2 -2
- package/cjs/Radio/DSRadio.js +2 -2
- package/cjs/RadioGroup/DSRadioGroup.js +2 -2
- package/cjs/SearchBox/NavSearchBox.js +5 -1
- package/cjs/SearchBox/SearchBoxToggle.js +2 -2
- package/cjs/SearchBox/withSearchable.js +5 -7
- package/cjs/TextBox/DSTextBox.js +2 -2
- package/cjs/TimeInput/DSTimeInput.js +2 -2
- package/cjs/TimeInput/TimeInputImpl.js +2 -2
- package/cjs/TimeInput/TimeInputs.js +2 -2
- package/cjs/Toggle/DSToggle.js +2 -2
- package/cjs/Toggle/DSToggleImpl.js +30 -30
- package/cjs/Toggle/DSToggleRender.js +2 -2
- package/esm/Checkbox/DSCheckbox.js +2 -2
- package/esm/CheckboxGroup/DSCheckboxGroup.js +2 -2
- package/esm/ComboBox/v1/DSComboBox.js +19 -23
- package/esm/ComboBox/v1/components/AllOption.js +2 -2
- package/esm/ComboBox/v1/components/Control.js +2 -2
- package/esm/ComboBox/v1/components/CustomOption.js +2 -2
- package/esm/ComboBox/v1/components/CustomOptionMulti.js +2 -2
- package/esm/ComboBox/v1/components/DropdownIndicator.js +2 -2
- package/esm/ComboBox/v1/components/MenuList.js +2 -2
- package/esm/ComboBox/v1/components/MultiValueRemove.js +2 -2
- package/esm/ComboBox/v1/components/SelectMenu.js +2 -2
- package/esm/ComboBox/v1/components/ValueContainer.js +2 -2
- package/esm/ComboBox/v1/withSelectStringValueConverter.js +5 -6
- package/esm/ComboBox/v2/Combobox.js +2 -2
- package/esm/ComboBox/v2/components/AllOption.js +2 -2
- package/esm/ComboBox/v2/components/ClearIndicator.js +2 -2
- package/esm/ComboBox/v2/components/Content.js +2 -2
- package/esm/ComboBox/v2/components/Control.js +2 -2
- package/esm/ComboBox/v2/components/CustomOption.js +2 -2
- package/esm/ComboBox/v2/components/CustomOptionMulti.js +2 -2
- package/esm/ComboBox/v2/components/DropdownIndicator.js +2 -2
- package/esm/ComboBox/v2/components/GroupHeading.js +2 -2
- package/esm/ComboBox/v2/components/IndicatorSeparator.js +2 -2
- package/esm/ComboBox/v2/components/MenuList.js +2 -2
- package/esm/ComboBox/v2/components/MultiValueRemove.js +2 -2
- package/esm/ComboBox/v2/components/SelectMenu.js +2 -2
- package/esm/ComboBox/v2/components/ValueContainer.js +2 -2
- package/esm/ComboBox/v3/ComboBoxCTX.js +5 -6
- package/esm/ComboBox/v3/config/useComboBox.js +8 -8
- package/esm/ComboBox/v3/parts/container/Container.js +1 -1
- package/esm/ComboBox/v3/parts/controls-input/ControlsInput.js +5 -3
- package/esm/ComboBox/v3/parts/controls-input/useControlsInput.js +8 -8
- package/esm/ComboBox/v3/parts/header-list/HeaderList.js +5 -3
- package/esm/ComboBox/v3/parts/menu-list/MenuList.js +8 -9
- package/esm/ComboBox/v3/parts/menu-list/styled.js +8 -4
- package/esm/ComboBox/v3/parts/menu-list/useItemRenderer.js +12 -11
- package/esm/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +5 -5
- package/esm/ComboBox/v3/utils/hooks/useOnElementResize.js +4 -4
- package/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +2 -2
- package/esm/ComboBoxFreeSolo/components/MultiValueRemove.js +2 -2
- package/esm/ComboBoxFreeSolo/components/SingleValue.js +2 -2
- package/esm/ComboBoxFreeSolo/components/SingleValueRemove.js +2 -2
- package/esm/DateInput/DSDateInput.js +2 -2
- package/esm/DateInput/components/DateInputImpl.js +2 -2
- package/esm/DateInput/components/DateInputs.js +2 -2
- package/esm/DateInputV2/components/DateInputs.js +2 -2
- package/esm/ExpandableInput/ExpandableInputImpl.js +2 -2
- package/esm/FloatingLabelInput/FloatingLabelInputImpl.js +6 -9
- package/esm/FormItem/DSFormItemLayout.js +2 -2
- package/esm/FormItem/ValidationFieldWrapper.js +4 -5
- package/esm/Input/DSInput.js +2 -2
- package/esm/Input/InputAddonWrapper.js +4 -5
- package/esm/Input/InputImpl.js +17 -19
- package/esm/InputGroup/AddonWrapper.js +7 -9
- package/esm/InputMask/DSInputMask.js +2 -2
- package/esm/InputMask/DSInputMaskDeprecated.js +12 -14
- package/esm/InputMask/MaskTypes.js +2 -2
- package/esm/InputMask/mask_types/DateInputMask.js +2 -2
- package/esm/InputMask/mask_types/DateTimeInputMask.js +2 -2
- package/esm/InputMask/mask_types/DictionaryInputMask.js +2 -2
- package/esm/InputMask/mask_types/NumberInputMask.js +2 -2
- package/esm/InputMask/mask_types/PhoneInputMask.js +2 -2
- package/esm/InputMask/mask_types/PhoneInternationalInputMask.js +2 -2
- package/esm/InputMask/mask_types/SsnInputMask.js +2 -2
- package/esm/InputMask/mask_types/UsZipCodeInputMask.js +2 -2
- package/esm/InputMask/mask_types/ZipCodeSearchInputMask.js +2 -2
- package/esm/InputMask/mask_types/index.js +2 -2
- package/esm/InputProtected/DSInputProtected.js +2 -2
- package/esm/LargeInputText/DSLargeInputText.js +2 -2
- package/esm/MenuItem/components/SubmenuItem/index.js +2 -2
- package/esm/Radio/DSRadio.js +2 -2
- package/esm/RadioGroup/DSRadioGroup.js +2 -2
- package/esm/SearchBox/NavSearchBox.js +5 -1
- package/esm/SearchBox/SearchBoxToggle.js +2 -2
- package/esm/SearchBox/withSearchable.js +4 -6
- package/esm/TextBox/DSTextBox.js +2 -2
- package/esm/TimeInput/DSTimeInput.js +2 -2
- package/esm/TimeInput/TimeInputImpl.js +2 -2
- package/esm/TimeInput/TimeInputs.js +2 -2
- package/esm/Toggle/DSToggle.js +2 -2
- package/esm/Toggle/DSToggleImpl.js +30 -30
- package/esm/Toggle/DSToggleRender.js +2 -2
- package/package.json +24 -28
- package/types/ComboBox/v3/parts/controls-input/useControlsInput.d.ts +3 -3
- package/types/ComboBox/v3/parts/menu-list/styled.d.ts +4 -3
- package/types/ComboBox/v3/parts/menu-list/useItemRenderer.d.ts +1 -1
- package/types/ComboBox/v3/utils/hooks/useKeyboardNavigation.d.ts +4 -1
- package/types/ComboBox/v3/utils/listHelper.d.ts +1 -1
- package/types/SearchBox/index.d.ts +1 -1
- package/cjs/ComboBox/v3/utils/hooks/useOnWindowResize.js +0 -31
- package/esm/ComboBox/v3/utils/hooks/useOnWindowResize.js +0 -27
- package/types/ComboBox/v3/utils/hooks/useOnWindowResize.d.ts +0 -5
|
@@ -57,9 +57,9 @@ var _LoadingIndicator;
|
|
|
57
57
|
|
|
58
58
|
const _excluded = ["hideSelectedOptions", "autoFocus", "className", "hasError", "onFocus", "onBlur", "onChange", "onChangeV2", "filterOption", "onClickDropdownIndicator", "onInputKeyDown", "onInputChange", "isRtl", "isFocused", "isMulti", "isFreeSolo", "selectAllDisabled", "formatCreateLabel", "createOptionPosition", "value", "options", "clearable", "searchable", "disabled", "placeholder", "valueProperty", "labelProperty", "noOptionsMessage", "loading", "menuIsOpen", "onMenuClose", "inlineMenu", "components", "measureRef", "contentRect", "readOnly", "returnValue", "expandMenuToContainer", "expandMenuOutsideContainer", "customMenuItemOptions", "containerProps", "maxOptions", "zIndex", "componentsStyle", "keepTypedValue"];
|
|
59
59
|
|
|
60
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
60
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
61
61
|
|
|
62
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
62
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
63
63
|
const blockName = 'em-ds-combobox';
|
|
64
64
|
const container = "".concat(blockName, "-container");
|
|
65
65
|
|
|
@@ -12,9 +12,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
12
12
|
|
|
13
13
|
const _excluded = ["children"];
|
|
14
14
|
|
|
15
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
16
|
|
|
17
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
17
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
18
18
|
|
|
19
19
|
const MultiSelectHeader = _ref => {
|
|
20
20
|
let rest = _objectWithoutProperties(_ref, _excluded);
|
|
@@ -17,9 +17,9 @@ var _CloseXsmall;
|
|
|
17
17
|
|
|
18
18
|
const _excluded = ["ref"];
|
|
19
19
|
|
|
20
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
20
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
21
21
|
|
|
22
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
22
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
23
23
|
|
|
24
24
|
const ClearIndicator = props => {
|
|
25
25
|
const {
|
|
@@ -12,9 +12,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
12
12
|
|
|
13
13
|
const _excluded = ["scheduleUpdate", "styleMenu"];
|
|
14
14
|
|
|
15
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
16
|
|
|
17
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
17
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
18
18
|
|
|
19
19
|
const Content = _ref => {
|
|
20
20
|
var _rest$selectProps;
|
|
@@ -10,9 +10,9 @@ import { components } from 'react-select';
|
|
|
10
10
|
import { Reference } from 'react-popper';
|
|
11
11
|
import { jsx } from 'react/jsx-runtime';
|
|
12
12
|
|
|
13
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
13
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
14
14
|
|
|
15
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
15
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
16
16
|
|
|
17
17
|
const Control = props => /*#__PURE__*/_jsx(Reference, {}, void 0, _ref => {
|
|
18
18
|
let {
|
|
@@ -12,9 +12,9 @@ import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text'
|
|
|
12
12
|
import { DropDownContext } from '../context.js';
|
|
13
13
|
import { jsxs, Fragment } from 'react/jsx-runtime';
|
|
14
14
|
|
|
15
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
16
|
|
|
17
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
17
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
18
18
|
|
|
19
19
|
const isOptionAGroup = option => option && option.type && option.type.name === 'Group';
|
|
20
20
|
|
|
@@ -12,9 +12,9 @@ import { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text'
|
|
|
12
12
|
import { DSCheckbox } from '../../../Checkbox/DSCheckbox.js';
|
|
13
13
|
import { DropDownContext } from '../context.js';
|
|
14
14
|
|
|
15
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
15
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
16
|
|
|
17
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
17
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
18
18
|
|
|
19
19
|
const CustomOptionMulti = _ref => {
|
|
20
20
|
let {
|
|
@@ -18,9 +18,9 @@ var _ChevronSmallDown;
|
|
|
18
18
|
|
|
19
19
|
const _excluded = ["innerRef", "onKeyDown", "options", "theme", "clearValue", "getStyles", "getValue", "setValue", "hasStyle", "hasValue", "isMulti", "isRtl", "isDisabled", "isFocused", "selectOption", "selectProps", "innerProps", "cx"];
|
|
20
20
|
|
|
21
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
21
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
22
22
|
|
|
23
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
23
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
24
24
|
|
|
25
25
|
const DropdownIndicator = _ref => {
|
|
26
26
|
let {
|
|
@@ -14,9 +14,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
14
14
|
|
|
15
15
|
var _StyledSeparator;
|
|
16
16
|
|
|
17
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
17
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
18
18
|
|
|
19
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
19
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
20
20
|
|
|
21
21
|
const GroupHeading = props => {
|
|
22
22
|
const headerPosition = getGroupHeaderPosition(props.id);
|
|
@@ -7,9 +7,9 @@ import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
|
|
|
7
7
|
import 'react';
|
|
8
8
|
import { jsx } from 'react/jsx-runtime';
|
|
9
9
|
|
|
10
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
10
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
11
11
|
|
|
12
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
12
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
13
13
|
const IndicatorSeparator = _ref => {
|
|
14
14
|
let {
|
|
15
15
|
innerProps
|
|
@@ -16,9 +16,9 @@ import MultiSelectHeader from './MultiSelectHeader.js';
|
|
|
16
16
|
import { useMenuListHeight } from './useMenuListHeight.js';
|
|
17
17
|
import { jsx } from 'react/jsx-runtime';
|
|
18
18
|
|
|
19
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
19
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
20
|
|
|
21
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
21
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
22
22
|
const createItemData = memoize((items, options) => {
|
|
23
23
|
if (items !== null && items !== void 0 && items.findIndex) {
|
|
24
24
|
const index = items.findIndex(item => item.props.isFocused);
|
|
@@ -11,9 +11,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
11
11
|
|
|
12
12
|
const _excluded = ["innerProps"];
|
|
13
13
|
|
|
14
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
14
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
15
|
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
17
|
|
|
18
18
|
function MultiValueRemove(_ref) {
|
|
19
19
|
let {
|
|
@@ -14,9 +14,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
14
14
|
|
|
15
15
|
var _TriggerComponent, _TriggerComponent2;
|
|
16
16
|
|
|
17
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
17
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
18
18
|
|
|
19
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
19
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
20
20
|
const TriggerComponent = aggregatedClasses('div')('combobox-trigger', null);
|
|
21
21
|
|
|
22
22
|
const SelectMenu = props => {
|
|
@@ -14,9 +14,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
14
14
|
|
|
15
15
|
const _excluded = ["children"];
|
|
16
16
|
|
|
17
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
17
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
18
18
|
|
|
19
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
19
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
20
20
|
function ValueContainer(_ref) {
|
|
21
21
|
let {
|
|
22
22
|
children
|
|
@@ -1,8 +1,7 @@
|
|
|
1
1
|
import { createContext, createRef } from 'react';
|
|
2
|
+
import { noop } from 'lodash';
|
|
2
3
|
|
|
3
4
|
// eslint-disable-next-line @typescript-eslint/no-empty-function
|
|
4
|
-
const noop = () => {};
|
|
5
|
-
|
|
6
5
|
const defaultProps = {
|
|
7
6
|
placeholder: '',
|
|
8
7
|
options: [],
|
|
@@ -12,9 +11,9 @@ const defaultProps = {
|
|
|
12
11
|
autoFocus: false,
|
|
13
12
|
startPlacementPreference: 'bottom-start',
|
|
14
13
|
placementOrderPreference: ['bottom-start', 'bottom-end'],
|
|
15
|
-
onClearAll:
|
|
16
|
-
onSelectAll:
|
|
17
|
-
onCreate:
|
|
14
|
+
onClearAll: noop,
|
|
15
|
+
onSelectAll: noop,
|
|
16
|
+
onCreate: noop,
|
|
18
17
|
withToggle: false,
|
|
19
18
|
onChange: noop,
|
|
20
19
|
onKeyDown: noop,
|
|
@@ -26,7 +25,7 @@ const defaultContext = {
|
|
|
26
25
|
showPopover: false,
|
|
27
26
|
setShowPopover: noop,
|
|
28
27
|
scrollOptionIntoView: noop,
|
|
29
|
-
referenceElement:
|
|
28
|
+
referenceElement: null,
|
|
30
29
|
hasFocus: false,
|
|
31
30
|
setHasFocus: noop,
|
|
32
31
|
pillGroupRef: /*#__PURE__*/createRef(),
|
|
@@ -11,21 +11,21 @@ import { useState, useRef, useCallback, useMemo } from 'react';
|
|
|
11
11
|
import { useVirtual } from 'react-virtual';
|
|
12
12
|
import { useGetComboBoxWithDefaultsProps } from './useGetPropsWithDefault.js';
|
|
13
13
|
|
|
14
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
14
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
15
15
|
|
|
16
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
16
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
17
17
|
const useComboBox = props => {
|
|
18
18
|
const [showPopover, setShowPopover] = useState(false);
|
|
19
|
-
const [referenceElement, setReferenceElement] = useState();
|
|
19
|
+
const [referenceElement, setReferenceElement] = useState(null);
|
|
20
20
|
const [showSelectedValue, setShowSelectedValue] = useState(false);
|
|
21
21
|
const [showSelectedOptions, setShowSelectedOptions] = useState(false);
|
|
22
22
|
const [hasFocus, setHasFocus] = useState(false);
|
|
23
23
|
const [focusOptionIdx, setCurrentOption] = useState('');
|
|
24
|
-
const inputRef = useRef();
|
|
25
|
-
const listRef = useRef();
|
|
26
|
-
const wrapperListRef = useRef();
|
|
27
|
-
const selectedOptionsRef = useRef();
|
|
28
|
-
const controlsWrapperRef = useRef();
|
|
24
|
+
const inputRef = useRef(null);
|
|
25
|
+
const listRef = useRef(null);
|
|
26
|
+
const wrapperListRef = useRef(null);
|
|
27
|
+
const selectedOptionsRef = useRef(null);
|
|
28
|
+
const controlsWrapperRef = useRef(null);
|
|
29
29
|
const pillGroupRef = useRef(null);
|
|
30
30
|
const propsWithDefaults = useGetComboBoxWithDefaultsProps(props);
|
|
31
31
|
const {
|
|
@@ -24,7 +24,7 @@ const Container = () => {
|
|
|
24
24
|
} = useContext(ComboBoxContext);
|
|
25
25
|
const handleCloseMenu = useCallback(() => {
|
|
26
26
|
setShowPopover(false);
|
|
27
|
-
inputRef.current.blur();
|
|
27
|
+
if (inputRef.current) inputRef.current.blur();
|
|
28
28
|
}, [inputRef, setShowPopover]);
|
|
29
29
|
const handleMouseDown = useCallback(e => {
|
|
30
30
|
e.preventDefault();
|
|
@@ -17,9 +17,11 @@ const ControlsInput = () => {
|
|
|
17
17
|
focusOptionIdx,
|
|
18
18
|
inputRef
|
|
19
19
|
} = useContext(ComboBoxContext);
|
|
20
|
-
const onInputKeyDown = useKeyboardNavigation();
|
|
21
20
|
const {
|
|
22
|
-
|
|
21
|
+
onInputKeyDown
|
|
22
|
+
} = useKeyboardNavigation();
|
|
23
|
+
const {
|
|
24
|
+
spanReference,
|
|
23
25
|
width,
|
|
24
26
|
spanReferenceText,
|
|
25
27
|
showPlaceholder,
|
|
@@ -28,7 +30,7 @@ const ControlsInput = () => {
|
|
|
28
30
|
handleOnFocus
|
|
29
31
|
} = useControlsInput();
|
|
30
32
|
return /*#__PURE__*/_jsx(StyledInputWrapper, {}, void 0, /*#__PURE__*/jsx(StyledInputWidthReference, {
|
|
31
|
-
ref:
|
|
33
|
+
ref: spanReference,
|
|
32
34
|
children: spanReferenceText
|
|
33
35
|
}), /*#__PURE__*/_jsx(StyledInputPlaceHolder, {}, void 0, /*#__PURE__*/_jsx(SimpleTruncatedTooltipText, {
|
|
34
36
|
value: showPlaceholder
|
|
@@ -21,12 +21,12 @@ const useControlsInput = () => {
|
|
|
21
21
|
setShowSelectedValue,
|
|
22
22
|
setShowSelectedOptions
|
|
23
23
|
} = useContext(ComboBoxContext);
|
|
24
|
-
const [width, setWidth] = useState();
|
|
25
|
-
const
|
|
24
|
+
const [width, setWidth] = useState(1);
|
|
25
|
+
const spanReference = useRef(null);
|
|
26
26
|
useEffect(() => {
|
|
27
|
-
var
|
|
27
|
+
var _spanReference$curren;
|
|
28
28
|
|
|
29
|
-
setWidth(((
|
|
29
|
+
setWidth(((_spanReference$curren = spanReference.current) === null || _spanReference$curren === void 0 ? void 0 : _spanReference$curren.offsetWidth) || 1);
|
|
30
30
|
}, [(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value]);
|
|
31
31
|
useEffect(() => {
|
|
32
32
|
setShowSelectedValue(true);
|
|
@@ -35,9 +35,9 @@ const useControlsInput = () => {
|
|
|
35
35
|
|
|
36
36
|
const handleOnChange = useCallback(e => {
|
|
37
37
|
setShowSelectedOptions(false);
|
|
38
|
-
if (e.
|
|
38
|
+
if (e.currentTarget.value) setShowSelectedValue(false);
|
|
39
39
|
setShowPopover(true);
|
|
40
|
-
onFilter(e.
|
|
40
|
+
onFilter(e.currentTarget.value);
|
|
41
41
|
}, [onFilter, setShowPopover, setShowSelectedOptions, setShowSelectedValue]);
|
|
42
42
|
const handleOnBlur = useCallback(() => {
|
|
43
43
|
setHasFocus(false);
|
|
@@ -66,8 +66,8 @@ const useControlsInput = () => {
|
|
|
66
66
|
showPlaceholder,
|
|
67
67
|
spanReferenceText,
|
|
68
68
|
width,
|
|
69
|
-
|
|
70
|
-
}), [handleOnFocus, handleOnBlur, handleOnChange, spanReferenceText, showPlaceholder, width,
|
|
69
|
+
spanReference
|
|
70
|
+
}), [handleOnFocus, handleOnBlur, handleOnChange, spanReferenceText, showPlaceholder, width, spanReference]);
|
|
71
71
|
};
|
|
72
72
|
|
|
73
73
|
export { useControlsInput };
|
|
@@ -24,6 +24,8 @@ const HeaderList = () => {
|
|
|
24
24
|
showSelectedOptions,
|
|
25
25
|
inputRef
|
|
26
26
|
} = useContext(ComboBoxContext);
|
|
27
|
+
const isSelectAllSupplied = onSelectAll !== noop;
|
|
28
|
+
const isClearAllSupplied = onClearAll !== noop;
|
|
27
29
|
const multiSelectedValues = selectedValues;
|
|
28
30
|
const selectableOptions = getSelectableOptions(options);
|
|
29
31
|
const {
|
|
@@ -38,7 +40,7 @@ const HeaderList = () => {
|
|
|
38
40
|
return /*#__PURE__*/_jsx(StyledHeaderListWrapper, {
|
|
39
41
|
onKeyDown: handleKeyDown,
|
|
40
42
|
onMouseDown: handleOnMouseDown
|
|
41
|
-
}, void 0, /*#__PURE__*/_jsx(StyledSelectedItems, {}, void 0,
|
|
43
|
+
}, void 0, /*#__PURE__*/_jsx(StyledSelectedItems, {}, void 0, isSelectAllSupplied && /*#__PURE__*/_jsx(StyledButton, {
|
|
42
44
|
disabled: (inputRef === null || inputRef === void 0 ? void 0 : (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value) !== '' || selectableOptions.length === multiSelectedValues.length,
|
|
43
45
|
"data-testid": ComboboxDataTestid.SELECT_ALL_BUTTON,
|
|
44
46
|
buttonType: "text",
|
|
@@ -47,12 +49,12 @@ const HeaderList = () => {
|
|
|
47
49
|
onMouseDown: handleOnMouseDown,
|
|
48
50
|
onBlur: handleOnBlurSelectAll,
|
|
49
51
|
onClick: handleClickOnSelectAll
|
|
50
|
-
}),
|
|
52
|
+
}), isSelectAllSupplied && isClearAllSupplied && (_StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx(StyledSeparator, {
|
|
51
53
|
orientation: "vertical",
|
|
52
54
|
position: "center",
|
|
53
55
|
type: "group-level",
|
|
54
56
|
margin: "none"
|
|
55
|
-
}))),
|
|
57
|
+
}))), isClearAllSupplied && /*#__PURE__*/_jsx(StyledButton, {
|
|
56
58
|
disabled: multiSelectedValues.length === 0,
|
|
57
59
|
tabIndex: 0,
|
|
58
60
|
"data-testid": ComboboxDataTestid.CLEAR_ALL_BUTTON,
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import _jsx from '@babel/runtime/helpers/esm/jsx';
|
|
2
|
-
import { useContext, useCallback } from 'react';
|
|
2
|
+
import { useContext, useMemo, useCallback } from 'react';
|
|
3
3
|
import { StyledListWrapper, StyledVirtualListWrapper, StyledList } from './styled.js';
|
|
4
4
|
import { ComboboxDataTestid } from '../../ComboboxDataTestids.js';
|
|
5
5
|
import { ComboBoxContext } from '../../ComboBoxCTX.js';
|
|
@@ -33,14 +33,14 @@ const MenuList = () => {
|
|
|
33
33
|
} = useContext(ComboBoxContext);
|
|
34
34
|
const multiple = Array.isArray(selectedValues);
|
|
35
35
|
const withHeader = !inline && multiple && options.length > 0;
|
|
36
|
-
const
|
|
37
|
-
ItemRenderer
|
|
38
|
-
} = useItemRenderer();
|
|
36
|
+
const ItemRenderer = useItemRenderer();
|
|
39
37
|
useMenuList();
|
|
40
38
|
useOnElementResize(controlsWrapperRef);
|
|
41
|
-
const listWidth = menuMinWidth || "".concat(referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.offsetWidth);
|
|
39
|
+
const listWidth = useMemo(() => menuMinWidth || "".concat(referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.offsetWidth), [menuMinWidth, referenceElement]);
|
|
42
40
|
const handleOnFocus = useCallback(() => {
|
|
43
|
-
|
|
41
|
+
var _inputRef$current;
|
|
42
|
+
|
|
43
|
+
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
|
|
44
44
|
}, [inputRef]);
|
|
45
45
|
return /*#__PURE__*/jsxs(StyledListWrapper, {
|
|
46
46
|
tabIndex: -1,
|
|
@@ -52,11 +52,10 @@ const MenuList = () => {
|
|
|
52
52
|
role: "listbox",
|
|
53
53
|
children: [withHeader && (_HeaderList || (_HeaderList = /*#__PURE__*/_jsx(HeaderList, {}))), options.length > 0 ? /*#__PURE__*/jsx(StyledVirtualListWrapper, {
|
|
54
54
|
tabIndex: -1,
|
|
55
|
+
inline: inline,
|
|
55
56
|
maxHeight: menuMaxHeight,
|
|
56
57
|
ref: listRef,
|
|
57
|
-
|
|
58
|
-
marginTop: withHeader && '28px'
|
|
59
|
-
},
|
|
58
|
+
withHeader: withHeader,
|
|
60
59
|
children: /*#__PURE__*/_jsx(StyledList, {
|
|
61
60
|
tabIndex: -1,
|
|
62
61
|
"aria-expanded": showPopover,
|
|
@@ -8,12 +8,16 @@ const StyledList = /*#__PURE__*/styled.ul.withConfig({
|
|
|
8
8
|
})(["position:relative;padding:0;"]);
|
|
9
9
|
const StyledVirtualListWrapper = /*#__PURE__*/styled.div.withConfig({
|
|
10
10
|
componentId: "sc-1uedyf-2"
|
|
11
|
-
})(["overflow-y:auto;max-height:", ";"], _ref => {
|
|
11
|
+
})(["overflow-y:auto;margin-top:", ";max-height:", ";"], _ref => {
|
|
12
12
|
let {
|
|
13
|
-
|
|
14
|
-
inline
|
|
13
|
+
withHeader
|
|
15
14
|
} = _ref;
|
|
16
|
-
return
|
|
15
|
+
return withHeader ? '28px' : '';
|
|
16
|
+
}, _ref2 => {
|
|
17
|
+
let {
|
|
18
|
+
maxHeight
|
|
19
|
+
} = _ref2;
|
|
20
|
+
return !maxHeight ? '400px' : "".concat(maxHeight, "px");
|
|
17
21
|
});
|
|
18
22
|
|
|
19
23
|
export { StyledList, StyledListWrapper, StyledVirtualListWrapper };
|
|
@@ -13,9 +13,9 @@ import { isSelected } from '../../utils/listHelper.js';
|
|
|
13
13
|
import { ComboboxDataTestid } from '../../ComboboxDataTestids.js';
|
|
14
14
|
import { jsx, Fragment } from 'react/jsx-runtime';
|
|
15
15
|
|
|
16
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
16
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
17
17
|
|
|
18
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
18
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
19
19
|
|
|
20
20
|
const useItemRenderer = () => {
|
|
21
21
|
const {
|
|
@@ -28,22 +28,25 @@ const useItemRenderer = () => {
|
|
|
28
28
|
inputRef,
|
|
29
29
|
setShowPopover,
|
|
30
30
|
focusOptionIdx,
|
|
31
|
-
virtualListHelpers
|
|
32
|
-
virtualItems
|
|
33
|
-
}
|
|
31
|
+
virtualListHelpers
|
|
34
32
|
} = useContext(ComboBoxContext);
|
|
33
|
+
const {
|
|
34
|
+
virtualItems
|
|
35
|
+
} = virtualListHelpers;
|
|
35
36
|
const multiple = Array.isArray(selectedValues);
|
|
36
37
|
const CBItem = multiple ? MultiMenuItem : SingleMenuItem;
|
|
37
38
|
const handleClick = useCallback((option, e) => {
|
|
39
|
+
var _inputRef$current;
|
|
40
|
+
|
|
38
41
|
if (!multiple) {
|
|
39
42
|
setShowPopover(false);
|
|
40
|
-
inputRef.current.value = '';
|
|
41
|
-
} else {
|
|
43
|
+
if (inputRef.current) inputRef.current.value = '';
|
|
44
|
+
} else if (inputRef.current) {
|
|
42
45
|
onFilter(inputRef.current.value);
|
|
43
46
|
}
|
|
44
47
|
|
|
45
48
|
onChange(option);
|
|
46
|
-
inputRef.current.focus();
|
|
49
|
+
(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
|
|
47
50
|
e.stopPropagation();
|
|
48
51
|
e.preventDefault();
|
|
49
52
|
}, [onFilter, onChange, setShowPopover, multiple, inputRef]);
|
|
@@ -88,9 +91,7 @@ const useItemRenderer = () => {
|
|
|
88
91
|
|
|
89
92
|
return /*#__PURE__*/jsx(Fragment, {});
|
|
90
93
|
}), [options, focusOptionIdx, selectedValues, inputRef, virtualItems]);
|
|
91
|
-
return
|
|
92
|
-
ItemRenderer
|
|
93
|
-
}), [ItemRenderer]);
|
|
94
|
+
return ItemRenderer;
|
|
94
95
|
};
|
|
95
96
|
|
|
96
97
|
export { useItemRenderer };
|
|
@@ -33,7 +33,7 @@ const useKeyboardNavigation = () => {
|
|
|
33
33
|
const currentItem = options.find(item => item.dsId === focusOptionIdx);
|
|
34
34
|
const selectOption = useCallback(() => {
|
|
35
35
|
if (multiple) {
|
|
36
|
-
onFilter(inputRef.current.value);
|
|
36
|
+
if (inputRef.current) onFilter(inputRef.current.value);
|
|
37
37
|
} else {
|
|
38
38
|
onFilter('');
|
|
39
39
|
if (inputRef.current) inputRef.current.value = '';
|
|
@@ -81,7 +81,6 @@ const useKeyboardNavigation = () => {
|
|
|
81
81
|
|
|
82
82
|
if (e.key === 'a' && e.ctrlKey && multiple) {
|
|
83
83
|
onSelectAll();
|
|
84
|
-
setShowPopover(false);
|
|
85
84
|
} // =============================================================================
|
|
86
85
|
// ARROWS UP AND DOWN
|
|
87
86
|
// =============================================================================
|
|
@@ -130,8 +129,7 @@ const useKeyboardNavigation = () => {
|
|
|
130
129
|
|
|
131
130
|
if (e.key === 'Backspace' && targetElement.value.length <= 0 && !inline) {
|
|
132
131
|
if (multiple && !targetElement.value) {
|
|
133
|
-
|
|
134
|
-
if (multiSelectedValues.length > 0) onChange(multiSelectedValues[multiSelectedValues.length - 1]);
|
|
132
|
+
if (selectedValues.length > 0) onChange(selectedValues[selectedValues.length - 1]);
|
|
135
133
|
} else {
|
|
136
134
|
onChange(null);
|
|
137
135
|
}
|
|
@@ -142,7 +140,9 @@ const useKeyboardNavigation = () => {
|
|
|
142
140
|
|
|
143
141
|
if (e.key === 'Tab' && inline) ;
|
|
144
142
|
}, [scrollOptionIntoView, currentItemIndex, options, currentItem, selectableOptions, inputRef, multiple, showPopover, selectedValues, inline, onKeyDown, onSelectAll, onChange, onCreate, onFilter, setCurrentOption, setShowPopover, setShowSelectedValue, selectOption]);
|
|
145
|
-
return
|
|
143
|
+
return {
|
|
144
|
+
onInputKeyDown
|
|
145
|
+
};
|
|
146
146
|
};
|
|
147
147
|
|
|
148
148
|
export { useKeyboardNavigation };
|
|
@@ -11,10 +11,10 @@ const useOnElementResize = targetRef => {
|
|
|
11
11
|
const observer = useRef(null);
|
|
12
12
|
useEffect(() => {
|
|
13
13
|
function outputsize() {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
14
|
+
if (targetRef.current) {
|
|
15
|
+
setWidth(targetRef.current.offsetWidth);
|
|
16
|
+
setHeight(targetRef.current.offsetHeight);
|
|
17
|
+
}
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
observer.current = new ResizeObserver(outputsize).observe(targetRef.current);
|
|
@@ -15,9 +15,9 @@ import { MultiValueRemove } from './components/MultiValueRemove.js';
|
|
|
15
15
|
import { SingleValue } from './components/SingleValue.js';
|
|
16
16
|
import { SingleValueRemove } from './components/SingleValueRemove.js';
|
|
17
17
|
|
|
18
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
18
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
19
19
|
|
|
20
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
20
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
21
21
|
const customStyles = {
|
|
22
22
|
multiValueRemove: MultiValueRemove.style,
|
|
23
23
|
clearIndicator: SingleValueRemove.style,
|
|
@@ -13,9 +13,9 @@ import { jsx } from 'react/jsx-runtime';
|
|
|
13
13
|
|
|
14
14
|
var _PillCloseAddon;
|
|
15
15
|
|
|
16
|
-
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object);
|
|
16
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
17
17
|
|
|
18
|
-
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]
|
|
18
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
19
19
|
const PillCloseAddon = /*#__PURE__*/styled.div.withConfig({
|
|
20
20
|
componentId: "sc-kbngzd-0"
|
|
21
21
|
})(["cursor:pointer;height:", ";& > span{height:auto;}"], props => props.theme.space.xs);
|