@pega/cosmos-react-core 5.0.0-dev.2.1 → 5.0.0-dev.3.0

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 (229) hide show
  1. package/lib/components/AIButton/AIButton.d.ts +1 -1
  2. package/lib/components/Actions/Actions.d.ts +1 -1
  3. package/lib/components/AdditionalInfo/AdditionalInfo.d.ts +1 -1
  4. package/lib/components/AppShell/AppShell.styles.d.ts +2 -2
  5. package/lib/components/AppShell/AppShell.styles.d.ts.map +1 -1
  6. package/lib/components/AppShell/AppShell.styles.js +2 -1
  7. package/lib/components/AppShell/AppShell.styles.js.map +1 -1
  8. package/lib/components/AppShell/NavigationList.js +2 -2
  9. package/lib/components/AppShell/NavigationList.js.map +1 -1
  10. package/lib/components/Avatar/Avatar.d.ts +1 -1
  11. package/lib/components/Avatar/Avatar.d.ts.map +1 -1
  12. package/lib/components/Avatar/Avatar.js +4 -10
  13. package/lib/components/Avatar/Avatar.js.map +1 -1
  14. package/lib/components/Backdrop/Backdrop.d.ts +2 -2
  15. package/lib/components/Badges/Alert.d.ts +1 -1
  16. package/lib/components/Badges/Count.d.ts +1 -1
  17. package/lib/components/Badges/Keyboard.d.ts +1 -1
  18. package/lib/components/Badges/Status.d.ts +1 -1
  19. package/lib/components/Banner/Banner.d.ts +1 -1
  20. package/lib/components/Boolean/BooleanDisplay.d.ts +1 -1
  21. package/lib/components/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
  22. package/lib/components/Breadcrumbs/Breadcrumbs.js +27 -16
  23. package/lib/components/Breadcrumbs/Breadcrumbs.js.map +1 -1
  24. package/lib/components/ComboBox/ComboBox.d.ts +2 -2
  25. package/lib/components/ComboBox/ComboBox.d.ts.map +1 -1
  26. package/lib/components/ComboBox/ComboBox.js +47 -29
  27. package/lib/components/ComboBox/ComboBox.js.map +1 -1
  28. package/lib/components/ComboBox/ComboBoxInput.d.ts.map +1 -1
  29. package/lib/components/ComboBox/ComboBoxInput.js +1 -7
  30. package/lib/components/ComboBox/ComboBoxInput.js.map +1 -1
  31. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.d.ts.map +1 -1
  32. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.js +1 -5
  33. package/lib/components/ComboBox/MultiSelectInput/MultiSelectInput.js.map +1 -1
  34. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.d.ts.map +1 -1
  35. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.js +2 -10
  36. package/lib/components/ComboBox/SingleSelectInput/SingleSelectInput.js.map +1 -1
  37. package/lib/components/CompositeInput/CompositeInput.d.ts.map +1 -1
  38. package/lib/components/CompositeInput/CompositeInput.js +1 -12
  39. package/lib/components/CompositeInput/CompositeInput.js.map +1 -1
  40. package/lib/components/Configuration/Configuration.d.ts +19 -9
  41. package/lib/components/Configuration/Configuration.d.ts.map +1 -1
  42. package/lib/components/Configuration/Configuration.js +49 -27
  43. package/lib/components/Configuration/Configuration.js.map +1 -1
  44. package/lib/components/Currency/CurrencyInput.d.ts.map +1 -1
  45. package/lib/components/Currency/CurrencyInput.js +2 -13
  46. package/lib/components/Currency/CurrencyInput.js.map +1 -1
  47. package/lib/components/DangerButton/DangerButton.d.ts +1 -1
  48. package/lib/components/DateTime/Input/DateInput.d.ts.map +1 -1
  49. package/lib/components/DateTime/Input/DateInput.js +1 -12
  50. package/lib/components/DateTime/Input/DateInput.js.map +1 -1
  51. package/lib/components/DateTime/Input/DateTime.styles.d.ts.map +1 -1
  52. package/lib/components/DateTime/Input/DateTime.styles.js +26 -20
  53. package/lib/components/DateTime/Input/DateTime.styles.js.map +1 -1
  54. package/lib/components/DateTime/Input/DateTimeInput.d.ts.map +1 -1
  55. package/lib/components/DateTime/Input/DateTimeInput.js +1 -12
  56. package/lib/components/DateTime/Input/DateTimeInput.js.map +1 -1
  57. package/lib/components/DateTime/Input/Duration/DurationInput.d.ts.map +1 -1
  58. package/lib/components/DateTime/Input/Duration/DurationInput.js +2 -11
  59. package/lib/components/DateTime/Input/Duration/DurationInput.js.map +1 -1
  60. package/lib/components/DateTime/Input/MonthInput.d.ts.map +1 -1
  61. package/lib/components/DateTime/Input/MonthInput.js +1 -11
  62. package/lib/components/DateTime/Input/MonthInput.js.map +1 -1
  63. package/lib/components/DateTime/Input/QuarterInput.d.ts.map +1 -1
  64. package/lib/components/DateTime/Input/QuarterInput.js +1 -11
  65. package/lib/components/DateTime/Input/QuarterInput.js.map +1 -1
  66. package/lib/components/DateTime/Input/TimeInput.d.ts.map +1 -1
  67. package/lib/components/DateTime/Input/TimeInput.js +1 -12
  68. package/lib/components/DateTime/Input/TimeInput.js.map +1 -1
  69. package/lib/components/DateTime/Input/WeekInput.d.ts.map +1 -1
  70. package/lib/components/DateTime/Input/WeekInput.js +1 -11
  71. package/lib/components/DateTime/Input/WeekInput.js.map +1 -1
  72. package/lib/components/Drawer/Drawer.js +1 -1
  73. package/lib/components/Drawer/Drawer.js.map +1 -1
  74. package/lib/components/File/FileDisplay.d.ts.map +1 -1
  75. package/lib/components/File/FileDisplay.js +1 -5
  76. package/lib/components/File/FileDisplay.js.map +1 -1
  77. package/lib/components/File/FileInput.d.ts.map +1 -1
  78. package/lib/components/File/FileInput.js +1 -11
  79. package/lib/components/File/FileInput.js.map +1 -1
  80. package/lib/components/File/FileVisual.d.ts +1 -1
  81. package/lib/components/File/FileVisual.d.ts.map +1 -1
  82. package/lib/components/File/FileVisual.js +15 -11
  83. package/lib/components/File/FileVisual.js.map +1 -1
  84. package/lib/components/Form/Form.d.ts +6 -4
  85. package/lib/components/Form/Form.d.ts.map +1 -1
  86. package/lib/components/Form/Form.js +7 -4
  87. package/lib/components/Form/Form.js.map +1 -1
  88. package/lib/components/Form/Form.test-ids.d.ts +2 -0
  89. package/lib/components/Form/Form.test-ids.d.ts.map +1 -0
  90. package/lib/components/Form/Form.test-ids.js +3 -0
  91. package/lib/components/Form/Form.test-ids.js.map +1 -0
  92. package/lib/components/HTML/HTML.d.ts +6 -4
  93. package/lib/components/HTML/HTML.d.ts.map +1 -1
  94. package/lib/components/HTML/HTML.js +7 -4
  95. package/lib/components/HTML/HTML.js.map +1 -1
  96. package/lib/components/HTML/HTML.test-ids.d.ts +2 -0
  97. package/lib/components/HTML/HTML.test-ids.d.ts.map +1 -0
  98. package/lib/components/HTML/HTML.test-ids.js +3 -0
  99. package/lib/components/HTML/HTML.test-ids.js.map +1 -0
  100. package/lib/components/Icon/Icon.d.ts +37 -8
  101. package/lib/components/Icon/Icon.d.ts.map +1 -1
  102. package/lib/components/Icon/Icon.js +97 -11
  103. package/lib/components/Icon/Icon.js.map +1 -1
  104. package/lib/components/Input/Input.d.ts.map +1 -1
  105. package/lib/components/Input/Input.js +2 -27
  106. package/lib/components/Input/Input.js.map +1 -1
  107. package/lib/components/Lightbox/Lightbox.d.ts +4 -2
  108. package/lib/components/Lightbox/Lightbox.d.ts.map +1 -1
  109. package/lib/components/Lightbox/Lightbox.js +11 -9
  110. package/lib/components/Lightbox/Lightbox.js.map +1 -1
  111. package/lib/components/Lightbox/Lightbox.styles.d.ts +1 -1
  112. package/lib/components/Lightbox/Lightbox.styles.d.ts.map +1 -1
  113. package/lib/components/Lightbox/Lightbox.test-ids.d.ts +2 -0
  114. package/lib/components/Lightbox/Lightbox.test-ids.d.ts.map +1 -0
  115. package/lib/components/Lightbox/Lightbox.test-ids.js +12 -0
  116. package/lib/components/Lightbox/Lightbox.test-ids.js.map +1 -0
  117. package/lib/components/Lightbox/Lightbox.types.d.ts +2 -2
  118. package/lib/components/Lightbox/Lightbox.types.d.ts.map +1 -1
  119. package/lib/components/Lightbox/Lightbox.types.js.map +1 -1
  120. package/lib/components/Link/Link.d.ts +6 -4
  121. package/lib/components/Link/Link.d.ts.map +1 -1
  122. package/lib/components/Link/Link.js +8 -6
  123. package/lib/components/Link/Link.js.map +1 -1
  124. package/lib/components/Link/Link.test-ids.d.ts +2 -0
  125. package/lib/components/Link/Link.test-ids.d.ts.map +1 -0
  126. package/lib/components/Link/Link.test-ids.js +7 -0
  127. package/lib/components/Link/Link.test-ids.js.map +1 -0
  128. package/lib/components/ListToolbar/ListToolbar.d.ts +1 -1
  129. package/lib/components/ListToolbar/ListToolbar.d.ts.map +1 -1
  130. package/lib/components/ListToolbar/ListToolbar.js +10 -8
  131. package/lib/components/ListToolbar/ListToolbar.js.map +1 -1
  132. package/lib/components/ListToolbar/ListToolbar.styles.d.ts +1 -1
  133. package/lib/components/ListToolbar/ListToolbar.styles.d.ts.map +1 -1
  134. package/lib/components/Location/LocationDisplay.d.ts.map +1 -1
  135. package/lib/components/Location/LocationDisplay.js +1 -6
  136. package/lib/components/Location/LocationDisplay.js.map +1 -1
  137. package/lib/components/Location/LocationInput.d.ts.map +1 -1
  138. package/lib/components/Location/LocationInput.js +3 -30
  139. package/lib/components/Location/LocationInput.js.map +1 -1
  140. package/lib/components/Location/LocationView.d.ts +1 -1
  141. package/lib/components/Location/LocationView.d.ts.map +1 -1
  142. package/lib/components/Menu/Menu.styles.d.ts +1 -1
  143. package/lib/components/Menu/Menu.styles.d.ts.map +1 -1
  144. package/lib/components/Menu/Menu.styles.js +2 -2
  145. package/lib/components/Menu/Menu.styles.js.map +1 -1
  146. package/lib/components/Menu/MenuItem.d.ts.map +1 -1
  147. package/lib/components/Menu/MenuItem.js +1 -1
  148. package/lib/components/Menu/MenuItem.js.map +1 -1
  149. package/lib/components/Modal/Modal.js +1 -1
  150. package/lib/components/Modal/Modal.js.map +1 -1
  151. package/lib/components/MultiStepForm/FormProgress.styles.d.ts +1 -1
  152. package/lib/components/MultiStepForm/FormProgress.styles.d.ts.map +1 -1
  153. package/lib/components/MultiStepForm/FormProgress.styles.js +1 -2
  154. package/lib/components/MultiStepForm/FormProgress.styles.js.map +1 -1
  155. package/lib/components/Number/NumberInput.d.ts.map +1 -1
  156. package/lib/components/Number/NumberInput.js +3 -15
  157. package/lib/components/Number/NumberInput.js.map +1 -1
  158. package/lib/components/Phone/PhoneInput.d.ts.map +1 -1
  159. package/lib/components/Phone/PhoneInput.js +1 -12
  160. package/lib/components/Phone/PhoneInput.js.map +1 -1
  161. package/lib/components/Progress/Progress.styles.d.ts +1 -1
  162. package/lib/components/Progress/Progress.styles.d.ts.map +1 -1
  163. package/lib/components/RadioCheckGroup/RadioCheckGroup.d.ts.map +1 -1
  164. package/lib/components/RadioCheckGroup/RadioCheckGroup.js +1 -8
  165. package/lib/components/RadioCheckGroup/RadioCheckGroup.js.map +1 -1
  166. package/lib/components/SearchInput/SearchInput.d.ts +2 -2
  167. package/lib/components/SearchInput/SearchInput.d.ts.map +1 -1
  168. package/lib/components/SearchInput/SearchInput.js +69 -19
  169. package/lib/components/SearchInput/SearchInput.js.map +1 -1
  170. package/lib/components/SearchInput/SearchInput.styles.d.ts.map +1 -1
  171. package/lib/components/SearchInput/SearchInput.styles.js +4 -0
  172. package/lib/components/SearchInput/SearchInput.styles.js.map +1 -1
  173. package/lib/components/Select/Select.d.ts.map +1 -1
  174. package/lib/components/Select/Select.js +1 -14
  175. package/lib/components/Select/Select.js.map +1 -1
  176. package/lib/components/Slider/Slider.d.ts.map +1 -1
  177. package/lib/components/Slider/Slider.js +2 -12
  178. package/lib/components/Slider/Slider.js.map +1 -1
  179. package/lib/components/TextArea/TextArea.d.ts.map +1 -1
  180. package/lib/components/TextArea/TextArea.js +2 -30
  181. package/lib/components/TextArea/TextArea.js.map +1 -1
  182. package/lib/components/Toaster/Toaster.d.ts +4 -2
  183. package/lib/components/Toaster/Toaster.d.ts.map +1 -1
  184. package/lib/components/Toaster/Toaster.js +18 -16
  185. package/lib/components/Toaster/Toaster.js.map +1 -1
  186. package/lib/components/Toaster/Toaster.test-ids.d.ts +2 -0
  187. package/lib/components/Toaster/Toaster.test-ids.d.ts.map +1 -0
  188. package/lib/components/Toaster/Toaster.test-ids.js +3 -0
  189. package/lib/components/Toaster/Toaster.test-ids.js.map +1 -0
  190. package/lib/components/Toaster/Toaster.types.d.ts +2 -1
  191. package/lib/components/Toaster/Toaster.types.d.ts.map +1 -1
  192. package/lib/components/Toaster/Toaster.types.js.map +1 -1
  193. package/lib/components/Tooltip/Tooltip.d.ts +6 -4
  194. package/lib/components/Tooltip/Tooltip.d.ts.map +1 -1
  195. package/lib/components/Tooltip/Tooltip.js +7 -5
  196. package/lib/components/Tooltip/Tooltip.js.map +1 -1
  197. package/lib/components/Tooltip/Tooltip.test-ids.d.ts +2 -0
  198. package/lib/components/Tooltip/Tooltip.test-ids.d.ts.map +1 -0
  199. package/lib/components/Tooltip/Tooltip.test-ids.js +3 -0
  200. package/lib/components/Tooltip/Tooltip.test-ids.js.map +1 -0
  201. package/lib/components/Tree/StandardTree.styles.d.ts +5 -3
  202. package/lib/components/Tree/StandardTree.styles.d.ts.map +1 -1
  203. package/lib/components/Tree/Tree.d.ts +6 -4
  204. package/lib/components/Tree/Tree.d.ts.map +1 -1
  205. package/lib/components/Tree/Tree.js +7 -3
  206. package/lib/components/Tree/Tree.js.map +1 -1
  207. package/lib/components/Tree/Tree.test-ids.d.ts +3 -0
  208. package/lib/components/Tree/Tree.test-ids.d.ts.map +1 -0
  209. package/lib/components/Tree/Tree.test-ids.js +4 -0
  210. package/lib/components/Tree/Tree.test-ids.js.map +1 -0
  211. package/lib/hooks/useActiveDescendant.d.ts.map +1 -1
  212. package/lib/hooks/useActiveDescendant.js +4 -1
  213. package/lib/hooks/useActiveDescendant.js.map +1 -1
  214. package/lib/hooks/useI18n.d.ts +35 -0
  215. package/lib/hooks/useI18n.d.ts.map +1 -1
  216. package/lib/i18n/default.d.ts +35 -0
  217. package/lib/i18n/default.d.ts.map +1 -1
  218. package/lib/i18n/default.js +37 -1
  219. package/lib/i18n/default.js.map +1 -1
  220. package/lib/i18n/i18n.d.ts +35 -0
  221. package/lib/i18n/i18n.d.ts.map +1 -1
  222. package/lib/theme/theme.d.ts +37 -6
  223. package/lib/theme/theme.d.ts.map +1 -1
  224. package/lib/theme/themeDefinition.json +12 -4
  225. package/lib/theme/themeOverrides.schema.json +22 -3
  226. package/lib/theme/themes/aries2023DarkTheme.json +1 -3
  227. package/lib/theme/themes/aries2023Theme.json +1 -1
  228. package/lib/theme/themes/darkTheme.json +1 -3
  229. package/package.json +6 -6
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBoxInput.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAK5E,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AAkBnE,MAAM,aAAa,GAAyD,UAAU,CACpF,SAAS,aAAa,CAAC,KAA0C,EAAE,GAA0B;IAC3F,MAAM,EACJ,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,CAC/B,KAAC,gBAAgB,IACf,QAAQ,EAAE,QAAsB,EAChC,KAAK,EAAE,KAAK,KACR;YACF,GAAG;YACH,QAAQ;YACR,cAAc;YACd,eAAe;YACf,yBAAyB;SAC1B,KACG,SAAS,GACb,CACH,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAoB,EAC9B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, PropsWithoutRef } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { MenuItemProps } from '../Menu/Menu.types';\n\nimport SingleSelectInput from './SingleSelectInput/SingleSelectInput';\nimport MultiSelectInput from './MultiSelectInput/MultiSelectInput';\nimport type { MultiSelectInputProps } from './MultiSelectInput/MultiSelectInput.types';\nimport ComboBoxProps, { Selected } from './ComboBox.types';\n\ninterface ComboBoxInputProps extends BaseProps {\n mode?: 'multi-select' | 'single-select';\n selected?: Selected | Selected[];\n value?: ComboBoxProps['value'];\n visual?: ComboBoxProps['visual'];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: MultiSelectInputProps['onSelectedFocus'];\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: MultiSelectInputProps['onSelectedBlur'];\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: MultiSelectInputProps['pauseDescendantEvaluation'];\n}\n\nconst ComboBoxInput: FunctionComponent<ComboBoxInputProps & ForwardProps> = forwardRef(\n function ComboBoxInput(props: PropsWithoutRef<ComboBoxInputProps>, ref: Ref<HTMLInputElement>) {\n const {\n value,\n mode,\n selected,\n visual,\n onRemove,\n onSelectedFocus,\n onSelectedBlur,\n pauseDescendantEvaluation,\n ...restProps\n } = props;\n\n return mode === 'multi-select' ? (\n <MultiSelectInput\n selected={selected as Selected[]}\n value={value}\n {...{\n ref,\n onRemove,\n onSelectedBlur,\n onSelectedFocus,\n pauseDescendantEvaluation\n }}\n {...restProps}\n />\n ) : (\n <SingleSelectInput\n ref={ref}\n selected={selected as Selected}\n value={value}\n visual={visual}\n {...restProps}\n />\n );\n }\n);\n\nexport default ComboBoxInput;\n"]}
1
+ {"version":3,"file":"ComboBoxInput.js","sourceRoot":"","sources":["../../../src/components/ComboBox/ComboBoxInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAK5E,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,gBAAgB,MAAM,qCAAqC,CAAC;AAkBnE,MAAM,aAAa,GAAyD,UAAU,CACpF,SAAS,aAAa,CAAC,KAA0C,EAAE,GAA0B;IAC3F,MAAM,EACJ,KAAK,EACL,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,QAAQ,EACR,eAAe,EACf,cAAc,EACd,yBAAyB,EACzB,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,OAAO,IAAI,KAAK,cAAc,CAAC,CAAC,CAAC,CAC/B,KAAC,gBAAgB,IACf,QAAQ,EAAE,QAAsB,EAChC,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAQ,EAClB,cAAc,EAAE,cAAc,EAC9B,eAAe,EAAE,eAAe,EAChC,yBAAyB,EAAE,yBAAyB,KAChD,SAAS,GACb,CACH,CAAC,CAAC,CAAC,CACF,KAAC,iBAAiB,IAChB,GAAG,EAAE,GAAG,EACR,QAAQ,EAAE,QAAoB,EAC9B,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,MAAM,KACV,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, Ref, PropsWithoutRef } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { MenuItemProps } from '../Menu/Menu.types';\n\nimport SingleSelectInput from './SingleSelectInput/SingleSelectInput';\nimport MultiSelectInput from './MultiSelectInput/MultiSelectInput';\nimport type { MultiSelectInputProps } from './MultiSelectInput/MultiSelectInput.types';\nimport ComboBoxProps, { Selected } from './ComboBox.types';\n\ninterface ComboBoxInputProps extends BaseProps {\n mode?: 'multi-select' | 'single-select';\n selected?: Selected | Selected[];\n value?: ComboBoxProps['value'];\n visual?: ComboBoxProps['visual'];\n onRemove?: (id: MenuItemProps['id'], index: number) => void;\n /** Callback on selected item pseudo focus */\n onSelectedFocus?: MultiSelectInputProps['onSelectedFocus'];\n /** Callback on selected item pseudo blur */\n onSelectedBlur?: MultiSelectInputProps['onSelectedBlur'];\n /** Pause evaluation of selected item descendants */\n pauseDescendantEvaluation?: MultiSelectInputProps['pauseDescendantEvaluation'];\n}\n\nconst ComboBoxInput: FunctionComponent<ComboBoxInputProps & ForwardProps> = forwardRef(\n function ComboBoxInput(props: PropsWithoutRef<ComboBoxInputProps>, ref: Ref<HTMLInputElement>) {\n const {\n value,\n mode,\n selected,\n visual,\n onRemove,\n onSelectedFocus,\n onSelectedBlur,\n pauseDescendantEvaluation,\n ...restProps\n } = props;\n\n return mode === 'multi-select' ? (\n <MultiSelectInput\n selected={selected as Selected[]}\n value={value}\n ref={ref}\n onRemove={onRemove}\n onSelectedBlur={onSelectedBlur}\n onSelectedFocus={onSelectedFocus}\n pauseDescendantEvaluation={pauseDescendantEvaluation}\n {...restProps}\n />\n ) : (\n <SingleSelectInput\n ref={ref}\n selected={selected as Selected}\n value={value}\n visual={visual}\n {...restProps}\n />\n );\n }\n);\n\nexport default ComboBoxInput;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAWlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAiB9C,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEjE,eAAO,MAAM,sBAAsB,yGA4BjC,CAAC;AAIH,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAkO7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
1
+ {"version":3,"file":"MultiSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EAWlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAiB9C,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAEjE,eAAO,MAAM,sBAAsB,yGA4BjC,CAAC;AAIH,QAAA,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG,YAAY,CAgO7E,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
@@ -127,11 +127,7 @@ const MultiSelectInput = forwardRef(function MultiSelectInput(props, ref) {
127
127
  ? `${id}-inputDescription ${id}-searchDescription`
128
128
  : `${id}-inputDescription`;
129
129
  }, [id]);
130
- return (_jsxs(Flex, { as: StyledMultiSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', justify: 'between' }, ...{
131
- readOnly,
132
- disabled,
133
- status
134
- }, children: [_jsxs(Flex, { container: { alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }, item: { grow: 1 }, onClick: (e) => {
130
+ return (_jsxs(Flex, { as: StyledMultiSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', justify: 'between' }, readOnly: readOnly, disabled: disabled, status: status, children: [_jsxs(Flex, { container: { alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }, item: { grow: 1 }, onClick: (e) => {
135
131
  if (e.target instanceof HTMLElement &&
136
132
  !e.currentTarget.contains(e.target.closest('li'))) {
137
133
  inputRef.current?.focus();
@@ -1 +1 @@
1
- {"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAIV,MAAM,EACN,WAAW,EACX,OAAO,EACP,QAAQ,EACR,SAAS,EAEV,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAG1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,UAAU,EAAE,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,IAAI,MAAM,YAAY,CAAC;AAC9B,OAAO,EACL,kBAAkB,EAClB,mBAAmB,EACnB,YAAY,EACZ,OAAO,EACP,MAAM,EACP,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,yBAAyB,CAAC;AAC3D,OAAO,kBAAkB,MAAM,0BAA0B,CAAC;AAC1D,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAIvD,MAAM,CAAC,MAAM,sBAAsB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC5E,MAAM,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,UAAU,CAAC,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC;IAC/D,MAAM,EAAE,kBAAkB,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC;IAC9D,MAAM,cAAc,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC;IAExE,OAAO,GAAG,CAAA;;;;;;;oCAOwB,gBAAgB;iBACnC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;2CACJ,cAAc,0BAA0B,UAAU;;;UAGnF,gBAAgB;mBACP,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,WAAW;;;;;;;;;GAS9C,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,sBAAsB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEvD,MAAM,gBAAgB,GAA4D,UAAU,CAC1F,SAAS,gBAAgB,CACvB,KAA6C,EAC7C,GAA0B;IAE1B,MAAM,EACJ,QAAQ,GAAG,EAAE,EACb,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,mBAAmB,EACnB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,WAAW,EACX,SAAS,EACT,yBAAyB,EACzB,eAAe,EACf,cAAc,EACd,eAAe,EAAE,YAAY,EAC7B,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IACpB,MAAM,EAAE,GAAG,MAAM,EAAE,CAAC;IAEpB,MAAM,QAAQ,GAAG,kBAAkB,CAAmB,GAAG,CAAC,CAAC;IAC3D,MAAM,OAAO,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAC/C,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,QAAQ,CAAqB,IAAI,CAAC,CAAC;IACjF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IACtE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAEtC,MAAM,SAAS,GAAG,OAAO,CACvB,GAAG,EAAE,CAAC,CAAC;QACL,OAAO,EAAE,QAAQ,CAAC,OAAO;QACzB,KAAK,EAAE,OAAO,CAAC,OAAO;QACtB,QAAQ,EAAE,mBAAmB;QAC7B,WAAW,EAAE,YAAqB;QAClC,aAAa,EAAE,eAAe;QAC9B,gBAAgB,EAAE,GAAG,EAAE;YACrB,kBAAkB,CAAC,IAAI,CAAC,CAAC;QAC3B,CAAC;QACD,yBAAyB;QACzB,OAAO,EAAE,CAAC,EAAe,EAAE,EAAE;YAC3B,EAAE,CAAC,KAAK,EAAE,CAAC;QACb,CAAC;KACF,CAAC,EACF,CAAC,yBAAyB,EAAE,QAAQ,EAAE,eAAe,CAAC,CACvD,CAAC;IAEF,MAAM,EAAE,gBAAgB,EAAE,GAAG,mBAAmB,CAAC,SAAS,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAExE,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,WAAW,EAAE,GAAG,EAAE,EAAE;QACnB,IAAI,CAAC,yBAAyB,EAAE;YAC9B,IAAI,GAAG,KAAK,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC/B,iCAAiC;gBACjC,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;oBACvB,0CAA0C;oBAC1C,kBAAkB,CACf,OAAO,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,GAAG,GAAG,CAAC,CAAiB;wBAC7E,IAAI,CACP,CAAC;iBACH;qBAAM;oBACL,2CAA2C;oBAC3C,cAAc,EAAE,EAAE,CAAC;iBACpB;aACF;iBAAM,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE;gBAC9B,gEAAgE;gBAChE,kBAAkB,CACf,OAAO,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,GAAG,GAAG,CAAC,CAAiB;oBAC7E,IAAI,CACP,CAAC;aACH;SACF;QACD,QAAQ,EAAE,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;QAC7B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;IAC5B,CAAC,EACD,CAAC,QAAQ,EAAE,QAAQ,EAAE,cAAc,EAAE,SAAS,CAAC,CAChD,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,uDAAuD;QACvD,IAAI,gBAAgB,EAAE,EAAE,IAAI,gBAAgB,CAAC,EAAE,KAAK,YAAY,EAAE;YAChE,eAAe,CAAC,gBAAgB,CAAC,EAAE,CAAC,CAAC;SACtC;IACH,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,cAAc,GAAG,WAAW,CAChC,CAAC,CAAkC,EAAE,EAAE;QACrC,IAAI,QAAQ,CAAC,MAAM,IAAI,QAAQ,CAAC,OAAO,EAAE,cAAc,KAAK,CAAC,EAAE;YAC7D,MAAM,SAAS,GAAG,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;YACtC,IAAI,yBAAyB,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,GAAG,CAAC,KAAK,CAAC,EAAE,EAAE;gBAC/D,kBAAkB,CACf,OAAO,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAiB;oBAC/E,IAAI,CACP,CAAC;gBACF,eAAe,EAAE,EAAE,CAAC;aACrB;YAED,MAAM,gBAAgB,GAAG,OAAO,CAAC,OAAO,EAAE,gBAAgB,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,SAAS,CAAC;gBACvF,EAAE,EAAE,CAAC;YACP,MAAM,UAAU,GAAG,YAAY,KAAK,gBAAgB,CAAC;YAErD,IACE,CAAC,yBAAyB;gBAC1B,CAAC,CAAC,UAAU,IAAI,CAAC,CAAC,GAAG,KAAK,QAAQ,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,CAAC,EACvE;gBACA,cAAc,EAAE,EAAE,CAAC;aACpB;YAED,IAAI,CAAC,WAAW,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,QAAQ,IAAI,QAAQ,CAAC,EAAE;gBACtE,qBAAqB,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC,EAAE,EAAE,SAAS,CAAC,CAAC;aAC1D;SACF;QACD,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;IACjB,CAAC,EACD;QACE,yBAAyB;QACzB,YAAY;QACZ,SAAS;QACT,qBAAqB;QACrB,QAAQ;QACR,QAAQ;QACR,QAAQ;KACT,CACF,CAAC;IAEF,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE;QACnC,OAAO,QAAQ;YACb,CAAC,CAAC,GAAG,EAAE,sBAAsB,EAAE,oBAAoB;YACnD,CAAC,CAAC,GAAG,EAAE,mBAAmB,CAAC;IAC/B,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAET,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,sBAAsB,EAC1B,WAAW,EAAE,iBAAiB,EAC9B,aAAa,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,mBAAmB,EAC5D,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,EAAE,KACnD;YACF,QAAQ;YACR,QAAQ;YACR,MAAM;SACP,aAED,MAAC,IAAI,IACH,SAAS,EAAE,EAAE,YAAY,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,EAAE,IAAI,EAAE,EACzF,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,OAAO,EAAE,CAAC,CAA6B,EAAE,EAAE;oBACzC,IACE,CAAC,CAAC,MAAM,YAAY,WAAW;wBAC/B,CAAC,CAAC,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,EACjD;wBACA,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;wBAC1B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;qBAC3B;gBACH,CAAC,aAEA,QAAQ,CAAC,MAAM,GAAG,CAAC,IAAI,CACtB,aAAI,GAAG,EAAE,OAAO,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAC,SAAS,gBAAa,CAAC,CAAC,gBAAgB,CAAC,YACrE,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,GAAG,EAAE,EAAE;4BAC7B,OAAO,CACL,KAAC,UAAU,IACT,EAAE,EAAC,IAAI,EAEP,IAAI,EAAC,QAAQ,EACb,EAAE,EAAE,OAAO,CAAC,EAAE,CAAC,QAAQ,EAAE,EACzB,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,CAAC,CAAC,EAAE;oCACX,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,KAAK,CAAC,CAAC;oCAElC,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,IAAI,CAAC,UAAU,EAAE;wCACzC,qBAAqB,CAAC,OAAO,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;qCACxC;gCACH,CAAC,EACD,QAAQ,EAAE,GAAG,EAAE;oCACb,IAAI,CAAC,QAAQ,IAAI,CAAC,QAAQ,EAAE;wCAC1B,qBAAqB,CAAC,OAAO,CAAC,EAAE,EAAE,GAAG,CAAC,CAAC;qCACxC;gCACH,CAAC,EACD,SAAS,EAAE,CAAC,CAAyB,EAAE,EAAE;oCACvC,+BAA+B;oCAC/B,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW;wCAAE,CAAC,CAAC,cAAc,EAAE,CAAC;gCAChD,CAAC,EACD,QAAQ,EAAC,IAAI,gBACD,GAAG,CAAC,CAAC,QAAQ,CAAC,IAAI,OAAO,CAAC,IAAI,EAAE,sBAC1B,eAAe,YAEhC,OAAO,CAAC,IAAI,IAxBR,OAAO,CAAC,EAAE,CAyBJ,CACd,CAAC;wBACJ,CAAC,CAAC,GACC,CACN,EACD,KAAC,IAAI,IACH,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAC,OAAO,EACV,IAAI,EAAE,CAAC,EACP,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,KAAK;wBACZ,0CAA0C;wBAC1C,QAAQ,EAAE,QAAQ,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,EAChC,SAAS,EAAE,cAAc,EACzB,QAAQ,EAAE,QAAQ,IAAI,CAAC,QAAQ,EAC/B,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,WAAW,EACvD,YAAY,EAAC,KAAK,EAClB,SAAS,EAAE,SAAS,mBACL,CAAC,yBAAyB,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,KACzD,SAAS,EACb,QAAQ,EAAE,SAAS,GACnB,IACG,EACN,OAAO,EAER,KAAC,kBAAkB,IAAC,EAAE,EAAE,GAAG,EAAE,mBAAmB,YAC7C,GAAG,CAAC,CAAC,qBAAqB,CAAC,GAAG,GACZ,EACrB,KAAC,kBAAkB,IAAC,EAAE,EAAE,GAAG,EAAE,oBAAoB,YAC9C,CAAC,CAAC,8BAA8B,CAAC,GACf,IAChB,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,gBAAgB,CAAC","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n Ref,\n PropsWithoutRef,\n KeyboardEvent,\n useRef,\n useCallback,\n useMemo,\n useState,\n useEffect,\n MouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport Selectable, { StyledSelectable } from '../../Badges/Selection';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport {\n useConsolidatedRef,\n useActiveDescendant,\n useDirection,\n useI18n,\n useUID\n} from '../../../hooks';\nimport { cap, tryCatch } from '../../../utils';\nimport { StyledBareButton } from '../../Button/BareButton';\nimport VisuallyHiddenText from '../../VisuallyHiddenText';\nimport { StyledSelectInput } from '../ComboBox.styles';\n\nimport { MultiSelectInputProps } from './MultiSelectInput.types';\n\nexport const StyledMultiSelectInput = styled(StyledSelectInput)(({ theme }) => {\n const { background } = theme.components.badges.selectable.base;\n const { 'foreground-color': foreground } = theme.base.palette;\n const boxShadowColor = tryCatch(() => transparentize(0.45, foreground));\n\n return css`\n cursor: text;\n\n ul {\n list-style: none;\n display: contents;\n\n &[data-active-scope='true'] ${StyledSelectable}[data-current='true'] {\n color: ${theme.base.palette.interactive};\n box-shadow: 0 0 0.5rem -0.125rem ${boxShadowColor}, inset 0 0 0 0.125rem ${background};\n outline: none;\n\n ${StyledBareButton} {\n color: ${theme.base.palette.interactive};\n }\n }\n }\n\n input {\n width: 8ch;\n height: 1.125rem;\n }\n `;\n});\n\nStyledMultiSelectInput.defaultProps = defaultThemeProp;\n\nconst MultiSelectInput: FunctionComponent<MultiSelectInputProps & ForwardProps> = forwardRef(\n function MultiSelectInput(\n props: PropsWithoutRef<MultiSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n selected = [],\n value,\n onRemove,\n onChange,\n onKeyDown,\n onResolveSuggestion,\n actions,\n readOnly,\n disabled,\n status,\n placeholder,\n autoFocus,\n pauseDescendantEvaluation,\n onSelectedFocus,\n onSelectedBlur,\n 'aria-controls': ariaControls,\n ...restProps\n } = props;\n const t = useI18n();\n const id = useUID();\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref);\n const listRef = useRef<HTMLUListElement>(null);\n const [focusDescendant, setFocusDescendant] = useState<HTMLElement | null>(null);\n const [activeItemId, setActiveItemId] = useState<string | null>(null);\n const { start, end } = useDirection();\n\n const uadConfig = useMemo(\n () => ({\n focusEl: inputRef.current,\n scope: listRef.current,\n selector: 'li[role=\"option\"]',\n orientation: 'horizontal' as const,\n focusReturnEl: focusDescendant,\n clearFocusReturn: () => {\n setFocusDescendant(null);\n },\n pauseDescendantEvaluation,\n onClick: (el: HTMLElement) => {\n el.click();\n }\n }),\n [pauseDescendantEvaluation, selected, focusDescendant]\n );\n\n const { activeDescendant } = useActiveDescendant(uadConfig, [selected]);\n\n const handleSelectedRemoval = useCallback(\n (selectionId, idx) => {\n if (!pauseDescendantEvaluation) {\n if (idx === selected.length - 1) {\n // If removing last selected item\n if (selected.length > 1) {\n // If other selected items, focus previous\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx - 1] as HTMLElement) ||\n null\n );\n } else {\n // Blur selected if final only item removed\n onSelectedBlur?.();\n }\n } else if (selected.length > 1) {\n // If not last item removed and other selected items, focus next\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx + 1] as HTMLElement) ||\n null\n );\n }\n }\n onRemove?.(selectionId, idx);\n inputRef.current?.focus();\n },\n [selected, onRemove, onSelectedBlur, uadConfig]\n );\n\n useEffect(() => {\n // Maintain active item & prev. val only as it changes.\n if (activeDescendant?.id && activeDescendant.id !== activeItemId) {\n setActiveItemId(activeDescendant.id);\n }\n }, [activeDescendant]);\n\n const onInputKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (selected.length && inputRef.current?.selectionStart === 0) {\n const lastIndex = selected.length - 1;\n if (pauseDescendantEvaluation && e.key === `Arrow${cap(start)}`) {\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex] as HTMLElement) ||\n null\n );\n onSelectedFocus?.();\n }\n\n const lastSelectableId = listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex]\n ?.id;\n const onLastItem = activeItemId === lastSelectableId;\n\n if (\n !pauseDescendantEvaluation &&\n ((onLastItem && e.key === `Arrow${cap(end)}`) || e.key === 'ArrowDown')\n ) {\n onSelectedBlur?.();\n }\n\n if (['Backspace', 'Delete'].includes(e.key) && !(readOnly || disabled)) {\n handleSelectedRemoval(selected[lastIndex].id, lastIndex);\n }\n }\n onKeyDown?.(e);\n },\n [\n pauseDescendantEvaluation,\n activeItemId,\n onKeyDown,\n handleSelectedRemoval,\n selected,\n readOnly,\n disabled\n ]\n );\n\n const ariaDescribedBy = useMemo(() => {\n return onChange\n ? `${id}-inputDescription ${id}-searchDescription`\n : `${id}-inputDescription`;\n }, [id]);\n\n return (\n <Flex\n as={StyledMultiSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', justify: 'between' }}\n {...{\n readOnly,\n disabled,\n status\n }}\n >\n <Flex\n container={{ alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }}\n item={{ grow: 1 }}\n onClick={(e: MouseEvent<HTMLDivElement>) => {\n if (\n e.target instanceof HTMLElement &&\n !e.currentTarget.contains(e.target.closest('li'))\n ) {\n inputRef.current?.focus();\n inputRef.current?.click();\n }\n }}\n >\n {selected.length > 0 && (\n <ul ref={listRef} id={id} role='listbox' aria-label={t('selected_items')}>\n {selected.map((element, idx) => {\n return (\n <Selectable\n as='li'\n key={element.id}\n role='option'\n id={element.id.toString()}\n status={status}\n onClick={e => {\n const mouseClick = e.detail !== 0;\n\n if (!readOnly && !disabled && !mouseClick) {\n handleSelectedRemoval(element.id, idx);\n }\n }}\n onRemove={() => {\n if (!readOnly && !disabled) {\n handleSelectedRemoval(element.id, idx);\n }\n }}\n onKeyDown={(e: KeyboardEvent<Element>) => {\n // prevent browser's Back on FF\n if (e.key === 'Backspace') e.preventDefault();\n }}\n tabIndex='-1'\n aria-label={`${t('remove')} ${element.text}`}\n aria-describedby={ariaDescribedBy}\n >\n {element.text}\n </Selectable>\n );\n })}\n </ul>\n )}\n <Flex\n item={{ grow: 1 }}\n as='input'\n size={1}\n ref={inputRef}\n value={value}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n onKeyDown={onInputKeyDown}\n readOnly={readOnly || !onChange}\n disabled={disabled}\n placeholder={selected?.length ? undefined : placeholder}\n autoComplete='off'\n autoFocus={autoFocus}\n aria-controls={!pauseDescendantEvaluation ? id : ariaControls}\n {...restProps}\n required={undefined}\n />\n </Flex>\n {actions}\n\n <VisuallyHiddenText id={`${id}-inputDescription`}>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`}>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n </Flex>\n );\n }\n);\n\nexport default MultiSelectInput;\n"]}
1
+ {"version":3,"file":"MultiSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/MultiSelectInput/MultiSelectInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n forwardRef,\n Ref,\n PropsWithoutRef,\n KeyboardEvent,\n useRef,\n useCallback,\n useMemo,\n useState,\n useEffect,\n MouseEvent\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport { ForwardProps } from '../../../types';\nimport { defaultThemeProp } from '../../../theme';\nimport Selectable, { StyledSelectable } from '../../Badges/Selection';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport {\n useConsolidatedRef,\n useActiveDescendant,\n useDirection,\n useI18n,\n useUID\n} from '../../../hooks';\nimport { cap, tryCatch } from '../../../utils';\nimport { StyledBareButton } from '../../Button/BareButton';\nimport VisuallyHiddenText from '../../VisuallyHiddenText';\nimport { StyledSelectInput } from '../ComboBox.styles';\n\nimport { MultiSelectInputProps } from './MultiSelectInput.types';\n\nexport const StyledMultiSelectInput = styled(StyledSelectInput)(({ theme }) => {\n const { background } = theme.components.badges.selectable.base;\n const { 'foreground-color': foreground } = theme.base.palette;\n const boxShadowColor = tryCatch(() => transparentize(0.45, foreground));\n\n return css`\n cursor: text;\n\n ul {\n list-style: none;\n display: contents;\n\n &[data-active-scope='true'] ${StyledSelectable}[data-current='true'] {\n color: ${theme.base.palette.interactive};\n box-shadow: 0 0 0.5rem -0.125rem ${boxShadowColor}, inset 0 0 0 0.125rem ${background};\n outline: none;\n\n ${StyledBareButton} {\n color: ${theme.base.palette.interactive};\n }\n }\n }\n\n input {\n width: 8ch;\n height: 1.125rem;\n }\n `;\n});\n\nStyledMultiSelectInput.defaultProps = defaultThemeProp;\n\nconst MultiSelectInput: FunctionComponent<MultiSelectInputProps & ForwardProps> = forwardRef(\n function MultiSelectInput(\n props: PropsWithoutRef<MultiSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n selected = [],\n value,\n onRemove,\n onChange,\n onKeyDown,\n onResolveSuggestion,\n actions,\n readOnly,\n disabled,\n status,\n placeholder,\n autoFocus,\n pauseDescendantEvaluation,\n onSelectedFocus,\n onSelectedBlur,\n 'aria-controls': ariaControls,\n ...restProps\n } = props;\n const t = useI18n();\n const id = useUID();\n\n const inputRef = useConsolidatedRef<HTMLInputElement>(ref);\n const listRef = useRef<HTMLUListElement>(null);\n const [focusDescendant, setFocusDescendant] = useState<HTMLElement | null>(null);\n const [activeItemId, setActiveItemId] = useState<string | null>(null);\n const { start, end } = useDirection();\n\n const uadConfig = useMemo(\n () => ({\n focusEl: inputRef.current,\n scope: listRef.current,\n selector: 'li[role=\"option\"]',\n orientation: 'horizontal' as const,\n focusReturnEl: focusDescendant,\n clearFocusReturn: () => {\n setFocusDescendant(null);\n },\n pauseDescendantEvaluation,\n onClick: (el: HTMLElement) => {\n el.click();\n }\n }),\n [pauseDescendantEvaluation, selected, focusDescendant]\n );\n\n const { activeDescendant } = useActiveDescendant(uadConfig, [selected]);\n\n const handleSelectedRemoval = useCallback(\n (selectionId, idx) => {\n if (!pauseDescendantEvaluation) {\n if (idx === selected.length - 1) {\n // If removing last selected item\n if (selected.length > 1) {\n // If other selected items, focus previous\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx - 1] as HTMLElement) ||\n null\n );\n } else {\n // Blur selected if final only item removed\n onSelectedBlur?.();\n }\n } else if (selected.length > 1) {\n // If not last item removed and other selected items, focus next\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[idx + 1] as HTMLElement) ||\n null\n );\n }\n }\n onRemove?.(selectionId, idx);\n inputRef.current?.focus();\n },\n [selected, onRemove, onSelectedBlur, uadConfig]\n );\n\n useEffect(() => {\n // Maintain active item & prev. val only as it changes.\n if (activeDescendant?.id && activeDescendant.id !== activeItemId) {\n setActiveItemId(activeDescendant.id);\n }\n }, [activeDescendant]);\n\n const onInputKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (selected.length && inputRef.current?.selectionStart === 0) {\n const lastIndex = selected.length - 1;\n if (pauseDescendantEvaluation && e.key === `Arrow${cap(start)}`) {\n setFocusDescendant(\n (listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex] as HTMLElement) ||\n null\n );\n onSelectedFocus?.();\n }\n\n const lastSelectableId = listRef.current?.querySelectorAll(uadConfig.selector)[lastIndex]\n ?.id;\n const onLastItem = activeItemId === lastSelectableId;\n\n if (\n !pauseDescendantEvaluation &&\n ((onLastItem && e.key === `Arrow${cap(end)}`) || e.key === 'ArrowDown')\n ) {\n onSelectedBlur?.();\n }\n\n if (['Backspace', 'Delete'].includes(e.key) && !(readOnly || disabled)) {\n handleSelectedRemoval(selected[lastIndex].id, lastIndex);\n }\n }\n onKeyDown?.(e);\n },\n [\n pauseDescendantEvaluation,\n activeItemId,\n onKeyDown,\n handleSelectedRemoval,\n selected,\n readOnly,\n disabled\n ]\n );\n\n const ariaDescribedBy = useMemo(() => {\n return onChange\n ? `${id}-inputDescription ${id}-searchDescription`\n : `${id}-inputDescription`;\n }, [id]);\n\n return (\n <Flex\n as={StyledMultiSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', justify: 'between' }}\n readOnly={readOnly}\n disabled={disabled}\n status={status}\n >\n <Flex\n container={{ alignContent: 'center', wrap: 'wrap', rowGap: 0.5, colGap: 0.25, pad: 0.25 }}\n item={{ grow: 1 }}\n onClick={(e: MouseEvent<HTMLDivElement>) => {\n if (\n e.target instanceof HTMLElement &&\n !e.currentTarget.contains(e.target.closest('li'))\n ) {\n inputRef.current?.focus();\n inputRef.current?.click();\n }\n }}\n >\n {selected.length > 0 && (\n <ul ref={listRef} id={id} role='listbox' aria-label={t('selected_items')}>\n {selected.map((element, idx) => {\n return (\n <Selectable\n as='li'\n key={element.id}\n role='option'\n id={element.id.toString()}\n status={status}\n onClick={e => {\n const mouseClick = e.detail !== 0;\n\n if (!readOnly && !disabled && !mouseClick) {\n handleSelectedRemoval(element.id, idx);\n }\n }}\n onRemove={() => {\n if (!readOnly && !disabled) {\n handleSelectedRemoval(element.id, idx);\n }\n }}\n onKeyDown={(e: KeyboardEvent<Element>) => {\n // prevent browser's Back on FF\n if (e.key === 'Backspace') e.preventDefault();\n }}\n tabIndex='-1'\n aria-label={`${t('remove')} ${element.text}`}\n aria-describedby={ariaDescribedBy}\n >\n {element.text}\n </Selectable>\n );\n })}\n </ul>\n )}\n <Flex\n item={{ grow: 1 }}\n as='input'\n size={1}\n ref={inputRef}\n value={value}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n onKeyDown={onInputKeyDown}\n readOnly={readOnly || !onChange}\n disabled={disabled}\n placeholder={selected?.length ? undefined : placeholder}\n autoComplete='off'\n autoFocus={autoFocus}\n aria-controls={!pauseDescendantEvaluation ? id : ariaControls}\n {...restProps}\n required={undefined}\n />\n </Flex>\n {actions}\n\n <VisuallyHiddenText id={`${id}-inputDescription`}>\n {`${t('combobox_open_close')} `}\n </VisuallyHiddenText>\n <VisuallyHiddenText id={`${id}-searchDescription`}>\n {t('combobox_search_instructions')}\n </VisuallyHiddenText>\n </Flex>\n );\n }\n);\n\nexport default MultiSelectInput;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"SingleSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAO5E,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,OAAO,sBAAsB,MAAM,2BAA2B,CAAC;AAE/D,eAAO,MAAM,uBAAuB,yGAA8B,CAAC;AAuBnE,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CA6D/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
1
+ {"version":3,"file":"SingleSelectInput.d.ts","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAc,iBAAiB,EAAwB,MAAM,OAAO,CAAC;AAO5E,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C,OAAO,sBAAsB,MAAM,2BAA2B,CAAC;AAE/D,eAAO,MAAM,uBAAuB,yGAA8B,CAAC;AAuBnE,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC,sBAAsB,GAAG,YAAY,CAuD/E,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
@@ -20,18 +20,10 @@ StyledVisualContainer.defaultProps = defaultThemeProp;
20
20
  const SingleSelectInput = forwardRef(function SingleSelectInput(props, ref) {
21
21
  const { value, readOnly, disabled, status, actions, onChange, onResolveSuggestion, selected, visual, ...restProps } = props;
22
22
  const inputRef = useConsolidatedRef(ref);
23
- return (_jsxs(Flex, { as: StyledSingleSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, ...{
24
- disabled,
25
- status,
26
- readOnly
27
- }, children: [visual && (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, as: StyledVisualContainer, onClick: () => {
23
+ return (_jsxs(Flex, { as: StyledSingleSelectInput, forwardedAs: StyledFormControl, hasSuggestion: status === 'pending' && !!onResolveSuggestion, container: { alignItems: 'center', wrap: 'nowrap' }, disabled: disabled, status: status, readOnly: readOnly, children: [visual && (_jsx(Flex, { container: { justify: 'center', alignItems: 'center' }, as: StyledVisualContainer, onClick: () => {
28
24
  inputRef.current?.focus();
29
25
  inputRef.current?.click();
30
- }, children: visual })), _jsx("input", { ...{
31
- disabled,
32
- status,
33
- readOnly
34
- }, size: 1, value: value || selected?.text || '',
26
+ }, children: visual })), _jsx("input", { disabled: disabled, size: 1, value: value || selected?.text || '',
35
27
  // no-op avoids react uncontrolled warning
36
28
  onChange: onChange || (() => { }), readOnly: readOnly || !onChange, autoComplete: 'off', ...restProps, ref: inputRef }), actions] }));
37
29
  });
@@ -1 +1 @@
1
- {"version":3,"file":"SingleSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAC5E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAIvD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAA,EAAE,CAAC;AAEnE,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;IAChD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,cAAc,EAAE,WAAW,EAC3B,KAAK,EAAE,EAAE,MAAM,EAAE,EAClB,EACF,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;yBACa,WAAW,CAAC,cAAc,CAAC,UAAU,WAAW,CAAC,cAAc,CAAC;sBACnE,MAAM,MAAM,WAAW,CAAC,cAAc,CAAC;4BACjC,IAAI,CAAC,OAAO;mBACrB,MAAM,UAAU,WAAW,CAAC,cAAc,CAAC;GAC3D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,iBAAiB,GAA6D,UAAU,CAC5F,SAAS,iBAAiB,CACxB,KAA8C,EAC9C,GAA0B;IAE1B,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,OAAO,EACP,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,MAAM,EACN,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,uBAAuB,EAC3B,WAAW,EAAE,iBAAiB,EAC9B,aAAa,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,mBAAmB,EAC5D,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,KAC/C;YACF,QAAQ;YACR,MAAM;YACN,QAAQ;SACT,aAEA,MAAM,IAAI,CACT,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EACtD,EAAE,EAAE,qBAAqB,EACzB,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;oBAC1B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBAC5B,CAAC,YAEA,MAAM,GACF,CACR,EACD,mBACM;oBACF,QAAQ;oBACR,MAAM;oBACN,QAAQ;iBACT,EACD,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,KAAK,IAAI,QAAQ,EAAE,IAAI,IAAI,EAAE;gBACpC,0CAA0C;gBAC1C,QAAQ,EAAE,QAAQ,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,EAChC,QAAQ,EAAE,QAAQ,IAAI,CAAC,QAAQ,EAC/B,YAAY,EAAC,KAAK,KACd,SAAS,EACb,GAAG,EAAE,QAAQ,GACb,EACD,OAAO,IACH,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef } from '../../../hooks';\nimport { defaultThemeProp } from '../../../theme';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport { ForwardProps } from '../../../types';\nimport { StyledSelectInput } from '../ComboBox.styles';\n\nimport SingleSelectInputProps from './SingleSelectInput.types';\n\nexport const StyledSingleSelectInput = styled(StyledSelectInput)``;\n\nconst StyledVisualContainer = styled.span(props => {\n const {\n theme: {\n base,\n components: {\n 'form-control': formControl,\n input: { height }\n }\n }\n } = props;\n\n return css`\n border-inline-end: ${formControl['border-width']} solid ${formControl['border-color']};\n min-width: calc(${height} - ${formControl['border-width']});\n padding: 0 calc(0.5 * ${base.spacing});\n height: calc(${height} - 2 * ${formControl['border-width']});\n `;\n});\n\nStyledVisualContainer.defaultProps = defaultThemeProp;\n\nconst SingleSelectInput: FunctionComponent<SingleSelectInputProps & ForwardProps> = forwardRef(\n function SingleSelectInput(\n props: PropsWithoutRef<SingleSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n value,\n readOnly,\n disabled,\n status,\n actions,\n onChange,\n onResolveSuggestion,\n selected,\n visual,\n ...restProps\n } = props;\n const inputRef = useConsolidatedRef(ref);\n return (\n <Flex\n as={StyledSingleSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n {...{\n disabled,\n status,\n readOnly\n }}\n >\n {visual && (\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n as={StyledVisualContainer}\n onClick={() => {\n inputRef.current?.focus();\n inputRef.current?.click();\n }}\n >\n {visual}\n </Flex>\n )}\n <input\n {...{\n disabled,\n status,\n readOnly\n }}\n size={1}\n value={value || selected?.text || ''}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n readOnly={readOnly || !onChange}\n autoComplete='off'\n {...restProps}\n ref={inputRef}\n />\n {actions}\n </Flex>\n );\n }\n);\n\nexport default SingleSelectInput;\n"]}
1
+ {"version":3,"file":"SingleSelectInput.js","sourceRoot":"","sources":["../../../../src/components/ComboBox/SingleSelectInput/SingleSelectInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAA2C,MAAM,OAAO,CAAC;AAC5E,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AACtD,OAAO,IAAI,MAAM,YAAY,CAAC;AAE9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,oBAAoB,CAAC;AAIvD,MAAM,CAAC,MAAM,uBAAuB,GAAG,MAAM,CAAC,iBAAiB,CAAC,CAAA,EAAE,CAAC;AAEnE,MAAM,qBAAqB,GAAG,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE;IAChD,MAAM,EACJ,KAAK,EAAE,EACL,IAAI,EACJ,UAAU,EAAE,EACV,cAAc,EAAE,WAAW,EAC3B,KAAK,EAAE,EAAE,MAAM,EAAE,EAClB,EACF,EACF,GAAG,KAAK,CAAC;IAEV,OAAO,GAAG,CAAA;yBACa,WAAW,CAAC,cAAc,CAAC,UAAU,WAAW,CAAC,cAAc,CAAC;sBACnE,MAAM,MAAM,WAAW,CAAC,cAAc,CAAC;4BACjC,IAAI,CAAC,OAAO;mBACrB,MAAM,UAAU,WAAW,CAAC,cAAc,CAAC;GAC3D,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,qBAAqB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEtD,MAAM,iBAAiB,GAA6D,UAAU,CAC5F,SAAS,iBAAiB,CACxB,KAA8C,EAC9C,GAA0B;IAE1B,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,MAAM,EACN,OAAO,EACP,QAAQ,EACR,mBAAmB,EACnB,QAAQ,EACR,MAAM,EACN,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IACV,MAAM,QAAQ,GAAG,kBAAkB,CAAC,GAAG,CAAC,CAAC;IACzC,OAAO,CACL,MAAC,IAAI,IACH,EAAE,EAAE,uBAAuB,EAC3B,WAAW,EAAE,iBAAiB,EAC9B,aAAa,EAAE,MAAM,KAAK,SAAS,IAAI,CAAC,CAAC,mBAAmB,EAC5D,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EACnD,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,aAEjB,MAAM,IAAI,CACT,KAAC,IAAI,IACH,SAAS,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,UAAU,EAAE,QAAQ,EAAE,EACtD,EAAE,EAAE,qBAAqB,EACzB,OAAO,EAAE,GAAG,EAAE;oBACZ,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;oBAC1B,QAAQ,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC;gBAC5B,CAAC,YAEA,MAAM,GACF,CACR,EACD,gBACE,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,CAAC,EACP,KAAK,EAAE,KAAK,IAAI,QAAQ,EAAE,IAAI,IAAI,EAAE;gBACpC,0CAA0C;gBAC1C,QAAQ,EAAE,QAAQ,IAAI,CAAC,GAAG,EAAE,GAAE,CAAC,CAAC,EAChC,QAAQ,EAAE,QAAQ,IAAI,CAAC,QAAQ,EAC/B,YAAY,EAAC,KAAK,KACd,SAAS,EACb,GAAG,EAAE,QAAQ,GACb,EACD,OAAO,IACH,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["import { forwardRef, FunctionComponent, PropsWithoutRef, Ref } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useConsolidatedRef } from '../../../hooks';\nimport { defaultThemeProp } from '../../../theme';\nimport { StyledFormControl } from '../../FormControl';\nimport Flex from '../../Flex';\nimport { ForwardProps } from '../../../types';\nimport { StyledSelectInput } from '../ComboBox.styles';\n\nimport SingleSelectInputProps from './SingleSelectInput.types';\n\nexport const StyledSingleSelectInput = styled(StyledSelectInput)``;\n\nconst StyledVisualContainer = styled.span(props => {\n const {\n theme: {\n base,\n components: {\n 'form-control': formControl,\n input: { height }\n }\n }\n } = props;\n\n return css`\n border-inline-end: ${formControl['border-width']} solid ${formControl['border-color']};\n min-width: calc(${height} - ${formControl['border-width']});\n padding: 0 calc(0.5 * ${base.spacing});\n height: calc(${height} - 2 * ${formControl['border-width']});\n `;\n});\n\nStyledVisualContainer.defaultProps = defaultThemeProp;\n\nconst SingleSelectInput: FunctionComponent<SingleSelectInputProps & ForwardProps> = forwardRef(\n function SingleSelectInput(\n props: PropsWithoutRef<SingleSelectInputProps>,\n ref: Ref<HTMLInputElement>\n ) {\n const {\n value,\n readOnly,\n disabled,\n status,\n actions,\n onChange,\n onResolveSuggestion,\n selected,\n visual,\n ...restProps\n } = props;\n const inputRef = useConsolidatedRef(ref);\n return (\n <Flex\n as={StyledSingleSelectInput}\n forwardedAs={StyledFormControl}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n disabled={disabled}\n status={status}\n readOnly={readOnly}\n >\n {visual && (\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n as={StyledVisualContainer}\n onClick={() => {\n inputRef.current?.focus();\n inputRef.current?.click();\n }}\n >\n {visual}\n </Flex>\n )}\n <input\n disabled={disabled}\n size={1}\n value={value || selected?.text || ''}\n // no-op avoids react uncontrolled warning\n onChange={onChange || (() => {})}\n readOnly={readOnly || !onChange}\n autoComplete='off'\n {...restProps}\n ref={inputRef}\n />\n {actions}\n </Flex>\n );\n }\n);\n\nexport default SingleSelectInput;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqB3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;;;;AAiJ7D,wBAAqE"}
1
+ {"version":3,"file":"CompositeInput.d.ts","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAqB3C,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;;;;AA+I7D,wBAAqE"}
@@ -52,18 +52,7 @@ const CompositeInput = forwardRef(function CompositeInput(props, ref) {
52
52
  text: t('apply'),
53
53
  handler: () => onApply({ close: closePopover })
54
54
  }, children: _jsx(Flex, { container: { direction: 'column' }, ref: formContentRef, children: _jsx(Renderer, { ...rendererProps }) }) }))] }));
55
- return label ? (_jsx(FormField, { ...{
56
- testId: testIds,
57
- label,
58
- labelHidden,
59
- id,
60
- info,
61
- status,
62
- required,
63
- disabled,
64
- labelId,
65
- additionalInfo
66
- }, children: Comp })) : (Comp);
55
+ return label ? (_jsx(FormField, { testId: testIds, label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, labelId: labelId, additionalInfo: additionalInfo, children: Comp })) : (Comp);
67
56
  });
68
57
  export default withTestIds(CompositeInput, getCompositeInputTestIds);
69
58
  //# sourceMappingURL=CompositeInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, useEffect, useRef, useState } from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useElement,\n useI18n,\n useOuterEvent,\n useTestIds,\n useUID\n} from '../../hooks';\nimport { StyledFormControl } from '../FormControl';\nimport { getFocusables, withTestIds } from '../../utils';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport FormField from '../FormField';\nimport { FormDialog } from '../Dialog';\n\nimport {\n StyledCompositeInput,\n StyledInputButton,\n StyledInputContainer\n} from './CompositeInput.styles';\nimport { CompositeInputProps } from './CompositeInput.types';\nimport { getCompositeInputTestIds } from './CompositeInput.test-ids';\n\nregisterIcon(caretDownIcon, timesIcon);\n\nconst CompositeInput = forwardRef(function CompositeInput(\n props: PropsWithoutRef<CompositeInputProps>,\n ref: CompositeInputProps['ref']\n) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n disabled,\n value,\n onClear,\n required,\n status,\n info,\n label,\n labelHidden,\n additionalInfo,\n dialog: { renderer: Renderer, rendererProps, onApply, onCancel },\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getCompositeInputTestIds);\n const t = useI18n();\n\n const [open, setOpen] = useState(false);\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref);\n const buttonRef = useRef<HTMLInputElement>(null);\n const formContentRef = useRef<HTMLElement>(null);\n\n const closePopover = () => {\n setOpen(false);\n buttonRef.current?.focus();\n };\n\n useOuterEvent('mousedown', [popoverEl, buttonRef], () => {\n if (open) onCancel({ close: closePopover });\n });\n\n useEffect(() => {\n if (open) {\n getFocusables(formContentRef)[0]?.focus();\n }\n }, [open, formContentRef.current]);\n\n const labelId = `${id}-label`;\n\n const Comp = (\n <Flex\n as={StyledCompositeInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center' }}\n status={status}\n disabled={disabled}\n ref={containerRef}\n >\n <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }} as={StyledInputContainer}>\n <StyledInputButton\n data-testid={testIds.control}\n {...restProps}\n id={id}\n disabled={disabled}\n aria-haspopup='dialog'\n aria-expanded={!disabled && open}\n aria-describedby={info ? `${id}-info` : undefined}\n readOnly\n required={required}\n onClick={() => {\n if (!disabled) {\n setOpen(true);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'Enter') {\n e.preventDefault();\n setOpen(true);\n }\n }}\n value={value ?? ''}\n ref={buttonRef}\n />\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ pointerEvents: value ? '' : 'none' }}\n >\n {value && !open ? (\n <Button icon compact variant='simple' label={t('clear')} onClick={onClear}>\n <Icon name='times' />\n </Button>\n ) : (\n <Icon name='caret-down' />\n )}\n </Flex>\n </Flex>\n\n {open && containerRef.current && (\n <FormDialog\n arrow={false}\n // FIXME: The wrath of optional labels, as a ReactNode, strikes again...\n ariaLabel={label as string}\n ref={setPopoverEl}\n target={containerRef.current}\n placement='bottom-start'\n onCancel={() => onCancel({ close: closePopover })}\n onSubmit={{\n text: t('apply'),\n handler: () => onApply({ close: closePopover })\n }}\n >\n <Flex container={{ direction: 'column' }} ref={formContentRef}>\n <Renderer {...rendererProps} />\n </Flex>\n </FormDialog>\n )}\n </Flex>\n );\n\n return label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n labelId,\n additionalInfo\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n}) as <P extends object>(props: CompositeInputProps<P> & ForwardProps) => JSX.Element | null;\n\nexport default withTestIds(CompositeInput, getCompositeInputTestIds);\n"]}
1
+ {"version":3,"file":"CompositeInput.js","sourceRoot":"","sources":["../../../src/components/CompositeInput/CompositeInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import { forwardRef, PropsWithoutRef, useEffect, useRef, useState } from 'react';\n\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretDownIcon from '../Icon/icons/caret-down.icon';\nimport * as timesIcon from '../Icon/icons/times.icon';\nimport { ForwardProps } from '../../types';\nimport {\n useConsolidatedRef,\n useElement,\n useI18n,\n useOuterEvent,\n useTestIds,\n useUID\n} from '../../hooks';\nimport { StyledFormControl } from '../FormControl';\nimport { getFocusables, withTestIds } from '../../utils';\nimport Flex from '../Flex';\nimport Button from '../Button';\nimport FormField from '../FormField';\nimport { FormDialog } from '../Dialog';\n\nimport {\n StyledCompositeInput,\n StyledInputButton,\n StyledInputContainer\n} from './CompositeInput.styles';\nimport { CompositeInputProps } from './CompositeInput.types';\nimport { getCompositeInputTestIds } from './CompositeInput.test-ids';\n\nregisterIcon(caretDownIcon, timesIcon);\n\nconst CompositeInput = forwardRef(function CompositeInput(\n props: PropsWithoutRef<CompositeInputProps>,\n ref: CompositeInputProps['ref']\n) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n disabled,\n value,\n onClear,\n required,\n status,\n info,\n label,\n labelHidden,\n additionalInfo,\n dialog: { renderer: Renderer, rendererProps, onApply, onCancel },\n ...restProps\n } = props;\n\n const testIds = useTestIds(testId, getCompositeInputTestIds);\n const t = useI18n();\n\n const [open, setOpen] = useState(false);\n\n const [popoverEl, setPopoverEl] = useElement<HTMLElement>(null);\n const containerRef = useConsolidatedRef<HTMLDivElement>(ref);\n const buttonRef = useRef<HTMLInputElement>(null);\n const formContentRef = useRef<HTMLElement>(null);\n\n const closePopover = () => {\n setOpen(false);\n buttonRef.current?.focus();\n };\n\n useOuterEvent('mousedown', [popoverEl, buttonRef], () => {\n if (open) onCancel({ close: closePopover });\n });\n\n useEffect(() => {\n if (open) {\n getFocusables(formContentRef)[0]?.focus();\n }\n }, [open, formContentRef.current]);\n\n const labelId = `${id}-label`;\n\n const Comp = (\n <Flex\n as={StyledCompositeInput}\n forwardedAs={StyledFormControl}\n container={{ alignItems: 'center' }}\n status={status}\n disabled={disabled}\n ref={containerRef}\n >\n <Flex container={{ alignItems: 'center' }} item={{ grow: 1 }} as={StyledInputContainer}>\n <StyledInputButton\n data-testid={testIds.control}\n {...restProps}\n id={id}\n disabled={disabled}\n aria-haspopup='dialog'\n aria-expanded={!disabled && open}\n aria-describedby={info ? `${id}-info` : undefined}\n readOnly\n required={required}\n onClick={() => {\n if (!disabled) {\n setOpen(true);\n }\n }}\n onKeyDown={e => {\n if (e.key === 'Enter') {\n e.preventDefault();\n setOpen(true);\n }\n }}\n value={value ?? ''}\n ref={buttonRef}\n />\n <Flex\n container={{ justify: 'center', alignItems: 'center' }}\n style={{ pointerEvents: value ? '' : 'none' }}\n >\n {value && !open ? (\n <Button icon compact variant='simple' label={t('clear')} onClick={onClear}>\n <Icon name='times' />\n </Button>\n ) : (\n <Icon name='caret-down' />\n )}\n </Flex>\n </Flex>\n\n {open && containerRef.current && (\n <FormDialog\n arrow={false}\n // FIXME: The wrath of optional labels, as a ReactNode, strikes again...\n ariaLabel={label as string}\n ref={setPopoverEl}\n target={containerRef.current}\n placement='bottom-start'\n onCancel={() => onCancel({ close: closePopover })}\n onSubmit={{\n text: t('apply'),\n handler: () => onApply({ close: closePopover })\n }}\n >\n <Flex container={{ direction: 'column' }} ref={formContentRef}>\n <Renderer {...rendererProps} />\n </Flex>\n </FormDialog>\n )}\n </Flex>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n labelId={labelId}\n additionalInfo={additionalInfo}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n}) as <P extends object>(props: CompositeInputProps<P> & ForwardProps) => JSX.Element | null;\n\nexport default withTestIds(CompositeInput, getCompositeInputTestIds);\n"]}
@@ -1,7 +1,9 @@
1
1
  import { FunctionComponent, ReactNode, Context, MutableRefObject } from 'react';
2
+ import { createPortal } from 'react-dom';
3
+ import type { StyleSheetManagerProps } from 'styled-components';
4
+ import '../../init';
2
5
  import { ThemeMachineLike, DefaultSettableTheme, DefaultThemeDefinition } from '../../theme';
3
6
  import { Translation, TranslationPack } from '../../i18n';
4
- import '../../init';
5
7
  export interface ConfigurationProps {
6
8
  /** Any components or nodes that should be impacted by the settings applied by this Configuration component. */
7
9
  children: ReactNode;
@@ -15,10 +17,18 @@ export interface ConfigurationProps {
15
17
  theme?: DefaultSettableTheme;
16
18
  /** Disables loading Open Sans or Inter from Google Fonts. Only takes effect on the root configuration. */
17
19
  disableDefaultFontLoading?: boolean;
18
- /** Target element for loading styles related to `styled-components`. */
19
- styleSheetTarget?: HTMLElement;
20
- /** Target element for rendering a `ReactDOM` portal. */
21
- portalTarget?: Element;
20
+ /** List of style sheets to inject in style sheet target. */
21
+ styleSheets?: string[];
22
+ /**
23
+ * Target element for loading styles related to `styled-components`.
24
+ * @deprecated
25
+ */
26
+ styleSheetTarget?: StyleSheetManagerProps['target'];
27
+ /**
28
+ * Target element for rendering a `ReactDOM` portal.
29
+ * @deprecated
30
+ */
31
+ portalTarget?: Parameters<typeof createPortal>[1];
22
32
  /**
23
33
  * Use native HTML5 controls for inputs instead of rich ones.
24
34
  * @default false
@@ -34,14 +44,14 @@ export interface ConfigurationProps {
34
44
  }
35
45
  export interface ConfigurationContextValue {
36
46
  locale: string;
37
- direction: ConfigurationProps['direction'];
47
+ direction: NonNullable<ConfigurationProps['direction']>;
38
48
  translations: TranslationPack;
39
49
  themeMachine: ThemeMachineLike<DefaultThemeDefinition>;
40
- styleSheetTarget?: HTMLElement;
41
- portalTarget?: Element;
50
+ styleSheetTarget: ConfigurationProps['styleSheetTarget'];
51
+ portalTarget: ConfigurationProps['portalTarget'];
42
52
  loadedRef: MutableRefObject<boolean>;
43
53
  renderNativeControls: boolean;
44
- testIds?: ConfigurationProps['testIds'];
54
+ testIds: NonNullable<ConfigurationProps['testIds']>;
45
55
  /** @internal */
46
56
  initialized: boolean;
47
57
  }
@@ -1 +1 @@
1
- {"version":3,"file":"Configuration.d.ts","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EACjB,SAAS,EAIT,OAAO,EACP,gBAAgB,EACjB,MAAM,OAAO,CAAC;AAKf,OAAO,EAEL,gBAAgB,EAEhB,oBAAoB,EACpB,sBAAsB,EACvB,MAAM,aAAa,CAAC;AACrB,OAAO,EAEL,WAAW,EACX,eAAe,EAGhB,MAAM,YAAY,CAAC;AAGpB,OAAO,YAAY,CAAC;AAEpB,MAAM,WAAW,kBAAkB;IACjC,+GAA+G;IAC/G,QAAQ,EAAE,SAAS,CAAC;IACpB,6FAA6F;IAC7F,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,2GAA2G;IAC3G,SAAS,CAAC,EAAE,KAAK,GAAG,KAAK,CAAC;IAC1B,0CAA0C;IAC1C,YAAY,CAAC,EAAE,WAAW,CAAC;IAC3B,wEAAwE;IACxE,KAAK,CAAC,EAAE,oBAAoB,CAAC;IAC7B,0GAA0G;IAC1G,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,wEAAwE;IACxE,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,wDAAwD;IACxD,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B,sDAAsD;IACtD,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,WAAW,yBAAyB;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,kBAAkB,CAAC,WAAW,CAAC,CAAC;IAC3C,YAAY,EAAE,eAAe,CAAC;IAC9B,YAAY,EAAE,gBAAgB,CAAC,sBAAsB,CAAC,CAAC;IACvD,gBAAgB,CAAC,EAAE,WAAW,CAAC;IAC/B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,SAAS,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IACrC,oBAAoB,EAAE,OAAO,CAAC;IAC9B,OAAO,CAAC,EAAE,kBAAkB,CAAC,SAAS,CAAC,CAAC;IACxC,gBAAgB;IAChB,WAAW,EAAE,OAAO,CAAC;CACtB;AAID,eAAO,MAAM,oBAAoB,oCAW/B,CAAC;AAEH,QAAA,MAAM,aAAa,eAAiD,CAAC;AAErE,UAAU,mBAAmB;IAC3B,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,CAAC,aAAa,CAAC,CAAC,EAAE;YAChB,IAAI,EAAE,CAAC,QAAQ,EAAE,mBAAmB,KAAK,IAAI,CAAC;SAC/C,CAAC;KACH;CACF;AAID,UAAU,cAAe,SAAQ,mBAAmB;IAClD,cAAc,EAAE,MAAM,EAAE,CAAC;IACzB,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;CACpC;AA4BD,OAAO,QAAQ,YAAY,CAAC;IAC1B,UAAiB,aAAa;QAC5B,SAAS,CAAC,EAAE,CAAC,cAAc,GAAG,mBAAmB,CAAC,EAAE,CAAC;QACrD,oBAAoB,CAAC,EAAE,OAAO,CAAC,yBAAyB,CAAC,CAAC;KAC3D;CACF;AAuBD,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC,kBAAkB,CAiFxD,CAAC;AAEF,eAAe,aAAa,CAAC"}
1
+ {"version":3,"file":"Configuration.d.ts","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"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"}
@@ -1,13 +1,14 @@
1
1
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { createContext, useContext, useMemo, useState, useEffect } from 'react';
2
+ import { createContext, useContext, useMemo, useEffect } from 'react';
3
3
  import { createPortal } from 'react-dom';
4
- import { ThemeProvider, StyleSheetManager } from 'styled-components';
4
+ import styled, { ThemeProvider, StyleSheetManager } from 'styled-components';
5
+ import '../../init';
5
6
  import { GlobalStyle } from '../../styles';
6
7
  import { ThemeMachine, BaseThemeMachine } from '../../theme';
7
8
  import { createTranslationPack, DefaultTranslation, direction as directionOfLocale } from '../../i18n';
8
9
  import { windowIsAvailable, navigatorIsAvailable, documentIsAvailable } from '../../utils';
9
10
  import pkg from '../../../package.json';
10
- import '../../init';
11
+ import useElement from '../../hooks/useElement';
11
12
  const defaultLocale = navigatorIsAvailable ? navigator.language : 'en';
12
13
  export const ConfigurationContext = createContext({
13
14
  locale: defaultLocale,
@@ -60,7 +61,10 @@ if (windowIsAvailable) {
60
61
  };
61
62
  }
62
63
  }
63
- const Configuration = ({ children, locale, direction, translations: customTranslations, theme, disableDefaultFontLoading, styleSheetTarget, portalTarget, renderNativeControls, testIds, id }) => {
64
+ const StyledConfigurationWrapper = styled.div `
65
+ display: contents;
66
+ `;
67
+ const Configuration = ({ children, locale, direction, translations: customTranslations, theme, disableDefaultFontLoading, styleSheets: styleSheetURLs, styleSheetTarget, portalTarget, renderNativeControls, testIds, id }) => {
64
68
  const context = windowIsAvailable
65
69
  ? window.cosmos.configurationContext ?? ConfigurationContext
66
70
  : ConfigurationContext;
@@ -69,10 +73,27 @@ const Configuration = ({ children, locale, direction, translations: customTransl
69
73
  ? new ThemeMachine({ theme, parent: ctx.themeMachine })
70
74
  : ctx.themeMachine;
71
75
  const translations = useMemo(() => createTranslationPack({ ...ctx.translations, ...customTranslations }), [ctx.translations, customTranslations]);
72
- const [mounted, setMounted] = useState(false);
73
- useEffect(() => {
74
- setMounted(true);
75
- }, []);
76
+ const [wrapperEl, setWrapperEl] = useElement();
77
+ // Determine valid style sheet and portal target with ShadowDOM handling.
78
+ const [resolvedStyleSheetTarget, resolvedPortalTarget] = useMemo(() => {
79
+ // When rendering on the server, or before the wrapper is in the DOM, just bail.
80
+ if (!documentIsAvailable || !wrapperEl)
81
+ return [undefined, undefined];
82
+ const rootNode = wrapperEl.getRootNode();
83
+ // When within the ShadowDOM, the default target is the ShadowRoot, otherwise default to head/body element.
84
+ const defaultStyleSheetTarget = rootNode instanceof ShadowRoot ? rootNode : document.head;
85
+ const defaultPortalTarget = rootNode instanceof ShadowRoot ? rootNode : document.body;
86
+ // Currently passed prop or previous context value
87
+ const requestedStyleSheetTarget = styleSheetTarget ?? ctx.styleSheetTarget;
88
+ const requestedPortalTarget = portalTarget ?? ctx.portalTarget;
89
+ // If the "requested" target is within the root node, it is valid, so use that, otherwise fallback to the default.
90
+ return [
91
+ rootNode.contains(requestedStyleSheetTarget ?? null)
92
+ ? requestedStyleSheetTarget
93
+ : defaultStyleSheetTarget,
94
+ rootNode.contains(requestedPortalTarget ?? null) ? requestedPortalTarget : defaultPortalTarget
95
+ ];
96
+ }, [wrapperEl, styleSheetTarget, portalTarget, ctx.styleSheetTarget, ctx.portalTarget]);
76
97
  useEffect(() => {
77
98
  const sym = Symbol(id);
78
99
  mountConfig(sym);
@@ -80,26 +101,27 @@ const Configuration = ({ children, locale, direction, translations: customTransl
80
101
  unmountConfig(sym);
81
102
  };
82
103
  }, [id]);
83
- const wrappedChildren = ctx.initialized ? (children) : (_jsx(StyleSheetManager, { disableVendorPrefixes: true, target: styleSheetTarget ?? ctx.styleSheetTarget, children: _jsxs(_Fragment, { children: [!disableDefaultFontLoading &&
84
- mounted &&
85
- documentIsAvailable &&
86
- createPortal(_jsx("link", { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&family=Inter:wght@400..700&display=swap', "data-cosmos-global-style": true }), styleSheetTarget ?? ctx.styleSheetTarget ?? document.head), _jsx(GlobalStyle, {}), children] }) }));
87
- return (_jsx(context.Provider
88
- // eslint-disable-next-line react/jsx-no-constructed-context-values
89
- , {
104
+ const wrappedChildren = ctx.initialized ? (children) : (_jsx(StyleSheetManager, { disableVendorPrefixes: true, target: resolvedStyleSheetTarget, children: _jsxs(_Fragment, { children: [!disableDefaultFontLoading &&
105
+ resolvedStyleSheetTarget &&
106
+ createPortal(_jsx("link", { rel: 'stylesheet', href: 'https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&family=Inter:wght@400..700&display=swap', "data-cosmos-global-style": true }), resolvedStyleSheetTarget), _jsx(GlobalStyle, {}), children] }) }));
107
+ return (_jsx(StyledConfigurationWrapper, { ref: setWrapperEl, children: _jsx(context.Provider
90
108
  // eslint-disable-next-line react/jsx-no-constructed-context-values
91
- value: {
92
- locale: locale ?? ctx.locale,
93
- direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),
94
- translations,
95
- themeMachine,
96
- styleSheetTarget: styleSheetTarget ?? ctx.styleSheetTarget,
97
- portalTarget: portalTarget ?? ctx.portalTarget,
98
- loadedRef: ctx.loadedRef,
99
- renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,
100
- testIds: testIds ?? ctx.testIds,
101
- initialized: true
102
- }, children: _jsx(ThemeProvider, { theme: themeMachine.theme, children: wrappedChildren }) }));
109
+ , {
110
+ // eslint-disable-next-line react/jsx-no-constructed-context-values
111
+ value: {
112
+ locale: locale ?? ctx.locale,
113
+ direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),
114
+ translations,
115
+ themeMachine,
116
+ styleSheetTarget: resolvedStyleSheetTarget,
117
+ portalTarget: resolvedPortalTarget,
118
+ loadedRef: ctx.loadedRef,
119
+ renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,
120
+ testIds: testIds ?? ctx.testIds,
121
+ initialized: true
122
+ }, children: _jsxs(ThemeProvider, { theme: themeMachine.theme, children: [styleSheetURLs &&
123
+ resolvedStyleSheetTarget &&
124
+ createPortal(styleSheetURLs.map(url => (_jsx("link", { rel: 'stylesheet', href: url, "data-cosmos-global-style": true }, url))), resolvedStyleSheetTarget), wrappedChildren] }) }) }));
103
125
  };
104
126
  export default Configuration;
105
127
  //# sourceMappingURL=Configuration.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Configuration.js","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createContext,\n useContext,\n FunctionComponent,\n ReactNode,\n useMemo,\n useState,\n useEffect,\n Context,\n MutableRefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport { ThemeProvider, StyleSheetManager } from 'styled-components';\n\nimport { GlobalStyle } from '../../styles';\nimport {\n ThemeMachine,\n ThemeMachineLike,\n BaseThemeMachine,\n DefaultSettableTheme,\n DefaultThemeDefinition\n} from '../../theme';\nimport {\n createTranslationPack,\n Translation,\n TranslationPack,\n DefaultTranslation,\n direction as directionOfLocale\n} from '../../i18n';\nimport { windowIsAvailable, navigatorIsAvailable, documentIsAvailable } from '../../utils';\nimport pkg from '../../../package.json';\nimport '../../init';\n\nexport interface ConfigurationProps {\n /** Any components or nodes that should be impacted by the settings applied by this Configuration component. */\n children: ReactNode;\n /** User locale as defined in [BCP-47](https://www.techonthenet.com/js/language_tags.php). */\n locale?: string;\n /** Override rendering direction of the document. Direction will be based on the locale if now provided. */\n direction?: 'ltr' | 'rtl';\n /** Object with (partial) translations. */\n translations?: Translation;\n /** Theme object used to override any or all Cosmos theme properties. */\n theme?: DefaultSettableTheme;\n /** Disables loading Open Sans or Inter from Google Fonts. Only takes effect on the root configuration. */\n disableDefaultFontLoading?: boolean;\n /** Target element for loading styles related to `styled-components`. */\n styleSheetTarget?: HTMLElement;\n /** Target element for rendering a `ReactDOM` portal. */\n portalTarget?: Element;\n /**\n * Use native HTML5 controls for inputs instead of rich ones.\n * @default false\n */\n renderNativeControls?: boolean;\n /** String to identify this configuration instance. */\n id?: string;\n /**\n * Enable/disable testId attribute rendering for all components.\n * @default true\n */\n testIds?: boolean;\n}\n\nexport interface ConfigurationContextValue {\n locale: string;\n direction: ConfigurationProps['direction'];\n translations: TranslationPack;\n themeMachine: ThemeMachineLike<DefaultThemeDefinition>;\n styleSheetTarget?: HTMLElement;\n portalTarget?: Element;\n loadedRef: MutableRefObject<boolean>;\n renderNativeControls: boolean;\n testIds?: ConfigurationProps['testIds'];\n /** @internal */\n initialized: boolean;\n}\n\nconst defaultLocale = navigatorIsAvailable ? navigator.language : 'en';\n\nexport const ConfigurationContext = createContext<ConfigurationContextValue>({\n locale: defaultLocale,\n direction: directionOfLocale(defaultLocale),\n translations: DefaultTranslation,\n themeMachine: BaseThemeMachine,\n styleSheetTarget: documentIsAvailable ? document.head : undefined,\n portalTarget: documentIsAvailable ? document.body : undefined,\n loadedRef: { current: false },\n renderNativeControls: false,\n testIds: true,\n initialized: false\n});\n\nconst legacyMetaKey = Symbol.for('@pega/cosmos-react-core.metadata');\n\ninterface LegacyCosmosInstace {\n version: string;\n}\n\ndeclare global {\n interface Window {\n [legacyMetaKey]?: {\n push: (instance: LegacyCosmosInstace) => void;\n };\n }\n}\n\nconst mountedConfigs = new Set<symbol>();\n\ninterface CosmosInstance extends LegacyCosmosInstace {\n mountedConfigs: string[];\n mountOrder: string[];\n mountCount: Record<string, number>;\n}\n\nconst instance: CosmosInstance = {\n version: pkg.version,\n mountedConfigs: [],\n mountOrder: [],\n mountCount: {}\n};\n\nconst mountConfig = (sym: symbol) => {\n mountedConfigs.add(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n\n const description = sym.description ?? 'Unknown';\n\n instance.mountOrder.push(description);\n\n if (!(description in instance.mountCount)) {\n instance.mountCount[description] = 0;\n }\n instance.mountCount[description] += 1;\n};\n\nconst unmountConfig = (sym: symbol) => {\n mountedConfigs.delete(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n instances?: (CosmosInstance | LegacyCosmosInstace)[];\n configurationContext?: Context<ConfigurationContextValue>;\n }\n}\n\nif (windowIsAvailable) {\n if (!window.cosmos.instances) {\n window.cosmos.instances = [];\n }\n\n window.cosmos.instances.push(instance);\n\n if (Array.isArray(window[legacyMetaKey])) {\n window.cosmos.instances.push(...window[legacyMetaKey]);\n delete window[legacyMetaKey];\n }\n\n if (!window[legacyMetaKey]) {\n window[legacyMetaKey] = {\n push: inst => {\n window.cosmos.instances?.push(inst);\n }\n };\n }\n}\n\nconst Configuration: FunctionComponent<ConfigurationProps> = ({\n children,\n locale,\n direction,\n translations: customTranslations,\n theme,\n disableDefaultFontLoading,\n styleSheetTarget,\n portalTarget,\n renderNativeControls,\n testIds,\n id\n}: ConfigurationProps) => {\n const context = windowIsAvailable\n ? window.cosmos.configurationContext ?? ConfigurationContext\n : ConfigurationContext;\n const ctx = useContext(context);\n const themeMachine = theme\n ? new ThemeMachine<DefaultThemeDefinition>({ theme, parent: ctx.themeMachine })\n : ctx.themeMachine;\n const translations = useMemo(\n () => createTranslationPack({ ...ctx.translations, ...customTranslations }),\n [ctx.translations, customTranslations]\n );\n\n const [mounted, setMounted] = useState(false);\n\n useEffect(() => {\n setMounted(true);\n }, []);\n\n useEffect(() => {\n const sym = Symbol(id);\n mountConfig(sym);\n\n return () => {\n unmountConfig(sym);\n };\n }, [id]);\n\n const wrappedChildren = ctx.initialized ? (\n children\n ) : (\n <StyleSheetManager disableVendorPrefixes target={styleSheetTarget ?? ctx.styleSheetTarget}>\n <>\n {!disableDefaultFontLoading &&\n mounted &&\n documentIsAvailable &&\n createPortal(\n <link\n rel='stylesheet'\n href='https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&family=Inter:wght@400..700&display=swap'\n data-cosmos-global-style\n />,\n styleSheetTarget ?? ctx.styleSheetTarget ?? document.head\n )}\n <GlobalStyle />\n {children}\n </>\n </StyleSheetManager>\n );\n\n return (\n <context.Provider\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n value={{\n locale: locale ?? ctx.locale,\n direction: direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),\n translations,\n themeMachine,\n styleSheetTarget: styleSheetTarget ?? ctx.styleSheetTarget,\n portalTarget: portalTarget ?? ctx.portalTarget,\n loadedRef: ctx.loadedRef,\n renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,\n testIds: testIds ?? ctx.testIds,\n initialized: true\n }}\n >\n <ThemeProvider theme={themeMachine.theme}>{wrappedChildren}</ThemeProvider>\n </context.Provider>\n );\n};\n\nexport default Configuration;\n"]}
1
+ {"version":3,"file":"Configuration.js","sourceRoot":"","sources":["../../../src/components/Configuration/Configuration.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n createContext,\n useContext,\n FunctionComponent,\n ReactNode,\n useMemo,\n useEffect,\n Context,\n MutableRefObject\n} from 'react';\nimport { createPortal } from 'react-dom';\nimport styled, { ThemeProvider, StyleSheetManager } from 'styled-components';\nimport type { StyleSheetManagerProps } from 'styled-components';\n\nimport '../../init';\nimport { GlobalStyle } from '../../styles';\nimport {\n ThemeMachine,\n ThemeMachineLike,\n BaseThemeMachine,\n DefaultSettableTheme,\n DefaultThemeDefinition\n} from '../../theme';\nimport {\n createTranslationPack,\n Translation,\n TranslationPack,\n DefaultTranslation,\n direction as directionOfLocale\n} from '../../i18n';\nimport { windowIsAvailable, navigatorIsAvailable, documentIsAvailable } from '../../utils';\nimport pkg from '../../../package.json';\nimport useElement from '../../hooks/useElement';\n\nexport interface ConfigurationProps {\n /** Any components or nodes that should be impacted by the settings applied by this Configuration component. */\n children: ReactNode;\n /** User locale as defined in [BCP-47](https://www.techonthenet.com/js/language_tags.php). */\n locale?: string;\n /** Override rendering direction of the document. Direction will be based on the locale if now provided. */\n direction?: 'ltr' | 'rtl';\n /** Object with (partial) translations. */\n translations?: Translation;\n /** Theme object used to override any or all Cosmos theme properties. */\n theme?: DefaultSettableTheme;\n /** Disables loading Open Sans or Inter from Google Fonts. Only takes effect on the root configuration. */\n disableDefaultFontLoading?: boolean;\n /** List of style sheets to inject in style sheet target. */\n styleSheets?: string[];\n /**\n * Target element for loading styles related to `styled-components`.\n * @deprecated\n */\n styleSheetTarget?: StyleSheetManagerProps['target'];\n /**\n * Target element for rendering a `ReactDOM` portal.\n * @deprecated\n */\n portalTarget?: Parameters<typeof createPortal>[1];\n /**\n * Use native HTML5 controls for inputs instead of rich ones.\n * @default false\n */\n renderNativeControls?: boolean;\n /** String to identify this configuration instance. */\n id?: string;\n /**\n * Enable/disable testId attribute rendering for all components.\n * @default true\n */\n testIds?: boolean;\n}\n\nexport interface ConfigurationContextValue {\n locale: string;\n direction: NonNullable<ConfigurationProps['direction']>;\n translations: TranslationPack;\n themeMachine: ThemeMachineLike<DefaultThemeDefinition>;\n styleSheetTarget: ConfigurationProps['styleSheetTarget'];\n portalTarget: ConfigurationProps['portalTarget'];\n loadedRef: MutableRefObject<boolean>;\n renderNativeControls: boolean;\n testIds: NonNullable<ConfigurationProps['testIds']>;\n /** @internal */\n initialized: boolean;\n}\n\nconst defaultLocale = navigatorIsAvailable ? navigator.language : 'en';\n\nexport const ConfigurationContext = createContext<ConfigurationContextValue>({\n locale: defaultLocale,\n direction: directionOfLocale(defaultLocale),\n translations: DefaultTranslation,\n themeMachine: BaseThemeMachine,\n styleSheetTarget: documentIsAvailable ? document.head : undefined,\n portalTarget: documentIsAvailable ? document.body : undefined,\n loadedRef: { current: false },\n renderNativeControls: false,\n testIds: true,\n initialized: false\n});\n\nconst legacyMetaKey = Symbol.for('@pega/cosmos-react-core.metadata');\n\ninterface LegacyCosmosInstace {\n version: string;\n}\n\ndeclare global {\n interface Window {\n [legacyMetaKey]?: {\n push: (instance: LegacyCosmosInstace) => void;\n };\n }\n}\n\nconst mountedConfigs = new Set<symbol>();\n\ninterface CosmosInstance extends LegacyCosmosInstace {\n mountedConfigs: string[];\n mountOrder: string[];\n mountCount: Record<string, number>;\n}\n\nconst instance: CosmosInstance = {\n version: pkg.version,\n mountedConfigs: [],\n mountOrder: [],\n mountCount: {}\n};\n\nconst mountConfig = (sym: symbol) => {\n mountedConfigs.add(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n\n const description = sym.description ?? 'Unknown';\n\n instance.mountOrder.push(description);\n\n if (!(description in instance.mountCount)) {\n instance.mountCount[description] = 0;\n }\n instance.mountCount[description] += 1;\n};\n\nconst unmountConfig = (sym: symbol) => {\n mountedConfigs.delete(sym);\n instance.mountedConfigs = [...mountedConfigs].map(i => i.description ?? 'Unknown');\n};\n\ndeclare module '../../init' {\n export interface CosmosGlobals {\n instances?: (CosmosInstance | LegacyCosmosInstace)[];\n configurationContext?: Context<ConfigurationContextValue>;\n }\n}\n\nif (windowIsAvailable) {\n if (!window.cosmos.instances) {\n window.cosmos.instances = [];\n }\n\n window.cosmos.instances.push(instance);\n\n if (Array.isArray(window[legacyMetaKey])) {\n window.cosmos.instances.push(...window[legacyMetaKey]);\n delete window[legacyMetaKey];\n }\n\n if (!window[legacyMetaKey]) {\n window[legacyMetaKey] = {\n push: inst => {\n window.cosmos.instances?.push(inst);\n }\n };\n }\n}\n\nconst StyledConfigurationWrapper = styled.div`\n display: contents;\n`;\n\nconst Configuration: FunctionComponent<ConfigurationProps> = ({\n children,\n locale,\n direction,\n translations: customTranslations,\n theme,\n disableDefaultFontLoading,\n styleSheets: styleSheetURLs,\n styleSheetTarget,\n portalTarget,\n renderNativeControls,\n testIds,\n id\n}: ConfigurationProps) => {\n const context = windowIsAvailable\n ? window.cosmos.configurationContext ?? ConfigurationContext\n : ConfigurationContext;\n const ctx = useContext(context);\n const themeMachine = theme\n ? new ThemeMachine<DefaultThemeDefinition>({ theme, parent: ctx.themeMachine })\n : ctx.themeMachine;\n const translations = useMemo(\n () => createTranslationPack({ ...ctx.translations, ...customTranslations }),\n [ctx.translations, customTranslations]\n );\n\n const [wrapperEl, setWrapperEl] = useElement<HTMLDivElement>();\n\n // Determine valid style sheet and portal target with ShadowDOM handling.\n const [resolvedStyleSheetTarget, resolvedPortalTarget] = useMemo(() => {\n // When rendering on the server, or before the wrapper is in the DOM, just bail.\n if (!documentIsAvailable || !wrapperEl) return [undefined, undefined];\n\n const rootNode = wrapperEl.getRootNode();\n\n // When within the ShadowDOM, the default target is the ShadowRoot, otherwise default to head/body element.\n const defaultStyleSheetTarget = rootNode instanceof ShadowRoot ? rootNode : document.head;\n const defaultPortalTarget = rootNode instanceof ShadowRoot ? rootNode : document.body;\n\n // Currently passed prop or previous context value\n const requestedStyleSheetTarget = styleSheetTarget ?? ctx.styleSheetTarget;\n const requestedPortalTarget = portalTarget ?? ctx.portalTarget;\n\n // If the \"requested\" target is within the root node, it is valid, so use that, otherwise fallback to the default.\n return [\n rootNode.contains(requestedStyleSheetTarget ?? null)\n ? requestedStyleSheetTarget\n : defaultStyleSheetTarget,\n rootNode.contains(requestedPortalTarget ?? null) ? requestedPortalTarget : defaultPortalTarget\n ];\n }, [wrapperEl, styleSheetTarget, portalTarget, ctx.styleSheetTarget, ctx.portalTarget]);\n\n useEffect(() => {\n const sym = Symbol(id);\n mountConfig(sym);\n\n return () => {\n unmountConfig(sym);\n };\n }, [id]);\n\n const wrappedChildren = ctx.initialized ? (\n children\n ) : (\n <StyleSheetManager disableVendorPrefixes target={resolvedStyleSheetTarget}>\n <>\n {!disableDefaultFontLoading &&\n resolvedStyleSheetTarget &&\n createPortal(\n <link\n rel='stylesheet'\n href='https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400..700;1,400..700&family=Inter:wght@400..700&display=swap'\n data-cosmos-global-style\n />,\n resolvedStyleSheetTarget\n )}\n <GlobalStyle />\n {children}\n </>\n </StyleSheetManager>\n );\n\n return (\n <StyledConfigurationWrapper ref={setWrapperEl}>\n <context.Provider\n // eslint-disable-next-line react/jsx-no-constructed-context-values\n value={{\n locale: locale ?? ctx.locale,\n direction:\n direction ?? (locale !== undefined ? directionOfLocale(locale) : ctx.direction),\n translations,\n themeMachine,\n styleSheetTarget: resolvedStyleSheetTarget,\n portalTarget: resolvedPortalTarget,\n loadedRef: ctx.loadedRef,\n renderNativeControls: renderNativeControls ?? ctx.renderNativeControls,\n testIds: testIds ?? ctx.testIds,\n initialized: true\n }}\n >\n <ThemeProvider theme={themeMachine.theme}>\n {styleSheetURLs &&\n resolvedStyleSheetTarget &&\n createPortal(\n styleSheetURLs.map(url => (\n <link rel='stylesheet' href={url} key={url} data-cosmos-global-style />\n )),\n resolvedStyleSheetTarget\n )}\n {wrappedChildren}\n </ThemeProvider>\n </context.Provider>\n </StyledConfigurationWrapper>\n );\n};\n\nexport default Configuration;\n"]}
@@ -1 +1 @@
1
- {"version":3,"file":"CurrencyInput.d.ts","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAmB3C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;;;;AA4LvD,wBAAmE"}
1
+ {"version":3,"file":"CurrencyInput.d.ts","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAOlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAmB3C,OAAO,kBAAkB,MAAM,uBAAuB,CAAC;;;;AAgMvD,wBAAmE"}
@@ -94,19 +94,8 @@ const CurrencyInput = forwardRef(function CurrencyInput(props, ref) {
94
94
  }
95
95
  };
96
96
  const formattedValue = useInputFormatter(inputRef, value, formatValue, `\\p{N}${decimalSign}-`);
97
- const Comp = (_jsxs(_Fragment, { children: [_jsx(Input, { "data-testid": testIds.control, ...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps }, hasSuggestion: status === 'pending' && !!onResolveSuggestion, inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onFocus: onInputFocusEvent, onBlur: onInputFocusEvent, "aria-describedby": validCurrencyISOCode ? descriptionId : undefined, maxLength: 16 }), validCurrencyISOCode && (_jsx(VisuallyHiddenText, { id: descriptionId, "aria-hidden": true, children: t('measured_in', [validCurrencyISOCode]) }))] }));
98
- return label ? (_jsx(FormField, { ...{
99
- testId: testIds,
100
- label,
101
- labelHidden,
102
- id,
103
- info,
104
- status,
105
- required,
106
- disabled,
107
- additionalInfo,
108
- onResolveSuggestion
109
- }, children: Comp })) : (Comp);
97
+ const Comp = (_jsxs(_Fragment, { children: [_jsx(Input, { "data-testid": testIds.control, onChange: onInputChange, id: id, readOnly: readOnly, required: required, disabled: disabled, status: status, ...restProps, hasSuggestion: status === 'pending' && !!onResolveSuggestion, inputMode: 'numeric', ref: inputRef, value: formattedValue, onKeyDown: onKeyDown, onFocus: onInputFocusEvent, onBlur: onInputFocusEvent, "aria-describedby": validCurrencyISOCode ? descriptionId : undefined, maxLength: 16 }), validCurrencyISOCode && (_jsx(VisuallyHiddenText, { id: descriptionId, "aria-hidden": true, children: t('measured_in', [validCurrencyISOCode]) }))] }));
98
+ return label ? (_jsx(FormField, { testId: testIds, label: label, labelHidden: labelHidden, id: id, info: info, status: status, required: required, disabled: disabled, additionalInfo: additionalInfo, onResolveSuggestion: onResolveSuggestion, children: Comp })) : (Comp);
110
99
  });
111
100
  export default withTestIds(CurrencyInput, getCurrencyInputTestIds);
112
101
  //# sourceMappingURL=CurrencyInput.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"CurrencyInput.js","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useMemo,\n KeyboardEvent,\n ChangeEvent,\n FocusEvent\n} from 'react';\n\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport FormField from '../FormField';\nimport { ForwardProps } from '../../types';\nimport {\n useConfiguration,\n useConsolidatedRef,\n useI18n,\n useInputFormatter,\n usePrevious,\n useTestIds,\n useUID\n} from '../../hooks';\nimport {\n getCleanedValue,\n getDecimalSign,\n getDecrementedValue,\n getIncrementedValue\n} from '../Number/utils';\nimport Input from '../Input';\nimport { withTestIds } from '../../utils';\n\nimport CurrencyInputProps from './CurrencyInput.types';\nimport { getCurrencyMinimumFractionDigits, getFormattedValue, isValidCurrency } from './utils';\nimport { getCurrencyInputTestIds } from './Currency.test-ids';\n\nconst CurrencyInput: FunctionComponent<CurrencyInputProps & ForwardProps> = forwardRef(\n function CurrencyInput(\n props: PropsWithoutRef<CurrencyInputProps>,\n ref: CurrencyInputProps['ref']\n ) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n status,\n label,\n labelHidden,\n info,\n required,\n disabled,\n readOnly,\n additionalInfo,\n value: valueProp = '',\n onChange,\n onBlur,\n onFocus,\n onResolveSuggestion,\n currencyISOCode,\n showDecimal = true,\n showGroupSeparators = true,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n alwaysShowISOCode = false,\n maximumFractionDigits = 0,\n ...restProps\n } = props;\n\n const descriptionId = useUID();\n const testIds = useTestIds(testId, getCurrencyInputTestIds);\n\n const { locale } = useConfiguration();\n\n const t = useI18n();\n const inputRef = useConsolidatedRef(ref);\n\n const validCurrencyISOCode = useMemo(\n () => (currencyISOCode && isValidCurrency(currencyISOCode) ? currencyISOCode : undefined),\n [currencyISOCode]\n );\n\n const minimumFractionDigits = useMemo(\n () => getCurrencyMinimumFractionDigits(locale, validCurrencyISOCode),\n [locale, validCurrencyISOCode]\n );\n\n const numberOfDecimals = showDecimal\n ? Math.max(maximumFractionDigits, minimumFractionDigits)\n : 0;\n\n const decimalSign = useMemo(() => getDecimalSign(locale), [locale]);\n\n // on initial render only pad the value with 0 if necessary\n const rendered = usePrevious(true);\n let value = valueProp;\n if (!rendered && validCurrencyISOCode && !Number.isNaN(parseFloat(value))) {\n const [integer, fraction = ''] = value.split('.');\n value = `${integer}.${fraction.padEnd(numberOfDecimals, '0')}`;\n }\n\n const formatValue = useCallback(\n number => {\n return getFormattedValue(number, locale, validCurrencyISOCode, {\n showGroupSeparators,\n showAs: alwaysShowISOCode ? 'code' : 'symbol',\n numberOfDecimals\n });\n },\n [alwaysShowISOCode, numberOfDecimals, showGroupSeparators, locale, validCurrencyISOCode]\n );\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const cleanedInputValue = getCleanedValue(inputValue, decimalSign, numberOfDecimals);\n if (cleanedInputValue === value) return;\n onChange(cleanedInputValue);\n };\n\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (readOnly) return;\n const input = e.currentTarget;\n switch (e.key) {\n case 'ArrowUp':\n e.preventDefault();\n onChange(getIncrementedValue(value, min, max, step));\n break;\n case 'ArrowDown':\n e.preventDefault();\n onChange(getDecrementedValue(value, min, max, step));\n break;\n case decimalSign:\n if (!showDecimal) e.preventDefault();\n if (input.value.includes(decimalSign)) {\n if (input.selectionStart && input.value.charAt(input.selectionStart) === decimalSign) {\n input.setSelectionRange(input.selectionStart + 1, input.selectionStart + 1);\n }\n e.preventDefault();\n } else if (\n input.selectionStart !== null &&\n !input.value.charAt(input.selectionStart - 1).match(/\\d/)\n ) {\n onChange(\n getCleanedValue(`${input.value}0${decimalSign}`, decimalSign, numberOfDecimals)\n );\n e.preventDefault();\n }\n break;\n case '-':\n if (value.startsWith('-')) e.preventDefault();\n break;\n default:\n }\n };\n\n const onInputFocusEvent = (e: FocusEvent<HTMLInputElement>) => {\n let parsableValue = value;\n if (validCurrencyISOCode && !Number.isNaN(parseFloat(value))) {\n const [integer, fraction = ''] = value.split('.');\n parsableValue = `${integer}.${fraction.padEnd(numberOfDecimals, '0')}`;\n }\n\n if (e.type === 'focus') onFocus?.(parsableValue);\n else {\n if (parsableValue !== value) {\n onChange(parsableValue);\n }\n\n onBlur?.(parsableValue);\n }\n };\n\n const formattedValue = useInputFormatter(inputRef, value, formatValue, `\\\\p{N}${decimalSign}-`);\n\n const Comp = (\n <>\n <Input\n data-testid={testIds.control}\n {...{ onChange: onInputChange, id, readOnly, required, disabled, status, ...restProps }}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-describedby={validCurrencyISOCode ? descriptionId : undefined}\n maxLength={16}\n />\n {validCurrencyISOCode && (\n <VisuallyHiddenText id={descriptionId} aria-hidden>\n {t('measured_in', [validCurrencyISOCode])}\n </VisuallyHiddenText>\n )}\n </>\n );\n\n return label ? (\n <FormField\n {...{\n testId: testIds,\n label,\n labelHidden,\n id,\n info,\n status,\n required,\n disabled,\n additionalInfo,\n onResolveSuggestion\n }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(CurrencyInput, getCurrencyInputTestIds);\n"]}
1
+ {"version":3,"file":"CurrencyInput.js","sourceRoot":"","sources":["../../../src/components/Currency/CurrencyInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n useCallback,\n useMemo,\n KeyboardEvent,\n ChangeEvent,\n FocusEvent\n} from 'react';\n\nimport VisuallyHiddenText from '../VisuallyHiddenText';\nimport FormField from '../FormField';\nimport { ForwardProps } from '../../types';\nimport {\n useConfiguration,\n useConsolidatedRef,\n useI18n,\n useInputFormatter,\n usePrevious,\n useTestIds,\n useUID\n} from '../../hooks';\nimport {\n getCleanedValue,\n getDecimalSign,\n getDecrementedValue,\n getIncrementedValue\n} from '../Number/utils';\nimport Input from '../Input';\nimport { withTestIds } from '../../utils';\n\nimport CurrencyInputProps from './CurrencyInput.types';\nimport { getCurrencyMinimumFractionDigits, getFormattedValue, isValidCurrency } from './utils';\nimport { getCurrencyInputTestIds } from './Currency.test-ids';\n\nconst CurrencyInput: FunctionComponent<CurrencyInputProps & ForwardProps> = forwardRef(\n function CurrencyInput(\n props: PropsWithoutRef<CurrencyInputProps>,\n ref: CurrencyInputProps['ref']\n ) {\n const uid = useUID();\n const {\n testId,\n id = uid,\n status,\n label,\n labelHidden,\n info,\n required,\n disabled,\n readOnly,\n additionalInfo,\n value: valueProp = '',\n onChange,\n onBlur,\n onFocus,\n onResolveSuggestion,\n currencyISOCode,\n showDecimal = true,\n showGroupSeparators = true,\n min = Number.MIN_SAFE_INTEGER,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n alwaysShowISOCode = false,\n maximumFractionDigits = 0,\n ...restProps\n } = props;\n\n const descriptionId = useUID();\n const testIds = useTestIds(testId, getCurrencyInputTestIds);\n\n const { locale } = useConfiguration();\n\n const t = useI18n();\n const inputRef = useConsolidatedRef(ref);\n\n const validCurrencyISOCode = useMemo(\n () => (currencyISOCode && isValidCurrency(currencyISOCode) ? currencyISOCode : undefined),\n [currencyISOCode]\n );\n\n const minimumFractionDigits = useMemo(\n () => getCurrencyMinimumFractionDigits(locale, validCurrencyISOCode),\n [locale, validCurrencyISOCode]\n );\n\n const numberOfDecimals = showDecimal\n ? Math.max(maximumFractionDigits, minimumFractionDigits)\n : 0;\n\n const decimalSign = useMemo(() => getDecimalSign(locale), [locale]);\n\n // on initial render only pad the value with 0 if necessary\n const rendered = usePrevious(true);\n let value = valueProp;\n if (!rendered && validCurrencyISOCode && !Number.isNaN(parseFloat(value))) {\n const [integer, fraction = ''] = value.split('.');\n value = `${integer}.${fraction.padEnd(numberOfDecimals, '0')}`;\n }\n\n const formatValue = useCallback(\n number => {\n return getFormattedValue(number, locale, validCurrencyISOCode, {\n showGroupSeparators,\n showAs: alwaysShowISOCode ? 'code' : 'symbol',\n numberOfDecimals\n });\n },\n [alwaysShowISOCode, numberOfDecimals, showGroupSeparators, locale, validCurrencyISOCode]\n );\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const cleanedInputValue = getCleanedValue(inputValue, decimalSign, numberOfDecimals);\n if (cleanedInputValue === value) return;\n onChange(cleanedInputValue);\n };\n\n const onKeyDown = (e: KeyboardEvent<HTMLInputElement>) => {\n if (readOnly) return;\n const input = e.currentTarget;\n switch (e.key) {\n case 'ArrowUp':\n e.preventDefault();\n onChange(getIncrementedValue(value, min, max, step));\n break;\n case 'ArrowDown':\n e.preventDefault();\n onChange(getDecrementedValue(value, min, max, step));\n break;\n case decimalSign:\n if (!showDecimal) e.preventDefault();\n if (input.value.includes(decimalSign)) {\n if (input.selectionStart && input.value.charAt(input.selectionStart) === decimalSign) {\n input.setSelectionRange(input.selectionStart + 1, input.selectionStart + 1);\n }\n e.preventDefault();\n } else if (\n input.selectionStart !== null &&\n !input.value.charAt(input.selectionStart - 1).match(/\\d/)\n ) {\n onChange(\n getCleanedValue(`${input.value}0${decimalSign}`, decimalSign, numberOfDecimals)\n );\n e.preventDefault();\n }\n break;\n case '-':\n if (value.startsWith('-')) e.preventDefault();\n break;\n default:\n }\n };\n\n const onInputFocusEvent = (e: FocusEvent<HTMLInputElement>) => {\n let parsableValue = value;\n if (validCurrencyISOCode && !Number.isNaN(parseFloat(value))) {\n const [integer, fraction = ''] = value.split('.');\n parsableValue = `${integer}.${fraction.padEnd(numberOfDecimals, '0')}`;\n }\n\n if (e.type === 'focus') onFocus?.(parsableValue);\n else {\n if (parsableValue !== value) {\n onChange(parsableValue);\n }\n\n onBlur?.(parsableValue);\n }\n };\n\n const formattedValue = useInputFormatter(inputRef, value, formatValue, `\\\\p{N}${decimalSign}-`);\n\n const Comp = (\n <>\n <Input\n data-testid={testIds.control}\n onChange={onInputChange}\n id={id}\n readOnly={readOnly}\n required={required}\n disabled={disabled}\n status={status}\n {...restProps}\n hasSuggestion={status === 'pending' && !!onResolveSuggestion}\n inputMode='numeric'\n ref={inputRef}\n value={formattedValue}\n onKeyDown={onKeyDown}\n onFocus={onInputFocusEvent}\n onBlur={onInputFocusEvent}\n aria-describedby={validCurrencyISOCode ? descriptionId : undefined}\n maxLength={16}\n />\n {validCurrencyISOCode && (\n <VisuallyHiddenText id={descriptionId} aria-hidden>\n {t('measured_in', [validCurrencyISOCode])}\n </VisuallyHiddenText>\n )}\n </>\n );\n\n return label ? (\n <FormField\n testId={testIds}\n label={label}\n labelHidden={labelHidden}\n id={id}\n info={info}\n status={status}\n required={required}\n disabled={disabled}\n additionalInfo={additionalInfo}\n onResolveSuggestion={onResolveSuggestion}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default withTestIds(CurrencyInput, getCurrencyInputTestIds);\n"]}