@rc-component/context
+
Part of the Ant Design ecosystem.
🔁 Performant React context selector utilities for rc-component packages.
---- +
+ 
+ 
+ 
+ 
+ 
Part of the Ant Design ecosystem.
🔁 Performant React context selector utilities for rc-component packages.
---- +
+
+
+
+
+
English | 简体中文
-[![NPM version][npm-image]][npm-url] [![build status][github-actions-image]][github-actions-url] [![Codecov][codecov-image]][codecov-url] [![node version][node-image]][node-url] [![npm download][download-image]][download-url] +## Highlights -[npm-image]: http://img.shields.io/npm/v/@rc-component/context.svg?style=flat-square -[npm-url]: http://npmjs.org/package/@rc-component/context -[github-actions-image]: https://github.com/react-component/context/workflows/CI/badge.svg -[github-actions-url]: https://github.com/react-component/context/actions -[codecov-image]: https://img.shields.io/codecov/c/github/react-component/context/master.svg?style=flat-square -[codecov-url]: https://app.codecov.io/gh/react-component/context -[node-image]: https://img.shields.io/badge/node.js-%3E=_0.10-green.svg?style=flat-square -[node-url]: http://nodejs.org/download/ -[download-image]: https://img.shields.io/npm/dm/@rc-component/context.svg?style=flat-square -[download-url]: https://npmjs.org/package/@rc-component/context +| Area | Support | +| ------- | ---------------------------------------------------------------------- | +| Purpose | Performant React context selector utilities for rc-component packages. | +| Package | `@rc-component/context` | +| Release | `@rc-component/np` / `rc-np` | -## Development +## Install +```bash +npm install @rc-component/context ``` + +## Usage + +```tsx | pure +import { createContext } from '@rc-component/context'; + +const [Provider, useContext] = createContext({ count: 0 }); + +export { Provider, useContext }; +``` + +## API + +| API | Description | +| ----------------------------- | -------------------------------------------------- | +| `createContext(defaultValue)` | Create a provider and selector-aware context hook. | + +## Development + +```bash npm install npm start +npm test +npm run lint +npm run tsc +npm run compile ``` + +The dumi site runs at `http://localhost:8000`. + +## Release + +```bash +npm run prepublishOnly +``` + +The release flow is handled by `@rc-component/np` through the `rc-np` command when the package uses the shared release flow. + +## License + +@rc-component/context is released under the [MIT](./LICENSE.md) license. diff --git a/README.zh-CN.md b/README.zh-CN.md new file mode 100644 index 0000000..2fc4b23 --- /dev/null +++ b/README.zh-CN.md @@ -0,0 +1,71 @@ + Ant Design 生态的一部分。
🔁 面向 rc-component 包的高性能 React Context 选择器工具。
+ +
+
+
+
+
+
English | 简体中文
+ +## 亮点 + +| 方向 | 支持 | +| ---- | ------------------------------------------------------- | +| 定位 | 面向 rc-component 包的高性能 React Context 选择器工具。 | +| 包名 | `@rc-component/context` | +| 发布 | `@rc-component/np` / `rc-np` | + +## 安装 + +```bash +npm install @rc-component/context +``` + +## 用法 + +```tsx | pure +import { createContext } from '@rc-component/context'; + +const [Provider, useContext] = createContext({ count: 0 }); + +export { Provider, useContext }; +``` + +## API + +| 名称 | 说明 | +| ----------------------------- | ------------------------------------------- | +| `createContext(defaultValue)` | 创建 Provider 与支持选择器的 context hook。 | + +## 本地开发 + +```bash +npm install +npm start +npm test +npm run lint +npm run tsc +npm run compile +``` + +本地 dumi 站点默认运行在 `http://localhost:8000`. + +## 发布 + +```bash +npm run prepublishOnly +``` + +发布流程通过 `@rc-component/np` 提供的 `rc-np` 命令处理。 + +## 许可证 + +@rc-component/context 基于 [MIT](./LICENSE.md) 协议发布。 diff --git a/eslint.config.mjs b/eslint.config.mjs new file mode 100644 index 0000000..40f08ec --- /dev/null +++ b/eslint.config.mjs @@ -0,0 +1,115 @@ +import js from '@eslint/js'; +import { defineConfig } from 'eslint/config'; +import { dirname } from 'node:path'; +import { fileURLToPath } from 'node:url'; +import prettier from 'eslint-config-prettier'; +import jest from 'eslint-plugin-jest'; +import react from 'eslint-plugin-react'; +import reactHooks from 'eslint-plugin-react-hooks'; +import globals from 'globals'; +import tseslint from 'typescript-eslint'; + +const tsconfigRootDir = dirname(fileURLToPath(import.meta.url)); + +export default defineConfig([ + { + plugins: { + '@typescript-eslint': tseslint.plugin, + }, + }, + { + linterOptions: { + reportUnusedDisableDirectives: 'warn', + }, + }, + { + ignores: [ + 'node_modules/', + 'coverage/', + 'es/', + 'lib/', + 'dist/', + 'docs-dist/', + '.docs-dist/', + '.dumi/', + '.doc/', + '.vercel/', + ], + }, + { + files: ['**/*.{js,jsx,ts,tsx}'], + extends: [ + js.configs.recommended, + react.configs.flat.recommended, + react.configs.flat['jsx-runtime'], + prettier, + ], + plugins: { + 'react-hooks': reactHooks, + }, + languageOptions: { + globals: { + ...globals.browser, + ...globals.node, + }, + }, + settings: { + react: { + version: 'detect', + }, + }, + rules: { + 'no-async-promise-executor': 'off', + 'no-empty-pattern': 'off', + 'no-irregular-whitespace': 'off', + 'no-prototype-builtins': 'off', + 'no-useless-escape': 'off', + 'no-extra-boolean-cast': 'off', + 'no-undef': 'off', + 'no-unused-vars': 'off', + 'react/no-find-dom-node': 'off', + 'react/display-name': 'off', + 'react/no-unknown-property': 'off', + 'react/prop-types': 'off', + 'react-hooks/exhaustive-deps': 'warn', + 'react-hooks/rules-of-hooks': 'error', + }, + }, + { + files: ['**/*.{ts,tsx}'], + extends: [...tseslint.configs.recommended], + rules: { + '@typescript-eslint/ban-ts-comment': 'off', + '@typescript-eslint/no-empty-object-type': 'off', + '@typescript-eslint/no-explicit-any': 'off', + '@typescript-eslint/no-unsafe-function-type': 'off', + '@typescript-eslint/no-unnecessary-type-constraint': 'off', + '@typescript-eslint/no-unused-vars': 'off', + }, + }, + { + files: ['src/**/*.{ts,tsx}'], + languageOptions: { + parserOptions: { + projectService: true, + tsconfigRootDir, + }, + }, + }, + { + files: ['tests/**/*.{js,jsx,ts,tsx}', '**/*.{test,spec}.{js,jsx,ts,tsx}'], + extends: [jest.configs['flat/recommended']], + rules: { + 'jest/no-disabled-tests': 'off', + 'jest/no-done-callback': 'off', + 'jest/no-identical-title': 'off', + 'jest/expect-expect': 'off', + 'jest/no-alias-methods': 'off', + 'jest/no-conditional-expect': 'off', + 'jest/no-export': 'off', + 'jest/no-standalone-expect': 'off', + 'jest/valid-expect': 'off', + 'jest/valid-title': 'off', + }, + }, +]); diff --git a/package.json b/package.json index ea119af..0c840c2 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "name": "@rc-component/context", "version": "2.0.2", - "description": "React way perf context selector", + "description": "🔁 Performant React context selector utilities for rc-component packages.", "keywords": [ "react", "react-component", @@ -28,7 +28,6 @@ "compile": "father build", "coverage": "father test --coverage", "lint": "eslint src/ docs/ --ext .tsx,.ts,.jsx,.js", - "now-build": "npm run build", "prepublishOnly": "npm run compile && rc-np", "start": "dumi dev", "test": "rc-test", @@ -38,25 +37,28 @@ "@rc-component/util": "^1.11.0" }, "devDependencies": { + "@eslint/js": "^9.39.4", "@rc-component/father-plugin": "^2.2.0", "@rc-component/np": "^1.0.4", - "@types/jest": "^29.5.0", - "@types/node": "^24.5.2", - "@types/react": "^18.0.0", - "@types/react-dom": "^18.0.0", - "@types/warning": "^3.0.0", - "@typescript-eslint/eslint-plugin": "^5.62.0", - "@typescript-eslint/parser": "^5.62.0", - "@umijs/fabric": "^4.0.0", - "dumi": "^2.0.15", - "eslint": "^8.54.0", - "eslint-plugin-jest": "^27.9.0", - "eslint-plugin-unicorn": "^52.0.0", - "father": "^4.0.0", - "rc-test": "^7.0.14", - "react": "^18.0.0", - "react-dom": "^18.0.0", - "typescript": "^5.0.2" + "@testing-library/react": "^16.3.2", + "@types/jest": "^30.0.0", + "@types/node": "^26.0.1", + "@types/react": "^19.2.17", + "@types/react-dom": "^19.2.3", + "@types/warning": "^3.0.4", + "dumi": "^2.4.38", + "eslint": "^9.39.4", + "eslint-config-prettier": "^10.1.8", + "eslint-plugin-jest": "^29.15.4", + "eslint-plugin-react": "^7.37.5", + "eslint-plugin-react-hooks": "^7.1.1", + "father": "^4.6.24", + "globals": "^17.7.0", + "rc-test": "^7.1.3", + "react": "^19.2.7", + "react-dom": "^19.2.7", + "typescript": "^6.0.3", + "typescript-eslint": "^8.62.1" }, "peerDependencies": { "react": ">=18.0.0", diff --git a/src/Immutable.tsx b/src/Immutable.tsx index 4a70674..f62f24e 100644 --- a/src/Immutable.tsx +++ b/src/Immutable.tsx @@ -94,10 +94,11 @@ export default function createImmutable() { })`; } - return React.memo( - refAble ? React.forwardRef(ImmutableComponent) : ImmutableComponent, - propsAreEqual, - ) as unknown as T; + const MemoComponent = refAble + ? React.forwardRef(ImmutableComponent) + : (ImmutableComponent as React.ComponentType