@elliemae/ds-form 2.1.0-rc.3 → 2.1.0-rc.7
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/ComboBox/index.js +0 -3
- package/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +0 -1
- package/cjs/MenuItem/components/MultiMenuItem/MultiMenuItem.js +2 -1
- package/cjs/index.js +0 -2
- package/esm/ComboBox/index.js +0 -1
- package/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +0 -1
- package/esm/MenuItem/components/MultiMenuItem/MultiMenuItem.js +2 -1
- package/esm/index.js +0 -1
- package/package.json +23 -207
- package/types/ComboBox/index.d.ts +0 -1
- package/types/MenuItem/components/SubmenuItem/styled.d.ts +1 -1
- package/types/MenuItem/components/styled.d.ts +3 -3
- package/types/MenuItem/props.d.ts +1 -0
- package/cjs/ComboBox/v3/ComboBox.js +0 -33
- package/cjs/ComboBox/v3/ComboBoxCTX.js +0 -55
- package/cjs/ComboBox/v3/ComboboxDataTestids.js +0 -17
- package/cjs/ComboBox/v3/config/constants.js +0 -14
- package/cjs/ComboBox/v3/config/useComboBox.js +0 -122
- package/cjs/ComboBox/v3/config/useGetPropsWithDefault.js +0 -11
- package/cjs/ComboBox/v3/index.d.js +0 -2
- package/cjs/ComboBox/v3/index.js +0 -10
- package/cjs/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js +0 -33
- package/cjs/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js +0 -28
- package/cjs/ComboBox/v3/parts/a11y-messages/index.js +0 -11
- package/cjs/ComboBox/v3/parts/a11y-messages/styled.js +0 -15
- package/cjs/ComboBox/v3/parts/container/Container.js +0 -67
- package/cjs/ComboBox/v3/parts/container/index.js +0 -9
- package/cjs/ComboBox/v3/parts/container/styled.js +0 -23
- package/cjs/ComboBox/v3/parts/controls/Controls.js +0 -71
- package/cjs/ComboBox/v3/parts/controls/index.js +0 -9
- package/cjs/ComboBox/v3/parts/controls/styled.js +0 -65
- package/cjs/ComboBox/v3/parts/controls-input/ControlsInput.js +0 -67
- package/cjs/ComboBox/v3/parts/controls-input/styled.js +0 -27
- package/cjs/ComboBox/v3/parts/controls-input/useControlsInput.js +0 -77
- package/cjs/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js +0 -33
- package/cjs/ComboBox/v3/parts/dropdown-indicator/index.js +0 -2
- package/cjs/ComboBox/v3/parts/dropdown-indicator/styled.js +0 -17
- package/cjs/ComboBox/v3/parts/empty-state/index.js +0 -27
- package/cjs/ComboBox/v3/parts/empty-state/styled.js +0 -19
- package/cjs/ComboBox/v3/parts/header-list/HeaderList.js +0 -113
- package/cjs/ComboBox/v3/parts/header-list/index.js +0 -9
- package/cjs/ComboBox/v3/parts/header-list/styled.js +0 -58
- package/cjs/ComboBox/v3/parts/header-list/useHeaderListHandlers.js +0 -73
- package/cjs/ComboBox/v3/parts/menu-list/MenuList.js +0 -81
- package/cjs/ComboBox/v3/parts/menu-list/index.js +0 -9
- package/cjs/ComboBox/v3/parts/menu-list/styled.js +0 -33
- package/cjs/ComboBox/v3/parts/menu-list/useItemRenderer.js +0 -105
- package/cjs/ComboBox/v3/parts/menu-list/useMenuList.js +0 -61
- package/cjs/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +0 -63
- package/cjs/ComboBox/v3/parts/multi-selected-values-container/index.js +0 -9
- package/cjs/ComboBox/v3/parts/multi-selected-values-container/styled.js +0 -23
- package/cjs/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js +0 -71
- package/cjs/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js +0 -28
- package/cjs/ComboBox/v3/parts/single-selected-value-container/index.js +0 -9
- package/cjs/ComboBox/v3/parts/single-selected-value-container/styled.js +0 -15
- package/cjs/ComboBox/v3/propTypes.js +0 -25
- package/cjs/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +0 -152
- package/cjs/ComboBox/v3/utils/hooks/useOnElementResize.js +0 -37
- package/cjs/ComboBox/v3/utils/listHelper.js +0 -39
- package/esm/ComboBox/v3/ComboBox.js +0 -24
- package/esm/ComboBox/v3/ComboBoxCTX.js +0 -49
- package/esm/ComboBox/v3/ComboboxDataTestids.js +0 -13
- package/esm/ComboBox/v3/config/constants.js +0 -10
- package/esm/ComboBox/v3/config/useComboBox.js +0 -114
- package/esm/ComboBox/v3/config/useGetPropsWithDefault.js +0 -7
- package/esm/ComboBox/v3/index.d.js +0 -1
- package/esm/ComboBox/v3/index.js +0 -1
- package/esm/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js +0 -25
- package/esm/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js +0 -20
- package/esm/ComboBox/v3/parts/a11y-messages/index.js +0 -2
- package/esm/ComboBox/v3/parts/a11y-messages/styled.js +0 -7
- package/esm/ComboBox/v3/parts/container/Container.js +0 -59
- package/esm/ComboBox/v3/parts/container/index.js +0 -1
- package/esm/ComboBox/v3/parts/container/styled.js +0 -13
- package/esm/ComboBox/v3/parts/controls/Controls.js +0 -63
- package/esm/ComboBox/v3/parts/controls/index.js +0 -1
- package/esm/ComboBox/v3/parts/controls/styled.js +0 -52
- package/esm/ComboBox/v3/parts/controls-input/ControlsInput.js +0 -59
- package/esm/ComboBox/v3/parts/controls-input/styled.js +0 -16
- package/esm/ComboBox/v3/parts/controls-input/useControlsInput.js +0 -73
- package/esm/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js +0 -26
- package/esm/ComboBox/v3/parts/dropdown-indicator/index.js +0 -1
- package/esm/ComboBox/v3/parts/dropdown-indicator/styled.js +0 -8
- package/esm/ComboBox/v3/parts/empty-state/index.js +0 -19
- package/esm/ComboBox/v3/parts/empty-state/styled.js +0 -10
- package/esm/ComboBox/v3/parts/header-list/HeaderList.js +0 -105
- package/esm/ComboBox/v3/parts/header-list/index.js +0 -1
- package/esm/ComboBox/v3/parts/header-list/styled.js +0 -41
- package/esm/ComboBox/v3/parts/header-list/useHeaderListHandlers.js +0 -69
- package/esm/ComboBox/v3/parts/menu-list/MenuList.js +0 -73
- package/esm/ComboBox/v3/parts/menu-list/index.js +0 -1
- package/esm/ComboBox/v3/parts/menu-list/styled.js +0 -23
- package/esm/ComboBox/v3/parts/menu-list/useItemRenderer.js +0 -97
- package/esm/ComboBox/v3/parts/menu-list/useMenuList.js +0 -57
- package/esm/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +0 -54
- package/esm/ComboBox/v3/parts/multi-selected-values-container/index.js +0 -1
- package/esm/ComboBox/v3/parts/multi-selected-values-container/styled.js +0 -13
- package/esm/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js +0 -67
- package/esm/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js +0 -20
- package/esm/ComboBox/v3/parts/single-selected-value-container/index.js +0 -1
- package/esm/ComboBox/v3/parts/single-selected-value-container/styled.js +0 -7
- package/esm/ComboBox/v3/propTypes.js +0 -21
- package/esm/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +0 -148
- package/esm/ComboBox/v3/utils/hooks/useOnElementResize.js +0 -33
- package/esm/ComboBox/v3/utils/listHelper.js +0 -30
- package/types/ComboBox/v3/ComboBox.d.ts +0 -62
- package/types/ComboBox/v3/ComboBoxCTX.d.ts +0 -6
- package/types/ComboBox/v3/ComboboxDataTestids.d.ts +0 -11
- package/types/ComboBox/v3/config/constants.d.ts +0 -8
- package/types/ComboBox/v3/config/useComboBox.d.ts +0 -2
- package/types/ComboBox/v3/config/useGetPropsWithDefault.d.ts +0 -2
- package/types/ComboBox/v3/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.d.ts +0 -3
- package/types/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.d.ts +0 -3
- package/types/ComboBox/v3/parts/a11y-messages/index.d.ts +0 -2
- package/types/ComboBox/v3/parts/a11y-messages/styled.d.ts +0 -1
- package/types/ComboBox/v3/parts/container/Container.d.ts +0 -3
- package/types/ComboBox/v3/parts/container/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/container/styled.d.ts +0 -3
- package/types/ComboBox/v3/parts/controls/Controls.d.ts +0 -3
- package/types/ComboBox/v3/parts/controls/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/controls/styled.d.ts +0 -7
- package/types/ComboBox/v3/parts/controls-input/ControlsInput.d.ts +0 -3
- package/types/ComboBox/v3/parts/controls-input/styled.d.ts +0 -4
- package/types/ComboBox/v3/parts/controls-input/useControlsInput.d.ts +0 -12
- package/types/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.d.ts +0 -3
- package/types/ComboBox/v3/parts/dropdown-indicator/index.d.ts +0 -0
- package/types/ComboBox/v3/parts/dropdown-indicator/styled.d.ts +0 -1
- package/types/ComboBox/v3/parts/empty-state/index.d.ts +0 -3
- package/types/ComboBox/v3/parts/empty-state/styled.d.ts +0 -2
- package/types/ComboBox/v3/parts/header-list/HeaderList.d.ts +0 -3
- package/types/ComboBox/v3/parts/header-list/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/header-list/styled.d.ts +0 -7
- package/types/ComboBox/v3/parts/header-list/useHeaderListHandlers.d.ts +0 -12
- package/types/ComboBox/v3/parts/menu-list/MenuList.d.ts +0 -3
- package/types/ComboBox/v3/parts/menu-list/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/menu-list/styled.d.ts +0 -10
- package/types/ComboBox/v3/parts/menu-list/useItemRenderer.d.ts +0 -2
- package/types/ComboBox/v3/parts/menu-list/useMenuList.d.ts +0 -2
- package/types/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.d.ts +0 -3
- package/types/ComboBox/v3/parts/multi-selected-values-container/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/multi-selected-values-container/styled.d.ts +0 -3
- package/types/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.d.ts +0 -2
- package/types/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.d.ts +0 -3
- package/types/ComboBox/v3/parts/single-selected-value-container/index.d.ts +0 -1
- package/types/ComboBox/v3/parts/single-selected-value-container/styled.d.ts +0 -1
- package/types/ComboBox/v3/propTypes.d.ts +0 -51
- package/types/ComboBox/v3/tests/combobox-general.test.d.ts +0 -1
- package/types/ComboBox/v3/tests/combobox-multi-select.test.d.ts +0 -1
- package/types/ComboBox/v3/tests/combobox-single-select.test.d.ts +0 -1
- package/types/ComboBox/v3/tests/combobox-special-keys.test.d.ts +0 -1
- package/types/ComboBox/v3/tests/utils.d.ts +0 -22
- package/types/ComboBox/v3/utils/hooks/useKeyboardNavigation.d.ts +0 -4
- package/types/ComboBox/v3/utils/hooks/useOnElementResize.d.ts +0 -3
- package/types/ComboBox/v3/utils/listHelper.d.ts +0 -7
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { PropTypes } from 'react-desc';
|
|
2
|
-
|
|
3
|
-
const propTypes = {
|
|
4
|
-
placeholder: PropTypes.string.description('input s placeholder value').defaultValue(''),
|
|
5
|
-
options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description('List of options').defaultValue([]),
|
|
6
|
-
selectedValues: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.object), PropTypes.object]).description('Array of option or single option selected'),
|
|
7
|
-
autoFocus: PropTypes.bool.description('Whether the combo box uses auto focus or not').defaultValue('false'),
|
|
8
|
-
hasError: PropTypes.bool.description('Whether the combo box has error or not').defaultValue('false'),
|
|
9
|
-
onChange: PropTypes.func.description('function triggered when an option is selected it will send the options selected').defaultValue(''),
|
|
10
|
-
onSelectAll: PropTypes.func.description('function triggered when ALL button is selected from the header menu list').defaultValue(''),
|
|
11
|
-
onFilter: PropTypes.func.description('function triggered when user type in the combobox input').defaultValue(''),
|
|
12
|
-
onCreate: PropTypes.func.description('function triggered when user select "create" a new item whenever is not a match in the all option list').defaultValue(''),
|
|
13
|
-
onClearAll: PropTypes.func.description('function triggered when user select CLEAR button from the header menu list').defaultValue(''),
|
|
14
|
-
onMenuOpen: PropTypes.func.description('function triggered when user open the menu list').defaultValue(''),
|
|
15
|
-
inputMinWidth: PropTypes.any.description('Minimum width for the combo box input controller').defaultValue(undefined),
|
|
16
|
-
menuMinWidth: PropTypes.any.description('Minimum width for the dropdown menu').defaultValue(undefined),
|
|
17
|
-
menuMaxHeight: PropTypes.any.description('Maximum height for the dropdown menu').defaultValue(undefined),
|
|
18
|
-
withToggle: PropTypes.bool.description('POC purpose this prop will not remain').defaultValue('false')
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
export { propTypes };
|
|
@@ -1,148 +0,0 @@
|
|
|
1
|
-
import 'core-js/modules/esnext.async-iterator.find.js';
|
|
2
|
-
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
-
import 'core-js/modules/esnext.iterator.find.js';
|
|
4
|
-
import { useContext, useCallback } from 'react';
|
|
5
|
-
import { ComboBoxContext } from '../../ComboBoxCTX.js';
|
|
6
|
-
import { getOptions, findInCircularList } from '../listHelper.js';
|
|
7
|
-
|
|
8
|
-
const isOptionFocuseable = opt => !['section', 'separator'].includes(opt.type);
|
|
9
|
-
|
|
10
|
-
const useKeyboardNavigation = () => {
|
|
11
|
-
const {
|
|
12
|
-
props: {
|
|
13
|
-
inline,
|
|
14
|
-
onSelectAll,
|
|
15
|
-
onKeyDown,
|
|
16
|
-
onChange,
|
|
17
|
-
onCreate,
|
|
18
|
-
options,
|
|
19
|
-
selectedValues,
|
|
20
|
-
onFilter
|
|
21
|
-
},
|
|
22
|
-
setShowPopover,
|
|
23
|
-
showPopover,
|
|
24
|
-
setShowSelectedValue,
|
|
25
|
-
focusOptionIdx,
|
|
26
|
-
inputRef,
|
|
27
|
-
setCurrentOption,
|
|
28
|
-
scrollOptionIntoView
|
|
29
|
-
} = useContext(ComboBoxContext);
|
|
30
|
-
const multiple = Array.isArray(selectedValues);
|
|
31
|
-
const selectableOptions = getOptions(options);
|
|
32
|
-
const currentItemIndex = options.findIndex(opt => opt.dsId === focusOptionIdx);
|
|
33
|
-
const currentItem = options.find(item => item.dsId === focusOptionIdx);
|
|
34
|
-
const selectOption = useCallback(() => {
|
|
35
|
-
if (multiple) {
|
|
36
|
-
if (inputRef.current) onFilter(inputRef.current.value);
|
|
37
|
-
} else {
|
|
38
|
-
onFilter('');
|
|
39
|
-
if (inputRef.current) inputRef.current.value = '';
|
|
40
|
-
setShowSelectedValue(true);
|
|
41
|
-
}
|
|
42
|
-
|
|
43
|
-
onChange(options.find(item => item.dsId === focusOptionIdx));
|
|
44
|
-
setShowPopover(multiple ? true : !showPopover);
|
|
45
|
-
}, [multiple, options, focusOptionIdx, setShowPopover, showPopover, onFilter, inputRef, setShowSelectedValue, onChange]);
|
|
46
|
-
const onInputKeyDown = useCallback(e => {
|
|
47
|
-
const targetElement = e.target; // =============================================================================
|
|
48
|
-
// CUSTOM KEYS
|
|
49
|
-
// =============================================================================
|
|
50
|
-
|
|
51
|
-
onKeyDown(e, currentItem); // =============================================================================
|
|
52
|
-
// ENTER KEY TO CREATE ELEMENTS
|
|
53
|
-
// ====================================================== =================
|
|
54
|
-
|
|
55
|
-
if (e.key === 'Enter' && onCreate && !selectableOptions.length) {
|
|
56
|
-
onCreate(targetElement.value);
|
|
57
|
-
onFilter('');
|
|
58
|
-
if (inputRef.current) inputRef.current.value = '';
|
|
59
|
-
return;
|
|
60
|
-
} // =============================================================================
|
|
61
|
-
// ENTER AND SPACE KEY SELECT OPTIONS AND OPEN CLOSE THE POPOVER
|
|
62
|
-
// =============================================================================
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
if (e.keyCode === 32 && targetElement.value === '' || e.key === 'Enter') {
|
|
66
|
-
e.preventDefault();
|
|
67
|
-
|
|
68
|
-
if (!showPopover && !inline) {
|
|
69
|
-
setShowPopover(true);
|
|
70
|
-
} else {
|
|
71
|
-
selectOption();
|
|
72
|
-
}
|
|
73
|
-
} // =============================================================================
|
|
74
|
-
// CTRL + ENTER + MULTIPLE: SELECT AND CLOSE MENU
|
|
75
|
-
// =============================================================================
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
if (e.key === 'Enter' && e.ctrlKey && multiple) {
|
|
79
|
-
setShowPopover(false);
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
if (e.key === 'a' && e.ctrlKey && multiple) {
|
|
83
|
-
onSelectAll();
|
|
84
|
-
} // =============================================================================
|
|
85
|
-
// ARROWS UP AND DOWN
|
|
86
|
-
// =============================================================================
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
if (e.key === 'ArrowDown') {
|
|
90
|
-
e.preventDefault();
|
|
91
|
-
|
|
92
|
-
if (showPopover || inline) {
|
|
93
|
-
const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);
|
|
94
|
-
setCurrentOption(options[nextItemIndex].dsId);
|
|
95
|
-
scrollOptionIntoView(options[nextItemIndex].dsId);
|
|
96
|
-
} else {
|
|
97
|
-
setShowPopover(true);
|
|
98
|
-
}
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
if (e.key === 'ArrowUp') {
|
|
102
|
-
e.preventDefault();
|
|
103
|
-
|
|
104
|
-
if (showPopover || inline) {
|
|
105
|
-
const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);
|
|
106
|
-
setCurrentOption(options[nextItemIndex].dsId);
|
|
107
|
-
scrollOptionIntoView(options[nextItemIndex].dsId);
|
|
108
|
-
} else {
|
|
109
|
-
setShowPopover(true);
|
|
110
|
-
setTimeout(() => {
|
|
111
|
-
const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);
|
|
112
|
-
setCurrentOption(options[nextItemIndex].dsId);
|
|
113
|
-
scrollOptionIntoView(options[nextItemIndex].dsId);
|
|
114
|
-
});
|
|
115
|
-
}
|
|
116
|
-
} // =============================================================================
|
|
117
|
-
// ESCAPE
|
|
118
|
-
// =============================================================================
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
if (e.key === 'Escape' && !inline) {
|
|
122
|
-
setShowPopover(false); // TODO confirm funcionality
|
|
123
|
-
// onFilter('');
|
|
124
|
-
// inputRef.current.value = '';
|
|
125
|
-
} // =============================================================================
|
|
126
|
-
// BACKSPACE
|
|
127
|
-
// =============================================================================
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
if (e.key === 'Backspace' && targetElement.value.length <= 0 && !inline) {
|
|
131
|
-
if (multiple && !targetElement.value) {
|
|
132
|
-
if (selectedValues.length > 0) onChange(selectedValues[selectedValues.length - 1]);
|
|
133
|
-
} else {
|
|
134
|
-
onChange(null);
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
onFilter('');
|
|
138
|
-
setShowSelectedValue(true);
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
if (e.key === 'Tab' && inline) ;
|
|
142
|
-
}, [scrollOptionIntoView, currentItemIndex, options, currentItem, selectableOptions, inputRef, multiple, showPopover, selectedValues, inline, onKeyDown, onSelectAll, onChange, onCreate, onFilter, setCurrentOption, setShowPopover, setShowSelectedValue, selectOption]);
|
|
143
|
-
return {
|
|
144
|
-
onInputKeyDown
|
|
145
|
-
};
|
|
146
|
-
};
|
|
147
|
-
|
|
148
|
-
export { useKeyboardNavigation };
|
|
@@ -1,33 +0,0 @@
|
|
|
1
|
-
import 'core-js/modules/web.dom-collections.iterator.js';
|
|
2
|
-
import { useState, useRef, useEffect, useMemo } from 'react';
|
|
3
|
-
|
|
4
|
-
// Taken and modified from https://stackoverflow.com/a/60218754
|
|
5
|
-
|
|
6
|
-
const useOnElementResize = targetRef => {
|
|
7
|
-
var _targetRef$current, _targetRef$current2;
|
|
8
|
-
|
|
9
|
-
const [width, setWidth] = useState(targetRef.current ? (_targetRef$current = targetRef.current) === null || _targetRef$current === void 0 ? void 0 : _targetRef$current.offsetWidth : 0);
|
|
10
|
-
const [height, setHeight] = useState(targetRef.current ? (_targetRef$current2 = targetRef.current) === null || _targetRef$current2 === void 0 ? void 0 : _targetRef$current2.offsetWidth : 0);
|
|
11
|
-
const observer = useRef(null);
|
|
12
|
-
useEffect(() => {
|
|
13
|
-
function outputsize() {
|
|
14
|
-
if (targetRef.current) {
|
|
15
|
-
setWidth(targetRef.current.offsetWidth);
|
|
16
|
-
setHeight(targetRef.current.offsetHeight);
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
observer.current = new ResizeObserver(outputsize).observe(targetRef.current);
|
|
21
|
-
return () => {
|
|
22
|
-
var _observer$current;
|
|
23
|
-
|
|
24
|
-
(_observer$current = observer.current) === null || _observer$current === void 0 ? void 0 : _observer$current.disconnect();
|
|
25
|
-
};
|
|
26
|
-
}, [targetRef]);
|
|
27
|
-
return useMemo(() => ({
|
|
28
|
-
width,
|
|
29
|
-
height
|
|
30
|
-
}), [width, height]);
|
|
31
|
-
};
|
|
32
|
-
|
|
33
|
-
export { useOnElementResize };
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import 'core-js/modules/esnext.async-iterator.filter.js';
|
|
2
|
-
import 'core-js/modules/esnext.iterator.constructor.js';
|
|
3
|
-
import 'core-js/modules/esnext.iterator.filter.js';
|
|
4
|
-
import 'core-js/modules/esnext.async-iterator.some.js';
|
|
5
|
-
import 'core-js/modules/esnext.iterator.some.js';
|
|
6
|
-
|
|
7
|
-
const getSelectableOptions = options => options ? options.filter(option => option.type === 'option' && !option.disabled) : [];
|
|
8
|
-
const getOptions = options => options ? options.filter(option => option.type === 'option') : [];
|
|
9
|
-
const isSelectedValueEmpty = value => Array.isArray(value) ? value.length === 0 : !value;
|
|
10
|
-
const isSelectedValueMultiple = value => Array.isArray(value);
|
|
11
|
-
const isSelected = (value, activeOption) => {
|
|
12
|
-
if (isSelectedValueMultiple(value)) {
|
|
13
|
-
const multiValue = value;
|
|
14
|
-
return multiValue.some(item => (item === null || item === void 0 ? void 0 : item.value) === (activeOption === null || activeOption === void 0 ? void 0 : activeOption.value));
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
const singleValue = value;
|
|
18
|
-
return (singleValue === null || singleValue === void 0 ? void 0 : singleValue.value) === activeOption.value;
|
|
19
|
-
};
|
|
20
|
-
const findInCircularList = function (list, from, criteria) {
|
|
21
|
-
let step = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
|
|
22
|
-
|
|
23
|
-
for (let i = (from + step + list.length) % list.length; i !== from; i = (i + step + list.length) % list.length) {
|
|
24
|
-
if (criteria(list[i])) return i;
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
return from; // return same item
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
export { findInCircularList, getOptions, getSelectableOptions, isSelected, isSelectedValueEmpty, isSelectedValueMultiple };
|
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
/// <reference path="../../../../../../shared/typings/react-desc.d.ts" />
|
|
2
|
-
/// <reference types="react" />
|
|
3
|
-
import type { ComboBoxPropsT } from './index.d';
|
|
4
|
-
declare const DSComboBox: {
|
|
5
|
-
(props: ComboBoxPropsT): JSX.Element;
|
|
6
|
-
propTypes: {
|
|
7
|
-
placeholder: {
|
|
8
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
9
|
-
};
|
|
10
|
-
options: {
|
|
11
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
12
|
-
};
|
|
13
|
-
selectedValues: {
|
|
14
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
15
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
16
|
-
};
|
|
17
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
18
|
-
};
|
|
19
|
-
autoFocus: {
|
|
20
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
21
|
-
};
|
|
22
|
-
hasError: {
|
|
23
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
24
|
-
};
|
|
25
|
-
onChange: {
|
|
26
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
27
|
-
};
|
|
28
|
-
onSelectAll: {
|
|
29
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
30
|
-
};
|
|
31
|
-
onFilter: {
|
|
32
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
33
|
-
};
|
|
34
|
-
onCreate: {
|
|
35
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
36
|
-
};
|
|
37
|
-
onClearAll: {
|
|
38
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
39
|
-
};
|
|
40
|
-
onMenuOpen: {
|
|
41
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
42
|
-
};
|
|
43
|
-
inputMinWidth: {
|
|
44
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
45
|
-
};
|
|
46
|
-
menuMinWidth: {
|
|
47
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
48
|
-
};
|
|
49
|
-
menuMaxHeight: {
|
|
50
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
51
|
-
};
|
|
52
|
-
withToggle: {
|
|
53
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
54
|
-
};
|
|
55
|
-
};
|
|
56
|
-
};
|
|
57
|
-
declare const DSComboBoxWithSchema: {
|
|
58
|
-
(props?: ComboBoxPropsT | undefined): JSX.Element;
|
|
59
|
-
propTypes: unknown;
|
|
60
|
-
toTypescript: () => import("react-desc").TypescriptSchema;
|
|
61
|
-
};
|
|
62
|
-
export { DSComboBox, DSComboBoxWithSchema };
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ComboBoxPropsT, ComboBoxContextT } from './index.d';
|
|
3
|
-
export declare const defaultProps: ComboBoxPropsT;
|
|
4
|
-
/** Context for cross component communication */
|
|
5
|
-
export declare const ComboBoxContext: import("react").Context<ComboBoxContextT>;
|
|
6
|
-
export default ComboBoxContext;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
export declare const ComboboxDataTestid: {
|
|
2
|
-
INPUT: string;
|
|
3
|
-
LIST: string;
|
|
4
|
-
SELECTED_VALUES: string;
|
|
5
|
-
SELECT_ALL_BUTTON: string;
|
|
6
|
-
CLEAR_ALL_BUTTON: string;
|
|
7
|
-
DROPDOWN: string;
|
|
8
|
-
OPTION: string;
|
|
9
|
-
SHOW_ALL_BUTTON: string;
|
|
10
|
-
SHOW_SELECTED_OPTIONS_BUTTON: string;
|
|
11
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { DSComboBox, DSComboBoxWithSchema } from './ComboBox';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const StyledA11ySelectedValues: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Container } from './Container';
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
export declare const StyledContainerWithPopper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const StyledContainerInline: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
-
export declare const StyledPopperWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Controls } from './Controls';
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
import { ComboBoxPropsT } from '../../index.d';
|
|
3
|
-
export declare const StyledControlsWrapper: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("@elliemae/ds-grid/types/types").GridPropsT & import("react").RefAttributes<HTMLDivElement>>, import("styled-components").DefaultTheme, Pick<ComboBoxPropsT, "hasError" | "inline">, never>;
|
|
4
|
-
export declare const StyledSelection: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
5
|
-
export declare const StyledHeaderActionsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
-
export declare const StyleDropdownIndicator: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
-
export declare const StyleHeaderActionsSeparator: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
export declare const StyledInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const StyledInputPlaceHolder: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
-
export declare const StyledInputWidthReference: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
4
|
-
export declare const StyledInputWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/// <reference types="react" />
|
|
2
|
-
interface UseControlsInputT {
|
|
3
|
-
handleOnFocus: () => void;
|
|
4
|
-
handleOnBlur: () => void;
|
|
5
|
-
handleOnChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
|
|
6
|
-
showPlaceholder?: string;
|
|
7
|
-
spanReferenceText: string;
|
|
8
|
-
width: number;
|
|
9
|
-
spanReference: React.Ref<HTMLSpanElement>;
|
|
10
|
-
}
|
|
11
|
-
declare const useControlsInput: () => UseControlsInputT;
|
|
12
|
-
export { useControlsInput };
|
|
File without changes
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const StyledDropDownButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
export declare const StyledNoResultsWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const StyledNoResults: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { HeaderList } from './HeaderList';
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
export declare const StyledHeaderListWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const StyledSeparator: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
|
|
3
|
-
export declare const StyledButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
|
|
4
|
-
export declare const StyledButtonSelection: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
|
|
5
|
-
export declare const StyledShowAllButton: import("styled-components").StyledComponent<any, import("styled-components").DefaultTheme, any, any>;
|
|
6
|
-
export declare const StyledSelectedItems: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
7
|
-
export declare const StyledNoOptionsSelected: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
interface useHeaderListHandlersT {
|
|
3
|
-
handleKeyDown: (e: React.KeyboardEvent) => void;
|
|
4
|
-
handleToggle: () => void;
|
|
5
|
-
handleOnMouseDown: (e: React.MouseEvent) => void;
|
|
6
|
-
handleClickOnClearAll: (e: Event) => void;
|
|
7
|
-
handleClickOnSelectAll: () => void;
|
|
8
|
-
handleOnBlurClearAll: (e: Event) => void;
|
|
9
|
-
handleOnBlurSelectAll: (e: Event) => void;
|
|
10
|
-
}
|
|
11
|
-
declare const useHeaderListHandlers: () => useHeaderListHandlersT;
|
|
12
|
-
export { useHeaderListHandlers };
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { MenuList } from './MenuList';
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
export declare const StyledListWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
|
|
2
|
-
inline: boolean | undefined;
|
|
3
|
-
minWidth: string | number;
|
|
4
|
-
}, never>;
|
|
5
|
-
export declare const StyledList: import("styled-components").StyledComponent<"ul", import("styled-components").DefaultTheme, {}, never>;
|
|
6
|
-
export declare const StyledVirtualListWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {
|
|
7
|
-
inline: boolean | undefined;
|
|
8
|
-
maxHeight: number;
|
|
9
|
-
withHeader: boolean;
|
|
10
|
-
}, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { MultiSelectedValuesContainer } from './MultiSelectedValuesContainer';
|
|
@@ -1,3 +0,0 @@
|
|
|
1
|
-
export declare const StyledGroupedPillPopoverContent: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
2
|
-
export declare const StyledGroupPillWrapper: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
3
|
-
export declare const StyledA11ySelectedValues: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { SingleSelectedValueContainer } from './SingleSelectedValueContainer';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const StyledSingleSelectedValue: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
/// <reference path="../../../../../../shared/typings/react-desc.d.ts" />
|
|
2
|
-
export declare const propTypes: {
|
|
3
|
-
placeholder: {
|
|
4
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
5
|
-
};
|
|
6
|
-
options: {
|
|
7
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
8
|
-
};
|
|
9
|
-
selectedValues: {
|
|
10
|
-
defaultValue(arg: import("react-desc").ReactDescPossibleDefaultValues): {
|
|
11
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
12
|
-
};
|
|
13
|
-
isRequired: import("react-desc").PropTypesDescValue;
|
|
14
|
-
};
|
|
15
|
-
autoFocus: {
|
|
16
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
17
|
-
};
|
|
18
|
-
hasError: {
|
|
19
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
20
|
-
};
|
|
21
|
-
onChange: {
|
|
22
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
23
|
-
};
|
|
24
|
-
onSelectAll: {
|
|
25
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
26
|
-
};
|
|
27
|
-
onFilter: {
|
|
28
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
29
|
-
};
|
|
30
|
-
onCreate: {
|
|
31
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
32
|
-
};
|
|
33
|
-
onClearAll: {
|
|
34
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
35
|
-
};
|
|
36
|
-
onMenuOpen: {
|
|
37
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
38
|
-
};
|
|
39
|
-
inputMinWidth: {
|
|
40
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
41
|
-
};
|
|
42
|
-
menuMinWidth: {
|
|
43
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
44
|
-
};
|
|
45
|
-
menuMaxHeight: {
|
|
46
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
47
|
-
};
|
|
48
|
-
withToggle: {
|
|
49
|
-
deprecated: import("react-desc").PropTypesDescValidator;
|
|
50
|
-
};
|
|
51
|
-
};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export {};
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
export declare const basicOptions: {
|
|
2
|
-
dsId: string;
|
|
3
|
-
type: string;
|
|
4
|
-
value: string;
|
|
5
|
-
label: string;
|
|
6
|
-
}[];
|
|
7
|
-
export declare const groupedOptions: ({
|
|
8
|
-
dsId: string;
|
|
9
|
-
type: string;
|
|
10
|
-
value: string;
|
|
11
|
-
label: string;
|
|
12
|
-
} | {
|
|
13
|
-
dsId: string;
|
|
14
|
-
type: string;
|
|
15
|
-
value?: undefined;
|
|
16
|
-
label?: undefined;
|
|
17
|
-
} | {
|
|
18
|
-
dsId: string;
|
|
19
|
-
type: string;
|
|
20
|
-
label: string;
|
|
21
|
-
value?: undefined;
|
|
22
|
-
})[];
|