@rio-cloud/uikit-mcp 1.1.10 → 1.1.11

package/dist/docs/templates/settings-form.md

@@ -3,7 +3,7 @@
 *Category:* Templates
 *Section:* Forms
 *Source:* https://uikit.developers.rio.cloud/#/templates/settings-form
-*Captured:* 2026-04-20T12:55:44.679Z
+*Captured:* 2026-04-27T14:59:24.128Z
 
 ## Form blocks
 
@@ -15,7 +15,7 @@ This name will appear on your team profile page
 About the team
 Write a short summary about your organization or group (max 240 characters).
 
-Stand-alone system-worthy capacity
+Multi-tiered local attitude
 
 Company email
 Your contact email address for customer communication
@@ -25,11 +25,11 @@ Display email on team page
 Office location
 Primary business address used for official correspondence
 
-Wyoming Wyoming
-Louisiana
+Texas Texas
+Illinois
 
-Lithuania Lithuania
-Serbia
+Mauritania Mauritania
+Grenada
 
 Preferred currency
 All pricing and payouts will be shown in this currency
@@ -194,7 +194,7 @@ export default () => (
                     </div>
                     <div class="form-group">
                         <div class="ClearableInput input-group">
-                            <input class="form-control withClearButton" type="text" tabindex="0" value="Schuster Inc">
+                            <input class="form-control withClearButton" type="text" tabindex="0" value="Lubowitz, Ondricka and Conn">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
@@ -214,7 +214,7 @@ export default () => (
                         <p class="text-wrap-balance text-color-dark">Write a short summary about your organization or group (max 240 characters).</p>
                     </div>
                     <div class="form-group">
-                        <textarea class="form-control" rows="4">Stand-alone system-worthy capacity</textarea>
+                        <textarea class="form-control" rows="4">Multi-tiered local attitude</textarea>
                     </div>
                 </section>
                 <div class="grid-colspan-2">
@@ -230,7 +230,7 @@ export default () => (
                     </div>
                     <div class="form-group">
                         <div class="ClearableInput input-group">
-                            <input class="form-control withClearButton" type="email" tabindex="0" value="Nadine_Baumbach@gmail.com">
+                            <input class="form-control withClearButton" type="email" tabindex="0" value="Marjory_Bogan1@gmail.com">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
@@ -257,14 +257,14 @@ export default () => (
                     </div>
                     <div class="form-group display-flex flex-column gap-15">
                         <div class="ClearableInput input-group">
-                            <input placeholder="Street address" class="form-control withClearButton" type="text" tabindex="0" value="27532 Boehm Loaf">
+                            <input placeholder="Street address" class="form-control withClearButton" type="text" tabindex="0" value="456 Lehner Extension">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
                             </span>
                         </div>
                         <div class="ClearableInput input-group">
-                            <input placeholder="City" class="form-control withClearButton" type="text" tabindex="0" value="Fort Kieranland">
+                            <input placeholder="City" class="form-control withClearButton" type="text" tabindex="0" value="West Sadieborough">
                             <span class="clearButton">
                                 <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                 </span>
@@ -273,7 +273,7 @@ export default () => (
                         <div class="display-flex gap-15">
                             <div class="select dropdown dropup">
                                 <button type="button" class="dropdown-toggle form-control text-left" data-toggle="dropdown" tabindex="0" aria-haspopup="true" aria-expanded="false">
-                                    <span class="selected-option-text">Wyoming</span>
+                                    <span class="selected-option-text">Texas</span>
                                     <span class="select-toggle-actions">
                                         <span class="clearButton hide pointer-events-none">
                                             <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
@@ -286,20 +286,20 @@ export default () => (
                                 <ul class="dropdown-menu" role="menu">
                                     <li class="" role="listitem">
                                         <a role="menuitem" class="display-flex align-items-center gap-3" data-item-id="1" data-item-index="0">
-                                            <span class="selected-option-dropdown-item">Wyoming</span>
+                                            <span class="selected-option-dropdown-item">Texas</span>
                                             <input type="hidden" value="1">
                                         </a>
                                     </li>
                                     <li class="" role="listitem">
                                         <a role="menuitem" class="display-flex align-items-center gap-3" data-item-id="2" data-item-index="1">
-                                            <span class="selected-option-dropdown-item">Louisiana</span>
+                                            <span class="selected-option-dropdown-item">Illinois</span>
                                             <input type="hidden" value="2">
                                         </a>
                                     </li>
                                 </ul>
                             </div>
                             <div class="ClearableInput input-group">
-                                <input placeholder="Zip code" class="form-control withClearButton" type="text" tabindex="0" value="48640">
+                                <input placeholder="Zip code" class="form-control withClearButton" type="text" tabindex="0" value="35339">
                                 <span class="clearButton">
                                     <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
                                     </span>
@@ -308,7 +308,7 @@ export default () => (
                         </div>
                         <div class="select dropdown dropup">
                             <button type="button" class="dropdown-toggle form-control text-left" data-toggle="dropdown" tabindex="0" aria-haspopup="true" aria-expanded="false">
-                                <span class="selected-option-text">Lithuania</span>
+                                <span class="selected-option-text">Mauritania</span>
                                 <span class="select-toggle-actions">
                                     <span class="clearButton hide pointer-events-none">
                                         <span class="clearButtonIcon rioglyph rioglyph-remove-sign">
@@ -321,13 +321,13 @@ export default () => (
                             <ul class="dropdown-menu" role="menu">
                                 <li class="" role="listitem">
                                     <a role="menuitem" class="display-flex align-items-center gap-3" data-item-id="1" data-item-index="0">
-                                        <span class="selected-option-dropdown-item">Lithuania</span>
+                                        <span class="selected-option-dropdown-item">Mauritania</span>
                                         <input type="hidden" value="1">
                                     </a>
                                 </li>
                                 <li class="" role="listitem">
                                     <a role="menuitem" class="display-flex align-items-center gap-3" data-item-id="2" data-item-index="1">
-                                        <span class="selected-option-dropdown-item">Serbia</span>
+                                        <span class="selected-option-dropdown-item">Grenada</span>
                                         <input type="hidden" value="2">
                                     </a>
                                 </li>

package/dist/docs/templates/stats-blocks.md

@@ -3,7 +3,7 @@
 *Category:* Templates
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/templates/stats-blocks
-*Captured:* 2026-04-20T12:55:47.031Z
+*Captured:* 2026-04-27T14:59:26.924Z
 
 ## Stats blocks
 
@@ -13,22 +13,22 @@ Stats page
 Overview of your supply chain operations
 
 Total inventory
-1353 units
+1574 units
 
 12% from last month
 
 Open orders
-70
+48
 
 5% from last month
 
 In transit
-18
+19
 
 -3% from last month
 
 Issues
-0
+3
 
 #### React (tsx)
 
@@ -145,7 +145,7 @@ export default () => {
                 </div>
                 <div>
                     <div class="text-color-dark">Total inventory</div>
-                    <div class="text-size-h3 text-color-darkest line-height-125rel">1353 units</div>
+                    <div class="text-size-h3 text-color-darkest line-height-125rel">1574 units</div>
                 </div>
             </div>
             <div class="text-size-12 padding-x-20 padding-y-10 bg-lightest rounded-bottom display-flex gap-5">
@@ -163,7 +163,7 @@ export default () => {
                 </div>
                 <div>
                     <div class="text-color-dark">Open orders</div>
-                    <div class="text-size-h3 text-color-darkest line-height-125rel">70</div>
+                    <div class="text-size-h3 text-color-darkest line-height-125rel">48</div>
                 </div>
             </div>
             <div class="text-size-12 padding-x-20 padding-y-10 bg-lightest rounded-bottom display-flex gap-5">
@@ -181,7 +181,7 @@ export default () => {
                 </div>
                 <div>
                     <div class="text-color-dark">In transit</div>
-                    <div class="text-size-h3 text-color-darkest line-height-125rel">18</div>
+                    <div class="text-size-h3 text-color-darkest line-height-125rel">19</div>
                 </div>
             </div>
             <div class="text-size-12 padding-x-20 padding-y-10 bg-lightest rounded-bottom display-flex gap-5">
@@ -199,7 +199,7 @@ export default () => {
                 </div>
                 <div>
                     <div class="text-color-dark">Issues</div>
-                    <div class="text-size-h3 text-color-darkest line-height-125rel">0</div>
+                    <div class="text-size-h3 text-color-darkest line-height-125rel">3</div>
                 </div>
             </div>
         </div>
@@ -907,7 +907,7 @@ const getStatusColor = (status: string) => {
                 <div class="text-medium text-size-16">Lorem ipsum dolor</div>
                 <div>
                     <div class="dropdown btn-group">
-                        <button type="button" id="11wezc6jasrn" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
+                        <button type="button" id="ablnjzhk1z" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
                             <span class="rioglyph rioglyph-option-horizontal" aria-hidden="true">
                             </span>
                         </button>
@@ -1106,7 +1106,7 @@ const getStatusColor = (status: string) => {
                 </div>
                 <div>
                     <div class="dropdown btn-group">
-                        <button type="button" id="fkf6pwsnp6h" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
+                        <button type="button" id="6mmn1pdjo9s" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
                             <span class="rioglyph rioglyph-option-horizontal" aria-hidden="true">
                             </span>
                         </button>
@@ -1174,7 +1174,7 @@ const getStatusColor = (status: string) => {
                 </div>
                 <div>
                     <div class="dropdown btn-group">
-                        <button type="button" id="nkrh7m5h1j" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
+                        <button type="button" id="z74oenueisl" class="btn btn-muted btn-md btn-icon-only btn-component dropdown-toggle" tabindex="0">
                             <span class="rioglyph rioglyph-option-horizontal" aria-hidden="true">
                             </span>
                         </button>

package/dist/docs/templates/table-panel.md

@@ -3,7 +3,7 @@
 *Category:* Templates
 *Section:* Tables
 *Source:* https://uikit.developers.rio.cloud/#/templates/table-panel
-*Captured:* 2026-04-20T12:55:47.756Z
+*Captured:* 2026-04-27T14:59:27.774Z
 
 ## Combined tables in ExpandablePanel
 

package/dist/docs/templates/usage-cards.md

@@ -3,7 +3,7 @@
 *Category:* Templates
 *Section:* Content
 *Source:* https://uikit.developers.rio.cloud/#/templates/usage-cards
-*Captured:* 2026-04-20T12:55:43.594Z
+*Captured:* 2026-04-27T14:59:23.087Z
 
 ## Data usage cards
 

package/dist/docs/utilities/classNames.md

@@ -3,7 +3,7 @@
 *Category:* Utilities
 *Section:* Helper
 *Source:* https://uikit.developers.rio.cloud/#/utilities/classNames
-*Captured:* 2026-04-20T12:55:48.736Z
+*Captured:* 2026-04-27T14:59:28.428Z
 
 Small utility for composing CSS classes from optional string arguments. It keeps the common case readable without adding third-party runtime behavior.
 
@@ -15,16 +15,104 @@ Use it for patterns like: classNames('base-class', isActive && 'active', classNa
 
 The old third-party classnames API also supported object-based syntax where object keys became class names. This worked, but it was harder to read and unnecessarily complex because the class name lived in the object key instead of being a direct argument.
 
+Old classnames style (harder to read)
+
 ```tsx
 classNames('base', { inverse: isInverse, double: isDoubleSized });
 classNames('base', { 'cursor-pointer': clickable }, className);
 ```
 
+classNames
+
+(
+
+'base'
+
+,
+
+{
+
+:
+
+,
+
+:
+
+}
+
+)
+
+;
+
+classNames
+
+(
+
+'base'
+
+,
+
+{
+
+'cursor-pointer'
+
+:
+
+}
+
+,
+
+)
+
+;
+
+New classNames API
+
 ```tsx
 classNames('base', isInverse && 'inverse', isDoubleSized && 'double');
 classNames('base', clickable && 'cursor-pointer', className);
 ```
 
+classNames
+
+(
+
+'base'
+
+,
+
+&&
+
+'inverse'
+
+,
+
+&&
+
+'double'
+
+)
+
+;
+
+classNames
+
+(
+
+'base'
+
+,
+
+&&
+
+'cursor-pointer'
+
+,
+
+)
+
+;
+
 ### Example: This class string is built from optional className arguments.
 
 text-left text-center text-right Include optional border class

package/dist/docs/utilities/deviceUtils.md

@@ -3,7 +3,7 @@
 *Category:* Utilities
 *Section:* Helper
 *Source:* https://uikit.developers.rio.cloud/#/utilities/deviceUtils
-*Captured:* 2026-04-20T12:55:48.277Z
+*Captured:* 2026-04-27T14:59:27.950Z
 
 Set of utility functions which helps detecting certain devices or functionality.
 

package/dist/docs/utilities/featureToggles.md

@@ -3,7 +3,7 @@
 *Category:* Utilities
 *Section:* Helper
 *Source:* https://uikit.developers.rio.cloud/#/utilities/featureToggles
-*Captured:* 2026-04-20T12:55:49.331Z
+*Captured:* 2026-04-27T14:59:29.244Z
 
 URL-based feature toggles (also known as feature flags) are a powerful development technique that allows you to enable or disable features in your application dynamically, without deploying new code.
 
@@ -16,6 +16,10 @@ The feature toggle detection system in your application is designed to handle th
 - URL Query Parameters Toggles can be passed through the URL as query parameters (e.g., ?ft_demo=true), allowing for easy testing or overriding of features without modifying code
 - LocalStorage If a toggle is not present in the URL, the system falls back to using stored values in the browser's localStorage, ensuring that user preferences or feature states are preserved across sessions
 
+Toggles can be passed through the URL as query parameters (e.g., ?ft_demo=true), allowing for easy testing or overriding of features without modifying code
+
+If a toggle is not present in the URL, the system falls back to using stored values in the browser's localStorage, ensuring that user preferences or feature states are preserved across sessions
+
 ## Defining feature toggles
 
 Feature toggles are defined in a centralized configuration map, with each toggle specifying its corresponding query parameter name, its data type (boolean, string, or number) and an optional default value. This allows you to easily configure new toggles.
@@ -47,6 +51,126 @@ oldToggles
 );
 ```
 
+import
+
+{
+
+,
+
+,
+
+,
+
+}
+
+from
+
+'@rio-cloud/rio-uikit/urlFeatureToggles'
+
+;
+
+// Define old toggles to clean up
+
+const
+
+=
+
+[
+
+'ft_eventTeaser'
+
+,
+
+'ft_survey'
+
+,
+
+'ft_menu'
+
+]
+
+;
+
+// Define toggle transformation functions with their respective names and
+
+// export the detected feature toggles as a singleton
+
+export
+
+const
+
+=
+
+detectFeatureToggles
+
+(
+
+{
+
+:
+
+asString
+
+(
+
+'ft_enforceLocale'
+
+)
+
+,
+
+:
+
+asBoolean
+
+(
+
+'ft_tracing'
+
+)
+
+,
+
+:
+
+asBooleanWithDefault
+
+(
+
+'ft_demo'
+
+,
+
+false
+
+)
+
+,
+
+:
+
+asNumberWithDefault
+
+(
+
+'ft_maxItems'
+
+,
+
+10
+
+)
+
+,
+
+}
+
+,
+
+)
+
+;
+
 **Default values**
 
 For each type of transformer there is a *WithDefault variant. This function accepts a default value as second parameter. The default value is only returned if neither the query parameter nor the local storage contain a value for the feature toggle. A feature toggle with a default value will never be null. This fact is also reflected in the type of the feature toggle properties in the object returned by detectFeatureToggles.
@@ -63,6 +187,40 @@ oldToggles,
 );
 ```
 
+export
+
+const
+
+=
+
+detectFeatureToggles
+
+(
+
+{
+
+:
+
+asBoolean
+
+(
+
+'ft_demo'
+
+)
+
+}
+
+,
+
+,
+
+'myCustomPrefix.'
+
+)
+
+;
+
 ## Usage
 
 Suppose you want to enable or disable a demo mode in your application. You can pass ?ft_demo=true in the URL or rely on the value previously stored in localStorage.
@@ -82,9 +240,31 @@ if (featureToggles.demo) {
 }
 ```
 
+if
+
+(
+
+.
+
+)
+
+{
+
+// Render demo feature
+
+}
+
 ## Benefits
 
 - Flexibility This approach allows toggles to be easily overridden via URL for testing or debugging purposes without changing the codebase
 - Persistence By leveraging localStorage, feature toggles persist across browser sessions, ensuring a consistent experience for users
 - Type safety Type transformation functions (asBoolean, asString, asNumber) ensure that toggles are correctly interpreted based on the expected data type
-- Clean state management Unused toggles can be cleaned up from localStorage, ensuring there is no unnecessary buildup of outdated data
+- Clean state management Unused toggles can be cleaned up from localStorage, ensuring there is no unnecessary buildup of outdated data
+
+This approach allows toggles to be easily overridden via URL for testing or debugging purposes without changing the codebase
+
+By leveraging localStorage, feature toggles persist across browser sessions, ensuring a consistent experience for users
+
+Type transformation functions (asBoolean, asString, asNumber) ensure that toggles are correctly interpreted based on the expected data type
+
+Unused toggles can be cleaned up from localStorage, ensuring there is no unnecessary buildup of outdated data

package/dist/docs/utilities/fuelTypeUtils.md

@@ -3,7 +3,7 @@
 *Category:* Utilities
 *Section:* Helper
 *Source:* https://uikit.developers.rio.cloud/#/utilities/fuelTypeUtils
-*Captured:* 2026-04-20T12:55:48.627Z
+*Captured:* 2026-04-27T14:59:28.552Z
 
 There is a wide variety of standardized fuel types, and on top of that, some projects or systems introduce their own custom definitions. While the naming can differ, many of these values carry the same semantic meaning. To avoid confusion and ensure consistent visual representation, we provide a centralized mapping of fuel types to icons.
 

package/dist/docs/utilities/getTrackingAttributes.md

@@ -3,7 +3,7 @@
 *Category:* Utilities
 *Section:* Helper
 *Source:* https://uikit.developers.rio.cloud/#/utilities/getTrackingAttributes
-*Captured:* 2026-04-20T12:55:49.976Z
+*Captured:* 2026-04-27T14:59:29.682Z
 
 Utility helpers for Google Analytics integration, including attribute generation and push helpers.
 
@@ -15,8 +15,14 @@ Use these helpers to create consistent tracking attributes, push events intowind
 
 ## Available helpers
 
+NameExampleDescriptiongetTrackingAttributes(...)getTrackingAttributes({ trigger: 'click', category: 'demo' })Creates the data-track-ga-event-* attributes for declarative tracking on DOM elements. This is the preferred approach for UI elements.gaPush(...)gaPush({ category: 'demo', action: 'click', label: 'cta' })Pushes an event into window.dataLayer programmatically. Use this when tracking should happen from imperative code, including hover interactions.executeAndTrack(...)executeAndTrack(myFn, { category: 'demo', action: 'run', label: 'myFn' })Wraps a function so it still runs normally and also sends a GA event afterward. Useful when you want tracking and business logic wired together in one call.
+
 ## Tracking attributesRecommended
 
+Tracking attributes
+
+> Recommended
+
 **TRACKING_TRIGGER**
 
 TRACKING_TRIGGER defines the allowed values for trigger ingetTrackingAttributes.
@@ -25,8 +31,27 @@ TRACKING_TRIGGER defines the allowed values for trigger ingetTrackingAttributes.
 type TRACKING_TRIGGER = 'click' | 'visibility';
 ```
 
+type
+
+TRACKING_TRIGGER
+
+=
+
+'click'
+
+|
+
+'visibility'
+
+;
+
 Hover is intentionally not part of TRACKING_TRIGGER. If you need to track hover interactions, send the event programmatically with gaPush or executeAndTrackfrom the relevant UI callback.
 
+| Trigger | Use for |
+| --- | --- |
+| click | User actively clicks an element (buttons, links, controls). |
+| visibility | Element becomes visible in the viewport. |
+
 **TRACKING_ACTIONS and TRACKING_LABELS**
 
 These exports are optional app-level maps that consuming applications can fill with shared action and label values. They are configuration points, not required runtime state.
@@ -36,6 +61,26 @@ TRACKING_ACTIONS.dialogClose = 'dialog clicked';
 TRACKING_LABELS.dialogClose = 'Dialog closed via close button';
 ```
 
+TRACKING_ACTIONS
+
+.
+
+=
+
+'dialog clicked'
+
+;
+
+TRACKING_LABELS
+
+.
+
+=
+
+'Dialog closed via close button'
+
+;
+
 ### Example: getTrackingAttributes()
 
 getTrackingAttributes()