@iress-oss/ids-mcp-server 6.0.0-alpha.1-canary-20251204032753-fe18cab → 6.0.0-alpha.1-canary-20251204040305-3639454

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

@@ -0,0 +1,608 @@
+Validation message
+==================
+
+Overview
+--------
+
+A validation message is used to inform the user of the status of a form input. If there are multiple messages, they can be combined using the `IressValidationSummary` component.
+
+* * *
+
+Updated
+
+**Recently updated**
+
+This component has been recently updated with new props. The props have been marked as beta. Please tell us if there are any issues.
+
+[](./iframe.html?id=components-validationmessage--default)
+
+Error:
+
+Validation message
+
+```
+
+<IressValidationMessage\>
+  Validation message
+</IressValidationMessage\>
+
+```
+
+Props
+-----
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| children | 
+Validation content (what went wrong, what went right).
+
+ReactNode
+
+
+
+ | \- | 
+
+"Validation message"
+
+ |
+| linkToTarget | 
+
+ID of element the message is describing. If nothing is supplied a link will not render.
+
+TLinkToTarget
+
+
+
+ | \- | Set object |
+| onClick | 
+
+Emitted when the message is clicked.
+
+MouseEventHandler
+
+
+
+ | \- | Set object |
+| prefix | 
+
+Prefix to the validation message. Will be `status` prop if nothing is provided.
+
+ReactNode
+
+
+
+ | \- | Set object |
+| status | 
+
+Whether message is danger, warning, success or info. **Note**: danger is translated to Error when used as the prefix.
+
+SystemValidationStatuses
+
+
+
+ | 
+
+'danger'
+
+ | Set object |
+| visiblePrefix | 
+
+If set to true, the prefix will be visually displayed (default is only available to screen readers)
+
+boolean
+
+
+
+ | 
+
+false
+
+ | Set boolean |
+
+Examples
+--------
+
+### Status
+
+Validation status is controlled by the status prop. It defaults to `error`.
+
+[](./iframe.html?id=components-validationmessage--status)
+
+Error:
+
+Something is wrong.
+
+Info:
+
+Something you should know.
+
+Success:
+
+Something went right.
+
+Warning:
+
+Something could go wrong.
+
+```
+
+<IressStack\>
+  <IressValidationMessage status\="danger"\>
+    Something is wrong.  </IressValidationMessage\>
+  <IressValidationMessage status\="info"\>
+    Something you should know.  </IressValidationMessage\>
+  <IressValidationMessage status\="success"\>
+    Something went right.  </IressValidationMessage\>
+  <IressValidationMessage status\="warning"\>
+    Something could go wrong.  </IressValidationMessage\>
+</IressStack\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| children | 
+Validation content (what went wrong, what went right).
+
+ReactNode
+
+
+
+ | \- | \- |
+| linkToTarget | 
+
+ID of element the message is describing. If nothing is supplied a link will not render.
+
+TLinkToTarget
+
+
+
+ | \- | Set object |
+| onClick | 
+
+Emitted when the message is clicked.
+
+MouseEventHandler
+
+
+
+ | \- | Set object |
+| prefix | 
+
+Prefix to the validation message. Will be `status` prop if nothing is provided.
+
+ReactNode
+
+
+
+ | \- | Set object |
+| status | 
+
+Whether message is danger, warning, success or info. **Note**: danger is translated to Error when used as the prefix.
+
+SystemValidationStatuses
+
+
+
+ | 
+
+'danger'
+
+ | \- |
+| visiblePrefix | 
+
+If set to true, the prefix will be visually displayed (default is only available to screen readers)
+
+boolean
+
+
+
+ | 
+
+false
+
+ | Set boolean |
+| Show Storybook only itemsStorybook only | Show Storybook only items |
+
+### Prefix
+
+You can add a prefix to the message. If not provided, it uses the `status` prop to determine the prefix.
+
+It is hidden by default, but can be shown by setting the `visiblePrefix` prop to `true`.
+
+[](./iframe.html?id=components-validationmessage--prefix)
+
+Prefix:
+
+Something is wrong.
+
+Prefix:
+
+Something you should know.
+
+Prefix:
+
+Something went right.
+
+Prefix:
+
+Something could go wrong.
+
+```
+
+<IressStack\>
+  <IressValidationMessage
+    prefix\="Prefix: "
+    status\="danger"
+    visiblePrefix
+  \>
+    Something is wrong.  </IressValidationMessage\>
+  <IressValidationMessage
+    prefix\="Prefix: "
+    status\="info"
+    visiblePrefix
+  \>
+    Something you should know.  </IressValidationMessage\>
+  <IressValidationMessage
+    prefix\="Prefix: "
+    status\="success"
+    visiblePrefix
+  \>
+    Something went right.  </IressValidationMessage\>
+  <IressValidationMessage
+    prefix\="Prefix: "
+    status\="warning"
+    visiblePrefix
+  \>
+    Something could go wrong.  </IressValidationMessage\>
+</IressStack\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| children | 
+Validation content (what went wrong, what went right).
+
+ReactNode
+
+
+
+ | \- | \- |
+| linkToTarget | 
+
+ID of element the message is describing. If nothing is supplied a link will not render.
+
+TLinkToTarget
+
+
+
+ | \- | Set object |
+| onClick | 
+
+Emitted when the message is clicked.
+
+MouseEventHandler
+
+
+
+ | \- | Set object |
+| prefix | 
+
+Prefix to the validation message. Will be `status` prop if nothing is provided.
+
+ReactNode
+
+
+
+ | \- | 
+
+"Prefix: "
+
+ |
+| status | 
+
+Whether message is danger, warning, success or info. **Note**: danger is translated to Error when used as the prefix.
+
+SystemValidationStatuses
+
+
+
+ | 
+
+'danger'
+
+ | \- |
+| visiblePrefix | 
+
+If set to true, the prefix will be visually displayed (default is only available to screen readers)
+
+boolean
+
+
+
+ | 
+
+false
+
+ | FalseTrue |
+| Show Storybook only itemsStorybook only | Show Storybook only items |
+
+### Link to target
+
+You can use the `linkToTarget` prop to link the message to a specific target in the DOM. This is useful to take the user to a specific part of the form when they click on the message.
+
+[](./iframe.html?id=components-validationmessage--link-to-target)
+
+[
+
+Error:
+
+Something is wrong.
+
+](#input)[
+
+Info:
+
+Something you should know.
+
+](#input)[
+
+Success:
+
+Something went right.
+
+](#input)[
+
+Warning:
+
+Something could go wrong.
+
+](#input)
+
+* * *
+
+```
+
+<IressStack gap\="md"\>
+  <IressStack\>
+    <IressValidationMessage
+      linkToTarget\="input"
+      status\="danger"
+    \>
+      Something is wrong.    </IressValidationMessage\>
+    <IressValidationMessage
+      linkToTarget\="input"
+      status\="info"
+    \>
+      Something you should know.    </IressValidationMessage\>
+    <IressValidationMessage
+      linkToTarget\="input"
+      status\="success"
+    \>
+      Something went right.    </IressValidationMessage\>
+    <IressValidationMessage
+      linkToTarget\="input"
+      status\="warning"
+    \>
+      Something could go wrong.    </IressValidationMessage\>
+  </IressStack\>
+  <IressDivider />
+  <IressInput id\="input" />
+</IressStack\>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| children | 
+Validation content (what went wrong, what went right).
+
+ReactNode
+
+
+
+ | \- | \- |
+| linkToTarget | 
+
+ID of element the message is describing. If nothing is supplied a link will not render.
+
+TLinkToTarget
+
+
+
+ | \- | 
+
+"input"
+
+ |
+| onClick | 
+
+Emitted when the message is clicked.
+
+MouseEventHandler
+
+
+
+ | \- | Set object |
+| prefix | 
+
+Prefix to the validation message. Will be `status` prop if nothing is provided.
+
+ReactNode
+
+
+
+ | \- | Set object |
+| status | 
+
+Whether message is danger, warning, success or info. **Note**: danger is translated to Error when used as the prefix.
+
+SystemValidationStatuses
+
+
+
+ | 
+
+'danger'
+
+ | \- |
+| visiblePrefix | 
+
+If set to true, the prefix will be visually displayed (default is only available to screen readers)
+
+boolean
+
+
+
+ | 
+
+false
+
+ | Set boolean |
+| Show Storybook only itemsStorybook only | Show Storybook only items |
+
+`IressValidationSummary`
+------------------------
+
+Messages can be passed programmatically as a `ValidationMessageObj[]` using the `messages` prop of the `IressValidationSummary` component.
+
+[](./iframe.html?id=components-validationmessage-validationsummary--validation-summary)
+
+*   Info:
+    
+    Something you should know.
+    
+*   Error:
+    
+    Something is wrong.
+    
+*   Warning:
+    
+    Something could go wrong.
+    
+*   Success:
+    
+    Something went right.
+    
+
+```
+
+<IressValidationSummary
+ messages\={\[
+   {
+     message: 'Something you should know.',
+     status: 'info'
+   },
+   {
+     message: 'Something is wrong.',
+     status: 'danger'
+   },
+   {
+     message: 'Something could go wrong.',
+     status: 'warning'
+   },
+   {
+     message: 'Something went right.',
+     status: 'success'
+   }
+ \]}
+/>
+
+```
+
+#### Props
+
+| Name | Description | Default | Control |
+| --- | --- | --- | --- |
+| itemStyle | 
+Add additional styles to each item in the list.
+
+IressCustomiseSlot
+
+
+
+ | \- | Set object |
+| linkToTarget | 
+
+Renders validation messages as links pointing at the field it relates to, specified as a string Only works when used with the `messages` prop.
+
+string
+
+
+
+ | \- | Set string |
+| messages | 
+
+ValidationMessage Array containing the `id` of the field and the validation message
+
+ValidationMessageObj\[\]
+
+ | \[\] | 
+
+RAW
+
+*   messages :
+    
+    \[
+    
+    *   0 :
+        
+        {...} 2 keys
+        
+    *   1 :
+        
+        {...} 2 keys
+        
+    *   2 :
+        
+        {...} 2 keys
+        
+    *   3 :
+        
+        {...} 2 keys
+        
+    
+    \]
+    
+
+
+
+ |
+| prefix | 
+
+Prefix to all validation messages. Will be `status` prop if nothing is provided.
+
+ReactNode
+
+
+
+ | \- | Set object |
+| status | 
+
+Status for all child ValidationMessage components
+
+SystemValidationStatuses
+
+
+
+ | 
+
+'danger'
+
+ | Set object |
+| visiblePrefix | 
+
+If set to true, the prefix will be visually displayed (default is only available to screen readers)
+
+boolean
+
+
+
+ | \- | Set boolean |

package/generated/docs/components_contact-us-docs.md

@@ -0,0 +1,9 @@
+Contact us
+==========
+
+For support and feature requests, please reach out to us at our Slack channel.
+
+Team
+----
+
+Front-End Enablement (FEE) are the guys and gals making it happen, and you'll probably see us on Iress support channels. Please contact us if you need help with IDS or have any questions. We are here to help you.

package/generated/docs/components_foundations-accessibility-docs.md

@@ -0,0 +1,33 @@
+Accessibility
+=============
+
+Accessibility is everyone's responsibility. It ensures that all users, regardless of their abilities or disabilities, can access and interact with our components effectively. This document outlines the key practices for building accessible components we follow within IDS.
+
+Please note: The default behaviour of our components is to be accessible, but it is the responsibility of the product to ensure that they are used correctly in accessibile context, or any modifications made to them do not compromise accessibility.
+
+Interaction Patterns
+--------------------
+
+### Keyboard Navigation
+
+*   Support standard keyboard shortcuts (Tab, Arrow keys, Enter, Space, Escape)
+*   Implement proper focus order and visual focus indicators
+*   Provide keyboard alternatives for mouse-only interactions
+*   Follow established ARIA patterns for complex widgets
+
+### Touch Interactions
+
+*   Provide adequate touch target sizes (minimum 44px)
+*   Implement touch-friendly spacing between interactive elements
+*   Support gesture-based interactions where appropriate
+*   Ensure consistent behaviour across device types
+
+### Loading and Feedback
+
+*   Use appropriate loading patterns based on context:
+    *   **Page**: Full page loading states
+    *   **Component**: Local loading within sections
+    *   **Button**: Inline loading for form submissions
+    *   **Validate**: Server-side validation feedback
+*   Provide clear success and error feedback
+*   Use progressive enhancement for better perceived performance

package/generated/docs/components_foundations-consistency-docs.md

@@ -0,0 +1,44 @@
+Using components consistently
+=============================
+
+Buttons
+-------
+
+*   **Primary**: Limit to one per view for main call-to-action
+*   **Secondary**: Use for secondary actions
+*   **Tertiary**: Extra affordance between secondary actions
+*   **Link**: Button styled as link (avoid with icon-only content)
+*   **Danger**: Destructive actions requiring extra confirmation
+*   **Positive/Negative**: Financial transactions (buy/sell)
+
+Forms
+-----
+
+*   Always use `IressField` wrapper for proper label, hint, and error placement
+*   Provide clear validation feedback with appropriate error messages
+*   Use consistent input sizing based on expected content length
+*   Implement proper form state management and accessibility
+
+Navigation
+----------
+
+*   Use semantic HTML5 navigation elements
+*   Provide skip links for keyboard users
+*   Implement proper ARIA labelling for navigation sections
+*   Ensure consistent navigation patterns across applications
+
+Data Display
+------------
+
+*   Use semantic table structures with proper headers
+*   Provide clear visual hierarchy in data presentations
+*   Implement consistent sorting and filtering patterns
+*   Use appropriate loading states for data-heavy components
+
+Modals and Overlays
+-------------------
+
+*   Reserve modals for critical tasks requiring full attention
+*   Provide multiple dismissal methods (backdrop, escape key, close button)
+*   Implement proper focus management and restoration
+*   Use slideouts for supplementary tasks where underlying content needs visibility

package/generated/docs/components_foundations-content-docs.md

@@ -0,0 +1,18 @@
+Content
+=======
+
+Microcopy Guidelines
+--------------------
+
+*   Use clear, concise language that matches user mental models
+*   Provide helpful error messages with actionable guidance
+*   Implement consistent tone of voice across all interface text
+*   Use progressive disclosure for complex information
+
+Iconography
+-----------
+
+*   Use icons consistently with established meanings
+*   Provide screen reader text for meaningful icons
+*   Avoid using icons as the sole means of communication
+*   Maintain consistent icon sizing and alignment

package/generated/docs/components_foundations-introduction-docs.md

@@ -0,0 +1,17 @@
+Introduction
+============
+
+The IDS and product design team use the foundations to create a consistent user experience across all Iress products. This includes design principles and guidelines that ensure a cohesive look and feel.
+
+1.  [Principles](/?path=/docs/foundations-principles--docs)
+2.  [Accessibility](/?path=/docs/foundations-accessibility--docs)
+3.  [Tokens](/?path=/docs/foundations-tokens-introduction--docs)
+4.  [Breakpoints](/?path=/docs/foundations-breakpoints--docs)
+5.  [Consistency](/?path=/docs/foundations-consistency--docs)
+6.  [Grid](/?path=/docs/foundations-grid--docs)
+7.  [Content](/?path=/docs/foundations-content--docs)
+8.  [User Experience](/?path=/docs/foundations-user-experience--docs)
+9.  [Visual Design](/?path=/docs/foundations-visual-design--docs)
+10.  [Z-index (stacking)](/?path=/docs/foundations-z-index-stacking--docs)
+
+_This document is a living standard. Revisit and revise regularly to reflect evolving needs, technologies, and user expectations._