From 914109c91e87cdcad2f945216f22e9d036943e75 Mon Sep 17 00:00:00 2001 From: Rick Mason Date: Thu, 24 Mar 2022 11:09:59 +0000 Subject: [PATCH 1/2] Update govuk-frontend to v4.0.1 AB#97696 --- package.json | 2 +- packages/forms/package.json | 2 +- packages/theming/package.json | 2 +- yarn.lock | 22 +++++++++++----------- 4 files changed, 14 insertions(+), 14 deletions(-) diff --git a/package.json b/package.json index 90ea5d08..ae22b8bc 100644 --- a/package.json +++ b/package.json @@ -54,7 +54,7 @@ "docz": "^2.3.1", "gatsby-plugin-sass": "^3.2.0", "gatsby-theme-docz": "^2.3.1", - "govuk-frontend": "^3.14.0", + "govuk-frontend": "4.0.1", "husky": "^4.3.8", "identity-obj-proxy": "^3.0.0", "immutability-helper": "^3.1.1", diff --git a/packages/forms/package.json b/packages/forms/package.json index 38caa89f..ff0f28ea 100644 --- a/packages/forms/package.json +++ b/packages/forms/package.json @@ -45,7 +45,7 @@ "@types/qs": "^6.9.5", "date-fns": "^2.17.0", "final-form": "^4.20.1", - "govuk-frontend": "^3.14.0", + "govuk-frontend": "^4.0.1", "lodash.isequal": "^4.5.0", "lodash.merge": "^4.6.2", "qs": "^6.9.6", diff --git a/packages/theming/package.json b/packages/theming/package.json index 0f036f3f..1e434943 100644 --- a/packages/theming/package.json +++ b/packages/theming/package.json @@ -34,7 +34,7 @@ "react-dom": "^16.14.0" }, "dependencies": { - "govuk-frontend": "^3.14.0", + "govuk-frontend": "^4.0.1", "normalize.css": "^8.0.1", "tslib": "^2.1.0" }, diff --git a/yarn.lock b/yarn.lock index 64c94662..e1825679 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3674,7 +3674,7 @@ integrity sha512-RbzJvlNzmRq5c3O09UipeuXno4tA1FE6ikOjxZK0tuxVv3412l64l5t1W5pj4+rJq9vpkm/kwiR07aZXnsKPxw== "@tpr/core@file:./packages/core": - version "3.0.5" + version "4.0.0" dependencies: "@xstate/react" "^1.2.2" final-form "^4.20.1" @@ -3684,7 +3684,7 @@ xstate "^4.16.2" "@tpr/forms@file:./packages/forms": - version "4.1.14" + version "5.0.0" dependencies: "@financial-times/accessible-autocomplete" "^2.2.1" "@tpr/govuk-react-jsx" "^6.2.1" @@ -3693,7 +3693,7 @@ "@types/qs" "^6.9.5" date-fns "^2.17.0" final-form "^4.20.1" - govuk-frontend "^3.14.0" + govuk-frontend "^4.0.1" lodash.isequal "^4.5.0" lodash.merge "^4.6.2" qs "^6.9.6" @@ -3706,13 +3706,13 @@ integrity sha512-98NpAQtjvu48xUeOEZHWBvogmj0c7f0k0hNHENKLgnC5kNlFguOrbMyfqi+bt/UNTyRw+fB/wpporQqWPVhP5g== "@tpr/icons@file:./packages/icons": - version "3.1.15" + version "4.0.0" dependencies: normalize.css "^8.0.1" tslib "^2.1.0" "@tpr/layout@file:./packages/layout": - version "4.0.3" + version "5.0.0" dependencies: "@types/lodash.merge" "^4.6.6" "@xstate/react" "^1.2.2" @@ -3726,9 +3726,9 @@ xstate "^4.16.2" "@tpr/theming@file:./packages/theming": - version "2.4.3" + version "3.0.0" dependencies: - govuk-frontend "^3.14.0" + govuk-frontend "^4.0.1" normalize.css "^8.0.1" tslib "^2.1.0" @@ -10113,10 +10113,10 @@ got@9.6.0, got@^9.6.0: to-readable-stream "^1.0.0" url-parse-lax "^3.0.0" -govuk-frontend@^3.14.0: - version "3.14.0" - resolved "https://registry.yarnpkg.com/govuk-frontend/-/govuk-frontend-3.14.0.tgz#d3a9c54437c08f5188f87b1f4480ba60e95c8eb6" - integrity sha512-y7FTuihCSA8Hty+e9h0uPhCoNanCAN+CLioNFlPmlbeHXpbi09VMyxTcH+XfnMPY4Cp++7096v0rLwwdapTXnA== +govuk-frontend@4.0.1, govuk-frontend@^4.0.1: + version "4.0.1" + resolved "https://registry.yarnpkg.com/govuk-frontend/-/govuk-frontend-4.0.1.tgz#bceff58ecb399272cba32bd2b357fe16198e3249" + integrity sha512-X+B88mqYHoxAz0ID87Uxo3oHqdKBRnNHd3Cz8+u8nvQUAsrEzROFLK+t7sAu7e+fKqCCrJyIgx6Cmr6dIGnohQ== graceful-fs@^4.1.11, graceful-fs@^4.1.15, graceful-fs@^4.1.2, graceful-fs@^4.1.6, graceful-fs@^4.2.0, graceful-fs@^4.2.2, graceful-fs@^4.2.3, graceful-fs@^4.2.4: version "4.2.4" From 816a0b24bbe99646cc59810c0852bccdfbdbe9d3 Mon Sep 17 00:00:00 2001 From: Rick Mason Date: Thu, 7 Apr 2022 12:04:52 +0100 Subject: [PATCH 2/2] Replace WarningBox with GOV.UK WarningText component AB#97696 --- packages/core/package.json | 2 +- packages/forms/package.json | 132 ++++++++--------- packages/icons/package.json | 4 +- packages/icons/src/__tests__/icons.spec.tsx | 29 +--- .../icons/src/components/circle/circle.tsx | 11 -- packages/icons/src/index.mdx | 8 -- packages/layout/package.json | 133 +++++++++--------- packages/layout/rollup.config.js | 1 + .../src/components/__tests__/info.spec.tsx | 44 ------ ...rningbox.spec.tsx => warningText.spec.tsx} | 12 +- .../src/components/cards/actuary/i18n.ts | 1 + .../actuary/views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/common/interfaces.ts | 2 + .../views/remove/confirm/confirm.module.scss | 31 +--- .../common/views/remove/confirm/confirm.tsx | 55 ++++---- .../components/cards/corporateGroup/i18n.ts | 1 + .../views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/employer/i18n.ts | 1 + .../employer/views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/inHouse/i18n.ts | 1 + .../inHouse/views/remove/confirm/confirm.tsx | 1 + .../cards/independentTrustee/i18n.tsx | 1 + .../views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/insurer/i18n.ts | 1 + .../insurer/views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/thirdParty/i18n.ts | 1 + .../views/remove/confirm/confirm.tsx | 1 + .../src/components/cards/trustee/i18n.ts | 1 + .../trustee/views/remove/confirm/index.tsx | 1 + packages/layout/src/components/info/info.mdx | 47 ------- .../src/components/info/info.module.scss | 30 ---- packages/layout/src/components/info/info.tsx | 31 ---- .../layout/src/components/warning/warning.mdx | 67 --------- .../components/warning/warning.module.scss | 20 --- .../layout/src/components/warning/warning.tsx | 32 ----- .../warningText/IWarningTextProps.ts | 5 + .../warningText/govuk-frontend.module.scss | 9 ++ .../components/warningText/warningText.mdx | 63 +++++++++ .../components/warningText/warningText.tsx | 21 +++ packages/layout/src/index.ts | 3 +- yarn.lock | 11 +- 41 files changed, 301 insertions(+), 518 deletions(-) delete mode 100644 packages/layout/src/components/__tests__/info.spec.tsx rename packages/layout/src/components/__tests__/{warningbox.spec.tsx => warningText.spec.tsx} (63%) delete mode 100644 packages/layout/src/components/info/info.mdx delete mode 100644 packages/layout/src/components/info/info.module.scss delete mode 100644 packages/layout/src/components/info/info.tsx delete mode 100644 packages/layout/src/components/warning/warning.mdx delete mode 100644 packages/layout/src/components/warning/warning.module.scss delete mode 100644 packages/layout/src/components/warning/warning.tsx create mode 100644 packages/layout/src/components/warningText/IWarningTextProps.ts create mode 100644 packages/layout/src/components/warningText/govuk-frontend.module.scss create mode 100644 packages/layout/src/components/warningText/warningText.mdx create mode 100644 packages/layout/src/components/warningText/warningText.tsx diff --git a/packages/core/package.json b/packages/core/package.json index 90e58f82..f0b5f4d2 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -30,7 +30,7 @@ "clean": "rimraf lib" }, "peerDependencies": { - "@tpr/theming": "^2.4.0", + "@tpr/theming": "^3.0.0", "react": "^16.14.0", "react-dom": "^16.14.0" }, diff --git a/packages/forms/package.json b/packages/forms/package.json index ff0f28ea..d793a8e8 100644 --- a/packages/forms/package.json +++ b/packages/forms/package.json @@ -1,68 +1,68 @@ { - "name": "@tpr/forms", - "version": "5.0.0", - "description": "TPR Forms components", - "author": "David Alekna ", - "license": "MIT", - "main": "./lib/index.cjs.js", - "module": "./lib/index.js", - "typings": "./lib/index.d.ts", - "sideEffects": false, - "files": [ - "lib/*" - ], - "repository": { - "type": "git", - "url": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components.git" - }, - "bugs": { - "url": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components/issues" - }, - "homepage": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components#readme", - "keywords": [ - "tpr" - ], - "scripts": { - "prepare": "yarn build", - "copycss": "copyfiles -u 1 \"./src/**/*.{css,scss}\" \"./lib/\" && echo @tpr/forms css files copied.", - "bundle": "cross-env-shell \"../../node_modules/.bin/rollup\" -c rollup.config.js", - "build": "tsc -b && yarn copycss", - "clean": "rimraf lib" - }, - "peerDependencies": { - "@tpr/core": "^3.0.0", - "@tpr/icons": "^3.1.10", - "@tpr/theming": "^2.4.0", - "react": "^16.14.0", - "react-dom": "^16.14.0", - "react-helmet": "^6.1.0" - }, - "dependencies": { - "@financial-times/accessible-autocomplete": "^2.2.1", - "@tpr/govuk-react-jsx": "^6.2.1", - "@types/lodash.isequal": "^4.5.5", - "@types/lodash.merge": "^4.6.6", - "@types/qs": "^6.9.5", - "date-fns": "^2.17.0", - "final-form": "^4.20.1", - "govuk-frontend": "^4.0.1", - "lodash.isequal": "^4.5.0", - "lodash.merge": "^4.6.2", - "qs": "^6.9.6", - "react-final-form": "^6.5.2", - "tslib": "^2.1.0" - }, - "publishConfig": { - "access": "public" - }, - "devDependencies": { - "@tpr/core": "file:../core", - "@tpr/icons": "file:../icons", - "@tpr/theming": "file:../theming", - "cross-env": "^7.0.3", - "node-sass": "^5.0.0", - "react": "file:../../node_modules/react", - "react-dom": "file:../../node_modules/react-dom" - }, - "gitHead": "57aec9c9de22596d6343bae07eb6b198322a0bee" + "name": "@tpr/forms", + "version": "5.0.0", + "description": "TPR Forms components", + "author": "David Alekna ", + "license": "MIT", + "main": "./lib/index.cjs.js", + "module": "./lib/index.js", + "typings": "./lib/index.d.ts", + "sideEffects": false, + "files": [ + "lib/*" + ], + "repository": { + "type": "git", + "url": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components.git" + }, + "bugs": { + "url": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components/issues" + }, + "homepage": "https://dev.azure.com/thepensionsregulator/TPR/_git/react-components#readme", + "keywords": [ + "tpr" + ], + "scripts": { + "prepare": "yarn build", + "copycss": "copyfiles -u 1 \"./src/**/*.{css,scss}\" \"./lib/\" && echo @tpr/forms css files copied.", + "bundle": "cross-env-shell \"../../node_modules/.bin/rollup\" -c rollup.config.js", + "build": "tsc -b && yarn copycss", + "clean": "rimraf lib" + }, + "peerDependencies": { + "@tpr/core": "^4.0.0", + "@tpr/icons": "^4.0.0", + "@tpr/theming": "^3.0.0", + "react": "^16.14.0", + "react-dom": "^16.14.0", + "react-helmet": "^6.1.0" + }, + "dependencies": { + "@financial-times/accessible-autocomplete": "^2.2.1", + "@tpr/govuk-react-jsx": "^7.0.1", + "@types/lodash.isequal": "^4.5.5", + "@types/lodash.merge": "^4.6.6", + "@types/qs": "^6.9.5", + "date-fns": "^2.17.0", + "final-form": "^4.20.1", + "govuk-frontend": "^4.0.1", + "lodash.isequal": "^4.5.0", + "lodash.merge": "^4.6.2", + "qs": "^6.9.6", + "react-final-form": "^6.5.2", + "tslib": "^2.1.0" + }, + "publishConfig": { + "access": "public" + }, + "devDependencies": { + "@tpr/core": "file:../core", + "@tpr/icons": "file:../icons", + "@tpr/theming": "file:../theming", + "cross-env": "^7.0.3", + "node-sass": "^5.0.0", + "react": "file:../../node_modules/react", + "react-dom": "file:../../node_modules/react-dom" + }, + "gitHead": "57aec9c9de22596d6343bae07eb6b198322a0bee" } diff --git a/packages/icons/package.json b/packages/icons/package.json index ebd112d0..18b8f7c1 100644 --- a/packages/icons/package.json +++ b/packages/icons/package.json @@ -32,8 +32,8 @@ "clean": "rimraf lib" }, "peerDependencies": { - "@tpr/core": "^3.0.0", - "@tpr/theming": "^2.4.0", + "@tpr/core": "^4.0.0", + "@tpr/theming": "^3.0.0", "react": "^16.14.0", "react-dom": "^16.14.0" }, diff --git a/packages/icons/src/__tests__/icons.spec.tsx b/packages/icons/src/__tests__/icons.spec.tsx index 685064b4..8c186c6f 100644 --- a/packages/icons/src/__tests__/icons.spec.tsx +++ b/packages/icons/src/__tests__/icons.spec.tsx @@ -5,11 +5,7 @@ import { ArrowLeft, ArrowRight, } from '../components/arrows/arrows'; -import { - CheckedCircle, - ErrorCircle, - WarningCircle, -} from '../components/circle/circle'; +import { CheckedCircle, ErrorCircle } from '../components/circle/circle'; import { Cross } from '../components/cross/cross'; import { CheckboxChecked, @@ -103,29 +99,6 @@ describe('Icons', () => { expect(icon).toContainElement(title); expect(icon).not.toHaveAttribute('aria-hidden'); }); - - test('Warning Circle to render without error', () => { - const { getByTestId } = render(); - expect(getByTestId('warning-circle')).toBeDefined(); - }); - - test('Warning Circle to be aria-hidden by default', () => { - const { getByTestId } = render(); - expect(getByTestId('warning-circle')).toHaveAttribute( - 'aria-hidden', - 'true', - ); - }); - - test('Warning Circle to not be aria-hidden if there is alternative text', () => { - const { getByTestId, getByText } = render( - , - ); - const icon = getByTestId('warning-circle'); - const title = getByText('Test label'); - expect(icon).toContainElement(title); - expect(icon).not.toHaveAttribute('aria-hidden'); - }); }); describe('Cross', () => { diff --git a/packages/icons/src/components/circle/circle.tsx b/packages/icons/src/components/circle/circle.tsx index 35bcbe43..7e5bdf20 100644 --- a/packages/icons/src/components/circle/circle.tsx +++ b/packages/icons/src/components/circle/circle.tsx @@ -29,14 +29,3 @@ export const ErrorCircle: React.FC = (props) => { ); }; - -export const WarningCircle: React.FC = (props) => { - return ( - - - - ); -}; diff --git a/packages/icons/src/index.mdx b/packages/icons/src/index.mdx index b590ec7f..d81dc9f2 100644 --- a/packages/icons/src/index.mdx +++ b/packages/icons/src/index.mdx @@ -12,7 +12,6 @@ import { RadioButtonUnchecked, CheckedCircle, ErrorCircle, - WarningCircle, ArrowUp, ArrowDown, ArrowLeft, @@ -40,7 +39,6 @@ import { CheckboxChecked, CheckboxBlank } from '@tpr/icons'; | RadioButtonUnchecked | | CheckedCircle | | ErrorCircle | -| WarningCircle | | ArrowUp | | ArrowDown | | ArrowLeft | @@ -75,12 +73,6 @@ import { CheckboxChecked, CheckboxBlank } from '@tpr/icons'; -## Warning Circle - - - - - ## Arrow Up diff --git a/packages/layout/package.json b/packages/layout/package.json index 4180fd53..24b75dc5 100644 --- a/packages/layout/package.json +++ b/packages/layout/package.json @@ -1,68 +1,69 @@ { - "name": "@tpr/layout", - "version": "5.0.0", - "description": "TPR Layout components", - "author": "David Alekna ", - "license": "MIT", - "main": "./lib/index.cjs.js", - "module": "./lib/index.js", - "typings": "./lib/index.d.ts", - "sideEffects": false, - "files": [ - "lib/*" - ], - "repository": { - "type": "git", - "url": "https://github.com/thepensionsregulator/react-components.git" - }, - "bugs": { - "url": "https://github.com/thepensionsregulator/react-components/issues" - }, - "homepage": "https://github.com/thepensionsregulator/react-components#readme", - "keywords": [ - "tpr" - ], - "scripts": { - "prepare": "yarn build", - "test": "jest --coverage", - "test:watch": "jest --watch", - "copycss": "copyfiles -u 1 \"./src/**/*.{css,scss}\" \"./lib/\" && echo @tpr/layout css files copied.", - "bundle": "cross-env-shell \"../../node_modules/.bin/rollup\" -c rollup.config.js", - "build": "tsc -b && yarn copycss", - "clean": "rimraf lib" - }, - "peerDependencies": { - "@tpr/core": "^3.0.0", - "@tpr/forms": "^4.0.8", - "@tpr/icons": "^3.1.10", - "@tpr/theming": "^2.4.0", - "react": "^16.14.0", - "react-dom": "^16.14.0" - }, - "dependencies": { - "@types/lodash.merge": "^4.6.6", - "@xstate/react": "^1.2.2", - "date-fns": "^2.17.0", - "final-form": "^4.20.1", - "lodash.merge": "^4.6.2", - "qs": "^6.9.6", - "react-collapsible": "^2.8.3", - "react-final-form": "^6.5.2", - "tslib": "^2.1.0", - "xstate": "^4.16.2" - }, - "publishConfig": { - "access": "public" - }, - "devDependencies": { - "@tpr/core": "file:../core", - "@tpr/forms": "file:../forms", - "@tpr/icons": "file:../icons", - "@tpr/theming": "file:../theming", - "cross-env": "^7.0.3", - "node-sass": "^5.0.0", - "react": "file:../../node_modules/react", - "react-dom": "file:../../node_modules/react-dom" - }, - "gitHead": "5c43a52eaf98d8e7e9e29581196655397b2d15d9" + "name": "@tpr/layout", + "version": "5.0.0", + "description": "TPR Layout components", + "author": "David Alekna ", + "license": "MIT", + "main": "./lib/index.cjs.js", + "module": "./lib/index.js", + "typings": "./lib/index.d.ts", + "sideEffects": false, + "files": [ + "lib/*" + ], + "repository": { + "type": "git", + "url": "https://github.com/thepensionsregulator/react-components.git" + }, + "bugs": { + "url": "https://github.com/thepensionsregulator/react-components/issues" + }, + "homepage": "https://github.com/thepensionsregulator/react-components#readme", + "keywords": [ + "tpr" + ], + "scripts": { + "prepare": "yarn build", + "test": "jest --coverage", + "test:watch": "jest --watch", + "copycss": "copyfiles -u 1 \"./src/**/*.{css,scss}\" \"./lib/\" && echo @tpr/layout css files copied.", + "bundle": "cross-env-shell \"../../node_modules/.bin/rollup\" -c rollup.config.js", + "build": "tsc -b && yarn copycss", + "clean": "rimraf lib" + }, + "peerDependencies": { + "@tpr/core": "^4.0.0", + "@tpr/forms": "^5.0.0", + "@tpr/icons": "^4.0.0", + "@tpr/theming": "^3.0.0", + "react": "^16.14.0", + "react-dom": "^16.14.0" + }, + "dependencies": { + "@tpr/govuk-react-jsx": "^7.0.1", + "@types/lodash.merge": "^4.6.6", + "@xstate/react": "^1.2.2", + "date-fns": "^2.17.0", + "final-form": "^4.20.1", + "lodash.merge": "^4.6.2", + "qs": "^6.9.6", + "react-collapsible": "^2.8.3", + "react-final-form": "^6.5.2", + "tslib": "^2.1.0", + "xstate": "^4.16.2" + }, + "publishConfig": { + "access": "public" + }, + "devDependencies": { + "@tpr/core": "file:../core", + "@tpr/forms": "file:../forms", + "@tpr/icons": "file:../icons", + "@tpr/theming": "file:../theming", + "cross-env": "^7.0.3", + "node-sass": "^5.0.0", + "react": "file:../../node_modules/react", + "react-dom": "file:../../node_modules/react-dom" + }, + "gitHead": "5c43a52eaf98d8e7e9e29581196655397b2d15d9" } diff --git a/packages/layout/rollup.config.js b/packages/layout/rollup.config.js index 27fe3358..f387583f 100644 --- a/packages/layout/rollup.config.js +++ b/packages/layout/rollup.config.js @@ -7,6 +7,7 @@ export default rollup({ '@tpr/forms', '@tpr/icons', '@tpr/theming', + '@tpr/govuk-react-jsx', '@types/lodash.merge', '@xstate/react', 'final-form', diff --git a/packages/layout/src/components/__tests__/info.spec.tsx b/packages/layout/src/components/__tests__/info.spec.tsx deleted file mode 100644 index 2ba55a41..00000000 --- a/packages/layout/src/components/__tests__/info.spec.tsx +++ /dev/null @@ -1,44 +0,0 @@ -import React from 'react'; -import { render } from '@testing-library/react'; -import { Info } from '../info/info'; -import { axe } from 'jest-axe'; - -describe('Info', () => { - test('is accessible', async () => { - const { container } = render( - -

Here is some information

- , - ); - - const results = await axe(container); - expect(results).toHaveNoViolations(); - }); - - test('uses section element', () => { - const { getByTestId } = render( - -

Here is some information

- , - ); - const container = getByTestId('example'); - expect(container.tagName).toEqual('SECTION'); - }); - - test('important message renders correctly', () => { - const { getByText, getByTestId } = render( - -

Here is some information

- , - ); - - const container = getByTestId('example'); - const wrapper = getByText('Important Information'); - const title = getByText('Title'); - expect(container).toHaveAttribute('aria-labelledby', 'example-important'); - expect(wrapper).toHaveClass('importantMessage'); - expect(wrapper).toHaveAttribute('id', 'example-important'); - expect(title.tagName).toEqual('H2'); - expect(getByText('Here is some information')).toBeInTheDocument(); - }); -}); diff --git a/packages/layout/src/components/__tests__/warningbox.spec.tsx b/packages/layout/src/components/__tests__/warningText.spec.tsx similarity index 63% rename from packages/layout/src/components/__tests__/warningbox.spec.tsx rename to packages/layout/src/components/__tests__/warningText.spec.tsx index bd71021a..f10f91f0 100644 --- a/packages/layout/src/components/__tests__/warningbox.spec.tsx +++ b/packages/layout/src/components/__tests__/warningText.spec.tsx @@ -1,19 +1,19 @@ import React from 'react'; import { render } from '@testing-library/react'; import { P } from '@tpr/core'; -import { WarningBox } from '../warning/warning'; +import { WarningText } from '../warningText/warningText'; -describe('WarningBox', () => { +describe('WarningText', () => { test('Renders with expected text and role', () => { // Arrange const warningBoxText = 'This is the warning text'; - const warningLabelText = 'warning-label-text'; + const iconFallbackText = 'Icon fallback text'; // Act const { getByRole, getByTitle } = render( - +

{warningBoxText}

- , + , ); let warningBox = getByRole('alert'); @@ -21,6 +21,6 @@ describe('WarningBox', () => { // Assert expect(warningBox).toBeDefined(); expect(warningBox).toHaveTextContent(warningBoxText); - expect(getByTitle(warningLabelText)).toBeDefined(); + expect(getByTitle(iconFallbackText)).toBeDefined(); }); }); diff --git a/packages/layout/src/components/cards/actuary/i18n.ts b/packages/layout/src/components/cards/actuary/i18n.ts index 15e921ed..0e339e29 100644 --- a/packages/layout/src/components/cards/actuary/i18n.ts +++ b/packages/layout/src/components/cards/actuary/i18n.ts @@ -90,6 +90,7 @@ export const i18n: ActuaryI18nProps = { remove: 'Remove actuary', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, date: { title: 'Remove this actuary', diff --git a/packages/layout/src/components/cards/actuary/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/actuary/views/remove/confirm/confirm.tsx index 24c49cc4..52b6b7c1 100644 --- a/packages/layout/src/components/cards/actuary/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/actuary/views/remove/confirm/confirm.tsx @@ -58,6 +58,7 @@ export const ConfirmRemove = () => { removeMessage1={i18n.remove.confirm.dialog.message1} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/common/interfaces.ts b/packages/layout/src/components/cards/common/interfaces.ts index e1a01fdf..0c0cc435 100644 --- a/packages/layout/src/components/cards/common/interfaces.ts +++ b/packages/layout/src/components/cards/common/interfaces.ts @@ -188,6 +188,7 @@ export interface I18nRemoveViewDateAndConfirm { remove: string; cancel: string; }; + iconFallbackText: string; }; } @@ -229,6 +230,7 @@ export interface I18nRemoveViewReasonAndConfirm { remove: string; cancel: string; }; + iconFallbackText: string; }; } diff --git a/packages/layout/src/components/cards/common/views/remove/confirm/confirm.module.scss b/packages/layout/src/components/cards/common/views/remove/confirm/confirm.module.scss index 81fbbe22..fb2a5c7d 100644 --- a/packages/layout/src/components/cards/common/views/remove/confirm/confirm.module.scss +++ b/packages/layout/src/components/cards/common/views/remove/confirm/confirm.module.scss @@ -1,33 +1,14 @@ @import '@tpr/core/lib/components/typography/typography.module.scss'; -// typography.module.scss includes '@tpr/theming/lib/variables.scss' -.confirm { - flex-direction: column; - - .paragraph1 { +div.confirm { + p:last-child { @include removeMarginBottom; } - - .paragraph2 { - margin-top: $space-3; - } - - .actionButtons { - .cancelButton { - margin: $space-3; - } - } + margin-bottom: $space-3; } -@media (max-width: 30rem) { - .confirm { - .actionButtons { - flex-wrap: wrap; - - .cancelButton { - margin-top: 0 !important; - margin-left: 0 !important; - } - } +.actionButtons { + .cancelButton { + margin: $space-3; } } diff --git a/packages/layout/src/components/cards/common/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/common/views/remove/confirm/confirm.tsx index 40daa367..587966c7 100644 --- a/packages/layout/src/components/cards/common/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/common/views/remove/confirm/confirm.tsx @@ -2,9 +2,9 @@ import React from 'react'; import { Hr, Flex, P, H3, Link } from '@tpr/core'; import { Content } from '../../../../components/content'; import { ArrowButton } from '../../../../../buttons/buttons'; -import { WarningBox } from '../../../../../warning/warning'; import { cardType, cardTypeName } from '../../../interfaces'; import styles from './confirm.module.scss'; +import { WarningText } from '../../../../../warningText/warningText'; interface ConfirmProps { cardType: cardType; @@ -18,7 +18,7 @@ interface ConfirmProps { handleRemove: () => void; handleCancel: () => void; loading: boolean; - warningLabel?: string; + iconFallbackText: string; } const Confirm: React.FC = ({ @@ -33,37 +33,38 @@ const Confirm: React.FC = ({ handleRemove, handleCancel, loading, - warningLabel, + iconFallbackText, }) => { return (

{removeTitle}

- - -

{removeMessage1}

- {removeMessage2 && ( -

{removeMessage2}

- )} - - - - {cancelBtnTitle} - - +
+ +

{removeMessage1}

+ {removeMessage2 &&

{removeMessage2}

} + + + + + {cancelBtnTitle} + - +
); }; diff --git a/packages/layout/src/components/cards/corporateGroup/i18n.ts b/packages/layout/src/components/cards/corporateGroup/i18n.ts index 08fa5a30..7f638b9c 100644 --- a/packages/layout/src/components/cards/corporateGroup/i18n.ts +++ b/packages/layout/src/components/cards/corporateGroup/i18n.ts @@ -118,6 +118,7 @@ export const i18n: CorporateGroupI18nProps = { remove: 'Remove Trustee', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, reason: { title: 'Remove this trustee', diff --git a/packages/layout/src/components/cards/corporateGroup/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/corporateGroup/views/remove/confirm/confirm.tsx index 2bcc1f46..83b10a18 100644 --- a/packages/layout/src/components/cards/corporateGroup/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/corporateGroup/views/remove/confirm/confirm.tsx @@ -55,6 +55,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage1={i18n.remove.confirm.subtitle} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/employer/i18n.ts b/packages/layout/src/components/cards/employer/i18n.ts index 5f66c142..3c578c98 100644 --- a/packages/layout/src/components/cards/employer/i18n.ts +++ b/packages/layout/src/components/cards/employer/i18n.ts @@ -135,6 +135,7 @@ export const i18n: EmployerI18nProps = { remove: 'Remove employer', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, date: { title: 'Remove this employer', diff --git a/packages/layout/src/components/cards/employer/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/employer/views/remove/confirm/confirm.tsx index 87753a5e..278b1a2f 100644 --- a/packages/layout/src/components/cards/employer/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/employer/views/remove/confirm/confirm.tsx @@ -59,6 +59,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage2={i18n.remove.confirm.dialog.message2} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/inHouse/i18n.ts b/packages/layout/src/components/cards/inHouse/i18n.ts index 30334e52..8abd2110 100644 --- a/packages/layout/src/components/cards/inHouse/i18n.ts +++ b/packages/layout/src/components/cards/inHouse/i18n.ts @@ -97,6 +97,7 @@ export const i18n: InHouseAdminI18nProps = { remove: 'Remove in house admin', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, date: { title: 'Remove this in house admin', diff --git a/packages/layout/src/components/cards/inHouse/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/inHouse/views/remove/confirm/confirm.tsx index eb36fa50..59e70ae1 100644 --- a/packages/layout/src/components/cards/inHouse/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/inHouse/views/remove/confirm/confirm.tsx @@ -59,6 +59,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage2={i18n.remove.confirm.dialog.message2} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/independentTrustee/i18n.tsx b/packages/layout/src/components/cards/independentTrustee/i18n.tsx index bd8496c6..ed90962c 100644 --- a/packages/layout/src/components/cards/independentTrustee/i18n.tsx +++ b/packages/layout/src/components/cards/independentTrustee/i18n.tsx @@ -75,6 +75,7 @@ export const i18n: IndependentTrusteeI18nProps = { remove: 'Remove Trustee', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, reason: { title: 'Remove this trustee', diff --git a/packages/layout/src/components/cards/independentTrustee/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/independentTrustee/views/remove/confirm/confirm.tsx index b21dcf6f..149c82d2 100644 --- a/packages/layout/src/components/cards/independentTrustee/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/independentTrustee/views/remove/confirm/confirm.tsx @@ -55,6 +55,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage1={i18n.remove.confirm.subtitle} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/insurer/i18n.ts b/packages/layout/src/components/cards/insurer/i18n.ts index 27c8d710..148bfbb1 100644 --- a/packages/layout/src/components/cards/insurer/i18n.ts +++ b/packages/layout/src/components/cards/insurer/i18n.ts @@ -76,6 +76,7 @@ export const i18n: InsurerI18nProps = { remove: 'Remove insurer', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, date: { title: 'Remove this insurer', diff --git a/packages/layout/src/components/cards/insurer/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/insurer/views/remove/confirm/confirm.tsx index 89cdb670..cd46e6b3 100644 --- a/packages/layout/src/components/cards/insurer/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/insurer/views/remove/confirm/confirm.tsx @@ -59,6 +59,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage2={i18n.remove.confirm.dialog.message2} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/thirdParty/i18n.ts b/packages/layout/src/components/cards/thirdParty/i18n.ts index af190889..0e50846a 100644 --- a/packages/layout/src/components/cards/thirdParty/i18n.ts +++ b/packages/layout/src/components/cards/thirdParty/i18n.ts @@ -73,6 +73,7 @@ export const i18n: ThirdPartyI18nProps = { remove: 'Remove third party admin', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, date: { title: 'Remove this third party admin', diff --git a/packages/layout/src/components/cards/thirdParty/views/remove/confirm/confirm.tsx b/packages/layout/src/components/cards/thirdParty/views/remove/confirm/confirm.tsx index 6b9b5cdb..15be209c 100644 --- a/packages/layout/src/components/cards/thirdParty/views/remove/confirm/confirm.tsx +++ b/packages/layout/src/components/cards/thirdParty/views/remove/confirm/confirm.tsx @@ -59,6 +59,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage2={i18n.remove.confirm.dialog.message2} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/cards/trustee/i18n.ts b/packages/layout/src/components/cards/trustee/i18n.ts index bc38e824..f68d2e0d 100644 --- a/packages/layout/src/components/cards/trustee/i18n.ts +++ b/packages/layout/src/components/cards/trustee/i18n.ts @@ -121,6 +121,7 @@ export const i18n: TrusteeI18nProps = { remove: 'Remove this trustee', cancel: 'Cancel', }, + iconFallbackText: 'Warning', }, reason: { title: 'Remove this trustee', diff --git a/packages/layout/src/components/cards/trustee/views/remove/confirm/index.tsx b/packages/layout/src/components/cards/trustee/views/remove/confirm/index.tsx index 0bc913b1..e009eb84 100644 --- a/packages/layout/src/components/cards/trustee/views/remove/confirm/index.tsx +++ b/packages/layout/src/components/cards/trustee/views/remove/confirm/index.tsx @@ -55,6 +55,7 @@ export const ConfirmRemove: React.FC = () => { removeMessage1={i18n.remove.confirm.subtitle} removeBtnTitle={i18n.remove.confirm.buttons.remove} cancelBtnTitle={i18n.remove.confirm.buttons.cancel} + iconFallbackText={i18n.remove.confirm.iconFallbackText} handleRemove={handleRemove} handleCancel={() => send('CANCEL')} loading={loading} diff --git a/packages/layout/src/components/info/info.mdx b/packages/layout/src/components/info/info.mdx deleted file mode 100644 index 9f601ffa..00000000 --- a/packages/layout/src/components/info/info.mdx +++ /dev/null @@ -1,47 +0,0 @@ ---- -name: Info -menu: Layout -route: /layout/info ---- - -import { Props } from 'docz'; -import { Playground } from '@playground'; -import { Info } from './info'; - -# Info - -Info components for tpr apps - -## Properties - - - -## Basic usage - -```js -import { Info } from '@tpr/layout'; -``` - - - - Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias - voluptatibus quaerat consequatur deleniti nobis explicabo eius. Fugit - consequuntur, rerum optio architecto ab ad nam. Aperiam nostrum eveniet quam - quia porro animi illo quidem hic eius. Possimus facilis inventore saepe - dolor culpa nobis laborum a id voluptatum? Doloribus illo impedit - perferendis. - - - -## With props - - - - Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias - voluptatibus quaerat consequatur deleniti nobis explicabo eius. Fugit - consequuntur, rerum optio architecto ab ad nam. Aperiam nostrum eveniet quam - quia porro animi illo quidem hic eius. Possimus facilis inventore saepe - dolor culpa nobis laborum a id voluptatum? Doloribus illo impedit - perferendis. - - diff --git a/packages/layout/src/components/info/info.module.scss b/packages/layout/src/components/info/info.module.scss deleted file mode 100644 index 6456de7b..00000000 --- a/packages/layout/src/components/info/info.module.scss +++ /dev/null @@ -1,30 +0,0 @@ -@import '@tpr/theming/lib/variables.scss'; - -.info { - position: relative; - display: flex; - flex-direction: column; - padding: $space-6; - background: $colors-neutral-3; - color: $colors-neutral-7; -} - -.important { - margin-top: $space-8; - border-top: 0.375rem solid $colors-neutral-8; -} - -.importantMessage { - display: flex; - align-items: center; - justify-content: center; - font-size: $font-size-3; - position: absolute; - left: 0; - height: 2.875rem; - top: -3rem; - padding: 0 $space-6; - background: $colors-neutral-8; - color: $white; - font-weight: normal; -} diff --git a/packages/layout/src/components/info/info.tsx b/packages/layout/src/components/info/info.tsx deleted file mode 100644 index 1aea82e4..00000000 --- a/packages/layout/src/components/info/info.tsx +++ /dev/null @@ -1,31 +0,0 @@ -import React from 'react'; -import { classNames, H2 } from '@tpr/core'; -import styles from './info.module.scss'; - -type InfoProps = { id: string; title?: string; importantMessage?: string }; -export const Info: React.FC = ({ - children, - id = 'info', - title, - importantMessage, -}) => { - return ( -
- {importantMessage && ( - - {importantMessage} - - )} - {title &&

{title}

} - {children} -
- ); -}; diff --git a/packages/layout/src/components/warning/warning.mdx b/packages/layout/src/components/warning/warning.mdx deleted file mode 100644 index 17cf34f6..00000000 --- a/packages/layout/src/components/warning/warning.mdx +++ /dev/null @@ -1,67 +0,0 @@ ---- -name: Warning -menu: Layout -route: /layout/warning ---- - -import { Props } from 'docz'; -import { Playground } from '@playground'; -import { WarningBox } from './warning'; -import { useState } from 'react'; -import { Button } from '@tpr/core'; - -# Warning Box - -Warning box for tpr apps - -## Basic usage - -```js -import { WarningBox } from '@tpr/layout'; -``` - - - - Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias - voluptatibus quaerat consequatur deleniti nobis explicabo eius. - - - -## Accessibility - -The warning box has the role type of 'alert' so if it is toggled into view then assistive technology will immediately alert the user of it's presence. - -```js -import { WarningBox } from '@tpr/layout'; -``` - - - {() => { - const [toggleWarning, setToggleWarning] = useState(false); - - return ( - <> - - {(toggleWarning && - Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias - voluptatibus quaerat consequatur deleniti nobis explicabo eius. - )} - ) - }} - - - -## API - -``` -Accepted config props: SpaceProps, FlexProps -``` - -### Props - -| Property | Required | Type | Description | -| ---------------- | -------- | ----------------- | ---------------------------------------------------------------------------------------------------------- | -| warningLabel | false | boolean | Optionally overrides the default title text on the svg image (the exclamation mark) within the warning box | \ No newline at end of file diff --git a/packages/layout/src/components/warning/warning.module.scss b/packages/layout/src/components/warning/warning.module.scss deleted file mode 100644 index 8e8dd916..00000000 --- a/packages/layout/src/components/warning/warning.module.scss +++ /dev/null @@ -1,20 +0,0 @@ -@import '@tpr/theming/lib/variables.scss'; - -.warning { - border: 0.25rem solid $colors-danger-2; - font-weight: $font-weight-3; - - svg { - min-width: 1.5625rem; - min-height: 1.5625rem; - margin-top: 0.125rem; - } -} - -@media (max-width: 25rem) { - .warning { - .innerWrapper { - flex-wrap: wrap; - } - } -} diff --git a/packages/layout/src/components/warning/warning.tsx b/packages/layout/src/components/warning/warning.tsx deleted file mode 100644 index 7e550972..00000000 --- a/packages/layout/src/components/warning/warning.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import React from 'react'; -import { Flex, SpaceProps, FlexProps } from '@tpr/core'; -import { WarningCircle } from '@tpr/icons'; -import styles from './warning.module.scss'; - -export type WarningBoxProps = { - cfg?: SpaceProps & FlexProps; - warningLabel?: string; - wrapInMobile?: boolean; -}; -export const WarningBox: React.FC = ({ - children, - cfg, - warningLabel = 'Warning', - wrapInMobile = false, -}) => { - return ( - - - - {children} - - - ); -}; diff --git a/packages/layout/src/components/warningText/IWarningTextProps.ts b/packages/layout/src/components/warningText/IWarningTextProps.ts new file mode 100644 index 00000000..4560842b --- /dev/null +++ b/packages/layout/src/components/warningText/IWarningTextProps.ts @@ -0,0 +1,5 @@ +export interface IWarningTextProps { + id?: string; + className?: string; + iconFallbackText: string; +} diff --git a/packages/layout/src/components/warningText/govuk-frontend.module.scss b/packages/layout/src/components/warningText/govuk-frontend.module.scss new file mode 100644 index 00000000..f4b7d31c --- /dev/null +++ b/packages/layout/src/components/warningText/govuk-frontend.module.scss @@ -0,0 +1,9 @@ +@import '@tpr/theming/lib/govuk-frontend.module.scss'; +@import '~govuk-frontend/govuk/objects/_all'; +@import '~govuk-frontend/govuk/components/warning-text/_index'; + +/* if EditorFonts is used as a child component it sets the font-weight on p elements, + so we need to override that with the original value from govuk-frontend to get the correct weight by default */ +.warningText p { + font-weight: $font-weight-4; +} diff --git a/packages/layout/src/components/warningText/warningText.mdx b/packages/layout/src/components/warningText/warningText.mdx new file mode 100644 index 00000000..6bea4ae5 --- /dev/null +++ b/packages/layout/src/components/warningText/warningText.mdx @@ -0,0 +1,63 @@ +--- +name: Warning text +menu: Layout +route: /layout/warningText +--- + +import { Props } from 'docz'; +import { Playground } from '@playground'; +import { WarningText } from './warningText'; +import { useState } from 'react'; +import { Button } from '@tpr/core'; + +# Warning text + +Warning text for TPR apps + +## Basic usage + +```js +import { WarningText } from '@tpr/layout'; +``` + + + + + Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias + voluptatibus quaerat consequatur deleniti nobis explicabo eius. + + + +## Accessibility + +If you show or hide the warning text dynamically, surround it with a `
` that is never hidden. When the warning text is toggled into view then assistive technology will immediately alert the user of its presence. + +```js +import { WarningText } from '@tpr/layout'; +``` + + + {() => { + const [toggleWarning, setToggleWarning] = useState(false); + + return ( + <> + + {(toggleWarning && + Lorem ipsum dolor sit, amet consectetur adipisicing elit. Molestias + voluptatibus quaerat consequatur deleniti nobis explicabo eius. + )} + ) + }} + + + +## Props + +| Property | Required | Type | Description | +| ---------------- | -------- | ------- | ------------------------------------------------------------------------------------------------------------ | +| className | false | string | Adds an additional CSS class to customise the component | +| iconFallbackText | true | boolean | Sets the alternative text for the exclamation mark image | diff --git a/packages/layout/src/components/warningText/warningText.tsx b/packages/layout/src/components/warningText/warningText.tsx new file mode 100644 index 00000000..03442a83 --- /dev/null +++ b/packages/layout/src/components/warningText/warningText.tsx @@ -0,0 +1,21 @@ +import React from 'react'; +import govuk from './govuk-frontend.module.scss'; +import { WarningText as GovUkWarningText } from '@tpr/govuk-react-jsx'; +import { IWarningTextProps } from './IWarningTextProps'; +import { classNames } from '@tpr/core'; + +export const WarningText: React.FC = ({ + children, + className, + ...rest +}) => { + return ( + + {children} + + ); +}; diff --git a/packages/layout/src/index.ts b/packages/layout/src/index.ts index fc606fcc..2cd21ec8 100644 --- a/packages/layout/src/index.ts +++ b/packages/layout/src/index.ts @@ -12,7 +12,6 @@ export * from './components/phaseBanner/phaseBanner'; export * from './components/footer/footer'; export * from './components/header/header'; export * from './components/highlight/highlight'; -export * from './components/info/info'; export * from './components/navitem'; export * from './components/sidebar'; export * from './components/tasklist'; @@ -24,7 +23,7 @@ export { export * from './components/tasklist/components/types'; export * from './components/buttons/buttons'; export * from './components/buttons/links'; -export * from './components/warning/warning'; +export * from './components/warningText/warningText'; export * from './components/helplink/helplink'; export * from './components/hint/hint'; export * from './components/poscon/poscon'; diff --git a/yarn.lock b/yarn.lock index e1825679..c92b609a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3687,7 +3687,7 @@ version "5.0.0" dependencies: "@financial-times/accessible-autocomplete" "^2.2.1" - "@tpr/govuk-react-jsx" "^6.2.1" + "@tpr/govuk-react-jsx" "^7.0.1" "@types/lodash.isequal" "^4.5.5" "@types/lodash.merge" "^4.6.6" "@types/qs" "^6.9.5" @@ -3700,10 +3700,10 @@ react-final-form "^6.5.2" tslib "^2.1.0" -"@tpr/govuk-react-jsx@^6.2.1": - version "6.2.1" - resolved "https://registry.yarnpkg.com/@tpr/govuk-react-jsx/-/govuk-react-jsx-6.2.1.tgz#dedd8addf1e9124cf14ec2203ee1dd0bd67a92ab" - integrity sha512-98NpAQtjvu48xUeOEZHWBvogmj0c7f0k0hNHENKLgnC5kNlFguOrbMyfqi+bt/UNTyRw+fB/wpporQqWPVhP5g== +"@tpr/govuk-react-jsx@^7.0.1": + version "7.0.1" + resolved "https://registry.yarnpkg.com/@tpr/govuk-react-jsx/-/govuk-react-jsx-7.0.1.tgz#a9cb3689e8222ed676fd67411a08060004d2b896" + integrity sha512-9jyqPTN9fm02NDjOK+OJGczD46DkBXT5iJz6xsYXN+Nz7i7oz14GU9lXddUk8jG00hlFE7blspSPAPC2/ThV3A== "@tpr/icons@file:./packages/icons": version "4.0.0" @@ -3714,6 +3714,7 @@ "@tpr/layout@file:./packages/layout": version "5.0.0" dependencies: + "@tpr/govuk-react-jsx" "^7.0.1" "@types/lodash.merge" "^4.6.6" "@xstate/react" "^1.2.2" date-fns "^2.17.0"