@plexui/ui 0.19.0 → 0.20.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (401) hide show
  1. package/README.md +1 -3
  2. package/dist/es/components/Accordion/Accordion.js +2 -2
  3. package/dist/es/components/Accordion/Accordion.js.map +1 -1
  4. package/dist/es/components/Accordion/index.js +1 -1
  5. package/dist/es/components/Alert/Alert.js +6 -6
  6. package/dist/es/components/Alert/Alert.js.map +1 -1
  7. package/dist/es/components/Alert/index.js +1 -1
  8. package/dist/es/components/Avatar/Avatar.js +12 -5
  9. package/dist/es/components/Avatar/Avatar.js.map +1 -1
  10. package/dist/es/components/Avatar/AvatarGroup.js +2 -2
  11. package/dist/es/components/Avatar/AvatarGroup.js.map +1 -1
  12. package/dist/es/components/Avatar/index.js +2 -2
  13. package/dist/es/components/Badge/index.js +3 -3
  14. package/dist/es/components/Badge/index.js.map +1 -1
  15. package/dist/es/components/Breadcrumb/Breadcrumb.js +34 -0
  16. package/dist/es/components/Breadcrumb/Breadcrumb.js.map +1 -0
  17. package/dist/es/components/Breadcrumb/index.js +2 -0
  18. package/dist/es/components/Breadcrumb/index.js.map +1 -0
  19. package/dist/es/components/Button/Button.js +7 -7
  20. package/dist/es/components/Button/Button.js.map +1 -1
  21. package/dist/es/components/Button/CopyButton.js +25 -13
  22. package/dist/es/components/Button/CopyButton.js.map +1 -1
  23. package/dist/es/components/Button/index.js +2 -2
  24. package/dist/es/components/ButtonGroup/ButtonGroup.js +2 -2
  25. package/dist/es/components/ButtonGroup/ButtonGroup.js.map +1 -1
  26. package/dist/es/components/ButtonGroup/index.js +1 -1
  27. package/dist/es/components/Card/Card.js +4 -3
  28. package/dist/es/components/Card/Card.js.map +1 -1
  29. package/dist/es/components/Card/index.js +1 -1
  30. package/dist/es/components/Checkbox/Checkbox.js +12 -6
  31. package/dist/es/components/Checkbox/Checkbox.js.map +1 -1
  32. package/dist/es/components/Checkbox/index.js +1 -1
  33. package/dist/es/components/CodeBlock/CodeBlock.js +25 -25
  34. package/dist/es/components/CodeBlock/CodeBlock.js.map +1 -1
  35. package/dist/es/components/CodeBlock/CollapsibleCodeBlock.js +6 -4
  36. package/dist/es/components/CodeBlock/CollapsibleCodeBlock.js.map +1 -1
  37. package/dist/es/components/CodeBlock/index.js +2 -2
  38. package/dist/es/components/DataTable/DataTable.js +108 -27
  39. package/dist/es/components/DataTable/DataTable.js.map +1 -1
  40. package/dist/es/components/DataTable/DataTableColumnHeader.js +2 -2
  41. package/dist/es/components/DataTable/DataTableColumnHeader.js.map +1 -1
  42. package/dist/es/components/DataTable/DataTablePagination.js +8 -4
  43. package/dist/es/components/DataTable/DataTablePagination.js.map +1 -1
  44. package/dist/es/components/DataTable/columnHelpers.js +3 -3
  45. package/dist/es/components/DataTable/index.js +4 -4
  46. package/dist/es/components/DateInput/DateInput.js +21 -13
  47. package/dist/es/components/DateInput/DateInput.js.map +1 -1
  48. package/dist/es/components/DateInput/index.js +1 -1
  49. package/dist/es/components/DatePicker/Calendar.js +136 -32
  50. package/dist/es/components/DatePicker/Calendar.js.map +1 -1
  51. package/dist/es/components/DatePicker/DatePicker.js +15 -11
  52. package/dist/es/components/DatePicker/DatePicker.js.map +1 -1
  53. package/dist/es/components/DatePicker/index.js +1 -1
  54. package/dist/es/components/DateRangePicker/Calendar.js +125 -22
  55. package/dist/es/components/DateRangePicker/Calendar.js.map +1 -1
  56. package/dist/es/components/DateRangePicker/DateRangePicker.js +10 -9
  57. package/dist/es/components/DateRangePicker/DateRangePicker.js.map +1 -1
  58. package/dist/es/components/DateRangePicker/Trigger.js +12 -9
  59. package/dist/es/components/DateRangePicker/Trigger.js.map +1 -1
  60. package/dist/es/components/DateRangePicker/index.js +2 -2
  61. package/dist/es/components/Dialog/Dialog.js +11 -6
  62. package/dist/es/components/Dialog/Dialog.js.map +1 -1
  63. package/dist/es/components/Dialog/index.js +1 -1
  64. package/dist/es/components/Dialog/index.js.map +1 -1
  65. package/dist/es/components/EmptyMessage/EmptyMessage.js +4 -4
  66. package/dist/es/components/EmptyMessage/EmptyMessage.js.map +1 -1
  67. package/dist/es/components/EmptyMessage/index.js +1 -1
  68. package/dist/es/components/Field/Field.js +22 -7
  69. package/dist/es/components/Field/Field.js.map +1 -1
  70. package/dist/es/components/Field/index.js +1 -1
  71. package/dist/es/components/FieldError/FieldError.js +4 -4
  72. package/dist/es/components/FieldError/FieldError.js.map +1 -1
  73. package/dist/es/components/FieldError/index.js +1 -1
  74. package/dist/es/components/FileUpload/FileUpload.js +12 -9
  75. package/dist/es/components/FileUpload/FileUpload.js.map +1 -1
  76. package/dist/es/components/FileUpload/index.js +1 -1
  77. package/dist/es/components/FloatingLabelInput/FloatingLabelInput.js +31 -4
  78. package/dist/es/components/FloatingLabelInput/FloatingLabelInput.js.map +1 -1
  79. package/dist/es/components/FloatingLabelInput/index.js +1 -1
  80. package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.js +28 -8
  81. package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.js.map +1 -1
  82. package/dist/es/components/FloatingLabelSelect/index.js +1 -1
  83. package/dist/es/components/Icon/aliases.js +20 -20
  84. package/dist/es/components/Icon/index.js +653 -653
  85. package/dist/es/components/Image/Image.js +19 -7
  86. package/dist/es/components/Image/Image.js.map +1 -1
  87. package/dist/es/components/Image/index.js +1 -1
  88. package/dist/es/components/Indicator/CircularProgress.js +3 -3
  89. package/dist/es/components/Indicator/CircularProgress.js.map +1 -1
  90. package/dist/es/components/Indicator/LoadingDots.js +1 -1
  91. package/dist/es/components/Indicator/LoadingDots.js.map +1 -1
  92. package/dist/es/components/Indicator/LoadingIndicator.js +2 -2
  93. package/dist/es/components/Indicator/LoadingIndicator.js.map +1 -1
  94. package/dist/es/components/Indicator/index.js +3 -3
  95. package/dist/es/components/Input/Input.js +16 -5
  96. package/dist/es/components/Input/Input.js.map +1 -1
  97. package/dist/es/components/Input/index.js +1 -1
  98. package/dist/es/components/InputGroup/InputGroup.js +60 -0
  99. package/dist/es/components/InputGroup/InputGroup.js.map +1 -0
  100. package/dist/es/components/InputGroup/index.js +2 -0
  101. package/dist/es/components/InputGroup/index.js.map +1 -0
  102. package/dist/es/components/Kbd/Kbd.js +13 -0
  103. package/dist/es/components/Kbd/Kbd.js.map +1 -0
  104. package/dist/es/components/Kbd/index.js +2 -0
  105. package/dist/es/components/Kbd/index.js.map +1 -0
  106. package/dist/es/components/Label/Label.js +1 -1
  107. package/dist/es/components/Label/Label.js.map +1 -1
  108. package/dist/es/components/Label/index.js +1 -1
  109. package/dist/es/components/Markdown/Markdown.js +8 -8
  110. package/dist/es/components/Markdown/Markdown.js.map +1 -1
  111. package/dist/es/components/Markdown/directives.js +2 -2
  112. package/dist/es/components/Markdown/index.js +4 -5
  113. package/dist/es/components/Markdown/index.js.map +1 -1
  114. package/dist/es/components/MarkdownEditor/MarkdownEditor.js +35 -11
  115. package/dist/es/components/MarkdownEditor/MarkdownEditor.js.map +1 -1
  116. package/dist/es/components/MarkdownEditor/index.js +1 -1
  117. package/dist/es/components/Menu/Menu.js +26 -18
  118. package/dist/es/components/Menu/Menu.js.map +1 -1
  119. package/dist/es/components/Menu/index.js +1 -1
  120. package/dist/es/components/OTPInput/OTPInput.js +51 -34
  121. package/dist/es/components/OTPInput/OTPInput.js.map +1 -1
  122. package/dist/es/components/OTPInput/index.js +1 -1
  123. package/dist/es/components/PlexUIProvider/PlexUIProvider.js +3 -1
  124. package/dist/es/components/PlexUIProvider/PlexUIProvider.js.map +1 -1
  125. package/dist/es/components/PlexUIProvider/index.js +1 -1
  126. package/dist/es/components/PlexUIProvider/internal.js +1 -1
  127. package/dist/es/components/Popover/Popover.js +7 -7
  128. package/dist/es/components/Popover/Popover.js.map +1 -1
  129. package/dist/es/components/Popover/index.js +2 -3
  130. package/dist/es/components/Popover/index.js.map +1 -1
  131. package/dist/es/components/Popover/usePopoverController.js +2 -2
  132. package/dist/es/components/Progress/Progress.js +1 -1
  133. package/dist/es/components/Progress/Progress.js.map +1 -1
  134. package/dist/es/components/Progress/index.js +1 -1
  135. package/dist/es/components/ProgressSteps/ProgressSteps.js +6 -4
  136. package/dist/es/components/ProgressSteps/ProgressSteps.js.map +1 -1
  137. package/dist/es/components/ProgressSteps/index.js +1 -1
  138. package/dist/es/components/RadioGroup/RadioGroup.js +10 -6
  139. package/dist/es/components/RadioGroup/RadioGroup.js.map +1 -1
  140. package/dist/es/components/RadioGroup/index.js +1 -1
  141. package/dist/es/components/SegmentedControl/index.js +1 -1
  142. package/dist/es/components/Select/Select.js +104 -67
  143. package/dist/es/components/Select/Select.js.map +1 -1
  144. package/dist/es/components/Select/index.js +1 -1
  145. package/dist/es/components/SelectControl/SelectControl.js +10 -5
  146. package/dist/es/components/SelectControl/SelectControl.js.map +1 -1
  147. package/dist/es/components/SelectControl/index.js +1 -1
  148. package/dist/es/components/Separator/Separator.js +1 -1
  149. package/dist/es/components/Separator/Separator.js.map +1 -1
  150. package/dist/es/components/Separator/index.js +1 -1
  151. package/dist/es/components/ShimmerText/ShimmerText.js +1 -1
  152. package/dist/es/components/ShimmerText/ShimmerText.js.map +1 -1
  153. package/dist/es/components/ShimmerText/index.js +1 -1
  154. package/dist/es/components/Sidebar/Sidebar.js +37 -29
  155. package/dist/es/components/Sidebar/Sidebar.js.map +1 -1
  156. package/dist/es/components/Sidebar/index.js +2 -2
  157. package/dist/es/components/Sidebar/useSidebarContext.js +17 -19
  158. package/dist/es/components/Sidebar/useSidebarContext.js.map +1 -1
  159. package/dist/es/components/Skeleton/index.js +1 -1
  160. package/dist/es/components/Skeleton/index.js.map +1 -1
  161. package/dist/es/components/Slider/Slider.js +48 -19
  162. package/dist/es/components/Slider/Slider.js.map +1 -1
  163. package/dist/es/components/Slider/index.js +1 -1
  164. package/dist/es/components/StatCard/StatCard.js +5 -5
  165. package/dist/es/components/StatCard/StatCard.js.map +1 -1
  166. package/dist/es/components/StatCard/index.js +1 -1
  167. package/dist/es/components/Switch/Switch.js +7 -3
  168. package/dist/es/components/Switch/Switch.js.map +1 -1
  169. package/dist/es/components/Switch/index.js +1 -1
  170. package/dist/es/components/Table/Table.js +1 -1
  171. package/dist/es/components/Table/Table.js.map +1 -1
  172. package/dist/es/components/Table/index.js +1 -1
  173. package/dist/es/components/Tabs/Tabs.js +154 -6
  174. package/dist/es/components/Tabs/Tabs.js.map +1 -1
  175. package/dist/es/components/Tabs/index.js +1 -1
  176. package/dist/es/components/Tabs/overflow.js +44 -0
  177. package/dist/es/components/Tabs/overflow.js.map +1 -0
  178. package/dist/es/components/TagInput/TagInput.js +47 -23
  179. package/dist/es/components/TagInput/TagInput.js.map +1 -1
  180. package/dist/es/components/TagInput/index.js +1 -1
  181. package/dist/es/components/TextLink/TextLink.js +16 -5
  182. package/dist/es/components/TextLink/TextLink.js.map +1 -1
  183. package/dist/es/components/TextLink/index.js +1 -1
  184. package/dist/es/components/Textarea/Textarea.js +4 -4
  185. package/dist/es/components/Textarea/Textarea.js.map +1 -1
  186. package/dist/es/components/Textarea/index.js +1 -1
  187. package/dist/es/components/Toast/Toaster.js +2 -2
  188. package/dist/es/components/Toast/Toaster.js.map +1 -1
  189. package/dist/es/components/Toast/index.js +1 -1
  190. package/dist/es/components/Tooltip/CopyTooltip.js +30 -9
  191. package/dist/es/components/Tooltip/CopyTooltip.js.map +1 -1
  192. package/dist/es/components/Tooltip/Tooltip.js +3 -3
  193. package/dist/es/components/Tooltip/Tooltip.js.map +1 -1
  194. package/dist/es/components/Tooltip/index.js +2 -2
  195. package/dist/es/components/Transition/Animate.js +4 -4
  196. package/dist/es/components/Transition/Animate.js.map +1 -1
  197. package/dist/es/components/Transition/AnimateLayout.js +4 -4
  198. package/dist/es/components/Transition/AnimateLayout.js.map +1 -1
  199. package/dist/es/components/Transition/AnimateLayoutGroup.js +12 -8
  200. package/dist/es/components/Transition/AnimateLayoutGroup.js.map +1 -1
  201. package/dist/es/components/Transition/SlotTransitionGroup.js +4 -4
  202. package/dist/es/components/Transition/TransitionGroup.js +5 -5
  203. package/dist/es/components/Transition/TransitionGroup.js.map +1 -1
  204. package/dist/es/components/Transition/getDisableAnimations.js +1 -1
  205. package/dist/es/components/Transition/index.js +5 -5
  206. package/dist/es/components/Transition/shared.js +7 -5
  207. package/dist/es/components/Transition/shared.js.map +1 -1
  208. package/dist/es/components/UIProvider/UIProvider.js +1 -1
  209. package/dist/es/components/UIProvider/index.js +1 -1
  210. package/dist/es/components/UIProvider/internal.js +1 -1
  211. package/dist/es/hooks/useAnimatedScrollTo.js +1 -1
  212. package/dist/es/hooks/useBreakpoints.js +8 -2
  213. package/dist/es/hooks/useBreakpoints.js.map +1 -1
  214. package/dist/es/hooks/useEscCloseStack.js +1 -1
  215. package/dist/es/hooks/usePrevious.js +7 -5
  216. package/dist/es/hooks/usePrevious.js.map +1 -1
  217. package/dist/es/hooks/useTextSelection.js +2 -2
  218. package/dist/es/hooks/useTrailingValue.js +1 -1
  219. package/dist/es/lib/constants.js +1 -1
  220. package/dist/es/lib/helpers.js +1 -1
  221. package/dist/es/lib/helpers.js.map +1 -1
  222. package/dist/es/lib/renderHelpers.js +15 -6
  223. package/dist/es/lib/renderHelpers.js.map +1 -1
  224. package/dist/es/lib/theme.js +16 -16
  225. package/dist/es/lib/theme.js.map +1 -1
  226. package/dist/es/lib/userAgent.js +3 -2
  227. package/dist/es/lib/userAgent.js.map +1 -1
  228. package/dist/es/styles/base.css +1 -102
  229. package/dist/es/styles/globals.css +1 -50
  230. package/dist/es/styles/index.css +1 -25
  231. package/dist/es/styles/katex.min.css +1 -1296
  232. package/dist/es/styles/tailwind-utilities.css +1 -1316
  233. package/dist/es/styles/variables-components.css +1 -626
  234. package/dist/es/styles/variables-primitive.css +1 -327
  235. package/dist/es/styles/variables-semantic.css +1 -609
  236. package/dist/es/styles/variables-tailwind-theme.css +1 -34
  237. package/dist/es/styles/variables-tokens-root.css +1 -41
  238. package/dist/es/types.js +1 -1
  239. package/dist/es/types.js.map +1 -1
  240. package/dist/es/vite/index.js +3 -53
  241. package/dist/es/vite/index.js.map +1 -1
  242. package/dist/types/components/Accordion/index.d.ts +1 -1
  243. package/dist/types/components/Alert/Alert.d.ts +8 -2
  244. package/dist/types/components/Alert/index.d.ts +1 -1
  245. package/dist/types/components/Avatar/Avatar.d.ts +1 -1
  246. package/dist/types/components/Avatar/index.d.ts +2 -2
  247. package/dist/types/components/Badge/index.d.ts +1 -1
  248. package/dist/types/components/Breadcrumb/Breadcrumb.d.ts +34 -0
  249. package/dist/types/components/Breadcrumb/index.d.ts +1 -0
  250. package/dist/types/components/Button/Button.d.ts +3 -3
  251. package/dist/types/components/Button/CopyButton.d.ts +9 -4
  252. package/dist/types/components/Button/index.d.ts +2 -2
  253. package/dist/types/components/ButtonGroup/ButtonGroup.d.ts +4 -3
  254. package/dist/types/components/ButtonGroup/index.d.ts +1 -1
  255. package/dist/types/components/Card/index.d.ts +1 -1
  256. package/dist/types/components/Checkbox/Checkbox.d.ts +3 -1
  257. package/dist/types/components/Checkbox/index.d.ts +1 -1
  258. package/dist/types/components/CodeBlock/index.d.ts +2 -2
  259. package/dist/types/components/DataTable/DataTable.d.ts +3 -2
  260. package/dist/types/components/DataTable/index.d.ts +4 -4
  261. package/dist/types/components/DateInput/DateInput.d.ts +1 -1
  262. package/dist/types/components/DateInput/index.d.ts +1 -1
  263. package/dist/types/components/DatePicker/DatePicker.d.ts +7 -6
  264. package/dist/types/components/DatePicker/context.d.ts +1 -1
  265. package/dist/types/components/DatePicker/index.d.ts +2 -2
  266. package/dist/types/components/DateRangePicker/Calendar.d.ts +1 -1
  267. package/dist/types/components/DateRangePicker/DateRangePicker.d.ts +5 -5
  268. package/dist/types/components/DateRangePicker/context.d.ts +2 -2
  269. package/dist/types/components/DateRangePicker/index.d.ts +2 -2
  270. package/dist/types/components/Dialog/Dialog.d.ts +19 -1
  271. package/dist/types/components/Dialog/index.d.ts +1 -1
  272. package/dist/types/components/EmptyMessage/EmptyMessage.d.ts +15 -3
  273. package/dist/types/components/EmptyMessage/index.d.ts +1 -1
  274. package/dist/types/components/Field/Field.d.ts +14 -4
  275. package/dist/types/components/Field/index.d.ts +1 -1
  276. package/dist/types/components/FieldError/FieldError.d.ts +7 -1
  277. package/dist/types/components/FieldError/index.d.ts +1 -1
  278. package/dist/types/components/FileUpload/index.d.ts +1 -1
  279. package/dist/types/components/FloatingLabelInput/index.d.ts +1 -1
  280. package/dist/types/components/FloatingLabelSelect/index.d.ts +1 -1
  281. package/dist/types/components/Icon/aliases.d.ts +20 -20
  282. package/dist/types/components/Icon/index.d.ts +653 -653
  283. package/dist/types/components/Image/Image.d.ts +1 -1
  284. package/dist/types/components/Image/index.d.ts +1 -1
  285. package/dist/types/components/Indicator/index.d.ts +3 -3
  286. package/dist/types/components/Input/Input.d.ts +2 -2
  287. package/dist/types/components/Input/index.d.ts +1 -1
  288. package/dist/types/components/InputGroup/InputGroup.d.ts +78 -0
  289. package/dist/types/components/InputGroup/index.d.ts +1 -0
  290. package/dist/types/components/Kbd/Kbd.d.ts +20 -0
  291. package/dist/types/components/Kbd/index.d.ts +1 -0
  292. package/dist/types/components/Label/index.d.ts +1 -1
  293. package/dist/types/components/Markdown/Markdown.d.ts +1 -1
  294. package/dist/types/components/Markdown/index.d.ts +4 -4
  295. package/dist/types/components/MarkdownEditor/MarkdownEditor.d.ts +6 -2
  296. package/dist/types/components/MarkdownEditor/index.d.ts +1 -1
  297. package/dist/types/components/Menu/Menu.d.ts +11 -3
  298. package/dist/types/components/Menu/index.d.ts +1 -1
  299. package/dist/types/components/OTPInput/index.d.ts +1 -1
  300. package/dist/types/components/PlexUIProvider/PlexUIProvider.d.ts +0 -11
  301. package/dist/types/components/PlexUIProvider/index.d.ts +1 -1
  302. package/dist/types/components/Popover/index.d.ts +2 -2
  303. package/dist/types/components/Progress/index.d.ts +1 -1
  304. package/dist/types/components/ProgressSteps/ProgressSteps.d.ts +1 -1
  305. package/dist/types/components/ProgressSteps/index.d.ts +1 -1
  306. package/dist/types/components/RadioGroup/RadioGroup.d.ts +3 -1
  307. package/dist/types/components/RadioGroup/index.d.ts +1 -1
  308. package/dist/types/components/SegmentedControl/index.d.ts +2 -2
  309. package/dist/types/components/Select/Select.d.ts +8 -1
  310. package/dist/types/components/Select/index.d.ts +1 -1
  311. package/dist/types/components/SelectControl/SelectControl.d.ts +1 -1
  312. package/dist/types/components/SelectControl/index.d.ts +1 -1
  313. package/dist/types/components/Separator/index.d.ts +1 -1
  314. package/dist/types/components/ShimmerText/index.d.ts +1 -1
  315. package/dist/types/components/Sidebar/Sidebar.d.ts +4 -8
  316. package/dist/types/components/Sidebar/index.d.ts +4 -4
  317. package/dist/types/components/Slider/Slider.d.ts +8 -0
  318. package/dist/types/components/Slider/index.d.ts +2 -2
  319. package/dist/types/components/StatCard/index.d.ts +1 -1
  320. package/dist/types/components/Switch/index.d.ts +1 -1
  321. package/dist/types/components/Table/index.d.ts +1 -1
  322. package/dist/types/components/Tabs/Tabs.d.ts +15 -2
  323. package/dist/types/components/Tabs/index.d.ts +2 -2
  324. package/dist/types/components/Tabs/overflow.d.ts +17 -0
  325. package/dist/types/components/TagInput/TagInput.d.ts +1 -1
  326. package/dist/types/components/TagInput/index.d.ts +1 -1
  327. package/dist/types/components/TextLink/index.d.ts +1 -1
  328. package/dist/types/components/Textarea/Textarea.d.ts +1 -1
  329. package/dist/types/components/Textarea/index.d.ts +1 -1
  330. package/dist/types/components/Toast/index.d.ts +1 -1
  331. package/dist/types/components/Tooltip/CopyTooltip.d.ts +6 -1
  332. package/dist/types/components/Tooltip/index.d.ts +2 -2
  333. package/dist/types/components/Transition/Animate.d.ts +2 -2
  334. package/dist/types/components/Transition/AnimateLayout.d.ts +2 -2
  335. package/dist/types/components/Transition/AnimateLayoutGroup.d.ts +2 -2
  336. package/dist/types/components/Transition/SlotTransitionGroup.d.ts +1 -1
  337. package/dist/types/components/Transition/TransitionGroup.d.ts +1 -1
  338. package/dist/types/components/Transition/index.d.ts +5 -5
  339. package/dist/types/components/UIProvider/index.d.ts +1 -1
  340. package/dist/types/global.d.ts +5 -1
  341. package/dist/types/lib/constants.d.ts +1 -1
  342. package/dist/types/lib/helpers.d.ts +4 -4
  343. package/dist/types/lib/theme.d.ts +1 -1
  344. package/dist/types/types.d.ts +2 -15
  345. package/dist/types/vite/index.d.ts +2 -55
  346. package/package.json +10 -18
  347. package/dist/es/components/Accordion/Accordion.module.css +0 -89
  348. package/dist/es/components/Alert/Alert.module.css +0 -187
  349. package/dist/es/components/Avatar/Avatar.module.css +0 -168
  350. package/dist/es/components/Avatar/AvatarGroup.module.css +0 -26
  351. package/dist/es/components/Badge/Badge.module.css +0 -196
  352. package/dist/es/components/Button/Button.module.css +0 -859
  353. package/dist/es/components/ButtonGroup/ButtonGroup.module.css +0 -159
  354. package/dist/es/components/Card/Card.module.css +0 -125
  355. package/dist/es/components/Checkbox/Checkbox.module.css +0 -198
  356. package/dist/es/components/CodeBlock/CodeBlock.module.css +0 -137
  357. package/dist/es/components/DataTable/DataTable.module.css +0 -108
  358. package/dist/es/components/DatePicker/Calendar.module.css +0 -271
  359. package/dist/es/components/DateRangePicker/Calendar.module.css +0 -295
  360. package/dist/es/components/DateRangePicker/Trigger.module.css +0 -25
  361. package/dist/es/components/Dialog/Dialog.module.css +0 -133
  362. package/dist/es/components/EmptyMessage/EmptyMessage.module.css +0 -82
  363. package/dist/es/components/Field/Field.module.css +0 -137
  364. package/dist/es/components/FieldError/FieldError.module.css +0 -22
  365. package/dist/es/components/FileUpload/FileUpload.module.css +0 -133
  366. package/dist/es/components/FloatingLabelInput/FloatingLabelInput.module.css +0 -220
  367. package/dist/es/components/FloatingLabelSelect/FloatingLabelSelect.module.css +0 -146
  368. package/dist/es/components/Image/Image.module.css +0 -9
  369. package/dist/es/components/Indicator/CircularProgress.module.css +0 -28
  370. package/dist/es/components/Indicator/LoadingDots.module.css +0 -35
  371. package/dist/es/components/Indicator/LoadingIndicator.module.css +0 -41
  372. package/dist/es/components/Input/Input.module.css +0 -507
  373. package/dist/es/components/Label/Label.module.css +0 -16
  374. package/dist/es/components/Markdown/Markdown.module.css +0 -233
  375. package/dist/es/components/MarkdownEditor/MarkdownEditor.module.css +0 -297
  376. package/dist/es/components/Menu/Menu.module.css +0 -377
  377. package/dist/es/components/OTPInput/OTPInput.module.css +0 -66
  378. package/dist/es/components/Popover/Popover.module.css +0 -82
  379. package/dist/es/components/Progress/Progress.module.css +0 -34
  380. package/dist/es/components/ProgressSteps/ProgressSteps.module.css +0 -246
  381. package/dist/es/components/RadioGroup/RadioGroup.module.css +0 -137
  382. package/dist/es/components/Select/Select.module.css +0 -310
  383. package/dist/es/components/SelectControl/SelectControl.module.css +0 -558
  384. package/dist/es/components/Separator/Separator.module.css +0 -16
  385. package/dist/es/components/ShimmerText/ShimmerText.module.css +0 -43
  386. package/dist/es/components/Sidebar/Sidebar.module.css +0 -909
  387. package/dist/es/components/Skeleton/Skeleton.module.css +0 -17
  388. package/dist/es/components/Slider/Slider.module.css +0 -203
  389. package/dist/es/components/StatCard/StatCard.module.css +0 -234
  390. package/dist/es/components/Switch/Switch.module.css +0 -121
  391. package/dist/es/components/Table/Table.module.css +0 -56
  392. package/dist/es/components/Tabs/Tabs.module.css +0 -672
  393. package/dist/es/components/TagInput/TagInput.module.css +0 -320
  394. package/dist/es/components/TextLink/TextLink.module.css +0 -50
  395. package/dist/es/components/Textarea/Textarea.module.css +0 -272
  396. package/dist/es/components/Toast/Toast.module.css +0 -84
  397. package/dist/es/components/Tooltip/Tooltip.module.css +0 -91
  398. package/dist/es/components/Transition/Animate.module.css +0 -54
  399. package/dist/es/components/Transition/AnimateLayout.module.css +0 -101
  400. package/dist/es/components/Transition/AnimateLayoutGroup.module.css +0 -72
  401. package/dist/es/components/Transition/TransitionGroup.module.css +0 -4
@@ -2,11 +2,15 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import clsx from "clsx";
4
4
  import { Fragment, forwardRef, useCallback, useEffect, useId, useImperativeHandle, useMemo, useRef, useState, } from "react";
5
- import { FieldError } from "../FieldError";
6
- import s from "./OTPInput.module.css";
5
+ import { FieldError } from "../FieldError/index.js";
6
+ import s from "@plexui/styles/components/OTPInput/OTPInput.module.css";
7
7
  function sanitizeDigits(value, length) {
8
8
  return value.replace(/\D/g, "").slice(0, length);
9
9
  }
10
+ // One entry per cell, "" when empty
11
+ function toCells(value, length) {
12
+ return Array.from({ length }, (_, index) => value[index] ?? "");
13
+ }
10
14
  function shouldShowGap(index, grouping) {
11
15
  let pos = 0;
12
16
  for (const groupSize of grouping) {
@@ -21,39 +25,39 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
21
25
  const length = Math.max(1, Math.floor(lengthProp));
22
26
  const controlledValue = useMemo(() => sanitizeDigits(value ?? "", length), [value, length]);
23
27
  const isControlled = value !== undefined;
24
- const [internalValue, setInternalValue] = useState(() => sanitizeDigits(value ?? "", length));
28
+ // The digit of every cell, so clearing or filling one cell never moves the
29
+ // others; the value is the filled cells' digits in order
30
+ const [cells, setCells] = useState(() => toCells(controlledValue, length));
25
31
  const [focusedIndex, setFocusedIndex] = useState(-1);
26
32
  const rootRef = useRef(null);
27
33
  const inputRefs = useRef([]);
28
34
  useImperativeHandle(ref, () => rootRef.current, []);
29
- useEffect(() => {
30
- if (isControlled) {
31
- setInternalValue(controlledValue);
32
- return;
33
- }
34
- setInternalValue((current) => sanitizeDigits(current, length));
35
- }, [controlledValue, isControlled, length]);
36
- const currentValue = isControlled ? controlledValue : internalValue;
37
- const digits = useMemo(() => Array.from({ length }, (_, index) => currentValue[index] ?? ""), [currentValue, length]);
35
+ const ownCells = useMemo(() => Array.from({ length }, (_, index) => cells[index] ?? ""), [cells, length]);
36
+ const currentValue = isControlled ? controlledValue : ownCells.join("");
37
+ // The cells keep their gaps while they spell the value; any other value
38
+ // (set by the parent) fills the cells from the start
39
+ const digits = useMemo(() => (ownCells.join("") === currentValue ? ownCells : toCells(currentValue, length)), [ownCells, currentValue, length]);
38
40
  const errorId = `otp-input-${useId()}-error`;
39
41
  useEffect(() => {
40
42
  if (!autoFocus || disabled)
41
43
  return;
42
44
  inputRefs.current[0]?.focus();
43
45
  }, [autoFocus, disabled]);
44
- const commitValue = useCallback((nextValueRaw) => {
45
- const nextValue = sanitizeDigits(nextValueRaw, length);
46
- if (!isControlled) {
47
- setInternalValue(nextValue);
48
- }
46
+ // The value the field's own last edit produced, until the value changes:
47
+ // a field the user empties keeps the caret where it is
48
+ const ownValueRef = useRef(null);
49
+ const commitDigits = useCallback((nextDigits) => {
50
+ // Kept when controlled too: the parent's value then keeps these gaps
51
+ setCells(nextDigits);
52
+ const nextValue = nextDigits.join("");
53
+ ownValueRef.current = nextValue;
49
54
  if (nextValue !== currentValue) {
50
55
  onChange?.(nextValue);
51
56
  }
52
57
  if (nextValue.length === length) {
53
58
  onComplete?.(nextValue);
54
59
  }
55
- return nextValue;
56
- }, [currentValue, isControlled, length, onChange, onComplete]);
60
+ }, [currentValue, length, onChange, onComplete]);
57
61
  const focusCell = useCallback((index) => {
58
62
  const clampedIndex = Math.max(0, Math.min(index, length - 1));
59
63
  const input = inputRefs.current[clampedIndex];
@@ -62,6 +66,19 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
62
66
  input.focus();
63
67
  input.setSelectionRange(1, 1);
64
68
  }, [length]);
69
+ // A field cleared from outside (a wrong code wiped by the form) puts the
70
+ // caret back in the first cell, when the focus was in the field already
71
+ const hadValueRef = useRef(currentValue.length > 0);
72
+ useEffect(() => {
73
+ const filled = currentValue.length > 0;
74
+ const fromOutside = ownValueRef.current !== currentValue;
75
+ ownValueRef.current = null;
76
+ const root = rootRef.current;
77
+ if (!filled && hadValueRef.current && fromOutside && !disabled && root?.contains(document.activeElement)) {
78
+ focusCell(0);
79
+ }
80
+ hadValueRef.current = filled;
81
+ }, [currentValue, disabled, focusCell]);
65
82
  const handleCellClick = useCallback((index) => {
66
83
  if (disabled)
67
84
  return;
@@ -82,10 +99,10 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
82
99
  nextDigits[writeIndex] = digit;
83
100
  writeIndex += 1;
84
101
  }
85
- const nextValue = commitValue(nextDigits.join(""));
86
- const nextFocusIndex = Math.min(nextValue.length, length - 1);
87
- focusCell(nextFocusIndex);
88
- }, [commitValue, digits, disabled, focusCell, length]);
102
+ commitDigits(nextDigits);
103
+ // The cell after the pasted digits
104
+ focusCell(Math.min(writeIndex, length - 1));
105
+ }, [commitDigits, digits, disabled, focusCell, length]);
89
106
  const handleChange = useCallback((index, evt) => {
90
107
  if (disabled)
91
108
  return;
@@ -93,14 +110,14 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
93
110
  if (!typedDigits) {
94
111
  const nextDigits = [...digits];
95
112
  nextDigits[index] = "";
96
- commitValue(nextDigits.join(""));
113
+ commitDigits(nextDigits);
97
114
  return;
98
115
  }
99
116
  const nextDigits = [...digits];
100
117
  if (typedDigits.length === 1) {
101
118
  nextDigits[index] = typedDigits[0];
102
- const nextValue = commitValue(nextDigits.join(""));
103
- if (index < length - 1 && nextValue.length > index) {
119
+ commitDigits(nextDigits);
120
+ if (index < length - 1) {
104
121
  focusCell(index + 1);
105
122
  }
106
123
  return;
@@ -112,10 +129,10 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
112
129
  nextDigits[writeIndex] = digit;
113
130
  writeIndex += 1;
114
131
  }
115
- const nextValue = commitValue(nextDigits.join(""));
116
- const nextFocusIndex = Math.min(nextValue.length, length - 1);
117
- focusCell(nextFocusIndex);
118
- }, [commitValue, digits, disabled, focusCell, length]);
132
+ commitDigits(nextDigits);
133
+ // The cell after the typed digits
134
+ focusCell(Math.min(writeIndex, length - 1));
135
+ }, [commitDigits, digits, disabled, focusCell, length]);
119
136
  const handleKeyDown = useCallback((index, evt) => {
120
137
  if (disabled)
121
138
  return;
@@ -124,12 +141,12 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
124
141
  const nextDigits = [...digits];
125
142
  if (nextDigits[index]) {
126
143
  nextDigits[index] = "";
127
- commitValue(nextDigits.join(""));
144
+ commitDigits(nextDigits);
128
145
  return;
129
146
  }
130
147
  if (index > 0) {
131
148
  nextDigits[index - 1] = "";
132
- commitValue(nextDigits.join(""));
149
+ commitDigits(nextDigits);
133
150
  focusCell(index - 1);
134
151
  }
135
152
  return;
@@ -138,7 +155,7 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
138
155
  evt.preventDefault();
139
156
  const nextDigits = [...digits];
140
157
  nextDigits[index] = "";
141
- commitValue(nextDigits.join(""));
158
+ commitDigits(nextDigits);
142
159
  return;
143
160
  }
144
161
  if (evt.key === "ArrowLeft") {
@@ -150,7 +167,7 @@ export const OTPInput = forwardRef(function OTPInput(props, ref) {
150
167
  evt.preventDefault();
151
168
  focusCell(index + 1);
152
169
  }
153
- }, [commitValue, digits, disabled, focusCell]);
170
+ }, [commitDigits, digits, disabled, focusCell]);
154
171
  const handleBlur = useCallback(() => {
155
172
  requestAnimationFrame(() => {
156
173
  const activeElement = document.activeElement;
@@ -1 +1 @@
1
- {"version":3,"file":"OTPInput.js","sourceRoot":"","sources":["../../../../src/components/OTPInput/OTPInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EACL,QAAQ,EACR,UAAU,EACV,WAAW,EACX,SAAS,EACT,KAAK,EACL,mBAAmB,EACnB,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AAEd,OAAO,EAAE,UAAU,EAAE,MAAM,eAAe,CAAA;AAE1C,OAAO,CAAC,MAAM,uBAAuB,CAAA;AAerC,SAAS,cAAc,CAAC,KAAa,EAAE,MAAc;IACnD,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,EAAE,MAAM,CAAC,CAAA;AAClD,CAAC;AAED,SAAS,aAAa,CAAC,KAAa,EAAE,QAAkB;IACtD,IAAI,GAAG,GAAG,CAAC,CAAA;IACX,KAAK,MAAM,SAAS,IAAI,QAAQ,EAAE,CAAC;QACjC,GAAG,IAAI,SAAS,CAAA;QAChB,IAAI,KAAK,KAAK,GAAG;YAAE,OAAO,IAAI,CAAA;IAChC,CAAC;IACD,OAAO,KAAK,CAAA;AACd,CAAC;AAED,MAAM,CAAC,MAAM,QAAQ,GAAG,UAAU,CAAgC,SAAS,QAAQ,CAAC,KAAK,EAAE,GAAG;IAC5F,MAAM,EACJ,MAAM,EAAE,UAAU,GAAG,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,UAAU,EACV,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,YAAY,EACZ,QAAQ,GAAG,KAAK,EAChB,SAAS,GAAG,KAAK,EACjB,SAAS,GACV,GAAG,KAAK,CAAA;IAET,MAAM,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,CAAC,CAAA;IAClD,MAAM,eAAe,GAAG,OAAO,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,IAAI,EAAE,EAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,CAAC,CAAC,CAAA;IAC3F,MAAM,YAAY,GAAG,KAAK,KAAK,SAAS,CAAA;IAExC,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,cAAc,CAAC,KAAK,IAAI,EAAE,EAAE,MAAM,CAAC,CAAC,CAAA;IAC7F,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAA;IAEpD,MAAM,OAAO,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAA;IACnD,MAAM,SAAS,GAAG,MAAM,CAAiC,EAAE,CAAC,CAAA;IAE5D,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,OAAyB,EAAE,EAAE,CAAC,CAAA;IAErE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,YAAY,EAAE,CAAC;YACjB,gBAAgB,CAAC,eAAe,CAAC,CAAA;YACjC,OAAM;QACR,CAAC;QACD,gBAAgB,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,cAAc,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAA;IAChE,CAAC,EAAE,CAAC,eAAe,EAAE,YAAY,EAAE,MAAM,CAAC,CAAC,CAAA;IAE3C,MAAM,YAAY,GAAG,YAAY,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,aAAa,CAAA;IACnE,MAAM,MAAM,GAAG,OAAO,CACpB,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,CAAC,IAAI,EAAE,CAAC,EACrE,CAAC,YAAY,EAAE,MAAM,CAAC,CACvB,CAAA;IAED,MAAM,OAAO,GAAG,aAAa,KAAK,EAAE,QAAQ,CAAA;IAE5C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,QAAQ;YAAE,OAAM;QAClC,SAAS,CAAC,OAAO,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,CAAA;IAC/B,CAAC,EAAE,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC,CAAA;IAEzB,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,YAAoB,EAAE,EAAE;QACvB,MAAM,SAAS,GAAG,cAAc,CAAC,YAAY,EAAE,MAAM,CAAC,CAAA;QACtD,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,gBAAgB,CAAC,SAAS,CAAC,CAAA;QAC7B,CAAC;QACD,IAAI,SAAS,KAAK,YAAY,EAAE,CAAC;YAC/B,QAAQ,EAAE,CAAC,SAAS,CAAC,CAAA;QACvB,CAAC;QACD,IAAI,SAAS,CAAC,MAAM,KAAK,MAAM,EAAE,CAAC;YAChC,UAAU,EAAE,CAAC,SAAS,CAAC,CAAA;QACzB,CAAC;QACD,OAAO,SAAS,CAAA;IAClB,CAAC,EACD,CAAC,YAAY,EAAE,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,UAAU,CAAC,CAC3D,CAAA;IAED,MAAM,SAAS,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,EAAE;QAC9C,MAAM,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,MAAM,GAAG,CAAC,CAAC,CAAC,CAAA;QAC7D,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,CAAC,YAAY,CAAC,CAAA;QAC7C,IAAI,CAAC,KAAK;YAAE,OAAM;QAClB,KAAK,CAAC,KAAK,EAAE,CAAA;QACb,KAAK,CAAC,iBAAiB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAA;IAC/B,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAA;IAEZ,MAAM,eAAe,GAAG,WAAW,CAAC,CAAC,KAAa,EAAE,EAAE;QACpD,IAAI,QAAQ;YAAE,OAAM;QACpB,SAAS,CAAC,KAAK,CAAC,CAAA;IAClB,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAA;IAEzB,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAAa,EAAE,GAA2C,EAAE,EAAE;QAC7D,IAAI,QAAQ;YAAE,OAAM;QACpB,GAAG,CAAC,cAAc,EAAE,CAAA;QACpB,MAAM,YAAY,GAAG,cAAc,CAAC,GAAG,CAAC,aAAa,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAA;QAC9E,IAAI,CAAC,YAAY;YAAE,OAAM;QAEzB,MAAM,UAAU,GAAG,CAAC,GAAG,MAAM,CAAC,CAAA;QAC9B,IAAI,UAAU,GAAG,KAAK,CAAA;QAEtB,KAAK,MAAM,KAAK,IAAI,YAAY,EAAE,CAAC;YACjC,IAAI,UAAU,IAAI,MAAM;gBAAE,MAAK;YAC/B,UAAU,CAAC,UAAU,CAAC,GAAG,KAAK,CAAA;YAC9B,UAAU,IAAI,CAAC,CAAA;QACjB,CAAC;QAED,MAAM,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;QAClD,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,CAAC,CAAA;QAC7D,SAAS,CAAC,cAAc,CAAC,CAAA;IAC3B,CAAC,EACD,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,CAAC,CACnD,CAAA;IAED,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAAa,EAAE,GAAwC,EAAE,EAAE;QAC1D,IAAI,QAAQ;YAAE,OAAM;QACpB,MAAM,WAAW,GAAG,GAAG,CAAC,aAAa,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,CAAA;QAE9D,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,MAAM,UAAU,GAAG,CAAC,GAAG,MAAM,CAAC,CAAA;YAC9B,UAAU,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;YACtB,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;YAChC,OAAM;QACR,CAAC;QAED,MAAM,UAAU,GAAG,CAAC,GAAG,MAAM,CAAC,CAAA;QAE9B,IAAI,WAAW,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;YAC7B,UAAU,CAAC,KAAK,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,CAAA;YAClC,MAAM,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;YAClD,IAAI,KAAK,GAAG,MAAM,GAAG,CAAC,IAAI,SAAS,CAAC,MAAM,GAAG,KAAK,EAAE,CAAC;gBACnD,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;YACtB,CAAC;YACD,OAAM;QACR,CAAC;QAED,IAAI,UAAU,GAAG,KAAK,CAAA;QACtB,KAAK,MAAM,KAAK,IAAI,WAAW,EAAE,CAAC;YAChC,IAAI,UAAU,IAAI,MAAM;gBAAE,MAAK;YAC/B,UAAU,CAAC,UAAU,CAAC,GAAG,KAAK,CAAA;YAC9B,UAAU,IAAI,CAAC,CAAA;QACjB,CAAC;QAED,MAAM,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;QAClD,MAAM,cAAc,GAAG,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,GAAG,CAAC,CAAC,CAAA;QAC7D,SAAS,CAAC,cAAc,CAAC,CAAA;IAC3B,CAAC,EACD,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,CAAC,CACnD,CAAA;IAED,MAAM,aAAa,GAAG,WAAW,CAC/B,CAAC,KAAa,EAAE,GAA0C,EAAE,EAAE;QAC5D,IAAI,QAAQ;YAAE,OAAM;QAEpB,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;YAC5B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,MAAM,UAAU,GAAG,CAAC,GAAG,MAAM,CAAC,CAAA;YAE9B,IAAI,UAAU,CAAC,KAAK,CAAC,EAAE,CAAC;gBACtB,UAAU,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;gBACtB,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;gBAChC,OAAM;YACR,CAAC;YAED,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;gBACd,UAAU,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,EAAE,CAAA;gBAC1B,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;gBAChC,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;YACtB,CAAC;YACD,OAAM;QACR,CAAC;QAED,IAAI,GAAG,CAAC,GAAG,KAAK,QAAQ,EAAE,CAAC;YACzB,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,MAAM,UAAU,GAAG,CAAC,GAAG,MAAM,CAAC,CAAA;YAC9B,UAAU,CAAC,KAAK,CAAC,GAAG,EAAE,CAAA;YACtB,WAAW,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,CAAA;YAChC,OAAM;QACR,CAAC;QAED,IAAI,GAAG,CAAC,GAAG,KAAK,WAAW,EAAE,CAAC;YAC5B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;YACpB,OAAM;QACR,CAAC;QAED,IAAI,GAAG,CAAC,GAAG,KAAK,YAAY,EAAE,CAAC;YAC7B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,SAAS,CAAC,KAAK,GAAG,CAAC,CAAC,CAAA;QACtB,CAAC;IACH,CAAC,EACD,CAAC,WAAW,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,CAAC,CAC3C,CAAA;IAED,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,qBAAqB,CAAC,GAAG,EAAE;YACzB,MAAM,aAAa,GAAG,QAAQ,CAAC,aAAa,CAAA;YAC5C,MAAM,gBAAgB,GAAG,SAAS,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,aAAa,CAAC,CAAA;YACnF,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBACtB,eAAe,CAAC,CAAC,CAAC,CAAC,CAAA;YACrB,CAAC;QACH,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,OAAO,CACL,eAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,aACnD,cAAK,SAAS,EAAE,CAAC,CAAC,KAAK,YACpB,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE;oBACnC,MAAM,UAAU,GAAG,QAAQ,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,CAAC,KAAK,CAAA;oBAEpE,OAAO,CACL,MAAC,QAAQ,eACN,UAAU,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,QAAQ,wBAAgB,EACzD,eACE,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE;oCACtB,CAAC,CAAC,CAAC,WAAW,CAAC,EAAE,YAAY,KAAK,KAAK;oCACvC,CAAC,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;iCAChC,CAAC,kBACY,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,mBACvB,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EACxC,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,aAErC,gBACE,GAAG,EAAE,CAAC,OAAO,EAAE,EAAE;4CACf,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,OAAO,CAAA;wCACpC,CAAC,EACD,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,SAAS,EACnB,OAAO,EAAC,OAAO,EACf,SAAS,EAAE,CAAC,EACZ,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EACpB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,CAAC,CAAC,SAAS,EACtB,QAAQ,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,YAAY,CAAC,KAAK,EAAE,GAAG,CAAC,EAC3C,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,aAAa,CAAC,KAAK,EAAE,GAAG,CAAC,EAC7C,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,EACrC,MAAM,EAAE,UAAU,EAClB,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,CAAC,KAAK,EAAE,GAAG,CAAC,gBAC7B,SAAS,KAAK,GAAG,CAAC,EAAE,kBAClB,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,sBACtB,YAAY,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACpD,YAAY,EAAE,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,KAAK,GACnD,EACD,CAAC,MAAM,CAAC,KAAK,CAAC,IAAI,YAAY,KAAK,KAAK,IAAI,cAAK,SAAS,EAAE,CAAC,CAAC,cAAc,GAAI,IAC7E,KAjCO,KAAK,CAkCT,CACZ,CAAA;gBACH,CAAC,CAAC,GACE,EACL,YAAY,IAAI,CACf,KAAC,UAAU,IAAC,EAAE,EAAE,OAAO,EAAE,SAAS,EAAE,CAAC,CAAC,YAAY,YAC/C,YAAY,GACF,CACd,IACG,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport {\n Fragment,\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\"\n\nimport { FieldError } from \"../FieldError\"\n\nimport s from \"./OTPInput.module.css\"\n\nexport type OTPInputProps = {\n length?: number\n value?: string\n onChange?: (value: string) => void\n onComplete?: (value: string) => void\n grouping?: number[]\n invalid?: boolean\n errorMessage?: string\n disabled?: boolean\n autoFocus?: boolean\n className?: string\n}\n\nfunction sanitizeDigits(value: string, length: number): string {\n return value.replace(/\\D/g, \"\").slice(0, length)\n}\n\nfunction shouldShowGap(index: number, grouping: number[]): boolean {\n let pos = 0\n for (const groupSize of grouping) {\n pos += groupSize\n if (index === pos) return true\n }\n return false\n}\n\nexport const OTPInput = forwardRef<HTMLDivElement, OTPInputProps>(function OTPInput(props, ref) {\n const {\n length: lengthProp = 6,\n value,\n onChange,\n onComplete,\n grouping,\n invalid = false,\n errorMessage,\n disabled = false,\n autoFocus = false,\n className,\n } = props\n\n const length = Math.max(1, Math.floor(lengthProp))\n const controlledValue = useMemo(() => sanitizeDigits(value ?? \"\", length), [value, length])\n const isControlled = value !== undefined\n\n const [internalValue, setInternalValue] = useState(() => sanitizeDigits(value ?? \"\", length))\n const [focusedIndex, setFocusedIndex] = useState(-1)\n\n const rootRef = useRef<HTMLDivElement | null>(null)\n const inputRefs = useRef<Array<HTMLInputElement | null>>([])\n\n useImperativeHandle(ref, () => rootRef.current as HTMLDivElement, [])\n\n useEffect(() => {\n if (isControlled) {\n setInternalValue(controlledValue)\n return\n }\n setInternalValue((current) => sanitizeDigits(current, length))\n }, [controlledValue, isControlled, length])\n\n const currentValue = isControlled ? controlledValue : internalValue\n const digits = useMemo(\n () => Array.from({ length }, (_, index) => currentValue[index] ?? \"\"),\n [currentValue, length],\n )\n\n const errorId = `otp-input-${useId()}-error`\n\n useEffect(() => {\n if (!autoFocus || disabled) return\n inputRefs.current[0]?.focus()\n }, [autoFocus, disabled])\n\n const commitValue = useCallback(\n (nextValueRaw: string) => {\n const nextValue = sanitizeDigits(nextValueRaw, length)\n if (!isControlled) {\n setInternalValue(nextValue)\n }\n if (nextValue !== currentValue) {\n onChange?.(nextValue)\n }\n if (nextValue.length === length) {\n onComplete?.(nextValue)\n }\n return nextValue\n },\n [currentValue, isControlled, length, onChange, onComplete],\n )\n\n const focusCell = useCallback((index: number) => {\n const clampedIndex = Math.max(0, Math.min(index, length - 1))\n const input = inputRefs.current[clampedIndex]\n if (!input) return\n input.focus()\n input.setSelectionRange(1, 1)\n }, [length])\n\n const handleCellClick = useCallback((index: number) => {\n if (disabled) return\n focusCell(index)\n }, [disabled, focusCell])\n\n const handlePaste = useCallback(\n (index: number, evt: React.ClipboardEvent<HTMLInputElement>) => {\n if (disabled) return\n evt.preventDefault()\n const pastedDigits = sanitizeDigits(evt.clipboardData.getData(\"text\"), length)\n if (!pastedDigits) return\n\n const nextDigits = [...digits]\n let writeIndex = index\n\n for (const digit of pastedDigits) {\n if (writeIndex >= length) break\n nextDigits[writeIndex] = digit\n writeIndex += 1\n }\n\n const nextValue = commitValue(nextDigits.join(\"\"))\n const nextFocusIndex = Math.min(nextValue.length, length - 1)\n focusCell(nextFocusIndex)\n },\n [commitValue, digits, disabled, focusCell, length],\n )\n\n const handleChange = useCallback(\n (index: number, evt: React.ChangeEvent<HTMLInputElement>) => {\n if (disabled) return\n const typedDigits = evt.currentTarget.value.replace(/\\D/g, \"\")\n\n if (!typedDigits) {\n const nextDigits = [...digits]\n nextDigits[index] = \"\"\n commitValue(nextDigits.join(\"\"))\n return\n }\n\n const nextDigits = [...digits]\n\n if (typedDigits.length === 1) {\n nextDigits[index] = typedDigits[0]\n const nextValue = commitValue(nextDigits.join(\"\"))\n if (index < length - 1 && nextValue.length > index) {\n focusCell(index + 1)\n }\n return\n }\n\n let writeIndex = index\n for (const digit of typedDigits) {\n if (writeIndex >= length) break\n nextDigits[writeIndex] = digit\n writeIndex += 1\n }\n\n const nextValue = commitValue(nextDigits.join(\"\"))\n const nextFocusIndex = Math.min(nextValue.length, length - 1)\n focusCell(nextFocusIndex)\n },\n [commitValue, digits, disabled, focusCell, length],\n )\n\n const handleKeyDown = useCallback(\n (index: number, evt: React.KeyboardEvent<HTMLInputElement>) => {\n if (disabled) return\n\n if (evt.key === \"Backspace\") {\n evt.preventDefault()\n const nextDigits = [...digits]\n\n if (nextDigits[index]) {\n nextDigits[index] = \"\"\n commitValue(nextDigits.join(\"\"))\n return\n }\n\n if (index > 0) {\n nextDigits[index - 1] = \"\"\n commitValue(nextDigits.join(\"\"))\n focusCell(index - 1)\n }\n return\n }\n\n if (evt.key === \"Delete\") {\n evt.preventDefault()\n const nextDigits = [...digits]\n nextDigits[index] = \"\"\n commitValue(nextDigits.join(\"\"))\n return\n }\n\n if (evt.key === \"ArrowLeft\") {\n evt.preventDefault()\n focusCell(index - 1)\n return\n }\n\n if (evt.key === \"ArrowRight\") {\n evt.preventDefault()\n focusCell(index + 1)\n }\n },\n [commitValue, digits, disabled, focusCell],\n )\n\n const handleBlur = useCallback(() => {\n requestAnimationFrame(() => {\n const activeElement = document.activeElement\n const isAnyCellFocused = inputRefs.current.some((input) => input === activeElement)\n if (!isAnyCellFocused) {\n setFocusedIndex(-1)\n }\n })\n }, [])\n\n return (\n <div ref={rootRef} className={clsx(s.Root, className)}>\n <div className={s.Cells}>\n {Array.from({ length }, (_, index) => {\n const isGroupGap = grouping ? shouldShowGap(index, grouping) : false\n\n return (\n <Fragment key={index}>\n {isGroupGap && <div className={s.GroupGap} aria-hidden />}\n <div\n className={clsx(s.Cell, {\n [s.CellFocused]: focusedIndex === index,\n [s.CellFilled]: !!digits[index],\n })}\n data-invalid={invalid ? \"\" : undefined}\n data-disabled={disabled ? \"\" : undefined}\n onClick={() => handleCellClick(index)}\n >\n <input\n ref={(element) => {\n inputRefs.current[index] = element\n }}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n maxLength={1}\n value={digits[index]}\n disabled={disabled}\n className={s.CellInput}\n onChange={(evt) => handleChange(index, evt)}\n onKeyDown={(evt) => handleKeyDown(index, evt)}\n onFocus={() => setFocusedIndex(index)}\n onBlur={handleBlur}\n onPaste={(evt) => handlePaste(index, evt)}\n aria-label={`Digit ${index + 1}`}\n aria-invalid={invalid ? true : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n autoComplete={index === 0 ? \"one-time-code\" : \"off\"}\n />\n {!digits[index] && focusedIndex !== index && <div className={s.DotPlaceholder} />}\n </div>\n </Fragment>\n )\n })}\n </div>\n {errorMessage && (\n <FieldError id={errorId} className={s.ErrorMessage}>\n {errorMessage}\n </FieldError>\n )}\n </div>\n )\n})\n\nOTPInput.displayName = \"OTPInput\"\n"]}
1
+ {"version":3,"file":"OTPInput.js","sourceRoot":"","sources":["../../../../src/components/OTPInput/OTPInput.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport {\n Fragment,\n forwardRef,\n useCallback,\n useEffect,\n useId,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from \"react\"\n\nimport { FieldError } from \"../FieldError\"\n\nimport s from \"@plexui/styles/components/OTPInput/OTPInput.module.css\"\n\nexport type OTPInputProps = {\n length?: number\n value?: string\n onChange?: (value: string) => void\n onComplete?: (value: string) => void\n grouping?: number[]\n invalid?: boolean\n errorMessage?: string\n disabled?: boolean\n autoFocus?: boolean\n className?: string\n}\n\nfunction sanitizeDigits(value: string, length: number): string {\n return value.replace(/\\D/g, \"\").slice(0, length)\n}\n\n// One entry per cell, \"\" when empty\nfunction toCells(value: string, length: number): string[] {\n return Array.from({ length }, (_, index) => value[index] ?? \"\")\n}\n\nfunction shouldShowGap(index: number, grouping: number[]): boolean {\n let pos = 0\n for (const groupSize of grouping) {\n pos += groupSize\n if (index === pos) return true\n }\n return false\n}\n\nexport const OTPInput = forwardRef<HTMLDivElement, OTPInputProps>(function OTPInput(props, ref) {\n const {\n length: lengthProp = 6,\n value,\n onChange,\n onComplete,\n grouping,\n invalid = false,\n errorMessage,\n disabled = false,\n autoFocus = false,\n className,\n } = props\n\n const length = Math.max(1, Math.floor(lengthProp))\n const controlledValue = useMemo(() => sanitizeDigits(value ?? \"\", length), [value, length])\n const isControlled = value !== undefined\n\n // The digit of every cell, so clearing or filling one cell never moves the\n // others; the value is the filled cells' digits in order\n const [cells, setCells] = useState(() => toCells(controlledValue, length))\n const [focusedIndex, setFocusedIndex] = useState(-1)\n\n const rootRef = useRef<HTMLDivElement | null>(null)\n const inputRefs = useRef<Array<HTMLInputElement | null>>([])\n\n useImperativeHandle(ref, () => rootRef.current as HTMLDivElement, [])\n\n const ownCells = useMemo(() => Array.from({ length }, (_, index) => cells[index] ?? \"\"), [cells, length])\n const currentValue = isControlled ? controlledValue : ownCells.join(\"\")\n // The cells keep their gaps while they spell the value; any other value\n // (set by the parent) fills the cells from the start\n const digits = useMemo(\n () => (ownCells.join(\"\") === currentValue ? ownCells : toCells(currentValue, length)),\n [ownCells, currentValue, length],\n )\n\n const errorId = `otp-input-${useId()}-error`\n\n useEffect(() => {\n if (!autoFocus || disabled) return\n inputRefs.current[0]?.focus()\n }, [autoFocus, disabled])\n\n // The value the field's own last edit produced, until the value changes:\n // a field the user empties keeps the caret where it is\n const ownValueRef = useRef<string | null>(null)\n\n const commitDigits = useCallback(\n (nextDigits: string[]) => {\n // Kept when controlled too: the parent's value then keeps these gaps\n setCells(nextDigits)\n const nextValue = nextDigits.join(\"\")\n ownValueRef.current = nextValue\n if (nextValue !== currentValue) {\n onChange?.(nextValue)\n }\n if (nextValue.length === length) {\n onComplete?.(nextValue)\n }\n },\n [currentValue, length, onChange, onComplete],\n )\n\n const focusCell = useCallback((index: number) => {\n const clampedIndex = Math.max(0, Math.min(index, length - 1))\n const input = inputRefs.current[clampedIndex]\n if (!input) return\n input.focus()\n input.setSelectionRange(1, 1)\n }, [length])\n\n // A field cleared from outside (a wrong code wiped by the form) puts the\n // caret back in the first cell, when the focus was in the field already\n const hadValueRef = useRef(currentValue.length > 0)\n useEffect(() => {\n const filled = currentValue.length > 0\n const fromOutside = ownValueRef.current !== currentValue\n ownValueRef.current = null\n const root = rootRef.current\n if (!filled && hadValueRef.current && fromOutside && !disabled && root?.contains(document.activeElement)) {\n focusCell(0)\n }\n hadValueRef.current = filled\n }, [currentValue, disabled, focusCell])\n\n const handleCellClick = useCallback((index: number) => {\n if (disabled) return\n focusCell(index)\n }, [disabled, focusCell])\n\n const handlePaste = useCallback(\n (index: number, evt: React.ClipboardEvent<HTMLInputElement>) => {\n if (disabled) return\n evt.preventDefault()\n const pastedDigits = sanitizeDigits(evt.clipboardData.getData(\"text\"), length)\n if (!pastedDigits) return\n\n const nextDigits = [...digits]\n let writeIndex = index\n\n for (const digit of pastedDigits) {\n if (writeIndex >= length) break\n nextDigits[writeIndex] = digit\n writeIndex += 1\n }\n\n commitDigits(nextDigits)\n // The cell after the pasted digits\n focusCell(Math.min(writeIndex, length - 1))\n },\n [commitDigits, digits, disabled, focusCell, length],\n )\n\n const handleChange = useCallback(\n (index: number, evt: React.ChangeEvent<HTMLInputElement>) => {\n if (disabled) return\n const typedDigits = evt.currentTarget.value.replace(/\\D/g, \"\")\n\n if (!typedDigits) {\n const nextDigits = [...digits]\n nextDigits[index] = \"\"\n commitDigits(nextDigits)\n return\n }\n\n const nextDigits = [...digits]\n\n if (typedDigits.length === 1) {\n nextDigits[index] = typedDigits[0]\n commitDigits(nextDigits)\n if (index < length - 1) {\n focusCell(index + 1)\n }\n return\n }\n\n let writeIndex = index\n for (const digit of typedDigits) {\n if (writeIndex >= length) break\n nextDigits[writeIndex] = digit\n writeIndex += 1\n }\n\n commitDigits(nextDigits)\n // The cell after the typed digits\n focusCell(Math.min(writeIndex, length - 1))\n },\n [commitDigits, digits, disabled, focusCell, length],\n )\n\n const handleKeyDown = useCallback(\n (index: number, evt: React.KeyboardEvent<HTMLInputElement>) => {\n if (disabled) return\n\n if (evt.key === \"Backspace\") {\n evt.preventDefault()\n const nextDigits = [...digits]\n\n if (nextDigits[index]) {\n nextDigits[index] = \"\"\n commitDigits(nextDigits)\n return\n }\n\n if (index > 0) {\n nextDigits[index - 1] = \"\"\n commitDigits(nextDigits)\n focusCell(index - 1)\n }\n return\n }\n\n if (evt.key === \"Delete\") {\n evt.preventDefault()\n const nextDigits = [...digits]\n nextDigits[index] = \"\"\n commitDigits(nextDigits)\n return\n }\n\n if (evt.key === \"ArrowLeft\") {\n evt.preventDefault()\n focusCell(index - 1)\n return\n }\n\n if (evt.key === \"ArrowRight\") {\n evt.preventDefault()\n focusCell(index + 1)\n }\n },\n [commitDigits, digits, disabled, focusCell],\n )\n\n const handleBlur = useCallback(() => {\n requestAnimationFrame(() => {\n const activeElement = document.activeElement\n const isAnyCellFocused = inputRefs.current.some((input) => input === activeElement)\n if (!isAnyCellFocused) {\n setFocusedIndex(-1)\n }\n })\n }, [])\n\n return (\n <div ref={rootRef} className={clsx(s.Root, className)}>\n <div className={s.Cells}>\n {Array.from({ length }, (_, index) => {\n const isGroupGap = grouping ? shouldShowGap(index, grouping) : false\n\n return (\n <Fragment key={index}>\n {isGroupGap && <div className={s.GroupGap} aria-hidden />}\n <div\n className={clsx(s.Cell, {\n [s.CellFocused]: focusedIndex === index,\n [s.CellFilled]: !!digits[index],\n })}\n data-invalid={invalid ? \"\" : undefined}\n data-disabled={disabled ? \"\" : undefined}\n onClick={() => handleCellClick(index)}\n >\n <input\n ref={(element) => {\n inputRefs.current[index] = element\n }}\n type=\"text\"\n inputMode=\"numeric\"\n pattern=\"[0-9]\"\n maxLength={1}\n value={digits[index]}\n disabled={disabled}\n className={s.CellInput}\n onChange={(evt) => handleChange(index, evt)}\n onKeyDown={(evt) => handleKeyDown(index, evt)}\n onFocus={() => setFocusedIndex(index)}\n onBlur={handleBlur}\n onPaste={(evt) => handlePaste(index, evt)}\n aria-label={`Digit ${index + 1}`}\n aria-invalid={invalid ? true : undefined}\n aria-describedby={errorMessage ? errorId : undefined}\n autoComplete={index === 0 ? \"one-time-code\" : \"off\"}\n />\n {!digits[index] && focusedIndex !== index && <div className={s.DotPlaceholder} />}\n </div>\n </Fragment>\n )\n })}\n </div>\n {errorMessage && (\n <FieldError id={errorId} className={s.ErrorMessage}>\n {errorMessage}\n </FieldError>\n )}\n </div>\n )\n})\n\nOTPInput.displayName = \"OTPInput\"\n"]}
@@ -1,2 +1,2 @@
1
- export { OTPInput } from "./OTPInput";
1
+ export { OTPInput } from "./OTPInput.js";
2
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,9 @@
1
1
  "use client";
2
2
  import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import {} from "react";
4
- import { PlexUIContext } from "./PlexUIContext";
4
+ import { PlexUIContext } from "./PlexUIContext.js";
5
+ // The link component's type comes from PlexUIConfig in global.d.ts, which is
6
+ // what ButtonLink, TextLink and Menu.Link read.
5
7
  /**
6
8
  * Shared context for all Plex UI components - wrap your app in this
7
9
  * provider to use Plex UI components.
@@ -1 +1 @@
1
- {"version":3,"file":"PlexUIProvider.js","sourceRoot":"","sources":["../../../../src/components/PlexUIProvider/PlexUIProvider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAoB/C;;;;;;GAMG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,QAAQ,EACR,aAAa,GAKd;IACC,OAAO,KAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,aAAa,EAAE,YAAG,QAAQ,GAA0B,CAAA;AAC9F,CAAC","sourcesContent":["\"use client\"\n\nimport { type ComponentType, type ForwardRefExoticComponent, type ReactNode } from \"react\"\nimport { PlexUIContext } from \"./PlexUIContext\"\n\n/// <reference path=\"../../global.d.ts\" />\n\ninterface DefaultConfig {\n LinkComponent: \"a\"\n}\n\ndeclare global {\n // eslint-disable-next-line @typescript-eslint/no-empty-object-type\n interface PlexUIConfig {}\n}\n\n// Utility type to merge defaults with overrides. The override keys take precedence.\ntype MergeOverrides<Defaults, Overrides> = Omit<Defaults, keyof Overrides> & Overrides\n\nexport type Config = MergeOverrides<DefaultConfig, PlexUIConfig>\n\nexport type LinkComponent = Config[\"LinkComponent\"]\n\n/**\n * Shared context for all Plex UI components - wrap your app in this\n * provider to use Plex UI components.\n *\n * It's pretty thin right now, we only use it to hold onto the component you\n * use for rendering Links, but it could be expanded in the future.\n */\nexport function PlexUIProvider({\n children,\n linkComponent,\n}: {\n children: ReactNode\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n linkComponent: ComponentType<any> | ForwardRefExoticComponent<any> | \"a\"\n}) {\n return <PlexUIContext.Provider value={{ linkComponent }}>{children}</PlexUIContext.Provider>\n}\n"]}
1
+ {"version":3,"file":"PlexUIProvider.js","sourceRoot":"","sources":["../../../../src/components/PlexUIProvider/PlexUIProvider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAsE,MAAM,OAAO,CAAA;AAC1F,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAE/C,6EAA6E;AAC7E,gDAAgD;AAEhD;;;;;;GAMG;AACH,MAAM,UAAU,cAAc,CAAC,EAC7B,QAAQ,EACR,aAAa,GAKd;IACC,OAAO,KAAC,aAAa,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,aAAa,EAAE,YAAG,QAAQ,GAA0B,CAAA;AAC9F,CAAC","sourcesContent":["\"use client\"\n\nimport { type ComponentType, type ForwardRefExoticComponent, type ReactNode } from \"react\"\nimport { PlexUIContext } from \"./PlexUIContext\"\n\n// The link component's type comes from PlexUIConfig in global.d.ts, which is\n// what ButtonLink, TextLink and Menu.Link read.\n\n/**\n * Shared context for all Plex UI components - wrap your app in this\n * provider to use Plex UI components.\n *\n * It's pretty thin right now, we only use it to hold onto the component you\n * use for rendering Links, but it could be expanded in the future.\n */\nexport function PlexUIProvider({\n children,\n linkComponent,\n}: {\n children: ReactNode\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n linkComponent: ComponentType<any> | ForwardRefExoticComponent<any> | \"a\"\n}) {\n return <PlexUIContext.Provider value={{ linkComponent }}>{children}</PlexUIContext.Provider>\n}\n"]}
@@ -1,2 +1,2 @@
1
- export { PlexUIProvider } from "./PlexUIProvider";
1
+ export { PlexUIProvider } from "./PlexUIProvider.js";
2
2
  //# sourceMappingURL=index.js.map
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { useContext } from "react";
3
- import { PlexUIContext } from "./PlexUIContext";
3
+ import { PlexUIContext } from "./PlexUIContext.js";
4
4
  export function useLinkComponent() {
5
5
  const context = useContext(PlexUIContext);
6
6
  return context?.linkComponent ?? "a";
@@ -4,13 +4,13 @@ import clsx from "clsx";
4
4
  import { Popover as RadixPopover } from "radix-ui";
5
5
  import { useCallback, useEffect, useMemo, useRef, useState, } from "react";
6
6
  import { useTimeout } from "usehooks-ts";
7
- import { useEscCloseStack } from "../../hooks/useEscCloseStack";
8
- import { useLatestValue } from "../../hooks/useLatestValue";
9
- import { focusableElements, preventDefaultHandler, toCssVariables } from "../../lib/helpers";
10
- import { TransitionGroup } from "../Transition";
11
- import { createPointerIntentArea, isPointInPolygon } from "./pointerIntent";
12
- import s from "./Popover.module.css";
13
- import { PopoverContext, usePopoverContext } from "./usePopoverContext";
7
+ import { useEscCloseStack } from "../../hooks/useEscCloseStack.js";
8
+ import { useLatestValue } from "../../hooks/useLatestValue.js";
9
+ import { focusableElements, preventDefaultHandler, toCssVariables } from "../../lib/helpers.js";
10
+ import { TransitionGroup } from "../Transition/index.js";
11
+ import { createPointerIntentArea, isPointInPolygon } from "./pointerIntent.js";
12
+ import s from "@plexui/styles/components/Popover/Popover.module.css";
13
+ import { PopoverContext, usePopoverContext } from "./usePopoverContext.js";
14
14
  export const Popover = ({ open: controlledOpen, onOpenChange: controlledOnOpenChange, showOnHover = false, hoverOpenDelay = 150, children, }) => {
15
15
  const [open, setOpen] = useState(false);
16
16
  const [shake, setShake] = useState(false);
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,UAAU,CAAA;AAClD,OAAO,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GAKT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAC5F,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAgB,MAAM,iBAAiB,CAAA;AACzF,OAAO,CAAC,MAAM,sBAAsB,CAAA;AACpC,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAA4B,MAAM,qBAAqB,CAAA;AAYjG,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,IAAI,EAAE,cAAc,EACpB,YAAY,EAAE,sBAAsB,EACpC,WAAW,GAAG,KAAK,EACnB,cAAc,GAAG,GAAG,EACpB,QAAQ,GACK,EAAE,EAAE;IACjB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IAChD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IAClD,MAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAClD,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC/C,MAAM,YAAY,GAAG,MAAM,CAAgC,SAAS,CAAC,CAAA;IACrE,MAAM,uBAAuB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IACtD,MAAM,qBAAqB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IACpD,MAAM,MAAM,GAAG,cAAc,IAAI,IAAI,CAAA;IAErC,MAAM,CAAC,8BAA8B,EAAE,iCAAiC,CAAC,GACvE,QAAQ,CAAU,KAAK,CAAC,CAAA;IAC1B,UAAU,CACR,GAAG,EAAE,CAAC,iCAAiC,CAAC,KAAK,CAAC,EAC9C,8BAA8B,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAC5C,CAAA;IAED,MAAM,gBAAgB,GAAG,cAAc,CAAC,sBAAsB,CAAC,CAAA;IAE/D,MAAM,oBAAoB,GAAG,cAAc,CAAC,CAAC,SAAkB,EAAE,EAAE;QACjE,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;QAElC,qCAAqC;QACrC,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;YACzB,OAAM;QACR,CAAC;QAED,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,6CAA6C;YAC7C,QAAQ,CAAC,KAAK,CAAC,CAAA;YAEf,4DAA4D;YAC5D,qDAAqD;YACrD,IAAI,WAAW,IAAI,uBAAuB,CAAC,OAAO,EAAE,CAAC;gBACnD,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;YAC7B,CAAC;YAED,4BAA4B;YAC5B,uBAAuB,CAAC,OAAO,GAAG,KAAK,CAAA;QACzC,CAAC;QAED,gBAAgB,CAAC,OAAO,EAAE,CAAC,SAAS,CAAC,CAAA;QACrC,OAAO,CAAC,SAAS,CAAC,CAAA;QAElB,IAAI,WAAW,EAAE,CAAC;YAChB,iCAAiC,CAAC,SAAS,CAAC,CAAA;QAC9C,CAAC;IACH,CAAC,CAAC,CAAA;IAEF,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,SAAkB,EAAE,EAAE;QACrB,oBAAoB,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;IACzC,CAAC,EACD,CAAC,oBAAoB,CAAC,CACvB,CAAA;IAED,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC1C,YAAY,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,cAAc,CAAC,CAAA;IACjF,CAAC,EAAE,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC,CAAA;IAEtC,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC1C,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;IACpC,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;QACpC,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,gBAAgB;QACzB,KAAK;QACL,QAAQ;QACR,WAAW;QACX,8BAA8B;QAC9B,cAAc,EAAE,kBAAkB;QAClC,cAAc,EAAE,kBAAkB;QAClC,qBAAqB;QACrB,UAAU;QACV,UAAU;QACV,uBAAuB;KACxB,CAAC,EACF;QACE,MAAM;QACN,gBAAgB;QAChB,KAAK;QACL,QAAQ;QACR,WAAW;QACX,8BAA8B;QAC9B,uBAAuB;QACvB,qBAAqB;QACrB,kBAAkB;QAClB,kBAAkB;KACnB,CACF,CAAA;IAED,OAAO,CACL,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,YAC1B,KAAC,YAAY,CAAC,IAAI,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,KAAK,EAAE,KAAK,YAC1E,QAAQ,GACS,GACL,CAClB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,aAAa,EACb,OAAO,GAKR,EAAE,EAAE;IACH,MAAM,EACJ,OAAO,EACP,WAAW,EACX,8BAA8B,EAC9B,cAAc,EACd,cAAc,EACd,qBAAqB,EACrB,UAAU,EACV,UAAU,GACX,GAAG,iBAAiB,EAAE,CAAA;IACvB,MAAM,uBAAuB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IAEtD,MAAM,sBAAsB,GAAG,CAAC,GAAqB,EAAE,EAAE;QACvD,uEAAuE;QACvE,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,iBAAiB,EAAE,KAAK,GAAG,CAAA;QAErE,IAAI,CAAC,MAAM,IAAI,8BAA8B,EAAE,CAAC;YAC9C,0CAA0C;YAC1C,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,eAAe,EAAE,CAAA;QACvB,CAAC;IACH,CAAC,CAAA;IAED,MAAM,iBAAiB,GAAG,CAAC,GAAuB,EAAE,EAAE;QACpD,IAAI,GAAG,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;YAChC,OAAM;QACR,CAAC;QAED,IAAI,CAAC,uBAAuB,CAAC,OAAO,IAAI,CAAC,qBAAqB,CAAC,OAAO,EAAE,CAAC;YACvE,cAAc,EAAE,CAAA;YAChB,uBAAuB,CAAC,OAAO,GAAG,IAAI,CAAA;QACxC,CAAC;IACH,CAAC,CAAA;IAED,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE,CAAC;YACrC,OAAM;QACR,CAAC;QAED,cAAc,EAAE,CAAA;QAChB,uBAAuB,CAAC,OAAO,GAAG,KAAK,CAAA;IACzC,CAAC,CAAA;IAED,OAAO,CACL,KAAC,YAAY,CAAC,OAAO,IACnB,OAAO,QACP,GAAG,EAAE,UAAU,EACf,aAAa,EAAE,CAAC,GAAG,EAAE,EAAE;YACrB,sBAAsB,CAAC,GAAG,CAAC,CAAA;YAC3B,aAAa,EAAE,CAAC,GAAG,CAAC,CAAA;QACtB,CAAC,EACD,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;YACf,sBAAsB,CAAC,GAAG,CAAC,CAAA;YAC3B,OAAO,EAAE,CAAC,GAAG,CAAC,CAAA;QAChB,CAAC,EACD,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,EAC1D,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,EAC5D,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,EACtD,MAAM,EACJ,WAAW;YACT,CAAC,CAAC,GAAG,EAAE;gBACH,UAAU,CAAC,GAAG,EAAE;oBACd,0DAA0D;oBAC1D,IAAI,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;wBACzD,OAAM;oBACR,CAAC;oBAED,OAAO,CAAC,KAAK,CAAC,CAAA;gBAChB,CAAC,EAAE,EAAE,CAAC,CAAA;YACR,CAAC;YACH,CAAC,CAAC,SAAS,YAGd,QAAQ,GACY,CACxB,CAAA;AACH,CAAC,CAAA;AA6DD,MAAM,WAAW,GAAG,CAAC,EACnB,QAAQ,EACR,eAAe,EACf,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,UAAU,GAAG,CAAC,EACd,KAAK,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,SAAS,GAAG,IAAI,GACI,EAAE,EAAE;IACxB,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE9D,MAAM,aAAa,GAAyC,CAAC,GAAG,EAAE,EAAE;QAClE,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAA;QAEzC;QACE,2CAA2C;QAC3C,cAAc;YACd,GAAG,CAAC,MAAM,KAAK,cAAc;YAC7B,8FAA8F;YAC9F,GAAG,CAAC,GAAG,KAAK,KAAK;YACjB,GAAG,CAAC,QAAQ,EACZ,CAAC;YACD,8BAA8B;YAC9B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,eAAe,EAAE,CAAA;YAErB,+EAA+E;YAC/E,MAAM,SAAS,GAAG,iBAAiB,CAAC,cAAc,CAAC,CAAA;YACnD,MAAM,aAAa,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YACrD,aAAa,EAAE,KAAK,EAAE,CAAA;QACxB,CAAC;IACH,CAAC,CAAA;IAED,wFAAwF;IACxF,+EAA+E;IAC/E,0GAA0G;IAC1G,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAA;QAEzC,IAAI,CAAC,cAAc,IAAI,CAAC,SAAS,EAAE,CAAC;YAClC,OAAM;QACR,CAAC;QAED,2DAA2D;QAC3D,gEAAgE;QAChE,IAAI,cAAc,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;YACrD,OAAM;QACR,CAAC;QAED,uDAAuD;QACvD,0DAA0D;QAC1D,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,cAAc,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/C,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC,CAAA;IAExC,OAAO,CACL,KAAC,YAAY,CAAC,OAAO,IACnB,UAAU,QACV,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EACrC,KAAK,EAAE,cAAc,CAAC;YACpB,eAAe,EAAE,KAAK;YACtB,mBAAmB,EAAE,QAAQ;YAC7B,mBAAmB,EAAE,QAAQ;SAC9B,CAAC,EACF,gBAAgB,EAAE,WAAW,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,kBAEnD,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,sBACvB,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAClD,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACzD,eAAe,EAAE,eAAe,IAAI,IAAI,EACxC,gBAAgB,QAChB,gBAAgB,EAAE,EAAE,EACpB,eAAe,EAAE,qBAAqB;QACtC,yEAAyE;QACzE,uCAAuC;QACvC,eAAe,EAAE,qBAAqB,EACtC,SAAS,EAAE,aAAa,YAEvB,QAAQ,GACY,CACxB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,EAAE;IACtD,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,GACvF,iBAAiB,EAAE,CAAA;IACrB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAA;IAE9E,MAAM,qBAAqB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7C,mBAAmB,CAAC,IAAI,CAAC,CAAA;QACzB,qBAAqB,CAAC,OAAO,GAAG,KAAK,CAAA;IACvC,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAmB,EAAE,WAAwB,EAAE,EAAE;QAChD,MAAM,SAAS,GAAG,uBAAuB,CAAC,KAAK,EAAE,WAAW,CAAC,CAAA;QAC7D,mBAAmB,CAAC,SAAS,CAAC,CAAA;QAC9B,qBAAqB,CAAC,OAAO,GAAG,IAAI,CAAA;IACtC,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAA;IACtC,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAClC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAElC,IAAI,CAAC,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;YACzB,OAAM;QACR,CAAC;QAED,MAAM,kBAAkB,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;QACzF,MAAM,kBAAkB,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;QAEzF,OAAO,CAAC,gBAAgB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QAC5D,OAAO,CAAC,gBAAgB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QAC5D,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;YAC/D,OAAO,CAAC,mBAAmB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QACjE,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,qBAAqB,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAE1E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACtB,OAAM;QACR,CAAC;QAED,MAAM,uBAAuB,GAAG,CAAC,KAAmB,EAAE,EAAE;YACtD,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;YAClC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;YAClC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAA;YAC1C,MAAM,eAAe,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAA;YAC9D,MAAM,gBAAgB,GAAG,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,IAAI,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;YAC/E,MAAM,yBAAyB,GAAG,CAAC,gBAAgB,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAA;YACtF,iFAAiF;YACjF,MAAM,cAAc,GAAG,MAAM,CAAC,YAAY,CAAC,eAAe,CAAC,CAAA;YAE3D,IAAI,gBAAgB,EAAE,CAAC;gBACrB,qBAAqB,EAAE,CAAA;YACzB,CAAC;iBAAM,IAAI,yBAAyB,IAAI,cAAc,EAAE,CAAC;gBACvD,qBAAqB,EAAE,CAAA;gBACvB,OAAO,CAAC,KAAK,CAAC,CAAA;YAChB,CAAC;QACH,CAAC,CAAA;QACD,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,uBAAuB,CAAC,CAAA;QACjE,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,uBAAuB,CAAC,CAAA;IACnF,CAAC,EAAE,CAAC,gBAAgB,EAAE,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAA;IAE9E,0DAA0D;IAC1D,qHAAqH;IACrH,gJAAgJ;IAEhJ,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,aAAa,GAAG,CAAC,GAAkB,EAAE,EAAE;YAC3C,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;gBACxB,OAAM;YACR,CAAC;YAED,+DAA+D;YAC/D,IAAI,GAAG,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;gBACvC,MAAM,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;gBAC9D,IAAI,cAAc,EAAE,CAAC;oBACnB,GAAG,CAAC,cAAc,EAAE,CAAA;oBACpB,cAAc,CAAC,KAAK,EAAE,CAAA;oBACtB,uBAAuB,CAAC,OAAO,GAAG,IAAI,CAAA;oBACtC,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;gBACxD,CAAC;YACH,CAAC;QACH,CAAC,CAAA;QACD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACnD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACxD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,uBAAuB,CAAC,CAAC,CAAA;IAEzC,OAAO,KAAC,WAAW,OAAK,KAAK,GAAI,CAAA;AACnC,CAAC,CAAA;AAED,MAAM,OAAO,GAAG,CAAC,KAA0B,EAAE,EAAE;IAC7C,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE1D,gBAAgB,CAAC,IAAI,EAAE,GAAG,EAAE;QAC1B,OAAO,CAAC,KAAK,CAAC,CAAA;IAChB,CAAC,CAAC,CAAA;IAEF,OAAO,CACL,KAAC,YAAY,CAAC,MAAM,IAAC,UAAU,kBAC7B,KAAC,eAAe,IACd,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,SAAS,EAAE,CAAC,CAAC,UAAU,EACvB,iBAAiB,kBAEhB,IAAI;gBACH,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,gBAAgB,OAAyB,KAAK,IAAzB,eAAe,CAAc,CACpD,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,OAAmB,KAAK,IAAnB,SAAS,CAAc,CACzC,CAAC,GACY,GACE,CACvB,CAAA;AACH,CAAC,CAAA;AAED,OAAO,CAAC,OAAO,GAAG,OAAO,CAAA;AACzB,OAAO,CAAC,OAAO,GAAG,OAAO,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { Popover as RadixPopover } from \"radix-ui\"\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type PointerEventHandler,\n type ReactNode,\n} from \"react\"\nimport { useTimeout } from \"usehooks-ts\"\nimport { useEscCloseStack } from \"../../hooks/useEscCloseStack\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { focusableElements, preventDefaultHandler, toCssVariables } from \"../../lib/helpers\"\nimport { TransitionGroup } from \"../Transition\"\nimport { createPointerIntentArea, isPointInPolygon, type Polygon } from \"./pointerIntent\"\nimport s from \"./Popover.module.css\"\nimport { PopoverContext, usePopoverContext, type PopoverContextValue } from \"./usePopoverContext\"\n\nexport type PopoverProps = {\n /** Sets controlled visibility state */\n open?: boolean\n /** Callback invoked when visibility state changes */\n onOpenChange?: (nextState: boolean) => void\n showOnHover?: boolean\n hoverOpenDelay?: number\n children: React.ReactNode\n}\n\nexport const Popover = ({\n open: controlledOpen,\n onOpenChange: controlledOnOpenChange,\n showOnHover = false,\n hoverOpenDelay = 150,\n children,\n}: PopoverProps) => {\n const [open, setOpen] = useState<boolean>(false)\n const [shake, setShake] = useState<boolean>(false)\n const triggerRef = useRef<HTMLButtonElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const openTimerRef = useRef<ReturnType<typeof setTimeout>>(undefined)\n const hoverOpenFocusedWithTab = useRef<boolean>(false)\n const isPointerInTransitRef = useRef<boolean>(false)\n const isOpen = controlledOpen ?? open\n\n const [temporarilyPreventClickToClose, setTemporarilyPreventClickToClose] =\n useState<boolean>(false)\n useTimeout(\n () => setTemporarilyPreventClickToClose(false),\n temporarilyPreventClickToClose ? 500 : null,\n )\n\n const latestOpenChange = useLatestValue(controlledOnOpenChange)\n\n const handleOpenChangeImpl = useLatestValue((nextState: boolean) => {\n clearTimeout(openTimerRef.current)\n\n // No-op if the state is not changing\n if (isOpen === nextState) {\n return\n }\n\n if (!nextState) {\n // clear any running shake animation on close\n setShake(false)\n\n // Check for specific hover conditions where focus should be\n // immediately restored to the trigger before closing\n if (showOnHover && hoverOpenFocusedWithTab.current) {\n triggerRef.current?.focus()\n }\n\n // Always cleanup this state\n hoverOpenFocusedWithTab.current = false\n }\n\n latestOpenChange.current?.(nextState)\n setOpen(nextState)\n\n if (showOnHover) {\n setTemporarilyPreventClickToClose(nextState)\n }\n })\n\n const handleOpenChange = useCallback(\n (nextState: boolean) => {\n handleOpenChangeImpl.current(nextState)\n },\n [handleOpenChangeImpl],\n )\n\n const handleTriggerEnter = useCallback(() => {\n openTimerRef.current = setTimeout(() => handleOpenChange(true), hoverOpenDelay)\n }, [handleOpenChange, hoverOpenDelay])\n\n const handleTriggerLeave = useCallback(() => {\n clearTimeout(openTimerRef.current)\n }, [])\n\n useEffect(() => {\n return () => {\n clearTimeout(openTimerRef.current)\n }\n }, [])\n\n const store = useMemo<PopoverContextValue>(\n () => ({\n open: isOpen,\n setOpen: handleOpenChange,\n shake,\n setShake,\n showOnHover,\n temporarilyPreventClickToClose,\n onTriggerEnter: handleTriggerEnter,\n onTriggerLeave: handleTriggerLeave,\n isPointerInTransitRef,\n triggerRef,\n contentRef,\n hoverOpenFocusedWithTab,\n }),\n [\n isOpen,\n handleOpenChange,\n shake,\n setShake,\n showOnHover,\n temporarilyPreventClickToClose,\n hoverOpenFocusedWithTab,\n isPointerInTransitRef,\n handleTriggerEnter,\n handleTriggerLeave,\n ],\n )\n\n return (\n <PopoverContext value={store}>\n <RadixPopover.Root open={isOpen} onOpenChange={handleOpenChange} modal={false}>\n {children}\n </RadixPopover.Root>\n </PopoverContext>\n )\n}\n\nconst Trigger = ({\n children,\n onPointerDown,\n onClick,\n}: {\n children: React.ReactNode\n onPointerDown?: PointerEventHandler\n onClick?: MouseEventHandler\n}) => {\n const {\n setOpen,\n showOnHover,\n temporarilyPreventClickToClose,\n onTriggerEnter,\n onTriggerLeave,\n isPointerInTransitRef,\n triggerRef,\n contentRef,\n } = usePopoverContext()\n const hasPointerMoveOpenedRef = useRef<boolean>(false)\n\n const maybePreventClickClose = (evt: React.MouseEvent) => {\n // Don't prevent temporary close if the trigger is an anchor tag itself\n const isLink = evt.currentTarget.nodeName.toLocaleLowerCase() === \"a\"\n\n if (!isLink && temporarilyPreventClickToClose) {\n // Prevents tooltip listeners from closing\n evt.preventDefault()\n evt.stopPropagation()\n }\n }\n\n const handlePointerMove = (evt: React.PointerEvent) => {\n if (evt.pointerType === \"touch\") {\n return\n }\n\n if (!hasPointerMoveOpenedRef.current && !isPointerInTransitRef.current) {\n onTriggerEnter()\n hasPointerMoveOpenedRef.current = true\n }\n }\n\n const handlePointerLeave = () => {\n if (!hasPointerMoveOpenedRef.current) {\n return\n }\n\n onTriggerLeave()\n hasPointerMoveOpenedRef.current = false\n }\n\n return (\n <RadixPopover.Trigger\n asChild\n ref={triggerRef}\n onPointerDown={(evt) => {\n maybePreventClickClose(evt)\n onPointerDown?.(evt)\n }}\n onClick={(evt) => {\n maybePreventClickClose(evt)\n onClick?.(evt)\n }}\n onPointerMove={showOnHover ? handlePointerMove : undefined}\n onPointerLeave={showOnHover ? handlePointerLeave : undefined}\n onFocus={showOnHover ? () => setOpen(true) : undefined}\n onBlur={\n showOnHover\n ? () => {\n setTimeout(() => {\n // Ignore this handler if focus has moved into the popover\n if (contentRef.current?.contains(document.activeElement)) {\n return\n }\n\n setOpen(false)\n }, 50)\n }\n : undefined\n }\n >\n {children}\n </RadixPopover.Trigger>\n )\n}\n\nexport type PopoverContentProps = {\n children: ReactNode\n /**\n * Whether to avoid collisions with vieport/scroll containersw.\n * @default true\n */\n avoidCollisions?: boolean\n /**\n * Set the `width` of the popover, in pixels.\n * @default auto\n */\n width?: number | \"auto\"\n /**\n * Set the `min-width` of the popover, in pixels.\n * @default 300\n */\n minWidth?: number | \"auto\"\n /**\n * Set the `max-width` of the popover, in pixels.\n */\n maxWidth?: number\n /**\n * Background style for the popover\n * @default default\n */\n /**\n * The preferred side of the trigger to render against when open. Will be reversed when collisions occur.\n * @default bottom\n */\n side?: RadixPopover.PopoverContentProps[\"side\"]\n /**\n * The distance in pixels from the trigger.\n * @default 8\n */\n sideOffset?: RadixPopover.PopoverContentProps[\"sideOffset\"]\n /**\n * The preferred alignment against the trigger. May change when collisions occur.\n * @default center\n */\n align?: RadixPopover.PopoverContentProps[\"align\"]\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment options.\n * @default 0\n */\n alignOffset?: RadixPopover.PopoverContentProps[\"alignOffset\"]\n /**\n * Whether the popover surface should be translucent.\n * @default false\n */\n translucent?: boolean\n /** Additional class name to apply to the popover content, you usually don't want to set this, but ag-grid needs it to render a custom editor properly */\n className?: string\n /**\n * Auto focus the popover content when it is opened.\n * @default true\n */\n autoFocus?: boolean\n}\n\nconst ContentImpl = ({\n children,\n avoidCollisions,\n width,\n minWidth,\n maxWidth,\n side,\n sideOffset = 8,\n align,\n alignOffset,\n translucent,\n className,\n autoFocus = true,\n}: PopoverContentProps) => {\n const { showOnHover, shake, contentRef } = usePopoverContext()\n\n const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (evt) => {\n const contentElement = contentRef.current\n\n if (\n // When the current target is our container\n contentElement &&\n evt.target === contentElement &&\n // We know that shift key tabs will lead to closing the popover (because we don't use `modal`)\n evt.key === \"Tab\" &&\n evt.shiftKey\n ) {\n // Prevent that from happening\n evt.preventDefault()\n evt.stopPropagation()\n\n // Move focus to the last focusable element, placing the user in the focus loop\n const focusable = focusableElements(contentElement)\n const lastFocusable = focusable[focusable.length - 1]\n lastFocusable?.focus()\n }\n }\n\n // Important that we send initial focus into the popover, placing it onto the container.\n // This allows focus looping to begin, as well as capturing scoped key presses.\n // We prevent Radix's default behavior of focusing an element, because this can have adverse side-effects.\n useEffect(() => {\n const contentElement = contentRef.current\n\n if (!contentElement || !autoFocus) {\n return\n }\n\n // If we're already focused within the content area, no-op.\n // This would be true if some inner component declares autoFocus\n if (contentElement?.contains(document.activeElement)) {\n return\n }\n\n // Our focus isn't in the content area - move it there.\n // NOTE: Don't automatically shift focus on hover popovers\n if (!showOnHover) {\n contentElement.focus({ preventScroll: true })\n }\n }, [contentRef, showOnHover, autoFocus])\n\n return (\n <RadixPopover.Content\n forceMount\n ref={contentRef}\n className={clsx(s.Popover, className)}\n style={toCssVariables({\n \"popover-width\": width,\n \"popover-min-width\": minWidth,\n \"popover-max-width\": maxWidth,\n })}\n onCloseAutoFocus={showOnHover ? preventDefaultHandler : undefined}\n // data-surface={surface}\n data-animate={shake ? \"shake\" : undefined}\n data-translucent={translucent ? \"true\" : undefined}\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset ?? (align === \"center\" ? 0 : -5)}\n avoidCollisions={avoidCollisions ?? true}\n hideWhenDetached\n collisionPadding={20}\n onOpenAutoFocus={preventDefaultHandler}\n // Use custom esc listener because default Radix is bound to the document\n // and cannot have propagation stopped.\n onEscapeKeyDown={preventDefaultHandler}\n onKeyDown={handleKeyDown}\n >\n {children}\n </RadixPopover.Content>\n )\n}\n\nconst ContentHoverable = (props: PopoverContentProps) => {\n const { setOpen, triggerRef, contentRef, isPointerInTransitRef, hoverOpenFocusedWithTab } =\n usePopoverContext()\n const [pointerGraceArea, setPointerGraceArea] = useState<Polygon | null>(null)\n\n const handleRemoveGraceArea = useCallback(() => {\n setPointerGraceArea(null)\n isPointerInTransitRef.current = false\n }, [isPointerInTransitRef])\n\n const handleCreateGraceArea = useCallback(\n (event: PointerEvent, hoverTarget: HTMLElement) => {\n const graceArea = createPointerIntentArea(event, hoverTarget)\n setPointerGraceArea(graceArea)\n isPointerInTransitRef.current = true\n },\n [isPointerInTransitRef],\n )\n\n useEffect(() => {\n return () => handleRemoveGraceArea()\n }, [handleRemoveGraceArea])\n\n useEffect(() => {\n const trigger = triggerRef.current\n const content = contentRef.current\n\n if (!trigger || !content) {\n return\n }\n\n const handleTriggerLeave = (event: PointerEvent) => handleCreateGraceArea(event, content)\n const handleContentLeave = (event: PointerEvent) => handleCreateGraceArea(event, trigger)\n\n trigger.addEventListener(\"pointerleave\", handleTriggerLeave)\n content.addEventListener(\"pointerleave\", handleContentLeave)\n return () => {\n trigger.removeEventListener(\"pointerleave\", handleTriggerLeave)\n content.removeEventListener(\"pointerleave\", handleContentLeave)\n }\n }, [contentRef, triggerRef, handleCreateGraceArea, handleRemoveGraceArea])\n\n useEffect(() => {\n if (!pointerGraceArea) {\n return\n }\n\n const handleTrackPointerGrace = (event: PointerEvent) => {\n const trigger = triggerRef.current\n const content = contentRef.current\n const target = event.target as HTMLElement\n const pointerPosition = { x: event.clientX, y: event.clientY }\n const hasEnteredTarget = trigger?.contains(target) || content?.contains(target)\n const isPointerOutsideGraceArea = !isPointInPolygon(pointerPosition, pointerGraceArea)\n // Stop considering grace areas when the pointer runs into other control triggers\n const targetHasPopup = target.hasAttribute(\"aria-haspopup\")\n\n if (hasEnteredTarget) {\n handleRemoveGraceArea()\n } else if (isPointerOutsideGraceArea || targetHasPopup) {\n handleRemoveGraceArea()\n setOpen(false)\n }\n }\n document.addEventListener(\"pointermove\", handleTrackPointerGrace)\n return () => document.removeEventListener(\"pointermove\", handleTrackPointerGrace)\n }, [pointerGraceArea, setOpen, handleRemoveGraceArea, triggerRef, contentRef])\n\n // Hoverable doesn't place focus in the popover by default\n // If this is open, and tab is pressed, and focusableElements() has an element, prevent default behavior and focus it\n // Then set a flag (probably in context) that tells us to restore focus to the trigger on close (e.g., not execute the onCloseAutoFocus handler)\n\n useEffect(() => {\n const handleKeyDown = (evt: KeyboardEvent) => {\n if (!contentRef.current) {\n return\n }\n\n // Only assume forward tab is attempting to move into the popup\n if (evt.key === \"Tab\" && !evt.shiftKey) {\n const [firstFocusable] = focusableElements(contentRef.current)\n if (firstFocusable) {\n evt.preventDefault()\n firstFocusable.focus()\n hoverOpenFocusedWithTab.current = true\n document.removeEventListener(\"keydown\", handleKeyDown)\n }\n }\n }\n document.addEventListener(\"keydown\", handleKeyDown)\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown)\n }\n }, [contentRef, hoverOpenFocusedWithTab])\n\n return <ContentImpl {...props} />\n}\n\nconst Content = (props: PopoverContentProps) => {\n const { open, showOnHover, setOpen } = usePopoverContext()\n\n useEscCloseStack(open, () => {\n setOpen(false)\n })\n\n return (\n <RadixPopover.Portal forceMount>\n <TransitionGroup\n enterDuration={600}\n exitDuration={300}\n className={s.Transition}\n disableAnimations\n >\n {open &&\n (showOnHover ? (\n <ContentHoverable key=\"popover-hover\" {...props} />\n ) : (\n <ContentImpl key=\"popover\" {...props} />\n ))}\n </TransitionGroup>\n </RadixPopover.Portal>\n )\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\n"]}
1
+ {"version":3,"file":"Popover.js","sourceRoot":"","sources":["../../../../src/components/Popover/Popover.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,UAAU,CAAA;AAClD,OAAO,EACL,WAAW,EACX,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,GAKT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAA;AACxC,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAA;AAC/D,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAC3D,OAAO,EAAE,iBAAiB,EAAE,qBAAqB,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAC5F,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AAC/C,OAAO,EAAE,uBAAuB,EAAE,gBAAgB,EAAgB,MAAM,iBAAiB,CAAA;AACzF,OAAO,CAAC,MAAM,sDAAsD,CAAA;AACpE,OAAO,EAAE,cAAc,EAAE,iBAAiB,EAA4B,MAAM,qBAAqB,CAAA;AAYjG,MAAM,CAAC,MAAM,OAAO,GAAG,CAAC,EACtB,IAAI,EAAE,cAAc,EACpB,YAAY,EAAE,sBAAsB,EACpC,WAAW,GAAG,KAAK,EACnB,cAAc,GAAG,GAAG,EACpB,QAAQ,GACK,EAAE,EAAE;IACjB,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IAChD,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAA;IAClD,MAAM,UAAU,GAAG,MAAM,CAAoB,IAAI,CAAC,CAAA;IAClD,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC/C,MAAM,YAAY,GAAG,MAAM,CAAgC,SAAS,CAAC,CAAA;IACrE,MAAM,uBAAuB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IACtD,MAAM,qBAAqB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IACpD,MAAM,MAAM,GAAG,cAAc,IAAI,IAAI,CAAA;IAErC,MAAM,CAAC,8BAA8B,EAAE,iCAAiC,CAAC,GACvE,QAAQ,CAAU,KAAK,CAAC,CAAA;IAC1B,UAAU,CACR,GAAG,EAAE,CAAC,iCAAiC,CAAC,KAAK,CAAC,EAC9C,8BAA8B,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,IAAI,CAC5C,CAAA;IAED,MAAM,gBAAgB,GAAG,cAAc,CAAC,sBAAsB,CAAC,CAAA;IAE/D,MAAM,oBAAoB,GAAG,cAAc,CAAC,CAAC,SAAkB,EAAE,EAAE;QACjE,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;QAElC,qCAAqC;QACrC,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;YACzB,OAAM;QACR,CAAC;QAED,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,6CAA6C;YAC7C,QAAQ,CAAC,KAAK,CAAC,CAAA;YAEf,4DAA4D;YAC5D,qDAAqD;YACrD,IAAI,WAAW,IAAI,uBAAuB,CAAC,OAAO,EAAE,CAAC;gBACnD,UAAU,CAAC,OAAO,EAAE,KAAK,EAAE,CAAA;YAC7B,CAAC;YAED,4BAA4B;YAC5B,uBAAuB,CAAC,OAAO,GAAG,KAAK,CAAA;QACzC,CAAC;QAED,gBAAgB,CAAC,OAAO,EAAE,CAAC,SAAS,CAAC,CAAA;QACrC,OAAO,CAAC,SAAS,CAAC,CAAA;QAElB,IAAI,WAAW,EAAE,CAAC;YAChB,iCAAiC,CAAC,SAAS,CAAC,CAAA;QAC9C,CAAC;IACH,CAAC,CAAC,CAAA;IAEF,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,SAAkB,EAAE,EAAE;QACrB,oBAAoB,CAAC,OAAO,CAAC,SAAS,CAAC,CAAA;IACzC,CAAC,EACD,CAAC,oBAAoB,CAAC,CACvB,CAAA;IAED,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC1C,YAAY,CAAC,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,cAAc,CAAC,CAAA;IACjF,CAAC,EAAE,CAAC,gBAAgB,EAAE,cAAc,CAAC,CAAC,CAAA;IAEtC,MAAM,kBAAkB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC1C,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;IACpC,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE;YACV,YAAY,CAAC,YAAY,CAAC,OAAO,CAAC,CAAA;QACpC,CAAC,CAAA;IACH,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,IAAI,EAAE,MAAM;QACZ,OAAO,EAAE,gBAAgB;QACzB,KAAK;QACL,QAAQ;QACR,WAAW;QACX,8BAA8B;QAC9B,cAAc,EAAE,kBAAkB;QAClC,cAAc,EAAE,kBAAkB;QAClC,qBAAqB;QACrB,UAAU;QACV,UAAU;QACV,uBAAuB;KACxB,CAAC,EACF;QACE,MAAM;QACN,gBAAgB;QAChB,KAAK;QACL,QAAQ;QACR,WAAW;QACX,8BAA8B;QAC9B,uBAAuB;QACvB,qBAAqB;QACrB,kBAAkB;QAClB,kBAAkB;KACnB,CACF,CAAA;IAED,OAAO,CACL,KAAC,cAAc,IAAC,KAAK,EAAE,KAAK,YAC1B,KAAC,YAAY,CAAC,IAAI,IAAC,IAAI,EAAE,MAAM,EAAE,YAAY,EAAE,gBAAgB,EAAE,KAAK,EAAE,KAAK,YAC1E,QAAQ,GACS,GACL,CAClB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,OAAO,GAAG,CAAC,EACf,QAAQ,EACR,aAAa,EACb,OAAO,GAKR,EAAE,EAAE;IACH,MAAM,EACJ,OAAO,EACP,WAAW,EACX,8BAA8B,EAC9B,cAAc,EACd,cAAc,EACd,qBAAqB,EACrB,UAAU,EACV,UAAU,GACX,GAAG,iBAAiB,EAAE,CAAA;IACvB,MAAM,uBAAuB,GAAG,MAAM,CAAU,KAAK,CAAC,CAAA;IAEtD,MAAM,sBAAsB,GAAG,CAAC,GAAqB,EAAE,EAAE;QACvD,uEAAuE;QACvE,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,iBAAiB,EAAE,KAAK,GAAG,CAAA;QAErE,IAAI,CAAC,MAAM,IAAI,8BAA8B,EAAE,CAAC;YAC9C,0CAA0C;YAC1C,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,eAAe,EAAE,CAAA;QACvB,CAAC;IACH,CAAC,CAAA;IAED,MAAM,iBAAiB,GAAG,CAAC,GAAuB,EAAE,EAAE;QACpD,IAAI,GAAG,CAAC,WAAW,KAAK,OAAO,EAAE,CAAC;YAChC,OAAM;QACR,CAAC;QAED,IAAI,CAAC,uBAAuB,CAAC,OAAO,IAAI,CAAC,qBAAqB,CAAC,OAAO,EAAE,CAAC;YACvE,cAAc,EAAE,CAAA;YAChB,uBAAuB,CAAC,OAAO,GAAG,IAAI,CAAA;QACxC,CAAC;IACH,CAAC,CAAA;IAED,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,CAAC,uBAAuB,CAAC,OAAO,EAAE,CAAC;YACrC,OAAM;QACR,CAAC;QAED,cAAc,EAAE,CAAA;QAChB,uBAAuB,CAAC,OAAO,GAAG,KAAK,CAAA;IACzC,CAAC,CAAA;IAED,OAAO,CACL,KAAC,YAAY,CAAC,OAAO,IACnB,OAAO,QACP,GAAG,EAAE,UAAU,EACf,aAAa,EAAE,CAAC,GAAG,EAAE,EAAE;YACrB,sBAAsB,CAAC,GAAG,CAAC,CAAA;YAC3B,aAAa,EAAE,CAAC,GAAG,CAAC,CAAA;QACtB,CAAC,EACD,OAAO,EAAE,CAAC,GAAG,EAAE,EAAE;YACf,sBAAsB,CAAC,GAAG,CAAC,CAAA;YAC3B,OAAO,EAAE,CAAC,GAAG,CAAC,CAAA;QAChB,CAAC,EACD,aAAa,EAAE,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,EAC1D,cAAc,EAAE,WAAW,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,SAAS,EAC5D,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,EACtD,MAAM,EACJ,WAAW;YACT,CAAC,CAAC,GAAG,EAAE;gBACH,UAAU,CAAC,GAAG,EAAE;oBACd,0DAA0D;oBAC1D,IAAI,UAAU,CAAC,OAAO,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;wBACzD,OAAM;oBACR,CAAC;oBAED,OAAO,CAAC,KAAK,CAAC,CAAA;gBAChB,CAAC,EAAE,EAAE,CAAC,CAAA;YACR,CAAC;YACH,CAAC,CAAC,SAAS,YAGd,QAAQ,GACY,CACxB,CAAA;AACH,CAAC,CAAA;AA6DD,MAAM,WAAW,GAAG,CAAC,EACnB,QAAQ,EACR,eAAe,EACf,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,UAAU,GAAG,CAAC,EACd,KAAK,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,SAAS,GAAG,IAAI,GACI,EAAE,EAAE;IACxB,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,UAAU,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE9D,MAAM,aAAa,GAAyC,CAAC,GAAG,EAAE,EAAE;QAClE,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAA;QAEzC;QACE,2CAA2C;QAC3C,cAAc;YACd,GAAG,CAAC,MAAM,KAAK,cAAc;YAC7B,8FAA8F;YAC9F,GAAG,CAAC,GAAG,KAAK,KAAK;YACjB,GAAG,CAAC,QAAQ,EACZ,CAAC;YACD,8BAA8B;YAC9B,GAAG,CAAC,cAAc,EAAE,CAAA;YACpB,GAAG,CAAC,eAAe,EAAE,CAAA;YAErB,+EAA+E;YAC/E,MAAM,SAAS,GAAG,iBAAiB,CAAC,cAAc,CAAC,CAAA;YACnD,MAAM,aAAa,GAAG,SAAS,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAA;YACrD,aAAa,EAAE,KAAK,EAAE,CAAA;QACxB,CAAC;IACH,CAAC,CAAA;IAED,wFAAwF;IACxF,+EAA+E;IAC/E,0GAA0G;IAC1G,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,cAAc,GAAG,UAAU,CAAC,OAAO,CAAA;QAEzC,IAAI,CAAC,cAAc,IAAI,CAAC,SAAS,EAAE,CAAC;YAClC,OAAM;QACR,CAAC;QAED,2DAA2D;QAC3D,gEAAgE;QAChE,IAAI,cAAc,EAAE,QAAQ,CAAC,QAAQ,CAAC,aAAa,CAAC,EAAE,CAAC;YACrD,OAAM;QACR,CAAC;QAED,uDAAuD;QACvD,0DAA0D;QAC1D,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,cAAc,CAAC,KAAK,CAAC,EAAE,aAAa,EAAE,IAAI,EAAE,CAAC,CAAA;QAC/C,CAAC;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,WAAW,EAAE,SAAS,CAAC,CAAC,CAAA;IAExC,OAAO,CACL,KAAC,YAAY,CAAC,OAAO,IACnB,UAAU,QACV,GAAG,EAAE,UAAU,EACf,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,EAAE,SAAS,CAAC,EACrC,KAAK,EAAE,cAAc,CAAC;YACpB,eAAe,EAAE,KAAK;YACtB,mBAAmB,EAAE,QAAQ;YAC7B,mBAAmB,EAAE,QAAQ;SAC9B,CAAC,EACF,gBAAgB,EAAE,WAAW,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,SAAS,kBAEnD,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,sBACvB,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,EAClD,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EACzD,eAAe,EAAE,eAAe,IAAI,IAAI,EACxC,gBAAgB,QAChB,gBAAgB,EAAE,EAAE,EACpB,eAAe,EAAE,qBAAqB;QACtC,yEAAyE;QACzE,uCAAuC;QACvC,eAAe,EAAE,qBAAqB,EACtC,SAAS,EAAE,aAAa,YAEvB,QAAQ,GACY,CACxB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,gBAAgB,GAAG,CAAC,KAA0B,EAAE,EAAE;IACtD,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,GACvF,iBAAiB,EAAE,CAAA;IACrB,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAiB,IAAI,CAAC,CAAA;IAE9E,MAAM,qBAAqB,GAAG,WAAW,CAAC,GAAG,EAAE;QAC7C,mBAAmB,CAAC,IAAI,CAAC,CAAA;QACzB,qBAAqB,CAAC,OAAO,GAAG,KAAK,CAAA;IACvC,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,MAAM,qBAAqB,GAAG,WAAW,CACvC,CAAC,KAAmB,EAAE,WAAwB,EAAE,EAAE;QAChD,MAAM,SAAS,GAAG,uBAAuB,CAAC,KAAK,EAAE,WAAW,CAAC,CAAA;QAC7D,mBAAmB,CAAC,SAAS,CAAC,CAAA;QAC9B,qBAAqB,CAAC,OAAO,GAAG,IAAI,CAAA;IACtC,CAAC,EACD,CAAC,qBAAqB,CAAC,CACxB,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,OAAO,GAAG,EAAE,CAAC,qBAAqB,EAAE,CAAA;IACtC,CAAC,EAAE,CAAC,qBAAqB,CAAC,CAAC,CAAA;IAE3B,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAClC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;QAElC,IAAI,CAAC,OAAO,IAAI,CAAC,OAAO,EAAE,CAAC;YACzB,OAAM;QACR,CAAC;QAED,MAAM,kBAAkB,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;QACzF,MAAM,kBAAkB,GAAG,CAAC,KAAmB,EAAE,EAAE,CAAC,qBAAqB,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA;QAEzF,OAAO,CAAC,gBAAgB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QAC5D,OAAO,CAAC,gBAAgB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QAC5D,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;YAC/D,OAAO,CAAC,mBAAmB,CAAC,cAAc,EAAE,kBAAkB,CAAC,CAAA;QACjE,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,qBAAqB,EAAE,qBAAqB,CAAC,CAAC,CAAA;IAE1E,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,gBAAgB,EAAE,CAAC;YACtB,OAAM;QACR,CAAC;QAED,MAAM,uBAAuB,GAAG,CAAC,KAAmB,EAAE,EAAE;YACtD,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;YAClC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAA;YAClC,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAA;YAC1C,MAAM,eAAe,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAC,EAAE,KAAK,CAAC,OAAO,EAAE,CAAA;YAC9D,MAAM,gBAAgB,GAAG,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,IAAI,OAAO,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAA;YAC/E,MAAM,yBAAyB,GAAG,CAAC,gBAAgB,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAA;YACtF,iFAAiF;YACjF,MAAM,cAAc,GAAG,MAAM,CAAC,YAAY,CAAC,eAAe,CAAC,CAAA;YAE3D,IAAI,gBAAgB,EAAE,CAAC;gBACrB,qBAAqB,EAAE,CAAA;YACzB,CAAC;iBAAM,IAAI,yBAAyB,IAAI,cAAc,EAAE,CAAC;gBACvD,qBAAqB,EAAE,CAAA;gBACvB,OAAO,CAAC,KAAK,CAAC,CAAA;YAChB,CAAC;QACH,CAAC,CAAA;QACD,QAAQ,CAAC,gBAAgB,CAAC,aAAa,EAAE,uBAAuB,CAAC,CAAA;QACjE,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,mBAAmB,CAAC,aAAa,EAAE,uBAAuB,CAAC,CAAA;IACnF,CAAC,EAAE,CAAC,gBAAgB,EAAE,OAAO,EAAE,qBAAqB,EAAE,UAAU,EAAE,UAAU,CAAC,CAAC,CAAA;IAE9E,0DAA0D;IAC1D,qHAAqH;IACrH,gJAAgJ;IAEhJ,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,aAAa,GAAG,CAAC,GAAkB,EAAE,EAAE;YAC3C,IAAI,CAAC,UAAU,CAAC,OAAO,EAAE,CAAC;gBACxB,OAAM;YACR,CAAC;YAED,+DAA+D;YAC/D,IAAI,GAAG,CAAC,GAAG,KAAK,KAAK,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC;gBACvC,MAAM,CAAC,cAAc,CAAC,GAAG,iBAAiB,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;gBAC9D,IAAI,cAAc,EAAE,CAAC;oBACnB,GAAG,CAAC,cAAc,EAAE,CAAA;oBACpB,cAAc,CAAC,KAAK,EAAE,CAAA;oBACtB,uBAAuB,CAAC,OAAO,GAAG,IAAI,CAAA;oBACtC,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;gBACxD,CAAC;YACH,CAAC;QACH,CAAC,CAAA;QACD,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACnD,OAAO,GAAG,EAAE;YACV,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,aAAa,CAAC,CAAA;QACxD,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,UAAU,EAAE,uBAAuB,CAAC,CAAC,CAAA;IAEzC,OAAO,KAAC,WAAW,OAAK,KAAK,GAAI,CAAA;AACnC,CAAC,CAAA;AAED,MAAM,OAAO,GAAG,CAAC,KAA0B,EAAE,EAAE;IAC7C,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,OAAO,EAAE,GAAG,iBAAiB,EAAE,CAAA;IAE1D,gBAAgB,CAAC,IAAI,EAAE,GAAG,EAAE;QAC1B,OAAO,CAAC,KAAK,CAAC,CAAA;IAChB,CAAC,CAAC,CAAA;IAEF,OAAO,CACL,KAAC,YAAY,CAAC,MAAM,IAAC,UAAU,kBAC7B,KAAC,eAAe,IACd,aAAa,EAAE,GAAG,EAClB,YAAY,EAAE,GAAG,EACjB,SAAS,EAAE,CAAC,CAAC,UAAU,EACvB,iBAAiB,kBAEhB,IAAI;gBACH,CAAC,WAAW,CAAC,CAAC,CAAC,CACb,KAAC,gBAAgB,OAAyB,KAAK,IAAzB,eAAe,CAAc,CACpD,CAAC,CAAC,CAAC,CACF,KAAC,WAAW,OAAmB,KAAK,IAAnB,SAAS,CAAc,CACzC,CAAC,GACY,GACE,CACvB,CAAA;AACH,CAAC,CAAA;AAED,OAAO,CAAC,OAAO,GAAG,OAAO,CAAA;AACzB,OAAO,CAAC,OAAO,GAAG,OAAO,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { Popover as RadixPopover } from \"radix-ui\"\nimport {\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n type KeyboardEventHandler,\n type MouseEventHandler,\n type PointerEventHandler,\n type ReactNode,\n} from \"react\"\nimport { useTimeout } from \"usehooks-ts\"\nimport { useEscCloseStack } from \"../../hooks/useEscCloseStack\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { focusableElements, preventDefaultHandler, toCssVariables } from \"../../lib/helpers\"\nimport { TransitionGroup } from \"../Transition\"\nimport { createPointerIntentArea, isPointInPolygon, type Polygon } from \"./pointerIntent\"\nimport s from \"@plexui/styles/components/Popover/Popover.module.css\"\nimport { PopoverContext, usePopoverContext, type PopoverContextValue } from \"./usePopoverContext\"\n\nexport type PopoverProps = {\n /** Sets controlled visibility state */\n open?: boolean\n /** Callback invoked when visibility state changes */\n onOpenChange?: (nextState: boolean) => void\n showOnHover?: boolean\n hoverOpenDelay?: number\n children: React.ReactNode\n}\n\nexport const Popover = ({\n open: controlledOpen,\n onOpenChange: controlledOnOpenChange,\n showOnHover = false,\n hoverOpenDelay = 150,\n children,\n}: PopoverProps) => {\n const [open, setOpen] = useState<boolean>(false)\n const [shake, setShake] = useState<boolean>(false)\n const triggerRef = useRef<HTMLButtonElement>(null)\n const contentRef = useRef<HTMLDivElement>(null)\n const openTimerRef = useRef<ReturnType<typeof setTimeout>>(undefined)\n const hoverOpenFocusedWithTab = useRef<boolean>(false)\n const isPointerInTransitRef = useRef<boolean>(false)\n const isOpen = controlledOpen ?? open\n\n const [temporarilyPreventClickToClose, setTemporarilyPreventClickToClose] =\n useState<boolean>(false)\n useTimeout(\n () => setTemporarilyPreventClickToClose(false),\n temporarilyPreventClickToClose ? 500 : null,\n )\n\n const latestOpenChange = useLatestValue(controlledOnOpenChange)\n\n const handleOpenChangeImpl = useLatestValue((nextState: boolean) => {\n clearTimeout(openTimerRef.current)\n\n // No-op if the state is not changing\n if (isOpen === nextState) {\n return\n }\n\n if (!nextState) {\n // clear any running shake animation on close\n setShake(false)\n\n // Check for specific hover conditions where focus should be\n // immediately restored to the trigger before closing\n if (showOnHover && hoverOpenFocusedWithTab.current) {\n triggerRef.current?.focus()\n }\n\n // Always cleanup this state\n hoverOpenFocusedWithTab.current = false\n }\n\n latestOpenChange.current?.(nextState)\n setOpen(nextState)\n\n if (showOnHover) {\n setTemporarilyPreventClickToClose(nextState)\n }\n })\n\n const handleOpenChange = useCallback(\n (nextState: boolean) => {\n handleOpenChangeImpl.current(nextState)\n },\n [handleOpenChangeImpl],\n )\n\n const handleTriggerEnter = useCallback(() => {\n openTimerRef.current = setTimeout(() => handleOpenChange(true), hoverOpenDelay)\n }, [handleOpenChange, hoverOpenDelay])\n\n const handleTriggerLeave = useCallback(() => {\n clearTimeout(openTimerRef.current)\n }, [])\n\n useEffect(() => {\n return () => {\n clearTimeout(openTimerRef.current)\n }\n }, [])\n\n const store = useMemo<PopoverContextValue>(\n () => ({\n open: isOpen,\n setOpen: handleOpenChange,\n shake,\n setShake,\n showOnHover,\n temporarilyPreventClickToClose,\n onTriggerEnter: handleTriggerEnter,\n onTriggerLeave: handleTriggerLeave,\n isPointerInTransitRef,\n triggerRef,\n contentRef,\n hoverOpenFocusedWithTab,\n }),\n [\n isOpen,\n handleOpenChange,\n shake,\n setShake,\n showOnHover,\n temporarilyPreventClickToClose,\n hoverOpenFocusedWithTab,\n isPointerInTransitRef,\n handleTriggerEnter,\n handleTriggerLeave,\n ],\n )\n\n return (\n <PopoverContext value={store}>\n <RadixPopover.Root open={isOpen} onOpenChange={handleOpenChange} modal={false}>\n {children}\n </RadixPopover.Root>\n </PopoverContext>\n )\n}\n\nconst Trigger = ({\n children,\n onPointerDown,\n onClick,\n}: {\n children: React.ReactNode\n onPointerDown?: PointerEventHandler\n onClick?: MouseEventHandler\n}) => {\n const {\n setOpen,\n showOnHover,\n temporarilyPreventClickToClose,\n onTriggerEnter,\n onTriggerLeave,\n isPointerInTransitRef,\n triggerRef,\n contentRef,\n } = usePopoverContext()\n const hasPointerMoveOpenedRef = useRef<boolean>(false)\n\n const maybePreventClickClose = (evt: React.MouseEvent) => {\n // Don't prevent temporary close if the trigger is an anchor tag itself\n const isLink = evt.currentTarget.nodeName.toLocaleLowerCase() === \"a\"\n\n if (!isLink && temporarilyPreventClickToClose) {\n // Prevents tooltip listeners from closing\n evt.preventDefault()\n evt.stopPropagation()\n }\n }\n\n const handlePointerMove = (evt: React.PointerEvent) => {\n if (evt.pointerType === \"touch\") {\n return\n }\n\n if (!hasPointerMoveOpenedRef.current && !isPointerInTransitRef.current) {\n onTriggerEnter()\n hasPointerMoveOpenedRef.current = true\n }\n }\n\n const handlePointerLeave = () => {\n if (!hasPointerMoveOpenedRef.current) {\n return\n }\n\n onTriggerLeave()\n hasPointerMoveOpenedRef.current = false\n }\n\n return (\n <RadixPopover.Trigger\n asChild\n ref={triggerRef}\n onPointerDown={(evt) => {\n maybePreventClickClose(evt)\n onPointerDown?.(evt)\n }}\n onClick={(evt) => {\n maybePreventClickClose(evt)\n onClick?.(evt)\n }}\n onPointerMove={showOnHover ? handlePointerMove : undefined}\n onPointerLeave={showOnHover ? handlePointerLeave : undefined}\n onFocus={showOnHover ? () => setOpen(true) : undefined}\n onBlur={\n showOnHover\n ? () => {\n setTimeout(() => {\n // Ignore this handler if focus has moved into the popover\n if (contentRef.current?.contains(document.activeElement)) {\n return\n }\n\n setOpen(false)\n }, 50)\n }\n : undefined\n }\n >\n {children}\n </RadixPopover.Trigger>\n )\n}\n\nexport type PopoverContentProps = {\n children: ReactNode\n /**\n * Whether to avoid collisions with vieport/scroll containersw.\n * @default true\n */\n avoidCollisions?: boolean\n /**\n * Set the `width` of the popover, in pixels.\n * @default auto\n */\n width?: number | \"auto\"\n /**\n * Set the `min-width` of the popover, in pixels.\n * @default 300\n */\n minWidth?: number | \"auto\"\n /**\n * Set the `max-width` of the popover, in pixels.\n */\n maxWidth?: number\n /**\n * Background style for the popover\n * @default default\n */\n /**\n * The preferred side of the trigger to render against when open. Will be reversed when collisions occur.\n * @default bottom\n */\n side?: RadixPopover.PopoverContentProps[\"side\"]\n /**\n * The distance in pixels from the trigger.\n * @default 8\n */\n sideOffset?: RadixPopover.PopoverContentProps[\"sideOffset\"]\n /**\n * The preferred alignment against the trigger. May change when collisions occur.\n * @default center\n */\n align?: RadixPopover.PopoverContentProps[\"align\"]\n /**\n * An offset in pixels from the \"start\" or \"end\" alignment options.\n * @default 0\n */\n alignOffset?: RadixPopover.PopoverContentProps[\"alignOffset\"]\n /**\n * Whether the popover surface should be translucent.\n * @default false\n */\n translucent?: boolean\n /** Additional class name to apply to the popover content, you usually don't want to set this, but ag-grid needs it to render a custom editor properly */\n className?: string\n /**\n * Auto focus the popover content when it is opened.\n * @default true\n */\n autoFocus?: boolean\n}\n\nconst ContentImpl = ({\n children,\n avoidCollisions,\n width,\n minWidth,\n maxWidth,\n side,\n sideOffset = 8,\n align,\n alignOffset,\n translucent,\n className,\n autoFocus = true,\n}: PopoverContentProps) => {\n const { showOnHover, shake, contentRef } = usePopoverContext()\n\n const handleKeyDown: KeyboardEventHandler<HTMLDivElement> = (evt) => {\n const contentElement = contentRef.current\n\n if (\n // When the current target is our container\n contentElement &&\n evt.target === contentElement &&\n // We know that shift key tabs will lead to closing the popover (because we don't use `modal`)\n evt.key === \"Tab\" &&\n evt.shiftKey\n ) {\n // Prevent that from happening\n evt.preventDefault()\n evt.stopPropagation()\n\n // Move focus to the last focusable element, placing the user in the focus loop\n const focusable = focusableElements(contentElement)\n const lastFocusable = focusable[focusable.length - 1]\n lastFocusable?.focus()\n }\n }\n\n // Important that we send initial focus into the popover, placing it onto the container.\n // This allows focus looping to begin, as well as capturing scoped key presses.\n // We prevent Radix's default behavior of focusing an element, because this can have adverse side-effects.\n useEffect(() => {\n const contentElement = contentRef.current\n\n if (!contentElement || !autoFocus) {\n return\n }\n\n // If we're already focused within the content area, no-op.\n // This would be true if some inner component declares autoFocus\n if (contentElement?.contains(document.activeElement)) {\n return\n }\n\n // Our focus isn't in the content area - move it there.\n // NOTE: Don't automatically shift focus on hover popovers\n if (!showOnHover) {\n contentElement.focus({ preventScroll: true })\n }\n }, [contentRef, showOnHover, autoFocus])\n\n return (\n <RadixPopover.Content\n forceMount\n ref={contentRef}\n className={clsx(s.Popover, className)}\n style={toCssVariables({\n \"popover-width\": width,\n \"popover-min-width\": minWidth,\n \"popover-max-width\": maxWidth,\n })}\n onCloseAutoFocus={showOnHover ? preventDefaultHandler : undefined}\n // data-surface={surface}\n data-animate={shake ? \"shake\" : undefined}\n data-translucent={translucent ? \"true\" : undefined}\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset ?? (align === \"center\" ? 0 : -5)}\n avoidCollisions={avoidCollisions ?? true}\n hideWhenDetached\n collisionPadding={20}\n onOpenAutoFocus={preventDefaultHandler}\n // Use custom esc listener because default Radix is bound to the document\n // and cannot have propagation stopped.\n onEscapeKeyDown={preventDefaultHandler}\n onKeyDown={handleKeyDown}\n >\n {children}\n </RadixPopover.Content>\n )\n}\n\nconst ContentHoverable = (props: PopoverContentProps) => {\n const { setOpen, triggerRef, contentRef, isPointerInTransitRef, hoverOpenFocusedWithTab } =\n usePopoverContext()\n const [pointerGraceArea, setPointerGraceArea] = useState<Polygon | null>(null)\n\n const handleRemoveGraceArea = useCallback(() => {\n setPointerGraceArea(null)\n isPointerInTransitRef.current = false\n }, [isPointerInTransitRef])\n\n const handleCreateGraceArea = useCallback(\n (event: PointerEvent, hoverTarget: HTMLElement) => {\n const graceArea = createPointerIntentArea(event, hoverTarget)\n setPointerGraceArea(graceArea)\n isPointerInTransitRef.current = true\n },\n [isPointerInTransitRef],\n )\n\n useEffect(() => {\n return () => handleRemoveGraceArea()\n }, [handleRemoveGraceArea])\n\n useEffect(() => {\n const trigger = triggerRef.current\n const content = contentRef.current\n\n if (!trigger || !content) {\n return\n }\n\n const handleTriggerLeave = (event: PointerEvent) => handleCreateGraceArea(event, content)\n const handleContentLeave = (event: PointerEvent) => handleCreateGraceArea(event, trigger)\n\n trigger.addEventListener(\"pointerleave\", handleTriggerLeave)\n content.addEventListener(\"pointerleave\", handleContentLeave)\n return () => {\n trigger.removeEventListener(\"pointerleave\", handleTriggerLeave)\n content.removeEventListener(\"pointerleave\", handleContentLeave)\n }\n }, [contentRef, triggerRef, handleCreateGraceArea, handleRemoveGraceArea])\n\n useEffect(() => {\n if (!pointerGraceArea) {\n return\n }\n\n const handleTrackPointerGrace = (event: PointerEvent) => {\n const trigger = triggerRef.current\n const content = contentRef.current\n const target = event.target as HTMLElement\n const pointerPosition = { x: event.clientX, y: event.clientY }\n const hasEnteredTarget = trigger?.contains(target) || content?.contains(target)\n const isPointerOutsideGraceArea = !isPointInPolygon(pointerPosition, pointerGraceArea)\n // Stop considering grace areas when the pointer runs into other control triggers\n const targetHasPopup = target.hasAttribute(\"aria-haspopup\")\n\n if (hasEnteredTarget) {\n handleRemoveGraceArea()\n } else if (isPointerOutsideGraceArea || targetHasPopup) {\n handleRemoveGraceArea()\n setOpen(false)\n }\n }\n document.addEventListener(\"pointermove\", handleTrackPointerGrace)\n return () => document.removeEventListener(\"pointermove\", handleTrackPointerGrace)\n }, [pointerGraceArea, setOpen, handleRemoveGraceArea, triggerRef, contentRef])\n\n // Hoverable doesn't place focus in the popover by default\n // If this is open, and tab is pressed, and focusableElements() has an element, prevent default behavior and focus it\n // Then set a flag (probably in context) that tells us to restore focus to the trigger on close (e.g., not execute the onCloseAutoFocus handler)\n\n useEffect(() => {\n const handleKeyDown = (evt: KeyboardEvent) => {\n if (!contentRef.current) {\n return\n }\n\n // Only assume forward tab is attempting to move into the popup\n if (evt.key === \"Tab\" && !evt.shiftKey) {\n const [firstFocusable] = focusableElements(contentRef.current)\n if (firstFocusable) {\n evt.preventDefault()\n firstFocusable.focus()\n hoverOpenFocusedWithTab.current = true\n document.removeEventListener(\"keydown\", handleKeyDown)\n }\n }\n }\n document.addEventListener(\"keydown\", handleKeyDown)\n return () => {\n document.removeEventListener(\"keydown\", handleKeyDown)\n }\n }, [contentRef, hoverOpenFocusedWithTab])\n\n return <ContentImpl {...props} />\n}\n\nconst Content = (props: PopoverContentProps) => {\n const { open, showOnHover, setOpen } = usePopoverContext()\n\n useEscCloseStack(open, () => {\n setOpen(false)\n })\n\n return (\n <RadixPopover.Portal forceMount>\n <TransitionGroup\n enterDuration={600}\n exitDuration={300}\n className={s.Transition}\n disableAnimations\n >\n {open &&\n (showOnHover ? (\n <ContentHoverable key=\"popover-hover\" {...props} />\n ) : (\n <ContentImpl key=\"popover\" {...props} />\n ))}\n </TransitionGroup>\n </RadixPopover.Portal>\n )\n}\n\nPopover.Trigger = Trigger\nPopover.Content = Content\n"]}
@@ -1,4 +1,3 @@
1
- export { Popover } from "./Popover";
2
- // eslint-disable-next-line react-refresh/only-export-components
3
- export { usePopoverController } from "./usePopoverController";
1
+ export { Popover } from "./Popover.js";
2
+ export { usePopoverController } from "./usePopoverController.js";
4
3
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAA+C,MAAM,WAAW,CAAA;AAChF,gEAAgE;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA","sourcesContent":["export { Popover, type PopoverContentProps, type PopoverProps } from \"./Popover\"\n// eslint-disable-next-line react-refresh/only-export-components\nexport { usePopoverController } from \"./usePopoverController\"\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Popover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAA+C,MAAM,WAAW,CAAA;AAChF,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAA","sourcesContent":["export { Popover, type PopoverContentProps, type PopoverProps } from \"./Popover\"\nexport { usePopoverController } from \"./usePopoverController\"\n"]}
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { useCallback } from "react";
3
3
  import { flushSync } from "react-dom";
4
- import { waitForAnimationFrame } from "../../lib/helpers";
5
- import { usePopoverContext } from "./usePopoverContext";
4
+ import { waitForAnimationFrame } from "../../lib/helpers.js";
5
+ import { usePopoverContext } from "./usePopoverContext.js";
6
6
  export const usePopoverClose = () => {
7
7
  const { setOpen } = usePopoverContext();
8
8
  return useCallback(() => setOpen(false), [setOpen]);
@@ -3,7 +3,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
3
3
  import clsx from "clsx";
4
4
  import {} from "react";
5
5
  import { Progress as RadixProgress } from "radix-ui";
6
- import s from "./Progress.module.css";
6
+ import s from "@plexui/styles/components/Progress/Progress.module.css";
7
7
  export const Progress = ({ value = null, max = 100, className, ...restProps }) => {
8
8
  const resolved = value == null ? null : Math.max(0, Math.min(max, value));
9
9
  const percentage = resolved == null ? null : (resolved / max) * 100;
@@ -1 +1 @@
1
- {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAuB,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,QAAQ,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,CAAC,MAAM,uBAAuB,CAAA;AAmBrC,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,KAAK,GAAG,IAAI,EACZ,GAAG,GAAG,GAAG,EACT,SAAS,EACT,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,MAAM,QAAQ,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,QAAQ,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,GAAG,CAAC,GAAG,GAAG,CAAA;IAEnE,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,IACjB,KAAK,EAAE,QAAQ,EACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,KAC9B,SAAS,YAEb,KAAC,aAAa,CAAC,SAAS,IACtB,SAAS,EAAE,CAAC,CAAC,SAAS,EACtB,KAAK,EAAE;gBACL,SAAS,EACP,UAAU,IAAI,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,eAAe,GAAG,GAAG,UAAU,IAAI;aACvE,wBACmB,UAAU,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,GACvD,GACiB,CACtB,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ComponentProps } from \"react\"\nimport { Progress as RadixProgress } from \"radix-ui\"\nimport s from \"./Progress.module.css\"\n\nexport type ProgressProps = Omit<\n ComponentProps<typeof RadixProgress.Root>,\n \"children\"\n> & {\n /**\n * Current progress value, between `0` and `max`.\n * Omit (or pass `null`) for an indeterminate state.\n */\n value?: number | null\n /**\n * Maximum value.\n * @default 100\n */\n max?: number\n className?: string\n}\n\nexport const Progress = ({\n value = null,\n max = 100,\n className,\n ...restProps\n}: ProgressProps) => {\n const resolved = value == null ? null : Math.max(0, Math.min(max, value))\n const percentage = resolved == null ? null : (resolved / max) * 100\n\n return (\n <RadixProgress.Root\n value={resolved}\n max={max}\n className={clsx(s.Root, className)}\n {...restProps}\n >\n <RadixProgress.Indicator\n className={s.Indicator}\n style={{\n transform:\n percentage == null ? undefined : `translateX(-${100 - percentage}%)`,\n }}\n data-indeterminate={percentage == null ? \"\" : undefined}\n />\n </RadixProgress.Root>\n )\n}\n"]}
1
+ {"version":3,"file":"Progress.js","sourceRoot":"","sources":["../../../../src/components/Progress/Progress.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AACvB,OAAO,EAAuB,MAAM,OAAO,CAAA;AAC3C,OAAO,EAAE,QAAQ,IAAI,aAAa,EAAE,MAAM,UAAU,CAAA;AACpD,OAAO,CAAC,MAAM,wDAAwD,CAAA;AAmBtE,MAAM,CAAC,MAAM,QAAQ,GAAG,CAAC,EACvB,KAAK,GAAG,IAAI,EACZ,GAAG,GAAG,GAAG,EACT,SAAS,EACT,GAAG,SAAS,EACE,EAAE,EAAE;IAClB,MAAM,QAAQ,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAA;IACzE,MAAM,UAAU,GAAG,QAAQ,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,GAAG,CAAC,GAAG,GAAG,CAAA;IAEnE,OAAO,CACL,KAAC,aAAa,CAAC,IAAI,IACjB,KAAK,EAAE,QAAQ,EACf,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,KAC9B,SAAS,YAEb,KAAC,aAAa,CAAC,SAAS,IACtB,SAAS,EAAE,CAAC,CAAC,SAAS,EACtB,KAAK,EAAE;gBACL,SAAS,EACP,UAAU,IAAI,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,eAAe,GAAG,GAAG,UAAU,IAAI;aACvE,wBACmB,UAAU,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,GACvD,GACiB,CACtB,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport { type ComponentProps } from \"react\"\nimport { Progress as RadixProgress } from \"radix-ui\"\nimport s from \"@plexui/styles/components/Progress/Progress.module.css\"\n\nexport type ProgressProps = Omit<\n ComponentProps<typeof RadixProgress.Root>,\n \"children\"\n> & {\n /**\n * Current progress value, between `0` and `max`.\n * Omit (or pass `null`) for an indeterminate state.\n */\n value?: number | null\n /**\n * Maximum value.\n * @default 100\n */\n max?: number\n className?: string\n}\n\nexport const Progress = ({\n value = null,\n max = 100,\n className,\n ...restProps\n}: ProgressProps) => {\n const resolved = value == null ? null : Math.max(0, Math.min(max, value))\n const percentage = resolved == null ? null : (resolved / max) * 100\n\n return (\n <RadixProgress.Root\n value={resolved}\n max={max}\n className={clsx(s.Root, className)}\n {...restProps}\n >\n <RadixProgress.Indicator\n className={s.Indicator}\n style={{\n transform:\n percentage == null ? undefined : `translateX(-${100 - percentage}%)`,\n }}\n data-indeterminate={percentage == null ? \"\" : undefined}\n />\n </RadixProgress.Root>\n )\n}\n"]}
@@ -1,2 +1,2 @@
1
- export { Progress } from "./Progress";
1
+ export { Progress } from "./Progress.js";
2
2
  //# sourceMappingURL=index.js.map
@@ -2,9 +2,9 @@
2
2
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
3
  import clsx from "clsx";
4
4
  import React, { createContext, use, useMemo, useRef } from "react";
5
- import { isDev } from "../../lib/environment";
6
- import { CheckMd } from "../Icon";
7
- import s from "./ProgressSteps.module.css";
5
+ import { isDev } from "../../lib/environment.js";
6
+ import { CheckMd } from "../Icon/index.js";
7
+ import s from "@plexui/styles/components/ProgressSteps/ProgressSteps.module.css";
8
8
  const ProgressStepsContext = createContext(null);
9
9
  const useProgressStepsContext = () => {
10
10
  const context = use(ProgressStepsContext);
@@ -24,7 +24,9 @@ export const ProgressSteps = ({ current, total, variant = "default", color = "de
24
24
  const store = useMemo(() => ({ current, orientation, size, connectorStyle, variant, color, totalSteps }), [current, orientation, size, connectorStyle, variant, color, totalSteps]);
25
25
  // Minimal variant: render horizontal bar segments
26
26
  if (variant === "minimal") {
27
- return (_jsx("nav", { "aria-label": "Progress", role: "progressbar", "aria-valuenow": current, "aria-valuemin": 1, "aria-valuemax": totalSteps, className: clsx(s.ProgressSteps, s.Minimal, className), "data-size": size, "data-color": color, "data-variant": "minimal", children: _jsx("div", { className: s.MinimalList, children: Array.from({ length: totalSteps }, (_, i) => (_jsx("div", { className: s.MinimalSegment, "data-state": i < current ? "completed" : "upcoming" }, i))) }) }));
27
+ return (
28
+ // A div, not nav: role="progressbar" is not allowed on <nav>
29
+ _jsx("div", { "aria-label": "Progress", role: "progressbar", "aria-valuenow": current, "aria-valuemin": 1, "aria-valuemax": totalSteps, className: clsx(s.ProgressSteps, s.Minimal, className), "data-size": size, "data-color": color, "data-variant": "minimal", children: _jsx("div", { className: s.MinimalList, children: Array.from({ length: totalSteps }, (_, i) => (_jsx("div", { className: s.MinimalSegment, "data-state": i < current ? "completed" : "upcoming" }, i))) }) }));
28
30
  }
29
31
  return (_jsx(ProgressStepsContext, { value: store, children: _jsx("nav", { "aria-label": "Progress", className: clsx(s.ProgressSteps, className), "data-size": size, "data-color": color, "data-variant": variant, children: _jsx("ol", { className: s.List, "data-orientation": orientation, "data-connector": connectorStyle, "data-variant": variant, children: React.Children.map(children, (child, index) => React.isValidElement(child)
30
32
  ? React.cloneElement(child, { _index: index })
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressSteps.js","sourceRoot":"","sources":["../../../../src/components/ProgressSteps/ProgressSteps.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport React, { createContext, use, useMemo, useRef, type ReactNode } from \"react\"\nimport { isDev } from \"../../lib/environment\"\nimport type { Sizes } from \"../../types\"\nimport { CheckMd } from \"../Icon\"\nimport s from \"./ProgressSteps.module.css\"\n\ntype Orientation = \"horizontal\" | \"vertical\"\ntype StepState = \"completed\" | \"active\" | \"inactive\"\ntype ConnectorStyle = \"solid\" | \"dashed\"\ntype Variant = \"default\" | \"minimal\"\ntype Color = \"default\" | \"success\"\n\ntype ProgressStepsContextValue = {\n current: number\n orientation: Orientation\n size: Sizes<\"sm\" | \"md\" | \"lg\">\n connectorStyle: ConnectorStyle\n variant: Variant\n color: Color\n totalSteps: number\n}\n\nconst ProgressStepsContext = createContext<ProgressStepsContextValue | null>(null)\n\nconst useProgressStepsContext = () => {\n const context = use(ProgressStepsContext)\n if (!context) {\n throw new Error(\"ProgressSteps components must be wrapped in <ProgressSteps />\")\n }\n return context\n}\n\nexport type ProgressStepsProps = {\n /** Current active step (1-indexed, starts from 1) */\n current: number\n /**\n * Total number of steps (required for minimal variant)\n */\n total?: number\n /**\n * Visual variant\n * @default default\n */\n variant?: Variant\n /**\n * Color scheme\n * @default default\n */\n color?: Color\n /**\n * Layout orientation\n * @default horizontal\n */\n orientation?: Orientation\n /**\n * Size of step indicators\n * @default md\n */\n size?: Sizes<\"sm\" | \"md\" | \"lg\">\n /**\n * Connector line style\n * @default solid\n */\n connectorStyle?: ConnectorStyle\n /** Class applied to the container */\n className?: string\n children?: ReactNode\n}\n\nexport const ProgressSteps = ({\n current,\n total,\n variant = \"default\",\n color = \"default\",\n orientation = \"horizontal\",\n size = \"md\",\n connectorStyle = \"solid\",\n children,\n className,\n}: ProgressStepsProps) => {\n const totalSteps = variant === \"minimal\" ? total ?? 0 : React.Children.count(children)\n\n const warnedRef = useRef(false)\n if (isDev && variant === \"minimal\" && (total == null || total <= 0) && !warnedRef.current) {\n warnedRef.current = true\n // eslint-disable-next-line no-console\n console.warn(\n '[ProgressSteps] variant=\"minimal\" requires a positive `total` prop. Received:',\n total,\n )\n }\n\n const store = useMemo<ProgressStepsContextValue>(\n () => ({ current, orientation, size, connectorStyle, variant, color, totalSteps }),\n [current, orientation, size, connectorStyle, variant, color, totalSteps],\n )\n\n // Minimal variant: render horizontal bar segments\n if (variant === \"minimal\") {\n return (\n <nav\n aria-label=\"Progress\"\n role=\"progressbar\"\n aria-valuenow={current}\n aria-valuemin={1}\n aria-valuemax={totalSteps}\n className={clsx(s.ProgressSteps, s.Minimal, className)}\n data-size={size}\n data-color={color}\n data-variant=\"minimal\"\n >\n <div className={s.MinimalList}>\n {Array.from({ length: totalSteps }, (_, i) => (\n <div\n key={i}\n className={s.MinimalSegment}\n data-state={i < current ? \"completed\" : \"upcoming\"}\n />\n ))}\n </div>\n </nav>\n )\n }\n\n return (\n <ProgressStepsContext value={store}>\n <nav\n aria-label=\"Progress\"\n className={clsx(s.ProgressSteps, className)}\n data-size={size}\n data-color={color}\n data-variant={variant}\n >\n <ol\n className={s.List}\n data-orientation={orientation}\n data-connector={connectorStyle}\n data-variant={variant}\n >\n {React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? React.cloneElement(child, { _index: index } as Record<string, unknown>)\n : child,\n )}\n </ol>\n </nav>\n </ProgressStepsContext>\n )\n}\n\nexport type StepProps = {\n /** Custom icon (replaces step number) */\n icon?: ReactNode\n /** Step content (Title and/or Description) */\n children?: ReactNode\n /** @internal - injected by parent */\n _index?: number\n}\n\nconst Step = ({ children, icon, _index = 0 }: StepProps) => {\n const { current, totalSteps } = useProgressStepsContext()\n\n const state: StepState =\n _index < current - 1 ? \"completed\" : _index === current - 1 ? \"active\" : \"inactive\"\n\n const isLast = _index === totalSteps - 1\n\n return (\n <li\n className={s.Step}\n data-state={state}\n aria-current={state === \"active\" ? \"step\" : undefined}\n >\n <div className={s.StepIndicator}>\n {state === \"completed\" ? <CheckMd data-no-autosize /> : icon ?? _index + 1}\n </div>\n {!isLast && <div className={s.StepConnector} />}\n <div className={s.StepContent}>{children}</div>\n </li>\n )\n}\n\nconst Title = ({ children, className }: { children: ReactNode; className?: string }) => (\n <div className={clsx(s.StepTitle, className)}>{children}</div>\n)\n\nconst Description = ({ children, className }: { children: ReactNode; className?: string }) => (\n <div className={clsx(s.StepDescription, className)}>{children}</div>\n)\n\nProgressSteps.Step = Step\nProgressSteps.Title = Title\nProgressSteps.Description = Description\n"]}
1
+ {"version":3,"file":"ProgressSteps.js","sourceRoot":"","sources":["../../../../src/components/ProgressSteps/ProgressSteps.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport React, { createContext, use, useMemo, useRef, type ReactNode } from \"react\"\nimport { isDev } from \"../../lib/environment\"\nimport type { Sizes } from \"../../types\"\nimport { CheckMd } from \"../Icon\"\nimport s from \"@plexui/styles/components/ProgressSteps/ProgressSteps.module.css\"\n\ntype Orientation = \"horizontal\" | \"vertical\"\ntype StepState = \"completed\" | \"active\" | \"inactive\"\ntype ConnectorStyle = \"solid\" | \"dashed\"\ntype Variant = \"default\" | \"minimal\"\ntype Color = \"default\" | \"success\"\n\ntype ProgressStepsContextValue = {\n current: number\n orientation: Orientation\n size: Sizes<\"sm\" | \"md\" | \"lg\">\n connectorStyle: ConnectorStyle\n variant: Variant\n color: Color\n totalSteps: number\n}\n\nconst ProgressStepsContext = createContext<ProgressStepsContextValue | null>(null)\n\nconst useProgressStepsContext = () => {\n const context = use(ProgressStepsContext)\n if (!context) {\n throw new Error(\"ProgressSteps components must be wrapped in <ProgressSteps />\")\n }\n return context\n}\n\nexport type ProgressStepsProps = {\n /** Current active step (1-indexed, starts from 1) */\n current: number\n /**\n * Total number of steps (required for minimal variant)\n */\n total?: number\n /**\n * Visual variant\n * @default default\n */\n variant?: Variant\n /**\n * Color scheme\n * @default default\n */\n color?: Color\n /**\n * Layout orientation\n * @default horizontal\n */\n orientation?: Orientation\n /**\n * Size of step indicators\n * @default md\n */\n size?: Sizes<\"sm\" | \"md\" | \"lg\">\n /**\n * Connector line style\n * @default solid\n */\n connectorStyle?: ConnectorStyle\n /** Class applied to the container */\n className?: string\n children?: ReactNode\n}\n\nexport const ProgressSteps = ({\n current,\n total,\n variant = \"default\",\n color = \"default\",\n orientation = \"horizontal\",\n size = \"md\",\n connectorStyle = \"solid\",\n children,\n className,\n}: ProgressStepsProps) => {\n const totalSteps = variant === \"minimal\" ? total ?? 0 : React.Children.count(children)\n\n const warnedRef = useRef(false)\n if (isDev && variant === \"minimal\" && (total == null || total <= 0) && !warnedRef.current) {\n warnedRef.current = true\n // eslint-disable-next-line no-console\n console.warn(\n '[ProgressSteps] variant=\"minimal\" requires a positive `total` prop. Received:',\n total,\n )\n }\n\n const store = useMemo<ProgressStepsContextValue>(\n () => ({ current, orientation, size, connectorStyle, variant, color, totalSteps }),\n [current, orientation, size, connectorStyle, variant, color, totalSteps],\n )\n\n // Minimal variant: render horizontal bar segments\n if (variant === \"minimal\") {\n return (\n // A div, not nav: role=\"progressbar\" is not allowed on <nav>\n <div\n aria-label=\"Progress\"\n role=\"progressbar\"\n aria-valuenow={current}\n aria-valuemin={1}\n aria-valuemax={totalSteps}\n className={clsx(s.ProgressSteps, s.Minimal, className)}\n data-size={size}\n data-color={color}\n data-variant=\"minimal\"\n >\n <div className={s.MinimalList}>\n {Array.from({ length: totalSteps }, (_, i) => (\n <div\n key={i}\n className={s.MinimalSegment}\n data-state={i < current ? \"completed\" : \"upcoming\"}\n />\n ))}\n </div>\n </div>\n )\n }\n\n return (\n <ProgressStepsContext value={store}>\n <nav\n aria-label=\"Progress\"\n className={clsx(s.ProgressSteps, className)}\n data-size={size}\n data-color={color}\n data-variant={variant}\n >\n <ol\n className={s.List}\n data-orientation={orientation}\n data-connector={connectorStyle}\n data-variant={variant}\n >\n {React.Children.map(children, (child, index) =>\n React.isValidElement(child)\n ? React.cloneElement(child, { _index: index } as Record<string, unknown>)\n : child,\n )}\n </ol>\n </nav>\n </ProgressStepsContext>\n )\n}\n\nexport type StepProps = {\n /** Custom icon (replaces step number) */\n icon?: ReactNode\n /** Step content (Title and/or Description) */\n children?: ReactNode\n /** @internal - injected by parent */\n _index?: number\n}\n\nconst Step = ({ children, icon, _index = 0 }: StepProps) => {\n const { current, totalSteps } = useProgressStepsContext()\n\n const state: StepState =\n _index < current - 1 ? \"completed\" : _index === current - 1 ? \"active\" : \"inactive\"\n\n const isLast = _index === totalSteps - 1\n\n return (\n <li\n className={s.Step}\n data-state={state}\n aria-current={state === \"active\" ? \"step\" : undefined}\n >\n <div className={s.StepIndicator}>\n {state === \"completed\" ? <CheckMd data-no-autosize /> : icon ?? _index + 1}\n </div>\n {!isLast && <div className={s.StepConnector} />}\n <div className={s.StepContent}>{children}</div>\n </li>\n )\n}\n\nconst Title = ({ children, className }: { children: ReactNode; className?: string }) => (\n <div className={clsx(s.StepTitle, className)}>{children}</div>\n)\n\nconst Description = ({ children, className }: { children: ReactNode; className?: string }) => (\n <div className={clsx(s.StepDescription, className)}>{children}</div>\n)\n\nProgressSteps.Step = Step\nProgressSteps.Title = Title\nProgressSteps.Description = Description\n"]}
@@ -1,2 +1,2 @@
1
- export { ProgressSteps } from "./ProgressSteps";
1
+ export { ProgressSteps } from "./ProgressSteps.js";
2
2
  //# sourceMappingURL=index.js.map