@rio-cloud/uikit-mcp 1.1.10 → 1.1.11

package/dist/docs/components/dayPicker.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Pickers
 *Source:* https://uikit.developers.rio.cloud/#/components/dayPicker
-*Captured:* 2026-04-20T12:54:25.419Z
+*Captured:* 2026-04-27T14:57:59.725Z
 
 DayPicker is the composable input and dropdown wrapper that should replace the legacy DatePicker. It keeps the UIKIT API small while still allowing presets, footer actions, and additional controls to be injected from the outside.
 
@@ -13,6 +13,8 @@ Use this component for form fields, filters, and composed dropdown workflows. Th
 
 ## Single day picker
 
+The default entry point wraps an input and dropdown around the calendar for the common single-date case.
+
 ### Example: Example 1
 
 Single day picker
@@ -190,6 +192,8 @@ export default DayPickerInputExample;
 
 ## Single day with dateFormat
 
+Use dateFormat when you want a migration-friendly custom input format similar to the legacyDatePicker.
+
 ### Example: Example 2
 
 Single day with custom format
@@ -367,6 +371,8 @@ export default DayPickerDateFormatExample;
 
 ## Localization
 
+Switch the locale to see how the default input formatting changes between localized date conventions.
+
 ### Example: Example 3
 
 Localized input formatting en-GB bg-BG
@@ -742,6 +748,8 @@ export default DayPickerLocalizationExample;
 
 ## Custom triggers
 
+The dropdown does not depend on an editable input. You can swap in custom triggers like icon buttons or compact labels for places with limited space.
+
 ### Example: Example 4
 
 Icon button trigger
@@ -970,6 +978,8 @@ export default DayPickerCustomTriggerExample;
 
 ## Range picker
 
+Range mode keeps the same input shell but changes the calendar selection behavior and the rendered value. It can also show two visible months for faster range selection.
+
 ### Example: Example 5
 
 Range picker
@@ -1162,6 +1172,8 @@ export default DayPickerRangeInputExample;
 
 ## Week selection
 
+Set selectionVariant='week' to select the whole week of the clicked day while keeping the same range value shape.
+
 ### Example: Weeks start on Monday. You can click a day or the calendar week number.
 
 Week selection
@@ -1360,6 +1372,8 @@ export default DayPickerWeekSelectionExample;
 
 ## Month selection
 
+Set selectionVariant='month' to select the whole month of the clicked day as one range.
+
 ### Example: Example 7
 
 Month selection
@@ -1567,6 +1581,8 @@ export default DayPickerMonthSelectionExample;
 
 ## Rolling range
 
+Set selectionVariant='rolling' with rollingDays to create a fixed-length range starting from the clicked day.
+
 ### Example: Example 8
 
 Rolling 7-day window
@@ -1759,6 +1775,8 @@ export default DayPickerRollingSelectionExample;
 
 ## Footer actions
 
+Footer actions can also select values directly, for example a Today button for single-date workflows.
+
 ### Example: Example 9
 
 Single date with Today action
@@ -1954,6 +1972,8 @@ export default DayPickerTodayFooterExample;
 
 ## Range picker with presets and footer actions
 
+Sidebar presets and footer controls are passed in from the outside. The picker keeps draft state internally, but the surrounding UI remains fully composable.
+
 ### Example: Example 10
 
 Range with presets and footer actions
@@ -2206,6 +2226,8 @@ export default DayPickerControlledRangeInputExample;
 
 ## Presets with external select
 
+The same preset ranges can be offered both inside the dropdown and through a separate Select outside the picker.
+
 ### Example: Example 11
 
 Range picker with synced presets Last 14 days Today
@@ -2415,7 +2437,7 @@ export default DayPickerPresetSelectExample;
                     </span>
                     <div class="form-control-feedback-wrapper flex-1-1">
                         <div class="ClearableInput input-group">
-                            <input placeholder="Please select a range" id="day-picker-preset-range" class="form-control bg-white cursor-pointer withClearButton" autocomplete="off" type="text" readonly="" tabindex="0" value="07/04/2026 - 20/04/2026">
+                            <input placeholder="Please select a range" id="day-picker-preset-range" class="form-control bg-white cursor-pointer withClearButton" autocomplete="off" type="text" readonly="" tabindex="0" value="14/04/2026 - 27/04/2026">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
@@ -2539,6 +2561,8 @@ export default DayPickerPresetSelectExample;
 
 ## Date and time footer
 
+The footer slot can host a TimePicker while renderValue shows the combined date and time in the trigger. The examples use the existing 24-hour TimePicker; AM/PM is currently not part of the default UIKIT time input.
+
 ### Example: Example 12
 
 Date and time
@@ -2752,6 +2776,8 @@ export default DayPickerTimeFooterExample;
 
 ## Range with start and end times
 
+For range selection, the footer can render two independent TimePicker controls for start and end times while the trigger displays the final combined value. The examples use the existing 24-hour TimePicker; AM/PM is currently not part of the default UIKIT time input.
+
 ### Example: Example 13
 
 Range with start and end times
@@ -3015,6 +3041,8 @@ export default DayPickerRangeTimeFooterExample;
 
 ## Available times in a sidebar
 
+Instead of a free-form time input, the dropdown can also render a curated list of available time slots in a sidebar.
+
 ### Example: Example 14
 
 Date with available times
@@ -3239,6 +3267,8 @@ export default DayPickerAvailableTimesSidebarExample;
 
 ## Multiple dates
 
+The same dropdown shell also supports multiple independent dates and renders the current selection as a compact list in the input.
+
 ### Example: Example 15
 
 Multiple dates
@@ -3420,6 +3450,8 @@ export default DayPickerMultipleInputExample;
 
 ## Calendar weeks
 
+If you need ISO calendar weeks in the dropdown, enable showWeekNumber. The input still keeps the regular date display.
+
 ### Example: Example 16
 
 Calendar weeks in dropdown
@@ -3598,6 +3630,8 @@ export default DayPickerCalendarWeekDropdownExample;
 
 ## Restricted month range
 
+Use startMonth and endMonth to limit the dropdown to a fixed month interval. This example only allows choosing from two visible months.
+
 ### Example: Example 17
 
 Limited to two months
@@ -3782,6 +3816,8 @@ export default DayPickerLimitedMonthRangeExample;
 
 ## Disabled days
 
+Use disabledDays to block individual dates from being selected while keeping the normal input behavior.
+
 ### Example: Disabled: 10/04/2026, 14/04/2026, 22/04/2026
 
 Disabled days
@@ -3968,6 +4004,8 @@ export default DayPickerDisabledDaysDropdownExample;
 
 ## Hidden days
 
+Use hiddenDays to remove matching dates from the dropdown calendar grid entirely.
+
 ### Example: Hidden: 10/05/2026, 11/05/2026, 20/05/2026
 
 Hidden days in a month
@@ -4155,6 +4193,8 @@ export default DayPickerHiddenDaysDropdownExample;
 
 ## Filter icon for date ranges
 
+Use iconName on the default trigger to turn a range picker into a filter control. This example switches from rioglyph-filter to rioglyph-filter-active once a complete range is selected.
+
 ### Example: Example 20
 
 Date range filter
@@ -4337,6 +4377,8 @@ export default DayPickerRangeFilterIconExample;
 
 ## ISO date format
 
+A common integration pattern is to keep the value as a date-only ISO string like 2026-05-10 and only map it to Date for the picker UI.
+
 ### Example: The demo keeps the value as a date-only ISO string and only maps it to Date for the picker.
 
 ISO date format
@@ -4552,6 +4594,8 @@ export default DayPickerIsoFormatExample;
 
 ## Timezones and UTC payloads
 
+Additional form elements like timezone selectors can be rendered into the dropdown from the outside. This example combines a date, time, and timezone and shows the resulting full UTC datetime string.
+
 ### Example: Example 22
 
 Date, time and timezone
@@ -4869,6 +4913,8 @@ export default DayPickerTimeZoneExample;
 
 ## Validation and error states
 
+DayPicker includes the common feedback markup directly via errorMessage and warningMessage. For custom validation flows, especially manual input parsing, use onInputChange to drive the messages from outside.
+
 ### Example: Example 23
 
 Static error styling with built-in feedback props This is an error message
@@ -5147,6 +5193,8 @@ export default DayPickerValidationExample;
 
 ## React Hook Form
 
+The component works well with Controller by passing through name and onBlur while using the built-in feedback props for form errors.
+
 ### Example: Example 24
 
 Delivery date
@@ -5386,6 +5434,8 @@ export default DayPickerReactHookFormExample;
 
 ## Custom renderValue and parseInput
 
+For specialized cases, you can override both how the value is shown in the input and how manual input gets parsed, without exposing the full third-party picker API.
+
 ### Example: Example 25
 
 Custom parsing and rendering

package/dist/docs/components/dayPickerCalendar.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Pickers
 *Source:* https://uikit.developers.rio.cloud/#/components/dayPickerCalendar
-*Captured:* 2026-04-20T12:54:15.839Z
+*Captured:* 2026-04-27T14:57:50.733Z
 
 DayPickerCalendar is the lower-level calendar wrapper without input or dropdown. Use it when you only need calendar selection or when you want to build your own shell around it.
 
@@ -13,6 +13,8 @@ It keeps the public API small while still supporting custom selection variants,
 
 ## Single selection
 
+The calendar wrapper exposes the supported selection modes without coupling consumers to the rawreact-day-picker component API.
+
 ### Example: Single date
 
 Single date
@@ -292,8 +294,8 @@ export default DayPickerCalendarSingleSelectionExample;
                             </td>
                         </tr>
                         <tr class="rdp-week">
-                            <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-20" data-today="true">
-                                <button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Monday, 20 April 2026">20</button>
+                            <td class="rdp-day" role="gridcell" data-day="2026-04-20">
+                                <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 20 April 2026">20</button>
                             </td>
                             <td class="rdp-day" role="gridcell" data-day="2026-04-21">
                                 <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 21 April 2026">21</button>
@@ -315,8 +317,8 @@ export default DayPickerCalendarSingleSelectionExample;
                             </td>
                         </tr>
                         <tr class="rdp-week">
-                            <td class="rdp-day" role="gridcell" data-day="2026-04-27">
-                                <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
+                            <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-27" data-today="true">
+                                <button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Monday, 27 April 2026">27</button>
                             </td>
                             <td class="rdp-day" role="gridcell" data-day="2026-04-28">
                                 <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
@@ -433,6 +435,8 @@ export default DayPickerCalendarSingleSelectionExample;
 
 ## Calendar sizes
 
+Use size to adjust the density of the day grid. The size variant changes the spacing and dimensions of the day cells themselves.
+
 ### Example: Small
 
 Small
@@ -779,8 +783,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-20" data-today="true">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 20 April 2026">20</button>
+                                <td class="rdp-day" role="gridcell" data-day="2026-04-20">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 20 April 2026">20</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-21">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 21 April 2026">21</button>
@@ -802,8 +806,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day" role="gridcell" data-day="2026-04-27">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
+                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-27" data-today="true">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 27 April 2026">27</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-28">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
@@ -1089,8 +1093,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-20" data-today="true">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 20 April 2026">20</button>
+                                <td class="rdp-day" role="gridcell" data-day="2026-04-20">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 20 April 2026">20</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-21">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 21 April 2026">21</button>
@@ -1112,8 +1116,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day" role="gridcell" data-day="2026-04-27">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
+                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-27" data-today="true">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 27 April 2026">27</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-28">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
@@ -1399,8 +1403,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-20" data-today="true">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 20 April 2026">20</button>
+                                <td class="rdp-day" role="gridcell" data-day="2026-04-20">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 20 April 2026">20</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-21">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 21 April 2026">21</button>
@@ -1422,8 +1426,8 @@ export default DayPickerCalendarSizesExample;
                                 </td>
                             </tr>
                             <tr class="rdp-week">
-                                <td class="rdp-day" role="gridcell" data-day="2026-04-27">
-                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
+                                <td class="rdp-day rdp-today" role="gridcell" data-day="2026-04-27" data-today="true">
+                                    <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Today, Monday, 27 April 2026">27</button>
                                 </td>
                                 <td class="rdp-day" role="gridcell" data-day="2026-04-28">
                                     <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
@@ -1538,6 +1542,8 @@ export default DayPickerCalendarSizesExample;
 
 ## Range selection
 
+Range mode keeps a two-step selection flow, can show two months at once, and can optionally be constrained to a specific month interval.
+
 ### Example: Date ranges
 
 Date ranges
@@ -2072,6 +2078,8 @@ export default DayPickerRangeSelectionExample;
 
 ## Calendar in a dialog
 
+The calendar wrapper also works well inside larger dialog layouts, where the selection is combined with additional form controls and only committed on apply.
+
 ### Example: Example 4
 
 Open event calendar dialog Scheduled delivery slot: 15.04.2026 09:00 - 21.04.2026 09:00
@@ -2513,6 +2521,8 @@ export default DayPickerCalendarDialogExample;
 
 ## Multiple selection
 
+Multiple mode is useful for scenarios like booking, planning, or marking several independent dates.
+
 ### Example: Multiple dates
 
 Multiple dates
@@ -2525,7 +2535,7 @@ January February March April May June July August September October November Dec
 27 28 29 30 1 2 3
 4 5 6 7 8 9 10
 
-You picked: 20/04/2026
+You picked: 27/04/2026
 
 #### React (tsx)
 
@@ -2796,8 +2806,8 @@ export default DayPickerMultipleSelectionExample;
                             </td>
                         </tr>
                         <tr class="rdp-week">
-                            <td class="rdp-day rdp-today rdp-selected" role="gridcell" aria-selected="true" data-day="2026-04-20" data-selected="true" data-today="true">
-                                <button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Monday, 20 April 2026, selected">20</button>
+                            <td class="rdp-day" role="gridcell" data-day="2026-04-20">
+                                <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 20 April 2026">20</button>
                             </td>
                             <td class="rdp-day" role="gridcell" data-day="2026-04-21">
                                 <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 21 April 2026">21</button>
@@ -2819,8 +2829,8 @@ export default DayPickerMultipleSelectionExample;
                             </td>
                         </tr>
                         <tr class="rdp-week">
-                            <td class="rdp-day" role="gridcell" data-day="2026-04-27">
-                                <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Monday, 27 April 2026">27</button>
+                            <td class="rdp-day rdp-today rdp-selected" role="gridcell" aria-selected="true" data-day="2026-04-27" data-selected="true" data-today="true">
+                                <button class="rdp-day_button" type="button" tabindex="0" aria-label="Today, Monday, 27 April 2026, selected">27</button>
                             </td>
                             <td class="rdp-day" role="gridcell" data-day="2026-04-28">
                                 <button class="rdp-day_button" type="button" tabindex="-1" aria-label="Tuesday, 28 April 2026">28</button>
@@ -2874,7 +2884,7 @@ export default DayPickerMultipleSelectionExample;
         </div>
     </div>
     <div class="padding-top-15">
-        <b>You picked:</b> 20/04/2026
+        <b>You picked:</b> 27/04/2026
     </div>
 </div>
 ```
@@ -2941,6 +2951,8 @@ export default DayPickerMultipleSelectionExample;
 
 ## Modifiers and custom marked days
 
+Modifiers let you attach domain-specific meaning like booked or available dates and style them separately.
+
 ### Example: Single date with modifiers
 
 Single date with modifiers
@@ -3390,6 +3402,8 @@ export default DayPickerCalendarModifiersExample;
 
 ## Reserved days
 
+Reserved days can be modeled with disabledDays plus custom modifiers and CSS classes from the outside.
+
 ### Example: Reserved days
 
 Reserved days
@@ -3812,6 +3826,8 @@ export default DayPickerCalendarReservedDaysExample;
 
 ## Hidden days
 
+Hidden days are not rendered at all, which is useful for compact calendars that should only expose certain weekdays.
+
 ### Example: Hidden days in a month
 
 Hidden days in a month
@@ -4034,7 +4050,7 @@ export default DayPickerCalendarHiddenDaysExample;
                     </thead>
                     <tbody data-animated-weeks="true" class="rdp-weeks">
                         <tr class="rdp-week">
-                            <td class="rdp-day rdp-hidden rdp-outside" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-hidden="true" data-outside="true">
+                            <td class="rdp-day rdp-hidden rdp-outside rdp-today" role="gridcell" data-day="2026-04-27" data-month="2026-04" data-hidden="true" data-outside="true" data-today="true">
                             </td>
                             <td class="rdp-day rdp-hidden rdp-outside" role="gridcell" data-day="2026-04-28" data-month="2026-04" data-hidden="true" data-outside="true">
                             </td>
@@ -4231,6 +4247,8 @@ export default DayPickerCalendarHiddenDaysExample;
 
 ## Marker dots
 
+Marker dots can be rendered with custom day content to visualize additional events or statuses per day.
+
 ### Example: Marker dots
 
 Marker dots
@@ -4814,6 +4832,8 @@ export default DayPickerCalendarMarkersExample;
 
 ## Custom day icons
 
+Use renderDayContent to render optional React nodes inside specific day cells, for example custom icons or tooltip anchors.
+
 ### Example: Custom day content
 
 Custom day content

package/dist/docs/components/dialogs.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/components/dialogs
-*Captured:* 2026-04-20T12:54:32.033Z
+*Captured:* 2026-04-27T14:58:06.852Z
 
 This component allows the user to create a generic modal dialog.
 

package/dist/docs/components/divider.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#/components/divider
-*Captured:* 2026-04-20T12:54:43.859Z
+*Captured:* 2026-04-27T14:58:18.311Z
 
 ## Divider