feat(tour): tour support custom scroll into view options (#39980)

* feat: support custom scrollIntoViewOptions

* feat: support custom scrollIntoViewOptions

* docs: update docs

* docs: update docs

* docs: update docs
This commit is contained in:
kiner-tang(文辉) 2023-01-03 21:37:22 +08:00 committed by GitHub
parent 532da4c77a
commit 508ea27328
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 5 additions and 1 deletions

View File

@ -36,6 +36,7 @@ Use when you want to guide users through a product.
| open | Open tour | `boolean` | - | | | open | Open tour | `boolean` | - | |
| onChange | Callback when the step changes. Current is the previous step | `(current: number) => void` | - | | | onChange | Callback when the step changes. Current is the previous step | `(current: number) => void` | - | |
| current | What is the current step | `number` | - | | | current | What is the current step | `number` | - | |
| scrollIntoViewOptions | support pass custom scrollIntoView options | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |
### TourStep ### TourStep
@ -52,3 +53,4 @@ Use when you want to guide users through a product.
| type | Type, affects the background color and text color | `default` `primary` | `default` | | | type | Type, affects the background color and text color | `default` `primary` | `default` | |
| nextButtonProps | Properties of the Next button | `{ children: ReactNode; onClick: Function }` | - | | | nextButtonProps | Properties of the Next button | `{ children: ReactNode; onClick: Function }` | - | |
| prevButtonProps | Properties of the previous button | `{ children: ReactNode; onClick: Function }` | - | | | prevButtonProps | Properties of the previous button | `{ children: ReactNode; onClick: Function }` | - | |
| scrollIntoViewOptions | support pass custom scrollIntoView options, the default follows the `scrollIntoViewOptions` property of Tour | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |

View File

@ -38,6 +38,7 @@ demo:
| open | 打开引导 | `boolean` | - | | | open | 打开引导 | `boolean` | - | |
| onChange | 步骤改变时的回调current 为当前前的步骤 | `(current: number) => void` | - | | | onChange | 步骤改变时的回调current 为当前前的步骤 | `(current: number) => void` | - | |
| current | 当前处于哪一步 | `number` | - | | | current | 当前处于哪一步 | `number` | - | |
| scrollIntoViewOptions | 是否支持当前元素滚动到视窗内,也可传入配置指定滚动视窗的相关参数 | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |
### TourStep 引导步骤卡片 ### TourStep 引导步骤卡片
@ -54,3 +55,4 @@ demo:
| type | 类型,影响底色与文字颜色 | `default` \| `primary` | `default` | | | type | 类型,影响底色与文字颜色 | `default` \| `primary` | `default` | |
| nextButtonProps | 下一步按钮的属性 | `{ children: ReactNode; onClick: Function }` | - | | | nextButtonProps | 下一步按钮的属性 | `{ children: ReactNode; onClick: Function }` | - | |
| prevButtonProps | 上一步按钮的属性 | `{ children: ReactNode; onClick: Function }` | - | | | prevButtonProps | 上一步按钮的属性 | `{ children: ReactNode; onClick: Function }` | - | |
| scrollIntoViewOptions | 是否支持当前元素滚动到视窗内,也可传入配置指定滚动视窗的相关参数,默认跟随 Tour 的 `scrollIntoViewOptions` 属性 | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |

View File

@ -113,7 +113,7 @@
"@ant-design/react-slick": "~1.0.0", "@ant-design/react-slick": "~1.0.0",
"@babel/runtime": "^7.18.3", "@babel/runtime": "^7.18.3",
"@ctrl/tinycolor": "^3.4.0", "@ctrl/tinycolor": "^3.4.0",
"@rc-component/tour": "~1.3.0", "@rc-component/tour": "~1.4.0",
"classnames": "^2.2.6", "classnames": "^2.2.6",
"copy-to-clipboard": "^3.2.0", "copy-to-clipboard": "^3.2.0",
"dayjs": "^1.11.1", "dayjs": "^1.11.1",