diff --git a/eslint.config.mjs b/eslint.config.mjs index a1945d017..64cc3b3af 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -1,49 +1,37 @@ import path from 'node:path' import { fileURLToPath } from 'node:url' -import { fixupPluginRules } from '@eslint/compat' -import { FlatCompat } from '@eslint/eslintrc' import js from '@eslint/js' -import typescriptEslint from '@typescript-eslint/eslint-plugin' -import tsParser from '@typescript-eslint/parser' +import eslintConfigPrettier from 'eslint-config-prettier' import react from 'eslint-plugin-react' import reactHooks from 'eslint-plugin-react-hooks' import simpleImportSort from 'eslint-plugin-simple-import-sort' +import globals from 'globals' +import tseslint from 'typescript-eslint' const __filename = fileURLToPath(import.meta.url) const __dirname = path.dirname(__filename) -const compat = new FlatCompat({ - allConfig: js.configs.all, - baseDirectory: __dirname, - recommendedConfig: js.configs.recommended, -}) -export default [ +export default tseslint.config( { ignores: ['**/compiled/', '**/coverage/', '**/dist/', '**/node_modules/'], }, - ...compat.extends( - 'plugin:react/recommended', - 'plugin:@typescript-eslint/recommended', - 'prettier', - ), + js.configs.recommended, + ...tseslint.configs.recommended, + react.configs.flat.recommended, + eslintConfigPrettier, { languageOptions: { - ecmaVersion: 5, - parser: tsParser, parserOptions: { ecmaFeatures: { jsx: true, }, project: path.join(__dirname, 'tsconfig.eslint.json'), }, - sourceType: 'module', }, plugins: { - '@typescript-eslint': typescriptEslint, - react, - 'react-hooks': fixupPluginRules(reactHooks), + 'react-hooks': reactHooks, 'simple-import-sort': simpleImportSort, }, @@ -67,11 +55,24 @@ export default [ }, { files: ['**/*.js'], + languageOptions: { + globals: { + ...globals.node, + }, + }, rules: { '@typescript-eslint/explicit-module-boundary-types': 'off', '@typescript-eslint/no-require-imports': 'off', }, }, + { + files: ['examples/plain-js/**/*.js'], + languageOptions: { + globals: { + ...globals.browser, + }, + }, + }, { files: ['examples/**/*'], rules: { @@ -85,4 +86,4 @@ export default [ 'react/prop-types': 'off', }, }, -] +) diff --git a/package-lock.json b/package-lock.json index 3951c9d01..92f5a200c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,13 +13,11 @@ "hoist-non-react-statics": "^3.3.2" }, "devDependencies": { - "@babel/core": "7.29.0", - "@babel/plugin-transform-runtime": "7.29.0", - "@babel/preset-env": "7.29.0", + "@babel/core": "^7.29.0", + "@babel/plugin-transform-runtime": "^7.29.0", + "@babel/preset-env": "^7.29.0", "@babel/preset-react": "7.28.5", "@babel/preset-typescript": "7.28.5", - "@eslint/compat": "2.0.2", - "@eslint/eslintrc": "3.3.3", "@eslint/js": "9.39.2", "@rollup/plugin-babel": "6.1.0", "@rollup/plugin-commonjs": "29.0.0", @@ -33,13 +31,12 @@ "@types/node": "24.10.13", "@types/react": "19.2.14", "@types/react-dom": "19.2.3", - "@typescript-eslint/eslint-plugin": "8.55.0", - "@typescript-eslint/parser": "8.55.0", "eslint": "9.39.2", "eslint-config-prettier": "10.1.8", "eslint-plugin-react": "7.37.5", "eslint-plugin-react-hooks": "7.0.1", "eslint-plugin-simple-import-sort": "12.1.1", + "globals": "^17.3.0", "jest": "30.2.0", "jest-environment-jsdom": "30.2.0", "mock-raf": "1.0.1", @@ -47,13 +44,12 @@ "prettier": "3.8.1", "react": "19.2.4", "react-dom": "19.2.4", - "react-test-renderer": "19.2.4", - "regenerator-runtime": "0.14.1", "rollup": "4.57.1", "shx": "0.4.0", "tanem-scripts": "8.0.2", "ts-jest": "29.4.6", - "typescript": "5.9.3" + "typescript": "5.9.3", + "typescript-eslint": "^8.55.0" }, "peerDependencies": { "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0", @@ -2177,40 +2173,6 @@ "node": "^12.0.0 || ^14.0.0 || >=16.0.0" } }, - "node_modules/@eslint/compat": { - "version": "2.0.2", - "resolved": "https://registry.npmjs.org/@eslint/compat/-/compat-2.0.2.tgz", - "integrity": "sha512-pR1DoD0h3HfF675QZx0xsyrsU8q70Z/plx7880NOhS02NuWLgBCOMDL787nUeQ7EWLkxv3bPQJaarjcPQb2Dwg==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "@eslint/core": "^1.1.0" - }, - "engines": { - "node": "^20.19.0 || ^22.13.0 || >=24" - }, - "peerDependencies": { - "eslint": "^8.40 || 9 || 10" - }, - "peerDependenciesMeta": { - "eslint": { - "optional": true - } - } - }, - "node_modules/@eslint/compat/node_modules/@eslint/core": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/@eslint/core/-/core-1.1.0.tgz", - "integrity": "sha512-/nr9K9wkr3P1EzFTdFdMoLuo1PmIxjmwvPozwoSodjNBdefGujXQUF93u1DDZpEaTuDvMsIQddsd35BwtrW9Xw==", - "dev": true, - "license": "Apache-2.0", - "dependencies": { - "@types/json-schema": "^7.0.15" - }, - "engines": { - "node": "^20.19.0 || ^22.13.0 || >=24" - } - }, "node_modules/@eslint/config-array": { "version": "0.21.1", "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.21.1.tgz", @@ -2276,6 +2238,19 @@ "url": "https://opencollective.com/eslint" } }, + "node_modules/@eslint/eslintrc/node_modules/globals": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz", + "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18" + }, + "funding": { + "url": "https://github.com/sponsors/sindresorhus" + } + }, "node_modules/@eslint/js": { "version": "9.39.2", "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.39.2.tgz", @@ -6802,9 +6777,9 @@ } }, "node_modules/globals": { - "version": "14.0.0", - "resolved": "https://registry.npmjs.org/globals/-/globals-14.0.0.tgz", - "integrity": "sha512-oahGvuMGQlPw/ivIYBjVSrWAfWLBeku5tpPE2fOPLi+WHffIWbuh2tCjhyQhTBPMf5E9jDEH4FOmTYgYwbKwtQ==", + "version": "17.3.0", + "resolved": "https://registry.npmjs.org/globals/-/globals-17.3.0.tgz", + "integrity": "sha512-yMqGUQVVCkD4tqjOJf3TnrvaaHDMYp4VlUSObbkIiuCPe/ofdMBFIAcBbCSRFWOnos6qRiTVStDwqPLUclaxIw==", "dev": true, "license": "MIT", "engines": { @@ -9974,27 +9949,6 @@ "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==", "license": "MIT" }, - "node_modules/react-test-renderer": { - "version": "19.2.4", - "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-19.2.4.tgz", - "integrity": "sha512-Ttl5D7Rnmi6JGMUpri4UjB4BAN0FPs4yRDnu2XSsigCWOLm11o8GwRlVsh27ER+4WFqsGtrBuuv5zumUaRCmKw==", - "dev": true, - "license": "MIT", - "dependencies": { - "react-is": "^19.2.4", - "scheduler": "^0.27.0" - }, - "peerDependencies": { - "react": "^19.2.4" - } - }, - "node_modules/react-test-renderer/node_modules/react-is": { - "version": "19.2.4", - "resolved": "https://registry.npmjs.org/react-is/-/react-is-19.2.4.tgz", - "integrity": "sha512-W+EWGn2v0ApPKgKKCy/7s7WHXkboGcsrXE+2joLyVxkbyVQfO3MUEaUQDHoSmb8TFFrSKYa9mw64WZHNHSDzYA==", - "dev": true, - "license": "MIT" - }, "node_modules/read-package-json-fast": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/read-package-json-fast/-/read-package-json-fast-4.0.0.tgz", @@ -10074,13 +10028,6 @@ "node": ">=4" } }, - "node_modules/regenerator-runtime": { - "version": "0.14.1", - "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz", - "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==", - "dev": true, - "license": "MIT" - }, "node_modules/regexp.prototype.flags": { "version": "1.5.4", "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.4.tgz", @@ -11574,6 +11521,30 @@ "node": ">=14.17" } }, + "node_modules/typescript-eslint": { + "version": "8.55.0", + "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.55.0.tgz", + "integrity": "sha512-HE4wj+r5lmDVS9gdaN0/+iqNvPZwGfnJ5lZuz7s5vLlg9ODw0bIiiETaios9LvFI1U94/VBXGm3CB2Y5cNFMpw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/eslint-plugin": "8.55.0", + "@typescript-eslint/parser": "8.55.0", + "@typescript-eslint/typescript-estree": "8.55.0", + "@typescript-eslint/utils": "8.55.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <6.0.0" + } + }, "node_modules/uglify-js": { "version": "3.19.3", "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.19.3.tgz", diff --git a/package.json b/package.json index c09fb794b..d29f8dc2e 100644 --- a/package.json +++ b/package.json @@ -4,8 +4,7 @@ "description": "A React primitive for building slim progress bars.", "main": "dist/index.js", "module": "dist/react-nprogress.esm.js", - "jsnext:main": "dist/react-nprogress.esm.js", - "typings": "dist/index.d.ts", + "types": "dist/index.d.ts", "sideEffects": false, "files": [ "dist" @@ -71,13 +70,11 @@ "hoist-non-react-statics": "^3.3.2" }, "devDependencies": { - "@babel/core": "7.29.0", - "@babel/plugin-transform-runtime": "7.29.0", - "@babel/preset-env": "7.29.0", + "@babel/core": "^7.29.0", + "@babel/plugin-transform-runtime": "^7.29.0", + "@babel/preset-env": "^7.29.0", "@babel/preset-react": "7.28.5", "@babel/preset-typescript": "7.28.5", - "@eslint/compat": "2.0.2", - "@eslint/eslintrc": "3.3.3", "@eslint/js": "9.39.2", "@rollup/plugin-babel": "6.1.0", "@rollup/plugin-commonjs": "29.0.0", @@ -91,13 +88,12 @@ "@types/node": "24.10.13", "@types/react": "19.2.14", "@types/react-dom": "19.2.3", - "@typescript-eslint/eslint-plugin": "8.55.0", - "@typescript-eslint/parser": "8.55.0", "eslint": "9.39.2", "eslint-config-prettier": "10.1.8", "eslint-plugin-react": "7.37.5", "eslint-plugin-react-hooks": "7.0.1", "eslint-plugin-simple-import-sort": "12.1.1", + "globals": "^17.3.0", "jest": "30.2.0", "jest-environment-jsdom": "30.2.0", "mock-raf": "1.0.1", @@ -105,12 +101,11 @@ "prettier": "3.8.1", "react": "19.2.4", "react-dom": "19.2.4", - "react-test-renderer": "19.2.4", - "regenerator-runtime": "0.14.1", "rollup": "4.57.1", "shx": "0.4.0", "tanem-scripts": "8.0.2", "ts-jest": "29.4.6", - "typescript": "5.9.3" + "typescript": "5.9.3", + "typescript-eslint": "^8.55.0" } } diff --git a/rollup.config.mjs b/rollup.config.mjs index d3deccf26..a514f16de 100644 --- a/rollup.config.mjs +++ b/rollup.config.mjs @@ -47,7 +47,10 @@ const getBabelConfig = () => ({ exclude: 'node_modules/**', inputSourceMap: true, plugins: ['@babel/transform-runtime'], - presets: [['@babel/env', { loose: true, modules: false }], '@babel/react'], + presets: [ + ['@babel/env', { modules: false }], + ['@babel/react', { runtime: 'automatic' }], + ], }) const getPlugins = (bundleType) => [ @@ -68,10 +71,7 @@ const getPlugins = (bundleType) => [ keep_infinity: true, pure_getters: true, }, - ecma: 5, output: { comments: false }, - toplevel: false, - warnings: true, }), ] @@ -113,6 +113,7 @@ const getUmdConfig = (bundleType) => ({ globals: { react: 'React', 'react-dom': 'ReactDOM', + 'react/jsx-runtime': 'React', }, name: 'NProgress', sourcemap: true, diff --git a/src/NProgress.tsx b/src/NProgress.tsx index bde757d6c..5d7b2a8f9 100644 --- a/src/NProgress.tsx +++ b/src/NProgress.tsx @@ -1,16 +1,13 @@ -import * as React from 'react' +import type { FC, ReactElement } from 'react' -import { Options } from './types' +import type { Options } from './types' import { useNProgress } from './useNProgress' type Props = Options & { - children: (renderProps: ReturnType) => React.ReactElement + children: (renderProps: ReturnType) => ReactElement } -export const NProgress: React.FC = ({ - children, - ...restProps -}: Props) => { +export const NProgress: FC = ({ children, ...restProps }: Props) => { const renderProps = useNProgress(restProps) return children(renderProps) } diff --git a/src/env.d.ts b/src/env.d.ts index 75eb6b715..e69de29bb 100644 --- a/src/env.d.ts +++ b/src/env.d.ts @@ -1 +0,0 @@ -declare module 'react-lifecycles-compat' diff --git a/src/useNProgress.tsx b/src/useNProgress.tsx index 6cb95981f..744b197cf 100644 --- a/src/useNProgress.tsx +++ b/src/useNProgress.tsx @@ -4,7 +4,7 @@ import { clamp } from './clamp' import { createQueue } from './createQueue' import { createTimeout } from './createTimeout' import { increment } from './increment' -import { Options } from './types' +import type { Options } from './types' import { useEffectOnce } from './useEffectOnce' import { useGetSetState } from './useGetSetState' import { useUpdateEffect } from './useUpdateEffect' diff --git a/src/withNProgress.tsx b/src/withNProgress.tsx index aadc3f148..1fb0147e5 100644 --- a/src/withNProgress.tsx +++ b/src/withNProgress.tsx @@ -1,7 +1,7 @@ import hoistNonReactStatics from 'hoist-non-react-statics' -import * as React from 'react' +import type { ComponentType, FC } from 'react' -import { Options } from './types' +import type { Options } from './types' import { useNProgress } from './useNProgress' type Outer

= P & Options @@ -9,9 +9,9 @@ type Outer

= P & Options type Inner

= P & ReturnType export function withNProgress

( - BaseComponent: React.ComponentType>, -): React.FC> { - const WithNProgress: React.FC> = (props) => { + BaseComponent: ComponentType>, +): FC> { + const WithNProgress: FC> = (props) => { const hookProps = useNProgress(props) return } diff --git a/test/NProgress.spec.tsx b/test/NProgress.spec.tsx index 8550c4337..69cbf5a67 100644 --- a/test/NProgress.spec.tsx +++ b/test/NProgress.spec.tsx @@ -1,5 +1,4 @@ import { render } from '@testing-library/react' -import * as React from 'react' import { NProgress } from '../src' diff --git a/test/withNProgress.spec.tsx b/test/withNProgress.spec.tsx index 16965259b..dab733beb 100644 --- a/test/withNProgress.spec.tsx +++ b/test/withNProgress.spec.tsx @@ -1,5 +1,4 @@ import { render } from '@testing-library/react' -import * as React from 'react' import { withNProgress } from '../src' diff --git a/tsconfig.base.json b/tsconfig.base.json index 70dce7d10..c20b25e1f 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -1,10 +1,11 @@ { "compilerOptions": { - "allowSyntheticDefaultImports": true, "declaration": true, "declarationDir": "dist", "esModuleInterop": true, - "jsx": "react", + "forceConsistentCasingInFileNames": true, + "isolatedModules": true, + "jsx": "react-jsx", "module": "esnext", "moduleResolution": "node", "noFallthroughCasesInSwitch": true, @@ -12,6 +13,7 @@ "noUnusedLocals": true, "noUnusedParameters": true, "outDir": "compiled", + "skipLibCheck": true, "strict": true, "target": "esnext" },