@rio-cloud/uikit-mcp 1.1.2 → 1.1.4

package/dist/docs/components/barList.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Progress
 *Source:* https://uikit.developers.rio.cloud/#components/barList
-*Captured:* 2025-12-15T15:02:31.702Z
+*Captured:* 2026-01-14T09:07:21.931Z
 
 ## BarList
 
@@ -180,28 +180,28 @@ const transportData = [
             <div class="display-flex justify-content-between gap-15">
                 <div class="width-100pct space-y-5">
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 54.5469%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 49.3329%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/on-time-delivery" class="text-color-darker" target="_blank" rel="noreferrer">On-time delivery</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 36.6909%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 31.3084%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Warehouse efficiency</div>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 20.5191%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 15.0623%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/truck-utilization" class="text-color-darker" target="_blank" rel="noreferrer">Truck utilization</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 4.68771%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 0%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Freight cost/km</div>
@@ -239,28 +239,28 @@ const transportData = [
             <div class="display-flex justify-content-between gap-15 flex-row-reverse gap-10">
                 <div class="width-100pct space-y-5">
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 54.5469%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 49.3329%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/on-time-delivery" class="text-color-darker" target="_blank" rel="noreferrer">On-time delivery</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 36.6909%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 31.3084%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Warehouse efficiency</div>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 20.5191%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 15.0623%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/truck-utilization" class="text-color-darker" target="_blank" rel="noreferrer">Truck utilization</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 4.68771%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 0%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Freight cost/km</div>
@@ -307,23 +307,6 @@ const transportData = [
 </div>
 ```
 
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| data | BarListRow<T>[] | — | Array of bar row data to be rendered. |
-| valueFormatter | (value: number) => string \| React.ReactElement | — | Optional function to format the numeric value displayed on the right side of each bar. |
-| referenceValue | number | max(data.value) | A reference value used to calculate relative widths. If not provided, the maximum value in the data array will be used. |
-| showAnimation | boolean | false | Whether to animate the bar width transitions using Framer Motion. |
-| onSelectRow | (payload: BarListRow<T>) => void | — | Callback fired when a bar is clicked. Receives the full data object of the selected bar. |
-| sortOrder | 'asc' \| 'desc' \| 'none' | 'none' | The sort order for the bars. |
-| rowHeight | number | 32 | Height of each bar row in pixels. |
-| opacity | number | 0.5 | Opacity applied to non-hovered bars. Value should be between 0 and 1. |
-| barColor | string | 'bg-highlight-light' | CSS class or color string used for the active/progress portion of each bar. |
-| labelColor | string | 'text-color-darker' | CSS class or color string used for the text labels. |
-| background | string | 'bg-transparent' | CSS class or color string used for the bar background. |
-| className | string | — | Additional classes for the wrapper element. |
-
 ### Example: 95
 
 Damaged packages
@@ -454,14 +437,14 @@ const transportData = [
                 </div>
             </div>
             <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-lightest cursor-pointer">
-                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 49.2589%;">
+                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 49.301%;">
                 </div>
                 <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                     <div class="text-color-darker">Stored in warehouse</div>
                 </div>
             </div>
             <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-lightest cursor-pointer">
-                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 95.5579%;">
+                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 95.8777%;">
                 </div>
                 <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                     <div class="text-color-darker">Shipped packages</div>
@@ -497,21 +480,4 @@ const transportData = [
         </div>
     </div>
 </div>
-```
-
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| data | BarListRow<T>[] | — | Array of bar row data to be rendered. |
-| valueFormatter | (value: number) => string \| React.ReactElement | — | Optional function to format the numeric value displayed on the right side of each bar. |
-| referenceValue | number | max(data.value) | A reference value used to calculate relative widths. If not provided, the maximum value in the data array will be used. |
-| showAnimation | boolean | false | Whether to animate the bar width transitions using Framer Motion. |
-| onSelectRow | (payload: BarListRow<T>) => void | — | Callback fired when a bar is clicked. Receives the full data object of the selected bar. |
-| sortOrder | 'asc' \| 'desc' \| 'none' | 'none' | The sort order for the bars. |
-| rowHeight | number | 32 | Height of each bar row in pixels. |
-| opacity | number | 0.5 | Opacity applied to non-hovered bars. Value should be between 0 and 1. |
-| barColor | string | 'bg-highlight-light' | CSS class or color string used for the active/progress portion of each bar. |
-| labelColor | string | 'text-color-darker' | CSS class or color string used for the text labels. |
-| background | string | 'bg-transparent' | CSS class or color string used for the bar background. |
-| className | string | — | Additional classes for the wrapper element. |
+```

package/dist/docs/components/basicMap.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Map
 *Source:* https://uikit.developers.rio.cloud/#components/basicMap
-*Captured:* 2025-12-15T15:03:14.667Z
+*Captured:* 2026-01-14T09:08:11.843Z
 
 The following map shows labels for locale de
 
@@ -11,7 +11,7 @@ The following map shows labels for locale de
 
 ### Example: Example 1
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 
@@ -24,7 +24,7 @@ Show traffic incidents
 
 #### Summary
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 
@@ -64,7 +64,7 @@ export default MapExample;
 
 ### Example: Example 2
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 
@@ -77,7 +77,7 @@ Show traffic incidents
 
 #### Summary
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 
@@ -117,7 +117,7 @@ export default MapWithScaleBarExample;
 
 ### Example: Example 3
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 
@@ -130,7 +130,7 @@ Verkehrsstörungen anzeigen
 
 #### Summary
 
-Terms of use© 1987–2025 HERE
+Terms of use© 1987–2026 HERE
 
 10 km
 

package/dist/docs/components/bottomSheet.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Application
 *Source:* https://uikit.developers.rio.cloud/#components/bottomSheet
-*Captured:* 2025-12-15T15:02:05.304Z
+*Captured:* 2026-01-14T09:06:55.178Z
 
 The TimedBottomSheet is a wrapper component for the BottomSheet that allows to control it's visibility via timers and to use the localStorage to save user interaction for handling it's visibility.
 
@@ -76,26 +76,6 @@ const content = (
 </div>
 ```
 
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| show | Boolean | false | Set the visibility of the bottom sheet. The component is already mounted and just moved offscreen. |
-| onClose | Function | () => {}) | Callback for when the sheet closes. |
-| width | Number / String | — | The width of the bottom sheet. This is useful for desktop when not using the entire screen width. When no width is given it will take the width of the content and maximum 100% of the screen. So it this case you might want to apply a "max-width-xxx" via className to control it better. |
-| height | Number / String | — | The height of the bottom sheet. If no height is given, the height is automatically calculated from the content. |
-| title | Node / String | — | The title content shown in the header. If no title is given, the bottom sheet header is not shown. |
-| showCloseButton | Boolean | true | Defines whether or not the close button is shown. |
-| showMaximizeButton | Boolean | false | Defines whether or not the maximize button in the header is shown. |
-| onHeightChange | Function | () => {} | The callback function triggered when the maximize button is clicked and the height changes. |
-| detach | Boolean | false | Set to "true" to detach the bottom sheet from the left side and the bottom and create a little offset. |
-| detachOffset | Number | 15 | Defines the amount of pixels for the sheet. |
-| hasBackdrop | Boolean | false | Set to "true" to render a modal like backdrop to emphasize the bottom sheet. |
-| onBackdropClick | Function | () => {} | Callback function triggered when the backdrop is clicked. Usually used to close the bottom sheet. |
-| bodyRef | React Ref | — | A react ref added to the bottom sheet body. |
-| bodyClassName | String | — | Additional classes to be set on the body element. |
-| className | String | — | Additional classes to be set on the wrapping element. |
-
 ### Example: Example 2
 
 This demonstrates a bottom sheet use case on mobile. This can be used for providing additional information on mobile instead of using a sidebar, onboarding, alternative for dialogs etc.
@@ -219,26 +199,6 @@ export default () => {
 </div>
 ```
 
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| show | Boolean | false | Set the visibility of the bottom sheet. The component is already mounted and just moved offscreen. |
-| onClose | Function | () => {}) | Callback for when the sheet closes. |
-| width | Number / String | — | The width of the bottom sheet. This is useful for desktop when not using the entire screen width. When no width is given it will take the width of the content and maximum 100% of the screen. So it this case you might want to apply a "max-width-xxx" via className to control it better. |
-| height | Number / String | — | The height of the bottom sheet. If no height is given, the height is automatically calculated from the content. |
-| title | Node / String | — | The title content shown in the header. If no title is given, the bottom sheet header is not shown. |
-| showCloseButton | Boolean | true | Defines whether or not the close button is shown. |
-| showMaximizeButton | Boolean | false | Defines whether or not the maximize button in the header is shown. |
-| onHeightChange | Function | () => {} | The callback function triggered when the maximize button is clicked and the height changes. |
-| detach | Boolean | false | Set to "true" to detach the bottom sheet from the left side and the bottom and create a little offset. |
-| detachOffset | Number | 15 | Defines the amount of pixels for the sheet. |
-| hasBackdrop | Boolean | false | Set to "true" to render a modal like backdrop to emphasize the bottom sheet. |
-| onBackdropClick | Function | () => {} | Callback function triggered when the backdrop is clicked. Usually used to close the bottom sheet. |
-| bodyRef | React Ref | — | A react ref added to the bottom sheet body. |
-| bodyClassName | String | — | Additional classes to be set on the body element. |
-| className | String | — | Additional classes to be set on the wrapping element. |
-
 ### Example: Example 3
 
 This demonstrates a bottom sheet use case on mobile. It demonstrates a bottom sheet for smartphones to perform an action.
@@ -336,26 +296,6 @@ export default () => {
 </div>
 ```
 
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| show | Boolean | false | Set the visibility of the bottom sheet. The component is already mounted and just moved offscreen. |
-| onClose | Function | () => {}) | Callback for when the sheet closes. |
-| width | Number / String | — | The width of the bottom sheet. This is useful for desktop when not using the entire screen width. When no width is given it will take the width of the content and maximum 100% of the screen. So it this case you might want to apply a "max-width-xxx" via className to control it better. |
-| height | Number / String | — | The height of the bottom sheet. If no height is given, the height is automatically calculated from the content. |
-| title | Node / String | — | The title content shown in the header. If no title is given, the bottom sheet header is not shown. |
-| showCloseButton | Boolean | true | Defines whether or not the close button is shown. |
-| showMaximizeButton | Boolean | false | Defines whether or not the maximize button in the header is shown. |
-| onHeightChange | Function | () => {} | The callback function triggered when the maximize button is clicked and the height changes. |
-| detach | Boolean | false | Set to "true" to detach the bottom sheet from the left side and the bottom and create a little offset. |
-| detachOffset | Number | 15 | Defines the amount of pixels for the sheet. |
-| hasBackdrop | Boolean | false | Set to "true" to render a modal like backdrop to emphasize the bottom sheet. |
-| onBackdropClick | Function | () => {} | Callback function triggered when the backdrop is clicked. Usually used to close the bottom sheet. |
-| bodyRef | React Ref | — | A react ref added to the bottom sheet body. |
-| bodyClassName | String | — | Additional classes to be set on the body element. |
-| className | String | — | Additional classes to be set on the wrapping element. |
-
 ### Example: Example 4
 
 This demonstrates a bottom sheet use case on mobile. It demonstrates a bottom sheet for an example of how you could do onboarding on smartphones.
@@ -440,26 +380,6 @@ export default () => {
 </div>
 ```
 
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| show | Boolean | false | Set the visibility of the bottom sheet. The component is already mounted and just moved offscreen. |
-| onClose | Function | () => {}) | Callback for when the sheet closes. |
-| width | Number / String | — | The width of the bottom sheet. This is useful for desktop when not using the entire screen width. When no width is given it will take the width of the content and maximum 100% of the screen. So it this case you might want to apply a "max-width-xxx" via className to control it better. |
-| height | Number / String | — | The height of the bottom sheet. If no height is given, the height is automatically calculated from the content. |
-| title | Node / String | — | The title content shown in the header. If no title is given, the bottom sheet header is not shown. |
-| showCloseButton | Boolean | true | Defines whether or not the close button is shown. |
-| showMaximizeButton | Boolean | false | Defines whether or not the maximize button in the header is shown. |
-| onHeightChange | Function | () => {} | The callback function triggered when the maximize button is clicked and the height changes. |
-| detach | Boolean | false | Set to "true" to detach the bottom sheet from the left side and the bottom and create a little offset. |
-| detachOffset | Number | 15 | Defines the amount of pixels for the sheet. |
-| hasBackdrop | Boolean | false | Set to "true" to render a modal like backdrop to emphasize the bottom sheet. |
-| onBackdropClick | Function | () => {} | Callback function triggered when the backdrop is clicked. Usually used to close the bottom sheet. |
-| bodyRef | React Ref | — | A react ref added to the bottom sheet body. |
-| bodyClassName | String | — | Additional classes to be set on the body element. |
-| className | String | — | Additional classes to be set on the wrapping element. |
-
 ## TimedBottomSheet
 
 ### Example: Example 5
@@ -543,7 +463,7 @@ export const FeedbackBottomSheet = ({ onClose }: { onClose: VoidFunction }) => {
         }, HIDE_AFTER_SUBMIT_IN_MS);
     };
 
-    const sendFeedback = (messageToSend: string, featureRating: number | undefined) => {
+    const sendFeedback = (messageToSend: string, _featureRating: number | undefined) => {
         console.log(`Sending email with message \n${messageToSend}`);
     };
 
@@ -701,21 +621,4 @@ export default () => {
 ```html
 <p>Showcase of a timed bottom sheet used for requesting feedback from the user after a major feature was released or updated.</p>
 <button type="button" class="btn btn-primary btn-component" tabindex="0">Trigger timed bottom sheet</button>
-```
-
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| dismissed | Boolean | false | The "dismissed" flag can be used to tell this component that the user has clicked on the content of the component like a button or a link. In this case, the bottom sheet will store a flag in the localStorage to hide the bottom sheet for the next time and it will close the sheet right away. |
-| featureName | String | 0 | The "featureName" prop is used to name the localStorage flag that is used to control the visibility. It should be unique to avoid conflicts with other timed bottom sheets. |
-| localStoragePrefix | String | — | A prefix that will be used for the local storage flag to store whether the bottom sheet should be hidden. Use this prefix for your service name for instance. |
-| showAfter | Number | 0 | Defines the time in milliseconds when the bottom sheet shall be shown. Default value is 0 to show it right away. |
-| hideAfter | Number | 3_600_000 | Defines the time in milliseconds when the bottom sheet hides itself automatically. Default value is 3_600_000 to hide it after 1 hour. In this case, the localStorage flag is not set and the bottom sheet will be shown on the next page load. |
-| alwaysOn | Boolean | false | With this enabled, the BottomSheet will not hide automatically. |
-| showCloseButton | Boolean | true | Enables or disabled the close button. |
-| width | Number | — | Optional width of the bottom sheet. Alternatively, you can set a `max-width-xxx` via className instead. |
-| cleanupLocalStorage | Boolean | false | Flag to allow to remove the localStorage flag again once the component is not needed anymore. |
-| onClose | () => void | — | Callback function that gets triggered when the user closed the bottom sheet with the close button. |
-| bodyClassName | String | — | Optional className to be set on the body. |
-| className | String | — | Optional className to be set on the component. Use this to define a max-width value. |
+```

package/dist/docs/components/button.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#components/button
-*Captured:* 2025-12-15T15:02:10.165Z
+*Captured:* 2026-01-14T09:07:00.083Z
 
 The button component is the React equivalent to the normal HTML button with some To check out the HTML version click here: Buttons
 
@@ -255,20 +255,9 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| disabled | Boolean | false | Set the button disabled. |
-| active | Boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
-| asToggle | Boolean | false | Use the button as a toggle button. The toggle state can be controlled viw the "active" prop. |
-| iconOnly | Boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
-| iconName | String | — | Optional rio-glyph icon name that comes in handy for icon only buttons for not adding a span tag for the icon which reduces boilerplate code. |
-| iconRight | Boolean | false | Adds right side spacing for an icon. This should be used when having navigation buttons that use an icon on the right side. |
-| multiline | Boolean | false | Defines whether the button text break into multiple lines when the button space exceeds. Multiline buttons should be used as exception only. |
-| block | Boolean | false | Defines whether the button takes up the full width of the parent element. |
-| onClick | Function | () => {} | Callback function triggered when clicking the button. |
-| bsStyle | String | default | Sets the button style. Possible values are: default, primary, info, warning, danger, success, muted-filled and muted or Button.DEFAULT, Button.PRIMARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED_FILLED and Button.MUTED |
-| bsSize | String | — | Sets the button size. Possible values are: xs, sm, md and lg or Button.XS, Button.SM, Button.MD and Button.LG |
-| variant | String | — | Sets the button variant. Possible values are: link, link-inline, outline and action or Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE and Button.VARIANT_ACTION |
-| className | String | — | Additional classes to be set on the button element. |
-| children | any | — | Any element to be rendered on the button. |
+| bsStyle |  | — | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize |  | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant |  | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
 
 ### Example: Link buttons
 
@@ -371,20 +360,9 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| disabled | Boolean | false | Set the button disabled. |
-| active | Boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
-| asToggle | Boolean | false | Use the button as a toggle button. The toggle state can be controlled viw the "active" prop. |
-| iconOnly | Boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
-| iconName | String | — | Optional rio-glyph icon name that comes in handy for icon only buttons for not adding a span tag for the icon which reduces boilerplate code. |
-| iconRight | Boolean | false | Adds right side spacing for an icon. This should be used when having navigation buttons that use an icon on the right side. |
-| multiline | Boolean | false | Defines whether the button text break into multiple lines when the button space exceeds. Multiline buttons should be used as exception only. |
-| block | Boolean | false | Defines whether the button takes up the full width of the parent element. |
-| onClick | Function | () => {} | Callback function triggered when clicking the button. |
-| bsStyle | String | default | Sets the button style. Possible values are: default, primary, info, warning, danger, success, muted-filled and muted or Button.DEFAULT, Button.PRIMARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED_FILLED and Button.MUTED |
-| bsSize | String | — | Sets the button size. Possible values are: xs, sm, md and lg or Button.XS, Button.SM, Button.MD and Button.LG |
-| variant | String | — | Sets the button variant. Possible values are: link, link-inline, outline and action or Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE and Button.VARIANT_ACTION |
-| className | String | — | Additional classes to be set on the button element. |
-| children | any | — | Any element to be rendered on the button. |
+| bsStyle |  | — | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize |  | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant |  | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
 
 ### Example: Button group
 
@@ -535,20 +513,9 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| disabled | Boolean | false | Set the button disabled. |
-| active | Boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
-| asToggle | Boolean | false | Use the button as a toggle button. The toggle state can be controlled viw the "active" prop. |
-| iconOnly | Boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
-| iconName | String | — | Optional rio-glyph icon name that comes in handy for icon only buttons for not adding a span tag for the icon which reduces boilerplate code. |
-| iconRight | Boolean | false | Adds right side spacing for an icon. This should be used when having navigation buttons that use an icon on the right side. |
-| multiline | Boolean | false | Defines whether the button text break into multiple lines when the button space exceeds. Multiline buttons should be used as exception only. |
-| block | Boolean | false | Defines whether the button takes up the full width of the parent element. |
-| onClick | Function | () => {} | Callback function triggered when clicking the button. |
-| bsStyle | String | default | Sets the button style. Possible values are: default, primary, info, warning, danger, success, muted-filled and muted or Button.DEFAULT, Button.PRIMARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED_FILLED and Button.MUTED |
-| bsSize | String | — | Sets the button size. Possible values are: xs, sm, md and lg or Button.XS, Button.SM, Button.MD and Button.LG |
-| variant | String | — | Sets the button variant. Possible values are: link, link-inline, outline and action or Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE and Button.VARIANT_ACTION |
-| className | String | — | Additional classes to be set on the button element. |
-| children | any | — | Any element to be rendered on the button. |
+| bsStyle |  | — | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize |  | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant |  | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
 
 ### Example: Outlined buttons (transparent)
 
@@ -638,20 +605,9 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| disabled | Boolean | false | Set the button disabled. |
-| active | Boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
-| asToggle | Boolean | false | Use the button as a toggle button. The toggle state can be controlled viw the "active" prop. |
-| iconOnly | Boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
-| iconName | String | — | Optional rio-glyph icon name that comes in handy for icon only buttons for not adding a span tag for the icon which reduces boilerplate code. |
-| iconRight | Boolean | false | Adds right side spacing for an icon. This should be used when having navigation buttons that use an icon on the right side. |
-| multiline | Boolean | false | Defines whether the button text break into multiple lines when the button space exceeds. Multiline buttons should be used as exception only. |
-| block | Boolean | false | Defines whether the button takes up the full width of the parent element. |
-| onClick | Function | () => {} | Callback function triggered when clicking the button. |
-| bsStyle | String | default | Sets the button style. Possible values are: default, primary, info, warning, danger, success, muted-filled and muted or Button.DEFAULT, Button.PRIMARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED_FILLED and Button.MUTED |
-| bsSize | String | — | Sets the button size. Possible values are: xs, sm, md and lg or Button.XS, Button.SM, Button.MD and Button.LG |
-| variant | String | — | Sets the button variant. Possible values are: link, link-inline, outline and action or Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE and Button.VARIANT_ACTION |
-| className | String | — | Additional classes to be set on the button element. |
-| children | any | — | Any element to be rendered on the button. |
+| bsStyle |  | — | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize |  | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant |  | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
 
 ### Example: Action buttons
 
@@ -759,17 +715,6 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| disabled | Boolean | false | Set the button disabled. |
-| active | Boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
-| asToggle | Boolean | false | Use the button as a toggle button. The toggle state can be controlled viw the "active" prop. |
-| iconOnly | Boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
-| iconName | String | — | Optional rio-glyph icon name that comes in handy for icon only buttons for not adding a span tag for the icon which reduces boilerplate code. |
-| iconRight | Boolean | false | Adds right side spacing for an icon. This should be used when having navigation buttons that use an icon on the right side. |
-| multiline | Boolean | false | Defines whether the button text break into multiple lines when the button space exceeds. Multiline buttons should be used as exception only. |
-| block | Boolean | false | Defines whether the button takes up the full width of the parent element. |
-| onClick | Function | () => {} | Callback function triggered when clicking the button. |
-| bsStyle | String | default | Sets the button style. Possible values are: default, primary, info, warning, danger, success, muted-filled and muted or Button.DEFAULT, Button.PRIMARY, Button.INFO, Button.WARNING, Button.DANGER, Button.SUCCESS, Button.MUTED_FILLED and Button.MUTED |
-| bsSize | String | — | Sets the button size. Possible values are: xs, sm, md and lg or Button.XS, Button.SM, Button.MD and Button.LG |
-| variant | String | — | Sets the button variant. Possible values are: link, link-inline, outline and action or Button.VARIANT_LINK, Button.VARIANT_LINK_INLINE, Button.VARIANT_OUTLINE and Button.VARIANT_ACTION |
-| className | String | — | Additional classes to be set on the button element. |
-| children | any | — | Any element to be rendered on the button. |
+| bsStyle |  | — | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize |  | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant |  | — | Sets the button variant. Possible values are: link, link-inline, outline and action |

package/dist/docs/components/buttonToolbar.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#components/buttonToolbar
-*Captured:* 2025-12-15T15:02:07.552Z
+*Captured:* 2026-01-14T09:06:57.360Z
 
 The ButtonToolbar is a utility component designed to simplify usage and alignment. Its purpose is to ensure consistent spacing.
 
@@ -124,11 +124,4 @@ export default () => (
             </span>Next</button>
     </div>
 </div>
-```
-
-#### Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| alignment | 'left' \| 'right' \| 'center' \| 'space-between' | — | Align buttons to e defined side or set them apart. |
-| className | String | — | Additional classes to be set on the wrapper element. |
+```