diff --git a/apps/climatemappedafrica/package.json b/apps/climatemappedafrica/package.json
index ffa03a767..0997b13bf 100644
--- a/apps/climatemappedafrica/package.json
+++ b/apps/climatemappedafrica/package.json
@@ -35,7 +35,6 @@
   "dependencies": {
     "@apollo/client": "catalog:",
     "@commons-ui/core": "workspace:*",
-    "@commons-ui/legacy": "catalog:",
     "@commons-ui/next": "workspace:*",
     "@commons-ui/payload": "workspace:*",
     "@emotion/react": "catalog:",
diff --git a/apps/climatemappedafrica/src/components/AboutTeam/AboutTeam.snap.js b/apps/climatemappedafrica/src/components/AboutTeam/AboutTeam.snap.js
index 13603b233..1e08bf484 100644
--- a/apps/climatemappedafrica/src/components/AboutTeam/AboutTeam.snap.js
+++ b/apps/climatemappedafrica/src/components/AboutTeam/AboutTeam.snap.js
@@ -6,7 +6,7 @@ exports[`<AboutTeam /> renders unchanged 1`] = `
     class="MuiBox-root css-1termwk"
   >
     <div
-      class="makeStyles-root-5 makeStyles-root-3 makeStyles-root-1 makeStyles-fixed-2 MuiBox-root css-0"
+      class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-1vn3dh6-MuiContainer-root"
     >
       <h4
         class="MuiTypography-root MuiTypography-h4 css-1cvoujm-MuiTypography-root"
diff --git a/apps/climatemappedafrica/src/components/DataIndicators/IndicatorPanel.js b/apps/climatemappedafrica/src/components/DataIndicators/IndicatorPanel.js
index 2f063a9f2..5ad48f22d 100644
--- a/apps/climatemappedafrica/src/components/DataIndicators/IndicatorPanel.js
+++ b/apps/climatemappedafrica/src/components/DataIndicators/IndicatorPanel.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { RichText } from "@commons-ui/payload";
 import { ButtonBase, Slide } from "@mui/material";
 import PropTypes from "prop-types";
diff --git a/apps/climatemappedafrica/src/components/DataVisualisationGuide/index.js b/apps/climatemappedafrica/src/components/DataVisualisationGuide/index.js
index db769dfd7..c60729944 100644
--- a/apps/climatemappedafrica/src/components/DataVisualisationGuide/index.js
+++ b/apps/climatemappedafrica/src/components/DataVisualisationGuide/index.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { useMediaQuery, Box, Grid } from "@mui/material";
 import PropTypes from "prop-types";
 import React from "react";
diff --git a/apps/climatemappedafrica/src/components/Footer/index.js b/apps/climatemappedafrica/src/components/Footer/index.js
index 170590303..0a1bf0f2f 100644
--- a/apps/climatemappedafrica/src/components/Footer/index.js
+++ b/apps/climatemappedafrica/src/components/Footer/index.js
@@ -1,11 +1,9 @@
-import { QuickLinks, Copyright } from "@commons-ui/legacy";
+import { Copyright, QuickLinks } from "@commons-ui/core";
 import { Link, StayInTouch } from "@commons-ui/next";
 import { RichText } from "@commons-ui/payload";
-import { Box, Grid } from "@mui/material";
+import { Box, Grid, useTheme } from "@mui/material";
 import React from "react";
 
-import useStyles from "./useStyles";
-
 import NextImageButton from "@/climatemappedafrica/components/NextImageButton";
 import Section from "@/climatemappedafrica/components/Section";
 
@@ -18,21 +16,25 @@ function Footer(props) {
     links,
     variant,
   } = props;
-  const classes = useStyles(props);
+  const theme = useTheme();
 
   return (
     <Box
-      sx={(theme) => ({
+      sx={({ palette, typography }) => ({
         display: {
           xs: "block",
           lg: variant !== "explore" ? "block" : "none",
         },
-        background: theme.palette.grey.dark,
+        background: palette.grey.dark,
         height: "auto",
-        padding: `${theme.typography.pxToRem(80)} 0`,
-        [theme.breakpoints.up("md")]: {
-          paddingTop: `${theme.typography.pxToRem(58)}`,
-          paddingBottom: `${theme.typography.pxToRem(82)}`,
+        padding: `${typography.pxToRem(80)} 0`,
+        paddingTop: {
+          xs: "unset",
+          md: `${typography.pxToRem(58)}`,
+        },
+        paddingBottom: {
+          xs: "unset",
+          md: `${typography.pxToRem(82)}`,
         },
       })}
     >
@@ -47,13 +49,13 @@ function Footer(props) {
                   width: 220,
                 }}
                 priority
-                sx={(theme) => ({
-                  margin: "0 auto",
-                  padding: 0,
-                  [theme.breakpoints.up("lg")]: {
-                    margin: 0,
+                sx={{
+                  margin: {
+                    xs: "0 auto",
+                    lg: 0,
                   },
-                })}
+                  padding: 0,
+                }}
               />
             )}
           </Grid>
@@ -61,13 +63,13 @@ function Footer(props) {
             {description && (
               <RichText
                 variant="body1"
-                sx={(theme) => ({
-                  color: theme.palette.text.secondary,
-                  padding: `${theme.typography.pxToRem(32)} 0`,
-                  fontSize: theme.typography.subtitle1.fontSize,
-                  textAlign: "center",
-                  [theme.breakpoints.up("lg")]: {
-                    textAlign: "left",
+                sx={({ palette, typography }) => ({
+                  color: palette.text.secondary,
+                  padding: `${typography.pxToRem(32)} 0`,
+                  fontSize: typography.subtitle1.fontSize,
+                  textAlign: {
+                    xs: "center",
+                    lg: "left",
                   },
                   "& > p": {
                     mt: 2,
@@ -90,20 +92,39 @@ function Footer(props) {
             )}
             <Copyright
               copyright={`© ${new Date().getFullYear()} ${title}`}
-              classes={{
-                root: classes.copyright,
-                text: classes.copyrightText,
+              CopyrightProps={{
+                sx: {
+                  color: theme.palette.text.secondary,
+                  order: 5,
+                  padding: {
+                    xs: `0 ${theme.typography.pxToRem(5)} 0 0`,
+                    lg: `0 ${theme.typography.pxToRem(10)} 0 0`,
+                  },
+                },
               }}
+              sx={({ typography }) => ({
+                margin: 0,
+                display: "flex",
+                flexWrap: "wrap",
+                flexDirection: "row",
+                justifyContent: {
+                  xs: "center",
+                  lg: "flex-start",
+                },
+                "& > a": {
+                  marginTop: typography.pxToRem(3),
+                },
+              })}
             />
           </Grid>
           <Grid item xs={12} lg={4}>
             <Grid
               container
-              sx={(theme) => ({
+              sx={({ typography }) => ({
                 margin: "0 auto",
                 flexDirection: "row",
                 justifyContent: "center",
-                marginTop: theme.typography.pxToRem(44.19),
+                marginTop: typography.pxToRem(44.19),
               })}
             >
               <Grid item xs={12} lg={6}>
@@ -111,11 +132,46 @@ function Footer(props) {
                   <QuickLinks
                     linkComponent={Link}
                     {...links}
-                    classes={{
-                      root: classes.quickLinkRoot,
-                      list: classes.quickList,
-                      link: classes.quickLink,
-                      title: classes.quickLinksTitle,
+                    sx={{
+                      textAlign: {
+                        xs: "center",
+                        lg: "inherit",
+                      },
+                      padding: {
+                        xs: `${theme.typography.pxToRem(32)} 0 `,
+                        lg: 0,
+                      },
+                    }}
+                    TitleProps={{
+                      variant: "caption",
+                      sx: {
+                        color: theme.palette.text.secondary,
+                        fontSize: theme.typography.subtitle2.fontSize,
+                        fontWeight: "bold",
+                      },
+                    }}
+                    LinksProps={{
+                      variant: "caption",
+                      sx: {
+                        listStyle: "none",
+                        color: theme.palette.text.secondary,
+                        padding: 0,
+                        letterspacing: theme.typography.pxToRem(0.7),
+                        "& > li": {
+                          marginTop: theme.typography.pxToRem(16),
+                        },
+                      },
+                    }}
+                    LinkProps={{
+                      variant: "caption",
+                      sx: {
+                        fontSize: theme.typography.subtitle1.fontSize,
+                        color: theme.palette.text.secondary,
+                        fontWeight: "normal",
+                        "&:hover": {
+                          color: theme.palette.primary.light,
+                        },
+                      },
                     }}
                   />
                 )}
diff --git a/apps/climatemappedafrica/src/components/Footer/useStyles.js b/apps/climatemappedafrica/src/components/Footer/useStyles.js
deleted file mode 100644
index fac05e038..000000000
--- a/apps/climatemappedafrica/src/components/Footer/useStyles.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import makeStyles from "@mui/styles/makeStyles";
-
-const useStyles = makeStyles(({ breakpoints, palette, typography }) => ({
-  quickLinkRoot: {
-    textAlign: "center",
-    padding: `${typography.pxToRem(32)} 0 `,
-    [breakpoints.up("lg")]: {
-      textAlign: "inherit",
-      padding: 0,
-    },
-  },
-  quickList: {
-    listStyle: "none",
-    color: palette.text.secondary,
-    padding: 0,
-    letterspacing: typography.pxToRem(0.7),
-    "& > li": {
-      marginTop: typography.pxToRem(16),
-    },
-  },
-  quickLink: {
-    fontSize: typography.subtitle1.fontSize,
-    color: palette.text.secondary,
-    fontWeight: "normal",
-    "&:hover": {
-      color: palette.primary.light,
-    },
-  },
-  quickLinksTitle: {
-    color: palette.text.secondary,
-    fontSize: typography.subtitle2.fontSize,
-    fontWeight: "bold",
-  },
-  copyright: {
-    margin: 0,
-    display: "flex",
-    flexWrap: "wrap",
-    flexDirection: "row",
-    justifyContent: "center",
-    [breakpoints.up("lg")]: {
-      justifyContent: "flex-start",
-    },
-    "& > a": {
-      marginTop: typography.pxToRem(3),
-    },
-  },
-  copyrightText: {
-    color: palette.text.secondary,
-    order: 5,
-    padding: `0 ${typography.pxToRem(5)} 0 0`,
-    [breakpoints.up("lg")]: {
-      padding: `0 ${typography.pxToRem(10)} 0 0`,
-    },
-  },
-}));
-
-export default useStyles;
diff --git a/apps/climatemappedafrica/src/components/HURUmap/Chart/index.js b/apps/climatemappedafrica/src/components/HURUmap/Chart/index.js
index ba7f1a382..9cf4014bf 100644
--- a/apps/climatemappedafrica/src/components/HURUmap/Chart/index.js
+++ b/apps/climatemappedafrica/src/components/HURUmap/Chart/index.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { ChartTooltip, IndicatorTitle, Download, Share } from "@hurumap/core";
 import { Source } from "@hurumap/next";
 import { Box, useMediaQuery, useTheme } from "@mui/material";
diff --git a/apps/climatemappedafrica/src/components/HURUmap/Tutorial/index.stories.js b/apps/climatemappedafrica/src/components/HURUmap/Tutorial/index.stories.js
index 34f2ac890..3d4b625e6 100644
--- a/apps/climatemappedafrica/src/components/HURUmap/Tutorial/index.stories.js
+++ b/apps/climatemappedafrica/src/components/HURUmap/Tutorial/index.stories.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import React from "react";
 
 import Tutorial from "@/climatemappedafrica/components/HURUmap/Tutorial";
diff --git a/apps/climatemappedafrica/src/components/Header/Header.js b/apps/climatemappedafrica/src/components/Header/Header.js
index 9d3c09c29..19c0ddad0 100644
--- a/apps/climatemappedafrica/src/components/Header/Header.js
+++ b/apps/climatemappedafrica/src/components/Header/Header.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { Box } from "@mui/material";
 import PropTypes from "prop-types";
 import React from "react";
diff --git a/apps/climatemappedafrica/src/components/Header/Header.snap.js b/apps/climatemappedafrica/src/components/Header/Header.snap.js
index 5dcbac166..47b20ce84 100644
--- a/apps/climatemappedafrica/src/components/Header/Header.snap.js
+++ b/apps/climatemappedafrica/src/components/Header/Header.snap.js
@@ -7,12 +7,12 @@ exports[`<Header /> renders unchanged 1`] = `
     title="Title with <span class="highlight">Highlight</span>"
   >
     <div
-      class="MuiTypography-root makeStyles-root-1 MuiTypography-overline css-1wyl8ke-MuiTypography-root"
+      class="MuiTypography-root MuiTypography-overline css-189owcq-MuiTypography-root"
     >
       Overline
     </div>
     <div
-      class="MuiTypography-root makeStyles-root-1 MuiTypography-subtitle1 css-1gs80bf-MuiTypography-root"
+      class="MuiTypography-root MuiTypography-subtitle1 css-554hv2-MuiTypography-root"
     >
       A short paragraph to describe what the header is all about.
     </div>
diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.js b/apps/climatemappedafrica/src/components/Hero/Hero.js
index aa4883c1d..5e42328fc 100644
--- a/apps/climatemappedafrica/src/components/Hero/Hero.js
+++ b/apps/climatemappedafrica/src/components/Hero/Hero.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { Box, Grid, useMediaQuery } from "@mui/material";
 import dynamic from "next/dynamic";
 import PropTypes from "prop-types";
diff --git a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js
index dab00515a..04c413031 100644
--- a/apps/climatemappedafrica/src/components/Hero/Hero.snap.js
+++ b/apps/climatemappedafrica/src/components/Hero/Hero.snap.js
@@ -17,7 +17,7 @@ exports[`<Hero /> renders unchanged 1`] = `
       />
     </div>
     <div
-      class="makeStyles-root-5 makeStyles-root-3 makeStyles-root-1 makeStyles-fixed-2 MuiBox-root css-1gf8bce"
+      class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-q6gmsn-MuiContainer-root"
     >
       <div
         class="MuiGrid-root MuiGrid-container css-ljvmaf-MuiGrid-root"
diff --git a/apps/climatemappedafrica/src/components/Hero/Legend.js b/apps/climatemappedafrica/src/components/Hero/Legend.js
index 77877f2a5..d87267340 100644
--- a/apps/climatemappedafrica/src/components/Hero/Legend.js
+++ b/apps/climatemappedafrica/src/components/Hero/Legend.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { Box } from "@mui/material";
 import PropTypes from "prop-types";
 import React, { useState, forwardRef } from "react";
diff --git a/apps/climatemappedafrica/src/components/Hero/Map.js b/apps/climatemappedafrica/src/components/Hero/Map.js
index 21c85b888..f485115ce 100644
--- a/apps/climatemappedafrica/src/components/Hero/Map.js
+++ b/apps/climatemappedafrica/src/components/Hero/Map.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { Box, useTheme } from "@mui/material";
 import { useRouter } from "next/router";
 import PropTypes from "prop-types";
diff --git a/apps/climatemappedafrica/src/components/HowItWorks/index.js b/apps/climatemappedafrica/src/components/HowItWorks/index.js
index c1294744e..36abe8b3b 100644
--- a/apps/climatemappedafrica/src/components/HowItWorks/index.js
+++ b/apps/climatemappedafrica/src/components/HowItWorks/index.js
@@ -1,11 +1,10 @@
 import { Link } from "@commons-ui/next";
 import { RichText } from "@commons-ui/payload";
-import { Box, Grid, Typography } from "@mui/material";
+import { Box, Grid, Typography, useTheme } from "@mui/material";
 import PropTypes from "prop-types";
 import React from "react";
 
 import Player from "@/climatemappedafrica/components/HowItWorks/Player";
-import useStyles from "@/climatemappedafrica/components/HowItWorks/useStyles";
 import Section from "@/climatemappedafrica/components/Section";
 
 function HowItWorks({
@@ -15,9 +14,8 @@ function HowItWorks({
   video,
   backgroundImage,
   image: foregroundImage,
-  ...props
 }) {
-  const classes = useStyles(props);
+  const theme = useTheme();
 
   return (
     <Box
@@ -41,7 +39,7 @@ function HowItWorks({
         }}
       />
       <Box
-        sx={(theme) => ({
+        sx={({ typography }) => ({
           display: {
             xs: "none",
             md: "block",
@@ -49,13 +47,23 @@ function HowItWorks({
           },
           position: "absolute",
           left: 0,
-          top: theme.typography.pxToRem(42),
+          top: typography.pxToRem(42),
           width: "100%",
           background: `linear-gradient(to right, #ffffffE6 0%, #ffffffE6 56%, transparent 56%, transparent 100%)`,
-          height: theme.typography.pxToRem(524),
+          height: typography.pxToRem(524),
         })}
       />
-      <Section classes={{ root: classes.section }}>
+      <Section
+        sx={{
+          zIndex: 1,
+          position: "relative",
+          paddingTop: `${theme.typography.pxToRem(62)} !important`,
+          padding: {
+            md: `${theme.typography.pxToRem(42)} 0 !important`,
+            lg: `${theme.typography.pxToRem(64)} 0 !important`,
+          },
+        }}
+      >
         <Grid
           container
           direction={{
@@ -70,7 +78,7 @@ function HowItWorks({
             xs={12}
             md={7}
             lg={6}
-            sx={(theme) => ({
+            sx={({ palette, typography }) => ({
               position: {
                 md: "relative",
               },
@@ -78,25 +86,25 @@ function HowItWorks({
                 md: 0,
               },
               backgroundColor: {
-                lg: theme.palette.background.default,
+                lg: palette.background.default,
               },
               opacity: {
                 md: 0.9,
               },
               height: {
-                md: theme.typography.pxToRem(524),
-                lg: theme.typography.pxToRem(600),
+                md: typography.pxToRem(524),
+                lg: typography.pxToRem(600),
               },
               padding: {
-                md: `${theme.typography.pxToRem(66)} ${theme.typography.pxToRem(
+                md: `${typography.pxToRem(66)} ${typography.pxToRem(
                   77,
-                )} ${theme.typography.pxToRem(69)} 0`,
-                lg: `${theme.typography.pxToRem(81)} ${theme.typography.pxToRem(98)}`,
+                )} ${typography.pxToRem(69)} 0`,
+                lg: `${typography.pxToRem(81)} ${typography.pxToRem(98)}`,
               },
             })}
           >
             <Box
-              sx={(theme) => ({
+              sx={({ typography }) => ({
                 position: "relative",
                 "& .video-js": {
                   width: "100%",
@@ -116,22 +124,22 @@ function HowItWorks({
                   display: "none",
                 },
                 height: {
-                  xs: theme.typography.pxToRem(227),
-                  md: theme.typography.pxToRem(194),
-                  lg: theme.typography.pxToRem(244),
+                  xs: typography.pxToRem(227),
+                  md: typography.pxToRem(194),
+                  lg: typography.pxToRem(244),
                 },
                 width: {
                   xs: "100%",
-                  md: theme.typography.pxToRem(299),
-                  lg: theme.typography.pxToRem(376),
+                  md: typography.pxToRem(299),
+                  lg: typography.pxToRem(376),
                 },
               })}
             >
               <Player {...video} />
             </Box>
             <Typography
-              sx={(theme) => ({
-                marginTop: theme.typography.pxToRem(18),
+              sx={({ typography }) => ({
+                marginTop: typography.pxToRem(18),
               })}
               variant="h4"
             >
@@ -139,12 +147,12 @@ function HowItWorks({
             </Typography>
             <RichText
               elements={description}
-              sx={(theme) => ({
-                fontFamily: theme.typography.body1.fontFamily,
-                margin: `${theme.typography.pxToRem(16.5)} 0`,
-                color: theme.palette.grey.dark,
+              sx={({ typography, palette }) => ({
+                fontFamily: typography.body1.fontFamily,
+                margin: `${typography.pxToRem(16.5)} 0`,
+                color: palette.grey.dark,
                 width: {
-                  md: theme.typography.pxToRem(278),
+                  md: typography.pxToRem(278),
                 },
               })}
             />
@@ -170,22 +178,22 @@ function HowItWorks({
             }}
           >
             <Box
-              sx={(theme) => ({
+              sx={({ typography }) => ({
                 position: "relative",
                 height: {
-                  xs: theme.typography.pxToRem(265),
-                  md: theme.typography.pxToRem(211),
-                  lg: theme.typography.pxToRem(441.6),
+                  xs: typography.pxToRem(265),
+                  md: typography.pxToRem(211),
+                  lg: typography.pxToRem(441.6),
                 },
                 width: {
-                  xs: theme.typography.pxToRem(253.6),
-                  md: theme.typography.pxToRem(202),
-                  lg: theme.typography.pxToRem(422.5),
+                  xs: typography.pxToRem(253.6),
+                  md: typography.pxToRem(202),
+                  lg: typography.pxToRem(422.5),
                 },
                 backgroundImage: `url(${foregroundImage.src})`,
                 backgroundSize: "contain",
                 backgroundRepeat: "no-repeat",
-                marginBottom: theme.typography.pxToRem(23),
+                marginBottom: typography.pxToRem(23),
               })}
             />
           </Grid>
diff --git a/apps/climatemappedafrica/src/components/HowItWorks/useStyles.js b/apps/climatemappedafrica/src/components/HowItWorks/useStyles.js
deleted file mode 100644
index 494337cfb..000000000
--- a/apps/climatemappedafrica/src/components/HowItWorks/useStyles.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import makeStyles from "@mui/styles/makeStyles";
-
-const useStyles = makeStyles(({ breakpoints, typography }) => ({
-  section: {
-    zIndex: 1,
-    position: "relative",
-    paddingTop: typography.pxToRem(62),
-    [breakpoints.up("md")]: {
-      padding: `${typography.pxToRem(42)} 0`,
-    },
-    [breakpoints.up("lg")]: {
-      padding: `${typography.pxToRem(64)} 0`,
-    },
-  },
-}));
-
-export default useStyles;
diff --git a/apps/climatemappedafrica/src/components/Link/index.js b/apps/climatemappedafrica/src/components/Link/index.js
index 2d57586e2..15c82a12b 100644
--- a/apps/climatemappedafrica/src/components/Link/index.js
+++ b/apps/climatemappedafrica/src/components/Link/index.js
@@ -1,5 +1,5 @@
 /* eslint-disable jsx-a11y/anchor-has-content */
-import { A } from "@commons-ui/legacy";
+import { StyledLink } from "@commons-ui/next";
 import { Link as MuiLink } from "@mui/material";
 import clsx from "clsx";
 import NextLink from "next/link";
@@ -90,7 +90,7 @@ const Link = forwardRef(function Link(props, ref) {
   if (!isRelative) {
     const noProtocol = href?.startsWith("www.");
     return (
-      <A
+      <StyledLink
         href={noProtocol ? `https://${href}` : href}
         className={className}
         ref={ref}
diff --git a/apps/climatemappedafrica/src/components/PageHero/PageHero.js b/apps/climatemappedafrica/src/components/PageHero/PageHero.js
index 3d4dd937b..84c292e09 100644
--- a/apps/climatemappedafrica/src/components/PageHero/PageHero.js
+++ b/apps/climatemappedafrica/src/components/PageHero/PageHero.js
@@ -1,14 +1,12 @@
-import { Box, Grid } from "@mui/material";
+import { Box, Grid, useTheme } from "@mui/material";
 import PropTypes from "prop-types";
 import React from "react";
 
-import useStyles from "./useStyles";
-
 import RichHeader from "@/climatemappedafrica/components/RichHeader";
 import Section from "@/climatemappedafrica/components/Section";
 
-function PageHero({ background, overline, subtitle, title, ...props }) {
-  const classes = useStyles(props);
+function PageHero({ background, overline, subtitle, title }) {
+  const theme = useTheme();
   let backgroundSx;
   if (background?.src?.length) {
     backgroundSx = {
@@ -39,7 +37,20 @@ function PageHero({ background, overline, subtitle, title, ...props }) {
         },
       }}
     >
-      <Section classes={{ root: classes.section }}>
+      <Section
+        sx={{
+          zIndex: 1,
+          position: "relative",
+          paddingBottom: {
+            xs: `${theme.typography.pxToRem(70)} !important`,
+            lg: `${theme.typography.pxToRem(100)} !important`,
+          },
+          paddingTop: {
+            xs: `${theme.typography.pxToRem(70)} !important`,
+            lg: `${theme.typography.pxToRem(100)} !important`,
+          },
+        }}
+      >
         <Grid container>
           <Grid
             item
diff --git a/apps/climatemappedafrica/src/components/PageHero/PageHero.snap.js b/apps/climatemappedafrica/src/components/PageHero/PageHero.snap.js
index 595a9d61a..eca37090a 100644
--- a/apps/climatemappedafrica/src/components/PageHero/PageHero.snap.js
+++ b/apps/climatemappedafrica/src/components/PageHero/PageHero.snap.js
@@ -6,7 +6,7 @@ exports[`<PageHero /> renders unchanged 1`] = `
     class="MuiBox-root css-u361uw"
   >
     <div
-      class="makeStyles-root-6 makeStyles-root-4 makeStyles-root-2 makeStyles-section-1 makeStyles-fixed-3 MuiBox-root css-0"
+      class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-j3c69o-MuiContainer-root"
     >
       <div
         class="MuiGrid-root MuiGrid-container css-11lq3yg-MuiGrid-root"
@@ -18,7 +18,7 @@ exports[`<PageHero /> renders unchanged 1`] = `
             class="MuiBox-root css-0"
           >
             <div
-              class="MuiTypography-root makeStyles-root-7 MuiTypography-overline css-uwhb1p-MuiTypography-root"
+              class="MuiTypography-root MuiTypography-overline css-alcn5s-MuiTypography-root"
             >
               About
             </div>
diff --git a/apps/climatemappedafrica/src/components/PageHero/useStyles.js b/apps/climatemappedafrica/src/components/PageHero/useStyles.js
deleted file mode 100644
index 579cd75b2..000000000
--- a/apps/climatemappedafrica/src/components/PageHero/useStyles.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import makeStyles from "@mui/styles/makeStyles";
-
-const useStyles = makeStyles(({ breakpoints, typography }) => ({
-  section: {
-    zIndex: 1,
-    position: "relative",
-    paddingBottom: `${typography.pxToRem(70)} !important`,
-    paddingTop: `${typography.pxToRem(70)} !important`,
-    [breakpoints.up("lg")]: {
-      paddingBottom: `${typography.pxToRem(100)} !important`,
-      paddingTop: `${typography.pxToRem(100)} !important`,
-    },
-  },
-}));
-
-export default useStyles;
diff --git a/apps/climatemappedafrica/src/components/RichHeader/RichHeader.js b/apps/climatemappedafrica/src/components/RichHeader/RichHeader.js
index f7dd0a911..f1dd37850 100644
--- a/apps/climatemappedafrica/src/components/RichHeader/RichHeader.js
+++ b/apps/climatemappedafrica/src/components/RichHeader/RichHeader.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import { RichText } from "@commons-ui/payload";
 import { Box } from "@mui/material";
 import PropTypes from "prop-types";
diff --git a/apps/climatemappedafrica/src/components/RichHeader/RichHeader.snap.js b/apps/climatemappedafrica/src/components/RichHeader/RichHeader.snap.js
index c9622ab92..068a29b6d 100644
--- a/apps/climatemappedafrica/src/components/RichHeader/RichHeader.snap.js
+++ b/apps/climatemappedafrica/src/components/RichHeader/RichHeader.snap.js
@@ -7,7 +7,7 @@ exports[`<RichHeader /> renders unchanged 1`] = `
     title="[object Object]"
   >
     <div
-      class="MuiTypography-root makeStyles-root-1 MuiTypography-overline css-uwhb1p-MuiTypography-root"
+      class="MuiTypography-root MuiTypography-overline css-alcn5s-MuiTypography-root"
     >
       About
     </div>
diff --git a/apps/climatemappedafrica/src/components/Section/index.js b/apps/climatemappedafrica/src/components/Section/index.js
index c90aaa87d..6885a7eb6 100644
--- a/apps/climatemappedafrica/src/components/Section/index.js
+++ b/apps/climatemappedafrica/src/components/Section/index.js
@@ -1,40 +1,25 @@
-import { Section as CuiSection } from "@commons-ui/legacy";
-import makeStyles from "@mui/styles/makeStyles";
-import clsx from "clsx";
+import { Section as CuiSection } from "@commons-ui/core";
 import PropTypes from "prop-types";
 import React from "react";
 
-const useStyles = makeStyles(({ breakpoints, typography, widths }) => ({
-  root: {
-    padding: `0 ${typography.pxToRem(20)}`,
-  },
-  /* Styles applied to the root element if `fixed={true}`. */
-  fixed: Object.keys(widths.values).reduce((acc, breakpoint) => {
-    const value = widths.values[breakpoint];
-    if (value !== 0) {
-      acc[breakpoints.up(breakpoint)] = {
-        padding: 0,
-        width: value,
-      };
-    }
-    return acc;
-  }, {}),
-}));
-
-function Section({ className, fixed = true, ...props }) {
-  const classes = useStyles(props);
-
+function Section({ className, fixed = true, sx, ...props }) {
   return (
     <CuiSection
       {...props}
-      className={clsx(
-        classes.root,
-        {
-          [classes.fixed]: fixed,
-        },
-        className,
-      )}
-      classes={{}}
+      sx={({ breakpoints, typography, widths }) => ({
+        padding: `0 ${typography.pxToRem(20)}`,
+        ...Object.keys(widths.values).reduce((acc, breakpoint) => {
+          const value = widths.values[breakpoint];
+          if (value !== 0 && fixed) {
+            acc[breakpoints.up(breakpoint)] = {
+              padding: 0,
+              width: value,
+            };
+          }
+          return acc;
+        }, {}),
+        ...sx,
+      })}
     />
   );
 }
diff --git a/apps/climatemappedafrica/src/components/Section/index.stories.js b/apps/climatemappedafrica/src/components/Section/index.stories.js
index d353a78e4..4ea0baa14 100644
--- a/apps/climatemappedafrica/src/components/Section/index.stories.js
+++ b/apps/climatemappedafrica/src/components/Section/index.stories.js
@@ -1,4 +1,4 @@
-import { RichTypography } from "@commons-ui/legacy";
+import { RichTypography } from "@commons-ui/next";
 import React from "react";
 
 import Section from ".";
diff --git a/apps/climatemappedafrica/src/components/Summary/Summary.snap.js b/apps/climatemappedafrica/src/components/Summary/Summary.snap.js
index 4da9fc580..4bcac8e4b 100644
--- a/apps/climatemappedafrica/src/components/Summary/Summary.snap.js
+++ b/apps/climatemappedafrica/src/components/Summary/Summary.snap.js
@@ -6,7 +6,7 @@ exports[`<Summary /> renders unchanged 1`] = `
     class="MuiBox-root css-dx4cvz"
   >
     <div
-      class="makeStyles-root-5 makeStyles-root-3 makeStyles-root-1 makeStyles-fixed-2 MuiBox-root css-0"
+      class="MuiContainer-root MuiContainer-maxWidthLg MuiContainer-fixed MuiContainer-disableGutters css-1vn3dh6-MuiContainer-root"
     >
       <div
         class="MuiGrid-root MuiGrid-container css-1xzqqmo-MuiGrid-root"
diff --git a/packages/commons-ui-core/src/Copyright/Copyright.js b/packages/commons-ui-core/src/Copyright/Copyright.js
new file mode 100644
index 000000000..8881e2518
--- /dev/null
+++ b/packages/commons-ui-core/src/Copyright/Copyright.js
@@ -0,0 +1,58 @@
+import { Box, Typography } from "@mui/material";
+import React from "react";
+
+const Copyright = React.forwardRef(function Copyright(props, ref) {
+  const {
+    copyright,
+    CopyrightProps,
+    icon,
+    IconProps,
+    variant,
+    year,
+    YearProps,
+    url,
+    sx,
+  } = props;
+
+  return (
+    <Box
+      sx={{
+        marginTop: {
+          xs: "1.618125rem",
+          md: 0,
+        },
+        order: {
+          xs: 3,
+          md: 2,
+        },
+        textAlign: "center",
+        ...sx,
+      }}
+      ref={ref}
+    >
+      {copyright && (
+        <Typography variant={variant} {...CopyrightProps}>
+          {copyright}
+        </Typography>
+      )}
+      {icon && (
+        <a href={url} target="_blank" rel="noopener noreferrer">
+          <image
+            src={icon}
+            alt={copyright}
+            width={24}
+            height={24}
+            {...IconProps}
+          />
+        </a>
+      )}
+      {year && (
+        <Typography variant={variant} {...YearProps}>
+          {year}
+        </Typography>
+      )}
+    </Box>
+  );
+});
+
+export default Copyright;
diff --git a/packages/commons-ui-core/src/Copyright/Copyright.snap.js b/packages/commons-ui-core/src/Copyright/Copyright.snap.js
new file mode 100644
index 000000000..972bfca32
--- /dev/null
+++ b/packages/commons-ui-core/src/Copyright/Copyright.snap.js
@@ -0,0 +1,20 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Copyright renders inchanged 1`] = `
+<div>
+  <div
+    class="MuiBox-root css-1hmfz52"
+  >
+    <p
+      class="MuiTypography-root MuiTypography-body1 css-ahj2mt-MuiTypography-root"
+    >
+      Code for Africa
+    </p>
+    <p
+      class="MuiTypography-root MuiTypography-body1 css-ahj2mt-MuiTypography-root"
+    >
+      2024
+    </p>
+  </div>
+</div>
+`;
diff --git a/packages/commons-ui-core/src/Copyright/Copyright.test.js b/packages/commons-ui-core/src/Copyright/Copyright.test.js
new file mode 100644
index 000000000..f60912940
--- /dev/null
+++ b/packages/commons-ui-core/src/Copyright/Copyright.test.js
@@ -0,0 +1,17 @@
+import { render } from "@commons-ui/testing-library";
+import React from "react";
+
+import Copyright from "./Copyright";
+
+describe("Copyright", () => {
+  it("renders inchanged", () => {
+    const { container } = render(
+      <Copyright
+        copyright="Code for Africa"
+        year="2024"
+        url="https://google.com"
+      />,
+    );
+    expect(container).toMatchSnapshot();
+  });
+});
diff --git a/packages/commons-ui-core/src/Copyright/index.js b/packages/commons-ui-core/src/Copyright/index.js
new file mode 100644
index 000000000..d25031960
--- /dev/null
+++ b/packages/commons-ui-core/src/Copyright/index.js
@@ -0,0 +1,3 @@
+import Copyright from "./Copyright";
+
+export default Copyright;
diff --git a/packages/commons-ui-core/src/QuickLinks/QuickLinks.js b/packages/commons-ui-core/src/QuickLinks/QuickLinks.js
new file mode 100644
index 000000000..9931d2386
--- /dev/null
+++ b/packages/commons-ui-core/src/QuickLinks/QuickLinks.js
@@ -0,0 +1,66 @@
+import { Box, Link, Typography } from "@mui/material";
+import React from "react";
+
+const QuickLinks = React.forwardRef(function QuickLinks(props, ref) {
+  const { linkComponent, links, LinksProps, LinkProps, title, TitleProps, sx } =
+    props;
+  const LinkComponent = linkComponent || Link;
+
+  return (
+    <Box
+      sx={{
+        width: "100%",
+        paddingBottom: {
+          xs: "unset",
+          md: "0.5rem",
+        },
+        ...sx,
+      }}
+      ref={ref}
+    >
+      <Typography
+        {...TitleProps}
+        sx={{
+          lineHeight: "inherit",
+          ...TitleProps?.sx,
+        }}
+      >
+        {title}
+      </Typography>
+      <Typography
+        {...LinksProps}
+        sx={{
+          listStyle: "none",
+          padding: 0,
+          paddingTop: "1rem",
+          "& > li": {
+            marginTop: {
+              xs: "2.3125rem",
+              md: "1.5rem",
+            },
+          },
+          ...LinksProps?.sx,
+        }}
+        component="ul"
+      >
+        {links.map(({ label, ...others }) => (
+          <li key={label}>
+            <LinkComponent
+              {...others}
+              underline="none"
+              {...LinkProps}
+              sx={{
+                textDecoration: "none",
+                ...LinkProps?.sx,
+              }}
+            >
+              {label}
+            </LinkComponent>
+          </li>
+        ))}
+      </Typography>
+    </Box>
+  );
+});
+
+export default QuickLinks;
diff --git a/packages/commons-ui-core/src/QuickLinks/index.js b/packages/commons-ui-core/src/QuickLinks/index.js
new file mode 100644
index 000000000..f840220a1
--- /dev/null
+++ b/packages/commons-ui-core/src/QuickLinks/index.js
@@ -0,0 +1,3 @@
+import QuickLinks from "./QuickLinks";
+
+export default QuickLinks;
diff --git a/packages/commons-ui-core/src/index.js b/packages/commons-ui-core/src/index.js
index 6e7cc784e..39a6d2515 100644
--- a/packages/commons-ui-core/src/index.js
+++ b/packages/commons-ui-core/src/index.js
@@ -1,6 +1,7 @@
 export * from "./SocialMediaIconLink";
 export * from "./styles";
 
+export { default as Copyright } from "./Copyright";
 export { default as ImageButton } from "./ImageButton";
 export { default as NavBar } from "./NavBar";
 export { default as NavList } from "./NavList";
@@ -9,3 +10,4 @@ export { default as RichTypography } from "./RichTypography";
 export { default as Section } from "./Section";
 export { default as SocialMediaIconLink } from "./SocialMediaIconLink";
 export { default as StayInTouch } from "./StayInTouch";
+export { default as QuickLinks } from "./QuickLinks";
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 4092d5d33..7a958a501 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -45,9 +45,6 @@ catalogs:
     '@commons-ui/core':
       specifier: ^0.1.0
       version: 0.1.0
-    '@commons-ui/legacy':
-      specifier: npm:@commons-ui/core@^0.1.0
-      version: 0.1.0
     '@emotion/cache':
       specifier: ^11.13.1
       version: 11.13.1
@@ -671,31 +668,31 @@ importers:
         version: 0.84.0(prop-types@15.8.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@payloadcms/bundler-webpack':
         specifier: 'catalog:'
-        version: 1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@6.12.6)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(sass@1.69.4)
+        version: 1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@8.17.1)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(sass@1.69.4)
       '@payloadcms/db-mongodb':
         specifier: 'catalog:'
-        version: 1.7.3(@aws-sdk/client-sso-oidc@3.682.0(@aws-sdk/client-sts@3.682.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
+        version: 1.7.3(@aws-sdk/client-sso-oidc@3.682.0(@aws-sdk/client-sts@3.682.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
       '@payloadcms/plugin-cloud-storage':
         specifier: 'catalog:'
-        version: 1.2.0(@aws-sdk/client-s3@3.685.0)(@aws-sdk/lib-storage@3.685.0(@aws-sdk/client-s3@3.685.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
+        version: 1.2.0(@aws-sdk/client-s3@3.685.0)(@aws-sdk/lib-storage@3.685.0(@aws-sdk/client-s3@3.685.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
       '@payloadcms/plugin-nested-docs':
         specifier: 'catalog:'
-        version: 1.0.12(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
+        version: 1.0.12(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
       '@payloadcms/plugin-sentry':
         specifier: 'catalog:'
-        version: 0.0.6(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react@18.3.1)
+        version: 0.0.6(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react@18.3.1)
       '@payloadcms/plugin-seo':
         specifier: 'catalog:'
-        version: 2.3.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react@18.3.1)
+        version: 2.3.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react@18.3.1)
       '@payloadcms/richtext-slate':
         specifier: 'catalog:'
-        version: 1.5.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+        version: 1.5.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@react-spring/web':
         specifier: 'catalog:'
         version: 9.7.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@sentry/nextjs':
         specifier: 'catalog:'
-        version: 8.36.0(@opentelemetry/core@1.27.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.53.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.27.0(@opentelemetry/api@1.9.0))(encoding@0.1.13)(next@14.2.16(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react@18.3.1)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
+        version: 8.36.0(@opentelemetry/core@1.27.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.54.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.27.0(@opentelemetry/api@1.9.0))(encoding@0.1.13)(next@14.2.16(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react@18.3.1)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
       airtable:
         specifier: 'catalog:'
         version: 0.12.2(encoding@0.1.13)
@@ -722,7 +719,7 @@ importers:
         version: 6.6.0(next@14.2.16(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       payload:
         specifier: 'catalog:'
-        version: 2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
+        version: 2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
       prop-types:
         specifier: 'catalog:'
         version: 15.8.1
@@ -807,10 +804,10 @@ importers:
         version: link:../../packages/eslint-config-commons-ui
       eslint-import-resolver-webpack:
         specifier: 'catalog:'
-        version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
+        version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       identity-obj-proxy:
         specifier: 'catalog:'
         version: 3.0.0
@@ -837,7 +834,7 @@ importers:
         version: 5.6.3
       webpack:
         specifier: 'catalog:'
-        version: 5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)
+        version: 5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0(webpack-bundle-analyzer@4.10.2)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
 
   apps/civicsignalblog:
     dependencies:
@@ -885,10 +882,10 @@ importers:
         version: 14.2.16(next@14.2.16(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react@18.3.1)
       '@payloadcms/bundler-webpack':
         specifier: 'catalog:'
-        version: 1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@8.17.1)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(sass@1.69.4)
+        version: 1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@8.17.1)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(sass@1.69.4)
       '@payloadcms/db-mongodb':
         specifier: 'catalog:'
-        version: 1.7.3(@aws-sdk/client-sso-oidc@3.682.0(@aws-sdk/client-sts@3.682.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
+        version: 1.7.3(@aws-sdk/client-sso-oidc@3.682.0(@aws-sdk/client-sts@3.682.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
       '@payloadcms/live-preview':
         specifier: 'catalog:'
         version: 0.2.2
@@ -897,22 +894,22 @@ importers:
         version: 0.2.0(react@18.3.1)
       '@payloadcms/plugin-cloud-storage':
         specifier: 'catalog:'
-        version: 1.2.0(@aws-sdk/client-s3@3.685.0)(@aws-sdk/lib-storage@3.685.0(@aws-sdk/client-s3@3.685.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
+        version: 1.2.0(@aws-sdk/client-s3@3.685.0)(@aws-sdk/lib-storage@3.685.0(@aws-sdk/client-s3@3.685.0))(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
       '@payloadcms/plugin-nested-docs':
         specifier: 'catalog:'
-        version: 1.0.12(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
+        version: 1.0.12(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))
       '@payloadcms/plugin-sentry':
         specifier: 'catalog:'
-        version: 0.0.6(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react@18.3.1)
+        version: 0.0.6(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react@18.3.1)
       '@payloadcms/plugin-seo':
         specifier: 'catalog:'
-        version: 2.3.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react@18.3.1)
+        version: 2.3.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react@18.3.1)
       '@payloadcms/richtext-slate':
         specifier: 'catalog:'
-        version: 1.5.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
+        version: 1.5.2(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)
       '@sentry/nextjs':
         specifier: 'catalog:'
-        version: 8.36.0(@opentelemetry/core@1.27.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.54.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.27.0(@opentelemetry/api@1.9.0))(encoding@0.1.13)(next@14.2.16(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react@18.3.1)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
+        version: 8.36.0(@opentelemetry/core@1.27.0(@opentelemetry/api@1.9.0))(@opentelemetry/instrumentation@0.53.0(@opentelemetry/api@1.9.0))(@opentelemetry/sdk-trace-base@1.27.0(@opentelemetry/api@1.9.0))(encoding@0.1.13)(next@14.2.16(@babel/core@7.26.0)(@opentelemetry/api@1.9.0)(@playwright/test@1.48.2)(babel-plugin-macros@3.1.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(sass@1.69.4))(react@18.3.1)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
       camelcase-keys:
         specifier: 'catalog:'
         version: 9.1.3
@@ -942,7 +939,7 @@ importers:
         version: 1.0.3
       payload:
         specifier: 'catalog:'
-        version: 2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
+        version: 2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
       prop-types:
         specifier: 'catalog:'
         version: 15.8.1
@@ -1009,7 +1006,7 @@ importers:
         version: 3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1)
       eslint-import-resolver-webpack:
         specifier: 'catalog:'
-        version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
+        version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
       eslint-plugin-import:
         specifier: 'catalog:'
         version: 2.31.0(eslint-import-resolver-typescript@3.6.3)(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
@@ -1039,7 +1036,7 @@ importers:
         version: 5.6.3
       webpack:
         specifier: 'catalog:'
-        version: 5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0(webpack-bundle-analyzer@4.10.2)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))
+        version: 5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)
 
   apps/climatemappedafrica:
     dependencies:
@@ -1049,9 +1046,6 @@ importers:
       '@commons-ui/core':
         specifier: workspace:*
         version: link:../../packages/commons-ui-core
-      '@commons-ui/legacy':
-        specifier: 'catalog:'
-        version: '@commons-ui/core@0.1.0(@mui/material@5.16.7(@emotion/react@11.13.3(@types/react@18.3.12)(react@18.3.1))(@emotion/styled@11.13.0(@emotion/react@11.13.3(@types/react@18.3.12)(react@18.3.1))(@types/react@18.3.12)(react@18.3.1))(@types/react@18.3.12)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(@mui/styles@5.16.7(@types/react@18.3.12)(react@18.3.1))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(simplebar-react@3.2.6(react@18.3.1))'
       '@commons-ui/next':
         specifier: workspace:*
         version: link:../../packages/commons-ui-next
@@ -1485,7 +1479,7 @@ importers:
         version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       identity-obj-proxy:
         specifier: 'catalog:'
         version: 3.0.0
@@ -1720,7 +1714,7 @@ importers:
         version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(esbuild@0.24.0))
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       eslint-plugin-module-resolver:
         specifier: 'catalog:'
         version: 1.5.0
@@ -1904,7 +1898,7 @@ importers:
         version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1)
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       identity-obj-proxy:
         specifier: 'catalog:'
         version: 3.0.0
@@ -2212,7 +2206,7 @@ importers:
         version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1)
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       eslint-plugin-mdx:
         specifier: 'catalog:'
         version: 3.1.5(eslint@8.57.1)
@@ -2330,7 +2324,7 @@ importers:
         version: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1)
       eslint-plugin-import:
         specifier: 'catalog:'
-        version: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+        version: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       prettier:
         specifier: 'catalog:'
         version: 3.3.3
@@ -18023,9 +18017,9 @@ snapshots:
 
   '@panva/hkdf@1.2.1': {}
 
-  '@payloadcms/bundler-webpack@1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@6.12.6)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(sass@1.69.4)':
+  '@payloadcms/bundler-webpack@1.0.7(@swc/core@1.8.0(@swc/helpers@0.5.5))(ajv@8.17.1)(payload@2.30.3(@swc/helpers@0.5.5)(@types/react@18.3.12)(encoding@0.1.13)(typescript@5.6.3)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(sass@1.69.4)':
     dependencies:
-      ajv: 6.12.6
+      ajv: 8.17.1
       compression: 1.7.4
       connect-history-api-fallback: 1.6.0
       css-loader: 5.2.7(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
@@ -22835,7 +22829,7 @@ snapshots:
       is-bun-module: 1.2.1
       is-glob: 4.0.3
     optionalDependencies:
-      eslint-plugin-import: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
     transitivePeerDependencies:
       - '@typescript-eslint/parser'
       - eslint-import-resolver-node
@@ -22867,7 +22861,7 @@ snapshots:
       debug: 4.3.7
       enhanced-resolve: 5.17.1
       eslint: 8.57.1
-      eslint-module-utils: 2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
+      eslint-module-utils: 2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(eslint@8.57.1)
       fast-glob: 3.3.2
       get-tsconfig: 4.8.1
       is-bun-module: 1.2.1
@@ -22884,7 +22878,7 @@ snapshots:
     dependencies:
       debug: 3.2.7
       enhanced-resolve: 0.9.1
-      eslint-plugin-import: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+      eslint-plugin-import: 2.31.0(eslint-import-resolver-typescript@3.6.3)(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
       find-root: 1.1.0
       hasown: 2.0.2
       interpret: 1.4.0
@@ -22901,7 +22895,7 @@ snapshots:
     dependencies:
       debug: 3.2.7
       enhanced-resolve: 0.9.1
-      eslint-plugin-import: 2.31.0(eslint-import-resolver-typescript@3.6.3)(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       find-root: 1.1.0
       hasown: 2.0.2
       interpret: 1.4.0
@@ -22918,7 +22912,7 @@ snapshots:
     dependencies:
       debug: 3.2.7
       enhanced-resolve: 0.9.1
-      eslint-plugin-import: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       find-root: 1.1.0
       hasown: 2.0.2
       interpret: 1.4.0
@@ -22935,7 +22929,7 @@ snapshots:
     dependencies:
       debug: 3.2.7
       enhanced-resolve: 0.9.1
-      eslint-plugin-import: 2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1)
+      eslint-plugin-import: 2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-typescript@3.6.3(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint-plugin-import@2.31.0(@typescript-eslint/parser@8.12.2(eslint@8.57.1)(typescript@5.6.3))(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1))(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
       find-root: 1.1.0
       hasown: 2.0.2
       interpret: 1.4.0
@@ -23004,23 +22998,13 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  eslint-module-utils@2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1):
+  eslint-module-utils@2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(eslint@8.57.1):
     dependencies:
       debug: 3.2.7
     optionalDependencies:
       eslint: 8.57.1
       eslint-import-resolver-node: 0.3.9
       eslint-import-resolver-typescript: 3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1)
-      eslint-import-resolver-webpack: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5)))
-    transitivePeerDependencies:
-      - supports-color
-
-  eslint-module-utils@2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(eslint@8.57.1):
-    dependencies:
-      debug: 3.2.7
-    optionalDependencies:
-      eslint: 8.57.1
-      eslint-import-resolver-node: 0.3.9
       eslint-import-resolver-webpack: 0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0))
     transitivePeerDependencies:
       - supports-color
@@ -23123,34 +23107,7 @@ snapshots:
       doctrine: 2.1.0
       eslint: 8.57.1
       eslint-import-resolver-node: 0.3.9
-      eslint-module-utils: 2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))))(eslint@8.57.1)
-      hasown: 2.0.2
-      is-core-module: 2.15.1
-      is-glob: 4.0.3
-      minimatch: 3.1.2
-      object.fromentries: 2.0.8
-      object.groupby: 1.0.3
-      object.values: 1.2.0
-      semver: 6.3.1
-      string.prototype.trimend: 1.0.8
-      tsconfig-paths: 3.15.0
-    transitivePeerDependencies:
-      - eslint-import-resolver-typescript
-      - eslint-import-resolver-webpack
-      - supports-color
-
-  eslint-plugin-import@2.31.0(eslint-import-resolver-webpack@0.13.9)(eslint@8.57.1):
-    dependencies:
-      '@rtsao/scc': 1.1.0
-      array-includes: 3.1.8
-      array.prototype.findlastindex: 1.2.5
-      array.prototype.flat: 1.3.2
-      array.prototype.flatmap: 1.3.2
-      debug: 3.2.7
-      doctrine: 2.1.0
-      eslint: 8.57.1
-      eslint-import-resolver-node: 0.3.9
-      eslint-module-utils: 2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(eslint@8.57.1)
+      eslint-module-utils: 2.12.0(eslint-import-resolver-node@0.3.9)(eslint-import-resolver-typescript@3.6.3(eslint-import-resolver-webpack@0.13.9)(eslint-plugin-import@2.31.0)(eslint@8.57.1))(eslint-import-resolver-webpack@0.13.9(eslint-plugin-import@2.31.0)(webpack@5.96.1(@swc/core@1.8.0(@swc/helpers@0.5.5))(webpack-cli@4.10.0)))(eslint@8.57.1)
       hasown: 2.0.2
       is-core-module: 2.15.1
       is-glob: 4.0.3