Replace NHS.UK frontend CommonJS workarounds

Author: colinrotherham

bundle-base.tsconfig.json

@@ -23,8 +23,7 @@
       "@navigation/*": ["src/components/navigation/*"],
       "@typography/*": ["src/components/typography/*"],
       "@util/*": ["src/util/*"],
-      "@patterns/*": ["src/patterns/*"],
-      "@resources/*": ["src/resources/*"]
+      "@patterns/*": ["src/patterns/*"]
     }
   },
   "include": ["src"],

src/components/content-presentation/tabs/Tabs.tsx

@@ -2,7 +2,8 @@
 import classNames from 'classnames';
 import React, { FC, HTMLAttributes, useEffect } from 'react';
 import HeadingLevel, { HeadingLevelType } from '@components/utils/HeadingLevel';
-import TabsJs from '@resources/tabs';
+// @ts-expect-error -- No types available
+import TabsJs from 'nhsuk-frontend/packages/components/tabs/tabs';
 
 type TabsProps = HTMLAttributes<HTMLDivElement>;
 

src/components/form-elements/character-count/CharacterCount.tsx

@@ -1,6 +1,7 @@
 'use client';
 import React, { FC, useEffect } from 'react';
-import CharacterCountJs from '@resources/character-count';
+// @ts-expect-error -- No types available
+import CharacterCountJs from 'nhsuk-frontend/packages/components/character-count/character-count';
 import { HTMLAttributesWithData } from '@util/types/NHSUKTypes';
 
 export enum CharacterCountType {

src/components/form-elements/checkboxes/Checkboxes.tsx

@@ -8,7 +8,8 @@ import CheckboxContext, { ICheckboxContext } from './CheckboxContext';
 import Box from './components/Box';
 import Divider from './components/Divider';
 import { generateRandomName } from '@util/RandomID';
-import CheckboxJs from '@resources/checkboxes';
+// @ts-expect-error -- No types available
+import CheckboxesJs from 'nhsuk-frontend/packages/components/checkboxes/checkboxes';
 
 interface CheckboxesProps extends HTMLProps<HTMLDivElement>, FormElementProps {
   idPrefix?: string;

src/components/navigation/header/Header.tsx

@@ -11,7 +11,8 @@ import NavDropdownMenu from './components/NavDropdownMenu';
 import { Container } from '@components/layout';
 import Content from './components/Content';
 import TransactionalServiceName from './components/TransactionalServiceName';
-import HeaderJs from '@resources/header';
+// @ts-expect-error -- No types available
+import HeaderJs from 'nhsuk-frontend/packages/components/header/header';
 
 const BaseHeaderLogo: FC<OrganisationalLogoProps & NHSLogoNavProps> = (props) => {
   const { orgName } = useContext<IHeaderContext>(HeaderContext);

src/components/navigation/header/__tests__/__snapshots__/Header.test.tsx.snap

@@ -174,7 +174,7 @@ exports[`The header component Matches the snapshot 1`] = `
           >
             <button
               aria-expanded="false"
-              class="nhsuk-header__menu-toggle nhsuk-header__navigation-link"
+              class="nhsuk-header__menu-toggle nhsuk-header__navigation-link "
             >
               <span
                 class="nhsuk-u-visually-hidden"
@@ -195,9 +195,6 @@ exports[`The header component Matches the snapshot 1`] = `
                 />
               </svg>
             </button>
-            <ul
-              class="nhsuk-header__drop-down nhsuk-header__drop-down--hidden"
-            />
           </li>
         </ul>
       </nav>