@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,33 +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 ComboBoxCTX = require('../../ComboBoxCTX.js');
10
- var listHelper = require('../../utils/listHelper.js');
11
- var styled = require('./styled.js');
12
-
13
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
14
-
15
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
16
-
17
- const MultiAllyMessages = () => {
18
- const {
19
- props: {
20
- options,
21
- selectedValues
22
- }
23
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
24
- const selectableOptions = listHelper.getSelectableOptions(options);
25
- const multipleSelectedValues = selectedValues;
26
- return /*#__PURE__*/_jsx__default["default"](styled.StyledA11ySelectedValues, {
27
- "aria-live": "polite",
28
- "aria-atomic": "false",
29
- "aria-relevant": "additions text"
30
- }, void 0, "Options selected: ".concat(multipleSelectedValues.map(item => item.label).join(', '), ". ").concat(multipleSelectedValues.length, " of ").concat(selectableOptions.length));
31
- };
32
-
33
- exports.MultiAllyMessages = MultiAllyMessages;
@@ -1,28 +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 ComboBoxCTX = require('../../ComboBoxCTX.js');
8
- var styled = require('./styled.js');
9
-
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
-
12
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
13
-
14
- const SingleAllyMessages = () => {
15
- const {
16
- props: {
17
- selectedValues
18
- }
19
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
20
- const singleSelectedValue = selectedValues;
21
- return /*#__PURE__*/_jsx__default["default"](styled.StyledA11ySelectedValues, {
22
- "aria-live": "polite",
23
- "aria-atomic": "false",
24
- "aria-relevant": "additions text"
25
- }, void 0, "Option selected: ".concat(singleSelectedValue.label, "."));
26
- };
27
-
28
- exports.SingleAllyMessages = SingleAllyMessages;
@@ -1,11 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var MultiAllyMessages = require('./MultiAllyMessages.js');
6
- var SingleAllyMessages = require('./SingleAllyMessages.js');
7
-
8
-
9
-
10
- exports.MultiAllyMessages = MultiAllyMessages.MultiAllyMessages;
11
- exports.SingleAllyMessages = SingleAllyMessages.SingleAllyMessages;
@@ -1,15 +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 StyledA11ySelectedValues = /*#__PURE__*/styled__default["default"].span.withConfig({
12
- componentId: "sc-4xp40i-0"
13
- })(["width:1px;height:1px;position:absolute;clip:rect(1px,1px,1px,1px);"]);
14
-
15
- exports.StyledA11ySelectedValues = StyledA11ySelectedValues;
@@ -1,67 +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 dsPopperjs = require('@elliemae/ds-popperjs');
8
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
9
- var styled = require('./styled.js');
10
- var Controls = require('../controls/Controls.js');
11
- var MenuList = require('../menu-list/MenuList.js');
12
- var jsxRuntime = require('react/jsx-runtime');
13
-
14
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
-
16
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
17
-
18
- var _Controls, _MenuList, _MenuList2;
19
-
20
- const Container = () => {
21
- const {
22
- props: {
23
- inline,
24
- startPlacementPreference,
25
- placementOrderPreference
26
- },
27
- showPopover,
28
- inputRef,
29
- setReferenceElement,
30
- setShowPopover,
31
- referenceElement
32
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
33
- const handleCloseMenu = React.useCallback(() => {
34
- setShowPopover(false);
35
- if (inputRef.current) inputRef.current.blur();
36
- }, [inputRef, setShowPopover]);
37
- const handleMouseDown = React.useCallback(e => {
38
- e.preventDefault();
39
- }, []);
40
- const handleOnClickContainer = React.useCallback(() => {
41
- setShowPopover(!showPopover);
42
- }, [setShowPopover, showPopover]);
43
- const StyledContainer = inline ? styled.StyledContainerInline : styled.StyledContainerWithPopper;
44
- return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
45
- children: [/*#__PURE__*/jsxRuntime.jsxs(StyledContainer, {
46
- ref: setReferenceElement,
47
- onClick: handleOnClickContainer,
48
- children: [_Controls || (_Controls = /*#__PURE__*/_jsx__default["default"](Controls.Controls, {})), inline ? _MenuList || (_MenuList = /*#__PURE__*/_jsx__default["default"](MenuList.MenuList, {})) : null]
49
- }), !inline ? /*#__PURE__*/_jsx__default["default"](dsPopperjs.DSPopperJS, {
50
- customOffset: [0, 5],
51
- closeContextMenu: handleCloseMenu,
52
- referenceElement: referenceElement,
53
- showPopover: showPopover,
54
- startPlacementPreference: startPlacementPreference,
55
- placementOrderPreference: placementOrderPreference,
56
- withoutPortal: true,
57
- withoutArrow: true,
58
- withoutAnimation: true,
59
- zIndex: 10
60
- }, void 0, /*#__PURE__*/_jsx__default["default"](styled.StyledPopperWrapper, {
61
- tabIndex: -1,
62
- onMouseDown: handleMouseDown
63
- }, void 0, _MenuList2 || (_MenuList2 = /*#__PURE__*/_jsx__default["default"](MenuList.MenuList, {})))) : null]
64
- });
65
- };
66
-
67
- exports.Container = Container;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var Container = require('./Container.js');
6
-
7
-
8
-
9
- exports.Container = Container.Container;
@@ -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 StyledContainerWithPopper = /*#__PURE__*/styled__default["default"].div.withConfig({
12
- componentId: "sc-17wftik-0"
13
- })(["width:100%;height:28px;position:relative;"]);
14
- const StyledContainerInline = /*#__PURE__*/styled__default["default"].div.withConfig({
15
- componentId: "sc-17wftik-1"
16
- })(["width:100%;position:relative;"]);
17
- const StyledPopperWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
18
- componentId: "sc-17wftik-2"
19
- })(["background:#fff;overflow:auto;position:relative;"]);
20
-
21
- exports.StyledContainerInline = StyledContainerInline;
22
- exports.StyledContainerWithPopper = StyledContainerWithPopper;
23
- exports.StyledPopperWrapper = StyledPopperWrapper;
@@ -1,71 +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 DropdownIndicator = require('../dropdown-indicator/DropdownIndicator.js');
8
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
9
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
10
- var styled = require('./styled.js');
11
- var MultiSelectedValuesContainer = require('../multi-selected-values-container/MultiSelectedValuesContainer.js');
12
- var ControlsInput = require('../controls-input/ControlsInput.js');
13
- var SingleSelectedValueContainer = require('../single-selected-value-container/SingleSelectedValueContainer.js');
14
- var jsxRuntime = require('react/jsx-runtime');
15
-
16
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
17
-
18
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
19
-
20
- var _MultiSelectedValuesC, _SingleSelectedValueC, _ControlsInput, _StyledHeaderActionsW;
21
-
22
- const Controls = () => {
23
- const {
24
- props: {
25
- inline,
26
- inputMinWidth,
27
- hasError,
28
- selectedValues
29
- },
30
- inputRef,
31
- selectedOptionsRef,
32
- setShowPopover,
33
- showPopover,
34
- hasFocus,
35
- controlsWrapperRef
36
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
37
- const handleOnClick = React.useCallback(() => {
38
- if (hasFocus && showPopover && !inline) {
39
- inputRef.current.blur();
40
- } else if (hasFocus) {
41
- setShowPopover(true);
42
- } else {
43
- inputRef.current.focus();
44
- }
45
- }, [hasFocus, setShowPopover, showPopover, inputRef, inline]);
46
-
47
- const handleOnMouseDown = e => {
48
- if (hasFocus || inline) {
49
- e.preventDefault();
50
- }
51
- };
52
-
53
- const cols = !inline ? ['minmax(0px,max-content)', 'minmax(20px, auto)', '29px'] : ['minmax(0px, auto)'];
54
- return /*#__PURE__*/jsxRuntime.jsxs(styled.StyledControlsWrapper, {
55
- ref: controlsWrapperRef,
56
- cols: cols,
57
- minWidth: inputMinWidth,
58
- hasError: hasError,
59
- hasFocus: hasFocus,
60
- inline: inline,
61
- onClick: handleOnClick,
62
- onMouseDown: handleOnMouseDown,
63
- children: [!inline && /*#__PURE__*/jsxRuntime.jsx(styled.StyledSelection, {
64
- ref: selectedOptionsRef,
65
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.SELECTED_VALUES,
66
- children: Array.isArray(selectedValues) ? _MultiSelectedValuesC || (_MultiSelectedValuesC = /*#__PURE__*/_jsx__default["default"](MultiSelectedValuesContainer.MultiSelectedValuesContainer, {})) : _SingleSelectedValueC || (_SingleSelectedValueC = /*#__PURE__*/_jsx__default["default"](SingleSelectedValueContainer.SingleSelectedValueContainer, {}))
67
- }), _ControlsInput || (_ControlsInput = /*#__PURE__*/_jsx__default["default"](ControlsInput.ControlsInput, {})), !inline && (_StyledHeaderActionsW || (_StyledHeaderActionsW = /*#__PURE__*/_jsx__default["default"](styled.StyledHeaderActionsWrapper, {}, void 0, /*#__PURE__*/_jsx__default["default"](styled.StyleHeaderActionsSeparator, {}), /*#__PURE__*/_jsx__default["default"](DropdownIndicator, {}))))]
68
- });
69
- };
70
-
71
- exports.Controls = Controls;
@@ -1,9 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var Controls = require('./Controls.js');
6
-
7
-
8
-
9
- exports.Controls = Controls.Controls;
@@ -1,65 +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 Grid = require('@elliemae/ds-grid');
9
-
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
-
12
- var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
13
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
14
-
15
- var _templateObject, _templateObject2;
16
- const normalBorder = dsSystem.css(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n border: 1px solid\n ", ";\n"])), props => {
17
- if (props.hasError) {
18
- return props.theme.colors.danger[900];
19
- }
20
-
21
- return props.theme.colors.neutral[400];
22
- });
23
- const focusBorder = dsSystem.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n border: 2px solid ", ";\n"])), _ref => {
24
- let {
25
- theme
26
- } = _ref;
27
- return theme.colors.brand[700];
28
- });
29
- const StyledControlsWrapper = /*#__PURE__*/styled__default["default"](Grid.Grid).withConfig({
30
- componentId: "sc-64uci7-0"
31
- })(["background:transparent;position:relative;border-radius:2px;min-width:", ";align-items:center;align-content:center;height:28px;padding-left:8px;margin:", ";&::after{display:block;content:' ';position:absolute;top:0;left:0;right:0;bottom:0;border-radius:2px;", " pointer-events:none;z-index:7;}"], _ref2 => {
32
- let {
33
- minWidth,
34
- inline
35
- } = _ref2;
36
- return inline ? '' : "".concat(minWidth, "px");
37
- }, _ref3 => {
38
- let {
39
- inline
40
- } = _ref3;
41
- return inline ? '10px 16px' : 'none';
42
- }, _ref4 => {
43
- let {
44
- hasFocus
45
- } = _ref4;
46
- return hasFocus ? focusBorder : normalBorder;
47
- });
48
- const StyledSelection = /*#__PURE__*/styled__default["default"].div.withConfig({
49
- componentId: "sc-64uci7-1"
50
- })(["font-size:13px;margin-right:3px;line-height:13px;display:flex;"]);
51
- const StyledHeaderActionsWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
52
- componentId: "sc-64uci7-2"
53
- })(["align-items:center;align-self:stretch;display:flex;box-sizing:border-box;height:28px;.em-ds-button--text:focus::after{border:none;}"]);
54
- const StyleDropdownIndicator = /*#__PURE__*/styled__default["default"].div.withConfig({
55
- componentId: "sc-64uci7-3"
56
- })([""]);
57
- const StyleHeaderActionsSeparator = /*#__PURE__*/styled__default["default"].span.withConfig({
58
- componentId: "sc-64uci7-4"
59
- })(["align-self:stretch;margin:4px 0px;width:1px;background-color:", ";"], props => props.theme.colors.neutral['500']);
60
-
61
- exports.StyleDropdownIndicator = StyleDropdownIndicator;
62
- exports.StyleHeaderActionsSeparator = StyleHeaderActionsSeparator;
63
- exports.StyledControlsWrapper = StyledControlsWrapper;
64
- exports.StyledHeaderActionsWrapper = StyledHeaderActionsWrapper;
65
- exports.StyledSelection = StyledSelection;
@@ -1,67 +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 DSTruncatedTooltipText = require('@elliemae/ds-truncated-tooltip-text');
8
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
9
- var styled = require('./styled.js');
10
- var useKeyboardNavigation = require('../../utils/hooks/useKeyboardNavigation.js');
11
- var useControlsInput = require('./useControlsInput.js');
12
- var ComboBoxCTX = require('../../ComboBoxCTX.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
- const ControlsInput = () => {
20
- const {
21
- props: {
22
- autoFocus
23
- },
24
- showPopover,
25
- focusOptionIdx,
26
- inputRef
27
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
28
- const {
29
- onInputKeyDown
30
- } = useKeyboardNavigation.useKeyboardNavigation();
31
- const {
32
- spanReference,
33
- width,
34
- spanReferenceText,
35
- showPlaceholder,
36
- handleOnBlur,
37
- handleOnChange,
38
- handleOnFocus
39
- } = useControlsInput.useControlsInput();
40
- return /*#__PURE__*/_jsx__default["default"](styled.StyledInputWrapper, {}, void 0, /*#__PURE__*/jsxRuntime.jsx(styled.StyledInputWidthReference, {
41
- ref: spanReference,
42
- children: spanReferenceText
43
- }), /*#__PURE__*/_jsx__default["default"](styled.StyledInputPlaceHolder, {}, void 0, /*#__PURE__*/_jsx__default["default"](DSTruncatedTooltipText.SimpleTruncatedTooltipText, {
44
- value: showPlaceholder
45
- })), /*#__PURE__*/jsxRuntime.jsx(styled.StyledInput, {
46
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.INPUT,
47
- autoFocus: autoFocus,
48
- "aria-labelledby": "combo-label",
49
- "aria-controls": "combo-listbox",
50
- "aria-owns": "combo-listbox",
51
- "aria-activedescendant": focusOptionIdx,
52
- "aria-expanded": showPopover,
53
- "aria-haspopup": "listbox",
54
- role: "combobox",
55
- style: {
56
- width
57
- },
58
- ref: inputRef,
59
- type: "text",
60
- onKeyDown: onInputKeyDown,
61
- onChange: handleOnChange,
62
- onBlur: handleOnBlur,
63
- onFocus: handleOnFocus
64
- }));
65
- };
66
-
67
- exports.ControlsInput = ControlsInput;
@@ -1,27 +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 StyledInput = /*#__PURE__*/styled__default["default"].input.withConfig({
12
- componentId: "sc-1ue5xik-0"
13
- })(["font-size:13px;line-height:13px;border:none;padding:0;outline:none;color:", ";&:focus{outline:none;}"], props => props.theme.colors.neutral[700]);
14
- const StyledInputPlaceHolder = /*#__PURE__*/styled__default["default"].div.withConfig({
15
- componentId: "sc-1ue5xik-1"
16
- })(["font-style:italic;color:", ";position:absolute;display:flex;align-items:center;width:100%;user-select:none;height:28px;"], props => props.theme.colors.neutral[500]);
17
- const StyledInputWidthReference = /*#__PURE__*/styled__default["default"].span.withConfig({
18
- componentId: "sc-1ue5xik-2"
19
- })(["visibility:hidden;position:absolute;top:-9999px;"]);
20
- const StyledInputWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
21
- componentId: "sc-1ue5xik-3"
22
- })(["position:relative;flex:1;margin-right:5px;display:flex;align-items:center;"]);
23
-
24
- exports.StyledInput = StyledInput;
25
- exports.StyledInputPlaceHolder = StyledInputPlaceHolder;
26
- exports.StyledInputWidthReference = StyledInputWidthReference;
27
- exports.StyledInputWrapper = StyledInputWrapper;
@@ -1,77 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- require('core-js/modules/web.dom-collections.iterator.js');
6
- require('core-js/modules/es.string.replace.js');
7
- var React = require('react');
8
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
9
- var listHelper = require('../../utils/listHelper.js');
10
-
11
- const useControlsInput = () => {
12
- var _inputRef$current, _inputRef$current2, _inputRef$current3;
13
-
14
- const {
15
- props: {
16
- selectedValues,
17
- placeholder,
18
- onFilter
19
- },
20
- setShowPopover,
21
- setCurrentOption,
22
- inputRef,
23
- wrapperListRef,
24
- setHasFocus,
25
- setShowSelectedValue,
26
- setShowSelectedOptions
27
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
28
- const [width, setWidth] = React.useState(1);
29
- const spanReference = React.useRef(null);
30
- React.useEffect(() => {
31
- var _spanReference$curren;
32
-
33
- setWidth(((_spanReference$curren = spanReference.current) === null || _spanReference$curren === void 0 ? void 0 : _spanReference$curren.offsetWidth) || 1);
34
- }, [(_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : _inputRef$current.value]);
35
- React.useEffect(() => {
36
- setShowSelectedValue(true);
37
- }, [selectedValues, setShowSelectedValue]); // When writting open popover
38
- // and refresh selected values and update filter outside value.
39
-
40
- const handleOnChange = React.useCallback(e => {
41
- setShowSelectedOptions(false);
42
- if (e.currentTarget.value) setShowSelectedValue(false);
43
- setShowPopover(true);
44
- onFilter(e.currentTarget.value);
45
- }, [onFilter, setShowPopover, setShowSelectedOptions, setShowSelectedValue]);
46
- const handleOnBlur = React.useCallback(() => {
47
- setHasFocus(false);
48
- setTimeout(() => {
49
- var _wrapperListRef$curre;
50
-
51
- if (!(wrapperListRef !== null && wrapperListRef !== void 0 && (_wrapperListRef$curre = wrapperListRef.current) !== null && _wrapperListRef$curre !== void 0 && _wrapperListRef$curre.contains(document.activeElement))) {
52
- setShowPopover(false);
53
- }
54
-
55
- setCurrentOption('');
56
- setShowSelectedValue(true);
57
- onFilter('');
58
- if (inputRef.current) inputRef.current.value = '';
59
- });
60
- }, [setHasFocus, setCurrentOption, wrapperListRef, onFilter, inputRef, setShowPopover, setShowSelectedValue]);
61
- const handleOnFocus = React.useCallback(() => {
62
- setHasFocus(true);
63
- }, [setHasFocus]);
64
- const showPlaceholder = !((_inputRef$current2 = inputRef.current) !== null && _inputRef$current2 !== void 0 && _inputRef$current2.value) && listHelper.isSelectedValueEmpty(selectedValues) ? placeholder : null;
65
- const spanReferenceText = (_inputRef$current3 = inputRef.current) === null || _inputRef$current3 === void 0 ? void 0 : _inputRef$current3.value.replace(/\s/g, '\u00a0');
66
- return React.useMemo(() => ({
67
- handleOnFocus,
68
- handleOnBlur,
69
- handleOnChange,
70
- showPlaceholder,
71
- spanReferenceText,
72
- width,
73
- spanReference
74
- }), [handleOnFocus, handleOnBlur, handleOnChange, spanReferenceText, showPlaceholder, width, spanReference]);
75
- };
76
-
77
- exports.useControlsInput = useControlsInput;
@@ -1,33 +0,0 @@
1
- 'use strict';
2
-
3
- var _jsx = require('@babel/runtime/helpers/jsx');
4
- var React = require('react');
5
- var ChevronSmallDown = require('@elliemae/ds-icons/ChevronSmallDown');
6
- var ComboBoxCTX = require('../../ComboBoxCTX.js');
7
- var styled = require('./styled.js');
8
- var ComboboxDataTestids = require('../../ComboboxDataTestids.js');
9
-
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
-
12
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
13
- var ChevronSmallDown__default = /*#__PURE__*/_interopDefaultLegacy(ChevronSmallDown);
14
-
15
- var _ChevronSmallDown;
16
-
17
- const DropdownIndicator = () => {
18
- const {
19
- showPopover
20
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
21
- return /*#__PURE__*/_jsx__default["default"](styled.StyledDropDownButton, {
22
- "data-testid": ComboboxDataTestids.ComboboxDataTestid.DROPDOWN,
23
- "aria-controls": "combo-listbox",
24
- "aria-labelledby": "combo-label",
25
- "aria-expanded": showPopover,
26
- "aria-haspopup": "listbox",
27
- buttonType: "text",
28
- icon: _ChevronSmallDown || (_ChevronSmallDown = /*#__PURE__*/_jsx__default["default"](ChevronSmallDown__default["default"], {})),
29
- tabIndex: -1
30
- });
31
- };
32
-
33
- module.exports = DropdownIndicator;
@@ -1,2 +0,0 @@
1
- 'use strict';
2
-
@@ -1,17 +0,0 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var styled = require('styled-components');
6
- var DSButton = require('@elliemae/ds-button');
7
-
8
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
9
-
10
- var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
11
- var DSButton__default = /*#__PURE__*/_interopDefaultLegacy(DSButton);
12
-
13
- const StyledDropDownButton = /*#__PURE__*/styled__default["default"](DSButton__default["default"]).withConfig({
14
- componentId: "sc-1ijoe1w-0"
15
- })(["box-sizing:border-box;width:100;& svg{fill:", ";}"], props => props.theme.colors.brand['700']);
16
-
17
- exports.StyledDropDownButton = StyledDropDownButton;
@@ -1,27 +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 ComboBoxCTX = require('../../ComboBoxCTX.js');
8
- var styled = require('./styled.js');
9
-
10
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
11
-
12
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
13
-
14
- var _StyledNoResults, _StyledNoResults2;
15
-
16
- const EmptyState = () => {
17
- const {
18
- props: {
19
- onCreate
20
- }
21
- } = React.useContext(ComboBoxCTX.ComboBoxContext);
22
- return /*#__PURE__*/_jsx__default["default"](styled.StyledNoResultsWrapper, {
23
- id: "id-no-results"
24
- }, void 0, onCreate ? _StyledNoResults || (_StyledNoResults = /*#__PURE__*/_jsx__default["default"](styled.StyledNoResults, {}, void 0, "No items match your search, click RETURN at any point to add your unique entry to the field")) : _StyledNoResults2 || (_StyledNoResults2 = /*#__PURE__*/_jsx__default["default"](styled.StyledNoResults, {}, void 0, "No matches found.")));
25
- };
26
-
27
- exports.EmptyState = EmptyState;
@@ -1,19 +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 StyledNoResultsWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
12
- componentId: "sc-o4fon6-0"
13
- })(["padding:16px;"]);
14
- const StyledNoResults = /*#__PURE__*/styled__default["default"].span.withConfig({
15
- componentId: "sc-o4fon6-1"
16
- })([""]);
17
-
18
- exports.StyledNoResults = StyledNoResults;
19
- exports.StyledNoResultsWrapper = StyledNoResultsWrapper;