@rio-cloud/uikit-mcp 1.1.4 → 1.1.6

package/dist/docs/components/filePickers.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Pickers
-*Source:* https://uikit.developers.rio.cloud/#components/filePickers
-*Captured:* 2026-01-14T09:07:21.639Z
+*Source:* https://uikit.developers.rio.cloud/#/components/filePickers
+*Captured:* 2026-02-23T13:42:00.580Z
 
 ## FilePicker
 
@@ -94,6 +94,20 @@ export default FilePickerExample;
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| displayMode | 'button' \| 'dropzone' \| 'full' | 'button' | Defines the file picker display mode. Possible values are 'button' for a single button, 'dropzone' for a custom dropzone passed as child function, or 'full' for showing both. |
+| multiple | boolean | true | Indicating if multiple files may be selected. |
+| label | string \| ReactNode | 'Select files' | Text to display on Button if displayMode is set to "button". |
+| maxSize | number | — | Maximum file size in byte. 5 MB = 5,242,880 byte |
+| onPick | (files: File[], rejectedFiles: FileRejection[]) => void | — | Function called after one or multiple files have been picked. |
+| className | string | — | Additional classes for the select button. |
+| fullHeight | boolean | false | Flag to set the dropzone wrapper element to 100% height. This comes in handy, when the dropzone should have 100 % height so it can grow. |
+| accept | { [mimeType: string]: string[]; } | — | Object list of accepted Mime Types as keys and file extensions array as value. |
+| children | ({ isDragActive }: FilePickerRenderProps) => React.ReactElement | — | Pass a custom dropzone element as function receiving some render props. |
+
 ### Example: Example 2
 
 FilePicker for multiple images and with dropzoneSelect multiple ImagesDrag & drop files here, or click to select files
@@ -207,6 +221,20 @@ export default FilePickerWithDropzoneExample;
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| displayMode | 'button' \| 'dropzone' \| 'full' | 'button' | Defines the file picker display mode. Possible values are 'button' for a single button, 'dropzone' for a custom dropzone passed as child function, or 'full' for showing both. |
+| multiple | boolean | true | Indicating if multiple files may be selected. |
+| label | string \| ReactNode | 'Select files' | Text to display on Button if displayMode is set to "button". |
+| maxSize | number | — | Maximum file size in byte. 5 MB = 5,242,880 byte |
+| onPick | (files: File[], rejectedFiles: FileRejection[]) => void | — | Function called after one or multiple files have been picked. |
+| className | string | — | Additional classes for the select button. |
+| fullHeight | boolean | false | Flag to set the dropzone wrapper element to 100% height. This comes in handy, when the dropzone should have 100 % height so it can grow. |
+| accept | { [mimeType: string]: string[]; } | — | Object list of accepted Mime Types as keys and file extensions array as value. |
+| children | ({ isDragActive }: FilePickerRenderProps) => React.ReactElement | — | Pass a custom dropzone element as function receiving some render props. |
+
 ### Example: You have no file selected yet
 
 FilePicker for all files and with dropzone onlyDrag & drop PDF files here or click to select
@@ -325,4 +353,18 @@ export default FilePickerDocumentExample;
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| displayMode | 'button' \| 'dropzone' \| 'full' | 'button' | Defines the file picker display mode. Possible values are 'button' for a single button, 'dropzone' for a custom dropzone passed as child function, or 'full' for showing both. |
+| multiple | boolean | true | Indicating if multiple files may be selected. |
+| label | string \| ReactNode | 'Select files' | Text to display on Button if displayMode is set to "button". |
+| maxSize | number | — | Maximum file size in byte. 5 MB = 5,242,880 byte |
+| onPick | (files: File[], rejectedFiles: FileRejection[]) => void | — | Function called after one or multiple files have been picked. |
+| className | string | — | Additional classes for the select button. |
+| fullHeight | boolean | false | Flag to set the dropzone wrapper element to 100% height. This comes in handy, when the dropzone should have 100 % height so it can grow. |
+| accept | { [mimeType: string]: string[]; } | — | Object list of accepted Mime Types as keys and file extensions array as value. |
+| children | ({ isDragActive }: FilePickerRenderProps) => React.ReactElement | — | Pass a custom dropzone element as function receiving some render props. |

package/dist/docs/components/formLabel.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Content
-*Source:* https://uikit.developers.rio.cloud/#components/formLabel
-*Captured:* 2026-01-14T09:07:29.926Z
+*Source:* https://uikit.developers.rio.cloud/#/components/formLabel
+*Captured:* 2026-02-23T13:42:10.733Z
 
 A small convenience component for a form label or just a label style used without a form element.
 
@@ -127,12 +127,13 @@ export default () => {
         </div>
         <div class="bg-lightest rounded padding-15">
             <div class="uikit-switch">
-                <label class="switch-label label-position-right">
+                <label class="switch-label uikit-switch label-position-right">
                     <input type="checkbox" class="switch-input" checked="">
                     <div class="switch-content" style="color: var(--brand-primary); min-width: 40px;">
                         <div class="switch-handle">
                         </div>
-                    </div>Lorem ipsum dolor
+                    </div>
+                    <div class="switch-text-wrapper user-select-none padding-top-1">Lorem ipsum dolor</div>
                 </label>
             </div>
         </div>
@@ -147,6 +148,13 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| supportingText | string \| React.ReactElement | — | Additional supporting text displayed next to the label. |
+| className | string | — | Additional classes set to the outer element. |
+
 ### Example: A label for some large buttons
 
 Labels for various sized elements using the form-group-sm and form-group-lg class on the parent element.
@@ -232,4 +240,11 @@ export default () => {
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| supportingText | string \| React.ReactElement | — | Additional supporting text displayed next to the label. |
+| className | string | — | Additional classes set to the outer element. |

package/dist/docs/components/groupedItemList.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Content
-*Source:* https://uikit.developers.rio.cloud/#components/groupedItemList
-*Captured:* 2026-01-14T09:07:31.565Z
+*Source:* https://uikit.developers.rio.cloud/#/components/groupedItemList
+*Captured:* 2026-02-23T13:42:11.699Z
 
 ## GroupedItemList
 
@@ -384,6 +384,23 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| items | T[] | — | The list of items to be grouped and rendered. By default, the component assumes an item object containing an id and name property plus some other attributes. |
+| groupBy | keyof T \| ((item: T) => string) | 'name' | The property of the items to group by as a string, or a custom group function. Defaults to name if not provided. |
+| groupSortOrder | SortDirectionType | 'asc' | The order in which to sort the groups. Accepts asc for ascending or desc for descending. |
+| itemSortOrder | SortDirectionType | 'asc' | The order in which to sort the items inside a group. Accepts asc for ascending or desc for descending. |
+| groupSortFunction | (groups: Group[]) => Group[] | — | Sorting function for the groups. |
+| itemSortFunction | (items: T[]) => T[] | — | Sorting function for the items within each group. |
+| renderDivider | (groupKey: string) => React.ReactNode | — | A custom render function for the group divider. Receives the group key (e.g., letter or date) as a parameter. |
+| renderItem | (item: T) => React.ReactNode | — | A custom render function for individual list items. Receives an item as a parameter. |
+| listElement | 'div' \| 'ul' | 'div' | Specifies the HTML element to use for the list inside each group. Default is div. Use ul for rendering the list items as <li> elements. |
+| listElementClassName | string | — | Optional class name for the list element inside each group. Applied to the div or ul wrapping the items. |
+| dividerElementClassName | string | — | Optional class name for the divider element in each group. Applied to the div wrapping each group divider. |
+| className | string | — | Optional class name for the outer wrapper element. Applied to the outer div wrapping the entire component. |
+
 ### Example: Grouped by date
 
 Grouped by date
@@ -709,6 +726,23 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| items | T[] | — | The list of items to be grouped and rendered. By default, the component assumes an item object containing an id and name property plus some other attributes. |
+| groupBy | keyof T \| ((item: T) => string) | 'name' | The property of the items to group by as a string, or a custom group function. Defaults to name if not provided. |
+| groupSortOrder | SortDirectionType | 'asc' | The order in which to sort the groups. Accepts asc for ascending or desc for descending. |
+| itemSortOrder | SortDirectionType | 'asc' | The order in which to sort the items inside a group. Accepts asc for ascending or desc for descending. |
+| groupSortFunction | (groups: Group[]) => Group[] | — | Sorting function for the groups. |
+| itemSortFunction | (items: T[]) => T[] | — | Sorting function for the items within each group. |
+| renderDivider | (groupKey: string) => React.ReactNode | — | A custom render function for the group divider. Receives the group key (e.g., letter or date) as a parameter. |
+| renderItem | (item: T) => React.ReactNode | — | A custom render function for individual list items. Receives an item as a parameter. |
+| listElement | 'div' \| 'ul' | 'div' | Specifies the HTML element to use for the list inside each group. Default is div. Use ul for rendering the list items as <li> elements. |
+| listElementClassName | string | — | Optional class name for the list element inside each group. Applied to the div or ul wrapping the items. |
+| dividerElementClassName | string | — | Optional class name for the divider element in each group. Applied to the div wrapping each group divider. |
+| className | string | — | Optional class name for the outer wrapper element. Applied to the outer div wrapping the entire component. |
+
 ### Example: Example 3
 
 Grouped by custom key with basic styling
@@ -947,4 +981,21 @@ export default () => {
         </ul>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| items | T[] | — | The list of items to be grouped and rendered. By default, the component assumes an item object containing an id and name property plus some other attributes. |
+| groupBy | keyof T \| ((item: T) => string) | 'name' | The property of the items to group by as a string, or a custom group function. Defaults to name if not provided. |
+| groupSortOrder | SortDirectionType | 'asc' | The order in which to sort the groups. Accepts asc for ascending or desc for descending. |
+| itemSortOrder | SortDirectionType | 'asc' | The order in which to sort the items inside a group. Accepts asc for ascending or desc for descending. |
+| groupSortFunction | (groups: Group[]) => Group[] | — | Sorting function for the groups. |
+| itemSortFunction | (items: T[]) => T[] | — | Sorting function for the items within each group. |
+| renderDivider | (groupKey: string) => React.ReactNode | — | A custom render function for the group divider. Receives the group key (e.g., letter or date) as a parameter. |
+| renderItem | (item: T) => React.ReactNode | — | A custom render function for individual list items. Receives an item as a parameter. |
+| listElement | 'div' \| 'ul' | 'div' | Specifies the HTML element to use for the list inside each group. Default is div. Use ul for rendering the list items as <li> elements. |
+| listElementClassName | string | — | Optional class name for the list element inside each group. Applied to the div or ul wrapping the items. |
+| dividerElementClassName | string | — | Optional class name for the divider element in each group. Applied to the div wrapping each group divider. |
+| className | string | — | Optional class name for the outer wrapper element. Applied to the outer div wrapping the entire component. |

package/dist/docs/components/iconList.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* CSS Only
-*Source:* https://uikit.developers.rio.cloud/#components/iconList
-*Captured:* 2026-01-14T09:07:54.600Z
+*Source:* https://uikit.developers.rio.cloud/#/components/iconList
+*Captured:* 2026-02-23T13:42:34.624Z
 
 The timeline component is a pure CSS component.
 
@@ -86,19 +86,19 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget ma
         </div>
         <ul class="icon-list margin-bottom-0">
             <li>
-                <span class="rioglyph rioglyph-car margin-top--1">
+                <span class="rioglyph rioglyph-van margin-top--1">
                 </span>
                 <span>
                     Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis.</span>
             </li>
             <li>
-                <span class="rioglyph rioglyph-truck margin-top--1">
+                <span class="rioglyph rioglyph-trailer margin-top--1">
                 </span>
                 <span>
                     Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis.</span>
             </li>
             <li>
-                <span class="rioglyph rioglyph-driver margin-top--1">
+                <span class="rioglyph rioglyph-truck margin-top--1">
                 </span>
                 <span>
                     Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis.</span>

package/dist/docs/components/imagePreloader.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Misc
-*Source:* https://uikit.developers.rio.cloud/#components/imagePreloader
-*Captured:* 2026-01-14T09:07:43.444Z
+*Source:* https://uikit.developers.rio.cloud/#/components/imagePreloader
+*Captured:* 2026-02-23T13:42:23.833Z
 
 Use the preloader for controlling the various states when fetching the image. It allows to handle the failure case as well.
 
@@ -160,4 +160,8 @@ const failedImageExample = (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| children |  | — | — |
+| src | string | — | The URL of the image to load. |
+| onLoaded | (image: HTMLImageElement) => void | — | Invoked when the image is loaded. |
+| onFailed | (image: HTMLImageElement) => void | — | Invoked when the image failed to load. |
+| isAnonymous | boolean | false | Whether to set the "crossOrigin" to "anonymous". |
+| children | (props: { status: ImagePreloaderStatus; image: HTMLImageElement; }) => JSX.Element \| null | — | A render function can be used to access both the current state and the image element. Using this, you can decide how to render the different states and/or the loaded image. The function will receive props containing the status and image properties. status will be one of PENDING, FAILED or LOADED. image is the Image element. |

package/dist/docs/components/labeledElement.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Content
-*Source:* https://uikit.developers.rio.cloud/#components/labeledElement
-*Captured:* 2026-01-14T09:07:31.514Z
+*Source:* https://uikit.developers.rio.cloud/#/components/labeledElement
+*Captured:* 2026-02-23T13:42:12.214Z
 
 A simple wrapper component that associates a label with any content, ensuring a unified label style. It simplifies the usage of labels for both form and non-form elements by using the FormLabelcomponent internally. For more flexibility, you can also use it directly when needed.
 
@@ -103,4 +103,14 @@ export default () => (
         <span class="text-size-16 text-color-darker">Lorem ipsum dolor</span>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| label | string \| React.ReactElement | — | The text to display for the label. |
+| htmlFor | string | — | Optional ID of the element associated with the label. |
+| labelProps | Omit<FormLabelProps, 'children'> | — | Additional props for the FormLabel, excluding children and htmlFor. |
+| noGap | boolean | false | If true, removes the bottom margin from the label. |
+| className | string | — | Additional classes for styling the wrapper. |

package/dist/docs/components/licensePlate.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Misc
-*Source:* https://uikit.developers.rio.cloud/#components/licensePlate
-*Captured:* 2026-01-14T09:07:44.028Z
+*Source:* https://uikit.developers.rio.cloud/#/components/licensePlate
+*Captured:* 2026-02-23T13:42:24.861Z
 
 The LicensePlate component is designed to display license plate information with various customization options. It is built with container queries, which ensure that design elements are shown or hidden based on the available space.
 
@@ -401,4 +401,12 @@ export default () => {
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| countryCode | string | — | The country code. Should be a string with 1-3 capital letters. |
+| hideStars | boolean | — | Whether the EU stars should be hidden. |
+| className | string | — | Additional classes added to the wrapping element. |

package/dist/docs/components/lineCharts.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Charts
-*Source:* https://uikit.developers.rio.cloud/#components/lineCharts
-*Captured:* 2026-01-14T09:08:22.024Z
+*Source:* https://uikit.developers.rio.cloud/#/components/lineCharts
+*Captured:* 2026-02-23T13:42:56.803Z
 
 ## LineChart
 
@@ -133,7 +133,7 @@ const data: CustomData[] = [
                     </g>
                     <g tabindex="-1">
                         <g class="recharts-layer recharts-line">
-                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r1:" height="108" width="438" class="recharts-curve recharts-line-curve" stroke-dasharray="15.1723px 36.216516833496094px" d="M45,27C66,28,87,29,108,33C129,37,150,63,171,63C192,63,213,39.6,234,39.6C255,39.6,276,66.3,297,66.3C318,66.3,339,59.3,360,51.3C381,43.3,402,30.8,423,18.3">
+                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r0:" height="108" width="438" class="recharts-curve recharts-line-curve" stroke-dasharray="11.9456px 39.443216833496095px" d="M45,27C66,28,87,29,108,33C129,37,150,63,171,63C192,63,213,39.6,234,39.6C255,39.6,276,66.3,297,66.3C318,66.3,339,59.3,360,51.3C381,43.3,402,30.8,423,18.3">
                             </path>
                         </g>
                     </g>
@@ -467,7 +467,7 @@ const data: CustomData[] = [
                     </g>
                     <g tabindex="-1">
                         <g class="recharts-layer recharts-line">
-                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r2:" height="108" width="438" class="recharts-curve recharts-line-curve" stroke-dasharray="47.2241px 4.164716833496094px" d="M45,27C66,28,87,29,108,33C129,37,150,63,171,63C192,63,213,39.6,234,39.6C255,39.6,276,66.3,297,66.3C318,66.3,339,59.3,360,51.3C381,43.3,402,30.8,423,18.3">
+                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r1:" height="108" width="438" class="recharts-curve recharts-line-curve" stroke-dasharray="47.9423px 3.4465168334960907px" d="M45,27C66,28,87,29,108,33C129,37,150,63,171,63C192,63,213,39.6,234,39.6C255,39.6,276,66.3,297,66.3C318,66.3,339,59.3,360,51.3C381,43.3,402,30.8,423,18.3">
                             </path>
                         </g>
                         <g class="recharts-layer recharts-reference-line">
@@ -913,15 +913,15 @@ const data: CustomData[] = [
                     </g>
                     <g tabindex="-1">
                         <g class="recharts-layer recharts-line">
-                            <path name="uv" stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r3:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="787.956298828125px 0px" d="M75,88.44C118.667,88.8,162.333,89.16,206,90.6C249.667,92.04,293.333,101.4,337,101.4C380.667,101.4,424.333,92.976,468,92.976C511.667,92.976,555.333,102.588,599,102.588C642.667,102.588,686.333,100.068,730,97.188C773.667,94.308,817.333,89.808,861,85.308">
+                            <path name="uv" stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r2:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="787.956298828125px 0px" d="M75,88.44C118.667,88.8,162.333,89.16,206,90.6C249.667,92.04,293.333,101.4,337,101.4C380.667,101.4,424.333,92.976,468,92.976C511.667,92.976,555.333,102.588,599,102.588C642.667,102.588,686.333,100.068,730,97.188C773.667,94.308,817.333,89.808,861,85.308">
                             </path>
                         </g>
                         <g class="recharts-layer recharts-line">
-                            <path name="pv" stroke="#a1daa3 " fill="none" stroke-width="1" id="recharts-line-:r4:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="836.8355px 0.000010253906225443643px" d="M75,97.08C118.667,102.491,162.333,107.902,206,107.902C249.667,107.902,293.333,17.16,337,17.16C380.667,17.16,424.333,80.794,468,80.794C511.667,80.794,555.333,71.16,599,71.16C642.667,71.16,686.333,81.96,730,81.96C773.667,81.96,817.333,79.26,861,76.56">
+                            <path name="pv" stroke="#a1daa3 " fill="none" stroke-width="1" id="recharts-line-:r3:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="836.8355px 0.000010253906225443643px" d="M75,97.08C118.667,102.491,162.333,107.902,206,107.902C249.667,107.902,293.333,17.16,337,17.16C380.667,17.16,424.333,80.794,468,80.794C511.667,80.794,555.333,71.16,599,71.16C642.667,71.16,686.333,81.96,730,81.96C773.667,81.96,817.333,79.26,861,76.56">
                             </path>
                         </g>
                         <g class="recharts-layer recharts-line">
-                            <path name="amt" stroke="#b23672 " fill="none" stroke-width="1" id="recharts-line-:r5:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="786.2213px 0.000013476562457981345px" d="M75,97.08C118.667,98.106,162.333,99.132,206,99.132C249.667,99.132,293.333,98.268,337,98.268C380.667,98.268,424.333,101.4,468,101.4C511.667,101.4,555.333,100.345,599,99.445C642.667,98.545,686.333,96,730,96C773.667,96,817.333,98.16,861,100.32">
+                            <path name="amt" stroke="#b23672 " fill="none" stroke-width="1" id="recharts-line-:r4:" height="108" width="786" class="recharts-curve recharts-line-curve" stroke-dasharray="786.2213px 0.000013476562457981345px" d="M75,97.08C118.667,98.106,162.333,99.132,206,99.132C249.667,99.132,293.333,98.268,337,98.268C380.667,98.268,424.333,101.4,468,101.4C511.667,101.4,555.333,100.345,599,99.445C642.667,98.545,686.333,96,730,96C773.667,96,817.333,98.16,861,100.32">
                             </path>
                         </g>
                     </g>
@@ -1594,15 +1594,15 @@ const data: CustomData[] = [
                             <text x="582.2615131578948" y="30" fill="gray" text-anchor="right">Now</text>
                         </g>
                         <g class="recharts-layer recharts-line">
-                            <path name="Nominal" stroke-width="1" stroke="#67abc5 " fill="none" id="recharts-line-:r6:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="734.8751831054688px 0px" d="M75,48.417C86.959,55.102,98.917,61.788,110.876,68.773C122.834,75.758,134.793,83.75,146.752,90.327C158.71,96.903,170.669,108.233,182.627,108.233C194.586,108.233,206.545,75.909,218.503,75.909C230.462,75.909,242.421,87.592,254.379,92.091C266.338,96.589,278.296,99.703,290.255,102.901C302.214,106.098,314.172,111.275,326.131,111.275C338.089,111.275,350.048,86.284,362.007,86.284C373.965,86.284,385.924,96.133,397.882,98.924C409.841,101.716,421.8,101.885,433.758,103.111C445.717,104.338,457.675,104.595,469.634,106.285C481.593,107.974,493.551,113.25,505.51,113.25C517.468,113.25,529.427,110.368,541.386,108.207C553.344,106.045,565.303,103.563,577.262,100.28C589.22,96.998,601.179,88.509,613.137,88.509C625.096,88.509,637.055,93.776,649.013,93.776C660.972,93.776,672.93,88.509,684.889,88.509C696.848,88.509,708.806,88.509,720.765,88.509C732.723,88.509,744.682,88.509,756.641,88.509">
+                            <path name="Nominal" stroke-width="1" stroke="#67abc5 " fill="none" id="recharts-line-:r5:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="734.8751831054688px 0px" d="M75,48.417C86.959,55.102,98.917,61.788,110.876,68.773C122.834,75.758,134.793,83.75,146.752,90.327C158.71,96.903,170.669,108.233,182.627,108.233C194.586,108.233,206.545,75.909,218.503,75.909C230.462,75.909,242.421,87.592,254.379,92.091C266.338,96.589,278.296,99.703,290.255,102.901C302.214,106.098,314.172,111.275,326.131,111.275C338.089,111.275,350.048,86.284,362.007,86.284C373.965,86.284,385.924,96.133,397.882,98.924C409.841,101.716,421.8,101.885,433.758,103.111C445.717,104.338,457.675,104.595,469.634,106.285C481.593,107.974,493.551,113.25,505.51,113.25C517.468,113.25,529.427,110.368,541.386,108.207C553.344,106.045,565.303,103.563,577.262,100.28C589.22,96.998,601.179,88.509,613.137,88.509C625.096,88.509,637.055,93.776,649.013,93.776C660.972,93.776,672.93,88.509,684.889,88.509C696.848,88.509,708.806,88.509,720.765,88.509C732.723,88.509,744.682,88.509,756.641,88.509">
                             </path>
                         </g>
                         <g class="recharts-layer recharts-line">
-                            <path name="Moderate" stroke-width="1" stroke="#a1daa3 " fill="none" id="recharts-line-:r7:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="704.3584594726562px 0px" d="M75,48.285C86.959,52.468,98.917,56.651,110.876,61.018C122.834,65.384,134.793,70.377,146.752,74.487C158.71,78.597,170.669,85.679,182.627,85.679C194.586,85.679,206.545,65.573,218.503,65.573C230.462,65.573,242.421,72.887,254.379,75.698C266.338,78.509,278.296,80.443,290.255,82.44C302.214,84.437,314.172,87.68,326.131,87.68C338.089,87.68,350.048,72.104,362.007,72.104C373.965,72.104,385.924,78.257,397.882,80.004C409.841,81.751,421.8,81.858,433.758,82.624C445.717,83.39,457.675,83.539,469.634,84.599C481.593,85.659,493.551,88.983,505.51,88.983C517.468,88.983,529.427,87.188,541.386,85.837C553.344,84.485,565.303,82.925,577.262,80.873C589.22,78.821,601.179,73.526,613.137,73.526C625.096,73.526,637.055,78.793,649.013,78.793C660.972,78.793,672.93,73.526,684.889,73.526C696.848,73.526,708.806,73.526,720.765,73.526C732.723,73.526,744.682,73.526,756.641,73.526">
+                            <path name="Moderate" stroke-width="1" stroke="#a1daa3 " fill="none" id="recharts-line-:r6:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="704.3584594726562px 0px" d="M75,48.285C86.959,52.468,98.917,56.651,110.876,61.018C122.834,65.384,134.793,70.377,146.752,74.487C158.71,78.597,170.669,85.679,182.627,85.679C194.586,85.679,206.545,65.573,218.503,65.573C230.462,65.573,242.421,72.887,254.379,75.698C266.338,78.509,278.296,80.443,290.255,82.44C302.214,84.437,314.172,87.68,326.131,87.68C338.089,87.68,350.048,72.104,362.007,72.104C373.965,72.104,385.924,78.257,397.882,80.004C409.841,81.751,421.8,81.858,433.758,82.624C445.717,83.39,457.675,83.539,469.634,84.599C481.593,85.659,493.551,88.983,505.51,88.983C517.468,88.983,529.427,87.188,541.386,85.837C553.344,84.485,565.303,82.925,577.262,80.873C589.22,78.821,601.179,73.526,613.137,73.526C625.096,73.526,637.055,78.793,649.013,78.793C660.972,78.793,672.93,73.526,684.889,73.526C696.848,73.526,708.806,73.526,720.765,73.526C732.723,73.526,744.682,73.526,756.641,73.526">
                             </path>
                         </g>
                         <g class="recharts-layer recharts-line">
-                            <path name="Extreme" stroke-width="1" stroke="#b23672 " fill="none" id="recharts-line-:r8:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="786.7827px 0.000014843750022919266px" d="M75,39.424C86.959,49.112,98.917,58.799,110.876,68.918C122.834,79.036,134.793,90.61,146.752,100.136C158.71,109.662,170.669,126.074,182.627,126.074C194.586,126.074,206.545,75.369,218.503,75.369C230.462,75.369,242.421,92.304,254.379,98.819C266.338,105.334,278.296,109.831,290.255,114.461C302.214,119.091,314.172,126.601,326.131,126.601C338.089,126.601,350.048,88.76,362.007,88.76C373.965,88.76,385.924,103.024,397.882,107.061C409.841,111.099,421.8,111.343,433.758,113.118C445.717,114.893,457.675,115.418,469.634,117.713C481.593,120.009,493.551,126.89,505.51,126.89C517.468,126.89,529.427,122.712,541.386,119.583C553.344,116.454,565.303,112.868,577.262,108.115C589.22,103.361,601.179,91.064,613.137,91.064C625.096,91.064,637.055,95.014,649.013,95.014C660.972,95.014,672.93,91.064,684.889,91.064C696.848,91.064,708.806,91.064,720.765,91.064C732.723,91.064,744.682,91.064,756.641,91.064">
+                            <path name="Extreme" stroke-width="1" stroke="#b23672 " fill="none" id="recharts-line-:r7:" height="158" width="681.640625" class="recharts-curve recharts-line-curve" stroke-dasharray="786.7827px 0.000014843750022919266px" d="M75,39.424C86.959,49.112,98.917,58.799,110.876,68.918C122.834,79.036,134.793,90.61,146.752,100.136C158.71,109.662,170.669,126.074,182.627,126.074C194.586,126.074,206.545,75.369,218.503,75.369C230.462,75.369,242.421,92.304,254.379,98.819C266.338,105.334,278.296,109.831,290.255,114.461C302.214,119.091,314.172,126.601,326.131,126.601C338.089,126.601,350.048,88.76,362.007,88.76C373.965,88.76,385.924,103.024,397.882,107.061C409.841,111.099,421.8,111.343,433.758,113.118C445.717,114.893,457.675,115.418,469.634,117.713C481.593,120.009,493.551,126.89,505.51,126.89C517.468,126.89,529.427,122.712,541.386,119.583C553.344,116.454,565.303,112.868,577.262,108.115C589.22,103.361,601.179,91.064,613.137,91.064C625.096,91.064,637.055,95.014,649.013,95.014C660.972,95.014,672.93,91.064,684.889,91.064C696.848,91.064,708.806,91.064,720.765,91.064C732.723,91.064,744.682,91.064,756.641,91.064">
                             </path>
                         </g>
                     </g>

package/dist/docs/components/listMenu.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Misc
-*Source:* https://uikit.developers.rio.cloud/#components/listMenu
-*Captured:* 2026-01-14T09:07:44.559Z
+*Source:* https://uikit.developers.rio.cloud/#/components/listMenu
+*Captured:* 2026-02-23T13:42:25.448Z
 
 A simple list menu that supports grouping and filter.
 
@@ -199,6 +199,41 @@ export default () => {
 </div>
 ```
 
+#### Props: ListMenu
+
+### ListMenu
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| menuItems | ListMenuItem<T>[] | — | List of menu item groups to be shown. |
+| └group | string \| ReactNode | — | The optional group header to be shown. This can also be a component such as a FormattedMessage. |
+| └groupNavItem | string \| ReactNode | — | The optional group header link to be shown. This can be a link component such as NavLink or Link. This way, the header can be a link itself. In this case, the group prop can be omitted. |
+| └badge | string \| ReactNode | — | The optional badge displayed alongside the group or nav items. This can be text or a React node for additional flexibility. |
+| └badgeType | 'muted' \| 'success' \| 'info' \| 'warning' \| 'danger' | — | The type of badge to display. Determines the visual style of the badge. Available types include: muted: A subdued badge style. success: Indicates a successful state. info: Represents informational content. warning: Warns of potential issues. danger: Highlights a critical state. |
+| └navItems | T[] | — | The list of all menu items of a group. |
+| enableFilter | boolean | false | Enables the filter. |
+| focusFilter | boolean | false | Focus the filter input. |
+| filterKey | keyof T | 'key' | Define the attribute key for filtering. |
+| filterPlaceholder | string | — | The placeholder text for the filter input. |
+| onFilterChange | (value: string) => void | — | Gets called when the filter input changes. |
+| notFoundMessage | string \| ReactNode | — | A localized message to be shown when the filter result is empty. |
+| responsive | boolean | true | The menu uses collapses on smaller screens using an expander panel. |
+| autoClose | boolean | true | Enables automatic closing of the expander panel. Only relevant when using the responsive flag. Note: Make sure to not stop the events from bubbling up when clicking on a list item! Using event.stopPropagation() will prevent the panel from closing. |
+| groupClassName | string | — | Additional classes to be set on the menu group element. |
+| trailingInputAddon | React.ReactNode | — | Additional addon for the input group. |
+| className | string | — | Additional classes to be set on the wrapper element. |
+
+#### Props: ListMenuNavItem
+
+### ListMenuNavItem
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| key | string | — | The name or key of the menu nav item. This key will be used for filtering, hence it should match the translated menu item name. |
+| item | string \| ReactNode | — | The menu nav item itself. This can be a simple <a>, <NavLink>, <Link>, <span> or even a <FormattedMessage>. |
+| disabled | boolean | false | Disables the list item. |
+| isSubItem | boolean | — | Whether the current menu item is a child of another menu item. |
+
 ## ListMenu with NavLinks
 
 In case you want to navigate routes you can also use NavLink components.
@@ -316,16 +351,16 @@ export default () => (
                 <span class="">Group</span>
             </li>
             <li class="">
-                <a aria-current="page" class="active" href="#components/listMenu">Lorem</a>
+                <a activeclassname="active" aria-current="page" class="active" href="#/components/listMenu" data-discover="true">Lorem</a>
             </li>
             <li class="">
-                <a href="#foo">Lipsum</a>
+                <a activeclassname="active" class="" href="#/foo" data-discover="true">Lipsum</a>
             </li>
             <li class="">
-                <a href="#foo">Dolor</a>
+                <a activeclassname="active" class="" href="#/foo" data-discover="true">Dolor</a>
             </li>
             <li class="">
-                <a href="#foo">Sit amet</a>
+                <a activeclassname="active" class="" href="#/foo" data-discover="true">Sit amet</a>
             </li>
             <li class="subitem">
                 <span>No Link Sample</span>
@@ -336,9 +371,44 @@ export default () => (
                 <span class="">Another group</span>
             </li>
             <li class="">
-                <a href="#bar">Lorem</a>
+                <a activeclassname="active" class="" href="#/bar" data-discover="true">Lorem</a>
             </li>
         </ul>
     </div>
 </div>
-```
+```
+
+#### Props: ListMenu
+
+### ListMenu
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| menuItems | ListMenuItem<T>[] | — | List of menu item groups to be shown. |
+| └group | string \| ReactNode | — | The optional group header to be shown. This can also be a component such as a FormattedMessage. |
+| └groupNavItem | string \| ReactNode | — | The optional group header link to be shown. This can be a link component such as NavLink or Link. This way, the header can be a link itself. In this case, the group prop can be omitted. |
+| └badge | string \| ReactNode | — | The optional badge displayed alongside the group or nav items. This can be text or a React node for additional flexibility. |
+| └badgeType | 'muted' \| 'success' \| 'info' \| 'warning' \| 'danger' | — | The type of badge to display. Determines the visual style of the badge. Available types include: muted: A subdued badge style. success: Indicates a successful state. info: Represents informational content. warning: Warns of potential issues. danger: Highlights a critical state. |
+| └navItems | T[] | — | The list of all menu items of a group. |
+| enableFilter | boolean | false | Enables the filter. |
+| focusFilter | boolean | false | Focus the filter input. |
+| filterKey | keyof T | 'key' | Define the attribute key for filtering. |
+| filterPlaceholder | string | — | The placeholder text for the filter input. |
+| onFilterChange | (value: string) => void | — | Gets called when the filter input changes. |
+| notFoundMessage | string \| ReactNode | — | A localized message to be shown when the filter result is empty. |
+| responsive | boolean | true | The menu uses collapses on smaller screens using an expander panel. |
+| autoClose | boolean | true | Enables automatic closing of the expander panel. Only relevant when using the responsive flag. Note: Make sure to not stop the events from bubbling up when clicking on a list item! Using event.stopPropagation() will prevent the panel from closing. |
+| groupClassName | string | — | Additional classes to be set on the menu group element. |
+| trailingInputAddon | React.ReactNode | — | Additional addon for the input group. |
+| className | string | — | Additional classes to be set on the wrapper element. |
+
+#### Props: ListMenuNavItem
+
+### ListMenuNavItem
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| key | string | — | The name or key of the menu nav item. This key will be used for filtering, hence it should match the translated menu item name. |
+| item | string \| ReactNode | — | The menu nav item itself. This can be a simple <a>, <NavLink>, <Link>, <span> or even a <FormattedMessage>. |
+| disabled | boolean | false | Disables the list item. |
+| isSubItem | boolean | — | Whether the current menu item is a child of another menu item. |

package/dist/docs/components/loadMore.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Interaction
-*Source:* https://uikit.developers.rio.cloud/#components/loadMore
-*Captured:* 2026-01-14T09:07:02.390Z
+*Source:* https://uikit.developers.rio.cloud/#/components/loadMore
+*Captured:* 2026-02-23T13:41:41.704Z
 
 ## LoadMoreButton
 
@@ -93,6 +93,19 @@ export default () => {
 <button class="position-absolute left-0 bottom-0 margin-10 btn btn-default" type="button">Reset</button>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| loaded | number | 0 | The number of already loaded elements. If set to 0 the progress bar will not be shown. |
+| total | number | 100 | The number of all elements. If set to 0 the progress bar will not be shown. |
+| noMoreMessage | string \| ReactNode | — | The message that will be shown when everything is loaded. |
+| loadMoreMessage | string \| ReactNode | — | The text for the load more button. |
+| isInteractive | boolean | true | If set to false, the button will not be rendered. The loadMoreMessage will be shown as text. |
+| onLoadMore | VoidFunction | — | Callback fired when clicking on the load more button. |
+| progressBarStyle | ProgressBarStyle | 'white' | In case the component is used on white background, set the progress bar style to gray. |
+| className | string | — | Additional classes to be set on the wrapper element. |
+
 ### Example: Example 2
 
 20/100
@@ -190,4 +203,17 @@ export default () => {
     <button class="btn btn-default" type="button">Reset</button>
     <button class="btn btn-default" type="button">Load more</button>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| loaded | number | 0 | The number of already loaded elements. If set to 0 the progress bar will not be shown. |
+| total | number | 100 | The number of all elements. If set to 0 the progress bar will not be shown. |
+| noMoreMessage | string \| ReactNode | — | The message that will be shown when everything is loaded. |
+| loadMoreMessage | string \| ReactNode | — | The text for the load more button. |
+| isInteractive | boolean | true | If set to false, the button will not be rendered. The loadMoreMessage will be shown as text. |
+| onLoadMore | VoidFunction | — | Callback fired when clicking on the load more button. |
+| progressBarStyle | ProgressBarStyle | 'white' | In case the component is used on white background, set the progress bar style to gray. |
+| className | string | — | Additional classes to be set on the wrapper element. |

package/dist/docs/components/mainNavigation.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Navigation
-*Source:* https://uikit.developers.rio.cloud/#components/mainNavigation
-*Captured:* 2026-01-14T09:06:54.125Z
+*Source:* https://uikit.developers.rio.cloud/#/components/mainNavigation
+*Captured:* 2026-02-23T13:41:32.592Z
 
 ## MainNavigation
 
@@ -84,13 +84,13 @@ export default () => (
             </ul>
             <ul class="SubmoduleNavigation nav">
                 <li class="submodule " data-nav-item-key="1">
-                    <a href="#components/appLayout">Navigation 1</a>
+                    <a class="" href="#/components/appLayout" data-discover="true">Navigation 1</a>
                 </li>
                 <li class="submodule " data-nav-item-key="2">
-                    <a href="#2">Navigation 2</a>
+                    <a class="" href="#/2" data-discover="true">Navigation 2</a>
                 </li>
                 <li class="submodule " data-nav-item-key="3">
-                    <a href="#3">Navigation 3</a>
+                    <a class="" href="#/3" data-discover="true">Navigation 3</a>
                 </li>
             </ul>
             <ul class="ApplicationActionBar nav navbar-nav navbar-right ">

package/dist/docs/components/mapCircle.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Map
-*Source:* https://uikit.developers.rio.cloud/#components/mapCircle
-*Captured:* 2026-01-14T09:08:12.768Z
+*Source:* https://uikit.developers.rio.cloud/#/components/mapCircle
+*Captured:* 2026-02-23T13:42:47.747Z
 
 ## Circle
 

package/dist/docs/components/mapCluster.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Map
-*Source:* https://uikit.developers.rio.cloud/#components/mapCluster
-*Captured:* 2026-01-14T09:08:13.279Z
+*Source:* https://uikit.developers.rio.cloud/#/components/mapCluster
+*Captured:* 2026-02-23T13:42:46.334Z
 
 ## Clusters