refactor: upgrade project (#411)

* chore(deps): bump `father@4.1.3`

* chore(deps): add `@rc-component/father-plugin`

* chore: update config

* chore(deps): bump `@umijs/fabric@3.x`

* chore(deps): remove local eslint

ref: umijs/fabric#136

* chore: add eslint  eq @umijs/fabric

* chore: add rc-test remove coveralls

* ci: update config

* remove jest config

* remove deps

* test: update test

这里的用例遇到点问题，需要进一步确定

* chore:  lock version

* chore: update script

* update dumi@2.x

* ci: add site-deploy workflow

* docs: update

* remove unused

.dumirc.ts

@@ -0,0 +1,17 @@
+// more config: https://d.umijs.org/config
+import { defineConfig } from 'dumi';
+
+const basePath = process.env.GITHUB_ACTIONS ? '/util/' : '/';
+const publicPath = process.env.GITHUB_ACTIONS ? '/util/' : '/';
+
+export default defineConfig({
+  favicons: ['https://avatars0.githubusercontent.com/u/9441414?s=200&v=4'],
+  themeConfig: {
+    name: 'Util',
+    logo: 'https://avatars0.githubusercontent.com/u/9441414?s=200&v=4',
+  },
+  outputPath: '.doc',
+  exportStatic: {},
+  base: basePath,
+  publicPath,
+});

.eslintrc.js

@@ -1,11 +1,8 @@
-const config = {
+module.exports = {
   extends: [require.resolve('@umijs/fabric/dist/eslint')],
   rules: {
     'react/no-did-update-set-state': 0,
     'react/no-find-dom-node': 0,
     'import/no-extraneous-dependencies': 0,
-    'react/sort-comp': 0,
   },
 };
-
-module.exports = config;

.fatherrc.ts

@@ -0,0 +1,6 @@
+import { defineConfig } from 'father';
+
+export default defineConfig({
+  // Locked version only supports 1.0.0
+  plugins: ['@rc-component/father-plugin'],
+});

.github/workflows/react-component-ci.yml

@@ -46,6 +46,7 @@ jobs:
 
   lint:
     runs-on: ubuntu-latest
+    needs: setup
     steps:
       - name: checkout
         uses: actions/checkout@master
@@ -64,11 +65,10 @@ jobs:
 
       - name: lint
         run: npm run lint
-
-    needs: setup
 
   compile:
     runs-on: ubuntu-latest
+    needs: setup
     steps:
       - name: checkout
         uses: actions/checkout@master
@@ -87,11 +87,10 @@ jobs:
 
       - name: compile
         run: npm run compile
-
-    needs: setup
 
   coverage:
     runs-on: ubuntu-latest
+    needs: setup
     steps:
       - name: checkout
         uses: actions/checkout@master
@@ -109,6 +108,4 @@ jobs:
           key: node_modules-${{ hashFiles('**/package-temp-dir/package-lock.json') }}
 
       - name: coverage
-        run: npm test -- --coverage && bash <(curl -s https://codecov.io/bash)
-
-    needs: setup
+        run: npm run coverage && bash <(curl -s https://codecov.io/bash)

.github/workflows/site-deploy.yml

@@ -0,0 +1,39 @@
+name: Deploy website
+on:
+  push:
+    tags:
+      - '*'
+  workflow_dispatch:
+
+permissions:
+  contents: write
+
+jobs:
+  build-and-deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v3
+
+      - name: setup node
+        uses: actions/setup-node@v1
+        with:
+          node-version: 14
+
+      - name: create package-lock.json
+        run: npm i --package-lock-only --ignore-scripts
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: build Docs
+        run: npm run build
+
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./.doc
+          force_orphan: true
+          user_name: 'github-actions[bot]'
+          user_email: 'github-actions[bot]@users.noreply.github.com'

.gitignore

@@ -33,4 +33,8 @@ package-lock.json
 .umi
 .umi-production
 .umi-test
-.env.local
+.env.local
+
+.dumi/tmp
+.dumi/tmp-test
+.dumi/tmp-production

docs/demo/dynaymicCSS.md

@@ -1,2 +1,8 @@
-## dynaymicCSS
-<code src="../examples/dynaymicCSS.tsx">
+---
+title: dynaymicCSS
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/dynaymicCSS.tsx" iframe></code>

docs/demo/getScrollBarSize.md

@@ -1,2 +1,8 @@
-## getScrollBarSize
-<code src="../examples/getScrollBarSize.tsx">
+---
+title: getScrollBarSize
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/getScrollBarSize.tsx"></code>

docs/demo/portal.md

@@ -1,2 +1,8 @@
-## portal
-<code src="../examples/portal.tsx">
+---
+title: portal
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/portal.tsx"></code>

docs/demo/styleChecker.md

@@ -1,2 +1,8 @@
-## styleChecker
-<code src="../examples/styleChecker.tsx">
+---
+title: styleChecker
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/styleChecker.tsx"></code>

docs/demo/toArray.md

@@ -1,2 +1,8 @@
-## toArray
-<code src="../examples/toArray.tsx">
+---
+title: toArray
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/toArray.tsx"></code>

docs/examples/dynaymicCSS.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
-import { updateCSS, removeCSS } from '../../src/Dom/dynamicCSS';
-import type { Prepend } from '../../src/Dom/dynamicCSS';
+import { updateCSS, removeCSS } from 'rc-util/es/Dom/dynamicCSS';
+import type { Prepend } from 'rc-util/es/Dom/dynamicCSS';
 
 function injectStyle(id: number, prepend?: Prepend) {
   const randomColor = Math.floor(Math.random() * 16777215).toString(16);

docs/examples/getScrollBarSize.tsx

@@ -1,9 +1,7 @@
-/* eslint-disable react/no-danger */
-
 import React from 'react';
 import getScrollBarSize, {
   getTargetScrollBarSize,
-} from '../../src/getScrollBarSize';
+} from 'rc-util/es/getScrollBarSize';
 
 export default () => {
   const divRef = React.useRef<HTMLDivElement>();

docs/examples/portal.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import PortalWrapper from '../../src/PortalWrapper';
+import PortalWrapper from 'rc-util/es/PortalWrapper';
 
 export default () => {
   const divRef = React.useRef();

docs/examples/styleChecker.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { isStyleSupport } from '../../src/Dom/styleChecker';
+import { isStyleSupport } from 'rc-util/es/Dom/styleChecker';
 
 export default () => {
   const supportFlex = isStyleSupport('flex');

docs/examples/toArray.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import toArray, { type Option } from '../../src/Children/toArray';
+import toArray, { type Option } from 'rc-util/es/Children/toArray';
 
 const initialState = {
   'no-children': false,
@@ -25,14 +25,14 @@ const DemoBox = React.memo(({ children, name }: { children?: any, name: Action }
   return (
     <React.Fragment key={name}>
       <label style={{ display: 'inline-block', width: 180 }}>
-        <input type="checkbox" checked={show} onChange={e => setShow(prev => !prev)} />
+        <input type="checkbox" checked={show} onChange={() => setShow(prev => !prev)} />
         {name}
       </label>
       <label>
         <input
           type="checkbox"
           checked={keepEmpty}
-          onChange={e => setkeepEmpty(prev => !prev)}
+          onChange={() => setkeepEmpty(prev => !prev)}
           disabled={!show}
         />
         keepEmpty={keepEmpty ? 'true' : 'false'}

docs/index.md

@@ -0,0 +1,7 @@
+---
+hero:
+  title: rc-util
+  description: Common Utils For React Component
+---
+
+<embed src="../README.md"></embed>

package.json

@@ -21,35 +21,34 @@
   ],
   "scripts": {
     "compile": "father build",
-    "coverage": "father test --coverage && cat ./coverage/lcov.info | coveralls",
-    "docs:build": "dumi build",
+    "coverage": "npm test -- --coverage",
+    "build": "dumi build",
     "lint": "eslint src/ --ext .tsx,.ts & eslint tests/ --ext .js",
-    "now-build": "npm run docs:build",
     "prepublishOnly": "npm run compile && np --yolo --no-publish",
     "start": "dumi dev",
-    "test": "father test"
+    "test": "rc-test"
   },
   "dependencies": {
     "@babel/runtime": "^7.18.3",
     "react-is": "^16.12.0"
   },
   "devDependencies": {
-    "@testing-library/jest-dom": "^5.16.4",
+    "@rc-component/father-plugin": "1.0.0",
     "@testing-library/react": "^13.0.0",
     "@types/jest": "^25.2.3",
     "@types/react": "^18.0.0",
     "@types/react-dom": "^18.0.0",
     "@types/responselike": "^1.0.0",
     "@types/warning": "^3.0.0",
-    "@umijs/fabric": "^2.0.8",
-    "coveralls": "^3.1.0",
+    "@umijs/fabric": "^3.0.0",
     "create-react-class": "^15.6.3",
     "cross-env": "^7.0.2",
-    "dumi": "^1.1.4",
-    "eslint": "^6.6.0",
-    "father": "^2.29.9",
+    "dumi": "^2.1.3",
+    "eslint": "~7.32.0",
+    "father": "^4.1.3",
     "glob": "^7.1.6",
     "np": "^6.2.3",
+    "rc-test": "^7.0.14",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",
     "typescript": "^4.1.3"

tests/scrollLocker.test.ts

@@ -10,7 +10,7 @@ describe('ScrollLocker', () => {
   let scrollLocker: ScrollLocker;
 
   const effectStyle =
-    'overflow: hidden; overflow-x: hidden; overflow-y: hidden;';
+    'width: calc(100% - 20px); overflow: hidden; overflow-x: hidden; overflow-y: hidden;';
 
   // jsdom can not capture calc
   const initialStyle = '';

tests/switchScrollingEffect.test.ts

@@ -36,7 +36,7 @@ describe('switchScrollingEffect', () => {
 
     switchScrollingEffect();
 
-    expect(document.body.style.cssText).toBe('position: relative;');
+    expect(document.body.style.cssText).toBe('position: relative; width: calc(100% - 20px);');
     expect(document.body.className).toBe('ant-scrolling-effect');
 
     // when closed

tsconfig.json

@@ -6,6 +6,12 @@
     "jsx": "preserve",
     "declaration": true,
     "skipLibCheck": true,
-    "esModuleInterop": true
+    "esModuleInterop": true,
+    "paths": {
+      "@/*": ["src/*"],
+      "@@/*": ["src/.dumi/*"],
+      "rc-util": ["src/index.tsx"],
+      "rc-util/es/*": ["src/*"]
+    }
   }
 }