@rio-cloud/uikit-mcp 1.1.6 → 1.1.7

package/dist/docs/components/autosuggests.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Selection
 *Source:* https://uikit.developers.rio.cloud/#/components/autosuggests
-*Captured:* 2026-02-23T13:41:52.196Z
+*Captured:* 2026-02-23T15:48:25.008Z
 
 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-02-23T13:42:21.816Z
+*Captured:* 2026-02-23T15:48:54.436Z
 
 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-02-23T13:42:08.529Z
+*Captured:* 2026-02-23T15:48:40.842Z
 
 Convey information or prompt action through in-line banners, ideal for educational content, updates, or announcements.
 
@@ -76,7 +76,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(21.9553px);">
+                    <div style="opacity: 0; transform: translateX(21.1133px);">
                         <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-02-23T13:43:00.102Z
+*Captured:* 2026-02-23T15:49:31.355Z
 
 ## BarChart
 
@@ -124,33 +124,33 @@ const data = [
                             <g class="recharts-layer recharts-bar-rectangles">
                                 <g class="recharts-layer">
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="7.8" y="50.6704" width="62" height="172.3296" class="recharts-rectangle" d="M7.8,53.6704A 3,3,0,0,1,10.8,50.6704L 66.8,50.6704A 3,3,0,0,1,
-        69.8,53.6704L 69.8,223L 7.8,223Z">
+                                        <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>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="85.8" y="141.9904" width="62" height="81.0096" class="recharts-rectangle" d="M85.8,144.9904A 3,3,0,0,1,88.8,141.9904L 144.8,141.9904A 3,3,0,0,1,
-        147.8,144.9904L 147.8,223L 85.8,223Z">
+                                        <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>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="163.8" y="177.34" width="62" height="45.66" class="recharts-rectangle" d="M163.8,180.34A 3,3,0,0,1,166.8,177.34L 222.8,177.34A 3,3,0,0,1,
-        225.8,180.34L 225.8,223L 163.8,223Z">
+                                        <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>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="241.8" y="208.7128" width="62" height="14.2872" class="recharts-rectangle" d="M241.8,211.7128A 3,3,0,0,1,244.8,208.7128L 300.8,208.7128A 3,3,0,0,1,
-        303.8,211.7128L 303.8,223L 241.8,223Z">
+                                        <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>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="319.8" y="211.1063" width="62" height="11.8937" class="recharts-rectangle" d="M319.8,214.1063A 3,3,0,0,1,322.8,211.1063L 378.8,211.1063A 3,3,0,0,1,
-        381.8,214.1063L 381.8,223L 319.8,223Z">
+                                        <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>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill="#30b4c0 " name="undefined" x="397.8" y="205.8039" width="62" height="17.1961" class="recharts-rectangle" d="M397.8,208.8039A 3,3,0,0,1,400.8,205.8039L 456.8,205.8039A 3,3,0,0,1,
-        459.8,208.8039L 459.8,223L 397.8,223Z">
+                                        <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>
                                     </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-02-23T13:42:01.308Z
+*Captured:* 2026-02-23T15:48:33.879Z
 
 ## BarList
 
@@ -180,21 +180,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.3138%;">
+                        <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.7179%;">
                         </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: 29.2907%;">
+                        <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: 29.763%;">
                         </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.9896%;">
+                        <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: 13.4309%;">
                         </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>
@@ -239,21 +239,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.3138%;">
+                        <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.7179%;">
                         </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: 29.2907%;">
+                        <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: 29.763%;">
                         </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.9896%;">
+                        <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: 13.4309%;">
                         </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>
@@ -436,21 +436,21 @@ 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: 14.1176%;">
+                <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: 14.1165%;">
                 </div>
                 <div class="position-absolute left-0 top-50pct translate-y-50pct display-flex width-100pct padding-left-10">
                     <div class="text-color-darker">In transit</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: 48.3163%;">
+                <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.006%;">
                 </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: 91.3224%;">
+                <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: 90.2066%;">
                 </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-02-23T13:42:45.274Z
+*Captured:* 2026-02-23T15:49:18.105Z
 
 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-02-23T13:41:33.424Z
+*Captured:* 2026-02-23T15:48:06.792Z
 
 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-02-23T13:41:39.366Z
+*Captured:* 2026-02-23T15:48:12.234Z
 
 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-02-23T13:41:35.820Z
+*Captured:* 2026-02-23T15:48:09.017Z
 
 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-02-23T13:42:23.211Z
+*Captured:* 2026-02-23T15:48:55.964Z
 
 A headless component where you provide a function that renders the UI for every day to be displayed.
 
@@ -238,10 +238,6 @@ Mar
 3
 2026
 
-Mar
-4
-2026
-
 Set to JanuaryToggle Weekends
 
 #### Summary
@@ -278,10 +274,6 @@ Mar
 3
 2026
 
-Mar
-4
-2026
-
 Set to JanuaryToggle Weekends
 
 #### React (tsx)

package/dist/docs/components/card.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/card
-*Captured:* 2026-02-23T13:42:06.425Z
+*Captured:* 2026-02-23T15:48:39.000Z
 
 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-02-23T13:42:06.701Z
+*Captured:* 2026-02-23T15:48:39.431Z
 
 ## 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-02-23T13:42:51.126Z
+*Captured:* 2026-02-23T15:49:22.307Z
 
 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-02-23T13:42:50.703Z
+*Captured:* 2026-02-23T15:49:21.575Z
 
 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-02-23T13:42:34.737Z
+*Captured:* 2026-02-23T15:49:07.118Z
 
 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: -17.759px; transform: none;">
+    <div class="position-absolute left-0 right-0 justify-content-center display-flex z-index-1" style="opacity: 0; top: -18.122px; 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-02-23T13:41:39.429Z
+*Captured:* 2026-02-23T15:48:12.631Z
 
 ## 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-02-23T13:42:02.752Z
+*Captured:* 2026-02-23T15:48:35.588Z
 
 ## CircularProgress
 
@@ -194,7 +194,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="233.9594855253046">
+                <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="234.63622785786367">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center">30</div>
@@ -212,7 +212,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="138.78599799953176">
+                <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="140.7868014175326">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-italic">85 km/h</div>
@@ -224,7 +224,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="227.32140414196692">
+                <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="228.2727665515065">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-size-16 text-medium text-color-dark">40%</div>
@@ -236,7 +236,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="227.84092568030945">
+                <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="228.5928616053751">
                 </circle>
             </svg>
             <div class="position-absolute display-grid place-items-center text-size-">100</div>
@@ -431,7 +431,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-info)" stroke-width="8" stroke-linecap="round" stroke-dasharray="289.02652413026095" stroke-dashoffset="262.6697810682584">
+            <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.81864116510957">
             </circle>
         </svg>
         <div class="position-absolute display-grid place-items-center">10%</div>

package/dist/docs/components/clearableInput.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Interaction
 *Source:* https://uikit.developers.rio.cloud/#/components/clearableInput
-*Captured:* 2026-02-23T13:41:39.507Z
+*Captured:* 2026-02-23T15:48:12.673Z
 
 Control, which can be cleared when it has a value.
 

package/dist/docs/components/collapse.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Show/Hide
 *Source:* https://uikit.developers.rio.cloud/#/components/collapse
-*Captured:* 2026-02-23T13:41:47.833Z
+*Captured:* 2026-02-23T15:48:20.836Z
 
 The Collapse component folds and unfolds given content. It is used in some other components such as the ExpanderPanel and ExpanderList.
 
@@ -83,7 +83,7 @@ export default () => {
                     <div class="margin-bottom-15">
                         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. Vivamus elementum ante et est sagittis semper. 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.</div>
                     <div class="dropdown btn-group">
-                        <button type="button" id="lflcmubcoz" class="btn btn-default btn-md btn-component dropdown-toggle" tabindex="0">Dropdown<span class="caret">
+                        <button type="button" id="iis5wu4ett8" class="btn btn-default btn-md btn-component dropdown-toggle" tabindex="0">Dropdown<span class="caret">
                             </span>
                         </button>
                     </div>

package/dist/docs/components/composedCharts.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Charts
 *Source:* https://uikit.developers.rio.cloud/#/components/composedCharts
-*Captured:* 2026-02-23T13:42:52.700Z
+*Captured:* 2026-02-23T15:49:24.050Z
 
 ## ComposedChart
 
@@ -240,7 +240,7 @@ const data: CustomData[] = [
                             <g class="recharts-layer">
                                 <defs>
                                     <clipPath id="animationClipPath-recharts-area-:r0:">
-                                        <rect x="70.41927083333333" y="0" width="68.61751380163733" height="124">
+                                        <rect x="70.41927083333333" y="0" width="59.200122759862595" height="124">
                                         </rect>
                                     </clipPath>
                                 </defs>
@@ -262,33 +262,33 @@ const data: CustomData[] = [
                             <g class="recharts-layer recharts-bar-rectangles">
                                 <g class="recharts-layer">
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page A" x="50.0839" y="77.6712" width="40" height="45.3288" class="recharts-rectangle" d="M50.0839,80.6712A 3,3,0,0,1,53.0839,77.6712L 87.0839,77.6712A 3,3,0,0,1,
-        90.0839,80.6712L 90.0839,123L 50.0839,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page A" x="50.0839" y="79.1422" width="40" height="43.8578" class="recharts-rectangle" d="M50.0839,82.1422A 3,3,0,0,1,53.0839,79.1422L 87.0839,79.1422A 3,3,0,0,1,
+        90.0839,82.1422L 90.0839,123L 50.0839,123Z">
                                         </path>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page B" x="100.9224" y="68.2088" width="40" height="54.7912" class="recharts-rectangle" d="M100.9224,71.2088A 3,3,0,0,1,103.9224,68.2088L 137.9224,68.2088A 3,3,0,0,1,
-        140.9224,71.2088L 140.9224,123L 100.9224,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page B" x="100.9224" y="69.9869" width="40" height="53.0131" class="recharts-rectangle" d="M100.9224,72.9869A 3,3,0,0,1,103.9224,69.9869L 137.9224,69.9869A 3,3,0,0,1,
+        140.9224,72.9869L 140.9224,123L 100.9224,123Z">
                                         </path>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page C" x="151.7609" y="60.7862" width="40" height="62.2138" class="recharts-rectangle" d="M151.7609,63.7862A 3,3,0,0,1,154.7609,60.7862L 188.7609,60.7862A 3,3,0,0,1,
-        191.7609,63.7862L 191.7609,123L 151.7609,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page C" x="151.7609" y="62.8052" width="40" height="60.1948" class="recharts-rectangle" d="M151.7609,65.8052A 3,3,0,0,1,154.7609,62.8052L 188.7609,62.8052A 3,3,0,0,1,
+        191.7609,65.8052L 191.7609,123L 151.7609,123Z">
                                         </path>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page D" x="202.5995" y="55.0068" width="40" height="67.9932" class="recharts-rectangle" d="M202.5995,58.0068A 3,3,0,0,1,205.5995,55.0068L 239.5995,55.0068A 3,3,0,0,1,
-        242.5995,58.0068L 242.5995,123L 202.5995,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page D" x="202.5995" y="57.2133" width="40" height="65.7867" class="recharts-rectangle" d="M202.5995,60.2133A 3,3,0,0,1,205.5995,57.2133L 239.5995,57.2133A 3,3,0,0,1,
+        242.5995,60.2133L 242.5995,123L 202.5995,123Z">
                                         </path>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page E" x="253.438" y="60.2196" width="40" height="62.7804" class="recharts-rectangle" d="M253.438,63.2196A 3,3,0,0,1,256.438,60.2196L 290.438,60.2196A 3,3,0,0,1,
-        293.438,63.2196L 293.438,123L 253.438,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page E" x="253.438" y="62.2569" width="40" height="60.7431" class="recharts-rectangle" d="M253.438,65.2569A 3,3,0,0,1,256.438,62.2569L 290.438,62.2569A 3,3,0,0,1,
+        293.438,65.2569L 293.438,123L 253.438,123Z">
                                         </path>
                                     </g>
                                     <g class="recharts-layer recharts-bar-rectangle">
-                                        <path fill-opacity="1" fill="#8e96eb " name="Page F" x="304.2766" y="84.4705" width="40" height="38.5295" class="recharts-rectangle" d="M304.2766,87.4705A 3,3,0,0,1,307.2766,84.4705L 341.2766,84.4705A 3,3,0,0,1,
-        344.2766,87.4705L 344.2766,123L 304.2766,123Z">
+                                        <path fill-opacity="1" fill="#8e96eb " name="Page F" x="304.2766" y="85.7209" width="40" height="37.2791" class="recharts-rectangle" d="M304.2766,88.7209A 3,3,0,0,1,307.2766,85.7209L 341.2766,85.7209A 3,3,0,0,1,
+        344.2766,88.7209L 344.2766,123L 304.2766,123Z">
                                         </path>
                                     </g>
                                 </g>
@@ -297,7 +297,7 @@ const data: CustomData[] = [
                     </g>
                     <g tabindex="-1">
                         <g class="recharts-layer recharts-line">
-                            <path stroke-width="1" stroke="#30b4c0 " fill="none" id="recharts-line-:r2:" height="108" width="365.03125" class="recharts-curve recharts-line-curve" stroke-dasharray="72.1802px 195.2105775878906px" d="M70.419,87.6C87.365,83.295,104.312,78.99,121.258,70.92C138.204,62.85,155.15,42.5,172.096,39.18C189.043,35.86,205.989,35.43,222.935,34.2C239.881,32.97,256.827,31.8,273.773,31.8C290.72,31.8,307.666,35.4,324.612,39">
+                            <path stroke-width="1" stroke="#30b4c0 " fill="none" id="recharts-line-:r2:" height="108" width="365.03125" class="recharts-curve recharts-line-curve" stroke-dasharray="62.2739px 205.11687758789063px" d="M70.419,87.6C87.365,83.295,104.312,78.99,121.258,70.92C138.204,62.85,155.15,42.5,172.096,39.18C189.043,35.86,205.989,35.43,222.935,34.2C239.881,32.97,256.827,31.8,273.773,31.8C290.72,31.8,307.666,35.4,324.612,39">
                             </path>
                         </g>
                     </g>

package/dist/docs/components/contentLoader.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/contentLoader
-*Captured:* 2026-02-23T13:42:08.801Z
+*Captured:* 2026-02-23T15:48:41.563Z
 
 The content loader is based on the react-content-loader which can be found here: https://github.com/danilowoz/react-content-loader
 

package/dist/docs/components/dataTabs.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/dataTabs
-*Captured:* 2026-02-23T13:42:10.916Z
+*Captured:* 2026-02-23T15:48:43.554Z
 
 Passing a single tab content component via commonTabContent prop into the DataTabs component allows to update that single component when switching tabs. This comes in handy for instance when you want to animate a graph with different values from each tab.
 
@@ -875,7 +875,7 @@ export const RouteType = () => (
                                                     </g>
                                                     <g tabindex="-1">
                                                         <g class="recharts-layer recharts-line">
-                                                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r8:" height="140" width="470" class="recharts-curve recharts-line-curve" stroke-dasharray="437.70855712890625px 0px" d="M45,60.5C67.778,57.75,90.556,55,113.333,55C136.111,55,158.889,60.5,181.667,60.5C204.444,60.5,227.222,16,250,16C272.778,16,295.556,51.333,318.333,55C341.111,58.667,363.889,60.5,386.667,60.5C409.444,60.5,432.222,57.75,455,55">
+                                                            <path stroke="#67abc5 " fill="none" stroke-width="1" id="recharts-line-:r8:" height="140" width="470" class="recharts-curve recharts-line-curve" stroke-dasharray="460.2367858886719px 0px" d="M45,33.375C67.778,48.833,90.556,64.292,113.333,67.5C136.111,70.708,158.889,72.313,181.667,72.313C204.444,72.313,227.222,72.313,250,72.313C272.778,72.313,295.556,33.375,318.333,33.375C341.111,33.375,363.889,67.5,386.667,67.5C409.444,67.5,432.222,41.25,455,15">
                                                             </path>
                                                         </g>
                                                     </g>
@@ -919,19 +919,19 @@ export const RouteType = () => (
                                                     </g>
                                                     <g tabindex="-1">
                                                         <g class="recharts-layer recharts-line-dots">
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="45" cy="60.49999999999999" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="45" cy="33.375" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="113.33333333333333" cy="55" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="113.33333333333333" cy="67.5" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="181.66666666666666" cy="60.49999999999999" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="181.66666666666666" cy="72.3125" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="250" cy="15.999999999999996" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="250" cy="72.3125" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="318.3333333333333" cy="55" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="318.3333333333333" cy="33.375" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="386.66666666666663" cy="60.49999999999999" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="386.66666666666663" cy="67.5" class="recharts-dot recharts-line-dot">
                                                             </circle>
-                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="455" cy="55" class="recharts-dot recharts-line-dot">
+                                                            <circle r="3" stroke="#67abc5 " fill="#fff" stroke-width="1" height="140" width="470" cx="455" cy="15" class="recharts-dot recharts-line-dot">
                                                             </circle>
                                                         </g>
                                                     </g>

package/dist/docs/components/datepickers.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Pickers
 *Source:* https://uikit.developers.rio.cloud/#/components/datepickers
-*Captured:* 2026-02-23T13:42:01.245Z
+*Captured:* 2026-02-23T15:48:33.907Z
 
 A wrapper component for react-datetime. It has a Moment.js peer dependency, which means it needs to add to your list of dependencies to work correctly.
 
@@ -143,7 +143,7 @@ SuMoTuWeThFrSa
 22232425262728
 1234567
 
-02:41
+04:48
 
 This is an error message
 
@@ -323,7 +323,7 @@ SuMoTuWeThFrSa
 22232425262728
 1234567
 
-02:41
+04:48
 
 This is an error message
 
@@ -1372,7 +1372,7 @@ export default () => (
                             </span>
                         </span>
                         <div class="ClearableInput input-group">
-                            <input type="text" class="form-control" id="rdp-error-2" placeholder="Select Date" value="2026-02-23 02:41">
+                            <input type="text" class="form-control" id="rdp-error-2" placeholder="Select Date" value="2026-02-23 04:48">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
@@ -1460,7 +1460,7 @@ export default () => (
                                 </tbody>
                                 <tfoot>
                                     <tr>
-                                        <td colspan="7" class="rdtTimeToggle">02:41</td>
+                                        <td colspan="7" class="rdtTimeToggle">04:48</td>
                                     </tr>
                                 </tfoot>
                             </table>