@rio-cloud/uikit-mcp 1.0.0 → 1.1.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 (388) hide show
  1. package/README.md +75 -40
  2. package/dist/doc-metadata.json +1872 -0
  3. package/dist/docs/components/accentBar.md +582 -0
  4. package/dist/docs/components/activity.md +330 -0
  5. package/dist/docs/components/animatedNumber.md +88 -0
  6. package/dist/docs/components/animatedTextReveal.md +381 -0
  7. package/dist/docs/components/animations.md +459 -0
  8. package/dist/docs/components/appHeader.md +737 -0
  9. package/dist/docs/components/appLayout.md +2016 -0
  10. package/dist/docs/components/appNavigationBar.md +274 -0
  11. package/dist/docs/components/areaCharts.md +828 -0
  12. package/dist/docs/components/aspectRatioPlaceholder.md +106 -0
  13. package/dist/docs/components/assetTree.md +3223 -0
  14. package/dist/docs/components/autosuggests.md +1177 -0
  15. package/dist/docs/components/avatar.md +206 -0
  16. package/dist/docs/components/banner.md +668 -0
  17. package/dist/docs/components/barCharts.md +2785 -0
  18. package/dist/docs/components/barList.md +517 -0
  19. package/dist/docs/components/basicMap.md +167 -0
  20. package/dist/docs/components/bottomSheet.md +721 -0
  21. package/dist/docs/components/button.md +775 -0
  22. package/dist/docs/components/buttonToolbar.md +134 -0
  23. package/dist/docs/components/calendarStripe.md +525 -0
  24. package/dist/docs/components/card.md +86 -0
  25. package/dist/docs/components/carousel.md +128 -0
  26. package/dist/docs/components/chartColors.md +716 -0
  27. package/dist/docs/components/chartsGettingStarted.md +28 -0
  28. package/dist/docs/components/chat.md +932 -0
  29. package/dist/docs/components/checkbox.md +996 -0
  30. package/dist/docs/components/clearableInput.md +806 -0
  31. package/dist/docs/components/collapse.md +189 -0
  32. package/dist/docs/components/composedCharts.md +424 -0
  33. package/dist/docs/components/contentLoader.md +674 -0
  34. package/dist/docs/components/dataTabs.md +1251 -0
  35. package/dist/docs/components/datepickers.md +2543 -0
  36. package/dist/docs/components/dialogs.md +2244 -0
  37. package/dist/docs/components/divider.md +219 -0
  38. package/dist/docs/components/dropdowns.md +17550 -0
  39. package/dist/docs/components/editableContent.md +1127 -0
  40. package/dist/docs/components/expander.md +970 -0
  41. package/dist/docs/components/fade.md +836 -0
  42. package/dist/docs/components/fadeExpander.md +180 -0
  43. package/dist/docs/components/fadeUp.md +396 -0
  44. package/dist/docs/components/feedback.md +758 -0
  45. package/dist/docs/components/filePickers.md +370 -0
  46. package/dist/docs/components/formLabel.md +251 -0
  47. package/dist/docs/components/fullscreenMap.md +10 -0
  48. package/dist/docs/components/groupedItemList.md +1001 -0
  49. package/dist/docs/components/iconList.md +306 -0
  50. package/dist/docs/components/imagePreloader.md +167 -0
  51. package/dist/docs/components/labeledElement.md +115 -0
  52. package/dist/docs/components/licensePlate.md +412 -0
  53. package/dist/docs/components/lineCharts.md +2014 -0
  54. package/dist/docs/components/listMenu.md +392 -0
  55. package/dist/docs/components/loadMore.md +219 -0
  56. package/dist/docs/components/mainNavigation.md +129 -0
  57. package/dist/docs/components/mapCircle.md +93 -0
  58. package/dist/docs/components/mapCluster.md +337 -0
  59. package/dist/docs/components/mapContext.md +284 -0
  60. package/dist/docs/components/mapDraggableMarker.md +150 -0
  61. package/dist/docs/components/mapGettingStarted.md +39 -0
  62. package/dist/docs/components/mapInfoBubble.md +135 -0
  63. package/dist/docs/components/mapLayerGroup.md +94 -0
  64. package/dist/docs/components/mapMarker.md +1814 -0
  65. package/dist/docs/components/mapPolygon.md +959 -0
  66. package/dist/docs/components/mapRoute.md +3816 -0
  67. package/dist/docs/components/mapRouteGenerator.md +6 -0
  68. package/dist/docs/components/mapSettings.md +1040 -0
  69. package/dist/docs/components/mapUtils.md +132 -0
  70. package/dist/docs/components/multiselects.md +1921 -0
  71. package/dist/docs/components/noData.md +210 -0
  72. package/dist/docs/components/notifications.md +314 -0
  73. package/dist/docs/components/numbercontrol.md +706 -0
  74. package/dist/docs/components/onboarding.md +297 -0
  75. package/dist/docs/components/page.md +241 -0
  76. package/dist/docs/components/pager.md +133 -0
  77. package/dist/docs/components/pieCharts.md +1284 -0
  78. package/dist/docs/components/popover.md +222 -0
  79. package/dist/docs/components/position.md +50 -0
  80. package/dist/docs/components/radialBarCharts.md +3663 -0
  81. package/dist/docs/components/radiobutton.md +1271 -0
  82. package/dist/docs/components/releaseNotes.md +135 -0
  83. package/dist/docs/components/resizer.md +162 -0
  84. package/dist/docs/components/responsiveColumnStripe.md +435 -0
  85. package/dist/docs/components/responsiveVideo.md +71 -0
  86. package/dist/docs/components/rioglyph.md +331 -0
  87. package/dist/docs/components/rules.md +965 -0
  88. package/dist/docs/components/saveableInput.md +1721 -0
  89. package/dist/docs/components/selects.md +1993 -0
  90. package/dist/docs/components/sidebar.md +332 -0
  91. package/dist/docs/components/sliders.md +376 -0
  92. package/dist/docs/components/smoothScrollbars.md +1180 -0
  93. package/dist/docs/components/spinners.md +506 -0
  94. package/dist/docs/components/states.md +1176 -0
  95. package/dist/docs/components/statsWidgets.md +636 -0
  96. package/dist/docs/components/statusBar.md +644 -0
  97. package/dist/docs/components/stepButton.md +61 -0
  98. package/dist/docs/components/steppedProgressBars.md +1064 -0
  99. package/dist/docs/components/subNavigation.md +470 -0
  100. package/dist/docs/components/supportMarker.md +115 -0
  101. package/dist/docs/components/svgImage.md +248 -0
  102. package/dist/docs/components/switch.md +554 -0
  103. package/dist/docs/components/tables.md +8 -0
  104. package/dist/docs/components/tagManager.md +476 -0
  105. package/dist/docs/components/tags.md +785 -0
  106. package/dist/docs/components/teaser.md +925 -0
  107. package/dist/docs/components/timeline.md +514 -0
  108. package/dist/docs/components/timepicker.md +262 -0
  109. package/dist/docs/components/toggleButton.md +178 -0
  110. package/dist/docs/components/tooltip.md +454 -0
  111. package/dist/docs/components/virtualList.md +483 -0
  112. package/dist/docs/foundations.md +20901 -0
  113. package/dist/docs/start/changelog.md +439 -0
  114. package/dist/docs/start/goodtoknow.md +14 -0
  115. package/dist/docs/start/guidelines/color-combinations.md +678 -0
  116. package/dist/docs/start/guidelines/custom-css.md +42 -0
  117. package/dist/docs/start/guidelines/custom-rioglyph.md +35 -0
  118. package/dist/docs/start/guidelines/formatting.md +587 -0
  119. package/dist/docs/start/guidelines/iframe.md +323 -0
  120. package/dist/docs/start/guidelines/obfuscate-data.md +30 -0
  121. package/dist/docs/start/guidelines/print-css.md +36 -0
  122. package/dist/docs/start/guidelines/spinner.md +710 -0
  123. package/dist/docs/start/guidelines/supported-browsers.md +10 -0
  124. package/dist/docs/start/guidelines/writing.md +635 -0
  125. package/dist/docs/start/howto.md +187 -0
  126. package/dist/docs/start/intro.md +43 -0
  127. package/dist/docs/start/responsiveness.md +98 -0
  128. package/dist/docs/templates/common-table.md +1111 -0
  129. package/dist/docs/templates/detail-views.md +942 -0
  130. package/dist/docs/templates/expandable-details.md +228 -0
  131. package/dist/docs/templates/feature-cards.md +549 -0
  132. package/dist/docs/templates/form-summary.md +199 -0
  133. package/dist/docs/templates/form-toggle.md +367 -0
  134. package/dist/docs/templates/list-blocks.md +1021 -0
  135. package/dist/docs/templates/loading-progress.md +109 -0
  136. package/dist/docs/templates/options-panel.md +152 -0
  137. package/dist/docs/templates/panel-variants.md +164 -0
  138. package/dist/docs/templates/progress-cards.md +607 -0
  139. package/dist/docs/templates/progress-success.md +142 -0
  140. package/dist/docs/templates/settings-form.md +434 -0
  141. package/dist/docs/templates/stats-blocks.md +1381 -0
  142. package/dist/docs/templates/table-panel.md +184 -0
  143. package/dist/docs/templates/table-row-animation.md +317 -0
  144. package/dist/docs/templates/usage-cards.md +227 -0
  145. package/dist/docs/utilities/deviceUtils.md +123 -0
  146. package/dist/docs/utilities/featureToggles.md +90 -0
  147. package/dist/docs/utilities/fuelTypeUtils.md +186 -0
  148. package/dist/docs/utilities/routeUtils.md +138 -0
  149. package/dist/docs/utilities/useAfterMount.md +66 -0
  150. package/dist/docs/utilities/useAutoAnimate.md +193 -0
  151. package/dist/docs/utilities/useAverage.md +95 -0
  152. package/dist/docs/utilities/useClickOutside.md +61 -0
  153. package/dist/docs/utilities/useClipboard.md +93 -0
  154. package/dist/docs/utilities/useCount.md +178 -0
  155. package/dist/docs/utilities/useDarkMode.md +49 -0
  156. package/dist/docs/utilities/useDebugInfo.md +126 -0
  157. package/dist/docs/utilities/useEffectOnce.md +58 -0
  158. package/dist/docs/utilities/useElapsedTime.md +58 -0
  159. package/dist/docs/utilities/useElementSize.md +71 -0
  160. package/dist/docs/utilities/useEsc.md +58 -0
  161. package/dist/docs/utilities/useEvent.md +64 -0
  162. package/dist/docs/utilities/useFocusTrap.md +85 -0
  163. package/dist/docs/utilities/useFullscreen.md +198 -0
  164. package/dist/docs/utilities/useHover.md +55 -0
  165. package/dist/docs/utilities/useIncomingPostMessages.md +237 -0
  166. package/dist/docs/utilities/useInterval.md +85 -0
  167. package/dist/docs/utilities/useIsFocusWithin.md +114 -0
  168. package/dist/docs/utilities/useKey.md +151 -0
  169. package/dist/docs/utilities/useLocalStorage.md +91 -0
  170. package/dist/docs/utilities/useLocationSuggestions.md +114 -0
  171. package/dist/docs/utilities/useMax.md +62 -0
  172. package/dist/docs/utilities/useMin.md +78 -0
  173. package/dist/docs/utilities/useMutationObserver.md +113 -0
  174. package/dist/docs/utilities/useOnScreen.md +138 -0
  175. package/dist/docs/utilities/useOnlineStatus.md +49 -0
  176. package/dist/docs/utilities/usePostMessage.md +117 -0
  177. package/dist/docs/utilities/usePostMessageSender.md +257 -0
  178. package/dist/docs/utilities/usePrevious.md +101 -0
  179. package/dist/docs/utilities/useResizeObserver.md +151 -0
  180. package/dist/docs/utilities/useScrollPosition.md +252 -0
  181. package/dist/docs/utilities/useSearch.md +228 -0
  182. package/dist/docs/utilities/useSorting.md +389 -0
  183. package/dist/docs/utilities/useStateWithValidation.md +83 -0
  184. package/dist/docs/utilities/useSum.md +155 -0
  185. package/dist/docs/utilities/useTableExport.md +404 -0
  186. package/dist/docs/utilities/useTableSelection.md +1120 -0
  187. package/dist/docs/utilities/useTimeout.md +55 -0
  188. package/dist/docs/utilities/useToggle.md +115 -0
  189. package/dist/docs/utilities/useWindowResize.md +70 -0
  190. package/dist/index.mjs +271 -0
  191. package/dist/search-synonyms.json +134 -0
  192. package/dist/version.json +4 -0
  193. package/package.json +23 -19
  194. package/bin/uikit-mcp.mjs +0 -23
  195. package/data/pages/Components/components/accentbar.json +0 -207
  196. package/data/pages/Components/components/activity.json +0 -87
  197. package/data/pages/Components/components/animatednumber.json +0 -99
  198. package/data/pages/Components/components/animations.json +0 -87
  199. package/data/pages/Components/components/appheader.json +0 -291
  200. package/data/pages/Components/components/applayout.json +0 -1198
  201. package/data/pages/Components/components/appnavigationbar.json +0 -327
  202. package/data/pages/Components/components/areacharts.json +0 -563
  203. package/data/pages/Components/components/aspectratioplaceholder.json +0 -75
  204. package/data/pages/Components/components/assettree.json +0 -3080
  205. package/data/pages/Components/components/autosuggests.json +0 -710
  206. package/data/pages/Components/components/avatar.json +0 -157
  207. package/data/pages/Components/components/banner.json +0 -599
  208. package/data/pages/Components/components/barcharts.json +0 -1507
  209. package/data/pages/Components/components/barlist.json +0 -223
  210. package/data/pages/Components/components/basicmap.json +0 -68
  211. package/data/pages/Components/components/bottomsheet.json +0 -601
  212. package/data/pages/Components/components/button.json +0 -583
  213. package/data/pages/Components/components/buttontoolbar.json +0 -63
  214. package/data/pages/Components/components/calendarstripe.json +0 -235
  215. package/data/pages/Components/components/card.json +0 -69
  216. package/data/pages/Components/components/carousel.json +0 -39
  217. package/data/pages/Components/components/chartcolors.json +0 -34
  218. package/data/pages/Components/components/chartsgettingstarted.json +0 -32
  219. package/data/pages/Components/components/chat.json +0 -39
  220. package/data/pages/Components/components/checkbox.json +0 -847
  221. package/data/pages/Components/components/clearableinput.json +0 -789
  222. package/data/pages/Components/components/collapse.json +0 -175
  223. package/data/pages/Components/components/composedcharts.json +0 -159
  224. package/data/pages/Components/components/contentloader.json +0 -233
  225. package/data/pages/Components/components/datatabs.json +0 -680
  226. package/data/pages/Components/components/datepickers.json +0 -287
  227. package/data/pages/Components/components/dialogs.json +0 -1492
  228. package/data/pages/Components/components/divider.json +0 -93
  229. package/data/pages/Components/components/dropdowns.json +0 -936
  230. package/data/pages/Components/components/editablecontent.json +0 -1117
  231. package/data/pages/Components/components/expander.json +0 -377
  232. package/data/pages/Components/components/fade.json +0 -403
  233. package/data/pages/Components/components/fadeexpander.json +0 -75
  234. package/data/pages/Components/components/fadeup.json +0 -127
  235. package/data/pages/Components/components/feedback.json +0 -269
  236. package/data/pages/Components/components/filepickers.json +0 -269
  237. package/data/pages/Components/components/formlabel.json +0 -115
  238. package/data/pages/Components/components/fullscreenmap.json +0 -22
  239. package/data/pages/Components/components/groupeditemlist.json +0 -323
  240. package/data/pages/Components/components/iconlist.json +0 -45
  241. package/data/pages/Components/components/imagepreloader.json +0 -81
  242. package/data/pages/Components/components/labeledelement.json +0 -75
  243. package/data/pages/Components/components/licenseplate.json +0 -69
  244. package/data/pages/Components/components/linecharts.json +0 -987
  245. package/data/pages/Components/components/listmenu.json +0 -313
  246. package/data/pages/Components/components/loadmore.json +0 -175
  247. package/data/pages/Components/components/mainnavigation.json +0 -39
  248. package/data/pages/Components/components/mapcircle.json +0 -34
  249. package/data/pages/Components/components/mapcluster.json +0 -51
  250. package/data/pages/Components/components/mapcontext.json +0 -105
  251. package/data/pages/Components/components/mapdraggablemarker.json +0 -34
  252. package/data/pages/Components/components/mapgettingstarted.json +0 -27
  253. package/data/pages/Components/components/mapgroup.json +0 -1198
  254. package/data/pages/Components/components/mapinfobubble.json +0 -34
  255. package/data/pages/Components/components/maplayergroup.json +0 -34
  256. package/data/pages/Components/components/mapmarker.json +0 -700
  257. package/data/pages/Components/components/mappolygon.json +0 -45
  258. package/data/pages/Components/components/maproute.json +0 -623
  259. package/data/pages/Components/components/maproutegenerator.json +0 -16
  260. package/data/pages/Components/components/mapsettings.json +0 -51
  261. package/data/pages/Components/components/maputils.json +0 -34
  262. package/data/pages/Components/components/multiselects.json +0 -1451
  263. package/data/pages/Components/components/nodata.json +0 -139
  264. package/data/pages/Components/components/notifications.json +0 -65
  265. package/data/pages/Components/components/numbercontrol.json +0 -301
  266. package/data/pages/Components/components/onboarding.json +0 -302
  267. package/data/pages/Components/components/page.json +0 -197
  268. package/data/pages/Components/components/pager.json +0 -93
  269. package/data/pages/Components/components/piecharts.json +0 -731
  270. package/data/pages/Components/components/popover.json +0 -251
  271. package/data/pages/Components/components/position.json +0 -69
  272. package/data/pages/Components/components/radialbarcharts.json +0 -1304
  273. package/data/pages/Components/components/radiobutton.json +0 -1105
  274. package/data/pages/Components/components/releasenotes.json +0 -44
  275. package/data/pages/Components/components/resizer.json +0 -93
  276. package/data/pages/Components/components/responsivecolumnstripe.json +0 -123
  277. package/data/pages/Components/components/responsivevideo.json +0 -75
  278. package/data/pages/Components/components/rioglyph.json +0 -93
  279. package/data/pages/Components/components/rules.json +0 -410
  280. package/data/pages/Components/components/saveableinput.json +0 -703
  281. package/data/pages/Components/components/selects.json +0 -701
  282. package/data/pages/Components/components/sidebar.json +0 -243
  283. package/data/pages/Components/components/sliders.json +0 -235
  284. package/data/pages/Components/components/smoothscrollbars.json +0 -335
  285. package/data/pages/Components/components/spinners.json +0 -343
  286. package/data/pages/Components/components/states.json +0 -1705
  287. package/data/pages/Components/components/statswidgets.json +0 -314
  288. package/data/pages/Components/components/statusbar.json +0 -177
  289. package/data/pages/Components/components/stepbutton.json +0 -57
  290. package/data/pages/Components/components/steppedprogressbars.json +0 -417
  291. package/data/pages/Components/components/subnavigation.json +0 -107
  292. package/data/pages/Components/components/supportmarker.json +0 -45
  293. package/data/pages/Components/components/svgimage.json +0 -81
  294. package/data/pages/Components/components/switch.json +0 -111
  295. package/data/pages/Components/components/tables.json +0 -144
  296. package/data/pages/Components/components/tagmanager.json +0 -86
  297. package/data/pages/Components/components/tags.json +0 -146
  298. package/data/pages/Components/components/teaser.json +0 -188
  299. package/data/pages/Components/components/timeline.json +0 -45
  300. package/data/pages/Components/components/timepicker.json +0 -163
  301. package/data/pages/Components/components/togglebutton.json +0 -247
  302. package/data/pages/Components/components/tooltip.json +0 -270
  303. package/data/pages/Components/components/virtuallist.json +0 -175
  304. package/data/pages/Foundations/foundations.json +0 -2475
  305. package/data/pages/Getting-started/start/changelog.json +0 -22
  306. package/data/pages/Getting-started/start/goodtoknow.json +0 -32
  307. package/data/pages/Getting-started/start/guidelines/color-combinations.json +0 -58
  308. package/data/pages/Getting-started/start/guidelines/custom-css.json +0 -27
  309. package/data/pages/Getting-started/start/guidelines/custom-rioglyph.json +0 -22
  310. package/data/pages/Getting-started/start/guidelines/formatting.json +0 -97
  311. package/data/pages/Getting-started/start/guidelines/iframe.json +0 -93
  312. package/data/pages/Getting-started/start/guidelines/obfuscate-data.json +0 -22
  313. package/data/pages/Getting-started/start/guidelines/print-css.json +0 -37
  314. package/data/pages/Getting-started/start/guidelines/spinner.json +0 -144
  315. package/data/pages/Getting-started/start/guidelines/supported-browsers.json +0 -22
  316. package/data/pages/Getting-started/start/guidelines/writing.json +0 -242
  317. package/data/pages/Getting-started/start/howto.json +0 -72
  318. package/data/pages/Getting-started/start/intro.json +0 -37
  319. package/data/pages/Getting-started/start/responsiveness.json +0 -52
  320. package/data/pages/Templates/templates/common-table.json +0 -39
  321. package/data/pages/Templates/templates/detail-views.json +0 -71
  322. package/data/pages/Templates/templates/expandable-details.json +0 -39
  323. package/data/pages/Templates/templates/feature-cards.json +0 -103
  324. package/data/pages/Templates/templates/form-summary.json +0 -39
  325. package/data/pages/Templates/templates/form-toggle.json +0 -39
  326. package/data/pages/Templates/templates/list-blocks.json +0 -119
  327. package/data/pages/Templates/templates/loading-progress.json +0 -39
  328. package/data/pages/Templates/templates/options-panel.json +0 -39
  329. package/data/pages/Templates/templates/panel-variants.json +0 -39
  330. package/data/pages/Templates/templates/progress-cards.json +0 -71
  331. package/data/pages/Templates/templates/progress-success.json +0 -39
  332. package/data/pages/Templates/templates/settings-form.json +0 -39
  333. package/data/pages/Templates/templates/stats-blocks.json +0 -135
  334. package/data/pages/Templates/templates/table-panel.json +0 -39
  335. package/data/pages/Templates/templates/table-row-animation.json +0 -39
  336. package/data/pages/Templates/templates/usage-cards.json +0 -39
  337. package/data/pages/Utilities/utilities/deviceutils.json +0 -39
  338. package/data/pages/Utilities/utilities/featuretoggles.json +0 -42
  339. package/data/pages/Utilities/utilities/fueltypeutils.json +0 -118
  340. package/data/pages/Utilities/utilities/routeutils.json +0 -34
  341. package/data/pages/Utilities/utilities/useaftermount.json +0 -63
  342. package/data/pages/Utilities/utilities/useaverage.json +0 -86
  343. package/data/pages/Utilities/utilities/useclickoutside.json +0 -69
  344. package/data/pages/Utilities/utilities/useclipboard.json +0 -57
  345. package/data/pages/Utilities/utilities/usecount.json +0 -92
  346. package/data/pages/Utilities/utilities/usedarkmode.json +0 -50
  347. package/data/pages/Utilities/utilities/usedebuginfo.json +0 -63
  348. package/data/pages/Utilities/utilities/useeffectonce.json +0 -57
  349. package/data/pages/Utilities/utilities/useelapsedtime.json +0 -57
  350. package/data/pages/Utilities/utilities/useelementsize.json +0 -63
  351. package/data/pages/Utilities/utilities/useesc.json +0 -57
  352. package/data/pages/Utilities/utilities/useevent.json +0 -75
  353. package/data/pages/Utilities/utilities/usefocustrap.json +0 -57
  354. package/data/pages/Utilities/utilities/usefullscreen.json +0 -197
  355. package/data/pages/Utilities/utilities/usehover.json +0 -57
  356. package/data/pages/Utilities/utilities/useinterval.json +0 -63
  357. package/data/pages/Utilities/utilities/useisfocuswithin.json +0 -75
  358. package/data/pages/Utilities/utilities/usekey.json +0 -75
  359. package/data/pages/Utilities/utilities/uselocalstorage.json +0 -69
  360. package/data/pages/Utilities/utilities/uselocationsuggestions.json +0 -110
  361. package/data/pages/Utilities/utilities/usemax.json +0 -86
  362. package/data/pages/Utilities/utilities/usemin.json +0 -86
  363. package/data/pages/Utilities/utilities/usemutationobserver.json +0 -69
  364. package/data/pages/Utilities/utilities/useonlinestatus.json +0 -39
  365. package/data/pages/Utilities/utilities/useonscreen.json +0 -63
  366. package/data/pages/Utilities/utilities/usepostmessage.json +0 -80
  367. package/data/pages/Utilities/utilities/useprevious.json +0 -63
  368. package/data/pages/Utilities/utilities/useresizeobserver.json +0 -65
  369. package/data/pages/Utilities/utilities/usescrollposition.json +0 -103
  370. package/data/pages/Utilities/utilities/usesearch.json +0 -197
  371. package/data/pages/Utilities/utilities/usesorting.json +0 -139
  372. package/data/pages/Utilities/utilities/usestatewithvalidation.json +0 -69
  373. package/data/pages/Utilities/utilities/usesum.json +0 -86
  374. package/data/pages/Utilities/utilities/usetableexport.json +0 -87
  375. package/data/pages/Utilities/utilities/usetableselection.json +0 -311
  376. package/data/pages/Utilities/utilities/usetimeout.json +0 -63
  377. package/data/pages/Utilities/utilities/usetoggle.json +0 -75
  378. package/data/pages/Utilities/utilities/usewindowresize.json +0 -63
  379. package/data/version.json +0 -4
  380. package/docs/content-schema.md +0 -147
  381. package/docs/navigation-inventory.json +0 -1310
  382. package/docs/search-synonyms.json +0 -43
  383. package/server/index.mjs +0 -268
  384. package/server/lib/load-docs.mjs +0 -48
  385. package/server/lib/normalise-doc.mjs +0 -220
  386. package/server/lib/render-markdown.mjs +0 -82
  387. package/server/lib/search-index.mjs +0 -49
  388. package/server/lib/types.js +0 -99
@@ -1,314 +0,0 @@
1
- {
2
- "metadata": {
3
- "captured_at": "2025-11-21T12:07:43.540Z",
4
- "source": "https://uikit.developers.rio.cloud/#components/statsWidgets",
5
- "category": "Components",
6
- "section": "Content",
7
- "slug": "components/statswidgets",
8
- "version": "v1.13.2",
9
- "hash_algorithm": "sha256",
10
- "hash": "8d298c540887d920c3f129b419021dfa47d6a5649580a8470935195f201b0865"
11
- },
12
- "title": "StatsWidgets",
13
- "lead": null,
14
- "content": [
15
- {
16
- "heading": "StatsWidgets",
17
- "body": "StatsWidget with another body component and additional footer\n\nInteractive StatsWidget with filter option",
18
- "examples": [
19
- {
20
- "caption": "Example 1",
21
- "rendered_html": "<div class=\"playground-content bg-white padding-20 padding-bottom-25\" style=\"width: 100%;\"><div class=\"StatsWidget-wrapper margin-bottom-20\"><div class=\"StatsWidget\"><div class=\"StatsWidget-header\">Fleet</div><div class=\"StatsWidget-body\"><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">23</div></div><div class=\"StatsWidgetNumber-label\">Trucks</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">14</div></div><div class=\"StatsWidgetNumber-label\">Trailer</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">111</div></div><div class=\"StatsWidgetNumber-label\">Driver</div></div><div class=\"StatsWidget-body-column-spacer\"></div></div></div><div class=\"StatsWidget\"><div class=\"StatsWidget-header\">Notifications</div><div class=\"StatsWidget-body\"><div class=\"StatsWidgetNumber text-color-danger\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">45</div></div><div class=\"StatsWidgetNumber-label\">Exceptions</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber text-color-warning\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">144</div></div><div class=\"StatsWidgetNumber-label\">Warnings</div></div></div></div><div class=\"StatsWidget\"><span class=\"bg-light hover-bg-highlight display-flex justify-content-center align-items-center padding-2 rounded-circle position-absolute top-15 right-15 display-block height-20 width-20 cursor-pointer\"><span class=\"rioglyph rioglyph-revert text-color-white text-size-12\"></span></span><div class=\"StatsWidget-header\">Activity</div><div class=\"StatsWidget-body\"><div class=\"StatsWidgetNumber cursor-pointer text-color-status-available\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">15</div><div class=\"StatsWidgetNumber-total\">30</div></div><div class=\"StatsWidgetNumber-label\">Availability</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber text-color-status-driving\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">12</div></div><div class=\"StatsWidgetNumber-label\">Driving</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber text-color-status-working\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">12</div></div><div class=\"StatsWidgetNumber-label\">Working</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber text-color-status-resting\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">9</div></div><div class=\"StatsWidgetNumber-label\">Resting</div></div></div></div></div><div class=\"StatsWidget-wrapper\"><div class=\"StatsWidget\"><div class=\"StatsWidget-header\">Full width widget</div><div class=\"StatsWidget-body full-width\"><div class=\"StatsWidget-body-column-spacer invisible\"></div><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">23</div></div><div class=\"StatsWidgetNumber-label\">Trucks</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">14</div></div><div class=\"StatsWidgetNumber-label\">Trailer</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">111</div></div><div class=\"StatsWidgetNumber-label\">Driver</div></div><div class=\"StatsWidget-body-column-spacer invisible\"></div></div></div></div></div>",
22
- "tabs": [
23
- {
24
- "label": "React",
25
- "language": "tsx",
26
- "code": "import StatsWidgets from '@rio-cloud/rio-uikit/StatsWidgets';\nimport StatsWidget from '@rio-cloud/rio-uikit/StatsWidget';\nimport StatsWidgetNumber from '@rio-cloud/rio-uikit/StatsWidgetNumber';\nimport StatsWidgetSpacer from '@rio-cloud/rio-uikit/StatsWidgetSpacer';\n\nexport default () => (\n <>\n <StatsWidgets className='margin-bottom-20'>\n <StatsWidget>\n <StatsWidget.Header>Fleet</StatsWidget.Header>\n <StatsWidget.Body>\n <StatsWidgetNumber value='23' label='Trucks' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber value='14' label='Trailer' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber value='111' label='Driver' />\n <StatsWidgetSpacer />\n </StatsWidget.Body>\n </StatsWidget>\n\n <StatsWidget>\n <StatsWidget.Header>Notifications</StatsWidget.Header>\n <StatsWidget.Body>\n <StatsWidgetNumber className='text-color-danger' value={45} label='Exceptions' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber className='text-color-warning' value={144} label='Warnings' />\n </StatsWidget.Body>\n </StatsWidget>\n\n <StatsWidget hasFilter onFilterReset={() => {}}>\n <StatsWidget.Header>Activity</StatsWidget.Header>\n <StatsWidget.Body>\n <StatsWidgetNumber\n className='text-color-status-available'\n value={15}\n total={30}\n label='Availability'\n clickable\n />\n <StatsWidgetSpacer />\n <StatsWidgetNumber className='text-color-status-driving' value={12} label='Driving' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber className='text-color-status-working' value={12} label='Working' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber className='text-color-status-resting' value={9} label='Resting' />\n </StatsWidget.Body>\n </StatsWidget>\n </StatsWidgets>\n\n <StatsWidgets>\n <StatsWidget>\n <StatsWidget.Header>Full width widget</StatsWidget.Header>\n <StatsWidget.Body fullWidth>\n <StatsWidgetNumber value='23' label='Trucks' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber value='14' label='Trailer' />\n <StatsWidgetSpacer />\n <StatsWidgetNumber value='111' label='Driver' />\n </StatsWidget.Body>\n </StatsWidget>\n </StatsWidgets>\n </>\n);"
27
- },
28
- {
29
- "label": "HTML",
30
- "language": "html",
31
- "code": "<div class=\"StatsWidget-wrapper margin-bottom-20\">\n <div class=\"StatsWidget\">\n <div class=\"StatsWidget-header\">Fleet</div>\n <div class=\"StatsWidget-body\">\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">23</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Trucks</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">14</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Trailer</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">111</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Driver</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n </div>\n </div>\n <div class=\"StatsWidget\">\n <div class=\"StatsWidget-header\">Notifications</div>\n <div class=\"StatsWidget-body\">\n <div class=\"StatsWidgetNumber text-color-danger\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">45</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Exceptions</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber text-color-warning\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">144</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Warnings</div>\n </div>\n </div>\n </div>\n <div class=\"StatsWidget\">\n <span class=\"bg-light hover-bg-highlight display-flex justify-content-center align-items-center padding-2 rounded-circle position-absolute top-15 right-15 display-block height-20 width-20 cursor-pointer\">\n <span class=\"rioglyph rioglyph-revert text-color-white text-size-12\">\n </span>\n </span>\n <div class=\"StatsWidget-header\">Activity</div>\n <div class=\"StatsWidget-body\">\n <div class=\"StatsWidgetNumber cursor-pointer text-color-status-available\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">15</div>\n <div class=\"StatsWidgetNumber-total\">30</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Availability</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber text-color-status-driving\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">12</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Driving</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber text-color-status-working\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">12</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Working</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber text-color-status-resting\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">9</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Resting</div>\n </div>\n </div>\n </div>\n</div>\n<div class=\"StatsWidget-wrapper\">\n <div class=\"StatsWidget\">\n <div class=\"StatsWidget-header\">Full width widget</div>\n <div class=\"StatsWidget-body full-width\">\n <div class=\"StatsWidget-body-column-spacer invisible\">\n </div>\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">23</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Trucks</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">14</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Trailer</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">111</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Driver</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer invisible\">\n </div>\n </div>\n </div>\n</div>"
32
- },
33
- {
34
- "label": "Props",
35
- "language": "json",
36
- "code": null,
37
- "props": [
38
- {
39
- "heading": "StatsWidgets, StatsWidget, StatsWidgetSpacer and StatsWidgetNumber",
40
- "rows": [
41
- {
42
- "name": "className",
43
- "type": "String",
44
- "default": "",
45
- "description": "Addional class names to be added to the element."
46
- }
47
- ]
48
- },
49
- {
50
- "heading": "StatsWidget",
51
- "rows": [
52
- {
53
- "name": "hasFilter",
54
- "type": "Boolean",
55
- "default": "false",
56
- "description": "Defines whether a filter is active for this stats widget."
57
- },
58
- {
59
- "name": "onFilterReset",
60
- "type": "Function",
61
- "default": "",
62
- "description": "Callback to reset the filter."
63
- }
64
- ]
65
- },
66
- {
67
- "heading": "StatsWidgetBody",
68
- "rows": [
69
- {
70
- "name": "fullWidth",
71
- "type": "Boolean",
72
- "default": "",
73
- "description": "Whether to use flex space-between for StatsWidgetNumbers."
74
- }
75
- ]
76
- },
77
- {
78
- "heading": "StatsWidgetNumber",
79
- "rows": [
80
- {
81
- "name": "value",
82
- "type": "String / Number / Node",
83
- "default": "",
84
- "description": "The value to be shown."
85
- },
86
- {
87
- "name": "total",
88
- "type": "String / Number / Node",
89
- "default": "",
90
- "description": "The total value to be shown i.e. in combination with an active filter."
91
- },
92
- {
93
- "name": "label",
94
- "type": "String / Node",
95
- "default": "",
96
- "description": "The label shown below the number."
97
- },
98
- {
99
- "name": "clickable",
100
- "type": "Boolean",
101
- "default": "false",
102
- "description": "Defines whether or not the number is clickable i.e. in combination with a filter."
103
- },
104
- {
105
- "name": "onClick",
106
- "type": "Function",
107
- "default": "",
108
- "description": "Callback for when the user clicks the number widget."
109
- }
110
- ]
111
- }
112
- ]
113
- }
114
- ]
115
- },
116
- {
117
- "caption": "Example 2",
118
- "rendered_html": "<div class=\"playground-content bg-lighter padding-20 padding-bottom-25\" style=\"width: 100%;\"><div class=\"StatsWidget-wrapper\"><div class=\"StatsWidget shadow-default\"><div class=\"StatsWidget-header\">Current activity</div><div class=\"StatsWidget-body padding-20\"><div class=\"StatusBar width-100pct display-flex align-items-end\"><div class=\"flex-order-1 margin-right-5\"><span class=\"rioglyph rioglyph-status-resting text-color-status-resting text-size-h3\"></span></div><div class=\"display-flex flex-1-0 flex-order-1 flex-column margin-bottom-10\"><div class=\"display-flex justify-content-center\"><span class=\"display-flex ellipsis-1 flex-1-0 justify-content-center text-color-status-resting width-0 text-size-16 text-bold\">42 min resting</span></div><div class=\"display-flex flex-1-0\"><div class=\"progress margin-0 flex-1-0 height-5\"><div class=\"progress-bar progress-bar-status-resting progress-divider\" style=\"width: 30%;\"></div><div class=\"progress-bar progress-bar-light progress-divider\" style=\"width: 70%;\"></div></div></div></div></div></div><div class=\"StatsWidget-footer bg-lightest text-color-gray\">Last update 2 minutes ago</div></div></div></div>",
119
- "tabs": [
120
- {
121
- "label": "React",
122
- "language": "tsx",
123
- "code": "import StatsWidgets from '@rio-cloud/rio-uikit/StatsWidgets';\nimport StatsWidget from '@rio-cloud/rio-uikit/StatsWidget';\nimport StatusBar from '@rio-cloud/rio-uikit/StatusBar';\n\nexport default () => (\n <StatsWidgets>\n <StatsWidget className='shadow-default'>\n <StatsWidget.Header>Current activity</StatsWidget.Header>\n <StatsWidget.Body className='padding-20'>\n <StatusBar\n icon={{\n name: 'rioglyph-status-resting',\n color: 'text-color-status-resting',\n }}\n label={{\n value: '42 min resting',\n alignment: 'top',\n color: 'text-color-status-resting',\n }}\n progress={[\n {\n percentage: 30,\n color: 'progress-bar-status-resting',\n tooltip: <span>30%</span>,\n },\n {\n percentage: 70,\n color: 'progress-bar-light',\n tooltip: <span>70%</span>,\n },\n ]}\n />\n </StatsWidget.Body>\n <StatsWidget.Footer className='bg-lightest text-color-gray'>Last update 2 minutes ago</StatsWidget.Footer>\n </StatsWidget>\n </StatsWidgets>\n);"
124
- },
125
- {
126
- "label": "HTML",
127
- "language": "html",
128
- "code": "<div class=\"StatsWidget-wrapper\">\n <div class=\"StatsWidget shadow-default\">\n <div class=\"StatsWidget-header\">Current activity</div>\n <div class=\"StatsWidget-body padding-20\">\n <div class=\"StatusBar width-100pct display-flex align-items-end\">\n <div class=\"flex-order-1 margin-right-5\">\n <span class=\"rioglyph rioglyph-status-resting text-color-status-resting text-size-h3\">\n </span>\n </div>\n <div class=\"display-flex flex-1-0 flex-order-1 flex-column margin-bottom-10\">\n <div class=\"display-flex justify-content-center\">\n <span class=\"display-flex ellipsis-1 flex-1-0 justify-content-center text-color-status-resting width-0 text-size-16 text-bold\">42 min resting</span>\n </div>\n <div class=\"display-flex flex-1-0\">\n <div class=\"progress margin-0 flex-1-0 height-5\">\n <div class=\"progress-bar progress-bar-status-resting progress-divider\" style=\"width: 30%;\">\n </div>\n <div class=\"progress-bar progress-bar-light progress-divider\" style=\"width: 70%;\">\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n <div class=\"StatsWidget-footer bg-lightest text-color-gray\">Last update 2 minutes ago</div>\n </div>\n</div>"
129
- },
130
- {
131
- "label": "Props",
132
- "language": "json",
133
- "code": null,
134
- "props": [
135
- {
136
- "heading": "StatsWidgets, StatsWidget, StatsWidgetSpacer and StatsWidgetNumber",
137
- "rows": [
138
- {
139
- "name": "className",
140
- "type": "String",
141
- "default": "",
142
- "description": "Addional class names to be added to the element."
143
- }
144
- ]
145
- },
146
- {
147
- "heading": "StatsWidget",
148
- "rows": [
149
- {
150
- "name": "hasFilter",
151
- "type": "Boolean",
152
- "default": "false",
153
- "description": "Defines whether a filter is active for this stats widget."
154
- },
155
- {
156
- "name": "onFilterReset",
157
- "type": "Function",
158
- "default": "",
159
- "description": "Callback to reset the filter."
160
- }
161
- ]
162
- },
163
- {
164
- "heading": "StatsWidgetBody",
165
- "rows": [
166
- {
167
- "name": "fullWidth",
168
- "type": "Boolean",
169
- "default": "",
170
- "description": "Whether to use flex space-between for StatsWidgetNumbers."
171
- }
172
- ]
173
- },
174
- {
175
- "heading": "StatsWidgetNumber",
176
- "rows": [
177
- {
178
- "name": "value",
179
- "type": "String / Number / Node",
180
- "default": "",
181
- "description": "The value to be shown."
182
- },
183
- {
184
- "name": "total",
185
- "type": "String / Number / Node",
186
- "default": "",
187
- "description": "The total value to be shown i.e. in combination with an active filter."
188
- },
189
- {
190
- "name": "label",
191
- "type": "String / Node",
192
- "default": "",
193
- "description": "The label shown below the number."
194
- },
195
- {
196
- "name": "clickable",
197
- "type": "Boolean",
198
- "default": "false",
199
- "description": "Defines whether or not the number is clickable i.e. in combination with a filter."
200
- },
201
- {
202
- "name": "onClick",
203
- "type": "Function",
204
- "default": "",
205
- "description": "Callback for when the user clicks the number widget."
206
- }
207
- ]
208
- }
209
- ]
210
- }
211
- ]
212
- },
213
- {
214
- "caption": "Example 3",
215
- "rendered_html": "<div class=\"playground-content bg-white padding-20 padding-bottom-25\" style=\"width: 100%;\"><div class=\"StatsWidget-wrapper\"><div class=\"StatsWidget\"><div class=\"StatsWidget-header\">Notifications</div><div class=\"StatsWidget-body\"><div class=\"StatsWidgetNumber cursor-pointer text-color-danger\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">45</div></div><div class=\"StatsWidgetNumber-label\">Exceptions</div></div><div class=\"StatsWidget-body-column-spacer\"></div><div class=\"StatsWidgetNumber cursor-pointer text-color-warning\"><div class=\"StatsWidgetNumber-counter\"><div class=\"StatsWidgetNumber-value\">144</div></div><div class=\"StatsWidgetNumber-label\">Warnings</div></div></div></div></div></div>",
216
- "tabs": [
217
- {
218
- "label": "React",
219
- "language": "tsx",
220
- "code": "import { useState } from 'react';\n\nimport StatsWidgets from '@rio-cloud/rio-uikit/StatsWidgets';\nimport StatsWidget from '@rio-cloud/rio-uikit/StatsWidget';\nimport StatsWidgetNumber from '@rio-cloud/rio-uikit/StatsWidgetNumber';\nimport StatsWidgetSpacer from '@rio-cloud/rio-uikit/StatsWidgetSpacer';\n\ntype Stat = {\n value: number;\n total?: number;\n};\n\ntype Stats = {\n exceptions: Stat;\n warnings: Stat;\n};\n\nconst defaultStats: Stats = {\n exceptions: { value: 45 },\n warnings: { value: 144 },\n};\n\nconst mockFilteredStats: Stats = {\n exceptions: { value: 17, total: 45 },\n warnings: { value: 22, total: 144 },\n};\n\nexport default () => {\n const [hasFilter, setHasFilter] = useState(false);\n\n const handleToggleFilter = () => setHasFilter(!hasFilter);\n const handleResetFilters = () => setHasFilter(false);\n\n const stats = hasFilter ? mockFilteredStats : defaultStats;\n\n return (\n <StatsWidgets>\n <StatsWidget hasFilter={hasFilter} onFilterReset={handleResetFilters}>\n <StatsWidget.Header>Notifications</StatsWidget.Header>\n <StatsWidget.Body>\n <StatsWidgetNumber\n className='text-color-danger'\n value={stats.exceptions.value}\n total={stats.exceptions.total}\n label='Exceptions'\n onClick={handleToggleFilter}\n clickable\n />\n <StatsWidgetSpacer />\n <StatsWidgetNumber\n className='text-color-warning'\n value={stats.warnings.value}\n total={stats.warnings.total}\n label='Warnings'\n onClick={handleToggleFilter}\n clickable\n />\n </StatsWidget.Body>\n </StatsWidget>\n </StatsWidgets>\n );\n};"
221
- },
222
- {
223
- "label": "HTML",
224
- "language": "html",
225
- "code": "<div class=\"StatsWidget-wrapper\">\n <div class=\"StatsWidget\">\n <div class=\"StatsWidget-header\">Notifications</div>\n <div class=\"StatsWidget-body\">\n <div class=\"StatsWidgetNumber cursor-pointer text-color-danger\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">45</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Exceptions</div>\n </div>\n <div class=\"StatsWidget-body-column-spacer\">\n </div>\n <div class=\"StatsWidgetNumber cursor-pointer text-color-warning\">\n <div class=\"StatsWidgetNumber-counter\">\n <div class=\"StatsWidgetNumber-value\">144</div>\n </div>\n <div class=\"StatsWidgetNumber-label\">Warnings</div>\n </div>\n </div>\n </div>\n</div>"
226
- },
227
- {
228
- "label": "Props",
229
- "language": "json",
230
- "code": null,
231
- "props": [
232
- {
233
- "heading": "StatsWidgets, StatsWidget, StatsWidgetSpacer and StatsWidgetNumber",
234
- "rows": [
235
- {
236
- "name": "className",
237
- "type": "String",
238
- "default": "",
239
- "description": "Addional class names to be added to the element."
240
- }
241
- ]
242
- },
243
- {
244
- "heading": "StatsWidget",
245
- "rows": [
246
- {
247
- "name": "hasFilter",
248
- "type": "Boolean",
249
- "default": "false",
250
- "description": "Defines whether a filter is active for this stats widget."
251
- },
252
- {
253
- "name": "onFilterReset",
254
- "type": "Function",
255
- "default": "",
256
- "description": "Callback to reset the filter."
257
- }
258
- ]
259
- },
260
- {
261
- "heading": "StatsWidgetBody",
262
- "rows": [
263
- {
264
- "name": "fullWidth",
265
- "type": "Boolean",
266
- "default": "",
267
- "description": "Whether to use flex space-between for StatsWidgetNumbers."
268
- }
269
- ]
270
- },
271
- {
272
- "heading": "StatsWidgetNumber",
273
- "rows": [
274
- {
275
- "name": "value",
276
- "type": "String / Number / Node",
277
- "default": "",
278
- "description": "The value to be shown."
279
- },
280
- {
281
- "name": "total",
282
- "type": "String / Number / Node",
283
- "default": "",
284
- "description": "The total value to be shown i.e. in combination with an active filter."
285
- },
286
- {
287
- "name": "label",
288
- "type": "String / Node",
289
- "default": "",
290
- "description": "The label shown below the number."
291
- },
292
- {
293
- "name": "clickable",
294
- "type": "Boolean",
295
- "default": "false",
296
- "description": "Defines whether or not the number is clickable i.e. in combination with a filter."
297
- },
298
- {
299
- "name": "onClick",
300
- "type": "Function",
301
- "default": "",
302
- "description": "Callback for when the user clicks the number widget."
303
- }
304
- ]
305
- }
306
- ]
307
- }
308
- ]
309
- }
310
- ]
311
- }
312
- ],
313
- "see_also": []
314
- }