@rio-cloud/uikit-mcp 1.1.9 → 1.1.11

package/dist/docs/components/areaCharts.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Charts
 *Source:* https://uikit.developers.rio.cloud/#/components/areaCharts
-*Captured:* 2026-03-06T10:41:25.420Z
+*Captured:* 2026-04-27T14:59:11.461Z
 
 ## AreaChart
 
@@ -26,21 +26,19 @@ type CustomData = {
     value: number;
 };
 
-export default () => {
-    return (
-        <>
-            <label>Simple AreaChart</label>
-            <div className='panel panel-default panel-body margin-bottom-0 height-200 max-width-500'>
-                <AreaChart
-                    data={data}
-                    dataKey={(entry: CustomData) => entry.name}
-                    xAxisOptions={{ padding: { left: 30, right: 30 } }}
-                    areas={[<Area key='area' dataKey={(entry: CustomData) => entry.value} />]}
-                />
-            </div>
-        </>
-    );
-};
+export default () => (
+    <>
+        <label>Simple AreaChart</label>
+        <div className='panel panel-default panel-body margin-bottom-0 height-200 max-width-500'>
+            <AreaChart
+                data={data}
+                dataKey={(entry: CustomData) => entry.name}
+                xAxisOptions={{ padding: { left: 30, right: 30 } }}
+                areas={[<Area key='area' dataKey={(entry: CustomData) => entry.value} />]}
+            />
+        </div>
+    </>
+);
 
 const data: CustomData[] = [
     {
@@ -93,9 +91,9 @@ const data: CustomData[] = [
                     </title>
                     <desc>
                     </desc>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_-100">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_-50">
                     </g>
                     <defs>
                         <clipPath id="recharts1-clip">
@@ -111,12 +109,12 @@ const data: CustomData[] = [
                             </stop>
                         </linearGradient>
                     </defs>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_100">
                         <g class="recharts-layer recharts-area">
                             <g class="recharts-layer">
                                 <defs>
                                     <clipPath id="animationClipPath-recharts-area-:r0:">
-                                        <rect x="45" y="0" width="87.97882059780788" height="124">
+                                        <rect x="45" y="0" width="78.86311652275786" height="124">
                                         </rect>
                                     </clipPath>
                                 </defs>
@@ -131,13 +129,13 @@ const data: CustomData[] = [
                             </g>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_200">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_300">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_400">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_500">
                         <g class="recharts-layer recharts-cartesian-axis recharts-xAxis xAxis">
                             <line angle="0" height="30" orientation="bottom" x="15" y="123" width="438" class="recharts-cartesian-axis-line" stroke="#666" fill="none" x1="15" y1="123" x2="453" y2="123">
                             </line>
@@ -175,15 +173,15 @@ const data: CustomData[] = [
                             </g>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_600">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1000">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1100">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1200">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_2000">
                         <g class="recharts-cartesian-axis-tick-labels recharts-xAxis-tick-labels">
                             <g class="recharts-layer recharts-cartesian-axis-tick-label">
                                 <text height="30" orientation="bottom" width="438" stroke="none" x="45" y="131" class="recharts-text recharts-cartesian-axis-tick-value" text-anchor="middle" fill="#666">
@@ -391,23 +389,21 @@ type CustomLegendProps = {
     onMouseLeave: () => void;
 };
 
-const CustomLegend = ({ payload, highlightedArea, onMouseEnter, onMouseLeave }: CustomLegendProps) => {
-    return (
-        <ul className='list-style-none padding-left-20'>
-            {payload?.map((entry: any, index: number) => (
-                <li
-                    key={`item-${index}`}
-                    onMouseEnter={() => onMouseEnter(entry.dataKey)}
-                    onMouseLeave={onMouseLeave}
-                    className={`cursor-pointer display-flex gap-5 align-items-center rounded padding-x-5 padding-y-3 ${highlightedArea === entry.dataKey ? 'bg-lightest' : ''}`}
-                >
-                    <span className='rioglyph rioglyph-sphere' style={{ color: entry.color }} />
-                    <span className='text-color-darker text-capitalize-first-word'>{entry.value}</span>
-                </li>
-            ))}
-        </ul>
-    );
-};
+const CustomLegend = ({ payload, highlightedArea, onMouseEnter, onMouseLeave }: CustomLegendProps) => (
+    <ul className='list-style-none padding-left-20'>
+        {payload?.map((entry: any, index: number) => (
+            <li
+                key={`item-${index}`}
+                onMouseEnter={() => onMouseEnter(entry.dataKey)}
+                onMouseLeave={onMouseLeave}
+                className={`cursor-pointer display-flex gap-5 align-items-center rounded padding-x-5 padding-y-3 ${highlightedArea === entry.dataKey ? 'bg-lightest' : ''}`}
+            >
+                <span className='rioglyph rioglyph-sphere' style={{ color: entry.color }} />
+                <span className='text-color-darker text-capitalize-first-word'>{entry.value}</span>
+            </li>
+        ))}
+    </ul>
+);
 
 const data: CustomData[] = [
     {
@@ -463,7 +459,7 @@ const data: CustomData[] = [
     <div class="recharts-responsive-container" style="width: 100%; height: 100%; min-width: 100px; min-height: 100px;">
         <div style="width: 0px; height: 0px; overflow: visible;">
             <div width="876" height="268" class="recharts-wrapper" style="position: relative; cursor: default; width: 876px; height: 268px;">
-                <div xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" class="recharts-tooltip-wrapper recharts-tooltip-wrapper-right recharts-tooltip-wrapper-bottom" style="visibility: hidden; pointer-events: none; position: absolute; top: 0px; left: 0px; transform: translate(440.844px, 186px);">
+                <div xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" class="recharts-tooltip-wrapper" style="visibility: hidden; pointer-events: none; position: absolute; top: 0px; left: 0px;">
                     <div class="recharts-default-tooltip" role="status" aria-live="assertive" style="margin: 0px; padding: 10px; background-color: rgb(255, 255, 255); border: 1px solid rgb(204, 204, 204); white-space: nowrap;">
                         <p class="recharts-tooltip-label" style="margin: 0px;">
                         </p>
@@ -488,7 +484,7 @@ const data: CustomData[] = [
                     </title>
                     <desc>
                     </desc>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_-100">
                         <g class="recharts-cartesian-grid">
                             <g class="recharts-cartesian-grid-horizontal">
                                 <line stroke-dasharray="3 3" stroke="#ccc" fill="none" x="75" y="15" width="711.6875" height="208" x1="75" y1="223" x2="786.6875" y2="223">
@@ -520,7 +516,7 @@ const data: CustomData[] = [
                             </g>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_-50">
                     </g>
                     <defs>
                         <clipPath id="recharts2-clip">
@@ -542,12 +538,12 @@ const data: CustomData[] = [
                             </stop>
                         </linearGradient>
                     </defs>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_100">
                         <g class="recharts-layer recharts-area">
                             <g class="recharts-layer">
                                 <defs>
                                     <clipPath id="animationClipPath-recharts-area-:r1:">
-                                        <rect x="75" y="0" width="676.1772189894161" height="224">
+                                        <rect x="75" y="0" width="642.7074137109543" height="224">
                                         </rect>
                                     </clipPath>
                                 </defs>
@@ -565,7 +561,7 @@ const data: CustomData[] = [
                             <g class="recharts-layer">
                                 <defs>
                                     <clipPath id="animationClipPath-recharts-area-:r2:">
-                                        <rect x="75" y="0" width="676.1772189894161" height="224">
+                                        <rect x="75" y="0" width="642.7074137109543" height="224">
                                         </rect>
                                     </clipPath>
                                 </defs>
@@ -580,17 +576,17 @@ const data: CustomData[] = [
                             </g>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_200">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_300">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_400">
                         <g class="recharts-layer recharts-reference-line">
                             <line y="3500" stroke-dasharray="3 3" stroke="#f19588 " fill="none" fill-opacity="1" stroke-width="1" x1="75" y1="20.777777777777782" x2="786.6875" y2="20.777777777777782" class="recharts-reference-line-line">
                             </line>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_500">
                         <g class="recharts-layer recharts-cartesian-axis recharts-yAxis yAxis">
                             <line angle="0" orientation="left" width="60" x="15" y="15" height="208" class="recharts-cartesian-axis-line" stroke="#666" fill="none" x1="75" y1="15" x2="75" y2="223">
                             </line>
@@ -656,15 +652,15 @@ const data: CustomData[] = [
                             </g>
                         </g>
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_600">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1000">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1100">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_1200">
                     </g>
-                    <g tabindex="-1">
+                    <g tabindex="-1" class="recharts-zIndex-layer_2000">
                         <g class="recharts-cartesian-axis-tick-labels recharts-yAxis-tick-labels">
                             <g class="recharts-layer recharts-cartesian-axis-tick-label">
                                 <text orientation="left" width="60" height="208" stroke="none" x="67" y="223" class="recharts-text recharts-cartesian-axis-tick-value" text-anchor="end" fill="#666">

package/dist/docs/components/aspectRatioPlaceholder.md

@@ -3,7 +3,7 @@
 *Category:* Components
 *Section:* Misc
 *Source:* https://uikit.developers.rio.cloud/#/components/aspectRatioPlaceholder
-*Captured:* 2026-03-06T10:40:54.667Z
+*Captured:* 2026-04-27T14:58:14.201Z
 
 Use the AspectRatioPlaceholder for having responsive elements with an aspect ratio.