@rio-cloud/uikit-mcp 1.1.3 → 1.1.5

package/dist/docs/components/tags.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#components/tags
-*Captured:* 2026-01-07T12:12:01.118Z
+*Captured:* 2026-02-03T14:05:08.958Z
 
 ## Tag
 
@@ -755,31 +755,32 @@ export default () => (
 </div>
 ```
 
-#### Props: TagList
+#### Props: Tag
 
-### TagList
+### Tag
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| autoTagWidth | Boolean | false | Defines if the tag has the same with as it`s parent container. |
-| inline | Boolean | true | Defines if the taglist is rendered inline or vertically. |
-| tagsPerRow | Number | — | Possible values are: 1, 2, 3, 4, 6 |
+| active | boolean | false | Defines if the tag is active. |
+| clickable | boolean | false | Defines if the tag is clickable. |
+| deletable | boolean | false | Defines if the tag is deletable. |
+| revertable | boolean | false | Defines if the tag is revertable. |
+| disabled | boolean | false | Defines if the tag is disabled. |
+| icon | string | — | Define any rioglyph icon like "rioglyph-truck". |
+| muted | boolean | false | Sets a more subtle style for border and background. |
+| round | boolean | true | Defines if the tag is round. |
+| selectable | boolean | false | Defines if the tag is selectable. |
+| size | 'small' \| 'medium' | — | Defines if you want to render the tag in a different size. Possible values are: 'small' and 'medium' |
+| multiline | boolean | false | Allows to render text on multiple lines. |
+| className | string | — | Additional classes to be set on the wrapper element. |
 
-#### Props: Tag
+#### Props: TagList
 
-### Tag
+### TagList
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| size | String | — | Defines if you want to render the tag in a different size. Possible values are: 'small' |
-| icon | String | — | Define any rioglyph icon like "rioglyph-truck". |
-| active | Boolean | false | Defines if the tag is active. |
-| clickable | Boolean | false | Defines if the tag is clickable. |
-| selectable | Boolean | false | Defines if the tag is selectable. |
-| deletable | Boolean | false | Defines if the tag is deletable. |
-| revertable | Boolean | false | Defines if the tag is revertable. |
-| disabled | Boolean | false | Defines if the tag is disabled. |
-| round | Boolean | true | Defines if the tag is round. |
-| muted | Boolean | false | Sets a more subtle style for border and background. |
-| className | String | — | Additional classes to be set on the wrapper element. |
-| children | any | — | Any element to be rendered inside the tag. |
+| inline | boolean | true | Defines if the tag list is rendered inline or vertically. |
+| autoTagWidth | boolean | false | Defines if the tag has the same with as it`s parent container. |
+| tagsPerRow | 1 \| 2 \| 3 \| 4 \| 6 | — | Possible values are 1-6 |
+| className | string | — | Additional classes to be set on the wrapper element. |

package/dist/docs/components/teaser.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#components/teaser
-*Captured:* 2026-01-07T12:11:46.308Z
+*Captured:* 2026-02-03T14:04:52.277Z
 
 The teaser component was built to create all kinds of landing and/or single pages. for example, be used in dialogs or sidebars.
 
@@ -894,10 +894,9 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| children | any | — | The individual Teaser components. |
-| teaserPerRow | Number | — | Defines how many children are rendered into a row. If "teaserPerRow" is not defined the container tries to put all children in a row with regards to the Bootstrap grid. This is done by dividing the amount of children by 12 in order to figure out the col grid classes. It is recommended to define the teaser per row when having more than 4 teaser. Possible values are: 1 2 3 4 6 and 12 |
-| columnClassName | String | — | Optional string for additional classes added to each column of a child. |
-| className | String | — | Optional string for additional classes added to the row. |
+| teaserPerRow | number | — | Defines how many children are rendered into a row. If "teaserPerRow" is not defined, the container tries to put all children in a row with regard to the Bootstrap grid. This is done by dividing the amount of children by 12 in order to figure out the col grid classes. It is recommended to define "teasersPerRow" when having more than 4 teasers. Possible values are: 1 2 3 4 6 12 |
+| columnClassName | string | — | Optional string for additional classes added to each column of a child. |
+| className | string | — | Optional string for additional classes added to the row. |
 
 #### Props: Teaser
 
@@ -905,21 +904,21 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| headline | String / Node | — | The headline for the teaser. |
-| content | String / Node | — | The actual content to show e.g. some kind of text. |
-| image | Object | — | Defines an image to render with the following props. |
-| └src | String | — | The src URL for the image. |
-| └alt | String | — | The alternate text for the image. |
-| └aspectRatio | String | — | Ratio of the transparent image placeholder. Possible value ares: '1:1' '3:1' '3:2' '16:9' |
-| └align | String | — | Defines whether the image is on the left or right side of the component. Possible value ares: 'left' 'right' |
-| └onClick | Function | — | Callback function for the image. |
-| └className | String | — | Additional classes added to the image wrapper. |
-| button | Object | — | Defines a button to render with the following props. |
-| └text | String / Node | — | The text content for the button. |
-| └bsStyle | String | 'primary' | The button style. Please see the Button component definition for possible values. |
-| └onClick | Function | — | Callback function for the button. |
-| └className | String | — | Additional classes added to the button. |
-| verticalAlignment | String | 'top' | Defines where the teaser content is aligned including headerline and image. Possible values are: 'top' 'center' |
-| segmentation | String | — | Defines how the teaser content is segmented. Possible value ares: '50' '25:75' '75:25' '100' |
-| footer | String / Node | — | Optional content for footer in case the prop "button" is not sufficient. |
-| className | String | — | Additional classes added to the wrapper. |
+| headline | string \| React.ReactNode | — | The headline for the teaser. |
+| content | string \| React.ReactNode | — | The actual content to show e.g. some kind of text. |
+| image | TeaserImage | — | Defines an image to render. |
+| └src | string | — | The src URL for the image. |
+| └alt | string | — | The alternate text for the image. |
+| └align | 'left' \| 'right' | — | Defines whether the image is on the left or right side of the component. Possible values are: 'left' and 'right'. |
+| └onClick | VoidFunction | — | Callback function for the image. |
+| └aspectRatio | '1:1' \| '3:1' \| '3:2' \| '16:9' | — | Ratio of the transparent image placeholder. Possible values are '1:1', '3:1', '3:2' and '16:9'. |
+| └className | string | — | Additional classes added to the image wrapper. |
+| button | TeaserButton | — | Defines a button to render with. |
+| └text | string \| React.ReactNode | — | The text content for the button. |
+| └bsStyle | BUTTON_STYLE | 'primary' | The button style. See the button styles definition for possible values. |
+| └onClick | (event: SyntheticEvent<HTMLButtonElement, MouseEvent>) => void | — | Callback function for the button. |
+| └className | string | — | Additional classes added to the button. |
+| verticalAlignment | 'top' \| 'center' | 'top' | Defines where the teaser content is aligned including headline and image. Possible values are: 'top' and 'center'. |
+| segmentation | '50' \| '25:75' \| '75:25' \| '100' | — | Defines how the teaser content is segmented. Possible values are: '50', '25:75', '75:25' and '100'. |
+| footer | string \| React.ReactNode | — | Optional content for footer in case the prop "button" is not sufficient. |
+| className | string | — | Additional classes added to the wrapper. |

package/dist/docs/components/timeline.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* CSS Only
 *Source:* https://uikit.developers.rio.cloud/#components/timeline
-*Captured:* 2026-01-07T12:12:03.009Z
+*Captured:* 2026-02-03T14:05:10.817Z
 
 The timeline component is a pure CSS component.
 

package/dist/docs/components/timepicker.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Pickers
 *Source:* https://uikit.developers.rio.cloud/#components/timepicker
-*Captured:* 2026-01-07T12:11:32.462Z
+*Captured:* 2026-02-03T14:04:35.393Z
 
 ## TimePicker
 
@@ -149,12 +149,14 @@ export default () => {
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
 | value | string | — | Value of the time as string. Note, when value is given the component is treated as controlled. |
-| onChange | Function | () => {} | Callback function when the value changes and is a valid time format. If not it handles the state internally until the time is valid and filled. |
-| alwaysShowMask | Boolean | true | Defines whether to always show the input mask placeholder. |
-| showIcon | Boolean | false | Defines whether or not to show the input icon. |
-| className | String | — | Additional classes to be set on the wrapper element. |
-| inputProps | Object | — | Additional props to be passed on to the underlying input component. |
-| └className | String | — | Additional classes to be set on the input element. |
+| onChange | (value: string) => void | — | Callback function when the value changes and is a valid time format. If not it handles the state internally until the time is valid and filled. |
+| alwaysShowMask | boolean | true | Defines whether to always show the input mask placeholder. |
+| showIcon | boolean | false | Defines whether to show the input icon. |
+| errorMessage | string \| React.ReactNode | — | Input error message. |
+| warningMessage | string \| React.ReactNode | — | Input warning message. |
+| messageWhiteSpace | 'normal' \| 'nowrap' \| 'pre-line' | 'normal' | Feedback message width. |
+| inputProps | Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' \| 'onChange'> | — | Additional properties to be set on the input element. |
+| className | string | — | Additional classes to be set on the wrapper element. |
 
 ### Example: Example 2
 
@@ -254,9 +256,11 @@ export default () => {
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
 | value | string | — | Value of the time as string. Note, when value is given the component is treated as controlled. |
-| onChange | Function | () => {} | Callback function when the value changes and is a valid time format. If not it handles the state internally until the time is valid and filled. |
-| alwaysShowMask | Boolean | true | Defines whether to always show the input mask placeholder. |
-| showIcon | Boolean | false | Defines whether or not to show the input icon. |
-| className | String | — | Additional classes to be set on the wrapper element. |
-| inputProps | Object | — | Additional props to be passed on to the underlying input component. |
-| └className | String | — | Additional classes to be set on the input element. |
+| onChange | (value: string) => void | — | Callback function when the value changes and is a valid time format. If not it handles the state internally until the time is valid and filled. |
+| alwaysShowMask | boolean | true | Defines whether to always show the input mask placeholder. |
+| showIcon | boolean | false | Defines whether to show the input icon. |
+| errorMessage | string \| React.ReactNode | — | Input error message. |
+| warningMessage | string \| React.ReactNode | — | Input warning message. |
+| messageWhiteSpace | 'normal' \| 'nowrap' \| 'pre-line' | 'normal' | Feedback message width. |
+| inputProps | Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' \| 'onChange'> | — | Additional properties to be set on the input element. |
+| className | string | — | Additional classes to be set on the wrapper element. |

package/dist/docs/components/toggleButton.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#components/toggleButton
-*Captured:* 2026-01-07T12:11:20.239Z
+*Captured:* 2026-02-03T14:04:22.766Z
 
 This toggle button is based on the button component that can be used directly.
 
@@ -89,20 +89,38 @@ 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. |
+| disabled | boolean | false | Whether the button should be disabled. |
+| active | boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
+| type | 'button' \| 'submit' | 'button' | Defines the type of the button. This may be used for form submit buttons. |
+| iconOnly | boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
+| 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. |
+| 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. |
+| 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. |
+| bsStyle | BUTTON_STYLE | "default" | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize | BUTTON_SIZE | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant | BUTTON_VARIANT | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
+| noRippleEffect | boolean | — | Whether the "ripple" effect should be suppressed on this button. |
+| tabIndex | number | 0 | Number of the index used for keyboard support. |
+| className | string | — | Additional classes to be set on the button element. |
+
+#### Props: Regular button
+
+### Regular button
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| asToggle | false | false | Use the button as a toggle button. The toggle state can be controlled via the active prop. |
+| onClick | (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | — | Callback function triggered when clicking the button. |
+
+#### Props: ToggleButton
+
+### ToggleButton
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| asToggle | true | false | Use the button as a toggle button. The toggle state can be controlled via the active prop. |
+| onClick | (value: boolean) => void | — | Callback function triggered when clicking the button. |
 
 ### Example: Controlled ToggleButton
 
@@ -162,17 +180,35 @@ 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. |
+| disabled | boolean | false | Whether the button should be disabled. |
+| active | boolean | false | Set the button toggled. Should be used in combination with "asToggle" prop. |
+| type | 'button' \| 'submit' | 'button' | Defines the type of the button. This may be used for form submit buttons. |
+| iconOnly | boolean | false | Use when the content of the button is an icon only to adapt the button spacing accordingly. |
+| 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. |
+| 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. |
+| 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. |
+| bsStyle | BUTTON_STYLE | "default" | Sets the button style. Possible values are: default, unstyled, primary, secondary, info, warning, danger, success, muted and muted-filled |
+| bsSize | BUTTON_SIZE | — | Sets the button size. Possible values are: xs, sm, md and lg |
+| variant | BUTTON_VARIANT | — | Sets the button variant. Possible values are: link, link-inline, outline and action |
+| noRippleEffect | boolean | — | Whether the "ripple" effect should be suppressed on this button. |
+| tabIndex | number | 0 | Number of the index used for keyboard support. |
+| className | string | — | Additional classes to be set on the button element. |
+
+#### Props: Regular button
+
+### Regular button
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| asToggle | false | false | Use the button as a toggle button. The toggle state can be controlled via the active prop. |
+| onClick | (event: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void | — | Callback function triggered when clicking the button. |
+
+#### Props: ToggleButton
+
+### ToggleButton
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| asToggle | true | false | Use the button as a toggle button. The toggle state can be controlled via the active prop. |
+| onClick | (value: boolean) => void | — | Callback function triggered when clicking the button. |

package/dist/docs/components/tooltip.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#components/tooltip
-*Captured:* 2026-01-07T12:12:02.752Z
+*Captured:* 2026-02-03T14:05:10.161Z
 
 In order to use a Tooltip on an element, wrap it with the OverlayTrigger component or use the SimpleTooltip component.
 
@@ -300,36 +300,24 @@ export default () => (
 </div>
 ```
 
-#### Props: Tooltip
-
-### Tooltip
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| id | String / Number | — | An HTML id attribute, necessary for accessibility. |
-| placement | String | — | Sets the direction the Tooltip is positioned towards. This is generally provided by the OverlayTrigger component positioning the tooltip. Possible values are: auto-start, auto, auto-end, top-start, top, top-end, bottom-start, bottom, bottom-end, right-start, right, right-end, left-start, left or left-end |
-| tooltipStyle | String | default | Defines the look of the tooltip. Possible values are: default, onboarding |
-| textAlignment | String | center | Defines the position of the text content. Possible values are: left, right, center |
-| width | String | — | Defines the width of the tooltip. Possible values are: auto, 100, 150, 200, 250, 300, 350, 400, 450, 500 |
-| allowOnTouch | bool | false | Render Tooltips on mobile devices. |
-| className | String | — | Additional classes to be set on the wrapper element. |
-| innerClassName | String | — | Additional classes to be set on the inner element. |
-| children | any | — | Any element to be rendered inside the tooltip. |
-
-#### Props: OverlayTrigger
-
-### OverlayTrigger
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| trigger | 'click' \| 'hover' \| 'focus' | hover | Specify which action or actions trigger Overlay visibility. Possible values are: OverlayTrigger.TRIGGER_CLICK , OverlayTrigger.TRIGGER_HOVER, OverlayTrigger.TRIGGER_HOVER or 'click', 'hover', 'focus' |
-| delay | Number / Object | — | A millisecond delay amount to show and hide the Overlay once triggered. |
-| └show | Number | — | A millisecond delay amount before showing the Overlay once triggered. |
-| └hide | Number | — | A millisecond delay amount before hiding the Overlay once triggered. |
-| defaultShow | Boolean | — | The initial visibility state of the Overlay. For more nuanced visibility control, consider using the Overlay component directly. |
-| overlay | Node | — | An element or text to overlay next to the target. |
-| placement | String | — | Sets the direction the overlay is positioned towards. Possible values are: auto-start, auto, auto-end, top-start, top, top-end, bottom-start, bottom, bottom-end, right-start, right, right-end, left-start, left or left-end |
-| popperConfig | Object | — | A Popper.js config object passed to the the underlying popper instance. |
+#### Props (json)
+
+```json
+popperConfig={{
+    modifiers: [
+         {
+             name: 'offset',
+             options: {
+                 offset: [0, 5],
+             },
+         },
+         {
+             name: 'arrow',
+             options: {},
+         },
+     ],
+ }}
+```
 
 ## SimpleTooltip
 
@@ -433,22 +421,11 @@ export default () => (
 </div>
 ```
 
-#### Props: SimpleTooltip
-
-### SimpleTooltip
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| trigger | String | hover | Specify which action or actions trigger Overlay visibility. Possible values are: 'click', 'hover', 'focus' |
-| placement | String | AUTO | Sets the direction the Tooltip is positioned towards. This is generally provided by the OverlayTrigger component positioning the tooltip. Possible values are: auto-start, auto, auto-end, top-start, top, top-end, bottom-start, bottom, bottom-end, right-start, right, right-end, left-start, left or left-end |
-| content | String / Node | — | The tooltip content. |
-| targetRef | Ref | — | The react ref object assigned to the target of the tooltip. |
-| delay | Number / Object | — | A millisecond delay amount to show the Overlay once triggered. |
-| └show | Number | — | A millisecond delay amount before showing the Overlay once triggered. |
-| └hide | Number | — | A millisecond delay amount before hiding the Overlay once triggered. |
-| textAlignment | String | center | Defines the position of the text content. Possible values are: left, right, center |
-| width | String | — | Defines the width of the tooltip. Possible values are: auto, 100, 150, 200, 250, 300, 350, 400, 450, 500 |
-| className | String | — | Additional classes to be set on the wrapper element. |
-| innerClassName | String | — | Additional classes to be set on the inner element. |
-| popperConfig | Object | — | A Popper.js config object passed to the the underlying popper instance. |
-| children | Node | — | The target node. |
+#### Props (json)
+
+```json
+{
+    show: 1_000,
+    delay: 500,
+}
+```