From 161c20fa8864f05d78ffcacd372bc1dfc2fa3b06 Mon Sep 17 00:00:00 2001 From: "w@rren" Date: Thu, 2 Dec 2021 16:45:08 +0000 Subject: [PATCH] GN-115 Mega nav production ready (#145) * GN-95 Move NavLinks to own component * GN-95 Get button in if dropdown * GN-95 Skip links and click behaviour * GN-95 Skip links * GN-95 Styling * GN-95 Styling, aria controls, chevron * GN-95 Active text on button * GN-95 Refactoring styling * Ignore netlify file * GN-95 Chevrons and revised services list * GN-95 Link styling * GN-95 More services dropdown and styling * GN-95 Missed commit with dropdownComponent * Comment out test to get build * Attempt fix for $RefreshReg$ issue See https://github.com/pmmmwh/react-refresh-webpack-plugin/blob/main/docs/TROUBLESHOOTING.md#usage-with-indirection-like-workers-and-js-templates * Focus trap plugin * GN-95 Focus trap around all of nav when active * Remove tests for alpha * GN-95 Focus trap no initial focus * GN-95 Z-index for pathways and guidance fix * GN-95 Escape by clicking search or acccount * GN-95 Replacing with nds components * GN-95 Config fix for grid css issue * GN-101 Issues (#122) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-101 Code review fixes Co-authored-by: w@rren Co-authored-by: w@rren * GN-102 Bnf content (#125) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-102 Pull url from services * GN-102 Spacing * GN-101 Fix failing tests * GN-102 Update snapshot * GN-102 Fix letters and dancing button Co-authored-by: w@rren * GN-103 Bnfc content (#126) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-103 Revert nav text to abbreviation * GN-103 Use var for url * GN-103 Spacing * GN-101 Fix failing tests * GN-103 Update snapshot * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt Co-authored-by: w@rren * GN-105 Standards and indicators content (#128) * GN-105 Content for standards and indicators * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-105 Update snapshot * GN-105 Amend S&I base link Co-authored-by: w@rren Co-authored-by: John Davey <66066685+johndavey72@users.noreply.github.com> * GN-106 About us content (#130) * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-98 Content update * GN-106 About us content * GN-101 Fix failing tests * GN-106 Update snapshot * GN-98 Snapshot updated * GN-106 Content link issue * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Prettier * Reset root about us URL Co-authored-by: w@rren Co-authored-by: John Davey Co-authored-by: John Davey <66066685+johndavey72@users.noreply.github.com> * GN-98 Guidance content (#129) * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-98 Content update * GN-101 Fix failing tests * GN-98 Snapshot updated * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Url updates * Prettier Co-authored-by: w@rren Co-authored-by: John Davey * GN-104 Cks content (#127) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * GN-104 Snapshot update * Snapshot update Co-authored-by: w@rren Co-authored-by: John Davey * GN-109 More dropdown content (#133) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * Snapshot update Co-authored-by: Eleanor Mollett Co-authored-by: John Davey * GN-110 Life sciences content (#137) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * GN-110 Life Sciences dropdown content * Snapshot update Co-authored-by: Eleanor Mollett Co-authored-by: John Davey * GN-107 Pathways content (#134) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * Snapshot update Co-authored-by: Eleanor Mollett Co-authored-by: John Davey * GN-000 All content (#132) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * GN-110 Life Sciences dropdown content * Snapshot update Co-authored-by: w@rren Co-authored-by: John Davey * GN-108 Snag list (#138) * Scrim * GN-101 Move focus to search when clicked * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Close MyAccount Dropdown on meganav click * GN-101 Styling issues across applications * GN-101 Use bundled design system css * GN-101 Loose grid * GN-98 Initial guidance content * GN-95 Now click scrim to close * GN-101 Fix list styling variation * GN-102 Add BNF content * GN-102 BNFc content * GN-102 BNF content update * GN-103 BNFC content * GN-104 CKS content * GN-104 Revert nav text to abbreviation * GN-103 Revert nav text to abbreviation * GN-101 Code review fixes Co-authored-by: w@rren * GN-102 Nitpicking css * GN-104 Rename var * GN-102 Pull url from services * GN-103 Use var for url * GN-98 Content update * demo stuff * GN-104 Url var * GN-102 Spacing * GN-103 Spacing * GN-105 Content for standards and indicators * GN-106 About us content * GN-105 Update links * GN-105 Remove standards and indicators from more * GN-101 Fix failing tests * GN-102 Update snapshot * GN-103 Update snapshot * GN-105 Update snapshot * GN-106 Update snapshot * GN-104 Update snapshot * GN-98 Snapshot updated * GN-000 Alpha services. May want renaming for UR. * GN-000 Renamed for UR. DO NOT DEPLOY TO LIVE. * GN-000 Snapshot updated * GN-000 Links for UR. DO NOT DEPLOY TO LIVE * GN-000 Prettier issue * GN-102 Fix letters and dancing button * GN-103 Button fix and letter link fix * GN-103 Button dancing fix * GN-103 Another dancing button fix attempt * GN-106 Content link issue * GN-105 Amend S&I base link * Start guidance content * AW/21 Colour Scheme * GN-98 Guidance content * GN-106 About us content update * GN-109 More content * GN-107 Pathways content * GN-108 Remove e.preventDefault on mega menu click handler to enable links to work * GN-108 Fix scrim * GN-108 Add canUseDOM state to control display of dropdown menus in main nav * Duplicate css removed * Remove duplicate CSS * Remove duplicate css * Remove duplicate export * Links to live * Tidy up * GN-108 Primary to CTA buttons * GN-108 Add column gap * GN-108 Consistent URLs Co-authored-by: Eleanor Mollett Co-authored-by: John Davey * GN-112 New simplified pathways content (#139) * GN-112 New simplified pathways content * GN-112 Remove pathways dropdown * GN-113 Alpha snag list (#140) * Settings * GN-113 Alpha snag list * Config typo * GN-000 Merge npm release (#144) * GN-116 Publishing to npm (#142) * GN-116 Pin Node version with Volta * GN-116 Update readme * GN-56 Footer logo and remove IE8 support for SVG fallback (#141) Co-authored-by: Ian Routledge Co-authored-by: Ian Routledge Co-authored-by: Ian Routledge * GN-119 BNF CSS scoping (#146) * GN-138 Shorten nav copy (#147) * GN-140 Standards and indicators content (#151) * GN-116 Publishing to npm (#142) * GN-116 Pin Node version with Volta * GN-116 Update readme * GN-56 Footer logo and remove IE8 support for SVG fallback (#141) Co-authored-by: Ian Routledge * GN-140 Standards removal Co-authored-by: Ian Routledge Co-authored-by: Ian Routledge * GN-118 Add non-JS dropdown (#149) * GN-118 Add non-JS dropdown * GN-118 More link fallback * Removed redundant nesting * GN-117 Remove need to assert on dom (#148) * context experiments * basic context setup * tidy up debugging * uncommen event listener for expected closing behaviour * make debug clearer * clean up console logging for clarity * move globalnavcontext provider up to header component * GN-117 add useCallback to clickOutside hook to maintain reference to id of open dropdown * GN-117 Refactor Nav component to class. Add custom hook and context for open dropdown state and nav area click outside detection * GN-117 Begin conversion of Account class component to functional component * GN-117 Remove commented out lines * GN-117 Reinstate propTypes for Naccount placeholder component * Side effect sideline (#150) * side effect shenanigans * Magical useRef() * update key event to use e.key rather than e.keycode for better cross platform * Move myAccount isExpanded state into GlobalNavContext * Remove redundant event binding * Make megamenu click detection more 'reacty' * Manage context of opened menus * Rename Naccount component to Account Co-authored-by: John Davey * Tests needed * GN-117 Tidy up redundant arguments and commented out logic for useClickOutside hook * GN-117 Change directory structure for hooks and react context. Make useClickOutside re-useable. * GN-117 Import GlobalNavContextProvider from new location for Account tests * GN-117 Fixing broken unit tests * GN-117 Fixing broken tests * GN-117 Fixing broken tests * Replace simulate click * GN-117 Revert some tests to shallow rendering after adding defaults to context * GN-117 Revert to shallow mounting for a previously failing unit test * GN-117 Convert unit test from shallow to mount due to issues around enzyme support of useContext 'https://github.com/enzymejs/enzyme/issues/2176' * GN-117 Rename GlobalNavContext to HeaderContext * GN-117 remove unused dependencies from account test * GN-117 Tidy up unit tests * testing custom hook useClickOutside * basic setup * Custom hook test * Update test * Rename test Co-authored-by: w@rren * Set base high z-index (#152) * Snapshot update * Remove nerv * GN-146 Data tracking attributes * GN-146 Data tracking attributes (#153) * Update snapshot * GN-115 Add additional data-tracking attributes * GN-115 Update test snapshot * GN-145 Implement self contained grid system (#155) * Replace find with filter (#154) * GN-148 Fix content overflow * Move focus trap to deps * GN-149 Skip x route (#157) * GN-149 Reinstate ids for top level links to make them focussable upon closing dropdown * GN-149 Refactor Co-authored-by: w@rren Co-authored-by: w@rren * GN-130 Fix invisible white close button * Scrim flicker fix Co-authored-by: John Davey * GN-115 Add IE11 compatible e.key string for escape key * GN-115 Fix bug in copy * GN-115 Add Esc to ESCAPE_KEYS for IE11 support * Communities link update * Fix concatenated links * Correct public involvement link (again) * GN-137 Add tests (#158) * Uncommented tests * GN-137 Add unit tests for dropdown component * Updated browserslist & caniuse * NavLinks test WIP * Trying to test WIP * GN-137 Fix tests for tracked link * GN-137 Update 'Proposed' to 'Awaiting development' * GN-137 Skip failing test - enzyme mocking hooks issue * GN-137 Fix or skip failing tests due to enzyme react hooks testing issues Co-authored-by: w@rren * GN-154 Button styling Including GN-155 GN-153 * GN-115 Add data-tracking attrs for Standards and Indicators dropdown * Alpha current style override Co-authored-by: John Davey Co-authored-by: Eleanor Mollett Co-authored-by: John Davey <66066685+johndavey72@users.noreply.github.com> Co-authored-by: John Davey Co-authored-by: Ian Routledge Co-authored-by: Ian Routledge Co-authored-by: John Davey --- .gitignore | 1 + .vscode/settings.json | 13 +- package-lock.json | 512 +++++++++++++++--- package.json | 8 +- src/Common.module.scss | 4 +- src/Footer/Footer.jsx | 2 +- src/Footer/Footer.module.scss | 2 + src/Footer/Services/Services.jsx | 68 ++- .../__snapshots__/Services.test.jsx.snap | 338 ++++++------ src/Footer/__snapshots__/Footer.test.jsx.snap | 1 + src/Header/Account/Account.jsx | 235 ++++---- src/Header/Account/Account.module.scss | 2 +- src/Header/Account/Account.test.jsx | 51 +- src/Header/Account/AccountOld.jsx | 251 +++++++++ .../__snapshots__/Account.test.jsx.snap | 8 +- src/Header/Header.jsx | 164 +++--- src/Header/Header.module.scss | 14 + .../Nav/Dropdown/Components/AboutUs.jsx | 171 ++++++ src/Header/Nav/Dropdown/Components/BNF.jsx | 131 +++++ src/Header/Nav/Dropdown/Components/BNFc.jsx | 127 +++++ src/Header/Nav/Dropdown/Components/Button.jsx | 24 + .../Dropdown/Components/Button.module.scss | 74 +++ src/Header/Nav/Dropdown/Components/CKS.jsx | 126 +++++ .../Components/Components.module.scss | 103 ++++ src/Header/Nav/Dropdown/Components/Grid.jsx | 19 + .../Nav/Dropdown/Components/Grid.module.scss | 15 + .../Nav/Dropdown/Components/Guidance.jsx | 190 +++++++ .../Nav/Dropdown/Components/LifeSciences.jsx | 69 +++ src/Header/Nav/Dropdown/Components/More.jsx | 52 ++ .../Components/StandardsAndIndicators.jsx | 92 ++++ src/Header/Nav/Dropdown/Components/index.jsx | 8 + src/Header/Nav/Dropdown/Dropdown.jsx | 88 +++ src/Header/Nav/Dropdown/Dropdown.module.scss | 42 ++ src/Header/Nav/Dropdown/Dropdown.test.jsx | 70 +++ src/Header/Nav/Dropdown/Reset.module.scss | 45 ++ src/Header/Nav/Dropdown/index.js | 1 + src/Header/Nav/Nav.jsx | 287 ++++------ src/Header/Nav/Nav.module.scss | 139 ++--- src/Header/Nav/Nav.test.jsx | 72 +-- src/Header/Nav/NavLinks/NavLinks.jsx | 201 +++++++ src/Header/Nav/NavLinks/NavLinks.module.scss | 68 +++ src/Header/Nav/NavLinks/NavLinks.test.jsx | 117 ++++ .../__snapshots__/NavLinks.test.jsx.snap | 98 ++++ src/Header/Nav/NavLinks/index.js | 1 + src/Header/Nav/__mocks__/services.json | 37 +- .../Nav/__snapshots__/Nav.test.jsx.snap | 391 ++++++------- .../Search/Autocomplete/Autocomplete.jsx | 2 +- .../Autocomplete/Autocomplete.module.scss | 6 +- src/Header/Search/Search.module.scss | 2 +- src/Header/SkipLink/SkipLink.module.scss | 3 +- src/Header/__snapshots__/Header.test.jsx.snap | 166 +++--- src/Header/_header-settings.scss | 4 +- src/Header/context/HeaderContext.js | 36 ++ src/TrackedLink/TrackedLink.jsx | 4 +- src/TrackedLink/TrackedLink.test.jsx | 46 +- src/hooks/useClickOutside.js | 25 + src/hooks/useClickOutside.test.jsx | 36 ++ src/services.json | 74 ++- todo.txt | 7 + webpack.config.js | 9 +- webpack.config.prod.js | 7 - 61 files changed, 3759 insertions(+), 1200 deletions(-) create mode 100644 src/Header/Account/AccountOld.jsx create mode 100644 src/Header/Nav/Dropdown/Components/AboutUs.jsx create mode 100644 src/Header/Nav/Dropdown/Components/BNF.jsx create mode 100644 src/Header/Nav/Dropdown/Components/BNFc.jsx create mode 100644 src/Header/Nav/Dropdown/Components/Button.jsx create mode 100644 src/Header/Nav/Dropdown/Components/Button.module.scss create mode 100644 src/Header/Nav/Dropdown/Components/CKS.jsx create mode 100644 src/Header/Nav/Dropdown/Components/Components.module.scss create mode 100644 src/Header/Nav/Dropdown/Components/Grid.jsx create mode 100644 src/Header/Nav/Dropdown/Components/Grid.module.scss create mode 100644 src/Header/Nav/Dropdown/Components/Guidance.jsx create mode 100644 src/Header/Nav/Dropdown/Components/LifeSciences.jsx create mode 100644 src/Header/Nav/Dropdown/Components/More.jsx create mode 100644 src/Header/Nav/Dropdown/Components/StandardsAndIndicators.jsx create mode 100644 src/Header/Nav/Dropdown/Components/index.jsx create mode 100644 src/Header/Nav/Dropdown/Dropdown.jsx create mode 100644 src/Header/Nav/Dropdown/Dropdown.module.scss create mode 100644 src/Header/Nav/Dropdown/Dropdown.test.jsx create mode 100644 src/Header/Nav/Dropdown/Reset.module.scss create mode 100644 src/Header/Nav/Dropdown/index.js create mode 100644 src/Header/Nav/NavLinks/NavLinks.jsx create mode 100644 src/Header/Nav/NavLinks/NavLinks.module.scss create mode 100644 src/Header/Nav/NavLinks/NavLinks.test.jsx create mode 100644 src/Header/Nav/NavLinks/__snapshots__/NavLinks.test.jsx.snap create mode 100644 src/Header/Nav/NavLinks/index.js create mode 100644 src/Header/context/HeaderContext.js create mode 100644 src/hooks/useClickOutside.js create mode 100644 src/hooks/useClickOutside.test.jsx create mode 100644 todo.txt diff --git a/.gitignore b/.gitignore index 9f10c4dd..7ca9e3a5 100644 --- a/.gitignore +++ b/.gitignore @@ -105,3 +105,4 @@ lib .DS_Store .idea .idea/Global Nav.iml +.netlify/state.json diff --git a/.vscode/settings.json b/.vscode/settings.json index 323b19dc..70adbd78 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,10 +1,12 @@ { "editor.defaultFormatter": "esbenp.prettier-vscode", "prettier.prettierPath": "./node_modules/prettier", + "editor.codeActionsOnSave": { + "source.fixAll": true + }, "editor.formatOnSave": true, "editor.rulers": [80, 120], "files.eol": "\n", - "sasslint.enable": false, "css.validate": false, "less.validate": false, "scss.validate": false, @@ -22,10 +24,11 @@ "lib": true }, "workbench.colorCustomizations": { - "activityBar.background": "#493657", - "activityBar.foreground": "#FFFFFF", - "titleBar.activeBackground": "#493657", - "titleBar.activeForeground": "#FFFFFF" + "activityBar.background": "#8f4e4d", + "activityBar.foreground": "#000", + "activityBar.inactiveForeground": "#FFFDE1", + "titleBar.activeBackground": "#8f4e4d", + "titleBar.activeForeground": "#FFFDE1" }, "omnisharp.autoStart": false } diff --git a/package-lock.json b/package-lock.json index fec744af..8e6f7703 100644 --- a/package-lock.json +++ b/package-lock.json @@ -310,12 +310,6 @@ "node-releases": "^1.1.71" } }, - "caniuse-lite": { - "version": "1.0.30001235", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001235.tgz", - "integrity": "sha512-zWEwIVqnzPkSAXOUlQnPW2oKoYb2aLQ4Q5ejdjBcnH63rfypaW34CxaeBn1VMya2XaEU3P/R2qHpWyj+l0BT1A==", - "dev": true - }, "electron-to-chromium": { "version": "1.3.749", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.749.tgz", @@ -3993,6 +3987,48 @@ "resolved": "https://registry.npmjs.org/@nice-digital/browserslist-config/-/browserslist-config-2.0.1.tgz", "integrity": "sha512-ix5tGXN28iK178l5Djsnyihw5jcgrIoj4zRClGXh63zeM9aLouwZm79TK14gI+snaalZATiX8VhxovzsHWQ5Qg==" }, + "@nice-digital/design-system": { + "version": "1.2.30", + "resolved": "https://registry.npmjs.org/@nice-digital/design-system/-/design-system-1.2.30.tgz", + "integrity": "sha512-pjzUTdfkPoULmwIgBGoTi02fFvAK/PrCijra7q1B4wzIFzS7toj0I+xFHD7g8SmkHe7Hax5BcyHq2gfVMRZ3Ww==", + "dev": true, + "requires": { + "@nice-digital/icons": "^2.2.7", + "@nice-digital/nds-action-banner": "^1.2.13", + "@nice-digital/nds-alert": "^1.2.11", + "@nice-digital/nds-breadcrumbs": "^1.2.13", + "@nice-digital/nds-button": "^1.2.11", + "@nice-digital/nds-callout": "^1.1.13", + "@nice-digital/nds-card": "^1.2.13", + "@nice-digital/nds-checkbox": "^1.2.11", + "@nice-digital/nds-container": "^1.0.7", + "@nice-digital/nds-core": "^1.2.11", + "@nice-digital/nds-enhanced-pagination": "^1.0.5", + "@nice-digital/nds-filters": "^1.2.20", + "@nice-digital/nds-form-group": "^1.2.11", + "@nice-digital/nds-forms": "^1.2.6", + "@nice-digital/nds-full-bleed": "^1.1.11", + "@nice-digital/nds-grid": "^1.2.12", + "@nice-digital/nds-hero": "^1.2.12", + "@nice-digital/nds-horizontal-nav": "^1.1.11", + "@nice-digital/nds-in-page-nav": "^1.2.15", + "@nice-digital/nds-input": "^1.2.15", + "@nice-digital/nds-maintain-ratio": "^1.2.12", + "@nice-digital/nds-page-header": "^1.2.12", + "@nice-digital/nds-panel": "^1.2.13", + "@nice-digital/nds-phase-banner": "^1.2.12", + "@nice-digital/nds-prev-next": "^1.1.12", + "@nice-digital/nds-radio": "^1.2.11", + "@nice-digital/nds-simple-pagination": "^1.2.11", + "@nice-digital/nds-stacked-nav": "^1.2.12", + "@nice-digital/nds-table": "^1.1.14", + "@nice-digital/nds-tabs": "^1.2.15", + "@nice-digital/nds-tag": "^1.2.11", + "@nice-digital/nds-textarea": "^1.2.11", + "normalize.css": "8.0.1", + "react": "^16.11.0" + } + }, "@nice-digital/eslint-config": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/@nice-digital/eslint-config/-/eslint-config-1.0.3.tgz", @@ -4000,20 +4036,355 @@ "dev": true }, "@nice-digital/icons": { - "version": "2.2.3", - "resolved": "https://registry.npmjs.org/@nice-digital/icons/-/icons-2.2.3.tgz", - "integrity": "sha512-gJBCGk1go85zByfU+BBpoQ+perUguxv6gqIjkEv0wEvLEIR9wm1tEKkH76nbNmcmKGuemh04Qvoip+CI4ti6lw==" + "version": "2.2.7", + "resolved": "https://registry.npmjs.org/@nice-digital/icons/-/icons-2.2.7.tgz", + "integrity": "sha512-LcwRsSQ7AP4yhis9dEJ2OJtfOI6tx0ZDy728ffFGpuBs+QSLCgPKSZJlyy5G88WZVx4xyqH93ECgYQWZx3FFSw==", + "dev": true + }, + "@nice-digital/nds-action-banner": { + "version": "1.2.13", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-action-banner/-/nds-action-banner-1.2.13.tgz", + "integrity": "sha512-bPL8mImuq9p/Ywj8qVCkV+XrFiL5TrabVupPepOn50a+fIw/iqY0rvxxWEVodZmkdXBDckj6NsuaqCkqYXsGhA==", + "dev": true, + "requires": { + "@nice-digital/icons": "^2.2.7", + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-alert": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-alert/-/nds-alert-1.2.11.tgz", + "integrity": "sha512-2DQHMulemPwefYtBiDj0VLWCUs5hG87kjBkLoAZ/X/nywZuPX/uKl8Autwysw77R61NyNUpYa/swWPGvq3GGNw==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-breadcrumbs": { + "version": "1.2.13", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-breadcrumbs/-/nds-breadcrumbs-1.2.13.tgz", + "integrity": "sha512-IbrCZa4F7bXbvqu09eqN8QaW4rEqpm1Y+PGf9IZervCHZwO9aJ1sMLVB/3UQUISyYZd9GQKb2pzQsU4EnwzAcw==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-button": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-button/-/nds-button-1.2.11.tgz", + "integrity": "sha512-wkX1JZWum7ugN38JcgIxaTsltrFcGe5mm45vgOzA/XKJ6FQYOAdxmemjd5yL8+UG0mDcTGgybJpFzw3Zdg6W2w==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-callout": { + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-callout/-/nds-callout-1.1.13.tgz", + "integrity": "sha512-v3XqENWDg7KV+yVuQTQdoH9z5E4mMSPfTpzOgEw5pB6ch+eFkp/+cmf4aaws0Jov7hGPj2KLsOIs/Dq3Ap5gww==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "@nice-digital/nds-maintain-ratio": "^1.2.12", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-card": { + "version": "1.2.13", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-card/-/nds-card-1.2.13.tgz", + "integrity": "sha512-5aDhJ4CW0iqaW72sTjgqKBhoC6GycnnooJd1a5G/NJlWX0fU9GtQytVjCMt0RXokxJHTGskUBmUkcmmRf75k+g==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-checkbox": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-checkbox/-/nds-checkbox-1.2.11.tgz", + "integrity": "sha512-wRFOfV3u/23w9xR5g96nta9QbhFOe1LNFGi4kZYq8G1eVaOq9vpZ+IzvXNuoExAVHVy8sXVLuzznEqaKD8mCIg==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-container": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-container/-/nds-container-1.0.7.tgz", + "integrity": "sha512-xHzEcVOkmmwNf566JRyemof003BPJL2KdEbEXD788ToFDKTNGkrJHCnJ6L3iE/XszXc+ZODkVNsgWcuYnKi31g==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } }, "@nice-digital/nds-core": { - "version": "1.2.5", - "resolved": "https://registry.npmjs.org/@nice-digital/nds-core/-/nds-core-1.2.5.tgz", - "integrity": "sha512-UGlwnQWyb5IZlBZS3hzkXf5ZGnhP4Q4lJLaqn/5/Dy4I44PimmOCvUsCWVpxS9mcaiufYwfxhpqmEaG9u/J0yA==", + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-core/-/nds-core-1.2.11.tgz", + "integrity": "sha512-REX54E+SvCc0l2K1yTD9OkqyAwjOdbWOfThESJfG9+XUiRqT1ftaVHIG5lekZQbDdeNijp/1u+eZEtBU/8r9Lg==", + "dev": true, "requires": { - "@nice-digital/icons": "^2.2.3", + "@nice-digital/icons": "^2.2.7", "prop-types": "^15.7.2", "sass-mq": "^5.0.0" } }, + "@nice-digital/nds-enhanced-pagination": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-enhanced-pagination/-/nds-enhanced-pagination-1.0.5.tgz", + "integrity": "sha512-dM4CeJa9tQT+cFgkFC6DG/qJvgLQ21X1PHF40zX3GxdKaBX13Wd0Z5OLGagHW7vaLlqgM32+6M1cibfV16tNDA==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.8-alpha.0", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-filters": { + "version": "1.2.20", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-filters/-/nds-filters-1.2.20.tgz", + "integrity": "sha512-gLQAtlEWaO4GNyAdMfYLND+/R1UH9VsYXMd04QtukeDUQiytprU5u8otU8JO9cP7B9NubPYcRdWOPnCdKhOdAQ==", + "dev": true, + "requires": { + "@nice-digital/icons": "^2.2.7", + "@nice-digital/nds-button": "^1.2.11", + "@nice-digital/nds-core": "^1.2.11", + "@nice-digital/nds-input": "^1.2.15", + "@nice-digital/nds-tag": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-form-group": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-form-group/-/nds-form-group-1.2.11.tgz", + "integrity": "sha512-KOVHbiM2N+D74oON38Osla66Kur9y7Ujz0E5+Ml4SrghQWgoGiP4nG9yxM0F+n4lKgOkXF16T8eQfZgbFD8LyA==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "@nice-digital/nds-forms": "^1.2.6", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-forms": { + "version": "1.2.6", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-forms/-/nds-forms-1.2.6.tgz", + "integrity": "sha512-7pb7iixNP5DuDGuwcB7jW1/xzBpQmCbV9eQ0fPBbNjbTS28z5Ox9IYi5r9RmbDdqoB/cp5sDkQ9oKSvVTPqUxA==", + "dev": true + }, + "@nice-digital/nds-full-bleed": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-full-bleed/-/nds-full-bleed-1.1.11.tgz", + "integrity": "sha512-HR9jTsaeKZMhKlYkxRUworUD8O1BROrxcBRu+BkF35vcA6QCFlzLKuOnw93F4QDA4wjQYV1v5uUTb2MlA98AWA==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-grid": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-grid/-/nds-grid-1.2.12.tgz", + "integrity": "sha512-dWAS9bX5rIZnwpBcELXAGVHp46BR15iIyKSg2Bp1lUISNLU7ZKDWoP4qsvpgtOcCJrsZMnvClL2wQbfrrk+90g==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-hero": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-hero/-/nds-hero-1.2.12.tgz", + "integrity": "sha512-KDuQML+KNx0w5RHMw4KnxR3/UaTtCyCPYZUVDRKaUh2ggNRhDmdMNeyusQHlhYUJEzg+TY4U9QZnOERRuft1Ig==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-horizontal-nav": { + "version": "1.1.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-horizontal-nav/-/nds-horizontal-nav-1.1.11.tgz", + "integrity": "sha512-RElRda/6XmFsqqd5KZecmzIXaHWvOSAnZ4FuyXyPT8kpSxECfEYRWLC/M2RvWJzGK6Q9BOlTJBg6f+2AA/NGNQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-in-page-nav": { + "version": "1.2.15", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-in-page-nav/-/nds-in-page-nav-1.2.15.tgz", + "integrity": "sha512-0Ahai/uyKkz0cupS9oijqMMNsDVOE46ZxgSbpPJARphJZL4zM1cuqd/qrAw/DZhC6CAD01Th/jwhNhpONnkJHw==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "lodash.throttle": "^4.1.1", + "prop-types": "^15.7.2", + "slugify": "1.4.7" + } + }, + "@nice-digital/nds-input": { + "version": "1.2.15", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-input/-/nds-input-1.2.15.tgz", + "integrity": "sha512-gXCuIxIZ8g4AQ0PkLmzYh5+cpj0gaSRgf7dpYPPbdr/jNpG1JtNZnkYa32NFm4iqF425GoQZS4tHfacICaVpVQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-maintain-ratio": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-maintain-ratio/-/nds-maintain-ratio-1.2.12.tgz", + "integrity": "sha512-aWGsBjTtspit2TWUnPVs3eqe4TO6MXw2ACqUDw/b8Jf4Ig+Ab8xpo8z7AarC0PCh85ZJA6n+1m7tuKHsrT6d8A==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-page-header": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-page-header/-/nds-page-header-1.2.12.tgz", + "integrity": "sha512-BYrdRJDMVNx7Eu8JmclC/z318fldNxzYeom8xZYQ8GwSlsc5cl1oi9q7SixasNDY/almT/yNGttIH/PaFj8YHQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-panel": { + "version": "1.2.13", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-panel/-/nds-panel-1.2.13.tgz", + "integrity": "sha512-zo0gUey9g/4GklVro8qTNfYQXCc/2yhw40KD1SI6ves7uLDnVdH5WCFab2AgKP4jtXHIUoPsQfVCRLCXH9sycg==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-phase-banner": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-phase-banner/-/nds-phase-banner-1.2.12.tgz", + "integrity": "sha512-XPeY7WIjIUvMYV8QEdgySLED6Vqd6AdPsxW9bNyAq7Dw1XTE3OP3Wx4RgGSTeEyn6hdQEHC8RzR4yg5lZTVjTA==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "@nice-digital/nds-tag": "^1.2.4", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-prev-next": { + "version": "1.1.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-prev-next/-/nds-prev-next-1.1.12.tgz", + "integrity": "sha512-XjgIAAE1YItuij5h0rILtdSFBx88aVREQqTb7e3kIxQ7QPwLREROyPW19fCFL+KnY0gXRHgpwmVgq5hsUXXB7w==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-radio": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-radio/-/nds-radio-1.2.11.tgz", + "integrity": "sha512-MMWIOdcfo0hMVUWq5qyZLQZuP63CPtTb76t2f0dHdDixHfXowF3fGLmy7zKukeLV81/s4JZh6VDjrpkpGwGusQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-simple-pagination": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-simple-pagination/-/nds-simple-pagination-1.2.11.tgz", + "integrity": "sha512-IQ+5C23ylK6Z9rNAnPKalI9AnHPsJBkCTeLI1NRRanSTOGSLU05JIJgtuDIZYI9wAOZr2wAZerLOSpT4f5NC3w==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-stacked-nav": { + "version": "1.2.12", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-stacked-nav/-/nds-stacked-nav-1.2.12.tgz", + "integrity": "sha512-GTv0U5cHhm7e0MPc7S7qlf1aOJwdT4TmJHLEm3WWj+5I/0awncaYF/28Non/z9c8sg0hfqLymz/1G7pedATH2g==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-table": { + "version": "1.1.14", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-table/-/nds-table-1.1.14.tgz", + "integrity": "sha512-DtnWQ8ciq/j1oYBLqDQbq5fuXdxwN+kmUZrYVwV7gNutH58LtS+JzEeq5RaiwI6DdpMiSD3Kf6ylvhXj39Xymw==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-tabs": { + "version": "1.2.15", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-tabs/-/nds-tabs-1.2.15.tgz", + "integrity": "sha512-ISIy8oaxyiMn++sc3GwISsiAewGQZbD0XPVlwl4aF+FRfM95Vj0w91D9ieDOI5N4jcOvAHm/2oc/MwXpZ9VQ9w==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.3.1", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-tag": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-tag/-/nds-tag-1.2.11.tgz", + "integrity": "sha512-R1P+SEVLTF4zT8gi21bzt3/sCRR2/xNt5Xch31xVpc3FSfF0qvr6nXb8IXazrX8J6ysGC1vNUV6WCdPnIY8wRQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, + "@nice-digital/nds-textarea": { + "version": "1.2.11", + "resolved": "https://registry.npmjs.org/@nice-digital/nds-textarea/-/nds-textarea-1.2.11.tgz", + "integrity": "sha512-h6qNfX5lvjpxdk2qLLtXsalm1GbLX6EO4r28usyKFRX3l8BRAQyMTVcBakOcFhU2MlrGvz5wb0XIuZEyPBWofQ==", + "dev": true, + "requires": { + "@nice-digital/nds-core": "^1.2.11", + "classnames": "^2.2.6", + "prop-types": "^15.7.2" + } + }, "@nicolo-ribaudo/chokidar-2": { "version": "2.1.8-no-fsevents", "resolved": "https://registry.npmjs.org/@nicolo-ribaudo/chokidar-2/-/chokidar-2-2.1.8-no-fsevents.tgz", @@ -4416,6 +4787,11 @@ "integrity": "sha512-FA/BWv8t8ZWJ+gEOnLLd8ygxH/2UFbAvgEonyfN6yWGLKc7zVjbpl2Y4CTjid9h2RfgPP6SEt6uHwEOply00yw==", "dev": true }, + "@use-it/event-listener": { + "version": "0.1.6", + "resolved": "https://registry.npmjs.org/@use-it/event-listener/-/event-listener-0.1.6.tgz", + "integrity": "sha512-e6V7vbU8xpuqy4GZkTLExHffOFgxmGHo3kNWnlhzM/zcX2v+idbD/HaJ9sKdQMgTh+L7MIhdRDXGX3SdAViZzA==" + }, "@webassemblyjs/ast": { "version": "1.11.0", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.11.0.tgz", @@ -5323,12 +5699,6 @@ "node-releases": "^1.1.71" } }, - "caniuse-lite": { - "version": "1.0.30001235", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001235.tgz", - "integrity": "sha512-zWEwIVqnzPkSAXOUlQnPW2oKoYb2aLQ4Q5ejdjBcnH63rfypaW34CxaeBn1VMya2XaEU3P/R2qHpWyj+l0BT1A==", - "dev": true - }, "electron-to-chromium": { "version": "1.3.749", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.749.tgz", @@ -5900,6 +6270,12 @@ "quick-lru": "^4.0.1" } }, + "caniuse-lite": { + "version": "1.0.30001283", + "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001283.tgz", + "integrity": "sha512-9RoKo841j1GQFSJz/nCXOj0sD7tHBtlowjYlrqIUS812x9/emfBLBt6IyMz1zIaYc/eRL8Cs6HPUVi2Hzq4sIg==", + "dev": true + }, "capture-exit": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/capture-exit/-/capture-exit-2.0.0.tgz", @@ -6495,12 +6871,6 @@ "node-releases": "^1.1.71" } }, - "caniuse-lite": { - "version": "1.0.30001235", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001235.tgz", - "integrity": "sha512-zWEwIVqnzPkSAXOUlQnPW2oKoYb2aLQ4Q5ejdjBcnH63rfypaW34CxaeBn1VMya2XaEU3P/R2qHpWyj+l0BT1A==", - "dev": true - }, "electron-to-chromium": { "version": "1.3.749", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.749.tgz", @@ -9103,6 +9473,22 @@ "integrity": "sha512-zAoAQiudy+r5SvnSw3KJy5os/oRJYHzrzja/tBDqrZtNhUw8bt6y8OBzMWcjWr+8liV8Eb6yOhw8WZ7VFZ5ZzA==", "dev": true }, + "focus-trap": { + "version": "6.6.0", + "resolved": "https://registry.npmjs.org/focus-trap/-/focus-trap-6.6.0.tgz", + "integrity": "sha512-2hWVR3XbBejn5v8wDW9DFzLWXcxMNaSJ/CtE3E+FJjjBCLwIYbZJwjUi2RDBfQPM58gHEt5hck0jrJgHR9/s+A==", + "requires": { + "tabbable": "^5.2.0" + } + }, + "focus-trap-react": { + "version": "8.7.0", + "resolved": "https://registry.npmjs.org/focus-trap-react/-/focus-trap-react-8.7.0.tgz", + "integrity": "sha512-zqQKgyYFvd9F1We6WeUZkLo/qGWrZKMGMtOXBz+18gyjg5XIzjz+cX8qdtpUZ2eJdyp/1AdHhcklCN8edyF0Ew==", + "requires": { + "focus-trap": "^6.6.0" + } + }, "follow-redirects": { "version": "1.14.1", "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.1.tgz", @@ -12426,6 +12812,12 @@ "integrity": "sha1-7dFMgk4sycHgsKG0K7UhBRakJDg=", "dev": true }, + "lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha1-wj6RtxAkKscMN/HhzaknTMOb8vQ=", + "dev": true + }, "lodash.truncate": { "version": "4.4.2", "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz", @@ -12998,39 +13390,6 @@ "integrity": "sha512-Yd3UES5mWCSqR+qNT93S3UoYUkqAZ9lLg8a7g9rimsWmYGK8cVToA4/sF3RrshdyV3sAGMXVUmpMYOw+dLpOuw==", "dev": true }, - "nerv-devtools": { - "version": "1.5.7", - "resolved": "https://registry.npmjs.org/nerv-devtools/-/nerv-devtools-1.5.7.tgz", - "integrity": "sha512-0EgQfMAARzhEy8qjU4JqVDu00fb84XHVY4qBGkCbsg/EmVD7ZzLar1e27VRD+juMAIc1QPSMS8wlariwDblAPA==", - "dev": true, - "requires": { - "nerv-shared": "1.4.0", - "nerv-utils": "1.4.5", - "nervjs": "1.5.7" - } - }, - "nerv-shared": { - "version": "1.4.0", - "resolved": "https://registry.npmjs.org/nerv-shared/-/nerv-shared-1.4.0.tgz", - "integrity": "sha512-cCyeP1hnnnMfM5HRcmMKconGwI8Wl0xwekAU4DvqDC1M8NxCOF4TwDmedgdgyNt9EkWNbiotBRUV5zJsbfOQWA==", - "dev": true - }, - "nerv-utils": { - "version": "1.4.5", - "resolved": "https://registry.npmjs.org/nerv-utils/-/nerv-utils-1.4.5.tgz", - "integrity": "sha512-9XeifC0l+aDXhA0aXcklxS2o7o87xJxMQAl1+iIHrD5Sei/61ubap0oOzb4t9VMhSEvwWm4/rJRd8PGMKZiwiA==", - "dev": true - }, - "nervjs": { - "version": "1.5.7", - "resolved": "https://registry.npmjs.org/nervjs/-/nervjs-1.5.7.tgz", - "integrity": "sha512-x+hGSOETqA+7lbChW+c/NIXEMrCCvm6IaEHlDbZmaNVX0TAyKZinRIHcYr7o5K/pA4qGWjJQmjoNyx+Mx+rVLg==", - "dev": true, - "requires": { - "nerv-shared": "1.4.0", - "nerv-utils": "1.4.5" - } - }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", @@ -13146,6 +13505,12 @@ "integrity": "sha1-0LFF62kRicY6eNIB3E/bEpPvDAM=", "dev": true }, + "normalize.css": { + "version": "8.0.1", + "resolved": "https://registry.npmjs.org/normalize.css/-/normalize.css-8.0.1.tgz", + "integrity": "sha512-qizSNPO93t1YUuUhP22btGOo3chcvDFqFaj2TRybP0DMxkHOCTYwp3n34fel4a31ORXy4m1Xq0Gyqpb5m33qIg==", + "dev": true + }, "npm-audit-reporter-teamcity": { "version": "0.3.1", "resolved": "https://registry.npmjs.org/npm-audit-reporter-teamcity/-/npm-audit-reporter-teamcity-0.3.1.tgz", @@ -14588,6 +14953,11 @@ "integrity": "sha512-PgidR3wST3dDYKr6b4pJoqQFpPGNKDSCDx4cZoshjXipw3LzO7mG1My2pwEzz2JVkF+inx3xRpDeQLFQGH/hsQ==", "dev": true }, + "react-shadow-root": { + "version": "6.1.0", + "resolved": "https://registry.npmjs.org/react-shadow-root/-/react-shadow-root-6.1.0.tgz", + "integrity": "sha512-ju416JZcvYMC98njQ0ANCF2KTQvN1+2lwmemdExK3ReRCPIgkesIh4dzobd/J5K2hUQve04dp/e6dd2RqgJY4g==" + }, "react-test-renderer": { "version": "16.14.0", "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.14.0.tgz", @@ -15237,7 +15607,8 @@ "sass-mq": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/sass-mq/-/sass-mq-5.0.1.tgz", - "integrity": "sha512-ugSVZO5fzasSFrGfKCtY02spnkOOfo9U9sXuzCuSXoCl1CgcoqdJRdNmigZkhvRVph1GKM6o0pgI00Jjc445CA==" + "integrity": "sha512-ugSVZO5fzasSFrGfKCtY02spnkOOfo9U9sXuzCuSXoCl1CgcoqdJRdNmigZkhvRVph1GKM6o0pgI00Jjc445CA==", + "dev": true }, "saxes": { "version": "5.0.1", @@ -15532,6 +15903,12 @@ } } }, + "slugify": { + "version": "1.4.7", + "resolved": "https://registry.npmjs.org/slugify/-/slugify-1.4.7.tgz", + "integrity": "sha512-tf+h5W1IrjNm/9rKKj0JU2MDMruiopx0jjVA5zCdBtcGjfp0+c5rHw/zADLC3IeKlGHtVbHtpfzvYA0OYT+HKg==", + "dev": true + }, "snapdragon": { "version": "0.8.2", "resolved": "https://registry.npmjs.org/snapdragon/-/snapdragon-0.8.2.tgz", @@ -16460,12 +16837,6 @@ "node-releases": "^1.1.71" } }, - "caniuse-lite": { - "version": "1.0.30001235", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001235.tgz", - "integrity": "sha512-zWEwIVqnzPkSAXOUlQnPW2oKoYb2aLQ4Q5ejdjBcnH63rfypaW34CxaeBn1VMya2XaEU3P/R2qHpWyj+l0BT1A==", - "dev": true - }, "chalk": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.1.tgz", @@ -16943,6 +17314,11 @@ "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==", "dev": true }, + "tabbable": { + "version": "5.2.0", + "resolved": "https://registry.npmjs.org/tabbable/-/tabbable-5.2.0.tgz", + "integrity": "sha512-0uyt8wbP0P3T4rrsfYg/5Rg3cIJ8Shl1RJ54QMqYxm1TLdWqJD1u6+RQjr2Lor3wmfT7JRHkirIwy99ydBsyPg==" + }, "table": { "version": "6.7.1", "resolved": "https://registry.npmjs.org/table/-/table-6.7.1.tgz", @@ -17735,12 +18111,6 @@ "node-releases": "^1.1.71" } }, - "caniuse-lite": { - "version": "1.0.30001235", - "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001235.tgz", - "integrity": "sha512-zWEwIVqnzPkSAXOUlQnPW2oKoYb2aLQ4Q5ejdjBcnH63rfypaW34CxaeBn1VMya2XaEU3P/R2qHpWyj+l0BT1A==", - "dev": true - }, "electron-to-chromium": { "version": "1.3.749", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.749.tgz", diff --git a/package.json b/package.json index 8daeba50..4fe734d4 100644 --- a/package.json +++ b/package.json @@ -61,6 +61,7 @@ "@babel/plugin-transform-runtime": "^7.14.2", "@babel/preset-env": "^7.14.2", "@babel/preset-react": "^7.13.13", + "@nice-digital/design-system": "^1.2.30", "@nice-digital/eslint-config": "^1.0.3", "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3", "autoprefixer": "^10.2.5", @@ -88,8 +89,6 @@ "jest": "^26.6.3", "jest-teamcity-reporter": "^0.9.0", "mockdate": "^3.0.5", - "nerv-devtools": "^1.5.7", - "nervjs": "^1.5.7", "npm-audit-reporter-teamcity": "^0.3.1", "postcss": "^8.2.15", "postcss-loader": "^5.2.0", @@ -116,13 +115,14 @@ "dependencies": { "@babel/runtime": "^7.14.0", "@nice-digital/browserslist-config": "^2.0.1", - "@nice-digital/icons": "^2.2.3", - "@nice-digital/nds-core": "^1.2.4", + "@use-it/event-listener": "^0.1.6", "accessible-autocomplete": "^2.0.3", "classnames": "^2.3.1", "es5-polyfill": "0.0.6", + "focus-trap-react": "^8.7.0", "js-cookie": "^2.2.1", "prop-types": "^15.7.2", + "react-shadow-root": "^6.1.0", "unfetch": "^4.2.0" }, "files": [ diff --git a/src/Common.module.scss b/src/Common.module.scss index 3144a907..04e24d22 100644 --- a/src/Common.module.scss +++ b/src/Common.module.scss @@ -1,3 +1,5 @@ +@import 'Header/header-settings'; + .link .tooltip { clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px); @@ -18,7 +20,7 @@ padding: rem(0 $nds-spacing-x-small); position: absolute; width: auto; - z-index: 1; + z-index: $base-z-index; } .visuallyHidden { diff --git a/src/Footer/Footer.jsx b/src/Footer/Footer.jsx index 3d9309d2..964c5f0f 100644 --- a/src/Footer/Footer.jsx +++ b/src/Footer/Footer.jsx @@ -14,7 +14,7 @@ import { footerClickEventAction } from "../tracker"; export class Footer extends Component { render() { return ( -