cmat 0.0.42 → 0.0.44

package/fesm2022/cmat-components-image-viewer.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-image-viewer.mjs","sources":["../../../projects/cmat/components/image-viewer/image-viewer.component.ts","../../../projects/cmat/components/image-viewer/image-viewer.component.html","../../../projects/cmat/components/image-viewer/cmat-components-image-viewer.ts"],"sourcesContent":["import { AnimationEvent, animate, style, transition, trigger } from '@angular/animations';\r\nimport { CommonModule } from '@angular/common';\r\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, ElementRef, EventEmitter, HostListener, Input, Output, TemplateRef, ViewChild, ViewEncapsulation, booleanAttribute, DOCUMENT, inject } from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SafeUrl } from '@angular/platform-browser';\r\n\r\n@Component({\r\n    selector: 'cmat-image',\r\n    templateUrl: './image-viewer.component.html',\r\n    styleUrls: ['./image-viewer.component.scss'],\r\n    animations: [\r\n        trigger('animation', [\r\n            transition('void => visible', [style({ transform: 'scale(0.7)', opacity: 0 }), animate('{{showTransitionParams}}')]),\r\n            transition('visible => void', [animate('{{hideTransitionParams}}', style({ transform: 'scale(0.7)', opacity: 0 }))])\r\n        ])\r\n    ],\r\n    imports: [CommonModule, MatButtonModule, MatIconModule],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None\r\n})\r\nexport class CmatImageComponent {\r\n\r\n    @Input() imageClass: string | undefined;\r\n\r\n    @Input() imageStyle: Record<string, any> | null | undefined;\r\n\r\n    @Input() src: string | SafeUrl | undefined;\r\n\r\n    @Input() srcSet: string | SafeUrl | undefined;\r\n\r\n    @Input() previewImageSrc: string | SafeUrl | undefined;\r\n\r\n    @Input() previewImageSrcSet: string | SafeUrl | undefined;\r\n\r\n    @Input() alt: string | undefined;\r\n\r\n    @Input() width: number | undefined;\r\n\r\n    @Input() height: number | undefined;\r\n\r\n    @Input() loading: 'lazy' | 'eager' | undefined;\r\n    /**\r\n     * 要附加对话框的目标元素，有效值是“body”或另一个元素的本地ng模板变量（注意：使用带括号的绑定来绑定模板变量，例如[appedTo]=“mydiv”用于变量名为#mydiv的div元素）。\r\n     */\r\n    @Input() appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined;\r\n    /**\r\n     * 启动预览功能。\r\n     */\r\n    @Input({ transform: booleanAttribute }) preview: boolean = false;\r\n    /**\r\n     * 切换时显示动画\r\n     */\r\n    @Input() showTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\r\n    /**\r\n     * 切换时隐藏动画\r\n     */\r\n    @Input() hideTransitionOptions: string = '150ms cubic-bezier(0, 0, 0.2, 1)';\r\n    /**\r\n     * 监听预览显示/隐藏.\r\n     */\r\n    @Output() previewShowChange: EventEmitter<boolean> = new EventEmitter<boolean>();\r\n    /**\r\n     * 如果加载图像文件时发生错误，则会触发此事件.\r\n     */\r\n    @Output() imageErrorEvent: EventEmitter<Event> = new EventEmitter<Event>();\r\n\r\n    @ViewChild('mask') mask: ElementRef | undefined;\r\n\r\n    @ViewChild('previewButton') previewButton: ElementRef | undefined;\r\n\r\n    @ViewChild('closeButton') closeButton: ElementRef | undefined;\r\n\r\n    el = inject(ElementRef);\r\n\r\n    maskVisible: boolean = false;\r\n\r\n    previewVisible: boolean = false;\r\n\r\n    rotate: number = 0;\r\n\r\n    scale: number = 1;\r\n\r\n    container: HTMLElement | void | null | undefined;\r\n\r\n    wrapper: HTMLElement | void | null | undefined;\r\n\r\n    private _document = inject<Document>(DOCUMENT);\r\n    private _changeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n    private _zoomSettings = {\r\n        default: 1,\r\n        step: 0.1,\r\n        max: 1.5,\r\n        min: 0.5\r\n    };\r\n\r\n\r\n    get isZoomOutDisabled(): boolean {\r\n        return this.scale - this._zoomSettings.step <= this._zoomSettings.min;\r\n    }\r\n\r\n    get isZoomInDisabled(): boolean {\r\n        return this.scale + this._zoomSettings.step >= this._zoomSettings.max;\r\n    }\r\n\r\n    @HostListener('document:keydown.escape', ['$event'])\r\n    onKeydownHandler(): void {\r\n        if (this.previewVisible) {\r\n            this.closePreview();\r\n        }\r\n    }\r\n\r\n    onImageClick(): void {\r\n        if (this.preview) {\r\n            this.maskVisible = true;\r\n            this.previewVisible = true;\r\n\r\n            this._changeDetectorRef.markForCheck();\r\n        }\r\n    }\r\n\r\n    onMaskKeydown(event: KeyboardEvent): void {\r\n        switch (event.code) {\r\n            case 'Escape':\r\n                this.closePreview();\r\n                setTimeout(() => {\r\n                    this.previewButton?.nativeElement && document.activeElement !== this.previewButton?.nativeElement && this.previewButton?.nativeElement.focus();\r\n                }, 25);\r\n                event.preventDefault();\r\n                break;\r\n\r\n            default:\r\n                break;\r\n        }\r\n    }\r\n\r\n    onPreviewImageClick(event: MouseEvent): void {\r\n        event.stopPropagation();\r\n    }\r\n\r\n    rotateRight(): void {\r\n        this.rotate += 90;\r\n    }\r\n\r\n    rotateLeft(): void {\r\n        this.rotate -= 90;\r\n    }\r\n\r\n    zoomIn(): void {\r\n        this.scale = this.scale + this._zoomSettings.step;\r\n    }\r\n\r\n    zoomOut(): void {\r\n        this.scale = this.scale - this._zoomSettings.step;\r\n    }\r\n\r\n    onAnimationStart(event: AnimationEvent): void {\r\n        switch (event.toState) {\r\n            case 'visible':\r\n                this.container = event.element;\r\n                this.wrapper = this.container?.parentElement;\r\n                this.appendContainer();\r\n\r\n                setTimeout(() => {\r\n                    this.closeButton?.nativeElement && document.activeElement !== this.closeButton?.nativeElement && this.closeButton?.nativeElement.focus();\r\n                }, 25);\r\n                break;\r\n\r\n            case 'void':\r\n                if (this.wrapper) {\r\n                    if (this.wrapper.classList) this.wrapper.classList.add('image-overlay-leave');\r\n                    else this.wrapper.className += ' image-overlay-leave ';\r\n                }\r\n                break;\r\n        }\r\n    }\r\n\r\n    onAnimationEnd(event: AnimationEvent): void {\r\n        switch (event.toState) {\r\n            case 'void':\r\n                if (this.wrapper) {\r\n                    this.wrapper.style.zIndex = '';\r\n                }\r\n\r\n                this.maskVisible = false;\r\n                this.container = null;\r\n                this.wrapper = null;\r\n                this._changeDetectorRef.markForCheck();\r\n                this.previewShowChange.emit(false);\r\n\r\n                break;\r\n            case 'visible':\r\n                this.previewShowChange.emit(true);\r\n                break;\r\n        }\r\n    }\r\n\r\n    handleToolbarClick(event: MouseEvent): void {\r\n        event.stopPropagation();\r\n    }\r\n\r\n    appendContainer(): void {\r\n        if (this.appendTo) {\r\n            if (this.appendTo === 'body') this._document.body.appendChild(this.wrapper as HTMLElement);\r\n            else {\r\n                if (typeof HTMLElement === 'object' ? this.appendTo instanceof HTMLElement : this.appendTo && typeof this.appendTo === 'object' && this.appendTo !== null)\r\n                    (this.appendTo as any).appendChild(this.wrapper);\r\n                else if ((this.appendTo as any)?.el?.nativeElement)\r\n                    (this.appendTo as any).el.nativeElement.appendChild(this.wrapper);\r\n            }\r\n        }\r\n    }\r\n\r\n    imagePreviewStyle(): { transform: string; } {\r\n        return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };\r\n    }\r\n\r\n    closePreview(): void {\r\n        this.previewVisible = false;\r\n        this.rotate = 0;\r\n        this.scale = this._zoomSettings.default;\r\n    }\r\n\r\n    imageError(event: Event): void {\r\n        this.imageErrorEvent.emit(event);\r\n    }\r\n}\r\n","<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton >\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible){\r\n    <div #mask class=\"cmat-image-mask image-overlay image-overlay-enter\" role=\"dialog\" [attr.aria-modal]=\"maskVisible\"\r\n        (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton  (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton  (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton  [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton  [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton  (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible){\r\n        <div role=\"presentation\"\r\n            [@animation]=\"{ value: 'visible', params: { showTransitionParams: showTransitionOptions, hideTransitionParams: hideTransitionOptions } }\"\r\n            (@animation.start)=\"onAnimationStart($event)\" (@animation.done)=\"onAnimationEnd($event)\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cmat-components-image-viewer.mjs","sources":["../../../projects/cmat/components/image-viewer/image-viewer.component.ts","../../../projects/cmat/components/image-viewer/image-viewer.component.html","../../../projects/cmat/components/image-viewer/cmat-components-image-viewer.ts"],"sourcesContent":["import { CommonModule } from '@angular/common';\r\nimport {\r\n    ChangeDetectionStrategy,\r\n    ChangeDetectorRef,\r\n    Component,\r\n    ElementRef,\r\n    EventEmitter,\r\n    Input,\r\n    Output,\r\n    TemplateRef,\r\n    ViewChild,\r\n    ViewEncapsulation,\r\n    booleanAttribute,\r\n    DOCUMENT,\r\n    inject,\r\n    HostListener,\r\n} from '@angular/core';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { SafeUrl } from '@angular/platform-browser';\r\n\r\n@Component({\r\n    selector: 'cmat-image',\r\n    templateUrl: './image-viewer.component.html',\r\n    styleUrls: ['./image-viewer.component.scss'],\r\n    imports: [CommonModule, MatButtonModule, MatIconModule],\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    encapsulation: ViewEncapsulation.None\r\n})\r\nexport class CmatImageComponent {\r\n\r\n    @Input() imageClass: string | undefined;\r\n\r\n    @Input() imageStyle: Record<string, any> | null | undefined;\r\n\r\n    @Input() src: string | SafeUrl | undefined;\r\n\r\n    @Input() srcSet: string | SafeUrl | undefined;\r\n\r\n    @Input() previewImageSrc: string | SafeUrl | undefined;\r\n\r\n    @Input() previewImageSrcSet: string | SafeUrl | undefined;\r\n\r\n    @Input() alt: string | undefined;\r\n\r\n    @Input() width: number | undefined;\r\n\r\n    @Input() height: number | undefined;\r\n\r\n    @Input() loading: 'lazy' | 'eager' | undefined;\r\n    /**\r\n     * 要附加对话框的目标元素，有效值是“body”或另一个元素的本地ng模板变量（注意：使用带括号的绑定来绑定模板变量，例如[appedTo]=“mydiv”用于变量名为#mydiv的div元素）。\r\n     */\r\n    @Input() appendTo: HTMLElement | ElementRef | TemplateRef<any> | string | null | undefined;\r\n    /**\r\n     * 启动预览功能。\r\n     */\r\n    @Input({ transform: booleanAttribute }) preview: boolean = false;\r\n    /**\r\n     * 监听预览显示/隐藏.\r\n     */\r\n    @Output() previewShowChange: EventEmitter<boolean> = new EventEmitter<boolean>();\r\n    /**\r\n     * 如果加载图像文件时发生错误，则会触发此事件.\r\n     */\r\n    @Output() imageErrorEvent: EventEmitter<Event> = new EventEmitter<Event>();\r\n\r\n    el = inject(ElementRef);\r\n\r\n    maskVisible: boolean = false;\r\n\r\n    previewVisible: boolean = false;\r\n\r\n    rotate: number = 0;\r\n\r\n    scale: number = 1;\r\n\r\n    private _loadingPreview: boolean = false;\r\n    private _closePreviewByEscape: boolean = false;\r\n    private _document = inject<Document>(DOCUMENT);\r\n    private _changeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n    private _zoomSettings = {\r\n        default: 1,\r\n        step: 0.1,\r\n        max: 1.5,\r\n        min: 0.5\r\n    };\r\n\r\n    get isZoomOutDisabled(): boolean {\r\n        return this.scale - this._zoomSettings.step <= this._zoomSettings.min;\r\n    }\r\n\r\n    get isZoomInDisabled(): boolean {\r\n        return this.scale + this._zoomSettings.step >= this._zoomSettings.max;\r\n    }\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    private _mask?: HTMLDivElement | undefined;\r\n    @ViewChild('mask', { static: false })\r\n    set mask(value: ElementRef<HTMLDivElement> | undefined) {\r\n        if (value) {\r\n            this._mask = value.nativeElement;\r\n\r\n            if (this._mask && this._loadingPreview) {\r\n                this.appendContainer();\r\n            }\r\n        }\r\n    };\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    private _previewButton?: HTMLButtonElement | undefined;\r\n    @ViewChild('previewButton', { static: false })\r\n    set previewButton(value: ElementRef<HTMLButtonElement> | undefined) {\r\n        if (value) {\r\n            this._previewButton = value.nativeElement;\r\n\r\n            if (this._previewButton && this._closePreviewByEscape) {\r\n                this._previewButton.focus();\r\n                this._closePreviewByEscape = false;\r\n            }\r\n        }\r\n    };\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    private _closeButton?: HTMLButtonElement | undefined;\r\n    @ViewChild('closeButton', { static: false })\r\n    set closeButton(value: ElementRef<HTMLButtonElement> | undefined) {\r\n        if (value) {\r\n            this._closeButton = value.nativeElement;\r\n\r\n            if (this._closeButton && this._loadingPreview) {\r\n                this._closeButton.focus();\r\n                this._loadingPreview = false;\r\n            }\r\n        }\r\n    };\r\n\r\n    @HostListener('document:keydown.escape', ['$event'])\r\n    onKeydownHandler(): void {\r\n        if (this.previewVisible) {\r\n            this.closePreview();\r\n        }\r\n    }\r\n\r\n    onImageClick(): void {\r\n        if (this.preview) {\r\n            this.maskVisible = true;\r\n            this.previewVisible = true;\r\n\r\n            this._loadingPreview = true;\r\n            this._changeDetectorRef.markForCheck();\r\n\r\n            this.previewShowChange.emit(true);\r\n        }\r\n    }\r\n\r\n    onMaskKeydown(event: KeyboardEvent): void {\r\n        switch (event.code) {\r\n            case 'Escape':\r\n                this.closePreview();\r\n                this._closePreviewByEscape = true;\r\n                event.preventDefault();\r\n                break;\r\n\r\n            default:\r\n                break;\r\n        }\r\n    }\r\n\r\n    onPreviewImageClick(event: MouseEvent): void {\r\n        event.stopPropagation();\r\n    }\r\n\r\n    rotateRight(): void {\r\n        this.rotate += 90;\r\n    }\r\n\r\n    rotateLeft(): void {\r\n        this.rotate -= 90;\r\n    }\r\n\r\n    zoomIn(): void {\r\n        this.scale = this.scale + this._zoomSettings.step;\r\n    }\r\n\r\n    zoomOut(): void {\r\n        this.scale = this.scale - this._zoomSettings.step;\r\n    }\r\n\r\n    handleToolbarClick(event: MouseEvent): void {\r\n        event.stopPropagation();\r\n    }\r\n\r\n    appendContainer(): void {\r\n        if (this.appendTo) {\r\n            if (this.appendTo === 'body') this._document.body.appendChild(this._mask as HTMLElement);\r\n            else {\r\n                if (typeof HTMLElement === 'object' ? this.appendTo instanceof HTMLElement : this.appendTo && typeof this.appendTo === 'object' && this.appendTo !== null)\r\n                    (this.appendTo as any).appendChild(this._mask);\r\n                else if ((this.appendTo as any)?.el?.nativeElement)\r\n                    (this.appendTo as any).el.nativeElement.appendChild(this.mask?.nativeElement);\r\n            }\r\n            \r\n        }\r\n    }\r\n\r\n    imagePreviewStyle(): { transform: string; } {\r\n        return { transform: 'rotate(' + this.rotate + 'deg) scale(' + this.scale + ')' };\r\n    }\r\n\r\n    closePreview(): void {\r\n        this.previewVisible = false;\r\n        this.rotate = 0;\r\n        this.scale = this._zoomSettings.default;\r\n\r\n        setTimeout(() => {\r\n            this.maskVisible = false;\r\n\r\n            this._changeDetectorRef.markForCheck();\r\n            this.previewShowChange.emit(false);\r\n        }, 25);\r\n    }\r\n\r\n    imageError(event: Event): void {\r\n        this.imageErrorEvent.emit(event);\r\n    }\r\n}\r\n","<span [ngClass]=\"{ 'cmat-image-preview-container ': preview }\">\r\n    <img [attr.src]=\"src\" [attr.srcset]=\"srcSet\" [attr.alt]=\"alt\" [attr.width]=\"width\" [attr.height]=\"height\"\r\n        [attr.loading]=\"loading\" [ngStyle]=\"imageStyle\" [class]=\"imageClass\" (error)=\"imageError($event)\" />\r\n    @if(preview){\r\n    <div class=\"cmat-image-preview-indicator\" role=\"presentation\" (click)=\"onImageClick()\">\r\n        <button #previewButton matIconButton>\r\n            <mat-icon class=\"text-white\" [svgIcon]=\"'heroicons_solid:eye'\"></mat-icon>\r\n        </button>\r\n    </div>\r\n    }\r\n\r\n    @if(maskVisible){\r\n    <div #mask class=\"cmat-image-mask cmat-image-overlay cmat-image-overlay-enter\" animate.leave=\"cmat-image-overlay-leave\"\r\n        role=\"dialog\" [attr.aria-modal]=\"maskVisible\" (click)=\"closePreview()\" (keydown)=\"onMaskKeydown($event)\">\r\n        <div class=\"cmat-image-toolbar\" role=\"presentation\" (click)=\"handleToolbarClick($event)\">\r\n            <button matIconButton (click)=\"rotateRight()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_right'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton (click)=\"rotateLeft()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:rotate_left'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomOutDisabled\" (click)=\"zoomOut()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_out'\"></mat-icon>\r\n            </button>\r\n            <button matIconButton [disabled]=\"isZoomInDisabled\" (click)=\"zoomIn()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:zoom_in'\"></mat-icon>\r\n            </button>\r\n            <button #closeButton matIconButton (click)=\"closePreview()\">\r\n                <mat-icon class=\"text-white\" [svgIcon]=\"'mat_solid:close'\"></mat-icon>\r\n            </button>\r\n        </div>\r\n        @if(previewVisible){\r\n        <div role=\"presentation\" class=\"cmat-image-preview-enter\" animate.leave=\"cmat-image-preview-leave\"\r\n            (click)=\"onPreviewImageClick($event)\">\r\n            <img class=\"cmat-image-preview\" alt=\"image\" [attr.src]=\"previewImageSrc ? previewImageSrc : src\"\r\n                [attr.srcset]=\"previewImageSrcSet\" [ngStyle]=\"imagePreviewStyle()\" />\r\n        </div>\r\n        }\r\n    </div>\r\n    }\r\n\r\n</span>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/cmat-components-json-editor.mjs

@@ -156,10 +156,10 @@ class CmatJsonEditorComponent {
             this.pathChanged.emit(st);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatJsonEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CmatJsonEditorComponent, isStandalone: true, selector: "cmat-json-editor", inputs: { options: "options", data: "data" }, outputs: { contentChanged: "contentChanged", pathChanged: "pathChanged" }, viewQueries: [{ propertyName: "jsonEditorContainer", first: true, predicate: ["jsonEditorContainer"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: '<div class="cmat-jsoneditor" [id]="id" #jsonEditorContainer></div>', isInline: true, styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatJsonEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.4", type: CmatJsonEditorComponent, isStandalone: true, selector: "cmat-json-editor", inputs: { options: "options", data: "data" }, outputs: { contentChanged: "contentChanged", pathChanged: "pathChanged" }, viewQueries: [{ propertyName: "jsonEditorContainer", first: true, predicate: ["jsonEditorContainer"], descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: '<div class="cmat-jsoneditor" [id]="id" #jsonEditorContainer></div>', isInline: true, styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatJsonEditorComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatJsonEditorComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-json-editor', template: '<div class="cmat-jsoneditor" [id]="id" #jsonEditorContainer></div>', preserveWhitespaces: false, changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, imports: [], styles: [".cmat-jsoneditor .jse-main.svelte-sxaskb{min-height:24rem}\n"] }]
         }], propDecorators: { jsonEditorContainer: [{

package/fesm2022/cmat-components-knob-input.mjs

@@ -322,12 +322,12 @@ class CmatKnobInputComponent {
     valueToDisplay() {
         return this.valueTemplate.replace('{value}', this.value.toString());
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatKnobInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CmatKnobInputComponent, isStandalone: true, selector: "cmat-knob-input", inputs: { id: "id", valueColor: "valueColor", rangeColor: "rangeColor", textColor: "textColor", valueTemplate: "valueTemplate", name: "name", size: "size", step: "step", min: "min", max: "max", strokeWidth: "strokeWidth", showValue: "showValue", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "keydown": "onKeyDown($event)", "mousedown": "onMouseDown($event)", "mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd($event)" }, properties: { "attr.id": "this.id" } }, providers: [
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatKnobInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: CmatKnobInputComponent, isStandalone: true, selector: "cmat-knob-input", inputs: { id: "id", valueColor: "valueColor", rangeColor: "rangeColor", textColor: "textColor", valueTemplate: "valueTemplate", name: "name", size: "size", step: "step", min: "min", max: "max", strokeWidth: "strokeWidth", showValue: "showValue", placeholder: "placeholder", value: "value", required: "required", disabled: "disabled" }, outputs: { valueChange: "valueChange" }, host: { listeners: { "keydown": "onKeyDown($event)", "mousedown": "onMouseDown($event)", "mouseup": "onMouseUp($event)", "touchstart": "onTouchStart($event)", "touchend": "onTouchEnd($event)" }, properties: { "attr.id": "this.id" } }, providers: [
             { provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }
         ], viewQueries: [{ propertyName: "_knobElementRef", first: true, predicate: ["knob"], descendants: true }], exportAs: ["cmatKnobInput"], ngImport: i0, template: "<!-- eslint-disable @angular-eslint/template/click-events-have-key-events -->\r\n<!-- eslint-disable @angular-eslint/template/no-inline-styles -->\r\n<div #knob [class.cmat-knob-disabled]=\"disabled\" (focusin)=\"onFocusIn()\" (focusout)=\"onFocusOut($event)\">\r\n    <svg  viewBox=\"0 0 100 100\" role=\"slider\" [style.width]=\"size + 'px'\" [style.height]=\"size + 'px'\"\r\n        [attr.aria-valuemin]=\"min\" [attr.aria-valuemax]=\"max\" [attr.aria-valuenow]=\"value\"\r\n        [attr.tabindex]=\"disabled ? -1 : 0\" (click)=\"onClick($event)\">\r\n        <path class=\"knob-range\" [attr.d]=\"rangePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"rangeColor\">\r\n        </path>\r\n        <path class=\"knob-value\" [attr.d]=\"valuePath()\" [attr.stroke-width]=\"strokeWidth\" [attr.stroke]=\"valueColor\">\r\n        </path>\r\n        @if(showValue){\r\n        <text text-anchor=\"middle\" class=\"knob-text\" [attr.x]=\"50\" [attr.y]=\"57\" [attr.fill]=\"textColor\"\r\n            [attr.name]=\"name\">{{ valueToDisplay() }}</text>\r\n        }\r\n    </svg>\r\n</div>", styles: ["cmat-knob-input .knob-range{fill:none;transition:stroke .1s ease-in}cmat-knob-input .knob-value{animation-name:dash-frame;animation-fill-mode:forwards;fill:none}cmat-knob-input .knob-text{font-size:1.3rem;text-align:center}cmat-knob-input .cmat-knob-disabled{opacity:.6}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatKnobInputComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatKnobInputComponent, decorators: [{
             type: Component,
             args: [{ selector: 'cmat-knob-input', providers: [
                         { provide: MatFormFieldControl, useExisting: CmatKnobInputComponent }

package/fesm2022/cmat-components-masonry.mjs

@@ -1,7 +1,6 @@
 import { NgTemplateOutlet } from '@angular/common';
 import * as i0 from '@angular/core';
 import { Input, ChangeDetectionStrategy, ViewEncapsulation, Component } from '@angular/core';
-import { cmatAnimations } from 'cmat/animations';
 
 class CmatMasonryComponent {
     constructor() {
@@ -37,12 +36,12 @@ class CmatMasonryComponent {
             this.distributedColumns[i % this.columns].items.push(this.items[i]);
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatMasonryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.7", type: CmatMasonryComponent, isStandalone: true, selector: "cmat-masonry", inputs: { columnsTemplate: "columnsTemplate", columns: "columns", items: "items" }, exportAs: ["cmatMasonry"], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], animations: cmatAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatMasonryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.2.4", type: CmatMasonryComponent, isStandalone: true, selector: "cmat-masonry", inputs: { columnsTemplate: "columnsTemplate", columns: "columns", items: "items" }, exportAs: ["cmatMasonry"], usesOnChanges: true, ngImport: i0, template: "<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatMasonryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatMasonryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-masonry', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, animations: cmatAnimations, exportAs: 'cmatMasonry', imports: [NgTemplateOutlet], template: "<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>" }]
+            args: [{ selector: 'cmat-masonry', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatMasonry', imports: [NgTemplateOutlet], template: "<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>" }]
         }], propDecorators: { columnsTemplate: [{
                 type: Input,
                 args: [{ required: true }]

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

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-masonry.mjs","sources":["../../../projects/cmat/components/masonry/masonry.component.ts","../../../projects/cmat/components/masonry/masonry.component.html","../../../projects/cmat/components/masonry/cmat-components-masonry.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport {AfterViewInit, ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges, TemplateRef, ViewEncapsulation} from '@angular/core';\r\nimport {cmatAnimations} from 'cmat/animations';\r\n\r\n@Component({\r\n    selector: 'cmat-masonry',\r\n    templateUrl: './masonry.component.html',\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    animations: cmatAnimations,\r\n    exportAs: 'cmatMasonry',\r\n    imports: [NgTemplateOutlet]\r\n})\r\nexport class CmatMasonryComponent implements OnChanges, AfterViewInit {\r\n    @Input({ required: true }) columnsTemplate: TemplateRef<any>;\r\n    @Input({ required: true }) columns: number;\r\n    @Input() items: any[] = [];\r\n    distributedColumns: any[] = [];\r\n\r\n    ngOnChanges(changes: SimpleChanges): void {\r\n        // Columns\r\n        if ('columns' in changes) {\r\n            // Distribute the items\r\n            this._distributeItems();\r\n        }\r\n\r\n        // Items\r\n        if ('items' in changes) {\r\n            // Distribute the items\r\n            this._distributeItems();\r\n        }\r\n    }\r\n\r\n    ngAfterViewInit(): void {\r\n        // Distribute the items for the first time\r\n        this._distributeItems();\r\n    }\r\n\r\n    private _distributeItems(): void {\r\n        // Return an empty array if there are no items\r\n        if (this.items.length === 0) {\r\n            this.distributedColumns = [];\r\n            return;\r\n        }\r\n\r\n        // Prepare the distributed columns array\r\n        this.distributedColumns = Array.from(Array(this.columns), () => ({items: []}));\r\n\r\n        // Distribute the items to columns\r\n        for (let i = 0; i < this.items.length; i++) {\r\n            this.distributedColumns[i % this.columns].items.push(this.items[i]);\r\n        }\r\n    }\r\n}\r\n","<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;MAaa,oBAAoB,CAAA;AATjC,IAAA,WAAA,GAAA;QAYa,IAAA,CAAA,KAAK,GAAU,EAAE;QAC1B,IAAA,CAAA,kBAAkB,GAAU,EAAE;AAoCjC;AAlCG,IAAA,WAAW,CAAC,OAAsB,EAAA;;AAE9B,QAAA,IAAI,SAAS,IAAI,OAAO,EAAE;;YAEtB,IAAI,CAAC,gBAAgB,EAAE;;;AAI3B,QAAA,IAAI,OAAO,IAAI,OAAO,EAAE;;YAEpB,IAAI,CAAC,gBAAgB,EAAE;;;IAI/B,eAAe,GAAA;;QAEX,IAAI,CAAC,gBAAgB,EAAE;;IAGnB,gBAAgB,GAAA;;QAEpB,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;AACzB,YAAA,IAAI,CAAC,kBAAkB,GAAG,EAAE;YAC5B;;;QAIJ,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,OAAO,EAAC,KAAK,EAAE,EAAE,EAAC,CAAC,CAAC;;AAG9E,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACxC,IAAI,CAAC,kBAAkB,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;;;8GArClE,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAApB,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECbjC,2JAEM,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDSQ,gBAAgB,sIAFd,cAAc,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAIjB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBAThC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,EAAA,aAAA,EAET,iBAAiB,CAAC,IAAI,mBACpB,uBAAuB,CAAC,MAAM,EAAA,UAAA,EACnC,cAAc,EAAA,QAAA,EAChB,aAAa,EAAA,OAAA,EACd,CAAC,gBAAgB,CAAC,EAAA,QAAA,EAAA,2JAAA,EAAA;8BAGA,eAAe,EAAA,CAAA;sBAAzC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;gBACE,OAAO,EAAA,CAAA;sBAAjC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;gBAChB,KAAK,EAAA,CAAA;sBAAb;;;AEhBL;;AAEG;;;;"}
+{"version":3,"file":"cmat-components-masonry.mjs","sources":["../../../projects/cmat/components/masonry/masonry.component.ts","../../../projects/cmat/components/masonry/masonry.component.html","../../../projects/cmat/components/masonry/cmat-components-masonry.ts"],"sourcesContent":["import { NgTemplateOutlet } from '@angular/common';\r\nimport { AfterViewInit, ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges, TemplateRef, ViewEncapsulation } from '@angular/core';\r\n\r\n@Component({\r\n    selector: 'cmat-masonry',\r\n    templateUrl: './masonry.component.html',\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    exportAs: 'cmatMasonry',\r\n    imports: [NgTemplateOutlet]\r\n})\r\nexport class CmatMasonryComponent implements OnChanges, AfterViewInit {\r\n    @Input({ required: true }) columnsTemplate: TemplateRef<any>;\r\n    @Input({ required: true }) columns: number;\r\n    @Input() items: any[] = [];\r\n    distributedColumns: any[] = [];\r\n\r\n    ngOnChanges(changes: SimpleChanges): void {\r\n        // Columns\r\n        if ('columns' in changes) {\r\n            // Distribute the items\r\n            this._distributeItems();\r\n        }\r\n\r\n        // Items\r\n        if ('items' in changes) {\r\n            // Distribute the items\r\n            this._distributeItems();\r\n        }\r\n    }\r\n\r\n    ngAfterViewInit(): void {\r\n        // Distribute the items for the first time\r\n        this._distributeItems();\r\n    }\r\n\r\n    private _distributeItems(): void {\r\n        // Return an empty array if there are no items\r\n        if (this.items.length === 0) {\r\n            this.distributedColumns = [];\r\n            return;\r\n        }\r\n\r\n        // Prepare the distributed columns array\r\n        this.distributedColumns = Array.from(Array(this.columns), () => ({items: []}));\r\n\r\n        // Distribute the items to columns\r\n        for (let i = 0; i < this.items.length; i++) {\r\n            this.distributedColumns[i % this.columns].items.push(this.items[i]);\r\n        }\r\n    }\r\n}\r\n","<div class=\"flex p-2\">\r\n    <ng-container *ngTemplateOutlet=\"columnsTemplate; context: { $implicit: distributedColumns }\"></ng-container>\r\n</div>","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;MAWa,oBAAoB,CAAA;AARjC,IAAA,WAAA,GAAA;QAWa,IAAA,CAAA,KAAK,GAAU,EAAE;QAC1B,IAAA,CAAA,kBAAkB,GAAU,EAAE;AAoCjC;AAlCG,IAAA,WAAW,CAAC,OAAsB,EAAA;;AAE9B,QAAA,IAAI,SAAS,IAAI,OAAO,EAAE;;YAEtB,IAAI,CAAC,gBAAgB,EAAE;;;AAI3B,QAAA,IAAI,OAAO,IAAI,OAAO,EAAE;;YAEpB,IAAI,CAAC,gBAAgB,EAAE;;;IAI/B,eAAe,GAAA;;QAEX,IAAI,CAAC,gBAAgB,EAAE;;IAGnB,gBAAgB,GAAA;;QAEpB,IAAI,IAAI,CAAC,KAAK,CAAC,MAAM,KAAK,CAAC,EAAE;AACzB,YAAA,IAAI,CAAC,kBAAkB,GAAG,EAAE;YAC5B;;;QAIJ,IAAI,CAAC,kBAAkB,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,EAAE,OAAO,EAAC,KAAK,EAAE,EAAE,EAAC,CAAC,CAAC;;AAG9E,QAAA,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;YACxC,IAAI,CAAC,kBAAkB,CAAC,CAAC,GAAG,IAAI,CAAC,OAAO,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC;;;8GArClE,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;kGAApB,oBAAoB,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,EAAA,eAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,SAAA,EAAA,KAAA,EAAA,OAAA,EAAA,EAAA,QAAA,EAAA,CAAA,aAAA,CAAA,EAAA,aAAA,EAAA,IAAA,EAAA,QAAA,EAAA,EAAA,EAAA,QAAA,ECXjC,2JAEM,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDOQ,gBAAgB,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAEjB,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBARhC,SAAS;AACI,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,cAAc,EAAA,aAAA,EAET,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,aAAa,EAAA,OAAA,EACd,CAAC,gBAAgB,CAAC,EAAA,QAAA,EAAA,2JAAA,EAAA;8BAGA,eAAe,EAAA,CAAA;sBAAzC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;gBACE,OAAO,EAAA,CAAA;sBAAjC,KAAK;uBAAC,EAAE,QAAQ,EAAE,IAAI,EAAE;gBAChB,KAAK,EAAA,CAAA;sBAAb;;;AEdL;;AAEG;;;;"}

package/fesm2022/cmat-components-material-color-picker.mjs

@@ -10,7 +10,6 @@ import * as i1 from '@angular/material/select';
 import { MatSelectModule } from '@angular/material/select';
 import * as i4 from '@angular/material/tooltip';
 import { MatTooltipModule } from '@angular/material/tooltip';
-import { cmatAnimations } from 'cmat/animations';
 
 const baseColors = [
     'bg-slate',
@@ -154,12 +153,12 @@ class CmatMaterialColorPickerComponent {
             this.view = 'hues';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatMaterialColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: CmatMaterialColorPickerComponent, isStandalone: true, selector: "cmat-material-color-picker", inputs: { color: "color", title: "title", readonly: "readonly" }, outputs: { colorChanged: "colorChanged" }, providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], exportAs: ["cmatMaterialColorPicker"], ngImport: i0, template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n        matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], animations: cmatAnimations, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatMaterialColorPickerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.2.4", type: CmatMaterialColorPickerComponent, isStandalone: true, selector: "cmat-material-color-picker", inputs: { color: "color", title: "title", readonly: "readonly" }, outputs: { colorChanged: "colorChanged" }, providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], exportAs: ["cmatMaterialColorPicker"], ngImport: i0, template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n        matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: MatSelectModule }, { kind: "component", type: i1.MatSelect, selector: "mat-select", inputs: ["aria-describedby", "panelClass", "disabled", "disableRipple", "tabIndex", "hideSingleSelectionIndicator", "placeholder", "required", "multiple", "disableOptionCentering", "compareWith", "value", "aria-label", "aria-labelledby", "errorStateMatcher", "typeaheadDebounceInterval", "sortComparator", "id", "panelWidth", "canSelectNullableOptions"], outputs: ["openedChange", "opened", "closed", "selectionChange", "valueChange"], exportAs: ["matSelect"] }, { kind: "directive", type: i1.MatSelectTrigger, selector: "mat-select-trigger" }, { kind: "component", type: i1.MatOption, selector: "mat-option", inputs: ["value", "id", "disabled"], outputs: ["onSelectionChange"], exportAs: ["matOption"] }, { kind: "ngmodule", type: MatIconModule }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: MatButtonModule }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button], a[mat-icon-button], button[matIconButton], a[matIconButton]", exportAs: ["matButton", "matAnchor"] }, { kind: "ngmodule", type: MatTooltipModule }, { kind: "directive", type: i4.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: CmatMaterialColorPickerComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.2.4", ngImport: i0, type: CmatMaterialColorPickerComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'cmat-material-color-picker', animations: cmatAnimations, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatMaterialColorPicker', providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule], template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n        matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"] }]
+            args: [{ selector: 'cmat-material-color-picker', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, exportAs: 'cmatMaterialColorPicker', providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR], imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule], template: "<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"\u8C03\u8272\u677F\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"\u79FB\u9664\u989C\u8272\"\r\n        matTooltip=\"\u79FB\u9664\u989C\u8272\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">\u521D\u59CB\u5316</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>", styles: ["cmat-material-color-picker .mat-mdc-select-arrow-wrapper{display:none!important}\n"] }]
         }], ctorParameters: () => [], propDecorators: { colorChanged: [{
                 type: Output
             }], color: [{

package/fesm2022/cmat-components-material-color-picker.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"cmat-components-material-color-picker.mjs","sources":["../../../projects/cmat/components/material-color-picker/base-color.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.html","../../../projects/cmat/components/material-color-picker/selected-color.ts","../../../projects/cmat/components/material-color-picker/cmat-components-material-color-picker.ts"],"sourcesContent":["export const baseColors = [\r\n    'bg-slate',\r\n    'bg-red',\r\n    'bg-amber',\r\n    'bg-orange',\r\n    'bg-emerald',\r\n    'bg-teal',\r\n    'bg-blue',\r\n    'bg-indigo',\r\n    'bg-violet',\r\n    'bg-pink'\r\n];\r\n\r\n\r\nexport const safteListBaseColors = [\r\n    'bg-slate-50', 'bg-slate-100', 'bg-slate-200', 'bg-slate-300', 'bg-slate-400', 'bg-slate-500', 'bg-slate-600', 'bg-slate-700', 'bg-slate-800', 'bg-slate-900',\r\n    'bg-red-50', 'bg-red-100', 'bg-red-200', 'bg-red-300', 'bg-red-400', 'bg-red-500', 'bg-red-600', 'bg-red-700', 'bg-red-800', 'bg-red-900',\r\n    'bg-amber-50', 'bg-amber-100', 'bg-amber-200', 'bg-amber-300', 'bg-amber-400', 'bg-amber-500', 'bg-amber-600', 'bg-amber-700', 'bg-amber-800', 'bg-amber-900',\r\n    'bg-orange-50', 'bg-orange-100', 'bg-orange-200', 'bg-orange-300', 'bg-orange-400', 'bg-orange-500', 'bg-orange-600', 'bg-orange-700', 'bg-orange-800', 'bg-orange-900',\r\n    'bg-emerald-50', 'bg-emerald-100', 'bg-emerald-200', 'bg-emerald-300', 'bg-emerald-400', 'bg-emerald-500', 'bg-emerald-600', 'bg-emerald-700', 'bg-emerald-800', 'bg-emerald-900',\r\n    'bg-teal-50', 'bg-teal-100', 'bg-teal-200', 'bg-teal-300', 'bg-teal-400', 'bg-teal-500', 'bg-teal-600', 'bg-teal-700', 'bg-teal-800', 'bg-teal-900',\r\n    'bg-blue-50', 'bg-blue-100', 'bg-blue-200', 'bg-blue-300', 'bg-blue-400', 'bg-blue-500', 'bg-blue-600', 'bg-blue-700', 'bg-blue-800', 'bg-blue-900',\r\n    'bg-indigo-50', 'bg-indigo-100', 'bg-indigo-200', 'bg-indigo-300', 'bg-indigo-400', 'bg-indigo-500', 'bg-indigo-600', 'bg-indigo-700', 'bg-indigo-800', 'bg-indigo-900',\r\n    'bg-violet-50', 'bg-violet-100', 'bg-violet-200', 'bg-violet-300', 'bg-violet-400', 'bg-violet-500', 'bg-violet-600', 'bg-violet-700', 'bg-violet-800', 'bg-violet-900',\r\n    'bg-pink-50', 'bg-pink-100', 'bg-pink-200', 'bg-pink-300', 'bg-pink-400', 'bg-pink-500', 'bg-pink-600', 'bg-pink-700', 'bg-pink-800', 'bg-pink-900'\r\n];\r\n","import { NgClass } from '@angular/common';\r\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation, inject } from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatSelectModule } from '@angular/material/select';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { cmatAnimations } from 'cmat/animations';\r\nimport { baseColors } from './base-color';\r\nimport { CmatSelectedColor } from './selected-color';\r\n\r\nexport const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR: any = {\r\n    provide: NG_VALUE_ACCESSOR,\r\n    useExisting: forwardRef(() => CmatMaterialColorPickerComponent),\r\n    multi: true\r\n};\r\n\r\n\r\n@Component({\r\n    selector: 'cmat-material-color-picker',\r\n    templateUrl: './material-color-picker.component.html',\r\n    styleUrls: ['./material-color-picker.component.scss'],\r\n    animations: cmatAnimations,\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    exportAs: 'cmatMaterialColorPicker',\r\n    providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR],\r\n    imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule]\r\n})\r\nexport class CmatMaterialColorPickerComponent implements ControlValueAccessor {\r\n    // Color changed\r\n    @Output()\r\n    colorChanged: EventEmitter<any>;\r\n\r\n    palettes: string[];\r\n    hues: string[];\r\n    view: string;\r\n    selectedColor: CmatSelectedColor;\r\n    selectedPalette: string;\r\n    selectedHue: string;\r\n\r\n    // Private\r\n    private _changeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n    private _color: string;\r\n    private _title: string;\r\n    private _readonly: boolean;\r\n    private _modelChange: (value: any) => void;\r\n    private _modelTouched: (value: any) => void;\r\n\r\n    constructor() {\r\n        // Set the defaults\r\n        this.colorChanged = new EventEmitter();\r\n        this.palettes = baseColors;\r\n        this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900'];\r\n        this.selectedHue = '500';\r\n        this.selectedPalette = 'bg-indigo';\r\n        this.view = 'palettes';\r\n\r\n        // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n        this._modelChange = (): any => { };\r\n        // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n        this._modelTouched = (): any => { };\r\n\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    get color(): string {\r\n        return this._color;\r\n    }\r\n\r\n    @Input()\r\n    set color(value) {\r\n        if (!value || value === '' || this._color === value) {\r\n            return;\r\n        }\r\n\r\n        // Split the color value (bg-red-400, bg-blue-500 etc.)\r\n        const colorParts = value.split('-');\r\n\r\n        // Take the very last part as the selected hue value\r\n        this.selectedHue = colorParts[colorParts.length - 1];\r\n\r\n        // Remove the last part\r\n        colorParts.pop();\r\n\r\n        // Rejoin the remaining parts as the selected palette name\r\n        this.selectedPalette = colorParts.join('-');\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    get title(): string {\r\n        return this._title;\r\n    }\r\n\r\n    @Input()\r\n    set title(value) {\r\n        this._title = value;\r\n    }\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    get readonly(): boolean {\r\n        return this._readonly;\r\n    }\r\n\r\n    @Input()\r\n    set readonly(value) {\r\n        this._readonly = value;\r\n    }\r\n\r\n\r\n    registerOnChange(fn: any): void {\r\n        this._modelChange = fn;\r\n    }\r\n\r\n    registerOnTouched(fn: any): void {\r\n        this._modelTouched = fn;\r\n    }\r\n\r\n    writeValue(color: any): void {\r\n        // Return if null\r\n        if (!color) {\r\n            return;\r\n        }\r\n\r\n        // Set the color\r\n        this.color = color;\r\n    }\r\n\r\n    selectPalette(palette: string): void {\r\n        // Go to 'hues' view\r\n        this.view = 'hues';\r\n\r\n        // Update the selected palette\r\n        this.selectedPalette = palette;\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    selectHue(hue: string): void {\r\n        // Update the selected hue\r\n        this.selectedHue = hue;\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    removeColor(): void {\r\n        // Return to the 'palettes' view\r\n        this.view = 'palettes';\r\n\r\n        // Clear the selected palette and hue\r\n        this.selectedPalette = 'bg-indigo';\r\n        this.selectedHue = '500';\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    updateSelectedColor(): void {\r\n        if (this.selectedColor && this.selectedColor.palette === this.selectedPalette && this.selectedColor.hue === this.selectedHue) {\r\n            return;\r\n        }\r\n\r\n        // Set the selected color object\r\n        this.selectedColor = {\r\n            palette: this.selectedPalette,\r\n            hue: this.selectedHue,\r\n            color: this.selectedPalette + '-' + this.selectedHue\r\n        };\r\n\r\n        this._color = this.selectedColor.color;\r\n\r\n        this.colorChanged.emit(this.selectedColor);\r\n\r\n        // Mark the model as touched\r\n        this._modelTouched(this.selectedColor.color);\r\n\r\n        // Update the model\r\n        this._modelChange(this.selectedColor.color);\r\n\r\n        this._changeDetectorRef.markForCheck();\r\n    }\r\n\r\n    goToPalettesView(): void {\r\n        this.view = 'palettes';\r\n    }\r\n\r\n    onMenuOpen(opened: boolean): void {\r\n        if (opened) {\r\n            this.view = 'hues';\r\n        }\r\n    }\r\n}\r\n","<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"调色板\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"移除颜色\"\r\n        matTooltip=\"移除颜色\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">初始化</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>","export class CmatSelectedColor {\r\n    palette: string;\r\n    hue: string;\r\n    color: string;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"cmat-components-material-color-picker.mjs","sources":["../../../projects/cmat/components/material-color-picker/base-color.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.html","../../../projects/cmat/components/material-color-picker/selected-color.ts","../../../projects/cmat/components/material-color-picker/cmat-components-material-color-picker.ts"],"sourcesContent":["export const baseColors = [\r\n    'bg-slate',\r\n    'bg-red',\r\n    'bg-amber',\r\n    'bg-orange',\r\n    'bg-emerald',\r\n    'bg-teal',\r\n    'bg-blue',\r\n    'bg-indigo',\r\n    'bg-violet',\r\n    'bg-pink'\r\n];\r\n\r\n\r\nexport const safteListBaseColors = [\r\n    'bg-slate-50', 'bg-slate-100', 'bg-slate-200', 'bg-slate-300', 'bg-slate-400', 'bg-slate-500', 'bg-slate-600', 'bg-slate-700', 'bg-slate-800', 'bg-slate-900',\r\n    'bg-red-50', 'bg-red-100', 'bg-red-200', 'bg-red-300', 'bg-red-400', 'bg-red-500', 'bg-red-600', 'bg-red-700', 'bg-red-800', 'bg-red-900',\r\n    'bg-amber-50', 'bg-amber-100', 'bg-amber-200', 'bg-amber-300', 'bg-amber-400', 'bg-amber-500', 'bg-amber-600', 'bg-amber-700', 'bg-amber-800', 'bg-amber-900',\r\n    'bg-orange-50', 'bg-orange-100', 'bg-orange-200', 'bg-orange-300', 'bg-orange-400', 'bg-orange-500', 'bg-orange-600', 'bg-orange-700', 'bg-orange-800', 'bg-orange-900',\r\n    'bg-emerald-50', 'bg-emerald-100', 'bg-emerald-200', 'bg-emerald-300', 'bg-emerald-400', 'bg-emerald-500', 'bg-emerald-600', 'bg-emerald-700', 'bg-emerald-800', 'bg-emerald-900',\r\n    'bg-teal-50', 'bg-teal-100', 'bg-teal-200', 'bg-teal-300', 'bg-teal-400', 'bg-teal-500', 'bg-teal-600', 'bg-teal-700', 'bg-teal-800', 'bg-teal-900',\r\n    'bg-blue-50', 'bg-blue-100', 'bg-blue-200', 'bg-blue-300', 'bg-blue-400', 'bg-blue-500', 'bg-blue-600', 'bg-blue-700', 'bg-blue-800', 'bg-blue-900',\r\n    'bg-indigo-50', 'bg-indigo-100', 'bg-indigo-200', 'bg-indigo-300', 'bg-indigo-400', 'bg-indigo-500', 'bg-indigo-600', 'bg-indigo-700', 'bg-indigo-800', 'bg-indigo-900',\r\n    'bg-violet-50', 'bg-violet-100', 'bg-violet-200', 'bg-violet-300', 'bg-violet-400', 'bg-violet-500', 'bg-violet-600', 'bg-violet-700', 'bg-violet-800', 'bg-violet-900',\r\n    'bg-pink-50', 'bg-pink-100', 'bg-pink-200', 'bg-pink-300', 'bg-pink-400', 'bg-pink-500', 'bg-pink-600', 'bg-pink-700', 'bg-pink-800', 'bg-pink-900'\r\n];\r\n","import { NgClass } from '@angular/common';\r\nimport { ChangeDetectionStrategy, ChangeDetectorRef, Component, EventEmitter, forwardRef, Input, Output, ViewEncapsulation, inject } from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatSelectModule } from '@angular/material/select';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { baseColors } from './base-color';\r\nimport { CmatSelectedColor } from './selected-color';\r\n\r\nexport const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR: any = {\r\n    provide: NG_VALUE_ACCESSOR,\r\n    useExisting: forwardRef(() => CmatMaterialColorPickerComponent),\r\n    multi: true\r\n};\r\n\r\n\r\n@Component({\r\n    selector: 'cmat-material-color-picker',\r\n    templateUrl: './material-color-picker.component.html',\r\n    styleUrls: ['./material-color-picker.component.scss'],\r\n    encapsulation: ViewEncapsulation.None,\r\n    changeDetection: ChangeDetectionStrategy.OnPush,\r\n    exportAs: 'cmatMaterialColorPicker',\r\n    providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR],\r\n    imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule]\r\n})\r\nexport class CmatMaterialColorPickerComponent implements ControlValueAccessor {\r\n    // Color changed\r\n    @Output()\r\n    colorChanged: EventEmitter<any>;\r\n\r\n    palettes: string[];\r\n    hues: string[];\r\n    view: string;\r\n    selectedColor: CmatSelectedColor;\r\n    selectedPalette: string;\r\n    selectedHue: string;\r\n\r\n    // Private\r\n    private _changeDetectorRef = inject(ChangeDetectorRef);\r\n\r\n    private _color: string;\r\n    private _title: string;\r\n    private _readonly: boolean;\r\n    private _modelChange: (value: any) => void;\r\n    private _modelTouched: (value: any) => void;\r\n\r\n    constructor() {\r\n        // Set the defaults\r\n        this.colorChanged = new EventEmitter();\r\n        this.palettes = baseColors;\r\n        this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900'];\r\n        this.selectedHue = '500';\r\n        this.selectedPalette = 'bg-indigo';\r\n        this.view = 'palettes';\r\n\r\n        // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n        this._modelChange = (): any => { };\r\n        // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n        this._modelTouched = (): any => { };\r\n\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    get color(): string {\r\n        return this._color;\r\n    }\r\n\r\n    @Input()\r\n    set color(value) {\r\n        if (!value || value === '' || this._color === value) {\r\n            return;\r\n        }\r\n\r\n        // Split the color value (bg-red-400, bg-blue-500 etc.)\r\n        const colorParts = value.split('-');\r\n\r\n        // Take the very last part as the selected hue value\r\n        this.selectedHue = colorParts[colorParts.length - 1];\r\n\r\n        // Remove the last part\r\n        colorParts.pop();\r\n\r\n        // Rejoin the remaining parts as the selected palette name\r\n        this.selectedPalette = colorParts.join('-');\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    get title(): string {\r\n        return this._title;\r\n    }\r\n\r\n    @Input()\r\n    set title(value) {\r\n        this._title = value;\r\n    }\r\n\r\n    // eslint-disable-next-line @typescript-eslint/member-ordering\r\n    get readonly(): boolean {\r\n        return this._readonly;\r\n    }\r\n\r\n    @Input()\r\n    set readonly(value) {\r\n        this._readonly = value;\r\n    }\r\n\r\n\r\n    registerOnChange(fn: any): void {\r\n        this._modelChange = fn;\r\n    }\r\n\r\n    registerOnTouched(fn: any): void {\r\n        this._modelTouched = fn;\r\n    }\r\n\r\n    writeValue(color: any): void {\r\n        // Return if null\r\n        if (!color) {\r\n            return;\r\n        }\r\n\r\n        // Set the color\r\n        this.color = color;\r\n    }\r\n\r\n    selectPalette(palette: string): void {\r\n        // Go to 'hues' view\r\n        this.view = 'hues';\r\n\r\n        // Update the selected palette\r\n        this.selectedPalette = palette;\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    selectHue(hue: string): void {\r\n        // Update the selected hue\r\n        this.selectedHue = hue;\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    removeColor(): void {\r\n        // Return to the 'palettes' view\r\n        this.view = 'palettes';\r\n\r\n        // Clear the selected palette and hue\r\n        this.selectedPalette = 'bg-indigo';\r\n        this.selectedHue = '500';\r\n\r\n        // Update the selected color\r\n        this.updateSelectedColor();\r\n    }\r\n\r\n    updateSelectedColor(): void {\r\n        if (this.selectedColor && this.selectedColor.palette === this.selectedPalette && this.selectedColor.hue === this.selectedHue) {\r\n            return;\r\n        }\r\n\r\n        // Set the selected color object\r\n        this.selectedColor = {\r\n            palette: this.selectedPalette,\r\n            hue: this.selectedHue,\r\n            color: this.selectedPalette + '-' + this.selectedHue\r\n        };\r\n\r\n        this._color = this.selectedColor.color;\r\n\r\n        this.colorChanged.emit(this.selectedColor);\r\n\r\n        // Mark the model as touched\r\n        this._modelTouched(this.selectedColor.color);\r\n\r\n        // Update the model\r\n        this._modelChange(this.selectedColor.color);\r\n\r\n        this._changeDetectorRef.markForCheck();\r\n    }\r\n\r\n    goToPalettesView(): void {\r\n        this.view = 'palettes';\r\n    }\r\n\r\n    onMenuOpen(opened: boolean): void {\r\n        if (opened) {\r\n            this.view = 'hues';\r\n        }\r\n    }\r\n}\r\n","<div class=\"rounded\" [ngClass]=\"selectedColor.color\">\r\n  <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n    [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n    <mat-select-trigger class=\"flex p-1\">\r\n      <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n    </mat-select-trigger>\r\n\r\n    <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n      <button type=\"button\" matIconButton  class=\"secondary-text\" aria-label=\"调色板\"\r\n        [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n        <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n      </button>\r\n      <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n      <button type=\"button\" matIconButton  class=\"remove-color-button secondary-text\" aria-label=\"移除颜色\"\r\n        matTooltip=\"移除颜色\" (click)=\"removeColor()\">\r\n        <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n      </button>\r\n    </header>\r\n\r\n    <div class=\"flex flex-wrap w-60 m-2\">\r\n      <mat-option value=\"init\" class=\"hidden\">初始化</mat-option>\r\n      <div>\r\n        @switch (view) {\r\n        @case ('palettes') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (palette of palettes; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedPalette\">\r\n                @if (selectedColor.color===palette + '-' + selectedHue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        @case ('hues') {\r\n        <div>\r\n          <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n            @for (hue of hues; track $index) {\r\n            <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n              <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n                [value]=\"selectedHue\">\r\n                @if (selectedColor.color===selectedPalette + '-' + hue) {\r\n                <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n                }\r\n                <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n              </mat-option>\r\n            </div>\r\n            }\r\n          </div>\r\n        </div>\r\n        }\r\n        }\r\n      </div>\r\n    </div>\r\n  </mat-select>\r\n</div>","export class CmatSelectedColor {\r\n    palette: string;\r\n    hue: string;\r\n    color: string;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}