@rio-cloud/uikit-mcp 1.1.12 → 1.1.13

package/dist/docs/components/autosuggests.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Selection
 *Source:* https://uikit.developers.rio.cloud/#/components/autosuggests
-*Captured:* 2026-05-06T12:13:33.924Z
+*Captured:* 2026-06-11T10:00:51.788Z
 
 For a more flexible and smart search we highly recommend using fuse.js as searching algorithm.For more information on how to configure it, see: https://fusejs.io
 

package/dist/docs/components/avatar.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#/components/avatar
-*Captured:* 2026-05-06T12:14:18.214Z
+*Captured:* 2026-06-11T10:01:38.834Z
 
 The Avatar is a small component designed to render a users image, the initials of the users name or an icon.
 

package/dist/docs/components/banner.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/banner
-*Captured:* 2026-05-06T12:13:57.256Z
+*Captured:* 2026-06-11T10:01:16.352Z
 
 Convey information or prompt action through in-line banners, ideal for educational content, updates, or announcements.
 
@@ -68,7 +68,7 @@ export default () => {
         <div style="position: relative;">
             <div class="bg-white rounded border shadow-default padding-20 Banner display-flex text-color-darker overflow-hidden position-relative">
                 <div class="flex-1-1 overflow-hidden">
-                    <div style="opacity: 0; transform: translateX(22.4386px);">
+                    <div style="opacity: 0; transform: translateX(21.8488px);">
                         <div class="display-flex align-items-start align-items-center-ls width-100pct gap-15 ">
                             <div class="BannerIcon flex-0 margin-x-5 min-width-25 ">
                                 <svg xmlns="http://www.w3.org/2000/svg" width="80" height="60" viewBox="0 0 773 612" xmlns:xlink="http://www.w3.org/1999/xlink" role="img" artist="Katerina Limpitsouni" source="https://undraw.co/">

package/dist/docs/components/barCharts.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Charts
 *Source:* https://uikit.developers.rio.cloud/#/components/barCharts
-*Captured:* 2026-05-06T12:15:13.810Z
+*Captured:* 2026-06-11T10:02:40.836Z
 
 ## BarChart
 
@@ -117,43 +117,43 @@ const data = [
                                 <g class="recharts-layer">
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="7.8" y="64.0947" width="62" height="158.9053" class="recharts-rectangle" d="M7.8,67.0947A 3,3,0,0,1,10.8,64.0947L 66.8,64.0947A 3,3,0,0,1,
-        69.8,67.0947L 69.8,223L 7.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="7.8" y="57.4098" width="62" height="165.5902" class="recharts-rectangle" d="M7.8,60.4098A 3,3,0,0,1,10.8,57.4098L 66.8,57.4098A 3,3,0,0,1,
+        69.8,60.4098L 69.8,223L 7.8,223Z">
                                             </path>
                                         </g>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="85.8" y="148.3009" width="62" height="74.6991" class="recharts-rectangle" d="M85.8,151.3009A 3,3,0,0,1,88.8,148.3009L 144.8,148.3009A 3,3,0,0,1,
-        147.8,151.3009L 147.8,223L 85.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="85.8" y="145.1585" width="62" height="77.8415" class="recharts-rectangle" d="M85.8,148.1585A 3,3,0,0,1,88.8,145.1585L 144.8,145.1585A 3,3,0,0,1,
+        147.8,148.1585L 147.8,223L 85.8,223Z">
                                             </path>
                                         </g>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="163.8" y="180.8969" width="62" height="42.1031" class="recharts-rectangle" d="M163.8,183.8969A 3,3,0,0,1,166.8,180.8969L 222.8,180.8969A 3,3,0,0,1,
-        225.8,183.8969L 225.8,223L 163.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="163.8" y="179.1257" width="62" height="43.8743" class="recharts-rectangle" d="M163.8,182.1257A 3,3,0,0,1,166.8,179.1257L 222.8,179.1257A 3,3,0,0,1,
+        225.8,182.1257L 225.8,223L 163.8,223Z">
                                             </path>
                                         </g>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="241.8" y="209.8258" width="62" height="13.1742" class="recharts-rectangle" d="M241.8,212.8258A 3,3,0,0,1,244.8,209.8258L 300.8,209.8258A 3,3,0,0,1,
-        303.8,212.8258L 303.8,223L 241.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="241.8" y="209.2716" width="62" height="13.7284" class="recharts-rectangle" d="M241.8,212.2716A 3,3,0,0,1,244.8,209.2716L 300.8,209.2716A 3,3,0,0,1,
+        303.8,212.2716L 303.8,223L 241.8,223Z">
                                             </path>
                                         </g>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="319.8" y="212.0328" width="62" height="10.9672" class="recharts-rectangle" d="M319.8,215.0328A 3,3,0,0,1,322.8,212.0328L 378.8,212.0328A 3,3,0,0,1,
-        381.8,215.0328L 381.8,223L 319.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="319.8" y="211.5714" width="62" height="11.4286" class="recharts-rectangle" d="M319.8,214.5714A 3,3,0,0,1,322.8,211.5714L 378.8,211.5714A 3,3,0,0,1,
+        381.8,214.5714L 381.8,223L 319.8,223Z">
                                             </path>
                                         </g>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
                                         <g class="recharts-layer recharts-inactive-bar">
-                                            <path fill="#30b4c0 " name="undefined" x="397.8" y="207.1434" width="62" height="15.8566" class="recharts-rectangle" d="M397.8,210.1434A 3,3,0,0,1,400.8,207.1434L 456.8,207.1434A 3,3,0,0,1,
-        459.8,210.1434L 459.8,223L 397.8,223Z">
+                                            <path fill="#30b4c0 " name="undefined" x="397.8" y="206.4764" width="62" height="16.5236" class="recharts-rectangle" d="M397.8,209.4764A 3,3,0,0,1,400.8,206.4764L 456.8,206.4764A 3,3,0,0,1,
+        459.8,209.4764L 459.8,223L 397.8,223Z">
                                             </path>
                                         </g>
                                     </g>

package/dist/docs/components/barList.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Progress
 *Source:* https://uikit.developers.rio.cloud/#/components/barList
-*Captured:* 2026-05-06T12:13:45.830Z
+*Captured:* 2026-06-11T10:01:03.803Z
 
 ## BarList
 
@@ -134,21 +134,21 @@ const transportData = [
             <div class="display-flex justify-content-between gap-15">
                 <div class="width-100pct space-y-5">
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 47.0444%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 49.7361%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/on-time-delivery" class="text-color-darker" target="_blank" rel="noreferrer">On-time delivery</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 28.9962%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 31.7867%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Warehouse efficiency</div>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 12.6839%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 15.4802%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/truck-utilization" class="text-color-darker" target="_blank" rel="noreferrer">Truck utilization</a>
@@ -193,21 +193,21 @@ const transportData = [
             <div class="display-flex justify-content-between gap-15 flex-row-reverse gap-10">
                 <div class="width-100pct space-y-5">
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 47.0444%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 49.7361%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/on-time-delivery" class="text-color-darker" target="_blank" rel="noreferrer">On-time delivery</a>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 28.9962%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 31.7867%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <div class="text-color-darker">Warehouse efficiency</div>
                         </div>
                     </div>
                     <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-transparent cursor-pointer">
-                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 12.6839%;">
+                        <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-highlight-light" role="presentation" style="height: 25px; opacity: 0.5; width: 15.4802%;">
                         </div>
                         <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                             <a href="https://example.com/metrics/truck-utilization" class="text-color-darker" target="_blank" rel="noreferrer">Truck utilization</a>
@@ -375,14 +375,14 @@ const transportData = [
                 </div>
             </div>
             <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-lightest cursor-pointer">
-                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 48.7735%;">
+                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 49.0597%;">
                 </div>
                 <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                     <div class="text-color-darker">Stored in warehouse</div>
                 </div>
             </div>
             <div class="position-relative width-100pct rounded-small transition-all transition-ease-in-out transition-duration-01 bg-lightest cursor-pointer">
-                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 93.1069%;">
+                <div class="display-flex align-items-center rounded-small transition-all transition-ease-in-out transition-duration-01 bg-coldplay-moos" role="presentation" style="height: 25px; opacity: 0.5; width: 94.3913%;">
                 </div>
                 <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                     <div class="text-color-darker">Shipped packages</div>

package/dist/docs/components/basicMap.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Map
 *Source:* https://uikit.developers.rio.cloud/#/components/basicMap
-*Captured:* 2026-05-06T12:14:49.921Z
+*Captured:* 2026-06-11T10:02:17.555Z
 
 The following map shows labels for locale de
 

package/dist/docs/components/bottomSheet.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Application
 *Source:* https://uikit.developers.rio.cloud/#/components/bottomSheet
-*Captured:* 2026-05-06T12:13:13.920Z
+*Captured:* 2026-06-11T10:00:28.775Z
 
 The TimedBottomSheet is a wrapper component for the BottomSheet that allows to control it's visibility via timers and to use the localStorage to save user interaction for handling it's visibility.
 

package/dist/docs/components/button.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#/components/button
-*Captured:* 2026-05-06T12:13:19.321Z
+*Captured:* 2026-06-11T10:00:35.857Z
 
 The button component is the React equivalent to the normal HTML button with some To check out the HTML version click here: Buttons
 

package/dist/docs/components/buttonToolbar.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#/components/buttonToolbar
-*Captured:* 2026-05-06T12:13:16.478Z
+*Captured:* 2026-06-11T10:00:30.980Z
 
 The ButtonToolbar is a utility component designed to simplify usage and alignment. Its purpose is to ensure consistent spacing.
 

package/dist/docs/components/calendarStripe.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#/components/calendarStripe
-*Captured:* 2026-05-06T12:14:18.569Z
+*Captured:* 2026-06-11T10:01:39.919Z
 
 A headless component where you provide a function that renders the UI for every day to be displayed.
 
@@ -11,17 +11,17 @@ A headless component where you provide a function that renders the UI for every
 
 ### Example: Example 1
 
-Thursday
-7 May 2026
-
 Friday
-8 May 2026
+12 June 2026
 
 Saturday
-9 May 2026
+13 June 2026
 
 Sunday
-10 May 2026
+14 June 2026
+
+Monday
+15 June 2026
 
 #### React (tsx)
 
@@ -116,8 +116,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">7 May 2026</div>
+                                    <div>Friday</div>
+                                    <div class="text-size-16 text-medium">12 June 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -125,11 +125,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 ">
+                        <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>Friday</div>
-                                    <div class="text-size-16 text-medium">8 May 2026</div>
+                                    <div>Saturday</div>
+                                    <div class="text-size-16 text-medium">13 June 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -140,8 +140,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>Saturday</div>
-                                    <div class="text-size-16 text-medium">9 May 2026</div>
+                                    <div>Sunday</div>
+                                    <div class="text-size-16 text-medium">14 June 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -149,11 +149,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">10 May 2026</div>
+                                    <div>Monday</div>
+                                    <div class="text-size-16 text-medium">15 June 2026</div>
                                 </div>
                                 <div class="text-color-primary text-size-16 width-20">
                                 </div>
@@ -192,28 +192,28 @@ const DayComponent = ({ date, onSelect, selectedDates }: DayComponentProps) => {
 
 ### Example: Example 2
 
-May
-7
+Jun
+12
 2026
 
-May
-8
+Jun
+13
 2026
 
-May
-9
+Jun
+14
 2026
 
-May
-10
+Jun
+15
 2026
 
-May
-11
+Jun
+16
 2026
 
-May
-12
+Jun
+17
 2026
 
 Set to January Toggle Weekends
@@ -339,17 +339,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">May</div>
-                                <div class="text-size-h3 line-height-h3">7</div>
+                                <div class="text-size-12 line-height-12">Jun</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  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">May</div>
-                                <div class="text-size-h3 line-height-h3">8</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">13</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -357,17 +357,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">May</div>
-                                <div class="text-size-h3 line-height-h3">9</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">14</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">May</div>
-                                <div class="text-size-h3 line-height-h3">10</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">15</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -375,8 +375,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">May</div>
-                                <div class="text-size-h3 line-height-h3">11</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">16</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -384,8 +384,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">May</div>
-                                <div class="text-size-h3 line-height-h3">12</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">17</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -393,8 +393,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">May</div>
-                                <div class="text-size-h3 line-height-h3">13</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">18</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -402,17 +402,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">May</div>
-                                <div class="text-size-h3 line-height-h3">14</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">19</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">May</div>
-                                <div class="text-size-h3 line-height-h3">15</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">20</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>
@@ -420,8 +420,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 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">May</div>
-                                <div class="text-size-h3 line-height-h3">16</div>
+                                <div class="text-size-12 line-height-12">Jun</div>
+                                <div class="text-size-h3 line-height-h3">21</div>
                                 <div class="text-size-12 line-height-12">2026</div>
                             </div>
                         </div>

package/dist/docs/components/card.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/card
-*Captured:* 2026-05-06T12:13:55.429Z
+*Captured:* 2026-06-11T10:01:14.321Z
 
 The Card is a utility component designed to simplify usage of default card styling.
 

package/dist/docs/components/carousel.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/carousel
-*Captured:* 2026-05-06T12:13:55.753Z
+*Captured:* 2026-06-11T10:01:14.737Z
 
 ## 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-05-06T12:15:05.088Z
+*Captured:* 2026-06-11T10:02:30.682Z
 
 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-05-06T12:15:04.055Z
+*Captured:* 2026-06-11T10:02:29.227Z
 
 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-05-06T12:14:36.990Z
+*Captured:* 2026-06-11T10:02:01.567Z
 
 The chat component is a pure CSS component.
 
@@ -445,7 +445,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: -41.5391px; transform: none;">
+    <div class="position-absolute left-0 right-0 justify-content-center display-flex z-index-1" style="opacity: 0; top: -9.40452px; 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%;">

package/dist/docs/components/checkbox.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#/components/checkbox
-*Captured:* 2026-05-06T12:13:19.853Z
+*Captured:* 2026-06-11T10:00:35.554Z
 
 ## Checkbox
 

package/dist/docs/components/circularProgress.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Progress
 *Source:* https://uikit.developers.rio.cloud/#/components/circularProgress
-*Captured:* 2026-05-06T12:13:48.111Z
+*Captured:* 2026-06-11T10:01:06.405Z
 
 ## CircularProgress
 
@@ -159,7 +159,7 @@ export default () => (
             <svg width="64" height="64" viewBox="0 0 100 100" style="transform: rotate(-90deg);">
                 <circle cx="50" cy="50" r="46" fill="none" stroke="var(--gray-lighter)" stroke-width="8" class="">
                 </circle>
-                <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-primary)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="232.8580589148538">
+                <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-primary)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="231.52284114105694">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center">30</div>
@@ -177,7 +177,7 @@ export default () => (
             <svg width="80" height="80" viewBox="0 0 100 100" style="transform: rotate(-90deg);">
                 <circle cx="50" cy="50" r="48" fill="none" stroke="var(--gray-lighter)" stroke-width="4" class="">
                 </circle>
-                <circle cx="50" cy="50" r="48" fill="none" stroke="var(--brand-warning)" stroke-width="4" stroke-linecap="round" stroke-dasharray="301.59289474462014" stroke-dashoffset="135.52960628167727">
+                <circle cx="50" cy="50" r="48" fill="none" stroke="var(--brand-warning)" stroke-width="4" stroke-linecap="round" stroke-dasharray="301.59289474462014" stroke-dashoffset="131.58200590697354">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-italic">85 km/h</div>
@@ -189,7 +189,7 @@ export default () => (
             <svg width="64" height="64" viewBox="0 0 100 100" style="transform: rotate(-90deg);">
                 <circle cx="50" cy="50" r="48.5" fill="none" stroke="var(--gray-lighter)" stroke-width="3" class="">
                 </circle>
-                <circle cx="50" cy="50" r="48.5" fill="none" stroke="var(--brand-info)" stroke-width="3" stroke-linecap="round" stroke-dasharray="304.7344873982099" stroke-dashoffset="225.7730218055361">
+                <circle cx="50" cy="50" r="48.5" fill="none" stroke="var(--brand-info)" stroke-width="3" stroke-linecap="round" stroke-dasharray="304.7344873982099" stroke-dashoffset="223.89597652932892">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-size-16 text-medium text-color-dark">40%</div>
@@ -201,7 +201,7 @@ export default () => (
             <svg width="64" height="64" viewBox="0 0 100 100" style="transform: rotate(-90deg);">
                 <circle cx="50" cy="50" r="46" fill="none" stroke="var(--gray-lighter)" stroke-width="8" class="">
                 </circle>
-                <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-primary)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="226.61711833536413">
+                <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-primary)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="225.1335430311454">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-size-">100</div>
@@ -386,14 +386,14 @@ export default () => {
 
 ```html
 <div class="display-flex flex-column align-items-center text-center gap-10 " aria-labelledby="circular-progress-label-:rb:">
-    <div class="" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="10" aria-valuetext="10%" style="width: 64px; height: 64px; position: relative; display: grid; place-items: center;">
+    <div class="" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="20" aria-valuetext="20%" style="width: 64px; height: 64px; position: relative; display: grid; place-items: center;">
         <svg width="64" height="64" viewBox="0 0 100 100" style="transform: rotate(-90deg);">
             <circle cx="50" cy="50" r="46" fill="none" stroke="var(--gray-lighter)" stroke-width="8" class="">
             </circle>
-            <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-info)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="262.4829664181983">
+            <circle cx="50" cy="50" r="46" fill="none" stroke="var(--brand-info)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="261.4361124249253">
             </circle>
         </svg>
-        <div class="position-absolute display-grid place-items-center">10%</div>
+        <div class="position-absolute display-grid place-items-center">20%</div>
     </div>
     <div id="circular-progress-label-:rb:" class="">Processing configuration...</div>
 </div>