@iress-oss/ids-mcp-server 6.0.0-alpha.2 → 6.0.0-alpha.4

package/generated/docs/components_components-inline-docs.md

@@ -16,9 +16,9 @@ This component has been recently updated with new props. The props have been mar
 
 [](./iframe.html?id=components-inline--default)
 
-```
+Hide codedrawOpen in CodeSandbox
 
-<IressInline gap\="spacing.400"\>
+<IressInline gap\="spacing.4"\>
   <IressPlaceholder
     style\={{
       minHeight: '30px'
@@ -76,7 +76,7 @@ ResponsiveProp
 
  | \- | 
 
-"spacing.400"
+"spacing.4"
 
  |
 | horizontalAlign | 
@@ -123,7 +123,7 @@ Examples
 
 Inline spacing is applied to the direct children of the `IressInline` component.
 
-The amount of spacing is controlled by the `gap` prop and can be set from `spacing.000` to `spacing.1200`.
+The amount of spacing is controlled by the `gap` prop and can be set from `spacing.0` to `spacing.10`.
 
 #### What happened to `gutter`?
 
@@ -133,53 +133,35 @@ The existing `gutter` values are still supported, as they are now aliases for th
 
 [](./iframe.html?id=components-inline--gap)
 
-spacing.000
------------
-
-spacing.050
------------
-
-spacing.100
------------
-
-spacing.150
------------
-
-spacing.200
------------
+spacing.0
+---------
 
-spacing.250
------------
+spacing.1
+---------
 
-spacing.300
------------
+spacing.2
+---------
 
-spacing.350
------------
+spacing.3
+---------
 
-spacing.400
------------
+spacing.4
+---------
 
-spacing.500
------------
+spacing.5
+---------
 
-spacing.600
------------
+spacing.6
+---------
 
-spacing.700
------------
+spacing.7
+---------
 
-spacing.800
------------
+spacing.8
+---------
 
-spacing.900
------------
-
-spacing.1000
-------------
-
-spacing.1200
-------------
+spacing.10
+----------
 
 none
 ----
@@ -199,235 +181,13 @@ lg
 xl
 --
 
-field.footer
-------------
-
-slider.tick
------------
-
-```
+Hide codedrawOpen in CodeSandbox
 
-<IressStack gap\="spacing.1200"\>
-  <IressText\>
-    <h2\>
-      spacing.000    </h2\>
-    <IressInline gap\="spacing.000"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      spacing.050    </h2\>
-    <IressInline gap\="spacing.050"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      spacing.100    </h2\>
-    <IressInline gap\="spacing.100"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      spacing.150    </h2\>
-    <IressInline gap\="spacing.150"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      spacing.200    </h2\>
-    <IressInline gap\="spacing.200"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      spacing.250    </h2\>
-    <IressInline gap\="spacing.250"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
+<IressStack gap\="spacing.10"\>
   <IressText\>
     <h2\>
-      spacing.300    </h2\>
-    <IressInline gap\="spacing.300"\>
+      spacing.0    </h2\>
+    <IressInline gap\="spacing.0"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -462,8 +222,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.350    </h2\>
-    <IressInline gap\="spacing.350"\>
+      spacing.1    </h2\>
+    <IressInline gap\="spacing.1"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -498,8 +258,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.400    </h2\>
-    <IressInline gap\="spacing.400"\>
+      spacing.2    </h2\>
+    <IressInline gap\="spacing.2"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -534,8 +294,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.500    </h2\>
-    <IressInline gap\="spacing.500"\>
+      spacing.3    </h2\>
+    <IressInline gap\="spacing.3"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -570,8 +330,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.600    </h2\>
-    <IressInline gap\="spacing.600"\>
+      spacing.4    </h2\>
+    <IressInline gap\="spacing.4"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -606,8 +366,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.700    </h2\>
-    <IressInline gap\="spacing.700"\>
+      spacing.5    </h2\>
+    <IressInline gap\="spacing.5"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -642,8 +402,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.800    </h2\>
-    <IressInline gap\="spacing.800"\>
+      spacing.6    </h2\>
+    <IressInline gap\="spacing.6"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -678,8 +438,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.900    </h2\>
-    <IressInline gap\="spacing.900"\>
+      spacing.7    </h2\>
+    <IressInline gap\="spacing.7"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -714,8 +474,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.1000    </h2\>
-    <IressInline gap\="spacing.1000"\>
+      spacing.8    </h2\>
+    <IressInline gap\="spacing.8"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -750,8 +510,8 @@ slider.tick
   </IressText\>
   <IressText\>
     <h2\>
-      spacing.1200    </h2\>
-    <IressInline gap\="spacing.1200"\>
+      spacing.10    </h2\>
+    <IressInline gap\="spacing.10"\>
       <IressPlaceholder
         style\={{
           minHeight: '50px'
@@ -1000,78 +760,6 @@ slider.tick
       />
     </IressInline\>
   </IressText\>
-  <IressText\>
-    <h2\>
-      field.footer    </h2\>
-    <IressInline gap\="field.footer"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
-  <IressText\>
-    <h2\>
-      slider.tick    </h2\>
-    <IressInline gap\="slider.tick"\>
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-      <IressPlaceholder
-        style\={{
-          minHeight: '50px'
-        }}
-        width\="50"
-      />
-    </IressInline\>
-  </IressText\>
 </IressStack\>
 
 ```
@@ -1142,27 +830,27 @@ The `gap` prop can take an object that takes five key/value pairs that correlate
 
 Current breakpoint: **xl** breakpoint (1200px - 1499px).
 
-`gap={{"xs":"spacing.100","sm":"spacing.200","md":"spacing.400"}}`
+`gap={{"xs":"spacing.1","sm":"spacing.2","md":"spacing.4"}}`
 
-```
+Hide codedrawOpen in CodeSandbox
 
-<IressStack gap\="spacing.400"\>
+<IressStack gap\="spacing.4"\>
   <IressPanel\>
     <p\>
       Current breakpoint:{' '}
-      <kn />
+      <Ln />
       .    </p\>
     <p\>
       <code\>
-        {\`gap={{"xs":"spacing.100","sm":"spacing.200","md":"spacing.400"}}\`}
+        {\`gap={{"xs":"spacing.1","sm":"spacing.2","md":"spacing.4"}}\`}
       </code\>
     </p\>
   </IressPanel\>
   <IressInline
     gap\={{
-      md: 'spacing.400',
-      sm: 'spacing.200',
-      xs: 'spacing.100'
+      md: 'spacing.4',
+      sm: 'spacing.2',
+      xs: 'spacing.1'
     }}
   \>
     <IressPlaceholder
@@ -1228,9 +916,9 @@ gap :
 
 {
 
-*   xs : "spacing.100"
-*   sm : "spacing.200"
-*   md : "spacing.400"
+*   xs : "spacing.1"
+*   sm : "spacing.2"
+*   md : "spacing.4"
 
 }
 
@@ -1309,15 +997,15 @@ left
 right
 -----
 
-```
+Hide codedrawOpen in CodeSandbox
 
 <IressContainer\>
-  <IressStack gap\="spacing.1200"\>
+  <IressStack gap\="spacing.10"\>
     <IressText\>
       <h2\>
         around      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="around"
       \>
         <IressPlaceholder
@@ -1356,7 +1044,7 @@ right
       <h2\>
         between      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="between"
       \>
         <IressPlaceholder
@@ -1395,7 +1083,7 @@ right
       <h2\>
         center      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="center"
       \>
         <IressPlaceholder
@@ -1434,7 +1122,7 @@ right
       <h2\>
         evenly      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="evenly"
       \>
         <IressPlaceholder
@@ -1473,7 +1161,7 @@ right
       <h2\>
         left      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="left"
       \>
         <IressPlaceholder
@@ -1512,7 +1200,7 @@ right
       <h2\>
         right      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="right"
       \>
         <IressPlaceholder
@@ -1574,7 +1262,7 @@ ResponsiveProp
 
  | \- | 
 
-"spacing.200"
+"spacing.2"
 
  |
 | horizontalAlign | 
@@ -1637,15 +1325,15 @@ bottom
 stretch
 -------
 
-```
+Hide codedrawOpen in CodeSandbox
 
 <IressContainer\>
-  <IressStack gap\="spacing.1200"\>
+  <IressStack gap\="spacing.10"\>
     <IressText textAlign\="center"\>
       <h2\>
         top      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="center"
         verticalAlign\="top"
       \>
@@ -1685,7 +1373,7 @@ stretch
       <h2\>
         middle      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="center"
         verticalAlign\="middle"
       \>
@@ -1725,7 +1413,7 @@ stretch
       <h2\>
         bottom      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="center"
         verticalAlign\="bottom"
       \>
@@ -1765,7 +1453,7 @@ stretch
       <h2\>
         stretch      </h2\>
       <IressInline
-        gap\="spacing.200"
+        gap\="spacing.2"
         horizontalAlign\="center"
         verticalAlign\="stretch"
       \>
@@ -1828,7 +1516,7 @@ ResponsiveProp
 
  | \- | 
 
-"spacing.200"
+"spacing.2"
 
  |
 | horizontalAlign | 
@@ -1880,10 +1568,10 @@ The `IressInline` component automatically wraps children. There may be some scen
 
 His head is gone, it is like it is been erased... Erased from existence. That was the day I invented time travel. I remember it vividly. I was standing on the edge of my toilet hanging a clock, the porces was wet, I slipped, hit my head on the edge of the sink. And when I came to I had a revelation, a picture, a picture in my head, a picture of this. This is what makes time travel possible. The flux capacitor.
 
-```
+Hide codedrawOpen in CodeSandbox
 
 <IressInline
-  gap\="spacing.1200"
+  gap\="spacing.10"
   noWrap
 \>
   <IressPlaceholder
@@ -1921,7 +1609,7 @@ ResponsiveProp
 
  | \- | 
 
-"spacing.1200"
+"spacing.10"
 
  |
 | horizontalAlign |