@elliemae/ds-form 2.2.0-alpha.1 → 3.0.0-next.1

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.
Files changed (152) hide show
  1. package/cjs/ComboBox/index.js +0 -3
  2. package/cjs/ComboBoxFreeSolo/ComboBoxFreeSolo.js +0 -1
  3. package/cjs/index.js +0 -2
  4. package/esm/ComboBox/index.js +0 -1
  5. package/esm/ComboBoxFreeSolo/ComboBoxFreeSolo.js +0 -1
  6. package/esm/index.js +0 -1
  7. package/package.json +23 -207
  8. package/types/ComboBox/index.d.ts +0 -1
  9. package/types/MenuItem/components/SubmenuItem/styled.d.ts +1 -1
  10. package/types/MenuItem/components/styled.d.ts +3 -3
  11. package/cjs/ComboBox/v3/ComboBox.js +0 -33
  12. package/cjs/ComboBox/v3/ComboBoxCTX.js +0 -55
  13. package/cjs/ComboBox/v3/ComboboxDataTestids.js +0 -17
  14. package/cjs/ComboBox/v3/config/constants.js +0 -14
  15. package/cjs/ComboBox/v3/config/useComboBox.js +0 -122
  16. package/cjs/ComboBox/v3/config/useGetPropsWithDefault.js +0 -11
  17. package/cjs/ComboBox/v3/index.d.js +0 -2
  18. package/cjs/ComboBox/v3/index.js +0 -10
  19. package/cjs/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js +0 -33
  20. package/cjs/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js +0 -28
  21. package/cjs/ComboBox/v3/parts/a11y-messages/index.js +0 -11
  22. package/cjs/ComboBox/v3/parts/a11y-messages/styled.js +0 -15
  23. package/cjs/ComboBox/v3/parts/container/Container.js +0 -67
  24. package/cjs/ComboBox/v3/parts/container/index.js +0 -9
  25. package/cjs/ComboBox/v3/parts/container/styled.js +0 -23
  26. package/cjs/ComboBox/v3/parts/controls/Controls.js +0 -71
  27. package/cjs/ComboBox/v3/parts/controls/index.js +0 -9
  28. package/cjs/ComboBox/v3/parts/controls/styled.js +0 -65
  29. package/cjs/ComboBox/v3/parts/controls-input/ControlsInput.js +0 -67
  30. package/cjs/ComboBox/v3/parts/controls-input/styled.js +0 -27
  31. package/cjs/ComboBox/v3/parts/controls-input/useControlsInput.js +0 -77
  32. package/cjs/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js +0 -33
  33. package/cjs/ComboBox/v3/parts/dropdown-indicator/index.js +0 -2
  34. package/cjs/ComboBox/v3/parts/dropdown-indicator/styled.js +0 -17
  35. package/cjs/ComboBox/v3/parts/empty-state/index.js +0 -27
  36. package/cjs/ComboBox/v3/parts/empty-state/styled.js +0 -19
  37. package/cjs/ComboBox/v3/parts/header-list/HeaderList.js +0 -113
  38. package/cjs/ComboBox/v3/parts/header-list/index.js +0 -9
  39. package/cjs/ComboBox/v3/parts/header-list/styled.js +0 -58
  40. package/cjs/ComboBox/v3/parts/header-list/useHeaderListHandlers.js +0 -73
  41. package/cjs/ComboBox/v3/parts/menu-list/MenuList.js +0 -81
  42. package/cjs/ComboBox/v3/parts/menu-list/index.js +0 -9
  43. package/cjs/ComboBox/v3/parts/menu-list/styled.js +0 -33
  44. package/cjs/ComboBox/v3/parts/menu-list/useItemRenderer.js +0 -105
  45. package/cjs/ComboBox/v3/parts/menu-list/useMenuList.js +0 -61
  46. package/cjs/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +0 -63
  47. package/cjs/ComboBox/v3/parts/multi-selected-values-container/index.js +0 -9
  48. package/cjs/ComboBox/v3/parts/multi-selected-values-container/styled.js +0 -23
  49. package/cjs/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js +0 -71
  50. package/cjs/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js +0 -28
  51. package/cjs/ComboBox/v3/parts/single-selected-value-container/index.js +0 -9
  52. package/cjs/ComboBox/v3/parts/single-selected-value-container/styled.js +0 -15
  53. package/cjs/ComboBox/v3/propTypes.js +0 -25
  54. package/cjs/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +0 -152
  55. package/cjs/ComboBox/v3/utils/hooks/useOnElementResize.js +0 -37
  56. package/cjs/ComboBox/v3/utils/listHelper.js +0 -39
  57. package/esm/ComboBox/v3/ComboBox.js +0 -24
  58. package/esm/ComboBox/v3/ComboBoxCTX.js +0 -49
  59. package/esm/ComboBox/v3/ComboboxDataTestids.js +0 -13
  60. package/esm/ComboBox/v3/config/constants.js +0 -10
  61. package/esm/ComboBox/v3/config/useComboBox.js +0 -114
  62. package/esm/ComboBox/v3/config/useGetPropsWithDefault.js +0 -7
  63. package/esm/ComboBox/v3/index.d.js +0 -1
  64. package/esm/ComboBox/v3/index.js +0 -1
  65. package/esm/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.js +0 -25
  66. package/esm/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.js +0 -20
  67. package/esm/ComboBox/v3/parts/a11y-messages/index.js +0 -2
  68. package/esm/ComboBox/v3/parts/a11y-messages/styled.js +0 -7
  69. package/esm/ComboBox/v3/parts/container/Container.js +0 -59
  70. package/esm/ComboBox/v3/parts/container/index.js +0 -1
  71. package/esm/ComboBox/v3/parts/container/styled.js +0 -13
  72. package/esm/ComboBox/v3/parts/controls/Controls.js +0 -63
  73. package/esm/ComboBox/v3/parts/controls/index.js +0 -1
  74. package/esm/ComboBox/v3/parts/controls/styled.js +0 -52
  75. package/esm/ComboBox/v3/parts/controls-input/ControlsInput.js +0 -59
  76. package/esm/ComboBox/v3/parts/controls-input/styled.js +0 -16
  77. package/esm/ComboBox/v3/parts/controls-input/useControlsInput.js +0 -73
  78. package/esm/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.js +0 -26
  79. package/esm/ComboBox/v3/parts/dropdown-indicator/index.js +0 -1
  80. package/esm/ComboBox/v3/parts/dropdown-indicator/styled.js +0 -8
  81. package/esm/ComboBox/v3/parts/empty-state/index.js +0 -19
  82. package/esm/ComboBox/v3/parts/empty-state/styled.js +0 -10
  83. package/esm/ComboBox/v3/parts/header-list/HeaderList.js +0 -105
  84. package/esm/ComboBox/v3/parts/header-list/index.js +0 -1
  85. package/esm/ComboBox/v3/parts/header-list/styled.js +0 -41
  86. package/esm/ComboBox/v3/parts/header-list/useHeaderListHandlers.js +0 -69
  87. package/esm/ComboBox/v3/parts/menu-list/MenuList.js +0 -73
  88. package/esm/ComboBox/v3/parts/menu-list/index.js +0 -1
  89. package/esm/ComboBox/v3/parts/menu-list/styled.js +0 -23
  90. package/esm/ComboBox/v3/parts/menu-list/useItemRenderer.js +0 -97
  91. package/esm/ComboBox/v3/parts/menu-list/useMenuList.js +0 -57
  92. package/esm/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.js +0 -54
  93. package/esm/ComboBox/v3/parts/multi-selected-values-container/index.js +0 -1
  94. package/esm/ComboBox/v3/parts/multi-selected-values-container/styled.js +0 -13
  95. package/esm/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.js +0 -67
  96. package/esm/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.js +0 -20
  97. package/esm/ComboBox/v3/parts/single-selected-value-container/index.js +0 -1
  98. package/esm/ComboBox/v3/parts/single-selected-value-container/styled.js +0 -7
  99. package/esm/ComboBox/v3/propTypes.js +0 -21
  100. package/esm/ComboBox/v3/utils/hooks/useKeyboardNavigation.js +0 -148
  101. package/esm/ComboBox/v3/utils/hooks/useOnElementResize.js +0 -33
  102. package/esm/ComboBox/v3/utils/listHelper.js +0 -30
  103. package/types/ComboBox/v3/ComboBox.d.ts +0 -62
  104. package/types/ComboBox/v3/ComboBoxCTX.d.ts +0 -6
  105. package/types/ComboBox/v3/ComboboxDataTestids.d.ts +0 -11
  106. package/types/ComboBox/v3/config/constants.d.ts +0 -8
  107. package/types/ComboBox/v3/config/useComboBox.d.ts +0 -2
  108. package/types/ComboBox/v3/config/useGetPropsWithDefault.d.ts +0 -2
  109. package/types/ComboBox/v3/index.d.ts +0 -1
  110. package/types/ComboBox/v3/parts/a11y-messages/MultiAllyMessages.d.ts +0 -3
  111. package/types/ComboBox/v3/parts/a11y-messages/SingleAllyMessages.d.ts +0 -3
  112. package/types/ComboBox/v3/parts/a11y-messages/index.d.ts +0 -2
  113. package/types/ComboBox/v3/parts/a11y-messages/styled.d.ts +0 -1
  114. package/types/ComboBox/v3/parts/container/Container.d.ts +0 -3
  115. package/types/ComboBox/v3/parts/container/index.d.ts +0 -1
  116. package/types/ComboBox/v3/parts/container/styled.d.ts +0 -3
  117. package/types/ComboBox/v3/parts/controls/Controls.d.ts +0 -3
  118. package/types/ComboBox/v3/parts/controls/index.d.ts +0 -1
  119. package/types/ComboBox/v3/parts/controls/styled.d.ts +0 -7
  120. package/types/ComboBox/v3/parts/controls-input/ControlsInput.d.ts +0 -3
  121. package/types/ComboBox/v3/parts/controls-input/styled.d.ts +0 -4
  122. package/types/ComboBox/v3/parts/controls-input/useControlsInput.d.ts +0 -12
  123. package/types/ComboBox/v3/parts/dropdown-indicator/DropdownIndicator.d.ts +0 -3
  124. package/types/ComboBox/v3/parts/dropdown-indicator/index.d.ts +0 -0
  125. package/types/ComboBox/v3/parts/dropdown-indicator/styled.d.ts +0 -1
  126. package/types/ComboBox/v3/parts/empty-state/index.d.ts +0 -3
  127. package/types/ComboBox/v3/parts/empty-state/styled.d.ts +0 -2
  128. package/types/ComboBox/v3/parts/header-list/HeaderList.d.ts +0 -3
  129. package/types/ComboBox/v3/parts/header-list/index.d.ts +0 -1
  130. package/types/ComboBox/v3/parts/header-list/styled.d.ts +0 -7
  131. package/types/ComboBox/v3/parts/header-list/useHeaderListHandlers.d.ts +0 -12
  132. package/types/ComboBox/v3/parts/menu-list/MenuList.d.ts +0 -3
  133. package/types/ComboBox/v3/parts/menu-list/index.d.ts +0 -1
  134. package/types/ComboBox/v3/parts/menu-list/styled.d.ts +0 -10
  135. package/types/ComboBox/v3/parts/menu-list/useItemRenderer.d.ts +0 -2
  136. package/types/ComboBox/v3/parts/menu-list/useMenuList.d.ts +0 -2
  137. package/types/ComboBox/v3/parts/multi-selected-values-container/MultiSelectedValuesContainer.d.ts +0 -3
  138. package/types/ComboBox/v3/parts/multi-selected-values-container/index.d.ts +0 -1
  139. package/types/ComboBox/v3/parts/multi-selected-values-container/styled.d.ts +0 -3
  140. package/types/ComboBox/v3/parts/multi-selected-values-container/useGroupPills.d.ts +0 -2
  141. package/types/ComboBox/v3/parts/single-selected-value-container/SingleSelectedValueContainer.d.ts +0 -3
  142. package/types/ComboBox/v3/parts/single-selected-value-container/index.d.ts +0 -1
  143. package/types/ComboBox/v3/parts/single-selected-value-container/styled.d.ts +0 -1
  144. package/types/ComboBox/v3/propTypes.d.ts +0 -51
  145. package/types/ComboBox/v3/tests/combobox-general.test.d.ts +0 -1
  146. package/types/ComboBox/v3/tests/combobox-multi-select.test.d.ts +0 -1
  147. package/types/ComboBox/v3/tests/combobox-single-select.test.d.ts +0 -1
  148. package/types/ComboBox/v3/tests/combobox-special-keys.test.d.ts +0 -1
  149. package/types/ComboBox/v3/tests/utils.d.ts +0 -22
  150. package/types/ComboBox/v3/utils/hooks/useKeyboardNavigation.d.ts +0 -4
  151. package/types/ComboBox/v3/utils/hooks/useOnElementResize.d.ts +0 -3
  152. package/types/ComboBox/v3/utils/listHelper.d.ts +0 -7
@@ -1,113 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- var React = require('react');
7
- var lodash = require('lodash');
8
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
9
- var styled = require('./styled.js');
10
- var listHelper = require('../../utils/listHelper.js');
11
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
12
- var useHeaderListHandlers = require('./useHeaderListHandlers.js');
13
- var jsxRuntime = require('react/jsx-runtime');
14
-
15
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
16
-
17
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
18
-
19
- var _StyledSeparator, _StyledNoOptionsSelec, _StyledSeparator2;
20
-
21
- const HeaderList = () => {
22
- var _inputRef$current;
23
-
24
- const {
25
- props: {
26
- onSelectAll,
27
- onClearAll,
28
- withToggle,
29
- selectedValues,
30
- options
31
- },
32
- showSelectedOptions,
33
- inputRef
34
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
35
- const isSelectAllSupplied = onSelectAll !== lodash.noop;
36
- const isClearAllSupplied = onClearAll !== lodash.noop;
37
- const multiSelectedValues = selectedValues;
38
- const selectableOptions = listHelper.getSelectableOptions(options);
39
- const {
40
- handleKeyDown,
41
- handleClickOnClearAll,
42
- handleClickOnSelectAll,
43
- handleOnBlurClearAll,
44
- handleOnBlurSelectAll,
45
- handleOnMouseDown,
46
- handleToggle
47
- } = useHeaderListHandlers.useHeaderListHandlers();
48
- return /*#__PURE__*/_jsx__default["default"](styled.StyledHeaderListWrapper, {
49
- onKeyDown: handleKeyDown,
50
- onMouseDown: handleOnMouseDown
51
- }, void 0, /*#__PURE__*/_jsx__default["default"](styled.StyledSelectedItems, {}, void 0, isSelectAllSupplied && /*#__PURE__*/_jsx__default["default"](styled.StyledButton, {
52
- 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,
53
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.SELECT_ALL_BUTTON,
54
- buttonType: "text",
55
- labelText: "All",
56
- size: "s",
57
- onMouseDown: handleOnMouseDown,
58
- onBlur: handleOnBlurSelectAll,
59
- onClick: handleClickOnSelectAll
60
- }), isSelectAllSupplied && isClearAllSupplied && (_StyledSeparator || (_StyledSeparator = /*#__PURE__*/_jsx__default["default"](styled.StyledSeparator, {
61
- orientation: "vertical",
62
- position: "center",
63
- type: "group-level",
64
- margin: "none"
65
- }))), isClearAllSupplied && /*#__PURE__*/_jsx__default["default"](styled.StyledButton, {
66
- disabled: multiSelectedValues.length === 0,
67
- tabIndex: 0,
68
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.CLEAR_ALL_BUTTON,
69
- buttonType: "text",
70
- size: "s",
71
- labelText: "Clear",
72
- onMouseDown: handleOnMouseDown,
73
- onBlur: handleOnBlurClearAll,
74
- onClick: handleClickOnClearAll
75
- })), /*#__PURE__*/_jsx__default["default"](styled.StyledSelectedItems, {}, void 0, withToggle ? /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
76
- children: multiSelectedValues.length > 0 ? /*#__PURE__*/_jsx__default["default"](styled.StyledButtonSelection, {
77
- buttonType: "text",
78
- disabled: !showSelectedOptions && selectableOptions.length === multiSelectedValues.length,
79
- onClick: handleToggle,
80
- labelText: !showSelectedOptions ? "".concat(multiSelectedValues.length, " SELECTED") : 'SHOW ALL',
81
- size: "s"
82
- }) : _StyledNoOptionsSelec || (_StyledNoOptionsSelec = /*#__PURE__*/_jsx__default["default"](styled.StyledNoOptionsSelected, {}, void 0, "0 SELECTED"))
83
- }) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
84
- children: [/*#__PURE__*/_jsx__default["default"](styled.StyledShowAllButton, {
85
- buttonType: "text",
86
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.SHOW_ALL_BUTTON,
87
- tabIndex: !showSelectedOptions ? -1 : 0,
88
- onClick: showSelectedOptions ? handleToggle : lodash.noop,
89
- labelText: "SHOW ALL",
90
- isSelected: !showSelectedOptions,
91
- size: "s",
92
- style: {
93
- fontWeight: showSelectedOptions ? '300' : '600'
94
- }
95
- }), _StyledSeparator2 || (_StyledSeparator2 = /*#__PURE__*/_jsx__default["default"](styled.StyledSeparator, {
96
- orientation: "vertical",
97
- position: "center",
98
- type: "group-level",
99
- margin: "none"
100
- })), /*#__PURE__*/_jsx__default["default"](styled.StyledButtonSelection, {
101
- tabIndex: showSelectedOptions ? -1 : 0,
102
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.SHOW_SELECTED_OPTIONS_BUTTON,
103
- disabled: multiSelectedValues.length === 0 || !showSelectedOptions && selectableOptions.length === multiSelectedValues.length,
104
- buttonType: "text",
105
- isSelected: showSelectedOptions,
106
- onClick: !showSelectedOptions ? handleToggle : lodash.noop,
107
- labelText: "".concat(multiSelectedValues.length, " SELECTED"),
108
- size: "s"
109
- })]
110
- })));
111
- };
112
-
113
- exports.HeaderList = HeaderList;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var HeaderList = require('./HeaderList.js');
6
-
7
-
8
-
9
- exports.HeaderList = HeaderList.HeaderList;
@@ -1,58 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
6
- var styled = require('styled-components');
7
- var dsSystem = require('@elliemae/ds-system');
8
- var DSButton = require('@elliemae/ds-button');
9
- var DSSeparator = require('@elliemae/ds-separator');
10
-
11
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
12
-
13
- var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
14
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
15
- var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
16
- var DSSeparator__default = /*#__PURE__*/_interopDefaultLegacy(DSSeparator);
17
-
18
- var _templateObject;
19
-
20
- const selectedStyle = isSelected => dsSystem.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n & span {\n border-bottom: 2px solid ", ";\n }\n cursor: ", ";\n"])), props => isSelected ? props.theme.colors.brand[700] : '#FFF', isSelected && 'default');
21
-
22
- const StyledHeaderListWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
23
- componentId: "sc-dazbzt-0"
24
- })(["display:flex;position:fixed;top:0;z-index:10;justify-content:space-between;padding:0px 12px 0px 12px;width:100%;height:28px;background-color:#fff;box-shadow:0 4px 2px -4px ", ";overflow-x:hidden;& button{font-size:13px;}"], props => props.theme.colors.neutral[700]);
25
- const StyledSeparator = /*#__PURE__*/styled__default["default"](DSSeparator__default["default"]).withConfig({
26
- componentId: "sc-dazbzt-1"
27
- })(["height:50%;width:auto;"]);
28
- const StyledButton = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
29
- componentId: "sc-dazbzt-2"
30
- })(["padding:0 ", ";align-items:center;"], props => props.theme.space.xxs);
31
- const StyledGeneralSelectionButton = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
32
- componentId: "sc-dazbzt-3"
33
- })(["border-radius:0px;padding:0 ", ";margin:0;align-items:center;", " transition:unset;"], props => props.theme.space.xxs, _ref => {
34
- let {
35
- isSelected
36
- } = _ref;
37
- return selectedStyle(isSelected);
38
- });
39
- const StyledButtonSelection = /*#__PURE__*/styled__default["default"](StyledGeneralSelectionButton).withConfig({
40
- componentId: "sc-dazbzt-4"
41
- })(["&:hover:not([disabled]){background-color:transparent;color:", ";}"], props => props.theme.colors.brand['700']);
42
- const StyledShowAllButton = /*#__PURE__*/styled__default["default"](StyledGeneralSelectionButton).withConfig({
43
- componentId: "sc-dazbzt-5"
44
- })(["color:", ";&:hover:not([disabled]){background-color:transparent;color:", ";}"], props => props.theme.colors.neutral['700'], props => props.theme.colors.neutral['700']);
45
- const StyledSelectedItems = /*#__PURE__*/styled__default["default"].div.withConfig({
46
- componentId: "sc-dazbzt-6"
47
- })(["display:flex;align-items:center;"]);
48
- const StyledNoOptionsSelected = /*#__PURE__*/styled__default["default"].div.withConfig({
49
- componentId: "sc-dazbzt-7"
50
- })(["padding:0 ", ";"], props => props.theme.space.xxs);
51
-
52
- exports.StyledButton = StyledButton;
53
- exports.StyledButtonSelection = StyledButtonSelection;
54
- exports.StyledHeaderListWrapper = StyledHeaderListWrapper;
55
- exports.StyledNoOptionsSelected = StyledNoOptionsSelected;
56
- exports.StyledSelectedItems = StyledSelectedItems;
57
- exports.StyledSeparator = StyledSeparator;
58
- exports.StyledShowAllButton = StyledShowAllButton;
@@ -1,73 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
7
-
8
- const useHeaderListHandlers = () => {
9
- const {
10
- props: {
11
- onSelectAll,
12
- onFilter,
13
- onClearAll,
14
- selectedValues
15
- },
16
- inputRef,
17
- showSelectedOptions,
18
- setShowSelectedOptions,
19
- setShowPopover
20
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
21
- const multiSelectedValues = selectedValues;
22
- const handleOnBlurSelectAll = React.useCallback(e => {
23
- if (!onClearAll || multiSelectedValues.length === 0) {
24
- e.preventDefault();
25
- inputRef.current.focus();
26
- }
27
- }, [inputRef, onClearAll, multiSelectedValues]);
28
- const handleOnBlurClearAll = React.useCallback(e => {// since ux change order from the action buttons this is unneccesary. will comment until review finish
29
- // e.preventDefault();
30
- // inputRef.current.focus();
31
- }, [inputRef]);
32
- const handleClickOnSelectAll = React.useCallback(() => {
33
- onSelectAll();
34
- inputRef.current.focus();
35
- }, [onSelectAll, inputRef, setShowPopover]);
36
- const handleClickOnClearAll = React.useCallback(e => {
37
- setShowSelectedOptions(false);
38
- e.preventDefault();
39
- e.stopPropagation();
40
- onClearAll();
41
- inputRef.current.focus();
42
- }, [inputRef, setShowSelectedOptions, onClearAll]);
43
- const handleOnMouseDown = React.useCallback(e => {
44
- e.preventDefault();
45
- }, []);
46
- const handleToggle = React.useCallback(() => {
47
- inputRef.current.value = '';
48
- onFilter('');
49
- setShowSelectedOptions(!showSelectedOptions);
50
- inputRef.current.focus();
51
- }, [setShowSelectedOptions, inputRef, onFilter, showSelectedOptions]);
52
- const handleKeyDown = React.useCallback(e => {
53
- if (e.key === 'Escape') {
54
- setShowPopover(false);
55
- }
56
- }, [setShowPopover]);
57
- React.useEffect(() => {
58
- if (multiSelectedValues.length === 0) {
59
- setShowSelectedOptions(false);
60
- }
61
- }, [multiSelectedValues, setShowSelectedOptions]);
62
- return React.useMemo(() => ({
63
- handleKeyDown,
64
- handleToggle,
65
- handleOnMouseDown,
66
- handleClickOnClearAll,
67
- handleClickOnSelectAll,
68
- handleOnBlurClearAll,
69
- handleOnBlurSelectAll
70
- }), [handleKeyDown, handleToggle, handleOnMouseDown, handleClickOnClearAll, handleClickOnSelectAll, handleOnBlurClearAll, handleOnBlurSelectAll]);
71
- };
72
-
73
- exports.useHeaderListHandlers = useHeaderListHandlers;
@@ -1,81 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- var React = require('react');
7
- var styled = require('./styled.js');
8
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
9
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
10
- var HeaderList = require('../header-list/HeaderList.js');
11
- var useOnElementResize = require('../../utils/hooks/useOnElementResize.js');
12
- var index = require('../empty-state/index.js');
13
- var useItemRenderer = require('./useItemRenderer.js');
14
- var useMenuList = require('./useMenuList.js');
15
- var jsxRuntime = require('react/jsx-runtime');
16
-
17
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
18
-
19
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
20
-
21
- var _HeaderList, _EmptyState;
22
-
23
- const MenuList = () => {
24
- const {
25
- props: {
26
- menuMinWidth,
27
- menuMaxHeight,
28
- inline,
29
- options,
30
- selectedValues
31
- },
32
- referenceElement,
33
- inputRef,
34
- listRef,
35
- showPopover,
36
- wrapperListRef,
37
- controlsWrapperRef,
38
- virtualListHelpers: {
39
- totalSize
40
- }
41
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
42
- const multiple = Array.isArray(selectedValues);
43
- const withHeader = !inline && multiple && options.length > 0;
44
- const ItemRenderer = useItemRenderer.useItemRenderer();
45
- useMenuList.useMenuList();
46
- useOnElementResize.useOnElementResize(controlsWrapperRef);
47
- const listWidth = React.useMemo(() => menuMinWidth || "".concat(referenceElement === null || referenceElement === void 0 ? void 0 : referenceElement.offsetWidth), [menuMinWidth, referenceElement]);
48
- const handleOnFocus = React.useCallback(() => {
49
- var _inputRef$current;
50
-
51
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
52
- }, [inputRef]);
53
- return /*#__PURE__*/jsxRuntime.jsxs(styled.StyledListWrapper, {
54
- tabIndex: -1,
55
- ref: wrapperListRef,
56
- inline: inline,
57
- onMouseDown: e => e.preventDefault(),
58
- minWidth: listWidth,
59
- id: "combo-listbox",
60
- role: "listbox",
61
- children: [withHeader && (_HeaderList || (_HeaderList = /*#__PURE__*/_jsx__default["default"](HeaderList.HeaderList, {}))), options.length > 0 ? /*#__PURE__*/jsxRuntime.jsx(styled.StyledVirtualListWrapper, {
62
- tabIndex: -1,
63
- inline: inline,
64
- maxHeight: menuMaxHeight,
65
- ref: listRef,
66
- withHeader: withHeader,
67
- children: /*#__PURE__*/_jsx__default["default"](styled.StyledList, {
68
- tabIndex: -1,
69
- "aria-expanded": showPopover,
70
- onFocus: handleOnFocus,
71
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.LIST,
72
- style: {
73
- height: totalSize,
74
- margin: inline ? '0px' : '8px 0px'
75
- }
76
- }, void 0, ItemRenderer)
77
- }) : _EmptyState || (_EmptyState = /*#__PURE__*/_jsx__default["default"](index.EmptyState, {}))]
78
- });
79
- };
80
-
81
- exports.MenuList = MenuList;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var MenuList = require('./MenuList.js');
6
-
7
-
8
-
9
- exports.MenuList = MenuList.MenuList;
@@ -1,33 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var styled = require('styled-components');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
10
-
11
- const StyledListWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
12
- componentId: "sc-1uedyf-0"
13
- })(["min-width:", ";"], props => props.inline ? '100%' : "".concat(props.minWidth, "px"));
14
- const StyledList = /*#__PURE__*/styled__default["default"].ul.withConfig({
15
- componentId: "sc-1uedyf-1"
16
- })(["position:relative;padding:0;"]);
17
- const StyledVirtualListWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
18
- componentId: "sc-1uedyf-2"
19
- })(["overflow-y:auto;margin-top:", ";max-height:", ";"], _ref => {
20
- let {
21
- withHeader
22
- } = _ref;
23
- return withHeader ? '28px' : '';
24
- }, _ref2 => {
25
- let {
26
- maxHeight
27
- } = _ref2;
28
- return !maxHeight ? '400px' : "".concat(maxHeight, "px");
29
- });
30
-
31
- exports.StyledList = StyledList;
32
- exports.StyledListWrapper = StyledListWrapper;
33
- exports.StyledVirtualListWrapper = StyledVirtualListWrapper;
@@ -1,105 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _defineProperty = require('@babel/runtime/helpers/defineProperty');
6
- require('core-js/modules/esnext.async-iterator.map.js');
7
- require('core-js/modules/esnext.iterator.map.js');
8
- require('core-js/modules/esnext.async-iterator.filter.js');
9
- require('core-js/modules/esnext.iterator.constructor.js');
10
- require('core-js/modules/esnext.iterator.filter.js');
11
- require('core-js/modules/esnext.async-iterator.for-each.js');
12
- require('core-js/modules/esnext.iterator.for-each.js');
13
- var React = require('react');
14
- var dsForm = require('@elliemae/ds-form');
15
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
16
- var listHelper = require('../../utils/listHelper.js');
17
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
18
- var jsxRuntime = require('react/jsx-runtime');
19
-
20
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
21
-
22
- var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
23
-
24
- 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; }
25
-
26
- 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__default["default"](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; }
27
-
28
- const useItemRenderer = () => {
29
- const {
30
- props: {
31
- options,
32
- onChange,
33
- selectedValues,
34
- onFilter
35
- },
36
- inputRef,
37
- setShowPopover,
38
- focusOptionIdx,
39
- virtualListHelpers
40
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
41
- const {
42
- virtualItems
43
- } = virtualListHelpers;
44
- const multiple = Array.isArray(selectedValues);
45
- const CBItem = multiple ? dsForm.MultiMenuItem : dsForm.SingleMenuItem;
46
- const handleClick = React.useCallback((option, e) => {
47
- var _inputRef$current;
48
-
49
- if (!multiple) {
50
- setShowPopover(false);
51
- if (inputRef.current) inputRef.current.value = '';
52
- } else if (inputRef.current) {
53
- onFilter(inputRef.current.value);
54
- }
55
-
56
- onChange(option);
57
- (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.focus();
58
- e.stopPropagation();
59
- e.preventDefault();
60
- }, [onFilter, onChange, setShowPopover, multiple, inputRef]);
61
- const handleOnMouseDown = React.useCallback(e => {
62
- e.preventDefault();
63
- }, []);
64
- const ItemRenderer = React.useMemo(() => virtualItems.map(vItem => {
65
- const option = options[vItem.index];
66
- const generalProps = {
67
- wrapperStyles: {
68
- position: 'absolute',
69
- top: vItem.start,
70
- left: 0,
71
- width: '100%'
72
- },
73
- key: "".concat(option.dsId),
74
- innerRef: vItem.measureRef
75
- };
76
-
77
- if (option.type === 'section') {
78
- return /*#__PURE__*/jsxRuntime.jsx(dsForm.Section, _objectSpread({
79
- label: option.label
80
- }, generalProps));
81
- }
82
-
83
- if (option.type === 'separator') {
84
- return /*#__PURE__*/jsxRuntime.jsx(dsForm.Separator, _objectSpread({}, generalProps));
85
- }
86
-
87
- if (option.type === 'option') {
88
- return /*#__PURE__*/jsxRuntime.jsx(CBItem, _objectSpread(_objectSpread({}, generalProps), {}, {
89
- value: option.value,
90
- label: option.label,
91
- dataTestid: ComboboxDataTestids.ComboboxDataTestid.OPTION,
92
- disabled: option.disabled,
93
- onClick: e => handleClick(option, e),
94
- onMouseDown: handleOnMouseDown,
95
- isActive: option.dsId === focusOptionIdx,
96
- isSelected: listHelper.isSelected(selectedValues, option)
97
- }));
98
- }
99
-
100
- return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {});
101
- }), [options, focusOptionIdx, selectedValues, inputRef, virtualItems]);
102
- return ItemRenderer;
103
- };
104
-
105
- exports.useItemRenderer = useItemRenderer;
@@ -1,61 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var React = require('react');
6
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
7
-
8
- const useMenuList = () => {
9
- var _inputRef$current;
10
-
11
- const {
12
- props: {
13
- inline,
14
- selectedValues,
15
- onMenuOpen,
16
- options
17
- },
18
- inputRef,
19
- setCurrentOption,
20
- scrollOptionIntoView,
21
- hasFocus,
22
- showPopover
23
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
24
- React.useEffect(() => {
25
- const getFirstOption = () => {
26
- for (let i = 0; i < options.length; i += 1) if (!['section', 'separator'].includes(options[i].type)) {
27
- setCurrentOption(options[i].dsId);
28
- break;
29
- }
30
- };
31
-
32
- if (showPopover || inline) {
33
- onMenuOpen();
34
-
35
- if (inputRef.current.value !== '') {
36
- getFirstOption();
37
- } else if (Array.isArray(selectedValues)) {
38
- const multiSelectedValues = selectedValues;
39
-
40
- if (multiSelectedValues.length > 0) {
41
- setCurrentOption(multiSelectedValues[multiSelectedValues.length - 1].dsId);
42
- scrollOptionIntoView(multiSelectedValues[multiSelectedValues.length - 1].dsId);
43
- } else {
44
- getFirstOption();
45
- }
46
- } else {
47
- const singleSelectedValue = selectedValues;
48
-
49
- if (singleSelectedValue) {
50
- setCurrentOption(selectedValues.dsId);
51
- scrollOptionIntoView(selectedValues.dsId);
52
- } else {
53
- getFirstOption();
54
- }
55
- }
56
- } // eslint-disable-next-line react-hooks/exhaustive-deps
57
-
58
- }, [showPopover, inline, hasFocus, (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value]);
59
- };
60
-
61
- exports.useMenuList = useMenuList;
@@ -1,63 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- require('core-js/modules/esnext.async-iterator.map.js');
7
- require('core-js/modules/esnext.iterator.map.js');
8
- var React = require('react');
9
- var Grid = require('@elliemae/ds-grid');
10
- var dsPills = require('@elliemae/ds-pills');
11
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
12
- var useGroupPills = require('./useGroupPills.js');
13
- var MultiAllyMessages = require('../a11y-messages/MultiAllyMessages.js');
14
- require('styled-components');
15
- var jsxRuntime = require('react/jsx-runtime');
16
-
17
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
18
-
19
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
20
- var Grid__default = /*#__PURE__*/_interopDefaultLegacy(Grid);
21
-
22
- var _MultiAllyMessages;
23
-
24
- const MultiSelectedValuesContainer = () => {
25
- var _inputRef$current2;
26
-
27
- const {
28
- props: {
29
- selectedValues
30
- },
31
- inputRef,
32
- pillGroupRef
33
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
34
- const multiSelectedValue = selectedValues;
35
- const pillsToShow = useGroupPills.useGroupPills();
36
- const correctPillsToShow = pillsToShow || 1;
37
- const pills = React.useMemo(() => /*#__PURE__*/_jsx__default["default"](Grid__default["default"], {
38
- style: {
39
- width: 'max-content'
40
- }
41
- }, void 0, /*#__PURE__*/_jsx__default["default"](dsPills.DSPillGroupV2, {
42
- innerRef: pillGroupRef
43
- }, void 0, multiSelectedValue.length > 0 && multiSelectedValue.slice(0, correctPillsToShow).map(option => {
44
- var _inputRef$current;
45
-
46
- return /*#__PURE__*/_jsx__default["default"](dsPills.DSPillV2, {
47
- size: "s",
48
- labelTruncated: ((_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value) === '' || correctPillsToShow !== pillsToShow,
49
- label: option.label,
50
- type: "value"
51
- }, option.value);
52
- }), multiSelectedValue.length > 0 && correctPillsToShow !== multiSelectedValue.length && /*#__PURE__*/_jsx__default["default"](dsPills.DSPillV2, {
53
- size: "s",
54
- labelTruncated: false,
55
- label: "+".concat(multiSelectedValue.length - correctPillsToShow),
56
- type: "value"
57
- }, "grouped"))), [pillsToShow, pillGroupRef, inputRef, multiSelectedValue, correctPillsToShow]);
58
- return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
59
- children: [multiSelectedValue.length > 0 && !((_inputRef$current2 = inputRef.current) !== null && _inputRef$current2 !== void 0 && _inputRef$current2.value) && (_MultiAllyMessages || (_MultiAllyMessages = /*#__PURE__*/_jsx__default["default"](MultiAllyMessages.MultiAllyMessages, {}))), pills]
60
- });
61
- };
62
-
63
- exports.MultiSelectedValuesContainer = MultiSelectedValuesContainer;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var MultiSelectedValuesContainer = require('./MultiSelectedValuesContainer.js');
6
-
7
-
8
-
9
- exports.MultiSelectedValuesContainer = MultiSelectedValuesContainer.MultiSelectedValuesContainer;
@@ -1,23 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var styled = require('styled-components');
6
-
7
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
8
-
9
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
10
-
11
- const StyledGroupedPillPopoverContent = /*#__PURE__*/styled__default["default"].div.withConfig({
12
- componentId: "sc-1hugfiz-0"
13
- })(["padding:10px;background-color:#fff;"]);
14
- const StyledGroupPillWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
15
- componentId: "sc-1hugfiz-1"
16
- })([""]);
17
- const StyledA11ySelectedValues = /*#__PURE__*/styled__default["default"].span.withConfig({
18
- componentId: "sc-1hugfiz-2"
19
- })(["width:1px;height:1px;position:absolute;clip:rect(1px,1px,1px,1px);"]);
20
-
21
- exports.StyledA11ySelectedValues = StyledA11ySelectedValues;
22
- exports.StyledGroupPillWrapper = StyledGroupPillWrapper;
23
- exports.StyledGroupedPillPopoverContent = StyledGroupedPillPopoverContent;