refactor: update code to latest eslint-config and rules

refactor(core): do not use vitest deprecated methods

refactor(core): disable unneeded react/prop-types eslint rule

refactor(core): fix prefer-global-this

refactor(core): fix do not use typeof === undefined

refactor(core): fix unicorn number eslint rules

refactor(core): fix no-this-assignment and prefer-class-fields

refactor(core): fix unicorn DOM eslint rules

refactor(core): fix prefer-add-event-listener

refactor(core): fix no-instanceof-builtins

refactor(core): fix error message eslint rules

refactor(core): fix no-lonely-if eslint rule

refactor(core): fix unicorn string related eslint rules

refactor(core): fix unicorn array length eslint rules

refactor(core): fix no-array-for-each

refactor(core): fix no-for-loop

refactor(core): fix no-array-reduce

refactor(core): fix remaining array like eslint rules

refactor(core): fix prefer spread

refactor(core): fix prefer-switch

refactor(core): fix a more unicorn eslint rules

chore(core): bump eslint-config to latest

refactor(docs-generator): update eslint rules

refactor(code): update eslint config

refactor(playground): update eslint-config

refactor(docs): update eslint config

Author: mlaursen

.changeset/slick-rockets-care.md

@@ -0,0 +1,5 @@
+---
+"@react-md/core": patch
+---
+
+Updated code for new eslint rules which mostly changed usage of `window` to `globalThis`. This should generally not require any changes on your end.

apps/docs/eslint.config.mjs

@@ -1,23 +1,22 @@
 // @ts-check
 import { FlatCompat } from "@eslint/eslintrc";
-import { configs, defineConfig, gitignore } from "@react-md/eslint-config";
+import { configs, gitignore } from "@react-md/eslint-config";
+import { defineConfig } from "eslint/config";
 
 const compat = new FlatCompat({
   baseDirectory: import.meta.dirname,
 });
 
-const strict = process.env.STRICT_TYPING === "true";
-
-const frontend = strict
-  ? configs.frontendTypeChecking(import.meta.dirname, "jest")
-  : configs.frontend("jest");
-
 export default defineConfig(
   gitignore(import.meta.url),
   ...compat.config({
     extends: ["plugin:@next/next/core-web-vitals"],
   }),
-  ...frontend,
+  ...configs.recommendedFrontend({
+    testFramework: "vitest",
+    tsconfigRootDir:
+      process.env.STRICT_TYPING === "true" ? import.meta.dirname : undefined,
+  }),
   {
     // this seems to be needed to set the module/moduleResolution/target to "nodenext" + "esnext"
     languageOptions: {
@@ -38,12 +37,6 @@ export default defineConfig(
       "src/generated/**",
     ],
   },
-  {
-    files: ["scripts/**"],
-    rules: {
-      "no-console": "off",
-    },
-  },
   {
     files: ["**/(demos)/**"],
     rules: {

apps/docs/scripts/createScssLookup.ts

@@ -5,27 +5,26 @@ import { logComplete } from "docs-generator/utils/log";
 
 import { ensureGeneratedDir } from "./ensureGeneratedDir.js";
 
-if (!process.argv.includes("--watch")) {
+if (process.argv.includes("--watch")) {
+  const CORE_DIST = "node_modules/@react-md/core/dist";
+
+  const debounced = debounce(createScssLookup, 1000);
+  const watcher = watch(CORE_DIST, {
+    persistent: true,
+    ignored: (path, stats) => !!stats?.isFile() && !path.endsWith(".scss"),
+  });
+  watcher.on("change", () => {
+    try {
+      debounced();
+    } catch (error) {
+      console.error(error);
+    }
+  });
+
+  watcher.on("ready", () => {
+    logComplete("Watching for sass changes");
+  });
+} else {
   await ensureGeneratedDir();
   await createScssLookup();
-  process.exit(0);
 }
-
-const CORE_DIST = "node_modules/@react-md/core/dist";
-
-const debounced = debounce(createScssLookup, 1000);
-const watcher = watch(CORE_DIST, {
-  persistent: true,
-  ignored: (path, stats) => !!stats?.isFile() && !path.endsWith(".scss"),
-});
-watcher.on("change", () => {
-  try {
-    debounced();
-  } catch (e) {
-    console.error(e);
-  }
-});
-
-watcher.on("ready", () => {
-  logComplete("Watching for sass changes");
-});

apps/docs/scripts/createStackBlitzTemplate.ts

@@ -14,13 +14,13 @@ import { ensureGeneratedDir } from "./ensureGeneratedDir.js";
 function getAllFiles(dir: string): readonly string[] {
   const files: string[] = [];
   const dirFiles = readdirSync(dir);
-  dirFiles.forEach((file) => {
+  for (const file of dirFiles) {
     if (
       /node_modules|(\.git$)|RootLayout|MainNavigation|README|CHANGELOG|(\.(ico|png))/.test(
         file
       )
     ) {
-      return;
+      continue;
     }
 
     const fullPath = join(dir, file);
@@ -29,7 +29,7 @@ function getAllFiles(dir: string): readonly string[] {
     } else {
       files.push(fullPath);
     }
-  });
+  }
 
   return files;
 }
@@ -90,6 +90,7 @@ export const STACKBLITZ_DEPENDENCIES: Record<string, string> = ${JSON.stringify(
 }
 
 await log(
+  // eslint-disable-next-line unicorn/prefer-top-level-await
   run(),
   "",
   `Created ${getAliasedFileName(GENERATED_STACKBLITZ_FILE)}`

apps/docs/scripts/sassdoc-utils/generateNavItems.ts

@@ -13,13 +13,19 @@ export async function generateNavItems(
 ): Promise<void> {
   const { mixins, functions, variables } = options;
   const groups = new Set<string>();
-  mixins.forEach((item) => groups.add(item.group));
-  functions.forEach((item) => groups.add(item.group));
-  variables.forEach((item) => groups.add(item.group));
+  for (const [, item] of mixins) {
+    groups.add(item.group);
+  }
+  for (const [, item] of functions) {
+    groups.add(item.group);
+  }
+  for (const [, item] of variables) {
+    groups.add(item.group);
+  }
 
   const components: NavigationItemStringChildrenRoute[] = [];
   const remainingItems: NavigationItemStringChildrenRoute[] = [];
-  groups.forEach((group) => {
+  for (const group of groups) {
     if (group.startsWith("core.")) {
       const withoutCore = group.replace("core.", "");
       if (withoutCore === "form") {
@@ -42,7 +48,7 @@ export async function generateNavItems(
         children: titleCase(group, "-"),
       });
     }
-  });
+  }
 
   await createNavItems({
     name: "SASSDOC_NAV_ITEMS",

apps/docs/scripts/sassdoc-utils/touch.ts

@@ -1,6 +1,6 @@
 import { log, logComplete } from "docs-generator/utils/log";
 import { getAliasedFileName } from "docs-generator/utils/writeGeneratedFile";
-import { existsSync } from "fs";
+import { existsSync } from "node:fs";
 import { type GeneratedSassDocWithOrder } from "sassdoc-generator";
 
 import {
@@ -43,9 +43,9 @@ export const touch = async (): Promise<void> => {
     await Promise.all(
       updates.map(async ([fn, fileNames]) => {
         if (await runIfNotExists(fn, fileNames)) {
-          fileNames.forEach((fileName) => {
+          for (const fileName of fileNames) {
             logComplete(`Created an empty "${getAliasedFileName(fileName)}`);
-          });
+          }
         }
       })
     );

apps/docs/scripts/sassdoc.ts

@@ -9,16 +9,16 @@ import { touch } from "./sassdoc-utils/touch.js";
 
 if (process.argv.includes("--touch")) {
   await touch();
-  process.exit(0);
-}
+} else {
+  async function run(): Promise<void> {
+    await ensureGeneratedDir();
+    const generated = await generate({ src: CORE_SRC });
+    await Promise.all([
+      createSassDocFile(generated),
+      generateNavItems(generated),
+    ]);
+  }
 
-async function run(): Promise<void> {
-  await ensureGeneratedDir();
-  const generated = await generate({ src: CORE_SRC });
-  await Promise.all([
-    createSassDocFile(generated),
-    generateNavItems(generated),
-  ]);
+  // eslint-disable-next-line unicorn/prefer-top-level-await
+  await log(run(), "", "sassdoc script completed");
 }
-
-await log(run(), "", "sassdoc script completed");