@rio-cloud/uikit-mcp 1.1.3 → 1.1.5

package/dist/docs/components/calendarStripe.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#components/calendarStripe
-*Captured:* 2026-01-07T12:11:51.321Z
+*Captured:* 2026-02-03T14:04:58.265Z
 
 A headless component where you provide a function that renders the UI for every day to be displayed.
 
@@ -11,31 +11,19 @@ A headless component where you provide a function that renders the UI for every
 
 ### Example: Example 1
 
-Thursday
-8 January 2026
-
-Friday
-9 January 2026
-
-Saturday
-10 January 2026
-
-Sunday
-11 January 2026
-
-#### Summary
+Wednesday
+4 February 2026
 
 Thursday
-8 January 2026
+5 February 2026
 
-Friday
-9 January 2026
+#### Summary
 
-Saturday
-10 January 2026
+Wednesday
+4 February 2026
 
-Sunday
-11 January 2026
+Thursday
+5 February 2026
 
 #### React (tsx)
 
@@ -130,8 +118,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">8 January 2026</div>
+                                    <div>Wednesday</div>
+                                    <div class="text-size-16 text-medium">4 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -142,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>Friday</div>
-                                    <div class="text-size-16 text-medium">9 January 2026</div>
+                                    <div>Thursday</div>
+                                    <div class="text-size-16 text-medium">5 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -151,11 +139,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">10 January 2026</div>
+                                    <div>Friday</div>
+                                    <div class="text-size-16 text-medium">6 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -166,8 +154,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 bg-lightest">
                             <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">11 January 2026</div>
+                                    <div>Saturday</div>
+                                    <div class="text-size-16 text-medium">7 February 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -191,79 +179,39 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
 
 | 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. |
-| skipWeekends | Boolean | false | Defines whether the days for the weekends are included or not. |
-| startDate | Date | new Date() | The date of the first day that are rendered. |
-| renderDay | Function | — | A function that renders each individual day to be displayed. |
-| onPreviousClick | (newStartDate: Date) => void | — | Callback function for when the previous button is clicked. |
+| 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. |
-| buttonClassName | String | — | Additional classes set to the navigation buttons. |
-| className | String | — | Additional classes set to the calendar element. |
-| daysWrapperClassNames | String | — | Additional classes set to the days wrapper element. |
-| dayWrapperClassNames | String | — | Additional classes set to the day wrapper element. |
+| 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
-8
-2026
-
-Jan
-9
-2026
-
-Jan
-10
+Feb
+4
 2026
 
-Jan
-11
-2026
-
-Jan
-12
-2026
-
-Jan
-13
-2026
-
-Jan
-14
+Feb
+5
 2026
 
 Set to JanuaryToggle Weekends
 
 #### Summary
 
-Jan
-8
-2026
-
-Jan
-9
-2026
-
-Jan
-10
-2026
-
-Jan
-11
-2026
-
-Jan
-12
+Feb
+4
 2026
 
-Jan
-13
-2026
-
-Jan
-14
+Feb
+5
 2026
 
 Set to JanuaryToggle Weekends
@@ -389,8 +337,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">8</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">4</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -398,17 +346,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">9</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">5</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">10</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">6</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -416,17 +364,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 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">11</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">7</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">12</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">8</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -434,8 +382,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">13</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">9</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -443,8 +391,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">14</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">10</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -452,8 +400,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">11</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -461,17 +409,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">16</div>
+                                <div class="text-size-12 line-height-12">Feb</div>
+                                <div class="text-size-h3 line-height-h3">12</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">13</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -495,15 +443,15 @@ const DayContent = ({ date, onSelect, selectedDate }: DayContentProps) => {
 
 | 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. |
-| skipWeekends | Boolean | false | Defines whether the days for the weekends are included or not. |
-| startDate | Date | new Date() | The date of the first day that are rendered. |
-| renderDay | Function | — | A function that renders each individual day to be displayed. |
-| onPreviousClick | (newStartDate: Date) => void | — | Callback function for when the previous button is clicked. |
+| 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. |
-| buttonClassName | String | — | Additional classes set to the navigation buttons. |
-| className | String | — | Additional classes set to the calendar element. |
-| daysWrapperClassNames | String | — | Additional classes set to the days wrapper element. |
-| dayWrapperClassNames | String | — | Additional classes set to the day wrapper element. |
+| 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

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#components/card
-*Captured:* 2026-01-07T12:11:36.445Z
+*Captured:* 2026-02-03T14:04:40.639Z
 
 The Card is a utility component designed to simplify usage of default card styling.
 
@@ -81,6 +81,6 @@ export default () => (
 
 | Name | Type | Default | Description |
 | --- | --- | --- | --- |
-| shadow | 'subtle' \| 'muted' \| 'accent' \| 'default' \| 'smooth' \| 'muted-down' \| 'default-down' \| 'none' | default | The shadow class. |
-| shadow | 0 \| 5 \| 10 \| 15 \| 20 \| 25 \| 50 | 15 | The card padding. |
-| className | string | — | Additional classes to be set on the wrapper element. |
+| 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

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#components/carousel
-*Captured:* 2026-01-07T12:11:36.276Z
+*Captured:* 2026-02-03T14:04:40.733Z
 
 ## Carousel
 

package/dist/docs/components/chartColors.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Charts
 *Source:* https://uikit.developers.rio.cloud/#components/chartColors
-*Captured:* 2026-01-07T12:12:18.159Z
+*Captured:* 2026-02-03T14:05:27.467Z
 
 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

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Charts
 *Source:* https://uikit.developers.rio.cloud/#components/chartsGettingStarted
-*Captured:* 2026-01-07T12:12:17.725Z
+*Captured:* 2026-02-03T14:05:26.195Z
 
 The UIKIT chart components are simple wrapper components for the Recharts charting library.
 

package/dist/docs/components/chat.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* CSS Only
 *Source:* https://uikit.developers.rio.cloud/#components/chat
-*Captured:* 2026-01-07T12:12:02.426Z
+*Captured:* 2026-02-03T14:05:10.351Z
 
 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: -6.23436px; transform: none;">
+    <div class="position-absolute left-0 right-0 justify-content-center display-flex z-index-1" style="opacity: 0; top: -41.5391px; 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%;">