separate ThemeContext and useTheme code

2025-04-26 12:58:28 -04:00 · 2022-04-06 17:40:16 -04:00 · 2022-04-06 17:40:16 -04:00 · 25aed87b21
commit 25aed87b21
parent eccf2108c7
9 changed files with 165 additions and 175 deletions
--- a/components/Header/Header.tsx
+++ b/components/Header/Header.tsx
@ -1,7 +1,6 @@
 import { memo } from "react";
 import Selfie from "../Selfie";
 import Menu from "../Menu";
-import Ukraine from "../Ukraine";
 import { styled } from "../../lib/styles/stitches.config";
 import type { ComponentProps } from "react";

@ -58,15 +57,12 @@ export type HeaderProps = ComponentProps<typeof Wrapper> & {
 };

 const Header = ({ sticky, ...rest }: HeaderProps) => (
-  <>
-    <Ukraine />
-    <Wrapper sticky={sticky} {...rest}>
-      <Nav>
-        <Selfie />
-        <ResponsiveMenu />
-      </Nav>
-    </Wrapper>
-  </>
+  <Wrapper sticky={sticky} {...rest}>
+    <Nav>
+      <Selfie />
+      <ResponsiveMenu />
+    </Nav>
+  </Wrapper>
 );

 export default memo(Header);
--- a/components/NoteMeta/NoteMeta.tsx
+++ b/components/NoteMeta/NoteMeta.tsx
@ -33,6 +33,12 @@ const Icon = styled("svg", {
  marginRight: "0.6em",
 });

+const TagsList = styled("span", {
+  whiteSpace: "normal",
+  display: "inline-flex",
+  flexWrap: "wrap",
+});
+
 const Tag = styled("span", {
  textTransform: "lowercase",
  whiteSpace: "nowrap",
@ -62,29 +68,27 @@ const NoteMeta = ({ slug, date, title, htmlTitle, tags = [] }: NoteMetaProps) =>
          }}
          passHref={true}
        >
-          <MetaLink>
+          <MetaLink title={formatDateTZ(date)}>
            <span>
              <Icon as={DateIcon} />
            </span>
-            <span title={formatDateTZ(date)}>{formatDateTZ(date, "MMMM d, yyyy")}</span>
+            <span>{formatDateTZ(date, "MMMM d, yyyy")}</span>
          </MetaLink>
        </Link>
      </MetaItem>

      {tags.length > 0 && (
-        <MetaItem
-          css={{
-            whiteSpace: "normal",
-            display: "inline-flex",
-            flexWrap: "wrap",
-          }}
-        >
-          <span>
+        <MetaItem>
+          <span title="Tags">
            <Icon as={TagIcon} />
          </span>
-          {tags.map((tag) => (
-            <Tag key={tag}>{tag}</Tag>
-          ))}
+          <TagsList>
+            {tags.map((tag) => (
+              <Tag key={tag} title={tag}>
+                {tag}
+              </Tag>
+            ))}
+          </TagsList>
        </MetaItem>
      )}

--- a/contexts/ThemeContext.tsx
+++ b/contexts/ThemeContext.tsx
@ -1,9 +1,10 @@
-// forked & modified from pacocoursey/next-themes as of v0.0.15:
-// https://github.com/pacocoursey/next-themes/tree/b5c2bad50de2d61ad7b52a9c5cdc801a78507d7a
+// forked & heavily modified from pacocoursey/next-themes as of v0.0.15:
+// https://github.com/pacocoursey/next-themes/blob/b5c2bad50de2d61ad7b52a9c5cdc801a78507d7a/index.tsx

-import { createContext, useCallback, useContext, useEffect, useState, useRef } from "react";
+import { createContext, useCallback, useEffect, useState, useRef } from "react";
 import { darkModeQuery, colorSchemes, themeStorageKey } from "../lib/styles/helpers/themes";
 import type { PropsWithChildren } from "react";
+import type { UseThemeProps } from "../hooks/use-theme";

 export interface ThemeProviderProps {
  /** Mapping of theme name to HTML attribute value. Object where key is the theme name and value is the attribute value */
@ -14,19 +15,8 @@ export interface ThemeProviderProps {
  enableColorScheme?: boolean;
 }

-export interface UseThemeProps {
-  /** List of all available theme names */
-  themes: string[];
-  /** Active theme name */
-  theme?: string;
-  /** If the active theme is "system", this returns whether the system preference resolved to "dark" or "light". Otherwise, identical to `theme` */
-  resolvedTheme?: string;
-  /** Update the theme */
-  setTheme: (theme: string) => void;
-}
-
-// get the current theme *after* being set by this script
-const getTheme = (key: string, fallback?: string) => {
+// get the user's saved theme preference
+const getUserTheme = (key: string, fallback?: string) => {
  if (typeof window === "undefined") return undefined;

  let theme: string;
@ -37,24 +27,20 @@ const getTheme = (key: string, fallback?: string) => {
  return theme || fallback;
 };

-// get the user's prefered theme as set via their OS/browser settings
+// get the user's preferred theme via their OS/browser settings
 const getSystemTheme = (e?: MediaQueryList) => {
  if (!e) {
    e = window.matchMedia(darkModeQuery);
  }

-  const isDark = e.matches;
-  const systemTheme = isDark ? "dark" : "light";
-  return systemTheme;
+  return e.matches ? "dark" : "light";
 };

-// useTheme() function to get current theme state from pages/components/etc.
-const ThemeContext = createContext<UseThemeProps>({
+export const ThemeContext = createContext<UseThemeProps>({
  // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars
  setTheme: (_) => {},
  themes: [],
 });
-export const useTheme = () => useContext(ThemeContext);

 // provider used once in _app.tsx to wrap entire app
 export const ThemeProvider = ({
@ -63,21 +49,8 @@ export const ThemeProvider = ({
  enableColorScheme = true,
  children,
 }: PropsWithChildren<ThemeProviderProps>) => {
-  const [theme, setThemeState] = useState(() => getTheme(themeStorageKey, "system"));
-  const [resolvedTheme, setResolvedTheme] = useState(() => getTheme(themeStorageKey));
-
-  const handleMediaQuery = useCallback(
-    (e?) => {
-      const systemTheme = getSystemTheme(e);
-      setResolvedTheme(systemTheme);
-      if (theme === "system") changeTheme(systemTheme, false);
-    },
-    [theme] // eslint-disable-line react-hooks/exhaustive-deps
-  );
-
-  // Ref hack to avoid adding handleMediaQuery as a dep
-  const mediaListener = useRef(handleMediaQuery);
-  mediaListener.current = handleMediaQuery;
+  const [currentTheme, setCurrentTheme] = useState(() => getUserTheme(themeStorageKey, "system"));
+  const [resolvedTheme, setResolvedTheme] = useState(() => getUserTheme(themeStorageKey));

  const changeTheme = useCallback((theme, updateStorage = true, updateDOM = true) => {
    let name = classNames?.[theme] || theme;
@ -102,28 +75,41 @@ export const ThemeProvider = ({
    }
  }, []); // eslint-disable-line react-hooks/exhaustive-deps

+  const setTheme = useCallback(
+    (newTheme) => {
+      changeTheme(newTheme);
+      setCurrentTheme(newTheme);
+    },
+    [] // eslint-disable-line react-hooks/exhaustive-deps
+  );
+
+  const handleMediaQuery = useCallback(
+    (e?) => {
+      const systemTheme = getSystemTheme(e);
+      setResolvedTheme(systemTheme);
+      if (currentTheme === "system") changeTheme(systemTheme, false);
+    },
+    [currentTheme] // eslint-disable-line react-hooks/exhaustive-deps
+  );
+
+  // ref hack to avoid adding handleMediaQuery as a dependency
+  const mediaListener = useRef(handleMediaQuery);
+  mediaListener.current = handleMediaQuery;
+
  useEffect(() => {
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    const handler = (...args: any) => mediaListener.current(...args);

-    // Always listen to System preference
+    // listen to system preference
    const media = window.matchMedia(darkModeQuery);

-    // Intentionally use deprecated listener methods to support iOS & old browsers
+    // note: intentionally using deprecated listener methods to support older iOS/browsers
    media.addListener(handler);
    handler(media);

    return () => media.removeListener(handler);
  }, []);

-  const setTheme = useCallback(
-    (newTheme) => {
-      changeTheme(newTheme);
-      setThemeState(newTheme);
-    },
-    [] // eslint-disable-line react-hooks/exhaustive-deps
-  );
-
  // localStorage event handling
  useEffect(() => {
    const handleStorage = (e: StorageEvent) => {
@ -145,25 +131,24 @@ export const ThemeProvider = ({
    if (!enableColorScheme) return;

    const colorScheme =
-      // If regular theme is light or dark
-      theme && colorSchemes.includes(theme)
-        ? theme
-        : // If theme is system, use the resolved version
-        theme === "system"
+      currentTheme && colorSchemes.includes(currentTheme) // light or dark
+        ? currentTheme
+        : // preference is unset, use the OS/browser setting
+        currentTheme === "system"
        ? resolvedTheme || null
        : null;

    // color-scheme tells browser how to render built-in elements like forms, scrollbars, etc.
    // if color-scheme is null, this will remove the property
    document.documentElement.style.setProperty("color-scheme", colorScheme);
-  }, [theme, resolvedTheme]); // eslint-disable-line react-hooks/exhaustive-deps
+  }, [currentTheme, resolvedTheme]); // eslint-disable-line react-hooks/exhaustive-deps

  return (
    <ThemeContext.Provider
      value={{
        themes: [...themes, "system"],
-        theme,
-        resolvedTheme: theme === "system" ? resolvedTheme : theme,
+        theme: currentTheme,
+        resolvedTheme: currentTheme === "system" ? resolvedTheme : currentTheme,
        setTheme,
      }}
    >
--- a/hooks/use-has-mounted.ts
+++ b/hooks/use-has-mounted.ts
@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";

-export const useHasMounted = () => {
+export const useHasMounted = (): boolean => {
  const [hasMounted, setHasMounted] = useState(false);

  useEffect(() => {
--- a/hooks/use-theme.ts
+++ b/hooks/use-theme.ts
@ -0,0 +1,16 @@
+import { useContext } from "react";
+import { ThemeContext } from "../contexts/ThemeContext";
+
+export interface UseThemeProps {
+  /** List of all available theme names */
+  themes: string[];
+  /** Active theme name */
+  theme?: string;
+  /** If the active theme is "system", this returns whether the system preference resolved to "dark" or "light". Otherwise, identical to `theme` */
+  resolvedTheme?: string;
+  /** Update the theme */
+  setTheme: (theme: string) => void;
+}
+
+// useTheme() function to get current theme state from pages/components/etc.
+export const useTheme = (): UseThemeProps => useContext(ThemeContext);
--- a/lib/config/constants.ts
+++ b/lib/config/constants.ts
@ -3,3 +3,7 @@ export const NOTES_DIR = "./notes";

 // normalize the timestamp saved when building/deploying (see next.config.js) and fall back to right now:
 export const RELEASE_DATE = new Date(process.env.RELEASE_DATE ?? Date.now()).toISOString();
+
+// detect current backend environment
+export const IS_PROD = process.env.NEXT_PUBLIC_VERCEL_ENV === "production";
+export const IS_DEV_SERVER = !!process.env.IS_DEV_SERVER;
--- a/package.json
+++ b/package.json
@ -45,7 +45,7 @@
    "next-compose-plugins": "^2.2.1",
    "next-mdx-remote": "4.0.1",
    "next-seo": "^5.4.0",
-    "next-sitemap": "^2.5.18",
+    "next-sitemap": "^2.5.19",
    "next-transpile-modules": "^9.0.0",
    "node-fetch": "^3.2.3",
    "p-retry": "^5.1.0",
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@ -2,7 +2,7 @@ import { useEffect } from "react";
 import { useRouter } from "next/router";
 import { DefaultSeo, SocialProfileJsonLd } from "next-seo";
 import * as Fathom from "fathom-client";
-import { ThemeProvider } from "../hooks/use-theme";
+import { ThemeProvider } from "../contexts/ThemeContext";
 import Layout from "../components/Layout";
 import * as config from "../lib/config";
 import { defaultSeo, socialProfileJsonLd } from "../lib/config/seo";
--- a/yarn.lock
+++ b/yarn.lock
@ -44,30 +44,30 @@
    source-map "^0.5.0"

 "@babel/core@^7.15.5":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.17.8.tgz#3dac27c190ebc3a4381110d46c80e77efe172e1a"
-  integrity sha512-OdQDV/7cRBtJHLSOBqqbYNkOcydOgnX59TZx4puf41fzcVtN3e/4yqY8lMQsK+5X2lJtAdmA+6OHqsj1hBJ4IQ==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/core/-/core-7.17.9.tgz#6bae81a06d95f4d0dec5bb9d74bbc1f58babdcfe"
+  integrity sha512-5ug+SfZCpDAkVp9SFIZAzlW18rlzsOcJGaetCjkySnrXXDUw9AR8cDUm1iByTmdWM6yxX6/zycaV76w3YTF2gw==
  dependencies:
    "@ampproject/remapping" "^2.1.0"
    "@babel/code-frame" "^7.16.7"
-    "@babel/generator" "^7.17.7"
+    "@babel/generator" "^7.17.9"
    "@babel/helper-compilation-targets" "^7.17.7"
    "@babel/helper-module-transforms" "^7.17.7"
-    "@babel/helpers" "^7.17.8"
-    "@babel/parser" "^7.17.8"
+    "@babel/helpers" "^7.17.9"
+    "@babel/parser" "^7.17.9"
    "@babel/template" "^7.16.7"
-    "@babel/traverse" "^7.17.3"
+    "@babel/traverse" "^7.17.9"
    "@babel/types" "^7.17.0"
    convert-source-map "^1.7.0"
    debug "^4.1.0"
    gensync "^1.0.0-beta.2"
-    json5 "^2.1.2"
+    json5 "^2.2.1"
    semver "^6.3.0"

-"@babel/generator@^7.12.5", "@babel/generator@^7.17.3", "@babel/generator@^7.17.7":
-  version "7.17.7"
-  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.7.tgz#8da2599beb4a86194a3b24df6c085931d9ee45ad"
-  integrity sha512-oLcVCTeIFadUoArDTwpluncplrYBmTCCZZgXCbgNGvOBBiSDDK3eWO4b/+eOTli5tKv1lg+a5/NAXg+nTcei1w==
+"@babel/generator@^7.12.5", "@babel/generator@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/generator/-/generator-7.17.9.tgz#f4af9fd38fa8de143c29fce3f71852406fc1e2fc"
+  integrity sha512-rAdDousTwxbIxbz5I7GEQ3lUip+xVCXooZNbsydCWs3xA7ZsYOv+CFRdzGxRX78BmQHu9B1Eso59AOZQOJDEdQ==
  dependencies:
    "@babel/types" "^7.17.0"
    jsesc "^2.5.1"
@ -99,14 +99,14 @@
    semver "^6.3.0"

 "@babel/helper-create-class-features-plugin@^7.16.10", "@babel/helper-create-class-features-plugin@^7.16.7", "@babel/helper-create-class-features-plugin@^7.17.6":
-  version "7.17.6"
-  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.17.6.tgz#3778c1ed09a7f3e65e6d6e0f6fbfcc53809d92c9"
-  integrity sha512-SogLLSxXm2OkBbSsHZMM4tUi8fUzjs63AT/d0YQIzr6GSd8Hxsbk2KYDX0k0DweAzGMj/YWeiCsorIdtdcW8Eg==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-create-class-features-plugin/-/helper-create-class-features-plugin-7.17.9.tgz#71835d7fb9f38bd9f1378e40a4c0902fdc2ea49d"
+  integrity sha512-kUjip3gruz6AJKOq5i3nC6CoCEEF/oHH3cp6tOZhB+IyyyPyW0g1Gfsxn3mkk6S08pIA2y8GQh609v9G/5sHVQ==
  dependencies:
    "@babel/helper-annotate-as-pure" "^7.16.7"
    "@babel/helper-environment-visitor" "^7.16.7"
-    "@babel/helper-function-name" "^7.16.7"
-    "@babel/helper-member-expression-to-functions" "^7.16.7"
+    "@babel/helper-function-name" "^7.17.9"
+    "@babel/helper-member-expression-to-functions" "^7.17.7"
    "@babel/helper-optimise-call-expression" "^7.16.7"
    "@babel/helper-replace-supers" "^7.16.7"
    "@babel/helper-split-export-declaration" "^7.16.7"
@ -147,21 +147,13 @@
  dependencies:
    "@babel/types" "^7.16.7"

-"@babel/helper-function-name@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.16.7.tgz#f1ec51551fb1c8956bc8dd95f38523b6cf375f8f"
-  integrity sha512-QfDfEnIUyyBSR3HtrtGECuZ6DAyCkYFp7GHl75vFtTnn6pjKeK0T1DB5lLkFvBea8MdaiUABx3osbgLyInoejA==
+"@babel/helper-function-name@^7.16.7", "@babel/helper-function-name@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/helper-function-name/-/helper-function-name-7.17.9.tgz#136fcd54bc1da82fcb47565cf16fd8e444b1ff12"
+  integrity sha512-7cRisGlVtiVqZ0MW0/yFB4atgpGLWEHUVYnb448hZK4x+vih0YO5UoS11XIYtZYqHd0dIPMdUSv8q5K4LdMnIg==
  dependencies:
-    "@babel/helper-get-function-arity" "^7.16.7"
    "@babel/template" "^7.16.7"
-    "@babel/types" "^7.16.7"
-
-"@babel/helper-get-function-arity@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/helper-get-function-arity/-/helper-get-function-arity-7.16.7.tgz#ea08ac753117a669f1508ba06ebcc49156387419"
-  integrity sha512-flc+RLSOBXzNzVhcLu6ujeHUrD6tANAOU5ojrRx/as+tbzf8+stUCj7+IfRRoAbEZqj/ahXEMsjhOhgeZsrnTw==
-  dependencies:
-    "@babel/types" "^7.16.7"
+    "@babel/types" "^7.17.0"

 "@babel/helper-hoist-variables@^7.16.7":
  version "7.16.7"
@ -170,7 +162,7 @@
  dependencies:
    "@babel/types" "^7.16.7"

-"@babel/helper-member-expression-to-functions@^7.16.7":
+"@babel/helper-member-expression-to-functions@^7.16.7", "@babel/helper-member-expression-to-functions@^7.17.7":
  version "7.17.7"
  resolved "https://registry.yarnpkg.com/@babel/helper-member-expression-to-functions/-/helper-member-expression-to-functions-7.17.7.tgz#a34013b57d8542a8c4ff8ba3f747c02452a4d8c4"
  integrity sha512-thxXgnQ8qQ11W2wVUObIqDL4p148VMxkt5T/qpN5k2fboRyzFGFmKsTGViquyM5QHKUy48OZoca8kw4ajaDPyw==
@ -276,28 +268,28 @@
    "@babel/traverse" "^7.16.8"
    "@babel/types" "^7.16.8"

-"@babel/helpers@^7.12.5", "@babel/helpers@^7.17.8":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.17.8.tgz#288450be8c6ac7e4e44df37bcc53d345e07bc106"
-  integrity sha512-QcL86FGxpfSJwGtAvv4iG93UL6bmqBdmoVY0CMCU2g+oD2ezQse3PT5Pa+jiD6LJndBQi0EDlpzOWNlLuhz5gw==
+"@babel/helpers@^7.12.5", "@babel/helpers@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/helpers/-/helpers-7.17.9.tgz#b2af120821bfbe44f9907b1826e168e819375a1a"
+  integrity sha512-cPCt915ShDWUEzEp3+UNRktO2n6v49l5RSnG9M5pS24hA+2FAc5si+Pn1i4VVbQQ+jh+bIZhPFQOJOzbrOYY1Q==
  dependencies:
    "@babel/template" "^7.16.7"
-    "@babel/traverse" "^7.17.3"
+    "@babel/traverse" "^7.17.9"
    "@babel/types" "^7.17.0"

 "@babel/highlight@^7.16.7":
-  version "7.16.10"
-  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.16.10.tgz#744f2eb81579d6eea753c227b0f570ad785aba88"
-  integrity sha512-5FnTQLSLswEj6IkgVw5KusNUUFY9ZGqe/TRFnP/BKYHYgfh7tc+C7mwiy95/yNP7Dh9x580Vv8r7u7ZfTBFxdw==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/highlight/-/highlight-7.17.9.tgz#61b2ee7f32ea0454612def4fccdae0de232b73e3"
+  integrity sha512-J9PfEKCbFIv2X5bjTMiZu6Vf341N05QIY+d6FvVKynkG1S7G0j3I0QoRtWIrXhZ+/Nlb5Q0MzqL7TokEJ5BNHg==
  dependencies:
    "@babel/helper-validator-identifier" "^7.16.7"
    chalk "^2.0.0"
    js-tokens "^4.0.0"

-"@babel/parser@^7.12.7", "@babel/parser@^7.16.7", "@babel/parser@^7.17.3", "@babel/parser@^7.17.8":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.8.tgz#2817fb9d885dd8132ea0f8eb615a6388cca1c240"
-  integrity sha512-BoHhDJrJXqcg+ZL16Xv39H9n+AqJ4pcDrQBGZN+wHxIysrLZ3/ECwCBUch/1zUNhnsXULcONU3Ei5Hmkfk6kiQ==
+"@babel/parser@^7.12.7", "@babel/parser@^7.16.7", "@babel/parser@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.9.tgz#9c94189a6062f0291418ca021077983058e171ef"
+  integrity sha512-vqUSBLP8dQHFPdPi9bc5GK9vRkYHJ49fsZdtoJ8EQ8ibpwk5rPKfvNIwChB0KVXcIjcepEBBd2VHC5r9Gy8ueg==

 "@babel/plugin-bugfix-safari-id-destructuring-collision-in-function-expression@^7.16.7":
  version "7.16.7"
@ -692,9 +684,9 @@
    babel-plugin-dynamic-import-node "^2.3.3"

 "@babel/plugin-transform-modules-commonjs@^7.16.8":
-  version "7.17.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.17.7.tgz#d86b217c8e45bb5f2dbc11eefc8eab62cf980d19"
-  integrity sha512-ITPmR2V7MqioMJyrxUo2onHNC3e+MvfFiFIR0RP21d3PtlVb6sfzoxNKiphSZUOM9hEIdzCcZe83ieX3yoqjUA==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-modules-commonjs/-/plugin-transform-modules-commonjs-7.17.9.tgz#274be1a2087beec0254d4abd4d86e52442e1e5b6"
+  integrity sha512-2TBFd/r2I6VlYn0YRTz2JdazS+FoUuQ2rIFHoAxtyP/0G3D82SBLaRq9rnUkpqlLg03Byfl/+M32mpxjO6KaPw==
  dependencies:
    "@babel/helper-module-transforms" "^7.17.7"
    "@babel/helper-plugin-utils" "^7.16.7"
@ -797,11 +789,11 @@
    "@babel/helper-plugin-utils" "^7.16.7"

 "@babel/plugin-transform-regenerator@^7.16.7":
-  version "7.16.7"
-  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.16.7.tgz#9e7576dc476cb89ccc5096fff7af659243b4adeb"
-  integrity sha512-mF7jOgGYCkSJagJ6XCujSQg+6xC1M77/03K2oBmVJWoFGNUtnVJO4WHKJk3dnPC8HCcj4xBQP1Egm8DWh3Pb3Q==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/plugin-transform-regenerator/-/plugin-transform-regenerator-7.17.9.tgz#0a33c3a61cf47f45ed3232903683a0afd2d3460c"
+  integrity sha512-Lc2TfbxR1HOyn/c6b4Y/b6NHoTb67n/IoWLxTu4kC7h4KQnWlhCq2S8Tx0t2SVvv5Uu87Hs+6JEJ5kt2tYGylQ==
  dependencies:
-    regenerator-transform "^0.14.2"
+    regenerator-transform "^0.15.0"

 "@babel/plugin-transform-reserved-words@^7.16.7":
  version "7.16.7"
@ -983,17 +975,17 @@
    "@babel/plugin-transform-typescript" "^7.16.7"

 "@babel/runtime-corejs3@^7.10.2":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.17.8.tgz#d7dd49fb812f29c61c59126da3792d8740d4e284"
-  integrity sha512-ZbYSUvoSF6dXZmMl/CYTMOvzIFnbGfv4W3SEHYgMvNsFTeLaF2gkGAF4K2ddmtSK4Emej+0aYcnSC6N5dPCXUQ==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/runtime-corejs3/-/runtime-corejs3-7.17.9.tgz#3d02d0161f0fbf3ada8e88159375af97690f4055"
+  integrity sha512-WxYHHUWF2uZ7Hp1K+D1xQgbgkGUfA+5UPOegEXGt2Y5SMog/rYCVaifLZDbw8UkNXozEqqrZTy6bglL7xTaCOw==
  dependencies:
    core-js-pure "^3.20.2"
    regenerator-runtime "^0.13.4"

 "@babel/runtime@^7.10.2", "@babel/runtime@^7.16.3", "@babel/runtime@^7.8.4":
-  version "7.17.8"
-  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.8.tgz#3e56e4aff81befa55ac3ac6a0967349fd1c5bca2"
-  integrity sha512-dQpEpK0O9o6lj6oPu0gRDbbnk+4LeHlNcBpspf6Olzt3GIX4P1lWF1gS+pHLDFlaJvbR6q7jCfQ08zA4QJBnmA==
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.9.tgz#d19fbf802d01a8cb6cf053a64e472d42c434ba72"
+  integrity sha512-lSiBBvodq29uShpWGNbgFdKYNiFDo5/HIYsaCEY9ff4sb10x9jizo2+pRrSyF4jKZCXqgzuqBOQKbUm90gQwJg==
  dependencies:
    regenerator-runtime "^0.13.4"

@ -1006,18 +998,18 @@
    "@babel/parser" "^7.16.7"
    "@babel/types" "^7.16.7"

-"@babel/traverse@^7.12.9", "@babel/traverse@^7.13.0", "@babel/traverse@^7.16.7", "@babel/traverse@^7.16.8", "@babel/traverse@^7.17.3":
-  version "7.17.3"
-  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.3.tgz#0ae0f15b27d9a92ba1f2263358ea7c4e7db47b57"
-  integrity sha512-5irClVky7TxRWIRtxlh2WPUUOLhcPN06AGgaQSB8AEwuyEBgJVuJ5imdHm5zxk8w0QS5T+tDfnDxAlhWjpb7cw==
+"@babel/traverse@^7.12.9", "@babel/traverse@^7.13.0", "@babel/traverse@^7.16.7", "@babel/traverse@^7.16.8", "@babel/traverse@^7.17.3", "@babel/traverse@^7.17.9":
+  version "7.17.9"
+  resolved "https://registry.yarnpkg.com/@babel/traverse/-/traverse-7.17.9.tgz#1f9b207435d9ae4a8ed6998b2b82300d83c37a0d"
+  integrity sha512-PQO8sDIJ8SIwipTPiR71kJQCKQYB5NGImbOviK8K+kg5xkNSYXLBupuX9QhatFowrsvo9Hj8WgArg3W7ijNAQw==
  dependencies:
    "@babel/code-frame" "^7.16.7"
-    "@babel/generator" "^7.17.3"
+    "@babel/generator" "^7.17.9"
    "@babel/helper-environment-visitor" "^7.16.7"
-    "@babel/helper-function-name" "^7.16.7"
+    "@babel/helper-function-name" "^7.17.9"
    "@babel/helper-hoist-variables" "^7.16.7"
    "@babel/helper-split-export-declaration" "^7.16.7"
-    "@babel/parser" "^7.17.3"
+    "@babel/parser" "^7.17.9"
    "@babel/types" "^7.17.0"
    debug "^4.1.0"
    globals "^11.1.0"
@ -3736,7 +3728,7 @@ json5@^1.0.1:
  dependencies:
    minimist "^1.2.0"

-json5@^2.1.2:
+json5@^2.1.2, json5@^2.2.1:
  version "2.2.1"
  resolved "https://registry.yarnpkg.com/json5/-/json5-2.2.1.tgz#655d50ed1e6f95ad1a3caababd2b0efda10b395c"
  integrity sha512-1hqLFMSrGHRHxav9q9gNjJ5EXznIxGVO09xQRrwplcS8qs28pZ8s8hupZAmqDwZUmVZ2Qb2jnyPOWcDH8m8dlA==
@ -3832,16 +3824,16 @@ lit-element@^3.2.0:
    lit-html "^2.2.0"

 lit-html@^2.2.0:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/lit-html/-/lit-html-2.2.1.tgz#762f112a8b54eaf0bbae3f516de935a25dcc12d1"
-  integrity sha512-AiJ/Rs0awjICs2FioTnHSh+Np5dhYSkyRczKy3wKjp8qjLhr1Ov+GiHrUQNdX8ou1LMuznpIME990AZsa/tR8g==
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/lit-html/-/lit-html-2.2.2.tgz#06ced65dd3fb2d7a214d998c65acc576ae2cb3c4"
+  integrity sha512-cJofCRXuizwyaiGt9pJjJOcauezUlSB6t87VBXsPwRhbzF29MgD8GH6fZ0BuZdXAAC02IRONZBd//VPUuU8QbQ==
  dependencies:
    "@types/trusted-types" "^2.0.2"

 lit@^2.2.1:
-  version "2.2.1"
-  resolved "https://registry.yarnpkg.com/lit/-/lit-2.2.1.tgz#4b679e1d8cb6c7977b64921b1ea3eca7850ca1dd"
-  integrity sha512-dSe++R50JqrvNGXmI9OE13de1z5U/Y3J2dTm/9GC86vedI8ILoR8ZGnxfThFpvQ9m0lR0qRnIR4IiKj/jDCfYw==
+  version "2.2.2"
+  resolved "https://registry.yarnpkg.com/lit/-/lit-2.2.2.tgz#b7f729d6ca7e17efbf2bf589df2d5eb04d9620ba"
+  integrity sha512-eN3+2QRHn/erxYB88AXiiRgQA6RltE9MhzySCwX+ACOxA/MLWN3VdXvcbZD9PN09zmUwlgzDvW3T84YWj2Sa0A==
  dependencies:
    "@lit/reactive-element" "^1.3.0"
    lit-element "^3.2.0"
@ -3907,12 +3899,10 @@ loose-envify@^1.1.0, loose-envify@^1.4.0:
  dependencies:
    js-tokens "^3.0.0 || ^4.0.0"

-lru-cache@^6.0.0:
-  version "6.0.0"
-  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-6.0.0.tgz#6d6fe6570ebd96aaf90fcad1dafa3b2566db3a94"
-  integrity sha512-Jo6dJ04CmSjuznwJSS3pUeWmd/H0ffTlkXXgwZi+eq1UCmqQwCh+eLsYOYCwY991i2Fah4h1BEMCx4qThGbsiA==
-  dependencies:
-    yallist "^4.0.0"
+lru-cache@^7.4.0:
+  version "7.7.3"
+  resolved "https://registry.yarnpkg.com/lru-cache/-/lru-cache-7.7.3.tgz#98cd19eef89ce6a4a3c4502c17c833888677c252"
+  integrity sha512-WY9wjJNQt9+PZilnLbuFKM+SwDull9+6IAguOrarOMoOHTcJ9GnXSO11+Gw6c7xtDkBkthR57OZMtZKYr+1CEw==

 lru_map@^0.3.3:
  version "0.3.3"
@ -4620,10 +4610,10 @@ next-seo@^5.4.0:
  resolved "https://registry.yarnpkg.com/next-seo/-/next-seo-5.4.0.tgz#37a7784b30b3f70cec3fa0d77f9dde5990822d24"
  integrity sha512-R9DhajPwJnR/lsF2hZ8cN8uqr5CVITsRrCG1AF5+ufcaybKYOvnH8sH9MaH4/hpkps3PQ9H71S7J7SPYixAYzQ==

-next-sitemap@^2.5.18:
-  version "2.5.18"
-  resolved "https://registry.yarnpkg.com/next-sitemap/-/next-sitemap-2.5.18.tgz#7542df7ad7954d9b5065e28d0a565893f8c1fe43"
-  integrity sha512-zFrlX0oiTA0078jWHY9KPsMfW1dkwHegi9SChUQiJCgJNwDpV/B2JWZQjZYWTRgwIWgBo/qgojKyp503vZYQTg==
+next-sitemap@^2.5.19:
+  version "2.5.19"
+  resolved "https://registry.yarnpkg.com/next-sitemap/-/next-sitemap-2.5.19.tgz#740643b23e7523a3f507a6c3c477a91f0c9df32b"
+  integrity sha512-skcjmCO9ZEDxUmfaSz9FGWt/TRhXvfwvJzuMj8NRCd46vhMNzsLu+2lq2T4KJp5kNYEp3ISajtVNxJ+iegcDDg==
  dependencies:
    "@corex/deepmerge" "^2.6.148"
    minimist "^1.2.6"
@ -5124,10 +5114,10 @@ regenerator-runtime@^0.13.4:
  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz#8925742a98ffd90814988d7566ad30ca3b263b52"
  integrity sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==

-regenerator-transform@^0.14.2:
-  version "0.14.5"
-  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.14.5.tgz#c98da154683671c9c4dcb16ece736517e1b7feb4"
-  integrity sha512-eOf6vka5IO151Jfsw2NO9WpGX58W6wWmefK3I1zEGr0lOD0u8rwPaNqQL1aRxUaxLeKO3ArNh3VYg1KbaD+FFw==
+regenerator-transform@^0.15.0:
+  version "0.15.0"
+  resolved "https://registry.yarnpkg.com/regenerator-transform/-/regenerator-transform-0.15.0.tgz#cbd9ead5d77fae1a48d957cf889ad0586adb6537"
+  integrity sha512-LsrGtPmbYg19bcPHwdtmXwbW+TqNvtY4riE3P83foeHRroMbH6/2ddFBfab3t7kbzc7v7p4wbkIecHImqt0QNg==
  dependencies:
    "@babel/runtime" "^7.8.4"

@ -5437,11 +5427,11 @@ semver@^6.1.1, semver@^6.1.2, semver@^6.3.0:
  integrity sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==

 semver@^7.3.5:
-  version "7.3.5"
-  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.5.tgz#0b621c879348d8998e4b0e4be94b3f12e6018ef7"
-  integrity sha512-PoeGJYh8HK4BTO/a9Tf6ZG3veo/A7ZVsYrSA6J8ny9nb3B1VrpkuN+z9OE5wfE5p6H4LchYZsegiQgbJD94ZFQ==
+  version "7.3.6"
+  resolved "https://registry.yarnpkg.com/semver/-/semver-7.3.6.tgz#5d73886fb9c0c6602e79440b97165c29581cbb2b"
+  integrity sha512-HZWqcgwLsjaX1HBD31msI/rXktuIhS+lWvdE4kN9z+8IVT4Itc7vqU2WvYsyD6/sjYCt4dEKH/m1M3dwI9CC5w==
  dependencies:
-    lru-cache "^6.0.0"
+    lru-cache "^7.4.0"

 shebang-command@^2.0.0:
  version "2.0.0"
@ -6302,11 +6292,6 @@ xtend@^4.0.0, xtend@^4.0.1:
  resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
  integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==

-yallist@^4.0.0:
-  version "4.0.0"
-  resolved "https://registry.yarnpkg.com/yallist/-/yallist-4.0.0.tgz#9bb92790d9c0effec63be73519e11a35019a3a72"
-  integrity sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==
-
 yaml@^1.10.0, yaml@^1.10.2:
  version "1.10.2"
  resolved "https://registry.yarnpkg.com/yaml/-/yaml-1.10.2.tgz#2301c5ffbf12b467de8da2333a459e29e7920e4b"