@elliemae/ds-controlled-form 3.0.0-next.15 → 3.0.0-next.16

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 (203) hide show
  1. package/dist/cjs/autocomplete/Autocomplete.js +5 -6
  2. package/dist/cjs/autocomplete/Autocomplete.js.map +2 -2
  3. package/dist/cjs/autocomplete/AutocompleteCTX.js +3 -14
  4. package/dist/cjs/autocomplete/AutocompleteCTX.js.map +2 -2
  5. package/dist/cjs/autocomplete/AutocompleteDataTestids.js +1 -7
  6. package/dist/cjs/autocomplete/AutocompleteDataTestids.js.map +2 -2
  7. package/dist/cjs/autocomplete/config/useAutocomplete.js +23 -11
  8. package/dist/cjs/autocomplete/config/useAutocomplete.js.map +3 -3
  9. package/dist/cjs/autocomplete/parts/container/Container.js +27 -17
  10. package/dist/cjs/autocomplete/parts/container/Container.js.map +2 -2
  11. package/dist/cjs/autocomplete/parts/container/styled.js +0 -5
  12. package/dist/cjs/autocomplete/parts/container/styled.js.map +2 -2
  13. package/dist/cjs/autocomplete/parts/{controls → container}/useKeyboardNavigation.js +18 -24
  14. package/dist/cjs/autocomplete/parts/container/useKeyboardNavigation.js.map +7 -0
  15. package/dist/cjs/autocomplete/parts/menu-list/MenuList.js +5 -25
  16. package/dist/cjs/autocomplete/parts/menu-list/MenuList.js.map +2 -2
  17. package/dist/cjs/autocomplete/parts/menu-list/styled.js +2 -4
  18. package/dist/cjs/autocomplete/parts/menu-list/styled.js.map +2 -2
  19. package/dist/cjs/autocomplete/parts/menu-list/useItemRenderer.js +33 -35
  20. package/dist/cjs/autocomplete/parts/menu-list/useItemRenderer.js.map +2 -2
  21. package/dist/cjs/autocomplete/react-desc-prop-types.js +4 -9
  22. package/dist/cjs/autocomplete/react-desc-prop-types.js.map +2 -2
  23. package/dist/cjs/autocomplete/sharedTypes.js.map +1 -1
  24. package/dist/cjs/autocomplete/{config/constants.js → tests/utils.js} +27 -13
  25. package/dist/cjs/autocomplete/tests/utils.js.map +7 -0
  26. package/dist/cjs/autocomplete/utils/listHelper.js +8 -12
  27. package/dist/cjs/autocomplete/utils/listHelper.js.map +2 -2
  28. package/dist/cjs/combobox/config/useComboBox.js +7 -1
  29. package/dist/cjs/combobox/config/useComboBox.js.map +2 -2
  30. package/dist/cjs/combobox/config/useCorrectOptions.js +10 -29
  31. package/dist/cjs/combobox/config/useCorrectOptions.js.map +2 -2
  32. package/dist/cjs/combobox/parts/A11yFocusedOption.js +3 -3
  33. package/dist/cjs/combobox/parts/A11yFocusedOption.js.map +2 -2
  34. package/dist/cjs/combobox/parts/controls/Controls.js +3 -1
  35. package/dist/cjs/combobox/parts/controls/Controls.js.map +2 -2
  36. package/dist/cjs/combobox/parts/controls-input/ControlsInput.js +2 -1
  37. package/dist/cjs/combobox/parts/controls-input/ControlsInput.js.map +2 -2
  38. package/dist/cjs/combobox/parts/controls-input/styled.js +3 -0
  39. package/dist/cjs/combobox/parts/controls-input/styled.js.map +2 -2
  40. package/dist/cjs/combobox/parts/controls-input/useControlsInput.js +4 -5
  41. package/dist/cjs/combobox/parts/controls-input/useControlsInput.js.map +2 -2
  42. package/dist/cjs/combobox/parts/controls-input/useKeyboardNavigation.js +32 -29
  43. package/dist/cjs/combobox/parts/controls-input/useKeyboardNavigation.js.map +2 -2
  44. package/dist/cjs/combobox/parts/controls-input/useMaskedOnChange.js +8 -5
  45. package/dist/cjs/combobox/parts/controls-input/useMaskedOnChange.js.map +2 -2
  46. package/dist/cjs/combobox/parts/header-list/useHeaderListHandlers.js +4 -4
  47. package/dist/cjs/combobox/parts/header-list/useHeaderListHandlers.js.map +2 -2
  48. package/dist/cjs/combobox/parts/menu-list/MenuList.js +13 -10
  49. package/dist/cjs/combobox/parts/menu-list/MenuList.js.map +2 -2
  50. package/dist/cjs/combobox/parts/menu-list/styled.js +2 -1
  51. package/dist/cjs/combobox/parts/menu-list/styled.js.map +2 -2
  52. package/dist/cjs/combobox/parts/menu-list/useItemRenderer.js +7 -7
  53. package/dist/cjs/combobox/parts/menu-list/useItemRenderer.js.map +2 -2
  54. package/dist/cjs/combobox/parts/menu-list/useMenuListSetFocusOption.js +7 -7
  55. package/dist/cjs/combobox/parts/menu-list/useMenuListSetFocusOption.js.map +2 -2
  56. package/dist/cjs/combobox/react-desc-prop-types.js +2 -1
  57. package/dist/cjs/combobox/react-desc-prop-types.js.map +2 -2
  58. package/dist/cjs/combobox/utils/listHelper.js +34 -11
  59. package/dist/cjs/combobox/utils/listHelper.js.map +2 -2
  60. package/dist/cjs/mask-hook/hooks/index.js +1 -1
  61. package/dist/cjs/mask-hook/hooks/index.js.map +1 -1
  62. package/dist/cjs/mask-hook/hooks/useNumberMask.js +5 -0
  63. package/dist/cjs/mask-hook/hooks/useNumberMask.js.map +2 -2
  64. package/dist/cjs/mask-hook/hooks/usePhoneMask.js +5 -0
  65. package/dist/cjs/mask-hook/hooks/usePhoneMask.js.map +2 -2
  66. package/dist/cjs/mask-hook/hooks/useSSNMask.js +5 -0
  67. package/dist/cjs/mask-hook/hooks/useSSNMask.js.map +2 -2
  68. package/dist/cjs/mask-hook/hooks/{useZipCode.js → useZipCodeMask.js} +13 -8
  69. package/dist/cjs/mask-hook/hooks/{useZipCode.js.map → useZipCodeMask.js.map} +3 -3
  70. package/dist/esm/autocomplete/Autocomplete.js +2 -3
  71. package/dist/esm/autocomplete/Autocomplete.js.map +2 -2
  72. package/dist/esm/autocomplete/AutocompleteCTX.js +3 -14
  73. package/dist/esm/autocomplete/AutocompleteCTX.js.map +2 -2
  74. package/dist/esm/autocomplete/AutocompleteDataTestids.js +1 -7
  75. package/dist/esm/autocomplete/AutocompleteDataTestids.js.map +2 -2
  76. package/dist/esm/autocomplete/config/useAutocomplete.js +24 -12
  77. package/dist/esm/autocomplete/config/useAutocomplete.js.map +3 -3
  78. package/dist/esm/autocomplete/parts/container/Container.js +28 -18
  79. package/dist/esm/autocomplete/parts/container/Container.js.map +2 -2
  80. package/dist/esm/autocomplete/parts/container/styled.js +0 -5
  81. package/dist/esm/autocomplete/parts/container/styled.js.map +2 -2
  82. package/dist/esm/autocomplete/parts/{controls → container}/useKeyboardNavigation.js +18 -24
  83. package/dist/esm/autocomplete/parts/container/useKeyboardNavigation.js.map +7 -0
  84. package/dist/esm/autocomplete/parts/menu-list/MenuList.js +6 -26
  85. package/dist/esm/autocomplete/parts/menu-list/MenuList.js.map +2 -2
  86. package/dist/esm/autocomplete/parts/menu-list/styled.js +2 -4
  87. package/dist/esm/autocomplete/parts/menu-list/styled.js.map +2 -2
  88. package/dist/esm/autocomplete/parts/menu-list/useItemRenderer.js +33 -35
  89. package/dist/esm/autocomplete/parts/menu-list/useItemRenderer.js.map +2 -2
  90. package/dist/esm/autocomplete/react-desc-prop-types.js +4 -9
  91. package/dist/esm/autocomplete/react-desc-prop-types.js.map +2 -2
  92. package/dist/esm/autocomplete/tests/utils.js +27 -0
  93. package/dist/esm/autocomplete/tests/utils.js.map +7 -0
  94. package/dist/esm/autocomplete/utils/listHelper.js +8 -12
  95. package/dist/esm/autocomplete/utils/listHelper.js.map +2 -2
  96. package/dist/esm/combobox/config/useComboBox.js +7 -1
  97. package/dist/esm/combobox/config/useComboBox.js.map +2 -2
  98. package/dist/esm/combobox/config/useCorrectOptions.js +11 -30
  99. package/dist/esm/combobox/config/useCorrectOptions.js.map +2 -2
  100. package/dist/esm/combobox/parts/A11yFocusedOption.js +3 -3
  101. package/dist/esm/combobox/parts/A11yFocusedOption.js.map +2 -2
  102. package/dist/esm/combobox/parts/controls/Controls.js +3 -1
  103. package/dist/esm/combobox/parts/controls/Controls.js.map +2 -2
  104. package/dist/esm/combobox/parts/controls-input/ControlsInput.js +2 -1
  105. package/dist/esm/combobox/parts/controls-input/ControlsInput.js.map +2 -2
  106. package/dist/esm/combobox/parts/controls-input/styled.js +3 -0
  107. package/dist/esm/combobox/parts/controls-input/styled.js.map +2 -2
  108. package/dist/esm/combobox/parts/controls-input/useControlsInput.js +4 -5
  109. package/dist/esm/combobox/parts/controls-input/useControlsInput.js.map +2 -2
  110. package/dist/esm/combobox/parts/controls-input/useKeyboardNavigation.js +32 -29
  111. package/dist/esm/combobox/parts/controls-input/useKeyboardNavigation.js.map +2 -2
  112. package/dist/esm/combobox/parts/controls-input/useMaskedOnChange.js +8 -5
  113. package/dist/esm/combobox/parts/controls-input/useMaskedOnChange.js.map +2 -2
  114. package/dist/esm/combobox/parts/header-list/useHeaderListHandlers.js +4 -4
  115. package/dist/esm/combobox/parts/header-list/useHeaderListHandlers.js.map +2 -2
  116. package/dist/esm/combobox/parts/menu-list/MenuList.js +13 -10
  117. package/dist/esm/combobox/parts/menu-list/MenuList.js.map +2 -2
  118. package/dist/esm/combobox/parts/menu-list/styled.js +2 -1
  119. package/dist/esm/combobox/parts/menu-list/styled.js.map +2 -2
  120. package/dist/esm/combobox/parts/menu-list/useItemRenderer.js +7 -7
  121. package/dist/esm/combobox/parts/menu-list/useItemRenderer.js.map +2 -2
  122. package/dist/esm/combobox/parts/menu-list/useMenuListSetFocusOption.js +7 -7
  123. package/dist/esm/combobox/parts/menu-list/useMenuListSetFocusOption.js.map +2 -2
  124. package/dist/esm/combobox/react-desc-prop-types.js +2 -1
  125. package/dist/esm/combobox/react-desc-prop-types.js.map +2 -2
  126. package/dist/esm/combobox/utils/listHelper.js +34 -11
  127. package/dist/esm/combobox/utils/listHelper.js.map +2 -2
  128. package/dist/esm/mask-hook/hooks/index.js +1 -1
  129. package/dist/esm/mask-hook/hooks/index.js.map +1 -1
  130. package/dist/esm/mask-hook/hooks/useNumberMask.js +5 -0
  131. package/dist/esm/mask-hook/hooks/useNumberMask.js.map +2 -2
  132. package/dist/esm/mask-hook/hooks/usePhoneMask.js +5 -0
  133. package/dist/esm/mask-hook/hooks/usePhoneMask.js.map +2 -2
  134. package/dist/esm/mask-hook/hooks/useSSNMask.js +5 -0
  135. package/dist/esm/mask-hook/hooks/useSSNMask.js.map +2 -2
  136. package/dist/esm/mask-hook/hooks/{useZipCode.js → useZipCodeMask.js} +10 -5
  137. package/dist/esm/mask-hook/hooks/{useZipCode.js.map → useZipCodeMask.js.map} +3 -3
  138. package/package.json +15 -15
  139. package/dist/cjs/autocomplete/config/constants.js.map +0 -7
  140. package/dist/cjs/autocomplete/config/useGetPropsWithDefault.js +0 -37
  141. package/dist/cjs/autocomplete/config/useGetPropsWithDefault.js.map +0 -7
  142. package/dist/cjs/autocomplete/index.d.js +0 -27
  143. package/dist/cjs/autocomplete/index.d.js.map +0 -7
  144. package/dist/cjs/autocomplete/parts/a11y-messages/MultiAllyMessages.js +0 -50
  145. package/dist/cjs/autocomplete/parts/a11y-messages/MultiAllyMessages.js.map +0 -7
  146. package/dist/cjs/autocomplete/parts/a11y-messages/SingleAllyMessages.js +0 -48
  147. package/dist/cjs/autocomplete/parts/a11y-messages/SingleAllyMessages.js.map +0 -7
  148. package/dist/cjs/autocomplete/parts/a11y-messages/index.js +0 -37
  149. package/dist/cjs/autocomplete/parts/a11y-messages/index.js.map +0 -7
  150. package/dist/cjs/autocomplete/parts/a11y-messages/styled.js +0 -41
  151. package/dist/cjs/autocomplete/parts/a11y-messages/styled.js.map +0 -7
  152. package/dist/cjs/autocomplete/parts/controls/Controls.js +0 -72
  153. package/dist/cjs/autocomplete/parts/controls/Controls.js.map +0 -7
  154. package/dist/cjs/autocomplete/parts/controls/index.js +0 -35
  155. package/dist/cjs/autocomplete/parts/controls/index.js.map +0 -7
  156. package/dist/cjs/autocomplete/parts/controls/styled.js +0 -108
  157. package/dist/cjs/autocomplete/parts/controls/styled.js.map +0 -7
  158. package/dist/cjs/autocomplete/parts/controls/useControlsInput.js +0 -62
  159. package/dist/cjs/autocomplete/parts/controls/useControlsInput.js.map +0 -7
  160. package/dist/cjs/autocomplete/parts/controls/useKeyboardNavigation.js.map +0 -7
  161. package/dist/cjs/autocomplete/parts/controls/useMaskedOnChange.js +0 -48
  162. package/dist/cjs/autocomplete/parts/controls/useMaskedOnChange.js.map +0 -7
  163. package/dist/cjs/autocomplete/parts/menu-list/useMenuList.js +0 -82
  164. package/dist/cjs/autocomplete/parts/menu-list/useMenuList.js.map +0 -7
  165. package/dist/cjs/autocomplete/propTypes.js +0 -56
  166. package/dist/cjs/autocomplete/propTypes.js.map +0 -7
  167. package/dist/cjs/autocomplete/utils/hooks/useKeyboardNavigation.js +0 -108
  168. package/dist/cjs/autocomplete/utils/hooks/useKeyboardNavigation.js.map +0 -7
  169. package/dist/cjs/autocomplete/utils/hooks/useOnElementResize.js +0 -56
  170. package/dist/cjs/autocomplete/utils/hooks/useOnElementResize.js.map +0 -7
  171. package/dist/esm/autocomplete/config/constants.js +0 -13
  172. package/dist/esm/autocomplete/config/constants.js.map +0 -7
  173. package/dist/esm/autocomplete/config/useGetPropsWithDefault.js +0 -8
  174. package/dist/esm/autocomplete/config/useGetPropsWithDefault.js.map +0 -7
  175. package/dist/esm/autocomplete/index.d.js +0 -2
  176. package/dist/esm/autocomplete/index.d.js.map +0 -7
  177. package/dist/esm/autocomplete/parts/a11y-messages/MultiAllyMessages.js +0 -21
  178. package/dist/esm/autocomplete/parts/a11y-messages/MultiAllyMessages.js.map +0 -7
  179. package/dist/esm/autocomplete/parts/a11y-messages/SingleAllyMessages.js +0 -19
  180. package/dist/esm/autocomplete/parts/a11y-messages/SingleAllyMessages.js.map +0 -7
  181. package/dist/esm/autocomplete/parts/a11y-messages/index.js +0 -8
  182. package/dist/esm/autocomplete/parts/a11y-messages/index.js.map +0 -7
  183. package/dist/esm/autocomplete/parts/a11y-messages/styled.js +0 -12
  184. package/dist/esm/autocomplete/parts/a11y-messages/styled.js.map +0 -7
  185. package/dist/esm/autocomplete/parts/controls/Controls.js +0 -43
  186. package/dist/esm/autocomplete/parts/controls/Controls.js.map +0 -7
  187. package/dist/esm/autocomplete/parts/controls/index.js +0 -6
  188. package/dist/esm/autocomplete/parts/controls/index.js.map +0 -7
  189. package/dist/esm/autocomplete/parts/controls/styled.js +0 -79
  190. package/dist/esm/autocomplete/parts/controls/styled.js.map +0 -7
  191. package/dist/esm/autocomplete/parts/controls/useControlsInput.js +0 -33
  192. package/dist/esm/autocomplete/parts/controls/useControlsInput.js.map +0 -7
  193. package/dist/esm/autocomplete/parts/controls/useKeyboardNavigation.js.map +0 -7
  194. package/dist/esm/autocomplete/parts/controls/useMaskedOnChange.js +0 -19
  195. package/dist/esm/autocomplete/parts/controls/useMaskedOnChange.js.map +0 -7
  196. package/dist/esm/autocomplete/parts/menu-list/useMenuList.js +0 -53
  197. package/dist/esm/autocomplete/parts/menu-list/useMenuList.js.map +0 -7
  198. package/dist/esm/autocomplete/propTypes.js +0 -27
  199. package/dist/esm/autocomplete/propTypes.js.map +0 -7
  200. package/dist/esm/autocomplete/utils/hooks/useKeyboardNavigation.js +0 -79
  201. package/dist/esm/autocomplete/utils/hooks/useKeyboardNavigation.js.map +0 -7
  202. package/dist/esm/autocomplete/utils/hooks/useOnElementResize.js +0 -27
  203. package/dist/esm/autocomplete/utils/hooks/useOnElementResize.js.map +0 -7
@@ -1,33 +0,0 @@
1
- import * as React from "react";
2
- import { useContext, useMemo, useCallback } from "react";
3
- import { AutocompleteContext } from "../../AutocompleteCTX";
4
- const useControlsInput = () => {
5
- const {
6
- props: { selectedValues, onChange, placeholder, onFilter },
7
- setShowPopover,
8
- inputRef
9
- } = useContext(AutocompleteContext);
10
- const handleOnChange = useCallback((e) => {
11
- const target = e.target;
12
- onChange(target.value);
13
- setShowPopover(true);
14
- onFilter(target.value);
15
- }, [onFilter, onChange, setShowPopover]);
16
- const handleOnBlur = useCallback(() => {
17
- setShowPopover(false);
18
- }, [setShowPopover]);
19
- const handleOnInputMouseDown = useCallback((e) => {
20
- e.stopPropagation();
21
- }, []);
22
- const showPlaceholder = useMemo(() => !inputRef.current?.value && selectedValues === "" ? placeholder : null, [placeholder, inputRef, selectedValues]);
23
- return useMemo(() => ({
24
- handleOnBlur,
25
- handleOnChange,
26
- handleOnInputMouseDown,
27
- showPlaceholder
28
- }), [handleOnBlur, handleOnInputMouseDown, handleOnChange, showPlaceholder]);
29
- };
30
- export {
31
- useControlsInput
32
- };
33
- //# sourceMappingURL=useControlsInput.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/parts/controls/useControlsInput.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useContext, useMemo, useCallback } from 'react';\n\nimport { AutocompleteContext } from '../../AutocompleteCTX';\n\ninterface UseControlsInputT {\n handleOnBlur: () => void;\n handleOnChange: (e: React.ChangeEvent<HTMLInputElement>) => void;\n handleOnInputMouseDown: (e: React.MouseEvent) => void;\n showPlaceholder: string | null | undefined;\n}\nconst useControlsInput = (): UseControlsInputT => {\n const {\n props: { selectedValues, onChange, placeholder, onFilter },\n setShowPopover,\n inputRef,\n } = useContext(AutocompleteContext);\n\n const handleOnChange = useCallback(\n (e: React.FormEvent<HTMLInputElement>) => {\n const target = e.target as HTMLInputElement;\n onChange(target.value);\n setShowPopover(true);\n onFilter(target.value);\n },\n [onFilter, onChange, setShowPopover],\n );\n\n const handleOnBlur = useCallback(() => {\n setShowPopover(false);\n }, [setShowPopover]);\n\n const handleOnInputMouseDown = useCallback((e: React.MouseEvent) => {\n e.stopPropagation();\n }, []);\n\n const showPlaceholder = useMemo(\n () => (!inputRef.current?.value && selectedValues === '' ? placeholder : null),\n [placeholder, inputRef, selectedValues],\n );\n\n return useMemo(\n () => ({\n handleOnBlur,\n handleOnChange,\n handleOnInputMouseDown,\n showPlaceholder,\n }),\n [handleOnBlur, handleOnInputMouseDown, handleOnChange, showPlaceholder],\n );\n};\n\nexport { useControlsInput };\n"],
5
- "mappings": "AAAA;ACAA;AAEA;AAQA,MAAM,mBAAmB,MAAyB;AAChD,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,UAAU,aAAa;AAAA,IAChD;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,iBAAiB,YACrB,CAAC,MAAyC;AACxC,UAAM,SAAS,EAAE;AACjB,aAAS,OAAO;AAChB,mBAAe;AACf,aAAS,OAAO;AAAA,KAElB,CAAC,UAAU,UAAU;AAGvB,QAAM,eAAe,YAAY,MAAM;AACrC,mBAAe;AAAA,KACd,CAAC;AAEJ,QAAM,yBAAyB,YAAY,CAAC,MAAwB;AAClE,MAAE;AAAA,KACD;AAEH,QAAM,kBAAkB,QACtB,MAAO,CAAC,SAAS,SAAS,SAAS,mBAAmB,KAAK,cAAc,MACzE,CAAC,aAAa,UAAU;AAG1B,SAAO,QACL,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF,CAAC,cAAc,wBAAwB,gBAAgB;AAAA;",
6
- "names": []
7
- }
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/parts/controls/useKeyboardNavigation.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport React, { useCallback, useContext } from 'react';\nimport { DSAutocompleteT } from '../../react-desc-prop-types';\nimport AutocompleteContext from '../../AutocompleteCTX';\nimport { findInCircularList } from '../../utils/listHelper';\n\nconst isOptionFocuseable = (opt: DSAutocompleteT.OptionTypes): boolean => !['section', 'separator'].includes(opt.type);\n\nexport const useKeyboardNavigation = () => {\n const {\n props: { onValueChange, options },\n setShowPopover,\n showPopover,\n focusOptionIdx,\n setCurrentOption,\n scrollOptionIntoView,\n } = useContext(AutocompleteContext);\n\n const currentItemIndex = options.findIndex((opt) => opt.dsId === focusOptionIdx);\n const currentItem = options.find(\n (item) => item.type === 'option' && item.dsId === focusOptionIdx,\n ) as DSAutocompleteT.ItemOption;\n const selectOption = useCallback(\n (e) => {\n if (onValueChange) onValueChange(currentItem.label, e as React.ChangeEvent<HTMLInputElement>);\n setShowPopover(false);\n },\n [currentItem, setShowPopover, onValueChange],\n );\n const onInputKeyDown: React.KeyboardEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n const targetElement = e.target as HTMLInputElement;\n\n if (['ArrowDown', 'ArrowUp', 'Enter'].includes(e.key) || (e.keyCode >= 48 && e.keyCode <= 90)) {\n setShowPopover(true);\n }\n\n // =============================================================================\n // ENTER AND SPACE KEY SELECT OPTIONS AND OPEN CLOSE THE POPOVER\n // =============================================================================\n if ((e.keyCode === 32 && targetElement.value === '') || e.key === 'Enter') {\n if (showPopover) {\n e.preventDefault();\n selectOption(e);\n }\n }\n\n // =============================================================================\n // ARROWS UP AND DOWN\n // =============================================================================\n if (e.key === 'ArrowDown') {\n e.preventDefault();\n if (showPopover) {\n const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n } else {\n setShowPopover(true);\n }\n }\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n if (showPopover) {\n const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n } else {\n setShowPopover(true);\n setTimeout(() => {\n const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n });\n }\n }\n // =============================================================================\n // ESCAPE\n // =============================================================================\n if (e.key === 'Escape') {\n setShowPopover(false);\n }\n },\n [scrollOptionIntoView, currentItemIndex, options, showPopover, setCurrentOption, setShowPopover, selectOption],\n );\n\n return { onInputKeyDown };\n};\n"],
5
- "mappings": "AAAA;ACIA;AAEA;AACA;AAEA,MAAM,qBAAqB,CAAC,QAA8C,CAAC,CAAC,WAAW,aAAa,SAAS,IAAI;AAE1G,MAAM,wBAAwB,MAAM;AACzC,QAAM;AAAA,IACJ,OAAO,EAAE,eAAe;AAAA,IACxB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,mBAAmB,QAAQ,UAAU,CAAC,QAAQ,IAAI,SAAS;AACjE,QAAM,cAAc,QAAQ,KAC1B,CAAC,SAAS,KAAK,SAAS,YAAY,KAAK,SAAS;AAEpD,QAAM,eAAe,YACnB,CAAC,MAAM;AACL,QAAI;AAAe,oBAAc,YAAY,OAAO;AACpD,mBAAe;AAAA,KAEjB,CAAC,aAAa,gBAAgB;AAEhC,QAAM,iBAA+D,YACnE,CAAC,MAAM;AACL,UAAM,gBAAgB,EAAE;AAExB,QAAI,CAAC,aAAa,WAAW,SAAS,SAAS,EAAE,QAAS,EAAE,WAAW,MAAM,EAAE,WAAW,IAAK;AAC7F,qBAAe;AAAA;AAMjB,QAAK,EAAE,YAAY,MAAM,cAAc,UAAU,MAAO,EAAE,QAAQ,SAAS;AACzE,UAAI,aAAa;AACf,UAAE;AACF,qBAAa;AAAA;AAAA;AAOjB,QAAI,EAAE,QAAQ,aAAa;AACzB,QAAE;AACF,UAAI,aAAa;AACf,cAAM,gBAAgB,mBAAmB,SAAS,kBAAkB;AACpE,yBAAiB,QAAQ,eAAe;AACxC,6BAAqB,QAAQ,eAAe;AAAA,aACvC;AACL,uBAAe;AAAA;AAAA;AAGnB,QAAI,EAAE,QAAQ,WAAW;AACvB,QAAE;AACF,UAAI,aAAa;AACf,cAAM,gBAAgB,mBAAmB,SAAS,kBAAkB,oBAAoB;AACxF,yBAAiB,QAAQ,eAAe;AACxC,6BAAqB,QAAQ,eAAe;AAAA,aACvC;AACL,uBAAe;AACf,mBAAW,MAAM;AACf,gBAAM,gBAAgB,mBAAmB,SAAS,GAAG,oBAAoB;AACzE,2BAAiB,QAAQ,eAAe;AACxC,+BAAqB,QAAQ,eAAe;AAAA;AAAA;AAAA;AAOlD,QAAI,EAAE,QAAQ,UAAU;AACtB,qBAAe;AAAA;AAAA,KAGnB,CAAC,sBAAsB,kBAAkB,SAAS,aAAa,kBAAkB,gBAAgB;AAGnG,SAAO,EAAE;AAAA;",
6
- "names": []
7
- }
@@ -1,19 +0,0 @@
1
- import * as React from "react";
2
- import { useContext, useCallback } from "react";
3
- import AutocompleteContext from "../../AutocompleteCTX";
4
- const useMaskedOnChange = () => {
5
- const {
6
- props: { useMask, onChange },
7
- setShowPopover
8
- } = useContext(AutocompleteContext);
9
- const handleOnChange = useCallback((e) => {
10
- setShowPopover(true);
11
- onChange(e.target.value);
12
- }, [onChange, setShowPopover]);
13
- const onChangeMask = useMask({ valueSetter: setInputValue, onChange: handleOnChange });
14
- return onChangeMask?.onChange || handleOnChange;
15
- };
16
- export {
17
- useMaskedOnChange
18
- };
19
- //# sourceMappingURL=useMaskedOnChange.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/parts/controls/useMaskedOnChange.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useContext, useCallback } from 'react';\nimport AutocompleteContext from '../../AutocompleteCTX';\n\nconst useMaskedOnChange = () => {\n const {\n props: { useMask, onChange },\n setShowPopover,\n } = useContext(AutocompleteContext);\n\n // default onchange when no mask provided\n const handleOnChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>) => {\n setShowPopover(true);\n onChange(e.target.value);\n },\n [onChange, setShowPopover],\n );\n\n const onChangeMask = useMask({ valueSetter: setInputValue, onChange: handleOnChange });\n\n return onChangeMask?.onChange || handleOnChange;\n};\n\nexport { useMaskedOnChange };\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAEA,MAAM,oBAAoB,MAAM;AAC9B,QAAM;AAAA,IACJ,OAAO,EAAE,SAAS;AAAA,IAClB;AAAA,MACE,WAAW;AAGf,QAAM,iBAAiB,YACrB,CAAC,MAA2C;AAC1C,mBAAe;AACf,aAAS,EAAE,OAAO;AAAA,KAEpB,CAAC,UAAU;AAGb,QAAM,eAAe,QAAQ,EAAE,aAAa,eAAe,UAAU;AAErE,SAAO,cAAc,YAAY;AAAA;",
6
- "names": []
7
- }
@@ -1,53 +0,0 @@
1
- import * as React from "react";
2
- import { useEffect, useContext } from "react";
3
- import { AutocompleteContext } from "../../AutocompleteCTX";
4
- const useMenuList = () => {
5
- const {
6
- props: { selectedValues, onMenuOpen, options },
7
- inputRef,
8
- setCurrentOption,
9
- scrollOptionIntoView,
10
- setShowPopover,
11
- showPopover
12
- } = useContext(AutocompleteContext);
13
- useEffect(() => {
14
- if (options.length === 0 || inputRef.current?.value === "") {
15
- setShowPopover(false);
16
- }
17
- }, [options, inputRef, setShowPopover]);
18
- useEffect(() => {
19
- const getFirstOption = () => {
20
- for (let i = 0; i < options.length; i += 1)
21
- if (!["section", "separator"].includes(options[i].type)) {
22
- setCurrentOption(options[i].dsId);
23
- break;
24
- }
25
- };
26
- if (showPopover) {
27
- onMenuOpen();
28
- if (inputRef.current?.value !== "") {
29
- getFirstOption();
30
- } else if (Array.isArray(selectedValues)) {
31
- const multiSelectedValues = selectedValues;
32
- if (multiSelectedValues.length > 0) {
33
- setCurrentOption(multiSelectedValues[multiSelectedValues.length - 1].dsId);
34
- scrollOptionIntoView(multiSelectedValues[multiSelectedValues.length - 1].dsId);
35
- } else {
36
- getFirstOption();
37
- }
38
- } else {
39
- const singleSelectedValue = selectedValues;
40
- if (singleSelectedValue) {
41
- setCurrentOption(selectedValues.dsId);
42
- scrollOptionIntoView(selectedValues.dsId);
43
- } else {
44
- getFirstOption();
45
- }
46
- }
47
- }
48
- }, [showPopover, inputRef.current?.value]);
49
- };
50
- export {
51
- useMenuList
52
- };
53
- //# sourceMappingURL=useMenuList.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/parts/menu-list/useMenuList.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useEffect, useContext } from 'react';\nimport { AutocompleteContext } from '../../AutocompleteCTX';\nimport type { CBItemOption } from '../../index.d';\n\nconst useMenuList = (): void => {\n const {\n props: { selectedValues, onMenuOpen, options },\n inputRef,\n setCurrentOption,\n scrollOptionIntoView,\n setShowPopover,\n showPopover,\n } = useContext(AutocompleteContext);\n\n useEffect(() => {\n if (options.length === 0 || inputRef.current?.value === '') {\n setShowPopover(false);\n }\n }, [options, inputRef, setShowPopover]);\n\n useEffect(() => {\n const getFirstOption = () => {\n for (let i = 0; i < options.length; i += 1)\n if (!['section', 'separator'].includes(options[i].type)) {\n setCurrentOption(options[i].dsId);\n break;\n }\n };\n if (showPopover) {\n onMenuOpen();\n if (inputRef.current?.value !== '') {\n getFirstOption();\n } else if (Array.isArray(selectedValues)) {\n const multiSelectedValues = selectedValues as CBItemOption[];\n if (multiSelectedValues.length > 0) {\n setCurrentOption(multiSelectedValues[multiSelectedValues.length - 1].dsId);\n scrollOptionIntoView(multiSelectedValues[multiSelectedValues.length - 1].dsId);\n } else {\n getFirstOption();\n }\n } else {\n const singleSelectedValue = selectedValues as CBItemOption;\n if (singleSelectedValue) {\n setCurrentOption(selectedValues.dsId);\n scrollOptionIntoView(selectedValues.dsId);\n } else {\n getFirstOption();\n }\n }\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [showPopover, inputRef.current?.value]);\n};\n\nexport { useMenuList };\n"],
5
- "mappings": "AAAA;ACAA;AACA;AAGA,MAAM,cAAc,MAAY;AAC9B,QAAM;AAAA,IACJ,OAAO,EAAE,gBAAgB,YAAY;AAAA,IACrC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,YAAU,MAAM;AACd,QAAI,QAAQ,WAAW,KAAK,SAAS,SAAS,UAAU,IAAI;AAC1D,qBAAe;AAAA;AAAA,KAEhB,CAAC,SAAS,UAAU;AAEvB,YAAU,MAAM;AACd,UAAM,iBAAiB,MAAM;AAC3B,eAAS,IAAI,GAAG,IAAI,QAAQ,QAAQ,KAAK;AACvC,YAAI,CAAC,CAAC,WAAW,aAAa,SAAS,QAAQ,GAAG,OAAO;AACvD,2BAAiB,QAAQ,GAAG;AAC5B;AAAA;AAAA;AAGN,QAAI,aAAa;AACf;AACA,UAAI,SAAS,SAAS,UAAU,IAAI;AAClC;AAAA,iBACS,MAAM,QAAQ,iBAAiB;AACxC,cAAM,sBAAsB;AAC5B,YAAI,oBAAoB,SAAS,GAAG;AAClC,2BAAiB,oBAAoB,oBAAoB,SAAS,GAAG;AACrE,+BAAqB,oBAAoB,oBAAoB,SAAS,GAAG;AAAA,eACpE;AACL;AAAA;AAAA,aAEG;AACL,cAAM,sBAAsB;AAC5B,YAAI,qBAAqB;AACvB,2BAAiB,eAAe;AAChC,+BAAqB,eAAe;AAAA,eAC/B;AACL;AAAA;AAAA;AAAA;AAAA,KAKL,CAAC,aAAa,SAAS,SAAS;AAAA;",
6
- "names": []
7
- }
@@ -1,27 +0,0 @@
1
- import * as React from "react";
2
- import { PropTypes } from "react-desc";
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([
7
- PropTypes.arrayOf(PropTypes.object),
8
- PropTypes.object,
9
- PropTypes.string
10
- ]).description("Array of option or single option selected"),
11
- autoFocus: PropTypes.bool.description("Whether the combo box uses auto focus or not").defaultValue("false"),
12
- hasError: PropTypes.bool.description("Whether the combo box has error or not").defaultValue("false"),
13
- onChange: PropTypes.func.description("function triggered when an option is selected it will send the options selected").defaultValue(""),
14
- onSelectAll: PropTypes.func.description("function triggered when ALL button is selected from the header menu list").defaultValue(""),
15
- onFilter: PropTypes.func.description("function triggered when user type in the autocomplete input").defaultValue(""),
16
- onCreate: PropTypes.func.description('function triggered when user select "create" a new item whenever is not a match in the all option list').defaultValue(""),
17
- onClearAll: PropTypes.func.description("function triggered when user select CLEAR button from the header menu list").defaultValue(""),
18
- onMenuOpen: PropTypes.func.description("function triggered when user open the menu list").defaultValue(""),
19
- inputMinWidth: PropTypes.any.description("Minimum width for the combo box input controller").defaultValue(void 0),
20
- menuMinWidth: PropTypes.any.description("Minimum width for the dropdown menu").defaultValue(void 0),
21
- menuMaxHeight: PropTypes.any.description("Maximum height for the dropdown menu").defaultValue(void 0),
22
- withToggle: PropTypes.bool.description("POC purpose this prop will not remain").defaultValue("false")
23
- };
24
- export {
25
- propTypes
26
- };
27
- //# sourceMappingURL=propTypes.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/autocomplete/propTypes.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { PropTypes } from 'react-desc';\n\nexport const propTypes = {\n placeholder: PropTypes.string.description('input s placeholder value').defaultValue(''),\n options: PropTypes.oneOfType([PropTypes.array, PropTypes.object]).description('List of options').defaultValue([]),\n selectedValues: PropTypes.oneOfType([\n PropTypes.arrayOf(PropTypes.object),\n PropTypes.object,\n PropTypes.string,\n ]).description('Array of option or single option selected'),\n autoFocus: PropTypes.bool.description('Whether the combo box uses auto focus or not').defaultValue('false'),\n hasError: PropTypes.bool.description('Whether the combo box has error or not').defaultValue('false'),\n onChange: PropTypes.func\n .description('function triggered when an option is selected it will send the options selected')\n .defaultValue(''),\n onSelectAll: PropTypes.func\n .description('function triggered when ALL button is selected from the header menu list')\n .defaultValue(''),\n onFilter: PropTypes.func.description('function triggered when user type in the autocomplete input').defaultValue(''),\n onCreate: PropTypes.func\n .description(\n 'function triggered when user select \"create\" a new item whenever is not a match in the all option list',\n )\n .defaultValue(''),\n onClearAll: PropTypes.func\n .description('function triggered when user select CLEAR button from the header menu list')\n .defaultValue(''),\n onMenuOpen: PropTypes.func.description('function triggered when user open the menu list').defaultValue(''),\n inputMinWidth: PropTypes.any.description('Minimum width for the combo box input controller').defaultValue(undefined),\n menuMinWidth: PropTypes.any.description('Minimum width for the dropdown menu').defaultValue(undefined),\n menuMaxHeight: PropTypes.any.description('Maximum height for the dropdown menu').defaultValue(undefined),\n withToggle: PropTypes.bool.description('POC purpose this prop will not remain').defaultValue('false'),\n};\n"],
5
- "mappings": "AAAA;ACAA;AAEO,MAAM,YAAY;AAAA,EACvB,aAAa,UAAU,OAAO,YAAY,6BAA6B,aAAa;AAAA,EACpF,SAAS,UAAU,UAAU,CAAC,UAAU,OAAO,UAAU,SAAS,YAAY,mBAAmB,aAAa;AAAA,EAC9G,gBAAgB,UAAU,UAAU;AAAA,IAClC,UAAU,QAAQ,UAAU;AAAA,IAC5B,UAAU;AAAA,IACV,UAAU;AAAA,KACT,YAAY;AAAA,EACf,WAAW,UAAU,KAAK,YAAY,gDAAgD,aAAa;AAAA,EACnG,UAAU,UAAU,KAAK,YAAY,0CAA0C,aAAa;AAAA,EAC5F,UAAU,UAAU,KACjB,YAAY,mFACZ,aAAa;AAAA,EAChB,aAAa,UAAU,KACpB,YAAY,4EACZ,aAAa;AAAA,EAChB,UAAU,UAAU,KAAK,YAAY,+DAA+D,aAAa;AAAA,EACjH,UAAU,UAAU,KACjB,YACC,0GAED,aAAa;AAAA,EAChB,YAAY,UAAU,KACnB,YAAY,8EACZ,aAAa;AAAA,EAChB,YAAY,UAAU,KAAK,YAAY,mDAAmD,aAAa;AAAA,EACvG,eAAe,UAAU,IAAI,YAAY,oDAAoD,aAAa;AAAA,EAC1G,cAAc,UAAU,IAAI,YAAY,uCAAuC,aAAa;AAAA,EAC5F,eAAe,UAAU,IAAI,YAAY,wCAAwC,aAAa;AAAA,EAC9F,YAAY,UAAU,KAAK,YAAY,yCAAyC,aAAa;AAAA;",
6
- "names": []
7
- }
@@ -1,79 +0,0 @@
1
- import * as React from "react";
2
- import { useCallback, useContext } from "react";
3
- import { AutocompleteContext } from "../../AutocompleteCTX";
4
- import { findInCircularList } from "../listHelper";
5
- const isOptionFocuseable = (opt) => !["section", "separator"].includes(opt.type);
6
- const useKeyboardNavigation = () => {
7
- const {
8
- props: { onKeyDown, onChange, options, onFilter },
9
- setShowPopover,
10
- showPopover,
11
- focusOptionIdx,
12
- inputRef,
13
- setCurrentOption,
14
- scrollOptionIntoView
15
- } = useContext(AutocompleteContext);
16
- const currentItemIndex = options.findIndex((opt) => opt.dsId === focusOptionIdx);
17
- const currentItem = options.find((item) => item.dsId === focusOptionIdx);
18
- const selectOption = useCallback(() => {
19
- if (inputRef.current)
20
- inputRef.current.value = currentItem.label;
21
- if (onFilter)
22
- onFilter(currentItem.label);
23
- onChange(currentItem.label);
24
- setShowPopover(false);
25
- }, [currentItem, setShowPopover, onFilter, inputRef, onChange]);
26
- const onInputKeyDown = useCallback((e) => {
27
- const targetElement = e.target;
28
- onKeyDown(e, currentItem);
29
- if (e.keyCode === 32 && targetElement.value === "" || e.key === "Enter") {
30
- if (showPopover) {
31
- e.preventDefault();
32
- selectOption();
33
- }
34
- }
35
- if (e.key === "ArrowDown") {
36
- e.preventDefault();
37
- if (showPopover) {
38
- const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);
39
- setCurrentOption(options[nextItemIndex].dsId);
40
- scrollOptionIntoView(options[nextItemIndex].dsId);
41
- } else {
42
- setShowPopover(true);
43
- }
44
- }
45
- if (e.key === "ArrowUp") {
46
- e.preventDefault();
47
- if (showPopover) {
48
- const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);
49
- setCurrentOption(options[nextItemIndex].dsId);
50
- scrollOptionIntoView(options[nextItemIndex].dsId);
51
- } else {
52
- setShowPopover(true);
53
- setTimeout(() => {
54
- const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);
55
- setCurrentOption(options[nextItemIndex].dsId);
56
- scrollOptionIntoView(options[nextItemIndex].dsId);
57
- });
58
- }
59
- }
60
- if (e.key === "Escape") {
61
- setShowPopover(false);
62
- }
63
- }, [
64
- scrollOptionIntoView,
65
- currentItemIndex,
66
- options,
67
- currentItem,
68
- showPopover,
69
- onKeyDown,
70
- setCurrentOption,
71
- setShowPopover,
72
- selectOption
73
- ]);
74
- return { onInputKeyDown };
75
- };
76
- export {
77
- useKeyboardNavigation
78
- };
79
- //# sourceMappingURL=useKeyboardNavigation.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/utils/hooks/useKeyboardNavigation.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-depth */\n/* eslint-disable max-statements */\n/* eslint-disable complexity */\nimport { useCallback, useContext } from 'react';\nimport { CBOptionT } from '../../index.d';\nimport { AutocompleteContext } from '../../AutocompleteCTX';\nimport { findInCircularList } from '../listHelper';\n\nconst isOptionFocuseable = (opt: CBOptionT): boolean => !['section', 'separator'].includes(opt.type);\n\nexport const useKeyboardNavigation = () => {\n const {\n props: { onKeyDown, onChange, options, onFilter },\n setShowPopover,\n showPopover,\n focusOptionIdx,\n inputRef,\n setCurrentOption,\n scrollOptionIntoView,\n } = useContext(AutocompleteContext);\n\n const currentItemIndex = options.findIndex((opt) => opt.dsId === focusOptionIdx);\n const currentItem = options.find((item) => item.dsId === focusOptionIdx) as CBOptionT;\n const selectOption = useCallback(() => {\n if (inputRef.current) inputRef.current.value = currentItem.label;\n if (onFilter) onFilter(currentItem.label);\n onChange(currentItem.label);\n setShowPopover(false);\n }, [currentItem, setShowPopover, onFilter, inputRef, onChange]);\n\n const onInputKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n const targetElement = e.target as HTMLInputElement;\n\n // =============================================================================\n // CUSTOM KEYS\n // =============================================================================\n onKeyDown(e, currentItem);\n\n // =============================================================================\n // ENTER AND SPACE KEY SELECT OPTIONS AND OPEN CLOSE THE POPOVER\n // =============================================================================\n if ((e.keyCode === 32 && targetElement.value === '') || e.key === 'Enter') {\n if (showPopover) {\n e.preventDefault();\n selectOption();\n }\n }\n\n // =============================================================================\n // ARROWS UP AND DOWN\n // =============================================================================\n if (e.key === 'ArrowDown') {\n e.preventDefault();\n if (showPopover) {\n const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n } else {\n setShowPopover(true);\n }\n }\n if (e.key === 'ArrowUp') {\n e.preventDefault();\n if (showPopover) {\n const nextItemIndex = findInCircularList(options, currentItemIndex, isOptionFocuseable, -1);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n } else {\n setShowPopover(true);\n setTimeout(() => {\n const nextItemIndex = findInCircularList(options, 0, isOptionFocuseable, -1);\n setCurrentOption(options[nextItemIndex].dsId);\n scrollOptionIntoView(options[nextItemIndex].dsId);\n });\n }\n }\n // =============================================================================\n // ESCAPE\n // =============================================================================\n if (e.key === 'Escape') {\n setShowPopover(false);\n }\n },\n [\n scrollOptionIntoView,\n currentItemIndex,\n options,\n currentItem,\n showPopover,\n onKeyDown,\n setCurrentOption,\n setShowPopover,\n selectOption,\n ],\n );\n\n return { onInputKeyDown };\n};\n"],
5
- "mappings": "AAAA;ACIA;AAEA;AACA;AAEA,MAAM,qBAAqB,CAAC,QAA4B,CAAC,CAAC,WAAW,aAAa,SAAS,IAAI;AAExF,MAAM,wBAAwB,MAAM;AACzC,QAAM;AAAA,IACJ,OAAO,EAAE,WAAW,UAAU,SAAS;AAAA,IACvC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MACE,WAAW;AAEf,QAAM,mBAAmB,QAAQ,UAAU,CAAC,QAAQ,IAAI,SAAS;AACjE,QAAM,cAAc,QAAQ,KAAK,CAAC,SAAS,KAAK,SAAS;AACzD,QAAM,eAAe,YAAY,MAAM;AACrC,QAAI,SAAS;AAAS,eAAS,QAAQ,QAAQ,YAAY;AAC3D,QAAI;AAAU,eAAS,YAAY;AACnC,aAAS,YAAY;AACrB,mBAAe;AAAA,KACd,CAAC,aAAa,gBAAgB,UAAU,UAAU;AAErD,QAAM,iBAA6C,YACjD,CAAC,MAAM;AACL,UAAM,gBAAgB,EAAE;AAKxB,cAAU,GAAG;AAKb,QAAK,EAAE,YAAY,MAAM,cAAc,UAAU,MAAO,EAAE,QAAQ,SAAS;AACzE,UAAI,aAAa;AACf,UAAE;AACF;AAAA;AAAA;AAOJ,QAAI,EAAE,QAAQ,aAAa;AACzB,QAAE;AACF,UAAI,aAAa;AACf,cAAM,gBAAgB,mBAAmB,SAAS,kBAAkB;AACpE,yBAAiB,QAAQ,eAAe;AACxC,6BAAqB,QAAQ,eAAe;AAAA,aACvC;AACL,uBAAe;AAAA;AAAA;AAGnB,QAAI,EAAE,QAAQ,WAAW;AACvB,QAAE;AACF,UAAI,aAAa;AACf,cAAM,gBAAgB,mBAAmB,SAAS,kBAAkB,oBAAoB;AACxF,yBAAiB,QAAQ,eAAe;AACxC,6BAAqB,QAAQ,eAAe;AAAA,aACvC;AACL,uBAAe;AACf,mBAAW,MAAM;AACf,gBAAM,gBAAgB,mBAAmB,SAAS,GAAG,oBAAoB;AACzE,2BAAiB,QAAQ,eAAe;AACxC,+BAAqB,QAAQ,eAAe;AAAA;AAAA;AAAA;AAOlD,QAAI,EAAE,QAAQ,UAAU;AACtB,qBAAe;AAAA;AAAA,KAGnB;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIJ,SAAO,EAAE;AAAA;",
6
- "names": []
7
- }
@@ -1,27 +0,0 @@
1
- import * as React from "react";
2
- import { useState, useEffect, useRef, useMemo } from "react";
3
- const useOnElementResize = (targetRef) => {
4
- const [width, setWidth] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);
5
- const [height, setHeight] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);
6
- const observer = useRef(null);
7
- useEffect(() => {
8
- function outputsize() {
9
- if (targetRef.current) {
10
- setWidth(targetRef.current.offsetWidth);
11
- setHeight(targetRef.current.offsetHeight);
12
- }
13
- }
14
- observer.current = new ResizeObserver(outputsize).observe(targetRef.current);
15
- return () => {
16
- observer.current?.disconnect();
17
- };
18
- }, [targetRef]);
19
- return useMemo(() => ({
20
- width,
21
- height
22
- }), [width, height]);
23
- };
24
- export {
25
- useOnElementResize
26
- };
27
- //# sourceMappingURL=useOnElementResize.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/autocomplete/utils/hooks/useOnElementResize.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useEffect, useRef, useMemo } from 'react';\n\n// Custom hook to track dimension of a component\n// Taken and modified from https://stackoverflow.com/a/60218754\nconst useOnElementResize = (targetRef: React.RefObject<HTMLDivElement>): Record<'width' | 'height', number> => {\n const [width, setWidth] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);\n const [height, setHeight] = useState(targetRef.current ? targetRef.current?.offsetWidth : 0);\n const observer = useRef(null);\n\n useEffect(() => {\n function outputsize() {\n if (targetRef.current) {\n setWidth(targetRef.current.offsetWidth);\n setHeight(targetRef.current.offsetHeight);\n }\n }\n observer.current = new ResizeObserver(outputsize).observe(targetRef.current);\n\n return () => {\n observer.current?.disconnect();\n };\n }, [targetRef]);\n\n return useMemo(\n () => ({\n width,\n height,\n }),\n [width, height],\n );\n};\n\nexport { useOnElementResize };\n"],
5
- "mappings": "AAAA;ACAA;AAIA,MAAM,qBAAqB,CAAC,cAAmF;AAC7G,QAAM,CAAC,OAAO,YAAY,SAAS,UAAU,UAAU,UAAU,SAAS,cAAc;AACxF,QAAM,CAAC,QAAQ,aAAa,SAAS,UAAU,UAAU,UAAU,SAAS,cAAc;AAC1F,QAAM,WAAW,OAAO;AAExB,YAAU,MAAM;AACd,0BAAsB;AACpB,UAAI,UAAU,SAAS;AACrB,iBAAS,UAAU,QAAQ;AAC3B,kBAAU,UAAU,QAAQ;AAAA;AAAA;AAGhC,aAAS,UAAU,IAAI,eAAe,YAAY,QAAQ,UAAU;AAEpE,WAAO,MAAM;AACX,eAAS,SAAS;AAAA;AAAA,KAEnB,CAAC;AAEJ,SAAO,QACL,MAAO;AAAA,IACL;AAAA,IACA;AAAA,MAEF,CAAC,OAAO;AAAA;",
6
- "names": []
7
- }