Shopify · frehner · May 27, 2022 · May 27, 2022 · May 27, 2022 · frehner
diff --git a/docs/framework/analytics.md b/docs/framework/analytics.md
@@ -279,7 +279,7 @@ To send analytics data from the server-side, complete the following steps:
 
     {% endcodeblock %}
 
-#### Parameters
+### Parameters
 
 The following table describes the request function parameters for `ServerAnalyticsConnector`:
 

diff --git a/package.json b/package.json
@@ -66,10 +66,10 @@
     "shelljs": "^0.8.4",
     "sirv": "^1.0.12",
     "ts-jest": "^26.5.4",
-    "ts-node": "^10.2.1",
+    "ts-node": "^10.8.0",
     "turbo": "^1.2.8",
     "type-fest": "^2.12.0",
-    "typescript": "^4.6.2",
+    "typescript": "^4.7.2",
     "vite": "^2.9.0",
     "yorkie": "^2.0.0"
   },

diff --git a/packages/hydrogen/package.json b/packages/hydrogen/package.json
@@ -70,8 +70,8 @@
     "@types/graphql": "^14.5.0",
     "@types/node": "^16.11.7",
     "@types/node-fetch": "^2.5.9",
-    "@types/react": "^17.0.3",
-    "@types/react-dom": "^17.0.3",
+    "@types/react": "^18.0.9",
+    "@types/react-dom": "^18.0.5",
     "@types/uuid": "^8.3.4",
     "@types/ws": "^8.2.0",
     "babel-loader": "^8.2.2",

diff --git a/packages/hydrogen/src/components/Link/Link.client.tsx b/packages/hydrogen/src/components/Link/Link.client.tsx
@@ -47,7 +47,7 @@ export const Link = React.forwardRef<HTMLAnchorElement, LinkProps>(
     } = props;
 
     const internalClick = useCallback(
-      (e) => {
+      (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => {
         if (onClick) onClick(e);
         if (
           !reloadDocument && // do regular browser stuff

diff --git a/packages/hydrogen/src/components/Metafield/Metafield.client.tsx b/packages/hydrogen/src/components/Metafield/Metafield.client.tsx
@@ -91,7 +91,7 @@ export function Metafield<TTag extends ElementType>(
     case 'url':
       return (
         <a href={data.value as string} {...passthroughProps}>
-          {data.value}
+          {data.value as string}
         </a>
       );
     case 'json': {

diff --git a/packages/hydrogen/src/components/Metafield/tests/Metafield.test.tsx b/packages/hydrogen/src/components/Metafield/tests/Metafield.test.tsx
@@ -377,7 +377,7 @@ describe('<Metafield />', () => {
       const component = mountWithProviders(<Metafield data={metafield} />);
 
       expect(component).toContainReactComponent('a', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
         href: metafield.value as string,
       });
     });
@@ -440,7 +440,7 @@ describe('<Metafield />', () => {
       const component = mountWithProviders(<Metafield data={metafield} />);
 
       expect(component).toContainReactComponent('span', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -452,7 +452,7 @@ describe('<Metafield />', () => {
       );
 
       expect(component).toContainReactComponent('p', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -477,7 +477,7 @@ describe('<Metafield />', () => {
       const component = mountWithProviders(<Metafield data={metafield} />);
 
       expect(component).toContainReactComponent('span', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -489,7 +489,7 @@ describe('<Metafield />', () => {
       );
 
       expect(component).toContainReactComponent('p', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -514,7 +514,7 @@ describe('<Metafield />', () => {
       const component = mountWithProviders(<Metafield data={metafield} />);
 
       expect(component).toContainReactComponent('span', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -526,7 +526,7 @@ describe('<Metafield />', () => {
       );
 
       expect(component).toContainReactComponent('p', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -551,7 +551,7 @@ describe('<Metafield />', () => {
       const component = mountWithProviders(<Metafield data={metafield} />);
 
       expect(component).toContainReactComponent('span', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -563,7 +563,7 @@ describe('<Metafield />', () => {
       );
 
       expect(component).toContainReactComponent('p', {
-        children: metafield.value,
+        children: metafield.value?.toString(),
       });
     });
 
@@ -617,7 +617,7 @@ describe('<Metafield />', () => {
         const component = mountWithProviders(<Metafield data={metafield} />);
 
         expect(component).toContainReactComponent('span', {
-          children: metafield.value,
+          children: metafield.value?.toString(),
         });
       });
 
@@ -629,7 +629,7 @@ describe('<Metafield />', () => {
         );
 
         expect(component).toContainReactComponent('p', {
-          children: metafield.value,
+          children: metafield.value?.toString(),
         });
       });
 

diff --git a/packages/hydrogen/src/components/ModelViewer/ModelViewer.client.tsx b/packages/hydrogen/src/components/ModelViewer/ModelViewer.client.tsx
@@ -141,7 +141,7 @@ export function ModelViewer<TTag extends ElementType>(
   const [modelViewer, setModelViewer] = useState<undefined | HTMLElement>(
     undefined
   );
-  const callbackRef = useCallback((node) => {
+  const callbackRef = useCallback((node: HTMLElement) => {
     setModelViewer(node);
   }, []);
   const {data, id = data.id, children, className, ...passthroughProps} = props;

diff --git a/packages/hydrogen/src/entry-client.tsx b/packages/hydrogen/src/entry-client.tsx
@@ -5,7 +5,6 @@ import React, {
   Fragment,
   type ElementType,
 } from 'react';
-// @ts-expect-error hydrateRoot isn't on the TS types yet, but we're using React 18 so it exists
 import {hydrateRoot} from 'react-dom/client';
 import type {ClientHandler} from './types';
 import {ErrorBoundary} from 'react-error-boundary';

diff --git a/packages/hydrogen/src/foundation/Router/BrowserRouter.client.tsx b/packages/hydrogen/src/foundation/Router/BrowserRouter.client.tsx
@@ -8,6 +8,7 @@ import React, {
   useEffect,
   useLayoutEffect,
   useCallback,
+  ReactNode,
 } from 'react';
 import type {LocationServerProps} from '../ServerPropsProvider/ServerPropsProvider';
 import {META_ENV_SSR} from '../ssr-interop';
@@ -23,10 +24,10 @@ export const RouterContext = createContext<RouterContextValue | {}>({});
 let isFirstLoad = true;
 const positions: Record<string, number> = {};
 
-export const BrowserRouter: FC<{history?: BrowserHistory}> = ({
-  history: pHistory,
-  children,
-}) => {
+export const BrowserRouter: FC<{
+  history?: BrowserHistory;
+  children: ReactNode;
+}> = ({history: pHistory, children}) => {
   if (META_ENV_SSR) return <>{children}</>;
   /* eslint-disable react-hooks/rules-of-hooks */
 

diff --git a/packages/hydrogen/src/foundation/useRouteParams/RouteParamsProvider.client.tsx b/packages/hydrogen/src/foundation/useRouteParams/RouteParamsProvider.client.tsx
@@ -1,15 +1,15 @@
-import React, {createContext, FC} from 'react';
+import React, {createContext, FC, ReactNode} from 'react';
 
 type RouteParamsContextValue = {routeParams: Record<string, string>};
 
 export const RouteParamsContext = createContext<RouteParamsContextValue>({
   routeParams: {},
 });
 
-export const RouteParamsProvider: FC<{routeParams: Record<string, string>}> = ({
-  children,
-  routeParams,
-}) => {
+export const RouteParamsProvider: FC<{
+  routeParams: Record<string, string>;
+  children: ReactNode;
+}> = ({children, routeParams}) => {
   return (
     <RouteParamsContext.Provider value={{routeParams}}>
       {children}

diff --git a/yarn.lock b/yarn.lock
@@ -846,17 +846,12 @@
     exec-sh "^0.3.2"
     minimist "^1.2.0"
 
-"@cspotcode/[email protected]":
-  version "0.8.0"
-  resolved "https://registry.yarnpkg.com/@cspotcode/source-map-consumer/-/source-map-consumer-0.8.0.tgz#33bf4b7b39c178821606f669bbc447a6a629786b"
-  integrity sha512-41qniHzTU8yAGbCp04ohlmSrZf8bkf/iJsl3V0dRGsQN/5GFfx+LbCSsCpp2gqrqjTVg/K6O8ycoV35JIwAzAg==
-
-"@cspotcode/[email protected]":
-  version "0.7.0"
-  resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.7.0.tgz#4789840aa859e46d2f3173727ab707c66bf344f5"
-  integrity sha512-X4xqRHqN8ACt2aHVe51OxeA2HjbcL4MqFqXkrmQszJ1NOUuUu5u6Vqx/0lZSVNku7velL5FC/s5uEAj1lsBMhA==
+"@cspotcode/source-map-support@^0.8.0":
+  version "0.8.1"
+  resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1"
+  integrity sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==
   dependencies:
-    "@cspotcode/source-map-consumer" "0.8.0"
+    "@jridgewell/trace-mapping" "0.3.9"
 
 "@endemolshinegroup/[email protected]":
   version "3.0.2"
@@ -1553,7 +1548,7 @@
   resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.11.tgz#771a1d8d744eeb71b6adb35808e1a6c7b9b8c8ec"
   integrity sha512-Fg32GrJo61m+VqYSdRSjRXMjQ06j8YIYfcTqndLYVAaHmroZHLJZCydsWBOTDqXS2v+mjxohBWEMfg97GXmYQg==
 
-"@jridgewell/trace-mapping@^0.3.0", "@jridgewell/trace-mapping@^0.3.7":
+"@jridgewell/trace-mapping@0.3.9", "@jridgewell/trace-mapping@^0.3.0", "@jridgewell/trace-mapping@^0.3.7":
   version "0.3.9"
   resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz#6534fd5933a53ba7cbf3a17615e273a0d1273ff9"
   integrity sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==
@@ -2405,24 +2400,17 @@
   resolved "https://registry.yarnpkg.com/@types/qs/-/qs-6.9.7.tgz#63bb7d067db107cc1e457c303bc25d511febf6cb"
   integrity sha512-FGa1F62FT09qcrueBA6qYTrJPVDzah9a+493+o2PCXsesWHIn27G98TsSMs3WPNbZIEj4+VJf6saSFpvD+3Zsw==
 
-"@types/react-dom@^17.0.3":
-  version "17.0.11"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-17.0.11.tgz#e1eadc3c5e86bdb5f7684e00274ae228e7bcc466"
-  integrity sha512-f96K3k+24RaLGVu/Y2Ng3e1EbZ8/cVJvypZWd7cy0ofCBaf2lcM46xNhycMZ2xGwbBjRql7hOlZ+e2WlJ5MH3Q==
-  dependencies:
-    "@types/react" "*"
-
-"@types/react-dom@^18.0.0":
-  version "18.0.2"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.0.2.tgz#2d6b46557aa30257e87e67a6d952146d15979d79"
-  integrity sha512-UxeS+Wtj5bvLRREz9tIgsK4ntCuLDo0EcAcACgw3E+9wE8ePDr9uQpq53MfcyxyIS55xJ+0B6mDS8c4qkkHLBg==
+"@types/react-dom@^18.0.0", "@types/react-dom@^18.0.5":
+  version "18.0.5"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-18.0.5.tgz#330b2d472c22f796e5531446939eacef8378444a"
+  integrity sha512-OWPWTUrY/NIrjsAPkAk1wW9LZeIjSvkXRhclsFO8CZcZGCOg2G0YZy4ft+rOyYxy8B7ui5iZzi9OkDebZ7/QSA==
   dependencies:
     "@types/react" "*"
 
-"@types/react@*", "@types/react@^17.0.3":
-  version "17.0.37"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.37.tgz#6884d0aa402605935c397ae689deed115caad959"
-  integrity sha512-2FS1oTqBGcH/s0E+CjrCCR9+JMpsu9b69RTFO+40ua43ZqP5MmQ4iUde/dMjWR909KxZwmOQIFq6AV6NjEG5xg==
+"@types/react@*", "@types/react@^18.0.9":
+  version "18.0.9"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-18.0.9.tgz#d6712a38bd6cd83469603e7359511126f122e878"
+  integrity sha512-9bjbg1hJHUm4De19L1cHiW0Jvx3geel6Qczhjd0qY5VKVE2X5+x77YxAepuCwVh4vrgZJdgEJw48zrhRIeF4Nw==
   dependencies:
     "@types/prop-types" "*"
     "@types/scheduler" "*"
@@ -11724,12 +11712,12 @@ ts-log@^2.2.3:
   resolved "https://registry.yarnpkg.com/ts-log/-/ts-log-2.2.4.tgz#d672cf904b33735eaba67a7395c93d45fba475b3"
   integrity sha512-DEQrfv6l7IvN2jlzc/VTdZJYsWUnQNCsueYjMkC/iXoEoi5fNan6MjeDqkvhfzbmHgdz9UxDUluX3V5HdjTydQ==
 
-ts-node@^10.2.1:
-  version "10.4.0"
-  resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-10.4.0.tgz#680f88945885f4e6cf450e7f0d6223dd404895f7"
-  integrity sha512-g0FlPvvCXSIO1JDF6S232P5jPYqBkRL9qly81ZgAOSU7rwI0stphCgd2kLiCrU9DjQCrJMWEqcNSjQL02s6d8A==
+ts-node@^10.8.0:
+  version "10.8.0"
+  resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-10.8.0.tgz#3ceb5ac3e67ae8025c1950626aafbdecb55d82ce"
+  integrity sha512-/fNd5Qh+zTt8Vt1KbYZjRHCE9sI5i7nqfD/dzBBRDeVXZXS6kToW6R7tTU6Nd4XavFs0mAVCg29Q//ML7WsZYA==
   dependencies:
-    "@cspotcode/source-map-support" "0.7.0"
+    "@cspotcode/source-map-support" "^0.8.0"
     "@tsconfig/node10" "^1.0.7"
     "@tsconfig/node12" "^1.0.7"
     "@tsconfig/node14" "^1.0.0"
@@ -11740,6 +11728,7 @@ ts-node@^10.2.1:
     create-require "^1.1.0"
     diff "^4.0.1"
     make-error "^1.1.1"
+    v8-compile-cache-lib "^3.0.1"
     yn "3.1.1"
 
 ts-node@^9:
@@ -11953,11 +11942,16 @@ typedarray@^0.0.6:
   resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
   integrity sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=
 
-typescript@^4.3.4, typescript@^4.6.2, typescript@^4.6.3:
+typescript@^4.3.4, typescript@^4.6.3:
   version "4.6.3"
   resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.6.3.tgz#eefeafa6afdd31d725584c67a0eaba80f6fc6c6c"
   integrity sha512-yNIatDa5iaofVozS/uQJEl3JRWLKKGJKh6Yaiv0GLGSuhpFJe7P3SbHZ8/yjAHRQwKRoA6YZqlfjXWmVzoVSMw==
 
+typescript@^4.7.2:
+  version "4.7.2"
+  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.2.tgz#1f9aa2ceb9af87cca227813b4310fff0b51593c4"
+  integrity sha512-Mamb1iX2FDUpcTRzltPxgWMKy3fhg0TN378ylbktPGPK/99KbDtMQ4W1hwgsbPAsG3a0xKa1vmw4VKZQbkvz5A==
+
 typeson-registry@^1.0.0-alpha.39:
   version "1.0.0-alpha.39"
   resolved "https://registry.yarnpkg.com/typeson-registry/-/typeson-registry-1.0.0-alpha.39.tgz#9e0f5aabd5eebfcffd65a796487541196f4b1211"
@@ -12260,6 +12254,11 @@ [email protected]:
   resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2"
   integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg==
 
+v8-compile-cache-lib@^3.0.1:
+  version "3.0.1"
+  resolved "https://registry.yarnpkg.com/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
+  integrity sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==
+
 v8-compile-cache@^2.0.3:
   version "2.3.0"
   resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"