@okta/odyssey-react-mui 1.21.1 → 1.22.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 (436) hide show
  1. package/CHANGELOG.md +19 -0
  2. package/dist/Autocomplete.js +76 -38
  3. package/dist/Autocomplete.js.map +1 -1
  4. package/dist/Checkbox.js +26 -11
  5. package/dist/Checkbox.js.map +1 -1
  6. package/dist/CheckboxGroup.js +14 -3
  7. package/dist/CheckboxGroup.js.map +1 -1
  8. package/dist/DataTable/DataTable.js +10 -2
  9. package/dist/DataTable/DataTable.js.map +1 -1
  10. package/dist/DataTable/useScrollIndication.js +2 -2
  11. package/dist/DataTable/useScrollIndication.js.map +1 -1
  12. package/dist/Field.js +3 -1
  13. package/dist/Field.js.map +1 -1
  14. package/dist/OdysseyCacheProvider.js +4 -3
  15. package/dist/OdysseyCacheProvider.js.map +1 -1
  16. package/dist/OdysseyProvider.js +6 -3
  17. package/dist/OdysseyProvider.js.map +1 -1
  18. package/dist/OdysseyThemeProvider.js +3 -2
  19. package/dist/OdysseyThemeProvider.js.map +1 -1
  20. package/dist/Pagination/Pagination.js +1 -1
  21. package/dist/Pagination/Pagination.js.map +1 -1
  22. package/dist/Radio.js +34 -7
  23. package/dist/Radio.js.map +1 -1
  24. package/dist/RadioGroup.js +17 -5
  25. package/dist/RadioGroup.js.map +1 -1
  26. package/dist/Select.js +53 -31
  27. package/dist/Select.js.map +1 -1
  28. package/dist/ToastStack.js.map +1 -1
  29. package/dist/{createShadowRootElement.js → createShadowDomElements.js} +22 -6
  30. package/dist/createShadowDomElements.js.map +1 -0
  31. package/dist/index.js +1 -1
  32. package/dist/index.js.map +1 -1
  33. package/dist/index.scss +5 -5
  34. package/dist/labs/AppTile.js +124 -0
  35. package/dist/labs/AppTile.js.map +1 -0
  36. package/dist/labs/DataView/BulkActionsMenu.js.map +1 -0
  37. package/dist/labs/{DataComponents/StackContent.js → DataView/CardLayoutContent.js} +14 -14
  38. package/dist/labs/DataView/CardLayoutContent.js.map +1 -0
  39. package/dist/labs/{DataComponents/StackCard.js → DataView/DataCard.js} +6 -6
  40. package/dist/labs/DataView/DataCard.js.map +1 -0
  41. package/dist/labs/{DataComponents → DataView}/DataTable.js +6 -2
  42. package/dist/labs/DataView/DataTable.js.map +1 -0
  43. package/dist/labs/{DataComponents → DataView}/DataView.js +27 -17
  44. package/dist/labs/DataView/DataView.js.map +1 -0
  45. package/dist/labs/DataView/DetailPanel.js.map +1 -0
  46. package/dist/labs/DataView/LayoutSwitcher.js.map +1 -0
  47. package/dist/labs/DataView/RowActions.js.map +1 -0
  48. package/dist/labs/{DataComponents/TableContent.js → DataView/TableLayoutContent.js} +17 -17
  49. package/dist/labs/DataView/TableLayoutContent.js.map +1 -0
  50. package/dist/labs/{DataComponents → DataView}/TableSettings.js +2 -2
  51. package/dist/labs/DataView/TableSettings.js.map +1 -0
  52. package/dist/labs/DataView/componentTypes.js.map +1 -0
  53. package/dist/labs/{DataComponents → DataView}/constants.js +2 -2
  54. package/dist/labs/DataView/constants.js.map +1 -0
  55. package/dist/labs/DataView/dataTypes.js.map +1 -0
  56. package/dist/labs/{DataComponents → DataView}/fetchData.js +2 -2
  57. package/dist/labs/DataView/fetchData.js.map +1 -0
  58. package/dist/labs/{DataComponents → DataView}/index.js +0 -1
  59. package/dist/labs/DataView/index.js.map +1 -0
  60. package/dist/labs/DataView/tableConstants.js.map +1 -0
  61. package/dist/labs/DataView/useFilterConversion.js.map +1 -0
  62. package/dist/labs/SideNav/CollapseIcon.js +44 -0
  63. package/dist/labs/SideNav/CollapseIcon.js.map +1 -0
  64. package/dist/labs/SideNav/SideNav.js +246 -0
  65. package/dist/labs/SideNav/SideNav.js.map +1 -0
  66. package/dist/labs/SideNav/SideNavFooterContent.js +49 -0
  67. package/dist/labs/SideNav/SideNavFooterContent.js.map +1 -0
  68. package/dist/labs/SideNav/SideNavHeader.js +58 -0
  69. package/dist/labs/SideNav/SideNavHeader.js.map +1 -0
  70. package/dist/labs/SideNav/SideNavItemContent.js +157 -0
  71. package/dist/labs/SideNav/SideNavItemContent.js.map +1 -0
  72. package/dist/labs/SideNav/SideNavItemLinkContent.js +71 -0
  73. package/dist/labs/SideNav/SideNavItemLinkContent.js.map +1 -0
  74. package/dist/labs/SideNav/index.js +14 -0
  75. package/dist/labs/SideNav/index.js.map +1 -0
  76. package/dist/labs/SideNav/types.js +2 -0
  77. package/dist/labs/SideNav/types.js.map +1 -0
  78. package/dist/labs/Switch.js +70 -16
  79. package/dist/labs/Switch.js.map +1 -1
  80. package/dist/labs/index.js +3 -2
  81. package/dist/labs/index.js.map +1 -1
  82. package/dist/properties/ts/odyssey-react-mui_cs.js +17 -3
  83. package/dist/properties/ts/odyssey-react-mui_cs.js.map +1 -1
  84. package/dist/properties/ts/odyssey-react-mui_da.js +17 -3
  85. package/dist/properties/ts/odyssey-react-mui_da.js.map +1 -1
  86. package/dist/properties/ts/odyssey-react-mui_de.js +16 -2
  87. package/dist/properties/ts/odyssey-react-mui_de.js.map +1 -1
  88. package/dist/properties/ts/odyssey-react-mui_el.js +18 -4
  89. package/dist/properties/ts/odyssey-react-mui_el.js.map +1 -1
  90. package/dist/properties/ts/odyssey-react-mui_es.js +17 -3
  91. package/dist/properties/ts/odyssey-react-mui_es.js.map +1 -1
  92. package/dist/properties/ts/odyssey-react-mui_fi.js +17 -3
  93. package/dist/properties/ts/odyssey-react-mui_fi.js.map +1 -1
  94. package/dist/properties/ts/odyssey-react-mui_fr.js +17 -3
  95. package/dist/properties/ts/odyssey-react-mui_fr.js.map +1 -1
  96. package/dist/properties/ts/odyssey-react-mui_ht.js +18 -4
  97. package/dist/properties/ts/odyssey-react-mui_ht.js.map +1 -1
  98. package/dist/properties/ts/odyssey-react-mui_hu.js +17 -3
  99. package/dist/properties/ts/odyssey-react-mui_hu.js.map +1 -1
  100. package/dist/properties/ts/odyssey-react-mui_id.js +17 -3
  101. package/dist/properties/ts/odyssey-react-mui_id.js.map +1 -1
  102. package/dist/properties/ts/odyssey-react-mui_it.js +17 -3
  103. package/dist/properties/ts/odyssey-react-mui_it.js.map +1 -1
  104. package/dist/properties/ts/odyssey-react-mui_ja.js +16 -2
  105. package/dist/properties/ts/odyssey-react-mui_ja.js.map +1 -1
  106. package/dist/properties/ts/odyssey-react-mui_ko.js +16 -2
  107. package/dist/properties/ts/odyssey-react-mui_ko.js.map +1 -1
  108. package/dist/properties/ts/odyssey-react-mui_ms.js +17 -3
  109. package/dist/properties/ts/odyssey-react-mui_ms.js.map +1 -1
  110. package/dist/properties/ts/odyssey-react-mui_nb.js +17 -3
  111. package/dist/properties/ts/odyssey-react-mui_nb.js.map +1 -1
  112. package/dist/properties/ts/odyssey-react-mui_nl_NL.js +17 -3
  113. package/dist/properties/ts/odyssey-react-mui_nl_NL.js.map +1 -1
  114. package/dist/properties/ts/odyssey-react-mui_pl.js +17 -3
  115. package/dist/properties/ts/odyssey-react-mui_pl.js.map +1 -1
  116. package/dist/properties/ts/odyssey-react-mui_pt_BR.js +17 -3
  117. package/dist/properties/ts/odyssey-react-mui_pt_BR.js.map +1 -1
  118. package/dist/properties/ts/odyssey-react-mui_ro.js +17 -3
  119. package/dist/properties/ts/odyssey-react-mui_ro.js.map +1 -1
  120. package/dist/properties/ts/odyssey-react-mui_ru.js +17 -3
  121. package/dist/properties/ts/odyssey-react-mui_ru.js.map +1 -1
  122. package/dist/properties/ts/odyssey-react-mui_sv.js +17 -3
  123. package/dist/properties/ts/odyssey-react-mui_sv.js.map +1 -1
  124. package/dist/properties/ts/odyssey-react-mui_th.js +16 -2
  125. package/dist/properties/ts/odyssey-react-mui_th.js.map +1 -1
  126. package/dist/properties/ts/odyssey-react-mui_tr.js +17 -3
  127. package/dist/properties/ts/odyssey-react-mui_tr.js.map +1 -1
  128. package/dist/properties/ts/odyssey-react-mui_uk.js +17 -3
  129. package/dist/properties/ts/odyssey-react-mui_uk.js.map +1 -1
  130. package/dist/properties/ts/odyssey-react-mui_vi.js +17 -3
  131. package/dist/properties/ts/odyssey-react-mui_vi.js.map +1 -1
  132. package/dist/properties/ts/odyssey-react-mui_zh_CN.js +16 -2
  133. package/dist/properties/ts/odyssey-react-mui_zh_CN.js.map +1 -1
  134. package/dist/properties/ts/odyssey-react-mui_zh_TW.js +16 -2
  135. package/dist/properties/ts/odyssey-react-mui_zh_TW.js.map +1 -1
  136. package/dist/src/Autocomplete.d.ts.map +1 -1
  137. package/dist/src/Checkbox.d.ts +2 -2
  138. package/dist/src/Checkbox.d.ts.map +1 -1
  139. package/dist/src/CheckboxGroup.d.ts +3 -3
  140. package/dist/src/CheckboxGroup.d.ts.map +1 -1
  141. package/dist/src/DataTable/DataTable.d.ts +9 -1
  142. package/dist/src/DataTable/DataTable.d.ts.map +1 -1
  143. package/dist/src/Field.d.ts +3 -2
  144. package/dist/src/Field.d.ts.map +1 -1
  145. package/dist/src/OdysseyCacheProvider.d.ts +7 -3
  146. package/dist/src/OdysseyCacheProvider.d.ts.map +1 -1
  147. package/dist/src/OdysseyProvider.d.ts +1 -1
  148. package/dist/src/OdysseyProvider.d.ts.map +1 -1
  149. package/dist/src/OdysseyThemeProvider.d.ts +3 -1
  150. package/dist/src/OdysseyThemeProvider.d.ts.map +1 -1
  151. package/dist/src/Pagination/Pagination.d.ts.map +1 -1
  152. package/dist/src/Radio.d.ts +6 -8
  153. package/dist/src/Radio.d.ts.map +1 -1
  154. package/dist/src/RadioGroup.d.ts +4 -5
  155. package/dist/src/RadioGroup.d.ts.map +1 -1
  156. package/dist/src/Select.d.ts +2 -2
  157. package/dist/src/Select.d.ts.map +1 -1
  158. package/dist/src/ToastStack.d.ts +2 -2
  159. package/dist/src/ToastStack.d.ts.map +1 -1
  160. package/dist/src/{createShadowRootElement.d.ts → createShadowDomElements.d.ts} +6 -1
  161. package/dist/src/createShadowDomElements.d.ts.map +1 -0
  162. package/dist/src/index.d.ts +1 -1
  163. package/dist/src/labs/AppTile.d.ts +39 -0
  164. package/dist/src/labs/AppTile.d.ts.map +1 -0
  165. package/dist/src/labs/DataView/BulkActionsMenu.d.ts.map +1 -0
  166. package/dist/src/labs/{DataComponents/StackContent.d.ts → DataView/CardLayoutContent.d.ts} +7 -7
  167. package/dist/src/labs/DataView/CardLayoutContent.d.ts.map +1 -0
  168. package/dist/src/labs/{DataComponents/StackCard.d.ts → DataView/DataCard.d.ts} +4 -4
  169. package/dist/src/labs/DataView/DataCard.d.ts.map +1 -0
  170. package/dist/src/labs/DataView/DataTable.d.ts +16 -0
  171. package/dist/src/labs/DataView/DataTable.d.ts.map +1 -0
  172. package/dist/src/labs/{DataComponents → DataView}/DataView.d.ts +1 -1
  173. package/dist/src/labs/DataView/DataView.d.ts.map +1 -0
  174. package/dist/src/labs/{DataComponents → DataView}/DetailPanel.d.ts +2 -2
  175. package/dist/src/labs/DataView/DetailPanel.d.ts.map +1 -0
  176. package/dist/src/labs/DataView/LayoutSwitcher.d.ts.map +1 -0
  177. package/dist/src/labs/DataView/RowActions.d.ts.map +1 -0
  178. package/dist/src/labs/{DataComponents/TableContent.d.ts → DataView/TableLayoutContent.d.ts} +7 -7
  179. package/dist/src/labs/DataView/TableLayoutContent.d.ts.map +1 -0
  180. package/dist/src/labs/{DataComponents → DataView}/TableSettings.d.ts +3 -3
  181. package/dist/src/labs/DataView/TableSettings.d.ts.map +1 -0
  182. package/dist/src/labs/{DataComponents → DataView}/componentTypes.d.ts +11 -9
  183. package/dist/src/labs/DataView/componentTypes.d.ts.map +1 -0
  184. package/dist/src/labs/{DataComponents → DataView}/constants.d.ts +1 -1
  185. package/dist/src/labs/DataView/constants.d.ts.map +1 -0
  186. package/dist/src/labs/DataView/dataTypes.d.ts.map +1 -0
  187. package/dist/src/labs/{DataComponents → DataView}/fetchData.d.ts +1 -1
  188. package/dist/src/labs/DataView/fetchData.d.ts.map +1 -0
  189. package/dist/src/labs/{DataComponents → DataView}/index.d.ts +0 -1
  190. package/dist/src/labs/DataView/index.d.ts.map +1 -0
  191. package/dist/src/labs/DataView/tableConstants.d.ts.map +1 -0
  192. package/dist/src/labs/{DataComponents → DataView}/useFilterConversion.d.ts +2 -2
  193. package/dist/src/labs/DataView/useFilterConversion.d.ts.map +1 -0
  194. package/dist/src/labs/SideNav/CollapseIcon.d.ts +17 -0
  195. package/dist/src/labs/SideNav/CollapseIcon.d.ts.map +1 -0
  196. package/dist/src/labs/SideNav/SideNav.d.ts +15 -0
  197. package/dist/src/labs/SideNav/SideNav.d.ts.map +1 -0
  198. package/dist/src/labs/SideNav/SideNavFooterContent.d.ts +17 -0
  199. package/dist/src/labs/SideNav/SideNavFooterContent.d.ts.map +1 -0
  200. package/dist/src/labs/SideNav/SideNavHeader.d.ts +16 -0
  201. package/dist/src/labs/SideNav/SideNavHeader.d.ts.map +1 -0
  202. package/dist/src/labs/SideNav/SideNavItemContent.d.ts +33 -0
  203. package/dist/src/labs/SideNav/SideNavItemContent.d.ts.map +1 -0
  204. package/dist/src/labs/SideNav/SideNavItemLinkContent.d.ts +16 -0
  205. package/dist/src/labs/SideNav/SideNavItemLinkContent.d.ts.map +1 -0
  206. package/dist/src/labs/SideNav/index.d.ts +14 -0
  207. package/dist/src/labs/SideNav/index.d.ts.map +1 -0
  208. package/dist/src/labs/{SideNav.d.ts → SideNav/types.d.ts} +31 -33
  209. package/dist/src/labs/SideNav/types.d.ts.map +1 -0
  210. package/dist/src/labs/Switch.d.ts +5 -1
  211. package/dist/src/labs/Switch.d.ts.map +1 -1
  212. package/dist/src/labs/index.d.ts +2 -1
  213. package/dist/src/labs/index.d.ts.map +1 -1
  214. package/dist/src/properties/ts/odyssey-react-mui_cs.d.ts +15 -1
  215. package/dist/src/properties/ts/odyssey-react-mui_cs.d.ts.map +1 -1
  216. package/dist/src/properties/ts/odyssey-react-mui_da.d.ts +15 -1
  217. package/dist/src/properties/ts/odyssey-react-mui_da.d.ts.map +1 -1
  218. package/dist/src/properties/ts/odyssey-react-mui_de.d.ts +15 -1
  219. package/dist/src/properties/ts/odyssey-react-mui_de.d.ts.map +1 -1
  220. package/dist/src/properties/ts/odyssey-react-mui_el.d.ts +15 -1
  221. package/dist/src/properties/ts/odyssey-react-mui_el.d.ts.map +1 -1
  222. package/dist/src/properties/ts/odyssey-react-mui_es.d.ts +15 -1
  223. package/dist/src/properties/ts/odyssey-react-mui_es.d.ts.map +1 -1
  224. package/dist/src/properties/ts/odyssey-react-mui_fi.d.ts +15 -1
  225. package/dist/src/properties/ts/odyssey-react-mui_fi.d.ts.map +1 -1
  226. package/dist/src/properties/ts/odyssey-react-mui_fr.d.ts +15 -1
  227. package/dist/src/properties/ts/odyssey-react-mui_fr.d.ts.map +1 -1
  228. package/dist/src/properties/ts/odyssey-react-mui_ht.d.ts +16 -2
  229. package/dist/src/properties/ts/odyssey-react-mui_ht.d.ts.map +1 -1
  230. package/dist/src/properties/ts/odyssey-react-mui_hu.d.ts +15 -1
  231. package/dist/src/properties/ts/odyssey-react-mui_hu.d.ts.map +1 -1
  232. package/dist/src/properties/ts/odyssey-react-mui_id.d.ts +15 -1
  233. package/dist/src/properties/ts/odyssey-react-mui_id.d.ts.map +1 -1
  234. package/dist/src/properties/ts/odyssey-react-mui_it.d.ts +15 -1
  235. package/dist/src/properties/ts/odyssey-react-mui_it.d.ts.map +1 -1
  236. package/dist/src/properties/ts/odyssey-react-mui_ja.d.ts +15 -1
  237. package/dist/src/properties/ts/odyssey-react-mui_ja.d.ts.map +1 -1
  238. package/dist/src/properties/ts/odyssey-react-mui_ko.d.ts +15 -1
  239. package/dist/src/properties/ts/odyssey-react-mui_ko.d.ts.map +1 -1
  240. package/dist/src/properties/ts/odyssey-react-mui_ms.d.ts +15 -1
  241. package/dist/src/properties/ts/odyssey-react-mui_ms.d.ts.map +1 -1
  242. package/dist/src/properties/ts/odyssey-react-mui_nb.d.ts +15 -1
  243. package/dist/src/properties/ts/odyssey-react-mui_nb.d.ts.map +1 -1
  244. package/dist/src/properties/ts/odyssey-react-mui_nl_NL.d.ts +15 -1
  245. package/dist/src/properties/ts/odyssey-react-mui_nl_NL.d.ts.map +1 -1
  246. package/dist/src/properties/ts/odyssey-react-mui_pl.d.ts +15 -1
  247. package/dist/src/properties/ts/odyssey-react-mui_pl.d.ts.map +1 -1
  248. package/dist/src/properties/ts/odyssey-react-mui_pt_BR.d.ts +15 -1
  249. package/dist/src/properties/ts/odyssey-react-mui_pt_BR.d.ts.map +1 -1
  250. package/dist/src/properties/ts/odyssey-react-mui_ro.d.ts +15 -1
  251. package/dist/src/properties/ts/odyssey-react-mui_ro.d.ts.map +1 -1
  252. package/dist/src/properties/ts/odyssey-react-mui_ru.d.ts +15 -1
  253. package/dist/src/properties/ts/odyssey-react-mui_ru.d.ts.map +1 -1
  254. package/dist/src/properties/ts/odyssey-react-mui_sv.d.ts +15 -1
  255. package/dist/src/properties/ts/odyssey-react-mui_sv.d.ts.map +1 -1
  256. package/dist/src/properties/ts/odyssey-react-mui_th.d.ts +15 -1
  257. package/dist/src/properties/ts/odyssey-react-mui_th.d.ts.map +1 -1
  258. package/dist/src/properties/ts/odyssey-react-mui_tr.d.ts +15 -1
  259. package/dist/src/properties/ts/odyssey-react-mui_tr.d.ts.map +1 -1
  260. package/dist/src/properties/ts/odyssey-react-mui_uk.d.ts +15 -1
  261. package/dist/src/properties/ts/odyssey-react-mui_uk.d.ts.map +1 -1
  262. package/dist/src/properties/ts/odyssey-react-mui_vi.d.ts +15 -1
  263. package/dist/src/properties/ts/odyssey-react-mui_vi.d.ts.map +1 -1
  264. package/dist/src/properties/ts/odyssey-react-mui_zh_CN.d.ts +15 -1
  265. package/dist/src/properties/ts/odyssey-react-mui_zh_CN.d.ts.map +1 -1
  266. package/dist/src/properties/ts/odyssey-react-mui_zh_TW.d.ts +15 -1
  267. package/dist/src/properties/ts/odyssey-react-mui_zh_TW.d.ts.map +1 -1
  268. package/dist/src/theme/components.d.ts +3 -1
  269. package/dist/src/theme/components.d.ts.map +1 -1
  270. package/dist/src/theme/createOdysseyMuiTheme.d.ts +3 -1
  271. package/dist/src/theme/createOdysseyMuiTheme.d.ts.map +1 -1
  272. package/dist/theme/components.js +236 -151
  273. package/dist/theme/components.js.map +1 -1
  274. package/dist/theme/createOdysseyMuiTheme.js +3 -2
  275. package/dist/theme/createOdysseyMuiTheme.js.map +1 -1
  276. package/dist/tsconfig.production.tsbuildinfo +1 -1
  277. package/package.json +3 -4
  278. package/src/Autocomplete.tsx +108 -45
  279. package/src/Checkbox.tsx +39 -9
  280. package/src/CheckboxGroup.tsx +20 -4
  281. package/src/DataTable/DataTable.tsx +24 -1
  282. package/src/DataTable/useScrollIndication.tsx +2 -2
  283. package/src/Field.tsx +5 -2
  284. package/src/OdysseyCacheProvider.tsx +18 -4
  285. package/src/OdysseyProvider.tsx +6 -3
  286. package/src/OdysseyThemeProvider.tsx +6 -2
  287. package/src/Pagination/Pagination.tsx +3 -1
  288. package/src/Radio.tsx +42 -13
  289. package/src/RadioGroup.tsx +26 -7
  290. package/src/Select.tsx +78 -45
  291. package/src/ToastStack.tsx +2 -2
  292. package/src/{createShadowRootElement.ts → createShadowDomElements.ts} +24 -5
  293. package/src/index.ts +1 -1
  294. package/src/labs/AppTile.tsx +200 -0
  295. package/src/labs/{DataComponents/StackContent.tsx → DataView/CardLayoutContent.tsx} +24 -19
  296. package/src/labs/{DataComponents/StackCard.tsx → DataView/DataCard.tsx} +7 -7
  297. package/src/labs/{DataComponents → DataView}/DataTable.tsx +8 -4
  298. package/src/labs/{DataComponents → DataView}/DataView.tsx +49 -19
  299. package/src/labs/{DataComponents → DataView}/DetailPanel.tsx +2 -2
  300. package/src/labs/{DataComponents/TableContent.tsx → DataView/TableLayoutContent.tsx} +31 -26
  301. package/src/labs/{DataComponents → DataView}/TableSettings.tsx +5 -4
  302. package/src/labs/{DataComponents → DataView}/componentTypes.ts +11 -9
  303. package/src/labs/{DataComponents → DataView}/constants.tsx +2 -2
  304. package/src/labs/{DataComponents → DataView}/fetchData.ts +3 -3
  305. package/src/labs/{DataComponents → DataView}/index.tsx +0 -1
  306. package/src/labs/{DataComponents → DataView}/useFilterConversion.ts +2 -2
  307. package/src/labs/SideNav/CollapseIcon.tsx +48 -0
  308. package/src/labs/SideNav/SideNav.tsx +350 -0
  309. package/src/labs/SideNav/SideNavFooterContent.tsx +64 -0
  310. package/src/labs/SideNav/SideNavHeader.tsx +65 -0
  311. package/src/labs/SideNav/SideNavItemContent.tsx +216 -0
  312. package/src/labs/SideNav/SideNavItemLinkContent.tsx +87 -0
  313. package/src/labs/SideNav/index.ts +15 -0
  314. package/src/labs/SideNav/types.ts +125 -0
  315. package/src/labs/Switch.tsx +85 -31
  316. package/src/labs/index.ts +3 -1
  317. package/src/properties/translations/odyssey-react-mui_cs.properties +15 -3
  318. package/src/properties/translations/odyssey-react-mui_da.properties +15 -3
  319. package/src/properties/translations/odyssey-react-mui_de.properties +14 -2
  320. package/src/properties/translations/odyssey-react-mui_el.properties +16 -4
  321. package/src/properties/translations/odyssey-react-mui_es.properties +15 -3
  322. package/src/properties/translations/odyssey-react-mui_fi.properties +15 -3
  323. package/src/properties/translations/odyssey-react-mui_fr.properties +15 -3
  324. package/src/properties/translations/odyssey-react-mui_ht.properties +17 -6
  325. package/src/properties/translations/odyssey-react-mui_hu.properties +15 -3
  326. package/src/properties/translations/odyssey-react-mui_id.properties +15 -3
  327. package/src/properties/translations/odyssey-react-mui_it.properties +15 -3
  328. package/src/properties/translations/odyssey-react-mui_ja.properties +14 -2
  329. package/src/properties/translations/odyssey-react-mui_ko.properties +14 -2
  330. package/src/properties/translations/odyssey-react-mui_ms.properties +15 -3
  331. package/src/properties/translations/odyssey-react-mui_nb.properties +15 -3
  332. package/src/properties/translations/odyssey-react-mui_nl_NL.properties +15 -3
  333. package/src/properties/translations/odyssey-react-mui_pl.properties +15 -3
  334. package/src/properties/translations/odyssey-react-mui_pt_BR.properties +15 -3
  335. package/src/properties/translations/odyssey-react-mui_ro.properties +15 -3
  336. package/src/properties/translations/odyssey-react-mui_ru.properties +15 -3
  337. package/src/properties/translations/odyssey-react-mui_sv.properties +15 -3
  338. package/src/properties/translations/odyssey-react-mui_th.properties +14 -2
  339. package/src/properties/translations/odyssey-react-mui_tr.properties +15 -3
  340. package/src/properties/translations/odyssey-react-mui_uk.properties +15 -3
  341. package/src/properties/translations/odyssey-react-mui_vi.properties +15 -3
  342. package/src/properties/translations/odyssey-react-mui_zh_CN.properties +14 -2
  343. package/src/properties/translations/odyssey-react-mui_zh_TW.properties +14 -2
  344. package/src/properties/ts/odyssey-react-mui_cs.ts +1 -1
  345. package/src/properties/ts/odyssey-react-mui_da.ts +1 -1
  346. package/src/properties/ts/odyssey-react-mui_de.ts +1 -1
  347. package/src/properties/ts/odyssey-react-mui_el.ts +1 -1
  348. package/src/properties/ts/odyssey-react-mui_es.ts +1 -1
  349. package/src/properties/ts/odyssey-react-mui_fi.ts +1 -1
  350. package/src/properties/ts/odyssey-react-mui_fr.ts +1 -1
  351. package/src/properties/ts/odyssey-react-mui_ht.ts +1 -1
  352. package/src/properties/ts/odyssey-react-mui_hu.ts +1 -1
  353. package/src/properties/ts/odyssey-react-mui_id.ts +1 -1
  354. package/src/properties/ts/odyssey-react-mui_it.ts +1 -1
  355. package/src/properties/ts/odyssey-react-mui_ja.ts +1 -1
  356. package/src/properties/ts/odyssey-react-mui_ko.ts +1 -1
  357. package/src/properties/ts/odyssey-react-mui_ms.ts +1 -1
  358. package/src/properties/ts/odyssey-react-mui_nb.ts +1 -1
  359. package/src/properties/ts/odyssey-react-mui_nl_NL.ts +1 -1
  360. package/src/properties/ts/odyssey-react-mui_pl.ts +1 -1
  361. package/src/properties/ts/odyssey-react-mui_pt_BR.ts +1 -1
  362. package/src/properties/ts/odyssey-react-mui_ro.ts +1 -1
  363. package/src/properties/ts/odyssey-react-mui_ru.ts +1 -1
  364. package/src/properties/ts/odyssey-react-mui_sv.ts +1 -1
  365. package/src/properties/ts/odyssey-react-mui_th.ts +1 -1
  366. package/src/properties/ts/odyssey-react-mui_tr.ts +1 -1
  367. package/src/properties/ts/odyssey-react-mui_uk.ts +1 -1
  368. package/src/properties/ts/odyssey-react-mui_vi.ts +1 -1
  369. package/src/properties/ts/odyssey-react-mui_zh_CN.ts +1 -1
  370. package/src/properties/ts/odyssey-react-mui_zh_TW.ts +1 -1
  371. package/src/theme/components.tsx +245 -155
  372. package/src/theme/createOdysseyMuiTheme.ts +4 -1
  373. package/dist/createShadowRootElement.js.map +0 -1
  374. package/dist/labs/DataComponents/BulkActionsMenu.js.map +0 -1
  375. package/dist/labs/DataComponents/DataStack.js +0 -85
  376. package/dist/labs/DataComponents/DataStack.js.map +0 -1
  377. package/dist/labs/DataComponents/DataTable.js.map +0 -1
  378. package/dist/labs/DataComponents/DataView.js.map +0 -1
  379. package/dist/labs/DataComponents/DetailPanel.js.map +0 -1
  380. package/dist/labs/DataComponents/LayoutSwitcher.js.map +0 -1
  381. package/dist/labs/DataComponents/RowActions.js.map +0 -1
  382. package/dist/labs/DataComponents/StackCard.js.map +0 -1
  383. package/dist/labs/DataComponents/StackContent.js.map +0 -1
  384. package/dist/labs/DataComponents/TableContent.js.map +0 -1
  385. package/dist/labs/DataComponents/TableSettings.js.map +0 -1
  386. package/dist/labs/DataComponents/componentTypes.js.map +0 -1
  387. package/dist/labs/DataComponents/constants.js.map +0 -1
  388. package/dist/labs/DataComponents/dataTypes.js.map +0 -1
  389. package/dist/labs/DataComponents/fetchData.js.map +0 -1
  390. package/dist/labs/DataComponents/index.js.map +0 -1
  391. package/dist/labs/DataComponents/tableConstants.js.map +0 -1
  392. package/dist/labs/DataComponents/useFilterConversion.js.map +0 -1
  393. package/dist/labs/SideNav.js +0 -478
  394. package/dist/labs/SideNav.js.map +0 -1
  395. package/dist/src/createShadowRootElement.d.ts.map +0 -1
  396. package/dist/src/labs/DataComponents/BulkActionsMenu.d.ts.map +0 -1
  397. package/dist/src/labs/DataComponents/DataStack.d.ts +0 -20
  398. package/dist/src/labs/DataComponents/DataStack.d.ts.map +0 -1
  399. package/dist/src/labs/DataComponents/DataTable.d.ts +0 -16
  400. package/dist/src/labs/DataComponents/DataTable.d.ts.map +0 -1
  401. package/dist/src/labs/DataComponents/DataView.d.ts.map +0 -1
  402. package/dist/src/labs/DataComponents/DetailPanel.d.ts.map +0 -1
  403. package/dist/src/labs/DataComponents/LayoutSwitcher.d.ts.map +0 -1
  404. package/dist/src/labs/DataComponents/RowActions.d.ts.map +0 -1
  405. package/dist/src/labs/DataComponents/StackCard.d.ts.map +0 -1
  406. package/dist/src/labs/DataComponents/StackContent.d.ts.map +0 -1
  407. package/dist/src/labs/DataComponents/TableContent.d.ts.map +0 -1
  408. package/dist/src/labs/DataComponents/TableSettings.d.ts.map +0 -1
  409. package/dist/src/labs/DataComponents/componentTypes.d.ts.map +0 -1
  410. package/dist/src/labs/DataComponents/constants.d.ts.map +0 -1
  411. package/dist/src/labs/DataComponents/dataTypes.d.ts.map +0 -1
  412. package/dist/src/labs/DataComponents/fetchData.d.ts.map +0 -1
  413. package/dist/src/labs/DataComponents/index.d.ts.map +0 -1
  414. package/dist/src/labs/DataComponents/tableConstants.d.ts.map +0 -1
  415. package/dist/src/labs/DataComponents/useFilterConversion.d.ts.map +0 -1
  416. package/dist/src/labs/SideNav.d.ts.map +0 -1
  417. package/src/labs/DataComponents/DataStack.tsx +0 -105
  418. package/src/labs/SideNav.tsx +0 -745
  419. /package/dist/labs/{DataComponents → DataView}/BulkActionsMenu.js +0 -0
  420. /package/dist/labs/{DataComponents → DataView}/DetailPanel.js +0 -0
  421. /package/dist/labs/{DataComponents → DataView}/LayoutSwitcher.js +0 -0
  422. /package/dist/labs/{DataComponents → DataView}/RowActions.js +0 -0
  423. /package/dist/labs/{DataComponents → DataView}/componentTypes.js +0 -0
  424. /package/dist/labs/{DataComponents → DataView}/dataTypes.js +0 -0
  425. /package/dist/labs/{DataComponents → DataView}/tableConstants.js +0 -0
  426. /package/dist/labs/{DataComponents → DataView}/useFilterConversion.js +0 -0
  427. /package/dist/src/labs/{DataComponents → DataView}/BulkActionsMenu.d.ts +0 -0
  428. /package/dist/src/labs/{DataComponents → DataView}/LayoutSwitcher.d.ts +0 -0
  429. /package/dist/src/labs/{DataComponents → DataView}/RowActions.d.ts +0 -0
  430. /package/dist/src/labs/{DataComponents → DataView}/dataTypes.d.ts +0 -0
  431. /package/dist/src/labs/{DataComponents → DataView}/tableConstants.d.ts +0 -0
  432. /package/src/labs/{DataComponents → DataView}/BulkActionsMenu.tsx +0 -0
  433. /package/src/labs/{DataComponents → DataView}/LayoutSwitcher.tsx +0 -0
  434. /package/src/labs/{DataComponents → DataView}/RowActions.tsx +0 -0
  435. /package/src/labs/{DataComponents → DataView}/dataTypes.ts +0 -0
  436. /package/src/labs/{DataComponents → DataView}/tableConstants.tsx +0 -0
@@ -1 +1 @@
1
- {"version":3,"file":"ToastStack.js","names":["memo","jsx","_jsx","ToastStack","children","_Snackbar","open","_Box","sx","display","flexDirection","gap","MemoizedToastStack","displayName"],"sources":["../src/ToastStack.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 { memo, ReactElement } from \"react\";\nimport { Box, Snackbar } from \"@mui/material\";\nimport { Toast } from \"./Toast\";\n\nexport type ToastStackProps = {\n /**\n * The Toast or array of Toasts within the ToastStack\n */\n children: ReactElement<typeof Toast> | Array<ReactElement<typeof Toast>>;\n};\n\nconst ToastStack = ({ children }: ToastStackProps) => {\n return (\n <Snackbar open={true}>\n <Box\n sx={{\n display: \"flex\",\n flexDirection: \"column-reverse\",\n gap: 2,\n }}\n >\n {children}\n </Box>\n </Snackbar>\n );\n};\n\nconst MemoizedToastStack = memo(ToastStack);\nMemoizedToastStack.displayName = \"ToastStack\";\n\nexport { MemoizedToastStack as ToastStack };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAsB,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAW3C,MAAMC,UAAU,GAAGA,CAAC;EAAEC;AAA0B,CAAC,KAAK;EACpD,OACEF,IAAA,CAAAG,SAAA;IAAUC,IAAI,EAAE,IAAK;IAAAF,QAAA,EACnBF,IAAA,CAAAK,IAAA;MACEC,EAAE,EAAE;QACFC,OAAO,EAAE,MAAM;QACfC,aAAa,EAAE,gBAAgB;QAC/BC,GAAG,EAAE;MACP,CAAE;MAAAP,QAAA,EAEDA;IAAQ,CACN;EAAC,CACE,CAAC;AAEf,CAAC;AAED,MAAMQ,kBAAkB,GAAGZ,IAAI,CAACG,UAAU,CAAC;AAC3CS,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIT,UAAU"}
1
+ {"version":3,"file":"ToastStack.js","names":["memo","jsx","_jsx","ToastStack","children","_Snackbar","open","_Box","sx","display","flexDirection","gap","MemoizedToastStack","displayName"],"sources":["../src/ToastStack.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 { memo, ReactElement } from \"react\";\nimport { Box, Snackbar } from \"@mui/material\";\nimport { Toast } from \"./Toast\";\n\nexport type ToastListProps = {\n /**\n * The Toast or array of Toasts within the ToastStack\n */\n children: ReactElement<typeof Toast> | Array<ReactElement<typeof Toast>>;\n};\n\nconst ToastStack = ({ children }: ToastListProps) => {\n return (\n <Snackbar open={true}>\n <Box\n sx={{\n display: \"flex\",\n flexDirection: \"column-reverse\",\n gap: 2,\n }}\n >\n {children}\n </Box>\n </Snackbar>\n );\n};\n\nconst MemoizedToastStack = memo(ToastStack);\nMemoizedToastStack.displayName = \"ToastStack\";\n\nexport { MemoizedToastStack as ToastStack };\n"],"mappings":";;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,QAAsB,OAAO;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAW3C,MAAMC,UAAU,GAAGA,CAAC;EAAEC;AAAyB,CAAC,KAAK;EACnD,OACEF,IAAA,CAAAG,SAAA;IAAUC,IAAI,EAAE,IAAK;IAAAF,QAAA,EACnBF,IAAA,CAAAK,IAAA;MACEC,EAAE,EAAE;QACFC,OAAO,EAAE,MAAM;QACfC,aAAa,EAAE,gBAAgB;QAC/BC,GAAG,EAAE;MACP,CAAE;MAAAP,QAAA,EAEDA;IAAQ,CACN;EAAC,CACE,CAAC;AAEf,CAAC;AAED,MAAMQ,kBAAkB,GAAGZ,IAAI,CAACG,UAAU,CAAC;AAC3CS,kBAAkB,CAACC,WAAW,GAAG,YAAY;AAE7C,SAASD,kBAAkB,IAAIT,UAAU"}
@@ -10,17 +10,33 @@
10
10
  * See the License for the specific language governing permissions and limitations under the License.
11
11
  */
12
12
 
13
+ export const createShadowDomElements = containerElement => {
14
+ const shadowRoot = containerElement.attachShadow({
15
+ mode: "open"
16
+ });
17
+ const emotionRootElement = document.createElement("div");
18
+ emotionRootElement.setAttribute("id", "style-root");
19
+ emotionRootElement.setAttribute("nonce", window.cspNonce);
20
+ const shadowRootElement = document.createElement("div");
21
+ shadowRootElement.setAttribute("id", "shadow-root");
22
+ shadowRoot.appendChild(emotionRootElement);
23
+ shadowRoot.appendChild(shadowRootElement);
24
+ return {
25
+ emotionRootElement,
26
+ shadowRootElement
27
+ };
28
+ };
13
29
  export const createShadowRootElement = containerElement => {
14
30
  const shadowRoot = containerElement.attachShadow({
15
31
  mode: "open"
16
32
  });
17
- const emotionRoot = document.createElement("style");
18
- emotionRoot.setAttribute("id", "style-root");
19
- emotionRoot.setAttribute("nonce", window.cspNonce);
33
+ const emotionRootElement = document.createElement("style");
34
+ emotionRootElement.setAttribute("id", "style-root");
35
+ emotionRootElement.setAttribute("nonce", window.cspNonce);
20
36
  const shadowRootElement = document.createElement("div");
21
37
  shadowRootElement.setAttribute("id", "shadow-root");
22
- shadowRoot.appendChild(emotionRoot);
38
+ shadowRoot.appendChild(emotionRootElement);
23
39
  shadowRoot.appendChild(shadowRootElement);
24
- return [emotionRoot, shadowRootElement];
40
+ return [emotionRootElement, shadowRootElement];
25
41
  };
26
- //# sourceMappingURL=createShadowRootElement.js.map
42
+ //# sourceMappingURL=createShadowDomElements.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"createShadowDomElements.js","names":["createShadowDomElements","containerElement","shadowRoot","attachShadow","mode","emotionRootElement","document","createElement","setAttribute","window","cspNonce","shadowRootElement","appendChild","createShadowRootElement"],"sources":["../src/createShadowDomElements.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\nexport const createShadowDomElements = (containerElement: HTMLElement) => {\n const shadowRoot = containerElement.attachShadow({ mode: \"open\" });\n\n // Container for Emotion `<style>` elements.\n const emotionRootElement = document.createElement(\"div\");\n emotionRootElement.setAttribute(\"id\", \"style-root\");\n emotionRootElement.setAttribute(\"nonce\", window.cspNonce);\n\n // React app root component.\n const shadowRootElement = document.createElement(\"div\");\n shadowRootElement.setAttribute(\"id\", \"shadow-root\");\n\n shadowRoot.appendChild(emotionRootElement);\n shadowRoot.appendChild(shadowRootElement);\n\n return { emotionRootElement, shadowRootElement };\n};\n\n/** @deprecated Use `createShadowDomElements` instead. */\nexport const createShadowRootElement = (\n containerElement: HTMLElement,\n): [HTMLStyleElement, HTMLDivElement] => {\n const shadowRoot = containerElement.attachShadow({ mode: \"open\" });\n\n // the element that styles will be cached into\n const emotionRootElement = document.createElement(\"style\");\n emotionRootElement.setAttribute(\"id\", \"style-root\");\n emotionRootElement.setAttribute(\"nonce\", window.cspNonce);\n\n // the element that emotion renders html into\n const shadowRootElement = document.createElement(\"div\");\n shadowRootElement.setAttribute(\"id\", \"shadow-root\");\n\n shadowRoot.appendChild(emotionRootElement);\n shadowRoot.appendChild(shadowRootElement);\n\n return [emotionRootElement, shadowRootElement];\n};\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,OAAO,MAAMA,uBAAuB,GAAIC,gBAA6B,IAAK;EACxE,MAAMC,UAAU,GAAGD,gBAAgB,CAACE,YAAY,CAAC;IAAEC,IAAI,EAAE;EAAO,CAAC,CAAC;EAGlE,MAAMC,kBAAkB,GAAGC,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EACxDF,kBAAkB,CAACG,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC;EACnDH,kBAAkB,CAACG,YAAY,CAAC,OAAO,EAAEC,MAAM,CAACC,QAAQ,CAAC;EAGzD,MAAMC,iBAAiB,GAAGL,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EACvDI,iBAAiB,CAACH,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC;EAEnDN,UAAU,CAACU,WAAW,CAACP,kBAAkB,CAAC;EAC1CH,UAAU,CAACU,WAAW,CAACD,iBAAiB,CAAC;EAEzC,OAAO;IAAEN,kBAAkB;IAAEM;EAAkB,CAAC;AAClD,CAAC;AAGD,OAAO,MAAME,uBAAuB,GAClCZ,gBAA6B,IACU;EACvC,MAAMC,UAAU,GAAGD,gBAAgB,CAACE,YAAY,CAAC;IAAEC,IAAI,EAAE;EAAO,CAAC,CAAC;EAGlE,MAAMC,kBAAkB,GAAGC,QAAQ,CAACC,aAAa,CAAC,OAAO,CAAC;EAC1DF,kBAAkB,CAACG,YAAY,CAAC,IAAI,EAAE,YAAY,CAAC;EACnDH,kBAAkB,CAACG,YAAY,CAAC,OAAO,EAAEC,MAAM,CAACC,QAAQ,CAAC;EAGzD,MAAMC,iBAAiB,GAAGL,QAAQ,CAACC,aAAa,CAAC,KAAK,CAAC;EACvDI,iBAAiB,CAACH,YAAY,CAAC,IAAI,EAAE,aAAa,CAAC;EAEnDN,UAAU,CAACU,WAAW,CAACP,kBAAkB,CAAC;EAC1CH,UAAU,CAACU,WAAW,CAACD,iBAAiB,CAAC;EAEzC,OAAO,CAACN,kBAAkB,EAAEM,iBAAiB,CAAC;AAChD,CAAC"}
package/dist/index.js CHANGED
@@ -27,7 +27,7 @@ export * from "./Checkbox.js";
27
27
  export * from "./CheckboxGroup.js";
28
28
  export * from "./CircularProgress.js";
29
29
  export * from "./CssBaseline.js";
30
- export * from "./createShadowRootElement.js";
30
+ export * from "./createShadowDomElements.js";
31
31
  export * from "./createUniqueId.js";
32
32
  export * from "./DataTable/index.js";
33
33
  export * from "./Dialog.js";
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","odysseyTranslate","useOdysseyDesignTokens","badgeContentMaxValues"],"sources":["../src/index.ts"],"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\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n createTheme,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n DialogContentText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Divider,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputAdornment,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputBase,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemIcon,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListSubheader,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n MenuList,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Paper,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ScopedCssBaseline,\n ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n CssBaselineProps,\n DialogContentTextProps,\n DividerProps,\n InputAdornmentProps,\n InputBaseProps,\n ListItemIconProps,\n ListItemTextProps,\n ListSubheaderProps,\n MenuListProps,\n PaperProps,\n ScopedCssBaselineProps,\n ThemeOptions,\n} from \"@mui/material\";\n\nexport { odysseyTranslate } from \"./i18n\";\nexport type { FocusHandle } from \"./inputUtils\";\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport { badgeContentMaxValues } from \"./Badge\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Card\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./CssBaseline\";\nexport * from \"./createShadowRootElement\";\nexport * from \"./createUniqueId\";\nexport * from \"./DataTable\";\nexport * from \"./Dialog\";\nexport * from \"./Drawer\";\nexport * from \"./EmptyState\";\nexport * from \"./Fieldset\";\nexport * from \"./FieldComponentProps\";\nexport * from \"./Form\";\nexport * from \"./HintLink\";\nexport * from \"./IconWithTooltip\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Surface\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./labs/Switch\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\nexport * from \"./Pagination\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAiBdC,gBAAgB;AAAA,SAEhBC,sBAAsB;AAAA;AAAA;AAAA,SAItBC,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
1
+ {"version":3,"file":"index.js","names":["deepmerge","visuallyHidden","createTheme","DialogContentText","Divider","InputAdornment","InputBase","ListItemIcon","ListItemText","ListSubheader","MenuList","Paper","ScopedCssBaseline","ThemeProvider","odysseyTranslate","useOdysseyDesignTokens","badgeContentMaxValues"],"sources":["../src/index.ts"],"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\nexport { deepmerge, visuallyHidden } from \"@mui/utils\";\n\nexport {\n createTheme,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n DialogContentText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Divider,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputAdornment,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n InputBase,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemIcon,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListItemText,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ListSubheader,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n MenuList,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n Paper,\n /** @deprecated Will be removed in a future Odyssey version in lieu of a wrapped version. */\n ScopedCssBaseline,\n ThemeProvider,\n} from \"@mui/material\";\n\nexport type {\n CssBaselineProps,\n DialogContentTextProps,\n DividerProps,\n InputAdornmentProps,\n InputBaseProps,\n ListItemIconProps,\n ListItemTextProps,\n ListSubheaderProps,\n MenuListProps,\n PaperProps,\n ScopedCssBaselineProps,\n ThemeOptions,\n} from \"@mui/material\";\n\nexport { odysseyTranslate } from \"./i18n\";\nexport type { FocusHandle } from \"./inputUtils\";\nexport { useOdysseyDesignTokens } from \"./OdysseyDesignTokensContext\";\n\nexport * from \"./Accordion\";\nexport * from \"./Autocomplete\";\nexport { badgeContentMaxValues } from \"./Badge\";\nexport * from \"./Banner\";\nexport * from \"./Box\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./Button\";\nexport * from \"./Card\";\nexport * from \"./Callout\";\nexport * from \"./Checkbox\";\nexport * from \"./CheckboxGroup\";\nexport * from \"./CircularProgress\";\nexport * from \"./CssBaseline\";\nexport * from \"./createShadowDomElements\";\nexport * from \"./createUniqueId\";\nexport * from \"./DataTable\";\nexport * from \"./Dialog\";\nexport * from \"./Drawer\";\nexport * from \"./EmptyState\";\nexport * from \"./Fieldset\";\nexport * from \"./FieldComponentProps\";\nexport * from \"./Form\";\nexport * from \"./HintLink\";\nexport * from \"./IconWithTooltip\";\nexport * from \"./Link\";\nexport * from \"./MenuButton\";\nexport * from \"./MenuItem\";\nexport * from \"./NativeSelect\";\nexport * from \"./NullElement\";\nexport * from \"./OdysseyCacheProvider\";\nexport * from \"./OdysseyProvider\";\nexport * from \"./OdysseyThemeProvider\";\nexport * from \"./OdysseyTranslationProvider\";\nexport * from \"./PasswordField\";\nexport * from \"./Radio\";\nexport * from \"./RadioGroup\";\nexport * from \"./ScreenReaderText\";\nexport * from \"./SearchField\";\nexport * from \"./Select\";\nexport * from \"./Status\";\nexport * from \"./Surface\";\nexport * from \"./Tabs\";\nexport * from \"./Tag\";\nexport * from \"./TagList\";\nexport * from \"./TextField\";\nexport * from \"./theme\";\nexport * from \"./Toast\";\nexport * from \"./ToastStack\";\nexport * from \"./labs/Switch\";\nexport * from \"./Tooltip\";\nexport * from \"./Typography\";\nexport * from \"./useUniqueId\";\nexport * from \"./Pagination\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,SAAS,EAAEC,cAAc,QAAQ,YAAY;AAEtD,SACEC,WAAW,EAEXC,iBAAiB,EAEjBC,OAAO,EAEPC,cAAc,EAEdC,SAAS,EAETC,YAAY,EAEZC,YAAY,EAEZC,aAAa,EAEbC,QAAQ,EAERC,KAAK,EAELC,iBAAiB,EACjBC,aAAa,QACR,eAAe;AAAC,SAiBdC,gBAAgB;AAAA,SAEhBC,sBAAsB;AAAA;AAAA;AAAA,SAItBC,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA"}
package/dist/index.scss CHANGED
@@ -1,7 +1,7 @@
1
1
 
2
2
  /**
3
3
  * Do not edit directly
4
- * Generated on Wed, 07 Aug 2024 22:09:56 GMT
4
+ * Generated on Thu, 05 Sep 2024 19:54:26 GMT
5
5
  */
6
6
 
7
7
  $border-color-control: #8d8d8d !default;
@@ -70,8 +70,8 @@ $hue-red-600: #d92300 !default;
70
70
  $hue-red-700: #951800 !default;
71
71
  $hue-red-800: #711200 !default;
72
72
  $hue-red-900: #500d00 !default;
73
- $hue-yellow-50: #fcf6ac !default;
74
- $hue-yellow-100: #fce101 !default;
73
+ $hue-yellow-50: #fdfad9 !default;
74
+ $hue-yellow-100: #ffe01a !default;
75
75
  $hue-yellow-200: #f9c503 !default;
76
76
  $hue-yellow-300: #eb9e05 !default;
77
77
  $hue-yellow-400: #bf8004 !default;
@@ -96,14 +96,14 @@ $palette-danger-darker: #711200 !default;
96
96
  $palette-danger-text: #d92300 !default;
97
97
  $palette-danger-heading: #500d00 !default;
98
98
  $palette-danger-highlight: #ffd8d1 !default;
99
- $palette-warning-lighter: #fcf6ac !default;
99
+ $palette-warning-lighter: #fdfad9 !default;
100
100
  $palette-warning-light: #eb9e05 !default;
101
101
  $palette-warning-main: #a16c03 !default;
102
102
  $palette-warning-dark: #664402 !default;
103
103
  $palette-warning-darker: #4c3302 !default;
104
104
  $palette-warning-text: #966603 !default;
105
105
  $palette-warning-heading: #352401 !default;
106
- $palette-warning-highlight: #fce101 !default;
106
+ $palette-warning-highlight: #ffe01a !default;
107
107
  $palette-success-lighter: #defae7 !default;
108
108
  $palette-success-light: #59c282 !default;
109
109
  $palette-success-main: #16884a !default;
@@ -0,0 +1,124 @@
1
+ import _Card from "@mui/material/Card";
2
+ import _CardActionArea from "@mui/material/CardActionArea";
3
+ /*!
4
+ * Copyright (c) 2024-present, Okta, Inc. and/or its affiliates. All rights reserved.
5
+ * The Okta software accompanied by this notice is provided pursuant to the Apache License, Version 2.0 (the "License.")
6
+ *
7
+ * You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0.
8
+ * Unless required by applicable law or agreed to in writing, software
9
+ * distributed under the License is distributed on an "AS IS" BASIS, WITHOUT
10
+ * WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
11
+ *
12
+ * See the License for the specific language governing permissions and limitations under the License.
13
+ */
14
+
15
+ import { memo, useMemo } from "react";
16
+ import styled from "@emotion/styled";
17
+ import { Button } from ".././Button.js";
18
+ import { useOdysseyDesignTokens } from ".././OdysseyDesignTokensContext.js";
19
+ import { Heading5, Paragraph, Subordinate, Support } from ".././Typography.js";
20
+ import { Box } from ".././Box.js";
21
+ import { jsx as _jsx } from "react/jsx-runtime";
22
+ import { jsxs as _jsxs } from "react/jsx-runtime";
23
+ export const APP_TILE_IMAGE_HEIGHT = "64px";
24
+ const ImageContainer = styled("div", {
25
+ shouldForwardProp: prop => prop !== "odysseyDesignTokens" && prop !== "hasAction"
26
+ })(({
27
+ odysseyDesignTokens,
28
+ hasAction
29
+ }) => ({
30
+ display: "flex",
31
+ alignItems: "flex-start",
32
+ maxHeight: APP_TILE_IMAGE_HEIGHT,
33
+ marginBlockEnd: odysseyDesignTokens.Spacing5,
34
+ paddingRight: hasAction ? odysseyDesignTokens.Spacing5 : 0
35
+ }));
36
+ const ActionContainer = styled("div", {
37
+ shouldForwardProp: prop => prop !== "odysseyDesignTokens"
38
+ })(({
39
+ odysseyDesignTokens
40
+ }) => ({
41
+ alignItems: "center",
42
+ display: "flex",
43
+ minHeight: odysseyDesignTokens.Spacing6,
44
+ gap: odysseyDesignTokens.Spacing1,
45
+ position: "absolute",
46
+ right: odysseyDesignTokens.Spacing3,
47
+ top: odysseyDesignTokens.Spacing3
48
+ }));
49
+ const ContentContainer = styled("div")(() => ({
50
+ display: "flex"
51
+ }));
52
+ const ChildrenContainer = styled("div", {
53
+ shouldForwardProp: prop => prop !== "odysseyDesignTokens"
54
+ })(({
55
+ odysseyDesignTokens
56
+ }) => ({
57
+ ["&:not(:first-child)"]: {
58
+ marginBlockStart: odysseyDesignTokens.Spacing3
59
+ }
60
+ }));
61
+ const AppTile = ({
62
+ actionAriaControls,
63
+ actionAriaHasPopup,
64
+ actionAriaExpanded,
65
+ actionLabel,
66
+ actionIcon,
67
+ auxiliaryText,
68
+ children,
69
+ description,
70
+ image,
71
+ onActionClick,
72
+ onClick,
73
+ overline,
74
+ title
75
+ }) => {
76
+ const odysseyDesignTokens = useOdysseyDesignTokens();
77
+ const tileContent = useMemo(() => _jsx(ContentContainer, {
78
+ children: _jsxs(Box, {
79
+ children: [image && _jsx(ImageContainer, {
80
+ odysseyDesignTokens: odysseyDesignTokens,
81
+ hasAction: Boolean(onActionClick),
82
+ children: image
83
+ }), overline && _jsx(Support, {
84
+ component: "div",
85
+ children: overline
86
+ }), title && _jsx(Heading5, {
87
+ component: "div",
88
+ children: title
89
+ }), description && _jsx(Paragraph, {
90
+ color: "textSecondary",
91
+ children: description
92
+ }), children && _jsx(ChildrenContainer, {
93
+ odysseyDesignTokens: odysseyDesignTokens,
94
+ children: children
95
+ })]
96
+ })
97
+ }), [image, odysseyDesignTokens, onActionClick, overline, title, description, children]);
98
+ return _jsxs(_Card, {
99
+ className: "isClickable",
100
+ children: [_jsx(_CardActionArea, {
101
+ onClick: onClick,
102
+ children: tileContent
103
+ }), (onActionClick || auxiliaryText) && _jsxs(ActionContainer, {
104
+ odysseyDesignTokens: odysseyDesignTokens,
105
+ children: [auxiliaryText && _jsx(Subordinate, {
106
+ children: auxiliaryText
107
+ }), onActionClick && _jsx(Button, {
108
+ endIcon: actionIcon,
109
+ ariaLabel: actionLabel,
110
+ variant: "floating",
111
+ size: "small",
112
+ tooltipText: actionLabel,
113
+ ariaControls: actionAriaControls,
114
+ ariaExpanded: actionAriaExpanded,
115
+ ariaHasPopup: actionAriaHasPopup,
116
+ onClick: onActionClick
117
+ })]
118
+ })]
119
+ });
120
+ };
121
+ const MemoizedAppTile = memo(AppTile);
122
+ MemoizedAppTile.displayName = "AppTile";
123
+ export { MemoizedAppTile as AppTile };
124
+ //# sourceMappingURL=AppTile.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"AppTile.js","names":["memo","useMemo","styled","Button","useOdysseyDesignTokens","Heading5","Paragraph","Subordinate","Support","Box","jsx","_jsx","jsxs","_jsxs","APP_TILE_IMAGE_HEIGHT","ImageContainer","shouldForwardProp","prop","odysseyDesignTokens","hasAction","display","alignItems","maxHeight","marginBlockEnd","Spacing5","paddingRight","ActionContainer","minHeight","Spacing6","gap","Spacing1","position","right","Spacing3","top","ContentContainer","ChildrenContainer","marginBlockStart","AppTile","actionAriaControls","actionAriaHasPopup","actionAriaExpanded","actionLabel","actionIcon","auxiliaryText","children","description","image","onActionClick","onClick","overline","title","tileContent","Boolean","component","color","_Card","className","_CardActionArea","endIcon","ariaLabel","variant","size","tooltipText","ariaControls","ariaExpanded","ariaHasPopup","MemoizedAppTile","displayName"],"sources":["../../src/labs/AppTile.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 MouseEventHandler,\n ReactElement,\n memo,\n useMemo,\n ReactNode,\n HTMLAttributes,\n} from \"react\";\nimport {\n Card as MuiCard,\n CardActionArea as MuiCardActionArea,\n} from \"@mui/material\";\nimport styled from \"@emotion/styled\";\n\nimport { Button } from \".././Button\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \".././OdysseyDesignTokensContext\";\nimport { Heading5, Paragraph, Subordinate, Support } from \".././Typography\";\nimport { Box } from \".././Box\";\n\nexport const APP_TILE_IMAGE_HEIGHT = \"64px\";\n\nexport type AppTileProps = {\n // Text that appears in the upper right corner of the tile\n auxiliaryText?: string;\n // Arbitrary content to render underneath any other tile content\n children?: ReactNode;\n // A string description\n description?: string;\n // An image or icon at the top of the tile\n image?: ReactElement;\n // Event handler for when the user clicks the tile\n onClick: MouseEventHandler;\n // An 'eyebrow' of text above the title\n overline?: string;\n // A string for the tile title\n title?: string;\n} & (\n | {\n // Event that fires when the user clicks the action button in the upper-right corner\n // If this isn't set, the other action props can't be set either\n onActionClick: MouseEventHandler;\n // The ID of the element which the button controls (for instance, a drawer or dialog), if any.\n actionAriaControls?: HTMLAttributes<HTMLElement>[\"aria-controls\"];\n // Should be filled if the button controls a popup element such as a Drawer or Dialog\n actionAriaHasPopup?: HTMLAttributes<HTMLElement>[\"aria-haspopup\"];\n // Should be true if the button controls a popup element that is currently expanded. Should be synced to\n // the state of the popup element\n actionAriaExpanded?: HTMLAttributes<HTMLElement>[\"aria-expanded\"];\n // The label for the button, used as the aria-label and tooltip\n actionLabel: string;\n // An icon for the action button\n actionIcon: ReactElement;\n }\n | {\n onActionClick?: never;\n actionAriaControls?: never;\n actionAriaHasPopup?: never;\n actionAriaExpanded?: never;\n actionLabel?: never;\n actionIcon?: never;\n }\n);\n\nconst ImageContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"hasAction\",\n})<{\n odysseyDesignTokens: DesignTokens;\n hasAction: boolean;\n}>(({ odysseyDesignTokens, hasAction }) => ({\n display: \"flex\",\n alignItems: \"flex-start\",\n maxHeight: APP_TILE_IMAGE_HEIGHT,\n marginBlockEnd: odysseyDesignTokens.Spacing5,\n paddingRight: hasAction ? odysseyDesignTokens.Spacing5 : 0,\n}));\n\nconst ActionContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n alignItems: \"center\",\n display: \"flex\",\n minHeight: odysseyDesignTokens.Spacing6,\n gap: odysseyDesignTokens.Spacing1,\n position: \"absolute\",\n right: odysseyDesignTokens.Spacing3,\n top: odysseyDesignTokens.Spacing3,\n}));\n\nconst ContentContainer = styled(\"div\")(() => ({\n display: \"flex\",\n}));\n\nconst ChildrenContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n [\"&:not(:first-child)\"]: {\n marginBlockStart: odysseyDesignTokens.Spacing3,\n },\n}));\n\nconst AppTile = ({\n actionAriaControls,\n actionAriaHasPopup,\n actionAriaExpanded,\n actionLabel,\n actionIcon,\n auxiliaryText,\n children,\n description,\n image,\n onActionClick,\n onClick,\n overline,\n title,\n}: AppTileProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const tileContent = useMemo(\n () => (\n <ContentContainer>\n <Box>\n {image && (\n <ImageContainer\n odysseyDesignTokens={odysseyDesignTokens}\n hasAction={Boolean(onActionClick)}\n >\n {image}\n </ImageContainer>\n )}\n\n {overline && <Support component=\"div\">{overline}</Support>}\n {title && <Heading5 component=\"div\">{title}</Heading5>}\n {description && (\n <Paragraph color=\"textSecondary\">{description}</Paragraph>\n )}\n {children && (\n <ChildrenContainer odysseyDesignTokens={odysseyDesignTokens}>\n {children}\n </ChildrenContainer>\n )}\n </Box>\n </ContentContainer>\n ),\n [\n image,\n odysseyDesignTokens,\n onActionClick,\n overline,\n title,\n description,\n children,\n ],\n );\n\n return (\n <MuiCard className=\"isClickable\">\n <MuiCardActionArea onClick={onClick}>{tileContent}</MuiCardActionArea>\n\n {(onActionClick || auxiliaryText) && (\n <ActionContainer odysseyDesignTokens={odysseyDesignTokens}>\n {auxiliaryText && <Subordinate>{auxiliaryText}</Subordinate>}\n {onActionClick && (\n <Button\n endIcon={actionIcon}\n ariaLabel={actionLabel}\n variant=\"floating\"\n size=\"small\"\n tooltipText={actionLabel}\n ariaControls={actionAriaControls}\n ariaExpanded={actionAriaExpanded}\n ariaHasPopup={actionAriaHasPopup}\n onClick={onActionClick}\n />\n )}\n </ActionContainer>\n )}\n </MuiCard>\n );\n};\n\nconst MemoizedAppTile = memo(AppTile);\nMemoizedAppTile.displayName = \"AppTile\";\n\nexport { MemoizedAppTile as AppTile };\n"],"mappings":"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"}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"BulkActionsMenu.js","names":["memo","useCallback","styled","useTranslation","Box","Button","ChevronDownIcon","MenuButton","useOdysseyDesignTokens","jsx","_jsx","jsxs","_jsxs","BulkActionsContainer","shouldForwardProp","prop","odysseyDesignTokens","display","gap","Spacing2","BulkActionsMenu","data","menuItems","rowSelection","setRowSelection","t","selectedRowCount","Object","values","filter","Boolean","length","handleSelectAll","rows","fromEntries","map","row","id","handleSelectNone","children","ariaLabel","buttonLabel","buttonVariant","endIcon","isDisabled","label","onClick","variant","MemoizedBulkActionsMenu","displayName"],"sources":["../../../src/labs/DataView/BulkActionsMenu.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo, useCallback, Dispatch, SetStateAction } from \"react\";\nimport { MRT_RowData, MRT_RowSelectionState } from \"material-react-table\";\nimport styled from \"@emotion/styled\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Box } from \"../../Box\";\nimport { Button } from \"../../Button\";\nimport { ChevronDownIcon } from \"../../icons.generated\";\nimport { MenuButton } from \"../../MenuButton\";\nimport { UniversalProps } from \"./componentTypes\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext\";\n\nexport type BulkActionsMenuProps = {\n data: MRT_RowData[];\n menuItems: UniversalProps[\"bulkActionMenuItems\"];\n rowSelection: MRT_RowSelectionState;\n setRowSelection: Dispatch<SetStateAction<MRT_RowSelectionState>>;\n};\n\nconst BulkActionsContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing2,\n}));\n\nconst BulkActionsMenu = ({\n data,\n menuItems,\n rowSelection,\n setRowSelection,\n}: BulkActionsMenuProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n\n const selectedRowCount = Object.values(rowSelection).filter(Boolean).length;\n\n const handleSelectAll = useCallback(() => {\n const rows = Object.fromEntries(data.map((row) => [row.id, true]));\n setRowSelection(rows);\n }, [data, setRowSelection]);\n\n const handleSelectNone = useCallback(() => {\n setRowSelection({});\n }, [setRowSelection]);\n\n return (\n <BulkActionsContainer odysseyDesignTokens={odysseyDesignTokens}>\n {selectedRowCount > 0 && (\n <MenuButton\n ariaLabel=\"More actions\"\n buttonLabel={t(\"table.actions.selectsome\", { selectedRowCount })}\n buttonVariant=\"primary\"\n endIcon={<ChevronDownIcon />}\n >\n {menuItems?.(rowSelection)}\n </MenuButton>\n )}\n <Box>\n <Button\n isDisabled={selectedRowCount === data.length} // Disabled if all are selected\n label={t(\"table.actions.selectall\")}\n onClick={handleSelectAll}\n variant=\"secondary\"\n />\n <Button\n isDisabled={selectedRowCount === 0} // Disabled if none are selected\n label={t(\"table.actions.selectnone\")}\n onClick={handleSelectNone}\n variant=\"secondary\"\n />\n </Box>\n </BulkActionsContainer>\n );\n};\n\nconst MemoizedBulkActionsMenu = memo(BulkActionsMenu);\nMemoizedBulkActionsMenu.displayName = \"BulkActionsMenu\";\n\nexport { MemoizedBulkActionsMenu as BulkActionsMenu };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,WAAW,QAAkC,OAAO;AAEnE,OAAOC,MAAM,MAAM,iBAAiB;AACpC,SAASC,cAAc,QAAQ,eAAe;AAAC,SAEtCC,GAAG;AAAA,SACHC,MAAM;AAAA,SACNC,eAAe;AAAA,SACfC,UAAU;AAAA,SAIjBC,sBAAsB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAAA,SAAAC,IAAA,IAAAC,KAAA;AAUxB,MAAMC,oBAAoB,GAAGX,MAAM,CAAC,KAAK,EAAE;EACzCY,iBAAiB,EAAGC,IAAI,IAAKA,IAAI,KAAK;AACxC,CAAC,CAAC,CAEC,CAAC;EAAEC;AAAoB,CAAC,MAAM;EAC/BC,OAAO,EAAE,MAAM;EACfC,GAAG,EAAEF,mBAAmB,CAACG;AAC3B,CAAC,CAAC,CAAC;AAEH,MAAMC,eAAe,GAAGA,CAAC;EACvBC,IAAI;EACJC,SAAS;EACTC,YAAY;EACZC;AACoB,CAAC,KAAK;EAC1B,MAAMR,mBAAmB,GAAGR,sBAAsB,CAAC,CAAC;EACpD,MAAM;IAAEiB;EAAE,CAAC,GAAGtB,cAAc,CAAC,CAAC;EAE9B,MAAMuB,gBAAgB,GAAGC,MAAM,CAACC,MAAM,CAACL,YAAY,CAAC,CAACM,MAAM,CAACC,OAAO,CAAC,CAACC,MAAM;EAE3E,MAAMC,eAAe,GAAG/B,WAAW,CAAC,MAAM;IACxC,MAAMgC,IAAI,GAAGN,MAAM,CAACO,WAAW,CAACb,IAAI,CAACc,GAAG,CAAEC,GAAG,IAAK,CAACA,GAAG,CAACC,EAAE,EAAE,IAAI,CAAC,CAAC,CAAC;IAClEb,eAAe,CAACS,IAAI,CAAC;EACvB,CAAC,EAAE,CAACZ,IAAI,EAAEG,eAAe,CAAC,CAAC;EAE3B,MAAMc,gBAAgB,GAAGrC,WAAW,CAAC,MAAM;IACzCuB,eAAe,CAAC,CAAC,CAAC,CAAC;EACrB,CAAC,EAAE,CAACA,eAAe,CAAC,CAAC;EAErB,OACEZ,KAAA,CAACC,oBAAoB;IAACG,mBAAmB,EAAEA,mBAAoB;IAAAuB,QAAA,GAC5Db,gBAAgB,GAAG,CAAC,IACnBhB,IAAA,CAACH,UAAU;MACTiC,SAAS,EAAC,cAAc;MACxBC,WAAW,EAAEhB,CAAC,CAAC,0BAA0B,EAAE;QAAEC;MAAiB,CAAC,CAAE;MACjEgB,aAAa,EAAC,SAAS;MACvBC,OAAO,EAAEjC,IAAA,CAACJ,eAAe,IAAE,CAAE;MAAAiC,QAAA,EAE5BjB,SAAS,GAAGC,YAAY;IAAC,CAChB,CACb,EACDX,KAAA,CAACR,GAAG;MAAAmC,QAAA,GACF7B,IAAA,CAACL,MAAM;QACLuC,UAAU,EAAElB,gBAAgB,KAAKL,IAAI,CAACU,MAAO;QAC7Cc,KAAK,EAAEpB,CAAC,CAAC,yBAAyB,CAAE;QACpCqB,OAAO,EAAEd,eAAgB;QACzBe,OAAO,EAAC;MAAW,CACpB,CAAC,EACFrC,IAAA,CAACL,MAAM;QACLuC,UAAU,EAAElB,gBAAgB,KAAK,CAAE;QACnCmB,KAAK,EAAEpB,CAAC,CAAC,0BAA0B,CAAE;QACrCqB,OAAO,EAAER,gBAAiB;QAC1BS,OAAO,EAAC;MAAW,CACpB,CAAC;IAAA,CACC,CAAC;EAAA,CACc,CAAC;AAE3B,CAAC;AAED,MAAMC,uBAAuB,GAAGhD,IAAI,CAACoB,eAAe,CAAC;AACrD4B,uBAAuB,CAACC,WAAW,GAAG,iBAAiB;AAEvD,SAASD,uBAAuB,IAAI5B,eAAe"}
@@ -17,7 +17,7 @@ import { Box } from "../../Box.js";
17
17
  import { CircularProgress } from "../../CircularProgress.js";
18
18
  import { useOdysseyDesignTokens } from "../../OdysseyDesignTokensContext.js";
19
19
  import { RowActions } from "./RowActions.js";
20
- import { StackCard } from "./StackCard.js";
20
+ import { DataCard } from "./DataCard.js";
21
21
  import { DetailPanel } from "./DetailPanel.js";
22
22
  import { jsx as _jsx } from "react/jsx-runtime";
23
23
  import { Fragment as _Fragment } from "react/jsx-runtime";
@@ -61,7 +61,7 @@ const CheckboxContainer = styled("div", {
61
61
  }) => ({
62
62
  marginBlockStart: `-${odysseyDesignTokens.Spacing1}`
63
63
  }));
64
- const StackContent = ({
64
+ const CardLayoutContent = ({
65
65
  currentLayout,
66
66
  data,
67
67
  emptyState,
@@ -76,7 +76,7 @@ const StackContent = ({
76
76
  rowReorderingUtilities,
77
77
  rowSelection,
78
78
  setRowSelection,
79
- stackOptions,
79
+ cardLayoutOptions,
80
80
  totalRows
81
81
  }) => {
82
82
  const odysseyDesignTokens = useOdysseyDesignTokens();
@@ -89,7 +89,7 @@ const StackContent = ({
89
89
  return _jsx(StackContainer, {
90
90
  odysseyDesignTokens: odysseyDesignTokens,
91
91
  currentLayout: currentLayout,
92
- maxGridColumns: stackOptions.maxGridColumns ?? 3,
92
+ maxGridColumns: cardLayoutOptions.maxGridColumns ?? 3,
93
93
  children: isLoading ? _jsx(LoadingContainer, {
94
94
  odysseyDesignTokens: odysseyDesignTokens,
95
95
  children: _jsx(CircularProgress, {})
@@ -104,9 +104,9 @@ const StackContent = ({
104
104
  description,
105
105
  image,
106
106
  children
107
- } = stackOptions.cardProps(row);
107
+ } = cardLayoutOptions.itemProps(row);
108
108
  const currentIndex = index + (pagination.pageIndex - 1) * pagination.pageSize;
109
- return _jsx(StackCard, {
109
+ return _jsx(DataCard, {
110
110
  Accessory: hasRowSelection && _jsx(CheckboxContainer, {
111
111
  odysseyDesignTokens: odysseyDesignTokens,
112
112
  children: _jsx(_Checkbox, {
@@ -116,15 +116,15 @@ const StackContent = ({
116
116
  }),
117
117
  children: children,
118
118
  description: description,
119
- detailPanel: stackOptions.renderDetailPanel ? _jsx(DetailPanel, {
119
+ detailPanel: cardLayoutOptions.renderDetailPanel ? _jsx(DetailPanel, {
120
120
  row: row,
121
- renderDetailPanel: stackOptions.renderDetailPanel
121
+ renderDetailPanel: cardLayoutOptions.renderDetailPanel
122
122
  }) : undefined,
123
123
  image: image,
124
- menuButtonChildren: (stackOptions.rowActionMenuItems || hasRowReordering) && _jsx(RowActions, {
124
+ menuButtonChildren: (cardLayoutOptions.rowActionMenuItems || hasRowReordering) && _jsx(RowActions, {
125
125
  row: row,
126
126
  rowIndex: currentIndex,
127
- rowActionMenuItems: stackOptions.rowActionMenuItems,
127
+ rowActionMenuItems: cardLayoutOptions.rowActionMenuItems,
128
128
  isRowReorderingDisabled: isRowReorderingDisabled,
129
129
  totalRows: totalRows,
130
130
  updateRowOrder: hasRowReordering && onReorderRows ? updateRowOrder : undefined
@@ -137,7 +137,7 @@ const StackContent = ({
137
137
  })
138
138
  });
139
139
  };
140
- const MemoizedStackContent = memo(StackContent);
141
- MemoizedStackContent.displayName = "StackContent";
142
- export { MemoizedStackContent as StackContent };
143
- //# sourceMappingURL=StackContent.js.map
140
+ const MemoizedCardLayoutContent = memo(CardLayoutContent);
141
+ MemoizedCardLayoutContent.displayName = "CardLayoutContent";
142
+ export { MemoizedCardLayoutContent as CardLayoutContent };
143
+ //# sourceMappingURL=CardLayoutContent.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"CardLayoutContent.js","names":["memo","useCallback","styled","Box","CircularProgress","useOdysseyDesignTokens","RowActions","DataCard","DetailPanel","jsx","_jsx","Fragment","_Fragment","StackContainer","shouldForwardProp","prop","odysseyDesignTokens","currentLayout","maxGridColumns","display","flexDirection","gap","Spacing5","gridTemplateColumns","LoadingContainer","alignItems","justifyContent","width","paddingBlock","CheckboxContainer","marginBlockStart","Spacing1","CardLayoutContent","data","emptyState","hasRowReordering","hasRowSelection","isEmpty","isLoading","isNoResults","isRowReorderingDisabled","onReorderRows","pagination","rowReorderingUtilities","rowSelection","setRowSelection","cardLayoutOptions","totalRows","handleRowSelectionChange","row","Object","fromEntries","id","entries","filter","key","concat","updateRowOrder","children","length","map","index","overline","title","description","image","itemProps","currentIndex","pageIndex","pageSize","Accessory","_Checkbox","checked","onChange","detailPanel","renderDetailPanel","undefined","menuButtonChildren","rowActionMenuItems","rowIndex","MemoizedCardLayoutContent","displayName"],"sources":["../../../src/labs/DataView/CardLayoutContent.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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, ReactNode, SetStateAction, memo, useCallback } from \"react\";\nimport styled, { CSSObject } from \"@emotion/styled\";\nimport {\n MRT_Row,\n MRT_RowData,\n MRT_RowSelectionState,\n MRT_TableInstance,\n} from \"material-react-table\";\n\nimport { Box } from \"../../Box\";\nimport { Checkbox as MuiCheckbox } from \"@mui/material\";\nimport { CircularProgress } from \"../../CircularProgress\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext\";\nimport { RowActions } from \"./RowActions\";\nimport { DataCard } from \"./DataCard\";\nimport { CardLayout, CardLayoutProps, UniversalProps } from \"./componentTypes\";\nimport { DetailPanel } from \"./DetailPanel\";\n\nexport type CardLayoutContentProps = {\n currentLayout: CardLayout;\n data: MRT_RowData[];\n draggingRow?: MRT_Row<MRT_RowData> | null;\n emptyState: ReactNode;\n getRowId: UniversalProps[\"getRowId\"];\n hasRowReordering: UniversalProps[\"hasRowReordering\"];\n hasRowSelection: UniversalProps[\"hasRowSelection\"];\n isEmpty?: boolean;\n isLoading: boolean;\n isNoResults?: boolean;\n isRowReorderingDisabled?: boolean;\n onReorderRows: UniversalProps[\"onReorderRows\"];\n pagination: { pageIndex: number; pageSize: number };\n rowReorderingUtilities: {\n dragHandleStyles: CSSObject;\n dragHandleText: {\n title: string;\n \"aria-label\": string;\n };\n draggableTableBodyRowClassName: ({\n currentRowId,\n draggingRowId,\n hoveredRowId,\n }: {\n currentRowId: string;\n draggingRowId?: string;\n hoveredRowId?: string;\n }) => string | undefined;\n handleDragHandleKeyDown: ({\n table,\n row,\n event,\n }: {\n table: MRT_TableInstance<MRT_RowData>;\n row: MRT_Row<MRT_RowData>;\n event: React.KeyboardEvent<HTMLButtonElement>;\n }) => void;\n handleDragHandleOnDragCapture: (\n table: MRT_TableInstance<MRT_RowData>,\n ) => void;\n handleDragHandleOnDragEnd: (table: MRT_TableInstance<MRT_RowData>) => void;\n resetDraggingAndHoveredRow: (table: MRT_TableInstance<MRT_RowData>) => void;\n updateRowOrder: ({\n rowId,\n newRowIndex,\n }: {\n rowId: string;\n newRowIndex: number;\n }) => void;\n };\n rowSelection: MRT_RowSelectionState;\n setRowSelection: Dispatch<SetStateAction<MRT_RowSelectionState>>;\n cardLayoutOptions: CardLayoutProps;\n totalRows: UniversalProps[\"totalRows\"];\n};\n\nconst StackContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" &&\n prop !== \"currentLayout\" &&\n prop !== \"maxGridColumns\",\n})<{\n odysseyDesignTokens: DesignTokens;\n currentLayout: CardLayout;\n maxGridColumns: number;\n}>(({ odysseyDesignTokens, currentLayout, maxGridColumns }) => ({\n display: currentLayout === \"list\" ? \"flex\" : \"grid\",\n flexDirection: \"column\",\n gap: odysseyDesignTokens.Spacing5,\n\n ...(currentLayout === \"grid\" && {\n [`@media (max-width: 720px)`]: {\n gridTemplateColumns: \"repeat(1, 1fr)\",\n },\n [`@media (min-width: 720px) and (max-width: 960px)`]: {\n gridTemplateColumns: \"repeat(2, 1fr)\",\n },\n [`@media (min-width: 960px)`]: {\n gridTemplateColumns: `repeat(${maxGridColumns}, 1fr)`,\n },\n }),\n}));\n\nconst LoadingContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n width: \"100%\",\n paddingBlock: odysseyDesignTokens.Spacing5,\n}));\n\nconst CheckboxContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n marginBlockStart: `-${odysseyDesignTokens.Spacing1}`,\n}));\n\nconst CardLayoutContent = ({\n currentLayout,\n data,\n emptyState,\n hasRowReordering,\n hasRowSelection,\n isEmpty,\n isLoading,\n isNoResults,\n isRowReorderingDisabled,\n onReorderRows,\n pagination,\n rowReorderingUtilities,\n rowSelection,\n setRowSelection,\n cardLayoutOptions,\n totalRows,\n}: CardLayoutContentProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n\n const handleRowSelectionChange = useCallback(\n (row: MRT_RowData) => {\n setRowSelection((rowSelection) =>\n Object.fromEntries(\n row.id in rowSelection\n ? Object.entries(rowSelection).filter(([key]) => key !== row.id)\n : Object.entries(rowSelection).concat([[row.id, true]]),\n ),\n );\n },\n [setRowSelection],\n );\n\n const { updateRowOrder } = rowReorderingUtilities;\n\n return (\n <StackContainer\n odysseyDesignTokens={odysseyDesignTokens}\n currentLayout={currentLayout}\n maxGridColumns={cardLayoutOptions.maxGridColumns ?? 3}\n >\n {isLoading ? (\n <LoadingContainer odysseyDesignTokens={odysseyDesignTokens}>\n <CircularProgress />\n </LoadingContainer>\n ) : (\n <>\n {!data || data.length === 0 || isEmpty || isNoResults ? (\n <Box>{emptyState}</Box>\n ) : (\n <>\n {data.map((row: MRT_RowData, index: number) => {\n const { overline, title, description, image, children } =\n cardLayoutOptions.itemProps(row);\n const currentIndex =\n index + (pagination.pageIndex - 1) * pagination.pageSize;\n\n return (\n <DataCard\n Accessory={\n hasRowSelection && (\n // Negative margin to counteract the checkbox's inbuilt spacing\n <CheckboxContainer\n odysseyDesignTokens={odysseyDesignTokens}\n >\n <MuiCheckbox\n checked={rowSelection[row.id] ?? false}\n onChange={() => handleRowSelectionChange(row)}\n />\n </CheckboxContainer>\n )\n }\n children={children}\n description={description}\n detailPanel={\n cardLayoutOptions.renderDetailPanel ? (\n <DetailPanel\n row={row}\n renderDetailPanel={\n cardLayoutOptions.renderDetailPanel\n }\n />\n ) : undefined\n }\n image={image}\n key={row.id}\n menuButtonChildren={\n (cardLayoutOptions.rowActionMenuItems ||\n hasRowReordering) && (\n <RowActions\n row={row}\n rowIndex={currentIndex}\n rowActionMenuItems={\n cardLayoutOptions.rowActionMenuItems\n }\n isRowReorderingDisabled={isRowReorderingDisabled}\n totalRows={totalRows}\n updateRowOrder={\n hasRowReordering && onReorderRows\n ? updateRowOrder\n : undefined\n }\n />\n )\n }\n overline={overline}\n title={title}\n />\n );\n })}\n </>\n )}\n </>\n )}\n </StackContainer>\n );\n};\n\nconst MemoizedCardLayoutContent = memo(CardLayoutContent);\nMemoizedCardLayoutContent.displayName = \"CardLayoutContent\";\n\nexport { MemoizedCardLayoutContent as CardLayoutContent };\n"],"mappings":"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"}
@@ -71,14 +71,14 @@ const CardChildrenContainer = styled("div", {
71
71
  })(({
72
72
  odysseyDesignTokens
73
73
  }) => ({
74
- ["div + &"]: {
74
+ ["&:not(:first-child)"]: {
75
75
  marginBlockStart: odysseyDesignTokens.Spacing3
76
76
  }
77
77
  }));
78
78
  const buttonProviderValue = {
79
79
  isFullWidth: true
80
80
  };
81
- const StackCard = ({
81
+ const DataCard = ({
82
82
  Accessory: AccessoryProp,
83
83
  button,
84
84
  children,
@@ -157,7 +157,7 @@ const StackCard = ({
157
157
  })]
158
158
  });
159
159
  };
160
- const MemoizedStackCard = memo(StackCard);
161
- MemoizedStackCard.displayName = "StackCard";
162
- export { MemoizedStackCard as StackCard };
163
- //# sourceMappingURL=StackCard.js.map
160
+ const MemoizedDataCard = memo(DataCard);
161
+ MemoizedDataCard.displayName = "DataCard";
162
+ export { MemoizedDataCard as DataCard };
163
+ //# sourceMappingURL=DataCard.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataCard.js","names":["memo","useMemo","useState","styled","useTranslation","Box","ButtonContext","useOdysseyDesignTokens","Heading5","Paragraph","Support","MenuButton","ChevronDownIcon","ChevronUpIcon","MoreIcon","jsx","_jsx","jsxs","_jsxs","CARD_IMAGE_HEIGHT","AccessoryContainer","shouldForwardProp","prop","odysseyDesignTokens","display","flexDirection","alignItems","gap","Spacing2","ImageContainer","hasMenuButtonChildren","maxHeight","marginBlockEnd","Spacing5","paddingRight","MenuButtonContainer","position","right","Spacing3","top","CardContentContainer","CardChildrenContainer","marginBlockStart","buttonProviderValue","isFullWidth","DataCard","Accessory","AccessoryProp","button","children","description","detailPanel","image","menuButtonChildren","onClick","overline","title","t","isDetailPanelOpen","setIsDetailPanelOpen","_Tooltip","_IconButton","cardContent","Boolean","component","color","_CardActions","Provider","value","_Card","className","_CardActionArea","endIcon","ariaLabel","buttonVariant","menuAlignment","size","tooltipText","MemoizedDataCard","displayName"],"sources":["../../../src/labs/DataView/DataCard.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 MouseEventHandler,\n ReactElement,\n memo,\n useMemo,\n ReactNode,\n useState,\n} from \"react\";\nimport {\n IconButton as MuiIconButton,\n Card as MuiCard,\n CardActions as MuiCardActions,\n CardActionArea as MuiCardActionArea,\n Tooltip as MuiTooltip,\n} from \"@mui/material\";\nimport styled from \"@emotion/styled\";\nimport { useTranslation } from \"react-i18next\";\n\nimport { Box } from \"../../Box\";\nimport { Button } from \"../../Button\";\nimport { ButtonContext } from \"../../ButtonContext\";\nimport {\n DesignTokens,\n useOdysseyDesignTokens,\n} from \"../../OdysseyDesignTokensContext\";\nimport { Heading5, Paragraph, Support } from \"../../Typography\";\nimport { MenuButton, MenuButtonProps } from \"../../MenuButton\";\nimport {\n ChevronDownIcon,\n ChevronUpIcon,\n MoreIcon,\n} from \"../../icons.generated\";\n\nexport const CARD_IMAGE_HEIGHT = \"64px\";\n\nexport type DataCardProps = {\n children?: ReactNode;\n description?: string;\n detailPanel?: ReactNode;\n image?: ReactElement;\n overline?: string;\n title?: string;\n} & (\n | {\n Accessory?: never;\n button?: never;\n menuButtonChildren?: never;\n onClick: MouseEventHandler;\n }\n | {\n Accessory?: ReactNode;\n button?: ReactElement<typeof Button>;\n menuButtonChildren?: MenuButtonProps[\"children\"];\n onClick?: never;\n }\n);\n\nconst AccessoryContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{\n odysseyDesignTokens: DesignTokens;\n}>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n gap: odysseyDesignTokens.Spacing2,\n}));\n\nconst ImageContainer = styled(\"div\", {\n shouldForwardProp: (prop) =>\n prop !== \"odysseyDesignTokens\" && prop !== \"hasMenuButtonChildren\",\n})<{\n odysseyDesignTokens: DesignTokens;\n hasMenuButtonChildren: boolean;\n}>(({ odysseyDesignTokens, hasMenuButtonChildren }) => ({\n display: \"flex\",\n alignItems: \"flex-start\",\n maxHeight: `${CARD_IMAGE_HEIGHT}`,\n marginBlockEnd: odysseyDesignTokens.Spacing5,\n paddingRight: hasMenuButtonChildren ? odysseyDesignTokens.Spacing5 : 0,\n}));\n\nconst MenuButtonContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n position: \"absolute\",\n right: odysseyDesignTokens.Spacing3,\n top: odysseyDesignTokens.Spacing3,\n}));\n\nconst CardContentContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n display: \"flex\",\n gap: odysseyDesignTokens.Spacing3,\n}));\n\nconst CardChildrenContainer = styled(\"div\", {\n shouldForwardProp: (prop) => prop !== \"odysseyDesignTokens\",\n})<{ odysseyDesignTokens: DesignTokens }>(({ odysseyDesignTokens }) => ({\n [\"&:not(:first-child)\"]: {\n marginBlockStart: odysseyDesignTokens.Spacing3,\n },\n}));\n\nconst buttonProviderValue = { isFullWidth: true };\n\nconst DataCard = ({\n Accessory: AccessoryProp,\n button,\n children,\n description,\n detailPanel,\n image,\n menuButtonChildren,\n onClick,\n overline,\n title,\n}: DataCardProps) => {\n const odysseyDesignTokens = useOdysseyDesignTokens();\n const { t } = useTranslation();\n\n const [isDetailPanelOpen, setIsDetailPanelOpen] = useState<boolean>(false);\n\n const Accessory = useMemo(\n () => (\n <AccessoryContainer odysseyDesignTokens={odysseyDesignTokens}>\n {AccessoryProp}\n {detailPanel && (\n <MuiTooltip\n title={\n isDetailPanelOpen\n ? t(\"table.rowexpansion.collapse\")\n : t(\"table.rowexpansion.expand\")\n }\n >\n <MuiIconButton\n children={\n isDetailPanelOpen ? <ChevronUpIcon /> : <ChevronDownIcon />\n }\n onClick={() => setIsDetailPanelOpen(!isDetailPanelOpen)}\n aria-label={\n isDetailPanelOpen\n ? t(\"table.rowexpansion.collapse\")\n : t(\"table.rowexpansion.expand\")\n }\n />\n </MuiTooltip>\n )}\n </AccessoryContainer>\n ),\n [AccessoryProp, detailPanel, isDetailPanelOpen, odysseyDesignTokens, t],\n );\n\n const cardContent = useMemo(\n () => (\n <CardContentContainer odysseyDesignTokens={odysseyDesignTokens}>\n {(AccessoryProp || detailPanel) && <Box>{Accessory}</Box>}\n <Box>\n {image && (\n <ImageContainer\n odysseyDesignTokens={odysseyDesignTokens}\n hasMenuButtonChildren={Boolean(menuButtonChildren)}\n >\n {image}\n </ImageContainer>\n )}\n\n {overline && <Support component=\"div\">{overline}</Support>}\n {title && <Heading5 component=\"div\">{title}</Heading5>}\n {description && (\n <Paragraph color=\"textSecondary\">{description}</Paragraph>\n )}\n\n {button && (\n <MuiCardActions>\n <ButtonContext.Provider value={buttonProviderValue}>\n {button}\n </ButtonContext.Provider>\n </MuiCardActions>\n )}\n\n {children && (\n <CardChildrenContainer odysseyDesignTokens={odysseyDesignTokens}>\n {children}\n </CardChildrenContainer>\n )}\n\n {detailPanel && isDetailPanelOpen && (\n <CardChildrenContainer odysseyDesignTokens={odysseyDesignTokens}>\n {detailPanel}\n </CardChildrenContainer>\n )}\n </Box>\n </CardContentContainer>\n ),\n [\n odysseyDesignTokens,\n AccessoryProp,\n detailPanel,\n Accessory,\n image,\n menuButtonChildren,\n overline,\n title,\n description,\n button,\n children,\n isDetailPanelOpen,\n ],\n );\n\n return (\n <MuiCard\n className={`${onClick ? \"isClickable\" : \"\"} ${Accessory ? \"hasAccessory\" : \"\"}`}\n >\n {onClick ? (\n <MuiCardActionArea onClick={onClick}>{cardContent}</MuiCardActionArea>\n ) : (\n cardContent\n )}\n\n {menuButtonChildren && (\n <MenuButtonContainer odysseyDesignTokens={odysseyDesignTokens}>\n <MenuButton\n endIcon={<MoreIcon />}\n ariaLabel={t(\"table.moreactions.arialabel\")}\n buttonVariant=\"floating\"\n menuAlignment=\"right\"\n size=\"small\"\n tooltipText={t(\"table.actions\")}\n >\n {menuButtonChildren}\n </MenuButton>\n </MenuButtonContainer>\n )}\n </MuiCard>\n );\n};\n\nconst MemoizedDataCard = memo(DataCard);\nMemoizedDataCard.displayName = \"DataCard\";\n\nexport { MemoizedDataCard as DataCard };\n"],"mappings":"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"}
@@ -14,6 +14,8 @@ import { memo, useMemo } from "react";
14
14
  import { DataView } from "./DataView.js";
15
15
  import { jsx as _jsx } from "react/jsx-runtime";
16
16
  const DataTable = ({
17
+ additionalActionButton,
18
+ additionalActionMenuItems,
17
19
  bulkActionMenuItems,
18
20
  columns,
19
21
  currentPage,
@@ -49,7 +51,7 @@ const DataTable = ({
49
51
  searchDelayTime,
50
52
  totalRows
51
53
  }) => {
52
- const tableOptions = useMemo(() => ({
54
+ const tableLayoutOptions = useMemo(() => ({
53
55
  columns,
54
56
  hasChangeableDensity,
55
57
  hasColumnResizing,
@@ -61,6 +63,8 @@ const DataTable = ({
61
63
  rowActionMenuItems
62
64
  }), [columns, hasChangeableDensity, hasColumnResizing, hasColumnVisibility, hasSorting, initialDensity, renderDetailPanel, rowActionButtons, rowActionMenuItems]);
63
65
  return _jsx(DataView, {
66
+ additionalActionButton: additionalActionButton,
67
+ additionalActionMenuItems: additionalActionMenuItems,
64
68
  availableLayouts: ["table"],
65
69
  bulkActionMenuItems: bulkActionMenuItems,
66
70
  currentPage: currentPage,
@@ -86,7 +90,7 @@ const DataTable = ({
86
90
  paginationType: paginationType,
87
91
  resultsPerPage: resultsPerPage,
88
92
  searchDelayTime: searchDelayTime,
89
- tableOptions: tableOptions,
93
+ tableLayoutOptions: tableLayoutOptions,
90
94
  totalRows: totalRows
91
95
  });
92
96
  };
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DataTable.js","names":["memo","useMemo","DataView","jsx","_jsx","DataTable","additionalActionButton","additionalActionMenuItems","bulkActionMenuItems","columns","currentPage","emptyPlaceholder","errorMessage","filters","getData","hasChangeableDensity","hasColumnResizing","hasColumnVisibility","initialDensity","hasFilters","hasPagination","hasRowReordering","hasRowSelection","hasSearch","hasSearchSubmitButton","hasSorting","isLoading","isEmpty","isNoResults","isPaginationMoreDisabled","isRowReorderingDisabled","maxResultsPerPage","maxPages","noResultsPlaceholder","onChangeRowSelection","paginationType","renderDetailPanel","resultsPerPage","rowActionButtons","rowActionMenuItems","searchDelayTime","totalRows","tableLayoutOptions","availableLayouts","MemoizedDataTable","displayName"],"sources":["../../../src/labs/DataView/DataTable.tsx"],"sourcesContent":["/*!\n * Copyright (c) 2024-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 { memo, useMemo } from \"react\";\n\nimport { DataView } from \"./DataView\";\nimport { TableLayoutProps, UniversalProps } from \"./componentTypes\";\n\nexport type DataTableProps = UniversalProps & TableLayoutProps;\n\nconst DataTable = ({\n additionalActionButton,\n additionalActionMenuItems,\n bulkActionMenuItems,\n columns,\n currentPage,\n emptyPlaceholder,\n errorMessage,\n filters,\n getData,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n initialDensity,\n hasFilters,\n hasPagination,\n hasRowReordering,\n hasRowSelection,\n hasSearch,\n hasSearchSubmitButton,\n hasSorting,\n isLoading,\n isEmpty,\n isNoResults,\n isPaginationMoreDisabled,\n isRowReorderingDisabled,\n maxResultsPerPage,\n maxPages,\n noResultsPlaceholder,\n onChangeRowSelection,\n paginationType,\n renderDetailPanel,\n resultsPerPage,\n rowActionButtons,\n rowActionMenuItems,\n searchDelayTime,\n totalRows,\n}: DataTableProps) => {\n const tableLayoutOptions = useMemo(\n () => ({\n columns,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasSorting,\n initialDensity,\n renderDetailPanel,\n rowActionButtons,\n rowActionMenuItems,\n }),\n [\n columns,\n hasChangeableDensity,\n hasColumnResizing,\n hasColumnVisibility,\n hasSorting,\n initialDensity,\n renderDetailPanel,\n rowActionButtons,\n rowActionMenuItems,\n ],\n );\n\n return (\n <DataView\n additionalActionButton={additionalActionButton}\n additionalActionMenuItems={additionalActionMenuItems}\n availableLayouts={[\"table\"]}\n bulkActionMenuItems={bulkActionMenuItems}\n currentPage={currentPage}\n emptyPlaceholder={emptyPlaceholder}\n errorMessage={errorMessage}\n filters={filters}\n getData={getData}\n hasFilters={hasFilters}\n hasPagination={hasPagination}\n hasRowReordering={hasRowReordering}\n hasRowSelection={hasRowSelection}\n hasSearch={hasSearch}\n hasSearchSubmitButton={hasSearchSubmitButton}\n isEmpty={isEmpty}\n isLoading={isLoading}\n isNoResults={isNoResults}\n isPaginationMoreDisabled={isPaginationMoreDisabled}\n isRowReorderingDisabled={isRowReorderingDisabled}\n maxPages={maxPages}\n maxResultsPerPage={maxResultsPerPage}\n noResultsPlaceholder={noResultsPlaceholder}\n onChangeRowSelection={onChangeRowSelection}\n paginationType={paginationType}\n resultsPerPage={resultsPerPage}\n searchDelayTime={searchDelayTime}\n tableLayoutOptions={tableLayoutOptions}\n totalRows={totalRows}\n />\n );\n};\n\nconst MemoizedDataTable = memo(DataTable);\nMemoizedDataTable.displayName = \"DataTable\";\n\nexport { MemoizedDataTable as DataTable };\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAAC,SAE7BC,QAAQ;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAKjB,MAAMC,SAAS,GAAGA,CAAC;EACjBC,sBAAsB;EACtBC,yBAAyB;EACzBC,mBAAmB;EACnBC,OAAO;EACPC,WAAW;EACXC,gBAAgB;EAChBC,YAAY;EACZC,OAAO;EACPC,OAAO;EACPC,oBAAoB;EACpBC,iBAAiB;EACjBC,mBAAmB;EACnBC,cAAc;EACdC,UAAU;EACVC,aAAa;EACbC,gBAAgB;EAChBC,eAAe;EACfC,SAAS;EACTC,qBAAqB;EACrBC,UAAU;EACVC,SAAS;EACTC,OAAO;EACPC,WAAW;EACXC,wBAAwB;EACxBC,uBAAuB;EACvBC,iBAAiB;EACjBC,QAAQ;EACRC,oBAAoB;EACpBC,oBAAoB;EACpBC,cAAc;EACdC,iBAAiB;EACjBC,cAAc;EACdC,gBAAgB;EAChBC,kBAAkB;EAClBC,eAAe;EACfC;AACc,CAAC,KAAK;EACpB,MAAMC,kBAAkB,GAAGzC,OAAO,CAChC,OAAO;IACLQ,OAAO;IACPM,oBAAoB;IACpBC,iBAAiB;IACjBC,mBAAmB;IACnBQ,UAAU;IACVP,cAAc;IACdkB,iBAAiB;IACjBE,gBAAgB;IAChBC;EACF,CAAC,CAAC,EACF,CACE9B,OAAO,EACPM,oBAAoB,EACpBC,iBAAiB,EACjBC,mBAAmB,EACnBQ,UAAU,EACVP,cAAc,EACdkB,iBAAiB,EACjBE,gBAAgB,EAChBC,kBAAkB,CAEtB,CAAC;EAED,OACEnC,IAAA,CAACF,QAAQ;IACPI,sBAAsB,EAAEA,sBAAuB;IAC/CC,yBAAyB,EAAEA,yBAA0B;IACrDoC,gBAAgB,EAAE,CAAC,OAAO,CAAE;IAC5BnC,mBAAmB,EAAEA,mBAAoB;IACzCE,WAAW,EAAEA,WAAY;IACzBC,gBAAgB,EAAEA,gBAAiB;IACnCC,YAAY,EAAEA,YAAa;IAC3BC,OAAO,EAAEA,OAAQ;IACjBC,OAAO,EAAEA,OAAQ;IACjBK,UAAU,EAAEA,UAAW;IACvBC,aAAa,EAAEA,aAAc;IAC7BC,gBAAgB,EAAEA,gBAAiB;IACnCC,eAAe,EAAEA,eAAgB;IACjCC,SAAS,EAAEA,SAAU;IACrBC,qBAAqB,EAAEA,qBAAsB;IAC7CG,OAAO,EAAEA,OAAQ;IACjBD,SAAS,EAAEA,SAAU;IACrBE,WAAW,EAAEA,WAAY;IACzBC,wBAAwB,EAAEA,wBAAyB;IACnDC,uBAAuB,EAAEA,uBAAwB;IACjDE,QAAQ,EAAEA,QAAS;IACnBD,iBAAiB,EAAEA,iBAAkB;IACrCE,oBAAoB,EAAEA,oBAAqB;IAC3CC,oBAAoB,EAAEA,oBAAqB;IAC3CC,cAAc,EAAEA,cAAe;IAC/BE,cAAc,EAAEA,cAAe;IAC/BG,eAAe,EAAEA,eAAgB;IACjCE,kBAAkB,EAAEA,kBAAmB;IACvCD,SAAS,EAAEA;EAAU,CACtB,CAAC;AAEN,CAAC;AAED,MAAMG,iBAAiB,GAAG5C,IAAI,CAACK,SAAS,CAAC;AACzCuC,iBAAiB,CAACC,WAAW,GAAG,WAAW;AAE3C,SAASD,iBAAiB,IAAIvC,SAAS"}