@chayns-components/core 5.3.12-alpha.0 → 5.4.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 (460) hide show
  1. package/AGENTS.md +0 -12
  2. package/lib/cjs/components/accordion/Accordion.js +12 -107
  3. package/lib/cjs/components/accordion/Accordion.js.map +1 -1
  4. package/lib/cjs/components/accordion/Accordion.styles.js +3 -23
  5. package/lib/cjs/components/accordion/Accordion.styles.js.map +1 -1
  6. package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js +1 -3
  7. package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
  8. package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js +19 -36
  9. package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
  10. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js +3 -6
  11. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  12. package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js +0 -14
  13. package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
  14. package/lib/cjs/components/amount-control/AmountControl.js +17 -31
  15. package/lib/cjs/components/amount-control/AmountControl.js.map +1 -1
  16. package/lib/cjs/components/amount-control/AmountControl.styles.js +2 -18
  17. package/lib/cjs/components/amount-control/AmountControl.styles.js.map +1 -1
  18. package/lib/cjs/components/button/Button.js +1 -5
  19. package/lib/cjs/components/button/Button.js.map +1 -1
  20. package/lib/cjs/components/button/Button.styles.js +0 -17
  21. package/lib/cjs/components/button/Button.styles.js.map +1 -1
  22. package/lib/cjs/components/button/Button.types.js.map +1 -1
  23. package/lib/cjs/components/checkbox/Checkbox.js +1 -5
  24. package/lib/cjs/components/checkbox/Checkbox.js.map +1 -1
  25. package/lib/cjs/components/checkbox/Checkbox.styles.js +2 -29
  26. package/lib/cjs/components/checkbox/Checkbox.styles.js.map +1 -1
  27. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js +2 -7
  28. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
  29. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js +2 -8
  30. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
  31. package/lib/cjs/components/combobox/ComboBox.js +5 -52
  32. package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
  33. package/lib/cjs/components/combobox/ComboBox.styles.js +0 -11
  34. package/lib/cjs/components/combobox/ComboBox.styles.js.map +1 -1
  35. package/lib/cjs/components/combobox/ComboBox.types.js.map +1 -1
  36. package/lib/cjs/components/context-menu/ContextMenu.js +6 -100
  37. package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
  38. package/lib/cjs/components/context-menu/ContextMenu.styles.js +0 -38
  39. package/lib/cjs/components/context-menu/ContextMenu.styles.js.map +1 -1
  40. package/lib/cjs/components/context-menu/ContextMenu.types.js.map +1 -1
  41. package/lib/cjs/components/file-input/FileInput.js +2 -4
  42. package/lib/cjs/components/file-input/FileInput.js.map +1 -1
  43. package/lib/cjs/components/file-list/file-item/FileItem.js +2 -23
  44. package/lib/cjs/components/file-list/file-item/FileItem.js.map +1 -1
  45. package/lib/cjs/components/file-list/file-item/FileItem.styles.js +1 -19
  46. package/lib/cjs/components/file-list/file-item/FileItem.styles.js.map +1 -1
  47. package/lib/cjs/components/file-select/FileSelect.js +4 -27
  48. package/lib/cjs/components/file-select/FileSelect.js.map +1 -1
  49. package/lib/cjs/components/file-select/FileSelect.styles.js +0 -10
  50. package/lib/cjs/components/file-select/FileSelect.styles.js.map +1 -1
  51. package/lib/cjs/components/filter/Filter.js +16 -51
  52. package/lib/cjs/components/filter/Filter.js.map +1 -1
  53. package/lib/cjs/components/filter/Filter.styles.js +0 -9
  54. package/lib/cjs/components/filter/Filter.styles.js.map +1 -1
  55. package/lib/cjs/components/filter/filter-content/FilterContent.js +5 -14
  56. package/lib/cjs/components/filter/filter-content/FilterContent.js.map +1 -1
  57. package/lib/cjs/components/filter/filter-content/FilterContent.types.js.map +1 -1
  58. package/lib/cjs/components/filter-buttons/FilterButtons.js +4 -69
  59. package/lib/cjs/components/filter-buttons/FilterButtons.js.map +1 -1
  60. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js +2 -40
  61. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js.map +1 -1
  62. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.styles.js +0 -11
  63. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
  64. package/lib/cjs/components/grid-image/GridImage.js +2 -20
  65. package/lib/cjs/components/grid-image/GridImage.js.map +1 -1
  66. package/lib/cjs/components/grid-image/GridImage.styles.js +2 -11
  67. package/lib/cjs/components/grid-image/GridImage.styles.js.map +1 -1
  68. package/lib/cjs/components/grouped-image/GroupedImage.js +4 -23
  69. package/lib/cjs/components/grouped-image/GroupedImage.js.map +1 -1
  70. package/lib/cjs/components/grouped-image/GroupedImage.styles.js +0 -9
  71. package/lib/cjs/components/grouped-image/GroupedImage.styles.js.map +1 -1
  72. package/lib/cjs/components/highlight-slider/HighlightSlider.js +3 -10
  73. package/lib/cjs/components/highlight-slider/HighlightSlider.js.map +1 -1
  74. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +4 -21
  75. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map +1 -1
  76. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js +2 -11
  77. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
  78. package/lib/cjs/components/icon/Icon.js +5 -24
  79. package/lib/cjs/components/icon/Icon.js.map +1 -1
  80. package/lib/cjs/components/icon/Icon.styles.js +0 -23
  81. package/lib/cjs/components/icon/Icon.styles.js.map +1 -1
  82. package/lib/cjs/components/input/Input.js +8 -29
  83. package/lib/cjs/components/input/Input.js.map +1 -1
  84. package/lib/cjs/components/input/Input.styles.js +3 -33
  85. package/lib/cjs/components/input/Input.styles.js.map +1 -1
  86. package/lib/cjs/components/list/List.js +37 -124
  87. package/lib/cjs/components/list/List.js.map +1 -1
  88. package/lib/cjs/components/list/List.utils.js +1 -119
  89. package/lib/cjs/components/list/List.utils.js.map +1 -1
  90. package/lib/cjs/components/list/list-item/ListItem.js +3 -82
  91. package/lib/cjs/components/list/list-item/ListItem.js.map +1 -1
  92. package/lib/cjs/components/list/list-item/ListItem.styles.js +0 -9
  93. package/lib/cjs/components/list/list-item/ListItem.styles.js.map +1 -1
  94. package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js +5 -40
  95. package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
  96. package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.styles.js +1 -5
  97. package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
  98. package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +1 -32
  99. package/lib/cjs/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
  100. package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +1 -32
  101. package/lib/cjs/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
  102. package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -30
  103. package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
  104. package/lib/cjs/components/mention-finder/MentionFinder.js +2 -31
  105. package/lib/cjs/components/mention-finder/MentionFinder.js.map +1 -1
  106. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  107. package/lib/cjs/components/multi-action-button/MultiActionButton.js +3 -36
  108. package/lib/cjs/components/multi-action-button/MultiActionButton.js.map +1 -1
  109. package/lib/cjs/components/multi-action-button/MultiActionButton.types.js.map +1 -1
  110. package/lib/cjs/components/multi-action-button/action-button/ActionButton.js +1 -7
  111. package/lib/cjs/components/multi-action-button/action-button/ActionButton.js.map +1 -1
  112. package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js +0 -12
  113. package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
  114. package/lib/cjs/components/number-input/NumberInput.js +10 -13
  115. package/lib/cjs/components/number-input/NumberInput.js.map +1 -1
  116. package/lib/cjs/components/page-provider/PageProvider.js +2 -4
  117. package/lib/cjs/components/page-provider/PageProvider.js.map +1 -1
  118. package/lib/cjs/components/popup/Popup.js +1 -8
  119. package/lib/cjs/components/popup/Popup.js.map +1 -1
  120. package/lib/cjs/components/radio-button/RadioButton.js +15 -29
  121. package/lib/cjs/components/radio-button/RadioButton.js.map +1 -1
  122. package/lib/cjs/components/radio-button/RadioButton.styles.js +8 -19
  123. package/lib/cjs/components/radio-button/RadioButton.styles.js.map +1 -1
  124. package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js +4 -7
  125. package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
  126. package/lib/cjs/components/search-box/SearchBox.js +2 -5
  127. package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
  128. package/lib/cjs/components/search-input/SearchInput.js +41 -40
  129. package/lib/cjs/components/search-input/SearchInput.js.map +1 -1
  130. package/lib/cjs/components/search-input/SearchInput.styles.js +2 -25
  131. package/lib/cjs/components/search-input/SearchInput.styles.js.map +1 -1
  132. package/lib/cjs/components/select-button/SelectButton.js +2 -4
  133. package/lib/cjs/components/select-button/SelectButton.js.map +1 -1
  134. package/lib/cjs/components/setup-wizard/SetupWizard.js +4 -7
  135. package/lib/cjs/components/setup-wizard/SetupWizard.js.map +1 -1
  136. package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +3 -5
  137. package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
  138. package/lib/cjs/components/sharing-bar/SharingBar.js +7 -32
  139. package/lib/cjs/components/sharing-bar/SharingBar.js.map +1 -1
  140. package/lib/cjs/components/sharing-bar/SharingBar.styles.js +3 -7
  141. package/lib/cjs/components/sharing-bar/SharingBar.styles.js.map +1 -1
  142. package/lib/cjs/components/sharing-button/SharingButton.js +2 -4
  143. package/lib/cjs/components/sharing-button/SharingButton.js.map +1 -1
  144. package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js +1 -3
  145. package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
  146. package/lib/cjs/components/signature/Signature.js +3 -6
  147. package/lib/cjs/components/signature/Signature.js.map +1 -1
  148. package/lib/cjs/components/skeleton/base-skeleton/BaseSkeleton.styles.js +2 -0
  149. package/lib/cjs/components/skeleton/base-skeleton/BaseSkeleton.styles.js.map +1 -1
  150. package/lib/cjs/components/slider/Slider.js +7 -30
  151. package/lib/cjs/components/slider/Slider.js.map +1 -1
  152. package/lib/cjs/components/slider/Slider.styles.js +2 -9
  153. package/lib/cjs/components/slider/Slider.styles.js.map +1 -1
  154. package/lib/cjs/components/slider-button/SliderButton.js +6 -63
  155. package/lib/cjs/components/slider-button/SliderButton.js.map +1 -1
  156. package/lib/cjs/components/slider-button/SliderButton.styles.js +2 -19
  157. package/lib/cjs/components/slider-button/SliderButton.styles.js.map +1 -1
  158. package/lib/cjs/components/tag-input/TagInput.js +36 -91
  159. package/lib/cjs/components/tag-input/TagInput.js.map +1 -1
  160. package/lib/cjs/components/tag-input/TagInput.styles.js +3 -31
  161. package/lib/cjs/components/tag-input/TagInput.styles.js.map +1 -1
  162. package/lib/cjs/components/text-area/TextArea.js +8 -17
  163. package/lib/cjs/components/text-area/TextArea.js.map +1 -1
  164. package/lib/cjs/components/text-area/TextArea.styles.js +1 -15
  165. package/lib/cjs/components/text-area/TextArea.styles.js.map +1 -1
  166. package/lib/cjs/components/truncation/Truncation.js +3 -17
  167. package/lib/cjs/components/truncation/Truncation.js.map +1 -1
  168. package/lib/cjs/components/truncation/Truncation.styles.js +1 -19
  169. package/lib/cjs/components/truncation/Truncation.styles.js.map +1 -1
  170. package/lib/cjs/index.js +6 -0
  171. package/lib/cjs/index.js.map +1 -1
  172. package/lib/cjs/utils/file.js.map +1 -1
  173. package/lib/esm/components/accordion/Accordion.js +12 -105
  174. package/lib/esm/components/accordion/Accordion.js.map +1 -1
  175. package/lib/esm/components/accordion/Accordion.styles.js +3 -23
  176. package/lib/esm/components/accordion/Accordion.styles.js.map +1 -1
  177. package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js +1 -3
  178. package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
  179. package/lib/esm/components/accordion/accordion-group/AccordionGroup.js +19 -33
  180. package/lib/esm/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
  181. package/lib/esm/components/accordion/accordion-head/AccordionHead.js +3 -6
  182. package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  183. package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js +0 -14
  184. package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
  185. package/lib/esm/components/amount-control/AmountControl.js +16 -30
  186. package/lib/esm/components/amount-control/AmountControl.js.map +1 -1
  187. package/lib/esm/components/amount-control/AmountControl.styles.js +2 -18
  188. package/lib/esm/components/amount-control/AmountControl.styles.js.map +1 -1
  189. package/lib/esm/components/button/Button.js +1 -5
  190. package/lib/esm/components/button/Button.js.map +1 -1
  191. package/lib/esm/components/button/Button.styles.js +0 -17
  192. package/lib/esm/components/button/Button.styles.js.map +1 -1
  193. package/lib/esm/components/button/Button.types.js.map +1 -1
  194. package/lib/esm/components/checkbox/Checkbox.js +1 -5
  195. package/lib/esm/components/checkbox/Checkbox.js.map +1 -1
  196. package/lib/esm/components/checkbox/Checkbox.styles.js +2 -29
  197. package/lib/esm/components/checkbox/Checkbox.styles.js.map +1 -1
  198. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js +2 -7
  199. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
  200. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js +2 -8
  201. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
  202. package/lib/esm/components/combobox/ComboBox.js +5 -50
  203. package/lib/esm/components/combobox/ComboBox.js.map +1 -1
  204. package/lib/esm/components/combobox/ComboBox.styles.js +0 -11
  205. package/lib/esm/components/combobox/ComboBox.styles.js.map +1 -1
  206. package/lib/esm/components/combobox/ComboBox.types.js.map +1 -1
  207. package/lib/esm/components/context-menu/ContextMenu.js +5 -99
  208. package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
  209. package/lib/esm/components/context-menu/ContextMenu.styles.js +0 -38
  210. package/lib/esm/components/context-menu/ContextMenu.styles.js.map +1 -1
  211. package/lib/esm/components/context-menu/ContextMenu.types.js.map +1 -1
  212. package/lib/esm/components/file-input/FileInput.js +2 -4
  213. package/lib/esm/components/file-input/FileInput.js.map +1 -1
  214. package/lib/esm/components/file-list/file-item/FileItem.js +3 -24
  215. package/lib/esm/components/file-list/file-item/FileItem.js.map +1 -1
  216. package/lib/esm/components/file-list/file-item/FileItem.styles.js +0 -18
  217. package/lib/esm/components/file-list/file-item/FileItem.styles.js.map +1 -1
  218. package/lib/esm/components/file-select/FileSelect.js +4 -27
  219. package/lib/esm/components/file-select/FileSelect.js.map +1 -1
  220. package/lib/esm/components/file-select/FileSelect.styles.js +0 -10
  221. package/lib/esm/components/file-select/FileSelect.styles.js.map +1 -1
  222. package/lib/esm/components/filter/Filter.js +16 -52
  223. package/lib/esm/components/filter/Filter.js.map +1 -1
  224. package/lib/esm/components/filter/Filter.styles.js +0 -9
  225. package/lib/esm/components/filter/Filter.styles.js.map +1 -1
  226. package/lib/esm/components/filter/filter-content/FilterContent.js +5 -15
  227. package/lib/esm/components/filter/filter-content/FilterContent.js.map +1 -1
  228. package/lib/esm/components/filter/filter-content/FilterContent.types.js.map +1 -1
  229. package/lib/esm/components/filter-buttons/FilterButtons.js +5 -69
  230. package/lib/esm/components/filter-buttons/FilterButtons.js.map +1 -1
  231. package/lib/esm/components/filter-buttons/filter-button/FilterButton.js +2 -40
  232. package/lib/esm/components/filter-buttons/filter-button/FilterButton.js.map +1 -1
  233. package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js +0 -11
  234. package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
  235. package/lib/esm/components/grid-image/GridImage.js +2 -20
  236. package/lib/esm/components/grid-image/GridImage.js.map +1 -1
  237. package/lib/esm/components/grid-image/GridImage.styles.js +1 -10
  238. package/lib/esm/components/grid-image/GridImage.styles.js.map +1 -1
  239. package/lib/esm/components/grouped-image/GroupedImage.js +4 -22
  240. package/lib/esm/components/grouped-image/GroupedImage.js.map +1 -1
  241. package/lib/esm/components/grouped-image/GroupedImage.styles.js +0 -9
  242. package/lib/esm/components/grouped-image/GroupedImage.styles.js.map +1 -1
  243. package/lib/esm/components/highlight-slider/HighlightSlider.js +3 -10
  244. package/lib/esm/components/highlight-slider/HighlightSlider.js.map +1 -1
  245. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +3 -20
  246. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map +1 -1
  247. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js +1 -10
  248. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
  249. package/lib/esm/components/icon/Icon.js +7 -26
  250. package/lib/esm/components/icon/Icon.js.map +1 -1
  251. package/lib/esm/components/icon/Icon.styles.js +0 -23
  252. package/lib/esm/components/icon/Icon.styles.js.map +1 -1
  253. package/lib/esm/components/input/Input.js +4 -24
  254. package/lib/esm/components/input/Input.js.map +1 -1
  255. package/lib/esm/components/input/Input.styles.js +3 -33
  256. package/lib/esm/components/input/Input.styles.js.map +1 -1
  257. package/lib/esm/components/list/List.js +37 -123
  258. package/lib/esm/components/list/List.js.map +1 -1
  259. package/lib/esm/components/list/List.utils.js +0 -111
  260. package/lib/esm/components/list/List.utils.js.map +1 -1
  261. package/lib/esm/components/list/list-item/ListItem.js +4 -83
  262. package/lib/esm/components/list/list-item/ListItem.js.map +1 -1
  263. package/lib/esm/components/list/list-item/ListItem.styles.js +0 -9
  264. package/lib/esm/components/list/list-item/ListItem.styles.js.map +1 -1
  265. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js +6 -41
  266. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
  267. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js +0 -4
  268. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
  269. package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +2 -33
  270. package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
  271. package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +2 -33
  272. package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
  273. package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +1 -30
  274. package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
  275. package/lib/esm/components/mention-finder/MentionFinder.js +2 -30
  276. package/lib/esm/components/mention-finder/MentionFinder.js.map +1 -1
  277. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  278. package/lib/esm/components/multi-action-button/MultiActionButton.js +3 -36
  279. package/lib/esm/components/multi-action-button/MultiActionButton.js.map +1 -1
  280. package/lib/esm/components/multi-action-button/MultiActionButton.types.js.map +1 -1
  281. package/lib/esm/components/multi-action-button/action-button/ActionButton.js +1 -7
  282. package/lib/esm/components/multi-action-button/action-button/ActionButton.js.map +1 -1
  283. package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js +0 -12
  284. package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
  285. package/lib/esm/components/number-input/NumberInput.js +10 -13
  286. package/lib/esm/components/number-input/NumberInput.js.map +1 -1
  287. package/lib/esm/components/page-provider/PageProvider.js +2 -4
  288. package/lib/esm/components/page-provider/PageProvider.js.map +1 -1
  289. package/lib/esm/components/popup/Popup.js +1 -8
  290. package/lib/esm/components/popup/Popup.js.map +1 -1
  291. package/lib/esm/components/radio-button/RadioButton.js +15 -29
  292. package/lib/esm/components/radio-button/RadioButton.js.map +1 -1
  293. package/lib/esm/components/radio-button/RadioButton.styles.js +8 -19
  294. package/lib/esm/components/radio-button/RadioButton.styles.js.map +1 -1
  295. package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js +4 -7
  296. package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
  297. package/lib/esm/components/search-box/SearchBox.js +2 -5
  298. package/lib/esm/components/search-box/SearchBox.js.map +1 -1
  299. package/lib/esm/components/search-input/SearchInput.js +42 -41
  300. package/lib/esm/components/search-input/SearchInput.js.map +1 -1
  301. package/lib/esm/components/search-input/SearchInput.styles.js +1 -24
  302. package/lib/esm/components/search-input/SearchInput.styles.js.map +1 -1
  303. package/lib/esm/components/select-button/SelectButton.js +2 -4
  304. package/lib/esm/components/select-button/SelectButton.js.map +1 -1
  305. package/lib/esm/components/setup-wizard/SetupWizard.js +4 -7
  306. package/lib/esm/components/setup-wizard/SetupWizard.js.map +1 -1
  307. package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +3 -5
  308. package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
  309. package/lib/esm/components/sharing-bar/SharingBar.js +6 -31
  310. package/lib/esm/components/sharing-bar/SharingBar.js.map +1 -1
  311. package/lib/esm/components/sharing-bar/SharingBar.styles.js +3 -7
  312. package/lib/esm/components/sharing-bar/SharingBar.styles.js.map +1 -1
  313. package/lib/esm/components/sharing-button/SharingButton.js +2 -4
  314. package/lib/esm/components/sharing-button/SharingButton.js.map +1 -1
  315. package/lib/esm/components/sharing-context-menu/SharingContextMenu.js +1 -3
  316. package/lib/esm/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
  317. package/lib/esm/components/signature/Signature.js +3 -6
  318. package/lib/esm/components/signature/Signature.js.map +1 -1
  319. package/lib/esm/components/skeleton/base-skeleton/BaseSkeleton.styles.js +2 -0
  320. package/lib/esm/components/skeleton/base-skeleton/BaseSkeleton.styles.js.map +1 -1
  321. package/lib/esm/components/slider/Slider.js +7 -30
  322. package/lib/esm/components/slider/Slider.js.map +1 -1
  323. package/lib/esm/components/slider/Slider.styles.js +1 -8
  324. package/lib/esm/components/slider/Slider.styles.js.map +1 -1
  325. package/lib/esm/components/slider-button/SliderButton.js +6 -62
  326. package/lib/esm/components/slider-button/SliderButton.js.map +1 -1
  327. package/lib/esm/components/slider-button/SliderButton.styles.js +1 -18
  328. package/lib/esm/components/slider-button/SliderButton.styles.js.map +1 -1
  329. package/lib/esm/components/tag-input/TagInput.js +35 -85
  330. package/lib/esm/components/tag-input/TagInput.js.map +1 -1
  331. package/lib/esm/components/tag-input/TagInput.styles.js +1 -29
  332. package/lib/esm/components/tag-input/TagInput.styles.js.map +1 -1
  333. package/lib/esm/components/text-area/TextArea.js +9 -18
  334. package/lib/esm/components/text-area/TextArea.js.map +1 -1
  335. package/lib/esm/components/text-area/TextArea.styles.js +0 -14
  336. package/lib/esm/components/text-area/TextArea.styles.js.map +1 -1
  337. package/lib/esm/components/truncation/Truncation.js +4 -18
  338. package/lib/esm/components/truncation/Truncation.js.map +1 -1
  339. package/lib/esm/components/truncation/Truncation.styles.js +0 -18
  340. package/lib/esm/components/truncation/Truncation.styles.js.map +1 -1
  341. package/lib/esm/index.js +1 -1
  342. package/lib/esm/index.js.map +1 -1
  343. package/lib/esm/utils/file.js.map +1 -1
  344. package/lib/types/components/accordion/Accordion.d.ts +0 -5
  345. package/lib/types/components/accordion/Accordion.styles.d.ts +4 -8
  346. package/lib/types/components/accordion/accordion-body/AccordionBody.styles.d.ts +2 -2
  347. package/lib/types/components/accordion/accordion-group/AccordionGroup.d.ts +2 -7
  348. package/lib/types/components/accordion/accordion-head/AccordionHead.d.ts +0 -1
  349. package/lib/types/components/accordion/accordion-head/AccordionHead.styles.d.ts +18 -18
  350. package/lib/types/components/amount-control/AmountControl.d.ts +0 -5
  351. package/lib/types/components/amount-control/AmountControl.styles.d.ts +4 -8
  352. package/lib/types/components/button/Button.styles.d.ts +6 -8
  353. package/lib/types/components/button/Button.types.d.ts +0 -8
  354. package/lib/types/components/checkbox/Checkbox.d.ts +0 -4
  355. package/lib/types/components/checkbox/Checkbox.styles.d.ts +1 -5
  356. package/lib/types/components/color-scheme-provider/ColorSchemeProvider.d.ts +0 -5
  357. package/lib/types/components/combobox/ComboBox.styles.d.ts +2 -4
  358. package/lib/types/components/combobox/ComboBox.types.d.ts +0 -5
  359. package/lib/types/components/context-menu/ContextMenu.styles.d.ts +2 -4
  360. package/lib/types/components/context-menu/ContextMenu.types.d.ts +0 -6
  361. package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +2 -2
  362. package/lib/types/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.d.ts +2 -2
  363. package/lib/types/components/expandable-content/ExpandableContent.styles.d.ts +2 -2
  364. package/lib/types/components/file-input/FileInput.d.ts +0 -4
  365. package/lib/types/components/file-input/FileInput.styles.d.ts +2 -2
  366. package/lib/types/components/file-list/file-item/FileItem.styles.d.ts +0 -3
  367. package/lib/types/components/file-select/FileSelect.d.ts +0 -4
  368. package/lib/types/components/file-select/FileSelect.styles.d.ts +4 -6
  369. package/lib/types/components/filter/Filter.d.ts +0 -1
  370. package/lib/types/components/filter/Filter.styles.d.ts +4 -6
  371. package/lib/types/components/filter/filter-content/FilterContent.types.d.ts +0 -4
  372. package/lib/types/components/filter-buttons/FilterButtons.d.ts +0 -4
  373. package/lib/types/components/filter-buttons/filter-button/FilterButton.d.ts +0 -5
  374. package/lib/types/components/filter-buttons/filter-button/FilterButton.styles.d.ts +8 -12
  375. package/lib/types/components/grid-image/GridImage.d.ts +0 -4
  376. package/lib/types/components/grid-image/GridImage.styles.d.ts +2 -4
  377. package/lib/types/components/grouped-image/GroupedImage.d.ts +0 -4
  378. package/lib/types/components/grouped-image/GroupedImage.styles.d.ts +6 -8
  379. package/lib/types/components/highlight-slider/HighlightSlider.d.ts +0 -4
  380. package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.d.ts +0 -3
  381. package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.d.ts +5 -9
  382. package/lib/types/components/icon/Icon.d.ts +0 -4
  383. package/lib/types/components/icon/Icon.styles.d.ts +0 -1
  384. package/lib/types/components/input/Input.d.ts +0 -4
  385. package/lib/types/components/input/Input.styles.d.ts +9 -17
  386. package/lib/types/components/list/List.d.ts +0 -11
  387. package/lib/types/components/list/List.utils.d.ts +1 -16
  388. package/lib/types/components/list/list-item/ListItem.styles.d.ts +64 -64
  389. package/lib/types/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +2 -2
  390. package/lib/types/components/list/list-item/list-item-head/ListItemHead.d.ts +0 -1
  391. package/lib/types/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +194 -195
  392. package/lib/types/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.d.ts +0 -1
  393. package/lib/types/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.d.ts +0 -1
  394. package/lib/types/components/list/list-item/list-item-head/list-item-title/ListItemTitle.d.ts +0 -1
  395. package/lib/types/components/masonry/masonry-item/MasonryItem.styles.d.ts +2 -2
  396. package/lib/types/components/mention-finder/MentionFinder.styles.d.ts +4 -4
  397. package/lib/types/components/multi-action-button/MultiActionButton.styles.d.ts +2 -2
  398. package/lib/types/components/multi-action-button/MultiActionButton.types.d.ts +0 -7
  399. package/lib/types/components/multi-action-button/action-button/ActionButton.d.ts +1 -4
  400. package/lib/types/components/multi-action-button/action-button/ActionButton.styles.d.ts +2 -4
  401. package/lib/types/components/number-input/NumberInput.d.ts +0 -4
  402. package/lib/types/components/popup/popup-content-wrapper/PopupContentWrapper.styles.d.ts +2 -2
  403. package/lib/types/components/progress-bar/ProgressBar.styles.d.ts +6 -6
  404. package/lib/types/components/radio-button/RadioButton.d.ts +0 -4
  405. package/lib/types/components/radio-button/RadioButton.styles.d.ts +9 -15
  406. package/lib/types/components/radio-button/radio-button-group/RadioButtonGroup.d.ts +0 -5
  407. package/lib/types/components/search-box/SearchBox.d.ts +0 -4
  408. package/lib/types/components/search-box/SearchBox.styles.d.ts +2 -2
  409. package/lib/types/components/search-input/SearchInput.d.ts +0 -4
  410. package/lib/types/components/search-input/SearchInput.styles.d.ts +9 -17
  411. package/lib/types/components/select-button/SelectButton.d.ts +0 -4
  412. package/lib/types/components/setup-wizard/SetupWizard.d.ts +0 -5
  413. package/lib/types/components/sharing-bar/SharingBar.d.ts +0 -4
  414. package/lib/types/components/sharing-button/SharingButton.d.ts +1 -1
  415. package/lib/types/components/sharing-context-menu/SharingContextMenu.d.ts +2 -10
  416. package/lib/types/components/signature/Signature.d.ts +0 -4
  417. package/lib/types/components/skeleton/base-skeleton/BaseSkeleton.styles.d.ts +4 -4
  418. package/lib/types/components/slider/Slider.d.ts +0 -8
  419. package/lib/types/components/slider/Slider.styles.d.ts +14 -18
  420. package/lib/types/components/slider-button/SliderButton.d.ts +28 -1
  421. package/lib/types/components/slider-button/SliderButton.styles.d.ts +4 -6
  422. package/lib/types/components/tag-input/TagInput.d.ts +0 -4
  423. package/lib/types/components/tag-input/TagInput.styles.d.ts +2 -12
  424. package/lib/types/components/text-area/TextArea.d.ts +0 -4
  425. package/lib/types/components/text-area/TextArea.styles.d.ts +0 -1
  426. package/lib/types/components/truncation/Truncation.d.ts +0 -4
  427. package/lib/types/components/truncation/Truncation.styles.d.ts +2 -7
  428. package/lib/types/index.d.ts +1 -1
  429. package/lib/types/utils/file.d.ts +1 -1
  430. package/package.json +3 -3
  431. package/lib/cjs/components/list/list-item/useListItemFocus.js +0 -47
  432. package/lib/cjs/components/list/list-item/useListItemFocus.js.map +0 -1
  433. package/lib/cjs/components/slider-button/SliderButton.types.js +0 -6
  434. package/lib/cjs/components/slider-button/SliderButton.types.js.map +0 -1
  435. package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js +0 -66
  436. package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js.map +0 -1
  437. package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js +0 -47
  438. package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js.map +0 -1
  439. package/lib/cjs/hooks/useKeyboardFocusHighlighting.js +0 -68
  440. package/lib/cjs/hooks/useKeyboardFocusHighlighting.js.map +0 -1
  441. package/lib/cjs/utils/keyboardFocusHighlighting.styles.js +0 -30
  442. package/lib/cjs/utils/keyboardFocusHighlighting.styles.js.map +0 -1
  443. package/lib/esm/components/list/list-item/useListItemFocus.js +0 -40
  444. package/lib/esm/components/list/list-item/useListItemFocus.js.map +0 -1
  445. package/lib/esm/components/slider-button/SliderButton.types.js +0 -2
  446. package/lib/esm/components/slider-button/SliderButton.types.js.map +0 -1
  447. package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js +0 -56
  448. package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js.map +0 -1
  449. package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js +0 -38
  450. package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js.map +0 -1
  451. package/lib/esm/hooks/useKeyboardFocusHighlighting.js +0 -61
  452. package/lib/esm/hooks/useKeyboardFocusHighlighting.js.map +0 -1
  453. package/lib/esm/utils/keyboardFocusHighlighting.styles.js +0 -25
  454. package/lib/esm/utils/keyboardFocusHighlighting.styles.js.map +0 -1
  455. package/lib/types/components/list/list-item/useListItemFocus.d.ts +0 -13
  456. package/lib/types/components/slider-button/SliderButton.types.d.ts +0 -32
  457. package/lib/types/components/slider-button/useSliderButtonPopupKeyboard.d.ts +0 -17
  458. package/lib/types/components/slider-button/useSliderButtonThumbKeyboard.d.ts +0 -13
  459. package/lib/types/hooks/useKeyboardFocusHighlighting.d.ts +0 -5
  460. package/lib/types/utils/keyboardFocusHighlighting.styles.d.ts +0 -9
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.js","names":["useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBoxSize","getComboBoxWidthResult","useKeyboardFocusHighlighting","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","shouldCaptureEvents","selectedItem","onHide","onShow","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","size","NORMAL","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","shouldEnableKeyboardHighlighting","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","isInputFocused","styledComboBoxElementRef","comboBoxHeaderRef","comboBoxInputRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","areaProvider","calculatedMinWidth","calculatedBodyMinWidth","parentWidth","width","shouldChangeColor","shouldShowKeyboardHighlighting","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","restoreTriggerFocus","requestAnimationFrame","focus","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","placeholderImageUrl","imageUrl","placeholderIcon","icons","placeholderText","text","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","handleHeaderKeyDown","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","$direction","onClick","$isOpen","$isTouch","$size","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","$shouldShowKeyboardHighlighting","onKeyDown","role","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onBlur","onFocus","suffixElement","$shouldShowBorderLeft","anchorElement","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","className","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useFunctions, useValues } from 'chayns-api';\nimport React, {\n FocusEventHandler,\n KeyboardEventHandler,\n forwardRef,\n Fragment,\n useCallback,\n useContext,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxBody,\n StyledComboBoxClearIconWrapper,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPlaceholderText,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\nimport { ComboBoxProps, ComboBoxRef, ComboBoxSize, IComboBoxItem } from './ComboBox.types';\nimport { getComboBoxWidthResult } from './ComboBox.utils';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n (\n {\n bodyWidth,\n direction = DropdownDirection.RIGHT,\n isDisabled = false,\n lists,\n maxHeight = 280,\n onSelect,\n placeholder,\n prefix,\n container,\n shouldCaptureEvents,\n selectedItem,\n onHide,\n onShow,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundImage,\n onInputFocus,\n prefixMinWidth,\n size = ComboBoxSize.NORMAL,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n shouldShowTransparentBackground = false,\n inputValue,\n shouldDropDownUseMaxItemWidth = false,\n shouldEnableKeyboardHighlighting,\n },\n ref,\n ) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n\n const isInputFocused = useRef(false);\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const comboBoxHeaderRef = useRef<HTMLDivElement>(null);\n const comboBoxInputRef = useRef<HTMLInputElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const parentSize = useElementSize(styledComboBoxElementRef, {\n shouldUseParentElement: true,\n });\n\n const functions = useFunctions();\n const values = useValues();\n const isTouch = useIsTouch();\n const areaProvider = useContext(AreaContext);\n\n useEffect(() => {\n if (!parentSize) {\n return;\n }\n\n const { minWidth: calculatedMinWidth, bodyMinWidth: calculatedBodyMinWidth } =\n getComboBoxWidthResult({\n functions,\n internalSelectedItem,\n lists,\n parentWidth: parentSize.width,\n placeholder,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n });\n\n setMinWidth(calculatedMinWidth);\n setBodyMinWidth(calculatedBodyMinWidth);\n }, [\n functions,\n internalSelectedItem,\n lists,\n parentSize,\n placeholder,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n ]);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlighting && !isDisabled,\n );\n\n const shouldDisableActions = useMemo(() => {\n if (!selectedItem) {\n return false;\n }\n\n const combinedLists = lists.flatMap((list) => list.list);\n\n return (\n combinedLists.length === 1 &&\n combinedLists.some((item) => item.value === selectedItem.value)\n );\n }, [lists, selectedItem]);\n\n const contentHeight = useMemo(() => {\n const flatItems = lists.flatMap((list) => list.list);\n\n let height = flatItems.reduce((value, item) => {\n const isBigItem =\n shouldShowBigImage ||\n (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n return value + (isBigItem ? 56 : 38);\n }, 0);\n\n if (lists.length > 1) {\n height += lists.length * 38;\n }\n\n if (maxHeight < height) {\n height = maxHeight;\n }\n\n return height;\n }, [lists, maxHeight, shouldShowBigImage]);\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = true;\n onInputFocus?.(event);\n },\n [onInputFocus],\n );\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = false;\n onInputBlur?.(event);\n },\n [onInputBlur],\n );\n\n const handleOpen = useCallback(() => {\n if (typeof onShow === 'function') {\n onShow();\n }\n\n setIsAnimating(true);\n }, [onShow]);\n\n const handleClose = useCallback(() => {\n if (typeof onHide === 'function') {\n onHide();\n }\n\n setIsAnimating(false);\n }, [onHide]);\n\n const restoreTriggerFocus = useCallback(() => {\n // Delay is needed so focus happens after dropdown close/render cycle.\n requestAnimationFrame(() => {\n if (typeof inputValue === 'string') {\n comboBoxInputRef.current?.focus();\n return;\n }\n\n comboBoxHeaderRef.current?.focus();\n });\n }, [inputValue]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect?: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const onSelectResult = onSelect(itemToSelect);\n\n if (onSelectResult === false) {\n return;\n }\n\n if (onSelectResult instanceof Promise) {\n void onSelectResult.then((shouldPreventSelection) => {\n if (shouldPreventSelection) return;\n\n setInternalSelectedItem(itemToSelect);\n handleClose();\n restoreTriggerFocus();\n });\n\n return;\n }\n }\n\n setInternalSelectedItem(itemToSelect);\n handleClose();\n restoreTriggerFocus();\n },\n [handleClose, onSelect, restoreTriggerFocus],\n );\n\n const handleClear = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n\n handleSetSelectedItem(undefined);\n },\n [handleSetSelectedItem],\n );\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) return;\n\n if (e.key === 'Escape') {\n e.preventDefault();\n handleClose();\n restoreTriggerFocus();\n return;\n }\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n\n const children = contentRef.current?.children;\n\n if (!children || children.length === 0) return;\n\n const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n let newIndex = focusedIndex ?? -1;\n\n let attempts = 0;\n\n do {\n newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n const newElement = children[newIndex] as HTMLDivElement;\n\n let shouldSkip = false;\n\n if (\n newElement.id.startsWith('combobox-group--') ||\n newElement.id.endsWith('--disabled-item')\n ) {\n shouldSkip = true;\n }\n\n if (!shouldSkip) break;\n\n attempts++;\n } while (attempts < children.length);\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const focusedElement = children[newIndex] as HTMLDivElement;\n\n focusedElement.tabIndex = 0;\n focusedElement.focus();\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) return;\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n\n return !!newSelectedItem;\n });\n\n if (newSelectedItem) {\n handleSetSelectedItem(newSelectedItem);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [\n focusedIndex,\n handleClose,\n handleSetSelectedItem,\n isAnimating,\n lists,\n restoreTriggerFocus,\n ]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled && !isInputFocused.current) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n const handleHeaderKeyDown: KeyboardEventHandler<HTMLDivElement> = useCallback(\n (event) => {\n if (isDisabled || typeof inputValue === 'string') {\n return;\n }\n\n if (event.key === 'Escape' && isAnimating) {\n event.preventDefault();\n handleClose();\n restoreTriggerFocus();\n return;\n }\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n handleHeaderClick();\n }\n },\n [\n handleClose,\n handleHeaderClick,\n inputValue,\n isAnimating,\n isDisabled,\n restoreTriggerFocus,\n ],\n );\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleClose,\n show: handleOpen,\n }),\n [handleClose, handleOpen],\n );\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <Fragment key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n {list.groupName}\n </StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n <ComboBoxItem\n key={`item-${item.text}`}\n item={item}\n isSelected={\n selectedItem ? item.value === selectedItem.value : false\n }\n onSelect={handleSetSelectedItem}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={\n list.shouldShowRoundImage ?? shouldShowRoundImage\n }\n />\n ))}\n </Fragment>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n <StyledComboBoxHeader\n ref={comboBoxHeaderRef}\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $size={size}\n $shouldShowTransparentBackground={shouldShowTransparentBackground}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n onKeyDown={handleHeaderKeyDown}\n tabIndex={!isDisabled && typeof inputValue !== 'string' ? 0 : undefined}\n role={!isDisabled && typeof inputValue !== 'string' ? 'button' : undefined}\n aria-expanded={\n !isDisabled && typeof inputValue !== 'string' ? isAnimating : undefined\n }\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && (\n <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth}>\n {prefix}\n </StyledComboBoxPrefix>\n )}\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n ref={comboBoxInputRef}\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={handleInputBlur}\n onFocus={handleInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholderText>\n {placeholderText}\n </StyledComboBoxPlaceholderText>\n )}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n {shouldShowClearIcon && internalSelectedItem && (\n <StyledComboBoxClearIconWrapper\n $isDisabled={isDisabled}\n onClick={handleClear}\n >\n <Icon icons={['fa fa-times']} />\n </StyledComboBoxClearIconWrapper>\n )}\n {!shouldDisableActions && (\n <StyledComboBoxIconWrapper\n $isDisabled={isDisabled}\n $size={size}\n $shouldShowBorderLeft={\n shouldShowClearIcon === true &&\n internalSelectedItem !== undefined\n }\n >\n <Icon icons={['fa fa-chevron-down']} isDisabled={isDisabled} />\n </StyledComboBoxIconWrapper>\n )}\n </StyledComboBoxHeader>\n {styledComboBoxElementRef.current && (\n <DropdownBodyWrapper\n anchorElement={styledComboBoxElementRef.current}\n bodyWidth={bodyWidth}\n contentHeight={contentHeight}\n shouldCaptureEvents={shouldCaptureEvents}\n onClose={handleClose}\n direction={direction}\n container={container}\n shouldShowDropdown={isAnimating}\n minBodyWidth={bodyWidth ?? bodyMinWidth}\n >\n <StyledComboBoxBody\n $maxHeight={maxHeight}\n $minWidth={bodyWidth ?? bodyMinWidth}\n className=\"chayns-scrollbar\"\n ref={contentRef}\n tabIndex={0}\n >\n {comboBoxGroups}\n </StyledComboBoxBody>\n </DropdownBodyWrapper>\n )}\n </StyledComboBox>\n ),\n [\n bodyMinWidth,\n bodyWidth,\n comboBoxGroups,\n container,\n contentHeight,\n direction,\n handleClear,\n handleClose,\n handleHeaderClick,\n handleHeaderKeyDown,\n handleInputBlur,\n handleInputFocus,\n inputValue,\n internalSelectedItem,\n isAnimating,\n isDisabled,\n isTouch,\n maxHeight,\n minWidth,\n onInputChange,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldChangeColor,\n shouldDisableActions,\n shouldCaptureEvents,\n shouldShowKeyboardHighlighting,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundPlaceholderImage,\n shouldShowTransparentBackground,\n shouldUseFullWidth,\n size,\n ],\n );\n },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ComboBox.js","names":["useFunctions","useValues","React","forwardRef","Fragment","useCallback","useContext","useEffect","useImperativeHandle","useMemo","useRef","useState","useIsTouch","AreaContext","Icon","ComboBoxItem","StyledComboBox","StyledComboBoxBody","StyledComboBoxClearIconWrapper","StyledComboBoxHeader","StyledComboBoxIconWrapper","StyledComboBoxInput","StyledComboBoxPlaceholder","StyledComboBoxPlaceholderImage","StyledComboBoxPlaceholderText","StyledComboBoxPrefix","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxTopic","DropdownBodyWrapper","DropdownDirection","useElementSize","ComboBoxSize","getComboBoxWidthResult","ComboBox","bodyWidth","direction","RIGHT","isDisabled","lists","maxHeight","onSelect","placeholder","prefix","container","shouldCaptureEvents","selectedItem","onHide","onShow","shouldShowBigImage","shouldShowClearIcon","shouldShowRoundImage","onInputFocus","prefixMinWidth","size","NORMAL","shouldUseFullWidth","onInputChange","shouldUseCurrentItemWidth","onInputBlur","shouldShowTransparentBackground","inputValue","shouldDropDownUseMaxItemWidth","ref","internalSelectedItem","setInternalSelectedItem","isAnimating","setIsAnimating","minWidth","setMinWidth","undefined","bodyMinWidth","setBodyMinWidth","focusedIndex","setFocusedIndex","isInputFocused","styledComboBoxElementRef","contentRef","parentSize","shouldUseParentElement","functions","values","isTouch","areaProvider","calculatedMinWidth","calculatedBodyMinWidth","parentWidth","width","shouldChangeColor","shouldDisableActions","combinedLists","flatMap","list","length","some","item","value","contentHeight","flatItems","height","reduce","isBigItem","subtext","trim","handleInputFocus","event","current","handleInputBlur","handleOpen","handleClose","handleSetSelectedItem","itemToSelect","onSelectResult","Promise","then","shouldPreventSelection","handleClear","preventDefault","stopPropagation","handleKeyDown","e","key","children","stepDirection","newIndex","attempts","newElement","shouldSkip","id","startsWith","endsWith","prevElement","tabIndex","focusedElement","focus","element","newSelectedItem","find","String","replace","document","addEventListener","removeEventListener","placeholderImageUrl","imageUrl","placeholderIcon","icons","placeholderText","text","shouldShowRoundPlaceholderImage","selectedItemList","handleHeaderClick","hide","show","comboBoxGroups","map","createElement","groupName","isSelected","$minWidth","$shouldUseFullWidth","$direction","onClick","$isOpen","$isTouch","$size","$shouldShowTransparentBackground","$isDisabled","$shouldChangeColor","$shouldShowBigImage","$prefixMinWidth","$shouldReduceOpacity","src","$shouldShowRoundImage","disabled","onChange","onBlur","onFocus","suffixElement","$shouldShowBorderLeft","anchorElement","onClose","shouldShowDropdown","minBodyWidth","$maxHeight","className","displayName"],"sources":["../../../../src/components/combobox/ComboBox.tsx"],"sourcesContent":["import { useFunctions, useValues } from 'chayns-api';\nimport React, {\n FocusEventHandler,\n forwardRef,\n Fragment,\n useCallback,\n useContext,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useIsTouch } from '../../utils/environment';\nimport { AreaContext } from '../area-provider/AreaContextProvider';\nimport Icon from '../icon/Icon';\nimport ComboBoxItem from './combobox-item/ComboBoxItem';\nimport {\n StyledComboBox,\n StyledComboBoxBody,\n StyledComboBoxClearIconWrapper,\n StyledComboBoxHeader,\n StyledComboBoxIconWrapper,\n StyledComboBoxInput,\n StyledComboBoxPlaceholder,\n StyledComboBoxPlaceholderImage,\n StyledComboBoxPlaceholderText,\n StyledComboBoxPrefix,\n StyledComboBoxPrefixAndPlaceholderWrapper,\n StyledComboBoxTopic,\n} from './ComboBox.styles';\nimport DropdownBodyWrapper from '../dropdown-body-wrapper/DropdownBodyWrapper';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { useElementSize } from '../../hooks/element';\nimport { ComboBoxProps, ComboBoxRef, ComboBoxSize, IComboBoxItem } from './ComboBox.types';\nimport { getComboBoxWidthResult } from './ComboBox.utils';\n\nconst ComboBox = forwardRef<ComboBoxRef, ComboBoxProps>(\n (\n {\n bodyWidth,\n direction = DropdownDirection.RIGHT,\n isDisabled = false,\n lists,\n maxHeight = 280,\n onSelect,\n placeholder,\n prefix,\n container,\n shouldCaptureEvents,\n selectedItem,\n onHide,\n onShow,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundImage,\n onInputFocus,\n prefixMinWidth,\n size = ComboBoxSize.NORMAL,\n shouldUseFullWidth = false,\n onInputChange,\n shouldUseCurrentItemWidth = false,\n onInputBlur,\n shouldShowTransparentBackground = false,\n inputValue,\n shouldDropDownUseMaxItemWidth = false,\n },\n ref,\n ) => {\n const [internalSelectedItem, setInternalSelectedItem] = useState<IComboBoxItem>();\n const [isAnimating, setIsAnimating] = useState(false);\n const [minWidth, setMinWidth] = useState<number | undefined>(undefined);\n const [bodyMinWidth, setBodyMinWidth] = useState(0);\n const [focusedIndex, setFocusedIndex] = useState<number | null>(null);\n\n const isInputFocused = useRef(false);\n const styledComboBoxElementRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement | null>(null);\n\n const parentSize = useElementSize(styledComboBoxElementRef, {\n shouldUseParentElement: true,\n });\n\n const functions = useFunctions();\n const values = useValues();\n const isTouch = useIsTouch();\n const areaProvider = useContext(AreaContext);\n\n useEffect(() => {\n if (!parentSize) {\n return;\n }\n\n const { minWidth: calculatedMinWidth, bodyMinWidth: calculatedBodyMinWidth } =\n getComboBoxWidthResult({\n functions,\n internalSelectedItem,\n lists,\n parentWidth: parentSize.width,\n placeholder,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n });\n\n setMinWidth(calculatedMinWidth);\n setBodyMinWidth(calculatedBodyMinWidth);\n }, [\n functions,\n internalSelectedItem,\n lists,\n parentSize,\n placeholder,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldDropDownUseMaxItemWidth,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldUseCurrentItemWidth,\n shouldUseFullWidth,\n values,\n ]);\n\n const shouldChangeColor = useMemo(\n () => areaProvider.shouldChangeColor ?? false,\n [areaProvider.shouldChangeColor],\n );\n\n const shouldDisableActions = useMemo(() => {\n if (!selectedItem) {\n return false;\n }\n\n const combinedLists = lists.flatMap((list) => list.list);\n\n return (\n combinedLists.length === 1 &&\n combinedLists.some((item) => item.value === selectedItem.value)\n );\n }, [lists, selectedItem]);\n\n const contentHeight = useMemo(() => {\n const flatItems = lists.flatMap((list) => list.list);\n\n let height = flatItems.reduce((value, item) => {\n const isBigItem =\n shouldShowBigImage ||\n (typeof item.subtext === 'string' && item.subtext.trim() !== '');\n\n return value + (isBigItem ? 56 : 38);\n }, 0);\n\n if (lists.length > 1) {\n height += lists.length * 38;\n }\n\n if (maxHeight < height) {\n height = maxHeight;\n }\n\n return height;\n }, [lists, maxHeight, shouldShowBigImage]);\n\n const handleInputFocus: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = true;\n onInputFocus?.(event);\n },\n [onInputFocus],\n );\n\n const handleInputBlur: FocusEventHandler<HTMLInputElement> = useCallback(\n (event) => {\n isInputFocused.current = false;\n onInputBlur?.(event);\n },\n [onInputBlur],\n );\n\n const handleOpen = useCallback(() => {\n if (typeof onShow === 'function') {\n onShow();\n }\n\n setIsAnimating(true);\n }, [onShow]);\n\n const handleClose = useCallback(() => {\n if (typeof onHide === 'function') {\n onHide();\n }\n\n setIsAnimating(false);\n }, [onHide]);\n\n /**\n * This function sets the selected item\n */\n const handleSetSelectedItem = useCallback(\n (itemToSelect?: IComboBoxItem) => {\n if (typeof onSelect === 'function') {\n const onSelectResult = onSelect(itemToSelect);\n\n if (onSelectResult === false) {\n return;\n }\n\n if (onSelectResult instanceof Promise) {\n void onSelectResult.then((shouldPreventSelection) => {\n if (shouldPreventSelection) return;\n\n setInternalSelectedItem(itemToSelect);\n handleClose();\n });\n\n return;\n }\n }\n\n setInternalSelectedItem(itemToSelect);\n handleClose();\n },\n [handleClose, onSelect],\n );\n\n const handleClear = useCallback(\n (event: React.MouseEvent<HTMLDivElement>) => {\n event.preventDefault();\n event.stopPropagation();\n\n handleSetSelectedItem(undefined);\n },\n [handleSetSelectedItem],\n );\n\n useEffect(() => {\n const handleKeyDown = (e: KeyboardEvent) => {\n if (!isAnimating) return;\n\n if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {\n e.preventDefault();\n\n const children = contentRef.current?.children;\n\n if (!children || children.length === 0) return;\n\n const stepDirection = e.key === 'ArrowUp' ? -1 : 1;\n\n let newIndex = focusedIndex ?? -1;\n\n let attempts = 0;\n\n do {\n newIndex = (newIndex + stepDirection + children.length) % children.length;\n\n const newElement = children[newIndex] as HTMLDivElement;\n\n let shouldSkip = false;\n\n if (\n newElement.id.startsWith('combobox-group--') ||\n newElement.id.endsWith('--disabled-item')\n ) {\n shouldSkip = true;\n }\n\n if (!shouldSkip) break;\n\n attempts++;\n } while (attempts < children.length);\n\n if (focusedIndex !== null) {\n const prevElement = children[focusedIndex] as HTMLDivElement;\n\n prevElement.tabIndex = -1;\n }\n\n setFocusedIndex(newIndex);\n\n const focusedElement = children[newIndex] as HTMLDivElement;\n\n focusedElement.tabIndex = 0;\n focusedElement.focus();\n } else if (e.key === 'Enter' && focusedIndex !== null) {\n const element = contentRef.current?.children[focusedIndex];\n\n if (!element) return;\n\n const { id } = element;\n\n let newSelectedItem: IComboBoxItem | undefined;\n\n lists.some((list) => {\n newSelectedItem = list.list.find(\n ({ value }) => String(value) === id.replace('combobox-item__', ''),\n );\n\n return !!newSelectedItem;\n });\n\n if (newSelectedItem) {\n handleSetSelectedItem(newSelectedItem);\n }\n }\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => document.removeEventListener('keydown', handleKeyDown);\n }, [focusedIndex, handleSetSelectedItem, isAnimating, lists]);\n\n /**\n * This function sets the external selected item\n */\n useEffect(() => {\n setIsAnimating(false);\n setInternalSelectedItem(selectedItem);\n }, [selectedItem]);\n\n const placeholderImageUrl = useMemo(() => {\n if (selectedItem) {\n return selectedItem.imageUrl;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.imageUrl;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n const placeholderIcon = useMemo(() => {\n if (selectedItem) {\n return selectedItem.icons;\n }\n\n if (internalSelectedItem) {\n return internalSelectedItem.icons;\n }\n\n return undefined;\n }, [internalSelectedItem, selectedItem]);\n\n /**\n * This function resets the placeholder\n */\n const placeholderText = useMemo(() => {\n let text = placeholder;\n\n if (selectedItem) {\n text = selectedItem.text;\n } else if (internalSelectedItem) {\n text = internalSelectedItem.text;\n }\n\n return text;\n }, [internalSelectedItem, placeholder, selectedItem]);\n\n const shouldShowRoundPlaceholderImage = useMemo(() => {\n const selectedItemList = lists.find((list) =>\n list.list.some(\n ({ value }) => value === (selectedItem?.value ?? internalSelectedItem?.value),\n ),\n );\n\n return selectedItemList?.shouldShowRoundImage ?? shouldShowRoundImage;\n }, [internalSelectedItem?.value, lists, selectedItem?.value, shouldShowRoundImage]);\n\n /**\n * This function opens the content of the combobox\n */\n const handleHeaderClick = useCallback(() => {\n if (!isDisabled && !isInputFocused.current) {\n if (isAnimating) {\n handleClose();\n } else {\n handleOpen();\n }\n }\n }, [handleClose, handleOpen, isAnimating, isDisabled]);\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleClose,\n show: handleOpen,\n }),\n [handleClose, handleOpen],\n );\n\n const comboBoxGroups = useMemo(\n () =>\n lists.map((list) => (\n <Fragment key={list.groupName ?? 'default-group'}>\n {list.groupName && lists.length > 1 && (\n <StyledComboBoxTopic id={`combobox-group--${list.groupName}`}>\n {list.groupName}\n </StyledComboBoxTopic>\n )}\n {list.list.map((item) => (\n <ComboBoxItem\n key={`item-${item.text}`}\n item={item}\n isSelected={\n selectedItem ? item.value === selectedItem.value : false\n }\n onSelect={handleSetSelectedItem}\n shouldShowBigImage={shouldShowBigImage}\n shouldShowRoundImage={\n list.shouldShowRoundImage ?? shouldShowRoundImage\n }\n />\n ))}\n </Fragment>\n )),\n [handleSetSelectedItem, lists, selectedItem, shouldShowBigImage, shouldShowRoundImage],\n );\n\n return useMemo(\n () => (\n <StyledComboBox\n ref={styledComboBoxElementRef}\n $minWidth={minWidth}\n $shouldUseFullWidth={shouldUseFullWidth}\n >\n <StyledComboBoxHeader\n $direction={direction}\n onClick={handleHeaderClick}\n $isOpen={isAnimating}\n $isTouch={isTouch}\n $size={size}\n $shouldShowTransparentBackground={shouldShowTransparentBackground}\n $isDisabled={isDisabled}\n $shouldChangeColor={shouldChangeColor}\n $shouldShowBigImage={shouldShowBigImage}\n >\n <StyledComboBoxPrefixAndPlaceholderWrapper>\n {prefix && (\n <StyledComboBoxPrefix $prefixMinWidth={prefixMinWidth}>\n {prefix}\n </StyledComboBoxPrefix>\n )}\n <StyledComboBoxPlaceholder\n $shouldReduceOpacity={!selectedItem && !internalSelectedItem}\n >\n {placeholderImageUrl && (\n <StyledComboBoxPlaceholderImage\n src={placeholderImageUrl}\n $shouldShowBigImage={shouldShowBigImage}\n $shouldShowRoundImage={shouldShowRoundPlaceholderImage}\n />\n )}\n {placeholderIcon && <Icon icons={placeholderIcon} />}\n {typeof inputValue === 'string' ? (\n <StyledComboBoxInput\n disabled={isDisabled}\n value={inputValue}\n onChange={onInputChange}\n onBlur={handleInputBlur}\n onFocus={handleInputFocus}\n placeholder={placeholderText}\n />\n ) : (\n <StyledComboBoxPlaceholderText>\n {placeholderText}\n </StyledComboBoxPlaceholderText>\n )}\n {internalSelectedItem &&\n internalSelectedItem.suffixElement &&\n internalSelectedItem.suffixElement}\n </StyledComboBoxPlaceholder>\n </StyledComboBoxPrefixAndPlaceholderWrapper>\n {shouldShowClearIcon && internalSelectedItem && (\n <StyledComboBoxClearIconWrapper\n $isDisabled={isDisabled}\n onClick={handleClear}\n >\n <Icon icons={['fa fa-times']} />\n </StyledComboBoxClearIconWrapper>\n )}\n {!shouldDisableActions && (\n <StyledComboBoxIconWrapper\n $isDisabled={isDisabled}\n $size={size}\n $shouldShowBorderLeft={\n shouldShowClearIcon === true &&\n internalSelectedItem !== undefined\n }\n >\n <Icon icons={['fa fa-chevron-down']} isDisabled={isDisabled} />\n </StyledComboBoxIconWrapper>\n )}\n </StyledComboBoxHeader>\n {styledComboBoxElementRef.current && (\n <DropdownBodyWrapper\n anchorElement={styledComboBoxElementRef.current}\n bodyWidth={bodyWidth}\n contentHeight={contentHeight}\n shouldCaptureEvents={shouldCaptureEvents}\n onClose={handleClose}\n direction={direction}\n container={container}\n shouldShowDropdown={isAnimating}\n minBodyWidth={bodyWidth ?? bodyMinWidth}\n >\n <StyledComboBoxBody\n $maxHeight={maxHeight}\n $minWidth={bodyWidth ?? bodyMinWidth}\n className=\"chayns-scrollbar\"\n ref={contentRef}\n tabIndex={0}\n >\n {comboBoxGroups}\n </StyledComboBoxBody>\n </DropdownBodyWrapper>\n )}\n </StyledComboBox>\n ),\n [\n bodyMinWidth,\n bodyWidth,\n comboBoxGroups,\n container,\n contentHeight,\n direction,\n handleClear,\n handleClose,\n handleHeaderClick,\n handleInputBlur,\n handleInputFocus,\n inputValue,\n internalSelectedItem,\n isAnimating,\n isDisabled,\n isTouch,\n maxHeight,\n minWidth,\n onInputChange,\n placeholderIcon,\n placeholderImageUrl,\n placeholderText,\n prefix,\n prefixMinWidth,\n selectedItem,\n shouldChangeColor,\n shouldDisableActions,\n shouldCaptureEvents,\n shouldShowBigImage,\n shouldShowClearIcon,\n shouldShowRoundPlaceholderImage,\n shouldShowTransparentBackground,\n shouldUseFullWidth,\n size,\n ],\n );\n },\n);\n\nComboBox.displayName = 'ComboBox';\n\nexport default ComboBox;\n"],"mappings":"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","ignoreList":[]}
@@ -1,7 +1,6 @@
1
1
  import styled, { css } from 'styled-components';
2
2
  import { DropdownDirection } from '../../types/dropdown';
3
3
  import { ComboBoxSize } from './ComboBox.types';
4
- import { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';
5
4
  export const StyledComboBox = styled.div`
6
5
  min-width: 0;
7
6
  user-select: none;
@@ -116,16 +115,6 @@ export const StyledComboBoxHeader = styled.div`
116
115
  background-color: ${theme['secondary-102']};
117
116
  }
118
117
  `}
119
-
120
- ${({
121
- $shouldShowKeyboardHighlighting
122
- }) => $shouldShowKeyboardHighlighting && css`
123
- &:focus-visible,
124
- &:focus-within {
125
- transition: none;
126
- ${keyboardFocusHighlightingRingCss}
127
- }
128
- `}
129
118
  `;
130
119
  export const StyledComboBoxPlaceholder = styled.div`
131
120
  align-items: center;
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.styles.js","names":["styled","css","DropdownDirection","ComboBoxSize","keyboardFocusHighlightingRingCss","StyledComboBox","div","$shouldUseFullWidth","$minWidth","StyledComboBoxHeader","$isDisabled","$size","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","$shouldShowKeyboardHighlighting","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n $shouldShowKeyboardHighlighting: boolean;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${theme.colorMode === 'classic' || $shouldChangeColor\n ? theme['000']\n : theme['100']};\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n\n ${({ $shouldShowKeyboardHighlighting }) =>\n $shouldShowKeyboardHighlighting &&\n css`\n &:focus-visible,\n &:focus-within {\n transition: none;\n ${keyboardFocusHighlightingRingCss}\n }\n `}\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{ $shouldReduceOpacity: boolean }>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = { $isDisabled: boolean };\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ComboBox.styles.js","names":["styled","css","DropdownDirection","ComboBoxSize","StyledComboBox","div","$shouldUseFullWidth","$minWidth","StyledComboBoxHeader","$isDisabled","$size","SMALL","NORMAL","theme","$shouldShowTransparentBackground","$shouldChangeColor","colorMode","$shouldShowBigImage","$isOpen","$direction","BOTTOM","BOTTOM_LEFT","BOTTOM_RIGHT","includes","$isTouch","StyledComboBoxPlaceholder","text","$shouldReduceOpacity","StyledComboBoxPlaceholderText","StyledComboBoxPrefixAndPlaceholderWrapper","StyledComboBoxPrefix","$prefixMinWidth","StyledComboBoxInput","input","StyledComboBoxPlaceholderImage","img","$shouldShowRoundImage","StyledComboBoxClearIconWrapper","StyledComboBoxIconWrapper","$shouldShowBorderLeft","StyledComboBoxBody","$maxHeight","StyledComboBoxTopic"],"sources":["../../../../src/components/combobox/ComboBox.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport type { Theme, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { DropdownDirection } from '../../types/dropdown';\nimport { ComboBoxProps, ComboBoxSize } from './ComboBox.types';\n\ntype StyledComboBoxProps = WithTheme<{\n $minWidth?: number;\n $shouldUseFullWidth: ComboBoxProps['shouldUseFullWidth'];\n}>;\n\nexport const StyledComboBox = styled.div<StyledComboBoxProps>`\n min-width: 0;\n user-select: none;\n position: relative;\n\n ${({ $shouldUseFullWidth, $minWidth }) => {\n if ($shouldUseFullWidth) {\n return css`\n width: 100%;\n max-width: 100%;\n min-width: ${typeof $minWidth === 'number' ? `${$minWidth}px` : '0'};\n `;\n }\n\n if (typeof $minWidth === 'number') {\n return css`\n width: fit-content;\n max-width: 100%;\n min-width: ${$minWidth}px;\n `;\n }\n\n return css`\n width: fit-content;\n max-width: 100%;\n `;\n }}\n`;\n\ntype StyledComboBoxHeaderProps = WithTheme<{\n $isTouch: boolean;\n $isOpen: boolean;\n $direction: DropdownDirection;\n $isDisabled?: boolean;\n $shouldChangeColor: boolean;\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowTransparentBackground: boolean;\n $size: ComboBoxSize;\n}>;\n\nexport const StyledComboBoxHeader = styled.div<StyledComboBoxHeaderProps>`\n display: flex;\n min-width: 0;\n border: 1px solid transparent;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n justify-content: space-between;\n opacity: ${({ $isDisabled }) => ($isDisabled ? 0.5 : 1)};\n transition: background-color 0.2s ease-in-out;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 34px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n min-height: 42px;\n `;\n }\n }}\n\n ${({ theme, $shouldShowTransparentBackground, $shouldChangeColor }) => {\n if ($shouldShowTransparentBackground) {\n if (theme.colorMode === 'dark') {\n return css`\n border-color: rgba(255, 255, 255, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(0, 0, 0, 0.5);\n background-color: transparent;\n `;\n }\n\n return css`\n border-color: rgba(160, 160, 160, 0.3);\n background-color: ${theme.colorMode === 'classic' || $shouldChangeColor\n ? theme['000']\n : theme['100']};\n `;\n }}\n\n ${({ $shouldShowBigImage }) =>\n $shouldShowBigImage &&\n css`\n height: 42px;\n `}\n\n ${({ $isOpen, $direction }) => {\n if ($isOpen) {\n return [\n DropdownDirection.BOTTOM,\n DropdownDirection.BOTTOM_LEFT,\n DropdownDirection.BOTTOM_RIGHT,\n ].includes($direction)\n ? css`\n border-top-left-radius: 3px;\n border-top-right-radius: 3px;\n `\n : css`\n border-bottom-left-radius: 3px;\n border-bottom-right-radius: 3px;\n `;\n }\n\n return css`\n border-radius: 3px;\n `;\n }}\n\n ${({ $isTouch, $isDisabled, theme }: StyledComboBoxHeaderProps) =>\n !$isTouch &&\n !$isDisabled &&\n css`\n &:hover {\n background-color: ${theme['secondary-102']};\n }\n `}\n`;\n\ntype StyledComboBoxPlaceholderProps = WithTheme<{ $shouldReduceOpacity: boolean }>;\n\nexport const StyledComboBoxPlaceholder = styled.div<StyledComboBoxPlaceholderProps>`\n align-items: center;\n color: ${({ theme }: StyledComboBoxPlaceholderProps) => theme.text};\n display: flex;\n flex: 1 1 auto;\n gap: 10px;\n min-width: 0;\n opacity: ${({ $shouldReduceOpacity }) => ($shouldReduceOpacity ? 0.5 : 1)};\n`;\n\nexport const StyledComboBoxPlaceholderText = styled.div`\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n`;\n\nexport const StyledComboBoxPrefixAndPlaceholderWrapper = styled.div`\n align-items: center;\n display: flex;\n flex: 1 1 auto;\n min-width: 0;\n padding: 4px 10px;\n`;\n\ntype StyledComboBoxPrefixProps = {\n $prefixMinWidth?: number;\n};\n\nexport const StyledComboBoxPrefix = styled.div<StyledComboBoxPrefixProps>`\n flex: 0 0 auto;\n min-width: ${({ $prefixMinWidth }) => $prefixMinWidth ?? 0}px;\n padding-right: 5px;\n`;\n\nexport const StyledComboBoxInput = styled.input`\n color: ${({ theme }: { theme: Theme }) => theme.text};\n border: none;\n background-color: transparent;\n width: 100%;\n min-width: 0;\n`;\n\ntype StyledComboBoxPlaceholderImageProps = WithTheme<{\n $shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n $shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n}>;\n\nexport const StyledComboBoxPlaceholderImage = styled.img<StyledComboBoxPlaceholderImageProps>`\n box-shadow: 0 0 0 1px\n rgba(${({ theme }: StyledComboBoxPlaceholderImageProps) => theme['009-rgb']}, 0.15);\n height: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n width: ${({ $shouldShowBigImage }) => ($shouldShowBigImage ? '32px' : '22px')};\n\n ${({ $shouldShowRoundImage }) =>\n $shouldShowRoundImage &&\n css`\n border-radius: 50%;\n `}\n`;\n\ntype StyledComboBoxClearIconWrapperProps = { $isDisabled: boolean };\n\nexport const StyledComboBoxClearIconWrapper = styled.div<StyledComboBoxClearIconWrapperProps>`\n align-items: center;\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n height: 40px;\n justify-content: center;\n width: 40px;\n`;\n\ntype StyledComboBoxIconWrapperProps = {\n $shouldShowBorderLeft: boolean;\n $isDisabled: boolean;\n $size: ComboBoxSize;\n};\n\nexport const StyledComboBoxIconWrapper = styled.div<StyledComboBoxIconWrapperProps>`\n align-items: center;\n border-left: ${({ $shouldShowBorderLeft }) =>\n $shouldShowBorderLeft ? '1px solid rgba(160, 160, 160, 0.3)' : 'none'};\n cursor: ${({ $isDisabled }) => (!$isDisabled ? 'pointer' : 'default')};\n display: flex;\n flex: 0 0 auto;\n justify-content: center;\n width: 40px;\n\n ${({ $size }) => {\n switch ($size) {\n case ComboBoxSize.SMALL:\n return css`\n height: 30px;\n `;\n case ComboBoxSize.NORMAL:\n default:\n return css`\n height: 40px;\n `;\n }\n }}\n`;\n\ntype StyledComboBoxBodyProps = WithTheme<{\n $maxHeight: number;\n $minWidth: number;\n}>;\n\nexport const StyledComboBoxBody = styled.div<StyledComboBoxBodyProps>`\n display: flex;\n flex-direction: column;\n cursor: pointer;\n min-width: ${({ $minWidth }) => $minWidth}px;\n\n overflow-x: hidden;\n overflow-y: auto;\n\n max-height: ${({ $maxHeight }) => $maxHeight}px;\n`;\n\ntype StyledComboBoxTopicProps = WithTheme<unknown>;\n\nexport const StyledComboBoxTopic = styled.div`\n align-items: center;\n background-color: ${({ theme }: StyledComboBoxTopicProps) => theme['secondary-102']};\n color: rgba(${({ theme }: StyledComboBoxTopicProps) => theme['text-rgb']}, 0.65);\n cursor: default;\n display: flex;\n flex: 0 0 auto;\n font-weight: bold;\n min-height: 38px;\n line-height: normal;\n padding: 8px 10px;\n position: sticky;\n top: 0;\n z-index: 10;\n`;\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactHTML, ReactNode } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n /**\n * Hides the dropdown content.\n */\n hide: VoidFunction;\n /**\n * Shows the dropdown content.\n */\n show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n /**\n * Optional group label shown above the list.\n */\n groupName?: string;\n /**\n * The items that should be rendered inside the group.\n */\n list: Array<IComboBoxItem>;\n /**\n * Whether the items in this group should use round images.\n */\n shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n /**\n * The HTML tag that should be used for the text wrapper.\n */\n tagName?: keyof ReactHTML;\n /**\n * Additional inline styles applied to the text wrapper.\n */\n styles?: CSSPropertiesWithVars;\n /**\n * Additional class name applied to the text wrapper.\n */\n className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n /**\n * Optional icon classes rendered before the text.\n */\n icons?: string[];\n /**\n * Optional background style used for the image placeholder.\n */\n imageBackground?: CSSProperties['background'];\n /**\n * Optional image URL rendered for the item.\n */\n imageUrl?: string;\n /**\n * Whether the item should be disabled.\n */\n isDisabled?: boolean;\n /**\n * Optional element rendered on the right side of the item.\n */\n rightElement?: ReactNode;\n /**\n * Optional secondary text rendered below the main text.\n */\n subtext?: string;\n /**\n * Optional suffix element rendered after the text.\n */\n suffixElement?: ReactNode;\n /**\n * Main label of the item.\n */\n text: string;\n /**\n * Stable item value used for selection and matching.\n */\n value: string | number;\n /**\n * Optional text styling overrides for the item label.\n */\n textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n /**\n * Standard height and spacing.\n */\n NORMAL = 'normal',\n /**\n * Compact height and spacing.\n */\n SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n /**\n * The width of the body.\n * @default undefined\n */\n bodyWidth?: number;\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n * @default undefined\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n * @default DropdownDirection.RIGHT\n */\n direction?: DropdownDirection;\n /**\n * The value of the optional input.\n * @default undefined\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n * @default false\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n * @default 280\n */\n maxHeight?: number;\n /**\n * Function to be executed when the value of the optional input is changed.\n * @default undefined\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n * @default undefined\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input gets its focus.\n * @default undefined\n */\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n * @default undefined\n */\n onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n /**\n * Function to be executed when the content of the `ComboBox` is shown.\n * @default undefined\n */\n onShow?: () => void;\n /**\n * Function to be executed when the content of the `ComboBox` is hidden.\n * @default undefined\n */\n onHide?: () => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n * @default undefined\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n * @default undefined\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n * @default false\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n * @default false\n */\n shouldShowClearIcon?: boolean;\n /**\n * Whether the background should be transparent.\n * @default false\n */\n shouldShowTransparentBackground?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n * @default false\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n * @default false\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n * @default false\n */\n shouldUseFullWidth?: boolean;\n /**\n * If true, the dropdown will use the maximum width of the items.\n * @default false\n */\n shouldDropDownUseMaxItemWidth?: boolean;\n /**\n * Whether the outside events should be captured.\n * @default undefined\n */\n shouldCaptureEvents?: boolean;\n /**\n * The size of the ComboBox.\n * @default ComboBoxSize.NORMAL\n */\n size?: ComboBoxSize;\n /**\n * Enables the shared keyboard-only focus ring for the combobox header.\n * @default false\n */\n shouldEnableKeyboardHighlighting?: boolean;\n /**\n * Optional min width for the prefix element.\n * @default undefined\n */\n prefixMinWidth?: number;\n};\n"],"mappings":"AAIA;AACA;AACA;;AAYA;AACA;AACA;;AAgBA;AACA;AACA;;AAgBA;AACA;AACA;;AA4CA;AACA;AACA;AACA,WAAYA,YAAY,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;;AAWxB;AACA;AACA","ignoreList":[]}
1
+ {"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactHTML, ReactNode } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n /**\n * Hides the dropdown content.\n */\n hide: VoidFunction;\n /**\n * Shows the dropdown content.\n */\n show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n /**\n * Optional group label shown above the list.\n */\n groupName?: string;\n /**\n * The items that should be rendered inside the group.\n */\n list: Array<IComboBoxItem>;\n /**\n * Whether the items in this group should use round images.\n */\n shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n /**\n * The HTML tag that should be used for the text wrapper.\n */\n tagName?: keyof ReactHTML;\n /**\n * Additional inline styles applied to the text wrapper.\n */\n styles?: CSSPropertiesWithVars;\n /**\n * Additional class name applied to the text wrapper.\n */\n className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n /**\n * Optional icon classes rendered before the text.\n */\n icons?: string[];\n /**\n * Optional background style used for the image placeholder.\n */\n imageBackground?: CSSProperties['background'];\n /**\n * Optional image URL rendered for the item.\n */\n imageUrl?: string;\n /**\n * Whether the item should be disabled.\n */\n isDisabled?: boolean;\n /**\n * Optional element rendered on the right side of the item.\n */\n rightElement?: ReactNode;\n /**\n * Optional secondary text rendered below the main text.\n */\n subtext?: string;\n /**\n * Optional suffix element rendered after the text.\n */\n suffixElement?: ReactNode;\n /**\n * Main label of the item.\n */\n text: string;\n /**\n * Stable item value used for selection and matching.\n */\n value: string | number;\n /**\n * Optional text styling overrides for the item label.\n */\n textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n /**\n * Standard height and spacing.\n */\n NORMAL = 'normal',\n /**\n * Compact height and spacing.\n */\n SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n /**\n * The width of the body.\n * @default undefined\n */\n bodyWidth?: number;\n /**\n * The element where the content of the `ComboBox` should be rendered via React Portal.\n * @default undefined\n */\n container?: Element;\n /**\n * The direction in which the combobox should open.\n * @default DropdownDirection.RIGHT\n */\n direction?: DropdownDirection;\n /**\n * The value of the optional input.\n * @default undefined\n */\n inputValue?: string;\n /**\n * Whether the combobox should be disabled.\n * @default false\n */\n isDisabled?: boolean;\n /**\n * The list of the items that should be displayed.\n */\n lists: IComboBoxItems[];\n /**\n * The maximum height of the combobox content.\n * @default 280\n */\n maxHeight?: number;\n /**\n * Function to be executed when the value of the optional input is changed.\n * @default undefined\n */\n onInputChange?: ChangeEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input lost its focus.\n * @default undefined\n */\n onInputBlur?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function to be executed when the optional input gets its focus.\n * @default undefined\n */\n onInputFocus?: FocusEventHandler<HTMLInputElement>;\n /**\n * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n * @default undefined\n */\n onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n /**\n * Function to be executed when the content of the `ComboBox` is shown.\n * @default undefined\n */\n onShow?: () => void;\n /**\n * Function to be executed when the content of the `ComboBox` is hidden.\n * @default undefined\n */\n onHide?: () => void;\n /**\n * A text that should be displayed when no item is selected.\n */\n placeholder: string;\n /**\n * A prefix that should be displayed before the placeholder.\n * @default undefined\n */\n prefix?: string;\n /**\n * An item that should be preselected.\n * @default undefined\n */\n selectedItem?: IComboBoxItem;\n /**\n * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n * @default false\n */\n shouldShowBigImage?: boolean;\n /**\n * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n * @default false\n */\n shouldShowClearIcon?: boolean;\n /**\n * Whether the background should be transparent.\n * @default false\n */\n shouldShowTransparentBackground?: boolean;\n /**\n * If true, the images of the items are displayed in a round shape.\n * @default false\n */\n shouldShowRoundImage?: boolean;\n /**\n * Whether the width of the ComboBox should be the width of the current item.\n * @default false\n */\n shouldUseCurrentItemWidth?: boolean;\n /**\n * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n * @default false\n */\n shouldUseFullWidth?: boolean;\n /**\n * If true, the dropdown will use the maximum width of the items.\n * @default false\n */\n shouldDropDownUseMaxItemWidth?: boolean;\n /**\n * Whether the outside events should be captured.\n * @default undefined\n */\n shouldCaptureEvents?: boolean;\n /**\n * The size of the ComboBox.\n * @default ComboBoxSize.NORMAL\n */\n size?: ComboBoxSize;\n /**\n * Optional min width for the prefix element.\n * @default undefined\n */\n prefixMinWidth?: number;\n};\n"],"mappings":"AAIA;AACA;AACA;;AAYA;AACA;AACA;;AAgBA;AACA;AACA;;AAgBA;AACA;AACA;;AA4CA;AACA;AACA;AACA,WAAYA,YAAY,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;;AAWxB;AACA;AACA","ignoreList":[]}
@@ -9,7 +9,6 @@ import ContextMenuContent from './context-menu-content/ContextMenuContent';
9
9
  import { StyledContextMenu } from './ContextMenu.styles';
10
10
  import { ContextMenuAlignment } from './ContextMenu.types';
11
11
  import { getDefaultFocusedIndex } from './ContextMenu.utils';
12
- import { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';
13
12
  const ContextMenu = /*#__PURE__*/forwardRef(({
14
13
  alignment,
15
14
  className,
@@ -27,7 +26,6 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
27
26
  shouldDisableClick = false,
28
27
  shouldHidePopupArrow = false,
29
28
  shouldShowHoverEffect = false,
30
- shouldEnableKeyboardHighlighting,
31
29
  shouldUseDefaultTriggerStyles = true,
32
30
  style,
33
31
  yOffset = 0,
@@ -43,16 +41,10 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
43
41
  const [isContentShown, setIsContentShown] = useState(false);
44
42
  const [portal, setPortal] = useState();
45
43
  const [isHovered, setIsHovered] = useState(false);
46
- const [shouldUseFocusableWrapper, setShouldUseFocusableWrapper] = useState(false);
47
44
  const uuid = useUuid();
48
45
  const contextMenuContentRef = useRef(null);
49
46
  const contextMenuRef = useRef(null);
50
- const shouldSkipNextContextMenuOpenRef = useRef(false);
51
- const shouldPreventNextNativeContextMenuRef = useRef(false);
52
47
  const isTouch = useIsTouch();
53
- const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(shouldEnableKeyboardHighlighting && !shouldDisableClick);
54
- const shouldShowWrapperKeyboardHighlighting = shouldShowKeyboardHighlighting && shouldUseFocusableWrapper;
55
- const shouldUseKeyboardFocusableWrapper = shouldUseFocusableWrapper && !shouldDisableClick;
56
48
  useEffect(() => {
57
49
  if (isContentShown) {
58
50
  setFocusedIndex(getDefaultFocusedIndex(items));
@@ -169,87 +161,17 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
169
161
  event.stopPropagation();
170
162
  void handleShow();
171
163
  }, [handleShow, shouldDisableClick]);
172
- const handleKeyDown = useCallback(event => {
173
- if (shouldDisableClick) {
174
- return;
175
- }
176
- const isContextMenuShortcut = event.key === 'ContextMenu' || event.key === 'F10' && event.shiftKey;
177
- const isActivationKey = event.key === 'Enter' || event.key === ' ' || event.key === 'Spacebar';
178
- if (isContextMenuShortcut) {
179
- event.preventDefault();
180
- event.stopPropagation();
181
- shouldSkipNextContextMenuOpenRef.current = true;
182
- void handleShow();
183
- return;
184
- }
185
- if (shouldUseFocusableWrapper && isActivationKey) {
186
- event.preventDefault();
187
- event.stopPropagation();
188
- void handleShow();
189
- }
190
- }, [handleShow, shouldDisableClick, shouldUseFocusableWrapper]);
191
- const handleContextMenu = useCallback(event => {
192
- event.preventDefault();
193
- event.stopPropagation();
194
- if (shouldDisableClick) {
164
+ const handleDocumentClick = useCallback(event => {
165
+ if (!shouldCloseOnPopupClick && contextMenuContentRef.current?.contains(event.target)) {
195
166
  return;
196
167
  }
197
- if (shouldSkipNextContextMenuOpenRef.current) {
198
- shouldSkipNextContextMenuOpenRef.current = false;
199
- return;
200
- }
201
- void handleShow();
202
- }, [handleShow, shouldDisableClick]);
203
- useEffect(() => {
204
- const handleGlobalKeyDown = event => {
205
- if (shouldDisableClick || !contextMenuRef.current) {
206
- return;
207
- }
208
- const isContextMenuShortcut = event.key === 'ContextMenu' || event.key === 'F10' && event.shiftKey;
209
- if (!isContextMenuShortcut) {
210
- return;
211
- }
212
- const {
213
- activeElement
214
- } = document;
215
- if (!(activeElement instanceof HTMLElement) || activeElement === document.body || activeElement === document.documentElement) {
216
- return;
217
- }
218
- const shouldOpenFromFocusedParent = activeElement.contains(contextMenuRef.current) && !contextMenuRef.current.contains(activeElement);
219
- if (!shouldOpenFromFocusedParent) {
220
- return;
221
- }
222
- event.preventDefault();
223
- event.stopPropagation();
224
- shouldPreventNextNativeContextMenuRef.current = true;
225
- void handleShow();
226
- };
227
- const handleNativeContextMenuCapture = event => {
228
- if (!shouldPreventNextNativeContextMenuRef.current) {
229
- return;
230
- }
231
- shouldPreventNextNativeContextMenuRef.current = false;
232
- event.preventDefault();
233
- event.stopPropagation();
234
- };
235
- document.addEventListener('keydown', handleGlobalKeyDown, true);
236
- document.addEventListener('contextmenu', handleNativeContextMenuCapture, true);
237
- return () => {
238
- document.removeEventListener('keydown', handleGlobalKeyDown, true);
239
- document.removeEventListener('contextmenu', handleNativeContextMenuCapture, true);
240
- };
241
- }, [handleShow, shouldDisableClick]);
168
+ handleHide();
169
+ }, [handleHide, shouldCloseOnPopupClick]);
242
170
  useImperativeHandle(ref, () => ({
243
171
  hide: handleHide,
244
172
  show: handleShow
245
173
  }), [handleHide, handleShow]);
246
174
  useEffect(() => {
247
- const handleDocumentClick = event => {
248
- if (!shouldCloseOnPopupClick && contextMenuContentRef.current?.contains(event.target)) {
249
- return;
250
- }
251
- handleHide();
252
- };
253
175
  if (isContentShown) {
254
176
  document.addEventListener('click', handleDocumentClick, true);
255
177
  window.addEventListener('blur', handleHide);
@@ -263,7 +185,7 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
263
185
  document.removeEventListener('click', handleDocumentClick, true);
264
186
  window.removeEventListener('blur', handleHide);
265
187
  };
266
- }, [handleHide, isContentShown, onHide, onShow, shouldCloseOnPopupClick]);
188
+ }, [handleDocumentClick, handleHide, isContentShown, onHide, onShow]);
267
189
  useEffect(() => {
268
190
  if (!newContainer) {
269
191
  return;
@@ -296,29 +218,13 @@ const ContextMenu = /*#__PURE__*/forwardRef(({
296
218
  }
297
219
  })), newContainer));
298
220
  }, [alignment, newContainer, coordinates, internalAlignment, internalCoordinates, isContentShown, items, uuid, zIndex, shouldHidePopupArrow, headline, focusedIndex, handleHide]);
299
- useEffect(() => {
300
- if (!contextMenuRef.current) {
301
- return;
302
- }
303
- const focusableChildSelector = 'button:not([disabled]), a[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), [contenteditable="true"]';
304
- const hasFocusableChild = Boolean(contextMenuRef.current.querySelector(focusableChildSelector));
305
- setShouldUseFocusableWrapper(!hasFocusableChild);
306
- }, [children]);
307
221
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(StyledContextMenu, {
308
222
  className: className ? `beta-chayns-context-menu ${className}` : 'beta-chayns-context-menu',
309
223
  $isActive: isContentShown && shouldShowHoverEffect,
310
224
  $shouldAddHoverEffect: !isTouch && shouldShowHoverEffect,
311
- $shouldShowWrapperKeyboardHighlighting: shouldShowWrapperKeyboardHighlighting,
312
225
  $shouldUseDefaultTriggerStyles: shouldUseDefaultTriggerStyles,
313
226
  onClick: handleClick,
314
- onContextMenuCapture: handleContextMenu,
315
- onContextMenu: handleContextMenu,
316
- onKeyDown: handleKeyDown,
317
227
  ref: contextMenuRef,
318
- tabIndex: shouldUseKeyboardFocusableWrapper ? 0 : undefined,
319
- role: shouldUseKeyboardFocusableWrapper ? 'button' : undefined,
320
- "aria-haspopup": shouldUseKeyboardFocusableWrapper ? 'menu' : undefined,
321
- "aria-expanded": shouldUseKeyboardFocusableWrapper ? isContentShown : undefined,
322
228
  style: style
323
229
  }, children), portal);
324
230
  });