cax-design-system 2.8.0 → 2.8.1

package/fesm2022/cax-design-system-editor.mjs

@@ -238,13 +238,13 @@ class Editor {
         }
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Editor, deps: [{ token: i0.ElementRef }, { token: PLATFORM_ID }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: Editor, selector: "cax-editor", inputs: { style: "style", styleClass: "styleClass", placeholder: "placeholder", formats: "formats", modules: "modules", bounds: "bounds", scrollingContainer: "scrollingContainer", debug: "debug", readonly: "readonly" }, outputs: { onInit: "onInit", onTextChange: "onTextChange", onSelectionChange: "onSelectionChange" }, host: { classAttribute: "cax-element" }, providers: [EDITOR_VALUE_ACCESSOR], queries: [{ propertyName: "toolbar", first: true, predicate: Header, descendants: true }, { propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\n        <ng-content select=\"cax-header\"></ng-content>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </div>\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\n        <span class=\"ql-formats\">\n            <select class=\"ql-header\">\n                <option value=\"1\">Heading</option>\n                <option value=\"2\">Subheading</option>\n                <option selected>Normal</option>\n            </select>\n            <select class=\"ql-font\">\n                <option selected>Sans Serif</option>\n                <option value=\"serif\">Serif</option>\n                <option value=\"monospace\">Monospace</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <select class=\"ql-color\"></select>\n            <select class=\"ql-background\"></select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\n            <select class=\"ql-align\">\n                <option selected></option>\n                <option value=\"center\">center</option>\n                <option value=\"right\">right</option>\n                <option value=\"justify\">justify</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\n        </span>\n    </div>\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\n</div>", styles: [".cax-editor-container .cax-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item{width:auto;height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: Editor, selector: "cax-editor", inputs: { style: "style", styleClass: "styleClass", placeholder: "placeholder", formats: "formats", modules: "modules", bounds: "bounds", scrollingContainer: "scrollingContainer", debug: "debug", readonly: "readonly" }, outputs: { onInit: "onInit", onTextChange: "onTextChange", onSelectionChange: "onSelectionChange" }, host: { classAttribute: "cax-element" }, providers: [EDITOR_VALUE_ACCESSOR], queries: [{ propertyName: "toolbar", first: true, predicate: Header, descendants: true }, { propertyName: "templates", predicate: CaxTemplate }], ngImport: i0, template: "<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\r\n        <ng-content select=\"cax-header\"></ng-content>\r\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-header\">\r\n                <option value=\"1\">Heading</option>\r\n                <option value=\"2\">Subheading</option>\r\n                <option selected>Normal</option>\r\n            </select>\r\n            <select class=\"ql-font\">\r\n                <option selected>Sans Serif</option>\r\n                <option value=\"serif\">Serif</option>\r\n                <option value=\"monospace\">Monospace</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\r\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\r\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-color\"></select>\r\n            <select class=\"ql-background\"></select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\r\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\r\n            <select class=\"ql-align\">\r\n                <option selected></option>\r\n                <option value=\"center\">center</option>\r\n                <option value=\"right\">right</option>\r\n                <option value=\"justify\">justify</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\r\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\r\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\r\n        </span>\r\n    </div>\r\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\r\n</div>", styles: [".cax-editor-container .cax-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item{width:auto;height:auto}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Editor, decorators: [{
             type: Component,
             args: [{ selector: 'cax-editor', providers: [EDITOR_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, host: {
                         class: 'cax-element'
-                    }, template: "<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\n        <ng-content select=\"cax-header\"></ng-content>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </div>\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\n        <span class=\"ql-formats\">\n            <select class=\"ql-header\">\n                <option value=\"1\">Heading</option>\n                <option value=\"2\">Subheading</option>\n                <option selected>Normal</option>\n            </select>\n            <select class=\"ql-font\">\n                <option selected>Sans Serif</option>\n                <option value=\"serif\">Serif</option>\n                <option value=\"monospace\">Monospace</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <select class=\"ql-color\"></select>\n            <select class=\"ql-background\"></select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\n            <select class=\"ql-align\">\n                <option selected></option>\n                <option value=\"center\">center</option>\n                <option value=\"right\">right</option>\n                <option value=\"justify\">justify</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\n        </span>\n    </div>\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\n</div>", styles: [".cax-editor-container .cax-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item{width:auto;height:auto}\n"] }]
+                    }, template: "<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\r\n        <ng-content select=\"cax-header\"></ng-content>\r\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-header\">\r\n                <option value=\"1\">Heading</option>\r\n                <option value=\"2\">Subheading</option>\r\n                <option selected>Normal</option>\r\n            </select>\r\n            <select class=\"ql-font\">\r\n                <option selected>Sans Serif</option>\r\n                <option value=\"serif\">Serif</option>\r\n                <option value=\"monospace\">Monospace</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\r\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\r\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-color\"></select>\r\n            <select class=\"ql-background\"></select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\r\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\r\n            <select class=\"ql-align\">\r\n                <option selected></option>\r\n                <option value=\"center\">center</option>\r\n                <option value=\"right\">right</option>\r\n                <option value=\"justify\">justify</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\r\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\r\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\r\n        </span>\r\n    </div>\r\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\r\n</div>", styles: [".cax-editor-container .cax-editor-toolbar.ql-snow .ql-picker.ql-expanded .ql-picker-options .ql-picker-item{width:auto;height:auto}\n"] }]
         }], ctorParameters: () => [{ type: i0.ElementRef }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [PLATFORM_ID]

package/fesm2022/cax-design-system-editor.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-editor.mjs","sources":["../../src/app/components/editor/editor.ts","../../src/app/components/editor/editor.html","../../src/app/components/editor/editor.module.ts","../../src/app/components/editor/cax-design-system-editor.ts"],"sourcesContent":["import { CommonModule, isPlatformServer } from '@angular/common';\nimport {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChild,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Inject,\n    Input,\n    NgModule,\n    Output,\n    PLATFORM_ID,\n    QueryList,\n    TemplateRef,\n    ViewEncapsulation,\n    afterNextRender,\n    forwardRef\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Header, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { EditorInitEvent, EditorSelectionChangeEvent, EditorTextChangeEvent } from './editor.interface';\n\nexport const EDITOR_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => Editor),\n    multi: true\n};\n/**\n * Editor groups a collection of contents in tabs.\n * @group Components\n */\n@Component({\n    selector: 'cax-editor',\n    templateUrl: `./editor.html`,\n    providers: [EDITOR_VALUE_ACCESSOR],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    styleUrls: ['./editor.scss'],\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Editor implements AfterContentInit, ControlValueAccessor {\n    /**\n     * Inline style of the container.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the container.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Placeholder text to show when editor is empty.\n     * @group Props\n     */\n    @Input() placeholder: string | undefined;\n    /**\n     * Whitelist of formats to display, see here for available options.\n     * @group Props\n     */\n    @Input() formats: string[] | undefined;\n    /**\n     * Modules configuration of Editor, see here for available options.\n     * @group Props\n     */\n    @Input() modules: object | undefined;\n    /**\n     * DOM Element or a CSS selector for a DOM Element, within which the editor’s p elements (i.e. tooltips, etc.) should be confined. Currently, it only considers left and right boundaries.\n     * @group Props\n     */\n    @Input() bounds: HTMLElement | string | undefined;\n    /**\n     * DOM Element or a CSS selector for a DOM Element, specifying which container has the scrollbars (i.e. overflow-y: auto), if is has been changed from the default ql-editor with custom CSS. Necessary to fix scroll jumping bugs when Quill is set to auto grow its height, and another ancestor container is responsible from the scrolling..\n     * @group Props\n     */\n    @Input() scrollingContainer: HTMLElement | string | undefined;\n    /**\n     * Shortcut for debug. Note debug is a static method and will affect other instances of Quill editors on the page. Only warning and error messages are enabled by default.\n     * @group Props\n     */\n    @Input() debug: string | undefined;\n    /**\n     * Whether to instantiate the editor to read-only mode.\n     * @group Props\n     */\n    @Input() get readonly(): boolean {\n        return this._readonly;\n    }\n    set readonly(val: boolean) {\n        this._readonly = val;\n\n        if (this.quill) {\n            if (this._readonly) this.quill.disable();\n            else this.quill.enable();\n        }\n    }\n    /**\n     * Callback to invoke when the quill modules are loaded.\n     * @param {EditorInitEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onInit: EventEmitter<EditorInitEvent> = new EventEmitter<EditorInitEvent>();\n    /**\n     * Callback to invoke when text of editor changes.\n     * @param {EditorTextChangeEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onTextChange: EventEmitter<EditorTextChangeEvent> = new EventEmitter<EditorTextChangeEvent>();\n    /**\n     * Callback to invoke when selection of the text changes.\n     * @param {EditorSelectionChangeEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onSelectionChange: EventEmitter<EditorSelectionChangeEvent> = new EventEmitter<EditorSelectionChangeEvent>();\n\n    @ContentChildren(CaxTemplate) templates!: QueryList<CaxTemplate>;\n\n    @ContentChild(Header) toolbar: any;\n\n    value: Nullable<string>;\n\n    delayedCommand: Function | null = null;\n\n    _readonly: boolean = false;\n\n    onModelChange: Function = () => {};\n\n    onModelTouched: Function = () => {};\n\n    quill: any;\n\n    dynamicQuill: any;\n\n    headerTemplate: Nullable<TemplateRef<any>>;\n\n    private get isAttachedQuillEditorToDOM(): boolean | undefined {\n        return this.quillElements?.editorElement?.isConnected;\n    }\n\n    private quillElements!: { editorElement: HTMLElement; toolbarElement: HTMLElement };\n\n    constructor(\n        public el: ElementRef,\n        @Inject(PLATFORM_ID) private platformId: object\n    ) {\n        /**\n         * Read or write the DOM once, when initializing non-Angular (Quill) library.\n         */\n        afterNextRender(() => {\n            this.initQuillElements();\n            this.initQuillEditor();\n        });\n    }\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'header':\n                    this.headerTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    writeValue(value: any): void {\n        this.value = value;\n\n        if (this.quill) {\n            if (value) {\n                const command = (): void => {\n                    this.quill.setContents(this.quill.clipboard.convert(this.dynamicQuill.version.startsWith('2') ? { html: this.value } : this.value));\n                };\n\n                if (this.isAttachedQuillEditorToDOM) {\n                    command();\n                } else {\n                    this.delayedCommand = command;\n                }\n            } else {\n                const command = (): void => {\n                    this.quill.setText('');\n                };\n\n                if (this.isAttachedQuillEditorToDOM) {\n                    command();\n                } else {\n                    this.delayedCommand = command;\n                }\n            }\n        }\n    }\n\n    registerOnChange(fn: Function): void {\n        this.onModelChange = fn;\n    }\n\n    registerOnTouched(fn: Function): void {\n        this.onModelTouched = fn;\n    }\n\n    getQuill() {\n        return this.quill;\n    }\n\n    private initQuillEditor(): void {\n        if (isPlatformServer(this.platformId)) {\n            return;\n        }\n\n        /**\n         * Importing Quill at top level, throws `document is undefined` error during when\n         * building for SSR, so this dynamically loads quill when it's in browser module.\n         */\n        if (!this.dynamicQuill) {\n            import('quill')\n                .then((quillModule: any) => {\n                    this.dynamicQuill = quillModule.default;\n                    this.createQuillEditor();\n                })\n                .catch((e) => console.error(e.message));\n        } else {\n            this.createQuillEditor();\n        }\n    }\n\n    private createQuillEditor(): void {\n        this.initQuillElements();\n\n        const { toolbarElement, editorElement } = this.quillElements;\n        let defaultModule = { toolbar: toolbarElement };\n        let modules = this.modules ? { ...defaultModule, ...this.modules } : defaultModule;\n        this.quill = new this.dynamicQuill(editorElement, {\n            modules: modules,\n            placeholder: this.placeholder,\n            readOnly: this.readonly,\n            theme: 'snow',\n            formats: this.formats,\n            bounds: this.bounds,\n            debug: this.debug,\n            scrollingContainer: this.scrollingContainer\n        });\n\n        const isQuill2 = this.dynamicQuill.version.startsWith('2');\n\n        if (this.value) {\n            this.quill.setContents(this.quill.clipboard.convert(isQuill2 ? { html: this.value } : this.value));\n        }\n\n        this.quill.on('text-change', (delta: any, oldContents: any, source: any) => {\n            if (source === 'user') {\n                let html = isQuill2 ? this.quill.getSemanticHTML() : DomHandler.findSingle(editorElement, '.ql-editor').innerHTML;\n                let text = this.quill.getText().trim();\n                if (html === '<p><br></p>') {\n                    html = null;\n                }\n\n                this.onTextChange.emit({\n                    htmlValue: html,\n                    textValue: text,\n                    delta: delta,\n                    source: source\n                });\n\n                this.onModelChange(html);\n                this.onModelTouched();\n            }\n        });\n\n        this.quill.on('selection-change', (range: string, oldRange: string, source: string) => {\n            this.onSelectionChange.emit({\n                range: range,\n                oldRange: oldRange,\n                source: source\n            });\n        });\n\n        this.onInit.emit({\n            editor: this.quill\n        });\n    }\n\n    private initQuillElements(): void {\n        if (!this.quillElements) {\n            this.quillElements = {\n                editorElement: DomHandler.findSingle(this.el.nativeElement, 'div.cax-editor-content'),\n                toolbarElement: DomHandler.findSingle(this.el.nativeElement, 'div.cax-editor-toolbar')\n            };\n        }\n    }\n}\n","<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\n        <ng-content select=\"cax-header\"></ng-content>\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\n    </div>\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\n        <span class=\"ql-formats\">\n            <select class=\"ql-header\">\n                <option value=\"1\">Heading</option>\n                <option value=\"2\">Subheading</option>\n                <option selected>Normal</option>\n            </select>\n            <select class=\"ql-font\">\n                <option selected>Sans Serif</option>\n                <option value=\"serif\">Serif</option>\n                <option value=\"monospace\">Monospace</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <select class=\"ql-color\"></select>\n            <select class=\"ql-background\"></select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\n            <select class=\"ql-align\">\n                <option selected></option>\n                <option value=\"center\">center</option>\n                <option value=\"right\">right</option>\n                <option value=\"justify\">justify</option>\n            </select>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\n        </span>\n        <span class=\"ql-formats\">\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\n        </span>\n    </div>\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { Editor } from './editor';\nimport { SharedModule } from 'cax-design-system/api';\n\n@NgModule({\n    imports: [CommonModule, SharedModule],\n    exports: [Editor, SharedModule],\n    declarations: [Editor]\n})\nexport class EditorModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-editor.mjs","sources":["../../src/app/components/editor/editor.ts","../../src/app/components/editor/editor.html","../../src/app/components/editor/editor.module.ts","../../src/app/components/editor/cax-design-system-editor.ts"],"sourcesContent":["import { CommonModule, isPlatformServer } from '@angular/common';\nimport {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    Component,\n    ContentChild,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    Inject,\n    Input,\n    NgModule,\n    Output,\n    PLATFORM_ID,\n    QueryList,\n    TemplateRef,\n    ViewEncapsulation,\n    afterNextRender,\n    forwardRef\n} from '@angular/core';\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\nimport { Header, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { EditorInitEvent, EditorSelectionChangeEvent, EditorTextChangeEvent } from './editor.interface';\n\nexport const EDITOR_VALUE_ACCESSOR: any = {\n    provide: NG_VALUE_ACCESSOR,\n    useExisting: forwardRef(() => Editor),\n    multi: true\n};\n/**\n * Editor groups a collection of contents in tabs.\n * @group Components\n */\n@Component({\n    selector: 'cax-editor',\n    templateUrl: `./editor.html`,\n    providers: [EDITOR_VALUE_ACCESSOR],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    styleUrls: ['./editor.scss'],\n    encapsulation: ViewEncapsulation.None,\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Editor implements AfterContentInit, ControlValueAccessor {\n    /**\n     * Inline style of the container.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Style class of the container.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Placeholder text to show when editor is empty.\n     * @group Props\n     */\n    @Input() placeholder: string | undefined;\n    /**\n     * Whitelist of formats to display, see here for available options.\n     * @group Props\n     */\n    @Input() formats: string[] | undefined;\n    /**\n     * Modules configuration of Editor, see here for available options.\n     * @group Props\n     */\n    @Input() modules: object | undefined;\n    /**\n     * DOM Element or a CSS selector for a DOM Element, within which the editor’s p elements (i.e. tooltips, etc.) should be confined. Currently, it only considers left and right boundaries.\n     * @group Props\n     */\n    @Input() bounds: HTMLElement | string | undefined;\n    /**\n     * DOM Element or a CSS selector for a DOM Element, specifying which container has the scrollbars (i.e. overflow-y: auto), if is has been changed from the default ql-editor with custom CSS. Necessary to fix scroll jumping bugs when Quill is set to auto grow its height, and another ancestor container is responsible from the scrolling..\n     * @group Props\n     */\n    @Input() scrollingContainer: HTMLElement | string | undefined;\n    /**\n     * Shortcut for debug. Note debug is a static method and will affect other instances of Quill editors on the page. Only warning and error messages are enabled by default.\n     * @group Props\n     */\n    @Input() debug: string | undefined;\n    /**\n     * Whether to instantiate the editor to read-only mode.\n     * @group Props\n     */\n    @Input() get readonly(): boolean {\n        return this._readonly;\n    }\n    set readonly(val: boolean) {\n        this._readonly = val;\n\n        if (this.quill) {\n            if (this._readonly) this.quill.disable();\n            else this.quill.enable();\n        }\n    }\n    /**\n     * Callback to invoke when the quill modules are loaded.\n     * @param {EditorInitEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onInit: EventEmitter<EditorInitEvent> = new EventEmitter<EditorInitEvent>();\n    /**\n     * Callback to invoke when text of editor changes.\n     * @param {EditorTextChangeEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onTextChange: EventEmitter<EditorTextChangeEvent> = new EventEmitter<EditorTextChangeEvent>();\n    /**\n     * Callback to invoke when selection of the text changes.\n     * @param {EditorSelectionChangeEvent} event - custom event.\n     * @group Emits\n     */\n    @Output() onSelectionChange: EventEmitter<EditorSelectionChangeEvent> = new EventEmitter<EditorSelectionChangeEvent>();\n\n    @ContentChildren(CaxTemplate) templates!: QueryList<CaxTemplate>;\n\n    @ContentChild(Header) toolbar: any;\n\n    value: Nullable<string>;\n\n    delayedCommand: Function | null = null;\n\n    _readonly: boolean = false;\n\n    onModelChange: Function = () => {};\n\n    onModelTouched: Function = () => {};\n\n    quill: any;\n\n    dynamicQuill: any;\n\n    headerTemplate: Nullable<TemplateRef<any>>;\n\n    private get isAttachedQuillEditorToDOM(): boolean | undefined {\n        return this.quillElements?.editorElement?.isConnected;\n    }\n\n    private quillElements!: { editorElement: HTMLElement; toolbarElement: HTMLElement };\n\n    constructor(\n        public el: ElementRef,\n        @Inject(PLATFORM_ID) private platformId: object\n    ) {\n        /**\n         * Read or write the DOM once, when initializing non-Angular (Quill) library.\n         */\n        afterNextRender(() => {\n            this.initQuillElements();\n            this.initQuillEditor();\n        });\n    }\n\n    ngAfterContentInit() {\n        this.templates.forEach((item) => {\n            switch (item.getType()) {\n                case 'header':\n                    this.headerTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    writeValue(value: any): void {\n        this.value = value;\n\n        if (this.quill) {\n            if (value) {\n                const command = (): void => {\n                    this.quill.setContents(this.quill.clipboard.convert(this.dynamicQuill.version.startsWith('2') ? { html: this.value } : this.value));\n                };\n\n                if (this.isAttachedQuillEditorToDOM) {\n                    command();\n                } else {\n                    this.delayedCommand = command;\n                }\n            } else {\n                const command = (): void => {\n                    this.quill.setText('');\n                };\n\n                if (this.isAttachedQuillEditorToDOM) {\n                    command();\n                } else {\n                    this.delayedCommand = command;\n                }\n            }\n        }\n    }\n\n    registerOnChange(fn: Function): void {\n        this.onModelChange = fn;\n    }\n\n    registerOnTouched(fn: Function): void {\n        this.onModelTouched = fn;\n    }\n\n    getQuill() {\n        return this.quill;\n    }\n\n    private initQuillEditor(): void {\n        if (isPlatformServer(this.platformId)) {\n            return;\n        }\n\n        /**\n         * Importing Quill at top level, throws `document is undefined` error during when\n         * building for SSR, so this dynamically loads quill when it's in browser module.\n         */\n        if (!this.dynamicQuill) {\n            import('quill')\n                .then((quillModule: any) => {\n                    this.dynamicQuill = quillModule.default;\n                    this.createQuillEditor();\n                })\n                .catch((e) => console.error(e.message));\n        } else {\n            this.createQuillEditor();\n        }\n    }\n\n    private createQuillEditor(): void {\n        this.initQuillElements();\n\n        const { toolbarElement, editorElement } = this.quillElements;\n        let defaultModule = { toolbar: toolbarElement };\n        let modules = this.modules ? { ...defaultModule, ...this.modules } : defaultModule;\n        this.quill = new this.dynamicQuill(editorElement, {\n            modules: modules,\n            placeholder: this.placeholder,\n            readOnly: this.readonly,\n            theme: 'snow',\n            formats: this.formats,\n            bounds: this.bounds,\n            debug: this.debug,\n            scrollingContainer: this.scrollingContainer\n        });\n\n        const isQuill2 = this.dynamicQuill.version.startsWith('2');\n\n        if (this.value) {\n            this.quill.setContents(this.quill.clipboard.convert(isQuill2 ? { html: this.value } : this.value));\n        }\n\n        this.quill.on('text-change', (delta: any, oldContents: any, source: any) => {\n            if (source === 'user') {\n                let html = isQuill2 ? this.quill.getSemanticHTML() : DomHandler.findSingle(editorElement, '.ql-editor').innerHTML;\n                let text = this.quill.getText().trim();\n                if (html === '<p><br></p>') {\n                    html = null;\n                }\n\n                this.onTextChange.emit({\n                    htmlValue: html,\n                    textValue: text,\n                    delta: delta,\n                    source: source\n                });\n\n                this.onModelChange(html);\n                this.onModelTouched();\n            }\n        });\n\n        this.quill.on('selection-change', (range: string, oldRange: string, source: string) => {\n            this.onSelectionChange.emit({\n                range: range,\n                oldRange: oldRange,\n                source: source\n            });\n        });\n\n        this.onInit.emit({\n            editor: this.quill\n        });\n    }\n\n    private initQuillElements(): void {\n        if (!this.quillElements) {\n            this.quillElements = {\n                editorElement: DomHandler.findSingle(this.el.nativeElement, 'div.cax-editor-content'),\n                toolbarElement: DomHandler.findSingle(this.el.nativeElement, 'div.cax-editor-toolbar')\n            };\n        }\n    }\n}\n","<div [ngClass]=\"'cax-editor-container'\" [class]=\"styleClass\">\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"toolbar || headerTemplate\">\r\n        <ng-content select=\"cax-header\"></ng-content>\r\n        <ng-container *ngTemplateOutlet=\"headerTemplate\"></ng-container>\r\n    </div>\r\n    <div class=\"cax-editor-toolbar\" *ngIf=\"!modules && !toolbar && !headerTemplate\">\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-header\">\r\n                <option value=\"1\">Heading</option>\r\n                <option value=\"2\">Subheading</option>\r\n                <option selected>Normal</option>\r\n            </select>\r\n            <select class=\"ql-font\">\r\n                <option selected>Sans Serif</option>\r\n                <option value=\"serif\">Serif</option>\r\n                <option value=\"monospace\">Monospace</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-bold\" aria-label=\"Bold\" type=\"button\"></button>\r\n            <button class=\"ql-italic\" aria-label=\"Italic\" type=\"button\"></button>\r\n            <button class=\"ql-underline\" aria-label=\"Underline\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <select class=\"ql-color\"></select>\r\n            <select class=\"ql-background\"></select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-list\" value=\"ordered\" aria-label=\"Ordered List\" type=\"button\"></button>\r\n            <button class=\"ql-list\" value=\"bullet\" aria-label=\"Unordered List\" type=\"button\"></button>\r\n            <select class=\"ql-align\">\r\n                <option selected></option>\r\n                <option value=\"center\">center</option>\r\n                <option value=\"right\">right</option>\r\n                <option value=\"justify\">justify</option>\r\n            </select>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-link\" aria-label=\"Insert Link\" type=\"button\"></button>\r\n            <button class=\"ql-image\" aria-label=\"Insert Image\" type=\"button\"></button>\r\n            <button class=\"ql-code-block\" aria-label=\"Insert Code Block\" type=\"button\"></button>\r\n        </span>\r\n        <span class=\"ql-formats\">\r\n            <button class=\"ql-clean\" aria-label=\"Remove Styles\" type=\"button\"></button>\r\n        </span>\r\n    </div>\r\n    <div class=\"cax-editor-content\" [ngStyle]=\"style\"></div>\r\n</div>","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { Editor } from './editor';\nimport { SharedModule } from 'cax-design-system/api';\n\n@NgModule({\n    imports: [CommonModule, SharedModule],\n    exports: [Editor, SharedModule],\n    declarations: [Editor]\n})\nexport class EditorModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-image.mjs

@@ -335,7 +335,7 @@ class Image {
         };
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: Image, deps: [{ token: DOCUMENT }, { token: i1.caxConfig }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: Image, isStandalone: true, selector: "cax-image", inputs: { imageClass: "imageClass", imageStyle: "imageStyle", styleClass: "styleClass", style: "style", src: "src", srcSet: "srcSet", sizes: "sizes", size: "size", previewImageSrc: "previewImageSrc", previewImageSrcSet: "previewImageSrcSet", previewImageSizes: "previewImageSizes", alt: "alt", width: "width", height: "height", loading: "loading", appendTo: "appendTo", preview: ["preview", "preview", booleanAttribute], showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onShow: "onShow", onHide: "onHide", onImageError: "onImageError" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" }, classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "previewButton", first: true, predicate: ["previewButton"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\n    <img\n        [attr.src]=\"src\"\n        [attr.srcset]=\"srcSet\"\n        [attr.sizes]=\"sizes\"\n        [attr.alt]=\"alt\"\n        [attr.width]=\"width\"\n        [attr.height]=\"height\"\n        [attr.loading]=\"loading\"\n        [ngStyle]=\"imageStyle\"\n        [class]=\"imageClass\"\n        [ngClass]=\"sizeClass()\"\n        (error)=\"imageError($event)\"\n    />\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\n        </ng-container>\n        <ng-template #defaultTemplate>\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\n        </ng-template>\n    </button>\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\n            </button>\n        </div>\n        <div\n            *ngIf=\"previewVisible\"\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n            (@animation.start)=\"onAnimationStart($event)\"\n            (@animation.done)=\"onAnimationEnd($event)\"\n        >\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\n        </div>\n    </div>\n</span>\n", styles: ["@layer cax{.cax-image-mask{display:flex;align-items:center;justify-content:center}.cax-image-preview-container{position:relative;display:inline-block;line-height:0}.cax-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cax-image-preview-icon.pi{font-size:1.5rem}.cax-image-preview-icon.cax-icon{scale:1.5}.cax-image-preview-container:hover>.cax-image-preview-indicator{opacity:1;cursor:pointer}.cax-image-preview-container>img{cursor:pointer}.cax-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1}.cax-image-action.cax-link{display:flex;justify-content:center;align-items:center}.cax-image-action.cax-link[disabled]{opacity:.5}.cax-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cax-image-sm{height:32px;width:auto}.cax-image-md{height:40px;width:auto}.cax-image-lg{height:48px;width:auto}.cax-image-xl{height:56px;width:auto}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: RefreshIcon, selector: "RefreshIcon" }, { kind: "component", type: EyeIcon, selector: "EyeIcon" }, { kind: "component", type: UndoIcon, selector: "UndoIcon" }, { kind: "component", type: SearchMinusIcon, selector: "SearchMinusIcon" }, { kind: "component", type: SearchPlusIcon, selector: "SearchPlusIcon" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "ngmodule", type: FocusTrapModule }], animations: [
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: Image, isStandalone: true, selector: "cax-image", inputs: { imageClass: "imageClass", imageStyle: "imageStyle", styleClass: "styleClass", style: "style", src: "src", srcSet: "srcSet", sizes: "sizes", size: "size", previewImageSrc: "previewImageSrc", previewImageSrcSet: "previewImageSrcSet", previewImageSizes: "previewImageSizes", alt: "alt", width: "width", height: "height", loading: "loading", appendTo: "appendTo", preview: ["preview", "preview", booleanAttribute], showTransitionOptions: "showTransitionOptions", hideTransitionOptions: "hideTransitionOptions" }, outputs: { onShow: "onShow", onHide: "onHide", onImageError: "onImageError" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" }, classAttribute: "cax-element" }, queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "mask", first: true, predicate: ["mask"], descendants: true }, { propertyName: "previewButton", first: true, predicate: ["previewButton"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true }], ngImport: i0, template: "<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n    <img\r\n        [attr.src]=\"src\"\r\n        [attr.srcset]=\"srcSet\"\r\n        [attr.sizes]=\"sizes\"\r\n        [attr.alt]=\"alt\"\r\n        [attr.width]=\"width\"\r\n        [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\"\r\n        [ngStyle]=\"imageStyle\"\r\n        [class]=\"imageClass\"\r\n        [ngClass]=\"sizeClass()\"\r\n        (error)=\"imageError($event)\"\r\n    />\r\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\r\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\r\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\r\n        </ng-container>\r\n        <ng-template #defaultTemplate>\r\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\r\n        </ng-template>\r\n    </button>\r\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\r\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\r\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\r\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\r\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\r\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\r\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\r\n            </button>\r\n        </div>\r\n        <div\r\n            *ngIf=\"previewVisible\"\r\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n            (@animation.start)=\"onAnimationStart($event)\"\r\n            (@animation.done)=\"onAnimationEnd($event)\"\r\n        >\r\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\r\n        </div>\r\n    </div>\r\n</span>\r\n", styles: ["@layer cax{.cax-image-mask{display:flex;align-items:center;justify-content:center}.cax-image-preview-container{position:relative;display:inline-block;line-height:0}.cax-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cax-image-preview-icon.pi{font-size:1.5rem}.cax-image-preview-icon.cax-icon{scale:1.5}.cax-image-preview-container:hover>.cax-image-preview-indicator{opacity:1;cursor:pointer}.cax-image-preview-container>img{cursor:pointer}.cax-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1}.cax-image-action.cax-link{display:flex;justify-content:center;align-items:center}.cax-image-action.cax-link[disabled]{opacity:.5}.cax-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cax-image-sm{height:32px;width:auto}.cax-image-md{height:40px;width:auto}.cax-image-lg{height:48px;width:auto}.cax-image-xl{height:56px;width:auto}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: SharedModule }, { kind: "component", type: RefreshIcon, selector: "RefreshIcon" }, { kind: "component", type: EyeIcon, selector: "EyeIcon" }, { kind: "component", type: UndoIcon, selector: "UndoIcon" }, { kind: "component", type: SearchMinusIcon, selector: "SearchMinusIcon" }, { kind: "component", type: SearchPlusIcon, selector: "SearchPlusIcon" }, { kind: "component", type: TimesIcon, selector: "TimesIcon" }, { kind: "ngmodule", type: FocusTrapModule }], animations: [
             trigger('animation', [
                 transition('void => visible', [style({ transform: 'scale(0.7)', opacity: 0 }), animate('{{showTransitionParams}}')]),
                 transition('visible => void', [animate('{{hideTransitionParams}}', style({ transform: 'scale(0.7)', opacity: 0 }))])
@@ -351,7 +351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                         ])
                     ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [CommonModule, SharedModule, RefreshIcon, EyeIcon, UndoIcon, SearchMinusIcon, SearchPlusIcon, TimesIcon, FocusTrapModule], host: {
                         class: 'cax-element'
-                    }, template: "<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\n    <img\n        [attr.src]=\"src\"\n        [attr.srcset]=\"srcSet\"\n        [attr.sizes]=\"sizes\"\n        [attr.alt]=\"alt\"\n        [attr.width]=\"width\"\n        [attr.height]=\"height\"\n        [attr.loading]=\"loading\"\n        [ngStyle]=\"imageStyle\"\n        [class]=\"imageClass\"\n        [ngClass]=\"sizeClass()\"\n        (error)=\"imageError($event)\"\n    />\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\n        </ng-container>\n        <ng-template #defaultTemplate>\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\n        </ng-template>\n    </button>\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\n            </button>\n        </div>\n        <div\n            *ngIf=\"previewVisible\"\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n            (@animation.start)=\"onAnimationStart($event)\"\n            (@animation.done)=\"onAnimationEnd($event)\"\n        >\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\n        </div>\n    </div>\n</span>\n", styles: ["@layer cax{.cax-image-mask{display:flex;align-items:center;justify-content:center}.cax-image-preview-container{position:relative;display:inline-block;line-height:0}.cax-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cax-image-preview-icon.pi{font-size:1.5rem}.cax-image-preview-icon.cax-icon{scale:1.5}.cax-image-preview-container:hover>.cax-image-preview-indicator{opacity:1;cursor:pointer}.cax-image-preview-container>img{cursor:pointer}.cax-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1}.cax-image-action.cax-link{display:flex;justify-content:center;align-items:center}.cax-image-action.cax-link[disabled]{opacity:.5}.cax-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cax-image-sm{height:32px;width:auto}.cax-image-md{height:40px;width:auto}.cax-image-lg{height:48px;width:auto}.cax-image-xl{height:56px;width:auto}}\n"] }]
+                    }, template: "<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n    <img\r\n        [attr.src]=\"src\"\r\n        [attr.srcset]=\"srcSet\"\r\n        [attr.sizes]=\"sizes\"\r\n        [attr.alt]=\"alt\"\r\n        [attr.width]=\"width\"\r\n        [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\"\r\n        [ngStyle]=\"imageStyle\"\r\n        [class]=\"imageClass\"\r\n        [ngClass]=\"sizeClass()\"\r\n        (error)=\"imageError($event)\"\r\n    />\r\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\r\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\r\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\r\n        </ng-container>\r\n        <ng-template #defaultTemplate>\r\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\r\n        </ng-template>\r\n    </button>\r\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\r\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\r\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\r\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\r\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\r\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\r\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\r\n            </button>\r\n        </div>\r\n        <div\r\n            *ngIf=\"previewVisible\"\r\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n            (@animation.start)=\"onAnimationStart($event)\"\r\n            (@animation.done)=\"onAnimationEnd($event)\"\r\n        >\r\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\r\n        </div>\r\n    </div>\r\n</span>\r\n", styles: ["@layer cax{.cax-image-mask{display:flex;align-items:center;justify-content:center}.cax-image-preview-container{position:relative;display:inline-block;line-height:0}.cax-image-preview-indicator{position:absolute;left:0;top:0;width:100%;height:100%;outline:none;border:none;padding:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}.cax-image-preview-icon.pi{font-size:1.5rem}.cax-image-preview-icon.cax-icon{scale:1.5}.cax-image-preview-container:hover>.cax-image-preview-indicator{opacity:1;cursor:pointer}.cax-image-preview-container>img{cursor:pointer}.cax-image-toolbar{position:absolute;top:0;right:0;display:flex;z-index:1}.cax-image-action.cax-link{display:flex;justify-content:center;align-items:center}.cax-image-action.cax-link[disabled]{opacity:.5}.cax-image-preview{transition:transform .15s;max-width:100vw;max-height:100vh}.cax-image-sm{height:32px;width:auto}.cax-image-md{height:40px;width:auto}.cax-image-lg{height:48px;width:auto}.cax-image-xl{height:56px;width:auto}}\n"] }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]

package/fesm2022/cax-design-system-image.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-image.mjs","sources":["../../src/app/components/image/image.ts","../../src/app/components/image/image.html","../../src/app/components/image/image.module.ts","../../src/app/components/image/cax-design-system-image.ts"],"sourcesContent":["import { AnimationEvent, animate, style, transition, trigger } from '@angular/animations';\nimport { CommonModule, DOCUMENT } from '@angular/common';\nimport {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    Inject,\n    Input,\n    Output,\n    QueryList,\n    TemplateRef,\n    ViewChild,\n    ViewEncapsulation,\n    booleanAttribute\n} from '@angular/core';\nimport { SafeUrl } from '@angular/platform-browser';\nimport { caxConfig, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { EyeIcon } from 'cax-design-system/icons/eye';\nimport { RefreshIcon } from 'cax-design-system/icons/refresh';\nimport { SearchMinusIcon } from 'cax-design-system/icons/searchminus';\nimport { SearchPlusIcon } from 'cax-design-system/icons/searchplus';\nimport { TimesIcon } from 'cax-design-system/icons/times';\nimport { UndoIcon } from 'cax-design-system/icons/undo';\nimport { ZIndexUtils } from 'cax-design-system/utils';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { FocusTrapModule } from 'cax-design-system/focustrap';\n\n/**\n * Displays an image with preview and tranformation options. For multiple image, see Galleria.\n * @group Components\n */\n@Component({\n    selector: 'cax-image',\n    templateUrl: './image.html',\n    animations: [\n        trigger('animation', [\n            transition('void => visible', [style({ transform: 'scale(0.7)', opacity: 0 }), animate('{{showTransitionParams}}')]),\n            transition('visible => void', [animate('{{hideTransitionParams}}', style({ transform: 'scale(0.7)', opacity: 0 }))])\n        ])\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    standalone: true,\n    imports: [CommonModule, SharedModule, RefreshIcon, EyeIcon, UndoIcon, SearchMinusIcon, SearchPlusIcon, TimesIcon, FocusTrapModule],\n    styleUrls: ['./image.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Image implements AfterContentInit {\n    /**\n     * Style class of the image element.\n     * @group Props\n     */\n    @Input() imageClass: string | undefined;\n    /**\n     * Inline style of the image element.\n     * @group Props\n     */\n    @Input() imageStyle: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * The source path for the main image.\n     * @group Props\n     */\n    @Input() src: string | SafeUrl | undefined;\n    /**\n     * The srcset definition for the main image.\n     * @group Props\n     */\n    @Input() srcSet: string | SafeUrl | undefined;\n    /**\n     * The sizes definition for the main image.\n     * @group Props\n     */\n    @Input() sizes: 'string' | undefined;\n    /**\n     * The source path for the preview image.\n     * @group Props\n     */\n    @Input() size: 'sm' | 'md' | 'lg' | 'xl' | undefined;\n    /**\n     * The source path for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSrc: string | SafeUrl | undefined;\n    /**\n     * The srcset definition for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSrcSet: string | SafeUrl | undefined;\n    /**\n     * The sizes definition for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSizes: string | undefined;\n    /**\n     * Attribute of the preview image element.\n     * @group Props\n     */\n    @Input() alt: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() width: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() height: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() loading: 'lazy' | 'eager' | undefined;\n    /**\n     * Target element to attach the dialog, valid values are \"body\" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]=\"mydiv\" for a div element having #mydiv as variable name).\n     * @group Props\n     */\n    @Input() appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined | any;\n    /**\n     * Controls the preview functionality.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) preview: boolean = false;\n    /**\n     * Transition options of the show animation\n     * @group Props\n     */\n    @Input() showTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\n    /**\n     * Transition options of the hide animation\n     * @group Props\n     */\n    @Input() hideTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\n    /**\n     * Triggered when the preview overlay is shown.\n     * @group Emits\n     */\n    @Output() onShow: EventEmitter<any> = new EventEmitter<any>();\n    /**\n     * Triggered when the preview overlay is hidden.\n     * @group Emits\n     */\n    @Output() onHide: EventEmitter<any> = new EventEmitter<any>();\n    /**\n     * This event is triggered if an error occurs while loading an image file.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onImageError: EventEmitter<Event> = new EventEmitter<Event>();\n\n    @ViewChild('mask') mask: ElementRef | undefined;\n\n    @ViewChild('previewButton') previewButton: ElementRef | undefined;\n\n    @ViewChild('closeButton') closeButton: ElementRef | undefined;\n\n    @ContentChildren(CaxTemplate) templates: QueryList<CaxTemplate> | undefined;\n\n    indicatorTemplate: TemplateRef<any> | undefined;\n\n    rotateRightIconTemplate: TemplateRef<any> | undefined;\n\n    rotateLeftIconTemplate: TemplateRef<any> | undefined;\n\n    zoomOutIconTemplate: TemplateRef<any> | undefined;\n\n    zoomInIconTemplate: TemplateRef<any> | undefined;\n\n    closeIconTemplate: TemplateRef<any> | undefined;\n\n    maskVisible: boolean = false;\n\n    previewVisible: boolean = false;\n\n    rotate: number = 0;\n\n    scale: number = 1;\n\n    previewClick: boolean = false;\n\n    container: Nullable<HTMLElement>;\n\n    wrapper: Nullable<HTMLElement>;\n\n    public get isZoomOutDisabled(): boolean {\n        return this.scale - this.zoomSettings.step <= this.zoomSettings.min;\n    }\n\n    public get isZoomInDisabled(): boolean {\n        return this.scale + this.zoomSettings.step >= this.zoomSettings.max;\n    }\n\n    private zoomSettings = {\n        default: 1,\n        step: 0.1,\n        max: 1.5,\n        min: 0.5\n    };\n\n    constructor(\n        @Inject(DOCUMENT) private document: Document,\n        private config: caxConfig,\n        private cd: ChangeDetectorRef,\n        public el: ElementRef\n    ) {}\n\n    ngAfterContentInit() {\n        this.templates?.forEach((item) => {\n            switch (item.getType()) {\n                case 'indicator':\n                    this.indicatorTemplate = item.template;\n                    break;\n\n                case 'rotaterighticon':\n                    this.rotateRightIconTemplate = item.template;\n                    break;\n\n                case 'rotatelefticon':\n                    this.rotateLeftIconTemplate = item.template;\n                    break;\n\n                case 'zoomouticon':\n                    this.zoomOutIconTemplate = item.template;\n                    break;\n\n                case 'zoominicon':\n                    this.zoomInIconTemplate = item.template;\n                    break;\n\n                case 'closeicon':\n                    this.closeIconTemplate = item.template;\n                    break;\n\n                default:\n                    this.indicatorTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    onImageClick() {\n        if (this.preview) {\n            this.maskVisible = true;\n            this.previewVisible = true;\n            DomHandler.blockBodyScroll();\n        }\n    }\n\n    onMaskClick() {\n        if (!this.previewClick) {\n            this.closePreview();\n        }\n\n        this.previewClick = false;\n    }\n\n    onMaskKeydown(event) {\n        switch (event.code) {\n            case 'Escape':\n                this.onMaskClick();\n                setTimeout(() => {\n                    DomHandler.focus(this.previewButton.nativeElement);\n                }, 25);\n                event.preventDefault();\n\n                break;\n\n            default:\n                break;\n        }\n    }\n\n    onPreviewImageClick() {\n        this.previewClick = true;\n    }\n\n    rotateRight() {\n        this.rotate += 90;\n        this.previewClick = true;\n    }\n\n    rotateLeft() {\n        this.rotate -= 90;\n        this.previewClick = true;\n    }\n\n    zoomIn() {\n        this.scale = this.scale + this.zoomSettings.step;\n        this.previewClick = true;\n    }\n\n    zoomOut() {\n        this.scale = this.scale - this.zoomSettings.step;\n        this.previewClick = true;\n    }\n\n    onAnimationStart(event: AnimationEvent) {\n        switch (event.toState) {\n            case 'visible':\n                this.container = event.element;\n                this.wrapper = this.container?.parentElement;\n                this.appendContainer();\n                this.moveOnTop();\n\n                setTimeout(() => {\n                    DomHandler.focus(this.closeButton.nativeElement);\n                }, 25);\n                break;\n\n            case 'void':\n                DomHandler.addClass(this.wrapper, 'cax-component-overlay-leave');\n                break;\n        }\n    }\n\n    onAnimationEnd(event: AnimationEvent) {\n        switch (event.toState) {\n            case 'void':\n                ZIndexUtils.clear(this.wrapper);\n                this.maskVisible = false;\n                this.container = null;\n                this.wrapper = null;\n                this.cd.markForCheck();\n                this.onHide.emit({});\n                break;\n            case 'visible':\n                this.onShow.emit({});\n                break;\n        }\n    }\n\n    moveOnTop() {\n        ZIndexUtils.set('modal', this.wrapper, this.config.zIndex.modal);\n    }\n\n    appendContainer() {\n        if (this.appendTo) {\n            if (this.appendTo === 'body') this.document.body.appendChild(this.wrapper as HTMLElement);\n            else DomHandler.appendChild(this.wrapper, this.appendTo);\n        }\n    }\n\n    imagePreviewStyle() {\n        return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };\n    }\n\n    get zoomImageAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomImage : undefined;\n    }\n\n    containerClass() {\n        return {\n            'cax-image cax-component': true,\n            'cax-image-preview-container': this.preview\n        };\n    }\n\n    handleToolbarClick(event: MouseEvent): void {\n        event.stopPropagation();\n    }\n\n    closePreview(): void {\n        this.previewVisible = false;\n        this.rotate = 0;\n        this.scale = this.zoomSettings.default;\n        DomHandler.unblockBodyScroll();\n    }\n\n    imageError(event: Event) {\n        this.onImageError.emit(event);\n    }\n\n    rightAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.rotateRight : undefined;\n    }\n\n    leftAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.rotateLeft : undefined;\n    }\n\n    zoomInAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomIn : undefined;\n    }\n\n    zoomOutAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomOut : undefined;\n    }\n\n    closeAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.close : undefined;\n    }\n\n    @HostListener('document:keydown.escape', ['$event']) onKeydownHandler(event: KeyboardEvent) {\n        if (this.previewVisible) {\n            this.closePreview();\n        }\n    }\n\n    // custom methods\n    sizeClass() {\n        return {\n            [`cax-image-${this.size}`]: this.size\n        };\n    }\n}\n","<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\n    <img\n        [attr.src]=\"src\"\n        [attr.srcset]=\"srcSet\"\n        [attr.sizes]=\"sizes\"\n        [attr.alt]=\"alt\"\n        [attr.width]=\"width\"\n        [attr.height]=\"height\"\n        [attr.loading]=\"loading\"\n        [ngStyle]=\"imageStyle\"\n        [class]=\"imageClass\"\n        [ngClass]=\"sizeClass()\"\n        (error)=\"imageError($event)\"\n    />\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\n        </ng-container>\n        <ng-template #defaultTemplate>\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\n        </ng-template>\n    </button>\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\n            </button>\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\n            </button>\n        </div>\n        <div\n            *ngIf=\"previewVisible\"\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\n            (@animation.start)=\"onAnimationStart($event)\"\n            (@animation.done)=\"onAnimationEnd($event)\"\n        >\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\n        </div>\n    </div>\n</span>\n","import { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { Image } from './image';\n\n@NgModule({\n    imports: [Image, SharedModule],\n    exports: [Image, SharedModule]\n})\nexport class ImageModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-image.mjs","sources":["../../src/app/components/image/image.ts","../../src/app/components/image/image.html","../../src/app/components/image/image.module.ts","../../src/app/components/image/cax-design-system-image.ts"],"sourcesContent":["import { AnimationEvent, animate, style, transition, trigger } from '@angular/animations';\nimport { CommonModule, DOCUMENT } from '@angular/common';\nimport {\n    AfterContentInit,\n    ChangeDetectionStrategy,\n    ChangeDetectorRef,\n    Component,\n    ContentChildren,\n    ElementRef,\n    EventEmitter,\n    HostListener,\n    Inject,\n    Input,\n    Output,\n    QueryList,\n    TemplateRef,\n    ViewChild,\n    ViewEncapsulation,\n    booleanAttribute\n} from '@angular/core';\nimport { SafeUrl } from '@angular/platform-browser';\nimport { caxConfig, CaxTemplate, SharedModule } from 'cax-design-system/api';\nimport { DomHandler } from 'cax-design-system/dom';\nimport { EyeIcon } from 'cax-design-system/icons/eye';\nimport { RefreshIcon } from 'cax-design-system/icons/refresh';\nimport { SearchMinusIcon } from 'cax-design-system/icons/searchminus';\nimport { SearchPlusIcon } from 'cax-design-system/icons/searchplus';\nimport { TimesIcon } from 'cax-design-system/icons/times';\nimport { UndoIcon } from 'cax-design-system/icons/undo';\nimport { ZIndexUtils } from 'cax-design-system/utils';\nimport { Nullable } from 'cax-design-system/ts-helpers';\nimport { FocusTrapModule } from 'cax-design-system/focustrap';\n\n/**\n * Displays an image with preview and tranformation options. For multiple image, see Galleria.\n * @group Components\n */\n@Component({\n    selector: 'cax-image',\n    templateUrl: './image.html',\n    animations: [\n        trigger('animation', [\n            transition('void => visible', [style({ transform: 'scale(0.7)', opacity: 0 }), animate('{{showTransitionParams}}')]),\n            transition('visible => void', [animate('{{hideTransitionParams}}', style({ transform: 'scale(0.7)', opacity: 0 }))])\n        ])\n    ],\n    changeDetection: ChangeDetectionStrategy.OnPush,\n    encapsulation: ViewEncapsulation.None,\n    standalone: true,\n    imports: [CommonModule, SharedModule, RefreshIcon, EyeIcon, UndoIcon, SearchMinusIcon, SearchPlusIcon, TimesIcon, FocusTrapModule],\n    styleUrls: ['./image.scss'],\n    host: {\n        class: 'cax-element'\n    }\n})\nexport class Image implements AfterContentInit {\n    /**\n     * Style class of the image element.\n     * @group Props\n     */\n    @Input() imageClass: string | undefined;\n    /**\n     * Inline style of the image element.\n     * @group Props\n     */\n    @Input() imageStyle: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * The source path for the main image.\n     * @group Props\n     */\n    @Input() src: string | SafeUrl | undefined;\n    /**\n     * The srcset definition for the main image.\n     * @group Props\n     */\n    @Input() srcSet: string | SafeUrl | undefined;\n    /**\n     * The sizes definition for the main image.\n     * @group Props\n     */\n    @Input() sizes: 'string' | undefined;\n    /**\n     * The source path for the preview image.\n     * @group Props\n     */\n    @Input() size: 'sm' | 'md' | 'lg' | 'xl' | undefined;\n    /**\n     * The source path for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSrc: string | SafeUrl | undefined;\n    /**\n     * The srcset definition for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSrcSet: string | SafeUrl | undefined;\n    /**\n     * The sizes definition for the preview image.\n     * @group Props\n     */\n    @Input() previewImageSizes: string | undefined;\n    /**\n     * Attribute of the preview image element.\n     * @group Props\n     */\n    @Input() alt: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() width: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() height: string | undefined;\n    /**\n     * Attribute of the image element.\n     * @group Props\n     */\n    @Input() loading: 'lazy' | 'eager' | undefined;\n    /**\n     * Target element to attach the dialog, valid values are \"body\" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]=\"mydiv\" for a div element having #mydiv as variable name).\n     * @group Props\n     */\n    @Input() appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined | any;\n    /**\n     * Controls the preview functionality.\n     * @group Props\n     */\n    @Input({ transform: booleanAttribute }) preview: boolean = false;\n    /**\n     * Transition options of the show animation\n     * @group Props\n     */\n    @Input() showTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\n    /**\n     * Transition options of the hide animation\n     * @group Props\n     */\n    @Input() hideTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\n    /**\n     * Triggered when the preview overlay is shown.\n     * @group Emits\n     */\n    @Output() onShow: EventEmitter<any> = new EventEmitter<any>();\n    /**\n     * Triggered when the preview overlay is hidden.\n     * @group Emits\n     */\n    @Output() onHide: EventEmitter<any> = new EventEmitter<any>();\n    /**\n     * This event is triggered if an error occurs while loading an image file.\n     * @param {Event} event - Browser event.\n     * @group Emits\n     */\n    @Output() onImageError: EventEmitter<Event> = new EventEmitter<Event>();\n\n    @ViewChild('mask') mask: ElementRef | undefined;\n\n    @ViewChild('previewButton') previewButton: ElementRef | undefined;\n\n    @ViewChild('closeButton') closeButton: ElementRef | undefined;\n\n    @ContentChildren(CaxTemplate) templates: QueryList<CaxTemplate> | undefined;\n\n    indicatorTemplate: TemplateRef<any> | undefined;\n\n    rotateRightIconTemplate: TemplateRef<any> | undefined;\n\n    rotateLeftIconTemplate: TemplateRef<any> | undefined;\n\n    zoomOutIconTemplate: TemplateRef<any> | undefined;\n\n    zoomInIconTemplate: TemplateRef<any> | undefined;\n\n    closeIconTemplate: TemplateRef<any> | undefined;\n\n    maskVisible: boolean = false;\n\n    previewVisible: boolean = false;\n\n    rotate: number = 0;\n\n    scale: number = 1;\n\n    previewClick: boolean = false;\n\n    container: Nullable<HTMLElement>;\n\n    wrapper: Nullable<HTMLElement>;\n\n    public get isZoomOutDisabled(): boolean {\n        return this.scale - this.zoomSettings.step <= this.zoomSettings.min;\n    }\n\n    public get isZoomInDisabled(): boolean {\n        return this.scale + this.zoomSettings.step >= this.zoomSettings.max;\n    }\n\n    private zoomSettings = {\n        default: 1,\n        step: 0.1,\n        max: 1.5,\n        min: 0.5\n    };\n\n    constructor(\n        @Inject(DOCUMENT) private document: Document,\n        private config: caxConfig,\n        private cd: ChangeDetectorRef,\n        public el: ElementRef\n    ) {}\n\n    ngAfterContentInit() {\n        this.templates?.forEach((item) => {\n            switch (item.getType()) {\n                case 'indicator':\n                    this.indicatorTemplate = item.template;\n                    break;\n\n                case 'rotaterighticon':\n                    this.rotateRightIconTemplate = item.template;\n                    break;\n\n                case 'rotatelefticon':\n                    this.rotateLeftIconTemplate = item.template;\n                    break;\n\n                case 'zoomouticon':\n                    this.zoomOutIconTemplate = item.template;\n                    break;\n\n                case 'zoominicon':\n                    this.zoomInIconTemplate = item.template;\n                    break;\n\n                case 'closeicon':\n                    this.closeIconTemplate = item.template;\n                    break;\n\n                default:\n                    this.indicatorTemplate = item.template;\n                    break;\n            }\n        });\n    }\n\n    onImageClick() {\n        if (this.preview) {\n            this.maskVisible = true;\n            this.previewVisible = true;\n            DomHandler.blockBodyScroll();\n        }\n    }\n\n    onMaskClick() {\n        if (!this.previewClick) {\n            this.closePreview();\n        }\n\n        this.previewClick = false;\n    }\n\n    onMaskKeydown(event) {\n        switch (event.code) {\n            case 'Escape':\n                this.onMaskClick();\n                setTimeout(() => {\n                    DomHandler.focus(this.previewButton.nativeElement);\n                }, 25);\n                event.preventDefault();\n\n                break;\n\n            default:\n                break;\n        }\n    }\n\n    onPreviewImageClick() {\n        this.previewClick = true;\n    }\n\n    rotateRight() {\n        this.rotate += 90;\n        this.previewClick = true;\n    }\n\n    rotateLeft() {\n        this.rotate -= 90;\n        this.previewClick = true;\n    }\n\n    zoomIn() {\n        this.scale = this.scale + this.zoomSettings.step;\n        this.previewClick = true;\n    }\n\n    zoomOut() {\n        this.scale = this.scale - this.zoomSettings.step;\n        this.previewClick = true;\n    }\n\n    onAnimationStart(event: AnimationEvent) {\n        switch (event.toState) {\n            case 'visible':\n                this.container = event.element;\n                this.wrapper = this.container?.parentElement;\n                this.appendContainer();\n                this.moveOnTop();\n\n                setTimeout(() => {\n                    DomHandler.focus(this.closeButton.nativeElement);\n                }, 25);\n                break;\n\n            case 'void':\n                DomHandler.addClass(this.wrapper, 'cax-component-overlay-leave');\n                break;\n        }\n    }\n\n    onAnimationEnd(event: AnimationEvent) {\n        switch (event.toState) {\n            case 'void':\n                ZIndexUtils.clear(this.wrapper);\n                this.maskVisible = false;\n                this.container = null;\n                this.wrapper = null;\n                this.cd.markForCheck();\n                this.onHide.emit({});\n                break;\n            case 'visible':\n                this.onShow.emit({});\n                break;\n        }\n    }\n\n    moveOnTop() {\n        ZIndexUtils.set('modal', this.wrapper, this.config.zIndex.modal);\n    }\n\n    appendContainer() {\n        if (this.appendTo) {\n            if (this.appendTo === 'body') this.document.body.appendChild(this.wrapper as HTMLElement);\n            else DomHandler.appendChild(this.wrapper, this.appendTo);\n        }\n    }\n\n    imagePreviewStyle() {\n        return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };\n    }\n\n    get zoomImageAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomImage : undefined;\n    }\n\n    containerClass() {\n        return {\n            'cax-image cax-component': true,\n            'cax-image-preview-container': this.preview\n        };\n    }\n\n    handleToolbarClick(event: MouseEvent): void {\n        event.stopPropagation();\n    }\n\n    closePreview(): void {\n        this.previewVisible = false;\n        this.rotate = 0;\n        this.scale = this.zoomSettings.default;\n        DomHandler.unblockBodyScroll();\n    }\n\n    imageError(event: Event) {\n        this.onImageError.emit(event);\n    }\n\n    rightAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.rotateRight : undefined;\n    }\n\n    leftAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.rotateLeft : undefined;\n    }\n\n    zoomInAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomIn : undefined;\n    }\n\n    zoomOutAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.zoomOut : undefined;\n    }\n\n    closeAriaLabel() {\n        return this.config.translation.aria ? this.config.translation.aria.close : undefined;\n    }\n\n    @HostListener('document:keydown.escape', ['$event']) onKeydownHandler(event: KeyboardEvent) {\n        if (this.previewVisible) {\n            this.closePreview();\n        }\n    }\n\n    // custom methods\n    sizeClass() {\n        return {\n            [`cax-image-${this.size}`]: this.size\n        };\n    }\n}\n","<span [ngClass]=\"containerClass()\" [class]=\"styleClass\" [ngStyle]=\"style\">\r\n    <img\r\n        [attr.src]=\"src\"\r\n        [attr.srcset]=\"srcSet\"\r\n        [attr.sizes]=\"sizes\"\r\n        [attr.alt]=\"alt\"\r\n        [attr.width]=\"width\"\r\n        [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\"\r\n        [ngStyle]=\"imageStyle\"\r\n        [class]=\"imageClass\"\r\n        [ngClass]=\"sizeClass()\"\r\n        (error)=\"imageError($event)\"\r\n    />\r\n    <button *ngIf=\"preview\" [attr.aria-label]=\"zoomImageAriaLabel\" type=\"button\" class=\"cax-image-preview-indicator\" (click)=\"onImageClick()\" #previewButton [ngStyle]=\"{ height: height + 'px', width: width + 'px', border: 'none' }\">\r\n        <ng-container *ngIf=\"indicatorTemplate; else defaultTemplate\">\r\n            <ng-container *ngTemplateOutlet=\"indicatorTemplate\"></ng-container>\r\n        </ng-container>\r\n        <ng-template #defaultTemplate>\r\n            <EyeIcon [styleClass]=\"'cax-image-preview-icon'\" />\r\n        </ng-template>\r\n    </button>\r\n    <div #mask class=\"cax-image-mask cax-component-overlay cax-component-overlay-enter\" *ngIf=\"maskVisible\" [attr.aria-modal]=\"maskVisible\" role=\"dialog\" (click)=\"onMaskClick()\" (keydown)=\"onMaskKeydown($event)\" pFocusTrap>\r\n        <div class=\"cax-image-toolbar\" (click)=\"handleToolbarClick($event)\">\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateRight()\" type=\"button\" [attr.aria-label]=\"rightAriaLabel()\">\r\n                <RefreshIcon *ngIf=\"!rotateRightIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateRightIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"rotateLeft()\" type=\"button\" [attr.aria-label]=\"leftAriaLabel()\">\r\n                <UndoIcon *ngIf=\"!rotateLeftIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"rotateLeftIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomOut()\" type=\"button\" [disabled]=\"isZoomOutDisabled\" [attr.aria-label]=\"zoomOutAriaLabel()\">\r\n                <SearchMinusIcon *ngIf=\"!zoomOutIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomOutIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" (click)=\"zoomIn()\" type=\"button\" [disabled]=\"isZoomInDisabled\" [attr.aria-label]=\"zoomInAriaLabel()\">\r\n                <SearchPlusIcon *ngIf=\"!zoomInIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"zoomInIconTemplate\"></ng-template>\r\n            </button>\r\n            <button class=\"cax-image-action cax-link\" type=\"button\" (click)=\"closePreview()\" [attr.aria-label]=\"closeAriaLabel()\" #closeButton>\r\n                <TimesIcon *ngIf=\"!closeIconTemplate\" />\r\n                <ng-template *ngTemplateOutlet=\"closeIconTemplate\"></ng-template>\r\n            </button>\r\n        </div>\r\n        <div\r\n            *ngIf=\"previewVisible\"\r\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n            (@animation.start)=\"onAnimationStart($event)\"\r\n            (@animation.done)=\"onAnimationEnd($event)\"\r\n        >\r\n            <img [attr.src]=\"previewImageSrc ? previewImageSrc : src\" [attr.srcset]=\"previewImageSrcSet\" [attr.sizes]=\"previewImageSizes\" class=\"cax-image-preview\" [ngStyle]=\"imagePreviewStyle()\" (click)=\"onPreviewImageClick()\" />\r\n        </div>\r\n    </div>\r\n</span>\r\n","import { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { Image } from './image';\n\n@NgModule({\n    imports: [Image, SharedModule],\n    exports: [Image, SharedModule]\n})\nexport class ImageModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-inputgroup.mjs

@@ -41,13 +41,13 @@ class InputGroup {
      */
     label = '';
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InputGroup, selector: "cax-inputgroup", inputs: { ingredient: "ingredient", value: "value", style: "style", styleClass: "styleClass", label: "label" }, outputs: { onClick: "onClick" }, host: { classAttribute: "cax-element cax-inputgroup" }, ngImport: i0, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InputGroup, selector: "cax-inputgroup", inputs: { ingredient: "ingredient", value: "value", style: "style", styleClass: "styleClass", label: "label" }, outputs: { onClick: "onClick" }, host: { classAttribute: "cax-element cax-inputgroup" }, ngImport: i0, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputGroup, decorators: [{
             type: Component,
             args: [{ selector: 'cax-inputgroup', host: {
                         class: 'cax-element cax-inputgroup'
-                    }, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n</div>\n" }]
+                    }, template: "<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n" }]
         }], propDecorators: { ingredient: [{
                 type: Input
             }], onClick: [{

package/fesm2022/cax-design-system-inputgroup.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-inputgroup.mjs","sources":["../../src/app/components/inputgroup/inputgroup.ts","../../src/app/components/inputgroup/inputgroup.html","../../src/app/components/inputgroup/inputgroup.module.ts","../../src/app/components/inputgroup/cax-design-system-inputgroup.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\n/**\n * InputGroup displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup',\n    templateUrl: './inputgroup.html',\n    host: {\n        class: 'cax-element cax-inputgroup'\n    }\n})\nexport class InputGroup {\n    model: true;\n    onChange(event) {\n        this.model = event.checked;\n    }\n    @Input() ingredient!: string;\n    @Output() onClick: EventEmitter<any> = new EventEmitter();\n\n    radioClick(event) {\n        this.onClick.emit(event);\n    }\n    @Input() value: string = '';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Label text to display above the input group\n     * @group Props\n     */\n    @Input() label: string = '';\n}\n","<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\n    <div class=\"cax-inputgroup\">\n        <ng-content></ng-content>\n    </div>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroup } from './inputgroup';\nimport { FormsModule } from '@angular/forms';\nimport { InputGroupAddonModule } from 'cax-design-system/inputgroupaddon';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroup, SharedModule],\n    declarations: [InputGroup]\n})\nexport class InputGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cax-design-system-inputgroup.mjs","sources":["../../src/app/components/inputgroup/inputgroup.ts","../../src/app/components/inputgroup/inputgroup.html","../../src/app/components/inputgroup/inputgroup.module.ts","../../src/app/components/inputgroup/cax-design-system-inputgroup.ts"],"sourcesContent":["import { Component, EventEmitter, Input, Output } from '@angular/core';\n/**\n * InputGroup displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup',\n    templateUrl: './inputgroup.html',\n    host: {\n        class: 'cax-element cax-inputgroup'\n    }\n})\nexport class InputGroup {\n    model: true;\n    onChange(event) {\n        this.model = event.checked;\n    }\n    @Input() ingredient!: string;\n    @Output() onClick: EventEmitter<any> = new EventEmitter();\n\n    radioClick(event) {\n        this.onClick.emit(event);\n    }\n    @Input() value: string = '';\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n    /**\n     * Label text to display above the input group\n     * @group Props\n     */\n    @Input() label: string = '';\n}\n","<div class=\"cax-inputgroup-container\" [attr.data-pc-name]=\"'inputgroup'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\">{{label}}</label>\r\n    <div class=\"cax-inputgroup\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</div>\r\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroup } from './inputgroup';\nimport { FormsModule } from '@angular/forms';\nimport { InputGroupAddonModule } from 'cax-design-system/inputgroupaddon';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputGroupAddonModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroup, SharedModule],\n    declarations: [InputGroup]\n})\nexport class InputGroupModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cax-design-system-inputgroupaddon.mjs

@@ -25,13 +25,13 @@ class InputGroupAddon {
      */
     styleClass;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputGroupAddon, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InputGroupAddon, selector: "cax-inputgroup-addon", inputs: { style: "style", styleClass: "styleClass" }, host: { classAttribute: "cax-element cax-inputgroup-addon" }, ngImport: i0, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n  <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.9", type: InputGroupAddon, selector: "cax-inputgroup-addon", inputs: { style: "style", styleClass: "styleClass" }, host: { classAttribute: "cax-element cax-inputgroup-addon" }, ngImport: i0, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputGroupAddon, decorators: [{
             type: Component,
             args: [{ selector: 'cax-inputgroup-addon', host: {
                         class: 'cax-element cax-inputgroup-addon'
-                    }, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n  <ng-content></ng-content>\n</div>\n" }]
+                    }, template: "<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n" }]
         }], propDecorators: { style: [{
                 type: Input
             }], styleClass: [{

package/fesm2022/cax-design-system-inputgroupaddon.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cax-design-system-inputgroupaddon.mjs","sources":["../../src/app/components/inputgroupaddon/inputgroupaddon.ts","../../src/app/components/inputgroupaddon/inputgroupaddon.html","../../src/app/components/inputgroupaddon/inputgroupaddon.module.ts","../../src/app/components/inputgroupaddon/cax-design-system-inputgroupaddon.ts"],"sourcesContent":["import { Component, EventEmitter, Input, NgModule, Output } from '@angular/core';\n/**\n * InputGroupAddon displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup-addon',\n    templateUrl: './inputgroupaddon.html',\n    host: {\n        class: 'cax-element cax-inputgroup-addon'\n    }\n})\nexport class InputGroupAddon {\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n}\n","<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\n  <ng-content></ng-content>\n</div>\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroupAddon } from './inputgroupaddon';\nimport { FormsModule } from '@angular/forms';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroupAddon, SharedModule],\n    declarations: [InputGroupAddon]\n})\nexport class InputGroupAddonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;AACA;;;AAGG;MAQU,eAAe,CAAA;AACxB;;;AAGG;AACM,IAAA,KAAK,CAA8C;AAC5D;;;AAGG;AACM,IAAA,UAAU,CAAqB;uGAV/B,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,gLCZ5B,qIAGA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FDSa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,EAE1B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,kCAAkC;AAC5C,qBAAA,EAAA,QAAA,EAAA,qIAAA,EAAA,CAAA;8BAOQ,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,UAAU,EAAA,CAAA;sBAAlB,KAAK;;;MEPG,qBAAqB,CAAA;uGAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,iBAFf,eAAe,CAAA,EAAA,OAAA,EAAA,CAFpB,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,CAC/E,EAAA,OAAA,EAAA,CAAA,eAAe,EAAE,YAAY,CAAA,EAAA,CAAA,CAAA;AAG9B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,EAJpB,OAAA,EAAA,CAAA,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAC9D,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAG9B,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,CAAC;AAC1F,oBAAA,OAAO,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC;oBACxC,YAAY,EAAE,CAAC,eAAe,CAAC;AAClC,iBAAA,CAAA;;;ACdD;;AAEG;;;;"}
+{"version":3,"file":"cax-design-system-inputgroupaddon.mjs","sources":["../../src/app/components/inputgroupaddon/inputgroupaddon.ts","../../src/app/components/inputgroupaddon/inputgroupaddon.html","../../src/app/components/inputgroupaddon/inputgroupaddon.module.ts","../../src/app/components/inputgroupaddon/cax-design-system-inputgroupaddon.ts"],"sourcesContent":["import { Component, EventEmitter, Input, NgModule, Output } from '@angular/core';\n/**\n * InputGroupAddon displays text, icon, buttons and other content can be grouped next to an input.\n * @group Components\n */\n@Component({\n    selector: 'cax-inputgroup-addon',\n    templateUrl: './inputgroupaddon.html',\n    host: {\n        class: 'cax-element cax-inputgroup-addon'\n    }\n})\nexport class InputGroupAddon {\n    /**\n     * Inline style of the element.\n     * @group Props\n     */\n    @Input() style: { [klass: string]: any } | null | undefined;\n    /**\n     * Class of the element.\n     * @group Props\n     */\n    @Input() styleClass: string | undefined;\n}\n","<div [attr.data-pc-name]=\"'inputgroupaddon'\" [ngClass]=\"styleClass\" [ngStyle]=\"style\">\r\n  <ng-content></ng-content>\r\n</div>\r\n","import { CommonModule } from '@angular/common';\nimport { NgModule } from '@angular/core';\nimport { SharedModule } from 'cax-design-system/api';\nimport { InputGroupAddon } from './inputgroupaddon';\nimport { FormsModule } from '@angular/forms';\nimport { Button } from 'cax-design-system/button';\nimport { CheckboxModule } from 'cax-design-system/checkbox';\nimport { InputTextModule } from 'cax-design-system/inputtext';\nimport { RadioButton, RadioButtonModule } from 'cax-design-system/radiobutton';\n\n@NgModule({\n    imports: [CommonModule, FormsModule, InputTextModule, Button, CheckboxModule, RadioButton],\n    exports: [InputGroupAddon, SharedModule],\n    declarations: [InputGroupAddon]\n})\nexport class InputGroupAddonModule {}\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public_api';\n"],"names":[],"mappings":";;;;;;;;;;;AACA;;;AAGG;MAQU,eAAe,CAAA;AACxB;;;AAGG;AACM,IAAA,KAAK,CAA8C;AAC5D;;;AAGG;AACM,IAAA,UAAU,CAAqB;uGAV/B,eAAe,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAf,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,eAAe,gLCZ5B,2IAGA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,SAAA,CAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;2FDSa,eAAe,EAAA,UAAA,EAAA,CAAA;kBAP3B,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,sBAAsB,EAE1B,IAAA,EAAA;AACF,wBAAA,KAAK,EAAE,kCAAkC;AAC5C,qBAAA,EAAA,QAAA,EAAA,2IAAA,EAAA,CAAA;8BAOQ,KAAK,EAAA,CAAA;sBAAb,KAAK;gBAKG,UAAU,EAAA,CAAA;sBAAlB,KAAK;;;MEPG,qBAAqB,CAAA;uGAArB,qBAAqB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;AAArB,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,iBAFf,eAAe,CAAA,EAAA,OAAA,EAAA,CAFpB,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,CAC/E,EAAA,OAAA,EAAA,CAAA,eAAe,EAAE,YAAY,CAAA,EAAA,CAAA,CAAA;AAG9B,IAAA,OAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,qBAAqB,EAJpB,OAAA,EAAA,CAAA,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,EAC9D,YAAY,CAAA,EAAA,CAAA,CAAA;;2FAG9B,qBAAqB,EAAA,UAAA,EAAA,CAAA;kBALjC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;AACN,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,cAAc,EAAE,WAAW,CAAC;AAC1F,oBAAA,OAAO,EAAE,CAAC,eAAe,EAAE,YAAY,CAAC;oBACxC,YAAY,EAAE,CAAC,eAAe,CAAC;AAClC,iBAAA,CAAA;;;ACdD;;AAEG;;;;"}

package/fesm2022/cax-design-system-inputmask.mjs

@@ -728,7 +728,7 @@ class InputMask {
         this.onClear.emit();
     }
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputMask, deps: [{ token: DOCUMENT }, { token: PLATFORM_ID }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.caxConfig }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: InputMask, selector: "cax-inputMask", inputs: { type: "type", slotChar: "slotChar", autoClear: ["autoClear", "autoClear", booleanAttribute], showClear: ["showClear", "showClear", booleanAttribute], style: "style", inputId: "inputId", styleClass: "styleClass", placeholder: "placeholder", size: ["size", "size", numberAttribute], maxlength: ["maxlength", "maxlength", numberAttribute], tabindex: "tabindex", title: "title", variant: "variant", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRequired: ["ariaRequired", "ariaRequired", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], unmask: ["unmask", "unmask", booleanAttribute], name: "name", required: ["required", "required", booleanAttribute], characterPattern: "characterPattern", autofocus: ["autofocus", "autofocus", booleanAttribute], autoFocus: ["autoFocus", "autoFocus", booleanAttribute], autocomplete: "autocomplete", keepBuffer: ["keepBuffer", "keepBuffer", booleanAttribute], mask: "mask", label: "label", leftIcon: "leftIcon", rightIcon: "rightIcon", clearIcon: "clearIcon", leftIconClass: "leftIconClass", rightIconClass: "rightIconClass", invalid: "invalid", errorText: "errorText", successText: "successText", heightsize: "heightsize" }, outputs: { onComplete: "onComplete", onFocus: "onFocus", onBlur: "onBlur", onInput: "onInput", onKeydown: "onKeydown", onClear: "onClear" }, host: { properties: { "class.cax-inputwrapper-filled": "filled", "class.cax-inputwrapper-focus": "focused", "class.cax-inputmask-clearable": "showClear && !disabled" }, classAttribute: "cax-element" }, providers: [INPUTMASK_VALUE_ACCESSOR], queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "inputViewChild", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"cax-input-container\"\n     [class]=\"styleClass\"\n     [ngClass]=\"'cax-input-size-' + heightsize\"\n     [ngStyle]=\"style\">\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{'disabled-opacity': disabled}\">{{ label }}</label>\n\n    <div class=\"cax-input-wrapper\"\n        [ngClass]=\"{\n            'with-left-icon': leftIcon,\n            'with-right-icon': rightIcon,\n            'with-clear-icon': clearIcon && value,\n            'input-disabled': disabled\n        }\"\n    >\n        <!-- Left Icon -->\n        <span *ngIf=\"leftIcon\"\n              class=\"cax-icon-container cax-icon-left\">\n            <i [ngClass]=\"leftIconClass\"></i>\n        </span>\n\n      <input\n          #input\n          [class]=\"styleClass\"\n          [ngClass]=\"{\n              'cax-inputtext': true,\n              'cax-inputmask': true,\n              'cax-input-invalid': invalid,\n              'input-disabled': disabled,\n              'with-left-icon': leftIcon,\n              'with-right-icon': rightIcon || (clearIcon && value)\n          }\"\n          [attr.id]=\"inputId\"\n          [attr.type]=\"type\"\n          [attr.name]=\"name\"\n          [ngStyle]=\"style\"\n          [attr.placeholder]=\"placeholder\"\n          [attr.size]=\"size\"\n          [attr.autocomplete]=\"autocomplete\"\n          [attr.maxlength]=\"maxlength\"\n          [attr.tabindex]=\"tabindex\"\n          [attr.aria-label]=\"ariaLabel\"\n          [attr.aria-labelledBy]=\"ariaLabelledBy\"\n          [attr.aria-required]=\"ariaRequired\"\n          [disabled]=\"disabled\"\n          [readonly]=\"readonly\"\n          [attr.required]=\"required\"\n          (focus)=\"onInputFocus($event)\"\n          (blur)=\"onInputBlur($event)\"\n          (keydown)=\"onInputKeydown($event)\"\n          (keypress)=\"onKeyPress($event)\"\n          (input)=\"onInputChange($event)\"\n          (paste)=\"handleInputChange($event)\"\n          [attr.data-pc-name]=\"'inputmask'\"\n          [attr.data-pc-section]=\"'root'\"\n          [attr.aria-describedby]=\"successText || invalid ? 'helper-text' : null\"\n      />\n\n    <!-- Clear Icon (before right icon) -->\n    <span *ngIf=\"clearIcon && value\"\n    class=\"cax-icon-container cax-clear-icon clickable-icon\"\n    [ngClass]=\"{'no-right-icon': !rightIcon}\"\n    (click)=\"clear()\">\n  <i class=\"cax cax-close-circle\"></i>\n</span>\n\n<!-- Right Icon -->\n<span *ngIf=\"rightIcon\"\n    class=\"cax-icon-container cax-icon-right\">\n  <i [ngClass]=\"rightIconClass\"></i>\n</span>\n</div>\n\n<!-- Error Message with conditional opacity -->\n<small *ngIf=\"invalid\" id=\"helper-text\" class=\"cax-error disabled-opacity\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ errorText }} </small>\n\n<!-- Helper Text with conditional opacity -->\n<small *ngIf=\"successText && !invalid\" id=\"helper-text\" class=\"cax-helper-text\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ successText }} </small>\n</div>\n\n<ng-container *ngIf=\"value != null && filled && showClear && !disabled\">\n  <TimesIcon *ngIf=\"!clearIconTemplate\" [styleClass]=\"'cax-inputmask-clear-icon'\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\" />\n  <span *ngIf=\"clearIconTemplate\" class=\"p-inputmask-clear-icon\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\">\n      <ng-template *ngTemplateOutlet=\"clearIconTemplate\"></ng-template>\n  </span>\n</ng-container>\n", styles: ["@layer cax{.cax-inputmask-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.cax-inputmask-clearable{position:relative}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.TimesIcon, selector: "TimesIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.2.9", type: InputMask, selector: "cax-inputMask", inputs: { type: "type", slotChar: "slotChar", autoClear: ["autoClear", "autoClear", booleanAttribute], showClear: ["showClear", "showClear", booleanAttribute], style: "style", inputId: "inputId", styleClass: "styleClass", placeholder: "placeholder", size: ["size", "size", numberAttribute], maxlength: ["maxlength", "maxlength", numberAttribute], tabindex: "tabindex", title: "title", variant: "variant", ariaLabel: "ariaLabel", ariaLabelledBy: "ariaLabelledBy", ariaRequired: ["ariaRequired", "ariaRequired", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute], readonly: ["readonly", "readonly", booleanAttribute], unmask: ["unmask", "unmask", booleanAttribute], name: "name", required: ["required", "required", booleanAttribute], characterPattern: "characterPattern", autofocus: ["autofocus", "autofocus", booleanAttribute], autoFocus: ["autoFocus", "autoFocus", booleanAttribute], autocomplete: "autocomplete", keepBuffer: ["keepBuffer", "keepBuffer", booleanAttribute], mask: "mask", label: "label", leftIcon: "leftIcon", rightIcon: "rightIcon", clearIcon: "clearIcon", leftIconClass: "leftIconClass", rightIconClass: "rightIconClass", invalid: "invalid", errorText: "errorText", successText: "successText", heightsize: "heightsize" }, outputs: { onComplete: "onComplete", onFocus: "onFocus", onBlur: "onBlur", onInput: "onInput", onKeydown: "onKeydown", onClear: "onClear" }, host: { properties: { "class.cax-inputwrapper-filled": "filled", "class.cax-inputwrapper-focus": "focused", "class.cax-inputmask-clearable": "showClear && !disabled" }, classAttribute: "cax-element" }, providers: [INPUTMASK_VALUE_ACCESSOR], queries: [{ propertyName: "templates", predicate: CaxTemplate }], viewQueries: [{ propertyName: "inputViewChild", first: true, predicate: ["input"], descendants: true, static: true }], ngImport: i0, template: "<div class=\"cax-input-container\"\r\n     [class]=\"styleClass\"\r\n     [ngClass]=\"'cax-input-size-' + heightsize\"\r\n     [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{'disabled-opacity': disabled}\">{{ label }}</label>\r\n\r\n    <div class=\"cax-input-wrapper\"\r\n        [ngClass]=\"{\r\n            'with-left-icon': leftIcon,\r\n            'with-right-icon': rightIcon,\r\n            'with-clear-icon': clearIcon && value,\r\n            'input-disabled': disabled\r\n        }\"\r\n    >\r\n        <!-- Left Icon -->\r\n        <span *ngIf=\"leftIcon\"\r\n              class=\"cax-icon-container cax-icon-left\">\r\n            <i [ngClass]=\"leftIconClass\"></i>\r\n        </span>\r\n\r\n      <input\r\n          #input\r\n          [class]=\"styleClass\"\r\n          [ngClass]=\"{\r\n              'cax-inputtext': true,\r\n              'cax-inputmask': true,\r\n              'cax-input-invalid': invalid,\r\n              'input-disabled': disabled,\r\n              'with-left-icon': leftIcon,\r\n              'with-right-icon': rightIcon || (clearIcon && value)\r\n          }\"\r\n          [attr.id]=\"inputId\"\r\n          [attr.type]=\"type\"\r\n          [attr.name]=\"name\"\r\n          [ngStyle]=\"style\"\r\n          [attr.placeholder]=\"placeholder\"\r\n          [attr.size]=\"size\"\r\n          [attr.autocomplete]=\"autocomplete\"\r\n          [attr.maxlength]=\"maxlength\"\r\n          [attr.tabindex]=\"tabindex\"\r\n          [attr.aria-label]=\"ariaLabel\"\r\n          [attr.aria-labelledBy]=\"ariaLabelledBy\"\r\n          [attr.aria-required]=\"ariaRequired\"\r\n          [disabled]=\"disabled\"\r\n          [readonly]=\"readonly\"\r\n          [attr.required]=\"required\"\r\n          (focus)=\"onInputFocus($event)\"\r\n          (blur)=\"onInputBlur($event)\"\r\n          (keydown)=\"onInputKeydown($event)\"\r\n          (keypress)=\"onKeyPress($event)\"\r\n          (input)=\"onInputChange($event)\"\r\n          (paste)=\"handleInputChange($event)\"\r\n          [attr.data-pc-name]=\"'inputmask'\"\r\n          [attr.data-pc-section]=\"'root'\"\r\n          [attr.aria-describedby]=\"successText || invalid ? 'helper-text' : null\"\r\n      />\r\n\r\n    <!-- Clear Icon (before right icon) -->\r\n    <span *ngIf=\"clearIcon && value\"\r\n    class=\"cax-icon-container cax-clear-icon clickable-icon\"\r\n    [ngClass]=\"{'no-right-icon': !rightIcon}\"\r\n    (click)=\"clear()\">\r\n  <i class=\"cax cax-close-circle\"></i>\r\n</span>\r\n\r\n<!-- Right Icon -->\r\n<span *ngIf=\"rightIcon\"\r\n    class=\"cax-icon-container cax-icon-right\">\r\n  <i [ngClass]=\"rightIconClass\"></i>\r\n</span>\r\n</div>\r\n\r\n<!-- Error Message with conditional opacity -->\r\n<small *ngIf=\"invalid\" id=\"helper-text\" class=\"cax-error disabled-opacity\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ errorText }} </small>\r\n\r\n<!-- Helper Text with conditional opacity -->\r\n<small *ngIf=\"successText && !invalid\" id=\"helper-text\" class=\"cax-helper-text\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ successText }} </small>\r\n</div>\r\n\r\n<ng-container *ngIf=\"value != null && filled && showClear && !disabled\">\r\n  <TimesIcon *ngIf=\"!clearIconTemplate\" [styleClass]=\"'cax-inputmask-clear-icon'\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\" />\r\n  <span *ngIf=\"clearIconTemplate\" class=\"p-inputmask-clear-icon\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\">\r\n      <ng-template *ngTemplateOutlet=\"clearIconTemplate\"></ng-template>\r\n  </span>\r\n</ng-container>\r\n", styles: ["@layer cax{.cax-inputmask-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.cax-inputmask-clearable{position:relative}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i3.TimesIcon, selector: "TimesIcon" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImport: i0, type: InputMask, decorators: [{
             type: Component,
@@ -737,7 +737,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.9", ngImpor
                         '[class.cax-inputwrapper-filled]': 'filled',
                         '[class.cax-inputwrapper-focus]': 'focused',
                         '[class.cax-inputmask-clearable]': 'showClear && !disabled'
-                    }, providers: [INPUTMASK_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"cax-input-container\"\n     [class]=\"styleClass\"\n     [ngClass]=\"'cax-input-size-' + heightsize\"\n     [ngStyle]=\"style\">\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{'disabled-opacity': disabled}\">{{ label }}</label>\n\n    <div class=\"cax-input-wrapper\"\n        [ngClass]=\"{\n            'with-left-icon': leftIcon,\n            'with-right-icon': rightIcon,\n            'with-clear-icon': clearIcon && value,\n            'input-disabled': disabled\n        }\"\n    >\n        <!-- Left Icon -->\n        <span *ngIf=\"leftIcon\"\n              class=\"cax-icon-container cax-icon-left\">\n            <i [ngClass]=\"leftIconClass\"></i>\n        </span>\n\n      <input\n          #input\n          [class]=\"styleClass\"\n          [ngClass]=\"{\n              'cax-inputtext': true,\n              'cax-inputmask': true,\n              'cax-input-invalid': invalid,\n              'input-disabled': disabled,\n              'with-left-icon': leftIcon,\n              'with-right-icon': rightIcon || (clearIcon && value)\n          }\"\n          [attr.id]=\"inputId\"\n          [attr.type]=\"type\"\n          [attr.name]=\"name\"\n          [ngStyle]=\"style\"\n          [attr.placeholder]=\"placeholder\"\n          [attr.size]=\"size\"\n          [attr.autocomplete]=\"autocomplete\"\n          [attr.maxlength]=\"maxlength\"\n          [attr.tabindex]=\"tabindex\"\n          [attr.aria-label]=\"ariaLabel\"\n          [attr.aria-labelledBy]=\"ariaLabelledBy\"\n          [attr.aria-required]=\"ariaRequired\"\n          [disabled]=\"disabled\"\n          [readonly]=\"readonly\"\n          [attr.required]=\"required\"\n          (focus)=\"onInputFocus($event)\"\n          (blur)=\"onInputBlur($event)\"\n          (keydown)=\"onInputKeydown($event)\"\n          (keypress)=\"onKeyPress($event)\"\n          (input)=\"onInputChange($event)\"\n          (paste)=\"handleInputChange($event)\"\n          [attr.data-pc-name]=\"'inputmask'\"\n          [attr.data-pc-section]=\"'root'\"\n          [attr.aria-describedby]=\"successText || invalid ? 'helper-text' : null\"\n      />\n\n    <!-- Clear Icon (before right icon) -->\n    <span *ngIf=\"clearIcon && value\"\n    class=\"cax-icon-container cax-clear-icon clickable-icon\"\n    [ngClass]=\"{'no-right-icon': !rightIcon}\"\n    (click)=\"clear()\">\n  <i class=\"cax cax-close-circle\"></i>\n</span>\n\n<!-- Right Icon -->\n<span *ngIf=\"rightIcon\"\n    class=\"cax-icon-container cax-icon-right\">\n  <i [ngClass]=\"rightIconClass\"></i>\n</span>\n</div>\n\n<!-- Error Message with conditional opacity -->\n<small *ngIf=\"invalid\" id=\"helper-text\" class=\"cax-error disabled-opacity\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ errorText }} </small>\n\n<!-- Helper Text with conditional opacity -->\n<small *ngIf=\"successText && !invalid\" id=\"helper-text\" class=\"cax-helper-text\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ successText }} </small>\n</div>\n\n<ng-container *ngIf=\"value != null && filled && showClear && !disabled\">\n  <TimesIcon *ngIf=\"!clearIconTemplate\" [styleClass]=\"'cax-inputmask-clear-icon'\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\" />\n  <span *ngIf=\"clearIconTemplate\" class=\"p-inputmask-clear-icon\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\">\n      <ng-template *ngTemplateOutlet=\"clearIconTemplate\"></ng-template>\n  </span>\n</ng-container>\n", styles: ["@layer cax{.cax-inputmask-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.cax-inputmask-clearable{position:relative}}\n"] }]
+                    }, providers: [INPUTMASK_VALUE_ACCESSOR], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: "<div class=\"cax-input-container\"\r\n     [class]=\"styleClass\"\r\n     [ngClass]=\"'cax-input-size-' + heightsize\"\r\n     [ngStyle]=\"style\">\r\n    <label *ngIf=\"label\" class=\"cax-label\" [ngClass]=\"{'disabled-opacity': disabled}\">{{ label }}</label>\r\n\r\n    <div class=\"cax-input-wrapper\"\r\n        [ngClass]=\"{\r\n            'with-left-icon': leftIcon,\r\n            'with-right-icon': rightIcon,\r\n            'with-clear-icon': clearIcon && value,\r\n            'input-disabled': disabled\r\n        }\"\r\n    >\r\n        <!-- Left Icon -->\r\n        <span *ngIf=\"leftIcon\"\r\n              class=\"cax-icon-container cax-icon-left\">\r\n            <i [ngClass]=\"leftIconClass\"></i>\r\n        </span>\r\n\r\n      <input\r\n          #input\r\n          [class]=\"styleClass\"\r\n          [ngClass]=\"{\r\n              'cax-inputtext': true,\r\n              'cax-inputmask': true,\r\n              'cax-input-invalid': invalid,\r\n              'input-disabled': disabled,\r\n              'with-left-icon': leftIcon,\r\n              'with-right-icon': rightIcon || (clearIcon && value)\r\n          }\"\r\n          [attr.id]=\"inputId\"\r\n          [attr.type]=\"type\"\r\n          [attr.name]=\"name\"\r\n          [ngStyle]=\"style\"\r\n          [attr.placeholder]=\"placeholder\"\r\n          [attr.size]=\"size\"\r\n          [attr.autocomplete]=\"autocomplete\"\r\n          [attr.maxlength]=\"maxlength\"\r\n          [attr.tabindex]=\"tabindex\"\r\n          [attr.aria-label]=\"ariaLabel\"\r\n          [attr.aria-labelledBy]=\"ariaLabelledBy\"\r\n          [attr.aria-required]=\"ariaRequired\"\r\n          [disabled]=\"disabled\"\r\n          [readonly]=\"readonly\"\r\n          [attr.required]=\"required\"\r\n          (focus)=\"onInputFocus($event)\"\r\n          (blur)=\"onInputBlur($event)\"\r\n          (keydown)=\"onInputKeydown($event)\"\r\n          (keypress)=\"onKeyPress($event)\"\r\n          (input)=\"onInputChange($event)\"\r\n          (paste)=\"handleInputChange($event)\"\r\n          [attr.data-pc-name]=\"'inputmask'\"\r\n          [attr.data-pc-section]=\"'root'\"\r\n          [attr.aria-describedby]=\"successText || invalid ? 'helper-text' : null\"\r\n      />\r\n\r\n    <!-- Clear Icon (before right icon) -->\r\n    <span *ngIf=\"clearIcon && value\"\r\n    class=\"cax-icon-container cax-clear-icon clickable-icon\"\r\n    [ngClass]=\"{'no-right-icon': !rightIcon}\"\r\n    (click)=\"clear()\">\r\n  <i class=\"cax cax-close-circle\"></i>\r\n</span>\r\n\r\n<!-- Right Icon -->\r\n<span *ngIf=\"rightIcon\"\r\n    class=\"cax-icon-container cax-icon-right\">\r\n  <i [ngClass]=\"rightIconClass\"></i>\r\n</span>\r\n</div>\r\n\r\n<!-- Error Message with conditional opacity -->\r\n<small *ngIf=\"invalid\" id=\"helper-text\" class=\"cax-error disabled-opacity\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ errorText }} </small>\r\n\r\n<!-- Helper Text with conditional opacity -->\r\n<small *ngIf=\"successText && !invalid\" id=\"helper-text\" class=\"cax-helper-text\" [ngClass]=\"{'disabled-opacity': disabled}\"> {{ successText }} </small>\r\n</div>\r\n\r\n<ng-container *ngIf=\"value != null && filled && showClear && !disabled\">\r\n  <TimesIcon *ngIf=\"!clearIconTemplate\" [styleClass]=\"'cax-inputmask-clear-icon'\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\" />\r\n  <span *ngIf=\"clearIconTemplate\" class=\"p-inputmask-clear-icon\" (click)=\"clear()\" [attr.data-pc-section]=\"'clearIcon'\">\r\n      <ng-template *ngTemplateOutlet=\"clearIconTemplate\"></ng-template>\r\n  </span>\r\n</ng-container>\r\n", styles: ["@layer cax{.cax-inputmask-clear-icon{position:absolute;top:50%;margin-top:-.5rem;cursor:pointer}.cax-inputmask-clearable{position:relative}}\n"] }]
         }], ctorParameters: () => [{ type: Document, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]