@iress-oss/ids-mcp-server 5.15.0 → 6.0.0-alpha.1

package/generated/docs/components-container-docs.md

@@ -1,91 +0,0 @@
-[](#container)Container
-=======================
-
-Overview
---------
-
-`IressContainer` provides a means to center and horizontally pad your site’s contents.
-
-IressContainer improves the scannability and visual hierarchy of a user interface by snapping the layout to fixed max widths at different breakpoints.
-
-Try resizing the screen to see the difference.
-
-Your screen size is showing the container for the **xl** breakpoint.
-
-*   Screen width range: 1200px - 1499px
-*   Max width: 1160px
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressContainer\>
-  <p\>
-    IressContainer improves the scannability and visual hierarchy of a user interface by snapping the layout to fixed max widths at different breakpoints.  </p\>
-  <p\>
-    Try resizing the screen to see the difference.  </p\>
-  <IressPanel\>
-    <CurrentBreakpoint renderLabel\="container" />
-  </IressPanel\>
-</IressContainer\>
-
-Copy
-
-[](#behaviour)Behaviour
------------------------
-
-The `IressContainer` snaps to fixed max widths at different breakpoints. Those max widths are as follows:
-
-Container breakpoints
-| Breakpoint | Screen Widths | Max Width |
-| --- | --- | --- |
-| xs | 0 - 575px | 100% |
-| sm | 576px - 767px | 520px |
-| md | 768px - 1023px | 740px |
-| lg | 1024px - 1199px | 960px |
-| xl | 1200px - 1499px | 1160px |
-| xxl | 1500px and above | 1160px |
-
-[](#examples)Examples
----------------------
-
-### [](#fluid)Fluid
-
-If you want the `IressContainer` to fill its containing element, you can set the `fluid` prop. Resize the example below to see how the IressContainer is 100% for all screen sizes.
-
-IressContainer improves the scannability and visual hierarchy of a user interface by snapping the layout to fixed max widths at different breakpoints.
-
-When the `fluid` prop is enabled, the container will span the full width of its containing element. Try resizing the screen to see how the IressContainer is 100% for all screen sizes.
-
-Your screen size is showing the container for the **xl** breakpoint.
-
-*   Screen width range: 1200px - 1499px
-*   Max width: 100%
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressContainer fluid\>
-  <p\>
-    IressContainer improves the scannability and visual hierarchy of a user interface by snapping the layout to fixed max widths at different breakpoints.  </p\>
-  <p\>
-    When the{' '}
-    <code\>
-      fluid    </code\>
-    {' '}prop is enabled, the container will span the full width of its containing element. Try resizing the screen to see how the IressContainer is 100% for all screen sizes.
-  </p\>
-  <IressPanel\>
-    <CurrentBreakpoint renderLabel\="container-fluid" />
-  </IressPanel\>
-</IressContainer\>
-
-Copy
-
-On this page
-
-*   [Overview](#overview)
-*   [Props](#props)
-*   [Behaviour](#behaviour)
-*   [Examples](#examples)
-    *   [Fluid](#fluid)

package/generated/docs/components-divider-docs.md

@@ -1,176 +0,0 @@
-[](#divider)Divider
-===================
-
-Overview
---------
-
-A divider is a UI element that separates content in lists and layouts.
-
-* * *
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressDivider />
-
-Copy
-
-[](#examples)Examples
----------------------
-
-### [](#vertical-divider)Vertical divider
-
-Use the `vertical` prop to change the divider from horizontal to vertical.
-
-Separate
-
-* * *
-
-this
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressInline
-  gutter\="md"
-  verticalAlign\="middle"
-\>
-  <IressText\>
-    Separate  </IressText\>
-  <IressDivider vertical />
-  <IressText\>
-    this  </IressText\>
-</IressInline\>
-
-Copy
-
-### [](#gutter)Gutter
-
-You can customise the gutter by using the `gutter` prop. By default, the divider uses the theme's default spacing as the gutter.
-
-none
-----
-
-Separate
-
-* * *
-
-this
-
-xs
---
-
-Separate
-
-* * *
-
-this
-
-sm
---
-
-Separate
-
-* * *
-
-this
-
-md
---
-
-Separate
-
-* * *
-
-this
-
-lg
---
-
-Separate
-
-* * *
-
-this
-
-xl
---
-
-Separate
-
-* * *
-
-this
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressInline gutter\="md"\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      none    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="none" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      xs    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="xs" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      sm    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="sm" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      md    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="md" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      lg    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="lg" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-  <IressPanel\>
-    <IressText element\="h2"\>
-      xl    </IressText\>
-    <IressText\>
-      Separate    </IressText\>
-    <IressDivider gutter\="xl" />
-    <IressText\>
-      this    </IressText\>
-  </IressPanel\>
-</IressInline\>
-
-Copy
-
-On this page
-
-*   [Overview](#overview)
-*   [Props](#props)
-*   [Examples](#examples)
-    *   [Vertical divider](#vertical-divider)
-    *   [Gutter](#gutter)

package/generated/docs/components-expander-docs.md

@@ -1,215 +0,0 @@
-[](#expander)Expander
-=====================
-
-Overview
---------
-
-Expanders are commonly used to reveal more information or details about an element or content on a page.
-
-Expander activator
-
-Expander content will go here (it is unformatted by default, use IressText to format the text)
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressExpander activator\="Expander activator"\>
-  Expander content will go here (it is unformatted by default, use IressText to format the text)
-</IressExpander\>
-
-Copy
-
-[](#accessibility)Accessibility
--------------------------------
-
-For Accessibility guidelines refer to [W3 ARIA Patterns Disclosure](https://www.w3.org/WAI/ARIA/apg/patterns/disclosure/), [W3 ARIA Patterns Accordion](https://www.w3.org/WAI/ARIA/apg/patterns/accordion/).
-
-[](#examples)Examples
----------------------
-
-### [](#mode)Mode
-
-Expander has a `mode` prop which can be used to change how the expander is displayed. There are 3 modes `section` (default), `heading` and `link`.
-
-section mode
-------------
-
-### Expander activator
-
-Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.
-
-heading mode
-------------
-
-### Expander activator
-
-Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.
-
-link mode
----------
-
-### Expander activator
-
-Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<div className\="iress-u-stack iress--gutter--md"\>
-  <div\>
-    <IressText element\="h2"\>
-      section mode    </IressText\>
-    <div className\="iress-u-inline iress--gutter--md"\>
-      <IressExpander
-        activator\={<div\><IressText element\="h3"\>Expander activator</IressText\></div\>}
-        mode\="section"
-      \>
-        <IressRow
-          gutter\="md"
-          verticalAlign\="stretch"
-        \>
-          <IressCol
-            data-testid\="security-infra"
-            span\={{
-              sm: 6
-            }}
-          \>
-            <IressText\>
-              Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.            </IressText\>
-          </IressCol\>
-        </IressRow\>
-      </IressExpander\>
-    </div\>
-  </div\>
-  <div\>
-    <IressText element\="h2"\>
-      heading mode    </IressText\>
-    <div className\="iress-u-inline iress--gutter--md"\>
-      <IressExpander
-        activator\={<div\><IressText element\="h3"\>Expander activator</IressText\></div\>}
-        mode\="heading"
-      \>
-        <IressRow
-          gutter\="md"
-          verticalAlign\="stretch"
-        \>
-          <IressCol
-            data-testid\="security-infra"
-            span\={{
-              sm: 6
-            }}
-          \>
-            <IressText\>
-              Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.            </IressText\>
-          </IressCol\>
-        </IressRow\>
-      </IressExpander\>
-    </div\>
-  </div\>
-  <div\>
-    <IressText element\="h2"\>
-      link mode    </IressText\>
-    <div className\="iress-u-inline iress--gutter--md"\>
-      <IressExpander
-        activator\={<div\><IressText element\="h3"\>Expander activator</IressText\></div\>}
-        mode\="link"
-      \>
-        <IressRow
-          gutter\="md"
-          verticalAlign\="stretch"
-        \>
-          <IressCol
-            data-testid\="security-infra"
-            span\={{
-              sm: 6
-            }}
-          \>
-            <IressText\>
-              Okay, so 9:00 you are strolling through the parking lot, you see us struggling in the car, you walk up, you open the door and you say, your line, George.            </IressText\>
-          </IressCol\>
-        </IressRow\>
-      </IressExpander\>
-    </div\>
-  </div\>
-</div\>
-
-Copy
-
-### [](#open)Open
-
-The `open` prop can be used to control the open state of the expander as can be seen below.
-
-Expander activator
-
-Expander content will go here (it is unformatted by default, use IressText to format the text)
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-<IressExpander
-  activator\="Expander activator"
-  mode\="heading"
-  open
-\>
-  Expander content will go here (it is unformatted by default, use IressText to format the text)
-</IressExpander\>
-
-Copy
-
-### [](#multiple-expanders-accordion)Multiple expanders (accordion)
-
-You can use multiple expanders to create an accordion, where al expander closes when another is opened.
-
-top
-
-Top
-===
-
-bottom
-
-Bottom
-------
-
-Hide code
-
-\[data-radix-scroll-area-viewport\] { scrollbar-width: none; -ms-overflow-style: none; -webkit-overflow-scrolling: touch; } \[data-radix-scroll-area-viewport\]::-webkit-scrollbar { display: none; } :where(\[data-radix-scroll-area-viewport\]) { display: flex; flex-direction: column; align-items: stretch; } :where(\[data-radix-scroll-area-content\]) { flex-grow: 1; }
-
-export const MultipleExpander \= () \=> {
-  const \[openActivator, setOpenActivator\] \= useState('');
-  const handleChange \= (newOpenActivator: string, open?: boolean) \=> {
-    setOpenActivator(open ? newOpenActivator : '');
-  };
-  return (
-    <div\>
-      <IressExpander
-        activator\="top"
-        open\={openActivator \=== 'top'}
-        onChange\={({ open }) \=> handleChange('top', open)}
-      \>
-        <h1\>Top</h1\>
-      </IressExpander\>
-      <IressExpander
-        activator\="bottom"
-        open\={openActivator \=== 'bottom'}
-        onChange\={({ open }) \=> handleChange('bottom', open)}
-      \>
-        <h2\>Bottom</h2\>
-      </IressExpander\>
-    </div\>
-  );
-};
-
-Copy
-
-On this page
-
-*   [Overview](#overview)
-*   [Props](#props)
-*   [Accessibility](#accessibility)
-*   [Examples](#examples)
-    *   [Mode](#mode)
-    *   [Open](#open)
-    *   [Multiple expanders (accordion)](#multiple-expanders-accordion)