From 749e00415bc6977ecaeb1d94664f82074e4db0d2 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 20:02:03 -0700 Subject: [PATCH 01/31] update eslint config --- examples/package-lock.json | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/examples/package-lock.json b/examples/package-lock.json index a08750948..20953feb7 100644 --- a/examples/package-lock.json +++ b/examples/package-lock.json @@ -30,6 +30,7 @@ "version": "5.5.1", "license": "MIT", "devDependencies": { + "@eslint/js": "^9.37.0", "@types/react": "^18.2.25", "@types/react-native": "^0.72.3", "@typescript-eslint/eslint-plugin": "^6.7.4", @@ -47,7 +48,8 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-native": "^4.1.0", "prettier": "3.0.3", - "typescript": "^5.2.2" + "typescript": "^5.2.2", + "typescript-eslint": "^8.46.0" }, "peerDependencies": { "react": "^18.2.0", From 3d9866af686a1704b4aa7d9dd120e3e038cfc963 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 21:06:22 -0700 Subject: [PATCH 02/31] refactor: modernize eslint config --- .eslintignore | 16 -- .eslintrc.yaml | 109 ------------ eslint.config.js | 109 ++++++++++++ examples/package-lock.json | 54 +++--- examples/package.json | 2 +- package-lock.json | 343 ++++++++++++++++++++++++++++++++++++- package.json | 21 ++- tsconfig.json | 3 +- 8 files changed, 487 insertions(+), 170 deletions(-) delete mode 100644 .eslintignore delete mode 100644 .eslintrc.yaml create mode 100644 eslint.config.js diff --git a/.eslintignore b/.eslintignore deleted file mode 100644 index 12f5d8e20..000000000 --- a/.eslintignore +++ /dev/null @@ -1,16 +0,0 @@ -# don't ever lint node_modules -node_modules -package-lock.json -# don't lint build output -build -dist -# don't lint coverage output -coverage -# don't lint workflows etc -.github -.idea -.vscode -# unsupported file types -*.yaml -*.yml -*.md \ No newline at end of file diff --git a/.eslintrc.yaml b/.eslintrc.yaml deleted file mode 100644 index 6386cc9af..000000000 --- a/.eslintrc.yaml +++ /dev/null @@ -1,109 +0,0 @@ ---- -# docs at: https://eslint.org/docs/latest/use/configure/configuration-files -env: - browser: true - es2021: true - react-native/react-native: true -extends: - - airbnb - - airbnb-typescript - - airbnb/hooks - - eslint:recommended - - plugin:@typescript-eslint/recommended - - plugin:@typescript-eslint/stylistic - - plugin:eslint-comments/recommended - - plugin:import/errors - - plugin:import/recommended - - plugin:import/typescript - - plugin:import/warnings - - plugin:jsdoc/recommended - - plugin:json/recommended - - plugin:jsx-a11y/recommended - - plugin:react-hooks/recommended - - plugin:react-native/all - - plugin:react/recommended - - prettier -globals: - JSX: true -parser: '@typescript-eslint/parser' -parserOptions: - ecmaFeatures: - jsx: true - ecmaVersion: latest - project: ./tsconfig.json - sourceType: module -plugins: - - '@typescript-eslint' - - eslint-comments - - eslint-plugin-json - - import - - jsdoc - - jsx-a11y - - react - - react-hooks - - react-native -rules: - '@typescript-eslint/array-type': - - error - - default: 'generic' - readonly: 'generic' - '@typescript-eslint/explicit-function-return-type': error - '@typescript-eslint/explicit-module-boundary-types': error - '@typescript-eslint/no-explicit-any': - - error - - fixToUnknown: false - ignoreRestArgs: false - '@typescript-eslint/no-shadow': error - '@typescript-eslint/no-use-before-define': error - camelcase: error - comma-dangle: - - error - - always-multiline - comma-style: - - error - - last - import/extensions: - - error - - never - import/no-unresolved: error - jsdoc/check-indentation: error - jsdoc/no-bad-blocks: error - jsdoc/require-description: error - jsdoc/require-file-overview: error - jsdoc/require-throws: error - jsx-quotes: - - error - - prefer-single - linebreak-style: - - error - - unix - max-lines: - - error - - 300 - max-lines-per-function: - - warn - - max: 20 - no-console: error - no-duplicate-imports: error - no-multi-spaces: error - no-shadow: error - no-template-curly-in-string: error - no-trailing-spaces: error - no-undef: error - no-use-before-define: warn - react-native/no-inline-styles: warn - react/jsx-filename-extension: - - error - - extensions: - - .ts - - .tsx - - .js - - .jsx - react/prop-types: error - sort-imports: warn - sort-keys: - - error - - asc - - caseSensitive: true - minKeys: 2 - natural: true diff --git a/eslint.config.js b/eslint.config.js new file mode 100644 index 000000000..409c7d736 --- /dev/null +++ b/eslint.config.js @@ -0,0 +1,109 @@ +// @ts-check + +import eslint from '@eslint/js'; +import tseslint from 'typescript-eslint'; +import react from 'eslint-plugin-react'; +import reactHooks from 'eslint-plugin-react-hooks'; +import reactNative from 'eslint-plugin-react-native'; +import jsxA11y from 'eslint-plugin-jsx-a11y'; +import eslintComments from 'eslint-plugin-eslint-comments'; +import json from 'eslint-plugin-json'; +import imprt from 'eslint-plugin-import'; +import prettier from 'eslint-config-prettier'; + +export default tseslint.config( + { + ignores: [ + 'node_modules', + 'package-lock.json', + 'build', + 'dist', + '*.expo', + 'coverage', + '.github', + '.idea', + '.vscode', + '*.yaml', + '*.yml', + '*.md', + ], + }, + eslint.configs.recommended, + ...tseslint.configs.recommended, + ...tseslint.configs.stylistic, + { + plugins: { + react, + 'react-hooks': reactHooks, + 'react-native': reactNative, + 'jsx-a11y': jsxA11y, + '@typescript-eslint': tseslint.plugin, + 'eslint-comments': eslintComments, + json, + import: imprt, + }, + languageOptions: { + parser: tseslint.parser, + parserOptions: { + ecmaFeatures: { + jsx: true, + }, + ecmaVersion: 'latest', + project: './tsconfig.json', + sourceType: 'module', + }, + globals: { + JSX: true, + require: true + }, + }, + rules: { + '@typescript-eslint/array-type': [ + 'error', + { + default: 'generic', + readonly: 'generic', + }, + ], + '@typescript-eslint/explicit-function-return-type': 'error', + '@typescript-eslint/explicit-module-boundary-types': 'error', + '@typescript-eslint/no-explicit-any': [ + 'error', + { + fixToUnknown: false, + ignoreRestArgs: false, + }, + ], + '@typescript-eslint/no-require-imports': 'off', // diabling until typescript rewrite + '@typescript-eslint/no-shadow': 'error', + '@typescript-eslint/no-use-before-define': 'error', + camelcase: 'error', + 'no-underscore-dangle': 'off', + 'comma-dangle': ['error', 'always-multiline'], + 'comma-style': ['error', 'last'], + 'import/extensions': ['error', 'never'], + 'import/no-unresolved': 'error', + 'jsx-quotes': ['error', 'prefer-single'], + 'linebreak-style': ['error', 'unix'], + 'max-lines': ['error', 300], + 'no-console': 'error', + 'no-duplicate-imports': 'error', + 'no-multi-spaces': 'error', + 'no-shadow': 'error', + 'no-template-curly-in-string': 'error', + 'no-trailing-spaces': 'error', + 'no-undef': 'error', + 'no-use-before-define': 'warn', + 'react-native/no-inline-styles': 'warn', + 'react/jsx-filename-extension': [ + 'error', + { + extensions: ['.ts', '.tsx', '.js', '.jsx'], + }, + ], + 'react/prop-types': 'off', // Disabling until typescript rewrite + 'sort-imports': 'warn', + }, + }, + prettier, +); \ No newline at end of file diff --git a/examples/package-lock.json b/examples/package-lock.json index 20953feb7..3225b06f6 100644 --- a/examples/package-lock.json +++ b/examples/package-lock.json @@ -8,7 +8,7 @@ "name": "examples", "version": "1.0.0", "dependencies": { - "expo": "54.0.12", + "expo": "54.0.13", "expo-status-bar": "~3.0.8", "react": "19.1.0", "react-dom": "19.1.0", @@ -38,24 +38,24 @@ "eslint": "^8.51.0", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^17.1.0", - "eslint-config-prettier": "^9.0.0", + "eslint-config-prettier": "^9.1.2", "eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsdoc": "^46.8.2", "eslint-plugin-json": "^3.1.0", - "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-jsx-a11y": "^6.10.2", "eslint-plugin-react": "7.33.2", - "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", "prettier": "3.0.3", "typescript": "^5.2.2", "typescript-eslint": "^8.46.0" }, "peerDependencies": { - "react": "^18.2.0", - "react-native": "^0.72.5", - "react-native-gesture-handler": "^2.18.0", - "react-native-safe-area-context": "^4.0.0" + "react": "*", + "react-native": "*", + "react-native-gesture-handler": "*", + "react-native-safe-area-context": "*" } }, "node_modules/@0no-co/graphql.web": { @@ -3976,13 +3976,13 @@ "license": "MIT" }, "node_modules/expo": { - "version": "54.0.12", - "resolved": "https://registry.npmjs.org/expo/-/expo-54.0.12.tgz", - "integrity": "sha512-BVvG1A9BlKAOBwczMi7XThOLzI3TUShkV/yRnAMGvQP5SQFDq7UojkZLLG285gg3OvkoqjMUE0tZvVXbvuI4tA==", + "version": "54.0.13", + "resolved": "https://registry.npmjs.org/expo/-/expo-54.0.13.tgz", + "integrity": "sha512-F1puKXzw8ESnsbvaKdXtcIiyYLQ2kUHqP8LuhgtJS1wm6w55VhtOPg8yl/0i8kPbTA0YfD+KYdXjSfhPXgUPxw==", "license": "MIT", "dependencies": { "@babel/runtime": "^7.20.0", - "@expo/cli": "54.0.10", + "@expo/cli": "54.0.11", "@expo/config": "~12.0.10", "@expo/config-plugins": "~54.0.2", "@expo/devtools": "0.1.7", @@ -3994,11 +3994,11 @@ "babel-preset-expo": "~54.0.3", "expo-asset": "~12.0.9", "expo-constants": "~18.0.9", - "expo-file-system": "~19.0.16", - "expo-font": "~14.0.8", + "expo-file-system": "~19.0.17", + "expo-font": "~14.0.9", "expo-keep-awake": "~15.0.7", - "expo-modules-autolinking": "3.0.14", - "expo-modules-core": "3.0.20", + "expo-modules-autolinking": "3.0.15", + "expo-modules-core": "3.0.21", "pretty-format": "^29.7.0", "react-refresh": "^0.14.2", "whatwg-url-without-unicode": "8.0.0-3" @@ -4091,9 +4091,9 @@ } }, "node_modules/expo-modules-autolinking": { - "version": "3.0.14", - "resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-3.0.14.tgz", - "integrity": "sha512-/qh1ru2kGPOycGvE9dXEKJZbPmYA5U5UcAlWWFbcq9+VhhWdZWZ0zs7V2JCdl+OvpBDo1y9WbqPP5VHQSYqT+Q==", + "version": "3.0.15", + "resolved": "https://registry.npmjs.org/expo-modules-autolinking/-/expo-modules-autolinking-3.0.15.tgz", + "integrity": "sha512-B6c+x664ImrWd+PknEy5454gtY6P0cMxj4P50fvLYP4HimbYj9SzwoHqZ/Rxh9NwxnUkT2nappk/USYIcPoS/A==", "license": "MIT", "dependencies": { "@expo/spawn-async": "^1.7.2", @@ -4108,9 +4108,9 @@ } }, "node_modules/expo-modules-core": { - "version": "3.0.20", - "resolved": "https://registry.npmjs.org/expo-modules-core/-/expo-modules-core-3.0.20.tgz", - "integrity": "sha512-AnC7VG8k8ZAAKoNFP5zyCiTlwppp6U3A/z63KtuSjMWlxn5w45FOf2LuyF1SNUqkiARdckuPVNvLGO/I/5vkrg==", + "version": "3.0.21", + "resolved": "https://registry.npmjs.org/expo-modules-core/-/expo-modules-core-3.0.21.tgz", + "integrity": "sha512-KJRzm0FEt/lfPNG+C6UUq+ta9PO10QPwY1HGCNkzPiRCIMJmQP4xRYK4Z7AxiYEYsPqr5OdjRW55kGZ4c5pzgA==", "license": "MIT", "dependencies": { "invariant": "^2.2.4" @@ -4143,9 +4143,9 @@ } }, "node_modules/expo/node_modules/@expo/cli": { - "version": "54.0.10", - "resolved": "https://registry.npmjs.org/@expo/cli/-/cli-54.0.10.tgz", - "integrity": "sha512-iw9gAnN6+PKWWLIyYmiskY/wzZjuFMctunqGXuC8BGATWgtr/HpzjVqWbcL3KIX/GvEBCCh74Tkckrh+Ylxh5Q==", + "version": "54.0.11", + "resolved": "https://registry.npmjs.org/@expo/cli/-/cli-54.0.11.tgz", + "integrity": "sha512-ik9p8+JTOuVXS462+vFPV0qnWRBXIR1bPmoVKO8xQWw6Yk+K6UlU2GrM2ch7kA3JlSJE/MGsNyN8CB0zFZbVbQ==", "license": "MIT", "dependencies": { "@0no-co/graphql.web": "^1.0.8", @@ -4162,7 +4162,7 @@ "@expo/osascript": "^2.3.7", "@expo/package-manager": "^1.9.8", "@expo/plist": "^0.4.7", - "@expo/prebuild-config": "^54.0.4", + "@expo/prebuild-config": "^54.0.5", "@expo/schema-utils": "^0.1.7", "@expo/spawn-async": "^1.7.2", "@expo/ws-tunnel": "^1.0.1", @@ -4181,7 +4181,7 @@ "connect": "^3.7.0", "debug": "^4.3.4", "env-editor": "^0.4.1", - "expo-server": "^1.0.0", + "expo-server": "^1.0.1", "freeport-async": "^2.0.0", "getenv": "^2.0.0", "glob": "^10.4.2", diff --git a/examples/package.json b/examples/package.json index 29fb18985..25304891b 100644 --- a/examples/package.json +++ b/examples/package.json @@ -10,7 +10,7 @@ "web": "expo start --web" }, "dependencies": { - "expo": "54.0.12", + "expo": "54.0.13", "expo-status-bar": "~3.0.8", "react": "19.1.0", "react-dom": "19.1.0", diff --git a/package-lock.json b/package-lock.json index a922487e8..538cd2f6a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -9,6 +9,7 @@ "version": "5.5.1", "license": "MIT", "devDependencies": { + "@eslint/js": "^9.37.0", "@types/react": "^18.2.25", "@types/react-native": "^0.72.3", "@typescript-eslint/eslint-plugin": "^6.7.4", @@ -16,17 +17,18 @@ "eslint": "^8.51.0", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^17.1.0", - "eslint-config-prettier": "^9.0.0", + "eslint-config-prettier": "^9.1.2", "eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsdoc": "^46.8.2", "eslint-plugin-json": "^3.1.0", - "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-jsx-a11y": "^6.10.2", "eslint-plugin-react": "7.33.2", - "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", "prettier": "3.0.3", - "typescript": "^5.2.2" + "typescript": "^5.2.2", + "typescript-eslint": "^8.46.0" }, "peerDependencies": { "react": "^18.2.0", @@ -2238,13 +2240,16 @@ } }, "node_modules/@eslint/js": { - "version": "8.57.1", - "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz", - "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==", + "version": "9.37.0", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-9.37.0.tgz", + "integrity": "sha512-jaS+NJ+hximswBG6pjNX0uEJZkrT0zwpVi3BA3vX22aFGjJjmgSTSmPpZCRKmoBL5VY/M6p0xsSJx7rk7sy5gg==", "dev": true, "license": "MIT", "engines": { - "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://eslint.org/donate" } }, "node_modules/@hapi/hoek": { @@ -3109,6 +3114,42 @@ } } }, + "node_modules/@typescript-eslint/project-service": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.46.0.tgz", + "integrity": "sha512-OEhec0mH+U5Je2NZOeK1AbVCdm0ChyapAyTeXVIYTPXDJ3F07+cu87PPXcGoYqZ7M9YJVvFnfpGg1UmCIqM+QQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/tsconfig-utils": "^8.46.0", + "@typescript-eslint/types": "^8.46.0", + "debug": "^4.3.4" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "typescript": ">=4.8.4 <6.0.0" + } + }, + "node_modules/@typescript-eslint/project-service/node_modules/@typescript-eslint/types": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.46.0.tgz", + "integrity": "sha512-bHGGJyVjSE4dJJIO5yyEWt/cHyNwga/zXGJbJJ8TiO01aVREK6gCTu3L+5wrkb1FbDkQ+TKjMNe9R/QQQP9+rA==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, "node_modules/@typescript-eslint/scope-manager": { "version": "6.21.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-6.21.0.tgz", @@ -3127,6 +3168,23 @@ "url": "https://opencollective.com/typescript-eslint" } }, + "node_modules/@typescript-eslint/tsconfig-utils": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.46.0.tgz", + "integrity": "sha512-WrYXKGAHY836/N7zoK/kzi6p8tXFhasHh8ocFL9VZSAkvH956gfeRfcnhs3xzRy8qQ/dq3q44v1jvQieMFg2cw==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "typescript": ">=4.8.4 <6.0.0" + } + }, "node_modules/@typescript-eslint/type-utils": { "version": "6.21.0", "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-6.21.0.tgz", @@ -5555,6 +5613,16 @@ "url": "https://opencollective.com/eslint" } }, + "node_modules/eslint/node_modules/@eslint/js": { + "version": "8.57.1", + "resolved": "https://registry.npmjs.org/@eslint/js/-/js-8.57.1.tgz", + "integrity": "sha512-d9zaMRSTIKDLhctzH12MtXvJKSSUhaHcjV+2Z+GK+EEY7XKpP5yR4x+N3TAcHTcu963nIr+TMcCb4DBCYX1z6Q==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^12.22.0 || ^14.17.0 || >=16.0.0" + } + }, "node_modules/eslint/node_modules/brace-expansion": { "version": "1.1.12", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.12.tgz", @@ -10954,6 +11022,265 @@ "node": ">=14.17" } }, + "node_modules/typescript-eslint": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.46.0.tgz", + "integrity": "sha512-6+ZrB6y2bT2DX3K+Qd9vn7OFOJR+xSLDj+Aw/N3zBwUt27uTw2sw2TE2+UcY1RiyBZkaGbTkVg9SSdPNUG6aUw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/eslint-plugin": "8.46.0", + "@typescript-eslint/parser": "8.46.0", + "@typescript-eslint/typescript-estree": "8.46.0", + "@typescript-eslint/utils": "8.46.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/typescript-eslint/node_modules/@typescript-eslint/eslint-plugin": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.46.0.tgz", + "integrity": "sha512-hA8gxBq4ukonVXPy0OKhiaUh/68D0E88GSmtC1iAEnGaieuDi38LhS7jdCHRLi6ErJBNDGCzvh5EnzdPwUc0DA==", + "dev": true, + "license": "MIT", + "dependencies": { + "@eslint-community/regexpp": "^4.10.0", + "@typescript-eslint/scope-manager": "8.46.0", + "@typescript-eslint/type-utils": "8.46.0", + "@typescript-eslint/utils": "8.46.0", + "@typescript-eslint/visitor-keys": "8.46.0", + "graphemer": "^1.4.0", + "ignore": "^7.0.0", + "natural-compare": "^1.4.0", + "ts-api-utils": "^2.1.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "@typescript-eslint/parser": "^8.46.0", + "eslint": "^8.57.0 || ^9.0.0", + "typescript": ">=4.8.4 <6.0.0" + } + }, + "node_modules/typescript-eslint/node_modules/@typescript-eslint/parser": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.46.0.tgz", + "integrity": "sha512-n1H6IcDhmmUEG7TNVSspGmiHHutt7iVKtZwRppD7e04wha5MrkV1h3pti9xQLcCMt6YWsncpoT0HMjkH1FNwWQ==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/scope-manager": "8.46.0", + "@typescript-eslint/types": "8.46.0", + "@typescript-eslint/typescript-estree": "8.46.0", + "@typescript-eslint/visitor-keys": "8.46.0", + "debug": "^4.3.4" + }, + "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/typescript-eslint/node_modules/@typescript-eslint/scope-manager": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.46.0.tgz", + "integrity": "sha512-lWETPa9XGcBes4jqAMYD9fW0j4n6hrPtTJwWDmtqgFO/4HF4jmdH/Q6wggTw5qIT5TXjKzbt7GsZUBnWoO3dqw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/types": "8.46.0", + "@typescript-eslint/visitor-keys": "8.46.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/typescript-eslint/node_modules/@typescript-eslint/type-utils": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.46.0.tgz", + "integrity": "sha512-hy+lvYV1lZpVs2jRaEYvgCblZxUoJiPyCemwbQZ+NGulWkQRy0HRPYAoef/CNSzaLt+MLvMptZsHXHlkEilaeg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/types": "8.46.0", + "@typescript-eslint/typescript-estree": "8.46.0", + "@typescript-eslint/utils": "8.46.0", + "debug": "^4.3.4", + "ts-api-utils": "^2.1.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/typescript-eslint/node_modules/@typescript-eslint/types": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.46.0.tgz", + "integrity": "sha512-bHGGJyVjSE4dJJIO5yyEWt/cHyNwga/zXGJbJJ8TiO01aVREK6gCTu3L+5wrkb1FbDkQ+TKjMNe9R/QQQP9+rA==", + "dev": true, + "license": "MIT", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/typescript-eslint/node_modules/@typescript-eslint/typescript-estree": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.46.0.tgz", + "integrity": "sha512-ekDCUfVpAKWJbRfm8T1YRrCot1KFxZn21oV76v5Fj4tr7ELyk84OS+ouvYdcDAwZL89WpEkEj2DKQ+qg//+ucg==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/project-service": "8.46.0", + "@typescript-eslint/tsconfig-utils": "8.46.0", + "@typescript-eslint/types": "8.46.0", + "@typescript-eslint/visitor-keys": "8.46.0", + "debug": "^4.3.4", + "fast-glob": "^3.3.2", + "is-glob": "^4.0.3", + "minimatch": "^9.0.4", + "semver": "^7.6.0", + "ts-api-utils": "^2.1.0" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + }, + "peerDependencies": { + "typescript": ">=4.8.4 <6.0.0" + } + }, + "node_modules/typescript-eslint/node_modules/@typescript-eslint/utils": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.46.0.tgz", + "integrity": "sha512-nD6yGWPj1xiOm4Gk0k6hLSZz2XkNXhuYmyIrOWcHoPuAhjT9i5bAG+xbWPgFeNR8HPHHtpNKdYUXJl/D3x7f5g==", + "dev": true, + "license": "MIT", + "dependencies": { + "@eslint-community/eslint-utils": "^4.7.0", + "@typescript-eslint/scope-manager": "8.46.0", + "@typescript-eslint/types": "8.46.0", + "@typescript-eslint/typescript-estree": "8.46.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/typescript-eslint/node_modules/@typescript-eslint/visitor-keys": { + "version": "8.46.0", + "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.46.0.tgz", + "integrity": "sha512-FrvMpAK+hTbFy7vH5j1+tMYHMSKLE6RzluFJlkFNKD0p9YsUT75JlBSmr5so3QRzvMwU5/bIEdeNrxm8du8l3Q==", + "dev": true, + "license": "MIT", + "dependencies": { + "@typescript-eslint/types": "8.46.0", + "eslint-visitor-keys": "^4.2.1" + }, + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/typescript-eslint" + } + }, + "node_modules/typescript-eslint/node_modules/eslint-visitor-keys": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-4.2.1.tgz", + "integrity": "sha512-Uhdk5sfqcee/9H/rCOJikYz67o0a2Tw2hGRPOG2Y1R2dg7brRe1uG0yaNQDHu+TO/uQPF/5eCapvYSmHUjt7JQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": "^18.18.0 || ^20.9.0 || >=21.1.0" + }, + "funding": { + "url": "https://opencollective.com/eslint" + } + }, + "node_modules/typescript-eslint/node_modules/ignore": { + "version": "7.0.5", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz", + "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">= 4" + } + }, + "node_modules/typescript-eslint/node_modules/minimatch": { + "version": "9.0.5", + "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-9.0.5.tgz", + "integrity": "sha512-G6T0ZX48xgozx7587koeX9Ys2NYy6Gmv//P89sEte9V9whIapMNF4idKxnW2QtCcLiTWlb/wfCabAtAFWhhBow==", + "dev": true, + "license": "ISC", + "dependencies": { + "brace-expansion": "^2.0.1" + }, + "engines": { + "node": ">=16 || 14 >=14.17" + }, + "funding": { + "url": "https://github.com/sponsors/isaacs" + } + }, + "node_modules/typescript-eslint/node_modules/ts-api-utils": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.1.0.tgz", + "integrity": "sha512-CUgTZL1irw8u29bzrOD/nH85jqyc74D6SshFgujOIA7osm2Rz7dYH77agkx7H4FBNxDq7Cjf+IjaX/8zwFW+ZQ==", + "dev": true, + "license": "MIT", + "engines": { + "node": ">=18.12" + }, + "peerDependencies": { + "typescript": ">=4.8.4" + } + }, "node_modules/uglify-es": { "version": "3.3.10", "resolved": "https://registry.npmjs.org/uglify-es/-/uglify-es-3.3.10.tgz", diff --git a/package.json b/package.json index 34ce5a917..6a08b8b23 100644 --- a/package.json +++ b/package.json @@ -2,6 +2,9 @@ "name": "react-native-dropdown-picker", "version": "5.5.1", "description": "A single / multiple, categorizable, customizable, localizable and searchable item picker (drop-down) component for react native which supports both Android & iOS.", + "scripts": { + "lint": "eslint ." + }, "keywords": [ "picker", "dropdown", @@ -44,6 +47,7 @@ "main": "index.js", "types": "index.d.ts", "devDependencies": { + "@eslint/js": "^9.37.0", "@types/react": "^18.2.25", "@types/react-native": "^0.72.3", "@typescript-eslint/eslint-plugin": "^6.7.4", @@ -51,22 +55,23 @@ "eslint": "^8.51.0", "eslint-config-airbnb": "^19.0.4", "eslint-config-airbnb-typescript": "^17.1.0", - "eslint-config-prettier": "^9.0.0", + "eslint-config-prettier": "^9.1.2", "eslint-plugin-eslint-comments": "^3.2.0", "eslint-plugin-import": "^2.28.1", "eslint-plugin-jsdoc": "^46.8.2", "eslint-plugin-json": "^3.1.0", - "eslint-plugin-jsx-a11y": "^6.7.1", + "eslint-plugin-jsx-a11y": "^6.10.2", "eslint-plugin-react": "7.33.2", - "eslint-plugin-react-hooks": "^4.6.0", + "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", "prettier": "3.0.3", - "typescript": "^5.2.2" + "typescript": "^5.2.2", + "typescript-eslint": "^8.46.0" }, "peerDependencies": { - "react": "^18.2.0", - "react-native": "^0.72.5", - "react-native-gesture-handler": "^2.18.0", - "react-native-safe-area-context": "^4.0.0" + "react": "*", + "react-native": "*", + "react-native-gesture-handler": "*", + "react-native-safe-area-context": "*" } } diff --git a/tsconfig.json b/tsconfig.json index 013d1f1eb..9fe0e0454 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -62,6 +62,7 @@ "exclude": [ /* Filenames or patterns that should be skipped when resolving include. */ "dist", - "node_modules" + "node_modules", + "eslint.config.js" ] } From 45529eecc60ceee5f3f26264e588d79515f196e6 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 21:45:58 -0700 Subject: [PATCH 03/31] update eslint config --- eslint.config.js | 6 ++---- examples/App.tsx | 6 +++--- examples/example-src-files/example.tsx | 12 ++++++------ index.d.ts | 2 +- package-lock.json | 8 ++++---- package.json | 3 ++- tsconfig.json | 3 +-- 7 files changed, 19 insertions(+), 21 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index 409c7d736..16935e69f 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -1,5 +1,3 @@ -// @ts-check - import eslint from '@eslint/js'; import tseslint from 'typescript-eslint'; import react from 'eslint-plugin-react'; @@ -65,8 +63,8 @@ export default tseslint.config( readonly: 'generic', }, ], - '@typescript-eslint/explicit-function-return-type': 'error', - '@typescript-eslint/explicit-module-boundary-types': 'error', + // '@typescript-eslint/explicit-function-return-type': 'error', + // '@typescript-eslint/explicit-module-boundary-types': 'error', '@typescript-eslint/no-explicit-any': [ 'error', { diff --git a/examples/App.tsx b/examples/App.tsx index b213fad08..0dee3c15a 100644 --- a/examples/App.tsx +++ b/examples/App.tsx @@ -1,9 +1,9 @@ import React, { JSX } from 'react'; -import { StyleSheet, View, FlatList, useColorScheme } from 'react-native'; -import { GestureHandlerRootView } from 'react-native-gesture-handler'; import DropDownPickerExample, { ExampleProps } from './example-src-files/example'; +import { FlatList, StyleSheet, View, useColorScheme } from 'react-native'; +import { GestureHandlerRootView } from 'react-native-gesture-handler'; -const EXAMPLES: ExampleProps[] = [{ +const EXAMPLES: Array = [{ title: "Default Example", description: "This is the default dropdown picker" },{ diff --git a/examples/example-src-files/example.tsx b/examples/example-src-files/example.tsx index a5a4a313d..eed6a284a 100644 --- a/examples/example-src-files/example.tsx +++ b/examples/example-src-files/example.tsx @@ -1,17 +1,17 @@ -import React, { useState, JSX } from 'react'; -import { StyleSheet, Button, Text, View, useColorScheme } from 'react-native'; -import DropDownPicker, { ItemType,DropDownPickerProps } from 'react-native-dropdown-picker'; +import React, { JSX, useState } from 'react'; +import { Button, StyleSheet, Text, View, useColorScheme } from 'react-native'; +import DropDownPicker, { DropDownPickerProps,ItemType } from 'react-native-dropdown-picker'; -export type ExampleProps = { +export interface ExampleProps { multiple?: boolean; title: string; description?: string; placeholder?: string; multipleText?: string; // For the sake of keeping the examples simple for now - items?: ItemType[]; + items?: Array>; dropdownProps?: Partial>; -}; +} const DEFAULT_ITEMS = [ { label: 'Apple', value: 'apple' }, diff --git a/index.d.ts b/index.d.ts index c4faf8bc3..d1918f918 100644 --- a/index.d.ts +++ b/index.d.ts @@ -82,7 +82,7 @@ declare module 'react-native-dropdown-picker' { NOTHING_TO_SHOW: string; PLACEHOLDER: string; SEARCH_PLACEHOLDER: string; - SELECTED_ITEMS_COUNT_TEXT: string | { [key in number | 'n']: string }; + SELECTED_ITEMS_COUNT_TEXT: string | Record; } export type ThemeNameType = 'DEFAULT' | 'LIGHT' | 'DARK'; diff --git a/package-lock.json b/package-lock.json index 538cd2f6a..f87e6afe6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -31,10 +31,10 @@ "typescript-eslint": "^8.46.0" }, "peerDependencies": { - "react": "^18.2.0", - "react-native": "^0.72.5", - "react-native-gesture-handler": "^2.18.0", - "react-native-safe-area-context": "^4.0.0" + "react": "*", + "react-native": "*", + "react-native-gesture-handler": "*", + "react-native-safe-area-context": "*" } }, "node_modules/@babel/code-frame": { diff --git a/package.json b/package.json index 6a08b8b23..f7929b471 100644 --- a/package.json +++ b/package.json @@ -73,5 +73,6 @@ "react-native": "*", "react-native-gesture-handler": "*", "react-native-safe-area-context": "*" - } + }, + "type": "module" } diff --git a/tsconfig.json b/tsconfig.json index 9fe0e0454..013d1f1eb 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -62,7 +62,6 @@ "exclude": [ /* Filenames or patterns that should be skipped when resolving include. */ "dist", - "node_modules", - "eslint.config.js" + "node_modules" ] } From 706818f6388e5c3e5904d6fec02f8421cfaa9e01 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 23:10:28 -0700 Subject: [PATCH 04/31] add fix flag to eslint script --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index f7929b471..8d1005703 100644 --- a/package.json +++ b/package.json @@ -3,7 +3,7 @@ "version": "5.5.1", "description": "A single / multiple, categorizable, customizable, localizable and searchable item picker (drop-down) component for react native which supports both Android & iOS.", "scripts": { - "lint": "eslint ." + "lint": "eslint . --fix" }, "keywords": [ "picker", From a0391722e7d2e01240fd9f8f2656bef50497f986 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 23:23:59 -0700 Subject: [PATCH 05/31] update metro.config to ignore parent node_modules --- examples/metro.config.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/examples/metro.config.js b/examples/metro.config.js index 6288146c3..edd22e042 100644 --- a/examples/metro.config.js +++ b/examples/metro.config.js @@ -2,8 +2,12 @@ const { getDefaultConfig } = require('expo/metro-config'); // const exclusionList = require('metro-config/src/defaults/exclusionList'); const path = require('path'); +// Helper to safely embed a path in RegExp +const escapeRegExp = (s) => s.replace(/[|\\{}()[\]^$+*?.]/g, '\\$&'); + const projectRoot = __dirname; const workspaceRoot = path.resolve(__dirname, '..'); +const parentNodeModules = path.join(workspaceRoot, 'node_modules'); const config = getDefaultConfig(projectRoot); @@ -13,11 +17,12 @@ config.resolver = { ...config.resolver, nodeModulesPaths: [ path.join(projectRoot, 'node_modules'), - path.join(workspaceRoot, 'node_modules'), ], // Ignore common explosion points blockList: [ + new RegExp(`^${escapeRegExp(parentNodeModules)}[/\\\\].*`), + // avoid triply nested node_modules to resolve issue with using a local copy of the module /.*\/node_modules\/.*\/node_modules\/.*\/node_modules\/.*/, From f24a1375d8212fa6195c51bb2b6c7dd317acc449 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 23:32:29 -0700 Subject: [PATCH 06/31] ignore no-unresolved for eslint.config --- eslint.config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/eslint.config.js b/eslint.config.js index 16935e69f..d0d59543a 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -1,4 +1,5 @@ import eslint from '@eslint/js'; +// eslint-disable-next-line import/no-unresolved import tseslint from 'typescript-eslint'; import react from 'eslint-plugin-react'; import reactHooks from 'eslint-plugin-react-hooks'; From d1896b3c7a4efbcb06491ad8be5ff7c54f2b6b8a Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 23:53:06 -0700 Subject: [PATCH 07/31] replace eslint import sort plugin --- eslint.config.js | 21 ++++++++++++--------- package-lock.json | 11 +++++++++++ package.json | 1 + 3 files changed, 24 insertions(+), 9 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index d0d59543a..6cbdb101d 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -1,14 +1,15 @@ import eslint from '@eslint/js'; -// eslint-disable-next-line import/no-unresolved -import tseslint from 'typescript-eslint'; +import prettier from 'eslint-config-prettier'; +import eslintComments from 'eslint-plugin-eslint-comments'; +import imprt from 'eslint-plugin-import'; +import json from 'eslint-plugin-json'; +import jsxA11y from 'eslint-plugin-jsx-a11y'; import react from 'eslint-plugin-react'; import reactHooks from 'eslint-plugin-react-hooks'; import reactNative from 'eslint-plugin-react-native'; -import jsxA11y from 'eslint-plugin-jsx-a11y'; -import eslintComments from 'eslint-plugin-eslint-comments'; -import json from 'eslint-plugin-json'; -import imprt from 'eslint-plugin-import'; -import prettier from 'eslint-config-prettier'; +import simpleImportSort from 'eslint-plugin-simple-import-sort' +// eslint-disable-next-line import/no-unresolved +import tseslint from 'typescript-eslint'; export default tseslint.config( { @@ -40,6 +41,7 @@ export default tseslint.config( 'eslint-comments': eslintComments, json, import: imprt, + simpleImportSort }, languageOptions: { parser: tseslint.parser, @@ -53,7 +55,8 @@ export default tseslint.config( }, globals: { JSX: true, - require: true + require: true, + module: true }, }, rules: { @@ -100,8 +103,8 @@ export default tseslint.config( extensions: ['.ts', '.tsx', '.js', '.jsx'], }, ], + "simpleImportSort/imports": ["error"], 'react/prop-types': 'off', // Disabling until typescript rewrite - 'sort-imports': 'warn', }, }, prettier, diff --git a/package-lock.json b/package-lock.json index f87e6afe6..7d7234cf6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -26,6 +26,7 @@ "eslint-plugin-react": "7.33.2", "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", + "eslint-plugin-simple-import-sort": "^12.1.1", "prettier": "3.0.3", "typescript": "^5.2.2", "typescript-eslint": "^8.46.0" @@ -5583,6 +5584,16 @@ "semver": "bin/semver.js" } }, + "node_modules/eslint-plugin-simple-import-sort": { + "version": "12.1.1", + "resolved": "https://registry.npmjs.org/eslint-plugin-simple-import-sort/-/eslint-plugin-simple-import-sort-12.1.1.tgz", + "integrity": "sha512-6nuzu4xwQtE3332Uz0to+TxDQYRLTKRESSc2hefVT48Zc8JthmN23Gx9lnYhu0FtkRSL1oxny3kJ2aveVhmOVA==", + "dev": true, + "license": "MIT", + "peerDependencies": { + "eslint": ">=5.0.0" + } + }, "node_modules/eslint-scope": { "version": "7.2.2", "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-7.2.2.tgz", diff --git a/package.json b/package.json index 8d1005703..6ac00ac91 100644 --- a/package.json +++ b/package.json @@ -64,6 +64,7 @@ "eslint-plugin-react": "7.33.2", "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", + "eslint-plugin-simple-import-sort": "^12.1.1", "prettier": "3.0.3", "typescript": "^5.2.2", "typescript-eslint": "^8.46.0" From ce311516630a6de20292ec5c4f9de19526ce2b74 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sat, 11 Oct 2025 23:55:53 -0700 Subject: [PATCH 08/31] chore: run eslint --fix --- examples/App.tsx | 5 +++-- examples/example-src-files/example.tsx | 2 +- examples/package-lock.json | 1 + src/components/ListEmpty.js | 1 - src/components/Picker.js | 5 +---- src/components/RenderBadgeItem.js | 1 - src/components/RenderListItem.js | 1 - src/themes/dark/index.js | 1 + 8 files changed, 7 insertions(+), 10 deletions(-) diff --git a/examples/App.tsx b/examples/App.tsx index 0dee3c15a..0102a1461 100644 --- a/examples/App.tsx +++ b/examples/App.tsx @@ -1,8 +1,9 @@ import React, { JSX } from 'react'; -import DropDownPickerExample, { ExampleProps } from './example-src-files/example'; -import { FlatList, StyleSheet, View, useColorScheme } from 'react-native'; +import { FlatList, StyleSheet, useColorScheme,View } from 'react-native'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; +import DropDownPickerExample, { ExampleProps } from './example-src-files/example'; + const EXAMPLES: Array = [{ title: "Default Example", description: "This is the default dropdown picker" diff --git a/examples/example-src-files/example.tsx b/examples/example-src-files/example.tsx index eed6a284a..163a2b494 100644 --- a/examples/example-src-files/example.tsx +++ b/examples/example-src-files/example.tsx @@ -1,5 +1,5 @@ import React, { JSX, useState } from 'react'; -import { Button, StyleSheet, Text, View, useColorScheme } from 'react-native'; +import { Button, StyleSheet, Text, useColorScheme,View } from 'react-native'; import DropDownPicker, { DropDownPickerProps,ItemType } from 'react-native-dropdown-picker'; export interface ExampleProps { diff --git a/examples/package-lock.json b/examples/package-lock.json index 3225b06f6..18863a5da 100644 --- a/examples/package-lock.json +++ b/examples/package-lock.json @@ -47,6 +47,7 @@ "eslint-plugin-react": "7.33.2", "eslint-plugin-react-hooks": "^4.6.2", "eslint-plugin-react-native": "^4.1.0", + "eslint-plugin-simple-import-sort": "^12.1.1", "prettier": "3.0.3", "typescript": "^5.2.2", "typescript-eslint": "^8.46.0" diff --git a/src/components/ListEmpty.js b/src/components/ListEmpty.js index 675a47737..31ca3aa10 100644 --- a/src/components/ListEmpty.js +++ b/src/components/ListEmpty.js @@ -1,5 +1,4 @@ import React, { memo } from 'react'; - import { Text, View } from 'react-native'; function ListEmpty({ diff --git a/src/components/Picker.js b/src/components/Picker.js index d8a2371b8..3077803b7 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -8,7 +8,6 @@ import React, { useRef, useState, } from 'react'; - import { ActivityIndicator, BackHandler, @@ -23,11 +22,10 @@ import { TouchableOpacity, View, } from 'react-native'; - import { FlatList, ScrollView } from 'react-native-gesture-handler'; - // Import SafeAreaView from react-native-safe-area-context for better edge-to-edge support import { SafeAreaView as SafeAreaContextView } from 'react-native-safe-area-context'; + import { ASCII_CODE, BADGE_COLORS, @@ -43,7 +41,6 @@ import { SCHEMA, TRANSLATIONS, } from '../constants'; - import Colors from '../constants/colors'; import THEMES from '../themes'; import ListEmpty from './ListEmpty'; diff --git a/src/components/RenderBadgeItem.js b/src/components/RenderBadgeItem.js index b2d27b80e..b4939fc59 100644 --- a/src/components/RenderBadgeItem.js +++ b/src/components/RenderBadgeItem.js @@ -1,5 +1,4 @@ import React, { memo, useCallback, useMemo } from 'react'; - import { Text, TouchableOpacity, View } from 'react-native'; import { RTL_DIRECTION, RTL_STYLE } from '../constants'; diff --git a/src/components/RenderListItem.js b/src/components/RenderListItem.js index a8fad0a89..7a9759360 100644 --- a/src/components/RenderListItem.js +++ b/src/components/RenderListItem.js @@ -1,5 +1,4 @@ import React, { memo, useCallback, useMemo } from 'react'; - import { Text, TouchableOpacity } from 'react-native'; function RenderListItem({ diff --git a/src/themes/dark/index.js b/src/themes/dark/index.js index eda4171fa..e2a35e7ac 100644 --- a/src/themes/dark/index.js +++ b/src/themes/dark/index.js @@ -1,4 +1,5 @@ import { StyleSheet } from 'react-native'; + import Colors from '../../constants/colors'; export const ICONS = { From fb2cf53325c41fb99134cff447bc6db8cb17cad8 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:00:40 -0700 Subject: [PATCH 09/31] fix: eslint no-prototype-builtins --- index.js | 2 +- src/components/Picker.js | 4 ++-- src/constants/index.js | 4 ++-- 3 files changed, 5 insertions(+), 5 deletions(-) diff --git a/index.js b/index.js index e816ec175..5565a3279 100644 --- a/index.js +++ b/index.js @@ -33,7 +33,7 @@ Picker.addTranslation = (language, translation) => { }; Picker.modifyTranslation = (language, translation) => { - if (TRANSLATIONS.hasOwnProperty(language)) { + if (Object.prototype.hasOwnProperty.call(TRANSLATIONS,language)) { TRANSLATIONS[language] = { ...TRANSLATIONS[language], ...translation }; } }; diff --git a/src/components/Picker.js b/src/components/Picker.js index 3077803b7..87a7d2e55 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -446,7 +446,7 @@ function Picker({ if ( scrollViewRef.current && - itemPositionsRef.current.hasOwnProperty(value) + Object.prototype.hasOwnProperty.call(itemPositionsRef.current,value) ) { scrollViewRef.current?.scrollTo?.({ x: 0, @@ -593,7 +593,7 @@ function Picker({ * @returns {string} */ const _language = useMemo(() => { - if (TRANSLATIONS.hasOwnProperty(language)) return language; + if (Object.prototype.hasOwnProperty.call(TRANSLATIONS,language)) return language; return LANGUAGE.FALLBACK; }, [language]); diff --git a/src/constants/index.js b/src/constants/index.js index fe81ae577..25985a013 100644 --- a/src/constants/index.js +++ b/src/constants/index.js @@ -79,7 +79,7 @@ export const RTL_DIRECTION = (rtl, style) => { const newStyle = { ...style }; if (rtl && !I18nManager.isRTL) { - if (newStyle.hasOwnProperty('flexDirection')) { + if (Object.prototype.hasOwnProperty.call(newStyle, "flexDirection")) { newStyle.flexDirection = newStyle.flexDirection === 'row' ? 'row-reverse' : 'row'; } else { @@ -95,7 +95,7 @@ export const RTL_STYLE = (rtl, style) => { if (rtl && !I18nManager.isRTL) { Object.keys(style).map((key) => { - if (STYLE_DIRECTION_KEYS.hasOwnProperty(key)) { + if (Object.prototype.hasOwnProperty.call(STYLE_DIRECTION_KEYS, key)) { newStyle[STYLE_DIRECTION_KEYS[key]] = newStyle[key]; delete newStyle[key]; } else { From d6a8938edddbf6519c8763949436ad9569149ee2 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:07:46 -0700 Subject: [PATCH 10/31] add globals & remove camelcase error --- eslint.config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index 6cbdb101d..c4cbac1e7 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -56,7 +56,8 @@ export default tseslint.config( globals: { JSX: true, require: true, - module: true + module: true, + __dirname: true }, }, rules: { @@ -79,7 +80,6 @@ export default tseslint.config( '@typescript-eslint/no-require-imports': 'off', // diabling until typescript rewrite '@typescript-eslint/no-shadow': 'error', '@typescript-eslint/no-use-before-define': 'error', - camelcase: 'error', 'no-underscore-dangle': 'off', 'comma-dangle': ['error', 'always-multiline'], 'comma-style': ['error', 'last'], From 065247519cd18bfac519523612bb3b755471ac09 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:10:16 -0700 Subject: [PATCH 11/31] remove no-use-before-define rule --- eslint.config.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index c4cbac1e7..7eee0f2c3 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -79,7 +79,6 @@ export default tseslint.config( ], '@typescript-eslint/no-require-imports': 'off', // diabling until typescript rewrite '@typescript-eslint/no-shadow': 'error', - '@typescript-eslint/no-use-before-define': 'error', 'no-underscore-dangle': 'off', 'comma-dangle': ['error', 'always-multiline'], 'comma-style': ['error', 'last'], @@ -95,7 +94,6 @@ export default tseslint.config( 'no-template-curly-in-string': 'error', 'no-trailing-spaces': 'error', 'no-undef': 'error', - 'no-use-before-define': 'warn', 'react-native/no-inline-styles': 'warn', 'react/jsx-filename-extension': [ 'error', From 627613072105b33028c1c24e4573b14f389e7b8a Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:18:05 -0700 Subject: [PATCH 12/31] fix eslint errors --- examples/App.tsx | 4 ++-- src/components/Picker.js | 1 - 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/examples/App.tsx b/examples/App.tsx index 0102a1461..c5348d573 100644 --- a/examples/App.tsx +++ b/examples/App.tsx @@ -91,7 +91,7 @@ export default function App(): JSX.Element { ); return ( - + ( + CellRendererComponent={({ children }) => ( // Remove flatlsit view that wraps children for dropdown zIndex support <>{children} )} diff --git a/src/components/Picker.js b/src/components/Picker.js index 87a7d2e55..c47a4abcf 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -1,6 +1,5 @@ import React, { Fragment, - JSX, memo, useCallback, useEffect, From 3a1fc3b5d984f34249fdd325909bb8ccfc745064 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:19:15 -0700 Subject: [PATCH 13/31] remover max-lines rule --- eslint.config.js | 1 - 1 file changed, 1 deletion(-) diff --git a/eslint.config.js b/eslint.config.js index 7eee0f2c3..6c0357ad7 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -86,7 +86,6 @@ export default tseslint.config( 'import/no-unresolved': 'error', 'jsx-quotes': ['error', 'prefer-single'], 'linebreak-style': ['error', 'unix'], - 'max-lines': ['error', 300], 'no-console': 'error', 'no-duplicate-imports': 'error', 'no-multi-spaces': 'error', From 5a18d2309c88ad2a17709cc08c6c28048a46c2fb Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:19:33 -0700 Subject: [PATCH 14/31] fix eslint errors --- index.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/index.d.ts b/index.d.ts index d1918f918..f7ade5b80 100644 --- a/index.d.ts +++ b/index.d.ts @@ -18,6 +18,7 @@ declare module 'react-native-dropdown-picker' { TouchableOpacityProps, ViewProps, ViewStyle, + ImageStyle } from 'react-native'; export type ValueType = string | number | boolean; From 6d62baea982826f7ebe6c5fd69b8fd9326ef5bc4 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:30:35 -0700 Subject: [PATCH 15/31] remove no-empty-function rule --- eslint.config.js | 1 + 1 file changed, 1 insertion(+) diff --git a/eslint.config.js b/eslint.config.js index 6c0357ad7..41957fad1 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -79,6 +79,7 @@ export default tseslint.config( ], '@typescript-eslint/no-require-imports': 'off', // diabling until typescript rewrite '@typescript-eslint/no-shadow': 'error', + '@typescript-eslint/no-empty-function': 'off', // disabling due to lots of functions defaulting to empty 'no-underscore-dangle': 'off', 'comma-dangle': ['error', 'always-multiline'], 'comma-style': ['error', 'last'], From 538134b4ec07c6702b8f937676ebf0c556a131d0 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:36:39 -0700 Subject: [PATCH 16/31] chore: sort index imports --- index.d.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/index.d.ts b/index.d.ts index f7ade5b80..3a87f5e3f 100644 --- a/index.d.ts +++ b/index.d.ts @@ -8,6 +8,7 @@ declare module 'react-native-dropdown-picker' { } from 'react'; import { FlatListProps, + ImageStyle, LayoutChangeEvent, ModalProps, ScrollViewProps, @@ -17,9 +18,7 @@ declare module 'react-native-dropdown-picker' { TextStyle, TouchableOpacityProps, ViewProps, - ViewStyle, - ImageStyle - } from 'react-native'; + ViewStyle } from 'react-native'; export type ValueType = string | number | boolean; From 92a2a39f7672b8ddc96dc0a5b6769be5df971279 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:37:07 -0700 Subject: [PATCH 17/31] remove unused vars from default empty functions --- src/components/Picker.js | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index c47a4abcf..f3b3cb3c8 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -26,7 +26,6 @@ import { FlatList, ScrollView } from 'react-native-gesture-handler'; import { SafeAreaView as SafeAreaContextView } from 'react-native-safe-area-context'; import { - ASCII_CODE, BADGE_COLORS, BADGE_DOT_COLORS, DROPDOWN_DIRECTION, @@ -54,7 +53,7 @@ function Picker({ open, setOpen = () => {}, value = null, - setValue = (callback) => {}, + setValue = () => {}, activityIndicatorColor = Colors.GREY, ActivityIndicatorComponent = null, activityIndicatorSize = 30, @@ -126,14 +125,14 @@ function Picker({ mode = MODE.DEFAULT, multiple = false, multipleText = null, - onChangeSearchText = (text) => {}, - onChangeValue = (value) => {}, + onChangeSearchText = () => {}, + onChangeValue = () => {}, onClose = () => {}, - onDirectionChanged = (direction) => {}, - onLayout = (e) => {}, + onDirectionChanged = () => {}, + onLayout = () => {}, onOpen = () => {}, - onPress = (open) => {}, - onSelectItem = (item) => {}, + onPress = () => {}, + onSelectItem = () => {}, placeholder = null, placeholderStyle = {}, props = {}, From 7e99afc41979bc41c0328c52ce5adda1223434b0 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:37:45 -0700 Subject: [PATCH 18/31] disable eslint from example flatlist (keeping rule for module but not needed in example) --- examples/example-src-files/example.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/examples/example-src-files/example.tsx b/examples/example-src-files/example.tsx index 163a2b494..c3d7bbf7c 100644 --- a/examples/example-src-files/example.tsx +++ b/examples/example-src-files/example.tsx @@ -77,6 +77,7 @@ export default function DropDownPickerExample({ const [_items, setItems] = useState>>(items); return ( + // eslint-disable-next-line react-native/no-inline-styles {title} From ce0d8048eb5d7bb8d7ddcaccf7de4c0ed214bec3 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 00:56:40 -0700 Subject: [PATCH 19/31] disable no-unused-vars for caughtErrors --- eslint.config.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/eslint.config.js b/eslint.config.js index 41957fad1..6eb376b8c 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -79,7 +79,13 @@ export default tseslint.config( ], '@typescript-eslint/no-require-imports': 'off', // diabling until typescript rewrite '@typescript-eslint/no-shadow': 'error', - '@typescript-eslint/no-empty-function': 'off', // disabling due to lots of functions defaulting to empty + '@typescript-eslint/no-empty-function': 'off', // disabling due to lots of functions defaulting to empt@typescript-eslint/no-empty-functiony + '@typescript-eslint/no-unused-vars': [ + "error", + { + caughtErrors: "none" + } + ], 'no-underscore-dangle': 'off', 'comma-dangle': ['error', 'always-multiline'], 'comma-style': ['error', 'last'], From 9d4d237cd4872ae02798f2680830489d70b6aa48 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:00:42 -0700 Subject: [PATCH 20/31] add setTimeout to eslint globals --- eslint.config.js | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/eslint.config.js b/eslint.config.js index 6eb376b8c..4b6299a38 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -57,7 +57,8 @@ export default tseslint.config( JSX: true, require: true, module: true, - __dirname: true + __dirname: true, + setTimeout: true }, }, rules: { From 20bb7423c228bbb130dc68bf3794525c0e8216fd Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:08:23 -0700 Subject: [PATCH 21/31] fix already declared variable errors --- src/components/Picker.js | 44 ++++++++++++++++++++-------------------- 1 file changed, 22 insertions(+), 22 deletions(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index f3b3cb3c8..c8257905c 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -275,7 +275,7 @@ function Picker({ if (itemIndex === -1) { const item = items.find( - (item) => item[ITEM_SCHEMA.value] === currentValue, + (i) => i[ITEM_SCHEMA.value] === currentValue, ); if (item) { @@ -294,7 +294,7 @@ function Picker({ const state = []; if (value !== null) { - const item = items.find((item) => item[ITEM_SCHEMA.value] === value); + const item = items.find((i) => i[ITEM_SCHEMA.value] === value); if (item) { state.push(item); @@ -398,7 +398,7 @@ function Picker({ * @returns {object} */ const sortedItems = useMemo(() => { - const sortedItems = items.filter( + const _sortedItems = items.filter( (item) => item[ITEM_SCHEMA.parent] === undefined || item[ITEM_SCHEMA.parent] === null, @@ -410,18 +410,18 @@ function Picker({ ); children.forEach((child) => { - const index = sortedItems.findIndex( + const index = _sortedItems.findIndex( (item) => item[ITEM_SCHEMA.parent] === child[ITEM_SCHEMA.parent] || item[ITEM_SCHEMA.value] === child[ITEM_SCHEMA.parent], ); if (index > -1) { - sortedItems.splice(index + 1, 0, child); + _sortedItems.splice(index + 1, 0, child); } }); - return sortedItems; + return _sortedItems; }, [items, ITEM_SCHEMA]); /** @@ -438,22 +438,22 @@ function Picker({ ) return; - const value = isArray + const currentValue = isArray ? memoryRef.current.value[0] : memoryRef.current.value; if ( scrollViewRef.current && - Object.prototype.hasOwnProperty.call(itemPositionsRef.current,value) + Object.prototype.hasOwnProperty.call(itemPositionsRef.current,currentValue) ) { scrollViewRef.current?.scrollTo?.({ x: 0, - y: itemPositionsRef.current[value], + y: itemPositionsRef.current[currentValue], animated: true, }); } else { const index = sortedItems.findIndex( - (item) => item[ITEM_SCHEMA.value] === value, + (item) => item[ITEM_SCHEMA.value] === currentValue, ); if (index > -1) @@ -481,7 +481,7 @@ function Picker({ * @returns {object} */ const stickyHeaderIndices = useMemo(() => { - const stickyHeaderIndices = []; + const _stickyHeaderIndices = []; if (stickyHeader) { const parents = sortedItems.filter( (item) => @@ -492,10 +492,10 @@ function Picker({ const index = sortedItems.findIndex( (item) => item[ITEM_SCHEMA.value] === parent[ITEM_SCHEMA.value], ); - if (index > -1) stickyHeaderIndices.push(index); + if (index > -1) _stickyHeaderIndices.push(index); }); } - return stickyHeaderIndices; + return _stickyHeaderIndices; }, [stickyHeader, sortedItems]); /** @@ -727,10 +727,10 @@ function Picker({ ); const size = y + maxHeight + pickerHeight + bottomOffset; - const direction = size < WINDOW_HEIGHT ? 'top' : 'bottom'; + const currentDirection = size < WINDOW_HEIGHT ? 'top' : 'bottom'; - onDirectionChanged(direction); - setDirection(direction); + onDirectionChanged(currentDirection); + setDirection(currentDirection); } onPressToggle(); @@ -1230,11 +1230,11 @@ function Picker({ * @returns {JSX.Element} */ const ExtendableBadgeContainer = useCallback( - ({ selectedItems }) => { - if (selectedItems.length > 0) { + ({ badgeContainerSelectedItems }) => { + if (badgeContainerSelectedItems.length > 0) { return ( - {selectedItems.map((item, index) => ( + {badgeContainerSelectedItems.map((item, index) => ( <__renderBadge item={item} index={index} /> @@ -1258,7 +1258,7 @@ function Picker({ */ const BadgeBodyComponent = useMemo(() => { if (extendableBadgeContainer) { - return ; + return ; } return ( @@ -1672,9 +1672,9 @@ function Picker({ * @param {string|number|boolean} value * @param {number} y */ - const setItemPosition = useCallback((value, y) => { + const setItemPosition = useCallback((itemValue, y) => { if (autoScroll && listMode === LIST_MODE.SCROLLVIEW) - itemPositionsRef.current[value] = y; + itemPositionsRef.current[itemValue] = y; }, []); /** From 1a911c448980ad3e44f4e87f2cfa333f57c104dd Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:09:51 -0700 Subject: [PATCH 22/31] comment out onPressOpen which is not currently being used --- src/components/Picker.js | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/components/Picker.js b/src/components/Picker.js index c8257905c..85674c82b 100644 --- a/src/components/Picker.js +++ b/src/components/Picker.js @@ -371,12 +371,13 @@ function Picker({ }, [setOpen, onClose]); /** - * onPressClose. + * onPressOpen. + * todo: consider removing */ - const onPressOpen = useCallback(() => { - setOpen(true); - onOpen(); - }, [setOpen, onOpen]); + // const onPressOpen = useCallback(() => { + // setOpen(true); + // onOpen(); + // }, [setOpen, onOpen]); /** * onPressToggle. From ed0ea10fefceda5c1442fa4f60a382cb2f7abc13 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:12:24 -0700 Subject: [PATCH 23/31] eslint temporarily ignore no-self-assign rule --- src/constants/index.js | 2 ++ 1 file changed, 2 insertions(+) diff --git a/src/constants/index.js b/src/constants/index.js index 25985a013..6a5d691e4 100644 --- a/src/constants/index.js +++ b/src/constants/index.js @@ -99,6 +99,8 @@ export const RTL_STYLE = (rtl, style) => { newStyle[STYLE_DIRECTION_KEYS[key]] = newStyle[key]; delete newStyle[key]; } else { + // todo: consider removing the following. I don't think it is doing anything + // eslint-disable-next-line no-self-assign newStyle[key] = newStyle[key]; } }); From 4bf546c4cc1e588a2b9fb700c850134c6de187c4 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:19:29 -0700 Subject: [PATCH 24/31] temporary fix eslint import error --- examples/App.tsx | 2 ++ 1 file changed, 2 insertions(+) diff --git a/examples/App.tsx b/examples/App.tsx index c5348d573..48845698a 100644 --- a/examples/App.tsx +++ b/examples/App.tsx @@ -2,6 +2,8 @@ import React, { JSX } from 'react'; import { FlatList, StyleSheet, useColorScheme,View } from 'react-native'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; +// todo: resolve import with eslint compliance +// eslint-disable-next-line import/no-unresolved import DropDownPickerExample, { ExampleProps } from './example-src-files/example'; const EXAMPLES: Array = [{ From 4db679ed2620e67a1fbe0038f9f8e495a2739559 Mon Sep 17 00:00:00 2001 From: imdevan Date: Sun, 12 Oct 2025 01:21:14 -0700 Subject: [PATCH 25/31] chore: run prettier --- eslint.config.js | 20 +-- examples/App.tsx | 189 +++++++++++++------------ examples/example-src-files/example.tsx | 55 +++---- examples/metro.config.js | 6 +- index.d.ts | 3 +- index.js | 2 +- src/components/Picker.js | 39 +++-- src/constants/index.js | 2 +- src/themes/dark/index.js | 7 +- src/themes/light/index.js | 4 +- 10 files changed, 179 insertions(+), 148 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index 4b6299a38..0beeca5d9 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -7,7 +7,7 @@ import jsxA11y from 'eslint-plugin-jsx-a11y'; import react from 'eslint-plugin-react'; import reactHooks from 'eslint-plugin-react-hooks'; import reactNative from 'eslint-plugin-react-native'; -import simpleImportSort from 'eslint-plugin-simple-import-sort' +import simpleImportSort from 'eslint-plugin-simple-import-sort'; // eslint-disable-next-line import/no-unresolved import tseslint from 'typescript-eslint'; @@ -40,8 +40,8 @@ export default tseslint.config( '@typescript-eslint': tseslint.plugin, 'eslint-comments': eslintComments, json, - import: imprt, - simpleImportSort + 'import': imprt, + simpleImportSort, }, languageOptions: { parser: tseslint.parser, @@ -58,7 +58,7 @@ export default tseslint.config( require: true, module: true, __dirname: true, - setTimeout: true + setTimeout: true, }, }, rules: { @@ -82,10 +82,10 @@ export default tseslint.config( '@typescript-eslint/no-shadow': 'error', '@typescript-eslint/no-empty-function': 'off', // disabling due to lots of functions defaulting to empt@typescript-eslint/no-empty-functiony '@typescript-eslint/no-unused-vars': [ - "error", - { - caughtErrors: "none" - } + 'error', + { + caughtErrors: 'none', + }, ], 'no-underscore-dangle': 'off', 'comma-dangle': ['error', 'always-multiline'], @@ -108,9 +108,9 @@ export default tseslint.config( extensions: ['.ts', '.tsx', '.js', '.jsx'], }, ], - "simpleImportSort/imports": ["error"], + 'simpleImportSort/imports': ['error'], 'react/prop-types': 'off', // Disabling until typescript rewrite }, }, prettier, -); \ No newline at end of file +); diff --git a/examples/App.tsx b/examples/App.tsx index 48845698a..8ff312583 100644 --- a/examples/App.tsx +++ b/examples/App.tsx @@ -1,103 +1,118 @@ import React, { JSX } from 'react'; -import { FlatList, StyleSheet, useColorScheme,View } from 'react-native'; +import { FlatList, StyleSheet, useColorScheme, View } from 'react-native'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; // todo: resolve import with eslint compliance // eslint-disable-next-line import/no-unresolved -import DropDownPickerExample, { ExampleProps } from './example-src-files/example'; +import DropDownPickerExample, { + ExampleProps, +} from './example-src-files/example'; -const EXAMPLES: Array = [{ - title: "Default Example", - description: "This is the default dropdown picker" -},{ - title: "Multiple Select", - description: "Multiple select example", - multiple: true -},{ - title: "Multiple Select Badge Mode", - description: "Multiple select example - with badges", - multiple: true, - dropdownProps: {mode: "BADGE", showBadgeDot: false}, -},{ - title: "Multiple Select Badge Mode with Dots", - description: "Multiple select example - with badges and dots", - multiple: true, - dropdownProps: {mode: "BADGE", showBadgeDot: true}, -},{ - title: "Customized Multiple Select Badge Mode", - description: "Multiple select example - with badges", - multiple: true, - dropdownProps: { - mode: "BADGE", - showBadgeDot: false, - badgeDotStyle: {}, - badgeColors: '#d5c4a1', // Badge Colors currentlly overwites badgeStyle background color - placeholderStyle: {color: '#83a598'}, - badgeStyle: { - // background: '#d5c4a1', - borderColor: '#282828', - borderWidth: 2, - borderStyle: 'solid', - }, - badgeTextStyle: { - color: '#282828' - }, - style: { - backgroundColor: '#fbf1c7', - borderColor: '#b16286', - cursor: 'pointer' - }, - customItemContainerStyle: { - }, - listItemContainerStyle: { - backgroundColor: '#fbf1c7', - borderColor: '#b16286' +const EXAMPLES: Array = [ + { + title: 'Default Example', + description: 'This is the default dropdown picker', + }, + { + title: 'Multiple Select', + description: 'Multiple select example', + multiple: true, + }, + { + title: 'Multiple Select Badge Mode', + description: 'Multiple select example - with badges', + multiple: true, + dropdownProps: { mode: 'BADGE', showBadgeDot: false }, + }, + { + title: 'Multiple Select Badge Mode with Dots', + description: 'Multiple select example - with badges and dots', + multiple: true, + dropdownProps: { mode: 'BADGE', showBadgeDot: true }, + }, + { + title: 'Customized Multiple Select Badge Mode', + description: 'Multiple select example - with badges', + multiple: true, + dropdownProps: { + mode: 'BADGE', + showBadgeDot: false, + badgeDotStyle: {}, + badgeColors: '#d5c4a1', // Badge Colors currentlly overwites badgeStyle background color + placeholderStyle: { color: '#83a598' }, + badgeStyle: { + // background: '#d5c4a1', + borderColor: '#282828', + borderWidth: 2, + borderStyle: 'solid', + }, + badgeTextStyle: { + color: '#282828', + }, + style: { + backgroundColor: '#fbf1c7', + borderColor: '#b16286', + cursor: 'pointer', + }, + customItemContainerStyle: {}, + listItemContainerStyle: { + backgroundColor: '#fbf1c7', + borderColor: '#b16286', + }, + listItemLabelStyle: { + color: '#b16286', + }, }, - listItemLabelStyle: { - color: '#b16286' + }, + { + title: 'Autoscroll Example', + description: 'This is the default dropdown picker - with autoscroll', + dropdownProps: { autoScroll: true }, + }, + { + title: 'Searchable Example', + description: 'This is the default dropdown picker - with search', + dropdownProps: { searchable: true }, + }, + { + title: 'Multiple Search Example', + description: 'This is the default dropdown picker - with search', + multiple: true, + dropdownProps: { searchable: true }, + }, + { + title: 'Multiple Search Clear on Select Example', + description: 'This is the default dropdown picker - with search', + multiple: true, + dropdownProps: { + searchable: true, + clearSearchFieldOnSelect: true, + mode: 'BADGE', }, }, -},{ - title: "Autoscroll Example", - description: "This is the default dropdown picker - with autoscroll", - dropdownProps: {autoScroll: true}, -},{ - title: "Searchable Example", - description: "This is the default dropdown picker - with search", - dropdownProps: {searchable: true}, -},{ - title: "Multiple Search Example", - description: "This is the default dropdown picker - with search", - multiple: true, - dropdownProps: {searchable: true}, -},{ - title: "Multiple Search Clear on Select Example", - description: "This is the default dropdown picker - with search", - multiple: true, - dropdownProps: {searchable: true, clearSearchFieldOnSelect: true, mode: "BADGE"}, -},{ - title: "Modal Example", - description: "This is the default dropdown picker - with search", - multiple: true, - dropdownProps: {listMode: "MODAL"} -}] + { + title: 'Modal Example', + description: 'This is the default dropdown picker - with search', + multiple: true, + dropdownProps: { listMode: 'MODAL' }, + }, +]; export default function App(): JSX.Element { const colorScheme = useColorScheme(); const backgroundColor = colorScheme === 'dark' ? '#222' : '#fff'; - + const renderItem = ({ item }: { item: ExampleProps }) => ( - + ); return ( - + example.title} @@ -127,17 +142,17 @@ const styles = StyleSheet.create({ marginBottom: 64, padding: 3, maxWidth: 600, - minWidth: 400 + minWidth: 400, }, examplesContainer: { display: 'flex', flexDirection: 'column', justifyContent: 'flex-start', - gap: 32 + gap: 32, }, exampleCard: { - zIndex:0, + zIndex: 0, borderRadius: 8, - marginBottom: 48 - } + marginBottom: 48, + }, }); diff --git a/examples/example-src-files/example.tsx b/examples/example-src-files/example.tsx index c3d7bbf7c..06a6cec3a 100644 --- a/examples/example-src-files/example.tsx +++ b/examples/example-src-files/example.tsx @@ -1,6 +1,9 @@ import React, { JSX, useState } from 'react'; -import { Button, StyleSheet, Text, useColorScheme,View } from 'react-native'; -import DropDownPicker, { DropDownPickerProps,ItemType } from 'react-native-dropdown-picker'; +import { Button, StyleSheet, Text, useColorScheme, View } from 'react-native'; +import DropDownPicker, { + DropDownPickerProps, + ItemType, +} from 'react-native-dropdown-picker'; export interface ExampleProps { multiple?: boolean; @@ -36,7 +39,7 @@ const styles = StyleSheet.create({ }, description: { fontSize: 12, - marginBottom: 16 + marginBottom: 16, }, body: { fontSize: 12, @@ -49,8 +52,8 @@ const styles = StyleSheet.create({ gap: 16, }, dropdownContainer: { - zIndex: 1 - } + zIndex: 1, + }, }); /** @@ -59,30 +62,30 @@ const styles = StyleSheet.create({ * @param props.multiple */ export default function DropDownPickerExample({ - multiple = false, - title, - description, - dropdownProps, - placeholder = 'Choose a fruit', - multipleText='You have chosen {count} fruits.', - items = DEFAULT_ITEMS, + multiple = false, + title, + description, + dropdownProps, + placeholder = 'Choose a fruit', + multipleText = 'You have chosen {count} fruits.', + items = DEFAULT_ITEMS, }: ExampleProps): JSX.Element { const [open, setOpen] = useState(false); const [singleValue, setSingleValue] = useState(null); const [multiValue, setMultiValue] = useState | null>(null); const colorScheme = useColorScheme(); const color = colorScheme === 'dark' ? '#fff' : '#222'; - const theme = colorScheme === 'dark' ? 'DARK' : 'LIGHT'; - + const theme = colorScheme === 'dark' ? 'DARK' : 'LIGHT'; + const [_items, setItems] = useState>>(items); - + return ( // eslint-disable-next-line react-native/no-inline-styles - {title} + {title} {description && ( - {description} + {description} )} @@ -115,21 +118,19 @@ export default function DropDownPickerExample({ /> )} - - + + {multiple ? 'Fruits currently are: ' : 'Fruit currently is: '} - {multiple - ? JSON.stringify(multiValue) - : JSON.stringify(singleValue)} - + {multiple ? JSON.stringify(multiValue) : JSON.stringify(singleValue)} + -