mirror of
https://github.com/ant-design/ant-design.git
synced 2024-11-27 20:49:53 +08:00
feat(tour): tour support custom zIndex (#40982)
* feat: tour support custom zIndex * feat: update snapshots
This commit is contained in:
kiner-tang(文辉)
GitHub
parent
51c615dd42
commit
e7acb487f3
@ -11,7 +11,7 @@ exports[`Tour Primary 1`] = `
|
||||
</button>
|
||||
<div
|
||||
class="ant-tour ant-tour-placement-bottom"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1090;"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1001;"
|
||||
>
|
||||
<div
|
||||
class="ant-tour-arrow"
|
||||
@ -80,16 +80,10 @@ exports[`Tour Primary 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-mask"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 900; pointer-events: none;"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 1001; pointer-events: none;"
|
||||
>
|
||||
<svg
|
||||
style="width: 100%; height: 100%;"
|
||||
@ -159,6 +153,12 @@ exports[`Tour Primary 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
</body>
|
||||
`;
|
||||
|
||||
@ -209,7 +209,7 @@ exports[`Tour button props onClick 1`] = `
|
||||
exports[`Tour custom step pre btn & next btn className & style 1`] = `
|
||||
<div
|
||||
class="ant-tour ant-tour-placement-bottom"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1090;"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1001;"
|
||||
>
|
||||
<div
|
||||
class="ant-tour-content"
|
||||
@ -296,7 +296,7 @@ exports[`Tour single 1`] = `
|
||||
</button>
|
||||
<div
|
||||
class="ant-tour ant-tour-placement-bottom"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1090;"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1001;"
|
||||
>
|
||||
<div
|
||||
class="ant-tour-arrow"
|
||||
@ -365,16 +365,10 @@ exports[`Tour single 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-mask"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 900; pointer-events: none;"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 1001; pointer-events: none;"
|
||||
>
|
||||
<svg
|
||||
style="width: 100%; height: 100%;"
|
||||
@ -444,6 +438,12 @@ exports[`Tour single 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
</body>
|
||||
`;
|
||||
|
||||
@ -458,7 +458,7 @@ exports[`Tour step support Primary 1`] = `
|
||||
</button>
|
||||
<div
|
||||
class="ant-tour ant-tour-placement-bottom"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1090;"
|
||||
style="left: -1000vw; top: -1000vh; box-sizing: border-box; z-index: 1001;"
|
||||
>
|
||||
<div
|
||||
class="ant-tour-arrow"
|
||||
@ -545,16 +545,10 @@ exports[`Tour step support Primary 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-mask"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 900; pointer-events: none;"
|
||||
style="position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 1001; pointer-events: none;"
|
||||
>
|
||||
<svg
|
||||
style="width: 100%; height: 100%;"
|
||||
@ -624,6 +618,12 @@ exports[`Tour step support Primary 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div
|
||||
class="ant-tour-target-placeholder"
|
||||
style="left: -6px; top: -6px; width: 12px; height: 12px; position: fixed; pointer-events: none;"
|
||||
/>
|
||||
</div>
|
||||
</body>
|
||||
`;
|
||||
|
||||
|
||||
@ -40,6 +40,7 @@ Use when you want to guide users through a product.
|
||||
| current | What is the current step | `number` | - | |
|
||||
| scrollIntoViewOptions | support pass custom scrollIntoView options | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |
|
||||
| indicatorsRender | custom indicator | `(current: number, total: number) => ReactNode` | - | 5.2.0 |
|
||||
| zIndex | Tour's zIndex | number | 1001 | 5.3.0 |
|
||||
|
||||
### TourStep
|
||||
|
||||
|
||||
@ -42,6 +42,7 @@ demo:
|
||||
| current | 当前处于哪一步 | `number` | - | |
|
||||
| scrollIntoViewOptions | 是否支持当前元素滚动到视窗内，也可传入配置指定滚动视窗的相关参数 | `boolean \| ScrollIntoViewOptions` | `true` | 5.2.0 |
|
||||
| indicatorsRender | 自定义指示器 | `(current: number, total: number) => ReactNode` | - | 5.2.0 |
|
||||
| zIndex | Tour 的层级 | number | 1001 | 5.3.0 |
|
||||
|
||||
### TourStep 引导步骤卡片
|
||||
|
||||
|
||||
@ -114,7 +114,7 @@
|
||||
"@babel/runtime": "^7.18.3",
|
||||
"@ctrl/tinycolor": "^3.6.0",
|
||||
"@rc-component/mutate-observer": "^1.0.0",
|
||||
"@rc-component/tour": "~1.7.1",
|
||||
"@rc-component/tour": "~1.8.0",
|
||||
"@rc-component/trigger": "^1.3.6",
|
||||
"classnames": "^2.2.6",
|
||||
"copy-to-clipboard": "^3.2.0",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user