feat(eslint): update eslint to v9 for packages

apps/demo/eslint.config.js

@@ -0,0 +1,11 @@
+import reactConfig from "@prefabs.tech/eslint-config/react-app.js";
+
+export default [
+  ...reactConfig,
+  {
+    rules: {
+      "jsx-a11y/no-autofocus": "off",
+      "react-hooks/purity": "off",
+    },
+  },
+];

apps/demo/package.json

@@ -17,7 +17,7 @@
     "typecheck": "tsc --noEmit -p tsconfig.vitest.json --composite false"
   },
   "dependencies": {
-    "@prefabs.tech/tsconfig": "0.2.1",
+    "@prefabs.tech/tsconfig": "0.5.0",
     "@prefabs.tech/react-config": "0.71.0",
     "@prefabs.tech/react-form": "0.71.0",
     "@prefabs.tech/react-i18n": "0.71.0",
@@ -36,7 +36,7 @@
     "zod": "3.23.8"
   },
   "devDependencies": {
-    "@prefabs.tech/eslint-config": "0.2.1",
+    "@prefabs.tech/eslint-config": "0.5.0",
     "@babel/core": "7.26.10",
     "@babel/plugin-syntax-flow": "7.26.0",
     "@babel/plugin-transform-react-jsx": "^7.21.0",
@@ -45,21 +45,11 @@
     "@types/node": "24.10.1",
     "@types/react": "18.3.20",
     "@types/react-dom": "18.3.6",
-    "@typescript-eslint/eslint-plugin": "8.24.1",
-    "@typescript-eslint/parser": "8.24.1",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.0.8",
-    "eslint": "8.57.1",
-    "eslint-config-prettier": "9.1.0",
-    "eslint-config-react-app": "7.0.1",
-    "eslint-import-resolver-alias": "1.1.2",
-    "eslint-import-resolver-typescript": "3.8.3",
-    "eslint-plugin-cypress": "3.6.0",
-    "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-prettier": "5.2.6",
-    "eslint-plugin-unicorn": "56.0.1",
+    "eslint": "9.39.2",
     "jsdom": "25.0.1",
-    "prettier": "3.5.3",
+    "prettier": "3.8.1",
     "typescript": "5.7.3",
     "vite": "6.4.1",
     "vite-plugin-compression": "0.5.1",

apps/demo/setup-test.ts

@@ -6,7 +6,6 @@ vi.mock("@prefabs.tech/react-i18n", () => ({
     return {
       t: (string_) => string_,
       i18n: {
-        // eslint-disable-next-line @typescript-eslint/no-empty-function
         changeLanguage: () => new Promise(() => {}),
       },
     };

apps/demo/src/Views/ErrorBoundary/__test__/ErrorBoundary.snapshot.test.tsx

@@ -4,7 +4,7 @@ import { expect, test } from "vitest";
 import ErrorBoundary from "../index";
 
 vi.mock("react-router-dom", async () => ({
-  ...((await vi.importActual("react-router-dom")) as any),
+  ...(await vi.importActual("react-router-dom")),
   useRouteError: () => ({ statusText: 404, message: "Not Found" }),
 }));
 

apps/demo/src/Views/ErrorBoundary/__test__/ErrorBoundary.test.tsx

@@ -4,7 +4,7 @@ import { expect, test } from "vitest";
 import ErrorBoundary from "../index";
 
 vi.mock("react-router-dom", async () => ({
-  ...((await vi.importActual("react-router-dom")) as any),
+  ...(await vi.importActual("react-router-dom")),
   useRouteError: () => ({ statusText: 404, message: "Not Found" }),
 }));
 

apps/demo/src/Views/Form/components/FileInput/_components/FormFileInputButton.tsx

@@ -8,10 +8,11 @@ import { UploadBy } from "./FormWithFileInput";
 export const FormWithFileInputButton: React.FC = () => {
   const { t } = useTranslation("files");
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const onSubmit = (values: any) => {
     const formData = new FormData();
 
-    for (let name in values) {
+    for (const name in values) {
       formData.set(name, values[name]);
     }
 

apps/demo/src/Views/Form/components/FileInput/_components/FormWithFileInput.tsx

@@ -11,10 +11,11 @@ import React from "react";
 export const FormWithFileInput: React.FC = () => {
   const { t } = useTranslation("files");
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const onSubmit = (values: any) => {
     const formData = new FormData();
 
-    for (let name in values) {
+    for (const name in values) {
       formData.set(name, values[name]);
     }
 

apps/demo/src/Views/Form/components/FormInput/FormInput.tsx

@@ -59,6 +59,7 @@ export const FormInputDemo = () => {
     }),
   });
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleSubmit = (_formData: any) => {
     setFormData(JSON.stringify(_formData, null, 4));
   };

apps/demo/src/Views/Form/components/FormInput/FormInputFields.tsx

@@ -25,6 +25,7 @@ type Properties = {
 export const FormInputFields = ({ checkFilledState }: Properties) => {
   const [t] = useTranslation("form");
   const [isLoading, setIsLoading] = useState(false);
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const [options, setOptions] = useState<any>([]);
   const {
     register,
@@ -35,12 +36,14 @@ export const FormInputFields = ({ checkFilledState }: Properties) => {
 
   const [filled, valid, invalid] = watch(["filled", "valid", "invalid"]);
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleDataFetch = (value: any) => {
     setIsLoading(true);
     fetch(`https://api.escuelajs.co/api/v1/products/?title=${value}`)
       .then(async (response) => {
         const data = await response.json();
 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         setOptions(data.map((item: any) => item));
         setIsLoading(false);
       })

apps/demo/src/Views/Home/components/Package.tsx

@@ -14,7 +14,7 @@ export const Package = ({
   const classNames = ["package", className].filter((c) => !!c).join(" ");
 
   return (
-    <div className={classNames} onClick={onClick}>
+    <div className={classNames} role="button" tabIndex={0} onClick={onClick}>
       <h2>{title}</h2>
       <p>{description}</p>
     </div>

apps/demo/src/Views/Ui/components/DropdownMenuDemo.tsx

@@ -42,6 +42,7 @@ export const DropdownMenuDemo = () => {
     },
   ];
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const template = (item: any) => {
     return (
       <>

apps/demo/src/Views/Ui/components/FormWidgets/Typeahead.tsx

@@ -52,28 +52,33 @@ export const TypeaheadDemo = () => {
   const navigate = useNavigate();
 
   const [isLoading, setIsLoading] = useState(false);
-  const [options, setOptions] = useState<any>([]);
+  const [options, setOptions] = useState([]);
   const [suggestions, setSuggestions] = useState([]);
   const [customSuggestions, setCustomSuggestions] = useState<
     Array<CustomSuggestionType>
   >([]);
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleDataFetch = (value: any) => {
     setIsLoading(true);
     fetch(`https://api.escuelajs.co/api/v1/products/?title=${value}`)
       .then(async (response) => {
         const data = await response.json();
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         setOptions(data.map((item: any) => item.title));
         setIsLoading(false);
       })
       .catch((err) => console.log("err", err)); // eslint-disable-line no-console
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleServerChange = (value: any) => {
     console.log("selected server value:", value); // eslint-disable-line no-console
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleDataFilter = (value: any) => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     let newSuggestions: any = [];
 
     if (value.length > 0) {
@@ -84,6 +89,7 @@ export const TypeaheadDemo = () => {
     }
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const handleCustomSuggestionDataFilter = (value: any) => {
     let newSuggestions = [];
 

apps/demo/src/Views/Ui/components/Stepper/Stepper.tsx

@@ -127,6 +127,7 @@ export const StepperDemo = () => {
           hideButtons={true}
           activeIndex={activeIndex}
           readOnly={true}
+          // eslint-disable-next-line @typescript-eslint/no-explicit-any
           onChange={(event: any) => {
             setActiveIndex(event.index);
           }}

apps/demo/src/Views/Ui/components/TabView/TabViewDemo.tsx

@@ -5,7 +5,7 @@ import { ConfirmationModal } from "@prefabs.tech/react-ui";
 import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 
-import { addTab } from "./utils";
+import { addTab } from "./utilities";
 import { CodeBlock, Section } from "../../../../components/Demo";
 
 const data = [

apps/demo/src/Views/Ui/components/TabView/utils.ts → apps/demo/src/Views/Ui/components/TabView/utilities.ts

@@ -1,7 +1,10 @@
 export const addTab = (
   key: string,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   visibleTabs: any[],
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   setVisibleTabs: any,
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   setActive: any,
 ) => {
   const existingTab = visibleTabs.find((tab) => tab === key);

apps/demo/src/Views/Ui/components/Table/Table.tsx

@@ -80,6 +80,7 @@ export const TableDemo = () => {
     },
   ];
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const inDateRangeFilter: FilterFunction<any> = (
     row,
     columnId,
@@ -103,6 +104,7 @@ export const TableDemo = () => {
     );
   };
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const customEqualStringFilter: FilterFunction<any> = (
     row,
     columnId,

apps/demo/src/Views/Ui/components/YoutubeFacade/YoutubeFacade.tsx

@@ -20,6 +20,7 @@ const YoutubeFacade: React.FC<IProperties> = ({
   const VideoImageLink =
     imageSource || `https://img.youtube.com/vi/${videoToken}/mqdefault.jpg`;
 
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   const loadYoutubeVideo = (event: any) => {
     event.preventDefault();
 

apps/demo/src/components/Demo/Demo.tsx

@@ -3,6 +3,7 @@ import { ReactNode, useMemo, useRef } from "react";
 import { NavLink } from "react-router-dom";
 
 interface Properties {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   subnav: Array<any>;
   children?: ReactNode;
   isGrouped?: boolean;
@@ -22,7 +23,7 @@ export const Demo: React.FC<Properties> = ({
 
     return (
       <ul>
-        {subnav.map((nav: any) => {
+        {subnav.map((nav) => {
           return (
             <li key={nav.route}>
               <NavLink to={nav.route} end>

packages/config/eslint.config.js

@@ -0,0 +1,3 @@
+import reactConfig from "@prefabs.tech/eslint-config/react.js";
+
+export default [...reactConfig];

packages/config/package.json

@@ -28,24 +28,16 @@
     "typecheck": "tsc --noEmit -p tsconfig.vitest.json --composite false"
   },
   "devDependencies": {
-    "@prefabs.tech/eslint-config": "0.2.1",
-    "@prefabs.tech/tsconfig": "0.2.1",
+    "@prefabs.tech/eslint-config": "0.5.0",
+    "@prefabs.tech/tsconfig": "0.5.0",
     "@types/jsdom": "21.1.7",
     "@types/node": "24.10.1",
     "@types/react": "18.3.20",
-    "@typescript-eslint/eslint-plugin": "8.24.1",
-    "@typescript-eslint/parser": "8.24.1",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.0.8",
-    "eslint": "8.57.1",
-    "eslint-config-prettier": "9.1.0",
-    "eslint-import-resolver-alias": "1.1.2",
-    "eslint-import-resolver-typescript": "3.8.3",
-    "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-prettier": "5.2.6",
-    "eslint-plugin-unicorn": "56.0.1",
+    "eslint": "9.39.2",
     "jsdom": "26.0.0",
-    "prettier": "3.5.3",
+    "prettier": "3.8.1",
     "react": "18.3.1",
     "typescript": "5.7.3",
     "vite": "6.4.1",

packages/form/eslint.config.js

@@ -0,0 +1,3 @@
+import reactConfig from "@prefabs.tech/eslint-config/react.js";
+
+export default [...reactConfig];

packages/form/package.json

@@ -36,29 +36,20 @@
     "zod": "3.23.8"
   },
   "devDependencies": {
-    "@prefabs.tech/eslint-config": "0.2.1",
-    "@prefabs.tech/tsconfig": "0.2.1",
+    "@prefabs.tech/eslint-config": "0.5.0",
+    "@prefabs.tech/tsconfig": "0.5.0",
     "@prefabs.tech/react-ui": "0.71.0",
     "@testing-library/react": "16.3.0",
     "@types/jsdom": "21.1.7",
     "@types/node": "24.10.1",
     "@types/react": "18.3.20",
     "@types/react-dom": "18.3.6",
     "@types/validator": "13.12.2",
-    "@typescript-eslint/eslint-plugin": "8.24.1",
-    "@typescript-eslint/parser": "8.24.1",
     "@vitejs/plugin-react": "4.4.1",
     "@vitest/coverage-v8": "3.0.8",
-    "eslint": "8.57.1",
-    "eslint-config-prettier": "9.1.0",
-    "eslint-import-resolver-alias": "1.1.2",
-    "eslint-import-resolver-typescript": "3.8.3",
-    "eslint-plugin-import": "2.31.0",
-    "eslint-plugin-prettier": "5.2.6",
-    "eslint-plugin-react": "7.37.5",
-    "eslint-plugin-unicorn": "56.0.1",
+    "eslint": "9.39.2",
     "jsdom": "25.0.1",
-    "prettier": "3.5.3",
+    "prettier": "3.8.1",
     "primereact": "9.6.1",
     "react": "18.3.1",
     "react-dom": "18.3.1",

packages/form/src/components/CurrencyPicker.tsx

@@ -10,11 +10,10 @@ interface ValidationMessages {
   minSelection?: string;
 }
 
-interface ICurrencyPickerProperties<T extends string | number>
-  extends Omit<
-    CurrencyPickerProperties<T>,
-    "onChange" | "value" | "hasError" | "errorMessage"
-  > {
+interface ICurrencyPickerProperties<T extends string | number> extends Omit<
+  CurrencyPickerProperties<T>,
+  "onChange" | "value" | "hasError" | "errorMessage"
+> {
   maxSelection?: number;
   minSelection?: number;
   showValidState?: boolean;

packages/form/src/components/DatePicker.tsx

@@ -5,11 +5,10 @@ import {
 import { FC } from "react";
 import { Controller, useFormContext } from "react-hook-form";
 
-interface DatePicker
-  extends Omit<
-    DatePickerProperties,
-    "onChange" | "value" | "error" | "inputRef"
-  > {
+interface DatePicker extends Omit<
+  DatePickerProperties,
+  "onChange" | "value" | "error" | "inputRef"
+> {
   name: string;
 }