cmat 0.0.37 → 0.0.39

package/fesm2022/cmat-components-qrcode.mjs

@@ -0,0 +1,283 @@
+import * as i0 from '@angular/core';
+import { EventEmitter, inject, Renderer2, ViewChild, Output, Input, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
+import { DomSanitizer } from '@angular/platform-browser';
+import { toDataURL, toCanvas, toString } from 'qrcode';
+
+class CmatQRCodeComponent {
+    constructor() {
+        this.allowEmptyString = false;
+        this.cssClass = 'qrcode';
+        this.elementType = 'canvas';
+        this.errorCorrectionLevel = 'M';
+        this.margin = 4;
+        this.qrdata = '';
+        this.scale = 4;
+        this.version = 1;
+        this.width = 10;
+        this.qrCodeURL = new EventEmitter();
+        this.context = null;
+        this._renderer = inject(Renderer2);
+        this._sanitizer = inject(DomSanitizer);
+        this._currentOperationId = 0;
+    }
+    ngOnChanges() {
+        this._createQRCode();
+    }
+    convertBase64ImageUrlToBlob(base64ImageUrl) {
+        // split into two parts
+        const parts = base64ImageUrl.split(';base64,');
+        // hold the content/mime type f.e. image/png
+        const imageType = parts[0].split(':')[1];
+        // decode base64 string
+        const decodedData = atob(parts[1]);
+        // create unit8array of size same as row data length
+        const uInt8Array = new Uint8Array(decodedData.length);
+        // insert all character code into uint8array
+        for (let i = 0; i < decodedData.length; ++i) {
+            uInt8Array[i] = decodedData.charCodeAt(i);
+        }
+        // return blob image after conversion
+        return new Blob([uInt8Array], { type: imageType });
+    }
+    emitQRCodeURL(element) {
+        const className = element.constructor.name;
+        if (className === SVGSVGElement.name) {
+            const svgHTML = element.outerHTML;
+            const blob = new Blob([svgHTML], { type: 'image/svg+xml' });
+            const urlSvg = URL.createObjectURL(blob);
+            const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlSvg);
+            this.qrCodeURL.emit(urlSanitized);
+            return;
+        }
+        let urlImage = '';
+        if (className === HTMLCanvasElement.name) {
+            urlImage = element.toDataURL('image/png');
+        }
+        if (className === HTMLImageElement.name) {
+            urlImage = element.src;
+        }
+        const blobData = this.convertBase64ImageUrlToBlob(urlImage);
+        const urlBlob = URL.createObjectURL(blobData);
+        const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlBlob);
+        this.qrCodeURL.emit(urlSanitized);
+    }
+    _isValidQrCodeText(data) {
+        if (this.allowEmptyString === false) {
+            return !(typeof data === 'undefined' ||
+                data === '' ||
+                data === 'null' ||
+                data === null);
+        }
+        return !(typeof data === 'undefined');
+    }
+    _toDataURL(qrCodeConfig) {
+        return new Promise((resolve, reject) => {
+            toDataURL(this.qrdata, qrCodeConfig, (err, url) => {
+                if (err) {
+                    reject(err);
+                }
+                else {
+                    resolve(url);
+                }
+            });
+        });
+    }
+    _toCanvas(canvas, qrCodeConfig) {
+        return new Promise((resolve, reject) => {
+            toCanvas(canvas, this.qrdata, qrCodeConfig, (error) => {
+                if (error) {
+                    reject(error);
+                }
+                else {
+                    resolve('success');
+                }
+            });
+        });
+    }
+    _toSVG(qrCodeConfig) {
+        return new Promise((resolve, reject) => {
+            toString(this.qrdata, qrCodeConfig, (err, url) => {
+                if (err) {
+                    reject(err);
+                }
+                else {
+                    resolve(url);
+                }
+            });
+        });
+    }
+    _renderElement(element) {
+        for (const node of this.qrcElement.nativeElement.childNodes) {
+            this._renderer.removeChild(this.qrcElement.nativeElement, node);
+        }
+        this._renderer.appendChild(this.qrcElement.nativeElement, element);
+    }
+    _createQRCode() {
+        const operationId = ++this._currentOperationId;
+        try {
+            if (!this._isValidQrCodeText(this.qrdata)) {
+                throw new Error('`qrdata`配置为空了, 设置\'allowEmptyString="true"\'重写这个特性.');
+            }
+            if (this._isValidQrCodeText(this.qrdata) && this.qrdata === '') {
+                this.qrdata = ' ';
+            }
+            const config = {
+                errorCorrectionLevel: this.errorCorrectionLevel,
+                margin: this.margin,
+                scale: this.scale,
+                version: this.version,
+                width: this.width,
+            };
+            const centerImageSrc = this.imageSrc;
+            const centerImageHeight = this.imageHeight ?? 40;
+            const centerImageWidth = this.imageWidth ?? 40;
+            switch (this.elementType) {
+                case 'canvas': {
+                    const canvasElement = this._renderer.createElement('canvas');
+                    this.context = canvasElement.getContext('2d');
+                    this._toCanvas(canvasElement, config)
+                        .then(() => {
+                        if (operationId !== this._currentOperationId) {
+                            return; // 不是最新操作，直接返回
+                        }
+                        if (this.ariaLabel) {
+                            this._renderer.setAttribute(canvasElement, 'aria-label', `${this.ariaLabel}`);
+                        }
+                        if (this.title) {
+                            this._renderer.setAttribute(canvasElement, 'title', `${this.title}`);
+                        }
+                        if (centerImageSrc && this.context) {
+                            this._centerImage = new Image(centerImageWidth, centerImageHeight);
+                            if (centerImageSrc !== this._centerImage.src) {
+                                this._centerImage.crossOrigin = 'anonymous';
+                                this._centerImage.src = centerImageSrc;
+                            }
+                            if (centerImageHeight !== this._centerImage.height) {
+                                this._centerImage.height = centerImageHeight;
+                            }
+                            if (centerImageWidth !== this._centerImage.width) {
+                                this._centerImage.width = centerImageWidth;
+                            }
+                            const centerImage = this._centerImage;
+                            if (centerImage) {
+                                centerImage.onload = () => {
+                                    if (operationId === this._currentOperationId) {
+                                        this.context?.drawImage(centerImage, canvasElement.width / 2 - centerImageWidth / 2, canvasElement.height / 2 - centerImageHeight / 2, centerImageWidth, centerImageHeight);
+                                    }
+                                };
+                            }
+                        }
+                        this._renderElement(canvasElement);
+                        this.emitQRCodeURL(canvasElement);
+                    })
+                        .catch((e) => {
+                        console.error('canvas error:', e);
+                    });
+                    break;
+                }
+                case 'svg': {
+                    const svgParentElement = this._renderer.createElement('div');
+                    this._toSVG(config)
+                        .then((svgString) => {
+                        if (operationId !== this._currentOperationId) {
+                            return;
+                        }
+                        this._renderer.setProperty(svgParentElement, 'innerHTML', svgString);
+                        const svgElement = svgParentElement.firstChild;
+                        this._renderer.setAttribute(svgElement, 'height', `${this.width}`);
+                        this._renderer.setAttribute(svgElement, 'width', `${this.width}`);
+                        this._renderElement(svgElement);
+                        this.emitQRCodeURL(svgElement);
+                    })
+                        .catch((e) => {
+                        console.error('svg error:', e);
+                    });
+                    break;
+                }
+                case 'url':
+                case 'img':
+                default: {
+                    const imgElement = this._renderer.createElement('img');
+                    this._toDataURL(config)
+                        .then((dataUrl) => {
+                        if (operationId !== this._currentOperationId) {
+                            return;
+                        }
+                        if (this.alt) {
+                            imgElement.setAttribute('alt', this.alt);
+                        }
+                        if (this.ariaLabel) {
+                            imgElement.setAttribute('aria-label', this.ariaLabel);
+                        }
+                        imgElement.setAttribute('src', dataUrl);
+                        if (this.title) {
+                            imgElement.setAttribute('title', this.title);
+                        }
+                        this._renderElement(imgElement);
+                        this.emitQRCodeURL(imgElement);
+                    })
+                        .catch((e) => {
+                        console.error('img/url error:', e);
+                    });
+                }
+            }
+        }
+        catch (e) {
+            console.error('生成QRCode错误:', e.message);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatQRCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CmatQRCodeComponent, isStandalone: true, selector: "cmat-qrcode", inputs: { allowEmptyString: "allowEmptyString", cssClass: "cssClass", elementType: "elementType", errorCorrectionLevel: "errorCorrectionLevel", imageSrc: "imageSrc", imageHeight: "imageHeight", imageWidth: "imageWidth", margin: "margin", qrdata: "qrdata", scale: "scale", version: "version", width: "width", alt: "alt", ariaLabel: "ariaLabel", title: "title" }, outputs: { qrCodeURL: "qrCodeURL" }, viewQueries: [{ propertyName: "qrcElement", first: true, predicate: ["qrcElement"], descendants: true, static: true }], exportAs: ["cmatQRCode"], usesOnChanges: true, ngImport: i0, template: '<div #qrcElement [class]="cssClass"></div>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatQRCodeComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'cmat-qrcode',
+                    encapsulation: ViewEncapsulation.None,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    template: '<div #qrcElement [class]="cssClass"></div>',
+                    exportAs: 'cmatQRCode',
+                }]
+        }], propDecorators: { allowEmptyString: [{
+                type: Input
+            }], cssClass: [{
+                type: Input
+            }], elementType: [{
+                type: Input
+            }], errorCorrectionLevel: [{
+                type: Input
+            }], imageSrc: [{
+                type: Input
+            }], imageHeight: [{
+                type: Input
+            }], imageWidth: [{
+                type: Input
+            }], margin: [{
+                type: Input
+            }], qrdata: [{
+                type: Input
+            }], scale: [{
+                type: Input
+            }], version: [{
+                type: Input
+            }], width: [{
+                type: Input
+            }], alt: [{
+                type: Input
+            }], ariaLabel: [{
+                type: Input
+            }], title: [{
+                type: Input
+            }], qrCodeURL: [{
+                type: Output
+            }], qrcElement: [{
+                type: ViewChild,
+                args: ['qrcElement', { static: true }]
+            }] } });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { CmatQRCodeComponent };
+//# sourceMappingURL=cmat-components-qrcode.mjs.map

package/fesm2022/cmat-components-qrcode.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"cmat-components-qrcode.mjs","sources":["../../../projects/cmat/components/qrcode/qrcode.component.ts","../../../projects/cmat/components/qrcode/cmat-components-qrcode.ts"],"sourcesContent":["import {\r\n    ChangeDetectionStrategy,\r\n    Component,\r\n    ElementRef,\r\n    EventEmitter,\r\n    inject,\r\n    Input,\r\n    OnChanges,\r\n    Output,\r\n    Renderer2,\r\n    ViewChild,\r\n    ViewEncapsulation,\r\n} from '@angular/core';\r\nimport { DomSanitizer, SafeUrl } from '@angular/platform-browser';\r\nimport {\r\n    QRCodeRenderersOptions,\r\n    QRCodeToDataURLOptions,\r\n    QRCodeToStringOptions,\r\n    toCanvas,\r\n    toDataURL,\r\n    toString\r\n} from 'qrcode';\r\nimport { FixMeLater, QRCodeConfigType, QRCodeElementType, QRCodeErrorCorrectionLevel } from './qrcode.types';\r\n\r\n@Component({\r\n    selector: 'cmat-qrcode',\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    template: '<div #qrcElement [class]=\"cssClass\"></div>',\r\n    exportAs: 'cmatQRCode',\r\n})\r\nexport class CmatQRCodeComponent implements OnChanges {\r\n    @Input() public allowEmptyString: boolean = false;\r\n    @Input() public cssClass: string = 'qrcode';\r\n    @Input() public elementType: QRCodeElementType = 'canvas';\r\n    @Input()\r\n    public errorCorrectionLevel: QRCodeErrorCorrectionLevel = 'M';\r\n    @Input() public imageSrc?: string;\r\n    @Input() public imageHeight?: number;\r\n    @Input() public imageWidth?: number;\r\n    @Input() public margin = 4;\r\n    @Input() public qrdata = '';\r\n    @Input() public scale = 4;\r\n    @Input() public version: number = 1;\r\n    @Input() public width = 10;\r\n\r\n    @Input() public alt?: string;\r\n    @Input() public ariaLabel?: string;\r\n    @Input() public title?: string;\r\n\r\n    @Output() qrCodeURL = new EventEmitter<SafeUrl>();\r\n\r\n    @ViewChild('qrcElement', { static: true }) public qrcElement!: ElementRef;\r\n\r\n    public context: CanvasRenderingContext2D | null = null;\r\n    private _centerImage?: HTMLImageElement;\r\n    private _renderer = inject(Renderer2);\r\n    private _sanitizer = inject(DomSanitizer);\r\n    private _currentOperationId = 0;\r\n\r\n    ngOnChanges(): void {\r\n        this._createQRCode();\r\n    }\r\n\r\n    convertBase64ImageUrlToBlob(base64ImageUrl: string): Blob {\r\n        // split into two parts\r\n        const parts = base64ImageUrl.split(';base64,');\r\n        // hold the content/mime type f.e. image/png\r\n        const imageType = parts[0].split(':')[1];\r\n        // decode base64 string\r\n        const decodedData = atob(parts[1]);\r\n        // create unit8array of size same as row data length\r\n        const uInt8Array = new Uint8Array(decodedData.length);\r\n        // insert all character code into uint8array\r\n        for (let i = 0; i < decodedData.length; ++i) {\r\n            uInt8Array[i] = decodedData.charCodeAt(i)\r\n        }\r\n        // return blob image after conversion\r\n        return new Blob([uInt8Array], { type: imageType });\r\n    }\r\n\r\n    emitQRCodeURL(element: HTMLCanvasElement | HTMLImageElement | SVGSVGElement): void {\r\n        const className = element.constructor.name;\r\n        if (className === SVGSVGElement.name) {\r\n            const svgHTML = element.outerHTML;\r\n            const blob = new Blob([svgHTML], { type: 'image/svg+xml' });\r\n            const urlSvg = URL.createObjectURL(blob);\r\n            const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlSvg);\r\n            this.qrCodeURL.emit(urlSanitized);\r\n            return;\r\n        }\r\n\r\n        let urlImage = '';\r\n\r\n        if (className === HTMLCanvasElement.name) {\r\n            urlImage = (element as HTMLCanvasElement).toDataURL('image/png');\r\n        }\r\n\r\n        if (className === HTMLImageElement.name) {\r\n            urlImage = (element as HTMLImageElement).src;\r\n        }\r\n\r\n        const blobData: Blob = this.convertBase64ImageUrlToBlob(urlImage);\r\n        const urlBlob = URL.createObjectURL(blobData);\r\n        const urlSanitized = this._sanitizer.bypassSecurityTrustUrl(urlBlob);\r\n        this.qrCodeURL.emit(urlSanitized);\r\n    }\r\n    private _isValidQrCodeText(data: string | null): boolean {\r\n        if (this.allowEmptyString === false) {\r\n            return !(\r\n                typeof data === 'undefined' ||\r\n                data === '' ||\r\n                data === 'null' ||\r\n                data === null\r\n            );\r\n        }\r\n        return !(typeof data === 'undefined');\r\n    }\r\n\r\n    private _toDataURL(qrCodeConfig: QRCodeToDataURLOptions): Promise<FixMeLater> {\r\n        return new Promise(\r\n            (\r\n                resolve: (arg: FixMeLater) => FixMeLater,\r\n                reject: (arg: FixMeLater) => FixMeLater\r\n            ) => {\r\n                toDataURL(\r\n                    this.qrdata,\r\n                    qrCodeConfig,\r\n                    (err: Error | null | undefined, url: string) => {\r\n                        if (err) {\r\n                            reject(err);\r\n                        } else {\r\n                            resolve(url);\r\n                        }\r\n                    }\r\n                );\r\n            }\r\n        );\r\n    }\r\n\r\n    private _toCanvas(\r\n        canvas: HTMLCanvasElement,\r\n        qrCodeConfig: QRCodeRenderersOptions\r\n    ): Promise<FixMeLater> {\r\n        return new Promise(\r\n            (\r\n                resolve: (arg: FixMeLater) => FixMeLater,\r\n                reject: (arg: FixMeLater) => FixMeLater\r\n            ) => {\r\n                toCanvas(\r\n                    canvas,\r\n                    this.qrdata,\r\n                    qrCodeConfig,\r\n                    (error: Error | null | undefined) => {\r\n                        if (error) {\r\n                            reject(error);\r\n                        } else {\r\n                            resolve('success');\r\n                        }\r\n                    }\r\n                )\r\n            }\r\n        );\r\n    }\r\n\r\n    private _toSVG(qrCodeConfig: QRCodeToStringOptions): Promise<FixMeLater> {\r\n        return new Promise(\r\n            (\r\n                resolve: (arg: FixMeLater) => FixMeLater,\r\n                reject: (arg: FixMeLater) => FixMeLater\r\n            ) => {\r\n                toString(\r\n                    this.qrdata,\r\n                    qrCodeConfig,\r\n                    (err: Error | null | undefined, url: string) => {\r\n                        if (err) {\r\n                            reject(err);\r\n                        } else {\r\n                            resolve(url);\r\n                        }\r\n                    }\r\n                )\r\n            }\r\n        );\r\n    }\r\n\r\n    private _renderElement(element: Element): void {\r\n        for (const node of this.qrcElement.nativeElement.childNodes) {\r\n            this._renderer.removeChild(this.qrcElement.nativeElement, node);\r\n        }\r\n\r\n        this._renderer.appendChild(this.qrcElement.nativeElement, element);\r\n\r\n    }\r\n\r\n    private _createQRCode(): void {\r\n        const operationId = ++this._currentOperationId;\r\n\r\n        try {\r\n            if (!this._isValidQrCodeText(this.qrdata)) {\r\n                throw new Error(\r\n                    '`qrdata`配置为空了, 设置\\'allowEmptyString=\"true\"\\'重写这个特性.'\r\n                );\r\n            }\r\n\r\n            if (this._isValidQrCodeText(this.qrdata) && this.qrdata === '') {\r\n                this.qrdata = ' ';\r\n            }\r\n\r\n            const config: QRCodeConfigType = {\r\n                errorCorrectionLevel: this.errorCorrectionLevel,\r\n                margin: this.margin,\r\n                scale: this.scale,\r\n                version: this.version,\r\n                width: this.width,\r\n            };\r\n\r\n            const centerImageSrc = this.imageSrc;\r\n            const centerImageHeight = this.imageHeight ?? 40;\r\n            const centerImageWidth = this.imageWidth ?? 40;\r\n\r\n            switch (this.elementType) {\r\n                case 'canvas': {\r\n                    const canvasElement: HTMLCanvasElement =\r\n                        this._renderer.createElement('canvas');\r\n                    this.context = canvasElement.getContext('2d');\r\n                    this._toCanvas(canvasElement, config)\r\n                        .then(() => {\r\n                            if (operationId !== this._currentOperationId) {\r\n                                return; // 不是最新操作，直接返回\r\n                            }\r\n\r\n                            if (this.ariaLabel) {\r\n                                this._renderer.setAttribute(\r\n                                    canvasElement,\r\n                                    'aria-label',\r\n                                    `${this.ariaLabel}`\r\n                                );\r\n                            }\r\n                            if (this.title) {\r\n                                this._renderer.setAttribute(\r\n                                    canvasElement,\r\n                                    'title',\r\n                                    `${this.title}`\r\n                                );\r\n                            }\r\n\r\n                            if (centerImageSrc && this.context) {\r\n                                this._centerImage = new Image(\r\n                                    centerImageWidth,\r\n                                    centerImageHeight\r\n                                );\r\n\r\n                                if (centerImageSrc !== this._centerImage.src) {\r\n                                    this._centerImage.crossOrigin = 'anonymous';\r\n                                    this._centerImage.src = centerImageSrc;\r\n                                }\r\n\r\n                                if (centerImageHeight !== this._centerImage.height) {\r\n                                    this._centerImage.height = centerImageHeight;\r\n                                }\r\n\r\n                                if (centerImageWidth !== this._centerImage.width) {\r\n                                    this._centerImage.width = centerImageWidth;\r\n                                }\r\n\r\n                                const centerImage = this._centerImage;\r\n\r\n                                if (centerImage) {\r\n                                    centerImage.onload = (): void => {\r\n                                        if (operationId === this._currentOperationId) {\r\n                                            this.context?.drawImage(\r\n                                                centerImage,\r\n                                                canvasElement.width / 2 - centerImageWidth / 2,\r\n                                                canvasElement.height / 2 - centerImageHeight / 2,\r\n                                                centerImageWidth,\r\n                                                centerImageHeight\r\n                                            );\r\n                                        }\r\n                                    }\r\n                                }\r\n                            }\r\n\r\n                            this._renderElement(canvasElement);\r\n                            this.emitQRCodeURL(canvasElement);\r\n                        })\r\n                        .catch((e) => {\r\n                            console.error('canvas error:', e);\r\n                        });\r\n                    break;\r\n                }\r\n                case 'svg': {\r\n                    const svgParentElement: HTMLElement =\r\n                        this._renderer.createElement('div');\r\n                    this._toSVG(config)\r\n                        .then((svgString: string) => {\r\n                            if (operationId !== this._currentOperationId) {\r\n                                return;\r\n                            }\r\n\r\n                            this._renderer.setProperty(\r\n                                svgParentElement,\r\n                                'innerHTML',\r\n                                svgString\r\n                            );\r\n                            const svgElement = svgParentElement.firstChild as SVGSVGElement;\r\n                            this._renderer.setAttribute(svgElement, 'height', `${this.width}`);\r\n                            this._renderer.setAttribute(svgElement, 'width', `${this.width}`);\r\n                            this._renderElement(svgElement);\r\n                            this.emitQRCodeURL(svgElement);\r\n                        })\r\n                        .catch((e) => {\r\n                            console.error('svg error:', e);\r\n                        })\r\n                    break;\r\n                }\r\n                case 'url':\r\n                case 'img':\r\n                default: {\r\n                    const imgElement: HTMLImageElement =\r\n                        this._renderer.createElement('img');\r\n                    this._toDataURL(config)\r\n                        .then((dataUrl: string) => {\r\n                            if (operationId !== this._currentOperationId) {\r\n                                return;\r\n                            }\r\n\r\n                            if (this.alt) {\r\n                                imgElement.setAttribute('alt', this.alt);\r\n                            }\r\n                            if (this.ariaLabel) {\r\n                                imgElement.setAttribute('aria-label', this.ariaLabel);\r\n                            }\r\n                            imgElement.setAttribute('src', dataUrl);\r\n                            if (this.title) {\r\n                                imgElement.setAttribute('title', this.title);\r\n                            }\r\n                            this._renderElement(imgElement);\r\n                            this.emitQRCodeURL(imgElement);\r\n                        })\r\n                        .catch((e) => {\r\n                            console.error('img/url error:', e)\r\n                        });\r\n                }\r\n            }\r\n        } catch (e: FixMeLater) {\r\n            console.error('生成QRCode错误:', e.message);\r\n        }\r\n    }\r\n}","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MA+Ba,mBAAmB,CAAA;AAPhC,IAAA,WAAA,GAAA;QAQoB,IAAA,CAAA,gBAAgB,GAAY,KAAK;QACjC,IAAA,CAAA,QAAQ,GAAW,QAAQ;QAC3B,IAAA,CAAA,WAAW,GAAsB,QAAQ;QAElD,IAAA,CAAA,oBAAoB,GAA+B,GAAG;QAI7C,IAAA,CAAA,MAAM,GAAG,CAAC;QACV,IAAA,CAAA,MAAM,GAAG,EAAE;QACX,IAAA,CAAA,KAAK,GAAG,CAAC;QACT,IAAA,CAAA,OAAO,GAAW,CAAC;QACnB,IAAA,CAAA,KAAK,GAAG,EAAE;AAMhB,QAAA,IAAA,CAAA,SAAS,GAAG,IAAI,YAAY,EAAW;QAI1C,IAAA,CAAA,OAAO,GAAoC,IAAI;AAE9C,QAAA,IAAA,CAAA,SAAS,GAAG,MAAM,CAAC,SAAS,CAAC;AAC7B,QAAA,IAAA,CAAA,UAAU,GAAG,MAAM,CAAC,YAAY,CAAC;QACjC,IAAA,CAAA,mBAAmB,GAAG,CAAC;AAmSlC;IAjSG,WAAW,GAAA;QACP,IAAI,CAAC,aAAa,EAAE;;AAGxB,IAAA,2BAA2B,CAAC,cAAsB,EAAA;;QAE9C,MAAM,KAAK,GAAG,cAAc,CAAC,KAAK,CAAC,UAAU,CAAC;;AAE9C,QAAA,MAAM,SAAS,GAAG,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;;QAExC,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;;QAElC,MAAM,UAAU,GAAG,IAAI,UAAU,CAAC,WAAW,CAAC,MAAM,CAAC;;AAErD,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,EAAE,CAAC,EAAE;YACzC,UAAU,CAAC,CAAC,CAAC,GAAG,WAAW,CAAC,UAAU,CAAC,CAAC,CAAC;;;AAG7C,QAAA,OAAO,IAAI,IAAI,CAAC,CAAC,UAAU,CAAC,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC;;AAGtD,IAAA,aAAa,CAAC,OAA6D,EAAA;AACvE,QAAA,MAAM,SAAS,GAAG,OAAO,CAAC,WAAW,CAAC,IAAI;AAC1C,QAAA,IAAI,SAAS,KAAK,aAAa,CAAC,IAAI,EAAE;AAClC,YAAA,MAAM,OAAO,GAAG,OAAO,CAAC,SAAS;AACjC,YAAA,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,CAAC,OAAO,CAAC,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC;YAC3D,MAAM,MAAM,GAAG,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC;YACxC,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,sBAAsB,CAAC,MAAM,CAAC;AACnE,YAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC;YACjC;;QAGJ,IAAI,QAAQ,GAAG,EAAE;AAEjB,QAAA,IAAI,SAAS,KAAK,iBAAiB,CAAC,IAAI,EAAE;AACtC,YAAA,QAAQ,GAAI,OAA6B,CAAC,SAAS,CAAC,WAAW,CAAC;;AAGpE,QAAA,IAAI,SAAS,KAAK,gBAAgB,CAAC,IAAI,EAAE;AACrC,YAAA,QAAQ,GAAI,OAA4B,CAAC,GAAG;;QAGhD,MAAM,QAAQ,GAAS,IAAI,CAAC,2BAA2B,CAAC,QAAQ,CAAC;QACjE,MAAM,OAAO,GAAG,GAAG,CAAC,eAAe,CAAC,QAAQ,CAAC;QAC7C,MAAM,YAAY,GAAG,IAAI,CAAC,UAAU,CAAC,sBAAsB,CAAC,OAAO,CAAC;AACpE,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,YAAY,CAAC;;AAE7B,IAAA,kBAAkB,CAAC,IAAmB,EAAA;AAC1C,QAAA,IAAI,IAAI,CAAC,gBAAgB,KAAK,KAAK,EAAE;AACjC,YAAA,OAAO,EACH,OAAO,IAAI,KAAK,WAAW;AAC3B,gBAAA,IAAI,KAAK,EAAE;AACX,gBAAA,IAAI,KAAK,MAAM;gBACf,IAAI,KAAK,IAAI,CAChB;;AAEL,QAAA,OAAO,EAAE,OAAO,IAAI,KAAK,WAAW,CAAC;;AAGjC,IAAA,UAAU,CAAC,YAAoC,EAAA;QACnD,OAAO,IAAI,OAAO,CACd,CACI,OAAwC,EACxC,MAAuC,KACvC;AACA,YAAA,SAAS,CACL,IAAI,CAAC,MAAM,EACX,YAAY,EACZ,CAAC,GAA6B,EAAE,GAAW,KAAI;gBAC3C,IAAI,GAAG,EAAE;oBACL,MAAM,CAAC,GAAG,CAAC;;qBACR;oBACH,OAAO,CAAC,GAAG,CAAC;;AAEpB,aAAC,CACJ;AACL,SAAC,CACJ;;IAGG,SAAS,CACb,MAAyB,EACzB,YAAoC,EAAA;QAEpC,OAAO,IAAI,OAAO,CACd,CACI,OAAwC,EACxC,MAAuC,KACvC;AACA,YAAA,QAAQ,CACJ,MAAM,EACN,IAAI,CAAC,MAAM,EACX,YAAY,EACZ,CAAC,KAA+B,KAAI;gBAChC,IAAI,KAAK,EAAE;oBACP,MAAM,CAAC,KAAK,CAAC;;qBACV;oBACH,OAAO,CAAC,SAAS,CAAC;;AAE1B,aAAC,CACJ;AACL,SAAC,CACJ;;AAGG,IAAA,MAAM,CAAC,YAAmC,EAAA;QAC9C,OAAO,IAAI,OAAO,CACd,CACI,OAAwC,EACxC,MAAuC,KACvC;AACA,YAAA,QAAQ,CACJ,IAAI,CAAC,MAAM,EACX,YAAY,EACZ,CAAC,GAA6B,EAAE,GAAW,KAAI;gBAC3C,IAAI,GAAG,EAAE;oBACL,MAAM,CAAC,GAAG,CAAC;;qBACR;oBACH,OAAO,CAAC,GAAG,CAAC;;AAEpB,aAAC,CACJ;AACL,SAAC,CACJ;;AAGG,IAAA,cAAc,CAAC,OAAgB,EAAA;QACnC,KAAK,MAAM,IAAI,IAAI,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,EAAE;AACzD,YAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,IAAI,CAAC;;AAGnE,QAAA,IAAI,CAAC,SAAS,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,aAAa,EAAE,OAAO,CAAC;;IAI9D,aAAa,GAAA;AACjB,QAAA,MAAM,WAAW,GAAG,EAAE,IAAI,CAAC,mBAAmB;AAE9C,QAAA,IAAI;YACA,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE;AACvC,gBAAA,MAAM,IAAI,KAAK,CACX,qDAAqD,CACxD;;AAGL,YAAA,IAAI,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,MAAM,KAAK,EAAE,EAAE;AAC5D,gBAAA,IAAI,CAAC,MAAM,GAAG,GAAG;;AAGrB,YAAA,MAAM,MAAM,GAAqB;gBAC7B,oBAAoB,EAAE,IAAI,CAAC,oBAAoB;gBAC/C,MAAM,EAAE,IAAI,CAAC,MAAM;gBACnB,KAAK,EAAE,IAAI,CAAC,KAAK;gBACjB,OAAO,EAAE,IAAI,CAAC,OAAO;gBACrB,KAAK,EAAE,IAAI,CAAC,KAAK;aACpB;AAED,YAAA,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ;AACpC,YAAA,MAAM,iBAAiB,GAAG,IAAI,CAAC,WAAW,IAAI,EAAE;AAChD,YAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,UAAU,IAAI,EAAE;AAE9C,YAAA,QAAQ,IAAI,CAAC,WAAW;gBACpB,KAAK,QAAQ,EAAE;oBACX,MAAM,aAAa,GACf,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,QAAQ,CAAC;oBAC1C,IAAI,CAAC,OAAO,GAAG,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC;AAC7C,oBAAA,IAAI,CAAC,SAAS,CAAC,aAAa,EAAE,MAAM;yBAC/B,IAAI,CAAC,MAAK;AACP,wBAAA,IAAI,WAAW,KAAK,IAAI,CAAC,mBAAmB,EAAE;AAC1C,4BAAA,OAAO;;AAGX,wBAAA,IAAI,IAAI,CAAC,SAAS,EAAE;AAChB,4BAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CACvB,aAAa,EACb,YAAY,EACZ,GAAG,IAAI,CAAC,SAAS,CAAA,CAAE,CACtB;;AAEL,wBAAA,IAAI,IAAI,CAAC,KAAK,EAAE;AACZ,4BAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CACvB,aAAa,EACb,OAAO,EACP,GAAG,IAAI,CAAC,KAAK,CAAA,CAAE,CAClB;;AAGL,wBAAA,IAAI,cAAc,IAAI,IAAI,CAAC,OAAO,EAAE;4BAChC,IAAI,CAAC,YAAY,GAAG,IAAI,KAAK,CACzB,gBAAgB,EAChB,iBAAiB,CACpB;4BAED,IAAI,cAAc,KAAK,IAAI,CAAC,YAAY,CAAC,GAAG,EAAE;AAC1C,gCAAA,IAAI,CAAC,YAAY,CAAC,WAAW,GAAG,WAAW;AAC3C,gCAAA,IAAI,CAAC,YAAY,CAAC,GAAG,GAAG,cAAc;;4BAG1C,IAAI,iBAAiB,KAAK,IAAI,CAAC,YAAY,CAAC,MAAM,EAAE;AAChD,gCAAA,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,iBAAiB;;4BAGhD,IAAI,gBAAgB,KAAK,IAAI,CAAC,YAAY,CAAC,KAAK,EAAE;AAC9C,gCAAA,IAAI,CAAC,YAAY,CAAC,KAAK,GAAG,gBAAgB;;AAG9C,4BAAA,MAAM,WAAW,GAAG,IAAI,CAAC,YAAY;4BAErC,IAAI,WAAW,EAAE;AACb,gCAAA,WAAW,CAAC,MAAM,GAAG,MAAW;AAC5B,oCAAA,IAAI,WAAW,KAAK,IAAI,CAAC,mBAAmB,EAAE;AAC1C,wCAAA,IAAI,CAAC,OAAO,EAAE,SAAS,CACnB,WAAW,EACX,aAAa,CAAC,KAAK,GAAG,CAAC,GAAG,gBAAgB,GAAG,CAAC,EAC9C,aAAa,CAAC,MAAM,GAAG,CAAC,GAAG,iBAAiB,GAAG,CAAC,EAChD,gBAAgB,EAChB,iBAAiB,CACpB;;AAET,iCAAC;;;AAIT,wBAAA,IAAI,CAAC,cAAc,CAAC,aAAa,CAAC;AAClC,wBAAA,IAAI,CAAC,aAAa,CAAC,aAAa,CAAC;AACrC,qBAAC;AACA,yBAAA,KAAK,CAAC,CAAC,CAAC,KAAI;AACT,wBAAA,OAAO,CAAC,KAAK,CAAC,eAAe,EAAE,CAAC,CAAC;AACrC,qBAAC,CAAC;oBACN;;gBAEJ,KAAK,KAAK,EAAE;oBACR,MAAM,gBAAgB,GAClB,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,KAAK,CAAC;AACvC,oBAAA,IAAI,CAAC,MAAM,CAAC,MAAM;AACb,yBAAA,IAAI,CAAC,CAAC,SAAiB,KAAI;AACxB,wBAAA,IAAI,WAAW,KAAK,IAAI,CAAC,mBAAmB,EAAE;4BAC1C;;wBAGJ,IAAI,CAAC,SAAS,CAAC,WAAW,CACtB,gBAAgB,EAChB,WAAW,EACX,SAAS,CACZ;AACD,wBAAA,MAAM,UAAU,GAAG,gBAAgB,CAAC,UAA2B;AAC/D,wBAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,UAAU,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA,CAAE,CAAC;AAClE,wBAAA,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,UAAU,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA,CAAE,CAAC;AACjE,wBAAA,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;AAC/B,wBAAA,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;AAClC,qBAAC;AACA,yBAAA,KAAK,CAAC,CAAC,CAAC,KAAI;AACT,wBAAA,OAAO,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC;AAClC,qBAAC,CAAC;oBACN;;AAEJ,gBAAA,KAAK,KAAK;AACV,gBAAA,KAAK,KAAK;gBACV,SAAS;oBACL,MAAM,UAAU,GACZ,IAAI,CAAC,SAAS,CAAC,aAAa,CAAC,KAAK,CAAC;AACvC,oBAAA,IAAI,CAAC,UAAU,CAAC,MAAM;AACjB,yBAAA,IAAI,CAAC,CAAC,OAAe,KAAI;AACtB,wBAAA,IAAI,WAAW,KAAK,IAAI,CAAC,mBAAmB,EAAE;4BAC1C;;AAGJ,wBAAA,IAAI,IAAI,CAAC,GAAG,EAAE;4BACV,UAAU,CAAC,YAAY,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC;;AAE5C,wBAAA,IAAI,IAAI,CAAC,SAAS,EAAE;4BAChB,UAAU,CAAC,YAAY,CAAC,YAAY,EAAE,IAAI,CAAC,SAAS,CAAC;;AAEzD,wBAAA,UAAU,CAAC,YAAY,CAAC,KAAK,EAAE,OAAO,CAAC;AACvC,wBAAA,IAAI,IAAI,CAAC,KAAK,EAAE;4BACZ,UAAU,CAAC,YAAY,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC;;AAEhD,wBAAA,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;AAC/B,wBAAA,IAAI,CAAC,aAAa,CAAC,UAAU,CAAC;AAClC,qBAAC;AACA,yBAAA,KAAK,CAAC,CAAC,CAAC,KAAI;AACT,wBAAA,OAAO,CAAC,KAAK,CAAC,gBAAgB,EAAE,CAAC,CAAC;AACtC,qBAAC,CAAC;;;;QAGhB,OAAO,CAAa,EAAE;YACpB,OAAO,CAAC,KAAK,CAAC,aAAa,EAAE,CAAC,CAAC,OAAO,CAAC;;;8GA3TtC,mBAAmB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAnB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,mBAAmB,6nBAHlB,4CAA4C,EAAA,QAAA,EAAA,IAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAG7C,mBAAmB,EAAA,UAAA,EAAA,CAAA;kBAP/B,SAAS;AAAC,YAAA,IAAA,EAAA,CAAA;AACP,oBAAA,QAAQ,EAAE,aAAa;oBACvB,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;AAC/C,oBAAA,QAAQ,EAAE,4CAA4C;AACtD,oBAAA,QAAQ,EAAE,YAAY;AACzB,iBAAA;8BAEmB,gBAAgB,EAAA,CAAA;sBAA/B;gBACe,QAAQ,EAAA,CAAA;sBAAvB;gBACe,WAAW,EAAA,CAAA;sBAA1B;gBAEM,oBAAoB,EAAA,CAAA;sBAD1B;gBAEe,QAAQ,EAAA,CAAA;sBAAvB;gBACe,WAAW,EAAA,CAAA;sBAA1B;gBACe,UAAU,EAAA,CAAA;sBAAzB;gBACe,MAAM,EAAA,CAAA;sBAArB;gBACe,MAAM,EAAA,CAAA;sBAArB;gBACe,KAAK,EAAA,CAAA;sBAApB;gBACe,OAAO,EAAA,CAAA;sBAAtB;gBACe,KAAK,EAAA,CAAA;sBAApB;gBAEe,GAAG,EAAA,CAAA;sBAAlB;gBACe,SAAS,EAAA,CAAA;sBAAxB;gBACe,KAAK,EAAA,CAAA;sBAApB;gBAES,SAAS,EAAA,CAAA;sBAAlB;gBAEiD,UAAU,EAAA,CAAA;sBAA3D,SAAS;AAAC,gBAAA,IAAA,EAAA,CAAA,YAAY,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;;ACpD7C;;AAEG;;;;"}

package/fesm2022/cmat-components-rating.mjs

@@ -159,10 +159,10 @@ class CmatRatingComponent {
             this.value = this.currentValue;
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatRatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: CmatRatingComponent, isStandalone: true, selector: "cmat-rating", inputs: { id: "id", stars: "stars", readonly: "readonly", hover: "hover", half: "half", color: "color", showMode: "showMode", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatRatingComponent }], viewQueries: [{ propertyName: "_ratingElementRef", first: true, predicate: ["rating"], descendants: true }], exportAs: ["cmatRating"], usesOnChanges: true, ngImport: i0, template: "<div #rating class=\"flex\" [class.cmat-rating-readonly]=\"readonly||disabled\" [ngClass]=\"{'flex-col':showMode==='vertical','flex-row':showMode==='horizontal'}\"\r\n  (focus)=\"onFocus()\" (mouseleave)=\"onMouseleave()\">\r\n  @for (star of starArray; track $index; let i = $index) {\r\n  <div class=\"cmat-rating-item\">\r\n    @if (half) {\r\n    <div role=\"presentation\" class=\"cmat-rating-half\" [ngStyle]=\"{'opacity': isIn(i)?1:0}\" (focus)=\"onFocus()\"\r\n      (mouseover)=\"onMouseover($event, i, true)\" (click)=\"onClick($event, i, true)\">\r\n      <mat-icon [ngClass]=\"{'text-current': !color}\" [color]=\"color\"\r\n        [svgIcon]=\"'mat_outline:'+((!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n    }\r\n    <div role=\"presentation\" (mouseover)=\"onMouseover($event, i)\" (click)=\"onClick($event, i)\" (focus)=\"onFocus()\">\r\n      <mat-icon [color]=\"color\" [ngClass]=\"{'text-current': !color}\"\r\n        [svgIcon]=\"'mat_outline:'+((half && isIn(i)) || (!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n  </div>\r\n  }\r\n</div>", styles: ["cmat-rating{display:flex;align-items:center}cmat-rating .cmat-rating-item{position:relative;cursor:pointer;line-height:0}cmat-rating .cmat-rating-item div{display:inline-block;font-size:1rem;padding:0 .1rem}cmat-rating .cmat-rating-item .cmat-rating-half{position:absolute;top:0;left:0;width:45%;z-index:10;opacity:0;overflow:hidden;padding-right:0}cmat-rating .cmat-rating-readonly .cmat-rating-item{cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatRatingComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CmatRatingComponent, isStandalone: true, selector: "cmat-rating", inputs: { id: "id", stars: "stars", readonly: "readonly", hover: "hover", half: "half", color: "color", showMode: "showMode", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatRatingComponent }], viewQueries: [{ propertyName: "_ratingElementRef", first: true, predicate: ["rating"], descendants: true }], exportAs: ["cmatRating"], usesOnChanges: true, ngImport: i0, template: "<div #rating class=\"flex\" [class.cmat-rating-readonly]=\"readonly||disabled\" [ngClass]=\"{'flex-col':showMode==='vertical','flex-row':showMode==='horizontal'}\"\r\n  (focus)=\"onFocus()\" (mouseleave)=\"onMouseleave()\">\r\n  @for (star of starArray; track $index; let i = $index) {\r\n  <div class=\"cmat-rating-item\">\r\n    @if (half) {\r\n    <div role=\"presentation\" class=\"cmat-rating-half\" [ngStyle]=\"{'opacity': isIn(i)?1:0}\" (focus)=\"onFocus()\"\r\n      (mouseover)=\"onMouseover($event, i, true)\" (click)=\"onClick($event, i, true)\">\r\n      <mat-icon [ngClass]=\"{'text-current': !color}\" [color]=\"color\"\r\n        [svgIcon]=\"'mat_outline:'+((!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n    }\r\n    <div role=\"presentation\" (mouseover)=\"onMouseover($event, i)\" (click)=\"onClick($event, i)\" (focus)=\"onFocus()\">\r\n      <mat-icon [color]=\"color\" [ngClass]=\"{'text-current': !color}\"\r\n        [svgIcon]=\"'mat_outline:'+((half && isIn(i)) || (!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n  </div>\r\n  }\r\n</div>", styles: ["cmat-rating{display:flex;align-items:center}cmat-rating .cmat-rating-item{position:relative;cursor:pointer;line-height:0}cmat-rating .cmat-rating-item div{display:inline-block;font-size:1rem;padding:0 .1rem}cmat-rating .cmat-rating-item .cmat-rating-half{position:absolute;top:0;left:0;width:45%;z-index:10;opacity:0;overflow:hidden;padding-right:0}cmat-rating .cmat-rating-readonly .cmat-rating-item{cursor:not-allowed}\n"], dependencies: [{ kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatRatingComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatRatingComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-rating', providers: [{ provide: MatFormFieldControl, useExisting: CmatRatingComponent }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatRating', imports: [MatIconModule, NgStyle, NgClass], template: "<div #rating class=\"flex\" [class.cmat-rating-readonly]=\"readonly||disabled\" [ngClass]=\"{'flex-col':showMode==='vertical','flex-row':showMode==='horizontal'}\"\r\n  (focus)=\"onFocus()\" (mouseleave)=\"onMouseleave()\">\r\n  @for (star of starArray; track $index; let i = $index) {\r\n  <div class=\"cmat-rating-item\">\r\n    @if (half) {\r\n    <div role=\"presentation\" class=\"cmat-rating-half\" [ngStyle]=\"{'opacity': isIn(i)?1:0}\" (focus)=\"onFocus()\"\r\n      (mouseover)=\"onMouseover($event, i, true)\" (click)=\"onClick($event, i, true)\">\r\n      <mat-icon [ngClass]=\"{'text-current': !color}\" [color]=\"color\"\r\n        [svgIcon]=\"'mat_outline:'+((!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n    }\r\n    <div role=\"presentation\" (mouseover)=\"onMouseover($event, i)\" (click)=\"onClick($event, i)\" (focus)=\"onFocus()\">\r\n      <mat-icon [color]=\"color\" [ngClass]=\"{'text-current': !color}\"\r\n        [svgIcon]=\"'mat_outline:'+((half && isIn(i)) || (!value || i >= value)?'star_border':'star')\">\r\n      </mat-icon>\r\n    </div>\r\n  </div>\r\n  }\r\n</div>", styles: ["cmat-rating{display:flex;align-items:center}cmat-rating .cmat-rating-item{position:relative;cursor:pointer;line-height:0}cmat-rating .cmat-rating-item div{display:inline-block;font-size:1rem;padding:0 .1rem}cmat-rating .cmat-rating-item .cmat-rating-half{position:absolute;top:0;left:0;width:45%;z-index:10;opacity:0;overflow:hidden;padding-right:0}cmat-rating .cmat-rating-readonly .cmat-rating-item{cursor:not-allowed}\n"] }]
         }], ctorParameters: () => [], propDecorators: { id: [{

package/fesm2022/cmat-components-select-search.mjs

@@ -38,10 +38,10 @@ const configurableDefaultOptions = [
 const MAT_SELECTSEARCH_DEFAULT_OPTIONS = new InjectionToken('mat-selectsearch-default-options');
 
 class CmatSelectNoEntriesFoundDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectNoEntriesFoundDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.4", type: CmatSelectNoEntriesFoundDirective, isStandalone: true, selector: "[cmatSelectNoEntriesFound]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectNoEntriesFoundDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: CmatSelectNoEntriesFoundDirective, isStandalone: true, selector: "[cmatSelectNoEntriesFound]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectNoEntriesFoundDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectNoEntriesFoundDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[cmatSelectNoEntriesFound]'
@@ -49,10 +49,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImpor
         }] });
 
 class CmatSelectSearchClearDirective {
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectSearchClearDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
-    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.4", type: CmatSelectSearchClearDirective, isStandalone: true, selector: "[cmatSelectSearchClear]", ngImport: i0 }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectSearchClearDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
+    static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.7", type: CmatSelectSearchClearDirective, isStandalone: true, selector: "[cmatSelectSearchClear]", ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectSearchClearDirective, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectSearchClearDirective, decorators: [{
             type: Directive,
             args: [{
                     selector: '[cmatSelectSearchClear]'
@@ -423,8 +423,8 @@ class CmatSelectSearchComponent {
             }
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: CmatSelectSearchComponent, isStandalone: true, selector: "cmat-select-search", inputs: { placeholderLabel: "placeholderLabel", type: "type", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", clearSearchInput: "clearSearchInput", searching: "searching", disableInitialFocus: "disableInitialFocus", enableClearOnEscapePressed: "enableClearOnEscapePressed", preventHomeEndKeyPropagation: "preventHomeEndKeyPropagation", disableScrollToActiveOnOptionsChanged: "disableScrollToActiveOnOptionsChanged", ariaLabel: "ariaLabel", showToggleAllCheckbox: "showToggleAllCheckbox", toggleAllCheckboxChecked: "toggleAllCheckboxChecked", toggleAllCheckboxIndeterminate: "toggleAllCheckboxIndeterminate", toggleAllCheckboxTooltipMessage: "toggleAllCheckboxTooltipMessage", toggleAllCheckboxTooltipPosition: "toggleAllCheckboxTooltipPosition", hideClearSearchButton: "hideClearSearchButton", alwaysRestoreSelectedOptionsMulti: "alwaysRestoreSelectedOptionsMulti" }, outputs: { toggleAll: "toggleAll" }, host: { properties: { "class.cmat-select-search-inside-mat-option": "this.isInsideMatOption" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CmatSelectSearchComponent, isStandalone: true, selector: "cmat-select-search", inputs: { placeholderLabel: "placeholderLabel", type: "type", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", clearSearchInput: "clearSearchInput", searching: "searching", disableInitialFocus: "disableInitialFocus", enableClearOnEscapePressed: "enableClearOnEscapePressed", preventHomeEndKeyPropagation: "preventHomeEndKeyPropagation", disableScrollToActiveOnOptionsChanged: "disableScrollToActiveOnOptionsChanged", ariaLabel: "ariaLabel", showToggleAllCheckbox: "showToggleAllCheckbox", toggleAllCheckboxChecked: "toggleAllCheckboxChecked", toggleAllCheckboxIndeterminate: "toggleAllCheckboxIndeterminate", toggleAllCheckboxTooltipMessage: "toggleAllCheckboxTooltipMessage", toggleAllCheckboxTooltipPosition: "toggleAllCheckboxTooltipPosition", hideClearSearchButton: "hideClearSearchButton", alwaysRestoreSelectedOptionsMulti: "alwaysRestoreSelectedOptionsMulti" }, outputs: { toggleAll: "toggleAll" }, host: { properties: { "class.cmat-select-search-inside-mat-option": "this.isInsideMatOption" } }, providers: [
             {
                 provide: NG_VALUE_ACCESSOR,
                 useExisting: forwardRef(() => CmatSelectSearchComponent),
@@ -432,7 +432,7 @@ class CmatSelectSearchComponent {
             }
         ], queries: [{ propertyName: "clearIcon", first: true, predicate: CmatSelectSearchClearDirective, descendants: true }, { propertyName: "noEntriesFound", first: true, predicate: CmatSelectNoEntriesFoundDirective, descendants: true }], viewQueries: [{ propertyName: "searchSelectInput", first: true, predicate: ["searchSelectInput"], descendants: true, read: ElementRef, static: true }, { propertyName: "innerSelectSearch", first: true, predicate: ["innerSelectSearch"], descendants: true, read: ElementRef, static: true }], exportAs: ["cmatSelectSearch"], ngImport: i0, template: "<input matInput class=\"cmat-select-search-input cmat-select-search-hidden\" />\r\n\r\n<div #innerSelectSearch class=\"cmat-select-search-inner mat-typography mat-tab-header\"\r\n  [ngClass]=\"{'cmat-select-search-inner-multiple': matSelect.multiple, 'cmat-select-search-inner-toggle-all': isToggleAllCheckboxVisible() }\">\r\n\r\n  @if (isToggleAllCheckboxVisible()) {\r\n    <mat-checkbox class=\"cmat-select-search-toggle-all-checkbox -mr-4\"\r\n      matTooltipClass=\"cmat-select-search-toggle-all-tooltip\" [color]=\"matFormField?.color\"\r\n      [checked]=\"toggleAllCheckboxChecked\" [indeterminate]=\"toggleAllCheckboxIndeterminate\"\r\n      [matTooltip]=\"toggleAllCheckboxTooltipMessage\" [matTooltipPosition]=\"toggleAllCheckboxTooltipPosition\"\r\n      (change)=\"emitSelectAllBooleanToParent($event.checked)\">\r\n    </mat-checkbox>\r\n  }\r\n  <span matPrefix class=\"flex flex-col justify-center pl-2\">\r\n    <mat-icon class=\"cmat-select-search-icon\" color=\"primary\" svgIcon=\"heroicons_outline:magnifying-glass\"></mat-icon>\r\n  </span>\r\n  <input #searchSelectInput matInput class=\"cmat-select-search-input cmat-input-element\" autocomplete=\"off\"\r\n    [type]=\"type\" [formControl]=\"formControl\" [placeholder]=\"placeholderLabel\" [attr.aria-label]=\"ariaLabel\"\r\n    (keydown)=\"handleKeydown($event)\" (keyup)=\"handleKeyup($event)\" (blur)=\"onBlur()\" />\r\n    @if (searching) {\r\n      <mat-spinner class=\"cmat-select-search-spinner\" diameter=\"16\"></mat-spinner>\r\n    }\r\n\r\n    @if (!hideClearSearchButton && value && !searching) {\r\n      <button type=\"button\" matIconButton  aria-label=\"Clear\"\r\n        class=\"cmat-select-search-clear\" (click)=\"reset(true)\">\r\n        @if (clearIcon) {\r\n          <ng-content select=\"[cmatSelectSearchClear]\"></ng-content>\r\n        } @else {\r\n          <mat-icon svgIcon=\"mat_outline:close\"></mat-icon>\r\n        }\r\n      </button>\r\n    }\r\n\r\n    <ng-content select=\".cmat-select-search-custom-header-content\"></ng-content>\r\n  </div>\r\n\r\n  @if (showNoEntriesFound$ | async) {\r\n    <div class=\"cmat-select-search-no-entries-found\">\r\n      @if (noEntriesFound) {\r\n        <ng-content select=\"[cmatSelectNoEntriesFound]\"></ng-content>\r\n      } @else {\r\n        {{noEntriesFoundLabel}}\r\n      }\r\n    </div>\r\n  }", styles: ["cmat-select-search .cmat-select-search-hidden{visibility:hidden}cmat-select-search .cmat-select-search-inner{position:absolute;top:0;left:0;width:100%;z-index:100;font-size:inherit;box-shadow:none;display:flex;border-bottom-width:1px;border-bottom-style:solid}cmat-select-search .cmat-select-search-inner.cmat-select-search-inner-multiple.cmat-select-search-inner-toggle-all{display:flex;align-items:center}cmat-select-search .cmat-select-search-inner .cmat-input-element{flex-basis:auto;vertical-align:middle!important}cmat-select-search .cmat-select-search-input{box-sizing:border-box;width:100%;border:none;font-family:inherit;font-size:inherit;color:currentColor;outline:none;background:none;padding:0 44px 0 16px;height:47px;line-height:47px}:host-context([dir=rtl]) cmat-select-search .cmat-select-search-input{padding-right:16px;padding-left:44px}cmat-select-search .cmat-select-search-no-entries-found{padding-top:8px}cmat-select-search .cmat-select-search-clear{position:absolute;right:4px;top:5px}:host-context([dir=rtl]) cmat-select-search .cmat-select-search-clear{right:auto;left:4px}cmat-select-search .cmat-select-search-spinner{position:absolute;right:16px;top:calc(50% - 8px)}:host-context([dir=rtl]) cmat-select-search .cmat-select-search-spinner{right:auto;left:16px}cmat-select-search .cmat-select-search-toggle-all-checkbox{padding-left:5px;padding-bottom:2px}:host-context([dir=rtl]) cmat-select-search .cmat-select-search-toggle-all-checkbox{padding-left:0;padding-right:5px}cmat-select-search .cmat-select-search-toggle-all-checkbox .mdc-checkbox{opacity:1!important}.mat-mdc-option[aria-disabled=true].contains-cmat-select-search{position:sticky;top:0;z-index:1;opacity:1;pointer-events:all;background:var(--mat-select-panel-background-color)}.mat-mdc-option[aria-disabled=true].contains-cmat-select-search .mat-icon{margin-right:0;margin-left:0}.mat-mdc-option[aria-disabled=true].contains-cmat-select-search mat-pseudo-checkbox{display:none}.mat-mdc-option[aria-disabled=true].contains-cmat-select-search .mdc-list-item__primary-text{opacity:1}.mat-mdc-option[aria-disabled=true].contains-cmat-select-search.cmat-select-search-no-entries-found{height:96px}.cmat-select-search-panel{transform:none!important;overflow-x:hidden;position:relative;padding:0!important}\n"], dependencies: [{ kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i1.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "directive", type: i1.MatPrefix, selector: "[matPrefix], [matIconPrefix], [matTextPrefix]", inputs: ["matTextPrefix"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatCheckboxModule }, { kind: "component", type: i2.MatCheckbox, selector: "mat-checkbox", inputs: ["aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-owns", "id", "required", "labelPosition", "name", "value", "disableRipple", "tabIndex", "color", "disabledInteractive", "checked", "disabled", "indeterminate"], outputs: ["change", "indeterminateChange"], exportAs: ["matCheckbox"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i4.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i5.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i5.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i5.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: MatProgressSpinnerModule }, { kind: "component", type: i6.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "mode", "value", "diameter", "strokeWidth"], exportAs: ["matProgressSpinner"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i7.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectSearchComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectSearchComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-search', providers: [
                         {

package/fesm2022/cmat-components-select-table.mjs

@@ -573,10 +573,10 @@ class CmatSelectTableComponent {
             this.resetOptionAction();
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.4", type: CmatSelectTableComponent, isStandalone: true, selector: "cmat-select-table", inputs: { id: "id", dataSource: "dataSource", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", multiple: "multiple", overallSearchEnabled: "overallSearchEnabled", overallSearchVisible: "overallSearchVisible", resetSortOnOpen: "resetSortOnOpen", resetFiltersOnOpen: "resetFiltersOnOpen", customTriggerLabelFn: "customTriggerLabelFn", triggerLabelSort: "triggerLabelSort", customTriggerLabelTemplate: "customTriggerLabelTemplate", canNull: "canNull", defaultSort: "defaultSort", resetOptionAction: "resetOptionAction", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { closed: "closed" }, host: { listeners: { "document:click": "clickedOut()" }, properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], viewQueries: [{ propertyName: "_matSelectSearch", first: true, predicate: CmatSelectSearchComponent, descendants: true }, { propertyName: "_sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "_table", first: true, predicate: MatTable, descendants: true }, { propertyName: "matSelect", first: true, predicate: ["componentSelect"], descendants: true }, { propertyName: "_matOptions", predicate: MatOption, descendants: true }], exportAs: ["cmatSelectTable"], usesOnChanges: true, ngImport: i0, template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple\r\n    panelClass=\"cmat-select-search-table-panel overflow-hidden\"\r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareObjects\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState}\" (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource\">\r\n            @for (columnKey of tableColumns; track $index) {\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!tableColumnsMap.get(columnKey)?.sortable\">\r\n                    @if(!tableColumnsMap.get(columnKey)?.sortable){\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }@else {\r\n                    @switch (tableColumnsMap.get(columnKey)?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    {{row[columnKey]}}\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns; sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns;\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple\r\n    panelClass=\"cmat-select-search-table-panel overflow-hidden\"\r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareObjects\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState}\" (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource\">\r\n            @for (columnKey of tableColumns; track $index) {\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                        <mat-option></mat-option>\r\n                    }@else {\r\n                        <mat-option [value]=\"row\"></mat-option>\r\n                    }                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!tableColumnsMap.get(columnKey)?.sortable\">\r\n                    @if(!tableColumnsMap.get(columnKey)?.sortable){\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }@else {\r\n                    @switch (tableColumnsMap.get(columnKey)?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"addNullRow() && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: addNullRow() && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    {{addNullRow() && row.id === null && $index === 1 ? '\u7A7A' : row[columnKey]}}\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns; sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns;\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"], dependencies: [{ kind: "component", type: CmatSelectSearchComponent, selector: "cmat-select-search", inputs: ["placeholderLabel", "type", "noEntriesFoundLabel", "showNoFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"], exportAs: ["cmatSelectSearch"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i8.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i8.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: CmatDigitOnlyDirective, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CmatSelectTableComponent, isStandalone: true, selector: "cmat-select-table", inputs: { id: "id", dataSource: "dataSource", noEntriesFoundLabel: "noEntriesFoundLabel", showNoFoundLabel: "showNoFoundLabel", multiple: "multiple", overallSearchEnabled: "overallSearchEnabled", overallSearchVisible: "overallSearchVisible", resetSortOnOpen: "resetSortOnOpen", resetFiltersOnOpen: "resetFiltersOnOpen", customTriggerLabelFn: "customTriggerLabelFn", triggerLabelSort: "triggerLabelSort", customTriggerLabelTemplate: "customTriggerLabelTemplate", canNull: "canNull", defaultSort: "defaultSort", resetOptionAction: "resetOptionAction", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { closed: "closed" }, host: { listeners: { "document:click": "clickedOut()" }, properties: { "attr.id": "this.id" } }, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], viewQueries: [{ propertyName: "_matSelectSearch", first: true, predicate: CmatSelectSearchComponent, descendants: true }, { propertyName: "_sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "_table", first: true, predicate: MatTable, descendants: true }, { propertyName: "matSelect", first: true, predicate: ["componentSelect"], descendants: true }, { propertyName: "_matOptions", predicate: MatOption, descendants: true }], exportAs: ["cmatSelectTable"], usesOnChanges: true, ngImport: i0, template: "@if(multiple){\r\n<mat-select #componentSelect multiple disableRipple\r\n    panelClass=\"cmat-select-search-table-panel overflow-hidden\"\r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareObjects\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState}\" (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource\">\r\n            @for (columnKey of tableColumns; track $index) {\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell [ngClass]=\"{selection: true, hidden: !multiple}\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell [ngClass]=\"{selection: true, hidden: !multiple}\">\r\n                    <mat-option [value]=\"row\"></mat-option>\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!tableColumnsMap.get(columnKey)?.sortable\">\r\n                    @if(!tableColumnsMap.get(columnKey)?.sortable){\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }@else {\r\n                    @switch (tableColumnsMap.get(columnKey)?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell>\r\n                    {{row[columnKey]}}\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns; sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns;\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}@else {\r\n<mat-select #componentSelect disableRipple\r\n    panelClass=\"cmat-select-search-table-panel overflow-hidden\"\r\n    [placeholder]=\"placeholder\" [required]=\"required\" [formControl]=\"selectControl\" [compareWith]=\"compareObjects\"\r\n    (focusin)=\"onFocusIn()\" (openedChange)=\"openedChange($event)\">\r\n    <mat-select-trigger>\r\n        @if(!customTriggerLabelFn){\r\n        {{simpleTriggerLabelFn(completeRowList)}}\r\n        }@else {\r\n        {{customTriggerLabelFn(completeRowList)}}\r\n        }\r\n    </mat-select-trigger>\r\n\r\n    <div class=\"h-full overflow-y-auto scrollbar-custom\" [ngClass]=\"{'hidden-header': overallSearchVisibleState}\" (focusout)=\"onFocusOut($event)\">\r\n        @if(overallSearchEnabled){\r\n        <mat-option [ngClass]=\"{'hidden':!overallSearchVisibleState === true}\">\r\n            <cmat-select-search [showNoFoundLabel]=\"showNoFoundLabel\" [noEntriesFoundLabel]=\"noEntriesFoundLabel\"\r\n                [formControl]=\"overallFilterControl\" [clearSearchInput]=\"resetFiltersOnOpen\">\r\n            </cmat-select-search>\r\n        </mat-option>\r\n\r\n        <div class=\"overall-search-toggle\" [ngStyle]=\"{ height: overallSearchVisibleState ? '48px' : '55.4px' }\">\r\n            <mat-icon color=\"primary\"\r\n                [svgIcon]=\"overallSearchVisibleState ? 'mat_outline:arrow_back' : 'mat_outline:search'\"\r\n                (click)=\"toggleOverallSearch()\">\r\n            </mat-icon>\r\n        </div>\r\n        }\r\n        <table #table mat-table matSort [dataSource]=\"tableDataSource\">\r\n            @for (columnKey of tableColumns; track $index) {\r\n            @switch (columnKey) {\r\n            @case ('_selection') {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell class=\"selection\"></th>\r\n                <td *matCellDef=\"let row\" mat-cell class=\"selection\">\r\n                    @if(row.id===null){\r\n                        <mat-option></mat-option>\r\n                    }@else {\r\n                        <mat-option [value]=\"row\"></mat-option>\r\n                    }                    \r\n                </td>\r\n            </ng-container>\r\n            }\r\n            @default {\r\n            <ng-container [matColumnDef]=\"columnKey\">\r\n                <th *matHeaderCellDef mat-header-cell mat-sort-header\r\n                    [disabled]=\"!tableColumnsMap.get(columnKey)?.sortable\">\r\n                    @if(!tableColumnsMap.get(columnKey)?.sortable){\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }@else {\r\n                    @switch (tableColumnsMap.get(columnKey)?.filter?.type) {\r\n                    @case ('string') {\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeString\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @case('number'){\r\n                    <ng-container [ngTemplateOutlet]=\"filterTypeNumber\"\r\n                        [ngTemplateOutletContext]=\"{column: tableColumnsMap.get(columnKey)}\"></ng-container>\r\n                    }\r\n                    @default {\r\n                    <div>{{tableColumnsMap.get(columnKey)?.name}}</div>\r\n                    }\r\n                    }\r\n                    }\r\n                </th>\r\n                <td *matCellDef=\"let row\" mat-cell\r\n                    [colSpan]=\"addNullRow() && row.id === null && $index === 1 ? tableColumns.length : 1\"\r\n                    [ngStyle]=\"{display: addNullRow() && row.id === null && $index !== 1 ? 'none' : ''}\">\r\n                    {{addNullRow() && row.id === null && $index === 1 ? '\u7A7A' : row[columnKey]}}\r\n                </td>\r\n            </ng-container>\r\n            }\r\n            }\r\n            }\r\n\r\n            <tr *matHeaderRowDef=\"tableColumns; sticky: true\" mat-header-row></tr>\r\n            <tr *matRowDef=\"let row; columns: tableColumns;\" mat-row (click)=\"emulateMatOptionClick($event)\"></tr>\r\n        </table>\r\n    </div>\r\n</mat-select>\r\n}\r\n<ng-template #filterTypeString let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput [formControl]=\"filterFormControl(column.key)\" [placeholder]=\"column.name\"\r\n            (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>\r\n\r\n<ng-template #filterTypeNumber let-column='column'>\r\n    <mat-form-field class=\"filter\" (click)=\"$event.stopPropagation()\">\r\n        <input matInput cmatDigitOnly [min]=\"0\" [formControl]=\"filterFormControl(column.key)\"\r\n            [placeholder]=\"column.name\" (keydown)=\"$event.stopPropagation()\" (keyup)=\"$event.stopPropagation()\"\r\n            (keypress)=\"$event.stopPropagation()\" />\r\n    </mat-form-field>\r\n</ng-template>", styles: ["cmat-select-table{display:block;width:100%}.cmat-select-search-table-panel{min-width:max-content;max-width:100%;min-height:240px;padding-top:0!important}.cmat-select-search-table-panel .overall-search-toggle{z-index:102;display:flex;cursor:pointer;position:absolute;width:48px;height:48px;align-items:center;left:12px;top:0}.cmat-select-search-table-panel .hidden-header table thead{display:none}.cmat-select-search-table-panel table{width:100%}.cmat-select-search-table-panel table tr{cursor:pointer;height:48px;max-height:48px}.cmat-select-search-table-panel table tr mat-option{height:48px;max-height:48px}.cmat-select-search-table-panel table tr td{-webkit-user-select:none;user-select:none;border-bottom:0!important;box-shadow:inset 0 -1px var(--cmat-border)}.cmat-select-search-table-panel table tr th .mat-sort-header-container{height:55px}.cmat-select-search-table-panel table tr th .mat-sort-header-container mat-form-field .mat-form-field-infix{width:initial}.cmat-select-search-table-panel table tr th[aria-sort] .mat-sort-header-arrow{opacity:1!important}.cmat-select-search-table-panel table tr td mat-option,.cmat-select-search-table-panel table tr th mat-option{background:transparent!important}.cmat-select-search-table-panel table tr td.selection,.cmat-select-search-table-panel table tr th.selection{width:48px;padding:0;margin:0}.cmat-select-search-table-panel table tr:has(td:first-child mat-option[aria-selected=true]){background-color:var(--mat-option-hover-state-layer-color, color-mix(in srgb, var(--mat-sys-on-surface) calc(var(--mat-sys-hover-state-layer-opacity) * 100%), transparent))!important;color:rgba(var(--cmat-primary-rgb),1)!important}.cmat-select-search-table-panel .cmat-select-search-inner>span{visibility:hidden}\n"], dependencies: [{ kind: "component", type: CmatSelectSearchComponent, selector: "cmat-select-search", inputs: ["placeholderLabel", "type", "noEntriesFoundLabel", "showNoFoundLabel", "clearSearchInput", "searching", "disableInitialFocus", "enableClearOnEscapePressed", "preventHomeEndKeyPropagation", "disableScrollToActiveOnOptionsChanged", "ariaLabel", "showToggleAllCheckbox", "toggleAllCheckboxChecked", "toggleAllCheckboxIndeterminate", "toggleAllCheckboxTooltipMessage", "toggleAllCheckboxTooltipPosition", "hideClearSearchButton", "alwaysRestoreSelectedOptionsMulti"], outputs: ["toggleAll"], exportAs: ["cmatSelectSearch"] }, { kind: "ngmodule", type: MatFormFieldModule }, { kind: "component", type: i1.MatFormField, selector: "mat-form-field", inputs: ["hideRequiredMarker", "color", "floatLabel", "appearance", "subscriptSizing", "hintLabel"], exportAs: ["matFormField"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i2.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i2.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i2.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i3.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i4.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatTableModule }, { kind: "component", type: i6.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i6.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i6.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i6.MatColumnDef, selector: "[matColumnDef]", inputs: ["matColumnDef"] }, { kind: "directive", type: i6.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i6.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i6.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i6.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i6.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i6.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "ngmodule", type: MatInputModule }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl],      input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly", "disabledInteractive"], exportAs: ["matInput"] }, { kind: "ngmodule", type: MatSortModule }, { kind: "directive", type: i8.MatSort, selector: "[matSort]", inputs: ["matSortActive", "matSortStart", "matSortDirection", "matSortDisableClear", "matSortDisabled"], outputs: ["matSortChange"], exportAs: ["matSort"] }, { kind: "component", type: i8.MatSortHeader, selector: "[mat-sort-header]", inputs: ["mat-sort-header", "arrowPosition", "start", "disabled", "sortActionDescription", "disableClear"], exportAs: ["matSortHeader"] }, { kind: "directive", type: CmatDigitOnlyDirective, selector: "[cmatDigitOnly]", inputs: ["decimal", "decimalSeparator", "allowNegatives", "allowPaste", "negativeSign", "min", "max", "pattern"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.4", ngImport: i0, type: CmatSelectTableComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatSelectTableComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-select-table', exportAs: 'cmatSelectTable', changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [{ provide: MatFormFieldControl, useExisting: CmatSelectTableComponent }], imports: [CmatSelectSearchComponent, MatFormFieldModule, MatSelectModule, ReactiveFormsModule, CommonModule,
                         MatIconModule, MatTableModule, MatInputModule, MatSortModule, CmatDigitOnlyDirective