From e4d608274e0b56acf9b720cf519d757c660c125e Mon Sep 17 00:00:00 2001
From: originRing <48777107+OriginRing@users.noreply.github.com>
Date: Sat, 2 Dec 2023 09:56:23 +0800
Subject: [PATCH] fix(module:water-mark): nzWaterMark is a block element &&
 standalone (#8197)

fix: #8187
---
 components/water-mark/doc/index.en-US.md      | 7 ++++++-
 components/water-mark/doc/index.zh-CN.md      | 7 ++++++-
 components/water-mark/style/index.less        | 1 +
 components/water-mark/typings.ts              | 1 +
 components/water-mark/water-mark.component.ts | 4 +++-
 components/water-mark/water-mark.module.ts    | 4 +---
 6 files changed, 18 insertions(+), 6 deletions(-)

diff --git a/components/water-mark/doc/index.en-US.md b/components/water-mark/doc/index.en-US.md
index 893a00faad..174e9ccfb3 100644
--- a/components/water-mark/doc/index.en-US.md
+++ b/components/water-mark/doc/index.en-US.md
@@ -14,13 +14,18 @@ Add specific text or patterns to the page.
 - Use when the page needs to be watermarked to identify the copyright.
 - Suitable for preventing information theft.
 
+module:
 ```ts
 import { NzWaterMarkModule } from 'ng-zorro-antd/water-mark';
 ```
+standalone:
+```ts
+import { NzWaterMarkComponent } from 'ng-zorro-antd/water-mark';
+```
 
 ## API
 
-### nz-water-mark
+### nz-water-mark:standalone
 
 | Property    | Description                                                                                       | Type                 | Default                  |
 | ----------- | ------------------------------------------------------------------------------------------------- | -------------------- | ------------------------ |
diff --git a/components/water-mark/doc/index.zh-CN.md b/components/water-mark/doc/index.zh-CN.md
index 3484c77056..baea039f6d 100644
--- a/components/water-mark/doc/index.zh-CN.md
+++ b/components/water-mark/doc/index.zh-CN.md
@@ -15,13 +15,18 @@ cover: https://img.alicdn.com/imgextra/i3/O1CN0194FGAd1FlrwQShfR8_!!600000000052
 - 页面需要添加水印标识版权时使用。
 - 适用于防止信息盗用。
 
+module:
 ```ts
 import { NzWaterMarkModule } from 'ng-zorro-antd/water-mark';
 ```
+standalone:
+```ts
+import { NzWaterMarkComponent } from 'ng-zorro-antd/water-mark';
+```
 
 ## API
 
-### nz-water-mark
+### nz-water-mark:standalone
 
 | 参数        | 说明                                                        | 类型                 | 默认值                   |
 | ----------- | ----------------------------------------------------------- | -------------------- | ------------------------ |
diff --git a/components/water-mark/style/index.less b/components/water-mark/style/index.less
index 8440245a41..54764c9ef7 100644
--- a/components/water-mark/style/index.less
+++ b/components/water-mark/style/index.less
@@ -4,5 +4,6 @@
 @water-mark-prefix-cls: ~'@{ant-prefix}-water-mark';
 
 .@{water-mark-prefix-cls} {
+  display: block;
   position: relative;
 }
\ No newline at end of file
diff --git a/components/water-mark/typings.ts b/components/water-mark/typings.ts
index 0c196c2046..f0a16b0b62 100644
--- a/components/water-mark/typings.ts
+++ b/components/water-mark/typings.ts
@@ -21,6 +21,7 @@ export interface MarkStyleType {
   pointerEvents: string;
   backgroundRepeat: string;
   backgroundPosition?: string;
+  visibility: string;
 }
 
 export interface MarkStyleCanvasType extends MarkStyleType {
diff --git a/components/water-mark/water-mark.component.ts b/components/water-mark/water-mark.component.ts
index 4c2c3c956e..2ecfbf4917 100644
--- a/components/water-mark/water-mark.component.ts
+++ b/components/water-mark/water-mark.component.ts
@@ -30,6 +30,7 @@ const FontGap = 3;
 
 @Component({
   selector: 'nz-water-mark',
+  standalone: true,
   exportAs: 'NzWaterMark',
   changeDetection: ChangeDetectionStrategy.OnPush,
   template: ` <ng-content></ng-content> `,
@@ -120,7 +121,8 @@ export class NzWaterMarkComponent implements AfterViewInit, OnInit, OnChanges, O
       width: '100%',
       height: '100%',
       pointerEvents: 'none',
-      backgroundRepeat: 'repeat'
+      backgroundRepeat: 'repeat',
+      visibility: 'visible'
     };
 
     /** Calculate the style of the nzOffset */
diff --git a/components/water-mark/water-mark.module.ts b/components/water-mark/water-mark.module.ts
index 3fe8d0ade7..90c8269752 100644
--- a/components/water-mark/water-mark.module.ts
+++ b/components/water-mark/water-mark.module.ts
@@ -3,14 +3,12 @@
  * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
  */
 
-import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
 
 import { NzWaterMarkComponent } from './water-mark.component';
 
 @NgModule({
   exports: [NzWaterMarkComponent],
-  declarations: [NzWaterMarkComponent],
-  imports: [CommonModule]
+  imports: [NzWaterMarkComponent]
 })
 export class NzWaterMarkModule {}