Merge branch 'master' into deps

alibaba · Jan 16, 2024 · f8b2406 · f8b2406
2 parents d19e495 + 34148f3
commit f8b2406
Show file tree

Hide file tree

Showing 24 changed files with 101 additions and 71 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -12,7 +12,6 @@ module.exports = {
     '@typescript-eslint/ban-ts-ignore': 'off',
     '@typescript-eslint/no-object-literal-type-assertion': 'off',
     '@typescript-eslint/no-parameter-properties': 'off',
-    'consistent-return': 'off',
     'import/no-useless-path-segments': 'off',
     'no-unused-expressions': 'off',
     'react-hooks/rules-of-hooks': 'error',

diff --git a/.github/workflows/node-ci.yml b/.github/workflows/node-ci.yml
@@ -15,8 +15,6 @@ jobs:
 
       - name: Install pnpm
         uses: pnpm/action-setup@v2.2.4
-        with:
-          version: 7
 
       - name: Use Node.js ${{ matrix.node-version }}
         uses: actions/setup-node@v3

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
@@ -16,8 +16,6 @@ jobs:
 
       - name: Install pnpm
         uses: pnpm/action-setup@v2.2.4
-        with:
-          version: 7
 
       - name: Get pnpm store directory
         id: pnpm-cache

diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020 ahooks
+Copyright (c) 2019-present ahooks
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/README.md b/README.md
@@ -79,7 +79,7 @@ Thanks to all the contributors:
 
 ## 👥 Discuss
 
-<img src="https://user-images.githubusercontent.com/60802048/201606568-9ce53e3f-2e1c-4dc3-869f-fb3cf6196904.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606896-31abd486-cc3e-4cc4-beea-1b244a4c5595.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606953-c33f3f52-eb91-42bc-8da7-1e941e823144.JPG" width="200" style='display:inline'/>
+<img src="https://github.com/alibaba/hooks/assets/49217418/ba636378-1dff-4754-bfe6-46923417cd3b" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/93a169ce-f9d1-4a66-a829-9f16e790ee28" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/d30d80c7-eb16-4522-acab-f2d48513464a" width="200" style='display:inline' />
 
 [1]: https://www.npmjs.com/package/ahooks
 [2]: https://npmjs.org/package/ahooks

diff --git a/README.zh-CN.md b/README.zh-CN.md
@@ -79,7 +79,7 @@ $ pnpm start
 
 ## 👥 交流讨论
 
-<img src="https://user-images.githubusercontent.com/12526493/163084546-ed7a18a8-f05b-484e-a32c-049a05c350fd.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/12526493/163084577-bab53c55-610e-4efe-96c7-eb0dd076c100.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/12526493/163084584-bfb789fe-b5f4-4cd6-b4a5-2444bd67c1a5.JPG" width="200" style='display:inline'/>
+<img src="https://github.com/alibaba/hooks/assets/49217418/ba636378-1dff-4754-bfe6-46923417cd3b" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/93a169ce-f9d1-4a66-a829-9f16e790ee28" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/d30d80c7-eb16-4522-acab-f2d48513464a" width="200" style='display:inline' />
 
 [1]: https://www.npmjs.com/package/ahooks
 [2]: https://npmjs.org/package/ahooks

diff --git a/config/config.ts b/config/config.ts
@@ -180,20 +180,27 @@ export default {
   scripts: [
     'https://s4.cnzz.com/z_stat.php?id=1278992092&web_id=1278992092',
     `
-  const insertVersion = function(){
+  const insertVersion = function() {
+    const logo = document.querySelector('.__dumi-default-navbar-logo');
+    if (!logo) return;
     const dom = document.createElement('span');
     dom.id = 'logo-version';
     dom.innerHTML = '${packages.version}';
-    const logo = document.querySelector('.__dumi-default-navbar-logo');
-    if(logo){
-      logo.parentNode.insertBefore(dom, logo.nextSibling);
-    }else{
-      setTimeout(()=>{
-        insertVersion();
-      }, 1000)
+    logo.parentNode.insertBefore(dom, logo.nextSibling);
+  };
+  const observer = new MutationObserver((mutationsList, observer) => {
+    for (const mutation of mutationsList) {
+      if (mutation.type === 'childList') {
+        const logoVersion = document.querySelector('#logo-version');
+        if (logoVersion) {
+          observer.disconnect();
+        } else {
+          insertVersion();
+        }
+      }
     }
-  }
-  insertVersion();
+  });
+  observer.observe(document.body, { childList: true, subtree: true });
   `,
   ],
 };
diff --git a/docs/index.en-US.md b/docs/index.en-US.md
@@ -73,7 +73,7 @@ Thanks to all the contributors:
 
 ## 👥 Discuss
 
-<img src="https://user-images.githubusercontent.com/60802048/201606568-9ce53e3f-2e1c-4dc3-869f-fb3cf6196904.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606896-31abd486-cc3e-4cc4-beea-1b244a4c5595.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606953-c33f3f52-eb91-42bc-8da7-1e941e823144.JPG" width="200" style='display:inline'/>
+<img src="https://github.com/alibaba/hooks/assets/49217418/ba636378-1dff-4754-bfe6-46923417cd3b" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/93a169ce-f9d1-4a66-a829-9f16e790ee28" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/d30d80c7-eb16-4522-acab-f2d48513464a" width="200" style='display:inline' />
 
 [1]: https://www.npmjs.com/package/ahooks
 [2]: https://npmjs.org/package/ahooks

diff --git a/docs/index.zh-CN.md b/docs/index.zh-CN.md
@@ -73,7 +73,7 @@ $ pnpm start
 
 ## 👥 交流讨论
 
-<img src="https://user-images.githubusercontent.com/60802048/201606568-9ce53e3f-2e1c-4dc3-869f-fb3cf6196904.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606896-31abd486-cc3e-4cc4-beea-1b244a4c5595.JPG" width="200" style='display:inline'/><img src="https://user-images.githubusercontent.com/60802048/201606953-c33f3f52-eb91-42bc-8da7-1e941e823144.JPG" width="200" style='display:inline'/>
+<img src="https://github.com/alibaba/hooks/assets/49217418/ba636378-1dff-4754-bfe6-46923417cd3b" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/93a169ce-f9d1-4a66-a829-9f16e790ee28" width="200" style='display:inline' /><img src="https://github.com/alibaba/hooks/assets/49217418/d30d80c7-eb16-4522-acab-f2d48513464a" width="200" style='display:inline' />
 
 [1]: https://www.npmjs.com/package/ahooks
 [2]: https://npmjs.org/package/ahooks

diff --git a/package.json b/package.json
@@ -1,6 +1,7 @@
 {
   "name": "ahooks",
   "private": true,
+  "packageManager": "pnpm@7.33.6",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/alibaba/hooks.git"

diff --git a/packages/hooks/src/useExternal/demo/demo2.tsx b/packages/hooks/src/useExternal/demo/demo2.tsx
@@ -19,7 +19,7 @@ export default () => {
       <p>
         Status: <b>{status}</b>
       </p>
-      <div className="bd-example">
+      <div className="bd-example" style={{ wordBreak: 'break-word' }}>
         <span className="badge badge-pill badge-primary">Primary</span>
         <span className="badge badge-pill badge-secondary">Secondary</span>
         <span className="badge badge-pill badge-success">Success</span>

diff --git a/packages/hooks/src/useInfiniteScroll/index.en-US.md b/packages/hooks/src/useInfiniteScroll/index.en-US.md
@@ -95,8 +95,8 @@ const {
 ### Result
 
 | Property      | Description                                                                                                                                       | Type                     |
-| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------ | ----------- |
-| data          | The data returned by the service, where the `list` attribute is the aggregated data                                                               | `TData` \                | `undefined` |
+| ------------- | ------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------ |
+| data          | The data returned by the service, where the `list` attribute is the aggregated data                                                               | `TData` \| `undefined`   |
 | loading       | Is the first request in progress                                                                                                                  | `boolean`                |
 | loadingMore   | Is more data request in progress                                                                                                                  | `boolean`                |
 | noMore        | Whether there is no more data, it will take effect after configuring `options.isNoMore`                                                           | `boolean`                |

diff --git a/packages/hooks/src/useInfiniteScroll/index.zh-CN.md b/packages/hooks/src/useInfiniteScroll/index.zh-CN.md
@@ -95,8 +95,8 @@ const {
 ### Result
 
 | 参数          | 说明                                                                       | 类型                     |
-| ------------- | -------------------------------------------------------------------------- | ------------------------ | ----------- |
-| data          | service 返回的数据，其中的 `list` 属性为聚合后数据                         | `TData` \                | `undefined` |
+| ------------- | -------------------------------------------------------------------------- | ------------------------ |
+| data          | service 返回的数据，其中的 `list` 属性为聚合后数据                         | `TData` \| `undefined`   |
 | loading       | 是否正在进行首次请求                                                       | `boolean`                |
 | loadingMore   | 是否正在进行更多数据请求                                                   | `boolean`                |
 | noMore        | 是否没有更多数据了，配置 `options.isNoMore` 后生效                         | `boolean`                |

diff --git a/packages/hooks/src/useLockFn/index.en-US.md b/packages/hooks/src/useLockFn/index.en-US.md
@@ -16,7 +16,7 @@ Add lock to an async function to prevent parallel executions.
 ## API
 
 ```typescript
-function useLockFn<P extends any[] = any[], V extends any = any>(
+function useLockFn<P extends any[] = any[], V = any>(
   fn: (...args: P) => Promise<V>
 ): fn: (...args: P) => Promise<V | undefined>;
 ```

diff --git a/packages/hooks/src/useLockFn/index.ts b/packages/hooks/src/useLockFn/index.ts
@@ -1,6 +1,6 @@
 import { useRef, useCallback } from 'react';
 
-function useLockFn<P extends any[] = any[], V extends any = any>(fn: (...args: P) => Promise<V>) {
+function useLockFn<P extends any[] = any[], V = any>(fn: (...args: P) => Promise<V>) {
   const lockRef = useRef(false);
 
   return useCallback(

diff --git a/packages/hooks/src/useLockFn/index.zh-CN.md b/packages/hooks/src/useLockFn/index.zh-CN.md
@@ -16,7 +16,7 @@ nav:
 ## API
 
 ```typescript
-function useLockFn<P extends any[] = any[], V extends any = any>(
+function useLockFn<P extends any[] = any[], V = any>(
   fn: (...args: P) => Promise<V>
 ): fn: (...args: P) => Promise<V | undefined>;
 ```

diff --git a/packages/hooks/src/useLongPress/index.ts b/packages/hooks/src/useLongPress/index.ts
@@ -87,7 +87,7 @@ function useLongPress(
 
       const onMove = (event: TouchEvent) => {
         if (timerRef.current && overThreshold(event)) {
-          clearInterval(timerRef.current);
+          clearTimeout(timerRef.current);
           timerRef.current = undefined;
         }
       };

diff --git a/packages/hooks/src/useRequest/doc/refreshDeps/demo/refreshDeps.tsx b/packages/hooks/src/useRequest/doc/refreshDeps/demo/refreshDeps.tsx
@@ -1,9 +1,18 @@
+/**
+ * title: Repeat last request
+ * desc: When the dependency array changes, use the previous parameters to make the request again.
+ *
+ * title.zh-CN: 重复上一次请求
+ * desc.zh-CN: 依赖数组变化时，使用上一次的参数重新发起请求。
+ */
+
 import React, { useState } from 'react';
 import Mock from 'mockjs';
+import { Space, Button } from 'antd';
 import { useRequest } from 'ahooks';
 
 function getUsername(id: number): Promise<string> {
-  console.log('use-request-refresh-deps-id', id);
+  console.log('getUsername id:', id);
 
   return new Promise((resolve) => {
     setTimeout(() => {
@@ -18,17 +27,11 @@ export default () => {
     refreshDeps: [userId],
   });
 
-  if (loading) {
-    return <div>loading...</div>;
-  }
-
   return (
-    <div>
-      <p>Username: {data}</p>
-      <button style={{ marginRight: '8px' }} onClick={() => setUserId(Math.random())}>
-        Use previous id to refresh
-      </button>
-      <button onClick={() => run(Math.random())}>Use latest id to refresh</button>
-    </div>
+    <Space direction="vertical">
+      <p>Username: {loading ? 'loading...' : data}</p>
+      <Button onClick={() => setUserId(Math.random())}>Use previous id to refresh</Button>
+      <Button onClick={() => run(Math.random())}>Use latest id to refresh</Button>
+    </Space>
   );
 };
diff --git a/packages/hooks/src/useRequest/doc/refreshDeps/demo/refreshDepsAction.tsx b/packages/hooks/src/useRequest/doc/refreshDeps/demo/refreshDepsAction.tsx
@@ -1,9 +1,19 @@
+/**
+ * title: Custom refresh
+ * desc: This example shows that when the dependency array changes, it checks the parameters' validity first and then makes a new request.
+ *
+ * title.zh-CN: 自定义刷新行为
+ * desc.zh-CN: 该示例展示了当依赖数组变化时，首先校验参数合法性，然后发起新的请求。
+ */
+
 import React, { useState } from 'react';
 import Mock from 'mockjs';
+import { isNumber } from 'lodash-es';
+import { Button, Space } from 'antd';
 import { useRequest } from 'ahooks';
 
 function getUsername(id: number): Promise<string> {
-  console.log('use-request-refresh-deps-id', id);
+  console.log('getUsername id:', id);
 
   return new Promise((resolve) => {
     setTimeout(() => {
@@ -16,20 +26,25 @@ export default () => {
   const [userId, setUserId] = useState<number>();
   const { data, loading, run } = useRequest((id: number) => getUsername(id), {
     refreshDeps: [userId],
-    refreshDepsAction: () => run(userId),
+    refreshDepsAction: () => {
+      if (!isNumber(userId)) {
+        console.log(
+          `parameter "userId" expected to be a number, but got ${typeof userId}.`,
+          userId,
+        );
+        return;
+      }
+      run(userId);
+    },
   });
 
-  if (loading) {
-    return <div>loading...</div>;
-  }
-
   return (
-    <div>
-      <p>Username: {data}</p>
-      <button style={{ marginRight: '8px' }} onClick={() => setUserId(Math.random())}>
-        Use latest id to refresh
-      </button>
-      <button onClick={() => run(Math.random())}>Use latest id to refresh</button>
-    </div>
+    <Space direction="vertical">
+      <p>Username: {loading ? 'loading...' : data}</p>
+      <Button onClick={() => setUserId(Math.random())}>
+        Use latest id to refresh (by `refreshDeps`)
+      </Button>
+      <Button onClick={() => run(Math.random())}>Use latest id to refresh (by `run`)</Button>
+    </Space>
   );
 };
diff --git a/packages/hooks/src/useRequest/doc/refreshDeps/refresyDeps.en-US.md b/packages/hooks/src/useRequest/doc/refreshDeps/refresyDeps.en-US.md
@@ -7,7 +7,7 @@ group:
 
 # RefreshDeps
 
-By setting `options.refreshDeps`, `useRequest` will run [refresh](https://ahooks.js.org/hooks/use-request/basic/#result) automatically when initialization and dependencies changes, achieving the effect of [Refresh (repeat the last request)](https://ahooks.js.org/hooks/use-request/basic/#refresh-repeat-the-last-request).
+By setting `options.refreshDeps`, `useRequest` will run [refresh](https://ahooks.js.org/hooks/use-request/basic/#result) automatically when dependencies change, achieving the effect of [Refresh (repeat the last request)](https://ahooks.js.org/hooks/use-request/basic/#refresh-repeat-the-last-request).
 
 ```tsx | pure
 const [userId, setUserId] = useState('1');
@@ -29,7 +29,7 @@ useEffect(() => {
 }, [userId]);
 ```
 
-### Refresh last request
+### Repeat last request
 
 <code src="./demo/refreshDeps.tsx" />
 
@@ -41,7 +41,11 @@ useEffect(() => {
 
 ### Options
 
-| Property          | Description                                                                                                                    | Type                   | Default |
-| ----------------- | ------------------------------------------------------------------------------------------------------------------------------ | ---------------------- | ------- |
-| refreshDeps       | When the content of the array changes, trigger refresh.                                                                        | `React.DependencyList` | `[]`    |
-| refreshDepsAction | Customize the request behavior for dependency refresh, this parameter is called after initialization and dependencies changes. | `() => void`           | -       |
+| Property          | Description                                                                                                   | Type                   | Default |
+| ----------------- | ------------------------------------------------------------------------------------------------------------- | ---------------------- | ------- |
+| refreshDeps       | When the content of the array changes, trigger refresh.                                                       | `React.DependencyList` | `[]`    |
+| refreshDepsAction | Customize the request behavior during dependency refresh; this parameter is invoked when dependencies change. | `() => void`           | -       |
+
+## Remark
+
+- If you set `options.manual = true`, both `refreshDeps` and `refreshDepsAction` are no longer effective, you need to trigger the request by `run/runAsync`.
diff --git a/packages/hooks/src/useRequest/doc/refreshDeps/refresyDeps.zh-CN.md b/packages/hooks/src/useRequest/doc/refreshDeps/refresyDeps.zh-CN.md
@@ -7,7 +7,7 @@ group:
 
 # 依赖刷新
 
-通过设置 `options.refreshDeps`，在初始化和依赖变化时， `useRequest` 会自动调用 [refresh](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#result) 方法，实现[刷新（重复上一次请求）](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#刷新重复上一次请求)的效果。
+通过设置 `options.refreshDeps`，在依赖变化时， `useRequest` 会自动调用 [refresh](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#result) 方法，实现[刷新（重复上一次请求）](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#刷新重复上一次请求)的效果。
 
 ```tsx | pure
 const [userId, setUserId] = useState('1');
@@ -29,7 +29,7 @@ useEffect(() => {
 }, [userId]);
 ```
 
-### 刷新上一次请求
+### 重复上一次请求
 
 <code src="./demo/refreshDeps.tsx" />
 
@@ -41,7 +41,11 @@ useEffect(() => {
 
 ### Options
 
-| 参数              | 说明                                                                | 类型         | 默认值 |
-| ----------------- | ------------------------------------------------------------------- | ------------ | ------ |
-| refreshDeps       | 依赖数组，当数组内容变化后，发起请求。同 `useEffect` 的第二个参数。 | `any[]`      | `[]`   |
-| refreshDepsAction | 自定义依赖刷新时的请求行为，该参数会在初始化和依赖变化后被调用。    | `() => void` | -      |
+| 参数              | 说明                                                                                                                                                       | 类型         | 默认值 |
+| ----------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------ | ------ |
+| refreshDeps       | 依赖数组。当数组内容变化后[刷新（重复上一次请求）](https://ahooks.js.org/zh-CN/hooks/use-request/basic/#刷新重复上一次请求)。同 `useEffect` 的第二个参数。 | `any[]`      | `[]`   |
+| refreshDepsAction | 自定义依赖数组变化时的请求行为。                                                                                                                           | `() => void` | -      |
+
+## 备注
+
+- 如果设置 `options.manual = true`，则 `refreshDeps`, `refreshDepsAction` 都不再生效，需要通过 `run/runAsync` 手动触发请求。
diff --git a/packages/hooks/tsconfig.json b/packages/hooks/tsconfig.json
@@ -3,6 +3,8 @@
   "compilerOptions": {
     "rootDir": "src",
     "outDir": "lib",
-    "composite": true
-  }
+    "composite": true,
+    "declaration": true
+  },
+  "include": ["src"]
 }
diff --git a/packages/use-url-state/tsconfig.json b/packages/use-url-state/tsconfig.json
@@ -2,5 +2,6 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "rootDir": "src"
-  }
+  },
+  "include": ["src"]
 }
diff --git a/tsconfig.json b/tsconfig.json
@@ -9,8 +9,6 @@
     "baseUrl": ".",
     "paths": {
       "@/*": ["src/*"],
-      "ahooks": ["./packages/hooks/src/index.ts"],
-      "ahooks/lib/*": ["./packages/hooks/src/*"],
       "@ahooksjs/use-url-state": ["./packages/use-url-state/src/index.ts"]
     },
     "allowSyntheticDefaultImports": true,