@rio-cloud/uikit-mcp 1.1.4 → 1.1.5

package/dist/docs/components/editableContent.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#components/editableContent
-*Captured:* 2026-01-14T09:07:04.611Z
+*Captured:* 2026-02-03T14:04:18.154Z
 
 The EditableContent component allows for inline editing text or other values. To make sure the user can recognize such an element, it's best to mark the text or content with a dotted line depending on the situation and where it is placed. Alternatively, you can place the "pencil" icon next to the content. Especially on mobile where no hover is available, the editable content must be marked permanently.
 
@@ -60,6 +60,29 @@ export default () => {
 </span>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Headline that can change
 
 Editable headline - like dialog or panel header
@@ -135,6 +158,29 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Example 3
 
 Editable content using a resizable textarea
@@ -198,6 +244,29 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Example 4
 
 Focusable editable content with input validationThis content must not contain numbers.
@@ -275,6 +344,29 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Example 5
 
 Editable text inside of another textLorem ipsum dolor sit amet, consectetur adipiscing elit. In pharetra dui eget massa efficitur aliquam condimentum in felis. Integer eget metus vel nunc efficitur iaculis. Vivamus elementum ante et est sagittis semper. This text can be edited Ut consectetur enim nec tortor scelerisque tincidunt. Fusce ac ligula bibendum, rutrum libero quis, viverra sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis ut hendrerit massa, in molestie elit. Sed vitae orci ac purus volutpat posuere ac ut neque. Mauris ante orci, semper finibus lorem in, fringilla pretium velit.`;
@@ -326,6 +418,29 @@ export default () => {
     </span> Ut consectetur enim nec tortor scelerisque tincidunt. Fusce ac ligula bibendum, rutrum libero quis, viverra sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Duis ut hendrerit massa, in molestie elit. Sed vitae orci ac purus volutpat posuere ac ut neque. Mauris ante orci, semper finibus lorem in, fringilla pretium velit.`;</p>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Example 6
 
 Render NumberControl as custom editor component
@@ -447,6 +562,29 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ### Example: Example 7
 
 Render NumberInput as custom editor component with input validation
@@ -569,6 +707,29 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |
+
 ## Usage guidelines
 
 ### Example: Example 8
@@ -940,4 +1101,27 @@ export default () => {
         <div class="width-100pct children-first-margin-top-0 children-last-margin-bottom-0 padding-top-1">In general, don't make every cell in a table editable. The indication style would be too repetitive and the user does not expect this behavior as it is not implemented in other services like so. Strive for a common look and feel with regards to other services.</div>
     </div>
 </b>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | undefined | Visibility flag used to control edit mode from outside. |
+| onSave | (value: string) => void | — | Callback function triggered when the save button is clicked. |
+| onCancel | VoidFunction | — | Callback function triggered when the cancel button is clicked. |
+| onFocus | VoidFunction | — | Callback function triggered when the input gets focused. |
+| onBlur | VoidFunction | — | Callback function triggered when input looses it's focus. |
+| onEditMode | VoidFunction | — | Callback function triggered when entering the edit mode. |
+| onSaveValidation | (value: string) => boolean | — | Validation function to intercept saving and prevent save on error. |
+| isValid | boolean | true | Controls the error message visibility from outside. This is useful when using a custom input where the validation happens outside of this component. |
+| errorMessage | React.ReactNode | — | The error message that shall be shown to the user in case the validation fails. |
+| customEditor | React.ReactNode | — | Use this prop to define a custom editor input component like Select, NumberInput, TimePicker or DatePicker. Handling input state changes of a custom editor need to be handled outside of this component. By default the EditableContent uses a built-in textarea to allow resizing for larger text. |
+| editorOffsetTop | number | 0 | Offset value to control the vertical position for the editor in case the text element has borders, spacings different text sizes. |
+| editorOffsetLeft | number | 0 | Offset value to control the horizontal position for the editor in case the text element has borders, spacings different text sizes. |
+| size | 'md' \| 'lg' | 'md' | Defines the input and button size. Use 'lg' for headlines. |
+| allowResize | boolean | false | Defines if the internal textarea is allowed to resize vertically. This comes in handy for larger text and when using multiple input rows. |
+| inputRows | number | 1 | Defines the number of rows to use by the internal textarea component. When a single line is used, the input is saved on "enter" key. |
+| inputClassName | string | — | Additional classes to be set on the editor input itself. |
+| editorClassName | string | — | Additional classes to be set on the editor wrapper element. |
+| className | string | — | Additional classes to be set on the text wrapper element. |

package/dist/docs/components/expander.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Show/Hide
 *Source:* https://uikit.developers.rio.cloud/#components/expander
-*Captured:* 2026-01-14T09:07:10.877Z
+*Captured:* 2026-02-03T14:04:24.384Z
 
 A simple panel component where the "panel-body" can be expanded.
 
@@ -117,7 +117,21 @@ export default () => {
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| children |  | — | — |
+| title | string \| React.ReactNode | — | The title to be shown in the expander header. |
+| bsStyle | 'blank' \| 'default' \| 'separator' \| 'primary' \| 'secondary' \| 'info' \| 'warning' \| 'danger' \| 'success' | 'blank' | Component visual or contextual style variants. |
+| iconLeft | boolean | false | Defines if the icon will be align left, otherwise it is aligned right. |
+| open | boolean | false | Defines if the panel will be opened or closed by default. The open/closed state will be handled internally. |
+| unmountOnExit | boolean | true | It unmounts the body component (remove it from the DOM) when it is collapsed. Set it to false to avoid the unmount. |
+| onToggle | (isOpen: boolean) => void | — | Callback function for when the header is clicked and the expander toggles. |
+| onEntered | VoidFunction | — | Callback fired after the component has expanded. |
+| onExited | VoidFunction | — | Callback fired after the component has collapsed. |
+| onAnimationStart | VoidFunction | — | Callback fired when the animation starts for either expand or collapse. |
+| headerClassName | string | — | Additional classes to be set on the panel header. |
+| titleClassName | string | — | Additional classes to be set on the header title. |
+| bodyClassName | string | — | Additional classes to be set on the panel body. |
+| iconClassName | string | — | Additional classes added to the chevron icon |
+| className | string | — | Additional classes to be set on the wrapper element. |
+| children | React.ReactNode \| ((isOpen: boolean) => React.ReactNode \| JSX.Element) | — | Any element to be rendered inside the panel body. Providing a function enables the render prop approach. See https://reactjs.org/docs/render-props.html The function gets the isOpen state passed and is responsible for rendering the custom content. |
 
 ### Example: Default
 
@@ -641,7 +655,21 @@ const DynamicContent = () => {
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| children |  | — | — |
+| title | string \| React.ReactNode | — | The title to be shown in the expander header. |
+| bsStyle | 'blank' \| 'default' \| 'separator' \| 'primary' \| 'secondary' \| 'info' \| 'warning' \| 'danger' \| 'success' | 'blank' | Component visual or contextual style variants. |
+| iconLeft | boolean | false | Defines if the icon will be align left, otherwise it is aligned right. |
+| open | boolean | false | Defines if the panel will be opened or closed by default. The open/closed state will be handled internally. |
+| unmountOnExit | boolean | true | It unmounts the body component (remove it from the DOM) when it is collapsed. Set it to false to avoid the unmount. |
+| onToggle | (isOpen: boolean) => void | — | Callback function for when the header is clicked and the expander toggles. |
+| onEntered | VoidFunction | — | Callback fired after the component has expanded. |
+| onExited | VoidFunction | — | Callback fired after the component has collapsed. |
+| onAnimationStart | VoidFunction | — | Callback fired when the animation starts for either expand or collapse. |
+| headerClassName | string | — | Additional classes to be set on the panel header. |
+| titleClassName | string | — | Additional classes to be set on the header title. |
+| bodyClassName | string | — | Additional classes to be set on the panel body. |
+| iconClassName | string | — | Additional classes added to the chevron icon |
+| className | string | — | Additional classes to be set on the wrapper element. |
+| children | React.ReactNode \| ((isOpen: boolean) => React.ReactNode \| JSX.Element) | — | Any element to be rendered inside the panel body. Providing a function enables the render prop approach. See https://reactjs.org/docs/render-props.html The function gets the isOpen state passed and is responsible for rendering the custom content. |
 
 ## ExpanderList
 
@@ -920,4 +948,23 @@ export default () => {
     </ul>
     <button type="button" class="btn btn-default btn-component" tabindex="0">Toggle first</button>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| items | ExpanderListItem[] | — | List of items to be rendered. The expanded state can be defined via the items open prop. |
+| └id | string \| number | — | The "id" property is used to know which item is expanded. It will also be used to control the component from the outside. It can be a number or a string. If there is no "id" provided, a unique id is internally generated which will be used internally for the uncontrolled case.' |
+| └header | string \| React.ReactNode | — | The header content. |
+| └body | string \| React.ReactNode | — | The body content. If there is no "body" provided, the list item is not expandable. |
+| └open | boolean | — | Defines if the item will be expanded or closed by default. |
+| └onOpen | VoidFunction | — | Callback fired when item toggles to open after a click. |
+| └onClose | VoidFunction | — | Callback fired when item toggles to close after a click. |
+| └headerClassName | string | — | Additional classes to be set on "expander-list-header" node. |
+| └bodyClassName | string | — | Additional classes to be set on "expander-list-body" node. |
+| └className | string | — | Additional classes to be set on list item node. |
+| rounded | boolean | true | Defines whether the "expander-list-body" is rounded or not. |
+| bordered | boolean | true | Defines whether the "expander-list-body" has a border or not. |
+| unmountOnExit | boolean | true | It unmounts the body component (remove it from the DOM) when it is collapsed. Set it to false to avoid the unmount. |
+| className | string | — | Additional classes to be set on the unordered list itself. |

package/dist/docs/components/fade.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Show/Hide
 *Source:* https://uikit.developers.rio.cloud/#components/fade
-*Captured:* 2026-01-14T09:07:12.339Z
+*Captured:* 2026-02-03T14:04:26.307Z
 
 The Fade component fades in and out content with a given animation style.
 
@@ -148,7 +148,14 @@ export default () => {
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| animationStyle |  | — | — |
+| show | boolean | true | Defines whether to show the content. |
+| duration | number | 0.2 | Duration of the fade animation in seconds. |
+| initial | boolean | false | Defines whether the animation is triggered initially when showing the content. |
+| animationStyle | 'fade' \| 'tabs' \| 'page' \| 'pageBack' \| 'fromLeft' \| 'fromRight' \| 'fromTop' \| 'fromBottom' | 'fade' | Defines the desired animation style. Possible values are: - fade - tabs - page - pageBack - fromLeft - fromRight - fromTop - fromBottom |
+| exitBeforeEnter | boolean | false | If set to true, only one component will be rendered at a time. The exiting component will finish its exit animation before the entering component is rendered. |
+| onExitComplete | VoidFunction | () => {} | Fires when all exiting nodes have completed animating out. |
+| animatePresenceProps | object | — | Additional custom props for the underlying Framer motion AnimatePresence component. Use this for additional customizations. |
+| motionProps | object | — | Additional custom props for the underlying Framer motion <motion.div> component. Use this for additional customizations. |
 
 ### Example: Example 2
 
@@ -256,7 +263,14 @@ const ContentTab2 = () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| animationStyle |  | — | — |
+| show | boolean | true | Defines whether to show the content. |
+| duration | number | 0.2 | Duration of the fade animation in seconds. |
+| initial | boolean | false | Defines whether the animation is triggered initially when showing the content. |
+| animationStyle | 'fade' \| 'tabs' \| 'page' \| 'pageBack' \| 'fromLeft' \| 'fromRight' \| 'fromTop' \| 'fromBottom' | 'fade' | Defines the desired animation style. Possible values are: - fade - tabs - page - pageBack - fromLeft - fromRight - fromTop - fromBottom |
+| exitBeforeEnter | boolean | false | If set to true, only one component will be rendered at a time. The exiting component will finish its exit animation before the entering component is rendered. |
+| onExitComplete | VoidFunction | () => {} | Fires when all exiting nodes have completed animating out. |
+| animatePresenceProps | object | — | Additional custom props for the underlying Framer motion AnimatePresence component. Use this for additional customizations. |
+| motionProps | object | — | Additional custom props for the underlying Framer motion <motion.div> component. Use this for additional customizations. |
 
 ### Example: Example 3
 
@@ -378,7 +392,14 @@ const ContentTab2 = () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| animationStyle |  | — | — |
+| show | boolean | true | Defines whether to show the content. |
+| duration | number | 0.2 | Duration of the fade animation in seconds. |
+| initial | boolean | false | Defines whether the animation is triggered initially when showing the content. |
+| animationStyle | 'fade' \| 'tabs' \| 'page' \| 'pageBack' \| 'fromLeft' \| 'fromRight' \| 'fromTop' \| 'fromBottom' | 'fade' | Defines the desired animation style. Possible values are: - fade - tabs - page - pageBack - fromLeft - fromRight - fromTop - fromBottom |
+| exitBeforeEnter | boolean | false | If set to true, only one component will be rendered at a time. The exiting component will finish its exit animation before the entering component is rendered. |
+| onExitComplete | VoidFunction | () => {} | Fires when all exiting nodes have completed animating out. |
+| animatePresenceProps | object | — | Additional custom props for the underlying Framer motion AnimatePresence component. Use this for additional customizations. |
+| motionProps | object | — | Additional custom props for the underlying Framer motion <motion.div> component. Use this for additional customizations. |
 
 ### Example: Example 4
 
@@ -549,7 +570,14 @@ const Content3 = () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| animationStyle |  | — | — |
+| show | boolean | true | Defines whether to show the content. |
+| duration | number | 0.2 | Duration of the fade animation in seconds. |
+| initial | boolean | false | Defines whether the animation is triggered initially when showing the content. |
+| animationStyle | 'fade' \| 'tabs' \| 'page' \| 'pageBack' \| 'fromLeft' \| 'fromRight' \| 'fromTop' \| 'fromBottom' | 'fade' | Defines the desired animation style. Possible values are: - fade - tabs - page - pageBack - fromLeft - fromRight - fromTop - fromBottom |
+| exitBeforeEnter | boolean | false | If set to true, only one component will be rendered at a time. The exiting component will finish its exit animation before the entering component is rendered. |
+| onExitComplete | VoidFunction | () => {} | Fires when all exiting nodes have completed animating out. |
+| animatePresenceProps | object | — | Additional custom props for the underlying Framer motion AnimatePresence component. Use this for additional customizations. |
+| motionProps | object | — | Additional custom props for the underlying Framer motion <motion.div> component. Use this for additional customizations. |
 
 ### Example: Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
 
@@ -798,4 +826,11 @@ const ItemDetails = ({ title = '', onBack }: { title: string | undefined; onBack
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| animationStyle |  | — | — |
+| show | boolean | true | Defines whether to show the content. |
+| duration | number | 0.2 | Duration of the fade animation in seconds. |
+| initial | boolean | false | Defines whether the animation is triggered initially when showing the content. |
+| animationStyle | 'fade' \| 'tabs' \| 'page' \| 'pageBack' \| 'fromLeft' \| 'fromRight' \| 'fromTop' \| 'fromBottom' | 'fade' | Defines the desired animation style. Possible values are: - fade - tabs - page - pageBack - fromLeft - fromRight - fromTop - fromBottom |
+| exitBeforeEnter | boolean | false | If set to true, only one component will be rendered at a time. The exiting component will finish its exit animation before the entering component is rendered. |
+| onExitComplete | VoidFunction | () => {} | Fires when all exiting nodes have completed animating out. |
+| animatePresenceProps | object | — | Additional custom props for the underlying Framer motion AnimatePresence component. Use this for additional customizations. |
+| motionProps | object | — | Additional custom props for the underlying Framer motion <motion.div> component. Use this for additional customizations. |

package/dist/docs/components/fadeExpander.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Show/Hide
 *Source:* https://uikit.developers.rio.cloud/#components/fadeExpander
-*Captured:* 2026-01-14T09:07:10.038Z
+*Captured:* 2026-02-03T14:04:24.408Z
 
 The FadeExpander component fades in and expands when the content.
 
@@ -168,4 +168,13 @@ export default () => {
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| show | boolean | false | Defines if the content is shown or not. |
+| duration | number | 0.2 | Allows customization of animation duration. |
+| delay | number | 0 | Delay in seconds before starting the animation. |
+| className | string | — | Additional classes set to the wrapper element. |

package/dist/docs/components/fadeUp.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Show/Hide
 *Source:* https://uikit.developers.rio.cloud/#components/fadeUp
-*Captured:* 2026-01-14T09:07:10.833Z
+*Captured:* 2026-02-03T14:04:25.440Z
 
 The FadeUp component fades in when the content appears on the screen. After it faded in, the element will stay on screen. This can be used in a scrolling scenario where elements should fade up when they scroll into view. Using the delay helps to stagger the animation.
 
@@ -279,6 +279,15 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| delay | number | 0 | Defines the time the animation should wait until it starts. |
+| duration | number | 0.4 | Defines the duration in seconds of the fade up animation. |
+| offset | number | 15 | Defines the y offset from the bottom where the element starts to fade in. |
+| className | string | — | Additional classes names added to the motion div wrapper. |
+
 ### Example: 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.
 
 Lorem ipsum dolor sit amet
@@ -347,7 +356,7 @@ export default () => {
             <div class="" style="opacity: 1; transform: none;">
                 <h1 class="">Lorem ipsum dolor sit amet</h1>
             </div>
-            <div class="" style="opacity: 0; transform: translateY(0.0309728px);">
+            <div class="" style="opacity: 0; transform: translateY(15px);">
                 <p class="text-color-dark">
                     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.</p>
             </div>
@@ -373,4 +382,13 @@ data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwMCIgaGVpZ2h0PSI2NjYiIHhtbG5zPSJodH
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| delay | number | 0 | Defines the time the animation should wait until it starts. |
+| duration | number | 0.4 | Defines the duration in seconds of the fade up animation. |
+| offset | number | 15 | Defines the y offset from the bottom where the element starts to fade in. |
+| className | string | — | Additional classes names added to the motion div wrapper. |

package/dist/docs/components/feedback.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#components/feedback
-*Captured:* 2026-01-14T09:07:44.893Z
+*Captured:* 2026-02-03T14:05:00.092Z
 
 ## FeedbackRating
 
@@ -287,6 +287,22 @@ export default () => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| headline | React.ReactNode | — | Optional headline |
+| count | number | 1 | The amount of toggle buttons used to rate. |
+| circleButtons | boolean | false | Defines whether the buttons are round. |
+| buttonClassName | string | — | Optional class names applied to all the buttons. If you need more control on styling individual buttons, see buttonStyles. |
+| buttonLabels | React.ReactNode[] | — | Array of button labels that will be used instead of the index. There needs to be a label for each button defined. |
+| buttonStyles | { bsSize?: BUTTON_SIZE; bsStyle?: BUTTON_STYLE; variant?: BUTTON_VARIANT; className?: string; }[] | — | Array of button styles to individually define the button size, style and variant. There needs to be a item for each button defined. |
+| leftLabel | React.ReactNode | — | Left aligned label to name the lowest rating option. |
+| rightLabel | React.ReactNode | — | Right aligned label to name the highest rating option. |
+| leadingIcon | React.ReactNode | — | Additional icon placed in front of the rating buttons. |
+| trailingIcon | React.ReactNode | — | Additional icon placed after the rating buttons. |
+| onRatingChanged | (rating: number \| undefined) => void | — | Callback triggered when the rating changes. |
+
 ## FeedbackInlineButtons
 
 ### Example: Was this helpful?
@@ -513,6 +529,13 @@ const CustomInlineButton = (props: CustomInlineButtonProps) => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| headline | React.ReactNode | — | Optional headline inlined with the buttons. |
+| buttons | React.ReactNode[] | — | List of buttons to be shown. |
+
 ## FeedbackReactions
 
 ### Example: Example 3
@@ -715,4 +738,22 @@ export default () => {
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| headline | React.ReactNode | — | Optional headline inlined with the buttons. |
+| size | 'sm' \| 'md' | 'md' | Size of the reaction buttons. |
+| labelPosition | 'right' \| 'bottom' | 'bottom' | Position of the reaction button labels. |
+| labelUp | React.ReactNode | — | Label for the up button. |
+| labelDown | React.ReactNode | — | Label for the down button. |
+| colorFillUp | string | 'bg-lightest' | Custom fill color for the up button. |
+| colorFillDown | string | 'bg-lightest' | Custom fill color for the down button. |
+| colorHoverUp | string | 'primary' | Custom hover color for the up button. |
+| colorHoverDown | string | 'primary' | Custom hover color for the down button. |
+| onVoteUp | VoidFunction | — | Callback function triggered on up vote. |
+| onVoteDown | VoidFunction | — | Callback function triggered on down vote. |
+| itemClassName | string | — | Additional classes applied to the individual reaction item (button and label). |
+| animated | boolean | false | Defines whether the reaction icon is animated. |

package/dist/docs/components/filePickers.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Pickers
 *Source:* https://uikit.developers.rio.cloud/#components/filePickers
-*Captured:* 2026-01-14T09:07:21.639Z
+*Captured:* 2026-02-03T14:04:36.027Z
 
 ## 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. |