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

package/generated/docs/components-checkboxgroup-recipes-docs.md

@@ -1,119 +0,0 @@
-[](#recipes)Recipes
-===================
-
-[](#checkboxes-inside-an-iresstable)Checkboxes inside an `IressTable`
----------------------------------------------------------------------
-
-You can use `IressCheckboxGroup` and `IressTable` to create a table with checkboxes, allowing the users to select multiple rows.
-
-Selected values: lemon-drizzle, victoria-sponge
-
-Required Let them eat cake
-
-Available options
-| Select | Name |
-| --- | --- |
-| 
-Select lemon drizzle
-
- | Lemon drizzle |
-| 
-
-Select Victoria Sponge
-
- | Victoria Sponge |
-| 
-
-Select Carrot Cake
-
- | Carrot Cake |
-
-Submit
-
-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; }
-
-import {
-  FormControlValue,
-  IressButton,
-  IressCheckbox,
-  IressForm,
-  IressFormFieldset,
-  IressPanel,
-  IressStack,
-  IressTable,
-} from '@iress-oss/ids-components';
-import { IressCheckboxGroup } from '../CheckboxGroup';
-import { toArray } from '../../../helpers/formatting/toArray';
-interface FieldValues {
-  'let-them-eat-cake'?: FormControlValue\[\];
-}
-const SelectedValues \= () \=> {
-  const value \= IressForm.useWatch<FieldValues\>({ name: 'let-them-eat-cake' });
-  const valueString \= toArray(value).join(', ');
-  return (
-    <IressPanel\>
-      Selected values: {valueString ? valueString : 'None'}
-    </IressPanel\>
-  );
-};
-export const CheckboxGroupTable \= () \=> (
-  <IressForm
-    defaultValues\={{
-      'let-them-eat-cake': \['lemon-drizzle', 'victoria-sponge'\],
-    }}
-  \>
-    <IressStack gutter\="md"\>
-      <SelectedValues />
-      <IressFormFieldset
-        label\="Let them eat cake"
-        name\="let-them-eat-cake"
-        hiddenLabel
-        rules\={{ required: 'Please select a cake' }}
-        render\={(field) \=> (
-          <IressCheckboxGroup {...field} layout\="full"\>
-            <IressTable
-              caption\="Available options"
-              columns\={\[
-                { key: 'select', label: 'Select', width: '2rem' },
-                { key: 'name', label: 'Name' },
-              \]}
-              rows\={\[
-                {
-                  select: (
-                    <IressCheckbox hiddenLabel value\="lemon-drizzle"\>
-                      Select lemon drizzle                    </IressCheckbox\>
-                  ),
-                  name: 'Lemon drizzle',
-                },
-                {
-                  select: (
-                    <IressCheckbox hiddenLabel value\="victoria-sponge"\>
-                      Select Victoria Sponge                    </IressCheckbox\>
-                  ),
-                  name: 'Victoria Sponge',
-                },
-                {
-                  select: (
-                    <IressCheckbox hiddenLabel value\="carrot-cake"\>
-                      Select Carrot Cake                    </IressCheckbox\>
-                  ),
-                  name: 'Carrot Cake',
-                },
-              \]}
-            />
-          </IressCheckboxGroup\>
-        )}
-      />
-      <IressButton type\="submit" mode\="primary"\>
-        Submit      </IressButton\>
-    </IressStack\>
-  </IressForm\>
-);
-
-Copy
-
-On this page
-
-*   [Checkboxes inside an IressTable](#checkboxes-inside-an-iresstable)

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

@@ -1,466 +0,0 @@
-[](#col)Col
-===========
-
-Overview
---------
-
-Used in conjunction with the `IressRow` component to layout page content
-
-Column 1
-
-Column 2
-
-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; }
-
-<IressRow gutter\="md"\>
-  <IressCol\>
-    <IressPlaceholder\>
-      Column 1    </IressPlaceholder\>
-  </IressCol\>
-  <IressCol\>
-    <IressPlaceholder\>
-      Column 2    </IressPlaceholder\>
-  </IressCol\>
-</IressRow\>
-
-Copy
-
-[](#examples)Examples
----------------------
-
-### [](#auto-sized)Auto-sized
-
-When no column widths are specified the `IressCol` component will render equal width columns.
-
-1 of 2
-
-2 of 2
-
-1 of 3
-
-2 of 3
-
-3 of 3
-
-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; }
-
-<IressStack gutter\="md"\>
-  <IressRow gutter\="md"\>
-    <IressCol\>
-      <IressPlaceholder\>
-        1 of 2      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        2 of 2      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol\>
-      <IressPlaceholder\>
-        1 of 3      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        2 of 3      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        3 of 3      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressStack\>
-
-Copy
-
-### [](#span)Span
-
-The `span` prop controls the number of grid columns the component should span.
-
-If no `span` is provided it will default to `auto` which will make the column either fill the remaining space in the row (when used with a col number) or size evenly when used with other columns set to auto sizing.
-
-12
-
-1
-
-11
-
-2
-
-10
-
-3
-
-9
-
-4
-
-8
-
-5
-
-7
-
-6
-
-6
-
-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; }
-
-<IressStack gutter\="md"\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="12"\>
-      <IressPlaceholder\>
-        12      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="1"\>
-      <IressPlaceholder\>
-        1      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        11      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="2"\>
-      <IressPlaceholder\>
-        2      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        10      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="3"\>
-      <IressPlaceholder\>
-        3      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        9      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="4"\>
-      <IressPlaceholder\>
-        4      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        8      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="5"\>
-      <IressPlaceholder\>
-        5      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        7      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol span\="6"\>
-      <IressPlaceholder\>
-        6      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol\>
-      <IressPlaceholder\>
-        6      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressStack\>
-
-Copy
-
-### [](#responsive-span)Responsive span
-
-The `span` prop can take an object that takes five key/value pairs that correlate with the IDS breakpoints. Any missing keys will fall back to the value defined for the next smallest key.
-
-**Note:** If a `span` prop is provided an object but no value is given for `xs` it will default to `12`. This means that columns will be full width on screen sizes below the sizes you've specified.
-
-Current breakpoint: **xl** breakpoint (1200px - 1499px).
-
-Column 1  
-{"xs":12,"md":3}
-
-Column 2  
-{"xs":12,"md":9}
-
-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; }
-
-<IressStack gutter\="md"\>
-  <IressPanel\>
-    Current breakpoint:{' '}
-    <CurrentBreakpoint />
-    .  </IressPanel\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      span\={{
-        md: 3,
-        xs: 12
-      }}
-    \>
-      <IressPlaceholder\>
-        <IressText align\="center"\>
-          Column 1          <br />
-          {\`{"xs":12,"md":3}\`}
-        </IressText\>
-      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol
-      span\={{
-        md: 9,
-        xs: 12
-      }}
-    \>
-      <IressPlaceholder\>
-        <IressText align\="center"\>
-          Column 2          <br />
-          {\`{"xs":12,"md":9}\`}
-        </IressText\>
-      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressStack\>
-
-Copy
-
-### [](#offset)Offset
-
-The `offset` prop controls the amount of grid columns to offset.
-
-1
-
-2
-
-3
-
-4
-
-5
-
-6
-
-7
-
-8
-
-9
-
-10
-
-11
-
-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; }
-
-<IressStack gutter\="md"\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="1"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        1      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="2"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        2      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="3"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        3      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="4"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        4      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="5"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        5      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="6"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        6      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="7"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        7      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="8"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        8      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="9"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        9      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="10"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        10      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\="11"
-      span\="1"
-    \>
-      <IressPlaceholder\>
-        11      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressStack\>
-
-Copy
-
-### [](#responsive-offset)Responsive offset
-
-When a `ResponsiveSizing` object is passed into the `offset` prop, the offset will change at the specified breakpoints. It will apply to all breakpoints above the specified breakpoint.
-
-For example, if you specify an offset for `md`, it will apply to `lg`, `xl` and `xxl` as well. If you want to change the offset at a specific breakpoint, you can pass in an object with the breakpoint as the key and the offset as the value.
-
-Current breakpoint: **xl** breakpoint (1200px - 1499px).
-
-Column 1  
-{"lg":2}
-
-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; }
-
-<IressStack gutter\="md"\>
-  <IressPanel\>
-    Current breakpoint:{' '}
-    <CurrentBreakpoint />
-    .  </IressPanel\>
-  <IressRow gutter\="md"\>
-    <IressCol
-      offset\={{
-        lg: 2
-      }}
-    \>
-      <IressPlaceholder\>
-        <IressText align\="center"\>
-          Column 1          <br />
-          {\`{"lg":2}\`}
-        </IressText\>
-      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressStack\>
-
-Copy
-
-### [](#align-self)Align self
-
-The `alignSelf` prop controls the vertical alignment of the column (use if column alignment needs to differ from other columns in the row).
-
-Start
-
-Center
-
-End
-
-Stretch
-
-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\>
-  <IressRow
-    className\="ids-styles--set-height-v5150"
-    gutter\="md"
-  \>
-    <IressCol alignSelf\="start"\>
-      <IressPlaceholder\>
-        Start      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol alignSelf\="center"\>
-      <IressPlaceholder\>
-        Center      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol alignSelf\="end"\>
-      <IressPlaceholder\>
-        End      </IressPlaceholder\>
-    </IressCol\>
-    <IressCol alignSelf\="stretch"\>
-      <IressPlaceholder stretch\>
-        Stretch      </IressPlaceholder\>
-    </IressCol\>
-  </IressRow\>
-</IressContainer\>
-
-Copy
-
-On this page
-
-*   [Overview](#overview)
-*   [Props](#props)
-*   [Examples](#examples)
-    *   [Auto-sized](#auto-sized)
-    *   [Span](#span)
-    *   [Responsive span](#responsive-span)
-    *   [Offset](#offset)
-    *   [Responsive offset](#responsive-offset)
-    *   [Align self](#align-self)