@chayns-components/core 5.3.9 → 5.3.11-alpha.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 (495) hide show
  1. package/AGENTS.md +73 -2
  2. package/lib/cjs/components/accordion/Accordion.js +107 -12
  3. package/lib/cjs/components/accordion/Accordion.js.map +1 -1
  4. package/lib/cjs/components/accordion/Accordion.styles.js +23 -3
  5. package/lib/cjs/components/accordion/Accordion.styles.js.map +1 -1
  6. package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js +3 -1
  7. package/lib/cjs/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
  8. package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js +36 -19
  9. package/lib/cjs/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
  10. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js +6 -3
  11. package/lib/cjs/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  12. package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js +14 -0
  13. package/lib/cjs/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
  14. package/lib/cjs/components/amount-control/AmountControl.js +31 -17
  15. package/lib/cjs/components/amount-control/AmountControl.js.map +1 -1
  16. package/lib/cjs/components/amount-control/AmountControl.styles.js +18 -2
  17. package/lib/cjs/components/amount-control/AmountControl.styles.js.map +1 -1
  18. package/lib/cjs/components/button/Button.js +5 -1
  19. package/lib/cjs/components/button/Button.js.map +1 -1
  20. package/lib/cjs/components/button/Button.styles.js +17 -0
  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 +5 -1
  24. package/lib/cjs/components/checkbox/Checkbox.js.map +1 -1
  25. package/lib/cjs/components/checkbox/Checkbox.styles.js +29 -2
  26. package/lib/cjs/components/checkbox/Checkbox.styles.js.map +1 -1
  27. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js +7 -2
  28. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
  29. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js +8 -2
  30. package/lib/cjs/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
  31. package/lib/cjs/components/combobox/ComboBox.js +52 -5
  32. package/lib/cjs/components/combobox/ComboBox.js.map +1 -1
  33. package/lib/cjs/components/combobox/ComboBox.styles.js +11 -0
  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 +100 -6
  37. package/lib/cjs/components/context-menu/ContextMenu.js.map +1 -1
  38. package/lib/cjs/components/context-menu/ContextMenu.styles.js +38 -0
  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 +4 -2
  42. package/lib/cjs/components/file-input/FileInput.js.map +1 -1
  43. package/lib/cjs/components/file-list/file-item/FileItem.js +23 -2
  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 +19 -1
  46. package/lib/cjs/components/file-list/file-item/FileItem.styles.js.map +1 -1
  47. package/lib/cjs/components/file-select/FileSelect.js +27 -4
  48. package/lib/cjs/components/file-select/FileSelect.js.map +1 -1
  49. package/lib/cjs/components/file-select/FileSelect.styles.js +10 -0
  50. package/lib/cjs/components/file-select/FileSelect.styles.js.map +1 -1
  51. package/lib/cjs/components/filter/Filter.js +51 -16
  52. package/lib/cjs/components/filter/Filter.js.map +1 -1
  53. package/lib/cjs/components/filter/Filter.styles.js +9 -0
  54. package/lib/cjs/components/filter/Filter.styles.js.map +1 -1
  55. package/lib/cjs/components/filter/filter-content/FilterContent.js +14 -5
  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 +69 -4
  59. package/lib/cjs/components/filter-buttons/FilterButtons.js.map +1 -1
  60. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.js +40 -2
  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 +11 -0
  63. package/lib/cjs/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
  64. package/lib/cjs/components/grid-image/GridImage.js +20 -2
  65. package/lib/cjs/components/grid-image/GridImage.js.map +1 -1
  66. package/lib/cjs/components/grid-image/GridImage.styles.js +11 -2
  67. package/lib/cjs/components/grid-image/GridImage.styles.js.map +1 -1
  68. package/lib/cjs/components/grouped-image/GroupedImage.js +23 -4
  69. package/lib/cjs/components/grouped-image/GroupedImage.js.map +1 -1
  70. package/lib/cjs/components/grouped-image/GroupedImage.styles.js +9 -0
  71. package/lib/cjs/components/grouped-image/GroupedImage.styles.js.map +1 -1
  72. package/lib/cjs/components/highlight-slider/HighlightSlider.js +10 -3
  73. package/lib/cjs/components/highlight-slider/HighlightSlider.js.map +1 -1
  74. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +21 -4
  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 +11 -2
  77. package/lib/cjs/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
  78. package/lib/cjs/components/icon/Icon.js +24 -5
  79. package/lib/cjs/components/icon/Icon.js.map +1 -1
  80. package/lib/cjs/components/icon/Icon.styles.js +23 -0
  81. package/lib/cjs/components/icon/Icon.styles.js.map +1 -1
  82. package/lib/cjs/components/input/Input.js +29 -8
  83. package/lib/cjs/components/input/Input.js.map +1 -1
  84. package/lib/cjs/components/input/Input.styles.js +33 -3
  85. package/lib/cjs/components/input/Input.styles.js.map +1 -1
  86. package/lib/cjs/components/list/List.js +124 -37
  87. package/lib/cjs/components/list/List.js.map +1 -1
  88. package/lib/cjs/components/list/List.utils.js +107 -1
  89. package/lib/cjs/components/list/List.utils.js.map +1 -1
  90. package/lib/cjs/components/list/list-item/ListItem.js +82 -3
  91. package/lib/cjs/components/list/list-item/ListItem.js.map +1 -1
  92. package/lib/cjs/components/list/list-item/ListItem.styles.js +9 -0
  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 +40 -5
  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 +5 -1
  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 +32 -1
  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 +32 -1
  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 +30 -1
  103. package/lib/cjs/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
  104. package/lib/cjs/components/list/list-item/useListItemFocus.js +47 -0
  105. package/lib/cjs/components/list/list-item/useListItemFocus.js.map +1 -0
  106. package/lib/cjs/components/masonry/Masonry.context.js +17 -0
  107. package/lib/cjs/components/masonry/Masonry.context.js.map +1 -0
  108. package/lib/cjs/components/masonry/Masonry.hooks.js +53 -0
  109. package/lib/cjs/components/masonry/Masonry.hooks.js.map +1 -0
  110. package/lib/cjs/components/masonry/Masonry.js +81 -0
  111. package/lib/cjs/components/masonry/Masonry.js.map +1 -0
  112. package/lib/cjs/components/masonry/Masonry.styles.js +16 -0
  113. package/lib/cjs/components/masonry/Masonry.styles.js.map +1 -0
  114. package/lib/cjs/components/masonry/Masonry.types.js +6 -0
  115. package/lib/cjs/components/masonry/Masonry.types.js.map +1 -0
  116. package/lib/cjs/components/masonry/Masonry.utils.js +121 -0
  117. package/lib/cjs/components/masonry/Masonry.utils.js.map +1 -0
  118. package/lib/cjs/components/masonry/masonry-item/MasonryItem.js +77 -0
  119. package/lib/cjs/components/masonry/masonry-item/MasonryItem.js.map +1 -0
  120. package/lib/cjs/components/masonry/masonry-item/MasonryItem.styles.js +17 -0
  121. package/lib/cjs/components/masonry/masonry-item/MasonryItem.styles.js.map +1 -0
  122. package/lib/cjs/components/mention-finder/MentionFinder.js +31 -2
  123. package/lib/cjs/components/mention-finder/MentionFinder.js.map +1 -1
  124. package/lib/cjs/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  125. package/lib/cjs/components/multi-action-button/MultiActionButton.js +36 -3
  126. package/lib/cjs/components/multi-action-button/MultiActionButton.js.map +1 -1
  127. package/lib/cjs/components/multi-action-button/MultiActionButton.types.js.map +1 -1
  128. package/lib/cjs/components/multi-action-button/action-button/ActionButton.js +7 -1
  129. package/lib/cjs/components/multi-action-button/action-button/ActionButton.js.map +1 -1
  130. package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js +12 -0
  131. package/lib/cjs/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
  132. package/lib/cjs/components/number-input/NumberInput.js +13 -10
  133. package/lib/cjs/components/number-input/NumberInput.js.map +1 -1
  134. package/lib/cjs/components/page-provider/PageProvider.js +4 -2
  135. package/lib/cjs/components/page-provider/PageProvider.js.map +1 -1
  136. package/lib/cjs/components/popup/Popup.js +8 -1
  137. package/lib/cjs/components/popup/Popup.js.map +1 -1
  138. package/lib/cjs/components/radio-button/RadioButton.js +29 -15
  139. package/lib/cjs/components/radio-button/RadioButton.js.map +1 -1
  140. package/lib/cjs/components/radio-button/RadioButton.styles.js +19 -8
  141. package/lib/cjs/components/radio-button/RadioButton.styles.js.map +1 -1
  142. package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js +7 -4
  143. package/lib/cjs/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
  144. package/lib/cjs/components/search-box/SearchBox.js +5 -2
  145. package/lib/cjs/components/search-box/SearchBox.js.map +1 -1
  146. package/lib/cjs/components/search-input/SearchInput.js +40 -41
  147. package/lib/cjs/components/search-input/SearchInput.js.map +1 -1
  148. package/lib/cjs/components/search-input/SearchInput.styles.js +25 -2
  149. package/lib/cjs/components/search-input/SearchInput.styles.js.map +1 -1
  150. package/lib/cjs/components/select-button/SelectButton.js +4 -2
  151. package/lib/cjs/components/select-button/SelectButton.js.map +1 -1
  152. package/lib/cjs/components/setup-wizard/SetupWizard.js +7 -4
  153. package/lib/cjs/components/setup-wizard/SetupWizard.js.map +1 -1
  154. package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +5 -3
  155. package/lib/cjs/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
  156. package/lib/cjs/components/sharing-bar/SharingBar.js +31 -6
  157. package/lib/cjs/components/sharing-bar/SharingBar.js.map +1 -1
  158. package/lib/cjs/components/sharing-bar/SharingBar.styles.js +5 -0
  159. package/lib/cjs/components/sharing-bar/SharingBar.styles.js.map +1 -1
  160. package/lib/cjs/components/sharing-button/SharingButton.js +4 -2
  161. package/lib/cjs/components/sharing-button/SharingButton.js.map +1 -1
  162. package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js +3 -1
  163. package/lib/cjs/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
  164. package/lib/cjs/components/signature/Signature.js +6 -3
  165. package/lib/cjs/components/signature/Signature.js.map +1 -1
  166. package/lib/cjs/components/slider/Slider.js +30 -7
  167. package/lib/cjs/components/slider/Slider.js.map +1 -1
  168. package/lib/cjs/components/slider/Slider.styles.js +9 -2
  169. package/lib/cjs/components/slider/Slider.styles.js.map +1 -1
  170. package/lib/cjs/components/slider-button/SliderButton.js +63 -6
  171. package/lib/cjs/components/slider-button/SliderButton.js.map +1 -1
  172. package/lib/cjs/components/slider-button/SliderButton.styles.js +19 -2
  173. package/lib/cjs/components/slider-button/SliderButton.styles.js.map +1 -1
  174. package/lib/cjs/components/slider-button/SliderButton.types.js +6 -0
  175. package/lib/cjs/components/slider-button/SliderButton.types.js.map +1 -0
  176. package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js +66 -0
  177. package/lib/cjs/components/slider-button/useSliderButtonPopupKeyboard.js.map +1 -0
  178. package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js +47 -0
  179. package/lib/cjs/components/slider-button/useSliderButtonThumbKeyboard.js.map +1 -0
  180. package/lib/cjs/components/tag-input/TagInput.js +91 -36
  181. package/lib/cjs/components/tag-input/TagInput.js.map +1 -1
  182. package/lib/cjs/components/tag-input/TagInput.styles.js +31 -3
  183. package/lib/cjs/components/tag-input/TagInput.styles.js.map +1 -1
  184. package/lib/cjs/components/text-area/TextArea.js +17 -8
  185. package/lib/cjs/components/text-area/TextArea.js.map +1 -1
  186. package/lib/cjs/components/text-area/TextArea.styles.js +15 -1
  187. package/lib/cjs/components/text-area/TextArea.styles.js.map +1 -1
  188. package/lib/cjs/components/truncation/Truncation.js +17 -3
  189. package/lib/cjs/components/truncation/Truncation.js.map +1 -1
  190. package/lib/cjs/components/truncation/Truncation.styles.js +19 -1
  191. package/lib/cjs/components/truncation/Truncation.styles.js.map +1 -1
  192. package/lib/cjs/hooks/useKeyboardFocusHighlighting.js +68 -0
  193. package/lib/cjs/hooks/useKeyboardFocusHighlighting.js.map +1 -0
  194. package/lib/cjs/index.js +7 -0
  195. package/lib/cjs/index.js.map +1 -1
  196. package/lib/cjs/utils/file.js.map +1 -1
  197. package/lib/cjs/utils/keyboardFocusHighlighting.styles.js +30 -0
  198. package/lib/cjs/utils/keyboardFocusHighlighting.styles.js.map +1 -0
  199. package/lib/esm/components/accordion/Accordion.js +105 -12
  200. package/lib/esm/components/accordion/Accordion.js.map +1 -1
  201. package/lib/esm/components/accordion/Accordion.styles.js +23 -3
  202. package/lib/esm/components/accordion/Accordion.styles.js.map +1 -1
  203. package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js +3 -1
  204. package/lib/esm/components/accordion/accordion-body/AccordionBody.styles.js.map +1 -1
  205. package/lib/esm/components/accordion/accordion-group/AccordionGroup.js +33 -19
  206. package/lib/esm/components/accordion/accordion-group/AccordionGroup.js.map +1 -1
  207. package/lib/esm/components/accordion/accordion-head/AccordionHead.js +6 -3
  208. package/lib/esm/components/accordion/accordion-head/AccordionHead.js.map +1 -1
  209. package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js +14 -0
  210. package/lib/esm/components/accordion/accordion-head/AccordionHead.styles.js.map +1 -1
  211. package/lib/esm/components/amount-control/AmountControl.js +30 -16
  212. package/lib/esm/components/amount-control/AmountControl.js.map +1 -1
  213. package/lib/esm/components/amount-control/AmountControl.styles.js +18 -2
  214. package/lib/esm/components/amount-control/AmountControl.styles.js.map +1 -1
  215. package/lib/esm/components/button/Button.js +5 -1
  216. package/lib/esm/components/button/Button.js.map +1 -1
  217. package/lib/esm/components/button/Button.styles.js +17 -0
  218. package/lib/esm/components/button/Button.styles.js.map +1 -1
  219. package/lib/esm/components/button/Button.types.js.map +1 -1
  220. package/lib/esm/components/checkbox/Checkbox.js +5 -1
  221. package/lib/esm/components/checkbox/Checkbox.js.map +1 -1
  222. package/lib/esm/components/checkbox/Checkbox.styles.js +29 -2
  223. package/lib/esm/components/checkbox/Checkbox.styles.js.map +1 -1
  224. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js +7 -2
  225. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.js.map +1 -1
  226. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js +8 -2
  227. package/lib/esm/components/color-scheme-provider/ColorSchemeProvider.styles.js.map +1 -1
  228. package/lib/esm/components/combobox/ComboBox.js +50 -5
  229. package/lib/esm/components/combobox/ComboBox.js.map +1 -1
  230. package/lib/esm/components/combobox/ComboBox.styles.js +11 -0
  231. package/lib/esm/components/combobox/ComboBox.styles.js.map +1 -1
  232. package/lib/esm/components/combobox/ComboBox.types.js.map +1 -1
  233. package/lib/esm/components/context-menu/ContextMenu.js +99 -5
  234. package/lib/esm/components/context-menu/ContextMenu.js.map +1 -1
  235. package/lib/esm/components/context-menu/ContextMenu.styles.js +38 -0
  236. package/lib/esm/components/context-menu/ContextMenu.styles.js.map +1 -1
  237. package/lib/esm/components/context-menu/ContextMenu.types.js.map +1 -1
  238. package/lib/esm/components/file-input/FileInput.js +4 -2
  239. package/lib/esm/components/file-input/FileInput.js.map +1 -1
  240. package/lib/esm/components/file-list/file-item/FileItem.js +24 -3
  241. package/lib/esm/components/file-list/file-item/FileItem.js.map +1 -1
  242. package/lib/esm/components/file-list/file-item/FileItem.styles.js +18 -0
  243. package/lib/esm/components/file-list/file-item/FileItem.styles.js.map +1 -1
  244. package/lib/esm/components/file-select/FileSelect.js +27 -4
  245. package/lib/esm/components/file-select/FileSelect.js.map +1 -1
  246. package/lib/esm/components/file-select/FileSelect.styles.js +10 -0
  247. package/lib/esm/components/file-select/FileSelect.styles.js.map +1 -1
  248. package/lib/esm/components/filter/Filter.js +52 -16
  249. package/lib/esm/components/filter/Filter.js.map +1 -1
  250. package/lib/esm/components/filter/Filter.styles.js +9 -0
  251. package/lib/esm/components/filter/Filter.styles.js.map +1 -1
  252. package/lib/esm/components/filter/filter-content/FilterContent.js +15 -5
  253. package/lib/esm/components/filter/filter-content/FilterContent.js.map +1 -1
  254. package/lib/esm/components/filter/filter-content/FilterContent.types.js.map +1 -1
  255. package/lib/esm/components/filter-buttons/FilterButtons.js +69 -5
  256. package/lib/esm/components/filter-buttons/FilterButtons.js.map +1 -1
  257. package/lib/esm/components/filter-buttons/filter-button/FilterButton.js +40 -2
  258. package/lib/esm/components/filter-buttons/filter-button/FilterButton.js.map +1 -1
  259. package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js +11 -0
  260. package/lib/esm/components/filter-buttons/filter-button/FilterButton.styles.js.map +1 -1
  261. package/lib/esm/components/grid-image/GridImage.js +20 -2
  262. package/lib/esm/components/grid-image/GridImage.js.map +1 -1
  263. package/lib/esm/components/grid-image/GridImage.styles.js +10 -1
  264. package/lib/esm/components/grid-image/GridImage.styles.js.map +1 -1
  265. package/lib/esm/components/grouped-image/GroupedImage.js +22 -4
  266. package/lib/esm/components/grouped-image/GroupedImage.js.map +1 -1
  267. package/lib/esm/components/grouped-image/GroupedImage.styles.js +9 -0
  268. package/lib/esm/components/grouped-image/GroupedImage.styles.js.map +1 -1
  269. package/lib/esm/components/highlight-slider/HighlightSlider.js +10 -3
  270. package/lib/esm/components/highlight-slider/HighlightSlider.js.map +1 -1
  271. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js +20 -3
  272. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.js.map +1 -1
  273. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js +10 -1
  274. package/lib/esm/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.js.map +1 -1
  275. package/lib/esm/components/icon/Icon.js +26 -7
  276. package/lib/esm/components/icon/Icon.js.map +1 -1
  277. package/lib/esm/components/icon/Icon.styles.js +23 -0
  278. package/lib/esm/components/icon/Icon.styles.js.map +1 -1
  279. package/lib/esm/components/input/Input.js +24 -4
  280. package/lib/esm/components/input/Input.js.map +1 -1
  281. package/lib/esm/components/input/Input.styles.js +33 -3
  282. package/lib/esm/components/input/Input.styles.js.map +1 -1
  283. package/lib/esm/components/list/List.js +123 -37
  284. package/lib/esm/components/list/List.js.map +1 -1
  285. package/lib/esm/components/list/List.utils.js +99 -0
  286. package/lib/esm/components/list/List.utils.js.map +1 -1
  287. package/lib/esm/components/list/list-item/ListItem.js +83 -4
  288. package/lib/esm/components/list/list-item/ListItem.js.map +1 -1
  289. package/lib/esm/components/list/list-item/ListItem.styles.js +9 -0
  290. package/lib/esm/components/list/list-item/ListItem.styles.js.map +1 -1
  291. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js +41 -6
  292. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.js.map +1 -1
  293. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js +4 -0
  294. package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js.map +1 -1
  295. package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js +33 -2
  296. package/lib/esm/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.js.map +1 -1
  297. package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js +33 -2
  298. package/lib/esm/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.js.map +1 -1
  299. package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js +30 -1
  300. package/lib/esm/components/list/list-item/list-item-head/list-item-title/ListItemTitle.js.map +1 -1
  301. package/lib/esm/components/list/list-item/useListItemFocus.js +40 -0
  302. package/lib/esm/components/list/list-item/useListItemFocus.js.map +1 -0
  303. package/lib/esm/components/masonry/Masonry.context.js +10 -0
  304. package/lib/esm/components/masonry/Masonry.context.js.map +1 -0
  305. package/lib/esm/components/masonry/Masonry.hooks.js +44 -0
  306. package/lib/esm/components/masonry/Masonry.hooks.js.map +1 -0
  307. package/lib/esm/components/masonry/Masonry.js +74 -0
  308. package/lib/esm/components/masonry/Masonry.js.map +1 -0
  309. package/lib/esm/components/masonry/Masonry.styles.js +9 -0
  310. package/lib/esm/components/masonry/Masonry.styles.js.map +1 -0
  311. package/lib/esm/components/masonry/Masonry.types.js +2 -0
  312. package/lib/esm/components/masonry/Masonry.types.js.map +1 -0
  313. package/lib/esm/components/masonry/Masonry.utils.js +110 -0
  314. package/lib/esm/components/masonry/Masonry.utils.js.map +1 -0
  315. package/lib/esm/components/masonry/masonry-item/MasonryItem.js +69 -0
  316. package/lib/esm/components/masonry/masonry-item/MasonryItem.js.map +1 -0
  317. package/lib/esm/components/masonry/masonry-item/MasonryItem.styles.js +10 -0
  318. package/lib/esm/components/masonry/masonry-item/MasonryItem.styles.js.map +1 -0
  319. package/lib/esm/components/mention-finder/MentionFinder.js +30 -2
  320. package/lib/esm/components/mention-finder/MentionFinder.js.map +1 -1
  321. package/lib/esm/components/mention-finder/mention-finder-item/MentionFinderItem.styles.js.map +1 -1
  322. package/lib/esm/components/multi-action-button/MultiActionButton.js +36 -3
  323. package/lib/esm/components/multi-action-button/MultiActionButton.js.map +1 -1
  324. package/lib/esm/components/multi-action-button/MultiActionButton.types.js.map +1 -1
  325. package/lib/esm/components/multi-action-button/action-button/ActionButton.js +7 -1
  326. package/lib/esm/components/multi-action-button/action-button/ActionButton.js.map +1 -1
  327. package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js +12 -0
  328. package/lib/esm/components/multi-action-button/action-button/ActionButton.styles.js.map +1 -1
  329. package/lib/esm/components/number-input/NumberInput.js +13 -10
  330. package/lib/esm/components/number-input/NumberInput.js.map +1 -1
  331. package/lib/esm/components/page-provider/PageProvider.js +4 -2
  332. package/lib/esm/components/page-provider/PageProvider.js.map +1 -1
  333. package/lib/esm/components/popup/Popup.js +8 -1
  334. package/lib/esm/components/popup/Popup.js.map +1 -1
  335. package/lib/esm/components/radio-button/RadioButton.js +29 -15
  336. package/lib/esm/components/radio-button/RadioButton.js.map +1 -1
  337. package/lib/esm/components/radio-button/RadioButton.styles.js +19 -8
  338. package/lib/esm/components/radio-button/RadioButton.styles.js.map +1 -1
  339. package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js +7 -4
  340. package/lib/esm/components/radio-button/radio-button-group/RadioButtonGroup.js.map +1 -1
  341. package/lib/esm/components/search-box/SearchBox.js +5 -2
  342. package/lib/esm/components/search-box/SearchBox.js.map +1 -1
  343. package/lib/esm/components/search-input/SearchInput.js +41 -42
  344. package/lib/esm/components/search-input/SearchInput.js.map +1 -1
  345. package/lib/esm/components/search-input/SearchInput.styles.js +24 -1
  346. package/lib/esm/components/search-input/SearchInput.styles.js.map +1 -1
  347. package/lib/esm/components/select-button/SelectButton.js +4 -2
  348. package/lib/esm/components/select-button/SelectButton.js.map +1 -1
  349. package/lib/esm/components/setup-wizard/SetupWizard.js +7 -4
  350. package/lib/esm/components/setup-wizard/SetupWizard.js.map +1 -1
  351. package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js +5 -3
  352. package/lib/esm/components/setup-wizard/setup-wizard-item/SetupWizardItem.js.map +1 -1
  353. package/lib/esm/components/sharing-bar/SharingBar.js +30 -5
  354. package/lib/esm/components/sharing-bar/SharingBar.js.map +1 -1
  355. package/lib/esm/components/sharing-bar/SharingBar.styles.js +5 -0
  356. package/lib/esm/components/sharing-bar/SharingBar.styles.js.map +1 -1
  357. package/lib/esm/components/sharing-button/SharingButton.js +4 -2
  358. package/lib/esm/components/sharing-button/SharingButton.js.map +1 -1
  359. package/lib/esm/components/sharing-context-menu/SharingContextMenu.js +3 -1
  360. package/lib/esm/components/sharing-context-menu/SharingContextMenu.js.map +1 -1
  361. package/lib/esm/components/signature/Signature.js +6 -3
  362. package/lib/esm/components/signature/Signature.js.map +1 -1
  363. package/lib/esm/components/slider/Slider.js +30 -7
  364. package/lib/esm/components/slider/Slider.js.map +1 -1
  365. package/lib/esm/components/slider/Slider.styles.js +8 -1
  366. package/lib/esm/components/slider/Slider.styles.js.map +1 -1
  367. package/lib/esm/components/slider-button/SliderButton.js +62 -6
  368. package/lib/esm/components/slider-button/SliderButton.js.map +1 -1
  369. package/lib/esm/components/slider-button/SliderButton.styles.js +18 -1
  370. package/lib/esm/components/slider-button/SliderButton.styles.js.map +1 -1
  371. package/lib/esm/components/slider-button/SliderButton.types.js +2 -0
  372. package/lib/esm/components/slider-button/SliderButton.types.js.map +1 -0
  373. package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js +56 -0
  374. package/lib/esm/components/slider-button/useSliderButtonPopupKeyboard.js.map +1 -0
  375. package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js +38 -0
  376. package/lib/esm/components/slider-button/useSliderButtonThumbKeyboard.js.map +1 -0
  377. package/lib/esm/components/tag-input/TagInput.js +85 -35
  378. package/lib/esm/components/tag-input/TagInput.js.map +1 -1
  379. package/lib/esm/components/tag-input/TagInput.styles.js +29 -1
  380. package/lib/esm/components/tag-input/TagInput.styles.js.map +1 -1
  381. package/lib/esm/components/text-area/TextArea.js +18 -9
  382. package/lib/esm/components/text-area/TextArea.js.map +1 -1
  383. package/lib/esm/components/text-area/TextArea.styles.js +14 -0
  384. package/lib/esm/components/text-area/TextArea.styles.js.map +1 -1
  385. package/lib/esm/components/truncation/Truncation.js +18 -4
  386. package/lib/esm/components/truncation/Truncation.js.map +1 -1
  387. package/lib/esm/components/truncation/Truncation.styles.js +18 -0
  388. package/lib/esm/components/truncation/Truncation.styles.js.map +1 -1
  389. package/lib/esm/hooks/useKeyboardFocusHighlighting.js +61 -0
  390. package/lib/esm/hooks/useKeyboardFocusHighlighting.js.map +1 -0
  391. package/lib/esm/index.js +1 -0
  392. package/lib/esm/index.js.map +1 -1
  393. package/lib/esm/utils/file.js.map +1 -1
  394. package/lib/esm/utils/keyboardFocusHighlighting.styles.js +25 -0
  395. package/lib/esm/utils/keyboardFocusHighlighting.styles.js.map +1 -0
  396. package/lib/types/components/accordion/Accordion.d.ts +5 -0
  397. package/lib/types/components/accordion/Accordion.styles.d.ts +8 -4
  398. package/lib/types/components/accordion/accordion-body/AccordionBody.styles.d.ts +2 -2
  399. package/lib/types/components/accordion/accordion-group/AccordionGroup.d.ts +7 -2
  400. package/lib/types/components/accordion/accordion-head/AccordionHead.d.ts +1 -0
  401. package/lib/types/components/accordion/accordion-head/AccordionHead.styles.d.ts +18 -18
  402. package/lib/types/components/amount-control/AmountControl.d.ts +5 -0
  403. package/lib/types/components/amount-control/AmountControl.styles.d.ts +8 -4
  404. package/lib/types/components/button/Button.styles.d.ts +8 -6
  405. package/lib/types/components/button/Button.types.d.ts +8 -0
  406. package/lib/types/components/checkbox/Checkbox.d.ts +4 -0
  407. package/lib/types/components/checkbox/Checkbox.styles.d.ts +5 -1
  408. package/lib/types/components/color-scheme-provider/ColorSchemeProvider.d.ts +5 -0
  409. package/lib/types/components/combobox/ComboBox.styles.d.ts +4 -2
  410. package/lib/types/components/combobox/ComboBox.types.d.ts +5 -0
  411. package/lib/types/components/context-menu/ContextMenu.styles.d.ts +4 -2
  412. package/lib/types/components/context-menu/ContextMenu.types.d.ts +6 -0
  413. package/lib/types/components/context-menu/context-menu-content/ContextMenuContent.styles.d.ts +2 -2
  414. package/lib/types/components/dropdown-body-wrapper/delayed-dropdown-content/DelayedDropdownContent.styles.d.ts +2 -2
  415. package/lib/types/components/expandable-content/ExpandableContent.styles.d.ts +2 -2
  416. package/lib/types/components/file-input/FileInput.d.ts +4 -0
  417. package/lib/types/components/file-input/FileInput.styles.d.ts +2 -2
  418. package/lib/types/components/file-list/file-item/FileItem.styles.d.ts +3 -0
  419. package/lib/types/components/file-select/FileSelect.d.ts +4 -0
  420. package/lib/types/components/file-select/FileSelect.styles.d.ts +6 -4
  421. package/lib/types/components/filter/Filter.d.ts +1 -0
  422. package/lib/types/components/filter/Filter.styles.d.ts +6 -4
  423. package/lib/types/components/filter/filter-content/FilterContent.types.d.ts +4 -0
  424. package/lib/types/components/filter-buttons/FilterButtons.d.ts +4 -0
  425. package/lib/types/components/filter-buttons/filter-button/FilterButton.d.ts +5 -0
  426. package/lib/types/components/filter-buttons/filter-button/FilterButton.styles.d.ts +12 -8
  427. package/lib/types/components/grid-image/GridImage.d.ts +4 -0
  428. package/lib/types/components/grid-image/GridImage.styles.d.ts +4 -2
  429. package/lib/types/components/grouped-image/GroupedImage.d.ts +4 -0
  430. package/lib/types/components/grouped-image/GroupedImage.styles.d.ts +8 -6
  431. package/lib/types/components/highlight-slider/HighlightSlider.d.ts +4 -0
  432. package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.d.ts +3 -0
  433. package/lib/types/components/highlight-slider/highlight-slider-item/HighlightSliderItem.styles.d.ts +9 -5
  434. package/lib/types/components/icon/Icon.d.ts +4 -0
  435. package/lib/types/components/icon/Icon.styles.d.ts +1 -0
  436. package/lib/types/components/input/Input.d.ts +4 -0
  437. package/lib/types/components/input/Input.styles.d.ts +17 -9
  438. package/lib/types/components/list/List.d.ts +11 -0
  439. package/lib/types/components/list/List.utils.d.ts +16 -1
  440. package/lib/types/components/list/list-item/ListItem.styles.d.ts +64 -64
  441. package/lib/types/components/list/list-item/list-item-body/ListItemBody.styles.d.ts +2 -2
  442. package/lib/types/components/list/list-item/list-item-head/ListItemHead.d.ts +1 -0
  443. package/lib/types/components/list/list-item/list-item-head/ListItemHead.styles.d.ts +195 -194
  444. package/lib/types/components/list/list-item/list-item-head/list-item-right-element/ListItemRightElement.d.ts +1 -0
  445. package/lib/types/components/list/list-item/list-item-head/list-item-subtitle/ListItemSubtitle.d.ts +1 -0
  446. package/lib/types/components/list/list-item/list-item-head/list-item-title/ListItemTitle.d.ts +1 -0
  447. package/lib/types/components/list/list-item/useListItemFocus.d.ts +13 -0
  448. package/lib/types/components/masonry/Masonry.context.d.ts +3 -0
  449. package/lib/types/components/masonry/Masonry.d.ts +3 -0
  450. package/lib/types/components/masonry/Masonry.hooks.d.ts +22 -0
  451. package/lib/types/components/masonry/Masonry.styles.d.ts +5 -0
  452. package/lib/types/components/masonry/Masonry.types.d.ts +40 -0
  453. package/lib/types/components/masonry/Masonry.utils.d.ts +22 -0
  454. package/lib/types/components/masonry/masonry-item/MasonryItem.d.ts +5 -0
  455. package/lib/types/components/masonry/masonry-item/MasonryItem.styles.d.ts +5 -0
  456. package/lib/types/components/mention-finder/MentionFinder.styles.d.ts +4 -4
  457. package/lib/types/components/multi-action-button/MultiActionButton.styles.d.ts +2 -2
  458. package/lib/types/components/multi-action-button/MultiActionButton.types.d.ts +7 -0
  459. package/lib/types/components/multi-action-button/action-button/ActionButton.d.ts +4 -1
  460. package/lib/types/components/multi-action-button/action-button/ActionButton.styles.d.ts +4 -2
  461. package/lib/types/components/number-input/NumberInput.d.ts +4 -0
  462. package/lib/types/components/popup/popup-content-wrapper/PopupContentWrapper.styles.d.ts +2 -2
  463. package/lib/types/components/progress-bar/ProgressBar.styles.d.ts +6 -6
  464. package/lib/types/components/radio-button/RadioButton.d.ts +4 -0
  465. package/lib/types/components/radio-button/RadioButton.styles.d.ts +15 -9
  466. package/lib/types/components/radio-button/radio-button-group/RadioButtonGroup.d.ts +5 -0
  467. package/lib/types/components/search-box/SearchBox.d.ts +4 -0
  468. package/lib/types/components/search-box/SearchBox.styles.d.ts +2 -2
  469. package/lib/types/components/search-input/SearchInput.d.ts +4 -0
  470. package/lib/types/components/search-input/SearchInput.styles.d.ts +17 -9
  471. package/lib/types/components/select-button/SelectButton.d.ts +4 -0
  472. package/lib/types/components/setup-wizard/SetupWizard.d.ts +5 -0
  473. package/lib/types/components/sharing-bar/SharingBar.d.ts +4 -0
  474. package/lib/types/components/sharing-button/SharingButton.d.ts +1 -1
  475. package/lib/types/components/sharing-context-menu/SharingContextMenu.d.ts +10 -2
  476. package/lib/types/components/signature/Signature.d.ts +4 -0
  477. package/lib/types/components/skeleton/base-skeleton/BaseSkeleton.styles.d.ts +4 -4
  478. package/lib/types/components/slider/Slider.d.ts +8 -0
  479. package/lib/types/components/slider/Slider.styles.d.ts +18 -14
  480. package/lib/types/components/slider-button/SliderButton.d.ts +1 -28
  481. package/lib/types/components/slider-button/SliderButton.styles.d.ts +6 -4
  482. package/lib/types/components/slider-button/SliderButton.types.d.ts +32 -0
  483. package/lib/types/components/slider-button/useSliderButtonPopupKeyboard.d.ts +17 -0
  484. package/lib/types/components/slider-button/useSliderButtonThumbKeyboard.d.ts +13 -0
  485. package/lib/types/components/tag-input/TagInput.d.ts +4 -0
  486. package/lib/types/components/tag-input/TagInput.styles.d.ts +12 -2
  487. package/lib/types/components/text-area/TextArea.d.ts +4 -0
  488. package/lib/types/components/text-area/TextArea.styles.d.ts +1 -0
  489. package/lib/types/components/truncation/Truncation.d.ts +4 -0
  490. package/lib/types/components/truncation/Truncation.styles.d.ts +7 -2
  491. package/lib/types/hooks/useKeyboardFocusHighlighting.d.ts +5 -0
  492. package/lib/types/index.d.ts +1 -0
  493. package/lib/types/utils/file.d.ts +1 -1
  494. package/lib/types/utils/keyboardFocusHighlighting.styles.d.ts +9 -0
  495. package/package.json +2 -2
@@ -1 +1 @@
1
- {"version":3,"file":"Filter.js","names":["_react","_interopRequireWildcard","require","_Filter","_ExpandableContent","_interopRequireDefault","_Icon","_FilterContent","_ComboBox","_filter","_SearchInput","_ContextMenu","_Checkbox","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Filter","forwardRef","headline","searchConfig","sortConfig","shouldAutoFocus","shouldShowRoundedHoverEffect","filterButtonConfig","checkboxConfig","comboboxConfig","onActiveChange","rightIcons","ref","isOpen","setIsOpen","useState","isSearchActive","setIsSearchActive","shouldFocus","setShouldFocus","contentRef","useRef","iconRef","filterRef","searchRef","contextMenuRef","type","useMemo","FilterType","ONLY_FILTER","ONLY_SORT","ONLY_SEARCH","ONLY_CHECKBOX","ONLY_COMBOBOX","MULTIPLE","icons","useEffect","handleHide","useCallback","current","hide","_searchRef$current","focus","window","setTimeout","handleShow","useImperativeHandle","show","handleIconClick","iconElement","createElement","StyledFilterIcon","onClick","$isOpen","$shouldShowRoundedHoverEffect","size","sortItems","selectedItem","onSortChange","items","map","id","text","key","toString","isSelected","comboboxElement","StyledFilter","StyledFilterHead","isValidElement","StyledFilterHeadline","$isSearchActive","StyledFilterHeadlineElement","includes","StyledFilterIconWrapper","rIcons","StyledFilterSearch","isActive","value","searchValue","onChange","ev","onSearchChange","target","StyledFilterContentWrapper","displayName","_default","exports"],"sources":["../../../../src/components/filter/Filter.tsx"],"sourcesContent":["import React, {\n forwardRef,\n isValidElement,\n ReactNode,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport {\n StyledFilter,\n StyledFilterContentWrapper,\n StyledFilterHead,\n StyledFilterHeadline,\n StyledFilterHeadlineElement,\n StyledFilterIcon,\n StyledFilterIconWrapper,\n StyledFilterSearch,\n} from './Filter.styles';\nimport ExpandableContent from '../expandable-content/ExpandableContent';\nimport Icon from '../icon/Icon';\nimport FilterContent from './filter-content/FilterContent';\nimport ComboBox from '../combobox/ComboBox';\nimport {\n CheckboxConfig,\n ComboboxConfig,\n FilterButtonConfig,\n FilterRef,\n FilterType,\n SearchConfig,\n SortConfig,\n} from '../../types/filter';\nimport SearchInput from '../search-input/SearchInput';\nimport ContextMenu from '../context-menu/ContextMenu';\nimport Checkbox from '../checkbox/Checkbox';\nimport { InputRef } from '../input/Input';\nimport type { ContextMenuItem, ContextMenuRef } from '../context-menu/ContextMenu.types';\n\nexport interface FilterRightIcon {\n icons: string[];\n onClick: VoidFunction;\n}\n\n//\nexport type FilterProps = {\n headline: ReactNode;\n searchConfig?: SearchConfig;\n filterButtonConfig?: FilterButtonConfig;\n sortConfig?: SortConfig;\n checkboxConfig?: CheckboxConfig;\n comboboxConfig?: ComboboxConfig;\n onActiveChange?: (isActive: boolean) => void;\n shouldShowRoundedHoverEffect?: boolean;\n rightIcons?: FilterRightIcon[];\n shouldAutoFocus?: boolean;\n};\n\nconst Filter = forwardRef<FilterRef, FilterProps>(\n (\n {\n headline,\n searchConfig,\n sortConfig,\n shouldAutoFocus = false,\n shouldShowRoundedHoverEffect = false,\n filterButtonConfig,\n checkboxConfig,\n comboboxConfig,\n onActiveChange,\n rightIcons,\n },\n ref,\n ) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isSearchActive, setIsSearchActive] = useState(false);\n const [shouldFocus, setShouldFocus] = useState(false);\n\n const contentRef = useRef<HTMLDivElement | null>(null);\n const iconRef = useRef<HTMLDivElement | null>(null);\n const filterRef = useRef<HTMLDivElement | null>(null);\n const searchRef = useRef<InputRef | null>(null);\n\n const contextMenuRef = useRef<ContextMenuRef>(null);\n\n const type = useMemo(() => {\n if (\n filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_FILTER;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_SORT;\n }\n\n if (\n !filterButtonConfig &&\n searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_SEARCH;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_CHECKBOX;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n comboboxConfig\n ) {\n return FilterType.ONLY_COMBOBOX;\n }\n\n return FilterType.MULTIPLE;\n }, [checkboxConfig, comboboxConfig, filterButtonConfig, searchConfig, sortConfig]);\n\n const icons = useMemo(() => {\n switch (type) {\n case FilterType.ONLY_FILTER:\n return ['fa fa-filter'];\n case FilterType.ONLY_SORT:\n return ['fa fa-arrow-up-arrow-down'];\n default:\n return ['fa fa-search'];\n }\n }, [type]);\n\n useEffect(() => {\n if (typeof onActiveChange === 'function') {\n onActiveChange(isOpen);\n }\n }, [isOpen, onActiveChange]);\n\n const handleHide = useCallback(() => {\n setIsOpen(false);\n\n if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n contextMenuRef.current.hide();\n }\n\n if (type === FilterType.ONLY_SEARCH) {\n setIsSearchActive(false);\n }\n }, [type]);\n\n useEffect(() => {\n if (shouldFocus) {\n searchRef.current?.focus();\n\n window.setTimeout(() => {\n setShouldFocus(false);\n }, 200);\n }\n }, [shouldFocus]);\n\n const handleShow = useCallback(() => {\n setIsOpen(true);\n\n if (shouldAutoFocus) {\n setShouldFocus(true);\n }\n\n if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n contextMenuRef.current.hide();\n }\n\n if (type === FilterType.ONLY_SEARCH) {\n setIsSearchActive(true);\n }\n }, [shouldAutoFocus, type]);\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n const handleIconClick = useCallback(() => {\n if (isOpen) {\n handleHide();\n } else {\n handleShow();\n }\n }, [handleHide, handleShow, isOpen]);\n\n const iconElement = useMemo(\n () => (\n <StyledFilterIcon\n onClick={handleIconClick}\n $isOpen={isOpen}\n ref={iconRef}\n $shouldShowRoundedHoverEffect={shouldShowRoundedHoverEffect}\n >\n <Icon icons={icons} size={18} />\n </StyledFilterIcon>\n ),\n [handleIconClick, icons, isOpen, shouldShowRoundedHoverEffect],\n );\n\n const sortItems: ContextMenuItem[] = useMemo(() => {\n if (!sortConfig) {\n return [];\n }\n\n const { selectedItem, onSortChange } = sortConfig;\n\n return sortConfig.items.map(({ id, text }) => ({\n text,\n key: id.toString(),\n isSelected: id === selectedItem.id,\n icons: id === selectedItem.id ? ['fas fa-circle-small'] : [],\n onClick: () => onSortChange({ text, id }),\n }));\n }, [sortConfig]);\n\n const comboboxElement = useMemo(() => {\n if (!comboboxConfig) {\n return null;\n }\n\n return (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <ComboBox {...comboboxConfig} />\n );\n }, [comboboxConfig]);\n\n return useMemo(\n () => (\n <StyledFilter ref={filterRef}>\n <StyledFilterHead>\n {!isValidElement(headline) ? (\n <StyledFilterHeadline $isSearchActive={isSearchActive}>\n {headline}\n </StyledFilterHeadline>\n ) : (\n <StyledFilterHeadlineElement $isSearchActive={isSearchActive}>\n {headline}\n </StyledFilterHeadlineElement>\n )}\n {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n <StyledFilterIconWrapper>\n {rightIcons &&\n rightIcons.map(({ icons: rIcons, onClick }) => (\n <StyledFilterIcon\n onClick={onClick}\n $isOpen={false}\n $shouldShowRoundedHoverEffect={\n shouldShowRoundedHoverEffect\n }\n >\n <Icon icons={rIcons} size={18} />\n </StyledFilterIcon>\n ))}\n {iconElement}\n </StyledFilterIconWrapper>\n )}\n {type === FilterType.ONLY_SEARCH && searchConfig && (\n <StyledFilterSearch>\n <SearchInput\n onActiveChange={(isActive) => {\n setIsSearchActive(isActive);\n setIsOpen(isActive);\n }}\n ref={searchRef}\n isActive={isSearchActive}\n value={searchConfig.searchValue}\n onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n />\n </StyledFilterSearch>\n )}\n {type === FilterType.ONLY_SORT && sortConfig && (\n <ContextMenu ref={contextMenuRef} items={sortItems}>\n {iconElement}\n </ContextMenu>\n )}\n {type === FilterType.ONLY_CHECKBOX && checkboxConfig && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Checkbox {...checkboxConfig} />\n )}\n {type === FilterType.ONLY_COMBOBOX && comboboxElement}\n </StyledFilterHead>\n {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n <StyledFilterContentWrapper ref={contentRef}>\n <ExpandableContent isOpen={isOpen}>\n <FilterContent\n shouldAutoFocus={shouldFocus}\n searchConfig={searchConfig}\n filterButtonConfig={filterButtonConfig}\n sortConfig={sortConfig}\n checkboxConfig={checkboxConfig}\n comboboxConfig={comboboxConfig}\n />\n </ExpandableContent>\n </StyledFilterContentWrapper>\n )}\n </StyledFilter>\n ),\n [\n headline,\n isSearchActive,\n type,\n rightIcons,\n iconElement,\n searchConfig,\n sortConfig,\n sortItems,\n checkboxConfig,\n isOpen,\n shouldFocus,\n filterButtonConfig,\n comboboxConfig,\n comboboxElement,\n shouldShowRoundedHoverEffect,\n ],\n );\n },\n);\n\nFilter.displayName = 'Filter';\n\nexport default Filter;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Filter.js","names":["_react","_interopRequireWildcard","require","_Filter","_ExpandableContent","_interopRequireDefault","_Icon","_FilterContent","_ComboBox","_filter","_SearchInput","_ContextMenu","_Checkbox","_useKeyboardFocusHighlighting","_ColorSchemeProvider","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","Filter","forwardRef","headline","searchConfig","sortConfig","shouldAutoFocus","shouldShowRoundedHoverEffect","filterButtonConfig","checkboxConfig","comboboxConfig","onActiveChange","rightIcons","shouldEnableKeyboardHighlighting","ref","isOpen","setIsOpen","useState","isSearchActive","setIsSearchActive","shouldFocus","setShouldFocus","contentRef","useRef","iconRef","filterRef","searchRef","colorScheme","useColorScheme","shouldEnableKeyboardHighlightingEffective","contextMenuRef","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","type","useMemo","FilterType","ONLY_FILTER","ONLY_SORT","ONLY_SEARCH","ONLY_CHECKBOX","ONLY_COMBOBOX","MULTIPLE","icons","useEffect","handleHide","useCallback","current","hide","_searchRef$current","focus","window","setTimeout","handleShow","useImperativeHandle","show","handleIconClick","handleIconKeyDown","event","key","preventDefault","iconElement","createElement","StyledFilterIcon","onClick","onKeyDown","$isOpen","role","undefined","tabIndex","$shouldShowKeyboardHighlighting","$shouldShowRoundedHoverEffect","size","sortItems","selectedItem","onSortChange","items","map","id","text","toString","isSelected","comboboxElement","StyledFilter","StyledFilterHead","isValidElement","StyledFilterHeadline","$isSearchActive","StyledFilterHeadlineElement","includes","StyledFilterIconWrapper","rIcons","join","StyledFilterSearch","isActive","value","searchValue","onChange","ev","onSearchChange","target","StyledFilterContentWrapper","inert","displayName","_default","exports"],"sources":["../../../../src/components/filter/Filter.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access, react/jsx-props-no-spreading */\nimport React, {\n forwardRef,\n isValidElement,\n KeyboardEventHandler,\n ReactNode,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport {\n StyledFilter,\n StyledFilterContentWrapper,\n StyledFilterHead,\n StyledFilterHeadline,\n StyledFilterHeadlineElement,\n StyledFilterIcon,\n StyledFilterIconWrapper,\n StyledFilterSearch,\n} from './Filter.styles';\nimport ExpandableContent from '../expandable-content/ExpandableContent';\nimport Icon from '../icon/Icon';\nimport FilterContent from './filter-content/FilterContent';\nimport ComboBox from '../combobox/ComboBox';\nimport {\n CheckboxConfig,\n ComboboxConfig,\n FilterButtonConfig,\n FilterRef,\n FilterType,\n SearchConfig,\n SortConfig,\n} from '../../types/filter';\nimport SearchInput from '../search-input/SearchInput';\nimport ContextMenu from '../context-menu/ContextMenu';\nimport type { ContextMenuItem, ContextMenuRef } from '../context-menu/ContextMenu.types';\nimport Checkbox from '../checkbox/Checkbox';\nimport { InputRef } from '../input/Input';\nimport { useKeyboardFocusHighlighting } from '../../hooks/useKeyboardFocusHighlighting';\nimport { useColorScheme } from '../color-scheme-provider/ColorSchemeProvider';\n\nexport interface FilterRightIcon {\n icons: string[];\n onClick: VoidFunction;\n}\n\n//\nexport type FilterProps = {\n headline: ReactNode;\n searchConfig?: SearchConfig;\n filterButtonConfig?: FilterButtonConfig;\n sortConfig?: SortConfig;\n checkboxConfig?: CheckboxConfig;\n comboboxConfig?: ComboboxConfig;\n onActiveChange?: (isActive: boolean) => void;\n shouldShowRoundedHoverEffect?: boolean;\n rightIcons?: FilterRightIcon[];\n shouldAutoFocus?: boolean;\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst Filter = forwardRef<FilterRef, FilterProps>(\n (\n {\n headline,\n searchConfig,\n sortConfig,\n shouldAutoFocus = false,\n shouldShowRoundedHoverEffect = false,\n filterButtonConfig,\n checkboxConfig,\n comboboxConfig,\n onActiveChange,\n rightIcons,\n shouldEnableKeyboardHighlighting,\n },\n ref,\n ) => {\n const [isOpen, setIsOpen] = useState(false);\n const [isSearchActive, setIsSearchActive] = useState(false);\n const [shouldFocus, setShouldFocus] = useState(false);\n\n const contentRef = useRef<HTMLDivElement | null>(null);\n const iconRef = useRef<HTMLDivElement | null>(null);\n const filterRef = useRef<HTMLDivElement | null>(null);\n const searchRef = useRef<InputRef | null>(null);\n\n const colorScheme = useColorScheme();\n const shouldEnableKeyboardHighlightingEffective =\n shouldEnableKeyboardHighlighting ??\n colorScheme?.shouldEnableKeyboardHighlighting ??\n false;\n\n const contextMenuRef = useRef<ContextMenuRef>(null);\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlightingEffective,\n );\n\n const type = useMemo(() => {\n if (\n filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_FILTER;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_SORT;\n }\n\n if (\n !filterButtonConfig &&\n searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_SEARCH;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n checkboxConfig &&\n !comboboxConfig\n ) {\n return FilterType.ONLY_CHECKBOX;\n }\n\n if (\n !filterButtonConfig &&\n !searchConfig &&\n !sortConfig &&\n !checkboxConfig &&\n comboboxConfig\n ) {\n return FilterType.ONLY_COMBOBOX;\n }\n\n return FilterType.MULTIPLE;\n }, [checkboxConfig, comboboxConfig, filterButtonConfig, searchConfig, sortConfig]);\n\n const icons = useMemo(() => {\n switch (type) {\n case FilterType.ONLY_FILTER:\n return ['fa fa-filter'];\n case FilterType.ONLY_SORT:\n return ['fa fa-arrow-up-arrow-down'];\n default:\n return ['fa fa-search'];\n }\n }, [type]);\n\n useEffect(() => {\n if (typeof onActiveChange === 'function') {\n onActiveChange(isOpen);\n }\n }, [isOpen, onActiveChange]);\n\n const handleHide = useCallback(() => {\n setIsOpen(false);\n\n if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n contextMenuRef.current.hide();\n }\n\n if (type === FilterType.ONLY_SEARCH) {\n setIsSearchActive(false);\n }\n }, [type]);\n\n useEffect(() => {\n if (shouldFocus) {\n searchRef.current?.focus();\n\n window.setTimeout(() => {\n setShouldFocus(false);\n }, 200);\n }\n }, [shouldFocus]);\n\n const handleShow = useCallback(() => {\n setIsOpen(true);\n\n if (shouldAutoFocus) {\n setShouldFocus(true);\n }\n\n if (type === FilterType.ONLY_SORT && contextMenuRef.current) {\n // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access\n contextMenuRef.current.hide();\n }\n\n if (type === FilterType.ONLY_SEARCH) {\n setIsSearchActive(true);\n }\n }, [shouldAutoFocus, type]);\n\n useImperativeHandle(\n ref,\n () => ({\n hide: handleHide,\n show: handleShow,\n }),\n [handleHide, handleShow],\n );\n\n const handleIconClick = useCallback(() => {\n if (isOpen) {\n handleHide();\n } else {\n handleShow();\n }\n }, [handleHide, handleShow, isOpen]);\n\n const handleIconKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n handleIconClick();\n }\n },\n [handleIconClick],\n );\n\n const iconElement = useMemo(\n () => (\n <StyledFilterIcon\n onClick={handleIconClick}\n onKeyDown={handleIconKeyDown}\n $isOpen={isOpen}\n ref={iconRef}\n role={shouldEnableKeyboardHighlightingEffective ? 'button' : undefined}\n tabIndex={shouldEnableKeyboardHighlightingEffective ? 0 : -1}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n $shouldShowRoundedHoverEffect={shouldShowRoundedHoverEffect}\n >\n <Icon icons={icons} size={18} />\n </StyledFilterIcon>\n ),\n [\n handleIconClick,\n handleIconKeyDown,\n icons,\n isOpen,\n shouldEnableKeyboardHighlightingEffective,\n shouldShowKeyboardHighlighting,\n shouldShowRoundedHoverEffect,\n ],\n );\n\n const sortItems: ContextMenuItem[] = useMemo(() => {\n if (!sortConfig) {\n return [];\n }\n\n const { selectedItem, onSortChange } = sortConfig;\n\n return sortConfig.items.map(({ id, text }) => ({\n text,\n key: id.toString(),\n isSelected: id === selectedItem.id,\n icons: id === selectedItem.id ? ['fas fa-circle-small'] : [],\n onClick: () => onSortChange({ text, id }),\n }));\n }, [sortConfig]);\n\n const comboboxElement = useMemo(() => {\n if (!comboboxConfig) {\n return null;\n }\n\n return (\n <ComboBox\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...comboboxConfig}\n shouldEnableKeyboardHighlighting={\n comboboxConfig.shouldEnableKeyboardHighlighting ??\n shouldEnableKeyboardHighlightingEffective\n }\n />\n );\n }, [comboboxConfig, shouldEnableKeyboardHighlightingEffective]);\n\n return useMemo(\n () => (\n <StyledFilter ref={filterRef}>\n <StyledFilterHead>\n {!isValidElement(headline) ? (\n <StyledFilterHeadline $isSearchActive={isSearchActive}>\n {headline}\n </StyledFilterHeadline>\n ) : (\n <StyledFilterHeadlineElement $isSearchActive={isSearchActive}>\n {headline}\n </StyledFilterHeadlineElement>\n )}\n {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n <StyledFilterIconWrapper>\n {rightIcons &&\n rightIcons.map(({ icons: rIcons, onClick }) => (\n <StyledFilterIcon\n key={rIcons.join('-')}\n onClick={onClick}\n onKeyDown={(event) => {\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n onClick();\n }\n }}\n $isOpen={false}\n role={\n shouldEnableKeyboardHighlightingEffective\n ? 'button'\n : undefined\n }\n tabIndex={\n shouldEnableKeyboardHighlightingEffective ? 0 : -1\n }\n $shouldShowKeyboardHighlighting={\n shouldShowKeyboardHighlighting\n }\n $shouldShowRoundedHoverEffect={\n shouldShowRoundedHoverEffect\n }\n >\n <Icon icons={rIcons} size={18} />\n </StyledFilterIcon>\n ))}\n {iconElement}\n </StyledFilterIconWrapper>\n )}\n {type === FilterType.ONLY_SEARCH && searchConfig && (\n <StyledFilterSearch>\n <SearchInput\n onActiveChange={(isActive) => {\n setIsSearchActive(isActive);\n setIsOpen(isActive);\n }}\n ref={searchRef}\n isActive={isSearchActive}\n value={searchConfig.searchValue}\n onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n shouldEnableKeyboardHighlighting={\n shouldEnableKeyboardHighlightingEffective\n }\n />\n </StyledFilterSearch>\n )}\n {type === FilterType.ONLY_SORT && sortConfig && (\n <ContextMenu\n ref={contextMenuRef}\n items={sortItems}\n shouldEnableKeyboardHighlighting={\n shouldEnableKeyboardHighlightingEffective\n }\n >\n {iconElement}\n </ContextMenu>\n )}\n {type === FilterType.ONLY_CHECKBOX && checkboxConfig && (\n <Checkbox\n // eslint-disable-next-line react/jsx-props-no-spreading\n {...checkboxConfig}\n shouldEnableKeyboardHighlighting={\n checkboxConfig.shouldEnableKeyboardHighlighting ??\n shouldEnableKeyboardHighlightingEffective\n }\n />\n )}\n {type === FilterType.ONLY_COMBOBOX && comboboxElement}\n </StyledFilterHead>\n {[FilterType.MULTIPLE, FilterType.ONLY_FILTER].includes(type) && (\n <StyledFilterContentWrapper\n ref={contentRef}\n inert={!isOpen ? 'true' : undefined}\n aria-hidden={!isOpen}\n >\n <ExpandableContent isOpen={isOpen}>\n <FilterContent\n shouldAutoFocus={shouldFocus}\n searchConfig={searchConfig}\n filterButtonConfig={filterButtonConfig}\n sortConfig={sortConfig}\n checkboxConfig={checkboxConfig}\n comboboxConfig={comboboxConfig}\n shouldEnableKeyboardHighlighting={\n shouldEnableKeyboardHighlightingEffective\n }\n />\n </ExpandableContent>\n </StyledFilterContentWrapper>\n )}\n </StyledFilter>\n ),\n [\n headline,\n isSearchActive,\n type,\n rightIcons,\n iconElement,\n searchConfig,\n sortConfig,\n sortItems,\n checkboxConfig,\n isOpen,\n shouldFocus,\n shouldEnableKeyboardHighlightingEffective,\n filterButtonConfig,\n comboboxConfig,\n comboboxElement,\n shouldShowKeyboardHighlighting,\n shouldShowRoundedHoverEffect,\n ],\n );\n },\n);\n\nFilter.displayName = 'Filter';\n\nexport default Filter;\n"],"mappings":"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","ignoreList":[]}
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
6
6
  exports.StyledMotionFilterBackground = exports.StyledFilterSearch = exports.StyledFilterIconWrapper = exports.StyledFilterIcon = exports.StyledFilterHeadlineElement = exports.StyledFilterHeadline = exports.StyledFilterHead = exports.StyledFilterContentWrapper = exports.StyledFilter = void 0;
7
7
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
8
8
  var _react = require("motion/react");
9
+ var _keyboardFocusHighlighting = require("../../utils/keyboardFocusHighlighting.styles");
9
10
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
10
11
  const StyledFilter = exports.StyledFilter = _styledComponents.default.div``;
11
12
  const StyledFilterHead = exports.StyledFilterHead = _styledComponents.default.div`
@@ -76,6 +77,14 @@ const StyledFilterIcon = exports.StyledFilterIcon = _styledComponents.default.di
76
77
  theme
77
78
  }) => theme['100']};
78
79
  }
80
+
81
+ ${({
82
+ $shouldShowKeyboardHighlighting
83
+ }) => $shouldShowKeyboardHighlighting && (0, _styledComponents.css)`
84
+ &:focus-visible {
85
+ ${_keyboardFocusHighlighting.keyboardFocusHighlightingRingCss}
86
+ }
87
+ `}
79
88
  `;
80
89
  const StyledMotionFilterBackground = exports.StyledMotionFilterBackground = (0, _styledComponents.default)(_react.motion.div)`
81
90
  width: 30px;
@@ -1 +1 @@
1
- {"version":3,"file":"Filter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_react","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledFilter","exports","styled","div","StyledFilterHead","StyledFilterHeadline","h1","$isSearchActive","StyledFilterHeadlineElement","StyledFilterIconWrapper","StyledFilterSearch","StyledFilterIcon","$shouldShowRoundedHoverEffect","$isOpen","css","theme","StyledMotionFilterBackground","motion","$top","$left","StyledFilterContentWrapper"],"sources":["../../../../src/components/filter/Filter.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { motion } from 'motion/react';\n\nexport const StyledFilter = styled.div``;\n\nexport const StyledFilterHead = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n\n position: relative;\n`;\n\ntype StyledFilterHeadlineProps = WithTheme<{ $isSearchActive: boolean }>;\n\nexport const StyledFilterHeadline = styled.h1<StyledFilterHeadlineProps>`\n margin: 0;\n\n opacity: ${({ $isSearchActive }) => ($isSearchActive ? 0 : 1)};\n\n transition: opacity 0.3s;\n`;\n\nexport const StyledFilterHeadlineElement = styled.div<StyledFilterHeadlineProps>`\n opacity: ${({ $isSearchActive }) => ($isSearchActive ? 0 : 1)};\n\n transition: opacity 0.3s;\n`;\n\nexport const StyledFilterIconWrapper = styled.div`\n display: flex;\n align-items: center;\n`;\n\nexport const StyledFilterSearch = styled.div`\n position: absolute;\n width: 100%;\n`;\n\ntype StyledFilterIconProps = WithTheme<{\n $isOpen: boolean;\n $shouldShowRoundedHoverEffect: boolean;\n}>;\n\nexport const StyledFilterIcon = styled.div<StyledFilterIconProps>`\n cursor: pointer;\n\n aspect-ratio: 1;\n\n height: ${({ $shouldShowRoundedHoverEffect }) => ($shouldShowRoundedHoverEffect ? 42 : 30)}px;\n border-radius: ${({ $shouldShowRoundedHoverEffect }) =>\n $shouldShowRoundedHoverEffect ? 3 : 0}px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n ${({ $shouldShowRoundedHoverEffect, $isOpen }) =>\n $shouldShowRoundedHoverEffect &&\n $isOpen &&\n css`\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n `}\n\n ${({ $isOpen, theme }) =>\n $isOpen &&\n css`\n background-color: ${theme['100']};\n `}\n\n &:hover {\n background-color: ${({ theme }) => theme['100']};\n }\n`;\n\ntype StyledMotionFilterBackgroundProps = WithTheme<{ $top: number; $left: number }>;\n\nexport const StyledMotionFilterBackground = styled(motion.div)<StyledMotionFilterBackgroundProps>`\n width: 30px;\n\n position: absolute;\n\n top: ${({ $top }) => $top}px;\n left: ${({ $left }) => $left}px;\n\n background-color: ${({ theme }) => theme['100']};\n`;\n\nexport const StyledFilterContentWrapper = styled.div``;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Filter.styles.js","names":["_styledComponents","_interopRequireWildcard","require","_react","_keyboardFocusHighlighting","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","StyledFilter","exports","styled","div","StyledFilterHead","StyledFilterHeadline","h1","$isSearchActive","StyledFilterHeadlineElement","StyledFilterIconWrapper","StyledFilterSearch","StyledFilterIcon","$shouldShowRoundedHoverEffect","$isOpen","css","theme","$shouldShowKeyboardHighlighting","keyboardFocusHighlightingRingCss","StyledMotionFilterBackground","motion","$top","$left","StyledFilterContentWrapper"],"sources":["../../../../src/components/filter/Filter.styles.ts"],"sourcesContent":["import styled, { css } from 'styled-components';\nimport { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\nimport { motion } from 'motion/react';\nimport { keyboardFocusHighlightingRingCss } from '../../utils/keyboardFocusHighlighting.styles';\n\nexport const StyledFilter = styled.div``;\n\nexport const StyledFilterHead = styled.div`\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n\n position: relative;\n`;\n\ntype StyledFilterHeadlineProps = WithTheme<{ $isSearchActive: boolean }>;\n\nexport const StyledFilterHeadline = styled.h1<StyledFilterHeadlineProps>`\n margin: 0;\n\n opacity: ${({ $isSearchActive }) => ($isSearchActive ? 0 : 1)};\n\n transition: opacity 0.3s;\n`;\n\nexport const StyledFilterHeadlineElement = styled.div<StyledFilterHeadlineProps>`\n opacity: ${({ $isSearchActive }) => ($isSearchActive ? 0 : 1)};\n\n transition: opacity 0.3s;\n`;\n\nexport const StyledFilterIconWrapper = styled.div`\n display: flex;\n align-items: center;\n`;\n\nexport const StyledFilterSearch = styled.div`\n position: absolute;\n width: 100%;\n`;\n\ntype StyledFilterIconProps = WithTheme<{\n $isOpen: boolean;\n $shouldShowRoundedHoverEffect: boolean;\n $shouldShowKeyboardHighlighting: boolean;\n}>;\n\nexport const StyledFilterIcon = styled.div<StyledFilterIconProps>`\n cursor: pointer;\n\n aspect-ratio: 1;\n\n height: ${({ $shouldShowRoundedHoverEffect }) => ($shouldShowRoundedHoverEffect ? 42 : 30)}px;\n border-radius: ${({ $shouldShowRoundedHoverEffect }) =>\n $shouldShowRoundedHoverEffect ? 3 : 0}px;\n\n display: flex;\n align-items: center;\n justify-content: center;\n\n ${({ $shouldShowRoundedHoverEffect, $isOpen }) =>\n $shouldShowRoundedHoverEffect &&\n $isOpen &&\n css`\n border-bottom-left-radius: 0;\n border-bottom-right-radius: 0;\n `}\n\n ${({ $isOpen, theme }) =>\n $isOpen &&\n css`\n background-color: ${theme['100']};\n `}\n\n &:hover {\n background-color: ${({ theme }) => theme['100']};\n }\n\n ${({ $shouldShowKeyboardHighlighting }) =>\n $shouldShowKeyboardHighlighting &&\n css`\n &:focus-visible {\n ${keyboardFocusHighlightingRingCss}\n }\n `}\n`;\n\ntype StyledMotionFilterBackgroundProps = WithTheme<{ $top: number; $left: number }>;\n\nexport const StyledMotionFilterBackground = styled(motion.div)<StyledMotionFilterBackgroundProps>`\n width: 30px;\n\n position: absolute;\n\n top: ${({ $top }) => $top}px;\n left: ${({ $left }) => $left}px;\n\n background-color: ${({ theme }) => theme['100']};\n`;\n\nexport const StyledFilterContentWrapper = styled.div``;\n"],"mappings":"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","ignoreList":[]}
@@ -16,13 +16,15 @@ var _textStrings = _interopRequireDefault(require("../../../constants/textString
16
16
  var _FilterContent2 = require("./FilterContent.utils");
17
17
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
18
18
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
19
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); } /* eslint-disable react/jsx-props-no-spreading */
19
20
  const FilterContent = ({
20
21
  searchConfig,
21
22
  sortConfig,
22
23
  filterButtonConfig,
23
24
  checkboxConfig,
24
25
  comboboxConfig,
25
- shouldAutoFocus
26
+ shouldAutoFocus,
27
+ shouldEnableKeyboardHighlighting
26
28
  }) => {
27
29
  const searchRef = (0, _react.useRef)(null);
28
30
  const ts = _textStrings.default.components.filter.filterContent;
@@ -60,7 +62,9 @@ const FilterContent = ({
60
62
  leftElement: /*#__PURE__*/_react.default.createElement(_Icon.default, {
61
63
  icons: ['fa fa-search']
62
64
  })
63
- }), filterButtonConfig && /*#__PURE__*/_react.default.createElement(_FilterButtons.default, filterButtonConfig), sortConfig && /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabeledRow, null, /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabel, null, /*#__PURE__*/_react.default.createElement(_textstring.Textstring, {
65
+ }), filterButtonConfig && /*#__PURE__*/_react.default.createElement(_FilterButtons.default, _extends({}, filterButtonConfig, {
66
+ shouldEnableKeyboardHighlighting: filterButtonConfig.shouldEnableKeyboardHighlighting ?? shouldEnableKeyboardHighlighting
67
+ })), sortConfig && /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabeledRow, null, /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabel, null, /*#__PURE__*/_react.default.createElement(_textstring.Textstring, {
64
68
  textstring: (0, _textstring.ttsToITextString)(ts.sort)
65
69
  })), /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentControlWrapper, null, /*#__PURE__*/_react.default.createElement(_ComboBox.default, {
66
70
  lists: (0, _FilterContent2.getSortComboBoxLists)(sortConfig),
@@ -69,11 +73,16 @@ const FilterContent = ({
69
73
  text: sortConfig.selectedItem.text,
70
74
  value: sortConfig.selectedItem.id
71
75
  },
72
- onSelect: handleSelectSortItem
73
- }))), comboboxConfig && /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabeledRow, null, /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabel, null, comboboxConfig.label), /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentControlWrapper, null, /*#__PURE__*/_react.default.createElement(_ComboBox.default, comboboxConfig))), checkboxConfig &&
76
+ onSelect: handleSelectSortItem,
77
+ shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlighting
78
+ }))), comboboxConfig && /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabeledRow, null, /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentLabel, null, comboboxConfig.label), /*#__PURE__*/_react.default.createElement(_FilterContent.StyledFilterContentControlWrapper, null, /*#__PURE__*/_react.default.createElement(_ComboBox.default, _extends({}, comboboxConfig, {
79
+ shouldEnableKeyboardHighlighting: comboboxConfig.shouldEnableKeyboardHighlighting ?? shouldEnableKeyboardHighlighting
80
+ })))), checkboxConfig &&
74
81
  /*#__PURE__*/
75
82
  // eslint-disable-next-line react/jsx-props-no-spreading
76
- _react.default.createElement(_Checkbox.default, checkboxConfig))), [checkboxConfig, comboboxConfig, filterButtonConfig, handleSelectSortItem, searchConfig, sortConfig, ts.input.placeholder, ts.sort]);
83
+ _react.default.createElement(_Checkbox.default, _extends({}, checkboxConfig, {
84
+ shouldEnableKeyboardHighlighting: checkboxConfig.shouldEnableKeyboardHighlighting ?? shouldEnableKeyboardHighlighting
85
+ })))), [checkboxConfig, comboboxConfig, filterButtonConfig, handleSelectSortItem, searchConfig, shouldEnableKeyboardHighlighting, sortConfig, ts.input.placeholder, ts.sort]);
77
86
  };
78
87
  FilterContent.displayName = 'FilterContent';
79
88
  var _default = exports.default = FilterContent;
@@ -1 +1 @@
1
- {"version":3,"file":"FilterContent.js","names":["_react","_interopRequireWildcard","require","_FilterContent","_Input","_interopRequireDefault","_Icon","_FilterButtons","_ComboBox","_Checkbox","_textstring","_textStrings","_FilterContent2","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterContent","searchConfig","sortConfig","filterButtonConfig","checkboxConfig","comboboxConfig","shouldAutoFocus","searchRef","useRef","ts","textStrings","components","filter","filterContent","handleSelectSortItem","useCallback","item","text","value","onSortChange","id","useEffect","_searchRef$current","current","focus","useMemo","createElement","TextstringProvider","libraryName","StyledFilterContent","ref","onChange","ev","onSearchChange","target","placeholder","Textstring","textstring","ttsToITextString","input","searchValue","shouldShowClearIcon","length","leftElement","icons","StyledFilterContentLabeledRow","StyledFilterContentLabel","sort","StyledFilterContentControlWrapper","lists","getSortComboBoxLists","selectedItem","onSelect","label","displayName","_default","exports"],"sources":["../../../../../src/components/filter/filter-content/FilterContent.tsx"],"sourcesContent":["import React, { FC, useCallback, useEffect, useMemo, useRef } from 'react';\nimport {\n StyledFilterContentControlWrapper,\n StyledFilterContentLabel,\n StyledFilterContentLabeledRow,\n StyledFilterContent,\n} from './FilterContent.styles';\nimport Input, { InputRef } from '../../input/Input';\nimport Icon from '../../icon/Icon';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport ComboBox from '../../combobox/ComboBox';\nimport Checkbox from '../../checkbox/Checkbox';\nimport { Textstring, TextstringProvider, ttsToITextString } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\nimport type { IComboBoxItem } from '../../combobox/ComboBox.types';\nimport type { FilterContentProps } from './FilterContent.types';\nimport { getSortComboBoxLists } from './FilterContent.utils';\n\nconst FilterContent: FC<FilterContentProps> = ({\n searchConfig,\n sortConfig,\n filterButtonConfig,\n checkboxConfig,\n comboboxConfig,\n shouldAutoFocus,\n}) => {\n const searchRef = useRef<InputRef>(null);\n\n const ts = textStrings.components.filter.filterContent;\n\n const handleSelectSortItem = useCallback(\n (item: IComboBoxItem | undefined) => {\n if (!item) {\n return;\n }\n\n const { text, value } = item;\n\n if (sortConfig) {\n sortConfig.onSortChange({ text, id: value });\n }\n },\n [sortConfig],\n );\n\n useEffect(() => {\n if (shouldAutoFocus) {\n searchRef.current?.focus();\n }\n }, [shouldAutoFocus]);\n\n return useMemo(\n () => (\n <TextstringProvider libraryName=\"@chayns-components-core\">\n <StyledFilterContent>\n {searchConfig && (\n <Input\n ref={searchRef}\n onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n placeholder={\n <Textstring textstring={ttsToITextString(ts.input.placeholder)} />\n }\n value={searchConfig.searchValue}\n shouldShowClearIcon={searchConfig.searchValue.length > 0}\n leftElement={<Icon icons={['fa fa-search']} />}\n />\n )}\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n {filterButtonConfig && <FilterButtons {...filterButtonConfig} />}\n {sortConfig && (\n <StyledFilterContentLabeledRow>\n <StyledFilterContentLabel>\n <Textstring textstring={ttsToITextString(ts.sort)} />\n </StyledFilterContentLabel>\n <StyledFilterContentControlWrapper>\n <ComboBox\n lists={getSortComboBoxLists(sortConfig)}\n placeholder=\"\"\n selectedItem={{\n text: sortConfig.selectedItem.text,\n value: sortConfig.selectedItem.id,\n }}\n onSelect={handleSelectSortItem}\n />\n </StyledFilterContentControlWrapper>\n </StyledFilterContentLabeledRow>\n )}\n {comboboxConfig && (\n <StyledFilterContentLabeledRow>\n <StyledFilterContentLabel>\n {comboboxConfig.label}\n </StyledFilterContentLabel>\n <StyledFilterContentControlWrapper>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <ComboBox {...comboboxConfig} />\n </StyledFilterContentControlWrapper>\n </StyledFilterContentLabeledRow>\n )}\n {checkboxConfig && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Checkbox {...checkboxConfig} />\n )}\n </StyledFilterContent>\n </TextstringProvider>\n ),\n [\n checkboxConfig,\n comboboxConfig,\n filterButtonConfig,\n handleSelectSortItem,\n searchConfig,\n sortConfig,\n ts.input.placeholder,\n ts.sort,\n ],\n );\n};\n\nFilterContent.displayName = 'FilterContent';\n\nexport default FilterContent;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"FilterContent.js","names":["_react","_interopRequireWildcard","require","_FilterContent","_Input","_interopRequireDefault","_Icon","_FilterButtons","_ComboBox","_Checkbox","_textstring","_textStrings","_FilterContent2","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","_extends","assign","bind","arguments","length","apply","FilterContent","searchConfig","sortConfig","filterButtonConfig","checkboxConfig","comboboxConfig","shouldAutoFocus","shouldEnableKeyboardHighlighting","searchRef","useRef","ts","textStrings","components","filter","filterContent","handleSelectSortItem","useCallback","item","text","value","onSortChange","id","useEffect","_searchRef$current","current","focus","useMemo","createElement","TextstringProvider","libraryName","StyledFilterContent","ref","onChange","ev","onSearchChange","target","placeholder","Textstring","textstring","ttsToITextString","input","searchValue","shouldShowClearIcon","leftElement","icons","StyledFilterContentLabeledRow","StyledFilterContentLabel","sort","StyledFilterContentControlWrapper","lists","getSortComboBoxLists","selectedItem","onSelect","label","displayName","_default","exports"],"sources":["../../../../../src/components/filter/filter-content/FilterContent.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading */\nimport React, { FC, useCallback, useEffect, useMemo, useRef } from 'react';\nimport {\n StyledFilterContentControlWrapper,\n StyledFilterContentLabel,\n StyledFilterContentLabeledRow,\n StyledFilterContent,\n} from './FilterContent.styles';\nimport Input, { InputRef } from '../../input/Input';\nimport Icon from '../../icon/Icon';\nimport FilterButtons from '../../filter-buttons/FilterButtons';\nimport ComboBox from '../../combobox/ComboBox';\nimport Checkbox from '../../checkbox/Checkbox';\nimport { Textstring, TextstringProvider, ttsToITextString } from '@chayns-components/textstring';\nimport textStrings from '../../../constants/textStrings';\nimport type { IComboBoxItem } from '../../combobox/ComboBox.types';\nimport type { FilterContentProps } from './FilterContent.types';\nimport { getSortComboBoxLists } from './FilterContent.utils';\n\nconst FilterContent: FC<FilterContentProps> = ({\n searchConfig,\n sortConfig,\n filterButtonConfig,\n checkboxConfig,\n comboboxConfig,\n shouldAutoFocus,\n shouldEnableKeyboardHighlighting,\n}) => {\n const searchRef = useRef<InputRef>(null);\n\n const ts = textStrings.components.filter.filterContent;\n\n const handleSelectSortItem = useCallback(\n (item: IComboBoxItem | undefined) => {\n if (!item) {\n return;\n }\n\n const { text, value } = item;\n\n if (sortConfig) {\n sortConfig.onSortChange({ text, id: value });\n }\n },\n [sortConfig],\n );\n\n useEffect(() => {\n if (shouldAutoFocus) {\n searchRef.current?.focus();\n }\n }, [shouldAutoFocus]);\n\n return useMemo(\n () => (\n <TextstringProvider libraryName=\"@chayns-components-core\">\n <StyledFilterContent>\n {searchConfig && (\n <Input\n ref={searchRef}\n onChange={(ev) => searchConfig.onSearchChange(ev.target.value)}\n placeholder={\n <Textstring textstring={ttsToITextString(ts.input.placeholder)} />\n }\n value={searchConfig.searchValue}\n shouldShowClearIcon={searchConfig.searchValue.length > 0}\n leftElement={<Icon icons={['fa fa-search']} />}\n />\n )}\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n {filterButtonConfig && (\n <FilterButtons\n {...filterButtonConfig}\n shouldEnableKeyboardHighlighting={\n filterButtonConfig.shouldEnableKeyboardHighlighting ??\n shouldEnableKeyboardHighlighting\n }\n />\n )}\n {sortConfig && (\n <StyledFilterContentLabeledRow>\n <StyledFilterContentLabel>\n <Textstring textstring={ttsToITextString(ts.sort)} />\n </StyledFilterContentLabel>\n <StyledFilterContentControlWrapper>\n <ComboBox\n lists={getSortComboBoxLists(sortConfig)}\n placeholder=\"\"\n selectedItem={{\n text: sortConfig.selectedItem.text,\n value: sortConfig.selectedItem.id,\n }}\n onSelect={handleSelectSortItem}\n shouldEnableKeyboardHighlighting={\n shouldEnableKeyboardHighlighting\n }\n />\n </StyledFilterContentControlWrapper>\n </StyledFilterContentLabeledRow>\n )}\n {comboboxConfig && (\n <StyledFilterContentLabeledRow>\n <StyledFilterContentLabel>\n {comboboxConfig.label}\n </StyledFilterContentLabel>\n <StyledFilterContentControlWrapper>\n {/* eslint-disable-next-line react/jsx-props-no-spreading */}\n <ComboBox\n {...comboboxConfig}\n shouldEnableKeyboardHighlighting={\n comboboxConfig.shouldEnableKeyboardHighlighting ??\n shouldEnableKeyboardHighlighting\n }\n />\n </StyledFilterContentControlWrapper>\n </StyledFilterContentLabeledRow>\n )}\n {checkboxConfig && (\n // eslint-disable-next-line react/jsx-props-no-spreading\n <Checkbox\n {...checkboxConfig}\n shouldEnableKeyboardHighlighting={\n checkboxConfig.shouldEnableKeyboardHighlighting ??\n shouldEnableKeyboardHighlighting\n }\n />\n )}\n </StyledFilterContent>\n </TextstringProvider>\n ),\n [\n checkboxConfig,\n comboboxConfig,\n filterButtonConfig,\n handleSelectSortItem,\n searchConfig,\n shouldEnableKeyboardHighlighting,\n sortConfig,\n ts.input.placeholder,\n ts.sort,\n ],\n );\n};\n\nFilterContent.displayName = 'FilterContent';\n\nexport default FilterContent;\n"],"mappings":"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","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"FilterContent.types.js","names":[],"sources":["../../../../../src/components/filter/filter-content/FilterContent.types.ts"],"sourcesContent":["import type {\n CheckboxConfig,\n ComboboxConfig,\n FilterButtonConfig,\n SearchConfig,\n SortConfig,\n} from '../../../types/filter';\n\n/**\n * Props for the `FilterContent` component.\n */\nexport type FilterContentProps = {\n /**\n * Search configuration for the optional search input.\n */\n searchConfig?: SearchConfig;\n /**\n * Configuration for the optional filter button group.\n */\n filterButtonConfig?: FilterButtonConfig;\n /**\n * Configuration for the optional sort combobox.\n */\n sortConfig?: SortConfig;\n /**\n * Configuration for the optional checkbox.\n */\n checkboxConfig?: CheckboxConfig;\n /**\n * Configuration for the optional labeled combobox.\n */\n comboboxConfig?: ComboboxConfig;\n /**\n * Whether the search input should receive focus when the filter opens.\n */\n shouldAutoFocus: boolean;\n};\n"],"mappings":"","ignoreList":[]}
1
+ {"version":3,"file":"FilterContent.types.js","names":[],"sources":["../../../../../src/components/filter/filter-content/FilterContent.types.ts"],"sourcesContent":["import type {\n CheckboxConfig,\n ComboboxConfig,\n FilterButtonConfig,\n SearchConfig,\n SortConfig,\n} from '../../../types/filter';\n\n/**\n * Props for the `FilterContent` component.\n */\nexport type FilterContentProps = {\n /**\n * Search configuration for the optional search input.\n */\n searchConfig?: SearchConfig;\n /**\n * Configuration for the optional filter button group.\n */\n filterButtonConfig?: FilterButtonConfig;\n /**\n * Configuration for the optional sort combobox.\n */\n sortConfig?: SortConfig;\n /**\n * Configuration for the optional checkbox.\n */\n checkboxConfig?: CheckboxConfig;\n /**\n * Configuration for the optional labeled combobox.\n */\n comboboxConfig?: ComboboxConfig;\n /**\n * Whether the search input should receive focus when the filter opens.\n */\n shouldAutoFocus: boolean;\n /**\n * Enables keyboard-only focus highlighting for controls that support it.\n */\n shouldEnableKeyboardHighlighting?: boolean;\n};\n"],"mappings":"","ignoreList":[]}
@@ -18,9 +18,22 @@ const FilterButtons = ({
18
18
  onSelect,
19
19
  items,
20
20
  shouldCalcCountForAll = false,
21
- size = _filterButtons.FilterButtonSize.Normal
21
+ size = _filterButtons.FilterButtonSize.Normal,
22
+ shouldEnableKeyboardHighlighting
22
23
  }) => {
23
24
  const [selectedIds, setSelectedIds] = (0, _react.useState)(['all']);
25
+ const [focusedId, setFocusedId] = (0, _react.useState)('all');
26
+ const buttonRefs = (0, _react.useRef)({});
27
+ const keyboardNavigationItems = (0, _react.useMemo)(() => [{
28
+ id: 'all',
29
+ isDisabled: false
30
+ }, ...items.map(({
31
+ id,
32
+ isDisabled
33
+ }) => ({
34
+ id,
35
+ isDisabled: Boolean(isDisabled)
36
+ }))], [items]);
24
37
 
25
38
  /**
26
39
  * This function set the selectedItemKey
@@ -49,6 +62,44 @@ const FilterButtons = ({
49
62
  onSelect(newIds.filter(selectedId => selectedId !== 'all'));
50
63
  }
51
64
  }, [onSelect, selectedIds]);
65
+ (0, _react.useEffect)(() => {
66
+ const currentFocusedItem = keyboardNavigationItems.find(({
67
+ id
68
+ }) => id === focusedId);
69
+ if (currentFocusedItem && !currentFocusedItem.isDisabled) {
70
+ return;
71
+ }
72
+ const nextFocusable = keyboardNavigationItems.find(({
73
+ isDisabled
74
+ }) => !isDisabled);
75
+ if (nextFocusable) {
76
+ setFocusedId(nextFocusable.id);
77
+ }
78
+ }, [focusedId, keyboardNavigationItems]);
79
+ const handleArrowNavigate = (0, _react.useCallback)((currentId, direction) => {
80
+ if (!shouldEnableKeyboardHighlighting || keyboardNavigationItems.length < 2) {
81
+ return;
82
+ }
83
+ const startIndex = keyboardNavigationItems.findIndex(({
84
+ id
85
+ }) => id === currentId);
86
+ if (startIndex < 0) {
87
+ return;
88
+ }
89
+ let attempts = 0;
90
+ let nextIndex = startIndex;
91
+ while (attempts < keyboardNavigationItems.length) {
92
+ nextIndex = (nextIndex + direction + keyboardNavigationItems.length) % keyboardNavigationItems.length;
93
+ const nextItem = keyboardNavigationItems[nextIndex];
94
+ if (nextItem && !nextItem.isDisabled) {
95
+ var _buttonRefs$current$n;
96
+ setFocusedId(nextItem.id);
97
+ (_buttonRefs$current$n = buttonRefs.current[nextItem.id]) === null || _buttonRefs$current$n === void 0 || _buttonRefs$current$n.focus();
98
+ return;
99
+ }
100
+ attempts += 1;
101
+ }
102
+ }, [keyboardNavigationItems, shouldEnableKeyboardHighlighting]);
52
103
  const reactItems = (0, _react.useMemo)(() => {
53
104
  if (items.length === 0) {
54
105
  return null;
@@ -63,7 +114,14 @@ const FilterButtons = ({
63
114
  count: allButtonCount,
64
115
  isSelected: selectedIds.includes('all') || Array.isArray(selectedIds) && selectedIds.length === 0,
65
116
  size: size,
66
- onSelect: handleSelect
117
+ onSelect: handleSelect,
118
+ shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlighting,
119
+ onArrowNavigate: handleArrowNavigate,
120
+ onFocus: setFocusedId,
121
+ tabIndex: 0,
122
+ buttonRef: element => {
123
+ buttonRefs.current.all = element;
124
+ }
67
125
  }))];
68
126
  items.forEach(({
69
127
  icons,
@@ -84,11 +142,18 @@ const FilterButtons = ({
84
142
  shape: _filterButtons.FilterButtonItemShape.Round,
85
143
  size: size,
86
144
  text: text,
87
- isDisabled: isDisabled
145
+ isDisabled: isDisabled,
146
+ shouldEnableKeyboardHighlighting: shouldEnableKeyboardHighlighting,
147
+ onArrowNavigate: handleArrowNavigate,
148
+ onFocus: setFocusedId,
149
+ tabIndex: isDisabled ? -1 : 0,
150
+ buttonRef: element => {
151
+ buttonRefs.current[id] = element;
152
+ }
88
153
  }));
89
154
  });
90
155
  return array;
91
- }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);
156
+ }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, shouldEnableKeyboardHighlighting, handleArrowNavigate, size]);
92
157
  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterButtons.StyledFilterButton, null, reactItems), [reactItems]);
93
158
  };
94
159
  FilterButtons.displayName = 'FilterButtons';
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","_AllButton","_textstring","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButtons","allCount","selectedItemIds","onSelect","items","shouldCalcCountForAll","size","FilterButtonSize","Normal","selectedIds","setSelectedIds","useState","useEffect","handleSelect","useCallback","id","newIds","includes","filter","filteredId","length","selectedId","reactItems","useMemo","allButtonCount","reduce","acc","item","count","array","createElement","TextstringProvider","libraryName","AllButton","isSelected","Array","isArray","forEach","icons","text","color","isDisabled","push","key","shape","FilterButtonItemShape","Round","StyledFilterButton","displayName","_default","exports"],"sources":["../../../../src/components/filter-buttons/FilterButtons.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useState } from 'react';\nimport {\n FilterButtonItemShape,\n FilterButtonSize,\n IFilterButtonItem,\n} from '../../types/filterButtons';\nimport FilterButton from './filter-button/FilterButton';\nimport { StyledFilterButton } from './FilterButtons.styles';\nimport { AllButton } from './all-button/AllButton';\nimport { TextstringProvider } from '@chayns-components/textstring';\n\nexport type FilterButtonsProps = {\n /**\n * The number that should be displayed as count in the \"all\" button.\n */\n allCount?: number;\n /**\n * The items that should be displayed.\n */\n items: IFilterButtonItem[];\n /**\n * A function that should be executed when an item is selected.\n */\n onSelect?: (keys: string[]) => void;\n /**\n * The keys of items that should be selected.\n */\n selectedItemIds?: string[];\n /**\n * If true, the count of all items will be shown in the \"all\" button.\n */\n shouldCalcCountForAll?: boolean;\n /**\n * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n allCount,\n selectedItemIds,\n onSelect,\n items,\n shouldCalcCountForAll = false,\n size = FilterButtonSize.Normal,\n}) => {\n const [selectedIds, setSelectedIds] = useState<string[]>(['all']);\n\n /**\n * This function set the selectedItemKey\n */\n useEffect(() => {\n if (selectedItemIds) {\n setSelectedIds(selectedItemIds);\n }\n }, [selectedItemIds]);\n\n /**\n * Function to update the selected items\n */\n const handleSelect = useCallback(\n (id: string) => {\n let newIds: string[];\n\n if (id === 'all') {\n newIds = selectedIds.includes('all') ? ['all'] : [];\n } else {\n newIds = selectedIds.includes(id)\n ? selectedIds.filter((filteredId) => filteredId !== id)\n : [...selectedIds.filter((filteredId) => filteredId !== 'all'), id];\n }\n\n if (newIds.length === 0) {\n newIds = ['all'];\n }\n\n setSelectedIds(newIds);\n\n if (typeof onSelect === 'function') {\n onSelect(newIds.filter((selectedId) => selectedId !== 'all'));\n }\n },\n [onSelect, selectedIds],\n );\n\n const reactItems = useMemo(() => {\n if (items.length === 0) {\n return null;\n }\n\n let allButtonCount = allCount;\n\n if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {\n allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);\n }\n\n const array: ReactElement[] = [\n <TextstringProvider libraryName=\"@chayns-components-core\">\n <AllButton\n count={allButtonCount}\n isSelected={\n selectedIds.includes('all') ||\n (Array.isArray(selectedIds) && selectedIds.length === 0)\n }\n size={size}\n onSelect={handleSelect}\n />\n </TextstringProvider>,\n ];\n\n items.forEach(({ icons, text, color, count, id, isDisabled }) => {\n array.push(\n <FilterButton\n color={color}\n icons={icons}\n id={id}\n key={id}\n count={count}\n onSelect={handleSelect}\n isSelected={selectedIds.includes(id)}\n shape={FilterButtonItemShape.Round}\n size={size}\n text={text}\n isDisabled={isDisabled}\n />,\n );\n });\n\n return array;\n }, [allCount, handleSelect, items, selectedIds, shouldCalcCountForAll, size]);\n\n return useMemo(() => <StyledFilterButton>{reactItems}</StyledFilterButton>, [reactItems]);\n};\n\nFilterButtons.displayName = 'FilterButtons';\n\nexport default FilterButtons;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"FilterButtons.js","names":["_react","_interopRequireWildcard","require","_filterButtons","_FilterButton","_interopRequireDefault","_FilterButtons","_AllButton","_textstring","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButtons","allCount","selectedItemIds","onSelect","items","shouldCalcCountForAll","size","FilterButtonSize","Normal","shouldEnableKeyboardHighlighting","selectedIds","setSelectedIds","useState","focusedId","setFocusedId","buttonRefs","useRef","keyboardNavigationItems","useMemo","id","isDisabled","map","Boolean","useEffect","handleSelect","useCallback","newIds","includes","filter","filteredId","length","selectedId","currentFocusedItem","find","nextFocusable","handleArrowNavigate","currentId","direction","startIndex","findIndex","attempts","nextIndex","nextItem","_buttonRefs$current$n","current","focus","reactItems","allButtonCount","reduce","acc","item","count","array","createElement","TextstringProvider","libraryName","AllButton","isSelected","Array","isArray","onArrowNavigate","onFocus","tabIndex","buttonRef","element","all","forEach","icons","text","color","push","key","shape","FilterButtonItemShape","Round","StyledFilterButton","displayName","_default","exports"],"sources":["../../../../src/components/filter-buttons/FilterButtons.tsx"],"sourcesContent":["import React, { FC, ReactElement, useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport {\n FilterButtonItemShape,\n FilterButtonSize,\n IFilterButtonItem,\n} from '../../types/filterButtons';\nimport FilterButton from './filter-button/FilterButton';\nimport { StyledFilterButton } from './FilterButtons.styles';\nimport { AllButton } from './all-button/AllButton';\nimport { TextstringProvider } from '@chayns-components/textstring';\n\nexport type FilterButtonsProps = {\n /**\n * The number that should be displayed as count in the \"all\" button.\n */\n allCount?: number;\n /**\n * The items that should be displayed.\n */\n items: IFilterButtonItem[];\n /**\n * A function that should be executed when an item is selected.\n */\n onSelect?: (keys: string[]) => void;\n /**\n * The keys of items that should be selected.\n */\n selectedItemIds?: string[];\n /**\n * If true, the count of all items will be shown in the \"all\" button.\n */\n shouldCalcCountForAll?: boolean;\n /**\n * The size auf the filter buttons. Use the FilterButtonSize enum.\n */\n size?: FilterButtonSize;\n /**\n * Enables keyboard-only focus highlighting for filter buttons.\n */\n shouldEnableKeyboardHighlighting?: boolean;\n};\n\nconst FilterButtons: FC<FilterButtonsProps> = ({\n allCount,\n selectedItemIds,\n onSelect,\n items,\n shouldCalcCountForAll = false,\n size = FilterButtonSize.Normal,\n shouldEnableKeyboardHighlighting,\n}) => {\n const [selectedIds, setSelectedIds] = useState<string[]>(['all']);\n const [focusedId, setFocusedId] = useState<string>('all');\n const buttonRefs = useRef<Record<string, HTMLDivElement | null>>({});\n\n const keyboardNavigationItems = useMemo(\n () => [\n { id: 'all', isDisabled: false },\n ...items.map(({ id, isDisabled }) => ({ id, isDisabled: Boolean(isDisabled) })),\n ],\n [items],\n );\n\n /**\n * This function set the selectedItemKey\n */\n useEffect(() => {\n if (selectedItemIds) {\n setSelectedIds(selectedItemIds);\n }\n }, [selectedItemIds]);\n\n /**\n * Function to update the selected items\n */\n const handleSelect = useCallback(\n (id: string) => {\n let newIds: string[];\n\n if (id === 'all') {\n newIds = selectedIds.includes('all') ? ['all'] : [];\n } else {\n newIds = selectedIds.includes(id)\n ? selectedIds.filter((filteredId) => filteredId !== id)\n : [...selectedIds.filter((filteredId) => filteredId !== 'all'), id];\n }\n\n if (newIds.length === 0) {\n newIds = ['all'];\n }\n\n setSelectedIds(newIds);\n\n if (typeof onSelect === 'function') {\n onSelect(newIds.filter((selectedId) => selectedId !== 'all'));\n }\n },\n [onSelect, selectedIds],\n );\n\n useEffect(() => {\n const currentFocusedItem = keyboardNavigationItems.find(({ id }) => id === focusedId);\n\n if (currentFocusedItem && !currentFocusedItem.isDisabled) {\n return;\n }\n\n const nextFocusable = keyboardNavigationItems.find(({ isDisabled }) => !isDisabled);\n\n if (nextFocusable) {\n setFocusedId(nextFocusable.id);\n }\n }, [focusedId, keyboardNavigationItems]);\n\n const handleArrowNavigate = useCallback(\n (currentId: string, direction: -1 | 1) => {\n if (!shouldEnableKeyboardHighlighting || keyboardNavigationItems.length < 2) {\n return;\n }\n\n const startIndex = keyboardNavigationItems.findIndex(({ id }) => id === currentId);\n\n if (startIndex < 0) {\n return;\n }\n\n let attempts = 0;\n let nextIndex = startIndex;\n\n while (attempts < keyboardNavigationItems.length) {\n nextIndex =\n (nextIndex + direction + keyboardNavigationItems.length) %\n keyboardNavigationItems.length;\n\n const nextItem = keyboardNavigationItems[nextIndex];\n\n if (nextItem && !nextItem.isDisabled) {\n setFocusedId(nextItem.id);\n buttonRefs.current[nextItem.id]?.focus();\n return;\n }\n\n attempts += 1;\n }\n },\n [keyboardNavigationItems, shouldEnableKeyboardHighlighting],\n );\n\n const reactItems = useMemo(() => {\n if (items.length === 0) {\n return null;\n }\n\n let allButtonCount = allCount;\n\n if (typeof allButtonCount !== 'number' && shouldCalcCountForAll) {\n allButtonCount = items.reduce((acc, item) => acc + (item.count || 0), 0);\n }\n\n const array: ReactElement[] = [\n <TextstringProvider libraryName=\"@chayns-components-core\">\n <AllButton\n count={allButtonCount}\n isSelected={\n selectedIds.includes('all') ||\n (Array.isArray(selectedIds) && selectedIds.length === 0)\n }\n size={size}\n onSelect={handleSelect}\n shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n onArrowNavigate={handleArrowNavigate}\n onFocus={setFocusedId}\n tabIndex={0}\n buttonRef={(element) => {\n buttonRefs.current.all = element;\n }}\n />\n </TextstringProvider>,\n ];\n\n items.forEach(({ icons, text, color, count, id, isDisabled }) => {\n array.push(\n <FilterButton\n color={color}\n icons={icons}\n id={id}\n key={id}\n count={count}\n onSelect={handleSelect}\n isSelected={selectedIds.includes(id)}\n shape={FilterButtonItemShape.Round}\n size={size}\n text={text}\n isDisabled={isDisabled}\n shouldEnableKeyboardHighlighting={shouldEnableKeyboardHighlighting}\n onArrowNavigate={handleArrowNavigate}\n onFocus={setFocusedId}\n tabIndex={isDisabled ? -1 : 0}\n buttonRef={(element) => {\n buttonRefs.current[id] = element;\n }}\n />,\n );\n });\n\n return array;\n }, [\n allCount,\n handleSelect,\n items,\n selectedIds,\n shouldCalcCountForAll,\n shouldEnableKeyboardHighlighting,\n handleArrowNavigate,\n size,\n ]);\n\n return useMemo(() => <StyledFilterButton>{reactItems}</StyledFilterButton>, [reactItems]);\n};\n\nFilterButtons.displayName = 'FilterButtons';\n\nexport default FilterButtons;\n"],"mappings":"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","ignoreList":[]}
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = void 0;
7
7
  var _react = _interopRequireWildcard(require("react"));
8
+ var _useKeyboardFocusHighlighting = require("../../../hooks/useKeyboardFocusHighlighting");
8
9
  var _Icon = _interopRequireDefault(require("../../icon/Icon"));
9
10
  var _FilterButton = require("./FilterButton.styles");
10
11
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -19,8 +20,14 @@ const FilterButton = ({
19
20
  isSelected,
20
21
  id,
21
22
  isDisabled,
23
+ shouldEnableKeyboardHighlighting,
24
+ tabIndex,
25
+ onFocus,
26
+ onArrowNavigate,
27
+ buttonRef,
22
28
  onSelect
23
29
  }) => {
30
+ const shouldShowKeyboardHighlighting = (0, _useKeyboardFocusHighlighting.useKeyboardFocusHighlighting)(shouldEnableKeyboardHighlighting && !isDisabled);
24
31
  const handleClick = (0, _react.useCallback)(event => {
25
32
  if (isDisabled) {
26
33
  return;
@@ -29,11 +36,42 @@ const FilterButton = ({
29
36
  event.stopPropagation();
30
37
  onSelect(id);
31
38
  }, [id, isDisabled, onSelect]);
39
+ const handleKeyDown = (0, _react.useCallback)(event => {
40
+ if (isDisabled) {
41
+ return;
42
+ }
43
+ if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {
44
+ event.preventDefault();
45
+ onArrowNavigate === null || onArrowNavigate === void 0 || onArrowNavigate(id, 1);
46
+ return;
47
+ }
48
+ if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {
49
+ event.preventDefault();
50
+ onArrowNavigate === null || onArrowNavigate === void 0 || onArrowNavigate(id, -1);
51
+ return;
52
+ }
53
+ if (event.key === 'Enter' || event.key === ' ') {
54
+ event.preventDefault();
55
+ onSelect(id);
56
+ }
57
+ }, [id, isDisabled, onArrowNavigate, onSelect]);
58
+ const handleFocus = (0, _react.useCallback)(() => {
59
+ onFocus === null || onFocus === void 0 || onFocus(id);
60
+ }, [id, onFocus]);
32
61
  return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItem, {
62
+ ref: buttonRef,
63
+ $shape: shape,
33
64
  $isSelected: isSelected,
34
65
  $isDisabled: isDisabled,
66
+ $shouldShowKeyboardHighlighting: shouldShowKeyboardHighlighting,
35
67
  $size: size,
36
- onClick: handleClick
68
+ onClick: handleClick,
69
+ onKeyDown: handleKeyDown,
70
+ onFocus: handleFocus,
71
+ role: shouldEnableKeyboardHighlighting ? 'button' : undefined,
72
+ tabIndex: !isDisabled ? tabIndex ?? 0 : -1,
73
+ "aria-pressed": shouldEnableKeyboardHighlighting ? isSelected : undefined,
74
+ "aria-disabled": shouldEnableKeyboardHighlighting ? isDisabled : undefined
37
75
  }, /*#__PURE__*/_react.default.createElement(_FilterButton.StyledFilterButtonItemLabel, null, icons && /*#__PURE__*/_react.default.createElement(_Icon.default, {
38
76
  icons: icons,
39
77
  size: 15
@@ -45,7 +83,7 @@ const FilterButton = ({
45
83
  $isSelected: isSelected,
46
84
  $shape: shape,
47
85
  $color: color
48
- })), [color, count, handleClick, icons, isDisabled, isSelected, shape, size, text]);
86
+ })), [color, buttonRef, count, handleClick, handleFocus, handleKeyDown, icons, isDisabled, isSelected, shape, shouldEnableKeyboardHighlighting, shouldShowKeyboardHighlighting, size, tabIndex, text]);
49
87
  };
50
88
  FilterButton.displayName = 'FilterButton';
51
89
  var _default = exports.default = FilterButton;
@@ -1 +1 @@
1
- {"version":3,"file":"FilterButton.js","names":["_react","_interopRequireWildcard","require","_Icon","_interopRequireDefault","_FilterButton","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButton","icons","size","shape","text","color","count","isSelected","id","isDisabled","onSelect","handleClick","useCallback","event","preventDefault","stopPropagation","useMemo","createElement","StyledFilterButtonItem","$isSelected","$isDisabled","$size","onClick","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","StyledFilterButtonItemLabelCount","toLocaleString","StyledFilterButtonItemBorder","$shape","$color","StyledMotionFilterButtonItemBackground","displayName","_default","exports"],"sources":["../../../../../src/components/filter-buttons/filter-button/FilterButton.tsx"],"sourcesContent":["import React, { CSSProperties, FC, MouseEvent, useCallback, useMemo } from 'react';\nimport type { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';\nimport Icon from '../../icon/Icon';\nimport {\n StyledFilterButtonItem,\n StyledFilterButtonItemBorder,\n StyledFilterButtonItemLabel,\n StyledFilterButtonItemLabelCount,\n StyledFilterButtonItemLabelText,\n StyledMotionFilterButtonItemBackground,\n} from './FilterButton.styles';\n\nexport type FilterButtonProps = {\n color?: CSSProperties['color'];\n icons?: string[];\n isSelected: boolean;\n shape: FilterButtonItemShape;\n size: FilterButtonSize;\n count?: number;\n text: string;\n id: string;\n isDisabled?: boolean;\n onSelect: (key: string) => void;\n};\n\nconst FilterButton: FC<FilterButtonProps> = ({\n icons,\n size,\n shape,\n text,\n color,\n count,\n isSelected,\n id,\n isDisabled,\n onSelect,\n}) => {\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (isDisabled) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n onSelect(id);\n },\n [id, isDisabled, onSelect],\n );\n\n return useMemo(\n () => (\n <StyledFilterButtonItem\n $isSelected={isSelected}\n $isDisabled={isDisabled}\n $size={size}\n onClick={handleClick}\n >\n <StyledFilterButtonItemLabel>\n {icons && <Icon icons={icons} size={15} />}\n <StyledFilterButtonItemLabelText>{text}</StyledFilterButtonItemLabelText>\n {typeof count === 'number' && (\n <StyledFilterButtonItemLabelCount>\n {count.toLocaleString()}\n </StyledFilterButtonItemLabelCount>\n )}\n </StyledFilterButtonItemLabel>\n <StyledFilterButtonItemBorder\n $isSelected={isSelected}\n $shape={shape}\n $color={color}\n />\n <StyledMotionFilterButtonItemBackground\n $isSelected={isSelected}\n $shape={shape}\n $color={color}\n />\n </StyledFilterButtonItem>\n ),\n [color, count, handleClick, icons, isDisabled, isSelected, shape, size, text],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"FilterButton.js","names":["_react","_interopRequireWildcard","require","_useKeyboardFocusHighlighting","_Icon","_interopRequireDefault","_FilterButton","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","FilterButton","icons","size","shape","text","color","count","isSelected","id","isDisabled","shouldEnableKeyboardHighlighting","tabIndex","onFocus","onArrowNavigate","buttonRef","onSelect","shouldShowKeyboardHighlighting","useKeyboardFocusHighlighting","handleClick","useCallback","event","preventDefault","stopPropagation","handleKeyDown","key","handleFocus","useMemo","createElement","StyledFilterButtonItem","ref","$shape","$isSelected","$isDisabled","$shouldShowKeyboardHighlighting","$size","onClick","onKeyDown","role","undefined","StyledFilterButtonItemLabel","StyledFilterButtonItemLabelText","StyledFilterButtonItemLabelCount","toLocaleString","StyledFilterButtonItemBorder","$color","StyledMotionFilterButtonItemBackground","displayName","_default","exports"],"sources":["../../../../../src/components/filter-buttons/filter-button/FilterButton.tsx"],"sourcesContent":["import React, {\n CSSProperties,\n FC,\n KeyboardEventHandler,\n MouseEvent,\n useCallback,\n useMemo,\n} from 'react';\nimport type { FilterButtonItemShape, FilterButtonSize } from '../../../types/filterButtons';\nimport { useKeyboardFocusHighlighting } from '../../../hooks/useKeyboardFocusHighlighting';\nimport Icon from '../../icon/Icon';\nimport {\n StyledFilterButtonItem,\n StyledFilterButtonItemBorder,\n StyledFilterButtonItemLabel,\n StyledFilterButtonItemLabelCount,\n StyledFilterButtonItemLabelText,\n StyledMotionFilterButtonItemBackground,\n} from './FilterButton.styles';\n\nexport type FilterButtonProps = {\n color?: CSSProperties['color'];\n icons?: string[];\n isSelected: boolean;\n shape: FilterButtonItemShape;\n size: FilterButtonSize;\n count?: number;\n text: string;\n id: string;\n isDisabled?: boolean;\n shouldEnableKeyboardHighlighting?: boolean;\n tabIndex?: number;\n onFocus?: (id: string) => void;\n onArrowNavigate?: (id: string, direction: -1 | 1) => void;\n buttonRef?: (element: HTMLDivElement | null) => void;\n onSelect: (key: string) => void;\n};\n\nconst FilterButton: FC<FilterButtonProps> = ({\n icons,\n size,\n shape,\n text,\n color,\n count,\n isSelected,\n id,\n isDisabled,\n shouldEnableKeyboardHighlighting,\n tabIndex,\n onFocus,\n onArrowNavigate,\n buttonRef,\n onSelect,\n}) => {\n const shouldShowKeyboardHighlighting = useKeyboardFocusHighlighting(\n shouldEnableKeyboardHighlighting && !isDisabled,\n );\n\n const handleClick = useCallback(\n (event: MouseEvent) => {\n if (isDisabled) {\n return;\n }\n\n event.preventDefault();\n event.stopPropagation();\n\n onSelect(id);\n },\n [id, isDisabled, onSelect],\n );\n\n const handleKeyDown = useCallback<KeyboardEventHandler<HTMLDivElement>>(\n (event) => {\n if (isDisabled) {\n return;\n }\n\n if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {\n event.preventDefault();\n onArrowNavigate?.(id, 1);\n return;\n }\n\n if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {\n event.preventDefault();\n onArrowNavigate?.(id, -1);\n return;\n }\n\n if (event.key === 'Enter' || event.key === ' ') {\n event.preventDefault();\n onSelect(id);\n }\n },\n [id, isDisabled, onArrowNavigate, onSelect],\n );\n\n const handleFocus = useCallback(() => {\n onFocus?.(id);\n }, [id, onFocus]);\n\n return useMemo(\n () => (\n <StyledFilterButtonItem\n ref={buttonRef}\n $shape={shape}\n $isSelected={isSelected}\n $isDisabled={isDisabled}\n $shouldShowKeyboardHighlighting={shouldShowKeyboardHighlighting}\n $size={size}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onFocus={handleFocus}\n role={shouldEnableKeyboardHighlighting ? 'button' : undefined}\n tabIndex={!isDisabled ? (tabIndex ?? 0) : -1}\n aria-pressed={shouldEnableKeyboardHighlighting ? isSelected : undefined}\n aria-disabled={shouldEnableKeyboardHighlighting ? isDisabled : undefined}\n >\n <StyledFilterButtonItemLabel>\n {icons && <Icon icons={icons} size={15} />}\n <StyledFilterButtonItemLabelText>{text}</StyledFilterButtonItemLabelText>\n {typeof count === 'number' && (\n <StyledFilterButtonItemLabelCount>\n {count.toLocaleString()}\n </StyledFilterButtonItemLabelCount>\n )}\n </StyledFilterButtonItemLabel>\n <StyledFilterButtonItemBorder\n $isSelected={isSelected}\n $shape={shape}\n $color={color}\n />\n <StyledMotionFilterButtonItemBackground\n $isSelected={isSelected}\n $shape={shape}\n $color={color}\n />\n </StyledFilterButtonItem>\n ),\n [\n color,\n buttonRef,\n count,\n handleClick,\n handleFocus,\n handleKeyDown,\n icons,\n isDisabled,\n isSelected,\n shape,\n shouldEnableKeyboardHighlighting,\n shouldShowKeyboardHighlighting,\n size,\n tabIndex,\n text,\n ],\n );\n};\n\nFilterButton.displayName = 'FilterButton';\n\nexport default FilterButton;\n"],"mappings":"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","ignoreList":[]}