@ng-nest/ui 21.0.10 → 21.0.12

package/fesm2022/ng-nest-ui-watermark.mjs

@@ -0,0 +1,378 @@
+import * as i0 from '@angular/core';
+import { input, Component, signal, computed, ChangeDetectionStrategy, ViewEncapsulation, NgModule } from '@angular/core';
+import { XPropertyFunction, XToNumber, XToBoolean } from '@ng-nest/ui/core';
+
+/**
+ * Watermark
+ * @selector x-watermark
+ * @decorator component
+ */
+const XWatermarkPrefix = 'x-watermark';
+const X_WATERMARK_CONFIG_NAME = 'watermark';
+/**
+ * Watermark Property
+ */
+class XWatermarkProperty extends XPropertyFunction(X_WATERMARK_CONFIG_NAME) {
+    constructor() {
+        super(...arguments);
+        /**
+         * @zh_CN 水印内容
+         * @en_US Watermark content
+         * @example
+         *
+         * ```html
+         * <x-watermark content="NG-NEST"></x-watermark>
+         * ```
+         *
+         */
+        this.content = input('', ...(ngDevMode ? [{ debugName: "content" }] : []));
+        /**
+         * @zh_CN 水印宽度
+         * @en_US Watermark width
+         * @example
+         *
+         * ```html
+         * <x-watermark [width]="120"></x-watermark>
+         * ```
+         *
+         */
+        this.width = input(this.config?.width ?? 120, { ...(ngDevMode ? { debugName: "width" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 水印高度
+         * @en_US Watermark height
+         * @example
+         *
+         * ```html
+         * <x-watermark [height]="60"></x-watermark>
+         * ```
+         *
+         */
+        this.height = input(this.config?.height ?? 60, { ...(ngDevMode ? { debugName: "height" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 旋转角度
+         * @en_US Rotation angle
+         * @example
+         *
+         * ```html
+         * <x-watermark [rotate]="-22"></x-watermark>
+         * <x-watermark [rotate]="0"></x-watermark>
+         * ```
+         *
+         */
+        this.rotate = input(this.config?.rotate ?? -22, { ...(ngDevMode ? { debugName: "rotate" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 字体大小
+         * @en_US Font size
+         * @example
+         *
+         * ```html
+         * <x-watermark [fontSize]="14"></x-watermark>
+         * ```
+         *
+         */
+        this.fontSize = input(this.config?.fontSize ?? 14, { ...(ngDevMode ? { debugName: "fontSize" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 字体
+         * @en_US Font family
+         * @example
+         *
+         * ```html
+         * <x-watermark fontFamily="Varela Round"></x-watermark>
+         * ```
+         *
+         */
+        this.fontFamily = input(this.config?.fontFamily ?? 'Varela Round', ...(ngDevMode ? [{ debugName: "fontFamily" }] : []));
+        /**
+         * @zh_CN 字体颜色
+         * @en_US Font color
+         * @example
+         *
+         * ```html
+         * <x-watermark color="rgba(0, 0, 0, 0.12)"></x-watermark>
+         * ```
+         *
+         */
+        this.color = input(this.config?.color ?? 'rgba(0, 0, 0, 0.12)', ...(ngDevMode ? [{ debugName: "color" }] : []));
+        /**
+         * @zh_CN 层级
+         * @en_US Z-index
+         * @example
+         *
+         * ```html
+         * <x-watermark [zIndex]="9999"></x-watermark>
+         * ```
+         *
+         */
+        this.zIndex = input(this.config?.zIndex ?? 9999, { ...(ngDevMode ? { debugName: "zIndex" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 透明度
+         * @en_US Opacity
+         * @example
+         *
+         * ```html
+         * <x-watermark [alpha]="1"></x-watermark>
+         * <x-watermark [alpha]="0.5"></x-watermark>
+         * ```
+         *
+         */
+        this.alpha = input(this.config?.alpha ?? 1, { ...(ngDevMode ? { debugName: "alpha" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 水平间距
+         * @en_US Horizontal gap
+         * @example
+         *
+         * ```html
+         * <x-watermark [gapX]="100"></x-watermark>
+         * ```
+         *
+         */
+        this.gapX = input(this.config?.gapX ?? 100, { ...(ngDevMode ? { debugName: "gapX" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 垂直间距
+         * @en_US Vertical gap
+         * @example
+         *
+         * ```html
+         * <x-watermark [gapY]="100"></x-watermark>
+         * ```
+         *
+         */
+        this.gapY = input(this.config?.gapY ?? 100, { ...(ngDevMode ? { debugName: "gapY" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 水平偏移
+         * @en_US Horizontal offset
+         * @example
+         *
+         * ```html
+         * <x-watermark [offsetLeft]="0"></x-watermark>
+         * ```
+         *
+         */
+        this.offsetLeft = input(this.config?.offsetLeft ?? 0, { ...(ngDevMode ? { debugName: "offsetLeft" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 垂直偏移
+         * @en_US Vertical offset
+         * @example
+         *
+         * ```html
+         * <x-watermark [offsetTop]="0"></x-watermark>
+         * ```
+         *
+         */
+        this.offsetTop = input(this.config?.offsetTop ?? 0, { ...(ngDevMode ? { debugName: "offsetTop" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 是否交错显示
+         * @en_US Whether to stagger display
+         * @example
+         *
+         * ```html
+         * <x-watermark [striped]="true"></x-watermark>
+         * <x-watermark [striped]="false"></x-watermark>
+         * ```
+         *
+         */
+        this.striped = input(this.config?.striped ?? false, { ...(ngDevMode ? { debugName: "striped" } : {}), transform: XToBoolean });
+        /**
+         * @zh_CN 是否禁用
+         * @en_US Whether to disable
+         * @example
+         *
+         * ```html
+         * <x-watermark [disabled]="true"></x-watermark>
+         * <x-watermark [disabled]="false"></x-watermark>
+         * ```
+         *
+         */
+        this.disabled = input(this.config?.disabled ?? false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: XToBoolean });
+        /**
+         * @zh_CN 图片/图标 URL
+         * @en_US Image/icon URL
+         * @example
+         *
+         * ```html
+         * <x-watermark imageSrc="/assets/logo.png"></x-watermark>
+         * ```
+         *
+         */
+        this.imageSrc = input('', ...(ngDevMode ? [{ debugName: "imageSrc" }] : []));
+        /**
+         * @zh_CN 图片宽度
+         * @en_US Image width
+         * @example
+         *
+         * ```html
+         * <x-watermark [imageWidth]="40"></x-watermark>
+         * ```
+         *
+         */
+        this.imageWidth = input(0, { ...(ngDevMode ? { debugName: "imageWidth" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 图片高度
+         * @en_US Image height
+         * @example
+         *
+         * ```html
+         * <x-watermark [imageHeight]="40"></x-watermark>
+         * ```
+         *
+         */
+        this.imageHeight = input(0, { ...(ngDevMode ? { debugName: "imageHeight" } : {}), transform: XToNumber });
+        /**
+         * @zh_CN 图片相对文本的位置
+         * @en_US Image position relative to text
+         * @example
+         *
+         * ```html
+         * <x-watermark imagePosition="top"></x-watermark>
+         * <x-watermark imagePosition="center"></x-watermark>
+         * <x-watermark imagePosition="bottom"></x-watermark>
+         * ```
+         *
+         */
+        this.imagePosition = input('center', ...(ngDevMode ? [{ debugName: "imagePosition" }] : []));
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkProperty, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.1.1", type: XWatermarkProperty, isStandalone: true, selector: "x-watermark-property", inputs: { content: { classPropertyName: "content", publicName: "content", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, rotate: { classPropertyName: "rotate", publicName: "rotate", isSignal: true, isRequired: false, transformFunction: null }, fontSize: { classPropertyName: "fontSize", publicName: "fontSize", isSignal: true, isRequired: false, transformFunction: null }, fontFamily: { classPropertyName: "fontFamily", publicName: "fontFamily", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null }, alpha: { classPropertyName: "alpha", publicName: "alpha", isSignal: true, isRequired: false, transformFunction: null }, gapX: { classPropertyName: "gapX", publicName: "gapX", isSignal: true, isRequired: false, transformFunction: null }, gapY: { classPropertyName: "gapY", publicName: "gapY", isSignal: true, isRequired: false, transformFunction: null }, offsetLeft: { classPropertyName: "offsetLeft", publicName: "offsetLeft", isSignal: true, isRequired: false, transformFunction: null }, offsetTop: { classPropertyName: "offsetTop", publicName: "offsetTop", isSignal: true, isRequired: false, transformFunction: null }, striped: { classPropertyName: "striped", publicName: "striped", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, imageSrc: { classPropertyName: "imageSrc", publicName: "imageSrc", isSignal: true, isRequired: false, transformFunction: null }, imageWidth: { classPropertyName: "imageWidth", publicName: "imageWidth", isSignal: true, isRequired: false, transformFunction: null }, imageHeight: { classPropertyName: "imageHeight", publicName: "imageHeight", isSignal: true, isRequired: false, transformFunction: null }, imagePosition: { classPropertyName: "imagePosition", publicName: "imagePosition", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: '', isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkProperty, decorators: [{
+            type: Component,
+            args: [{ selector: `${XWatermarkPrefix}-property`, template: '' }]
+        }], propDecorators: { content: [{ type: i0.Input, args: [{ isSignal: true, alias: "content", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], rotate: [{ type: i0.Input, args: [{ isSignal: true, alias: "rotate", required: false }] }], fontSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontSize", required: false }] }], fontFamily: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontFamily", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], zIndex: [{ type: i0.Input, args: [{ isSignal: true, alias: "zIndex", required: false }] }], alpha: [{ type: i0.Input, args: [{ isSignal: true, alias: "alpha", required: false }] }], gapX: [{ type: i0.Input, args: [{ isSignal: true, alias: "gapX", required: false }] }], gapY: [{ type: i0.Input, args: [{ isSignal: true, alias: "gapY", required: false }] }], offsetLeft: [{ type: i0.Input, args: [{ isSignal: true, alias: "offsetLeft", required: false }] }], offsetTop: [{ type: i0.Input, args: [{ isSignal: true, alias: "offsetTop", required: false }] }], striped: [{ type: i0.Input, args: [{ isSignal: true, alias: "striped", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], imageSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageSrc", required: false }] }], imageWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageWidth", required: false }] }], imageHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "imageHeight", required: false }] }], imagePosition: [{ type: i0.Input, args: [{ isSignal: true, alias: "imagePosition", required: false }] }] } });
+
+class XWatermarkComponent extends XWatermarkProperty {
+    constructor() {
+        super();
+        this.backgroundImage = signal('', ...(ngDevMode ? [{ debugName: "backgroundImage" }] : []));
+        this.font = computed(() => {
+            return `${this.fontSize()}px ${this.fontFamily()}`;
+        }, ...(ngDevMode ? [{ debugName: "font" }] : []));
+        this.textWidth = computed(() => {
+            const canvas = document.createElement('canvas');
+            const ctx = canvas.getContext('2d');
+            if (ctx) {
+                ctx.font = this.font();
+                return ctx.measureText(this.content()).width;
+            }
+            return this.width();
+        }, ...(ngDevMode ? [{ debugName: "textWidth" }] : []));
+        this.watermarkWidth = computed(() => {
+            const imgW = this.imageSrc() && this.imageWidth() ? this.imageWidth() : this.textWidth();
+            return Math.max(imgW, this.textWidth()) + this.gapX();
+        }, ...(ngDevMode ? [{ debugName: "watermarkWidth" }] : []));
+        this.watermarkHeight = computed(() => {
+            const imgH = this.imageSrc() && this.imageHeight() ? this.imageHeight() : this.height();
+            return Math.max(imgH, this.height()) + this.gapY();
+        }, ...(ngDevMode ? [{ debugName: "watermarkHeight" }] : []));
+    }
+    ngAfterViewInit() {
+        this.createWatermark();
+    }
+    ngOnDestroy() { }
+    createWatermark() {
+        if (this.imageSrc()) {
+            this.drawWatermarkWithImage();
+        }
+        else {
+            this.drawWatermarkText();
+        }
+    }
+    loadImage(src) {
+        return new Promise((resolve, reject) => {
+            const img = new Image();
+            img.crossOrigin = 'anonymous';
+            img.onload = () => resolve(img);
+            img.onerror = reject;
+            img.src = src;
+        });
+    }
+    async drawWatermarkWithImage() {
+        const w = this.watermarkWidth();
+        const h = this.watermarkHeight();
+        const canvas = document.createElement('canvas');
+        canvas.width = w;
+        canvas.height = h;
+        const ctx = canvas.getContext('2d');
+        if (!ctx)
+            return;
+        try {
+            const img = await this.loadImage(this.imageSrc());
+            const imgW = this.imageWidth() || this.width();
+            const imgH = this.imageHeight() || this.height();
+            ctx.save();
+            ctx.rotate((this.rotate() * Math.PI) / 180);
+            ctx.globalAlpha = this.alpha();
+            // 绘制图片
+            const imgX = (w - imgW) / 2;
+            const imgY = (h - imgH) / 2;
+            ctx.drawImage(img, imgX, imgY, imgW, imgH);
+            // 绘制文本
+            if (this.content()) {
+                ctx.font = this.font();
+                ctx.fillStyle = this.color();
+                ctx.textAlign = 'center';
+                ctx.textBaseline = 'middle';
+                let textY = h / 2;
+                if (this.imagePosition() === 'top') {
+                    textY = imgY - 10;
+                }
+                else if (this.imagePosition() === 'bottom') {
+                    textY = imgY + imgH + 10;
+                }
+                ctx.fillText(this.content(), w / 2, textY);
+            }
+            ctx.restore();
+            this.backgroundImage.set(canvas.toDataURL());
+        }
+        catch {
+            // 图片加载失败，降级为纯文本
+            this.drawWatermarkText();
+        }
+    }
+    drawWatermarkText() {
+        const w = this.watermarkWidth();
+        const h = this.watermarkHeight();
+        const canvas = document.createElement('canvas');
+        canvas.width = w;
+        canvas.height = h;
+        const ctx = canvas.getContext('2d');
+        if (!ctx)
+            return;
+        ctx.save();
+        ctx.rotate((this.rotate() * Math.PI) / 180);
+        ctx.font = this.font();
+        ctx.fillStyle = this.color();
+        ctx.globalAlpha = this.alpha();
+        ctx.textAlign = 'center';
+        ctx.textBaseline = 'middle';
+        ctx.fillText(this.content(), w / 2, h / 2);
+        ctx.restore();
+        const dataUrl = canvas.toDataURL();
+        this.backgroundImage.set(dataUrl);
+    }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.1.1", type: XWatermarkComponent, isStandalone: true, selector: "x-watermark", usesInheritance: true, ngImport: i0, template: "<div\n  class=\"x-watermark\"\n  [class.x-watermark-disabled]=\"disabled()\"\n  [style.z-index]=\"zIndex()\"\n  [style.background-image]=\"backgroundImage() ? 'url(' + backgroundImage() + ')' : 'none'\"\n  [style.background-repeat]=\"'repeat'\"\n  [style.background-size]=\"watermarkWidth() + 'px ' + watermarkHeight() + 'px'\"\n  [style.background-position]=\"offsetLeft() + 'px ' + offsetTop() + 'px'\"\n>\n  <ng-content></ng-content>\n</div>", styles: [".x-watermark{margin:0;padding:0}.x-watermark{font-size:var(--x-font-size);display:inline-block;box-sizing:border-box;position:relative}.x-watermark-disabled{pointer-events:none;-webkit-user-select:none;user-select:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkComponent, decorators: [{
+            type: Component,
+            args: [{ selector: XWatermarkPrefix, imports: [], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n  class=\"x-watermark\"\n  [class.x-watermark-disabled]=\"disabled()\"\n  [style.z-index]=\"zIndex()\"\n  [style.background-image]=\"backgroundImage() ? 'url(' + backgroundImage() + ')' : 'none'\"\n  [style.background-repeat]=\"'repeat'\"\n  [style.background-size]=\"watermarkWidth() + 'px ' + watermarkHeight() + 'px'\"\n  [style.background-position]=\"offsetLeft() + 'px ' + offsetTop() + 'px'\"\n>\n  <ng-content></ng-content>\n</div>", styles: [".x-watermark{margin:0;padding:0}.x-watermark{font-size:var(--x-font-size);display:inline-block;box-sizing:border-box;position:relative}.x-watermark-disabled{pointer-events:none;-webkit-user-select:none;user-select:none}\n"] }]
+        }], ctorParameters: () => [] });
+
+class XWatermarkModule {
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkModule, imports: [XWatermarkComponent], exports: [XWatermarkComponent] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkModule }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.1", ngImport: i0, type: XWatermarkModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    exports: [XWatermarkComponent],
+                    imports: [XWatermarkComponent]
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { XWatermarkComponent, XWatermarkModule, XWatermarkPrefix, XWatermarkProperty };
+//# sourceMappingURL=ng-nest-ui-watermark.mjs.map

package/fesm2022/ng-nest-ui-watermark.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"ng-nest-ui-watermark.mjs","sources":["../../../../lib/ng-nest/ui/watermark/watermark.property.ts","../../../../lib/ng-nest/ui/watermark/watermark.component.ts","../../../../lib/ng-nest/ui/watermark/watermark.component.html","../../../../lib/ng-nest/ui/watermark/watermark.module.ts","../../../../lib/ng-nest/ui/watermark/ng-nest-ui-watermark.ts"],"sourcesContent":["import { Component, input } from '@angular/core';\r\nimport { XToNumber, XToBoolean, XPropertyFunction } from '@ng-nest/ui/core';\r\nimport type { XNumber, XBoolean } from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Watermark\r\n * @selector x-watermark\r\n * @decorator component\r\n */\r\nexport const XWatermarkPrefix = 'x-watermark';\r\nconst X_WATERMARK_CONFIG_NAME = 'watermark';\r\n\r\n/**\r\n * Watermark Property\r\n */\r\n@Component({ selector: `${XWatermarkPrefix}-property`, template: '' })\r\nexport class XWatermarkProperty extends XPropertyFunction(X_WATERMARK_CONFIG_NAME) {\r\n  /**\r\n   * @zh_CN 水印内容\r\n   * @en_US Watermark content\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark content=\"NG-NEST\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly content = input<string>('');\r\n  /**\r\n   * @zh_CN 水印宽度\r\n   * @en_US Watermark width\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [width]=\"120\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly width = input<number, XNumber>(this.config?.width ?? 120, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 水印高度\r\n   * @en_US Watermark height\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [height]=\"60\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly height = input<number, XNumber>(this.config?.height ?? 60, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 旋转角度\r\n   * @en_US Rotation angle\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [rotate]=\"-22\"></x-watermark>\r\n   * <x-watermark [rotate]=\"0\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly rotate = input<number, XNumber>(this.config?.rotate ?? -22, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 字体大小\r\n   * @en_US Font size\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [fontSize]=\"14\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly fontSize = input<number, XNumber>(this.config?.fontSize ?? 14, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 字体\r\n   * @en_US Font family\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark fontFamily=\"Varela Round\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly fontFamily = input<string>(this.config?.fontFamily ?? 'Varela Round');\r\n  /**\r\n   * @zh_CN 字体颜色\r\n   * @en_US Font color\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark color=\"rgba(0, 0, 0, 0.12)\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly color = input<string>(this.config?.color ?? 'rgba(0, 0, 0, 0.12)');\r\n  /**\r\n   * @zh_CN 层级\r\n   * @en_US Z-index\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [zIndex]=\"9999\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly zIndex = input<number, XNumber>(this.config?.zIndex ?? 9999, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 透明度\r\n   * @en_US Opacity\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [alpha]=\"1\"></x-watermark>\r\n   * <x-watermark [alpha]=\"0.5\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly alpha = input<number, XNumber>(this.config?.alpha ?? 1, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 水平间距\r\n   * @en_US Horizontal gap\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [gapX]=\"100\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly gapX = input<number, XNumber>(this.config?.gapX ?? 100, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 垂直间距\r\n   * @en_US Vertical gap\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [gapY]=\"100\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly gapY = input<number, XNumber>(this.config?.gapY ?? 100, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 水平偏移\r\n   * @en_US Horizontal offset\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [offsetLeft]=\"0\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly offsetLeft = input<number, XNumber>(this.config?.offsetLeft ?? 0, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 垂直偏移\r\n   * @en_US Vertical offset\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [offsetTop]=\"0\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly offsetTop = input<number, XNumber>(this.config?.offsetTop ?? 0, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 是否交错显示\r\n   * @en_US Whether to stagger display\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [striped]=\"true\"></x-watermark>\r\n   * <x-watermark [striped]=\"false\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly striped = input<boolean, XBoolean>(this.config?.striped ?? false, { transform: XToBoolean });\r\n  /**\r\n   * @zh_CN 是否禁用\r\n   * @en_US Whether to disable\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [disabled]=\"true\"></x-watermark>\r\n   * <x-watermark [disabled]=\"false\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly disabled = input<boolean, XBoolean>(this.config?.disabled ?? false, { transform: XToBoolean });\r\n  /**\r\n   * @zh_CN 图片/图标 URL\r\n   * @en_US Image/icon URL\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark imageSrc=\"/assets/logo.png\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly imageSrc = input<string>('');\r\n  /**\r\n   * @zh_CN 图片宽度\r\n   * @en_US Image width\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [imageWidth]=\"40\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly imageWidth = input<number, XNumber>(0, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 图片高度\r\n   * @en_US Image height\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark [imageHeight]=\"40\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly imageHeight = input<number, XNumber>(0, { transform: XToNumber });\r\n  /**\r\n   * @zh_CN 图片相对文本的位置\r\n   * @en_US Image position relative to text\r\n   * @example\r\n   *\r\n   * ```html\r\n   * <x-watermark imagePosition=\"top\"></x-watermark>\r\n   * <x-watermark imagePosition=\"center\"></x-watermark>\r\n   * <x-watermark imagePosition=\"bottom\"></x-watermark>\r\n   * ```\r\n   *\r\n   */\r\n  readonly imagePosition = input<XWatermarkImagePosition>('center');\r\n}\r\n\r\n/**\r\n * @zh_CN 图片相对文本的位置\r\n * @en_US Image position relative to text\r\n */\r\nexport type XWatermarkImagePosition = 'top' | 'center' | 'bottom';\r\n","import {\n  Component,\n  ViewEncapsulation,\n  ChangeDetectionStrategy,\n  computed,\n  signal,\n  AfterViewInit,\n  OnDestroy\n} from '@angular/core';\nimport { XWatermarkProperty, XWatermarkPrefix } from './watermark.property';\n\n@Component({\n  selector: XWatermarkPrefix,\n  imports: [],\n  templateUrl: './watermark.component.html',\n  styleUrls: ['./watermark.component.scss'],\n  encapsulation: ViewEncapsulation.None,\n  changeDetection: ChangeDetectionStrategy.OnPush\n})\nexport class XWatermarkComponent extends XWatermarkProperty implements AfterViewInit, OnDestroy {\n  backgroundImage = signal<string>('');\n\n  private font = computed(() => {\n    return `${this.fontSize()}px ${this.fontFamily()}`;\n  });\n\n  private textWidth = computed(() => {\n    const canvas = document.createElement('canvas');\n    const ctx = canvas.getContext('2d');\n    if (ctx) {\n      ctx.font = this.font();\n      return ctx.measureText(this.content()).width;\n    }\n    return this.width();\n  });\n\n  watermarkWidth = computed(() => {\n    const imgW = this.imageSrc() && this.imageWidth() ? this.imageWidth() : this.textWidth();\n    return Math.max(imgW, this.textWidth()) + this.gapX();\n  });\n  \n  watermarkHeight = computed(() => {\n    const imgH = this.imageSrc() && this.imageHeight() ? this.imageHeight() : this.height();\n    return Math.max(imgH, this.height()) + this.gapY();\n  });\n\n  constructor() {\n    super();\n  }\n\n  ngAfterViewInit() {\n    this.createWatermark();\n  }\n\n  ngOnDestroy() {}\n\n  private createWatermark() {\n    if (this.imageSrc()) {\n      this.drawWatermarkWithImage();\n    } else {\n      this.drawWatermarkText();\n    }\n  }\n\n  private loadImage(src: string): Promise<HTMLImageElement> {\n    return new Promise((resolve, reject) => {\n      const img = new Image();\n      img.crossOrigin = 'anonymous';\n      img.onload = () => resolve(img);\n      img.onerror = reject;\n      img.src = src;\n    });\n  }\n\n  private async drawWatermarkWithImage() {\n    const w = this.watermarkWidth();\n    const h = this.watermarkHeight();\n    const canvas = document.createElement('canvas');\n    canvas.width = w;\n    canvas.height = h;\n    const ctx = canvas.getContext('2d');\n    if (!ctx) return;\n\n    try {\n      const img = await this.loadImage(this.imageSrc());\n      const imgW = this.imageWidth() || this.width();\n      const imgH = this.imageHeight() || this.height();\n      \n      ctx.save();\n      ctx.rotate((this.rotate() * Math.PI) / 180);\n      ctx.globalAlpha = this.alpha();\n      \n      // 绘制图片\n      const imgX = (w - imgW) / 2;\n      const imgY = (h - imgH) / 2;\n      ctx.drawImage(img, imgX, imgY, imgW, imgH);\n      \n      // 绘制文本\n      if (this.content()) {\n        ctx.font = this.font();\n        ctx.fillStyle = this.color();\n        ctx.textAlign = 'center';\n        ctx.textBaseline = 'middle';\n        \n        let textY = h / 2;\n        if (this.imagePosition() === 'top') {\n          textY = imgY - 10;\n        } else if (this.imagePosition() === 'bottom') {\n          textY = imgY + imgH + 10;\n        }\n        \n        ctx.fillText(this.content(), w / 2, textY);\n      }\n      \n      ctx.restore();\n      this.backgroundImage.set(canvas.toDataURL());\n    } catch {\n      // 图片加载失败，降级为纯文本\n      this.drawWatermarkText();\n    }\n  }\n\n  private drawWatermarkText() {\n    const w = this.watermarkWidth();\n    const h = this.watermarkHeight();\n\n    const canvas = document.createElement('canvas');\n    canvas.width = w;\n    canvas.height = h;\n\n    const ctx = canvas.getContext('2d');\n    if (!ctx) return;\n\n    ctx.save();\n    ctx.rotate((this.rotate() * Math.PI) / 180);\n    ctx.font = this.font();\n    ctx.fillStyle = this.color();\n    ctx.globalAlpha = this.alpha();\n    ctx.textAlign = 'center';\n    ctx.textBaseline = 'middle';\n    ctx.fillText(this.content(), w / 2, h / 2);\n    ctx.restore();\n\n    const dataUrl = canvas.toDataURL();\n    this.backgroundImage.set(dataUrl);\n  }\n}\n","<div\n  class=\"x-watermark\"\n  [class.x-watermark-disabled]=\"disabled()\"\n  [style.z-index]=\"zIndex()\"\n  [style.background-image]=\"backgroundImage() ? 'url(' + backgroundImage() + ')' : 'none'\"\n  [style.background-repeat]=\"'repeat'\"\n  [style.background-size]=\"watermarkWidth() + 'px ' + watermarkHeight() + 'px'\"\n  [style.background-position]=\"offsetLeft() + 'px ' + offsetTop() + 'px'\"\n>\n  <ng-content></ng-content>\n</div>","import { NgModule } from '@angular/core';\nimport { XWatermarkComponent } from './watermark.component';\n\n@NgModule({\n  exports: [XWatermarkComponent],\n  imports: [XWatermarkComponent]\n})\nexport class XWatermarkModule {}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/ng-nest-ui.mjs

@@ -71,6 +71,7 @@ export * from '@ng-nest/ui/affix';
 export * from '@ng-nest/ui/anchor';
 export * from '@ng-nest/ui/back-top';
 export * from '@ng-nest/ui/crumb';
+export * from '@ng-nest/ui/contextmenu';
 export * from '@ng-nest/ui/dropdown';
 export * from '@ng-nest/ui/menu';
 export * from '@ng-nest/ui/page-header';
@@ -85,6 +86,7 @@ export * from '@ng-nest/ui/attachments';
 export * from '@ng-nest/ui/suggestion';
 export * from '@ng-nest/ui/thought-chain';
 export * from '@ng-nest/ui/doc';
+export * from '@ng-nest/ui/divider';
 export * from '@ng-nest/ui/examples';
 export * from '@ng-nest/ui/api';
 export * from '@ng-nest/ui/pattern';
@@ -92,6 +94,8 @@ export * from '@ng-nest/ui/slider';
 export * from '@ng-nest/ui/scrollable';
 export * from '@ng-nest/ui/highlight';
 export * from '@ng-nest/ui/inner';
+export * from '@ng-nest/ui/watermark';
+export * from '@ng-nest/ui/splitter';
 
 /**
  * Core

package/fesm2022/ng-nest-ui.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ng-nest-ui.mjs","sources":["../../../../lib/ng-nest/ui/index.ts","../../../../lib/ng-nest/ui/ng-nest-ui.ts"],"sourcesContent":["/**\r\n * Core\r\n */\r\nexport * from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Basic\r\n */\r\nexport * from '@ng-nest/ui/button';\r\nexport * from '@ng-nest/ui/color';\r\nexport * from '@ng-nest/ui/container';\r\nexport * from '@ng-nest/ui/layout';\r\nexport * from '@ng-nest/ui/icon';\r\nexport * from '@ng-nest/ui/i18n';\r\nexport * from '@ng-nest/ui/link';\r\nexport * from '@ng-nest/ui/theme';\r\n\r\n/**\r\n * Data\r\n */\r\nexport * from '@ng-nest/ui/avatar';\r\nexport * from '@ng-nest/ui/badge';\r\nexport * from '@ng-nest/ui/card';\r\nexport * from '@ng-nest/ui/carousel';\r\nexport * from '@ng-nest/ui/collapse';\r\nexport * from '@ng-nest/ui/calendar';\r\nexport * from '@ng-nest/ui/comment';\r\nexport * from '@ng-nest/ui/description';\r\nexport * from '@ng-nest/ui/empty';\r\nexport * from '@ng-nest/ui/image';\r\nexport * from '@ng-nest/ui/outlet';\r\nexport * from '@ng-nest/ui/pagination';\r\nexport * from '@ng-nest/ui/progress';\r\nexport * from '@ng-nest/ui/ripple';\r\nexport * from '@ng-nest/ui/resizable';\r\nexport * from '@ng-nest/ui/drag';\r\nexport * from '@ng-nest/ui/statistic';\r\nexport * from '@ng-nest/ui/table';\r\nexport * from '@ng-nest/ui/table-view';\r\nexport * from '@ng-nest/ui/tag';\r\nexport * from '@ng-nest/ui/text-retract';\r\nexport * from '@ng-nest/ui/time-ago';\r\nexport * from '@ng-nest/ui/time-range';\r\nexport * from '@ng-nest/ui/timeline';\r\nexport * from '@ng-nest/ui/tree';\r\nexport * from '@ng-nest/ui/tree-file';\r\nexport * from '@ng-nest/ui/keyword';\r\n\r\n/**\r\n * Feedback\r\n */\r\nexport * from '@ng-nest/ui/alert';\r\nexport * from '@ng-nest/ui/dialog';\r\nexport * from '@ng-nest/ui/drawer';\r\nexport * from '@ng-nest/ui/loading';\r\nexport * from '@ng-nest/ui/message';\r\nexport * from '@ng-nest/ui/message-box';\r\nexport * from '@ng-nest/ui/notification';\r\nexport * from '@ng-nest/ui/popconfirm';\r\nexport * from '@ng-nest/ui/popover';\r\nexport * from '@ng-nest/ui/result';\r\nexport * from '@ng-nest/ui/skeleton';\r\nexport * from '@ng-nest/ui/tooltip';\r\n\r\n/**\r\n * Form\r\n */\r\nexport * from '@ng-nest/ui/auto-complete';\r\nexport * from '@ng-nest/ui/base-form';\r\nexport * from '@ng-nest/ui/cascade';\r\nexport * from '@ng-nest/ui/checkbox';\r\nexport * from '@ng-nest/ui/color-picker';\r\nexport * from '@ng-nest/ui/date-picker';\r\nexport * from '@ng-nest/ui/form';\r\nexport * from '@ng-nest/ui/find';\r\nexport * from '@ng-nest/ui/input';\r\nexport * from '@ng-nest/ui/input-number';\r\nexport * from '@ng-nest/ui/list';\r\nexport * from '@ng-nest/ui/radio';\r\nexport * from '@ng-nest/ui/rate';\r\nexport * from '@ng-nest/ui/select';\r\nexport * from '@ng-nest/ui/slider-select';\r\nexport * from '@ng-nest/ui/switch';\r\nexport * from '@ng-nest/ui/time-picker';\r\nexport * from '@ng-nest/ui/transfer';\r\nexport * from '@ng-nest/ui/tree-select';\r\nexport * from '@ng-nest/ui/textarea';\r\nexport * from '@ng-nest/ui/upload';\r\n\r\n/**\r\n * Navigation\r\n */\r\nexport * from '@ng-nest/ui/affix';\r\nexport * from '@ng-nest/ui/anchor';\r\nexport * from '@ng-nest/ui/back-top';\r\nexport * from '@ng-nest/ui/crumb';\r\nexport * from '@ng-nest/ui/dropdown';\r\nexport * from '@ng-nest/ui/menu';\r\nexport * from '@ng-nest/ui/page-header';\r\nexport * from '@ng-nest/ui/steps';\r\nexport * from '@ng-nest/ui/tabs';\r\n\r\n/**\r\n * AI\r\n */\r\nexport * from '@ng-nest/ui/bubble';\r\nexport * from '@ng-nest/ui/sender';\r\nexport * from '@ng-nest/ui/coversations';\r\nexport * from '@ng-nest/ui/welcome';\r\nexport * from '@ng-nest/ui/prompts';\r\nexport * from '@ng-nest/ui/attachments';\r\nexport * from '@ng-nest/ui/suggestion';\r\nexport * from '@ng-nest/ui/thought-chain';\r\n\r\n/**\r\n * Others\r\n */\r\nexport * from '@ng-nest/ui/doc';\r\nexport * from '@ng-nest/ui/examples';\r\nexport * from '@ng-nest/ui/api';\r\nexport * from '@ng-nest/ui/pattern';\r\nexport * from '@ng-nest/ui/slider';\r\nexport * from '@ng-nest/ui/scrollable';\r\nexport * from '@ng-nest/ui/highlight';\r\nexport * from '@ng-nest/ui/inner';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEG;;ACFH;;AAEG"}
+{"version":3,"file":"ng-nest-ui.mjs","sources":["../../../../lib/ng-nest/ui/index.ts","../../../../lib/ng-nest/ui/ng-nest-ui.ts"],"sourcesContent":["/**\r\n * Core\r\n */\r\nexport * from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Basic\r\n */\r\nexport * from '@ng-nest/ui/button';\r\nexport * from '@ng-nest/ui/color';\r\nexport * from '@ng-nest/ui/container';\r\nexport * from '@ng-nest/ui/layout';\r\nexport * from '@ng-nest/ui/icon';\r\nexport * from '@ng-nest/ui/i18n';\r\nexport * from '@ng-nest/ui/link';\r\nexport * from '@ng-nest/ui/theme';\r\n\r\n/**\r\n * Data\r\n */\r\nexport * from '@ng-nest/ui/avatar';\r\nexport * from '@ng-nest/ui/badge';\r\nexport * from '@ng-nest/ui/card';\r\nexport * from '@ng-nest/ui/carousel';\r\nexport * from '@ng-nest/ui/collapse';\r\nexport * from '@ng-nest/ui/calendar';\r\nexport * from '@ng-nest/ui/comment';\r\nexport * from '@ng-nest/ui/description';\r\nexport * from '@ng-nest/ui/empty';\r\nexport * from '@ng-nest/ui/image';\r\nexport * from '@ng-nest/ui/outlet';\r\nexport * from '@ng-nest/ui/pagination';\r\nexport * from '@ng-nest/ui/progress';\r\nexport * from '@ng-nest/ui/ripple';\r\nexport * from '@ng-nest/ui/resizable';\r\nexport * from '@ng-nest/ui/drag';\r\nexport * from '@ng-nest/ui/statistic';\r\nexport * from '@ng-nest/ui/table';\r\nexport * from '@ng-nest/ui/table-view';\r\nexport * from '@ng-nest/ui/tag';\r\nexport * from '@ng-nest/ui/text-retract';\r\nexport * from '@ng-nest/ui/time-ago';\r\nexport * from '@ng-nest/ui/time-range';\r\nexport * from '@ng-nest/ui/timeline';\r\nexport * from '@ng-nest/ui/tree';\r\nexport * from '@ng-nest/ui/tree-file';\r\nexport * from '@ng-nest/ui/keyword';\r\n\r\n/**\r\n * Feedback\r\n */\r\nexport * from '@ng-nest/ui/alert';\r\nexport * from '@ng-nest/ui/dialog';\r\nexport * from '@ng-nest/ui/drawer';\r\nexport * from '@ng-nest/ui/loading';\r\nexport * from '@ng-nest/ui/message';\r\nexport * from '@ng-nest/ui/message-box';\r\nexport * from '@ng-nest/ui/notification';\r\nexport * from '@ng-nest/ui/popconfirm';\r\nexport * from '@ng-nest/ui/popover';\r\nexport * from '@ng-nest/ui/result';\r\nexport * from '@ng-nest/ui/skeleton';\r\nexport * from '@ng-nest/ui/tooltip';\r\n\r\n/**\r\n * Form\r\n */\r\nexport * from '@ng-nest/ui/auto-complete';\r\nexport * from '@ng-nest/ui/base-form';\r\nexport * from '@ng-nest/ui/cascade';\r\nexport * from '@ng-nest/ui/checkbox';\r\nexport * from '@ng-nest/ui/color-picker';\r\nexport * from '@ng-nest/ui/date-picker';\r\nexport * from '@ng-nest/ui/form';\r\nexport * from '@ng-nest/ui/find';\r\nexport * from '@ng-nest/ui/input';\r\nexport * from '@ng-nest/ui/input-number';\r\nexport * from '@ng-nest/ui/list';\r\nexport * from '@ng-nest/ui/radio';\r\nexport * from '@ng-nest/ui/rate';\r\nexport * from '@ng-nest/ui/select';\r\nexport * from '@ng-nest/ui/slider-select';\r\nexport * from '@ng-nest/ui/switch';\r\nexport * from '@ng-nest/ui/time-picker';\r\nexport * from '@ng-nest/ui/transfer';\r\nexport * from '@ng-nest/ui/tree-select';\r\nexport * from '@ng-nest/ui/textarea';\r\nexport * from '@ng-nest/ui/upload';\r\n\r\n/**\r\n * Navigation\r\n */\r\nexport * from '@ng-nest/ui/affix';\r\nexport * from '@ng-nest/ui/anchor';\r\nexport * from '@ng-nest/ui/back-top';\r\nexport * from '@ng-nest/ui/crumb';\r\nexport * from '@ng-nest/ui/contextmenu';\r\nexport * from '@ng-nest/ui/dropdown';\r\nexport * from '@ng-nest/ui/menu';\r\nexport * from '@ng-nest/ui/page-header';\r\nexport * from '@ng-nest/ui/steps';\r\nexport * from '@ng-nest/ui/tabs';\r\n\r\n/**\r\n * AI\r\n */\r\nexport * from '@ng-nest/ui/bubble';\r\nexport * from '@ng-nest/ui/sender';\r\nexport * from '@ng-nest/ui/coversations';\r\nexport * from '@ng-nest/ui/welcome';\r\nexport * from '@ng-nest/ui/prompts';\r\nexport * from '@ng-nest/ui/attachments';\r\nexport * from '@ng-nest/ui/suggestion';\r\nexport * from '@ng-nest/ui/thought-chain';\r\n\r\n/**\r\n * Others\r\n */\r\nexport * from '@ng-nest/ui/doc';\r\nexport * from '@ng-nest/ui/divider';\r\nexport * from '@ng-nest/ui/examples';\r\nexport * from '@ng-nest/ui/api';\r\nexport * from '@ng-nest/ui/pattern';\r\nexport * from '@ng-nest/ui/slider';\r\nexport * from '@ng-nest/ui/scrollable';\r\nexport * from '@ng-nest/ui/highlight';\r\nexport * from '@ng-nest/ui/inner';\r\nexport * from '@ng-nest/ui/watermark';\r\nexport * from '@ng-nest/ui/splitter';\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAEG;;ACFH;;AAEG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ng-nest/ui",
-  "version": "21.0.10",
+  "version": "21.0.12",
   "license": "MIT",
   "homepage": "https://www.ngnest.com",
   "author": "ng-nest",
@@ -120,6 +120,10 @@
       "types": "./types/ng-nest-ui-container.d.ts",
       "default": "./fesm2022/ng-nest-ui-container.mjs"
     },
+    "./contextmenu": {
+      "types": "./types/ng-nest-ui-contextmenu.d.ts",
+      "default": "./fesm2022/ng-nest-ui-contextmenu.mjs"
+    },
     "./core": {
       "types": "./types/ng-nest-ui-core.d.ts",
       "default": "./fesm2022/ng-nest-ui-core.mjs"
@@ -144,6 +148,10 @@
       "types": "./types/ng-nest-ui-dialog.d.ts",
       "default": "./fesm2022/ng-nest-ui-dialog.mjs"
     },
+    "./divider": {
+      "types": "./types/ng-nest-ui-divider.d.ts",
+      "default": "./fesm2022/ng-nest-ui-divider.mjs"
+    },
     "./doc": {
       "types": "./types/ng-nest-ui-doc.d.ts",
       "default": "./fesm2022/ng-nest-ui-doc.mjs"
@@ -320,6 +328,10 @@
       "types": "./types/ng-nest-ui-slider-select.d.ts",
       "default": "./fesm2022/ng-nest-ui-slider-select.mjs"
     },
+    "./splitter": {
+      "types": "./types/ng-nest-ui-splitter.d.ts",
+      "default": "./fesm2022/ng-nest-ui-splitter.mjs"
+    },
     "./statistic": {
       "types": "./types/ng-nest-ui-statistic.d.ts",
       "default": "./fesm2022/ng-nest-ui-statistic.mjs"
@@ -412,6 +424,10 @@
       "types": "./types/ng-nest-ui-upload.d.ts",
       "default": "./fesm2022/ng-nest-ui-upload.mjs"
     },
+    "./watermark": {
+      "types": "./types/ng-nest-ui-watermark.d.ts",
+      "default": "./fesm2022/ng-nest-ui-watermark.mjs"
+    },
     "./welcome": {
       "types": "./types/ng-nest-ui-welcome.d.ts",
       "default": "./fesm2022/ng-nest-ui-welcome.mjs"

package/types/ng-nest-ui-attachments.d.ts

@@ -18,19 +18,18 @@ declare const XAttachmentsProperty_base: new () => {
     invalidPattern: _angular_core.Signal<boolean>;
     requiredIsEmpty: _angular_core.Signal<boolean>;
     invalidMessage: _angular_core.Signal<string>;
-    invalidIndex: _angular_core.Signal<number>;
     value: _angular_core.WritableSignal<any>;
     valueObservable: rxjs.Observable<any>;
     validatorSignal: _angular_core.WritableSignal<boolean>;
     disabledSignal: _angular_core.WritableSignal<boolean>;
     requiredSignal: _angular_core.WritableSignal<boolean>;
     patternSignal: _angular_core.WritableSignal<any>;
-    messageSignal: _angular_core.WritableSignal<string | string[]>;
+    messageSignal: _angular_core.WritableSignal<string>;
     requiredComputed: _angular_core.Signal<boolean>;
     disabledComputed: _angular_core.Signal<boolean>;
     validatorComputed: _angular_core.Signal<boolean>;
     patternComputed: _angular_core.Signal<any>;
-    messageComputed: _angular_core.Signal<string | string[]>;
+    messageComputed: _angular_core.Signal<string>;
     invalidInputValidator: _angular_core.WritableSignal<boolean>;
     onChange: (value: any) => void;
     onTouched: () => void;
@@ -55,8 +54,8 @@ declare const XAttachmentsProperty_base: new () => {
     readonly valueTplContext: _angular_core.InputSignal<unknown>;
     readonly before: _angular_core.InputSignal<XTemplate | undefined>;
     readonly after: _angular_core.InputSignal<XTemplate | undefined>;
-    readonly pattern: _angular_core.InputSignal<RegExp | RegExp[]>;
-    readonly message: _angular_core.InputSignal<string | string[]>;
+    readonly pattern: _angular_core.InputSignal<RegExp | null>;
+    readonly message: _angular_core.InputSignal<string>;
     readonly active: _angular_core.ModelSignal<boolean>;
     readonly pointer: _angular_core.InputSignalWithTransform<boolean, XBoolean>;
     readonly inputValidator: _angular_core.InputSignal<((value: any) => boolean) | undefined>;