@iress-oss/ids-mcp-server 0.0.1 → 5.14.2

package/docs/ids/resources-migration-guides-from-v4-to-v5-docs.md

@@ -1,639 +0,0 @@
-[](#migration-from-v4-to-v5)Migration from v4 to v5
-===================================================
-
-This is a step-by-step guide for upgrading your application from IDS v4 to v5. To learn more about the benefits of upgrading, see the [IDS v5 initiative Atlas post](https://team.atlassian.com/project/IRESS4-19/about).
-
-[](#updating-your-dependencies)Updating your dependencies
----------------------------------------------------------
-
-### [](#upgrade-ids-and-themes)Upgrade IDS and themes
-
-Update your dependencies in your `package.json` file to the following:
-
-\[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;
-}
-
-"dependencies": {
-  "@iress/ids-components": "^5.0.0",
-  "@iress/themes": "^5.0.0"
-}
-
-Copy
-
-or run:
-
-\[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;
-}
-
-yarn add @iress/ids-components@^5.0.0 @iress/themes@^5.0.0
-
-Copy
-
-### [](#upgrade-react)Upgrade React
-
-The minimum required version of React is 17. If you are using an older version of React, you will need to update it.
-
-[](#updating-imports)Updating imports
--------------------------------------
-
-### [](#changing-components)Changing components
-
-Update your imports to the new package name:
-
-\-
-
-import { IressButton } from '@iress/components-react';
-
-+
-
-import { IressButton } from '@iress/ids-components';
-
-You can run both packages together, so you can migrate components one by one.
-
-\-
-
-import { IressModal, IressButton } from '@iress/components-react';
-
-+
-
-import { IressModal } from '@iress/components-react';
-
-+
-
-import { IressButton } from '@iress/ids-components';
-
-### [](#importing-component-styles)Importing component styles
-
-IDS v5 no longer injects CSS into the DOM. You will need to import the stylesheet directly into your application.
-
-\[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 '@iress/ids-components/dist/style.css';
-
-Copy
-
-[](#update-jest-configuration)Update Jest configuration
--------------------------------------------------------
-
-If you are using Jest, you will need to update your Jest configuration to add the new IDS package to your `transformIgnorePatterns`.
-
-**Note:** If you are using version 4 and version 5 in parallel, you will need to keep the old IDS packages in your `transformIgnorePatterns` until you have completely migrated over your components.
-
-\[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;
-}
-
-"transformIgnorePatterns": \[
-  "/node\_modules/(?!@iress/ids-components)"
-\]
-
-Copy
-
-If you are mocking CSS files for your tests, you'll also need to make sure the new stylesheet is matched by your `moduleNameMapper`:
-
-  "moduleNameMapper": {
-
-    "^.+\\.(scss|less)$": "<rootDir>/test/style-mock.ts",
-
-    "ids-web-components.css$": "<rootDir>/test/style-mock.ts",
-
-\-
-
-    "global.css$": "<rootDir>/test/style-mock.ts"
-
-+
-
-    "global.css$": "<rootDir>/test/style-mock.ts",
-
-+
-
-    "@iress/ids-components/(.\*).css": "<rootDir>/test/style-mock.ts"
-
-  },
-
-[](#handling-breaking-changes)Handling breaking changes
--------------------------------------------------------
-
-### [](#components)Components
-
-Since the move to React, the majority of the components have been simplified to improve developer experience. We have listed the changes in this google doc by component, so you can attend to each component separately.
-
-[](https://docs.google.com/document/d/1H3-zFDftCHDjwaFkwFxVo1uziPsOj8qJn7p3NFG3aUg/edit)
-
-[Google doc](https://docs.google.com/document/d/1H3-zFDftCHDjwaFkwFxVo1uziPsOj8qJn7p3NFG3aUg/edit)
-
-### [](#testing)Testing
-
-Components are no longer loaded asynchronously, so you can test them as you would any other React component. The testing utilities have been removed from the package, so you will need to update your tests to use [React Testing Library](https://testing-library.com/docs/react-testing-library/intro/) or another testing library.
-
-Below is an example of a changed test using React Testing Library.
-
-Mode
-
-DiffOldNew
-
-\-
-
-import { render } from '@testing-library/react';
-
-+
-
-import { render, fireEvent } from '@testing-library/react';
-
-\-
-
-import { idsFireEvent } from '@iress/ids-react-test-utils';
-
-\-
-
-+
-
-test('login form', () => {
-
-\-
-
-test('login form', async () => {
-
-    const loginMock = jest.fn();
-
-    const screen = render(<LoginForm loginUser={loginMock}/>);
-
-\-
-
-    const usernameInput = await screen.findByTestId('username\_\_input');
-
-+
-
-    const usernameInput = screen.getByRole('textbox', { name: 'Username' });
-
-\-
-
-    const passwordInput = await screen.findByTestId('password\_\_input');
-
-+
-
-    const passwordInput = screen.getByRole('textbox', { name: 'Password' });
-
-\-
-
-    const submitBtn = await screen.findByTestId('submit-btn\_\_button');
-
-+
-
-    const submitBtn = screen.getByRole('button');
-
-\-
-
-    idsFireEvent.change(usernameInput, { target: { value: 'joe.bloggs' }});
-
-+
-
-    fireEvent.change(usernameInput, { target: { value: 'joe.bloggs' }});
-
-\-
-
-    idsFireEvent.change(passwordInput, { target: { value: '1234' }});
-
-+
-
-    fireEvent.change(passwordInput, { target: { value: '1234' }});
-
-\-
-
-    idsFireEvent.click(submitBtn);
-
-+
-
-    fireEvent.click(submitBtn);
-
-    expect(loginMock).toHaveBeenCalledWith("joe.bloggs", "1234");
-
-});
-
-#### [](#component-specific-testing)Component specific testing
-
-Some components have additional testing requirements. The changed testing requirements will be listed on each component's docs page.
-
-These include:
-
-*   [Form](./?path=/docs/components-form--docs#testing)
-*   [Modal](./?path=/docs/components-modal--docs#testing)
-*   [Slideout](./?path=/docs/components-slideout--docs#testing)
-
-### [](#styling)Styling
-
-The original CSS framework used for IDS was based on the Stencil library. It was lightly scoped (no shadow DOM) using CSS classes like: `sc-iress-radio-h sc-iress-radio-s`.
-
-These classes have been removed from version 5. If you are targeting components using these classes, it will be good for you review if you should adapt the CSS in a different way (ie. using design tokens/CSS variables instead, which should work no matter the class name, or adding custom classes to the IDS components). If targeting elements is still required, the new classes will be formatted as: `.ids-radio-${ids-version}`, and nested elements will use a modified BEM naming convention: `.ids-radio--label-${ids-version}`. The version number will be exposed; you can import it via Javascript, SASS and CSS module values to make future upgrades easier.
-
-#### [](#option-1-use-design-tokens-and-custom-classes)Option 1: Use design tokens and custom classes
-
-This is the recommended approach. You can use design tokens and custom classes to style the components.
-
-\[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;
-}
-
-.custom-radio {
-  \--iress-text-color: red;
-  align-self: center;
-}
-
-Copy
-
-\[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;
-}
-
-<IressRadio className\="custom-radio" />
-
-Copy
-
-#### [](#option-2-target-the-new-classes)Option 2: Target the new classes
-
-This option is **not recommended** and should be used as a last resort, as the class names can change in future, in which case your stylesheet will no longer have any effect. It is recommended to use design tokens or custom classes instead.
-
-\[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;
-}
-
-@use '@iress/ids-components/dist/constants/index.scss' as \*;
-.ids-radio-#{$ids-version} {
-  align-self: center;
-}
-
-.ids-radio--label-#{$ids-version} {
-  color: red;
-}
-
-Copy
-
-### [](#theme-tokens)Theme tokens
-
-There are a few token changes that have changed (though this has been relatively minor). The version 5 themes have been updated to use the new design tokens, however if you are using version 4 in parallel with version 5, you may notice that the version 4 styles can no longer find the removed/changed tokens.
-
-To fix this issue, please backfill the tokens in your application until you have finished your migration.
-
-\[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;
-}
-
-/\* TODO: Will be removed once we have moved to IDS version 5 \*/
-/\* Change to the name(s) of the themes you want to back fill. \*/
-.iress-theme-light {
-  --iress-alert-error-text-color: var(--iress-alert-danger-text-color);
-  --iress-alert-error-background-color: var(
-    --iress-alert-danger-background-color
-  );
-  --iress-alert-error-border-color: var(--iress-alert-danger-border-color);
-  --iress-alert-error-heading-icon-text-color: var(
-    --iress-alert-danger-heading-icon-text-color
-  );
-
-  --iress-button-margin-right: var(--iress-g-spacing-xs);
-
-  --iress-combobox-option-meta-font-weight: var(
-    --iress-a-muted-font-weight,
-    var(--iress-g-font-weight, normal)
-  );
-  --iress-combobox-option-meta-text-color: var(
-    --iress-g-muted-text-color,
-    var(--iress-default-text-color--light)
-  );
-
-  --iress-filter-option-meta-font-weight: var(
-    --iress-a-muted-font-weight,
-    var(--iress-g-font-weight, normal)
-  );
-  --iress-filter-option-meta-text-color: var(
-    --iress-g-muted-text-color,
-    var(--iress-default-text-color--light)
-  );
-
-  --iress-form-field-margin-bottom: var(
-    --iress-a-vertical-spacing-lg,
-    var(--iress-g-spacing-lg)
-  );
-
-  --iress-table-cell-buy-text-color: var(
-    --iress-table-cell-positive-text-color
-  );
-  --iress-table-cell-sell-text-color: var(
-    --iress-table-cell-negative-text-color
-  );
-  --iress-table-cell-selected-buy-text-color: var(
-    --iress-table-cell-selected-positive-text-color
-  );
-  --iress-table-cell-selected-sell-text-color: var(
-    --iress-table-cell-selected-negative-text-color
-  );
-
-  --iress-validation-message-error-text-color: var(
-    --iress-validation-message-danger-text-color
-  );
-}
-
-Copy
-
-[](#ag-grid-theme)AG grid theme
--------------------------------
-
-As of version 5, we only support the lite AG grid theme, which is used in conjunction with the default alpine theme. In version 5, its imports have changed slightly.
-
-Run the following command to install the AG grid lite theme:
-
-\[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;
-}
-
-yarn add @iress/ag-grid-theme@^5.0.0
-
-Copy
-
-Then you can import the AG Grid theme CSS, import the relevant IDS theme, and hook up the styles by setting a class of ag-theme-alpine ag-theme-iress-lite on your grid wrapper.
-
-Mode
-
-DiffOldNew
-
-import "@iress/themes/build/css/iress-theme-dark.css";
-
-\-
-
-import "@iress/themes/global.css";
-
-import 'ag-grid-community/styles/ag-grid.css';
-
-import 'ag-grid-community/styles/ag-theme-alpine.css';
-
-\-
-
-import '@iress/ag-grid-theme/dist/lite/css/all.css';
-
-+
-
-import '@iress/ag-grid-theme/dist/ag-theme-iress-lite.css';
-
-// You can also include variables, styles and utilities separately for easy debugging
-
-\-
-
-// import '@iress/ag-grid-theme/dist/lite/css/variables.css';
-
-+
-
-// import '@iress/ag-grid-theme/dist/css/variables.css';
-
-\-
-
-// import '@iress/ag-grid-theme/dist/lite/css/styles.css';
-
-+
-
-// import '@iress/ag-grid-theme/dist/css/styles.css';
-
-\-
-
-// import '@iress/ag-grid-theme/dist/lite/css/utilities.css';
-
-+
-
-// import '@iress/ag-grid-theme/dist/css/utilities.css';
-
-<div className="ag-theme-alpine ag-theme-iress-lite">
-
-  <AgGridReact />
-
-</div>
-
-[](#removing-version-4)Removing version 4
------------------------------------------
-
-Version 5 and version 4 can be run in parallel, but it is recommended to remove version 4 to avoid any conflicts once you have completely migrated over your components.
-
-Run the following to remove version 4 and its related packages:
-
-\[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;
-}
-
-yarn remove @iress/components @iress/components-react @iress/components-react-custom-elements @iress/ids-react-test-utils
-
-Copy
-
-### [](#remove-globalcss)Remove `global.css`
-
-The `global.css` file has been removed, it is now recommended to include the Roboto font directly using Google Fonts.
-
-\-
-
-import '@iress/themes/global.css';
-
-+
-
-<link
-
-+
-
-  href="https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;700&display=swap"
-
-+
-
-  rel="stylesheet"
-
-+
-
-/>
-
-### [](#remove-from-jest-configuration)Remove from Jest configuration
-
-If you are using Jest, you will need to update your Jest configuration to remove the old IDS packages from your `transformIgnorePatterns`.
-
-"transformIgnorePatterns": \[
-
-\-
-
-  "node\_modules/(?!(@iress/components-react|@iress/components|@iress/components-react-custom-elements|@stencil/core)/)"
-
-+
-
-  "/node\_modules/(?!@iress/ids-components)"
-
-\]
-
-You can also remove the `mockLazyLoadedComponents` function from your Jest setup.
-
-\-
-
-import { mockLazyLoadedComponents } from '@iress/ids-react-test-utils/dist/react-test-utils/src/mocks/mockLazyLoadedComponents';
-
-\-
-
-mockLazyLoadedComponents();
-
-You should also be able to remove the style mocks from your Jest configuration's `moduleNameMapper`, unless you are using CSS-in-JS, as IDS no longer injects CSS into the DOM.
-
-\-
-
-"moduleNameMapper": {
-
-\-
-
-  "\\.css$": "<rootDir>/PATH/TO/style-mock.ts"
-
-\-
-
-}
-
-On this page
-
-*   [Updating your dependencies](#updating-your-dependencies)
-    *   [Upgrade IDS and themes](#upgrade-ids-and-themes)
-    *   [Upgrade React](#upgrade-react)
-*   [Updating imports](#updating-imports)
-    *   [Changing components](#changing-components)
-    *   [Importing component styles](#importing-component-styles)
-*   [Update Jest configuration](#update-jest-configuration)
-*   [Handling breaking changes](#handling-breaking-changes)
-    *   [Components](#components)
-    *   [Testing](#testing)
-    *   [Styling](#styling)
-    *   [Theme tokens](#theme-tokens)
-*   [AG grid theme](#ag-grid-theme)
-*   [Removing version 4](#removing-version-4)
-    *   [Remove global.css](#remove-globalcss)
-    *   [Remove from Jest configuration](#remove-from-jest-configuration)

package/docs/ids/themes-available-themes-docs.md

@@ -1,74 +0,0 @@
-[](#available-themes)Available themes
-=====================================
-
-These are the available themes you can apply to Iress products. If you are using the component library, these themes will automatically style the components to match the theme.
-
-[](#versions)Versions
----------------------
-
-Themes are no longer connected to the version of IDS you are using. Instead they will support a range of IDS versions.
-
-`@iress/ids-themes`
-
-`@iress/ids-components`
-
-5.x
-
-5.x
-
-4.x
-
-3.x - 4.x
-
-3.x
-
-3.x - 4.x
-
-[](#list)List
--------------
-
-Version: 5.4.0-29129
-
-* * *
-
-5.4.0-29129Latest5.3.2-290865.3.1-290285.3.0-258735.2.2-257575.2.1-254255.2.0-276985.1.1-276795.1.0-274635.0.4-249285.0.3-240325.0.2-23713
-
-None selected
-
-Latest build only
-
-* * *
-
-### Version: 5.4.0-29129
-
-*   [css/demo-theme-1--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-1--touch.css)
-*   [css/demo-theme-1.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-1.css)
-*   [css/demo-theme-2--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-2--touch.css)
-*   [css/demo-theme-2.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-2.css)
-*   [css/demo-theme-3--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-3--touch.css)
-*   [css/demo-theme-3.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-3.css)
-*   [css/demo-theme-4--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-4--touch.css)
-*   [css/demo-theme-4.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-4.css)
-*   [css/demo-theme-5--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-5--touch.css)
-*   [css/demo-theme-5.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/demo-theme-5.css)
-*   [css/hostplus-theme-light--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/hostplus-theme-light--touch.css)
-*   [css/hostplus-theme-light.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/hostplus-theme-light.css)
-*   [css/iress-beta-theme-dark--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-beta-theme-dark--touch.css)
-*   [css/iress-beta-theme-dark.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-beta-theme-dark.css)
-*   [css/iress-beta-theme-light--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-beta-theme-light--touch.css)
-*   [css/iress-beta-theme-light.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-beta-theme-light.css)
-*   [css/iress-theme-dark--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-dark--touch.css)
-*   [css/iress-theme-dark.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-dark.css)
-*   [css/iress-theme-light--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-light--touch.css)
-*   [css/iress-theme-light.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-light.css)
-*   [css/iress-theme-wealth--touch.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-wealth--touch.css)
-*   [css/iress-theme-wealth.css](https://cdn-staging.iress.com/ids/5.4.0-29129/themes/css/iress-theme-wealth.css)
-
-#### Theme mappings
-
-*   [ag-theme-iress-lite.css](https://cdn-staging.iress.com/ids/5.4.0-29129/ag-theme-iress-lite.css)
-
-On this page
-
-*   [Versions](#versions)
-*   [List](#list)