@rio-cloud/uikit-mcp 1.1.4 → 1.1.6

package/dist/docs/components/buttonToolbar.md

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

package/dist/docs/components/calendarStripe.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Misc
-*Source:* https://uikit.developers.rio.cloud/#components/calendarStripe
-*Captured:* 2026-01-14T09:07:42.234Z
+*Source:* https://uikit.developers.rio.cloud/#/components/calendarStripe
+*Captured:* 2026-02-23T13:42:23.211Z
 
 A headless component where you provide a function that renders the UI for every day to be displayed.
 
@@ -11,31 +11,31 @@ A headless component where you provide a function that renders the UI for every
 
 ### Example: Example 1
 
+Tuesday
+24 February 2026
+
+Wednesday
+25 February 2026
+
 Thursday
-15 January 2026
+26 February 2026
 
 Friday
-16 January 2026
+27 February 2026
 
-Saturday
-17 January 2026
+#### Summary
 
-Sunday
-18 January 2026
+Tuesday
+24 February 2026
 
-#### Summary
+Wednesday
+25 February 2026
 
 Thursday
-15 January 2026
+26 February 2026
 
 Friday
-16 January 2026
-
-Saturday
-17 January 2026
-
-Sunday
-18 January 2026
+27 February 2026
 
 #### React (tsx)
 
@@ -130,8 +130,8 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
                         <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer ">
                             <div class="display-flex align-items-center justify-content-between">
                                 <div class="display-flex flex-column gap-5 text-size-14 line-height-14">
-                                    <div>Thursday</div>
-                                    <div class="text-size-16 text-medium">15 January 2026</div>
+                                    <div>Tuesday</div>
+                                    <div class="text-size-16 text-medium">24 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -142,8 +142,8 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
                         <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer ">
                             <div class="display-flex align-items-center justify-content-between">
                                 <div class="display-flex flex-column gap-5 text-size-14 line-height-14">
-                                    <div>Friday</div>
-                                    <div class="text-size-16 text-medium">16 January 2026</div>
+                                    <div>Wednesday</div>
+                                    <div class="text-size-16 text-medium">25 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -151,11 +151,11 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer bg-lightest">
+                        <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer ">
                             <div class="display-flex align-items-center justify-content-between">
                                 <div class="display-flex flex-column gap-5 text-size-14 line-height-14">
-                                    <div>Saturday</div>
-                                    <div class="text-size-16 text-medium">17 January 2026</div>
+                                    <div>Thursday</div>
+                                    <div class="text-size-16 text-medium">26 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -163,11 +163,11 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer bg-lightest">
+                        <div class="padding-15 border border-top-none border-bottom-none hover-text-color-darkest hover-bg-highlight-decent cursor-pointer ">
                             <div class="display-flex align-items-center justify-content-between">
                                 <div class="display-flex flex-column gap-5 text-size-14 line-height-14">
-                                    <div>Sunday</div>
-                                    <div class="text-size-16 text-medium">18 January 2026</div>
+                                    <div>Friday</div>
+                                    <div class="text-size-16 text-medium">27 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -187,74 +187,99 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
 </div>
 ```
 
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| minDayWith | number | 200 | The minimum width in pixel of a single day column This value determines how many days are shown per page depending on the parent width. |
+| minDays | number | 1 | The minimum amount of days that should be shown per page. |
+| maxDays | number | 7 | The maximum amount of days that should be shown per page. |
+| renderDay | (date: Date) => React.JSX.Element | — | A function that renders each individual day to be displayed. |
+| skipWeekends | boolean | false | Defines whether the days for the weekends are included. |
+| startDate | Date | the current date | The date of the first day that are rendered. |
+| onNextClick | (newStartDate: Date) => void | — | Callback function for when the next button is clicked. |
+| onPreviousClick | (newStartDate: Date) => void | — | Callback function for when the previous button is clicked. |
+| buttonClassName | string | — | Additional classes set to the navigation buttons. |
+| className | string | — | Additional classes set to the calendar element. |
+| daysWrapperClassName | string | — | Additional classes set to the days wrapper element. |
+| dayWrapperClassName | string | — | Additional classes set to the days wrapper element. |
+
 ### Example: Example 2
 
-Jan
-15
+Feb
+24
+2026
+
+Feb
+25
 2026
 
-Jan
-16
+Feb
+26
 2026
 
-Jan
-17
+Feb
+27
 2026
 
-Jan
-18
+Feb
+28
 2026
 
-Jan
-19
+Mar
+1
 2026
 
-Jan
-20
+Mar
+2
 2026
 
-Jan
-21
+Mar
+3
 2026
 
-Jan
-22
+Mar
+4
 2026
 
 Set to JanuaryToggle Weekends
 
 #### Summary
 
-Jan
-15
+Feb
+24
 2026
 
-Jan
-16
+Feb
+25
 2026
 
-Jan
-17
+Feb
+26
 2026
 
-Jan
-18
+Feb
+27
 2026
 
-Jan
-19
+Feb
+28
 2026
 
-Jan
-20
+Mar
+1
 2026
 
-Jan
-21
+Mar
+2
 2026
 
-Jan
-22
+Mar
+3
+2026
+
+Mar
+4
 2026
 
 Set to JanuaryToggle Weekends
@@ -380,8 +405,8 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
                         <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">15</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">24</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -389,44 +414,44 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
                         <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">16</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">25</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1 bg-lightest text-color-gray pointer-events-none hover-bg-highlight-decent hover-text-color-darkest">
+                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">17</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">26</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1 bg-lightest text-color-gray pointer-events-none hover-bg-highlight-decent hover-text-color-darkest">
+                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">18</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">27</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
+                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1 bg-lightest text-color-gray pointer-events-none hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">19</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">28</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
+                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1 bg-lightest text-color-gray pointer-events-none hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">20</div>
+                                <div class="text-size-12 line-height-12">Mar</div>
+                                <div class="text-size-h3 line-height-h3">1</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -434,8 +459,8 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
                         <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">21</div>
+                                <div class="text-size-12 line-height-12">Mar</div>
+                                <div class="text-size-h3 line-height-h3">2</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -443,8 +468,8 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
                         <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">22</div>
+                                <div class="text-size-12 line-height-12">Mar</div>
+                                <div class="text-size-h3 line-height-h3">3</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -452,17 +477,17 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
                         <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">23</div>
+                                <div class="text-size-12 line-height-12">Mar</div>
+                                <div class="text-size-h3 line-height-h3">4</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
                     </div>
                     <div class="ColumnItem flex-1-1-0 space-x--1 user-select-none">
-                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1 bg-lightest text-color-gray pointer-events-none hover-bg-highlight-decent hover-text-color-darkest">
+                        <div class="cursor-pointer border border-top-none border-bottom-none display-grid place-items-center aspect-ratio-1  hover-bg-highlight-decent hover-text-color-darkest">
                             <div class="display-flex flex-column gap-3 text-center">
-                                <div class="text-size-12 line-height-12">Jan</div>
-                                <div class="text-size-h3 line-height-h3">24</div>
+                                <div class="text-size-12 line-height-12">Mar</div>
+                                <div class="text-size-h3 line-height-h3">5</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -480,4 +505,21 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
         <button type="button" class="btn btn-default btn-component" tabindex="0">Toggle Weekends</button>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| minDayWith | number | 200 | The minimum width in pixel of a single day column This value determines how many days are shown per page depending on the parent width. |
+| minDays | number | 1 | The minimum amount of days that should be shown per page. |
+| maxDays | number | 7 | The maximum amount of days that should be shown per page. |
+| renderDay | (date: Date) => React.JSX.Element | — | A function that renders each individual day to be displayed. |
+| skipWeekends | boolean | false | Defines whether the days for the weekends are included. |
+| startDate | Date | the current date | The date of the first day that are rendered. |
+| onNextClick | (newStartDate: Date) => void | — | Callback function for when the next button is clicked. |
+| onPreviousClick | (newStartDate: Date) => void | — | Callback function for when the previous button is clicked. |
+| buttonClassName | string | — | Additional classes set to the navigation buttons. |
+| className | string | — | Additional classes set to the calendar element. |
+| daysWrapperClassName | string | — | Additional classes set to the days wrapper element. |
+| dayWrapperClassName | string | — | Additional classes set to the days wrapper element. |

package/dist/docs/components/card.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Content
-*Source:* https://uikit.developers.rio.cloud/#components/card
-*Captured:* 2026-01-14T09:07:26.234Z
+*Source:* https://uikit.developers.rio.cloud/#/components/card
+*Captured:* 2026-02-23T13:42:06.425Z
 
 The Card is a utility component designed to simplify usage of default card styling.
 
@@ -75,4 +75,12 @@ export default () => (
         </div>
     </div>
 </div>
-```
+```
+
+#### Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| shadow | 'subtle' \| 'muted' \| 'accent' \| 'default' \| 'smooth' \| 'muted-down' \| 'default-down' \| 'none' | 'default' | Shadow classes. |
+| padding | 0 \| 5 \| 10 \| 15 \| 20 \| 25 \| 50 | 15 | Card padding. |
+| className | string | — | Additional classes set to the outer element. |

package/dist/docs/components/carousel.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Content
-*Source:* https://uikit.developers.rio.cloud/#components/carousel
-*Captured:* 2026-01-14T09:07:26.721Z
+*Source:* https://uikit.developers.rio.cloud/#/components/carousel
+*Captured:* 2026-02-23T13:42:06.701Z
 
 ## Carousel
 

package/dist/docs/components/chartColors.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Charts
-*Source:* https://uikit.developers.rio.cloud/#components/chartColors
-*Captured:* 2026-01-14T09:08:16.568Z
+*Source:* https://uikit.developers.rio.cloud/#/components/chartColors
+*Captured:* 2026-02-23T13:42:51.126Z
 
 The colors listed below are exposed via the colors.json file and can also be used with other charting libraries to achieve a common look and feel.
 

package/dist/docs/components/chartsGettingStarted.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* Charts
-*Source:* https://uikit.developers.rio.cloud/#components/chartsGettingStarted
-*Captured:* 2026-01-14T09:08:15.330Z
+*Source:* https://uikit.developers.rio.cloud/#/components/chartsGettingStarted
+*Captured:* 2026-02-23T13:42:50.703Z
 
 The UIKIT chart components are simple wrapper components for the Recharts charting library.
 

package/dist/docs/components/chat.md

@@ -2,8 +2,8 @@
 
 *Category:* Components
 *Section:* CSS Only
-*Source:* https://uikit.developers.rio.cloud/#components/chat
-*Captured:* 2026-01-14T09:07:54.061Z
+*Source:* https://uikit.developers.rio.cloud/#/components/chat
+*Captured:* 2026-02-23T13:42:34.737Z
 
 The chat component is a pure CSS component.
 
@@ -524,7 +524,7 @@ export default () => {
 
 ```html
 <div class="display-flex flex-column height-600 position-relative padding-right-5 overflow-hidden">
-    <div class="position-absolute left-0 right-0 justify-content-center display-flex z-index-1" style="opacity: 0; top: -28.0384px; transform: none;">
+    <div class="position-absolute left-0 right-0 justify-content-center display-flex z-index-1" style="opacity: 0; top: -17.759px; transform: none;">
         <div class="rounded-circle bg-primary text-color-white text-center padding-x-10 padding-y-5 cursor-pointer shadow-smooth">Older messages</div>
     </div>
     <div class="scrollbar-fly-in smooth-scrollbar-wrapper" style="position: relative; overflow: hidden; width: 100%; height: 100%;">