chore(deps): update linters (major)

eslint.config.mjs

@@ -105,7 +105,7 @@ export default tseslint.config(
   react.configs.flat.recommended,
   react.configs.flat['jsx-runtime'],
   jsxA11y.flatConfigs.recommended,
-  eslintPluginReactHooks.configs['recommended-latest'],
+  ...eslintPluginReactHooks.configs.recommended,
   {
     files: ['**/*.{js,mjs,cjs,jsx,mjsx,ts,tsx,mtsx}'],
     plugins: {
@@ -123,7 +123,9 @@ export default tseslint.config(
     },
     settings: {
       react: {
-        version: 'detect'
+        // TODO: change back to 'detect' once eslint-plugin-react supports ESLint 10
+        // See: https://github.com/jsx-eslint/eslint-plugin-react/issues/3977
+        version: '19'
       }
     },
     rules: {

package.json

@@ -122,8 +122,8 @@
     "@aws-sdk/client-cloudfront": "3.901.0",
     "@babel/core": "7.28.4",
     "@eslint/eslintrc": "3.3.1",
-    "@eslint/js": "9.37.0",
-    "@eslint/json": "0.13.2",
+    "@eslint/js": "10.0.1",
+    "@eslint/json": "1.0.1",
     "@types/gatsbyjs__reach-router": "2.0.5",
     "@types/hast": "3.0.4",
     "@types/isomorphic-fetch": "0.0.39",
@@ -135,16 +135,16 @@
     "@types/unist": "3.0.3",
     "browserslist": "4.28.1",
     "class-variance-authority": "0.7.1",
-    "eslint": "9.37.0",
+    "eslint": "10.0.3",
     "eslint-config-prettier": "10.1.8",
     "eslint-import-resolver-typescript": "4.4.4",
     "eslint-plugin-import": "2.32.0",
-    "eslint-plugin-import-x": "4.16.1",
+    "eslint-plugin-import-x": "4.16.2",
     "eslint-plugin-jsx-a11y": "6.10.2",
     "eslint-plugin-n": "17.23.1",
     "eslint-plugin-prettier": "5.5.4",
     "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-react-hooks": "5.2.0",
+    "eslint-plugin-react-hooks": "6.1.1",
     "gatsby-plugin-webpack-bundle-analyser-v2": "1.1.32",
     "gatsby-source-filesystem": "5.16.0",
     "globals": "17.4.0",
@@ -154,12 +154,15 @@
     "prettier": "3.6.2",
     "remark": "15.0.1",
     "remark-html": "16.0.1",
-    "stylelint": "16.25.0",
-    "stylelint-config-standard": "38.0.0",
+    "stylelint": "17.4.0",
+    "stylelint-config-standard": "40.0.0",
     "typescript": "5.9.3",
-    "typescript-eslint": "8.46.0",
+    "typescript-eslint": "8.57.0",
     "vitest": "4.0.18"
   },
+  "resolutions": {
+    "css-tree": "^3.2.1"
+  },
   "cacheDirectories": [
     "node_modules"
   ],

src/components/Documentation/Markdown/Main/styles.module.css

@@ -71,7 +71,7 @@
       @apply scroll-mt-5;
 
       font-weight: 500;
-      word-wrap: normal;
+      overflow-wrap: normal;
     }
 
     img + em,

src/components/Documentation/Markdown/components/default.tsx

@@ -39,12 +39,14 @@ export const Details: React.FC<
   )
 
   const title = triggerChildren.reduce<string>((acc, cur) => {
-    return (acc +=
-      typeof cur === 'string'
+    return (
+      acc +
+      (typeof cur === 'string'
         ? cur
         : typeof cur === 'object'
           ? cur?.props?.children?.toString()
           : '')
+    )
   }, '')
 
   id = useMemo(() => {

src/components/LayoutHeader/Nav/index.tsx

@@ -27,7 +27,9 @@ const Nav: React.FC<NavProps> = ({ opened, onToggle, onClose }) => {
   }, [opened])
 
   const onCloseRef = useRef(onClose)
-  onCloseRef.current = onClose
+  useEffect(() => {
+    onCloseRef.current = onClose
+  }, [onClose])
 
   useEffect(() => {
     if (!opened) return