@protonradio/proton-ui 0.11.6 → 0.11.8

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 (493) hide show
  1. package/dist/{constants/breakpoint.es.js → breakpoint-9y1_8U_b.mjs} +2 -2
  2. package/dist/breakpoint-9y1_8U_b.mjs.map +1 -0
  3. package/dist/breakpoint-DtqbboOa.js +2 -0
  4. package/dist/breakpoint-DtqbboOa.js.map +1 -0
  5. package/dist/color2k-CpDB_dpw.mjs +168 -0
  6. package/dist/color2k-CpDB_dpw.mjs.map +1 -0
  7. package/dist/color2k-DCgwXUem.js +2 -0
  8. package/dist/color2k-DCgwXUem.js.map +1 -0
  9. package/dist/{design/colors.es.js → colors-CWaj9dFz.mjs} +7 -7
  10. package/dist/colors-CWaj9dFz.mjs.map +1 -0
  11. package/dist/colors-CebzFjpe.js +2 -0
  12. package/dist/{design/darkTheme/colors.es.js.map → colors-CebzFjpe.js.map} +1 -1
  13. package/dist/{design/darkTheme/colors.es.js → colors-Ceyo4oCJ.mjs} +13 -13
  14. package/dist/{design/darkTheme/colors.cjs.js.map → colors-Ceyo4oCJ.mjs.map} +1 -1
  15. package/dist/colors-CmSJBHaf.js +2 -0
  16. package/dist/colors-CmSJBHaf.js.map +1 -0
  17. package/dist/colors-DL1dYffC.js +2 -0
  18. package/dist/{design/lightTheme/colors.es.js.map → colors-DL1dYffC.js.map} +1 -1
  19. package/dist/{design/lightTheme/colors.es.js → colors-DMkDnu4U.mjs} +11 -11
  20. package/dist/{design/lightTheme/colors.cjs.js.map → colors-DMkDnu4U.mjs.map} +1 -1
  21. package/dist/constants.cjs.js +1 -1
  22. package/dist/constants.cjs.js.map +1 -1
  23. package/dist/constants.es.js +26 -3
  24. package/dist/constants.es.js.map +1 -1
  25. package/dist/dark.cjs.js +2 -0
  26. package/dist/dark.cjs.js.map +1 -0
  27. package/dist/{design/darkTheme/stylesheet.es.js → dark.es.js} +15 -9
  28. package/dist/dark.es.js.map +1 -0
  29. package/dist/hooks.cjs.js +1 -1
  30. package/dist/hooks.cjs.js.map +1 -1
  31. package/dist/hooks.es.js +37 -8
  32. package/dist/hooks.es.js.map +1 -1
  33. package/dist/image-CUSfY1_T.js +2 -0
  34. package/dist/image-CUSfY1_T.js.map +1 -0
  35. package/dist/image-DFyN0Kd9.mjs +207 -0
  36. package/dist/image-DFyN0Kd9.mjs.map +1 -0
  37. package/dist/index.cjs.js +30 -1
  38. package/dist/index.cjs.js.map +1 -1
  39. package/dist/index.d.ts +4 -0
  40. package/dist/index.es.js +5340 -60
  41. package/dist/index.es.js.map +1 -1
  42. package/dist/light.cjs.js +2 -0
  43. package/dist/light.cjs.js.map +1 -0
  44. package/dist/{design/lightTheme/stylesheet.es.js → light.es.js} +16 -10
  45. package/dist/light.es.js.map +1 -0
  46. package/dist/navigation-BB0MBIiR.js +2 -0
  47. package/dist/navigation-BB0MBIiR.js.map +1 -0
  48. package/dist/navigation-Bj7Pex9j.mjs +43 -0
  49. package/dist/navigation-Bj7Pex9j.mjs.map +1 -0
  50. package/dist/theme.cjs.js +1 -1
  51. package/dist/theme.cjs.js.map +1 -1
  52. package/dist/theme.es.js +15 -9
  53. package/dist/theme.es.js.map +1 -1
  54. package/dist/useBreakpoint-CjRyGKN-.mjs +53 -0
  55. package/dist/useBreakpoint-CjRyGKN-.mjs.map +1 -0
  56. package/dist/useBreakpoint-DA-JqOu3.js +2 -0
  57. package/dist/useBreakpoint-DA-JqOu3.js.map +1 -0
  58. package/dist/utils.cjs.js +1 -1
  59. package/dist/utils.es.js +15 -19
  60. package/dist/utils.es.js.map +1 -1
  61. package/package.json +13 -13
  62. package/dist/_virtual/jsx-runtime.cjs.js +0 -2
  63. package/dist/_virtual/jsx-runtime.cjs.js.map +0 -1
  64. package/dist/_virtual/jsx-runtime.es.js +0 -5
  65. package/dist/_virtual/jsx-runtime.es.js.map +0 -1
  66. package/dist/_virtual/react-jsx-runtime.development.cjs.js +0 -2
  67. package/dist/_virtual/react-jsx-runtime.development.cjs.js.map +0 -1
  68. package/dist/_virtual/react-jsx-runtime.development.es.js +0 -5
  69. package/dist/_virtual/react-jsx-runtime.development.es.js.map +0 -1
  70. package/dist/_virtual/react-jsx-runtime.production.min.cjs.js +0 -2
  71. package/dist/_virtual/react-jsx-runtime.production.min.cjs.js.map +0 -1
  72. package/dist/_virtual/react-jsx-runtime.production.min.es.js +0 -5
  73. package/dist/_virtual/react-jsx-runtime.production.min.es.js.map +0 -1
  74. package/dist/assets/svg/icons.svg.cjs.js +0 -2
  75. package/dist/assets/svg/icons.svg.cjs.js.map +0 -1
  76. package/dist/assets/svg/icons.svg.es.js +0 -5
  77. package/dist/assets/svg/icons.svg.es.js.map +0 -1
  78. package/dist/components/ActionMenu/ActionMenu.cjs.js +0 -2
  79. package/dist/components/ActionMenu/ActionMenu.cjs.js.map +0 -1
  80. package/dist/components/ActionMenu/ActionMenu.es.js +0 -262
  81. package/dist/components/ActionMenu/ActionMenu.es.js.map +0 -1
  82. package/dist/components/Badge/Badge.cjs.js +0 -2
  83. package/dist/components/Badge/Badge.cjs.js.map +0 -1
  84. package/dist/components/Badge/Badge.es.js +0 -25
  85. package/dist/components/Badge/Badge.es.js.map +0 -1
  86. package/dist/components/Banner/Banner.cjs.js +0 -2
  87. package/dist/components/Banner/Banner.cjs.js.map +0 -1
  88. package/dist/components/Banner/Banner.es.js +0 -131
  89. package/dist/components/Banner/Banner.es.js.map +0 -1
  90. package/dist/components/Button/Button.cjs.js +0 -2
  91. package/dist/components/Button/Button.cjs.js.map +0 -1
  92. package/dist/components/Button/Button.es.js +0 -99
  93. package/dist/components/Button/Button.es.js.map +0 -1
  94. package/dist/components/ButtonGroup/ButtonGroup.cjs.js +0 -2
  95. package/dist/components/ButtonGroup/ButtonGroup.cjs.js.map +0 -1
  96. package/dist/components/ButtonGroup/ButtonGroup.es.js +0 -51
  97. package/dist/components/ButtonGroup/ButtonGroup.es.js.map +0 -1
  98. package/dist/components/ButtonWithSelect/ButtonWithSelect.cjs.js +0 -2
  99. package/dist/components/ButtonWithSelect/ButtonWithSelect.cjs.js.map +0 -1
  100. package/dist/components/ButtonWithSelect/ButtonWithSelect.es.js +0 -80
  101. package/dist/components/ButtonWithSelect/ButtonWithSelect.es.js.map +0 -1
  102. package/dist/components/DataTable/DataTable.cjs.js +0 -2
  103. package/dist/components/DataTable/DataTable.cjs.js.map +0 -1
  104. package/dist/components/DataTable/DataTable.es.js +0 -137
  105. package/dist/components/DataTable/DataTable.es.js.map +0 -1
  106. package/dist/components/Dialog/Dialog.cjs.js +0 -2
  107. package/dist/components/Dialog/Dialog.cjs.js.map +0 -1
  108. package/dist/components/Dialog/Dialog.es.js +0 -15
  109. package/dist/components/Dialog/Dialog.es.js.map +0 -1
  110. package/dist/components/Elevation/Elevation.cjs.js +0 -2
  111. package/dist/components/Elevation/Elevation.cjs.js.map +0 -1
  112. package/dist/components/Elevation/Elevation.es.js +0 -33
  113. package/dist/components/Elevation/Elevation.es.js.map +0 -1
  114. package/dist/components/Icon/Icon.cjs.js +0 -2
  115. package/dist/components/Icon/Icon.cjs.js.map +0 -1
  116. package/dist/components/Icon/Icon.es.js +0 -42
  117. package/dist/components/Icon/Icon.es.js.map +0 -1
  118. package/dist/components/ImageBackground/ImageBackground.cjs.js +0 -2
  119. package/dist/components/ImageBackground/ImageBackground.cjs.js.map +0 -1
  120. package/dist/components/ImageBackground/ImageBackground.es.js +0 -55
  121. package/dist/components/ImageBackground/ImageBackground.es.js.map +0 -1
  122. package/dist/components/Input/BaseInput/Input.cjs.js +0 -2
  123. package/dist/components/Input/BaseInput/Input.cjs.js.map +0 -1
  124. package/dist/components/Input/BaseInput/Input.es.js +0 -182
  125. package/dist/components/Input/BaseInput/Input.es.js.map +0 -1
  126. package/dist/components/Input/CopyInput/CopyInput.cjs.js +0 -2
  127. package/dist/components/Input/CopyInput/CopyInput.cjs.js.map +0 -1
  128. package/dist/components/Input/CopyInput/CopyInput.es.js +0 -83
  129. package/dist/components/Input/CopyInput/CopyInput.es.js.map +0 -1
  130. package/dist/components/Input/SearchInput/SearchInput.cjs.js +0 -2
  131. package/dist/components/Input/SearchInput/SearchInput.cjs.js.map +0 -1
  132. package/dist/components/Input/SearchInput/SearchInput.es.js +0 -118
  133. package/dist/components/Input/SearchInput/SearchInput.es.js.map +0 -1
  134. package/dist/components/Menu/MenuTrigger.cjs.js +0 -2
  135. package/dist/components/Menu/MenuTrigger.cjs.js.map +0 -1
  136. package/dist/components/Menu/MenuTrigger.es.js +0 -89
  137. package/dist/components/Menu/MenuTrigger.es.js.map +0 -1
  138. package/dist/components/Menu/PopoverMenu.cjs.js +0 -2
  139. package/dist/components/Menu/PopoverMenu.cjs.js.map +0 -1
  140. package/dist/components/Menu/PopoverMenu.es.js +0 -122
  141. package/dist/components/Menu/PopoverMenu.es.js.map +0 -1
  142. package/dist/components/Modal/Modal.cjs.js +0 -2
  143. package/dist/components/Modal/Modal.cjs.js.map +0 -1
  144. package/dist/components/Modal/Modal.es.js +0 -122
  145. package/dist/components/Modal/Modal.es.js.map +0 -1
  146. package/dist/components/Popover/Popover.cjs.js +0 -2
  147. package/dist/components/Popover/Popover.cjs.js.map +0 -1
  148. package/dist/components/Popover/Popover.es.js +0 -53
  149. package/dist/components/Popover/Popover.es.js.map +0 -1
  150. package/dist/components/ScreenOverlay/ScreenOverlay.cjs.js +0 -2
  151. package/dist/components/ScreenOverlay/ScreenOverlay.cjs.js.map +0 -1
  152. package/dist/components/ScreenOverlay/ScreenOverlay.es.js +0 -44
  153. package/dist/components/ScreenOverlay/ScreenOverlay.es.js.map +0 -1
  154. package/dist/components/Select/Select.cjs.js +0 -2
  155. package/dist/components/Select/Select.cjs.js.map +0 -1
  156. package/dist/components/Select/Select.es.js +0 -224
  157. package/dist/components/Select/Select.es.js.map +0 -1
  158. package/dist/components/Switch/Switch.cjs.js +0 -2
  159. package/dist/components/Switch/Switch.cjs.js.map +0 -1
  160. package/dist/components/Switch/Switch.es.js +0 -40
  161. package/dist/components/Switch/Switch.es.js.map +0 -1
  162. package/dist/components/Table/Collection/CompoundComponents.cjs.js +0 -2
  163. package/dist/components/Table/Collection/CompoundComponents.cjs.js.map +0 -1
  164. package/dist/components/Table/Collection/CompoundComponents.es.js +0 -9
  165. package/dist/components/Table/Collection/CompoundComponents.es.js.map +0 -1
  166. package/dist/components/Table/Collection/collectionParser.cjs.js +0 -2
  167. package/dist/components/Table/Collection/collectionParser.cjs.js.map +0 -1
  168. package/dist/components/Table/Collection/collectionParser.es.js +0 -54
  169. package/dist/components/Table/Collection/collectionParser.es.js.map +0 -1
  170. package/dist/components/Table/Collection/useTableCollection.cjs.js +0 -2
  171. package/dist/components/Table/Collection/useTableCollection.cjs.js.map +0 -1
  172. package/dist/components/Table/Collection/useTableCollection.es.js +0 -59
  173. package/dist/components/Table/Collection/useTableCollection.es.js.map +0 -1
  174. package/dist/components/Table/Table.cjs.js +0 -2
  175. package/dist/components/Table/Table.cjs.js.map +0 -1
  176. package/dist/components/Table/Table.es.js +0 -89
  177. package/dist/components/Table/Table.es.js.map +0 -1
  178. package/dist/components/Text/TextEllipsis/TextEllipsis.cjs.js +0 -2
  179. package/dist/components/Text/TextEllipsis/TextEllipsis.cjs.js.map +0 -1
  180. package/dist/components/Text/TextEllipsis/TextEllipsis.es.js +0 -30
  181. package/dist/components/Text/TextEllipsis/TextEllipsis.es.js.map +0 -1
  182. package/dist/components/Text/TextEmphasis/TextEmphasis.cjs.js +0 -2
  183. package/dist/components/Text/TextEmphasis/TextEmphasis.cjs.js.map +0 -1
  184. package/dist/components/Text/TextEmphasis/TextEmphasis.es.js +0 -54
  185. package/dist/components/Text/TextEmphasis/TextEmphasis.es.js.map +0 -1
  186. package/dist/components/ThemeProvider.cjs.js +0 -2
  187. package/dist/components/ThemeProvider.cjs.js.map +0 -1
  188. package/dist/components/ThemeProvider.es.js +0 -43
  189. package/dist/components/ThemeProvider.es.js.map +0 -1
  190. package/dist/components/Tombstone/Tombstone.cjs.js +0 -2
  191. package/dist/components/Tombstone/Tombstone.cjs.js.map +0 -1
  192. package/dist/components/Tombstone/Tombstone.es.js +0 -35
  193. package/dist/components/Tombstone/Tombstone.es.js.map +0 -1
  194. package/dist/components/Tooltip/Tooltip.cjs.js +0 -2
  195. package/dist/components/Tooltip/Tooltip.cjs.js.map +0 -1
  196. package/dist/components/Tooltip/Tooltip.es.js +0 -78
  197. package/dist/components/Tooltip/Tooltip.es.js.map +0 -1
  198. package/dist/components/Waveform/Waveform.cjs.js +0 -2
  199. package/dist/components/Waveform/Waveform.cjs.js.map +0 -1
  200. package/dist/components/Waveform/Waveform.es.js +0 -163
  201. package/dist/components/Waveform/Waveform.es.js.map +0 -1
  202. package/dist/components/Waveform/WaveformBar.cjs.js +0 -2
  203. package/dist/components/Waveform/WaveformBar.cjs.js.map +0 -1
  204. package/dist/components/Waveform/WaveformBar.es.js +0 -74
  205. package/dist/components/Waveform/WaveformBar.es.js.map +0 -1
  206. package/dist/constants/breakpoint.cjs.js +0 -2
  207. package/dist/constants/breakpoint.cjs.js.map +0 -1
  208. package/dist/constants/breakpoint.es.js.map +0 -1
  209. package/dist/constants/placement.cjs.js +0 -2
  210. package/dist/constants/placement.cjs.js.map +0 -1
  211. package/dist/constants/placement.es.js +0 -28
  212. package/dist/constants/placement.es.js.map +0 -1
  213. package/dist/design/colors.cjs.js +0 -2
  214. package/dist/design/colors.cjs.js.map +0 -1
  215. package/dist/design/colors.es.js.map +0 -1
  216. package/dist/design/darkTheme/colors.cjs.js +0 -2
  217. package/dist/design/darkTheme/stylesheet.cjs.js +0 -2
  218. package/dist/design/darkTheme/stylesheet.cjs.js.map +0 -1
  219. package/dist/design/darkTheme/stylesheet.es.js.map +0 -1
  220. package/dist/design/generateStylesheet.cjs.js +0 -2
  221. package/dist/design/generateStylesheet.cjs.js.map +0 -1
  222. package/dist/design/generateStylesheet.es.js +0 -26
  223. package/dist/design/generateStylesheet.es.js.map +0 -1
  224. package/dist/design/lightTheme/colors.cjs.js +0 -2
  225. package/dist/design/lightTheme/stylesheet.cjs.js +0 -2
  226. package/dist/design/lightTheme/stylesheet.cjs.js.map +0 -1
  227. package/dist/design/lightTheme/stylesheet.es.js.map +0 -1
  228. package/dist/design/theme.cjs.js +0 -2
  229. package/dist/design/theme.cjs.js.map +0 -1
  230. package/dist/design/theme.es.js +0 -12
  231. package/dist/design/theme.es.js.map +0 -1
  232. package/dist/hooks/useBreakpoint.cjs.js +0 -2
  233. package/dist/hooks/useBreakpoint.cjs.js.map +0 -1
  234. package/dist/hooks/useBreakpoint.es.js +0 -17
  235. package/dist/hooks/useBreakpoint.es.js.map +0 -1
  236. package/dist/hooks/useIsClosing.cjs.js +0 -2
  237. package/dist/hooks/useIsClosing.cjs.js.map +0 -1
  238. package/dist/hooks/useIsClosing.es.js +0 -30
  239. package/dist/hooks/useIsClosing.es.js.map +0 -1
  240. package/dist/hooks/useLockBodyScroll.cjs.js +0 -2
  241. package/dist/hooks/useLockBodyScroll.cjs.js.map +0 -1
  242. package/dist/hooks/useLockBodyScroll.es.js +0 -14
  243. package/dist/hooks/useLockBodyScroll.es.js.map +0 -1
  244. package/dist/hooks/usePalette.cjs.js +0 -2
  245. package/dist/hooks/usePalette.cjs.js.map +0 -1
  246. package/dist/hooks/usePalette.es.js +0 -37
  247. package/dist/hooks/usePalette.es.js.map +0 -1
  248. package/dist/node_modules/@react-aria/button/dist/useButton.cjs.js +0 -2
  249. package/dist/node_modules/@react-aria/button/dist/useButton.cjs.js.map +0 -1
  250. package/dist/node_modules/@react-aria/button/dist/useButton.es.js +0 -47
  251. package/dist/node_modules/@react-aria/button/dist/useButton.es.js.map +0 -1
  252. package/dist/node_modules/@react-aria/dialog/dist/useDialog.cjs.js +0 -2
  253. package/dist/node_modules/@react-aria/dialog/dist/useDialog.cjs.js.map +0 -1
  254. package/dist/node_modules/@react-aria/dialog/dist/useDialog.es.js +0 -44
  255. package/dist/node_modules/@react-aria/dialog/dist/useDialog.es.js.map +0 -1
  256. package/dist/node_modules/@react-aria/focus/dist/FocusScope.cjs.js +0 -2
  257. package/dist/node_modules/@react-aria/focus/dist/FocusScope.cjs.js.map +0 -1
  258. package/dist/node_modules/@react-aria/focus/dist/FocusScope.es.js +0 -423
  259. package/dist/node_modules/@react-aria/focus/dist/FocusScope.es.js.map +0 -1
  260. package/dist/node_modules/@react-aria/focus/dist/isElementVisible.cjs.js +0 -2
  261. package/dist/node_modules/@react-aria/focus/dist/isElementVisible.cjs.js.map +0 -1
  262. package/dist/node_modules/@react-aria/focus/dist/isElementVisible.es.js +0 -23
  263. package/dist/node_modules/@react-aria/focus/dist/isElementVisible.es.js.map +0 -1
  264. package/dist/node_modules/@react-aria/form/dist/useFormValidation.cjs.js +0 -2
  265. package/dist/node_modules/@react-aria/form/dist/useFormValidation.cjs.js.map +0 -1
  266. package/dist/node_modules/@react-aria/form/dist/useFormValidation.es.js +0 -76
  267. package/dist/node_modules/@react-aria/form/dist/useFormValidation.es.js.map +0 -1
  268. package/dist/node_modules/@react-aria/i18n/dist/context.cjs.js +0 -2
  269. package/dist/node_modules/@react-aria/i18n/dist/context.cjs.js.map +0 -1
  270. package/dist/node_modules/@react-aria/i18n/dist/context.es.js +0 -11
  271. package/dist/node_modules/@react-aria/i18n/dist/context.es.js.map +0 -1
  272. package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.cjs.js +0 -2
  273. package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.cjs.js.map +0 -1
  274. package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.es.js +0 -30
  275. package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.es.js.map +0 -1
  276. package/dist/node_modules/@react-aria/i18n/dist/utils.cjs.js +0 -2
  277. package/dist/node_modules/@react-aria/i18n/dist/utils.cjs.js.map +0 -1
  278. package/dist/node_modules/@react-aria/i18n/dist/utils.es.js +0 -45
  279. package/dist/node_modules/@react-aria/i18n/dist/utils.es.js.map +0 -1
  280. package/dist/node_modules/@react-aria/interactions/dist/context.cjs.js +0 -2
  281. package/dist/node_modules/@react-aria/interactions/dist/context.cjs.js.map +0 -1
  282. package/dist/node_modules/@react-aria/interactions/dist/context.es.js +0 -10
  283. package/dist/node_modules/@react-aria/interactions/dist/context.es.js.map +0 -1
  284. package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.cjs.js +0 -2
  285. package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.cjs.js.map +0 -1
  286. package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.es.js +0 -29
  287. package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.es.js.map +0 -1
  288. package/dist/node_modules/@react-aria/interactions/dist/focusSafely.cjs.js +0 -2
  289. package/dist/node_modules/@react-aria/interactions/dist/focusSafely.cjs.js.map +0 -1
  290. package/dist/node_modules/@react-aria/interactions/dist/focusSafely.es.js +0 -15
  291. package/dist/node_modules/@react-aria/interactions/dist/focusSafely.es.js.map +0 -1
  292. package/dist/node_modules/@react-aria/interactions/dist/textSelection.cjs.js +0 -2
  293. package/dist/node_modules/@react-aria/interactions/dist/textSelection.cjs.js.map +0 -1
  294. package/dist/node_modules/@react-aria/interactions/dist/textSelection.es.js +0 -35
  295. package/dist/node_modules/@react-aria/interactions/dist/textSelection.es.js.map +0 -1
  296. package/dist/node_modules/@react-aria/interactions/dist/useFocus.cjs.js +0 -2
  297. package/dist/node_modules/@react-aria/interactions/dist/useFocus.cjs.js.map +0 -1
  298. package/dist/node_modules/@react-aria/interactions/dist/useFocus.es.js +0 -30
  299. package/dist/node_modules/@react-aria/interactions/dist/useFocus.es.js.map +0 -1
  300. package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.cjs.js +0 -2
  301. package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.cjs.js.map +0 -1
  302. package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.es.js +0 -63
  303. package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.es.js.map +0 -1
  304. package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.cjs.js +0 -2
  305. package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.cjs.js.map +0 -1
  306. package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.es.js +0 -56
  307. package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.es.js.map +0 -1
  308. package/dist/node_modules/@react-aria/interactions/dist/useFocusable.cjs.js +0 -2
  309. package/dist/node_modules/@react-aria/interactions/dist/useFocusable.cjs.js.map +0 -1
  310. package/dist/node_modules/@react-aria/interactions/dist/useFocusable.es.js +0 -42
  311. package/dist/node_modules/@react-aria/interactions/dist/useFocusable.es.js.map +0 -1
  312. package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.cjs.js +0 -2
  313. package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.cjs.js.map +0 -1
  314. package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.es.js +0 -51
  315. package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.es.js.map +0 -1
  316. package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.cjs.js +0 -2
  317. package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.cjs.js.map +0 -1
  318. package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.es.js +0 -13
  319. package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.es.js.map +0 -1
  320. package/dist/node_modules/@react-aria/interactions/dist/usePress.cjs.js +0 -2
  321. package/dist/node_modules/@react-aria/interactions/dist/usePress.cjs.js.map +0 -1
  322. package/dist/node_modules/@react-aria/interactions/dist/usePress.es.js +0 -375
  323. package/dist/node_modules/@react-aria/interactions/dist/usePress.es.js.map +0 -1
  324. package/dist/node_modules/@react-aria/interactions/dist/utils.cjs.js +0 -2
  325. package/dist/node_modules/@react-aria/interactions/dist/utils.cjs.js.map +0 -1
  326. package/dist/node_modules/@react-aria/interactions/dist/utils.es.js +0 -92
  327. package/dist/node_modules/@react-aria/interactions/dist/utils.es.js.map +0 -1
  328. package/dist/node_modules/@react-aria/label/dist/useField.cjs.js +0 -2
  329. package/dist/node_modules/@react-aria/label/dist/useField.cjs.js.map +0 -1
  330. package/dist/node_modules/@react-aria/label/dist/useField.es.js +0 -36
  331. package/dist/node_modules/@react-aria/label/dist/useField.es.js.map +0 -1
  332. package/dist/node_modules/@react-aria/label/dist/useLabel.cjs.js +0 -2
  333. package/dist/node_modules/@react-aria/label/dist/useLabel.cjs.js.map +0 -1
  334. package/dist/node_modules/@react-aria/label/dist/useLabel.es.js +0 -23
  335. package/dist/node_modules/@react-aria/label/dist/useLabel.es.js.map +0 -1
  336. package/dist/node_modules/@react-aria/overlays/dist/Overlay.cjs.js +0 -2
  337. package/dist/node_modules/@react-aria/overlays/dist/Overlay.cjs.js.map +0 -1
  338. package/dist/node_modules/@react-aria/overlays/dist/Overlay.es.js +0 -16
  339. package/dist/node_modules/@react-aria/overlays/dist/Overlay.es.js.map +0 -1
  340. package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.cjs.js +0 -2
  341. package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.cjs.js.map +0 -1
  342. package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.es.js +0 -64
  343. package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.es.js.map +0 -1
  344. package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.cjs.js +0 -2
  345. package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.cjs.js.map +0 -1
  346. package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.es.js +0 -30
  347. package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.es.js.map +0 -1
  348. package/dist/node_modules/@react-aria/overlays/dist/useOverlay.cjs.js +0 -2
  349. package/dist/node_modules/@react-aria/overlays/dist/useOverlay.cjs.js.map +0 -1
  350. package/dist/node_modules/@react-aria/overlays/dist/useOverlay.es.js +0 -53
  351. package/dist/node_modules/@react-aria/overlays/dist/useOverlay.es.js.map +0 -1
  352. package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.cjs.js +0 -2
  353. package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.cjs.js.map +0 -1
  354. package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.es.js +0 -98
  355. package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.es.js.map +0 -1
  356. package/dist/node_modules/@react-aria/radio/dist/useRadio.cjs.js +0 -2
  357. package/dist/node_modules/@react-aria/radio/dist/useRadio.cjs.js.map +0 -1
  358. package/dist/node_modules/@react-aria/radio/dist/useRadio.es.js +0 -58
  359. package/dist/node_modules/@react-aria/radio/dist/useRadio.es.js.map +0 -1
  360. package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.cjs.js +0 -2
  361. package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.cjs.js.map +0 -1
  362. package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.es.js +0 -78
  363. package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.es.js.map +0 -1
  364. package/dist/node_modules/@react-aria/radio/dist/utils.cjs.js +0 -2
  365. package/dist/node_modules/@react-aria/radio/dist/utils.cjs.js.map +0 -1
  366. package/dist/node_modules/@react-aria/radio/dist/utils.es.js +0 -5
  367. package/dist/node_modules/@react-aria/radio/dist/utils.es.js.map +0 -1
  368. package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.cjs.js +0 -2
  369. package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.cjs.js.map +0 -1
  370. package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.es.js +0 -19
  371. package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.es.js.map +0 -1
  372. package/dist/node_modules/@react-aria/switch/dist/useSwitch.cjs.js +0 -2
  373. package/dist/node_modules/@react-aria/switch/dist/useSwitch.cjs.js.map +0 -1
  374. package/dist/node_modules/@react-aria/switch/dist/useSwitch.es.js +0 -20
  375. package/dist/node_modules/@react-aria/switch/dist/useSwitch.es.js.map +0 -1
  376. package/dist/node_modules/@react-aria/toggle/dist/useToggle.cjs.js +0 -2
  377. package/dist/node_modules/@react-aria/toggle/dist/useToggle.cjs.js.map +0 -1
  378. package/dist/node_modules/@react-aria/toggle/dist/useToggle.es.js +0 -48
  379. package/dist/node_modules/@react-aria/toggle/dist/useToggle.es.js.map +0 -1
  380. package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.cjs.js +0 -2
  381. package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.cjs.js.map +0 -1
  382. package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.es.js +0 -41
  383. package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.es.js.map +0 -1
  384. package/dist/node_modules/@react-stately/form/dist/useFormValidationState.cjs.js +0 -2
  385. package/dist/node_modules/@react-stately/form/dist/useFormValidationState.cjs.js.map +0 -1
  386. package/dist/node_modules/@react-stately/form/dist/useFormValidationState.es.js +0 -110
  387. package/dist/node_modules/@react-stately/form/dist/useFormValidationState.es.js.map +0 -1
  388. package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.cjs.js +0 -2
  389. package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.cjs.js.map +0 -1
  390. package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js +0 -30
  391. package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js.map +0 -1
  392. package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.cjs.js +0 -2
  393. package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.cjs.js.map +0 -1
  394. package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.es.js +0 -33
  395. package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.es.js.map +0 -1
  396. package/dist/node_modules/@react-stately/toggle/dist/useToggleState.cjs.js +0 -2
  397. package/dist/node_modules/@react-stately/toggle/dist/useToggleState.cjs.js.map +0 -1
  398. package/dist/node_modules/@react-stately/toggle/dist/useToggleState.es.js +0 -19
  399. package/dist/node_modules/@react-stately/toggle/dist/useToggleState.es.js.map +0 -1
  400. package/dist/node_modules/@react-stately/utils/dist/useControlledState.cjs.js +0 -2
  401. package/dist/node_modules/@react-stately/utils/dist/useControlledState.cjs.js.map +0 -1
  402. package/dist/node_modules/@react-stately/utils/dist/useControlledState.es.js +0 -31
  403. package/dist/node_modules/@react-stately/utils/dist/useControlledState.es.js.map +0 -1
  404. package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.cjs.js +0 -2
  405. package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.cjs.js.map +0 -1
  406. package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.es.js +0 -9
  407. package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.es.js.map +0 -1
  408. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.cjs.js +0 -2
  409. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.cjs.js.map +0 -1
  410. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.es.js +0 -8
  411. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.es.js.map +0 -1
  412. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.cjs.js +0 -2
  413. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.cjs.js.map +0 -1
  414. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.es.js +0 -13
  415. package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.es.js.map +0 -1
  416. package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.cjs.js +0 -2
  417. package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.cjs.js.map +0 -1
  418. package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.es.js +0 -9
  419. package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.es.js.map +0 -1
  420. package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.cjs.js +0 -2
  421. package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.cjs.js.map +0 -1
  422. package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.es.js +0 -11
  423. package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.es.js.map +0 -1
  424. package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.cjs.js +0 -2
  425. package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.cjs.js.map +0 -1
  426. package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.es.js +0 -9
  427. package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.es.js.map +0 -1
  428. package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.cjs.js +0 -2
  429. package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.cjs.js.map +0 -1
  430. package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.es.js +0 -11
  431. package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.es.js.map +0 -1
  432. package/dist/node_modules/color2k/dist/index.exports.import.es.cjs.js +0 -2
  433. package/dist/node_modules/color2k/dist/index.exports.import.es.cjs.js.map +0 -1
  434. package/dist/node_modules/color2k/dist/index.exports.import.es.es.js +0 -171
  435. package/dist/node_modules/color2k/dist/index.exports.import.es.es.js.map +0 -1
  436. package/dist/node_modules/react/cjs/react-jsx-runtime.development.cjs.js +0 -23
  437. package/dist/node_modules/react/cjs/react-jsx-runtime.development.cjs.js.map +0 -1
  438. package/dist/node_modules/react/cjs/react-jsx-runtime.development.es.js +0 -609
  439. package/dist/node_modules/react/cjs/react-jsx-runtime.development.es.js.map +0 -1
  440. package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.cjs.js +0 -10
  441. package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.cjs.js.map +0 -1
  442. package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.es.js +0 -29
  443. package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.es.js.map +0 -1
  444. package/dist/node_modules/react/jsx-runtime.cjs.js +0 -2
  445. package/dist/node_modules/react/jsx-runtime.cjs.js.map +0 -1
  446. package/dist/node_modules/react/jsx-runtime.es.js +0 -9
  447. package/dist/node_modules/react/jsx-runtime.es.js.map +0 -1
  448. package/dist/node_modules/react-aria-components/dist/OverlayArrow.cjs.js +0 -2
  449. package/dist/node_modules/react-aria-components/dist/OverlayArrow.cjs.js.map +0 -1
  450. package/dist/node_modules/react-aria-components/dist/OverlayArrow.es.js +0 -37
  451. package/dist/node_modules/react-aria-components/dist/OverlayArrow.es.js.map +0 -1
  452. package/dist/node_modules/react-aria-components/dist/Tooltip.cjs.js +0 -2
  453. package/dist/node_modules/react-aria-components/dist/Tooltip.cjs.js.map +0 -1
  454. package/dist/node_modules/react-aria-components/dist/Tooltip.es.js +0 -97
  455. package/dist/node_modules/react-aria-components/dist/Tooltip.es.js.map +0 -1
  456. package/dist/node_modules/react-aria-components/dist/utils.cjs.js +0 -2
  457. package/dist/node_modules/react-aria-components/dist/utils.cjs.js.map +0 -1
  458. package/dist/node_modules/react-aria-components/dist/utils.es.js +0 -89
  459. package/dist/node_modules/react-aria-components/dist/utils.es.js.map +0 -1
  460. package/dist/theme/dark.cjs.js +0 -2
  461. package/dist/theme/dark.cjs.js.map +0 -1
  462. package/dist/theme/dark.d.ts +0 -2
  463. package/dist/theme/dark.es.js +0 -11
  464. package/dist/theme/dark.es.js.map +0 -1
  465. package/dist/theme/light.cjs.js +0 -2
  466. package/dist/theme/light.cjs.js.map +0 -1
  467. package/dist/theme/light.d.ts +0 -2
  468. package/dist/theme/light.es.js +0 -11
  469. package/dist/theme/light.es.js.map +0 -1
  470. package/dist/utils/color2k.cjs.js +0 -2
  471. package/dist/utils/color2k.cjs.js.map +0 -1
  472. package/dist/utils/color2k.es.js +0 -14
  473. package/dist/utils/color2k.es.js.map +0 -1
  474. package/dist/utils/copy.cjs.js +0 -2
  475. package/dist/utils/copy.cjs.js.map +0 -1
  476. package/dist/utils/copy.es.js +0 -31
  477. package/dist/utils/copy.es.js.map +0 -1
  478. package/dist/utils/image.cjs.js +0 -2
  479. package/dist/utils/image.cjs.js.map +0 -1
  480. package/dist/utils/image.es.js +0 -28
  481. package/dist/utils/image.es.js.map +0 -1
  482. package/dist/utils/navigation.cjs.js +0 -2
  483. package/dist/utils/navigation.cjs.js.map +0 -1
  484. package/dist/utils/navigation.es.js +0 -12
  485. package/dist/utils/navigation.es.js.map +0 -1
  486. package/dist/utils/palette.cjs.js +0 -2
  487. package/dist/utils/palette.cjs.js.map +0 -1
  488. package/dist/utils/palette.es.js +0 -183
  489. package/dist/utils/palette.es.js.map +0 -1
  490. package/dist/utils/string.cjs.js +0 -2
  491. package/dist/utils/string.cjs.js.map +0 -1
  492. package/dist/utils/string.es.js +0 -8
  493. package/dist/utils/string.es.js.map +0 -1
@@ -1,118 +0,0 @@
1
- import { j as t } from "../../../node_modules/react/jsx-runtime.es.js";
2
- import { useRef as v, useState as _, useEffect as I } from "react";
3
- /* empty css */
4
- import { Input as S } from "../BaseInput/Input.es.js";
5
- import { csx as b } from "../../../utils/string.es.js";
6
- const z = ({
7
- name: u = "search",
8
- placeholder: o = "Search...",
9
- autoComplete: d,
10
- isClearable: f = !0,
11
- isDisabled: h = !1,
12
- error: n,
13
- defaultValue: m,
14
- value: s,
15
- "data-testid": a = "proton-SearchInput",
16
- onChange: e,
17
- onClear: i
18
- }) => {
19
- const c = v(null), [p, l] = _(s ?? m ?? "");
20
- I(() => {
21
- s !== void 0 && l(s);
22
- }, [s]);
23
- const x = (r) => {
24
- l(r), e == null || e(r);
25
- }, j = () => {
26
- var r;
27
- l(""), e == null || e(""), i == null || i(), (r = c.current) == null || r.focus();
28
- };
29
- return /* @__PURE__ */ t.jsx(
30
- "div",
31
- {
32
- className: "proton-SearchInput__wrapper",
33
- "data-testid": a,
34
- role: "search",
35
- children: /* @__PURE__ */ t.jsx(
36
- S,
37
- {
38
- type: "search",
39
- onChange: x,
40
- value: p,
41
- name: u,
42
- placeholder: o,
43
- autoComplete: d,
44
- error: n,
45
- ref: c,
46
- isDisabled: h,
47
- prefix: /* @__PURE__ */ t.jsxs(
48
- "svg",
49
- {
50
- "aria-hidden": "true",
51
- width: "2.8em",
52
- height: "1.6em",
53
- viewBox: "0 0 24 24",
54
- onClick: () => {
55
- var r;
56
- return (r = c.current) == null ? void 0 : r.focus();
57
- },
58
- children: [
59
- /* @__PURE__ */ t.jsx("title", { children: "Magnifying Glass" }),
60
- /* @__PURE__ */ t.jsx(
61
- "path",
62
- {
63
- fill: "currentColor",
64
- d: "M10.5 18.5a8 8 0 1 1 0-16 8 8 0 0 1 0 16Zm0-1a7 7 0 1 0 0-14 7 7 0 0 0 0 14Zm5.25-.75 4.5 4.5-1.25 1.25-4.5-4.5 1.25-1.25Z"
65
- }
66
- )
67
- ]
68
- }
69
- ),
70
- suffix: f && p.length > 0 ? /* @__PURE__ */ t.jsx(
71
- "button",
72
- {
73
- type: "button",
74
- className: b(
75
- "proton-SearchInput__button",
76
- "proton-Input__descriptor",
77
- "proton-Input__suffix"
78
- ),
79
- "data-testid": `${a}-clear`,
80
- onClick: j,
81
- "aria-label": "Clear search",
82
- children: /* @__PURE__ */ t.jsxs(
83
- "svg",
84
- {
85
- "aria-hidden": "true",
86
- viewBox: "0 0 50 50",
87
- width: "3.2em",
88
- height: "1.2em",
89
- children: [
90
- /* @__PURE__ */ t.jsx("title", { children: "Clear" }),
91
- /* @__PURE__ */ t.jsx(
92
- "path",
93
- {
94
- fill: "currentColor",
95
- d: "m37.304 11.282l1.414 1.414l-26.022 26.02l-1.414-1.413z"
96
- }
97
- ),
98
- /* @__PURE__ */ t.jsx(
99
- "path",
100
- {
101
- fill: "currentColor",
102
- d: "m12.696 11.282l26.022 26.02l-1.414 1.415l-26.022-26.02z"
103
- }
104
- )
105
- ]
106
- }
107
- )
108
- }
109
- ) : null
110
- }
111
- )
112
- }
113
- );
114
- };
115
- export {
116
- z as SearchInput
117
- };
118
- //# sourceMappingURL=SearchInput.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"SearchInput.es.js","sources":["../../../../src/components/Input/SearchInput/SearchInput.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useEffect, useRef, useState } from \"react\";\r\nimport \"./SearchInput.css\";\r\nimport { csx } from \"../../../utils\";\r\nimport { Input, type BaseInputProps } from \"../BaseInput/Input\";\r\n\r\nexport interface SearchInputProps\r\n extends Omit<\r\n BaseInputProps,\r\n | \"prefix\"\r\n | \"suffix\"\r\n | \"value\"\r\n | \"onChange\"\r\n | \"description\"\r\n | \"descriptionPosition\"\r\n | \"label\"\r\n > {\r\n /** The initial value of the input. */\r\n defaultValue?: string;\r\n\r\n /** Should the clear button be shown when there is text? */\r\n isClearable?: boolean;\r\n\r\n /** Called when the input value changes. */\r\n onChange?: (value: string) => void;\r\n\r\n /** Called when the clear button is clicked. */\r\n onClear?: () => void;\r\n\r\n /** The current value of the input (for controlled usage) */\r\n value?: string;\r\n}\r\n\r\n/**\r\n * A search input component with optional clear functionality and URL parameter sync.\r\n *\r\n * API:\r\n * - {@link SearchInputProps}\r\n * - extends {@link BaseInputProps}\r\n */\r\nexport const SearchInput = ({\r\n name = \"search\",\r\n placeholder = \"Search...\",\r\n autoComplete,\r\n isClearable = true,\r\n isDisabled = false,\r\n error,\r\n defaultValue,\r\n value: controlledValue,\r\n \"data-testid\": testId = \"proton-SearchInput\",\r\n onChange,\r\n onClear,\r\n}: SearchInputProps) => {\r\n const inputRef = useRef<HTMLInputElement>(null);\r\n const [value, setValue] = useState(controlledValue ?? defaultValue ?? \"\");\r\n\r\n // Sync with controlled value if provided\r\n useEffect(() => {\r\n if (controlledValue !== undefined) {\r\n setValue(controlledValue);\r\n }\r\n }, [controlledValue]);\r\n\r\n const handleChange = (newValue: string) => {\r\n setValue(newValue);\r\n onChange?.(newValue);\r\n };\r\n\r\n const handleClear = () => {\r\n setValue(\"\");\r\n onChange?.(\"\");\r\n onClear?.();\r\n inputRef.current?.focus();\r\n };\r\n\r\n return (\r\n <div\r\n className=\"proton-SearchInput__wrapper\"\r\n data-testid={testId}\r\n role=\"search\"\r\n >\r\n <Input\r\n type=\"search\"\r\n onChange={handleChange}\r\n value={value}\r\n name={name}\r\n placeholder={placeholder}\r\n autoComplete={autoComplete}\r\n error={error}\r\n ref={inputRef}\r\n isDisabled={isDisabled}\r\n prefix={\r\n <svg\r\n aria-hidden=\"true\"\r\n width=\"2.8em\"\r\n height=\"1.6em\"\r\n viewBox=\"0 0 24 24\"\r\n onClick={() => inputRef.current?.focus()}\r\n >\r\n <title>Magnifying Glass</title>\r\n <path\r\n fill=\"currentColor\"\r\n d=\"M10.5 18.5a8 8 0 1 1 0-16 8 8 0 0 1 0 16Zm0-1a7 7 0 1 0 0-14 7 7 0 0 0 0 14Zm5.25-.75 4.5 4.5-1.25 1.25-4.5-4.5 1.25-1.25Z\"\r\n />\r\n </svg>\r\n }\r\n suffix={\r\n isClearable && value.length > 0 ? (\r\n <button\r\n type=\"button\"\r\n className={csx(\r\n \"proton-SearchInput__button\",\r\n \"proton-Input__descriptor\",\r\n \"proton-Input__suffix\"\r\n )}\r\n data-testid={`${testId}-clear`}\r\n onClick={handleClear}\r\n aria-label=\"Clear search\"\r\n >\r\n <svg\r\n aria-hidden=\"true\"\r\n viewBox=\"0 0 50 50\"\r\n width=\"3.2em\"\r\n height=\"1.2em\"\r\n >\r\n <title>Clear</title>\r\n <path\r\n fill=\"currentColor\"\r\n d=\"m37.304 11.282l1.414 1.414l-26.022 26.02l-1.414-1.413z\"\r\n />\r\n <path\r\n fill=\"currentColor\"\r\n d=\"m12.696 11.282l26.022 26.02l-1.414 1.415l-26.022-26.02z\"\r\n />\r\n </svg>\r\n </button>\r\n ) : null\r\n }\r\n />\r\n </div>\r\n );\r\n};\r\n"],"names":["SearchInput","name","placeholder","autoComplete","isClearable","isDisabled","error","defaultValue","controlledValue","testId","onChange","onClear","inputRef","useRef","value","setValue","useState","useEffect","handleChange","newValue","handleClear","_a","jsx","Input","jsxs","csx"],"mappings":";;;;;AAyCO,MAAMA,IAAc,CAAC;AAAA,EAC1B,MAAAC,IAAO;AAAA,EACP,aAAAC,IAAc;AAAA,EACd,cAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,YAAAC,IAAa;AAAA,EACb,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,OAAOC;AAAA,EACP,eAAeC,IAAS;AAAA,EACxB,UAAAC;AAAA,EACA,SAAAC;AACF,MAAwB;AAChB,QAAAC,IAAWC,EAAyB,IAAI,GACxC,CAACC,GAAOC,CAAQ,IAAIC,EAASR,KAAmBD,KAAgB,EAAE;AAGxE,EAAAU,EAAU,MAAM;AACd,IAAIT,MAAoB,UACtBO,EAASP,CAAe;AAAA,EAC1B,GACC,CAACA,CAAe,CAAC;AAEd,QAAAU,IAAe,CAACC,MAAqB;AACzC,IAAAJ,EAASI,CAAQ,GACjBT,KAAA,QAAAA,EAAWS;AAAA,EAAQ,GAGfC,IAAc,MAAM;;AACxB,IAAAL,EAAS,EAAE,GACXL,KAAA,QAAAA,EAAW,KACDC,KAAA,QAAAA,MACVU,IAAAT,EAAS,YAAT,QAAAS,EAAkB;AAAA,EAAM;AAIxB,SAAAC,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAU;AAAA,MACV,eAAab;AAAA,MACb,MAAK;AAAA,MAEL,UAAAa,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAUL;AAAA,UACV,OAAAJ;AAAA,UACA,MAAAb;AAAA,UACA,aAAAC;AAAA,UACA,cAAAC;AAAA,UACA,OAAAG;AAAA,UACA,KAAKM;AAAA,UACL,YAAAP;AAAA,UACA,QACEmB,gBAAAA,EAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,eAAY;AAAA,cACZ,OAAM;AAAA,cACN,QAAO;AAAA,cACP,SAAQ;AAAA,cACR,SAAS,MAAM;;AAAA,wBAAAH,IAAAT,EAAS,YAAT,gBAAAS,EAAkB;AAAA;AAAA,cAEjC,UAAA;AAAA,gBAAAC,gBAAAA,EAAAA,IAAC,WAAM,UAAgB,mBAAA,CAAA;AAAA,gBACvBA,gBAAAA,EAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,MAAK;AAAA,oBACL,GAAE;AAAA,kBAAA;AAAA,gBACJ;AAAA,cAAA;AAAA,YAAA;AAAA,UACF;AAAA,UAEF,QACElB,KAAeU,EAAM,SAAS,IAC5BQ,gBAAAA,EAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,WAAWG;AAAA,gBACT;AAAA,gBACA;AAAA,gBACA;AAAA,cACF;AAAA,cACA,eAAa,GAAGhB,CAAM;AAAA,cACtB,SAASW;AAAA,cACT,cAAW;AAAA,cAEX,UAAAI,gBAAAA,EAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,eAAY;AAAA,kBACZ,SAAQ;AAAA,kBACR,OAAM;AAAA,kBACN,QAAO;AAAA,kBAEP,UAAA;AAAA,oBAAAF,gBAAAA,EAAAA,IAAC,WAAM,UAAK,QAAA,CAAA;AAAA,oBACZA,gBAAAA,EAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,GAAE;AAAA,sBAAA;AAAA,oBACJ;AAAA,oBACAA,gBAAAA,EAAA;AAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,GAAE;AAAA,sBAAA;AAAA,oBACJ;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACF;AAAA,YAAA;AAAA,UAAA,IAEA;AAAA,QAAA;AAAA,MAER;AAAA,IAAA;AAAA,EAAA;AAGN;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),c=require("react"),q=require("../../hooks/useBreakpoint.cjs.js"),b=require("../ActionMenu/ActionMenu.cjs.js"),v=require("./PopoverMenu.cjs.js");;/* empty css */;/* empty css */const T=require("../../constants/breakpoint.cjs.js");function k({renderTrigger:r,size:R=24,title:x,items:a,disabled:p,onClose:i,triggerTestId:f="MenuTrigger-Trigger",menuTestId:d,onSelectionChange:o,selectedKey:u,disabledKeys:g}){const E=q.useBreakpoint(T.BREAKPOINTS.SMALL),[s,n]=c.useState(!1),h=c.useRef(null),m=c.useMemo(()=>a.map(t=>({...t,id:t.key})),[a]),j=t=>{o==null||o(t),n(!1)},l=r?r({isOpen:s,disabled:p,setIsOpen:n}):e.jsxRuntimeExports.jsx("button",{"data-testid":f,disabled:p,className:"proton-MenuTrigger__button",ref:h,onClick:()=>n(!s),type:"button",children:e.jsxRuntimeExports.jsx(A,{size:R})});return E?e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[l,s&&e.jsxRuntimeExports.jsx(b.ActionMenu,{actions:m,title:x,isOpen:s,onClose:()=>{n(!1),i==null||i()},showCancel:!0,"data-testid":d,selectionMode:"single",onSelectionChange:t=>{const M=Array.from(t)[0];M&&j(M)},selectedKeys:u?[u]:void 0,disabledKeys:g})]}):e.jsxRuntimeExports.jsx(v.PopoverMenu,{trigger:l,items:m,isOpen:s,onOpenChange:n,selectedKey:u,onSelectionChange:j,disabledKeys:g,title:x})}const A=({size:r})=>e.jsxRuntimeExports.jsx("svg",{viewBox:"0 0 24 24",width:r,height:r,children:e.jsxRuntimeExports.jsx("path",{fill:"currentColor",d:"M4 14c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z"})});exports.MenuTrigger=k;
2
- //# sourceMappingURL=MenuTrigger.cjs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MenuTrigger.cjs.js","sources":["../../../src/components/Menu/MenuTrigger.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode, useMemo, useRef, useState } from \"react\";\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\r\nimport { ActionMenu, ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\nimport { PopoverMenu } from \"./PopoverMenu\";\r\nimport \"./MenuTrigger.css\";\r\nimport \"./Menu.css\";\r\n\r\nexport interface MenuTriggerProps {\r\n disabled?: boolean;\r\n isOpen?: boolean;\r\n setIsOpen: (isOpen: boolean) => void;\r\n}\r\n\r\nexport interface MenuProps {\r\n /** Custom trigger component. If not provided, defaults to ellipsis icon.\r\n * - @prop triggerProps {@link TriggerProps}\r\n */\r\n renderTrigger?: (triggerProps: MenuTriggerProps) => ReactNode;\r\n\r\n /** Size of the trigger icon\r\n * @default 24\r\n */\r\n size?: number;\r\n\r\n /** Title of the parent menu */\r\n title?: string;\r\n\r\n /** Array of menu actions/items to display\r\n * - type {@link ActionMenuAction}[]\r\n */\r\n items: ActionMenuAction[];\r\n\r\n /** Whether the menu is disabled\r\n * @default false\r\n */\r\n disabled?: boolean;\r\n\r\n /** Callback when the menu is closed */\r\n onClose?: () => void;\r\n\r\n /** Test ID for the trigger button */\r\n triggerTestId?: string;\r\n\r\n /** Test ID for the menu */\r\n menuTestId?: string;\r\n\r\n /** Callback when the selection changes */\r\n onSelectionChange?: (key: string) => void;\r\n\r\n /** The key of the selected item */\r\n selectedKey?: string;\r\n\r\n /** The keys of the disabled items */\r\n disabledKeys?: string[];\r\n}\r\n\r\n/**\r\n * An uncontrolled component that displays either a popover menu or an action menu\r\n * depending on the screen size when the menu trigger is pressed.\r\n *\r\n * API:\r\n * - {@link MenuProps}\r\n */\r\nexport function MenuTrigger({\r\n renderTrigger,\r\n size = 24,\r\n title,\r\n items,\r\n disabled,\r\n onClose,\r\n triggerTestId = \"MenuTrigger-Trigger\",\r\n menuTestId,\r\n onSelectionChange,\r\n selectedKey,\r\n disabledKeys,\r\n}: MenuProps) {\r\n const isMobile = useBreakpoint(BREAKPOINTS.SMALL);\r\n const [isOpen, setIsOpen] = useState(false);\r\n const triggerRef = useRef<HTMLButtonElement>(null);\r\n\r\n const menuItems = useMemo(\r\n () => items.map((item) => ({ ...item, id: item.key })),\r\n [items]\r\n );\r\n\r\n const handleSelectionChange = (key: string) => {\r\n onSelectionChange?.(key);\r\n setIsOpen(false);\r\n };\r\n\r\n const triggerButton = renderTrigger ? (\r\n renderTrigger({\r\n isOpen,\r\n disabled,\r\n setIsOpen,\r\n })\r\n ) : (\r\n <button\r\n data-testid={triggerTestId}\r\n disabled={disabled}\r\n className=\"proton-MenuTrigger__button\"\r\n ref={triggerRef}\r\n onClick={() => setIsOpen(!isOpen)}\r\n type=\"button\"\r\n >\r\n <EllipsisIcon size={size} />\r\n </button>\r\n );\r\n\r\n if (isMobile) {\r\n return (\r\n <>\r\n {triggerButton}\r\n {isOpen && (\r\n <ActionMenu\r\n actions={menuItems}\r\n title={title}\r\n isOpen={isOpen}\r\n onClose={() => {\r\n setIsOpen(false);\r\n onClose?.();\r\n }}\r\n showCancel\r\n data-testid={menuTestId}\r\n selectionMode=\"single\"\r\n onSelectionChange={(keys) => {\r\n const nextKey = Array.from(keys)[0];\r\n if (nextKey) handleSelectionChange(nextKey as string);\r\n }}\r\n selectedKeys={selectedKey ? [selectedKey] : undefined}\r\n disabledKeys={disabledKeys}\r\n />\r\n )}\r\n </>\r\n );\r\n }\r\n\r\n return (\r\n <PopoverMenu\r\n trigger={triggerButton}\r\n items={menuItems}\r\n isOpen={isOpen}\r\n onOpenChange={setIsOpen}\r\n selectedKey={selectedKey}\r\n onSelectionChange={handleSelectionChange}\r\n disabledKeys={disabledKeys}\r\n title={title}\r\n />\r\n );\r\n}\r\n\r\nconst EllipsisIcon = ({ size }: { size: number }) => (\r\n <svg viewBox=\"0 0 24 24\" width={size} height={size}>\r\n <path\r\n fill=\"currentColor\"\r\n d=\"M4 14c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z\"\r\n />\r\n </svg>\r\n);\r\n"],"names":["MenuTrigger","renderTrigger","size","title","items","disabled","onClose","triggerTestId","menuTestId","onSelectionChange","selectedKey","disabledKeys","isMobile","useBreakpoint","BREAKPOINTS","isOpen","setIsOpen","useState","triggerRef","useRef","menuItems","useMemo","item","handleSelectionChange","key","triggerButton","jsx","EllipsisIcon","jsxs","Fragment","ActionMenu","keys","nextKey","PopoverMenu"],"mappings":"qZAkEO,SAASA,EAAY,CAC1B,cAAAC,EACA,KAAAC,EAAO,GACP,MAAAC,EACA,MAAAC,EACA,SAAAC,EACA,QAAAC,EACA,cAAAC,EAAgB,sBAChB,WAAAC,EACA,kBAAAC,EACA,YAAAC,EACA,aAAAC,CACF,EAAc,CACN,MAAAC,EAAWC,EAAAA,cAAcC,EAAA,YAAY,KAAK,EAC1C,CAACC,EAAQC,CAAS,EAAIC,WAAS,EAAK,EACpCC,EAAaC,SAA0B,IAAI,EAE3CC,EAAYC,EAAA,QAChB,IAAMjB,EAAM,IAAKkB,IAAU,CAAE,GAAGA,EAAM,GAAIA,EAAK,GAAA,EAAM,EACrD,CAAClB,CAAK,CAAA,EAGFmB,EAAyBC,GAAgB,CAC7Cf,GAAA,MAAAA,EAAoBe,GACpBR,EAAU,EAAK,CAAA,EAGXS,EAAgBxB,EACpBA,EAAc,CACZ,OAAAc,EACA,SAAAV,EACA,UAAAW,CACD,CAAA,EAEDU,EAAA,kBAAA,IAAC,SAAA,CACC,cAAanB,EACb,SAAAF,EACA,UAAU,6BACV,IAAKa,EACL,QAAS,IAAMF,EAAU,CAACD,CAAM,EAChC,KAAK,SAEL,SAAAW,EAAA,kBAAA,IAACC,GAAa,KAAAzB,CAAY,CAAA,CAAA,CAAA,EAI9B,OAAIU,EAGGgB,EAAA,kBAAA,KAAAC,6BAAA,CAAA,SAAA,CAAAJ,EACAV,GACCW,EAAA,kBAAA,IAACI,EAAA,WAAA,CACC,QAASV,EACT,MAAAjB,EACA,OAAAY,EACA,QAAS,IAAM,CACbC,EAAU,EAAK,EACLV,GAAA,MAAAA,GACZ,EACA,WAAU,GACV,cAAaE,EACb,cAAc,SACd,kBAAoBuB,GAAS,CAC3B,MAAMC,EAAU,MAAM,KAAKD,CAAI,EAAE,CAAC,EAC9BC,KAA+BA,CAAiB,CACtD,EACA,aAActB,EAAc,CAACA,CAAW,EAAI,OAC5C,aAAAC,CAAA,CACF,CAEJ,CAAA,CAAA,EAKFe,EAAA,kBAAA,IAACO,EAAA,YAAA,CACC,QAASR,EACT,MAAOL,EACP,OAAAL,EACA,aAAcC,EACd,YAAAN,EACA,kBAAmBa,EACnB,aAAAZ,EACA,MAAAR,CAAA,CAAA,CAGN,CAEA,MAAMwB,EAAe,CAAC,CAAE,KAAAzB,CACtB,IAAAwB,EAAA,kBAAA,IAAC,MAAI,CAAA,QAAQ,YAAY,MAAOxB,EAAM,OAAQA,EAC5C,SAAAwB,EAAA,kBAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,mJAAA,CACJ,EACF"}
@@ -1,89 +0,0 @@
1
- import { j as t } from "../../node_modules/react/jsx-runtime.es.js";
2
- import { useState as A, useRef as B, useMemo as I } from "react";
3
- import { useBreakpoint as O } from "../../hooks/useBreakpoint.es.js";
4
- import { ActionMenu as R } from "../ActionMenu/ActionMenu.es.js";
5
- import { PopoverMenu as T } from "./PopoverMenu.es.js";
6
- /* empty css */
7
- /* empty css */
8
- import { BREAKPOINTS as k } from "../../constants/breakpoint.es.js";
9
- function _({
10
- renderTrigger: e,
11
- size: M = 24,
12
- title: c,
13
- items: u,
14
- disabled: p,
15
- onClose: n,
16
- triggerTestId: h = "MenuTrigger-Trigger",
17
- menuTestId: j,
18
- onSelectionChange: i,
19
- selectedKey: m,
20
- disabledKeys: a
21
- }) {
22
- const d = O(k.SMALL), [o, s] = A(!1), v = B(null), f = I(
23
- () => u.map((r) => ({ ...r, id: r.key })),
24
- [u]
25
- ), g = (r) => {
26
- i == null || i(r), s(!1);
27
- }, l = e ? e({
28
- isOpen: o,
29
- disabled: p,
30
- setIsOpen: s
31
- }) : /* @__PURE__ */ t.jsx(
32
- "button",
33
- {
34
- "data-testid": h,
35
- disabled: p,
36
- className: "proton-MenuTrigger__button",
37
- ref: v,
38
- onClick: () => s(!o),
39
- type: "button",
40
- children: /* @__PURE__ */ t.jsx(w, { size: M })
41
- }
42
- );
43
- return d ? /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
44
- l,
45
- o && /* @__PURE__ */ t.jsx(
46
- R,
47
- {
48
- actions: f,
49
- title: c,
50
- isOpen: o,
51
- onClose: () => {
52
- s(!1), n == null || n();
53
- },
54
- showCancel: !0,
55
- "data-testid": j,
56
- selectionMode: "single",
57
- onSelectionChange: (r) => {
58
- const x = Array.from(r)[0];
59
- x && g(x);
60
- },
61
- selectedKeys: m ? [m] : void 0,
62
- disabledKeys: a
63
- }
64
- )
65
- ] }) : /* @__PURE__ */ t.jsx(
66
- T,
67
- {
68
- trigger: l,
69
- items: f,
70
- isOpen: o,
71
- onOpenChange: s,
72
- selectedKey: m,
73
- onSelectionChange: g,
74
- disabledKeys: a,
75
- title: c
76
- }
77
- );
78
- }
79
- const w = ({ size: e }) => /* @__PURE__ */ t.jsx("svg", { viewBox: "0 0 24 24", width: e, height: e, children: /* @__PURE__ */ t.jsx(
80
- "path",
81
- {
82
- fill: "currentColor",
83
- d: "M4 14c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z"
84
- }
85
- ) });
86
- export {
87
- _ as MenuTrigger
88
- };
89
- //# sourceMappingURL=MenuTrigger.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MenuTrigger.es.js","sources":["../../../src/components/Menu/MenuTrigger.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ReactNode, useMemo, useRef, useState } from \"react\";\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks/useBreakpoint\";\r\nimport { ActionMenu, ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\nimport { PopoverMenu } from \"./PopoverMenu\";\r\nimport \"./MenuTrigger.css\";\r\nimport \"./Menu.css\";\r\n\r\nexport interface MenuTriggerProps {\r\n disabled?: boolean;\r\n isOpen?: boolean;\r\n setIsOpen: (isOpen: boolean) => void;\r\n}\r\n\r\nexport interface MenuProps {\r\n /** Custom trigger component. If not provided, defaults to ellipsis icon.\r\n * - @prop triggerProps {@link TriggerProps}\r\n */\r\n renderTrigger?: (triggerProps: MenuTriggerProps) => ReactNode;\r\n\r\n /** Size of the trigger icon\r\n * @default 24\r\n */\r\n size?: number;\r\n\r\n /** Title of the parent menu */\r\n title?: string;\r\n\r\n /** Array of menu actions/items to display\r\n * - type {@link ActionMenuAction}[]\r\n */\r\n items: ActionMenuAction[];\r\n\r\n /** Whether the menu is disabled\r\n * @default false\r\n */\r\n disabled?: boolean;\r\n\r\n /** Callback when the menu is closed */\r\n onClose?: () => void;\r\n\r\n /** Test ID for the trigger button */\r\n triggerTestId?: string;\r\n\r\n /** Test ID for the menu */\r\n menuTestId?: string;\r\n\r\n /** Callback when the selection changes */\r\n onSelectionChange?: (key: string) => void;\r\n\r\n /** The key of the selected item */\r\n selectedKey?: string;\r\n\r\n /** The keys of the disabled items */\r\n disabledKeys?: string[];\r\n}\r\n\r\n/**\r\n * An uncontrolled component that displays either a popover menu or an action menu\r\n * depending on the screen size when the menu trigger is pressed.\r\n *\r\n * API:\r\n * - {@link MenuProps}\r\n */\r\nexport function MenuTrigger({\r\n renderTrigger,\r\n size = 24,\r\n title,\r\n items,\r\n disabled,\r\n onClose,\r\n triggerTestId = \"MenuTrigger-Trigger\",\r\n menuTestId,\r\n onSelectionChange,\r\n selectedKey,\r\n disabledKeys,\r\n}: MenuProps) {\r\n const isMobile = useBreakpoint(BREAKPOINTS.SMALL);\r\n const [isOpen, setIsOpen] = useState(false);\r\n const triggerRef = useRef<HTMLButtonElement>(null);\r\n\r\n const menuItems = useMemo(\r\n () => items.map((item) => ({ ...item, id: item.key })),\r\n [items]\r\n );\r\n\r\n const handleSelectionChange = (key: string) => {\r\n onSelectionChange?.(key);\r\n setIsOpen(false);\r\n };\r\n\r\n const triggerButton = renderTrigger ? (\r\n renderTrigger({\r\n isOpen,\r\n disabled,\r\n setIsOpen,\r\n })\r\n ) : (\r\n <button\r\n data-testid={triggerTestId}\r\n disabled={disabled}\r\n className=\"proton-MenuTrigger__button\"\r\n ref={triggerRef}\r\n onClick={() => setIsOpen(!isOpen)}\r\n type=\"button\"\r\n >\r\n <EllipsisIcon size={size} />\r\n </button>\r\n );\r\n\r\n if (isMobile) {\r\n return (\r\n <>\r\n {triggerButton}\r\n {isOpen && (\r\n <ActionMenu\r\n actions={menuItems}\r\n title={title}\r\n isOpen={isOpen}\r\n onClose={() => {\r\n setIsOpen(false);\r\n onClose?.();\r\n }}\r\n showCancel\r\n data-testid={menuTestId}\r\n selectionMode=\"single\"\r\n onSelectionChange={(keys) => {\r\n const nextKey = Array.from(keys)[0];\r\n if (nextKey) handleSelectionChange(nextKey as string);\r\n }}\r\n selectedKeys={selectedKey ? [selectedKey] : undefined}\r\n disabledKeys={disabledKeys}\r\n />\r\n )}\r\n </>\r\n );\r\n }\r\n\r\n return (\r\n <PopoverMenu\r\n trigger={triggerButton}\r\n items={menuItems}\r\n isOpen={isOpen}\r\n onOpenChange={setIsOpen}\r\n selectedKey={selectedKey}\r\n onSelectionChange={handleSelectionChange}\r\n disabledKeys={disabledKeys}\r\n title={title}\r\n />\r\n );\r\n}\r\n\r\nconst EllipsisIcon = ({ size }: { size: number }) => (\r\n <svg viewBox=\"0 0 24 24\" width={size} height={size}>\r\n <path\r\n fill=\"currentColor\"\r\n d=\"M4 14c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm8 0c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2z\"\r\n />\r\n </svg>\r\n);\r\n"],"names":["MenuTrigger","renderTrigger","size","title","items","disabled","onClose","triggerTestId","menuTestId","onSelectionChange","selectedKey","disabledKeys","isMobile","useBreakpoint","BREAKPOINTS","isOpen","setIsOpen","useState","triggerRef","useRef","menuItems","useMemo","item","handleSelectionChange","key","triggerButton","jsx","EllipsisIcon","jsxs","Fragment","ActionMenu","keys","nextKey","PopoverMenu"],"mappings":";;;;;;;;AAkEO,SAASA,EAAY;AAAA,EAC1B,eAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,YAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AACF,GAAc;AACN,QAAAC,IAAWC,EAAcC,EAAY,KAAK,GAC1C,CAACC,GAAQC,CAAS,IAAIC,EAAS,EAAK,GACpCC,IAAaC,EAA0B,IAAI,GAE3CC,IAAYC;AAAA,IAChB,MAAMjB,EAAM,IAAI,CAACkB,OAAU,EAAE,GAAGA,GAAM,IAAIA,EAAK,IAAA,EAAM;AAAA,IACrD,CAAClB,CAAK;AAAA,EAAA,GAGFmB,IAAwB,CAACC,MAAgB;AAC7C,IAAAf,KAAA,QAAAA,EAAoBe,IACpBR,EAAU,EAAK;AAAA,EAAA,GAGXS,IAAgBxB,IACpBA,EAAc;AAAA,IACZ,QAAAc;AAAA,IACA,UAAAV;AAAA,IACA,WAAAW;AAAA,EACD,CAAA,IAEDU,gBAAAA,EAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAanB;AAAA,MACb,UAAAF;AAAA,MACA,WAAU;AAAA,MACV,KAAKa;AAAA,MACL,SAAS,MAAMF,EAAU,CAACD,CAAM;AAAA,MAChC,MAAK;AAAA,MAEL,UAAAW,gBAAAA,EAAA,IAACC,KAAa,MAAAzB,EAAY,CAAA;AAAA,IAAA;AAAA,EAAA;AAI9B,SAAIU,IAGGgB,gBAAAA,EAAA,KAAAC,YAAA,EAAA,UAAA;AAAA,IAAAJ;AAAA,IACAV,KACCW,gBAAAA,EAAA;AAAA,MAACI;AAAA,MAAA;AAAA,QACC,SAASV;AAAA,QACT,OAAAjB;AAAA,QACA,QAAAY;AAAA,QACA,SAAS,MAAM;AACb,UAAAC,EAAU,EAAK,GACLV,KAAA,QAAAA;AAAA,QACZ;AAAA,QACA,YAAU;AAAA,QACV,eAAaE;AAAA,QACb,eAAc;AAAA,QACd,mBAAmB,CAACuB,MAAS;AAC3B,gBAAMC,IAAU,MAAM,KAAKD,CAAI,EAAE,CAAC;AAC9B,UAAAC,OAA+BA,CAAiB;AAAA,QACtD;AAAA,QACA,cAActB,IAAc,CAACA,CAAW,IAAI;AAAA,QAC5C,cAAAC;AAAA,MAAA;AAAA,IACF;AAAA,EAEJ,EAAA,CAAA,IAKFe,gBAAAA,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAASR;AAAA,MACT,OAAOL;AAAA,MACP,QAAAL;AAAA,MACA,cAAcC;AAAA,MACd,aAAAN;AAAA,MACA,mBAAmBa;AAAA,MACnB,cAAAZ;AAAA,MACA,OAAAR;AAAA,IAAA;AAAA,EAAA;AAGN;AAEA,MAAMwB,IAAe,CAAC,EAAE,MAAAzB,EACtB,MAAAwB,gBAAAA,EAAA,IAAC,OAAI,EAAA,SAAQ,aAAY,OAAOxB,GAAM,QAAQA,GAC5C,UAAAwB,gBAAAA,EAAA;AAAA,EAAC;AAAA,EAAA;AAAA,IACC,MAAK;AAAA,IACL,GAAE;AAAA,EAAA;AACJ,GACF;"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../../node_modules/react/jsx-runtime.cjs.js"),s=require("radix-ui"),R=require("../ThemeProvider.cjs.js"),u=require("../../utils/string.cjs.js");function b({trigger:p,items:j,isOpen:M,onOpenChange:n,selectedKey:_,onSelectionChange:l,disabledKeys:g,title:c}){const{className:x,style:m}=R.useTheme();function a(d){const{item:e,className:h,style:y,disabledKeys:t,onClose:o}=d;return e.children&&e.children.length>0?r.jsxRuntimeExports.jsxs(s.DropdownMenu.Sub,{children:[r.jsxRuntimeExports.jsxs(s.DropdownMenu.SubTrigger,{className:u.csx("proton-Menu__item","proton-MenuTrigger__menu-item"),children:[e.label,r.jsxRuntimeExports.jsx("svg",{className:"proton-MenuTrigger__chevron",viewBox:"0 0 256 256",width:16,height:12,children:r.jsxRuntimeExports.jsx("path",{fill:"currentColor",d:"m184.49 136.49l-80 80a12 12 0 0 1-17-17L159 128L87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17"})})]}),r.jsxRuntimeExports.jsx(s.DropdownMenu.SubContent,{sideOffset:8,"data-has-submenu":"true",className:u.csx("proton-Menu","proton-MenuTrigger__menu"),children:e.children.map(i=>a({item:i,className:h,style:y,disabledKeys:t,onClose:o}))})]},e.key):r.jsxRuntimeExports.jsxs(s.DropdownMenu.Item,{className:u.csx("proton-Menu__item","proton-MenuTrigger__menu-item"),"aria-selected":_===e.key,disabled:t==null?void 0:t.includes(e.key),onSelect:()=>{var i;(i=e.onAction)==null||i.call(e,e.key),l==null||l(e.key),o==null||o()},children:[r.jsxRuntimeExports.jsx("span",{className:"proton-MenuTrigger__label",style:{gridArea:"label"},children:e.label}),e.description&&r.jsxRuntimeExports.jsx("span",{className:"proton-MenuTrigger__description",style:{gridArea:"desc"},children:e.description})]},e.key)}return r.jsxRuntimeExports.jsxs(s.DropdownMenu.Root,{open:M,onOpenChange:n,children:[r.jsxRuntimeExports.jsx(s.DropdownMenu.Trigger,{asChild:!0,children:p}),r.jsxRuntimeExports.jsx(s.DropdownMenu.Portal,{children:r.jsxRuntimeExports.jsxs(s.DropdownMenu.Content,{className:u.csx("proton-Menu","proton-MenuTrigger__menu",x),style:m,children:[c&&r.jsxRuntimeExports.jsx(s.DropdownMenu.Label,{className:"proton-MenuTrigger__menu-header",children:c}),j.map(d=>a({item:d,className:x,style:m,disabledKeys:g,onClose:()=>n==null?void 0:n(!1)}))]})})]})}exports.PopoverMenu=b;
2
- //# sourceMappingURL=PopoverMenu.cjs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PopoverMenu.cjs.js","sources":["../../../src/components/Menu/PopoverMenu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from \"radix-ui\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\nimport { csx } from \"../../utils/string\";\r\nimport { ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\n\r\nexport interface PopoverMenuProps {\r\n /** The trigger component */\r\n trigger: React.ReactNode;\r\n\r\n /** Array of menu actions/items to display\r\n * - type {@link ActionMenuAction}[]\r\n */\r\n items: ActionMenuAction[];\r\n\r\n /** Whether the menu is open */\r\n isOpen: boolean;\r\n\r\n /** Callback when the menu is opened or closed */\r\n onOpenChange: (open: boolean) => void;\r\n\r\n /** The key of the selected item */\r\n selectedKey: string;\r\n\r\n /** Callback when the selection changes */\r\n onSelectionChange: (key: string) => void;\r\n\r\n /** The keys of the disabled items */\r\n disabledKeys: string[];\r\n\r\n /** The title of the menu */\r\n title: string;\r\n}\r\n\r\n/**\r\n * A component that displays a popover menu.\r\n *\r\n * API:\r\n * - {@link PopoverMenuProps}\r\n */\r\nexport function PopoverMenu({\r\n trigger,\r\n items,\r\n isOpen,\r\n onOpenChange,\r\n selectedKey,\r\n onSelectionChange,\r\n disabledKeys,\r\n title,\r\n}: PopoverMenuProps) {\r\n const { className: themeClass, style: themeStyle } = useTheme();\r\n\r\n function renderMenuItem(props) {\r\n const { item, className, style, disabledKeys, onClose } = props;\r\n\r\n if (item.children && item.children.length > 0) {\r\n return (\r\n <RadixDropdownMenu.Sub key={item.key}>\r\n <RadixDropdownMenu.SubTrigger\r\n className={csx(\r\n \"proton-Menu__item\",\r\n \"proton-MenuTrigger__menu-item\"\r\n )}\r\n >\r\n {item.label}\r\n <svg\r\n className=\"proton-MenuTrigger__chevron\"\r\n viewBox=\"0 0 256 256\"\r\n width={16}\r\n height={12}\r\n >\r\n <path\r\n fill=\"currentColor\"\r\n d=\"m184.49 136.49l-80 80a12 12 0 0 1-17-17L159 128L87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17\"\r\n />\r\n </svg>\r\n </RadixDropdownMenu.SubTrigger>\r\n\r\n <RadixDropdownMenu.SubContent\r\n sideOffset={8}\r\n data-has-submenu=\"true\"\r\n className={csx(\"proton-Menu\", \"proton-MenuTrigger__menu\")}\r\n >\r\n {item.children.map((child) =>\r\n renderMenuItem({\r\n item: child,\r\n className,\r\n style,\r\n disabledKeys,\r\n onClose,\r\n })\r\n )}\r\n </RadixDropdownMenu.SubContent>\r\n </RadixDropdownMenu.Sub>\r\n );\r\n } else {\r\n return (\r\n <RadixDropdownMenu.Item\r\n className={csx(\"proton-Menu__item\", \"proton-MenuTrigger__menu-item\")}\r\n key={item.key}\r\n aria-selected={selectedKey === item.key}\r\n disabled={disabledKeys?.includes(item.key)}\r\n onSelect={() => {\r\n item.onAction?.(item.key);\r\n onSelectionChange?.(item.key);\r\n onClose?.();\r\n }}\r\n >\r\n <span\r\n className=\"proton-MenuTrigger__label\"\r\n style={{ gridArea: \"label\" }}\r\n >\r\n {item.label}\r\n </span>\r\n {item.description && (\r\n <span\r\n className=\"proton-MenuTrigger__description\"\r\n style={{ gridArea: \"desc\" }}\r\n >\r\n {item.description}\r\n </span>\r\n )}\r\n </RadixDropdownMenu.Item>\r\n );\r\n }\r\n }\r\n\r\n return (\r\n <RadixDropdownMenu.Root open={isOpen} onOpenChange={onOpenChange}>\r\n <RadixDropdownMenu.Trigger asChild>{trigger}</RadixDropdownMenu.Trigger>\r\n <RadixDropdownMenu.Portal>\r\n <RadixDropdownMenu.Content\r\n className={csx(\"proton-Menu\", \"proton-MenuTrigger__menu\", themeClass)}\r\n style={themeStyle as React.CSSProperties}\r\n >\r\n {title && (\r\n <RadixDropdownMenu.Label className=\"proton-MenuTrigger__menu-header\">\r\n {title}\r\n </RadixDropdownMenu.Label>\r\n )}\r\n {items.map((item) =>\r\n renderMenuItem({\r\n item,\r\n className: themeClass,\r\n style: themeStyle as React.CSSProperties,\r\n disabledKeys,\r\n onClose: () => onOpenChange?.(false),\r\n })\r\n )}\r\n </RadixDropdownMenu.Content>\r\n </RadixDropdownMenu.Portal>\r\n </RadixDropdownMenu.Root>\r\n );\r\n}\r\n"],"names":["PopoverMenu","trigger","items","isOpen","onOpenChange","selectedKey","onSelectionChange","disabledKeys","title","themeClass","themeStyle","useTheme","renderMenuItem","props","item","className","style","onClose","jsxs","RadixDropdownMenu","csx","jsx","child","_a"],"mappings":"iPAuCO,SAASA,EAAY,CAC1B,QAAAC,EACA,MAAAC,EACA,OAAAC,EACA,aAAAC,EACA,YAAAC,EACA,kBAAAC,EACA,aAAAC,EACA,MAAAC,CACF,EAAqB,CACnB,KAAM,CAAE,UAAWC,EAAY,MAAOC,CAAA,EAAeC,EAAAA,WAErD,SAASC,EAAeC,EAAO,CAC7B,KAAM,CAAE,KAAAC,EAAM,UAAAC,EAAW,MAAAC,EAAO,aAAAT,EAAc,QAAAU,CAAY,EAAAJ,EAE1D,OAAIC,EAAK,UAAYA,EAAK,SAAS,OAAS,EAExCI,yBAACC,EAAAA,aAAkB,IAAlB,CACC,SAAA,CAAAD,EAAA,kBAAA,KAACC,EAAAA,aAAkB,WAAlB,CACC,UAAWC,EAAA,IACT,oBACA,+BACF,EAEC,SAAA,CAAKN,EAAA,MACNO,EAAA,kBAAA,IAAC,MAAA,CACC,UAAU,8BACV,QAAQ,cACR,MAAO,GACP,OAAQ,GAER,SAAAA,EAAA,kBAAA,IAAC,OAAA,CACC,KAAK,eACL,EAAE,wGAAA,CACJ,CAAA,CACF,CAAA,CAAA,CACF,EAEAA,EAAA,kBAAA,IAACF,EAAAA,aAAkB,WAAlB,CACC,WAAY,EACZ,mBAAiB,OACjB,UAAWC,EAAAA,IAAI,cAAe,0BAA0B,EAEvD,WAAK,SAAS,IAAKE,GAClBV,EAAe,CACb,KAAMU,EACN,UAAAP,EACA,MAAAC,EACA,aAAAT,EACA,QAAAU,CAAA,CACD,CACH,CAAA,CACF,CAAA,GAnC0BH,EAAK,GAoCjC,EAIAI,EAAA,kBAAA,KAACC,EAAAA,aAAkB,KAAlB,CACC,UAAWC,EAAAA,IAAI,oBAAqB,+BAA+B,EAEnE,gBAAef,IAAgBS,EAAK,IACpC,SAAUP,GAAAA,YAAAA,EAAc,SAASO,EAAK,KACtC,SAAU,IAAM,QACTS,EAAAT,EAAA,WAAA,MAAAS,EAAA,KAAAT,EAAWA,EAAK,KACrBR,GAAA,MAAAA,EAAoBQ,EAAK,KACfG,GAAA,MAAAA,GACZ,EAEA,SAAA,CAAAI,EAAA,kBAAA,IAAC,OAAA,CACC,UAAU,4BACV,MAAO,CAAE,SAAU,OAAQ,EAE1B,SAAKP,EAAA,KAAA,CACR,EACCA,EAAK,aACJO,EAAA,kBAAA,IAAC,OAAA,CACC,UAAU,kCACV,MAAO,CAAE,SAAU,MAAO,EAEzB,SAAKP,EAAA,WAAA,CACR,CAAA,CAAA,EArBGA,EAAK,GAAA,CA0BlB,CAEA,gCACGK,EAAAA,aAAkB,KAAlB,CAAuB,KAAMhB,EAAQ,aAAAC,EACpC,SAAA,CAAAiB,EAAA,kBAAA,IAACF,EAAkB,aAAA,QAAlB,CAA0B,QAAO,GAAE,SAAQlB,EAAA,EAC5CoB,EAAAA,kBAAAA,IAACF,EAAkB,aAAA,OAAlB,CACC,SAAAD,EAAA,kBAAA,KAACC,EAAAA,aAAkB,QAAlB,CACC,UAAWC,EAAA,IAAI,cAAe,2BAA4BX,CAAU,EACpE,MAAOC,EAEN,SAAA,CAAAF,2BACEW,EAAAA,aAAkB,MAAlB,CAAwB,UAAU,kCAChC,SACHX,EAAA,EAEDN,EAAM,IAAKY,GACVF,EAAe,CACb,KAAAE,EACA,UAAWL,EACX,MAAOC,EACP,aAAAH,EACA,QAAS,IAAMH,GAAA,YAAAA,EAAe,GAAK,CACpC,CACH,CAAA,CAAA,CAAA,EAEJ,CACF,CAAA,CAAA,CAEJ"}
@@ -1,122 +0,0 @@
1
- import { j as r } from "../../node_modules/react/jsx-runtime.es.js";
2
- import { DropdownMenu as s } from "radix-ui";
3
- import { useTheme as b } from "../ThemeProvider.es.js";
4
- import { csx as o } from "../../utils/string.es.js";
5
- function v({
6
- trigger: _,
7
- items: h,
8
- isOpen: x,
9
- onOpenChange: t,
10
- selectedKey: g,
11
- onSelectionChange: a,
12
- disabledKeys: j,
13
- title: c
14
- }) {
15
- const { className: u, style: d } = b();
16
- function p(m) {
17
- const { item: e, className: M, style: y, disabledKeys: l, onClose: i } = m;
18
- return e.children && e.children.length > 0 ? /* @__PURE__ */ r.jsxs(s.Sub, { children: [
19
- /* @__PURE__ */ r.jsxs(
20
- s.SubTrigger,
21
- {
22
- className: o(
23
- "proton-Menu__item",
24
- "proton-MenuTrigger__menu-item"
25
- ),
26
- children: [
27
- e.label,
28
- /* @__PURE__ */ r.jsx(
29
- "svg",
30
- {
31
- className: "proton-MenuTrigger__chevron",
32
- viewBox: "0 0 256 256",
33
- width: 16,
34
- height: 12,
35
- children: /* @__PURE__ */ r.jsx(
36
- "path",
37
- {
38
- fill: "currentColor",
39
- d: "m184.49 136.49l-80 80a12 12 0 0 1-17-17L159 128L87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17"
40
- }
41
- )
42
- }
43
- )
44
- ]
45
- }
46
- ),
47
- /* @__PURE__ */ r.jsx(
48
- s.SubContent,
49
- {
50
- sideOffset: 8,
51
- "data-has-submenu": "true",
52
- className: o("proton-Menu", "proton-MenuTrigger__menu"),
53
- children: e.children.map(
54
- (n) => p({
55
- item: n,
56
- className: M,
57
- style: y,
58
- disabledKeys: l,
59
- onClose: i
60
- })
61
- )
62
- }
63
- )
64
- ] }, e.key) : /* @__PURE__ */ r.jsxs(
65
- s.Item,
66
- {
67
- className: o("proton-Menu__item", "proton-MenuTrigger__menu-item"),
68
- "aria-selected": g === e.key,
69
- disabled: l == null ? void 0 : l.includes(e.key),
70
- onSelect: () => {
71
- var n;
72
- (n = e.onAction) == null || n.call(e, e.key), a == null || a(e.key), i == null || i();
73
- },
74
- children: [
75
- /* @__PURE__ */ r.jsx(
76
- "span",
77
- {
78
- className: "proton-MenuTrigger__label",
79
- style: { gridArea: "label" },
80
- children: e.label
81
- }
82
- ),
83
- e.description && /* @__PURE__ */ r.jsx(
84
- "span",
85
- {
86
- className: "proton-MenuTrigger__description",
87
- style: { gridArea: "desc" },
88
- children: e.description
89
- }
90
- )
91
- ]
92
- },
93
- e.key
94
- );
95
- }
96
- return /* @__PURE__ */ r.jsxs(s.Root, { open: x, onOpenChange: t, children: [
97
- /* @__PURE__ */ r.jsx(s.Trigger, { asChild: !0, children: _ }),
98
- /* @__PURE__ */ r.jsx(s.Portal, { children: /* @__PURE__ */ r.jsxs(
99
- s.Content,
100
- {
101
- className: o("proton-Menu", "proton-MenuTrigger__menu", u),
102
- style: d,
103
- children: [
104
- c && /* @__PURE__ */ r.jsx(s.Label, { className: "proton-MenuTrigger__menu-header", children: c }),
105
- h.map(
106
- (m) => p({
107
- item: m,
108
- className: u,
109
- style: d,
110
- disabledKeys: j,
111
- onClose: () => t == null ? void 0 : t(!1)
112
- })
113
- )
114
- ]
115
- }
116
- ) })
117
- ] });
118
- }
119
- export {
120
- v as PopoverMenu
121
- };
122
- //# sourceMappingURL=PopoverMenu.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PopoverMenu.es.js","sources":["../../../src/components/Menu/PopoverMenu.tsx"],"sourcesContent":["import { DropdownMenu as RadixDropdownMenu } from \"radix-ui\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\nimport { csx } from \"../../utils/string\";\r\nimport { ActionMenuAction } from \"../ActionMenu/ActionMenu\";\r\n\r\nexport interface PopoverMenuProps {\r\n /** The trigger component */\r\n trigger: React.ReactNode;\r\n\r\n /** Array of menu actions/items to display\r\n * - type {@link ActionMenuAction}[]\r\n */\r\n items: ActionMenuAction[];\r\n\r\n /** Whether the menu is open */\r\n isOpen: boolean;\r\n\r\n /** Callback when the menu is opened or closed */\r\n onOpenChange: (open: boolean) => void;\r\n\r\n /** The key of the selected item */\r\n selectedKey: string;\r\n\r\n /** Callback when the selection changes */\r\n onSelectionChange: (key: string) => void;\r\n\r\n /** The keys of the disabled items */\r\n disabledKeys: string[];\r\n\r\n /** The title of the menu */\r\n title: string;\r\n}\r\n\r\n/**\r\n * A component that displays a popover menu.\r\n *\r\n * API:\r\n * - {@link PopoverMenuProps}\r\n */\r\nexport function PopoverMenu({\r\n trigger,\r\n items,\r\n isOpen,\r\n onOpenChange,\r\n selectedKey,\r\n onSelectionChange,\r\n disabledKeys,\r\n title,\r\n}: PopoverMenuProps) {\r\n const { className: themeClass, style: themeStyle } = useTheme();\r\n\r\n function renderMenuItem(props) {\r\n const { item, className, style, disabledKeys, onClose } = props;\r\n\r\n if (item.children && item.children.length > 0) {\r\n return (\r\n <RadixDropdownMenu.Sub key={item.key}>\r\n <RadixDropdownMenu.SubTrigger\r\n className={csx(\r\n \"proton-Menu__item\",\r\n \"proton-MenuTrigger__menu-item\"\r\n )}\r\n >\r\n {item.label}\r\n <svg\r\n className=\"proton-MenuTrigger__chevron\"\r\n viewBox=\"0 0 256 256\"\r\n width={16}\r\n height={12}\r\n >\r\n <path\r\n fill=\"currentColor\"\r\n d=\"m184.49 136.49l-80 80a12 12 0 0 1-17-17L159 128L87.51 56.49a12 12 0 1 1 17-17l80 80a12 12 0 0 1-.02 17\"\r\n />\r\n </svg>\r\n </RadixDropdownMenu.SubTrigger>\r\n\r\n <RadixDropdownMenu.SubContent\r\n sideOffset={8}\r\n data-has-submenu=\"true\"\r\n className={csx(\"proton-Menu\", \"proton-MenuTrigger__menu\")}\r\n >\r\n {item.children.map((child) =>\r\n renderMenuItem({\r\n item: child,\r\n className,\r\n style,\r\n disabledKeys,\r\n onClose,\r\n })\r\n )}\r\n </RadixDropdownMenu.SubContent>\r\n </RadixDropdownMenu.Sub>\r\n );\r\n } else {\r\n return (\r\n <RadixDropdownMenu.Item\r\n className={csx(\"proton-Menu__item\", \"proton-MenuTrigger__menu-item\")}\r\n key={item.key}\r\n aria-selected={selectedKey === item.key}\r\n disabled={disabledKeys?.includes(item.key)}\r\n onSelect={() => {\r\n item.onAction?.(item.key);\r\n onSelectionChange?.(item.key);\r\n onClose?.();\r\n }}\r\n >\r\n <span\r\n className=\"proton-MenuTrigger__label\"\r\n style={{ gridArea: \"label\" }}\r\n >\r\n {item.label}\r\n </span>\r\n {item.description && (\r\n <span\r\n className=\"proton-MenuTrigger__description\"\r\n style={{ gridArea: \"desc\" }}\r\n >\r\n {item.description}\r\n </span>\r\n )}\r\n </RadixDropdownMenu.Item>\r\n );\r\n }\r\n }\r\n\r\n return (\r\n <RadixDropdownMenu.Root open={isOpen} onOpenChange={onOpenChange}>\r\n <RadixDropdownMenu.Trigger asChild>{trigger}</RadixDropdownMenu.Trigger>\r\n <RadixDropdownMenu.Portal>\r\n <RadixDropdownMenu.Content\r\n className={csx(\"proton-Menu\", \"proton-MenuTrigger__menu\", themeClass)}\r\n style={themeStyle as React.CSSProperties}\r\n >\r\n {title && (\r\n <RadixDropdownMenu.Label className=\"proton-MenuTrigger__menu-header\">\r\n {title}\r\n </RadixDropdownMenu.Label>\r\n )}\r\n {items.map((item) =>\r\n renderMenuItem({\r\n item,\r\n className: themeClass,\r\n style: themeStyle as React.CSSProperties,\r\n disabledKeys,\r\n onClose: () => onOpenChange?.(false),\r\n })\r\n )}\r\n </RadixDropdownMenu.Content>\r\n </RadixDropdownMenu.Portal>\r\n </RadixDropdownMenu.Root>\r\n );\r\n}\r\n"],"names":["PopoverMenu","trigger","items","isOpen","onOpenChange","selectedKey","onSelectionChange","disabledKeys","title","themeClass","themeStyle","useTheme","renderMenuItem","props","item","className","style","onClose","jsxs","RadixDropdownMenu","csx","jsx","child","_a"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),E=require("../../node_modules/@react-aria/button/dist/useButton.cjs.js"),q=require("../../node_modules/@react-aria/dialog/dist/useDialog.cjs.js"),m=require("../../node_modules/@react-aria/focus/dist/FocusScope.cjs.js"),v=require("@react-aria/utils"),S=require("../../node_modules/@react-aria/overlays/dist/usePreventScroll.cjs.js"),_=require("../../node_modules/@react-aria/overlays/dist/useModalOverlay.cjs.js"),j=require("react"),b=require("../../node_modules/@react-stately/overlays/dist/useOverlayTriggerState.cjs.js"),h=require("../../hooks/useIsClosing.cjs.js"),f=require("../Button/Button.cjs.js");;/* empty css */const y=require("../ScreenOverlay/ScreenOverlay.cjs.js"),B=require("../../hooks/useBreakpoint.cjs.js"),C=require("../../constants/breakpoint.cjs.js"),O=require("../../utils/string.cjs.js"),M=({children:s})=>e.jsxRuntimeExports.jsx("h2",{className:"proton-Modal__title",children:s}),R=({children:s})=>e.jsxRuntimeExports.jsx("h3",{className:"proton-Modal__subtitle",children:s}),g=({children:s})=>e.jsxRuntimeExports.jsx("div",{className:"proton-Modal__body",children:s}),P=s=>e.jsxRuntimeExports.jsx("div",{className:"proton-Modal__action",children:e.jsxRuntimeExports.jsx(f.Button,{...s})}),N=({children:s})=>e.jsxRuntimeExports.jsx(m.FocusScope,{autoFocus:!0,children:e.jsxRuntimeExports.jsx("div",{className:"proton-Modal__actions",children:s})}),F=({title:s,subtitle:o,body:r,onClose:n,children:c,isClosing:d,"data-testid":x})=>{const t=j.useRef(null),u=b.useOverlayTriggerState({isOpen:!0,onOpenChange:n}),{modalProps:p}=_.useModalOverlay({isDismissable:!1},u,t),{dialogProps:i}=q.useDialog({role:"dialog"},t);S.usePreventScroll();const l=j.useRef(null),{buttonProps:a}=E.useButton({onPress:n,"aria-label":"Close"},l);return e.jsxRuntimeExports.jsx(m.FocusScope,{contain:!0,restoreFocus:!0,autoFocus:!0,children:e.jsxRuntimeExports.jsxs("div",{"data-testid":x,className:O.csx("proton-Modal",d&&"proton-Modal--closing"),...v.mergeProps(p,i),ref:t,children:[e.jsxRuntimeExports.jsx("button",{name:"Close",className:"proton-Modal__close-button",...a,ref:l,children:"×"}),s&&e.jsxRuntimeExports.jsx(M,{children:s}),o&&e.jsxRuntimeExports.jsx(R,{children:o}),r&&e.jsxRuntimeExports.jsx(g,{children:r}),e.jsxRuntimeExports.jsx("div",{className:"proton-Modal__content",children:c})]})})},T=({isOpen:s,onClose:o,title:r,subtitle:n,body:c,children:d,isOverlay:x=!0,"data-testid":t})=>{const u=j.useRef(null),{isClosing:p,handleClose:i}=h.useIsClosing({onClose:o,overlayRef:u}),l=B.useBreakpoint(C.BREAKPOINTS.MEDIUM);if(!s)return null;const a=e.jsxRuntimeExports.jsx(F,{isOpen:s,title:r,subtitle:n,body:c,onClose:i,isClosing:p,"data-testid":t,children:d});return x||l?e.jsxRuntimeExports.jsx(y.ScreenOverlay,{fadeIn:!0,ref:u,onClose:i,children:a}):a},A=Object.assign(T,{Title:M,Subtitle:R,Body:g,Action:P,Actions:N});exports.Modal=A;
2
- //# sourceMappingURL=Modal.cjs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.cjs.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useDialog } from \"@react-aria/dialog\";\r\nimport { FocusScope } from \"@react-aria/focus\";\r\nimport { useModalOverlay, usePreventScroll } from \"@react-aria/overlays\";\r\nimport { mergeProps } from \"@react-aria/utils\";\r\nimport { useRef } from \"react\";\r\nimport { useOverlayTriggerState } from \"@react-stately/overlays\";\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks\";\r\nimport { useIsClosing } from \"../../hooks/useIsClosing\";\r\nimport { csx } from \"../../utils\";\r\nimport { Button, ButtonProps } from \"../Button/Button\";\r\nimport \"./Modal.css\";\r\nimport { ScreenOverlay } from \"../ScreenOverlay/ScreenOverlay\";\r\n\r\nconst ModalTitle = ({ children }: { children: React.ReactNode }) => {\r\n return <h2 className=\"proton-Modal__title\">{children}</h2>;\r\n};\r\n\r\nconst ModalSubtitle = ({ children }: { children: React.ReactNode }) => {\r\n return <h3 className=\"proton-Modal__subtitle\">{children}</h3>;\r\n};\r\n\r\nconst ModalBody = ({ children }: { children: React.ReactNode }) => {\r\n return <div className=\"proton-Modal__body\">{children}</div>;\r\n};\r\n\r\nconst ModalAction = (buttonProps: ButtonProps) => {\r\n return (\r\n <div className=\"proton-Modal__action\">\r\n <Button {...buttonProps} />\r\n </div>\r\n );\r\n};\r\n\r\nconst ModalActions = ({ children }: { children: React.ReactNode }) => {\r\n return (\r\n <FocusScope autoFocus>\r\n <div className=\"proton-Modal__actions\">{children}</div>\r\n </FocusScope>\r\n );\r\n};\r\n\r\nconst ModalContent = ({\r\n title,\r\n subtitle,\r\n body,\r\n onClose,\r\n children,\r\n isClosing,\r\n \"data-testid\": dataTestId,\r\n}: ModalProps & {\r\n isClosing: boolean;\r\n}) => {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const state = useOverlayTriggerState({ isOpen: true, onOpenChange: onClose });\r\n const { modalProps } = useModalOverlay(\r\n {\r\n isDismissable: false, //handle dismiss behavior in useIsClosing\r\n },\r\n state,\r\n ref\r\n );\r\n\r\n const { dialogProps } = useDialog({ role: \"dialog\" }, ref);\r\n usePreventScroll();\r\n\r\n const closeButtonRef = useRef<HTMLButtonElement>(null);\r\n const { buttonProps: closeButtonProps } = useButton(\r\n {\r\n onPress: onClose,\r\n \"aria-label\": \"Close\",\r\n },\r\n closeButtonRef\r\n );\r\n\r\n return (\r\n <FocusScope contain restoreFocus autoFocus>\r\n <div\r\n data-testid={dataTestId}\r\n className={csx(\"proton-Modal\", isClosing && \"proton-Modal--closing\")}\r\n {...mergeProps(modalProps, dialogProps)}\r\n ref={ref}\r\n >\r\n <button\r\n name=\"Close\"\r\n className=\"proton-Modal__close-button\"\r\n {...closeButtonProps}\r\n ref={closeButtonRef}\r\n >\r\n ×\r\n </button>\r\n {title && <ModalTitle>{title}</ModalTitle>}\r\n {subtitle && <ModalSubtitle>{subtitle}</ModalSubtitle>}\r\n {body && <ModalBody>{body}</ModalBody>}\r\n <div className=\"proton-Modal__content\">{children}</div>\r\n </div>\r\n </FocusScope>\r\n );\r\n};\r\n\r\nexport interface ModalProps {\r\n /**\r\n * Optional body text content for the modal\r\n * */\r\n body?: string;\r\n /**\r\n * Content to render inside the modal\r\n * */\r\n children: React.ReactNode;\r\n /**\r\n * data-testid for the modal\r\n * */\r\n \"data-testid\"?: string;\r\n /**\r\n * Controls the visibility of the modal\r\n * */\r\n isOpen: boolean;\r\n /**\r\n * Whether to show the modal with an overlay background.\r\n * @default true\r\n * */\r\n isOverlay?: boolean;\r\n /**\r\n * Callback function when modal is closed\r\n * */\r\n onClose?: () => void;\r\n /**\r\n * Optional subtitle text below the modal title\r\n * */\r\n subtitle?: string;\r\n /**\r\n * Optional title text for the modal header\r\n * */\r\n title?: string;\r\n}\r\n\r\n/**\r\n * Modal component with overlay support and responsive behavior.\r\n *\r\n * API:\r\n * - {@link ModalProps}\r\n */\r\nconst ModalWrapper = ({\r\n isOpen,\r\n onClose,\r\n title,\r\n subtitle,\r\n body,\r\n children,\r\n isOverlay = true,\r\n \"data-testid\": dataTestId,\r\n}: ModalProps) => {\r\n const overlayRef = useRef<HTMLDivElement>(null);\r\n const { isClosing, handleClose } = useIsClosing({\r\n onClose,\r\n overlayRef,\r\n });\r\n const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\r\n\r\n if (!isOpen) return null;\r\n\r\n const modalContent = (\r\n <ModalContent\r\n isOpen={isOpen}\r\n title={title}\r\n subtitle={subtitle}\r\n body={body}\r\n onClose={handleClose}\r\n isClosing={isClosing}\r\n data-testid={dataTestId}\r\n >\r\n {children}\r\n </ModalContent>\r\n );\r\n\r\n return isOverlay || isMobile ? (\r\n <ScreenOverlay fadeIn ref={overlayRef} onClose={handleClose}>\r\n {modalContent}\r\n </ScreenOverlay>\r\n ) : (\r\n modalContent\r\n );\r\n};\r\n\r\nexport const Modal = Object.assign(ModalWrapper, {\r\n /**\r\n * Renders a h2 styled title\r\n * */\r\n Title: ModalTitle,\r\n /**\r\n * Renders a h3 styled subtitle\r\n * */\r\n Subtitle: ModalSubtitle,\r\n /**\r\n * Renders a div styled body\r\n * */\r\n Body: ModalBody,\r\n /**\r\n * Renders a Proton Button action\r\n * - @prop buttonProps {@link ButtonProps}\r\n * */\r\n Action: ModalAction,\r\n /**\r\n * Renders a group of Proton Buttons\r\n * */\r\n Actions: ModalActions,\r\n});\r\n"],"names":["ModalTitle","children","jsx","ModalSubtitle","ModalBody","ModalAction","buttonProps","Button","ModalActions","FocusScope","ModalContent","title","subtitle","body","onClose","isClosing","dataTestId","ref","useRef","state","useOverlayTriggerState","modalProps","useModalOverlay","dialogProps","useDialog","usePreventScroll","closeButtonRef","closeButtonProps","useButton","jsxs","csx","mergeProps","ModalWrapper","isOpen","isOverlay","overlayRef","handleClose","useIsClosing","isMobile","useBreakpoint","BREAKPOINTS","modalContent","ScreenOverlay","Modal"],"mappings":"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"}
@@ -1,122 +0,0 @@
1
- import { j as o } from "../../node_modules/react/jsx-runtime.es.js";
2
- import { useButton as $ } from "../../node_modules/@react-aria/button/dist/useButton.es.js";
3
- import { useDialog as _ } from "../../node_modules/@react-aria/dialog/dist/useDialog.es.js";
4
- import { FocusScope as x } from "../../node_modules/@react-aria/focus/dist/FocusScope.es.js";
5
- import { mergeProps as h } from "@react-aria/utils";
6
- import { usePreventScroll as g } from "../../node_modules/@react-aria/overlays/dist/usePreventScroll.es.js";
7
- import { useModalOverlay as v } from "../../node_modules/@react-aria/overlays/dist/useModalOverlay.es.js";
8
- import { useRef as f } from "react";
9
- import { useOverlayTriggerState as C } from "../../node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js";
10
- import { useIsClosing as N } from "../../hooks/useIsClosing.es.js";
11
- import { Button as B } from "../Button/Button.es.js";
12
- /* empty css */
13
- import { ScreenOverlay as P } from "../ScreenOverlay/ScreenOverlay.es.js";
14
- import { useBreakpoint as S } from "../../hooks/useBreakpoint.es.js";
15
- import { BREAKPOINTS as y } from "../../constants/breakpoint.es.js";
16
- import { csx as O } from "../../utils/string.es.js";
17
- const b = ({ children: t }) => /* @__PURE__ */ o.jsx("h2", { className: "proton-Modal__title", children: t }), M = ({ children: t }) => /* @__PURE__ */ o.jsx("h3", { className: "proton-Modal__subtitle", children: t }), j = ({ children: t }) => /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__body", children: t }), A = (t) => /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__action", children: /* @__PURE__ */ o.jsx(B, { ...t }) }), R = ({ children: t }) => /* @__PURE__ */ o.jsx(x, { autoFocus: !0, children: /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__actions", children: t }) }), F = ({
18
- title: t,
19
- subtitle: s,
20
- body: r,
21
- onClose: a,
22
- children: d,
23
- isClosing: m,
24
- "data-testid": p
25
- }) => {
26
- const e = f(null), n = C({ isOpen: !0, onOpenChange: a }), { modalProps: u } = v(
27
- {
28
- isDismissable: !1
29
- //handle dismiss behavior in useIsClosing
30
- },
31
- n,
32
- e
33
- ), { dialogProps: l } = _({ role: "dialog" }, e);
34
- g();
35
- const c = f(null), { buttonProps: i } = $(
36
- {
37
- onPress: a,
38
- "aria-label": "Close"
39
- },
40
- c
41
- );
42
- return /* @__PURE__ */ o.jsx(x, { contain: !0, restoreFocus: !0, autoFocus: !0, children: /* @__PURE__ */ o.jsxs(
43
- "div",
44
- {
45
- "data-testid": p,
46
- className: O("proton-Modal", m && "proton-Modal--closing"),
47
- ...h(u, l),
48
- ref: e,
49
- children: [
50
- /* @__PURE__ */ o.jsx(
51
- "button",
52
- {
53
- name: "Close",
54
- className: "proton-Modal__close-button",
55
- ...i,
56
- ref: c,
57
- children: "×"
58
- }
59
- ),
60
- t && /* @__PURE__ */ o.jsx(b, { children: t }),
61
- s && /* @__PURE__ */ o.jsx(M, { children: s }),
62
- r && /* @__PURE__ */ o.jsx(j, { children: r }),
63
- /* @__PURE__ */ o.jsx("div", { className: "proton-Modal__content", children: d })
64
- ]
65
- }
66
- ) });
67
- }, I = ({
68
- isOpen: t,
69
- onClose: s,
70
- title: r,
71
- subtitle: a,
72
- body: d,
73
- children: m,
74
- isOverlay: p = !0,
75
- "data-testid": e
76
- }) => {
77
- const n = f(null), { isClosing: u, handleClose: l } = N({
78
- onClose: s,
79
- overlayRef: n
80
- }), c = S(y.MEDIUM);
81
- if (!t) return null;
82
- const i = /* @__PURE__ */ o.jsx(
83
- F,
84
- {
85
- isOpen: t,
86
- title: r,
87
- subtitle: a,
88
- body: d,
89
- onClose: l,
90
- isClosing: u,
91
- "data-testid": e,
92
- children: m
93
- }
94
- );
95
- return p || c ? /* @__PURE__ */ o.jsx(P, { fadeIn: !0, ref: n, onClose: l, children: i }) : i;
96
- }, X = Object.assign(I, {
97
- /**
98
- * Renders a h2 styled title
99
- * */
100
- Title: b,
101
- /**
102
- * Renders a h3 styled subtitle
103
- * */
104
- Subtitle: M,
105
- /**
106
- * Renders a div styled body
107
- * */
108
- Body: j,
109
- /**
110
- * Renders a Proton Button action
111
- * - @prop buttonProps {@link ButtonProps}
112
- * */
113
- Action: A,
114
- /**
115
- * Renders a group of Proton Buttons
116
- * */
117
- Actions: R
118
- });
119
- export {
120
- X as Modal
121
- };
122
- //# sourceMappingURL=Modal.es.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Modal.es.js","sources":["../../../src/components/Modal/Modal.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { useButton } from \"@react-aria/button\";\r\nimport { useDialog } from \"@react-aria/dialog\";\r\nimport { FocusScope } from \"@react-aria/focus\";\r\nimport { useModalOverlay, usePreventScroll } from \"@react-aria/overlays\";\r\nimport { mergeProps } from \"@react-aria/utils\";\r\nimport { useRef } from \"react\";\r\nimport { useOverlayTriggerState } from \"@react-stately/overlays\";\r\nimport { BREAKPOINTS } from \"../../constants\";\r\nimport { useBreakpoint } from \"../../hooks\";\r\nimport { useIsClosing } from \"../../hooks/useIsClosing\";\r\nimport { csx } from \"../../utils\";\r\nimport { Button, ButtonProps } from \"../Button/Button\";\r\nimport \"./Modal.css\";\r\nimport { ScreenOverlay } from \"../ScreenOverlay/ScreenOverlay\";\r\n\r\nconst ModalTitle = ({ children }: { children: React.ReactNode }) => {\r\n return <h2 className=\"proton-Modal__title\">{children}</h2>;\r\n};\r\n\r\nconst ModalSubtitle = ({ children }: { children: React.ReactNode }) => {\r\n return <h3 className=\"proton-Modal__subtitle\">{children}</h3>;\r\n};\r\n\r\nconst ModalBody = ({ children }: { children: React.ReactNode }) => {\r\n return <div className=\"proton-Modal__body\">{children}</div>;\r\n};\r\n\r\nconst ModalAction = (buttonProps: ButtonProps) => {\r\n return (\r\n <div className=\"proton-Modal__action\">\r\n <Button {...buttonProps} />\r\n </div>\r\n );\r\n};\r\n\r\nconst ModalActions = ({ children }: { children: React.ReactNode }) => {\r\n return (\r\n <FocusScope autoFocus>\r\n <div className=\"proton-Modal__actions\">{children}</div>\r\n </FocusScope>\r\n );\r\n};\r\n\r\nconst ModalContent = ({\r\n title,\r\n subtitle,\r\n body,\r\n onClose,\r\n children,\r\n isClosing,\r\n \"data-testid\": dataTestId,\r\n}: ModalProps & {\r\n isClosing: boolean;\r\n}) => {\r\n const ref = useRef<HTMLDivElement>(null);\r\n const state = useOverlayTriggerState({ isOpen: true, onOpenChange: onClose });\r\n const { modalProps } = useModalOverlay(\r\n {\r\n isDismissable: false, //handle dismiss behavior in useIsClosing\r\n },\r\n state,\r\n ref\r\n );\r\n\r\n const { dialogProps } = useDialog({ role: \"dialog\" }, ref);\r\n usePreventScroll();\r\n\r\n const closeButtonRef = useRef<HTMLButtonElement>(null);\r\n const { buttonProps: closeButtonProps } = useButton(\r\n {\r\n onPress: onClose,\r\n \"aria-label\": \"Close\",\r\n },\r\n closeButtonRef\r\n );\r\n\r\n return (\r\n <FocusScope contain restoreFocus autoFocus>\r\n <div\r\n data-testid={dataTestId}\r\n className={csx(\"proton-Modal\", isClosing && \"proton-Modal--closing\")}\r\n {...mergeProps(modalProps, dialogProps)}\r\n ref={ref}\r\n >\r\n <button\r\n name=\"Close\"\r\n className=\"proton-Modal__close-button\"\r\n {...closeButtonProps}\r\n ref={closeButtonRef}\r\n >\r\n ×\r\n </button>\r\n {title && <ModalTitle>{title}</ModalTitle>}\r\n {subtitle && <ModalSubtitle>{subtitle}</ModalSubtitle>}\r\n {body && <ModalBody>{body}</ModalBody>}\r\n <div className=\"proton-Modal__content\">{children}</div>\r\n </div>\r\n </FocusScope>\r\n );\r\n};\r\n\r\nexport interface ModalProps {\r\n /**\r\n * Optional body text content for the modal\r\n * */\r\n body?: string;\r\n /**\r\n * Content to render inside the modal\r\n * */\r\n children: React.ReactNode;\r\n /**\r\n * data-testid for the modal\r\n * */\r\n \"data-testid\"?: string;\r\n /**\r\n * Controls the visibility of the modal\r\n * */\r\n isOpen: boolean;\r\n /**\r\n * Whether to show the modal with an overlay background.\r\n * @default true\r\n * */\r\n isOverlay?: boolean;\r\n /**\r\n * Callback function when modal is closed\r\n * */\r\n onClose?: () => void;\r\n /**\r\n * Optional subtitle text below the modal title\r\n * */\r\n subtitle?: string;\r\n /**\r\n * Optional title text for the modal header\r\n * */\r\n title?: string;\r\n}\r\n\r\n/**\r\n * Modal component with overlay support and responsive behavior.\r\n *\r\n * API:\r\n * - {@link ModalProps}\r\n */\r\nconst ModalWrapper = ({\r\n isOpen,\r\n onClose,\r\n title,\r\n subtitle,\r\n body,\r\n children,\r\n isOverlay = true,\r\n \"data-testid\": dataTestId,\r\n}: ModalProps) => {\r\n const overlayRef = useRef<HTMLDivElement>(null);\r\n const { isClosing, handleClose } = useIsClosing({\r\n onClose,\r\n overlayRef,\r\n });\r\n const isMobile = useBreakpoint(BREAKPOINTS.MEDIUM);\r\n\r\n if (!isOpen) return null;\r\n\r\n const modalContent = (\r\n <ModalContent\r\n isOpen={isOpen}\r\n title={title}\r\n subtitle={subtitle}\r\n body={body}\r\n onClose={handleClose}\r\n isClosing={isClosing}\r\n data-testid={dataTestId}\r\n >\r\n {children}\r\n </ModalContent>\r\n );\r\n\r\n return isOverlay || isMobile ? (\r\n <ScreenOverlay fadeIn ref={overlayRef} onClose={handleClose}>\r\n {modalContent}\r\n </ScreenOverlay>\r\n ) : (\r\n modalContent\r\n );\r\n};\r\n\r\nexport const Modal = Object.assign(ModalWrapper, {\r\n /**\r\n * Renders a h2 styled title\r\n * */\r\n Title: ModalTitle,\r\n /**\r\n * Renders a h3 styled subtitle\r\n * */\r\n Subtitle: ModalSubtitle,\r\n /**\r\n * Renders a div styled body\r\n * */\r\n Body: ModalBody,\r\n /**\r\n * Renders a Proton Button action\r\n * - @prop buttonProps {@link ButtonProps}\r\n * */\r\n Action: ModalAction,\r\n /**\r\n * Renders a group of Proton Buttons\r\n * */\r\n Actions: ModalActions,\r\n});\r\n"],"names":["ModalTitle","children","jsx","ModalSubtitle","ModalBody","ModalAction","buttonProps","Button","ModalActions","FocusScope","ModalContent","title","subtitle","body","onClose","isClosing","dataTestId","ref","useRef","state","useOverlayTriggerState","modalProps","useModalOverlay","dialogProps","useDialog","usePreventScroll","closeButtonRef","closeButtonProps","useButton","jsxs","csx","mergeProps","ModalWrapper","isOpen","isOverlay","overlayRef","handleClose","useIsClosing","isMobile","useBreakpoint","BREAKPOINTS","modalContent","ScreenOverlay","Modal"],"mappings":"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"}
@@ -1,2 +0,0 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../node_modules/react/jsx-runtime.cjs.js"),r=require("radix-ui");;/* empty css */const m=require("../ThemeProvider.cjs.js"),j=require("../../utils/string.cjs.js");function v({trigger:s,children:t,open:o,defaultOpen:i,onOpenChange:n,side:x="top",align:a="center",arrow:c=!1,constrainWidth:l=!1,"data-testid":p}){const{className:u,style:d}=m.useTheme();return e.jsxRuntimeExports.jsxs(r.Popover.Root,{open:o,defaultOpen:i,onOpenChange:n,children:[e.jsxRuntimeExports.jsx(r.Popover.Trigger,{asChild:!0,children:e.jsxRuntimeExports.jsx("div",{children:s})}),e.jsxRuntimeExports.jsx(r.Popover.Portal,{children:e.jsxRuntimeExports.jsxs(r.Popover.Content,{side:x,sideOffset:2,align:a,style:d,className:j.csx("proton-Popover",l&&"proton-Popover__constrained",u),"data-testid":p,children:[c&&e.jsxRuntimeExports.jsx(r.Popover.Arrow,{className:"arrow"}),t]})})]})}exports.Popover=v;
2
- //# sourceMappingURL=Popover.cjs.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"Popover.cjs.js","sources":["../../../src/components/Popover/Popover.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { Popover as RadixPopover } from \"radix-ui\";\r\nimport React, { CSSProperties } from \"react\";\r\nimport \"./Popover.css\";\r\nimport { useTheme } from \"../ThemeProvider\";\r\nimport { csx } from \"../../utils/string\";\r\n\r\nexport type PopoverSide = \"top\" | \"right\" | \"bottom\" | \"left\";\r\nexport type PopoverAlign = \"start\" | \"center\" | \"end\";\r\n\r\nexport interface PopoverProps {\r\n /**\r\n * The trigger element for the popover.\r\n * @warning Do NOT pass a <button> element here. Use a span, div, or other non-button element.\r\n * If a button is passed, an error will be thrown.\r\n */\r\n trigger: React.ReactNode;\r\n /**\r\n * The content of the popover.\r\n */\r\n children: React.ReactNode;\r\n /**\r\n * Constrain the width of the popover to the width of the trigger.\r\n */\r\n constrainWidth?: boolean;\r\n /**\r\n * Control open state (controlled mode).\r\n */\r\n open?: boolean;\r\n /**\r\n * Default open state (uncontrolled mode).\r\n */\r\n defaultOpen?: boolean;\r\n /**\r\n * Callback when open state changes.\r\n */\r\n onOpenChange?: (open: boolean) => void;\r\n /**\r\n * Popover side placement\r\n * {@link PopoverSide}\r\n */\r\n side?: PopoverSide;\r\n /**\r\n * Popover alignment\r\n * {@link PopoverAlign}\r\n */\r\n align?: PopoverAlign;\r\n /**\r\n * Show an arrow pointing to the trigger.\r\n */\r\n arrow?: boolean;\r\n /**\r\n * Test id for the popover content.\r\n */\r\n \"data-testid\"?: string;\r\n}\r\n\r\n/**\r\n * A popover component that handles positioning and supports controlled and uncontrolled modes.\r\n *\r\n * A popover displays interactive content in context with a trigger element.\r\n * A tooltip displays a description of an element on hover or focus.\r\n *\r\n * API:\r\n * - {@link PopoverProps}\r\n */\r\nexport function Popover({\r\n trigger,\r\n children,\r\n open,\r\n defaultOpen,\r\n onOpenChange,\r\n side = \"top\",\r\n align = \"center\",\r\n arrow = false,\r\n constrainWidth = false,\r\n \"data-testid\": testId,\r\n}: PopoverProps) {\r\n const { className: themeClass, style: themeStyle } = useTheme();\r\n\r\n return (\r\n <RadixPopover.Root\r\n open={open}\r\n defaultOpen={defaultOpen}\r\n onOpenChange={onOpenChange}\r\n >\r\n <RadixPopover.Trigger asChild>\r\n <div>{trigger}</div>\r\n </RadixPopover.Trigger>\r\n\r\n <RadixPopover.Portal>\r\n <RadixPopover.Content\r\n side={side}\r\n sideOffset={2}\r\n align={align}\r\n style={themeStyle as CSSProperties}\r\n className={csx(\r\n \"proton-Popover\",\r\n constrainWidth && \"proton-Popover__constrained\",\r\n themeClass\r\n )}\r\n data-testid={testId}\r\n >\r\n {arrow && <RadixPopover.Arrow className=\"arrow\" />}\r\n {children}\r\n </RadixPopover.Content>\r\n </RadixPopover.Portal>\r\n </RadixPopover.Root>\r\n );\r\n}\r\n"],"names":["Popover","trigger","children","open","defaultOpen","onOpenChange","side","align","arrow","constrainWidth","testId","themeClass","themeStyle","useTheme","jsxs","RadixPopover","jsx","csx"],"mappings":"uRAmEO,SAASA,EAAQ,CACtB,QAAAC,EACA,SAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,KAAAC,EAAO,MACP,MAAAC,EAAQ,SACR,MAAAC,EAAQ,GACR,eAAAC,EAAiB,GACjB,cAAeC,CACjB,EAAiB,CACf,KAAM,CAAE,UAAWC,EAAY,MAAOC,CAAA,EAAeC,EAAAA,WAGnD,OAAAC,EAAA,kBAAA,KAACC,EAAAA,QAAa,KAAb,CACC,KAAAZ,EACA,YAAAC,EACA,aAAAC,EAEA,SAAA,CAACW,EAAAA,kBAAAA,IAAAD,EAAAA,QAAa,QAAb,CAAqB,QAAO,GAC3B,SAACC,EAAA,kBAAA,IAAA,MAAA,CAAK,WAAQ,CAChB,CAAA,EAEAA,EAAAA,kBAAAA,IAACD,EAAa,QAAA,OAAb,CACC,SAAAD,EAAA,kBAAA,KAACC,EAAAA,QAAa,QAAb,CACC,KAAAT,EACA,WAAY,EACZ,MAAAC,EACA,MAAOK,EACP,UAAWK,EAAA,IACT,iBACAR,GAAkB,8BAClBE,CACF,EACA,cAAaD,EAEZ,SAAA,CAAAF,GAAUQ,EAAA,kBAAA,IAAAD,EAAA,QAAa,MAAb,CAAmB,UAAU,QAAQ,EAC/Cb,CAAA,CAAA,CAAA,EAEL,CAAA,CAAA,CAAA,CAGN"}