Skip to content

Commit 5898da7

Browse files
OriginRingOriginRing
authored
feat(module:popover): add nzPopoverOverlayClickable to disable click on mask (#8878)
1 parent 9ecbb29 commit 5898da7

File tree

8 files changed

+117
-30
lines changed

8 files changed

+117
-30
lines changed

‎components/popconfirm/doc/index.en-US.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -40,7 +40,7 @@ import { NzPopconfirmModule } from 'ng-zorro-antd/popconfirm';
4040
| `[nzPopconfirmBackdrop]` | whether or not the overlay should attach a backdrop | `boolean` | `false` |
4141

4242
| Param | Description | Type | Default value | Global Config |
43-
| ------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------------------- | ------------- | ------------- |
43+
| ------------------- |-------------------------------------------------------------------------------------------------------------------------------------------------------| -------------------------------------------------------------------- | ------------- | ------------- |
4444
| `[nzCancelText]` | Text of the Cancel button | `string` | `'Cancel'` | - |
4545
| `[nzOkText]` | Text of the Confirm button | `string` | `'Confirm'` | - |
4646
| `[nzOkType]` | Button `type` of the Confirm button | `'primary' \| 'ghost' \| 'dashed' \| 'danger' \| 'default'` | `'primary'` | - |

‎components/popover/demo/overlay.md

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
---
2+
order: 8
3+
title:
4+
zh-CN: 禁止通过蒙层关闭面板
5+
en-US: Disable closing popover through mask
6+
---
7+
8+
## zh-CN
9+
10+
在 `nzPopoverTrigger` 为 `'click'` 时，通过设置 `nzPopoverOverlayClickable` 为 `false` 禁止通过点击蒙层关闭面板。
11+
12+
## en-US
13+
14+
Set `nzPopoverOverlayClickable` to be `false` to disable closing popover by clicking the mask when `nzPopoverTrigger` is `'click'`.

‎components/popover/demo/overlay.ts

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
import { Component } from '@angular/core';
2+
3+
import { NzButtonModule } from 'ng-zorro-antd/button';
4+
import { NzPopoverModule } from 'ng-zorro-antd/popover';
5+
6+
@Component({
7+
selector: 'nz-demo-popover-overlay',
8+
imports: [NzButtonModule, NzPopoverModule],
9+
template: `
10+
<button
11+
nz-button
12+
nz-popover
13+
nzType="primary"
14+
nzPopoverTitle="Title"
15+
nzPopoverTrigger="click"
16+
[nzPopoverContent]="contentTemplate"
17+
[nzPopoverOverlayClickable]="false"
18+
[nzPopoverVisible]="visible"
19+
(nzPopoverVisibleChange)="visibleChange($event)"
20+
>Click me</button
21+
>
22+
<ng-template #contentTemplate>
23+
<button nz-button nzSize="small" nzType="primary" (click)="visibleChange(false)"> Close me </button>
24+
</ng-template>
25+
`
26+
})
27+
export class NzDemoPopoverOverlayComponent {
28+
visible = false;
29+
30+
visibleChange(value: boolean): void {
31+
this.visible = value;
32+
}
33+
}

‎components/popover/doc/index.en-US.md

+15-14
Original file line numberDiff line numberDiff line change
@@ -21,20 +21,21 @@ import { NzPopoverModule } from 'ng-zorro-antd/popover';
2121

2222
### [nz-popover]
2323

24-
| Param | Description | Type | Default value |
25-
| ------------------------------- | ---------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- |
26-
| `[nzPopoverArrowPointAtCenter]` | Arrow point at center of the origin | `boolean` | `false` |
27-
| `[nzPopoverTitle]` | Title of the popover | `string \| TemplateRef<void>` | - |
28-
| `[nzPopoverContent]` | Content of the popover | `string \| TemplateRef<void>` | - |
29-
| `[nzPopoverTrigger]` | Popover trigger mode. If set to `null` it would not be triggered | `'click' \| 'focus' \| 'hover' \| null` | `'hover'` |
30-
| `[nzPopoverPlacement]` | The position of the popover relative to the target | `'top' \| 'left' \| 'right' \| 'bottom' \| 'topLeft' \| 'topRight' \| 'bottomLeft' \| 'bottomRight' \| 'leftTop' \| 'leftBottom' \| 'rightTop' \| 'rightBottom' \| Array<string>` | `'top'` |
31-
| `[nzPopoverOrigin]` | Origin of the tooltip | `ElementRef` | - |
32-
| `[nzPopoverVisible]` | Show or hide popover | `boolean` | `false` |
33-
| `(nzPopoverVisibleChange)` | Callback of hide or show | `EventEmitter<boolean>` | - |
34-
| `[nzPopoverMouseEnterDelay]` | Delay in seconds, before popover is shown on mouse enter | `number` | `0.15` |
35-
| `[nzPopoverMouseLeaveDelay]` | Delay in seconds, before popover is hidden on mouse leave | `number` | `0.1` |
36-
| `[nzPopoverOverlayClassName]` | Class name of the popover card | `string` | - |
37-
| `[nzPopoverOverlayStyle]` | Style of the popover card | `object` | - |
24+
| Param | Description | Type | Default value |
25+
| ------------------------------- | ---------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- |
26+
| `[nzPopoverArrowPointAtCenter]` | Arrow point at center of the origin | `boolean` | `false` |
27+
| `[nzPopoverTitle]` | Title of the popover | `string \| TemplateRef<void>` | - |
28+
| `[nzPopoverContent]` | Content of the popover | `string \| TemplateRef<void>` | - |
29+
| `[nzPopoverTrigger]` | Popover trigger mode. If set to `null` it would not be triggered | `'click' \| 'focus' \| 'hover' \| null` | `'hover'` |
30+
| `[nzPopoverPlacement]` | The position of the popover relative to the target | `'top' \| 'left' \| 'right' \| 'bottom' \| 'topLeft' \| 'topRight' \| 'bottomLeft' \| 'bottomRight' \| 'leftTop' \| 'leftBottom' \| 'rightTop' \| 'rightBottom' \| Array<string>` | `'top'` |
31+
| `[nzPopoverOrigin]` | Origin of the tooltip | `ElementRef` | - |
32+
| `[nzPopoverVisible]` | Show or hide popover | `boolean` | `false` |
33+
| `(nzPopoverVisibleChange)` | Callback of hide or show | `EventEmitter<boolean>` | - |
34+
| `[nzPopoverMouseEnterDelay]` | Delay in seconds, before popover is shown on mouse enter | `number` | `0.15` |
35+
| `[nzPopoverMouseLeaveDelay]` | Delay in seconds, before popover is hidden on mouse leave | `number` | `0.1` |
36+
| `[nzPopoverOverlayClassName]` | Class name of the popover card | `string` | - |
37+
| `[nzPopoverOverlayStyle]` | Style of the popover card | `object` | - |
38+
| `[nzPopoverOverlayClickable]` | Click the mask to close the bubble box. Only the `click` trigger behavior is valid | `boolean` | `true` |
3839

3940
Consult [Tooltip's documentation](/components/tooltip/en#api) to find more APIs.
4041
| `[nzPopoverBackdrop]` | whether or not the overlay should attach a backdrop | `boolean` | `false` |

0 commit comments

Comments
 (0)