@okta/odyssey-react-mui 1.28.1 → 1.29.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 (326) hide show
  1. package/CHANGELOG.md +8 -0
  2. package/dist/Breadcrumbs.js +1 -0
  3. package/dist/Breadcrumbs.js.map +1 -1
  4. package/dist/Buttons/MenuItem.js +1 -0
  5. package/dist/Buttons/MenuItem.js.map +1 -1
  6. package/dist/Checkbox.js +62 -35
  7. package/dist/Checkbox.js.map +1 -1
  8. package/dist/DataTable/reorderDataRowsLocally.js.map +1 -1
  9. package/dist/DataTable/useRowReordering.js.map +1 -1
  10. package/dist/HtmlProps.js.map +1 -1
  11. package/dist/Pagination/Pagination.js +2 -1
  12. package/dist/Pagination/Pagination.js.map +1 -1
  13. package/dist/Radio.js +65 -38
  14. package/dist/Radio.js.map +1 -1
  15. package/dist/Typography.js +20 -0
  16. package/dist/Typography.js.map +1 -1
  17. package/dist/index.scss +1 -1
  18. package/dist/labs/DataFilters.js +9 -5
  19. package/dist/labs/DataFilters.js.map +1 -1
  20. package/dist/labs/DataTable.js +7 -7
  21. package/dist/labs/DataTable.js.map +1 -1
  22. package/dist/labs/DataView/BulkActionsMenu.js.map +1 -1
  23. package/dist/labs/DataView/CardLayoutContent.js +6 -5
  24. package/dist/labs/DataView/CardLayoutContent.js.map +1 -1
  25. package/dist/labs/DataView/DataCard.js +1 -0
  26. package/dist/labs/DataView/DataCard.js.map +1 -1
  27. package/dist/labs/DataView/DataTable.js.map +1 -1
  28. package/dist/labs/DataView/DataView.js +2 -2
  29. package/dist/labs/DataView/DataView.js.map +1 -1
  30. package/dist/labs/DataView/DetailPanel.js.map +1 -1
  31. package/dist/labs/DataView/RowActions.js.map +1 -1
  32. package/dist/labs/DataView/TableLayoutContent.js +1 -1
  33. package/dist/labs/DataView/TableLayoutContent.js.map +1 -1
  34. package/dist/labs/DataView/TableSettings.js.map +1 -1
  35. package/dist/labs/DataView/componentTypes.js.map +1 -1
  36. package/dist/labs/DataView/dataTypes.js.map +1 -1
  37. package/dist/labs/DataView/fetchData.js.map +1 -1
  38. package/dist/labs/DataView/testSupportData.js +201 -0
  39. package/dist/labs/DataView/testSupportData.js.map +1 -0
  40. package/dist/labs/DataView/useFilterConversion.js.map +1 -1
  41. package/dist/labs/{DateField.js → DatePickers/DateField.js} +1 -1
  42. package/dist/labs/DatePickers/DateField.js.map +1 -0
  43. package/dist/labs/DatePickers/DateFieldActionBar.js +56 -0
  44. package/dist/labs/DatePickers/DateFieldActionBar.js.map +1 -0
  45. package/dist/labs/DatePickers/DateFieldLocalizationProvider.js +32 -0
  46. package/dist/labs/DatePickers/DateFieldLocalizationProvider.js.map +1 -0
  47. package/dist/labs/{DatePicker.js → DatePickers/DatePicker.js} +30 -73
  48. package/dist/labs/DatePickers/DatePicker.js.map +1 -0
  49. package/dist/labs/DatePickers/DatePicker.types.d.js.map +1 -0
  50. package/dist/labs/DatePickers/DateTimeField.js +166 -0
  51. package/dist/labs/DatePickers/DateTimeField.js.map +1 -0
  52. package/dist/labs/DatePickers/DateTimePicker.js +233 -0
  53. package/dist/labs/DatePickers/DateTimePicker.js.map +1 -0
  54. package/dist/labs/{datePickerTheme.js → DatePickers/datePickerTheme.js} +2 -2
  55. package/dist/labs/DatePickers/datePickerTheme.js.map +1 -0
  56. package/dist/labs/DatePickers/dateTimePickerTheme.js +230 -0
  57. package/dist/labs/DatePickers/dateTimePickerTheme.js.map +1 -0
  58. package/dist/labs/DatePickers/index.js +15 -0
  59. package/dist/labs/DatePickers/index.js.map +1 -0
  60. package/dist/labs/DatePickers/useDateFieldsTranslations.js.map +1 -0
  61. package/dist/labs/{useOdysseyDateFields.js → DatePickers/useOdysseyDateFields.js} +36 -3
  62. package/dist/labs/DatePickers/useOdysseyDateFields.js.map +1 -0
  63. package/dist/labs/PageTemplate.js +1 -1
  64. package/dist/labs/PageTemplate.js.map +1 -1
  65. package/dist/labs/SideNav/SideNav.js +40 -34
  66. package/dist/labs/SideNav/SideNav.js.map +1 -1
  67. package/dist/labs/SideNav/SideNavHeader.js +6 -4
  68. package/dist/labs/SideNav/SideNavHeader.js.map +1 -1
  69. package/dist/labs/SideNav/SideNavItemContent.js +11 -11
  70. package/dist/labs/SideNav/SideNavItemContent.js.map +1 -1
  71. package/dist/labs/SideNav/SideNavToggleButton.js +1 -1
  72. package/dist/labs/SideNav/SideNavToggleButton.js.map +1 -1
  73. package/dist/labs/SideNav/types.js.map +1 -1
  74. package/dist/labs/TimeZonePicker.js.map +1 -1
  75. package/dist/labs/index.js +1 -3
  76. package/dist/labs/index.js.map +1 -1
  77. package/dist/properties/ts/odyssey-react-mui.js +2 -0
  78. package/dist/properties/ts/odyssey-react-mui.js.map +1 -1
  79. package/dist/src/Breadcrumbs.d.ts.map +1 -1
  80. package/dist/src/Buttons/MenuItem.d.ts.map +1 -1
  81. package/dist/src/Checkbox.d.ts.map +1 -1
  82. package/dist/src/DataTable/reorderDataRowsLocally.d.ts +3 -3
  83. package/dist/src/DataTable/reorderDataRowsLocally.d.ts.map +1 -1
  84. package/dist/src/DataTable/useRowReordering.d.ts +10 -10
  85. package/dist/src/DataTable/useRowReordering.d.ts.map +1 -1
  86. package/dist/src/HtmlProps.d.ts +27 -0
  87. package/dist/src/HtmlProps.d.ts.map +1 -1
  88. package/dist/src/OdysseyTranslationProvider.d.ts +1 -1
  89. package/dist/src/OdysseyTranslationProvider.d.ts.map +1 -1
  90. package/dist/src/Radio.d.ts +1 -1
  91. package/dist/src/Radio.d.ts.map +1 -1
  92. package/dist/src/Typography.d.ts +11 -11
  93. package/dist/src/Typography.d.ts.map +1 -1
  94. package/dist/src/labs/DataFilters.d.ts.map +1 -1
  95. package/dist/src/labs/DataTable.d.ts +11 -11
  96. package/dist/src/labs/DataTable.d.ts.map +1 -1
  97. package/dist/src/labs/DataView/BulkActionsMenu.d.ts +3 -3
  98. package/dist/src/labs/DataView/BulkActionsMenu.d.ts.map +1 -1
  99. package/dist/src/labs/DataView/CardLayoutContent.d.ts +18 -15
  100. package/dist/src/labs/DataView/CardLayoutContent.d.ts.map +1 -1
  101. package/dist/src/labs/DataView/DataCard.d.ts +7 -4
  102. package/dist/src/labs/DataView/DataCard.d.ts.map +1 -1
  103. package/dist/src/labs/DataView/DataTable.d.ts +6 -2
  104. package/dist/src/labs/DataView/DataTable.d.ts.map +1 -1
  105. package/dist/src/labs/DataView/DataView.d.ts +6 -2
  106. package/dist/src/labs/DataView/DataView.d.ts.map +1 -1
  107. package/dist/src/labs/DataView/DetailPanel.d.ts +5 -5
  108. package/dist/src/labs/DataView/DetailPanel.d.ts.map +1 -1
  109. package/dist/src/labs/DataView/RowActions.d.ts +3 -3
  110. package/dist/src/labs/DataView/RowActions.d.ts.map +1 -1
  111. package/dist/src/labs/DataView/TableLayoutContent.d.ts +18 -15
  112. package/dist/src/labs/DataView/TableLayoutContent.d.ts.map +1 -1
  113. package/dist/src/labs/DataView/TableSettings.d.ts +7 -3
  114. package/dist/src/labs/DataView/TableSettings.d.ts.map +1 -1
  115. package/dist/src/labs/DataView/componentTypes.d.ts +17 -17
  116. package/dist/src/labs/DataView/componentTypes.d.ts.map +1 -1
  117. package/dist/src/labs/DataView/dataTypes.d.ts +6 -6
  118. package/dist/src/labs/DataView/dataTypes.d.ts.map +1 -1
  119. package/dist/src/labs/DataView/fetchData.d.ts +6 -6
  120. package/dist/src/labs/DataView/fetchData.d.ts.map +1 -1
  121. package/dist/src/labs/DataView/testSupportData.d.ts +33 -0
  122. package/dist/src/labs/DataView/testSupportData.d.ts.map +1 -0
  123. package/dist/src/labs/DataView/useFilterConversion.d.ts +5 -4
  124. package/dist/src/labs/DataView/useFilterConversion.d.ts.map +1 -1
  125. package/dist/src/labs/{DateField.d.ts → DatePickers/DateField.d.ts} +1 -1
  126. package/dist/src/labs/DatePickers/DateField.d.ts.map +1 -0
  127. package/dist/src/labs/DatePickers/DateFieldActionBar.d.ts +15 -0
  128. package/dist/src/labs/DatePickers/DateFieldActionBar.d.ts.map +1 -0
  129. package/dist/src/labs/DatePickers/DateFieldLocalizationProvider.d.ts +20 -0
  130. package/dist/src/labs/DatePickers/DateFieldLocalizationProvider.d.ts.map +1 -0
  131. package/dist/src/labs/DatePickers/DatePicker.d.ts +17 -0
  132. package/dist/src/labs/DatePickers/DatePicker.d.ts.map +1 -0
  133. package/dist/src/labs/DatePickers/DateTimeField.d.ts +20 -0
  134. package/dist/src/labs/DatePickers/DateTimeField.d.ts.map +1 -0
  135. package/dist/src/labs/DatePickers/DateTimePicker.d.ts +17 -0
  136. package/dist/src/labs/DatePickers/DateTimePicker.d.ts.map +1 -0
  137. package/dist/src/labs/DatePickers/datePickerTheme.d.ts +22 -0
  138. package/dist/src/labs/DatePickers/datePickerTheme.d.ts.map +1 -0
  139. package/dist/src/labs/{datePickerTheme.d.ts → DatePickers/dateTimePickerTheme.d.ts} +2 -2
  140. package/dist/src/labs/DatePickers/dateTimePickerTheme.d.ts.map +1 -0
  141. package/dist/src/labs/DatePickers/index.d.ts +15 -0
  142. package/dist/src/labs/DatePickers/index.d.ts.map +1 -0
  143. package/dist/src/labs/DatePickers/useDateFieldsTranslations.d.ts.map +1 -0
  144. package/dist/src/labs/{useOdysseyDateFields.d.ts → DatePickers/useOdysseyDateFields.d.ts} +49 -6
  145. package/dist/src/labs/DatePickers/useOdysseyDateFields.d.ts.map +1 -0
  146. package/dist/src/labs/SideNav/SideNav.d.ts.map +1 -1
  147. package/dist/src/labs/SideNav/SideNavHeader.d.ts.map +1 -1
  148. package/dist/src/labs/SideNav/SideNavItemContent.d.ts +1 -1
  149. package/dist/src/labs/SideNav/SideNavItemContent.d.ts.map +1 -1
  150. package/dist/src/labs/SideNav/types.d.ts +2 -2
  151. package/dist/src/labs/SideNav/types.d.ts.map +1 -1
  152. package/dist/src/labs/TimeZonePicker.d.ts +4 -1
  153. package/dist/src/labs/TimeZonePicker.d.ts.map +1 -1
  154. package/dist/src/labs/index.d.ts +1 -3
  155. package/dist/src/labs/index.d.ts.map +1 -1
  156. package/dist/src/properties/ts/odyssey-react-mui.d.ts +2 -0
  157. package/dist/src/properties/ts/odyssey-react-mui.d.ts.map +1 -1
  158. package/dist/src/theme/components.d.ts.map +1 -1
  159. package/dist/src/theme/mixins.d.ts.map +1 -1
  160. package/dist/src/theme/mixins.types.d.ts +2 -0
  161. package/dist/src/theme/mixins.types.d.ts.map +1 -1
  162. package/dist/src/{labs → ui-shell}/UiShell/UiShell.d.ts +2 -2
  163. package/dist/src/ui-shell/UiShell/UiShell.d.ts.map +1 -0
  164. package/dist/src/{labs → ui-shell}/UiShell/UiShellContent.d.ts +12 -8
  165. package/dist/src/ui-shell/UiShell/UiShellContent.d.ts.map +1 -0
  166. package/dist/src/ui-shell/UiShell/bufferLatest.d.ts.map +1 -0
  167. package/dist/src/ui-shell/UiShell/createMessageBus.d.ts.map +1 -0
  168. package/dist/src/ui-shell/UiShell/createStore.d.ts.map +1 -0
  169. package/dist/src/ui-shell/UiShell/index.d.ts.map +1 -0
  170. package/dist/src/{labs → ui-shell}/UiShell/renderUiShell.d.ts +3 -4
  171. package/dist/src/ui-shell/UiShell/renderUiShell.d.ts.map +1 -0
  172. package/dist/src/{labs → ui-shell}/UiShell/useHasUiShell.d.ts +1 -0
  173. package/dist/src/ui-shell/UiShell/useHasUiShell.d.ts.map +1 -0
  174. package/dist/src/ui-shell/UiShell/useScrollState.d.ts.map +1 -0
  175. package/dist/src/ui-shell/index.d.ts +14 -0
  176. package/dist/src/ui-shell/index.d.ts.map +1 -0
  177. package/dist/src/{web-component → ui-shell}/renderReactInWebComponent.d.ts +3 -23
  178. package/dist/src/ui-shell/renderReactInWebComponent.d.ts.map +1 -0
  179. package/dist/src/web-component/index.d.ts +0 -1
  180. package/dist/src/web-component/index.d.ts.map +1 -1
  181. package/dist/src/web-component/shadow-dom.d.ts +23 -2
  182. package/dist/src/web-component/shadow-dom.d.ts.map +1 -1
  183. package/dist/theme/components.js +38 -4
  184. package/dist/theme/components.js.map +1 -1
  185. package/dist/theme/mixins.js +2 -1
  186. package/dist/theme/mixins.js.map +1 -1
  187. package/dist/theme/mixins.types.js.map +1 -1
  188. package/dist/tsconfig.production.tsbuildinfo +1 -1
  189. package/dist/{labs → ui-shell}/UiShell/UiShell.js +2 -0
  190. package/dist/ui-shell/UiShell/UiShell.js.map +1 -0
  191. package/dist/{labs → ui-shell}/UiShell/UiShellContent.js +19 -11
  192. package/dist/ui-shell/UiShell/UiShellContent.js.map +1 -0
  193. package/dist/ui-shell/UiShell/bufferLatest.js.map +1 -0
  194. package/dist/ui-shell/UiShell/createMessageBus.js.map +1 -0
  195. package/dist/ui-shell/UiShell/createStore.js.map +1 -0
  196. package/dist/ui-shell/UiShell/index.js.map +1 -0
  197. package/dist/{labs → ui-shell}/UiShell/renderUiShell.js +4 -2
  198. package/dist/ui-shell/UiShell/renderUiShell.js.map +1 -0
  199. package/dist/{labs → ui-shell}/UiShell/useHasUiShell.js +1 -1
  200. package/dist/ui-shell/UiShell/useHasUiShell.js.map +1 -0
  201. package/dist/ui-shell/UiShell/useScrollState.js.map +1 -0
  202. package/dist/ui-shell/index.js +14 -0
  203. package/dist/ui-shell/index.js.map +1 -0
  204. package/dist/{web-component → ui-shell}/renderReactInWebComponent.js +7 -17
  205. package/dist/ui-shell/renderReactInWebComponent.js.map +1 -0
  206. package/dist/web-component/index.js +0 -1
  207. package/dist/web-component/index.js.map +1 -1
  208. package/dist/web-component/shadow-dom.js +12 -2
  209. package/dist/web-component/shadow-dom.js.map +1 -1
  210. package/package.json +10 -3
  211. package/src/Breadcrumbs.tsx +5 -1
  212. package/src/Buttons/MenuItem.tsx +1 -0
  213. package/src/Checkbox.tsx +86 -44
  214. package/src/DataTable/reorderDataRowsLocally.tsx +3 -3
  215. package/src/DataTable/useRowReordering.tsx +16 -23
  216. package/src/HtmlProps.ts +27 -0
  217. package/src/Pagination/Pagination.tsx +2 -2
  218. package/src/Radio.tsx +78 -39
  219. package/src/Typography.tsx +26 -1
  220. package/src/labs/DataFilters.tsx +7 -3
  221. package/src/labs/DataTable.tsx +41 -33
  222. package/src/labs/DataView/BulkActionsMenu.tsx +4 -4
  223. package/src/labs/DataView/CardLayoutContent.tsx +34 -28
  224. package/src/labs/DataView/DataCard.tsx +13 -6
  225. package/src/labs/DataView/DataTable.tsx +11 -4
  226. package/src/labs/DataView/DataView.test.tsx +1012 -87
  227. package/src/labs/DataView/DataView.tsx +18 -11
  228. package/src/labs/DataView/DetailPanel.tsx +4 -4
  229. package/src/labs/DataView/RowActions.tsx +4 -4
  230. package/src/labs/DataView/TableLayoutContent.tsx +30 -24
  231. package/src/labs/DataView/TableSettings.tsx +12 -6
  232. package/src/labs/DataView/componentTypes.ts +17 -17
  233. package/src/labs/DataView/dataTypes.ts +14 -8
  234. package/src/labs/DataView/fetchData.ts +9 -7
  235. package/src/labs/DataView/testSupportData.tsx +301 -0
  236. package/src/labs/DataView/useFilterConversion.ts +8 -8
  237. package/src/labs/{DateField.tsx → DatePickers/DateField.tsx} +2 -2
  238. package/src/labs/DatePickers/DateFieldActionBar.tsx +65 -0
  239. package/src/labs/DatePickers/DateFieldLocalizationProvider.tsx +46 -0
  240. package/src/labs/{DatePicker.tsx → DatePickers/DatePicker.tsx} +31 -136
  241. package/src/labs/DatePickers/DateTimeField.tsx +271 -0
  242. package/src/labs/DatePickers/DateTimePicker.test.tsx +66 -0
  243. package/src/labs/DatePickers/DateTimePicker.tsx +303 -0
  244. package/src/labs/{datePickerTheme.tsx → DatePickers/datePickerTheme.tsx} +2 -2
  245. package/src/labs/DatePickers/dateTimePickerTheme.ts +213 -0
  246. package/src/labs/DatePickers/index.ts +15 -0
  247. package/src/labs/{useOdysseyDateFields.ts → DatePickers/useOdysseyDateFields.ts} +112 -10
  248. package/src/labs/PageTemplate.tsx +1 -1
  249. package/src/labs/SideNav/SideNav.tsx +38 -39
  250. package/src/labs/SideNav/SideNavHeader.tsx +6 -4
  251. package/src/labs/SideNav/SideNavItemContent.tsx +21 -18
  252. package/src/labs/SideNav/SideNavToggleButton.tsx +1 -1
  253. package/src/labs/SideNav/types.ts +2 -2
  254. package/src/labs/TimeZonePicker.tsx +5 -1
  255. package/src/labs/index.ts +2 -3
  256. package/src/properties/odyssey-react-mui.properties +2 -0
  257. package/src/properties/ts/odyssey-react-mui.ts +1 -1
  258. package/src/theme/components.tsx +45 -4
  259. package/src/theme/mixins.ts +1 -0
  260. package/src/theme/mixins.types.ts +2 -0
  261. package/src/{labs → ui-shell}/UiShell/UiShell.tsx +3 -0
  262. package/src/{labs → ui-shell}/UiShell/UiShellContent.tsx +60 -31
  263. package/src/{labs → ui-shell}/UiShell/renderUiShell.test.tsx +16 -22
  264. package/src/{labs → ui-shell}/UiShell/renderUiShell.tsx +7 -4
  265. package/src/{labs → ui-shell}/UiShell/useHasUiShell.ts +1 -1
  266. package/src/ui-shell/index.ts +14 -0
  267. package/src/{web-component → ui-shell}/renderReactInWebComponent.test.tsx +1 -1
  268. package/src/{web-component → ui-shell}/renderReactInWebComponent.ts +9 -45
  269. package/src/web-component/index.ts +0 -1
  270. package/src/web-component/shadow-dom.ts +36 -3
  271. package/dist/labs/DateField.js.map +0 -1
  272. package/dist/labs/DatePicker.js.map +0 -1
  273. package/dist/labs/DatePicker.types.d.js.map +0 -1
  274. package/dist/labs/UiShell/UiShell.js.map +0 -1
  275. package/dist/labs/UiShell/UiShellContent.js.map +0 -1
  276. package/dist/labs/UiShell/bufferLatest.js.map +0 -1
  277. package/dist/labs/UiShell/createMessageBus.js.map +0 -1
  278. package/dist/labs/UiShell/createStore.js.map +0 -1
  279. package/dist/labs/UiShell/index.js.map +0 -1
  280. package/dist/labs/UiShell/renderUiShell.js.map +0 -1
  281. package/dist/labs/UiShell/useHasUiShell.js.map +0 -1
  282. package/dist/labs/UiShell/useScrollState.js.map +0 -1
  283. package/dist/labs/datePickerTheme.js.map +0 -1
  284. package/dist/labs/useDateFieldsTranslations.js.map +0 -1
  285. package/dist/labs/useOdysseyDateFields.js.map +0 -1
  286. package/dist/src/labs/DateField.d.ts.map +0 -1
  287. package/dist/src/labs/DatePicker.d.ts +0 -47
  288. package/dist/src/labs/DatePicker.d.ts.map +0 -1
  289. package/dist/src/labs/UiShell/UiShell.d.ts.map +0 -1
  290. package/dist/src/labs/UiShell/UiShellContent.d.ts.map +0 -1
  291. package/dist/src/labs/UiShell/bufferLatest.d.ts.map +0 -1
  292. package/dist/src/labs/UiShell/createMessageBus.d.ts.map +0 -1
  293. package/dist/src/labs/UiShell/createStore.d.ts.map +0 -1
  294. package/dist/src/labs/UiShell/index.d.ts.map +0 -1
  295. package/dist/src/labs/UiShell/renderUiShell.d.ts.map +0 -1
  296. package/dist/src/labs/UiShell/useHasUiShell.d.ts.map +0 -1
  297. package/dist/src/labs/UiShell/useScrollState.d.ts.map +0 -1
  298. package/dist/src/labs/datePickerTheme.d.ts.map +0 -1
  299. package/dist/src/labs/useDateFieldsTranslations.d.ts.map +0 -1
  300. package/dist/src/labs/useOdysseyDateFields.d.ts.map +0 -1
  301. package/dist/src/web-component/renderReactInWebComponent.d.ts.map +0 -1
  302. package/dist/web-component/renderReactInWebComponent.js.map +0 -1
  303. /package/dist/labs/{DatePicker.types.d.js → DatePickers/DatePicker.types.d.js} +0 -0
  304. /package/dist/labs/{useDateFieldsTranslations.js → DatePickers/useDateFieldsTranslations.js} +0 -0
  305. /package/dist/src/labs/{useDateFieldsTranslations.d.ts → DatePickers/useDateFieldsTranslations.d.ts} +0 -0
  306. /package/dist/src/{labs → ui-shell}/UiShell/bufferLatest.d.ts +0 -0
  307. /package/dist/src/{labs → ui-shell}/UiShell/createMessageBus.d.ts +0 -0
  308. /package/dist/src/{labs → ui-shell}/UiShell/createStore.d.ts +0 -0
  309. /package/dist/src/{labs → ui-shell}/UiShell/index.d.ts +0 -0
  310. /package/dist/src/{labs → ui-shell}/UiShell/useScrollState.d.ts +0 -0
  311. /package/dist/{labs → ui-shell}/UiShell/bufferLatest.js +0 -0
  312. /package/dist/{labs → ui-shell}/UiShell/createMessageBus.js +0 -0
  313. /package/dist/{labs → ui-shell}/UiShell/createStore.js +0 -0
  314. /package/dist/{labs → ui-shell}/UiShell/index.js +0 -0
  315. /package/dist/{labs → ui-shell}/UiShell/useScrollState.js +0 -0
  316. /package/src/labs/{DatePicker.types.d.ts → DatePickers/DatePicker.types.d.ts} +0 -0
  317. /package/src/labs/{useDateFieldsTranslations.ts → DatePickers/useDateFieldsTranslations.ts} +0 -0
  318. /package/src/{labs → ui-shell}/UiShell/UiShell.test.tsx +0 -0
  319. /package/src/{labs → ui-shell}/UiShell/bufferLatest.test.ts +0 -0
  320. /package/src/{labs → ui-shell}/UiShell/bufferLatest.ts +0 -0
  321. /package/src/{labs → ui-shell}/UiShell/createMessageBus.test.ts +0 -0
  322. /package/src/{labs → ui-shell}/UiShell/createMessageBus.ts +0 -0
  323. /package/src/{labs → ui-shell}/UiShell/createStore.test.ts +0 -0
  324. /package/src/{labs → ui-shell}/UiShell/createStore.ts +0 -0
  325. /package/src/{labs → ui-shell}/UiShell/index.ts +0 -0
  326. /package/src/{labs → ui-shell}/UiShell/useScrollState.ts +0 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,14 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [1.29.0](https://github.com/okta/odyssey/compare/v1.28.0...v1.29.0) (2024-12-11)
7
+
8
+ **Note:** Version bump only for package @okta/odyssey-react-mui
9
+
10
+ ## [1.28.2](https://github.com/okta/odyssey/compare/v1.28.1...v1.28.2) (2024-12-03)
11
+
12
+ **Note:** Version bump only for package @okta/odyssey-react-mui
13
+
6
14
  ## [1.28.1](https://github.com/okta/odyssey/compare/v1.28.0...v1.28.1) (2024-12-02)
7
15
 
8
16
  **Note:** Version bump only for package @okta/odyssey-react-mui
@@ -51,6 +51,7 @@ export const Breadcrumb = ({
51
51
  }
52
52
  if (breadcrumbType === "currentPage") {
53
53
  return _jsx(Subordinate, {
54
+ ariaCurrent: "page",
54
55
  color: "textPrimary",
55
56
  children: breadcrumbContent
56
57
  });
@@ -1 +1 @@
1
- {"version":3,"file":"Breadcrumbs.js","names":["createContext","memo","useCallback","useContext","useMemo","useState","GroupIcon","HomeIcon","UserIcon","Subordinate","useTranslation","styled","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","BreadcrumbContext","breadcrumbType","BreadcrumbContent","span","Breadcrumb","children","href","iconName","breadcrumbContent","_MenuItem","color","_ButtonBase","breadcrumbProviderValue","currentPage","listItem","menuItem","defaultTruncationValue","BreadcrumbList","homeHref","maxVisibleItems","maxVisibleItemsProp","testId","translate","t","anchorEl","setAnchorEl","Math","min","max","length","breadcrumbSections","beforeMenu","insideMenu","remainingBreadcrumbs","menuStart","floor","menuLength","slice","onMenuButtonClick","event","currentTarget","onCloseMenu","_Breadcrumbs","maxItems","map","breadcrumb","Provider","value","onClick","_Menu","open","Boolean","onClose","anchorOrigin","horizontal","vertical","MenuListProps","sx","minWidth","i","MemoizedBreadcrumbList","displayName"],"sources":["../src/Breadcrumbs.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n ButtonBase,\n Menu,\n MenuItem,\n Breadcrumbs as MuiBreadcrumbs,\n} from \"@mui/material\";\nimport {\n MouseEventHandler,\n ReactElement,\n createContext,\n memo,\n useCallback,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport { GroupIcon, HomeIcon, UserIcon } from \"./icons.generated\";\nimport { Subordinate } from \"./Typography\";\nimport { useTranslation } from \"react-i18next\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport styled from \"@emotion/styled\";\n\nexport type BreadcrumbType = \"listItem\" | \"menuItem\" | \"currentPage\";\n\nexport type BreadcrumbProps = {\n children?: string;\n href: string;\n iconName?: \"user\" | \"group\";\n};\n\nexport type BreadcrumbsProps = {\n children: ReactElement<typeof Breadcrumb>[];\n homeHref?: string;\n maxVisibleItems?: number;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nexport type BreadcrumbContextType = {\n breadcrumbType: BreadcrumbType;\n};\n\nexport const BreadcrumbContext = createContext<BreadcrumbContextType>({\n breadcrumbType: \"listItem\",\n});\n\nconst BreadcrumbContent = styled.span`\n white-space: nowrap;\n overflow: hidden;\n max-width: 10rem;\n text-overflow: ellipsis;\n`;\n\nexport const Breadcrumb = ({ children, href, iconName }: BreadcrumbProps) => {\n const { breadcrumbType } = useContext(BreadcrumbContext);\n\n const breadcrumbContent = (\n <>\n {iconName === \"group\" ? (\n <GroupIcon />\n ) : iconName === \"user\" ? (\n <UserIcon />\n ) : null}\n <BreadcrumbContent>{children}</BreadcrumbContent>\n </>\n );\n\n if (breadcrumbType === \"menuItem\") {\n return <MenuItem href={href}>{breadcrumbContent}</MenuItem>;\n }\n\n if (breadcrumbType === \"currentPage\") {\n return <Subordinate color=\"textPrimary\">{breadcrumbContent}</Subordinate>;\n }\n\n // breadcrumbType === \"listItem\" is the default\n // Provided here without a conditional to get TS to be quiet\n // about potential undefined returns\n return <ButtonBase href={href}>{breadcrumbContent}</ButtonBase>;\n};\n\nconst breadcrumbProviderValue: Record<\n BreadcrumbType,\n { breadcrumbType: BreadcrumbType }\n> = {\n currentPage: {\n breadcrumbType: \"currentPage\",\n },\n listItem: {\n breadcrumbType: \"listItem\",\n },\n menuItem: {\n breadcrumbType: \"menuItem\",\n },\n};\n\nconst defaultTruncationValue = 5;\n\nconst BreadcrumbList = ({\n children,\n homeHref,\n maxVisibleItems: maxVisibleItemsProp = defaultTruncationValue,\n testId,\n translate,\n}: BreadcrumbsProps) => {\n const { t } = useTranslation();\n\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n\n const maxVisibleItems = useMemo(\n () => Math.min(Math.max(maxVisibleItemsProp, 0), children.length),\n [maxVisibleItemsProp, children],\n );\n\n const breadcrumbSections = useMemo(() => {\n if (children.length <= maxVisibleItems) {\n return {\n beforeMenu: [],\n insideMenu: [],\n remainingBreadcrumbs: children,\n };\n } else {\n const menuStart = Math.floor(maxVisibleItems / 2);\n const menuLength = children.length - maxVisibleItems;\n\n return {\n beforeMenu: children.slice(0, menuStart),\n insideMenu: children.slice(menuStart, menuStart + menuLength),\n remainingBreadcrumbs: children.slice(menuStart + menuLength),\n };\n }\n }, [children, maxVisibleItems]);\n\n const onMenuButtonClick = useCallback<MouseEventHandler<HTMLButtonElement>>(\n (event) => setAnchorEl(event.currentTarget),\n [],\n );\n const onCloseMenu = useCallback(() => {\n setAnchorEl(null);\n }, []);\n\n return (\n <MuiBreadcrumbs\n maxItems={children.length + 1}\n aria-label={t(\"breadcrumbs.label.text\")}\n data-se={testId}\n translate={translate}\n >\n {homeHref && (\n <ButtonBase href={homeHref} aria-label={t(\"breadcrumbs.home.text\")}>\n <HomeIcon />\n </ButtonBase>\n )}\n\n {breadcrumbSections.beforeMenu.map((breadcrumb) => (\n <BreadcrumbContext.Provider value={breadcrumbProviderValue.listItem}>\n {breadcrumb}\n </BreadcrumbContext.Provider>\n ))}\n\n {breadcrumbSections.insideMenu.length > 0 && (\n <>\n <ButtonBase onClick={onMenuButtonClick}>...</ButtonBase>\n <Menu\n open={Boolean(anchorEl)}\n onClose={onCloseMenu}\n anchorEl={anchorEl}\n anchorOrigin={{ horizontal: \"left\", vertical: \"bottom\" }}\n MenuListProps={{\n sx: {\n minWidth: 180,\n },\n }}\n >\n <BreadcrumbContext.Provider\n value={breadcrumbProviderValue.menuItem}\n >\n {breadcrumbSections.insideMenu}\n </BreadcrumbContext.Provider>\n </Menu>\n </>\n )}\n\n {breadcrumbSections.remainingBreadcrumbs.map((breadcrumb, i) => {\n if (i === breadcrumbSections.remainingBreadcrumbs.length - 1) {\n return (\n <BreadcrumbContext.Provider\n value={breadcrumbProviderValue.currentPage}\n >\n {breadcrumb}\n </BreadcrumbContext.Provider>\n );\n }\n return (\n <BreadcrumbContext.Provider value={breadcrumbProviderValue.listItem}>\n {breadcrumb}\n </BreadcrumbContext.Provider>\n );\n })}\n </MuiBreadcrumbs>\n );\n};\n\nconst MemoizedBreadcrumbList = memo(BreadcrumbList);\nMemoizedBreadcrumbList.displayName = \"BreadcrumbList\";\n\nexport { MemoizedBreadcrumbList as BreadcrumbList };\n"],"mappings":"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"}
1
+ {"version":3,"file":"Breadcrumbs.js","names":["createContext","memo","useCallback","useContext","useMemo","useState","GroupIcon","HomeIcon","UserIcon","Subordinate","useTranslation","styled","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","BreadcrumbContext","breadcrumbType","BreadcrumbContent","span","Breadcrumb","children","href","iconName","breadcrumbContent","_MenuItem","ariaCurrent","color","_ButtonBase","breadcrumbProviderValue","currentPage","listItem","menuItem","defaultTruncationValue","BreadcrumbList","homeHref","maxVisibleItems","maxVisibleItemsProp","testId","translate","t","anchorEl","setAnchorEl","Math","min","max","length","breadcrumbSections","beforeMenu","insideMenu","remainingBreadcrumbs","menuStart","floor","menuLength","slice","onMenuButtonClick","event","currentTarget","onCloseMenu","_Breadcrumbs","maxItems","map","breadcrumb","Provider","value","onClick","_Menu","open","Boolean","onClose","anchorOrigin","horizontal","vertical","MenuListProps","sx","minWidth","i","MemoizedBreadcrumbList","displayName"],"sources":["../src/Breadcrumbs.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n ButtonBase,\n Menu,\n MenuItem,\n Breadcrumbs as MuiBreadcrumbs,\n} from \"@mui/material\";\nimport {\n MouseEventHandler,\n ReactElement,\n createContext,\n memo,\n useCallback,\n useContext,\n useMemo,\n useState,\n} from \"react\";\nimport { GroupIcon, HomeIcon, UserIcon } from \"./icons.generated\";\nimport { Subordinate } from \"./Typography\";\nimport { useTranslation } from \"react-i18next\";\nimport { HtmlProps } from \"./HtmlProps\";\nimport styled from \"@emotion/styled\";\n\nexport type BreadcrumbType = \"listItem\" | \"menuItem\" | \"currentPage\";\n\nexport type BreadcrumbProps = {\n children?: string;\n href: string;\n iconName?: \"user\" | \"group\";\n};\n\nexport type BreadcrumbsProps = {\n children: ReactElement<typeof Breadcrumb>[];\n homeHref?: string;\n maxVisibleItems?: number;\n} & Pick<HtmlProps, \"testId\" | \"translate\">;\n\nexport type BreadcrumbContextType = {\n breadcrumbType: BreadcrumbType;\n};\n\nexport const BreadcrumbContext = createContext<BreadcrumbContextType>({\n breadcrumbType: \"listItem\",\n});\n\nconst BreadcrumbContent = styled.span`\n white-space: nowrap;\n overflow: hidden;\n max-width: 10rem;\n text-overflow: ellipsis;\n`;\n\nexport const Breadcrumb = ({ children, href, iconName }: BreadcrumbProps) => {\n const { breadcrumbType } = useContext(BreadcrumbContext);\n\n const breadcrumbContent = (\n <>\n {iconName === \"group\" ? (\n <GroupIcon />\n ) : iconName === \"user\" ? (\n <UserIcon />\n ) : null}\n <BreadcrumbContent>{children}</BreadcrumbContent>\n </>\n );\n\n if (breadcrumbType === \"menuItem\") {\n return <MenuItem href={href}>{breadcrumbContent}</MenuItem>;\n }\n\n if (breadcrumbType === \"currentPage\") {\n return (\n <Subordinate ariaCurrent=\"page\" color=\"textPrimary\">\n {breadcrumbContent}\n </Subordinate>\n );\n }\n\n // breadcrumbType === \"listItem\" is the default\n // Provided here without a conditional to get TS to be quiet\n // about potential undefined returns\n return <ButtonBase href={href}>{breadcrumbContent}</ButtonBase>;\n};\n\nconst breadcrumbProviderValue: Record<\n BreadcrumbType,\n { breadcrumbType: BreadcrumbType }\n> = {\n currentPage: {\n breadcrumbType: \"currentPage\",\n },\n listItem: {\n breadcrumbType: \"listItem\",\n },\n menuItem: {\n breadcrumbType: \"menuItem\",\n },\n};\n\nconst defaultTruncationValue = 5;\n\nconst BreadcrumbList = ({\n children,\n homeHref,\n maxVisibleItems: maxVisibleItemsProp = defaultTruncationValue,\n testId,\n translate,\n}: BreadcrumbsProps) => {\n const { t } = useTranslation();\n\n const [anchorEl, setAnchorEl] = useState<HTMLElement | null>(null);\n\n const maxVisibleItems = useMemo(\n () => Math.min(Math.max(maxVisibleItemsProp, 0), children.length),\n [maxVisibleItemsProp, children],\n );\n\n const breadcrumbSections = useMemo(() => {\n if (children.length <= maxVisibleItems) {\n return {\n beforeMenu: [],\n insideMenu: [],\n remainingBreadcrumbs: children,\n };\n } else {\n const menuStart = Math.floor(maxVisibleItems / 2);\n const menuLength = children.length - maxVisibleItems;\n\n return {\n beforeMenu: children.slice(0, menuStart),\n insideMenu: children.slice(menuStart, menuStart + menuLength),\n remainingBreadcrumbs: children.slice(menuStart + menuLength),\n };\n }\n }, [children, maxVisibleItems]);\n\n const onMenuButtonClick = useCallback<MouseEventHandler<HTMLButtonElement>>(\n (event) => setAnchorEl(event.currentTarget),\n [],\n );\n const onCloseMenu = useCallback(() => {\n setAnchorEl(null);\n }, []);\n\n return (\n <MuiBreadcrumbs\n maxItems={children.length + 1}\n aria-label={t(\"breadcrumbs.label.text\")}\n data-se={testId}\n translate={translate}\n >\n {homeHref && (\n <ButtonBase href={homeHref} aria-label={t(\"breadcrumbs.home.text\")}>\n <HomeIcon />\n </ButtonBase>\n )}\n\n {breadcrumbSections.beforeMenu.map((breadcrumb) => (\n <BreadcrumbContext.Provider value={breadcrumbProviderValue.listItem}>\n {breadcrumb}\n </BreadcrumbContext.Provider>\n ))}\n\n {breadcrumbSections.insideMenu.length > 0 && (\n <>\n <ButtonBase onClick={onMenuButtonClick}>...</ButtonBase>\n <Menu\n open={Boolean(anchorEl)}\n onClose={onCloseMenu}\n anchorEl={anchorEl}\n anchorOrigin={{ horizontal: \"left\", vertical: \"bottom\" }}\n MenuListProps={{\n sx: {\n minWidth: 180,\n },\n }}\n >\n <BreadcrumbContext.Provider\n value={breadcrumbProviderValue.menuItem}\n >\n {breadcrumbSections.insideMenu}\n </BreadcrumbContext.Provider>\n </Menu>\n </>\n )}\n\n {breadcrumbSections.remainingBreadcrumbs.map((breadcrumb, i) => {\n if (i === breadcrumbSections.remainingBreadcrumbs.length - 1) {\n return (\n <BreadcrumbContext.Provider\n value={breadcrumbProviderValue.currentPage}\n >\n {breadcrumb}\n </BreadcrumbContext.Provider>\n );\n }\n return (\n <BreadcrumbContext.Provider value={breadcrumbProviderValue.listItem}>\n {breadcrumb}\n </BreadcrumbContext.Provider>\n );\n })}\n </MuiBreadcrumbs>\n );\n};\n\nconst MemoizedBreadcrumbList = memo(BreadcrumbList);\nMemoizedBreadcrumbList.displayName = \"BreadcrumbList\";\n\nexport { MemoizedBreadcrumbList as BreadcrumbList };\n"],"mappings":"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"}
@@ -35,6 +35,7 @@ const MenuItem = ({
35
35
  }
36
36
  }, [onClickProp, closeMenu, shouldCloseOnSelect]);
37
37
  return _jsx(_MenuItem, {
38
+ "aria-current": isSelected,
38
39
  autoFocus: hasInitialFocus,
39
40
  className: variant === "destructive" ? `${menuItemClasses.root}-destructive` : undefined,
40
41
  "data-se": testId,
@@ -1 +1 @@
1
- {"version":3,"file":"MenuItem.js","names":["menuItemClasses","memo","useCallback","useContext","MenuContext","jsx","_jsx","MenuItem","children","hasInitialFocus","isSelected","isDisabled","onClick","onClickProp","testId","value","variant","closeMenu","shouldCloseOnSelect","event","_MenuItem","autoFocus","className","root","undefined","disabled","selected","tabIndex","MemoizedMenuItem","displayName"],"sources":["../../src/Buttons/MenuItem.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n MenuItem as MuiMenuItem,\n MenuItemProps as MuiMenuItemProps,\n} from \"@mui/material\";\nimport { menuItemClasses } from \"@mui/material/MenuItem\";\nimport { memo, useCallback, useContext, type ReactNode } from \"react\";\n\nimport { MenuContext } from \"./MenuContext\";\nimport type { HtmlProps } from \"../HtmlProps\";\n\nexport type MenuItemProps = {\n /**\n * The content of the menu item.\n */\n children: ReactNode;\n /**\n * If `true`, the menu item will receive focus automatically.\n */\n hasInitialFocus?: boolean;\n /**\n * If `true`, the menu item will be visually marked as selected.\n */\n isSelected?: boolean;\n /**\n * If `true`, the menu item will be visually marked as disabled.\n */\n isDisabled?: boolean;\n /**\n * Callback fired when the menu item is clicked.\n */\n onClick?: MuiMenuItemProps[\"onClick\"];\n /**\n * The value associated with the menu item.\n */\n value?: string;\n /**\n * The variant of the menu item.\n * - \"default\": The default variant.\n * - \"destructive\": A variant indicating a destructive action.\n */\n variant?: \"default\" | \"destructive\";\n} & Pick<HtmlProps, \"testId\">;\n\nconst MenuItem = ({\n children,\n hasInitialFocus,\n isSelected,\n isDisabled,\n onClick: onClickProp,\n testId,\n value,\n variant = \"default\",\n}: MenuItemProps) => {\n const { closeMenu, shouldCloseOnSelect } = useContext(MenuContext);\n\n const onClick = useCallback<NonNullable<MuiMenuItemProps[\"onClick\"]>>(\n (event) => {\n onClickProp?.(event);\n if (shouldCloseOnSelect) {\n closeMenu();\n }\n },\n [onClickProp, closeMenu, shouldCloseOnSelect],\n );\n\n return (\n <MuiMenuItem\n /* eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n className={\n variant === \"destructive\"\n ? `${menuItemClasses.root}-destructive`\n : undefined\n }\n data-se={testId}\n disabled={isDisabled}\n onClick={onClick}\n selected={isSelected}\n value={value}\n tabIndex={0}\n >\n {children}\n </MuiMenuItem>\n );\n};\n\nconst MemoizedMenuItem = memo(MenuItem);\nMemoizedMenuItem.displayName = \"MenuItem\";\n\nexport { MemoizedMenuItem as MenuItem };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA,SAASA,eAAe,QAAQ,wBAAwB;AACxD,SAASC,IAAI,EAAEC,WAAW,EAAEC,UAAU,QAAwB,OAAO;AAAC,SAE7DC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoCpB,MAAMC,QAAQ,GAAGA,CAAC;EAChBC,QAAQ;EACRC,eAAe;EACfC,UAAU;EACVC,UAAU;EACVC,OAAO,EAAEC,WAAW;EACpBC,MAAM;EACNC,KAAK;EACLC,OAAO,GAAG;AACG,CAAC,KAAK;EACnB,MAAM;IAAEC,SAAS;IAAEC;EAAoB,CAAC,GAAGf,UAAU,CAACC,WAAW,CAAC;EAElE,MAAMQ,OAAO,GAAGV,WAAW,CACxBiB,KAAK,IAAK;IACTN,WAAW,GAAGM,KAAK,CAAC;IACpB,IAAID,mBAAmB,EAAE;MACvBD,SAAS,CAAC,CAAC;IACb;EACF,CAAC,EACD,CAACJ,WAAW,EAAEI,SAAS,EAAEC,mBAAmB,CAC9C,CAAC;EAED,OACEZ,IAAA,CAAAc,SAAA;IAEEC,SAAS,EAAEZ,eAAgB;IAC3Ba,SAAS,EACPN,OAAO,KAAK,aAAa,GACpB,GAAEhB,eAAe,CAACuB,IAAK,cAAa,GACrCC,SACL;IACD,WAASV,MAAO;IAChBW,QAAQ,EAAEd,UAAW;IACrBC,OAAO,EAAEA,OAAQ;IACjBc,QAAQ,EAAEhB,UAAW;IACrBK,KAAK,EAAEA,KAAM;IACbY,QAAQ,EAAE,CAAE;IAAAnB,QAAA,EAEXA;EAAQ,CACE,CAAC;AAElB,CAAC;AAED,MAAMoB,gBAAgB,GAAG3B,IAAI,CAACM,QAAQ,CAAC;AACvCqB,gBAAgB,CAACC,WAAW,GAAG,UAAU;AAEzC,SAASD,gBAAgB,IAAIrB,QAAQ"}
1
+ {"version":3,"file":"MenuItem.js","names":["menuItemClasses","memo","useCallback","useContext","MenuContext","jsx","_jsx","MenuItem","children","hasInitialFocus","isSelected","isDisabled","onClick","onClickProp","testId","value","variant","closeMenu","shouldCloseOnSelect","event","_MenuItem","autoFocus","className","root","undefined","disabled","selected","tabIndex","MemoizedMenuItem","displayName"],"sources":["../../src/Buttons/MenuItem.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport {\n MenuItem as MuiMenuItem,\n MenuItemProps as MuiMenuItemProps,\n} from \"@mui/material\";\nimport { menuItemClasses } from \"@mui/material/MenuItem\";\nimport { memo, useCallback, useContext, type ReactNode } from \"react\";\n\nimport { MenuContext } from \"./MenuContext\";\nimport type { HtmlProps } from \"../HtmlProps\";\n\nexport type MenuItemProps = {\n /**\n * The content of the menu item.\n */\n children: ReactNode;\n /**\n * If `true`, the menu item will receive focus automatically.\n */\n hasInitialFocus?: boolean;\n /**\n * If `true`, the menu item will be visually marked as selected.\n */\n isSelected?: boolean;\n /**\n * If `true`, the menu item will be visually marked as disabled.\n */\n isDisabled?: boolean;\n /**\n * Callback fired when the menu item is clicked.\n */\n onClick?: MuiMenuItemProps[\"onClick\"];\n /**\n * The value associated with the menu item.\n */\n value?: string;\n /**\n * The variant of the menu item.\n * - \"default\": The default variant.\n * - \"destructive\": A variant indicating a destructive action.\n */\n variant?: \"default\" | \"destructive\";\n} & Pick<HtmlProps, \"testId\">;\n\nconst MenuItem = ({\n children,\n hasInitialFocus,\n isSelected,\n isDisabled,\n onClick: onClickProp,\n testId,\n value,\n variant = \"default\",\n}: MenuItemProps) => {\n const { closeMenu, shouldCloseOnSelect } = useContext(MenuContext);\n\n const onClick = useCallback<NonNullable<MuiMenuItemProps[\"onClick\"]>>(\n (event) => {\n onClickProp?.(event);\n if (shouldCloseOnSelect) {\n closeMenu();\n }\n },\n [onClickProp, closeMenu, shouldCloseOnSelect],\n );\n\n return (\n <MuiMenuItem\n aria-current={isSelected}\n /* eslint-disable-next-line jsx-a11y/no-autofocus */\n autoFocus={hasInitialFocus}\n className={\n variant === \"destructive\"\n ? `${menuItemClasses.root}-destructive`\n : undefined\n }\n data-se={testId}\n disabled={isDisabled}\n onClick={onClick}\n selected={isSelected}\n value={value}\n tabIndex={0}\n >\n {children}\n </MuiMenuItem>\n );\n};\n\nconst MemoizedMenuItem = memo(MenuItem);\nMemoizedMenuItem.displayName = \"MenuItem\";\n\nexport { MemoizedMenuItem as MenuItem };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAMA,SAASA,eAAe,QAAQ,wBAAwB;AACxD,SAASC,IAAI,EAAEC,WAAW,EAAEC,UAAU,QAAwB,OAAO;AAAC,SAE7DC,WAAW;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAoCpB,MAAMC,QAAQ,GAAGA,CAAC;EAChBC,QAAQ;EACRC,eAAe;EACfC,UAAU;EACVC,UAAU;EACVC,OAAO,EAAEC,WAAW;EACpBC,MAAM;EACNC,KAAK;EACLC,OAAO,GAAG;AACG,CAAC,KAAK;EACnB,MAAM;IAAEC,SAAS;IAAEC;EAAoB,CAAC,GAAGf,UAAU,CAACC,WAAW,CAAC;EAElE,MAAMQ,OAAO,GAAGV,WAAW,CACxBiB,KAAK,IAAK;IACTN,WAAW,GAAGM,KAAK,CAAC;IACpB,IAAID,mBAAmB,EAAE;MACvBD,SAAS,CAAC,CAAC;IACb;EACF,CAAC,EACD,CAACJ,WAAW,EAAEI,SAAS,EAAEC,mBAAmB,CAC9C,CAAC;EAED,OACEZ,IAAA,CAAAc,SAAA;IACE,gBAAcV,UAAW;IAEzBW,SAAS,EAAEZ,eAAgB;IAC3Ba,SAAS,EACPN,OAAO,KAAK,aAAa,GACpB,GAAEhB,eAAe,CAACuB,IAAK,cAAa,GACrCC,SACL;IACD,WAASV,MAAO;IAChBW,QAAQ,EAAEd,UAAW;IACrBC,OAAO,EAAEA,OAAQ;IACjBc,QAAQ,EAAEhB,UAAW;IACrBK,KAAK,EAAEA,KAAM;IACbY,QAAQ,EAAE,CAAE;IAAAnB,QAAA,EAEXA;EAAQ,CACE,CAAC;AAElB,CAAC;AAED,MAAMoB,gBAAgB,GAAG3B,IAAI,CAACM,QAAQ,CAAC;AACvCqB,gBAAgB,CAACC,WAAW,GAAG,UAAU;AAEzC,SAASD,gBAAgB,IAAIrB,QAAQ"}
package/dist/Checkbox.js CHANGED
@@ -1,6 +1,6 @@
1
+ import _FormHelperText from "@mui/material/FormHelperText";
1
2
  import _FormControlLabel from "@mui/material/FormControlLabel";
2
3
  import _Checkbox from "@mui/material/Checkbox";
3
- import _FormHelperText from "@mui/material/FormHelperText";
4
4
  /*!
5
5
  * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.
6
6
  * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
@@ -15,12 +15,24 @@ import _FormHelperText from "@mui/material/FormHelperText";
15
15
 
16
16
  import { useTranslation } from "react-i18next";
17
17
  import { memo, useCallback, useMemo, useRef, useImperativeHandle } from "react";
18
+ import styled from "@emotion/styled";
18
19
  import { ComponentControlledState, getControlState } from "./inputUtils.js";
20
+ import { useOdysseyDesignTokens } from "./OdysseyDesignTokensContext.js";
19
21
  import { Typography } from "./Typography.js";
22
+ import { useUniqueId } from "./useUniqueId.js";
20
23
  import { jsx as _jsx } from "react/jsx-runtime";
21
24
  import { jsxs as _jsxs } from "react/jsx-runtime";
22
25
  import { Fragment as _Fragment } from "react/jsx-runtime";
23
26
  export const checkboxValidityValues = ["valid", "invalid", "inherit"];
27
+ const HintContainerWithInlineStartSpacing = styled.div(({
28
+ odysseyDesignTokens
29
+ }) => ({
30
+ paddingInlineStart: `calc(${odysseyDesignTokens.TypographyLineHeightUi}em + ${odysseyDesignTokens.Spacing2})`,
31
+ marginBlockEnd: odysseyDesignTokens.Spacing2,
32
+ ".Mui-error": {
33
+ color: odysseyDesignTokens.TypographyColorSubordinate
34
+ }
35
+ }));
24
36
  const Checkbox = ({
25
37
  ariaLabel,
26
38
  ariaLabelledBy,
@@ -45,6 +57,9 @@ const Checkbox = ({
45
57
  const {
46
58
  t
47
59
  } = useTranslation();
60
+ const odysseyDesignTokens = useOdysseyDesignTokens();
61
+ const id = useUniqueId(idOverride);
62
+ const hintId = hint ? `${id}-hint` : undefined;
48
63
  const controlledStateRef = useRef(getControlState({
49
64
  controlledValue: isChecked,
50
65
  uncontrolledValue: isDefaultChecked
@@ -76,12 +91,9 @@ const Checkbox = ({
76
91
  color: "textSecondary",
77
92
  children: ["(", t("fieldlabel.required.text"), ")"]
78
93
  })]
79
- }), hint && _jsx(_FormHelperText, {
80
- translate: translate,
81
- children: hint
82
94
  })]
83
95
  });
84
- }, [isRequired, labelProp, hint, t, translate]);
96
+ }, [isRequired, labelProp, t, translate]);
85
97
  const onChange = useCallback((event, checked) => {
86
98
  onChangeProp?.(event, checked);
87
99
  }, [onChangeProp]);
@@ -101,38 +113,53 @@ const Checkbox = ({
101
113
  "& .MuiTypography-root": {
102
114
  cursor: "default"
103
115
  }
116
+ }),
117
+ ...(hint && {
118
+ ":not(:last-child)": {
119
+ marginBlockEnd: 0
120
+ }
104
121
  })
105
- }), [isReadOnly]);
106
- return _jsx(_FormControlLabel, {
107
- sx: checkboxStyles,
108
- "aria-label": ariaLabel,
109
- "aria-labelledby": ariaLabelledBy,
110
- className: validity === "invalid" ? "Mui-error" : validity === "valid" ? "Mui-valid" : "",
111
- control: _jsx(_Checkbox, {
112
- ...inputValues,
113
- indeterminate: isIndeterminate,
114
- onChange: onChange,
115
- onClick: onClick,
116
- required: isRequired,
117
- inputProps: {
118
- "data-se": testId,
119
- "aria-readonly": isReadOnly,
120
- readOnly: isReadOnly
121
- },
122
+ }), [hint, isReadOnly]);
123
+ return _jsxs(_Fragment, {
124
+ children: [_jsx(_FormControlLabel, {
125
+ sx: checkboxStyles,
126
+ "aria-label": ariaLabel,
127
+ "aria-labelledby": ariaLabelledBy,
128
+ className: validity === "invalid" ? "Mui-error" : validity === "valid" ? "Mui-valid" : "",
129
+ control: _jsx(_Checkbox, {
130
+ ...inputValues,
131
+ indeterminate: isIndeterminate,
132
+ onChange: onChange,
133
+ onClick: onClick,
134
+ required: isRequired,
135
+ inputProps: {
136
+ "aria-describedby": hintId,
137
+ "aria-readonly": isReadOnly,
138
+ "data-se": testId,
139
+ readOnly: isReadOnly
140
+ },
141
+ disabled: isDisabled,
142
+ inputRef: localInputRef,
143
+ sx: {
144
+ marginBlockStart: "2px"
145
+ }
146
+ }),
122
147
  disabled: isDisabled,
123
- inputRef: localInputRef,
124
- sx: {
125
- marginBlockStart: "2px"
126
- }
127
- }),
128
- disabled: isDisabled,
129
- id: idOverride,
130
- label: label,
131
- name: nameOverride ?? idOverride,
132
- value: value,
133
- required: isRequired,
134
- onBlur: onBlur,
135
- translate: translate
148
+ id: idOverride,
149
+ label: label,
150
+ name: nameOverride ?? idOverride,
151
+ value: value,
152
+ required: isRequired,
153
+ onBlur: onBlur,
154
+ translate: translate
155
+ }), hint && _jsx(HintContainerWithInlineStartSpacing, {
156
+ odysseyDesignTokens: odysseyDesignTokens,
157
+ children: _jsx(_FormHelperText, {
158
+ id: hintId,
159
+ translate: translate,
160
+ children: hint
161
+ })
162
+ })]
136
163
  });
137
164
  };
138
165
  const MemoizedCheckbox = memo(Checkbox);
@@ -1 +1 @@
1
- {"version":3,"file":"Checkbox.js","names":["useTranslation","memo","useCallback","useMemo","useRef","useImperativeHandle","ComponentControlledState","getControlState","Typography","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","checkboxValidityValues","Checkbox","ariaLabel","ariaLabelledBy","id","idOverride","inputRef","isChecked","isDefaultChecked","isDisabled","isIndeterminate","isReadOnly","isRequired","label","labelProp","hint","name","nameOverride","onChange","onChangeProp","onBlur","onBlurProp","testId","translate","validity","value","t","controlledStateRef","controlledValue","uncontrolledValue","inputValues","current","CONTROLLED","checked","defaultChecked","localInputRef","focus","children","component","color","_FormHelperText","event","onClick","stopPropagation","preventDefault","checkboxStyles","alignItems","cursor","_FormControlLabel","sx","className","control","_Checkbox","indeterminate","required","inputProps","readOnly","disabled","marginBlockStart","MemoizedCheckbox","displayName"],"sources":["../src/Checkbox.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useTranslation } from \"react-i18next\";\nimport { memo, useCallback, useMemo, useRef, useImperativeHandle } from \"react\";\nimport {\n Checkbox as MuiCheckbox,\n CheckboxProps as MuiCheckboxProps,\n FormControlLabel,\n FormControlLabelProps as MuiFormControlLabelProps,\n FormHelperText,\n} from \"@mui/material\";\n\nimport { CheckedFieldProps } from \"./FormCheckedProps\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n ComponentControlledState,\n FocusHandle,\n getControlState,\n} from \"./inputUtils\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport { Typography } from \"./Typography\";\n\nexport const checkboxValidityValues = [\"valid\", \"invalid\", \"inherit\"] as const;\n\nexport type CheckboxProps = {\n /**\n * The ref forwarded to the Checkbox\n */\n inputRef?: React.RefObject<FocusHandle>;\n /**\n * Determines whether the Checkbox is in an indeterminate state\n */\n isIndeterminate?: boolean;\n /**\n * Determines whether the Checkbox is required\n */\n isRequired?: boolean;\n /**\n * The label text for the Checkbox\n */\n label?: string;\n /**\n * The checkbox validity, if different from its enclosing group. Defaults to \"inherit\".\n */\n validity?: (typeof checkboxValidityValues)[number];\n /**\n * The value attribute of the Checkbox\n */\n value?: string;\n /**\n * Callback fired when the blur event happens. Provides event value.\n */\n onBlur?: MuiFormControlLabelProps[\"onBlur\"];\n} & Pick<\n FieldComponentProps,\n \"hint\" | \"id\" | \"isDisabled\" | \"isReadOnly\" | \"name\"\n> &\n CheckedFieldProps<MuiCheckboxProps> &\n Pick<HtmlProps, \"ariaLabel\" | \"ariaLabelledBy\" | \"testId\" | \"translate\">;\n\nconst Checkbox = ({\n ariaLabel,\n ariaLabelledBy,\n id: idOverride,\n inputRef,\n isChecked,\n isDefaultChecked,\n isDisabled,\n isIndeterminate,\n isReadOnly = false,\n isRequired,\n label: labelProp,\n hint,\n name: nameOverride,\n onChange: onChangeProp,\n onBlur: onBlurProp,\n testId,\n translate,\n validity = \"inherit\",\n value,\n}: CheckboxProps) => {\n const { t } = useTranslation();\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: isChecked,\n uncontrolledValue: isDefaultChecked,\n }),\n );\n const inputValues = useMemo(() => {\n if (controlledStateRef.current === ComponentControlledState.CONTROLLED) {\n return { checked: isChecked };\n }\n return { defaultChecked: isDefaultChecked };\n }, [isDefaultChecked, isChecked]);\n\n const localInputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(\n inputRef,\n () => ({\n focus: () => {\n localInputRef.current?.focus();\n },\n }),\n [],\n );\n\n const label = useMemo(() => {\n return (\n <>\n <Typography component=\"span\">{labelProp}</Typography>\n {isRequired && (\n <>\n {\" \"}\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.required.text\")})\n </Typography>\n </>\n )}\n {hint && <FormHelperText translate={translate}>{hint}</FormHelperText>}\n </>\n );\n }, [isRequired, labelProp, hint, t, translate]);\n\n const onChange = useCallback<NonNullable<MuiCheckboxProps[\"onChange\"]>>(\n (event, checked) => {\n onChangeProp?.(event, checked);\n },\n [onChangeProp],\n );\n\n const onClick = useCallback<NonNullable<MuiCheckboxProps[\"onClick\"]>>(\n (event) => {\n if (isReadOnly) {\n event.stopPropagation();\n event.preventDefault();\n }\n },\n [isReadOnly],\n );\n\n const onBlur = useCallback<NonNullable<MuiFormControlLabelProps[\"onBlur\"]>>(\n (event) => {\n onBlurProp?.(event);\n },\n [onBlurProp],\n );\n\n const checkboxStyles = useMemo(\n () => ({\n alignItems: \"flex-start\",\n ...(isReadOnly && {\n cursor: \"default\",\n \"& .MuiTypography-root\": {\n cursor: \"default\",\n },\n }),\n }),\n [isReadOnly],\n );\n\n return (\n <FormControlLabel\n sx={checkboxStyles}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={\n validity === \"invalid\"\n ? \"Mui-error\"\n : validity === \"valid\"\n ? \"Mui-valid\"\n : \"\"\n }\n control={\n <MuiCheckbox\n {...inputValues}\n indeterminate={isIndeterminate}\n onChange={onChange}\n onClick={\n onClick as unknown as React.MouseEventHandler<HTMLButtonElement>\n }\n required={isRequired}\n inputProps={{\n \"data-se\": testId,\n \"aria-readonly\": isReadOnly,\n readOnly: isReadOnly,\n }}\n disabled={isDisabled}\n inputRef={localInputRef}\n sx={{\n marginBlockStart: \"2px\",\n }}\n />\n }\n disabled={isDisabled}\n id={idOverride}\n label={label}\n name={nameOverride ?? idOverride}\n value={value}\n required={isRequired}\n onBlur={onBlur}\n translate={translate}\n />\n );\n};\n\nconst MemoizedCheckbox = memo(Checkbox);\nMemoizedCheckbox.displayName = \"Checkbox\";\n\nexport { MemoizedCheckbox as Checkbox };\n"],"mappings":"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"}
1
+ {"version":3,"file":"Checkbox.js","names":["useTranslation","memo","useCallback","useMemo","useRef","useImperativeHandle","styled","ComponentControlledState","getControlState","useOdysseyDesignTokens","Typography","useUniqueId","jsx","_jsx","jsxs","_jsxs","Fragment","_Fragment","checkboxValidityValues","HintContainerWithInlineStartSpacing","div","odysseyDesignTokens","paddingInlineStart","TypographyLineHeightUi","Spacing2","marginBlockEnd","color","TypographyColorSubordinate","Checkbox","ariaLabel","ariaLabelledBy","id","idOverride","inputRef","isChecked","isDefaultChecked","isDisabled","isIndeterminate","isReadOnly","isRequired","label","labelProp","hint","name","nameOverride","onChange","onChangeProp","onBlur","onBlurProp","testId","translate","validity","value","t","hintId","undefined","controlledStateRef","controlledValue","uncontrolledValue","inputValues","current","CONTROLLED","checked","defaultChecked","localInputRef","focus","children","component","event","onClick","stopPropagation","preventDefault","checkboxStyles","alignItems","cursor","_FormControlLabel","sx","className","control","_Checkbox","indeterminate","required","inputProps","readOnly","disabled","marginBlockStart","_FormHelperText","MemoizedCheckbox","displayName"],"sources":["../src/Checkbox.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2022-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { useTranslation } from \"react-i18next\";\nimport { memo, useCallback, useMemo, useRef, useImperativeHandle } from \"react\";\nimport {\n Checkbox as MuiCheckbox,\n CheckboxProps as MuiCheckboxProps,\n FormControlLabel,\n FormControlLabelProps as MuiFormControlLabelProps,\n FormHelperText,\n} from \"@mui/material\";\nimport styled from \"@emotion/styled\";\n\nimport { CheckedFieldProps } from \"./FormCheckedProps\";\nimport type { HtmlProps } from \"./HtmlProps\";\nimport {\n ComponentControlledState,\n FocusHandle,\n getControlState,\n} from \"./inputUtils\";\nimport { FieldComponentProps } from \"./FieldComponentProps\";\nimport {\n useOdysseyDesignTokens,\n DesignTokens,\n} from \"./OdysseyDesignTokensContext\";\nimport { Typography } from \"./Typography\";\nimport { useUniqueId } from \"./useUniqueId\";\n\nexport const checkboxValidityValues = [\"valid\", \"invalid\", \"inherit\"] as const;\n\nconst HintContainerWithInlineStartSpacing = styled.div<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n paddingInlineStart: `calc(${odysseyDesignTokens.TypographyLineHeightUi}em + ${odysseyDesignTokens.Spacing2})`,\n marginBlockEnd: odysseyDesignTokens.Spacing2,\n\n // MUI applies the '.Mui-error' class to this hint text when the checkbox is invalid which turns the copy red\n // We want to keep the hint text gray in the error state\n \".Mui-error\": {\n color: odysseyDesignTokens.TypographyColorSubordinate,\n },\n}));\n\nexport type CheckboxProps = {\n /**\n * The ref forwarded to the Checkbox\n */\n inputRef?: React.RefObject<FocusHandle>;\n /**\n * Determines whether the Checkbox is in an indeterminate state\n */\n isIndeterminate?: boolean;\n /**\n * Determines whether the Checkbox is required\n */\n isRequired?: boolean;\n /**\n * The label text for the Checkbox\n */\n label?: string;\n /**\n * The checkbox validity, if different from its enclosing group. Defaults to \"inherit\".\n */\n validity?: (typeof checkboxValidityValues)[number];\n /**\n * The value attribute of the Checkbox\n */\n value?: string;\n /**\n * Callback fired when the blur event happens. Provides event value.\n */\n onBlur?: MuiFormControlLabelProps[\"onBlur\"];\n} & Pick<\n FieldComponentProps,\n \"hint\" | \"id\" | \"isDisabled\" | \"isReadOnly\" | \"name\"\n> &\n CheckedFieldProps<MuiCheckboxProps> &\n Pick<HtmlProps, \"ariaLabel\" | \"ariaLabelledBy\" | \"testId\" | \"translate\">;\n\nconst Checkbox = ({\n ariaLabel,\n ariaLabelledBy,\n id: idOverride,\n inputRef,\n isChecked,\n isDefaultChecked,\n isDisabled,\n isIndeterminate,\n isReadOnly = false,\n isRequired,\n label: labelProp,\n hint,\n name: nameOverride,\n onChange: onChangeProp,\n onBlur: onBlurProp,\n testId,\n translate,\n validity = \"inherit\",\n value,\n}: CheckboxProps) => {\n const { t } = useTranslation();\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const id = useUniqueId(idOverride);\n const hintId = hint ? `${id}-hint` : undefined;\n\n const controlledStateRef = useRef(\n getControlState({\n controlledValue: isChecked,\n uncontrolledValue: isDefaultChecked,\n }),\n );\n const inputValues = useMemo(() => {\n if (controlledStateRef.current === ComponentControlledState.CONTROLLED) {\n return { checked: isChecked };\n }\n return { defaultChecked: isDefaultChecked };\n }, [isDefaultChecked, isChecked]);\n\n const localInputRef = useRef<HTMLInputElement>(null);\n useImperativeHandle(\n inputRef,\n () => ({\n focus: () => {\n localInputRef.current?.focus();\n },\n }),\n [],\n );\n\n const label = useMemo(() => {\n return (\n <>\n <Typography component=\"span\">{labelProp}</Typography>\n {isRequired && (\n <>\n {\" \"}\n <Typography component=\"span\" color=\"textSecondary\">\n ({t(\"fieldlabel.required.text\")})\n </Typography>\n </>\n )}\n </>\n );\n }, [isRequired, labelProp, t, translate]);\n\n const onChange = useCallback<NonNullable<MuiCheckboxProps[\"onChange\"]>>(\n (event, checked) => {\n onChangeProp?.(event, checked);\n },\n [onChangeProp],\n );\n\n const onClick = useCallback<NonNullable<MuiCheckboxProps[\"onClick\"]>>(\n (event) => {\n if (isReadOnly) {\n event.stopPropagation();\n event.preventDefault();\n }\n },\n [isReadOnly],\n );\n\n const onBlur = useCallback<NonNullable<MuiFormControlLabelProps[\"onBlur\"]>>(\n (event) => {\n onBlurProp?.(event);\n },\n [onBlurProp],\n );\n\n const checkboxStyles = useMemo(\n () => ({\n alignItems: \"flex-start\",\n\n ...(isReadOnly && {\n cursor: \"default\",\n \"& .MuiTypography-root\": {\n cursor: \"default\",\n },\n }),\n\n ...(hint && {\n // needed to override specific :not(:last-child) selector\n \":not(:last-child)\": {\n marginBlockEnd: 0,\n },\n }),\n }),\n [hint, isReadOnly],\n );\n\n return (\n <>\n <FormControlLabel\n sx={checkboxStyles}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n className={\n validity === \"invalid\"\n ? \"Mui-error\"\n : validity === \"valid\"\n ? \"Mui-valid\"\n : \"\"\n }\n control={\n <MuiCheckbox\n {...inputValues}\n indeterminate={isIndeterminate}\n onChange={onChange}\n onClick={\n onClick as unknown as React.MouseEventHandler<HTMLButtonElement>\n }\n required={isRequired}\n inputProps={{\n \"aria-describedby\": hintId,\n \"aria-readonly\": isReadOnly,\n \"data-se\": testId,\n readOnly: isReadOnly,\n }}\n disabled={isDisabled}\n inputRef={localInputRef}\n sx={{\n marginBlockStart: \"2px\",\n }}\n />\n }\n disabled={isDisabled}\n id={idOverride}\n label={label}\n name={nameOverride ?? idOverride}\n value={value}\n required={isRequired}\n onBlur={onBlur}\n translate={translate}\n />\n {hint && (\n <HintContainerWithInlineStartSpacing\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <FormHelperText id={hintId} translate={translate}>\n {hint}\n </FormHelperText>\n </HintContainerWithInlineStartSpacing>\n )}\n </>\n );\n};\n\nconst MemoizedCheckbox = memo(Checkbox);\nMemoizedCheckbox.displayName = \"Checkbox\";\n\nexport { MemoizedCheckbox as Checkbox };\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"reorderDataRowsLocally.js","names":["reorderDataRowsLocally","currentData","rowId","newRowIndex","updatedData","rowIndex","findIndex","row","id","length","console","warn","removedRow","splice"],"sources":["../../src/DataTable/reorderDataRowsLocally.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { MRT_RowData } from \"material-react-table\";\n\n/**\n * Reorders data rows locally.\n *\n * @param currentData - The current array of data rows.\n * @param rowId - The ID of the row to move.\n * @param newIndex - The new index to move the row to.\n * @returns A new array of data with the row moved to the specified index.\n */\nexport const reorderDataRowsLocally = ({\n currentData,\n rowId,\n newRowIndex,\n}: {\n currentData: MRT_RowData[];\n rowId: string;\n newRowIndex: number;\n}): MRT_RowData[] => {\n const updatedData = [...currentData];\n const rowIndex = updatedData.findIndex((row) => row.id === rowId);\n\n // Ensure the row exists and the new index is within bounds\n if (rowIndex === -1 || newRowIndex < 0 || newRowIndex >= updatedData.length) {\n console.warn(\"Invalid row ID or newIndex; cannot reorder rows.\");\n return updatedData; // Return the original data if conditions aren't met\n }\n\n // Remove the row from its current position\n const [removedRow] = updatedData.splice(rowIndex, 1);\n\n // Insert the row at the new index\n updatedData.splice(newRowIndex, 0, removedRow);\n\n return updatedData;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAYA,OAAO,MAAMA,sBAAsB,GAAGA,CAAC;EACrCC,WAAW;EACXC,KAAK;EACLC;AAKF,CAAC,KAAoB;EACnB,MAAMC,WAAW,GAAG,CAAC,GAAGH,WAAW,CAAC;EACpC,MAAMI,QAAQ,GAAGD,WAAW,CAACE,SAAS,CAAEC,GAAG,IAAKA,GAAG,CAACC,EAAE,KAAKN,KAAK,CAAC;EAGjE,IAAIG,QAAQ,KAAK,CAAC,CAAC,IAAIF,WAAW,GAAG,CAAC,IAAIA,WAAW,IAAIC,WAAW,CAACK,MAAM,EAAE;IAC3EC,OAAO,CAACC,IAAI,CAAC,kDAAkD,CAAC;IAChE,OAAOP,WAAW;EACpB;EAGA,MAAM,CAACQ,UAAU,CAAC,GAAGR,WAAW,CAACS,MAAM,CAACR,QAAQ,EAAE,CAAC,CAAC;EAGpDD,WAAW,CAACS,MAAM,CAACV,WAAW,EAAE,CAAC,EAAES,UAAU,CAAC;EAE9C,OAAOR,WAAW;AACpB,CAAC"}
1
+ {"version":3,"file":"reorderDataRowsLocally.js","names":["reorderDataRowsLocally","currentData","rowId","newRowIndex","updatedData","rowIndex","findIndex","row","id","length","console","warn","removedRow","splice"],"sources":["../../src/DataTable/reorderDataRowsLocally.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { MRT_RowData } from \"material-react-table\";\n\n/**\n * Reorders data rows locally.\n *\n * @param currentData - The current array of data rows.\n * @param rowId - The ID of the row to move.\n * @param newIndex - The new index to move the row to.\n * @returns A new array of data with the row moved to the specified index.\n */\nexport const reorderDataRowsLocally = <TData extends MRT_RowData>({\n currentData,\n rowId,\n newRowIndex,\n}: {\n currentData: TData[];\n rowId: string;\n newRowIndex: number;\n}): TData[] => {\n const updatedData = [...currentData];\n const rowIndex = updatedData.findIndex((row) => row.id === rowId);\n\n // Ensure the row exists and the new index is within bounds\n if (rowIndex === -1 || newRowIndex < 0 || newRowIndex >= updatedData.length) {\n console.warn(\"Invalid row ID or newIndex; cannot reorder rows.\");\n return updatedData; // Return the original data if conditions aren't met\n }\n\n // Remove the row from its current position\n const [removedRow] = updatedData.splice(rowIndex, 1);\n\n // Insert the row at the new index\n updatedData.splice(newRowIndex, 0, removedRow);\n\n return updatedData;\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,GAYA,OAAO,MAAMA,sBAAsB,GAAGA,CAA4B;EAChEC,WAAW;EACXC,KAAK;EACLC;AAKF,CAAC,KAAc;EACb,MAAMC,WAAW,GAAG,CAAC,GAAGH,WAAW,CAAC;EACpC,MAAMI,QAAQ,GAAGD,WAAW,CAACE,SAAS,CAAEC,GAAG,IAAKA,GAAG,CAACC,EAAE,KAAKN,KAAK,CAAC;EAGjE,IAAIG,QAAQ,KAAK,CAAC,CAAC,IAAIF,WAAW,GAAG,CAAC,IAAIA,WAAW,IAAIC,WAAW,CAACK,MAAM,EAAE;IAC3EC,OAAO,CAACC,IAAI,CAAC,kDAAkD,CAAC;IAChE,OAAOP,WAAW;EACpB;EAGA,MAAM,CAACQ,UAAU,CAAC,GAAGR,WAAW,CAACS,MAAM,CAACR,QAAQ,EAAE,CAAC,CAAC;EAGpDD,WAAW,CAACS,MAAM,CAACV,WAAW,EAAE,CAAC,EAAES,UAAU,CAAC;EAE9C,OAAOR,WAAW;AACpB,CAAC"}
@@ -1 +1 @@
1
- {"version":3,"file":"useRowReordering.js","names":["reorderDataRowsLocally","useOdysseyDesignTokens","useRowReordering","totalRows","onReorderRows","data","setData","draggingRow","setDraggingRow","resultsPerPage","page","updateRowOrder","rowId","newRowIndex","newData","currentData","odysseyDesignTokens","dragHandleStyles","padding","Spacing1","borderRadius","BorderRadiusMain","boxShadow","HueNeutralWhite","PalettePrimaryMain","outline","outlineOffset","dragHandleText","title","draggableTableBodyRowClassName","currentRowId","draggingRowId","hoveredRowId","undefined","setHoveredRow","table","id","nextRow","getRow","handleDragHandleKeyDown","row","event","hoveredRow","getState","key","isSpaceKey","isEnterKey","isEscapeKey","isArrowDown","isArrowUp","isSpaceOrEnter","zeroIndexedPageNumber","currentIndex","index","resetDraggingAndHoveredRow","preventDefault","stopPropagation","pageRelativeIndex","setTimeout","TransitionDurationMainAsNumber","nextIndex","handleDragHandleOnDragEnd","cols","getAllColumns","toggleVisibility","handleDragHandleOnDragCapture"],"sources":["../../src/DataTable/useRowReordering.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Dispatch, SetStateAction, KeyboardEvent } from \"react\";\nimport { DataTableProps } from \"./DataTable\";\nimport { reorderDataRowsLocally } from \"./reorderDataRowsLocally\";\nimport { useOdysseyDesignTokens } from \"../OdysseyDesignTokensContext\";\nimport { MRT_Row, MRT_RowData, MRT_TableInstance } from \"material-react-table\";\n\nexport const useRowReordering = ({\n totalRows,\n onReorderRows,\n data,\n setData,\n draggingRow,\n setDraggingRow,\n resultsPerPage,\n page,\n}: {\n totalRows: DataTableProps[\"totalRows\"];\n onReorderRows: DataTableProps[\"onReorderRows\"];\n data: MRT_RowData[];\n setData: Dispatch<SetStateAction<MRT_RowData[]>>;\n draggingRow?: MRT_Row<MRT_RowData> | null;\n setDraggingRow: Dispatch<\n SetStateAction<MRT_Row<MRT_RowData> | null | undefined>\n >;\n resultsPerPage: number;\n page: number;\n}) => {\n const updateRowOrder = ({\n rowId,\n newRowIndex,\n }: {\n rowId: string;\n newRowIndex: number;\n }) => {\n if (newRowIndex < 0) {\n return;\n }\n\n // Needs to include the totalRows check because totalRows might not\n // be set. If it isn't set, this whole check doesn't matter.\n if (totalRows && newRowIndex > totalRows) {\n return;\n }\n\n const newData = reorderDataRowsLocally({\n currentData: data,\n rowId,\n newRowIndex,\n });\n\n setData(newData);\n onReorderRows?.({ rowId, newRowIndex });\n };\n\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const dragHandleStyles = {\n padding: odysseyDesignTokens.Spacing1,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n\n \"&:focus-visible\": {\n boxShadow: `0 0 0 2px ${odysseyDesignTokens.HueNeutralWhite}, 0 0 0 4px ${odysseyDesignTokens.PalettePrimaryMain}`,\n outline: \"2px solid transparent\",\n outlineOffset: \"1px\",\n },\n };\n\n const dragHandleText = {\n title: \"Drag row or press space/enter key to start and stop reordering\",\n \"aria-label\":\n \"Drag row to reorder. Or, press space or enter to start and stop reordering and esc to cancel.\",\n };\n\n const draggableTableBodyRowClassName = ({\n currentRowId,\n draggingRowId,\n hoveredRowId,\n }: {\n currentRowId: string;\n draggingRowId?: string;\n hoveredRowId?: string;\n }) => {\n if (draggingRowId === currentRowId && hoveredRowId !== currentRowId) {\n return \"isDragging\";\n }\n\n if (hoveredRowId === currentRowId && draggingRowId !== currentRowId) {\n return \"isDragTarget\";\n }\n\n if (draggingRowId === currentRowId && hoveredRowId === currentRowId) {\n return \"isDragging isDragTarget\";\n }\n\n return undefined;\n };\n\n const setHoveredRow = (\n table: MRT_TableInstance<MRT_RowData>,\n id: MRT_RowData[\"id\"],\n ) => {\n if (id) {\n const nextRow: MRT_RowData = table.getRow(id);\n\n if (nextRow) {\n table.setHoveredRow(nextRow);\n }\n }\n };\n\n type HandleDragHandleKeyDownArgs = {\n table: MRT_TableInstance<MRT_RowData>;\n row: MRT_Row<MRT_RowData>;\n event: KeyboardEvent<HTMLButtonElement>;\n };\n\n const handleDragHandleKeyDown = ({\n table,\n row,\n event,\n }: HandleDragHandleKeyDownArgs) => {\n const { hoveredRow } = table.getState();\n\n const { key } = event;\n\n const isSpaceKey = key === \" \";\n const isEnterKey = key === \"Enter\";\n const isEscapeKey = key === \"Escape\";\n const isArrowDown = key === \"ArrowDown\";\n const isArrowUp = key === \"ArrowUp\";\n const isSpaceOrEnter = isSpaceKey || isEnterKey;\n const zeroIndexedPageNumber = page - 1;\n const currentIndex = row.index + zeroIndexedPageNumber * resultsPerPage;\n\n if (isEscapeKey) {\n resetDraggingAndHoveredRow(table);\n return;\n }\n\n if (isSpaceOrEnter) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (draggingRow) {\n if (typeof hoveredRow?.index === \"number\") {\n const { index } = hoveredRow;\n\n if (isSpaceOrEnter) {\n const pageRelativeIndex =\n index + zeroIndexedPageNumber * resultsPerPage;\n\n if (pageRelativeIndex !== currentIndex) {\n updateRowOrder({\n rowId: row.id,\n newRowIndex: pageRelativeIndex,\n });\n\n // Can't transition CSS hover effect. Use timeout to delay hovered row effect removal\n setTimeout(() => {\n resetDraggingAndHoveredRow(table);\n }, odysseyDesignTokens.TransitionDurationMainAsNumber);\n return;\n }\n }\n\n if (isArrowDown || isArrowUp) {\n const nextIndex = isArrowDown ? index + 1 : index - 1;\n setHoveredRow(table, data[nextIndex]?.id);\n }\n } else {\n if (isArrowDown || isArrowUp) {\n const nextIndex = isArrowDown ? row.index + 1 : row.index - 1;\n setHoveredRow(table, data[nextIndex]?.id);\n }\n }\n } else {\n if (isSpaceOrEnter) {\n setDraggingRow(row);\n }\n }\n };\n\n const handleDragHandleOnDragEnd = (table: MRT_TableInstance<MRT_RowData>) => {\n const cols = table.getAllColumns();\n cols[0].toggleVisibility();\n\n const { draggingRow, hoveredRow } = table.getState();\n if (draggingRow) {\n updateRowOrder({\n rowId: draggingRow.id,\n newRowIndex: (hoveredRow as MRT_RowData).index,\n });\n }\n\n setDraggingRow(null);\n };\n\n const handleDragHandleOnDragCapture = (\n table: MRT_TableInstance<MRT_RowData>,\n ) => {\n if (!draggingRow && table.getState().draggingRow?.id) {\n setDraggingRow(table.getState().draggingRow);\n }\n };\n\n const resetDraggingAndHoveredRow = (\n table: MRT_TableInstance<MRT_RowData>,\n ) => {\n setDraggingRow(null);\n table.setHoveredRow(null);\n };\n\n return {\n dragHandleStyles,\n dragHandleText,\n draggableTableBodyRowClassName,\n handleDragHandleKeyDown,\n handleDragHandleOnDragCapture,\n handleDragHandleOnDragEnd,\n resetDraggingAndHoveredRow,\n updateRowOrder,\n };\n};\n"],"mappings":"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"}
1
+ {"version":3,"file":"useRowReordering.js","names":["reorderDataRowsLocally","useOdysseyDesignTokens","useRowReordering","totalRows","onReorderRows","data","setData","draggingRow","setDraggingRow","resultsPerPage","page","updateRowOrder","rowId","newRowIndex","newData","currentData","odysseyDesignTokens","dragHandleStyles","padding","Spacing1","borderRadius","BorderRadiusMain","boxShadow","HueNeutralWhite","PalettePrimaryMain","outline","outlineOffset","dragHandleText","title","draggableTableBodyRowClassName","currentRowId","draggingRowId","hoveredRowId","undefined","setHoveredRow","table","id","nextRow","getRow","handleDragHandleKeyDown","row","event","hoveredRow","getState","key","isSpaceKey","isEnterKey","isEscapeKey","isArrowDown","isArrowUp","isSpaceOrEnter","zeroIndexedPageNumber","currentIndex","index","resetDraggingAndHoveredRow","preventDefault","stopPropagation","pageRelativeIndex","setTimeout","TransitionDurationMainAsNumber","nextIndex","handleDragHandleOnDragEnd","cols","getAllColumns","toggleVisibility","handleDragHandleOnDragCapture"],"sources":["../../src/DataTable/useRowReordering.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { Dispatch, SetStateAction, KeyboardEvent } from \"react\";\nimport { DataTableProps } from \"./DataTable\";\nimport { reorderDataRowsLocally } from \"./reorderDataRowsLocally\";\nimport { useOdysseyDesignTokens } from \"../OdysseyDesignTokensContext\";\nimport { MRT_Row, MRT_RowData, MRT_TableInstance } from \"material-react-table\";\n\nexport const useRowReordering = <TData extends MRT_RowData>({\n totalRows,\n onReorderRows,\n data,\n setData,\n draggingRow,\n setDraggingRow,\n resultsPerPage,\n page,\n}: {\n totalRows: DataTableProps[\"totalRows\"];\n onReorderRows: DataTableProps[\"onReorderRows\"];\n data: TData[];\n setData: Dispatch<SetStateAction<TData[]>>;\n draggingRow?: MRT_Row<TData> | null;\n setDraggingRow: Dispatch<SetStateAction<MRT_Row<TData> | null | undefined>>;\n resultsPerPage: number;\n page: number;\n}) => {\n const updateRowOrder = ({\n rowId,\n newRowIndex,\n }: {\n rowId: string;\n newRowIndex: number;\n }) => {\n if (newRowIndex < 0) {\n return;\n }\n\n // Needs to include the totalRows check because totalRows might not\n // be set. If it isn't set, this whole check doesn't matter.\n if (totalRows && newRowIndex > totalRows) {\n return;\n }\n\n const newData = reorderDataRowsLocally({\n currentData: data,\n rowId,\n newRowIndex,\n });\n\n setData(newData);\n onReorderRows?.({ rowId, newRowIndex });\n };\n\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const dragHandleStyles = {\n padding: odysseyDesignTokens.Spacing1,\n borderRadius: odysseyDesignTokens.BorderRadiusMain,\n \"&:focus-visible\": {\n boxShadow: `0 0 0 2px ${odysseyDesignTokens.HueNeutralWhite}, 0 0 0 4px ${odysseyDesignTokens.PalettePrimaryMain}`,\n outline: \"2px solid transparent\",\n outlineOffset: \"1px\",\n },\n };\n\n const dragHandleText = {\n title: \"Drag row or press space/enter key to start and stop reordering\",\n \"aria-label\":\n \"Drag row to reorder. Or, press space or enter to start and stop reordering and esc to cancel.\",\n };\n\n const draggableTableBodyRowClassName = ({\n currentRowId,\n draggingRowId,\n hoveredRowId,\n }: {\n currentRowId: string;\n draggingRowId?: string;\n hoveredRowId?: string;\n }) => {\n if (draggingRowId === currentRowId && hoveredRowId !== currentRowId) {\n return \"isDragging\";\n }\n\n if (hoveredRowId === currentRowId && draggingRowId !== currentRowId) {\n return \"isDragTarget\";\n }\n\n if (draggingRowId === currentRowId && hoveredRowId === currentRowId) {\n return \"isDragging isDragTarget\";\n }\n\n return undefined;\n };\n\n const setHoveredRow = (table: MRT_TableInstance<TData>, id: TData[\"id\"]) => {\n if (id) {\n // The `as MRT_Row<TData>` is necessary here to overcome some type/generic\n // issues with the type of `setHoveredRow` defined by MRT. It's not ideal code,\n // but it's the only way that works without a much larger rewrite.\n const nextRow = table.getRow(id) as MRT_Row<TData>;\n\n if (nextRow) {\n table.setHoveredRow(nextRow);\n }\n }\n };\n\n type HandleDragHandleKeyDownArgs = {\n table: MRT_TableInstance<TData>;\n row: MRT_Row<TData>;\n event: KeyboardEvent<HTMLButtonElement>;\n };\n\n const handleDragHandleKeyDown = ({\n table,\n row,\n event,\n }: HandleDragHandleKeyDownArgs) => {\n const { hoveredRow } = table.getState();\n\n const { key } = event;\n\n const isSpaceKey = key === \" \";\n const isEnterKey = key === \"Enter\";\n const isEscapeKey = key === \"Escape\";\n const isArrowDown = key === \"ArrowDown\";\n const isArrowUp = key === \"ArrowUp\";\n const isSpaceOrEnter = isSpaceKey || isEnterKey;\n const zeroIndexedPageNumber = page - 1;\n const currentIndex = row.index + zeroIndexedPageNumber * resultsPerPage;\n\n if (isEscapeKey) {\n resetDraggingAndHoveredRow(table);\n return;\n }\n\n if (isSpaceOrEnter) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n if (draggingRow) {\n if (typeof hoveredRow?.index === \"number\") {\n const { index } = hoveredRow;\n\n if (isSpaceOrEnter) {\n const pageRelativeIndex =\n index + zeroIndexedPageNumber * resultsPerPage;\n\n if (pageRelativeIndex !== currentIndex) {\n updateRowOrder({\n rowId: row.id,\n newRowIndex: pageRelativeIndex,\n });\n\n // Can't transition CSS hover effect. Use timeout to delay hovered row effect removal\n setTimeout(() => {\n resetDraggingAndHoveredRow(table);\n }, odysseyDesignTokens.TransitionDurationMainAsNumber);\n return;\n }\n }\n\n if (isArrowDown || isArrowUp) {\n const nextIndex = isArrowDown ? index + 1 : index - 1;\n setHoveredRow(table, data[nextIndex]?.id);\n }\n } else {\n if (isArrowDown || isArrowUp) {\n const nextIndex = isArrowDown ? row.index + 1 : row.index - 1;\n setHoveredRow(table, data[nextIndex]?.id);\n }\n }\n } else {\n if (isSpaceOrEnter) {\n setDraggingRow(row);\n }\n }\n };\n\n const handleDragHandleOnDragEnd = (table: MRT_TableInstance<TData>) => {\n const cols = table.getAllColumns();\n cols[0].toggleVisibility();\n\n const { draggingRow, hoveredRow } = table.getState();\n if (draggingRow) {\n updateRowOrder({\n rowId: draggingRow.id,\n newRowIndex: (hoveredRow as TData).index,\n });\n }\n\n setDraggingRow(null);\n };\n\n const handleDragHandleOnDragCapture = (table: MRT_TableInstance<TData>) => {\n if (!draggingRow && table.getState().draggingRow?.id) {\n setDraggingRow(table.getState().draggingRow);\n }\n };\n\n const resetDraggingAndHoveredRow = (table: MRT_TableInstance<TData>) => {\n setDraggingRow(null);\n table.setHoveredRow(null);\n };\n\n return {\n dragHandleStyles,\n dragHandleText,\n draggableTableBodyRowClassName,\n handleDragHandleKeyDown,\n handleDragHandleOnDragCapture,\n handleDragHandleOnDragEnd,\n resetDraggingAndHoveredRow,\n updateRowOrder,\n };\n};\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"HtmlProps.js","names":[],"sources":["../src/HtmlProps.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { HTMLAttributes } from \"react\";\n\nexport type HtmlProps = {\n /**\n * Used in [ARIA live regions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions), the global aria-busy state indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update.\n */\n ariaBusy?: HTMLAttributes<HTMLElement>[\"aria-busy\"];\n /**\n * The `aria-checked` attribute indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets.\n *\n * NOTE: Where possible use an HTML `<input>` element with `type=\"checkbox\"` and `type=\"radio\"` as these have built in semantics and do not require ARIA attributes.\n */\n ariaChecked?: HTMLAttributes<HTMLElement>[\"aria-checked\"];\n /**\n * The global `aria-controls` property identifies the element (or elements) whose contents or presence are controlled by the element on which this attribute is set.\n *\n * Value: A space-separated list of one or more ID values referencing the elements being controlled by the current element\n */\n ariaControls?: HTMLAttributes<HTMLElement>[\"aria-controls\"];\n /**\n * The global `aria-describedby` attribute identifies the element (or elements) that describes the element on which the attribute is set.\n *\n * Value: The id or space-separated list of element ids that describe the current element.\n *\n * Note: The `aria-describedby` attribute is not designed to reference descriptions from external resources. It must reference elements in the same DOM document.\n */\n ariaDescribedBy?: HTMLAttributes<HTMLElement>[\"aria-describedby\"];\n /**\n * The `aria-errormessage` attribute on an object identifies the element that provides an error message for that object.\n *\n * Value: The value of the id of the element containing the error message for the current element\n */\n ariaErrorMessage?: HTMLAttributes<HTMLElement>[\"aria-errormessage\"];\n /**\n * The `aria-expanded` attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not the controlled elements are displayed or hidden.\n */\n ariaExpanded?: HTMLAttributes<HTMLElement>[\"aria-expanded\"];\n /**\n * The `aria-haspopup` attribute indicates the availability and type of interactive popup element that can be triggered by the element on which the attribute is set.\n */\n ariaHasPopup?: HTMLAttributes<HTMLElement>[\"aria-haspopup\"];\n ariaHidden?: HTMLAttributes<HTMLElement>[\"aria-hidden\"];\n /**\n * The `aria-label` attribute defines a string value that labels an interactive element.\n */\n ariaLabel?: HTMLAttributes<HTMLElement>[\"aria-label\"];\n /**\n * The `aria-labelledby` attribute identifies the element (or elements) that labels the element it is applied to.\n *\n * Value: Space separated list of one or more ID values referencing the elements that label the current element.\n */\n ariaLabelledBy?: HTMLAttributes<HTMLElement>[\"aria-labelledby\"];\n /**\n * The `aria-pressed` attribute indicates the current \"pressed\" state of a toggle button.\n */\n ariaPressed?: HTMLAttributes<HTMLElement>[\"aria-pressed\"];\n /**\n * The `tabindex` global attribute allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable\n *\n * Note: Manipulating the natural tab order is generally advised against\n */\n tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /**\n * This prop puts a `data` attribute on an HTML element in this component with the value provided.\n *\n * @deprecated **WARNING:** You should be using Semantic Selectors instead of this property. This is a temporary measure for backwards compatibility with existing Selenium tests.\n */\n testId?: string;\n /**\n * This prop puts a `translate` attribute on an HTML element. It should be used to indicate whether text within the element should be translated.\n */\n translate?: \"yes\" | \"no\";\n};\n"],"mappings":""}
1
+ {"version":3,"file":"HtmlProps.js","names":[],"sources":["../src/HtmlProps.ts"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { HTMLAttributes } from \"react\";\n\nexport type HtmlProps = {\n /**\n * Used in [ARIA live regions](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Live_Regions), the global aria-busy state indicates an element is being modified and that assistive technologies may want to wait until the changes are complete before informing the user about the update.\n */\n ariaBusy?: HTMLAttributes<HTMLElement>[\"aria-busy\"];\n /**\n * The `aria-checked` attribute indicates the current \"checked\" state of checkboxes, radio buttons, and other widgets.\n *\n * NOTE: Where possible use an HTML `<input>` element with `type=\"checkbox\"` and `type=\"radio\"` as these have built in semantics and do not require ARIA attributes.\n */\n ariaChecked?: HTMLAttributes<HTMLElement>[\"aria-checked\"];\n /**\n * The global `aria-controls` property identifies the element (or elements) whose contents or presence are controlled by the element on which this attribute is set.\n *\n * Value: A space-separated list of one or more ID values referencing the elements being controlled by the current element\n */\n ariaControls?: HTMLAttributes<HTMLElement>[\"aria-controls\"];\n /**\n * A non-null aria-current state on an element indicates that this element represents the current item within a container or set of related elements.\n *\n * Value:\n * \n * `page`\n Represents the current page within a set of pages such as the link to the current document in a breadcrumb.\n\n `step`\n Represents the current step within a process such as the current step in an enumerated multi step checkout flow.\n\n `location`\n Represents the current location within an environment or context such as the image that is visually highlighted as the current component of a flow chart.\n\n `date`\n Represents the current date within a collection of dates such as the current date within a calendar.\n\n `time`\n Represents the current time within a set of times such as the current time within a timetable.\n\n `true`\n Represents the current item within a set.\n\n `false` (default)\n Does not represent the current item within a set.\n */\n ariaCurrent?: HTMLAttributes<HTMLElement>[\"aria-current\"];\n /**\n * The global `aria-describedby` attribute identifies the element (or elements) that describes the element on which the attribute is set.\n *\n * Value: The id or space-separated list of element ids that describe the current element.\n *\n * Note: The `aria-describedby` attribute is not designed to reference descriptions from external resources. It must reference elements in the same DOM document.\n */\n ariaDescribedBy?: HTMLAttributes<HTMLElement>[\"aria-describedby\"];\n /**\n * The `aria-errormessage` attribute on an object identifies the element that provides an error message for that object.\n *\n * Value: The value of the id of the element containing the error message for the current element\n */\n ariaErrorMessage?: HTMLAttributes<HTMLElement>[\"aria-errormessage\"];\n /**\n * The `aria-expanded` attribute is set on an element to indicate if a control is expanded or collapsed, and whether or not the controlled elements are displayed or hidden.\n */\n ariaExpanded?: HTMLAttributes<HTMLElement>[\"aria-expanded\"];\n /**\n * The `aria-haspopup` attribute indicates the availability and type of interactive popup element that can be triggered by the element on which the attribute is set.\n */\n ariaHasPopup?: HTMLAttributes<HTMLElement>[\"aria-haspopup\"];\n ariaHidden?: HTMLAttributes<HTMLElement>[\"aria-hidden\"];\n /**\n * The `aria-label` attribute defines a string value that labels an interactive element.\n */\n ariaLabel?: HTMLAttributes<HTMLElement>[\"aria-label\"];\n /**\n * The `aria-labelledby` attribute identifies the element (or elements) that labels the element it is applied to.\n *\n * Value: Space separated list of one or more ID values referencing the elements that label the current element.\n */\n ariaLabelledBy?: HTMLAttributes<HTMLElement>[\"aria-labelledby\"];\n /**\n * The `aria-pressed` attribute indicates the current \"pressed\" state of a toggle button.\n */\n ariaPressed?: HTMLAttributes<HTMLElement>[\"aria-pressed\"];\n /**\n * The `tabindex` global attribute allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable\n *\n * Note: Manipulating the natural tab order is generally advised against\n */\n tabIndex?: HTMLAttributes<HTMLElement>[\"tabIndex\"];\n /**\n * This prop puts a `data` attribute on an HTML element in this component with the value provided.\n *\n * @deprecated **WARNING:** You should be using Semantic Selectors instead of this property. This is a temporary measure for backwards compatibility with existing Selenium tests.\n */\n testId?: string;\n /**\n * This prop puts a `translate` attribute on an HTML element. It should be used to indicate whether text within the element should be translated.\n */\n translate?: \"yes\" | \"no\";\n};\n"],"mappings":""}
@@ -21,7 +21,7 @@ import { usePagination } from "./usePagination.js";
21
21
  import { useTranslation } from "react-i18next";
22
22
  import { jsx as _jsx } from "react/jsx-runtime";
23
23
  import { jsxs as _jsxs } from "react/jsx-runtime";
24
- const PaginationContainer = styled("div")({
24
+ const PaginationContainer = styled("nav")({
25
25
  display: "flex",
26
26
  alignItems: "center",
27
27
  justifyContent: "space-between"
@@ -190,6 +190,7 @@ const Pagination = ({
190
190
  max: maxPageIndex
191
191
  }), [currentPageLabel, maxPageIndex]);
192
192
  return variant === "paged" ? _jsxs(PaginationContainer, {
193
+ "aria-label": t("pagination.label"),
193
194
  children: [_jsxs(PaginationSegment, {
194
195
  odysseyDesignTokens: odysseyDesignTokens,
195
196
  children: [hasRowCountInput && _jsxs(Box, {
@@ -1 +1 @@
1
- {"version":3,"file":"Pagination.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","Paragraph","Button","ArrowLeftIcon","ArrowRightIcon","styled","useOdysseyDesignTokens","Box","usePagination","useTranslation","jsx","_jsx","jsxs","_jsxs","PaginationContainer","display","alignItems","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","gap","Spacing4","Spacing2","PaginationInput","_InputBase","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","t","page","setPage","rowsPerPage","setRowsPerPage","initialRowsPerPage","totalRowsLabel","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","parseInt","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","setRowsPerPageFromEvent","max","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","children","component","color","type","onChange","onBlur","onKeyDown","disabled","inputProps","startIcon","size","ariaLabel","onClick","endIcon","label","MemoizedPagination","displayName"],"sources":["../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { Paragraph } from \"../Typography\";\nimport { Button } from \"../Buttons\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated\";\nimport styled from \"@emotion/styled\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { Box } from \"../Box\";\nimport { paginationTypeValues } from \"./constants\";\nimport { usePagination } from \"./usePagination\";\nimport { useTranslation } from \"react-i18next\";\n\nconst PaginationContainer = styled(\"div\")({\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})(({ odysseyDesignTokens }: { odysseyDesignTokens: DesignTokens }) => ({\n display: \"flex\",\n alignItems: \"center\",\n gap: odysseyDesignTokens.Spacing4,\n \"& > div\": {\n display: \"flex\",\n alignItems: \"center\",\n gap: odysseyDesignTokens.Spacing2,\n },\n}));\n\nconst PaginationInput = styled(InputBase, {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})(({ odysseyDesignTokens }: { odysseyDesignTokens: DesignTokens }) => ({\n borderColor: odysseyDesignTokens.HueNeutral200,\n borderRadius: odysseyDesignTokens.BorderRadiusTight,\n height: odysseyDesignTokens.Spacing6,\n width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n \"&:hover\": {\n borderColor: odysseyDesignTokens.HueNeutral400,\n },\n \"&.Mui-focused:hover\": {\n borderColor: odysseyDesignTokens.PalettePrimaryMain,\n },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n \"& > *\": {\n marginInlineStart: `0 !important`,\n },\n});\n\nexport type PaginationProps = {\n /**\n * The labeled rendered for the current page index\n */\n currentPageLabel?: string;\n /**\n * The number of items currently visible on the page\n */\n currentRowsCount?: number;\n /**\n * If true, the page input will be visible and the user can directly manipulate which page\n * is visible.\n */\n hasPageInput?: boolean;\n /**\n * If true, the row count input will be visible and the user can directly manipulate how many rows\n * are visible.\n */\n hasRowCountInput?: boolean;\n /**\n * If true, the \"X - X of total X\" label will be visible\n */\n hasRowCountLabel?: boolean;\n /**\n * If true, the pagination controls will be disabled\n */\n isDisabled?: boolean;\n /**\n * If true, the next or Show More button will be disabled\n */\n isMoreDisabled?: boolean;\n /**\n * The current page last row index\n */\n lastRow?: number;\n /**\n * If the pagination is of \"loadMore\" variant, then this is the the load more label\n */\n loadMoreLabel?: string;\n /**\n * The max page\n */\n maxPageIndex?: number;\n /**\n * The max rows per page\n */\n maxPageSize?: number;\n /**\n * The label for the next control\n */\n nextLabel?: string;\n /**\n * Page index and page size setter\n */\n onPaginationChange: ({\n pageIndex,\n pageSize,\n }: {\n pageIndex: number;\n pageSize: number;\n }) => void;\n /**\n * The current page index\n */\n pageIndex: number;\n /**\n * The current page size\n */\n pageSize: number;\n /**\n * The label for the previous control\n */\n previousLabel?: string;\n /**\n * The label that shows how many results are rendered per page\n */\n rowsPerPageLabel?: string;\n /**\n * Total rows count\n */\n totalRows?: number;\n /**\n * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n */\n variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n currentPageLabel: currentPageLabelProp,\n currentRowsCount,\n hasPageInput = true,\n hasRowCountInput = true,\n hasRowCountLabel = true,\n isDisabled,\n isMoreDisabled,\n lastRow,\n loadMoreLabel: loadMoreLabelProp,\n maxPageIndex,\n maxPageSize,\n nextLabel: nextLabelProp,\n onPaginationChange: onPaginationChangeProp,\n pageIndex,\n pageSize,\n previousLabel: previousLabelProp,\n rowsPerPageLabel: rowsPerPageLabelProp,\n totalRows,\n variant,\n}: PaginationProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n\n const [page, setPage] = useState<number>(pageIndex);\n const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n const initialRowsPerPage = useRef<number>(pageSize);\n\n const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n useEffect(() => {\n setPage(pageIndex);\n setRowsPerPage(pageSize);\n }, [pageIndex, pageSize]);\n\n const onPaginationChange = useCallback(\n ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n onPaginationChangeProp({ pageIndex, pageSize });\n },\n [onPaginationChangeProp],\n );\n\n const { totalRowsLabel } = usePagination({\n pageIndex,\n pageSize,\n currentRowsCount: currentRowsCount || pageSize,\n totalRows,\n });\n\n const handlePaginationChange = useCallback(() => {\n let updatedPage = page;\n let updatedRowsPerPage = rowsPerPage;\n\n if (totalRows) {\n const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n // Ensure rowsPerPage does not exceed totalRows\n if (updatedRowsPerPage > totalRows) {\n updatedRowsPerPage = totalRows;\n }\n\n // Ensure page is within valid range\n if (updatedPage > maxPageIndex) {\n updatedPage = maxPageIndex;\n } else if (updatedPage < 1) {\n updatedPage = 1;\n }\n }\n\n onPaginationChange({\n pageIndex: updatedPage,\n pageSize: updatedRowsPerPage,\n });\n }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) becuase React.KeyboardEvent\n // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n // which allows us to use currentTarget.value\n const handlePageSubmit = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (event.key === \"Enter\") {\n onPaginationChange({\n pageIndex: parseInt(event.currentTarget.value),\n pageSize: rowsPerPage,\n });\n }\n },\n [rowsPerPage, onPaginationChange],\n );\n\n const handleRowsPerPageSubmit = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (event.key === \"Enter\") {\n onPaginationChange({\n pageIndex: page,\n pageSize: parseInt(event.currentTarget.value),\n });\n }\n },\n [page, onPaginationChange],\n );\n\n const setPageFromEvent = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const value = maxPageIndex\n ? Math.min(parseInt(event.target.value), maxPageIndex)\n : parseInt(event.target.value);\n setPage(value);\n },\n [setPage, maxPageIndex],\n );\n\n const setRowsPerPageFromEvent = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const value = maxPageSize\n ? Math.min(parseInt(event.target.value), maxPageSize)\n : parseInt(event.target.value);\n\n // Ensure the value can't be less than 1\n setRowsPerPage(Math.max(1, value));\n },\n [setRowsPerPage, maxPageSize],\n );\n\n const handleLoadMore = useCallback(() => {\n onPaginationChange({\n pageIndex: 1,\n pageSize: rowsPerPage + initialRowsPerPage.current,\n });\n }, [rowsPerPage, onPaginationChange]);\n\n const handleNextButton = useCallback(() => {\n onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n }, [onPaginationChange, page, rowsPerPage]);\n\n const handlePreviousButton = useCallback(() => {\n onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n }, [onPaginationChange, page, rowsPerPage]);\n\n const loadMoreIsDisabled = useMemo(() => {\n return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n const nextButtonDisabled = useMemo(\n () =>\n isMoreDisabled ||\n (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n isDisabled,\n [isMoreDisabled, totalRows, lastRow, isDisabled],\n );\n\n const previousButtonDisabled = useMemo(\n () => pageIndex <= 1 || isDisabled,\n [pageIndex, isDisabled],\n );\n\n const rowsPerPageInputProps = useMemo(\n () => ({\n \"aria-label\": rowsPerPageLabel,\n max: maxPageSize || totalRows,\n }),\n [maxPageSize, rowsPerPageLabel, totalRows],\n );\n\n const currentPageInputProps = useMemo(\n () => ({\n \"aria-label\": currentPageLabel,\n max: maxPageIndex,\n }),\n [currentPageLabel, maxPageIndex],\n );\n\n return variant === \"paged\" ? (\n <PaginationContainer>\n <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n {hasRowCountInput && (\n <Box>\n <Paragraph component=\"span\" color=\"textSecondary\">\n {rowsPerPageLabel}\n </Paragraph>\n <PaginationInput\n odysseyDesignTokens={odysseyDesignTokens}\n type=\"number\"\n value={rowsPerPage}\n onChange={setRowsPerPageFromEvent}\n onBlur={handlePaginationChange}\n onKeyDown={handleRowsPerPageSubmit}\n disabled={isDisabled}\n inputProps={rowsPerPageInputProps}\n />\n </Box>\n )}\n {hasRowCountLabel && (\n <Paragraph component=\"span\" color=\"textSecondary\">\n {totalRowsLabel}\n </Paragraph>\n )}\n </PaginationSegment>\n\n <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n {totalRows && hasPageInput && (\n <Box>\n <Paragraph component=\"span\" color=\"textSecondary\">\n {currentPageLabel}\n </Paragraph>\n <PaginationInput\n odysseyDesignTokens={odysseyDesignTokens}\n type=\"number\"\n value={page}\n onChange={setPageFromEvent}\n onBlur={handlePaginationChange}\n onKeyDown={handlePageSubmit}\n disabled={isDisabled}\n inputProps={currentPageInputProps}\n />\n </Box>\n )}\n <PaginationButtonContainer>\n <Button\n startIcon={<ArrowLeftIcon />}\n variant=\"floating\"\n size=\"small\"\n ariaLabel={previousLabel}\n onClick={handlePreviousButton}\n isDisabled={previousButtonDisabled}\n />\n <Button\n endIcon={<ArrowRightIcon />}\n variant=\"floating\"\n size=\"small\"\n ariaLabel={nextLabel}\n onClick={handleNextButton}\n isDisabled={nextButtonDisabled}\n />\n </PaginationButtonContainer>\n </PaginationSegment>\n </PaginationContainer>\n ) : (\n <Button\n variant=\"secondary\"\n label={loadMoreLabel}\n onClick={handleLoadMore}\n isDisabled={loadMoreIsDisabled}\n />\n );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAGA,SAASA,IAAI,EAAEC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAAC,SACvEC,SAAS;AAAA,SACTC,MAAM;AAAA,SACNC,aAAa,EAAEC,cAAc;AACtC,OAAOC,MAAM,MAAM,iBAAiB;AAAC,SAGnCC,sBAAsB;AAAA,SAEfC,GAAG;AAAA,SAEHC,aAAa;AACtB,SAASC,cAAc,QAAQ,eAAe;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAE/C,MAAMC,mBAAmB,GAAGT,MAAM,CAAC,KAAK,CAAC,CAAC;EACxCU,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBC,cAAc,EAAE;AAClB,CAAC,CAAC;AAEF,MAAMC,iBAAiB,GAAGb,MAAM,CAAC,KAAK,EAAE;EACtCc,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAC,CAAC;EAAEC;AAA2D,CAAC,MAAM;EACtEN,OAAO,EAAE,MAAM;EACfC,UAAU,EAAE,QAAQ;EACpBM,GAAG,EAAED,mBAAmB,CAACE,QAAQ;EACjC,SAAS,EAAE;IACTR,OAAO,EAAE,MAAM;IACfC,UAAU,EAAE,QAAQ;IACpBM,GAAG,EAAED,mBAAmB,CAACG;EAC3B;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,eAAe,GAAGpB,MAAM,CAAAqB,UAAA,EAAY;EACxCP,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAAC,CAAC;EAAEC;AAA2D,CAAC,MAAM;EACtEM,WAAW,EAAEN,mBAAmB,CAACO,aAAa;EAC9CC,YAAY,EAAER,mBAAmB,CAACS,iBAAiB;EACnDC,MAAM,EAAEV,mBAAmB,CAACW,QAAQ;EACpCC,KAAK,EAAE,iBAAiB;EACxB,SAAS,EAAE;IACTN,WAAW,EAAEN,mBAAmB,CAACa;EACnC,CAAC;EACD,qBAAqB,EAAE;IACrBP,WAAW,EAAEN,mBAAmB,CAACc;EACnC;AACF,CAAC,CAAC,CAAC;AAEH,MAAMC,yBAAyB,GAAG/B,MAAM,CAAC,KAAK,CAAC,CAAC;EAC9C,OAAO,EAAE;IACPgC,iBAAiB,EAAG;EACtB;AACF,CAAC,CAAC;AA0FF,MAAMC,UAAU,GAAGA,CAAC;EAClBC,gBAAgB,EAAEC,oBAAoB;EACtCC,gBAAgB;EAChBC,YAAY,GAAG,IAAI;EACnBC,gBAAgB,GAAG,IAAI;EACvBC,gBAAgB,GAAG,IAAI;EACvBC,UAAU;EACVC,cAAc;EACdC,OAAO;EACPC,aAAa,EAAEC,iBAAiB;EAChCC,YAAY;EACZC,WAAW;EACXC,SAAS,EAAEC,aAAa;EACxBC,kBAAkB,EAAEC,sBAAsB;EAC1CC,SAAS;EACTC,QAAQ;EACRC,aAAa,EAAEC,iBAAiB;EAChCC,gBAAgB,EAAEC,oBAAoB;EACtCC,SAAS;EACTC;AACe,CAAC,KAAK;EACrB,MAAM1C,mBAAmB,GAAGf,sBAAsB,CAAC,CAAC;EACpD,MAAM;IAAE0D;EAAE,CAAC,GAAGvD,cAAc,CAAC,CAAC;EAE9B,MAAM,CAACwD,IAAI,EAAEC,OAAO,CAAC,GAAGlE,QAAQ,CAASwD,SAAS,CAAC;EACnD,MAAM,CAACW,WAAW,EAAEC,cAAc,CAAC,GAAGpE,QAAQ,CAASyD,QAAQ,CAAC;EAChE,MAAMY,kBAAkB,GAAGtE,MAAM,CAAS0D,QAAQ,CAAC;EAEnD,MAAMlB,gBAAgB,GAAGC,oBAAoB,IAAIwB,CAAC,CAAC,iBAAiB,CAAC;EACrE,MAAMhB,aAAa,GAAGC,iBAAiB,IAAIe,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAMZ,SAAS,GAAGC,aAAa,IAAIW,CAAC,CAAC,iBAAiB,CAAC;EACvD,MAAMN,aAAa,GAAGC,iBAAiB,IAAIK,CAAC,CAAC,qBAAqB,CAAC;EACnE,MAAMJ,gBAAgB,GAAGC,oBAAoB,IAAIG,CAAC,CAAC,wBAAwB,CAAC;EAE5EnE,SAAS,CAAC,MAAM;IACdqE,OAAO,CAACV,SAAS,CAAC;IAClBY,cAAc,CAACX,QAAQ,CAAC;EAC1B,CAAC,EAAE,CAACD,SAAS,EAAEC,QAAQ,CAAC,CAAC;EAEzB,MAAMH,kBAAkB,GAAG1D,WAAW,CACpC,CAAC;IAAE4D,SAAS;IAAEC;EAAkD,CAAC,KAAK;IACpEF,sBAAsB,CAAC;MAAEC,SAAS;MAAEC;IAAS,CAAC,CAAC;EACjD,CAAC,EACD,CAACF,sBAAsB,CACzB,CAAC;EAED,MAAM;IAAEe;EAAe,CAAC,GAAG9D,aAAa,CAAC;IACvCgD,SAAS;IACTC,QAAQ;IACRhB,gBAAgB,EAAEA,gBAAgB,IAAIgB,QAAQ;IAC9CK;EACF,CAAC,CAAC;EAEF,MAAMS,sBAAsB,GAAG3E,WAAW,CAAC,MAAM;IAC/C,IAAI4E,WAAW,GAAGP,IAAI;IACtB,IAAIQ,kBAAkB,GAAGN,WAAW;IAEpC,IAAIL,SAAS,EAAE;MACb,MAAMZ,YAAY,GAAGwB,IAAI,CAACC,IAAI,CAACb,SAAS,GAAGW,kBAAkB,CAAC;MAG9D,IAAIA,kBAAkB,GAAGX,SAAS,EAAE;QAClCW,kBAAkB,GAAGX,SAAS;MAChC;MAGA,IAAIU,WAAW,GAAGtB,YAAY,EAAE;QAC9BsB,WAAW,GAAGtB,YAAY;MAC5B,CAAC,MAAM,IAAIsB,WAAW,GAAG,CAAC,EAAE;QAC1BA,WAAW,GAAG,CAAC;MACjB;IACF;IAEAlB,kBAAkB,CAAC;MACjBE,SAAS,EAAEgB,WAAW;MACtBf,QAAQ,EAAEgB;IACZ,CAAC,CAAC;EACJ,CAAC,EAAE,CAACR,IAAI,EAAEE,WAAW,EAAEb,kBAAkB,EAAEQ,SAAS,CAAC,CAAC;EAKtD,MAAMc,gBAAgB,GAAGhF,WAAW,CACjCiF,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBxB,kBAAkB,CAAC;QACjBE,SAAS,EAAEuB,QAAQ,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK,CAAC;QAC9CxB,QAAQ,EAAEU;MACZ,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAACA,WAAW,EAAEb,kBAAkB,CAClC,CAAC;EAED,MAAM4B,uBAAuB,GAAGtF,WAAW,CACxCiF,KAAkE,IAAK;IACtE,IAAIA,KAAK,CAACC,GAAG,KAAK,OAAO,EAAE;MACzBxB,kBAAkB,CAAC;QACjBE,SAAS,EAAES,IAAI;QACfR,QAAQ,EAAEsB,QAAQ,CAACF,KAAK,CAACG,aAAa,CAACC,KAAK;MAC9C,CAAC,CAAC;IACJ;EACF,CAAC,EACD,CAAChB,IAAI,EAAEX,kBAAkB,CAC3B,CAAC;EAED,MAAM6B,gBAAgB,GAAGvF,WAAW,CACjCiF,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAG/B,YAAY,GACtBwB,IAAI,CAACU,GAAG,CAACL,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAE/B,YAAY,CAAC,GACpD6B,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAChCf,OAAO,CAACe,KAAK,CAAC;EAChB,CAAC,EACD,CAACf,OAAO,EAAEhB,YAAY,CACxB,CAAC;EAED,MAAMoC,uBAAuB,GAAG1F,WAAW,CACxCiF,KAA0C,IAAK;IAC9C,MAAMI,KAAK,GAAG9B,WAAW,GACrBuB,IAAI,CAACU,GAAG,CAACL,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC,EAAE9B,WAAW,CAAC,GACnD4B,QAAQ,CAACF,KAAK,CAACQ,MAAM,CAACJ,KAAK,CAAC;IAGhCb,cAAc,CAACM,IAAI,CAACa,GAAG,CAAC,CAAC,EAAEN,KAAK,CAAC,CAAC;EACpC,CAAC,EACD,CAACb,cAAc,EAAEjB,WAAW,CAC9B,CAAC;EAED,MAAMqC,cAAc,GAAG5F,WAAW,CAAC,MAAM;IACvC0D,kBAAkB,CAAC;MACjBE,SAAS,EAAE,CAAC;MACZC,QAAQ,EAAEU,WAAW,GAAGE,kBAAkB,CAACoB;IAC7C,CAAC,CAAC;EACJ,CAAC,EAAE,CAACtB,WAAW,EAAEb,kBAAkB,CAAC,CAAC;EAErC,MAAMoC,gBAAgB,GAAG9F,WAAW,CAAC,MAAM;IACzC0D,kBAAkB,CAAC;MAAEE,SAAS,EAAES,IAAI,GAAG,CAAC;MAAER,QAAQ,EAAEU;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAACb,kBAAkB,EAAEW,IAAI,EAAEE,WAAW,CAAC,CAAC;EAE3C,MAAMwB,oBAAoB,GAAG/F,WAAW,CAAC,MAAM;IAC7C0D,kBAAkB,CAAC;MAAEE,SAAS,EAAES,IAAI,GAAG,CAAC;MAAER,QAAQ,EAAEU;IAAY,CAAC,CAAC;EACpE,CAAC,EAAE,CAACb,kBAAkB,EAAEW,IAAI,EAAEE,WAAW,CAAC,CAAC;EAE3C,MAAMyB,kBAAkB,GAAG9F,OAAO,CAAC,MAAM;IACvC,OAAOgD,cAAc,KAAKgB,SAAS,GAAGK,WAAW,IAAIL,SAAS,GAAG,KAAK,CAAC;EACzE,CAAC,EAAE,CAAChB,cAAc,EAAEqB,WAAW,EAAEL,SAAS,CAAC,CAAC;EAE5C,MAAM+B,kBAAkB,GAAG/F,OAAO,CAChC,MACEgD,cAAc,IACbC,OAAO,KAAKe,SAAS,GAAGf,OAAO,IAAIe,SAAS,GAAG,KAAK,CAAE,IACvDjB,UAAU,EACZ,CAACC,cAAc,EAAEgB,SAAS,EAAEf,OAAO,EAAEF,UAAU,CACjD,CAAC;EAED,MAAMiD,sBAAsB,GAAGhG,OAAO,CACpC,MAAM0D,SAAS,IAAI,CAAC,IAAIX,UAAU,EAClC,CAACW,SAAS,EAAEX,UAAU,CACxB,CAAC;EAED,MAAMkD,qBAAqB,GAAGjG,OAAO,CACnC,OAAO;IACL,YAAY,EAAE8D,gBAAgB;IAC9B2B,GAAG,EAAEpC,WAAW,IAAIW;EACtB,CAAC,CAAC,EACF,CAACX,WAAW,EAAES,gBAAgB,EAAEE,SAAS,CAC3C,CAAC;EAED,MAAMkC,qBAAqB,GAAGlG,OAAO,CACnC,OAAO;IACL,YAAY,EAAEyC,gBAAgB;IAC9BgD,GAAG,EAAErC;EACP,CAAC,CAAC,EACF,CAACX,gBAAgB,EAAEW,YAAY,CACjC,CAAC;EAED,OAAOa,OAAO,KAAK,OAAO,GACxBlD,KAAA,CAACC,mBAAmB;IAAAmF,QAAA,GAClBpF,KAAA,CAACK,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAA4E,QAAA,GACzDtD,gBAAgB,IACf9B,KAAA,CAACN,GAAG;QAAA0F,QAAA,GACFtF,IAAA,CAACV,SAAS;UAACiG,SAAS,EAAC,MAAM;UAACC,KAAK,EAAC,eAAe;UAAAF,QAAA,EAC9CrC;QAAgB,CACR,CAAC,EACZjD,IAAA,CAACc,eAAe;UACdJ,mBAAmB,EAAEA,mBAAoB;UACzC+E,IAAI,EAAC,QAAQ;UACbnB,KAAK,EAAEd,WAAY;UACnBkC,QAAQ,EAAEf,uBAAwB;UAClCgB,MAAM,EAAE/B,sBAAuB;UAC/BgC,SAAS,EAAErB,uBAAwB;UACnCsB,QAAQ,EAAE3D,UAAW;UACrB4D,UAAU,EAAEV;QAAsB,CACnC,CAAC;MAAA,CACC,CACN,EACAnD,gBAAgB,IACfjC,IAAA,CAACV,SAAS;QAACiG,SAAS,EAAC,MAAM;QAACC,KAAK,EAAC,eAAe;QAAAF,QAAA,EAC9C3B;MAAc,CACN,CACZ;IAAA,CACgB,CAAC,EAEpBzD,KAAA,CAACK,iBAAiB;MAACG,mBAAmB,EAAEA,mBAAoB;MAAA4E,QAAA,GACzDnC,SAAS,IAAIpB,YAAY,IACxB7B,KAAA,CAACN,GAAG;QAAA0F,QAAA,GACFtF,IAAA,CAACV,SAAS;UAACiG,SAAS,EAAC,MAAM;UAACC,KAAK,EAAC,eAAe;UAAAF,QAAA,EAC9C1D;QAAgB,CACR,CAAC,EACZ5B,IAAA,CAACc,eAAe;UACdJ,mBAAmB,EAAEA,mBAAoB;UACzC+E,IAAI,EAAC,QAAQ;UACbnB,KAAK,EAAEhB,IAAK;UACZoC,QAAQ,EAAElB,gBAAiB;UAC3BmB,MAAM,EAAE/B,sBAAuB;UAC/BgC,SAAS,EAAE3B,gBAAiB;UAC5B4B,QAAQ,EAAE3D,UAAW;UACrB4D,UAAU,EAAET;QAAsB,CACnC,CAAC;MAAA,CACC,CACN,EACDnF,KAAA,CAACuB,yBAAyB;QAAA6D,QAAA,GACxBtF,IAAA,CAACT,MAAM;UACLwG,SAAS,EAAE/F,IAAA,CAACR,aAAa,IAAE,CAAE;UAC7B4D,OAAO,EAAC,UAAU;UAClB4C,IAAI,EAAC,OAAO;UACZC,SAAS,EAAElD,aAAc;UACzBmD,OAAO,EAAElB,oBAAqB;UAC9B9C,UAAU,EAAEiD;QAAuB,CACpC,CAAC,EACFnF,IAAA,CAACT,MAAM;UACL4G,OAAO,EAAEnG,IAAA,CAACP,cAAc,IAAE,CAAE;UAC5B2D,OAAO,EAAC,UAAU;UAClB4C,IAAI,EAAC,OAAO;UACZC,SAAS,EAAExD,SAAU;UACrByD,OAAO,EAAEnB,gBAAiB;UAC1B7C,UAAU,EAAEgD;QAAmB,CAChC,CAAC;MAAA,CACuB,CAAC;IAAA,CACX,CAAC;EAAA,CACD,CAAC,GAEtBlF,IAAA,CAACT,MAAM;IACL6D,OAAO,EAAC,WAAW;IACnBgD,KAAK,EAAE/D,aAAc;IACrB6D,OAAO,EAAErB,cAAe;IACxB3C,UAAU,EAAE+C;EAAmB,CAChC,CACF;AACH,CAAC;AAED,MAAMoB,kBAAkB,GAAGrH,IAAI,CAAC2C,UAAU,CAAC;AAC3C0E,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAI1E,UAAU"}
1
+ {"version":3,"file":"Pagination.js","names":["memo","useCallback","useEffect","useMemo","useRef","useState","Paragraph","Button","ArrowLeftIcon","ArrowRightIcon","styled","useOdysseyDesignTokens","Box","usePagination","useTranslation","jsx","_jsx","jsxs","_jsxs","PaginationContainer","display","alignItems","justifyContent","PaginationSegment","shouldForwardProp","prop","odysseyDesignTokens","gap","Spacing4","Spacing2","PaginationInput","_InputBase","borderColor","HueNeutral200","borderRadius","BorderRadiusTight","height","Spacing6","width","HueNeutral400","PalettePrimaryMain","PaginationButtonContainer","marginInlineStart","Pagination","currentPageLabel","currentPageLabelProp","currentRowsCount","hasPageInput","hasRowCountInput","hasRowCountLabel","isDisabled","isMoreDisabled","lastRow","loadMoreLabel","loadMoreLabelProp","maxPageIndex","maxPageSize","nextLabel","nextLabelProp","onPaginationChange","onPaginationChangeProp","pageIndex","pageSize","previousLabel","previousLabelProp","rowsPerPageLabel","rowsPerPageLabelProp","totalRows","variant","t","page","setPage","rowsPerPage","setRowsPerPage","initialRowsPerPage","totalRowsLabel","handlePaginationChange","updatedPage","updatedRowsPerPage","Math","ceil","handlePageSubmit","event","key","parseInt","currentTarget","value","handleRowsPerPageSubmit","setPageFromEvent","min","target","setRowsPerPageFromEvent","max","handleLoadMore","current","handleNextButton","handlePreviousButton","loadMoreIsDisabled","nextButtonDisabled","previousButtonDisabled","rowsPerPageInputProps","currentPageInputProps","children","component","color","type","onChange","onBlur","onKeyDown","disabled","inputProps","startIcon","size","ariaLabel","onClick","endIcon","label","MemoizedPagination","displayName"],"sources":["../../src/Pagination/Pagination.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2023-present, Okta, Inc. and/or its affiliates. All rights reserved.\n * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the \"License.\")\n *\n * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n *\n * See the License for the specific language governing permissions and limitations under the License.\n */\n\nimport { InputBase } from \"@mui/material\";\nimport { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { Paragraph } from \"../Typography\";\nimport { Button } from \"../Buttons\";\nimport { ArrowLeftIcon, ArrowRightIcon } from \"../icons.generated\";\nimport styled from \"@emotion/styled\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../OdysseyDesignTokensContext\";\nimport { Box } from \"../Box\";\nimport { paginationTypeValues } from \"./constants\";\nimport { usePagination } from \"./usePagination\";\nimport { useTranslation } from \"react-i18next\";\n\nconst PaginationContainer = styled(\"nav\")({\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n});\n\nconst PaginationSegment = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})(({ odysseyDesignTokens }: { odysseyDesignTokens: DesignTokens }) => ({\n display: \"flex\",\n alignItems: \"center\",\n gap: odysseyDesignTokens.Spacing4,\n \"& > div\": {\n display: \"flex\",\n alignItems: \"center\",\n gap: odysseyDesignTokens.Spacing2,\n },\n}));\n\nconst PaginationInput = styled(InputBase, {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})(({ odysseyDesignTokens }: { odysseyDesignTokens: DesignTokens }) => ({\n borderColor: odysseyDesignTokens.HueNeutral200,\n borderRadius: odysseyDesignTokens.BorderRadiusTight,\n height: odysseyDesignTokens.Spacing6,\n width: \"4.5714285714rem\", // This is a hardcoded value, keep as string\n \"&:hover\": {\n borderColor: odysseyDesignTokens.HueNeutral400,\n },\n \"&.Mui-focused:hover\": {\n borderColor: odysseyDesignTokens.PalettePrimaryMain,\n },\n}));\n\nconst PaginationButtonContainer = styled(\"div\")({\n \"& > *\": {\n marginInlineStart: `0 !important`,\n },\n});\n\nexport type PaginationProps = {\n /**\n * The labeled rendered for the current page index\n */\n currentPageLabel?: string;\n /**\n * The number of items currently visible on the page\n */\n currentRowsCount?: number;\n /**\n * If true, the page input will be visible and the user can directly manipulate which page\n * is visible.\n */\n hasPageInput?: boolean;\n /**\n * If true, the row count input will be visible and the user can directly manipulate how many rows\n * are visible.\n */\n hasRowCountInput?: boolean;\n /**\n * If true, the \"X - X of total X\" label will be visible\n */\n hasRowCountLabel?: boolean;\n /**\n * If true, the pagination controls will be disabled\n */\n isDisabled?: boolean;\n /**\n * If true, the next or Show More button will be disabled\n */\n isMoreDisabled?: boolean;\n /**\n * The current page last row index\n */\n lastRow?: number;\n /**\n * If the pagination is of \"loadMore\" variant, then this is the the load more label\n */\n loadMoreLabel?: string;\n /**\n * The max page\n */\n maxPageIndex?: number;\n /**\n * The max rows per page\n */\n maxPageSize?: number;\n /**\n * The label for the next control\n */\n nextLabel?: string;\n /**\n * Page index and page size setter\n */\n onPaginationChange: ({\n pageIndex,\n pageSize,\n }: {\n pageIndex: number;\n pageSize: number;\n }) => void;\n /**\n * The current page index\n */\n pageIndex: number;\n /**\n * The current page size\n */\n pageSize: number;\n /**\n * The label for the previous control\n */\n previousLabel?: string;\n /**\n * The label that shows how many results are rendered per page\n */\n rowsPerPageLabel?: string;\n /**\n * Total rows count\n */\n totalRows?: number;\n /**\n * The type of pagination controls shown. Defaults to next/prev buttons, but can be\n * set to a simple \"Load more\" button by setting to \"loadMore\".\n */\n variant?: (typeof paginationTypeValues)[number];\n};\n\nconst Pagination = ({\n currentPageLabel: currentPageLabelProp,\n currentRowsCount,\n hasPageInput = true,\n hasRowCountInput = true,\n hasRowCountLabel = true,\n isDisabled,\n isMoreDisabled,\n lastRow,\n loadMoreLabel: loadMoreLabelProp,\n maxPageIndex,\n maxPageSize,\n nextLabel: nextLabelProp,\n onPaginationChange: onPaginationChangeProp,\n pageIndex,\n pageSize,\n previousLabel: previousLabelProp,\n rowsPerPageLabel: rowsPerPageLabelProp,\n totalRows,\n variant,\n}: PaginationProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n\n const [page, setPage] = useState<number>(pageIndex);\n const [rowsPerPage, setRowsPerPage] = useState<number>(pageSize);\n const initialRowsPerPage = useRef<number>(pageSize);\n\n const currentPageLabel = currentPageLabelProp ?? t(\"pagination.page\");\n const loadMoreLabel = loadMoreLabelProp ?? t(\"pagination.loadmore\");\n const nextLabel = nextLabelProp ?? t(\"pagination.next\");\n const previousLabel = previousLabelProp ?? t(\"pagination.previous\");\n const rowsPerPageLabel = rowsPerPageLabelProp ?? t(\"pagination.rowsperpage\");\n\n useEffect(() => {\n setPage(pageIndex);\n setRowsPerPage(pageSize);\n }, [pageIndex, pageSize]);\n\n const onPaginationChange = useCallback(\n ({ pageIndex, pageSize }: { pageIndex: number; pageSize: number }) => {\n onPaginationChangeProp({ pageIndex, pageSize });\n },\n [onPaginationChangeProp],\n );\n\n const { totalRowsLabel } = usePagination({\n pageIndex,\n pageSize,\n currentRowsCount: currentRowsCount || pageSize,\n totalRows,\n });\n\n const handlePaginationChange = useCallback(() => {\n let updatedPage = page;\n let updatedRowsPerPage = rowsPerPage;\n\n if (totalRows) {\n const maxPageIndex = Math.ceil(totalRows / updatedRowsPerPage);\n\n // Ensure rowsPerPage does not exceed totalRows\n if (updatedRowsPerPage > totalRows) {\n updatedRowsPerPage = totalRows;\n }\n\n // Ensure page is within valid range\n if (updatedPage > maxPageIndex) {\n updatedPage = maxPageIndex;\n } else if (updatedPage < 1) {\n updatedPage = 1;\n }\n }\n\n onPaginationChange({\n pageIndex: updatedPage,\n pageSize: updatedRowsPerPage,\n });\n }, [page, rowsPerPage, onPaginationChange, totalRows]);\n\n // The following handlers use React.KeyboardEvent (rather than just KeyboardEvent) becuase React.KeyboardEvent\n // is generic, while plain KeyboardEvent is not. We need this generic so we can specify the HTMLInputElement,\n // which allows us to use currentTarget.value\n const handlePageSubmit = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (event.key === \"Enter\") {\n onPaginationChange({\n pageIndex: parseInt(event.currentTarget.value),\n pageSize: rowsPerPage,\n });\n }\n },\n [rowsPerPage, onPaginationChange],\n );\n\n const handleRowsPerPageSubmit = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement | HTMLTextAreaElement>) => {\n if (event.key === \"Enter\") {\n onPaginationChange({\n pageIndex: page,\n pageSize: parseInt(event.currentTarget.value),\n });\n }\n },\n [page, onPaginationChange],\n );\n\n const setPageFromEvent = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const value = maxPageIndex\n ? Math.min(parseInt(event.target.value), maxPageIndex)\n : parseInt(event.target.value);\n setPage(value);\n },\n [setPage, maxPageIndex],\n );\n\n const setRowsPerPageFromEvent = useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const value = maxPageSize\n ? Math.min(parseInt(event.target.value), maxPageSize)\n : parseInt(event.target.value);\n\n // Ensure the value can't be less than 1\n setRowsPerPage(Math.max(1, value));\n },\n [setRowsPerPage, maxPageSize],\n );\n\n const handleLoadMore = useCallback(() => {\n onPaginationChange({\n pageIndex: 1,\n pageSize: rowsPerPage + initialRowsPerPage.current,\n });\n }, [rowsPerPage, onPaginationChange]);\n\n const handleNextButton = useCallback(() => {\n onPaginationChange({ pageIndex: page + 1, pageSize: rowsPerPage });\n }, [onPaginationChange, page, rowsPerPage]);\n\n const handlePreviousButton = useCallback(() => {\n onPaginationChange({ pageIndex: page - 1, pageSize: rowsPerPage });\n }, [onPaginationChange, page, rowsPerPage]);\n\n const loadMoreIsDisabled = useMemo(() => {\n return isMoreDisabled || (totalRows ? rowsPerPage >= totalRows : false);\n }, [isMoreDisabled, rowsPerPage, totalRows]);\n\n const nextButtonDisabled = useMemo(\n () =>\n isMoreDisabled ||\n (lastRow && (totalRows ? lastRow >= totalRows : false)) ||\n isDisabled,\n [isMoreDisabled, totalRows, lastRow, isDisabled],\n );\n\n const previousButtonDisabled = useMemo(\n () => pageIndex <= 1 || isDisabled,\n [pageIndex, isDisabled],\n );\n\n const rowsPerPageInputProps = useMemo(\n () => ({\n \"aria-label\": rowsPerPageLabel,\n max: maxPageSize || totalRows,\n }),\n [maxPageSize, rowsPerPageLabel, totalRows],\n );\n\n const currentPageInputProps = useMemo(\n () => ({\n \"aria-label\": currentPageLabel,\n max: maxPageIndex,\n }),\n [currentPageLabel, maxPageIndex],\n );\n\n return variant === \"paged\" ? (\n <PaginationContainer aria-label={t(\"pagination.label\")}>\n <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n {hasRowCountInput && (\n <Box>\n <Paragraph component=\"span\" color=\"textSecondary\">\n {rowsPerPageLabel}\n </Paragraph>\n <PaginationInput\n odysseyDesignTokens={odysseyDesignTokens}\n type=\"number\"\n value={rowsPerPage}\n onChange={setRowsPerPageFromEvent}\n onBlur={handlePaginationChange}\n onKeyDown={handleRowsPerPageSubmit}\n disabled={isDisabled}\n inputProps={rowsPerPageInputProps}\n />\n </Box>\n )}\n {hasRowCountLabel && (\n <Paragraph component=\"span\" color=\"textSecondary\">\n {totalRowsLabel}\n </Paragraph>\n )}\n </PaginationSegment>\n\n <PaginationSegment odysseyDesignTokens={odysseyDesignTokens}>\n {totalRows && hasPageInput && (\n <Box>\n <Paragraph component=\"span\" color=\"textSecondary\">\n {currentPageLabel}\n </Paragraph>\n <PaginationInput\n odysseyDesignTokens={odysseyDesignTokens}\n type=\"number\"\n value={page}\n onChange={setPageFromEvent}\n onBlur={handlePaginationChange}\n onKeyDown={handlePageSubmit}\n disabled={isDisabled}\n inputProps={currentPageInputProps}\n />\n </Box>\n )}\n <PaginationButtonContainer>\n <Button\n startIcon={<ArrowLeftIcon />}\n variant=\"floating\"\n size=\"small\"\n ariaLabel={previousLabel}\n onClick={handlePreviousButton}\n isDisabled={previousButtonDisabled}\n />\n <Button\n endIcon={<ArrowRightIcon />}\n variant=\"floating\"\n size=\"small\"\n ariaLabel={nextLabel}\n onClick={handleNextButton}\n isDisabled={nextButtonDisabled}\n />\n </PaginationButtonContainer>\n </PaginationSegment>\n </PaginationContainer>\n ) : (\n <Button\n variant=\"secondary\"\n label={loadMoreLabel}\n onClick={handleLoadMore}\n isDisabled={loadMoreIsDisabled}\n />\n );\n};\n\nconst MemoizedPagination = memo(Pagination);\nMemoizedPagination.displayName = \"Pagination\";\n\nexport { MemoizedPagination as Pagination };\n"],"mappings":"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"}