@vendure/admin-ui 2.0.6 → 2.1.0-next.0

package/esm2022/core/shared/components/page-block/page-block.component.mjs

@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class PageBlockComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: PageBlockComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: PageBlockComponent, selector: "vdr-page-block", ngImport: i0, template: "<div class=\"page-block\"><ng-content></ng-content></div>\r\n", styles: [":host{display:block}.page-block{margin-left:var(--surface-margin-left);margin-right:var(--space-unit);margin-top:var(--space-unit);max-width:var(--layout-content-max-width)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: PageBlockComponent, selector: "vdr-page-block", ngImport: i0, template: "<div class=\"page-block\"><ng-content></ng-content></div>\r\n", styles: [":host{display:block}.page-block{margin-inline-start:var(--surface-margin-left);margin-inline-end:var(--space-unit);margin-top:var(--space-unit);max-width:var(--layout-content-max-width)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: PageBlockComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-page-block', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"page-block\"><ng-content></ng-content></div>\r\n", styles: [":host{display:block}.page-block{margin-left:var(--surface-margin-left);margin-right:var(--space-unit);margin-top:var(--space-unit);max-width:var(--layout-content-max-width)}\n"] }]
+            args: [{ selector: 'vdr-page-block', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"page-block\"><ng-content></ng-content></div>\r\n", styles: [":host{display:block}.page-block{margin-inline-start:var(--surface-margin-left);margin-inline-end:var(--space-unit);margin-top:var(--space-unit);max-width:var(--layout-content-max-width)}\n"] }]
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1ibG9jay5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvcmUvc3JjL3NoYXJlZC9jb21wb25lbnRzL3BhZ2UtYmxvY2svcGFnZS1ibG9jay5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvcmUvc3JjL3NoYXJlZC9jb21wb25lbnRzL3BhZ2UtYmxvY2svcGFnZS1ibG9jay5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVFuRSxNQUFNLE9BQU8sa0JBQWtCOzhHQUFsQixrQkFBa0I7a0dBQWxCLGtCQUFrQixzRENSL0IsK0RBQ0E7OzJGRE9hLGtCQUFrQjtrQkFOOUIsU0FBUzsrQkFDSSxnQkFBZ0IsbUJBR1QsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gICAgc2VsZWN0b3I6ICd2ZHItcGFnZS1ibG9jaycsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1ibG9jay5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9wYWdlLWJsb2NrLmNvbXBvbmVudC5zY3NzJ10sXHJcbiAgICBjaGFuZ2VEZXRlY3Rpb246IENoYW5nZURldGVjdGlvblN0cmF0ZWd5Lk9uUHVzaCxcclxufSlcclxuZXhwb3J0IGNsYXNzIFBhZ2VCbG9ja0NvbXBvbmVudCB7fVxyXG4iLCI8ZGl2IGNsYXNzPVwicGFnZS1ibG9ja1wiPjxuZy1jb250ZW50PjwvbmctY29udGVudD48L2Rpdj5cclxuIl19

package/esm2022/core/shared/components/page-header/page-header.component.mjs

@@ -2,10 +2,10 @@ import { ChangeDetectionStrategy, Component } from '@angular/core';
 import * as i0 from "@angular/core";
 export class PageHeaderComponent {
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: PageHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: PageHeaderComponent, selector: "vdr-page-header", ngImport: i0, template: "<div class=\"max-w-layout page-header\">\r\n<ng-content />\r\n</div>\r\n", styles: [":host{display:block;border-bottom:1px solid var(--color-weight-150);background-color:var(--color-page-header)}.page-header{padding-left:var(--surface-margin-left)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: PageHeaderComponent, selector: "vdr-page-header", ngImport: i0, template: "<div class=\"max-w-layout page-header\">\r\n<ng-content />\r\n</div>\r\n", styles: [":host{display:block;border-bottom:1px solid var(--color-weight-150);background-color:var(--color-page-header)}.page-header{padding-inline-start:var(--surface-margin-left)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: PageHeaderComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-page-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"max-w-layout page-header\">\r\n<ng-content />\r\n</div>\r\n", styles: [":host{display:block;border-bottom:1px solid var(--color-weight-150);background-color:var(--color-page-header)}.page-header{padding-left:var(--surface-margin-left)}\n"] }]
+            args: [{ selector: 'vdr-page-header', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"max-w-layout page-header\">\r\n<ng-content />\r\n</div>\r\n", styles: [":host{display:block;border-bottom:1px solid var(--color-weight-150);background-color:var(--color-page-header)}.page-header{padding-inline-start:var(--surface-margin-left)}\n"] }]
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFnZS1oZWFkZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9jb3JlL3NyYy9zaGFyZWQvY29tcG9uZW50cy9wYWdlLWhlYWRlci9wYWdlLWhlYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvcmUvc3JjL3NoYXJlZC9jb21wb25lbnRzL3BhZ2UtaGVhZGVyL3BhZ2UtaGVhZGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBUW5FLE1BQU0sT0FBTyxtQkFBbUI7OEdBQW5CLG1CQUFtQjtrR0FBbkIsbUJBQW1CLHVEQ1JoQywwRUFHQTs7MkZES2EsbUJBQW1CO2tCQU4vQixTQUFTOytCQUNJLGlCQUFpQixtQkFHVix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Zkci1wYWdlLWhlYWRlcicsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vcGFnZS1oZWFkZXIuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vcGFnZS1oZWFkZXIuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgUGFnZUhlYWRlckNvbXBvbmVudCB7fVxyXG4iLCI8ZGl2IGNsYXNzPVwibWF4LXctbGF5b3V0IHBhZ2UtaGVhZGVyXCI+XHJcbjxuZy1jb250ZW50IC8+XHJcbjwvZGl2PlxyXG4iXX0=

package/esm2022/core/shared/components/product-multi-selector-dialog/product-multi-selector-dialog.component.mjs

@@ -129,10 +129,10 @@ export class ProductMultiSelectorDialogComponent {
         this.resolveWith();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductMultiSelectorDialogComponent, deps: [{ token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductMultiSelectorDialogComponent, selector: "vdr-product-multi-selector-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\r\n    <div class=\"title-row\">\r\n        <span *ngIf=\"mode === 'product'\">{{ 'common.select-products' | translate }}</span>\r\n        <span *ngIf=\"mode === 'variant'\">{{ 'common.select-variants' | translate }}</span>\r\n    </div>\r\n</ng-template>\r\n<vdr-product-search-input\r\n    #productSearchInputComponent\r\n    [facetValueResults]=\"facetValues$ | async\"\r\n    (searchTermChange)=\"setSearchTerm($event)\"\r\n    (facetValueChange)=\"setFacetValueIds($event)\"\r\n></vdr-product-search-input>\r\n<div class=\"flex-wrapper\">\r\n    <div class=\"gallery\">\r\n        <div\r\n            class=\"card\"\r\n            *ngFor=\"let item of (items$ | async) || [] | paginate: paginationConfig; trackBy: trackByFn\"\r\n            (click)=\"toggleSelection(item, $event)\"\r\n            [class.selected]=\"isSelected(item)\"\r\n        >\r\n            <div class=\"card-img\">\r\n                <vdr-select-toggle\r\n                    [selected]=\"isSelected(item)\"\r\n                    [disabled]=\"true\"\r\n                    [hiddenWhenOff]=\"true\"\r\n                ></vdr-select-toggle>\r\n                <img\r\n                    [src]=\"\r\n                        (mode === 'product'\r\n                            ? item.productAsset\r\n                            : item.productVariantAsset || item.productAsset\r\n                        ) | assetPreview: 'thumb'\r\n                    \"\r\n                />\r\n            </div>\r\n            <div class=\"detail\">\r\n                <span [title]=\"mode === 'product' ? item.productName : item.productVariantName\">{{\r\n                    mode === 'product' ? item.productName : item.productVariantName\r\n                }}</span>\r\n                <div *ngIf=\"mode === 'variant'\"><small>{{ item.sku }}</small></div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"selection\">\r\n        <div class=\"m-2 flex center\">\r\n            <div>\r\n                {{ 'common.items-selected-count' | translate: { count: selectionManager.selection.length } }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <button class=\"btn btn-sm btn-link\" (click)=\"clearSelection()\">\r\n                <cds-icon shape=\"times\"></cds-icon> {{ 'common.clear-selection' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"selected-items\">\r\n            <div *ngFor=\"let item of selectionManager.selection\" class=\"flex item-row\">\r\n                <div class=\"\">{{ mode === 'product' ? item.productName : item.productVariantName }}</div>\r\n                <div class=\"flex-spacer\"></div>\r\n                <div>\r\n                    <button class=\"icon-button\" (click)=\"toggleSelection(item, $event)\">\r\n                        <cds-icon shape=\"times\"></cds-icon>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        (itemsPerPageChange)=\"itemsPerPageChange($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"paginationConfig.currentPage\"\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        [totalItems]=\"paginationConfig.totalItems\"\r\n        (pageChange)=\"pageChange($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"select()\"\r\n        class=\"btn btn-primary\"\r\n        [disabled]=\"selectionManager.selection.length === 0\"\r\n    >\r\n        {{ 'common.select-items-with-count' | translate: { count: selectionManager.selection.length } }}\r\n    </button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column;flex-direction:1;height:70vh}.flex-wrapper{display:flex;overflow-y:hidden}.gallery{flex:1;display:grid;grid-template-columns:repeat(auto-fill,125px);grid-template-rows:repeat(auto-fill,200px);grid-gap:10px 20px;padding-left:12px;padding-top:12px;padding-bottom:64px;overflow-y:auto}.gallery .card:hover{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.detail{margin:0 3px;font-size:12px;line-height:.8rem}vdr-select-toggle{position:absolute;top:-12px;left:-12px}vdr-select-toggle ::ng-deep .toggle{box-shadow:0 5px 5px -4px #000000bf}.card.selected{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.card.selected .selected-checkbox{opacity:1}.selection{width:23vw;max-width:400px;padding:6px;display:flex;flex-direction:column}.selection .selected-items{flex:1;overflow-y:auto}.selection .selected-items .item-row{padding-left:3px}.selection .selected-items .item-row:hover{background-color:var(--color-component-bg-200)}.paging-controls{display:flex;align-items:center;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i2.ClrDatagridItemsTrackBy, selector: "[ngForTrackBy]", inputs: ["ngForTrackBy"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i5.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "directive", type: i6.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i7.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i8.SelectToggleComponent, selector: "vdr-select-toggle", inputs: ["size", "selected", "hiddenWhenOff", "disabled", "label"], outputs: ["selectedChange"] }, { kind: "component", type: i9.ProductSearchInputComponent, selector: "vdr-product-search-input", inputs: ["facetValueResults"], outputs: ["searchTermChange", "facetValueChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i12.AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductMultiSelectorDialogComponent, selector: "vdr-product-multi-selector-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>\r\n    <div class=\"title-row\">\r\n        <span *ngIf=\"mode === 'product'\">{{ 'common.select-products' | translate }}</span>\r\n        <span *ngIf=\"mode === 'variant'\">{{ 'common.select-variants' | translate }}</span>\r\n    </div>\r\n</ng-template>\r\n<vdr-product-search-input\r\n    #productSearchInputComponent\r\n    [facetValueResults]=\"facetValues$ | async\"\r\n    (searchTermChange)=\"setSearchTerm($event)\"\r\n    (facetValueChange)=\"setFacetValueIds($event)\"\r\n></vdr-product-search-input>\r\n<div class=\"flex-wrapper\">\r\n    <div class=\"gallery\">\r\n        <div\r\n            class=\"card\"\r\n            *ngFor=\"let item of (items$ | async) || [] | paginate: paginationConfig; trackBy: trackByFn\"\r\n            (click)=\"toggleSelection(item, $event)\"\r\n            [class.selected]=\"isSelected(item)\"\r\n        >\r\n            <div class=\"card-img\">\r\n                <vdr-select-toggle\r\n                    [selected]=\"isSelected(item)\"\r\n                    [disabled]=\"true\"\r\n                    [hiddenWhenOff]=\"true\"\r\n                ></vdr-select-toggle>\r\n                <img\r\n                    [src]=\"\r\n                        (mode === 'product'\r\n                            ? item.productAsset\r\n                            : item.productVariantAsset || item.productAsset\r\n                        ) | assetPreview: 'thumb'\r\n                    \"\r\n                />\r\n            </div>\r\n            <div class=\"detail\">\r\n                <span [title]=\"mode === 'product' ? item.productName : item.productVariantName\">{{\r\n                    mode === 'product' ? item.productName : item.productVariantName\r\n                }}</span>\r\n                <div *ngIf=\"mode === 'variant'\"><small>{{ item.sku }}</small></div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"selection\">\r\n        <div class=\"m-2 flex center\">\r\n            <div>\r\n                {{ 'common.items-selected-count' | translate: { count: selectionManager.selection.length } }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <button class=\"btn btn-sm btn-link\" (click)=\"clearSelection()\">\r\n                <cds-icon shape=\"times\"></cds-icon> {{ 'common.clear-selection' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"selected-items\">\r\n            <div *ngFor=\"let item of selectionManager.selection\" class=\"flex item-row\">\r\n                <div class=\"\">{{ mode === 'product' ? item.productName : item.productVariantName }}</div>\r\n                <div class=\"flex-spacer\"></div>\r\n                <div>\r\n                    <button class=\"icon-button\" (click)=\"toggleSelection(item, $event)\">\r\n                        <cds-icon shape=\"times\"></cds-icon>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        (itemsPerPageChange)=\"itemsPerPageChange($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"paginationConfig.currentPage\"\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        [totalItems]=\"paginationConfig.totalItems\"\r\n        (pageChange)=\"pageChange($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"select()\"\r\n        class=\"btn btn-primary\"\r\n        [disabled]=\"selectionManager.selection.length === 0\"\r\n    >\r\n        {{ 'common.select-items-with-count' | translate: { count: selectionManager.selection.length } }}\r\n    </button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column;flex-direction:1;height:70vh}.flex-wrapper{display:flex;overflow-y:hidden}.gallery{flex:1;display:grid;grid-template-columns:repeat(auto-fill,125px);grid-template-rows:repeat(auto-fill,200px);grid-gap:10px 20px;padding-inline-start:12px;padding-top:12px;padding-bottom:64px;overflow-y:auto}.gallery .card:hover{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.detail{margin:0 3px;font-size:12px;line-height:.8rem}vdr-select-toggle{position:absolute;top:-12px;left:-12px}vdr-select-toggle ::ng-deep .toggle{box-shadow:0 5px 5px -4px #000000bf}.card.selected{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.card.selected .selected-checkbox{opacity:1}.selection{width:23vw;max-width:400px;padding:6px;display:flex;flex-direction:column}.selection .selected-items{flex:1;overflow-y:auto}.selection .selected-items .item-row{padding-inline-start:3px}.selection .selected-items .item-row:hover{background-color:var(--color-component-bg-200)}.paging-controls{display:flex;align-items:center;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i2.ClrDatagridItemsTrackBy, selector: "[ngForTrackBy]", inputs: ["ngForTrackBy"] }, { kind: "directive", type: i2.CdsIconCustomTag, selector: "cds-icon" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { kind: "component", type: i5.PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { kind: "directive", type: i6.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "directive", type: i7.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i8.SelectToggleComponent, selector: "vdr-select-toggle", inputs: ["size", "selected", "hiddenWhenOff", "disabled", "label"], outputs: ["selectedChange"] }, { kind: "component", type: i9.ProductSearchInputComponent, selector: "vdr-product-search-input", inputs: ["facetValueResults"], outputs: ["searchTermChange", "facetValueChange"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.PaginatePipe, name: "paginate" }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i12.AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductMultiSelectorDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-product-multi-selector-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template vdrDialogTitle>\r\n    <div class=\"title-row\">\r\n        <span *ngIf=\"mode === 'product'\">{{ 'common.select-products' | translate }}</span>\r\n        <span *ngIf=\"mode === 'variant'\">{{ 'common.select-variants' | translate }}</span>\r\n    </div>\r\n</ng-template>\r\n<vdr-product-search-input\r\n    #productSearchInputComponent\r\n    [facetValueResults]=\"facetValues$ | async\"\r\n    (searchTermChange)=\"setSearchTerm($event)\"\r\n    (facetValueChange)=\"setFacetValueIds($event)\"\r\n></vdr-product-search-input>\r\n<div class=\"flex-wrapper\">\r\n    <div class=\"gallery\">\r\n        <div\r\n            class=\"card\"\r\n            *ngFor=\"let item of (items$ | async) || [] | paginate: paginationConfig; trackBy: trackByFn\"\r\n            (click)=\"toggleSelection(item, $event)\"\r\n            [class.selected]=\"isSelected(item)\"\r\n        >\r\n            <div class=\"card-img\">\r\n                <vdr-select-toggle\r\n                    [selected]=\"isSelected(item)\"\r\n                    [disabled]=\"true\"\r\n                    [hiddenWhenOff]=\"true\"\r\n                ></vdr-select-toggle>\r\n                <img\r\n                    [src]=\"\r\n                        (mode === 'product'\r\n                            ? item.productAsset\r\n                            : item.productVariantAsset || item.productAsset\r\n                        ) | assetPreview: 'thumb'\r\n                    \"\r\n                />\r\n            </div>\r\n            <div class=\"detail\">\r\n                <span [title]=\"mode === 'product' ? item.productName : item.productVariantName\">{{\r\n                    mode === 'product' ? item.productName : item.productVariantName\r\n                }}</span>\r\n                <div *ngIf=\"mode === 'variant'\"><small>{{ item.sku }}</small></div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"selection\">\r\n        <div class=\"m-2 flex center\">\r\n            <div>\r\n                {{ 'common.items-selected-count' | translate: { count: selectionManager.selection.length } }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <button class=\"btn btn-sm btn-link\" (click)=\"clearSelection()\">\r\n                <cds-icon shape=\"times\"></cds-icon> {{ 'common.clear-selection' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"selected-items\">\r\n            <div *ngFor=\"let item of selectionManager.selection\" class=\"flex item-row\">\r\n                <div class=\"\">{{ mode === 'product' ? item.productName : item.productVariantName }}</div>\r\n                <div class=\"flex-spacer\"></div>\r\n                <div>\r\n                    <button class=\"icon-button\" (click)=\"toggleSelection(item, $event)\">\r\n                        <cds-icon shape=\"times\"></cds-icon>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        (itemsPerPageChange)=\"itemsPerPageChange($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"paginationConfig.currentPage\"\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        [totalItems]=\"paginationConfig.totalItems\"\r\n        (pageChange)=\"pageChange($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"select()\"\r\n        class=\"btn btn-primary\"\r\n        [disabled]=\"selectionManager.selection.length === 0\"\r\n    >\r\n        {{ 'common.select-items-with-count' | translate: { count: selectionManager.selection.length } }}\r\n    </button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column;flex-direction:1;height:70vh}.flex-wrapper{display:flex;overflow-y:hidden}.gallery{flex:1;display:grid;grid-template-columns:repeat(auto-fill,125px);grid-template-rows:repeat(auto-fill,200px);grid-gap:10px 20px;padding-left:12px;padding-top:12px;padding-bottom:64px;overflow-y:auto}.gallery .card:hover{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.detail{margin:0 3px;font-size:12px;line-height:.8rem}vdr-select-toggle{position:absolute;top:-12px;left:-12px}vdr-select-toggle ::ng-deep .toggle{box-shadow:0 5px 5px -4px #000000bf}.card.selected{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.card.selected .selected-checkbox{opacity:1}.selection{width:23vw;max-width:400px;padding:6px;display:flex;flex-direction:column}.selection .selected-items{flex:1;overflow-y:auto}.selection .selected-items .item-row{padding-left:3px}.selection .selected-items .item-row:hover{background-color:var(--color-component-bg-200)}.paging-controls{display:flex;align-items:center;justify-content:space-between}\n"] }]
+            args: [{ selector: 'vdr-product-multi-selector-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template vdrDialogTitle>\r\n    <div class=\"title-row\">\r\n        <span *ngIf=\"mode === 'product'\">{{ 'common.select-products' | translate }}</span>\r\n        <span *ngIf=\"mode === 'variant'\">{{ 'common.select-variants' | translate }}</span>\r\n    </div>\r\n</ng-template>\r\n<vdr-product-search-input\r\n    #productSearchInputComponent\r\n    [facetValueResults]=\"facetValues$ | async\"\r\n    (searchTermChange)=\"setSearchTerm($event)\"\r\n    (facetValueChange)=\"setFacetValueIds($event)\"\r\n></vdr-product-search-input>\r\n<div class=\"flex-wrapper\">\r\n    <div class=\"gallery\">\r\n        <div\r\n            class=\"card\"\r\n            *ngFor=\"let item of (items$ | async) || [] | paginate: paginationConfig; trackBy: trackByFn\"\r\n            (click)=\"toggleSelection(item, $event)\"\r\n            [class.selected]=\"isSelected(item)\"\r\n        >\r\n            <div class=\"card-img\">\r\n                <vdr-select-toggle\r\n                    [selected]=\"isSelected(item)\"\r\n                    [disabled]=\"true\"\r\n                    [hiddenWhenOff]=\"true\"\r\n                ></vdr-select-toggle>\r\n                <img\r\n                    [src]=\"\r\n                        (mode === 'product'\r\n                            ? item.productAsset\r\n                            : item.productVariantAsset || item.productAsset\r\n                        ) | assetPreview: 'thumb'\r\n                    \"\r\n                />\r\n            </div>\r\n            <div class=\"detail\">\r\n                <span [title]=\"mode === 'product' ? item.productName : item.productVariantName\">{{\r\n                    mode === 'product' ? item.productName : item.productVariantName\r\n                }}</span>\r\n                <div *ngIf=\"mode === 'variant'\"><small>{{ item.sku }}</small></div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"selection\">\r\n        <div class=\"m-2 flex center\">\r\n            <div>\r\n                {{ 'common.items-selected-count' | translate: { count: selectionManager.selection.length } }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <button class=\"btn btn-sm btn-link\" (click)=\"clearSelection()\">\r\n                <cds-icon shape=\"times\"></cds-icon> {{ 'common.clear-selection' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"selected-items\">\r\n            <div *ngFor=\"let item of selectionManager.selection\" class=\"flex item-row\">\r\n                <div class=\"\">{{ mode === 'product' ? item.productName : item.productVariantName }}</div>\r\n                <div class=\"flex-spacer\"></div>\r\n                <div>\r\n                    <button class=\"icon-button\" (click)=\"toggleSelection(item, $event)\">\r\n                        <cds-icon shape=\"times\"></cds-icon>\r\n                    </button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        (itemsPerPageChange)=\"itemsPerPageChange($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"paginationConfig.currentPage\"\r\n        [itemsPerPage]=\"paginationConfig.itemsPerPage\"\r\n        [totalItems]=\"paginationConfig.totalItems\"\r\n        (pageChange)=\"pageChange($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"select()\"\r\n        class=\"btn btn-primary\"\r\n        [disabled]=\"selectionManager.selection.length === 0\"\r\n    >\r\n        {{ 'common.select-items-with-count' | translate: { count: selectionManager.selection.length } }}\r\n    </button>\r\n</ng-template>\r\n", styles: [":host{display:flex;flex-direction:column;flex-direction:1;height:70vh}.flex-wrapper{display:flex;overflow-y:hidden}.gallery{flex:1;display:grid;grid-template-columns:repeat(auto-fill,125px);grid-template-rows:repeat(auto-fill,200px);grid-gap:10px 20px;padding-inline-start:12px;padding-top:12px;padding-bottom:64px;overflow-y:auto}.gallery .card:hover{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.detail{margin:0 3px;font-size:12px;line-height:.8rem}vdr-select-toggle{position:absolute;top:-12px;left:-12px}vdr-select-toggle ::ng-deep .toggle{box-shadow:0 5px 5px -4px #000000bf}.card.selected{box-shadow:0 .125rem 0 0 var(--color-primary-500);border:1px solid var(--color-primary-500)}.card.selected .selected-checkbox{opacity:1}.selection{width:23vw;max-width:400px;padding:6px;display:flex;flex-direction:column}.selection .selected-items{flex:1;overflow-y:auto}.selection .selected-items .item-row{padding-inline-start:3px}.selection .selected-items .item-row:hover{background-color:var(--color-component-bg-200)}.paging-controls{display:flex;align-items:center;justify-content:space-between}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.DataService }, { type: i0.ChangeDetectorRef }]; } });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZHVjdC1tdWx0aS1zZWxlY3Rvci1kaWFsb2cuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9jb3JlL3NyYy9zaGFyZWQvY29tcG9uZW50cy9wcm9kdWN0LW11bHRpLXNlbGVjdG9yLWRpYWxvZy9wcm9kdWN0LW11bHRpLXNlbGVjdG9yLWRpYWxvZy5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL2NvcmUvc3JjL3NoYXJlZC9jb21wb25lbnRzL3Byb2R1Y3QtbXVsdGktc2VsZWN0b3ItZGlhbG9nL3Byb2R1Y3QtbXVsdGktc2VsZWN0b3ItZGlhbG9nLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBcUIsU0FBUyxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBRTlGLE9BQU8sRUFBRSxlQUFlLEVBQUUsYUFBYSxFQUFjLE1BQU0sTUFBTSxDQUFDO0FBQ2xFLE9BQU8sRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFFMUMsT0FBTyxFQUNILDBDQUEwQyxHQUU3QyxNQUFNLGlDQUFpQyxDQUFDO0FBQ3pDLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLDZDQUE2QyxDQUFDOzs7Ozs7Ozs7Ozs7OztBQVkvRSxNQUFNLE9BQU8sbUNBQW1DO0lBaUI1QyxZQUFvQixXQUF3QixFQUFVLGNBQWlDO1FBQW5FLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBQVUsbUJBQWMsR0FBZCxjQUFjLENBQW1CO1FBaEJ2RixTQUFJLEdBQTBCLFNBQVMsQ0FBQztRQUN4Qyx3QkFBbUIsR0FBYSxFQUFFLENBQUM7UUFHbkMsZ0JBQVcsR0FBRyxJQUFJLGVBQWUsQ0FBUyxFQUFFLENBQUMsQ0FBQztRQUM5Qyx5QkFBb0IsR0FBRyxJQUFJLGVBQWUsQ0FBVyxFQUFFLENBQUMsQ0FBQztRQUN6RCxxQkFBZ0IsR0FBdUI7WUFDbkMsV0FBVyxFQUFFLENBQUM7WUFDZCxZQUFZLEVBQUUsRUFBRTtZQUNoQixVQUFVLEVBQUUsQ0FBQztTQUNoQixDQUFDO1FBSU0sc0JBQWlCLEdBQUcsSUFBSSxlQUFlLENBQXFCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO0lBRUQsQ0FBQztJQUUzRixRQUFRO1FBQ0osTUFBTSxJQUFJLEdBQ04sSUFBSSxDQUFDLElBQUksS0FBSyxTQUFTO1lBQ25CLENBQUMsQ0FBQyxDQUFDLENBQWEsRUFBRSxDQUFhLEVBQUUsRUFBRSxDQUFDLENBQUMsQ0FBQyxTQUFTLEtBQUssQ0FBQyxDQUFDLFNBQVM7WUFDL0QsQ0FBQyxDQUFDLENBQUMsQ0FBYSxFQUFFLENBQWEsRUFBRSxFQUFFLENBQUMsQ0FBQyxDQUFDLGdCQUFnQixLQUFLLENBQUMsQ0FBQyxnQkFBZ0IsQ0FBQztRQUN0RixJQUFJLENBQUMsZ0JBQWdCLEdBQUcsSUFBSSxnQkFBZ0IsQ0FBYTtZQUNyRCxXQUFXLEVBQUUsSUFBSTtZQUNqQixhQUFhLEVBQUUsSUFBSTtZQUNuQixZQUFZLEVBQUUsSUFBSTtTQUNyQixDQUFDLENBQUM7UUFDSCxNQUFNLGlCQUFpQixHQUFHLElBQUksQ0FBQyxXQUFXLENBQUMsT0FBTyxDQUFDLGNBQWMsQ0FDN0QsRUFBRSxFQUNGLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxZQUFZLEVBQ2xDLENBQUMsQ0FDSixDQUFDO1FBQ0YsTUFBTSxPQUFPLEdBQUcsYUFBYSxDQUN6QixJQUFJLENBQUMsV0FBVyxFQUNoQixJQUFJLENBQUMsb0JBQW9CLEVBQ3pCLElBQUksQ0FBQyxpQkFBaUIsQ0FDekIsQ0FBQyxTQUFTLENBQUMsQ0FBQyxDQUFDLElBQUksRUFBRSxhQUFhLEVBQUUsVUFBVSxDQUFDLEVBQUUsRUFBRTtZQUM5QyxNQUFNLElBQUksR0FBRyxDQUFDLFVBQVUsQ0FBQyxZQUFZLENBQUM7WUFDdEMsTUFBTSxJQUFJLEdBQUcsQ0FBQyxVQUFVLENBQUMsV0FBVyxHQUFHLENBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQztZQUNqRCxPQUFPLGlCQUFpQixDQUFDLEdBQUcsQ0FBQyxPQUFPLENBQUM7Z0JBQ2pDLEtBQUssRUFBRSxFQUFFLElBQUksRUFBRSxJQUFJLEVBQUUsSUFBSSxFQUFFLGFBQWEsRUFBRSxjQUFjLEVBQUUsSUFBSSxDQUFDLElBQUksS0FBSyxTQUFTLEVBQUU7YUFDdEYsQ0FBQyxDQUFDO1FBQ1AsQ0FBQyxDQUFDLENBQUM7UUFFSCxJQUFJLENBQUMsTUFBTSxHQUFHLGlCQUFpQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQ3hDLEdBQUcsQ0FBQyxJQUFJLENBQUMsRUFBRTtZQUNQLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLE1BQU0sQ0FBQyxVQUFVLENBQUM7WUFDMUQsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzdELENBQUMsQ0FBQyxFQUNGLEdBQUcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQ2pDLENBQUM7UUFFRixJQUFJLENBQUMsWUFBWSxHQUFHLGlCQUFpQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxXQUFXLENBQUMsQ0FBQyxDQUFDO1FBRXpGLElBQUksSUFBSSxDQUFDLG1CQUFtQixDQUFDLE1BQU0sRUFBRTtZQUNqQyxJQUFJLElBQUksQ0FBQyxJQUFJLEtBQUssU0FBUyxFQUFFO2dCQUN6QixJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU87cUJBQ25CLFdBQVcsQ0FBQztvQkFDVCxNQUFNLEVBQUU7d0JBQ0osRUFBRSxFQUFFOzRCQUNBLEVBQUUsRUFBRSxJQUFJLENBQUMsbUJBQW1CO3lCQUMvQjtxQkFDSjtpQkFDSixDQUFDO3FCQUNELE9BQU8sQ0FBQyxTQUFTLENBQUMsQ0FBQyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUU7b0JBQ2hDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxjQUFjLENBQ2hDLFFBQVEsQ0FBQyxLQUFLLENBQUMsR0FBRyxDQUNkLE9BQU8sQ0FBQyxFQUFFLENBQ04sQ0FBQzt3QkFDRyxTQUFTLEVBQUUsT0FBTyxDQUFDLEVBQUU7d0JBQ3JCLFdBQVcsRUFBRSxPQUFPLENBQUMsSUFBSTtxQkFDYixDQUFBLENBQ3ZCLENBQ0osQ0FBQztvQkFDRixJQUFJLENBQUMsY0FBYyxDQUFDLFlBQVksRUFBRSxDQUFDO2dCQUN2QyxDQUFDLENBQUMsQ0FBQzthQUNWO2lCQUFNO2dCQUNILElBQUksQ0FBQyxXQUFXO3FCQUNYLEtBQUssQ0FBQywwQ0FBMEMsRUFBRTtvQkFDL0MsT0FBTyxFQUFFO3dCQUNMLE1BQU0sRUFBRTs0QkFDSixFQUFFLEVBQUU7Z0NBQ0EsRUFBRSxFQUFFLElBQUksQ0FBQyxtQkFBbUI7NkJBQy9CO3lCQUNKO3FCQUNKO2lCQUNKLENBQUM7cUJBQ0QsT0FBTyxDQUFDLFNBQVMsQ0FBQyxDQUFDLEVBQUUsZUFBZSxFQUFFLEVBQUUsRUFBRTtvQkFDdkMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGNBQWMsQ0FDaEMsZUFBZSxDQUFDLEtBQUssQ0FBQyxHQUFHLENBQ3JCLE9BQU8sQ0FBQyxFQUFFLENBQ04sQ0FBQzt3QkFDRyxnQkFBZ0IsRUFBRSxPQUFPLENBQUMsRUFBRTt3QkFDNUIsa0JBQWtCLEVBQUUsT0FBTyxDQUFDLElBQUk7cUJBQ3BCLENBQUEsQ0FDdkIsQ0FDSixDQUFDO29CQUNGLElBQUksQ0FBQyxjQUFjLENBQUMsWUFBWSxFQUFFLENBQUM7Z0JBQ3ZDLENBQUMsQ0FBQyxDQUFDO2FBQ1Y7U0FDSjtJQUNMLENBQUM7SUFFRCxTQUFTLENBQUMsS0FBYSxFQUFFLElBQWdCO1FBQ3JDLE9BQU8sSUFBSSxDQUFDLFNBQVMsQ0FBQztJQUMxQixDQUFDO0lBRUQsYUFBYSxDQUFDLElBQVk7UUFDdEIsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDaEMsQ0FBQztJQUNELGdCQUFnQixDQUFDLEdBQWE7UUFDMUIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUN4QyxDQUFDO0lBRUQsZUFBZSxDQUFDLElBQWdCLEVBQUUsS0FBaUI7UUFDL0MsSUFBSSxDQUFDLGdCQUFnQixDQUFDLGVBQWUsQ0FBQyxJQUFJLEVBQUUsS0FBSyxDQUFDLENBQUM7SUFDdkQsQ0FBQztJQUVELGNBQWM7UUFDVixJQUFJLENBQUMsZ0JBQWdCLENBQUMsY0FBYyxDQUFDLEVBQUUsQ0FBQyxDQUFDO0lBQzdDLENBQUM7SUFFRCxVQUFVLENBQUMsSUFBZ0I7UUFDdkIsT0FBTyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsVUFBVSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQ2xELENBQUM7SUFFRCxlQUFlLENBQUMsS0FBaUI7UUFDN0IsS0FBSyxDQUFDLGNBQWMsRUFBRSxDQUFDO1FBQ3ZCLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztJQUM1QixDQUFDO0lBRUQsVUFBVSxDQUFDLElBQVk7UUFDbkIsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUM7UUFDekMsSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztJQUN2RCxDQUFDO0lBRUQsa0JBQWtCLENBQUMsWUFBb0I7UUFDbkMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFlBQVksR0FBRyxZQUFZLENBQUM7UUFDbEQsSUFBSSxDQUFDLGlCQUFpQixDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztJQUN2RCxDQUFDO0lBRUQsTUFBTTtRQUNGLElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLGdCQUFnQixDQUFDLFNBQVMsQ0FBQyxDQUFDO0lBQ3RELENBQUM7SUFFRCxNQUFNO1FBQ0YsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3ZCLENBQUM7OEdBckpRLG1DQUFtQztrR0FBbkMsbUNBQW1DLHlFQ3JCaEQsMjhIQTRGQTs7MkZEdkVhLG1DQUFtQztrQkFOL0MsU0FBUzsrQkFDSSxtQ0FBbUMsbUJBRzVCLHVCQUF1QixDQUFDLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ2hhbmdlRGV0ZWN0b3JSZWYsIENvbXBvbmVudCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFBhZ2luYXRpb25JbnN0YW5jZSB9IGZyb20gJ25neC1wYWdpbmF0aW9uJztcclxuaW1wb3J0IHsgQmVoYXZpb3JTdWJqZWN0LCBjb21iaW5lTGF0ZXN0LCBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XHJcbmltcG9ydCB7IG1hcCwgdGFwIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xyXG5cclxuaW1wb3J0IHtcclxuICAgIEdldFByb2R1Y3RWYXJpYW50c0Zvck11bHRpU2VsZWN0b3JEb2N1bWVudCxcclxuICAgIFNlYXJjaFByb2R1Y3RzUXVlcnksXHJcbn0gZnJvbSAnLi4vLi4vLi4vY29tbW9uL2dlbmVyYXRlZC10eXBlcyc7XHJcbmltcG9ydCB7IFNlbGVjdGlvbk1hbmFnZXIgfSBmcm9tICcuLi8uLi8uLi9jb21tb24vdXRpbGl0aWVzL3NlbGVjdGlvbi1tYW5hZ2VyJztcclxuaW1wb3J0IHsgRGF0YVNlcnZpY2UgfSBmcm9tICcuLi8uLi8uLi9kYXRhL3Byb3ZpZGVycy9kYXRhLnNlcnZpY2UnO1xyXG5pbXBvcnQgeyBEaWFsb2cgfSBmcm9tICcuLi8uLi8uLi9wcm92aWRlcnMvbW9kYWwvbW9kYWwudHlwZXMnO1xyXG5cclxuZXhwb3J0IHR5cGUgU2VhcmNoSXRlbSA9IFNlYXJjaFByb2R1Y3RzUXVlcnlbJ3NlYXJjaCddWydpdGVtcyddW251bWJlcl07XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAndmRyLXByb2R1Y3QtbXVsdGktc2VsZWN0b3ItZGlhbG9nJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9kdWN0LW11bHRpLXNlbGVjdG9yLWRpYWxvZy5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9wcm9kdWN0LW11bHRpLXNlbGVjdG9yLWRpYWxvZy5jb21wb25lbnQuc2NzcyddLFxyXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBQcm9kdWN0TXVsdGlTZWxlY3RvckRpYWxvZ0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgRGlhbG9nPFNlYXJjaEl0ZW1bXT4ge1xyXG4gICAgbW9kZTogJ3Byb2R1Y3QnIHwgJ3ZhcmlhbnQnID0gJ3Byb2R1Y3QnO1xyXG4gICAgaW5pdGlhbFNlbGVjdGlvbklkczogc3RyaW5nW10gPSBbXTtcclxuICAgIGl0ZW1zJDogT2JzZXJ2YWJsZTxTZWFyY2hJdGVtW10+O1xyXG4gICAgZmFjZXRWYWx1ZXMkOiBPYnNlcnZhYmxlPFNlYXJjaFByb2R1Y3RzUXVlcnlbJ3NlYXJjaCddWydmYWNldFZhbHVlcyddPjtcclxuICAgIHNlYXJjaFRlcm0kID0gbmV3IEJlaGF2aW9yU3ViamVjdDxzdHJpbmc+KCcnKTtcclxuICAgIHNlYXJjaEZhY2V0VmFsdWVJZHMkID0gbmV3IEJlaGF2aW9yU3ViamVjdDxzdHJpbmdbXT4oW10pO1xyXG4gICAgcGFnaW5hdGlvbkNvbmZpZzogUGFnaW5hdGlvbkluc3RhbmNlID0ge1xyXG4gICAgICAgIGN1cnJlbnRQYWdlOiAxLFxyXG4gICAgICAgIGl0ZW1zUGVyUGFnZTogMjUsXHJcbiAgICAgICAgdG90YWxJdGVtczogMSxcclxuICAgIH07XHJcbiAgICBzZWxlY3Rpb25NYW5hZ2VyOiBTZWxlY3Rpb25NYW5hZ2VyPFNlYXJjaEl0ZW0+O1xyXG5cclxuICAgIHJlc29sdmVXaXRoOiAocmVzdWx0PzogU2VhcmNoSXRlbVtdKSA9PiB2b2lkO1xyXG4gICAgcHJpdmF0ZSBwYWdpbmF0aW9uQ29uZmlnJCA9IG5ldyBCZWhhdmlvclN1YmplY3Q8UGFnaW5hdGlvbkluc3RhbmNlPih0aGlzLnBhZ2luYXRpb25Db25maWcpO1xyXG5cclxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgZGF0YVNlcnZpY2U6IERhdGFTZXJ2aWNlLCBwcml2YXRlIGNoYW5nZURldGVjdG9yOiBDaGFuZ2VEZXRlY3RvclJlZikge31cclxuXHJcbiAgICBuZ09uSW5pdCgpOiB2b2lkIHtcclxuICAgICAgICBjb25zdCBpZEZuID1cclxuICAgICAgICAgICAgdGhpcy5tb2RlID09PSAncHJvZHVjdCdcclxuICAgICAgICAgICAgICAgID8gKGE6IFNlYXJjaEl0ZW0sIGI6IFNlYXJjaEl0ZW0pID0+IGEucHJvZHVjdElkID09PSBiLnByb2R1Y3RJZFxyXG4gICAgICAgICAgICAgICAgOiAoYTogU2VhcmNoSXRlbSwgYjogU2VhcmNoSXRlbSkgPT4gYS5wcm9kdWN0VmFyaWFudElkID09PSBiLnByb2R1Y3RWYXJpYW50SWQ7XHJcbiAgICAgICAgdGhpcy5zZWxlY3Rpb25NYW5hZ2VyID0gbmV3IFNlbGVjdGlvbk1hbmFnZXI8U2VhcmNoSXRlbT4oe1xyXG4gICAgICAgICAgICBtdWx0aVNlbGVjdDogdHJ1ZSxcclxuICAgICAgICAgICAgaXRlbXNBcmVFcXVhbDogaWRGbixcclxuICAgICAgICAgICAgYWRkaXRpdmVNb2RlOiB0cnVlLFxyXG4gICAgICAgIH0pO1xyXG4gICAgICAgIGNvbnN0IHNlYXJjaFF1ZXJ5UmVzdWx0ID0gdGhpcy5kYXRhU2VydmljZS5wcm9kdWN0LnNlYXJjaFByb2R1Y3RzKFxyXG4gICAgICAgICAgICAnJyxcclxuICAgICAgICAgICAgdGhpcy5wYWdpbmF0aW9uQ29uZmlnLml0ZW1zUGVyUGFnZSxcclxuICAgICAgICAgICAgMCxcclxuICAgICAgICApO1xyXG4gICAgICAgIGNvbnN0IHJlc3VsdCQgPSBjb21iaW5lTGF0ZXN0KFxyXG4gICAgICAgICAgICB0aGlzLnNlYXJjaFRlcm0kLFxyXG4gICAgICAgICAgICB0aGlzLnNlYXJjaEZhY2V0VmFsdWVJZHMkLFxyXG4gICAgICAgICAgICB0aGlzLnBhZ2luYXRpb25Db25maWckLFxyXG4gICAgICAgICkuc3Vic2NyaWJlKChbdGVybSwgZmFjZXRWYWx1ZUlkcywgcGFnaW5hdGlvbl0pID0+IHtcclxuICAgICAgICAgICAgY29uc3QgdGFrZSA9ICtwYWdpbmF0aW9uLml0ZW1zUGVyUGFnZTtcclxuICAgICAgICAgICAgY29uc3Qgc2tpcCA9IChwYWdpbmF0aW9uLmN1cnJlbnRQYWdlIC0gMSkgKiB0YWtlO1xyXG4gICAgICAgICAgICByZXR1cm4gc2VhcmNoUXVlcnlSZXN1bHQucmVmLnJlZmV0Y2goe1xyXG4gICAgICAgICAgICAgICAgaW5wdXQ6IHsgc2tpcCwgdGFrZSwgdGVybSwgZmFjZXRWYWx1ZUlkcywgZ3JvdXBCeVByb2R1Y3Q6IHRoaXMubW9kZSA9PT0gJ3Byb2R1Y3QnIH0sXHJcbiAgICAgICAgICAgIH0pO1xyXG4gICAgICAgIH0pO1xyXG5cclxuICAgICAgICB0aGlzLml0ZW1zJCA9IHNlYXJjaFF1ZXJ5UmVzdWx0LnN0cmVhbSQucGlwZShcclxuICAgICAgICAgICAgdGFwKGRhdGEgPT4ge1xyXG4gICAgICAgICAgICAgICAgdGhpcy5wYWdpbmF0aW9uQ29uZmlnLnRvdGFsSXRlbXMgPSBkYXRhLnNlYXJjaC50b3RhbEl0ZW1zO1xyXG4gICAgICAgICAgICAgICAgdGhpcy5zZWxlY3Rpb25NYW5hZ2VyLnNldEN1cnJlbnRJdGVtcyhkYXRhLnNlYXJjaC5pdGVtcyk7XHJcbiAgICAgICAgICAgIH0pLFxyXG4gICAgICAgICAgICBtYXAoZGF0YSA9PiBkYXRhLnNlYXJjaC5pdGVtcyksXHJcbiAgICAgICAgKTtcclxuXHJcbiAgICAgICAgdGhpcy5mYWNldFZhbHVlcyQgPSBzZWFyY2hRdWVyeVJlc3VsdC5zdHJlYW0kLnBpcGUobWFwKGRhdGEgPT4gZGF0YS5zZWFyY2guZmFjZXRWYWx1ZXMpKTtcclxuXHJcbiAgICAgICAgaWYgKHRoaXMuaW5pdGlhbFNlbGVjdGlvbklkcy5sZW5ndGgpIHtcclxuICAgICAgICAgICAgaWYgKHRoaXMubW9kZSA9PT0gJ3Byb2R1Y3QnKSB7XHJcbiAgICAgICAgICAgICAgICB0aGlzLmRhdGFTZXJ2aWNlLnByb2R1Y3RcclxuICAgICAgICAgICAgICAgICAgICAuZ2V0UHJvZHVjdHMoe1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBmaWx0ZXI6IHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIGlkOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgaW46IHRoaXMuaW5pdGlhbFNlbGVjdGlvbklkcyxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgfSlcclxuICAgICAgICAgICAgICAgICAgICAuc2luZ2xlJC5zdWJzY3JpYmUoKHsgcHJvZHVjdHMgfSkgPT4ge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICB0aGlzLnNlbGVjdGlvbk1hbmFnZXIuc2VsZWN0TXVsdGlwbGUoXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBwcm9kdWN0cy5pdGVtcy5tYXAoXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcHJvZHVjdCA9PlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAoe1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcHJvZHVjdElkOiBwcm9kdWN0LmlkLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcHJvZHVjdE5hbWU6IHByb2R1Y3QubmFtZSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfSBhcyBTZWFyY2hJdGVtKSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICksXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICk7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHRoaXMuY2hhbmdlRGV0ZWN0b3IubWFya0ZvckNoZWNrKCk7XHJcbiAgICAgICAgICAgICAgICAgICAgfSk7XHJcbiAgICAgICAgICAgIH0gZWxzZSB7XHJcbiAgICAgICAgICAgICAgICB0aGlzLmRhdGFTZXJ2aWNlXHJcbiAgICAgICAgICAgICAgICAgICAgLnF1ZXJ5KEdldFByb2R1Y3RWYXJpYW50c0Zvck11bHRpU2VsZWN0b3JEb2N1bWVudCwge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBvcHRpb25zOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBmaWx0ZXI6IHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBpZDoge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBpbjogdGhpcy5pbml0aWFsU2VsZWN0aW9uSWRzLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICAgICAgICAgIH0pXHJcbiAgICAgICAgICAgICAgICAgICAgLnNpbmdsZSQuc3Vic2NyaWJlKCh7IHByb2R1Y3RWYXJpYW50cyB9KSA9PiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHRoaXMuc2VsZWN0aW9uTWFuYWdlci5zZWxlY3RNdWx0aXBsZShcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHByb2R1Y3RWYXJpYW50cy5pdGVtcy5tYXAoXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgdmFyaWFudCA9PlxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAoe1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgcHJvZHVjdFZhcmlhbnRJZDogdmFyaWFudC5pZCxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIHByb2R1Y3RWYXJpYW50TmFtZTogdmFyaWFudC5uYW1lLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB9IGFzIFNlYXJjaEl0ZW0pLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgKSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgKTtcclxuICAgICAgICAgICAgICAgICAgICAgICAgdGhpcy5jaGFuZ2VEZXRlY3Rvci5tYXJrRm9yQ2hlY2soKTtcclxuICAgICAgICAgICAgICAgICAgICB9KTtcclxuICAgICAgICAgICAgfVxyXG4gICAgICAgIH1cclxuICAgIH1cclxuXHJcbiAgICB0cmFja0J5Rm4oaW5kZXg6IG51bWJlciwgaXRlbTogU2VhcmNoSXRlbSkge1xyXG4gICAgICAgIHJldHVybiBpdGVtLnByb2R1Y3RJZDtcclxuICAgIH1cclxuXHJcbiAgICBzZXRTZWFyY2hUZXJtKHRlcm06IHN0cmluZykge1xyXG4gICAgICAgIHRoaXMuc2VhcmNoVGVybSQubmV4dCh0ZXJtKTtcclxuICAgIH1cclxuICAgIHNldEZhY2V0VmFsdWVJZHMoaWRzOiBzdHJpbmdbXSkge1xyXG4gICAgICAgIHRoaXMuc2VhcmNoRmFjZXRWYWx1ZUlkcyQubmV4dChpZHMpO1xyXG4gICAgfVxyXG5cclxuICAgIHRvZ2dsZVNlbGVjdGlvbihpdGVtOiBTZWFyY2hJdGVtLCBldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgICAgIHRoaXMuc2VsZWN0aW9uTWFuYWdlci50b2dnbGVTZWxlY3Rpb24oaXRlbSwgZXZlbnQpO1xyXG4gICAgfVxyXG5cclxuICAgIGNsZWFyU2VsZWN0aW9uKCkge1xyXG4gICAgICAgIHRoaXMuc2VsZWN0aW9uTWFuYWdlci5zZWxlY3RNdWx0aXBsZShbXSk7XHJcbiAgICB9XHJcblxyXG4gICAgaXNTZWxlY3RlZChpdGVtOiBTZWFyY2hJdGVtKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoaXMuc2VsZWN0aW9uTWFuYWdlci5pc1NlbGVjdGVkKGl0ZW0pO1xyXG4gICAgfVxyXG5cclxuICAgIGVudGl0eUluZm9DbGljayhldmVudDogTW91c2VFdmVudCkge1xyXG4gICAgICAgIGV2ZW50LnByZXZlbnREZWZhdWx0KCk7XHJcbiAgICAgICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XHJcbiAgICB9XHJcblxyXG4gICAgcGFnZUNoYW5nZShwYWdlOiBudW1iZXIpIHtcclxuICAgICAgICB0aGlzLnBhZ2luYXRpb25Db25maWcuY3VycmVudFBhZ2UgPSBwYWdlO1xyXG4gICAgICAgIHRoaXMucGFnaW5hdGlvbkNvbmZpZyQubmV4dCh0aGlzLnBhZ2luYXRpb25Db25maWcpO1xyXG4gICAgfVxyXG5cclxuICAgIGl0ZW1zUGVyUGFnZUNoYW5nZShpdGVtc1BlclBhZ2U6IG51bWJlcikge1xyXG4gICAgICAgIHRoaXMucGFnaW5hdGlvbkNvbmZpZy5pdGVtc1BlclBhZ2UgPSBpdGVtc1BlclBhZ2U7XHJcbiAgICAgICAgdGhpcy5wYWdpbmF0aW9uQ29uZmlnJC5uZXh0KHRoaXMucGFnaW5hdGlvbkNvbmZpZyk7XHJcbiAgICB9XHJcblxyXG4gICAgc2VsZWN0KCkge1xyXG4gICAgICAgIHRoaXMucmVzb2x2ZVdpdGgodGhpcy5zZWxlY3Rpb25NYW5hZ2VyLnNlbGVjdGlvbik7XHJcbiAgICB9XHJcblxyXG4gICAgY2FuY2VsKCkge1xyXG4gICAgICAgIHRoaXMucmVzb2x2ZVdpdGgoKTtcclxuICAgIH1cclxufVxyXG4iLCI8bmctdGVtcGxhdGUgdmRyRGlhbG9nVGl0bGU+XHJcbiAgICA8ZGl2IGNsYXNzPVwidGl0bGUtcm93XCI+XHJcbiAgICAgICAgPHNwYW4gKm5nSWY9XCJtb2RlID09PSAncHJvZHVjdCdcIj57eyAnY29tbW9uLnNlbGVjdC1wcm9kdWN0cycgfCB0cmFuc2xhdGUgfX08L3NwYW4+XHJcbiAgICAgICAgPHNwYW4gKm5nSWY9XCJtb2RlID09PSAndmFyaWFudCdcIj57eyAnY29tbW9uLnNlbGVjdC12YXJpYW50cycgfCB0cmFuc2xhdGUgfX08L3NwYW4+XHJcbiAgICA8L2Rpdj5cclxuPC9uZy10ZW1wbGF0ZT5cclxuPHZkci1wcm9kdWN0LXNlYXJjaC1pbnB1dFxyXG4gICAgI3Byb2R1Y3RTZWFyY2hJbnB1dENvbXBvbmVudFxyXG4gICAgW2ZhY2V0VmFsdWVSZXN1bHRzXT1cImZhY2V0VmFsdWVzJCB8IGFzeW5jXCJcclxuICAgIChzZWFyY2hUZXJtQ2hhbmdlKT1cInNldFNlYXJjaFRlcm0oJGV2ZW50KVwiXHJcbiAgICAoZmFjZXRWYWx1ZUNoYW5nZSk9XCJzZXRGYWNldFZhbHVlSWRzKCRldmVudClcIlxyXG4+PC92ZHItcHJvZHVjdC1zZWFyY2gtaW5wdXQ+XHJcbjxkaXYgY2xhc3M9XCJmbGV4LXdyYXBwZXJcIj5cclxuICAgIDxkaXYgY2xhc3M9XCJnYWxsZXJ5XCI+XHJcbiAgICAgICAgPGRpdlxyXG4gICAgICAgICAgICBjbGFzcz1cImNhcmRcIlxyXG4gICAgICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiAoaXRlbXMkIHwgYXN5bmMpIHx8IFtdIHwgcGFnaW5hdGU6IHBhZ2luYXRpb25Db25maWc7IHRyYWNrQnk6IHRyYWNrQnlGblwiXHJcbiAgICAgICAgICAgIChjbGljayk9XCJ0b2dnbGVTZWxlY3Rpb24oaXRlbSwgJGV2ZW50KVwiXHJcbiAgICAgICAgICAgIFtjbGFzcy5zZWxlY3RlZF09XCJpc1NlbGVjdGVkKGl0ZW0pXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJjYXJkLWltZ1wiPlxyXG4gICAgICAgICAgICAgICAgPHZkci1zZWxlY3QtdG9nZ2xlXHJcbiAgICAgICAgICAgICAgICAgICAgW3NlbGVjdGVkXT1cImlzU2VsZWN0ZWQoaXRlbSlcIlxyXG4gICAgICAgICAgICAgICAgICAgIFtkaXNhYmxlZF09XCJ0cnVlXCJcclxuICAgICAgICAgICAgICAgICAgICBbaGlkZGVuV2hlbk9mZl09XCJ0cnVlXCJcclxuICAgICAgICAgICAgICAgID48L3Zkci1zZWxlY3QtdG9nZ2xlPlxyXG4gICAgICAgICAgICAgICAgPGltZ1xyXG4gICAgICAgICAgICAgICAgICAgIFtzcmNdPVwiXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIChtb2RlID09PSAncHJvZHVjdCdcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgID8gaXRlbS5wcm9kdWN0QXNzZXRcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDogaXRlbS5wcm9kdWN0VmFyaWFudEFzc2V0IHx8IGl0ZW0ucHJvZHVjdEFzc2V0XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICkgfCBhc3NldFByZXZpZXc6ICd0aHVtYidcclxuICAgICAgICAgICAgICAgICAgICBcIlxyXG4gICAgICAgICAgICAgICAgLz5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJkZXRhaWxcIj5cclxuICAgICAgICAgICAgICAgIDxzcGFuIFt0aXRsZV09XCJtb2RlID09PSAncHJvZHVjdCcgPyBpdGVtLnByb2R1Y3ROYW1lIDogaXRlbS5wcm9kdWN0VmFyaWFudE5hbWVcIj57e1xyXG4gICAgICAgICAgICAgICAgICAgIG1vZGUgPT09ICdwcm9kdWN0JyA/IGl0ZW0ucHJvZHVjdE5hbWUgOiBpdGVtLnByb2R1Y3RWYXJpYW50TmFtZVxyXG4gICAgICAgICAgICAgICAgfX08L3NwYW4+XHJcbiAgICAgICAgICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZSA9PT0gJ3ZhcmlhbnQnXCI+PHNtYWxsPnt7IGl0ZW0uc2t1IH19PC9zbWFsbD48L2Rpdj5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxkaXYgY2xhc3M9XCJzZWxlY3Rpb25cIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwibS0yIGZsZXggY2VudGVyXCI+XHJcbiAgICAgICAgICAgIDxkaXY+XHJcbiAgICAgICAgICAgICAgICB7eyAnY29tbW9uLml0ZW1zLXNlbGVjdGVkLWNvdW50JyB8IHRyYW5zbGF0ZTogeyBjb3VudDogc2VsZWN0aW9uTWFuYWdlci5zZWxlY3Rpb24ubGVuZ3RoIH0gfX1cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4LXNwYWNlclwiPjwvZGl2PlxyXG4gICAgICAgICAgICA8YnV0dG9uIGNsYXNzPVwiYnRuIGJ0bi1zbSBidG4tbGlua1wiIChjbGljayk9XCJjbGVhclNlbGVjdGlvbigpXCI+XHJcbiAgICAgICAgICAgICAgICA8Y2RzLWljb24gc2hhcGU9XCJ0aW1lc1wiPjwvY2RzLWljb24+IHt7ICdjb21tb24uY2xlYXItc2VsZWN0aW9uJyB8IHRyYW5zbGF0ZSB9fVxyXG4gICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwic2VsZWN0ZWQtaXRlbXNcIj5cclxuICAgICAgICAgICAgPGRpdiAqbmdGb3I9XCJsZXQgaXRlbSBvZiBzZWxlY3Rpb25NYW5hZ2VyLnNlbGVjdGlvblwiIGNsYXNzPVwiZmxleCBpdGVtLXJvd1wiPlxyXG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cIlwiPnt7IG1vZGUgPT09ICdwcm9kdWN0JyA/IGl0ZW0ucHJvZHVjdE5hbWUgOiBpdGVtLnByb2R1Y3RWYXJpYW50TmFtZSB9fTwvZGl2PlxyXG4gICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cImZsZXgtc3BhY2VyXCI+PC9kaXY+XHJcbiAgICAgICAgICAgICAgICA8ZGl2PlxyXG4gICAgICAgICAgICAgICAgICAgIDxidXR0b24gY2xhc3M9XCJpY29uLWJ1dHRvblwiIChjbGljayk9XCJ0b2dnbGVTZWxlY3Rpb24oaXRlbSwgJGV2ZW50KVwiPlxyXG4gICAgICAgICAgICAgICAgICAgICAgICA8Y2RzLWljb24gc2hhcGU9XCJ0aW1lc1wiPjwvY2RzLWljb24+XHJcbiAgICAgICAgICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICA8L2Rpdj5cclxuPC9kaXY+XHJcblxyXG48ZGl2IGNsYXNzPVwicGFnaW5nLWNvbnRyb2xzXCI+XHJcbiAgICA8dmRyLWl0ZW1zLXBlci1wYWdlLWNvbnRyb2xzXHJcbiAgICAgICAgW2l0ZW1zUGVyUGFnZV09XCJwYWdpbmF0aW9uQ29uZmlnLml0ZW1zUGVyUGFnZVwiXHJcbiAgICAgICAgKGl0ZW1zUGVyUGFnZUNoYW5nZSk9XCJpdGVtc1BlclBhZ2VDaGFuZ2UoJGV2ZW50KVwiXHJcbiAgICA+PC92ZHItaXRlbXMtcGVyLXBhZ2UtY29udHJvbHM+XHJcblxyXG4gICAgPHZkci1wYWdpbmF0aW9uLWNvbnRyb2xzXHJcbiAgICAgICAgW2N1cnJlbnRQYWdlXT1cInBhZ2luYXRpb25Db25maWcuY3VycmVudFBhZ2VcIlxyXG4gICAgICAgIFtpdGVtc1BlclBhZ2VdPVwicGFnaW5hdGlvbkNvbmZpZy5pdGVtc1BlclBhZ2VcIlxyXG4gICAgICAgIFt0b3RhbEl0ZW1zXT1cInBhZ2luYXRpb25Db25maWcudG90YWxJdGVtc1wiXHJcbiAgICAgICAgKHBhZ2VDaGFuZ2UpPVwicGFnZUNoYW5nZSgkZXZlbnQpXCJcclxuICAgID48L3Zkci1wYWdpbmF0aW9uLWNvbnRyb2xzPlxyXG48L2Rpdj5cclxuXHJcbjxuZy10ZW1wbGF0ZSB2ZHJEaWFsb2dCdXR0b25zPlxyXG4gICAgPGJ1dHRvbiB0eXBlPVwiYnV0dG9uXCIgY2xhc3M9XCJidG5cIiAoY2xpY2spPVwiY2FuY2VsKClcIj57eyAnY29tbW9uLmNhbmNlbCcgfCB0cmFuc2xhdGUgfX08L2J1dHRvbj5cclxuICAgIDxidXR0b25cclxuICAgICAgICB0eXBlPVwic3VibWl0XCJcclxuICAgICAgICAoY2xpY2spPVwic2VsZWN0KClcIlxyXG4gICAgICAgIGNsYXNzPVwiYnRuIGJ0bi1wcmltYXJ5XCJcclxuICAgICAgICBbZGlzYWJsZWRdPVwic2VsZWN0aW9uTWFuYWdlci5zZWxlY3Rpb24ubGVuZ3RoID09PSAwXCJcclxuICAgID5cclxuICAgICAgICB7eyAnY29tbW9uLnNlbGVjdC1pdGVtcy13aXRoLWNvdW50JyB8IHRyYW5zbGF0ZTogeyBjb3VudDogc2VsZWN0aW9uTWFuYWdlci5zZWxlY3Rpb24ubGVuZ3RoIH0gfX1cclxuICAgIDwvYnV0dG9uPlxyXG48L25nLXRlbXBsYXRlPlxyXG4iXX0=

package/esm2022/core/shared/components/product-search-input/product-search-input.component.mjs

@@ -86,11 +86,11 @@ export class ProductSearchInputComponent {
         return this.selectComponent.itemsList.markedIndex === -1;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductSearchInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductSearchInputComponent, selector: "vdr-product-search-input", inputs: { facetValueResults: "facetValueResults" }, outputs: { searchTermChange: "searchTermChange", facetValueChange: "facetValueChange" }, providers: [{ provide: SELECTION_MODEL_FACTORY, useValue: SingleSearchSelectionModelFactory }], viewQueries: [{ propertyName: "selectComponent", first: true, predicate: ["selectComponent"], descendants: true, static: true }], ngImport: i0, template: "<ng-select\r\n    [addTag]=\"addTagFn\"\r\n    [placeholder]=\"'catalog.search-product-name-or-code' | translate\"\r\n    [items]=\"facetValueResults\"\r\n    [searchFn]=\"filterFacetResults\"\r\n    [hideSelected]=\"true\"\r\n    [multiple]=\"true\"\r\n    [markFirst]=\"false\"\r\n    (change)=\"onSelectChange($event)\"\r\n    #selectComponent\r\n>\r\n    <ng-template ng-header-tmp>\r\n        <div\r\n            class=\"search-header\"\r\n            *ngIf=\"selectComponent.searchTerm\"\r\n            [class.selected]=\"isSearchHeaderSelected()\"\r\n            (click)=\"selectComponent.selectTag()\"\r\n        >\r\n            {{ 'catalog.search-for-term' | translate }}: {{ selectComponent.searchTerm }}\r\n        </div>\r\n    </ng-template>\r\n    <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip\r\n                [facetValue]=\"item.facetValue\"\r\n                [removable]=\"true\"\r\n                (remove)=\"clear(item)\"\r\n            ></vdr-facet-value-chip>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!item.facetValue\">\r\n            <vdr-chip [icon]=\"'times'\" (iconClick)=\"clear(item)\">\"{{ item.label }}\"</vdr-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip [facetValue]=\"item.facetValue\" [removable]=\"false\"></vdr-facet-value-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{margin-top:6px;display:block;width:100%}ng-select{width:100%;margin-right:12px}.search-header{padding:8px 10px;border-bottom:1px solid var(--color-component-border-100);cursor:pointer}.search-header.selected,.search-header:hover{background-color:var(--color-component-bg-200)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "component", type: i3.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i4.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductSearchInputComponent, selector: "vdr-product-search-input", inputs: { facetValueResults: "facetValueResults" }, outputs: { searchTermChange: "searchTermChange", facetValueChange: "facetValueChange" }, providers: [{ provide: SELECTION_MODEL_FACTORY, useValue: SingleSearchSelectionModelFactory }], viewQueries: [{ propertyName: "selectComponent", first: true, predicate: ["selectComponent"], descendants: true, static: true }], ngImport: i0, template: "<ng-select\r\n    [addTag]=\"addTagFn\"\r\n    [placeholder]=\"'catalog.search-product-name-or-code' | translate\"\r\n    [items]=\"facetValueResults\"\r\n    [searchFn]=\"filterFacetResults\"\r\n    [hideSelected]=\"true\"\r\n    [multiple]=\"true\"\r\n    [markFirst]=\"false\"\r\n    (change)=\"onSelectChange($event)\"\r\n    #selectComponent\r\n>\r\n    <ng-template ng-header-tmp>\r\n        <div\r\n            class=\"search-header\"\r\n            *ngIf=\"selectComponent.searchTerm\"\r\n            [class.selected]=\"isSearchHeaderSelected()\"\r\n            (click)=\"selectComponent.selectTag()\"\r\n        >\r\n            {{ 'catalog.search-for-term' | translate }}: {{ selectComponent.searchTerm }}\r\n        </div>\r\n    </ng-template>\r\n    <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip\r\n                [facetValue]=\"item.facetValue\"\r\n                [removable]=\"true\"\r\n                (remove)=\"clear(item)\"\r\n            ></vdr-facet-value-chip>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!item.facetValue\">\r\n            <vdr-chip [icon]=\"'times'\" (iconClick)=\"clear(item)\">\"{{ item.label }}\"</vdr-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip [facetValue]=\"item.facetValue\" [removable]=\"false\"></vdr-facet-value-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{margin-top:6px;display:block;width:100%}ng-select{width:100%;margin-inline-end:12px}.search-header{padding:8px 10px;border-bottom:1px solid var(--color-component-border-100);cursor:pointer}.search-header.selected,.search-header:hover{background-color:var(--color-component-bg-200)}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "directive", type: i2.NgLabelTemplateDirective, selector: "[ng-label-tmp]" }, { kind: "directive", type: i2.NgHeaderTemplateDirective, selector: "[ng-header-tmp]" }, { kind: "component", type: i3.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i4.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductSearchInputComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-product-search-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: SELECTION_MODEL_FACTORY, useValue: SingleSearchSelectionModelFactory }], template: "<ng-select\r\n    [addTag]=\"addTagFn\"\r\n    [placeholder]=\"'catalog.search-product-name-or-code' | translate\"\r\n    [items]=\"facetValueResults\"\r\n    [searchFn]=\"filterFacetResults\"\r\n    [hideSelected]=\"true\"\r\n    [multiple]=\"true\"\r\n    [markFirst]=\"false\"\r\n    (change)=\"onSelectChange($event)\"\r\n    #selectComponent\r\n>\r\n    <ng-template ng-header-tmp>\r\n        <div\r\n            class=\"search-header\"\r\n            *ngIf=\"selectComponent.searchTerm\"\r\n            [class.selected]=\"isSearchHeaderSelected()\"\r\n            (click)=\"selectComponent.selectTag()\"\r\n        >\r\n            {{ 'catalog.search-for-term' | translate }}: {{ selectComponent.searchTerm }}\r\n        </div>\r\n    </ng-template>\r\n    <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip\r\n                [facetValue]=\"item.facetValue\"\r\n                [removable]=\"true\"\r\n                (remove)=\"clear(item)\"\r\n            ></vdr-facet-value-chip>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!item.facetValue\">\r\n            <vdr-chip [icon]=\"'times'\" (iconClick)=\"clear(item)\">\"{{ item.label }}\"</vdr-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip [facetValue]=\"item.facetValue\" [removable]=\"false\"></vdr-facet-value-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{margin-top:6px;display:block;width:100%}ng-select{width:100%;margin-right:12px}.search-header{padding:8px 10px;border-bottom:1px solid var(--color-component-border-100);cursor:pointer}.search-header.selected,.search-header:hover{background-color:var(--color-component-bg-200)}\n"] }]
+            args: [{ selector: 'vdr-product-search-input', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{ provide: SELECTION_MODEL_FACTORY, useValue: SingleSearchSelectionModelFactory }], template: "<ng-select\r\n    [addTag]=\"addTagFn\"\r\n    [placeholder]=\"'catalog.search-product-name-or-code' | translate\"\r\n    [items]=\"facetValueResults\"\r\n    [searchFn]=\"filterFacetResults\"\r\n    [hideSelected]=\"true\"\r\n    [multiple]=\"true\"\r\n    [markFirst]=\"false\"\r\n    (change)=\"onSelectChange($event)\"\r\n    #selectComponent\r\n>\r\n    <ng-template ng-header-tmp>\r\n        <div\r\n            class=\"search-header\"\r\n            *ngIf=\"selectComponent.searchTerm\"\r\n            [class.selected]=\"isSearchHeaderSelected()\"\r\n            (click)=\"selectComponent.selectTag()\"\r\n        >\r\n            {{ 'catalog.search-for-term' | translate }}: {{ selectComponent.searchTerm }}\r\n        </div>\r\n    </ng-template>\r\n    <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip\r\n                [facetValue]=\"item.facetValue\"\r\n                [removable]=\"true\"\r\n                (remove)=\"clear(item)\"\r\n            ></vdr-facet-value-chip>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!item.facetValue\">\r\n            <vdr-chip [icon]=\"'times'\" (iconClick)=\"clear(item)\">\"{{ item.label }}\"</vdr-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip [facetValue]=\"item.facetValue\" [removable]=\"false\"></vdr-facet-value-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{margin-top:6px;display:block;width:100%}ng-select{width:100%;margin-inline-end:12px}.search-header{padding:8px 10px;border-bottom:1px solid var(--color-component-border-100);cursor:pointer}.search-header.selected,.search-header:hover{background-color:var(--color-component-bg-200)}\n"] }]
         }], propDecorators: { facetValueResults: [{
                 type: Input
             }], searchTermChange: [{

package/esm2022/core/shared/components/product-variant-selector/product-variant-selector.component.mjs

@@ -48,11 +48,11 @@ export class ProductVariantSelectorComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductVariantSelectorComponent, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductVariantSelectorComponent, selector: "vdr-product-variant-selector", outputs: { productSelected: "productSelected" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["autoComplete"], descendants: true, static: true }], ngImport: i0, template: "<ng-select\r\n    #autoComplete\r\n    [items]=\"searchResults$ | async\"\r\n    [addTag]=\"false\"\r\n    [multiple]=\"false\"\r\n    [hideSelected]=\"true\"\r\n    [loading]=\"searchLoading\"\r\n    [typeahead]=\"searchInput$\"\r\n    [appendTo]=\"'body'\"\r\n    [placeholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    (change)=\"selectResult($event)\"\r\n>\r\n    <ng-template ng-option-tmp let-item=\"item\">\r\n        <img [src]=\"item.productAsset | assetPreview: 32\">\r\n        {{ item.productVariantName }}\r\n        <small class=\"sku\">{{ item.sku }}</small>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{display:block}.sku{margin-left:12px;color:var(--color-grey-500)}img{border-radius:var(--border-radius-img)}\n"], dependencies: [{ kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ProductVariantSelectorComponent, selector: "vdr-product-variant-selector", outputs: { productSelected: "productSelected" }, viewQueries: [{ propertyName: "ngSelect", first: true, predicate: ["autoComplete"], descendants: true, static: true }], ngImport: i0, template: "<ng-select\r\n    #autoComplete\r\n    [items]=\"searchResults$ | async\"\r\n    [addTag]=\"false\"\r\n    [multiple]=\"false\"\r\n    [hideSelected]=\"true\"\r\n    [loading]=\"searchLoading\"\r\n    [typeahead]=\"searchInput$\"\r\n    [appendTo]=\"'body'\"\r\n    [placeholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    (change)=\"selectResult($event)\"\r\n>\r\n    <ng-template ng-option-tmp let-item=\"item\">\r\n        <img [src]=\"item.productAsset | assetPreview: 32\">\r\n        {{ item.productVariantName }}\r\n        <small class=\"sku\">{{ item.sku }}</small>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{display:block}.sku{margin-inline-start:12px;color:var(--color-grey-500)}img{border-radius:var(--border-radius-img)}\n"], dependencies: [{ kind: "component", type: i2.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i2.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }, { kind: "pipe", type: i5.AssetPreviewPipe, name: "assetPreview" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ProductVariantSelectorComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-product-variant-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-select\r\n    #autoComplete\r\n    [items]=\"searchResults$ | async\"\r\n    [addTag]=\"false\"\r\n    [multiple]=\"false\"\r\n    [hideSelected]=\"true\"\r\n    [loading]=\"searchLoading\"\r\n    [typeahead]=\"searchInput$\"\r\n    [appendTo]=\"'body'\"\r\n    [placeholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    (change)=\"selectResult($event)\"\r\n>\r\n    <ng-template ng-option-tmp let-item=\"item\">\r\n        <img [src]=\"item.productAsset | assetPreview: 32\">\r\n        {{ item.productVariantName }}\r\n        <small class=\"sku\">{{ item.sku }}</small>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{display:block}.sku{margin-left:12px;color:var(--color-grey-500)}img{border-radius:var(--border-radius-img)}\n"] }]
+            args: [{ selector: 'vdr-product-variant-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-select\r\n    #autoComplete\r\n    [items]=\"searchResults$ | async\"\r\n    [addTag]=\"false\"\r\n    [multiple]=\"false\"\r\n    [hideSelected]=\"true\"\r\n    [loading]=\"searchLoading\"\r\n    [typeahead]=\"searchInput$\"\r\n    [appendTo]=\"'body'\"\r\n    [placeholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    (change)=\"selectResult($event)\"\r\n>\r\n    <ng-template ng-option-tmp let-item=\"item\">\r\n        <img [src]=\"item.productAsset | assetPreview: 32\">\r\n        {{ item.productVariantName }}\r\n        <small class=\"sku\">{{ item.sku }}</small>\r\n    </ng-template>\r\n</ng-select>\r\n", styles: [":host{display:block}.sku{margin-inline-start:12px;color:var(--color-grey-500)}img{border-radius:var(--border-radius-img)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.DataService }]; }, propDecorators: { productSelected: [{
                 type: Output
             }], ngSelect: [{

package/esm2022/core/shared/components/radio-card/radio-card.component.mjs

@@ -39,11 +39,11 @@ export class RadioCardComponent {
         return this.fieldset.idFn(item);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: RadioCardComponent, deps: [{ token: i1.RadioCardFieldsetComponent }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: RadioCardComponent, selector: "vdr-radio-card", inputs: { item: "item" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["VdrRadioCard"], ngImport: i0, template: "<label\r\n    [ngClass]=\"{\r\n        'selected': isSelected(item),\r\n        'focussed': isFocussed(item)\r\n    }\"\r\n    class=\"radio-card\"\r\n>\r\n    <input\r\n        type=\"radio\"\r\n        [name]=\"name\"\r\n        [value]=\"getItemId(item)\"\r\n        class=\"hidden\"\r\n        (focus)=\"setFocussedId(item)\"\r\n        (blur)=\"setFocussedId(undefined)\"\r\n        (change)=\"selectChanged(item)\"\r\n    />\r\n    <vdr-select-toggle [selected]=\"isSelected(item)\" size=\"small\"></vdr-select-toggle>\r\n    <div class=\"content\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</label>\r\n", styles: [":host{display:inline-block}.radio-card{background:none;position:relative;display:block;border:1px solid var(--clr-btn-default-border-color, #0072a3);border-radius:var(--clr-btn-border-radius, .15rem);padding:6px;text-align:left;margin:6px}.radio-card:hover{cursor:pointer;outline:1px solid var(--color-primary-500)}.radio-card.selected{outline:1px solid var(--color-primary-500);background-color:var(--color-primary-100)}input.hidden{visibility:hidden;position:absolute}vdr-select-toggle{position:absolute;top:3px;left:3px}.content{margin-left:24px}\n"], dependencies: [{ kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: i5.SelectToggleComponent, selector: "vdr-select-toggle", inputs: ["size", "selected", "hiddenWhenOff", "disabled", "label"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: RadioCardComponent, selector: "vdr-radio-card", inputs: { item: "item" }, queries: [{ propertyName: "itemTemplate", first: true, predicate: TemplateRef, descendants: true }], exportAs: ["VdrRadioCard"], ngImport: i0, template: "<label\r\n    [ngClass]=\"{\r\n        'selected': isSelected(item),\r\n        'focussed': isFocussed(item)\r\n    }\"\r\n    class=\"radio-card\"\r\n>\r\n    <input\r\n        type=\"radio\"\r\n        [name]=\"name\"\r\n        [value]=\"getItemId(item)\"\r\n        class=\"hidden\"\r\n        (focus)=\"setFocussedId(item)\"\r\n        (blur)=\"setFocussedId(undefined)\"\r\n        (change)=\"selectChanged(item)\"\r\n    />\r\n    <vdr-select-toggle [selected]=\"isSelected(item)\" size=\"small\"></vdr-select-toggle>\r\n    <div class=\"content\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</label>\r\n", styles: [":host{display:inline-block}.radio-card{background:none;position:relative;display:block;border:1px solid var(--clr-btn-default-border-color, #0072a3);border-radius:var(--clr-btn-border-radius, .15rem);padding:6px;text-align:start;margin:6px}.radio-card:hover{cursor:pointer;outline:1px solid var(--color-primary-500)}.radio-card.selected{outline:1px solid var(--color-primary-500);background-color:var(--color-primary-100)}input.hidden{visibility:hidden;position:absolute}vdr-select-toggle{position:absolute;top:3px;left:3px}.content{margin-inline-start:24px}\n"], dependencies: [{ kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: i5.SelectToggleComponent, selector: "vdr-select-toggle", inputs: ["size", "selected", "hiddenWhenOff", "disabled", "label"], outputs: ["selectedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: RadioCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-radio-card', exportAs: 'VdrRadioCard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<label\r\n    [ngClass]=\"{\r\n        'selected': isSelected(item),\r\n        'focussed': isFocussed(item)\r\n    }\"\r\n    class=\"radio-card\"\r\n>\r\n    <input\r\n        type=\"radio\"\r\n        [name]=\"name\"\r\n        [value]=\"getItemId(item)\"\r\n        class=\"hidden\"\r\n        (focus)=\"setFocussedId(item)\"\r\n        (blur)=\"setFocussedId(undefined)\"\r\n        (change)=\"selectChanged(item)\"\r\n    />\r\n    <vdr-select-toggle [selected]=\"isSelected(item)\" size=\"small\"></vdr-select-toggle>\r\n    <div class=\"content\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</label>\r\n", styles: [":host{display:inline-block}.radio-card{background:none;position:relative;display:block;border:1px solid var(--clr-btn-default-border-color, #0072a3);border-radius:var(--clr-btn-border-radius, .15rem);padding:6px;text-align:left;margin:6px}.radio-card:hover{cursor:pointer;outline:1px solid var(--color-primary-500)}.radio-card.selected{outline:1px solid var(--color-primary-500);background-color:var(--color-primary-100)}input.hidden{visibility:hidden;position:absolute}vdr-select-toggle{position:absolute;top:3px;left:3px}.content{margin-left:24px}\n"] }]
+            args: [{ selector: 'vdr-radio-card', exportAs: 'VdrRadioCard', changeDetection: ChangeDetectionStrategy.OnPush, template: "<label\r\n    [ngClass]=\"{\r\n        'selected': isSelected(item),\r\n        'focussed': isFocussed(item)\r\n    }\"\r\n    class=\"radio-card\"\r\n>\r\n    <input\r\n        type=\"radio\"\r\n        [name]=\"name\"\r\n        [value]=\"getItemId(item)\"\r\n        class=\"hidden\"\r\n        (focus)=\"setFocussedId(item)\"\r\n        (blur)=\"setFocussedId(undefined)\"\r\n        (change)=\"selectChanged(item)\"\r\n    />\r\n    <vdr-select-toggle [selected]=\"isSelected(item)\" size=\"small\"></vdr-select-toggle>\r\n    <div class=\"content\">\r\n        <ng-content></ng-content>\r\n    </div>\r\n</label>\r\n", styles: [":host{display:inline-block}.radio-card{background:none;position:relative;display:block;border:1px solid var(--clr-btn-default-border-color, #0072a3);border-radius:var(--clr-btn-border-radius, .15rem);padding:6px;text-align:start;margin:6px}.radio-card:hover{cursor:pointer;outline:1px solid var(--color-primary-500)}.radio-card.selected{outline:1px solid var(--color-primary-500);background-color:var(--color-primary-100)}input.hidden{visibility:hidden;position:absolute}vdr-select-toggle{position:absolute;top:3px;left:3px}.content{margin-inline-start:24px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.RadioCardFieldsetComponent }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { item: [{
                 type: Input
             }], itemTemplate: [{

package/esm2022/core/shared/components/rich-text-editor/external-image-dialog/external-image-dialog.component.mjs

@@ -28,10 +28,10 @@ export class ExternalImageDialogComponent {
         this.previewLoaded = false;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ExternalImageDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ExternalImageDialogComponent, selector: "vdr-external-image-dialog", ngImport: i0, template: "<div class=\"flex\">\r\n    <form [formGroup]=\"form\" class=\"flex-spacer\" clrForm clrLayout=\"vertical\">\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-src' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"src\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-title' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"title\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-alt' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"alt\" />\r\n        </clr-input-container>\r\n    </form>\r\n    <div class=\"preview\">\r\n        <img\r\n            [src]=\"form.get('src')?.value\"\r\n            [class.visible]=\"previewLoaded\"\r\n            (load)=\"onImageLoad($event)\"\r\n            (error)=\"onImageError($event)\"\r\n        />\r\n        <div class=\"placeholder\" *ngIf=\"!previewLoaded\">\r\n            <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"submit\" (click)=\"select()\" class=\"btn btn-primary\" [disabled]=\"form.invalid || !previewLoaded\">\r\n        <ng-container *ngIf=\"existing; else doesNotExist\">{{ 'common.update' | translate }}</ng-container>\r\n        <ng-template #doesNotExist>{{ 'editor.insert-image' | translate }}</ng-template>\r\n    </button>\r\n</ng-template>\r\n", styles: [".preview{display:flex;align-items:center;justify-content:center;max-width:150px;margin-left:12px}.preview img{max-width:100%;display:none}.preview img.visible{display:block}.preview .placeholder{color:var(--color-grey-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i1.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i1.ClrLayout, selector: "[clrForm][clrLayout]", inputs: ["clrLayout"] }, { kind: "directive", type: i1.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i1.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "directive", type: i5.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ExternalImageDialogComponent, selector: "vdr-external-image-dialog", ngImport: i0, template: "<div class=\"flex\">\r\n    <form [formGroup]=\"form\" class=\"flex-spacer\" clrForm clrLayout=\"vertical\">\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-src' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"src\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-title' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"title\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-alt' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"alt\" />\r\n        </clr-input-container>\r\n    </form>\r\n    <div class=\"preview\">\r\n        <img\r\n            [src]=\"form.get('src')?.value\"\r\n            [class.visible]=\"previewLoaded\"\r\n            (load)=\"onImageLoad($event)\"\r\n            (error)=\"onImageError($event)\"\r\n        />\r\n        <div class=\"placeholder\" *ngIf=\"!previewLoaded\">\r\n            <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"submit\" (click)=\"select()\" class=\"btn btn-primary\" [disabled]=\"form.invalid || !previewLoaded\">\r\n        <ng-container *ngIf=\"existing; else doesNotExist\">{{ 'common.update' | translate }}</ng-container>\r\n        <ng-template #doesNotExist>{{ 'editor.insert-image' | translate }}</ng-template>\r\n    </button>\r\n</ng-template>\r\n", styles: [".preview{display:flex;align-items:center;justify-content:center;max-width:150px;margin-inline-start:12px}.preview img{max-width:100%;display:none}.preview img.visible{display:block}.preview .placeholder{color:var(--color-grey-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i1.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i1.ClrForm, selector: "[clrForm]", inputs: ["clrLabelSize"] }, { kind: "directive", type: i1.ClrLayout, selector: "[clrForm][clrLayout]", inputs: ["clrLayout"] }, { kind: "directive", type: i1.ClrInput, selector: "[clrInput]" }, { kind: "component", type: i1.ClrInputContainer, selector: "clr-input-container" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "directive", type: i5.DialogButtonsDirective, selector: "[vdrDialogButtons]" }, { kind: "pipe", type: i6.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ExternalImageDialogComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-external-image-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex\">\r\n    <form [formGroup]=\"form\" class=\"flex-spacer\" clrForm clrLayout=\"vertical\">\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-src' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"src\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-title' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"title\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-alt' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"alt\" />\r\n        </clr-input-container>\r\n    </form>\r\n    <div class=\"preview\">\r\n        <img\r\n            [src]=\"form.get('src')?.value\"\r\n            [class.visible]=\"previewLoaded\"\r\n            (load)=\"onImageLoad($event)\"\r\n            (error)=\"onImageError($event)\"\r\n        />\r\n        <div class=\"placeholder\" *ngIf=\"!previewLoaded\">\r\n            <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"submit\" (click)=\"select()\" class=\"btn btn-primary\" [disabled]=\"form.invalid || !previewLoaded\">\r\n        <ng-container *ngIf=\"existing; else doesNotExist\">{{ 'common.update' | translate }}</ng-container>\r\n        <ng-template #doesNotExist>{{ 'editor.insert-image' | translate }}</ng-template>\r\n    </button>\r\n</ng-template>\r\n", styles: [".preview{display:flex;align-items:center;justify-content:center;max-width:150px;margin-left:12px}.preview img{max-width:100%;display:none}.preview img.visible{display:block}.preview .placeholder{color:var(--color-grey-300)}\n"] }]
+            args: [{ selector: 'vdr-external-image-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"flex\">\r\n    <form [formGroup]=\"form\" class=\"flex-spacer\" clrForm clrLayout=\"vertical\">\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-src' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"src\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-title' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"title\" />\r\n        </clr-input-container>\r\n        <clr-input-container class=\"expand\">\r\n            <label>{{ 'editor.image-alt' | translate }}</label>\r\n            <input clrInput type=\"text\" formControlName=\"alt\" />\r\n        </clr-input-container>\r\n    </form>\r\n    <div class=\"preview\">\r\n        <img\r\n            [src]=\"form.get('src')?.value\"\r\n            [class.visible]=\"previewLoaded\"\r\n            (load)=\"onImageLoad($event)\"\r\n            (error)=\"onImageError($event)\"\r\n        />\r\n        <div class=\"placeholder\" *ngIf=\"!previewLoaded\">\r\n            <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"submit\" (click)=\"select()\" class=\"btn btn-primary\" [disabled]=\"form.invalid || !previewLoaded\">\r\n        <ng-container *ngIf=\"existing; else doesNotExist\">{{ 'common.update' | translate }}</ng-container>\r\n        <ng-template #doesNotExist>{{ 'editor.insert-image' | translate }}</ng-template>\r\n    </button>\r\n</ng-template>\r\n", styles: [".preview{display:flex;align-items:center;justify-content:center;max-width:150px;margin-inline-start:12px}.preview img{max-width:100%;display:none}.preview img.visible{display:block}.preview .placeholder{color:var(--color-grey-300)}\n"] }]
         }] });
 //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZXh0ZXJuYWwtaW1hZ2UtZGlhbG9nLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29yZS9zcmMvc2hhcmVkL2NvbXBvbmVudHMvcmljaC10ZXh0LWVkaXRvci9leHRlcm5hbC1pbWFnZS1kaWFsb2cvZXh0ZXJuYWwtaW1hZ2UtZGlhbG9nLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY29yZS9zcmMvc2hhcmVkL2NvbXBvbmVudHMvcmljaC10ZXh0LWVkaXRvci9leHRlcm5hbC1pbWFnZS1kaWFsb2cvZXh0ZXJuYWwtaW1hZ2UtZGlhbG9nLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDM0UsT0FBTyxFQUFFLGtCQUFrQixFQUFFLGdCQUFnQixFQUFFLFVBQVUsRUFBRSxNQUFNLGdCQUFnQixDQUFDOzs7Ozs7OztBQWdCbEYsTUFBTSxPQUFPLDRCQUE0QjtJQU56QztRQVVJLGtCQUFhLEdBQUcsS0FBSyxDQUFDO0tBc0J6QjtJQW5CRyxRQUFRO1FBQ0osSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLGdCQUFnQixDQUFDO1lBQzdCLEdBQUcsRUFBRSxJQUFJLGtCQUFrQixDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLEVBQUUsVUFBVSxDQUFDLFFBQVEsQ0FBQztZQUN4RixLQUFLLEVBQUUsSUFBSSxrQkFBa0IsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDO1lBQ3ZFLEdBQUcsRUFBRSxJQUFJLGtCQUFrQixDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxFQUFFLENBQUM7U0FDdEUsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVELE1BQU07UUFDRixJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDdEMsQ0FBQztJQUVELFdBQVcsQ0FBQyxLQUFZO1FBQ3BCLElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDO0lBQzlCLENBQUM7SUFFRCxZQUFZLENBQUMsS0FBWTtRQUNyQixJQUFJLENBQUMsYUFBYSxHQUFHLEtBQUssQ0FBQztJQUMvQixDQUFDOzhHQXpCUSw0QkFBNEI7a0dBQTVCLDRCQUE0QixpRUNqQnpDLDRsREFrQ0E7OzJGRGpCYSw0QkFBNEI7a0JBTnhDLFNBQVM7K0JBQ0ksMkJBQTJCLG1CQUdwQix1QkFBdUIsQ0FBQyxNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksIENvbXBvbmVudCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFVudHlwZWRGb3JtQ29udHJvbCwgVW50eXBlZEZvcm1Hcm91cCwgVmFsaWRhdG9ycyB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuXHJcbmltcG9ydCB7IERpYWxvZyB9IGZyb20gJy4uLy4uLy4uLy4uL3Byb3ZpZGVycy9tb2RhbC9tb2RhbC50eXBlcyc7XHJcblxyXG5leHBvcnQgaW50ZXJmYWNlIEV4dGVybmFsSW1hZ2VBdHRycyB7XHJcbiAgICBzcmM6IHN0cmluZztcclxuICAgIHRpdGxlOiBzdHJpbmc7XHJcbiAgICBhbHQ6IHN0cmluZztcclxufVxyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Zkci1leHRlcm5hbC1pbWFnZS1kaWFsb2cnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL2V4dGVybmFsLWltYWdlLWRpYWxvZy5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9leHRlcm5hbC1pbWFnZS1kaWFsb2cuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgRXh0ZXJuYWxJbWFnZURpYWxvZ0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCwgRGlhbG9nPEV4dGVybmFsSW1hZ2VBdHRycz4ge1xyXG4gICAgZm9ybTogVW50eXBlZEZvcm1Hcm91cDtcclxuXHJcbiAgICByZXNvbHZlV2l0aDogKHJlc3VsdD86IEV4dGVybmFsSW1hZ2VBdHRycykgPT4gdm9pZDtcclxuICAgIHByZXZpZXdMb2FkZWQgPSBmYWxzZTtcclxuICAgIGV4aXN0aW5nPzogRXh0ZXJuYWxJbWFnZUF0dHJzO1xyXG5cclxuICAgIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgICAgIHRoaXMuZm9ybSA9IG5ldyBVbnR5cGVkRm9ybUdyb3VwKHtcclxuICAgICAgICAgICAgc3JjOiBuZXcgVW50eXBlZEZvcm1Db250cm9sKHRoaXMuZXhpc3RpbmcgPyB0aGlzLmV4aXN0aW5nLnNyYyA6ICcnLCBWYWxpZGF0b3JzLnJlcXVpcmVkKSxcclxuICAgICAgICAgICAgdGl0bGU6IG5ldyBVbnR5cGVkRm9ybUNvbnRyb2wodGhpcy5leGlzdGluZyA/IHRoaXMuZXhpc3RpbmcudGl0bGUgOiAnJyksXHJcbiAgICAgICAgICAgIGFsdDogbmV3IFVudHlwZWRGb3JtQ29udHJvbCh0aGlzLmV4aXN0aW5nID8gdGhpcy5leGlzdGluZy5hbHQgOiAnJyksXHJcbiAgICAgICAgfSk7XHJcbiAgICB9XHJcblxyXG4gICAgc2VsZWN0KCkge1xyXG4gICAgICAgIHRoaXMucmVzb2x2ZVdpdGgodGhpcy5mb3JtLnZhbHVlKTtcclxuICAgIH1cclxuXHJcbiAgICBvbkltYWdlTG9hZChldmVudDogRXZlbnQpIHtcclxuICAgICAgICB0aGlzLnByZXZpZXdMb2FkZWQgPSB0cnVlO1xyXG4gICAgfVxyXG5cclxuICAgIG9uSW1hZ2VFcnJvcihldmVudDogRXZlbnQpIHtcclxuICAgICAgICB0aGlzLnByZXZpZXdMb2FkZWQgPSBmYWxzZTtcclxuICAgIH1cclxufVxyXG4iLCI8ZGl2IGNsYXNzPVwiZmxleFwiPlxyXG4gICAgPGZvcm0gW2Zvcm1Hcm91cF09XCJmb3JtXCIgY2xhc3M9XCJmbGV4LXNwYWNlclwiIGNsckZvcm0gY2xyTGF5b3V0PVwidmVydGljYWxcIj5cclxuICAgICAgICA8Y2xyLWlucHV0LWNvbnRhaW5lciBjbGFzcz1cImV4cGFuZFwiPlxyXG4gICAgICAgICAgICA8bGFiZWw+e3sgJ2VkaXRvci5pbWFnZS1zcmMnIHwgdHJhbnNsYXRlIH19PC9sYWJlbD5cclxuICAgICAgICAgICAgPGlucHV0IGNscklucHV0IHR5cGU9XCJ0ZXh0XCIgZm9ybUNvbnRyb2xOYW1lPVwic3JjXCIgLz5cclxuICAgICAgICA8L2Nsci1pbnB1dC1jb250YWluZXI+XHJcbiAgICAgICAgPGNsci1pbnB1dC1jb250YWluZXIgY2xhc3M9XCJleHBhbmRcIj5cclxuICAgICAgICAgICAgPGxhYmVsPnt7ICdlZGl0b3IuaW1hZ2UtdGl0bGUnIHwgdHJhbnNsYXRlIH19PC9sYWJlbD5cclxuICAgICAgICAgICAgPGlucHV0IGNscklucHV0IHR5cGU9XCJ0ZXh0XCIgZm9ybUNvbnRyb2xOYW1lPVwidGl0bGVcIiAvPlxyXG4gICAgICAgIDwvY2xyLWlucHV0LWNvbnRhaW5lcj5cclxuICAgICAgICA8Y2xyLWlucHV0LWNvbnRhaW5lciBjbGFzcz1cImV4cGFuZFwiPlxyXG4gICAgICAgICAgICA8bGFiZWw+e3sgJ2VkaXRvci5pbWFnZS1hbHQnIHwgdHJhbnNsYXRlIH19PC9sYWJlbD5cclxuICAgICAgICAgICAgPGlucHV0IGNscklucHV0IHR5cGU9XCJ0ZXh0XCIgZm9ybUNvbnRyb2xOYW1lPVwiYWx0XCIgLz5cclxuICAgICAgICA8L2Nsci1pbnB1dC1jb250YWluZXI+XHJcbiAgICA8L2Zvcm0+XHJcbiAgICA8ZGl2IGNsYXNzPVwicHJldmlld1wiPlxyXG4gICAgICAgIDxpbWdcclxuICAgICAgICAgICAgW3NyY109XCJmb3JtLmdldCgnc3JjJyk/LnZhbHVlXCJcclxuICAgICAgICAgICAgW2NsYXNzLnZpc2libGVdPVwicHJldmlld0xvYWRlZFwiXHJcbiAgICAgICAgICAgIChsb2FkKT1cIm9uSW1hZ2VMb2FkKCRldmVudClcIlxyXG4gICAgICAgICAgICAoZXJyb3IpPVwib25JbWFnZUVycm9yKCRldmVudClcIlxyXG4gICAgICAgIC8+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cInBsYWNlaG9sZGVyXCIgKm5nSWY9XCIhcHJldmlld0xvYWRlZFwiPlxyXG4gICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJpbWFnZVwiIHNpemU9XCIxMjhcIj48L2Nsci1pY29uPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbjwvZGl2PlxyXG5cclxuPG5nLXRlbXBsYXRlIHZkckRpYWxvZ0J1dHRvbnM+XHJcbiAgICA8YnV0dG9uIHR5cGU9XCJzdWJtaXRcIiAoY2xpY2spPVwic2VsZWN0KClcIiBjbGFzcz1cImJ0biBidG4tcHJpbWFyeVwiIFtkaXNhYmxlZF09XCJmb3JtLmludmFsaWQgfHwgIXByZXZpZXdMb2FkZWRcIj5cclxuICAgICAgICA8bmctY29udGFpbmVyICpuZ0lmPVwiZXhpc3Rpbmc7IGVsc2UgZG9lc05vdEV4aXN0XCI+e3sgJ2NvbW1vbi51cGRhdGUnIHwgdHJhbnNsYXRlIH19PC9uZy1jb250YWluZXI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlICNkb2VzTm90RXhpc3Q+e3sgJ2VkaXRvci5pbnNlcnQtaW1hZ2UnIHwgdHJhbnNsYXRlIH19PC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvYnV0dG9uPlxyXG48L25nLXRlbXBsYXRlPlxyXG4iXX0=

package/esm2022/core/shared/components/rich-text-editor/prosemirror/context-menu/context-menu.component.mjs

@@ -122,11 +122,11 @@ export class ContextMenuComponent {
         return inverted;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ContextMenuComponent, deps: [{ token: i1.Overlay }, { token: i0.ViewContainerRef }, { token: i2.ContextMenuService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ContextMenuComponent, selector: "vdr-context-menu", inputs: { editorMenuElement: "editorMenuElement" }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["contextMenu"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #contextMenu>\r\n    <vdr-dropdown>\r\n        <button class=\"context-menu-trigger\" vdrDropdownTrigger [class.hidden]=\"hideTrigger$ | async\" (click)=\"triggerClick()\">\r\n            <clr-icon\r\n                *ngIf=\"menuConfig?.iconShape as shape\"\r\n                [attr.shape]=\"shape\"\r\n                size=\"16\"\r\n                class=\"mr2\"\r\n            ></clr-icon>\r\n            <span class=\"title-label\">{{ menuConfig?.title }}</span>\r\n        </button>\r\n        <vdr-dropdown-menu vdrPosition=\"bottom-right\" customClasses=\"context-menu\">\r\n            <ng-container *ngFor=\"let item of menuConfig?.items\">\r\n                <button\r\n                    class=\"context-menu-item\"\r\n                    *ngIf=\"item.enabled && item.separator !== true\"\r\n                    type=\"button\"\r\n                    (click)=\"clickItem(item)\"\r\n                >\r\n                    <div *ngIf=\"item.iconClass\" class=\"cm-icon\" [ngClass]=\"item.iconClass\"></div>\r\n                    <clr-icon\r\n                        *ngIf=\"item.iconShape as shape\"\r\n                        [attr.shape]=\"shape\"\r\n                        size=\"16\"\r\n                        class=\"mr2\"\r\n                    ></clr-icon>\r\n                    {{ item.label }}\r\n                </button>\r\n                <div *ngIf=\"item.enabled && item.separator\" class=\"dropdown-divider\" role=\"separator\"></div>\r\n            </ng-container>\r\n        </vdr-dropdown-menu>\r\n    </vdr-dropdown>\r\n</ng-template>\r\n", styles: [".context-menu-trigger{margin:0;display:flex;align-items:center;border:1px solid var(--color-component-border-200);font-size:90%;color:var(--color-text-200);border-radius:var(--border-radius-input);background-color:var(--color-component-bg-100)}.title-label{padding-right:15px;position:relative}.title-label:after{content:\"\";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.context-menu-item{display:flex;align-items:center;width:100%;text-align:start;font-size:90%;color:var(--color-text-200);background-color:var(--color-component-bg-100);cursor:pointer;border:none}.context-menu-item:hover{background-color:var(--color-component-bg-200)}::ng-deep .dropdown-menu.context-menu{padding:0;background-color:var(--color-component-bg-100)}::ng-deep .context-menu-trigger{min-height:16px}::ng-deep .context-menu-trigger.hidden{visibility:hidden}::ng-deep .cm-icon.add-column{height:14px;width:4px;border:1px solid;margin:0 6px 0 8px;position:relative}::ng-deep .cm-icon.add-column:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-10px}::ng-deep .cm-icon.add-row{height:4px;width:14px;border:1px solid;margin:6px 4px 2px 0;position:relative}::ng-deep .cm-icon.add-row:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-2px;top:-10px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i6.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i7.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: ContextMenuComponent, selector: "vdr-context-menu", inputs: { editorMenuElement: "editorMenuElement" }, viewQueries: [{ propertyName: "menuTemplate", first: true, predicate: ["contextMenu"], descendants: true, static: true }], ngImport: i0, template: "<ng-template #contextMenu>\r\n    <vdr-dropdown>\r\n        <button class=\"context-menu-trigger\" vdrDropdownTrigger [class.hidden]=\"hideTrigger$ | async\" (click)=\"triggerClick()\">\r\n            <clr-icon\r\n                *ngIf=\"menuConfig?.iconShape as shape\"\r\n                [attr.shape]=\"shape\"\r\n                size=\"16\"\r\n                class=\"mr2\"\r\n            ></clr-icon>\r\n            <span class=\"title-label\">{{ menuConfig?.title }}</span>\r\n        </button>\r\n        <vdr-dropdown-menu vdrPosition=\"bottom-right\" customClasses=\"context-menu\">\r\n            <ng-container *ngFor=\"let item of menuConfig?.items\">\r\n                <button\r\n                    class=\"context-menu-item\"\r\n                    *ngIf=\"item.enabled && item.separator !== true\"\r\n                    type=\"button\"\r\n                    (click)=\"clickItem(item)\"\r\n                >\r\n                    <div *ngIf=\"item.iconClass\" class=\"cm-icon\" [ngClass]=\"item.iconClass\"></div>\r\n                    <clr-icon\r\n                        *ngIf=\"item.iconShape as shape\"\r\n                        [attr.shape]=\"shape\"\r\n                        size=\"16\"\r\n                        class=\"mr2\"\r\n                    ></clr-icon>\r\n                    {{ item.label }}\r\n                </button>\r\n                <div *ngIf=\"item.enabled && item.separator\" class=\"dropdown-divider\" role=\"separator\"></div>\r\n            </ng-container>\r\n        </vdr-dropdown-menu>\r\n    </vdr-dropdown>\r\n</ng-template>\r\n", styles: [".context-menu-trigger{margin:0;display:flex;align-items:center;border:1px solid var(--color-component-border-200);font-size:90%;color:var(--color-text-200);border-radius:var(--border-radius-input);background-color:var(--color-component-bg-100)}.title-label{padding-inline-end:15px;position:relative}.title-label:after{content:\"\";border-inline-start:4px solid transparent;border-inline-end:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.context-menu-item{display:flex;align-items:center;width:100%;text-align:start;font-size:90%;color:var(--color-text-200);background-color:var(--color-component-bg-100);cursor:pointer;border:none}.context-menu-item:hover{background-color:var(--color-component-bg-200)}::ng-deep .dropdown-menu.context-menu{padding:0;background-color:var(--color-component-bg-100)}::ng-deep .context-menu-trigger{min-height:16px}::ng-deep .context-menu-trigger.hidden{visibility:hidden}::ng-deep .cm-icon.add-column{height:14px;width:4px;border:1px solid;margin:0 6px 0 8px;position:relative}::ng-deep .cm-icon.add-column:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-10px}::ng-deep .cm-icon.add-row{height:4px;width:14px;border:1px solid;margin:6px 4px 2px 0;position:relative}::ng-deep .cm-icon.add-row:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-2px;top:-10px}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i6.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i7.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: ContextMenuComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-context-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #contextMenu>\r\n    <vdr-dropdown>\r\n        <button class=\"context-menu-trigger\" vdrDropdownTrigger [class.hidden]=\"hideTrigger$ | async\" (click)=\"triggerClick()\">\r\n            <clr-icon\r\n                *ngIf=\"menuConfig?.iconShape as shape\"\r\n                [attr.shape]=\"shape\"\r\n                size=\"16\"\r\n                class=\"mr2\"\r\n            ></clr-icon>\r\n            <span class=\"title-label\">{{ menuConfig?.title }}</span>\r\n        </button>\r\n        <vdr-dropdown-menu vdrPosition=\"bottom-right\" customClasses=\"context-menu\">\r\n            <ng-container *ngFor=\"let item of menuConfig?.items\">\r\n                <button\r\n                    class=\"context-menu-item\"\r\n                    *ngIf=\"item.enabled && item.separator !== true\"\r\n                    type=\"button\"\r\n                    (click)=\"clickItem(item)\"\r\n                >\r\n                    <div *ngIf=\"item.iconClass\" class=\"cm-icon\" [ngClass]=\"item.iconClass\"></div>\r\n                    <clr-icon\r\n                        *ngIf=\"item.iconShape as shape\"\r\n                        [attr.shape]=\"shape\"\r\n                        size=\"16\"\r\n                        class=\"mr2\"\r\n                    ></clr-icon>\r\n                    {{ item.label }}\r\n                </button>\r\n                <div *ngIf=\"item.enabled && item.separator\" class=\"dropdown-divider\" role=\"separator\"></div>\r\n            </ng-container>\r\n        </vdr-dropdown-menu>\r\n    </vdr-dropdown>\r\n</ng-template>\r\n", styles: [".context-menu-trigger{margin:0;display:flex;align-items:center;border:1px solid var(--color-component-border-200);font-size:90%;color:var(--color-text-200);border-radius:var(--border-radius-input);background-color:var(--color-component-bg-100)}.title-label{padding-right:15px;position:relative}.title-label:after{content:\"\";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.context-menu-item{display:flex;align-items:center;width:100%;text-align:start;font-size:90%;color:var(--color-text-200);background-color:var(--color-component-bg-100);cursor:pointer;border:none}.context-menu-item:hover{background-color:var(--color-component-bg-200)}::ng-deep .dropdown-menu.context-menu{padding:0;background-color:var(--color-component-bg-100)}::ng-deep .context-menu-trigger{min-height:16px}::ng-deep .context-menu-trigger.hidden{visibility:hidden}::ng-deep .cm-icon.add-column{height:14px;width:4px;border:1px solid;margin:0 6px 0 8px;position:relative}::ng-deep .cm-icon.add-column:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-10px}::ng-deep .cm-icon.add-row{height:4px;width:14px;border:1px solid;margin:6px 4px 2px 0;position:relative}::ng-deep .cm-icon.add-row:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-2px;top:-10px}\n"] }]
+            args: [{ selector: 'vdr-context-menu', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template #contextMenu>\r\n    <vdr-dropdown>\r\n        <button class=\"context-menu-trigger\" vdrDropdownTrigger [class.hidden]=\"hideTrigger$ | async\" (click)=\"triggerClick()\">\r\n            <clr-icon\r\n                *ngIf=\"menuConfig?.iconShape as shape\"\r\n                [attr.shape]=\"shape\"\r\n                size=\"16\"\r\n                class=\"mr2\"\r\n            ></clr-icon>\r\n            <span class=\"title-label\">{{ menuConfig?.title }}</span>\r\n        </button>\r\n        <vdr-dropdown-menu vdrPosition=\"bottom-right\" customClasses=\"context-menu\">\r\n            <ng-container *ngFor=\"let item of menuConfig?.items\">\r\n                <button\r\n                    class=\"context-menu-item\"\r\n                    *ngIf=\"item.enabled && item.separator !== true\"\r\n                    type=\"button\"\r\n                    (click)=\"clickItem(item)\"\r\n                >\r\n                    <div *ngIf=\"item.iconClass\" class=\"cm-icon\" [ngClass]=\"item.iconClass\"></div>\r\n                    <clr-icon\r\n                        *ngIf=\"item.iconShape as shape\"\r\n                        [attr.shape]=\"shape\"\r\n                        size=\"16\"\r\n                        class=\"mr2\"\r\n                    ></clr-icon>\r\n                    {{ item.label }}\r\n                </button>\r\n                <div *ngIf=\"item.enabled && item.separator\" class=\"dropdown-divider\" role=\"separator\"></div>\r\n            </ng-container>\r\n        </vdr-dropdown-menu>\r\n    </vdr-dropdown>\r\n</ng-template>\r\n", styles: [".context-menu-trigger{margin:0;display:flex;align-items:center;border:1px solid var(--color-component-border-200);font-size:90%;color:var(--color-text-200);border-radius:var(--border-radius-input);background-color:var(--color-component-bg-100)}.title-label{padding-inline-end:15px;position:relative}.title-label:after{content:\"\";border-inline-start:4px solid transparent;border-inline-end:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}.context-menu-item{display:flex;align-items:center;width:100%;text-align:start;font-size:90%;color:var(--color-text-200);background-color:var(--color-component-bg-100);cursor:pointer;border:none}.context-menu-item:hover{background-color:var(--color-component-bg-200)}::ng-deep .dropdown-menu.context-menu{padding:0;background-color:var(--color-component-bg-100)}::ng-deep .context-menu-trigger{min-height:16px}::ng-deep .context-menu-trigger.hidden{visibility:hidden}::ng-deep .cm-icon.add-column{height:14px;width:4px;border:1px solid;margin:0 6px 0 8px;position:relative}::ng-deep .cm-icon.add-column:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-10px}::ng-deep .cm-icon.add-row{height:4px;width:14px;border:1px solid;margin:6px 4px 2px 0;position:relative}::ng-deep .cm-icon.add-row:before{content:\"+\";position:absolute;font-size:16px;line-height:14px;left:-2px;top:-10px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ViewContainerRef }, { type: i2.ContextMenuService }]; }, propDecorators: { editorMenuElement: [{
                 type: Input
             }], menuTemplate: [{

package/esm2022/core/shared/components/rich-text-editor/rich-text-editor.component.mjs

@@ -79,7 +79,7 @@ export class RichTextEditorComponent {
             },
             ProsemirrorService,
             ContextMenuService,
-        ], viewQueries: [{ propertyName: "editorEl", first: true, predicate: ["editor"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"label\" class=\"rich-text-label\">{{ label }}</label>\r\n<div #editor></div>\r\n<vdr-context-menu [editorMenuElement]=\"menuElement\"></vdr-context-menu>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid var(--color-primary-500)}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid var(--color-primary-500);pointer-events:none}::ng-deep .ProseMirror-textblock-dropdown{min-width:3em}::ng-deep .ProseMirror-menu{margin:0 -4px;line-height:1}::ng-deep .ProseMirror-tooltip .ProseMirror-menu{width:-moz-fit-content;width:fit-content;white-space:pre}::ng-deep .ProseMirror-menuitem{margin-right:3px;display:inline-block}::ng-deep .ProseMirror-menuseparator{border-right:1px solid var(--color-component-border-200);margin:0 12px 0 8px;height:18px}::ng-deep .ProseMirror-menu-dropdown,::ng-deep .ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap;border-radius:var(--border-radius-input)}::ng-deep .ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-right:15px}::ng-deep .ProseMirror-menu-dropdown-wrap{padding:1px 3px 1px 6px;display:inline-block;position:relative}::ng-deep .ProseMirror-menu-dropdown:after{content:\"\";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}::ng-deep .ProseMirror-menu-dropdown-menu,::ng-deep .ProseMirror-menu-submenu{position:absolute;background:var(--color-component-bg-100);border:1px solid var(--color-component-border-200);padding:2px}::ng-deep .ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em;color:var(--color-text-200)}::ng-deep .ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}::ng-deep .ProseMirror-menu-dropdown-item:hover{background:var(--color-component-bg-200)}::ng-deep .ProseMirror-menu-submenu-wrap{position:relative;margin-right:4px}::ng-deep .ProseMirror-menu-submenu-label:after{content:\"\";border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid currentColor;opacity:.6;position:absolute;right:-8px;top:calc(50% - 4px)}::ng-deep .ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}::ng-deep .ProseMirror-menu-active{background:var(--color-component-bg-100);border-radius:4px}::ng-deep .ProseMirror-menu-disabled{opacity:.3}::ng-deep .ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,::ng-deep .ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}::ng-deep .ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:var(--color-grey-600);padding:1px 6px;top:0;left:0;right:0;background:var(--color-component-bg-100);z-index:10;box-sizing:border-box;overflow:visible;align-items:center}::ng-deep .ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}::ng-deep .ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}::ng-deep .ProseMirror-icon svg{fill:currentColor;height:1em}::ng-deep .ProseMirror-icon span{vertical-align:text-top}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px;list-style-position:initial}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid var(--color-grey-100);margin-left:0;margin-right:0}::ng-deep .ProseMirror-prompt{background:white;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}::ng-deep .ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:var(--color-grey-500)}::ng-deep .ProseMirror-prompt input[type=text],::ng-deep .ProseMirror-prompt textarea{background:var(--color-component-bg-100);border:none;outline:none}::ng-deep .ProseMirror-prompt input[type=text]{padding:0 4px}::ng-deep .ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:var(--color-grey-400);border:none;background:transparent;padding:0}::ng-deep .ProseMirror-prompt-close:after{content:\"\\e2\\153\\2022\";font-size:12px}::ng-deep .ProseMirror-invalid{background:var(--color-warning-200);border:1px solid var(--color-warning-300);border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}::ng-deep .ProseMirror-prompt-buttons{margin-top:5px;display:none}::ng-deep #editor,::ng-deep .editor{background:var(--color-form-input-bg);color:#000;background-clip:padding-box;border-radius:4px;border:2px solid rgba(0,0,0,.2);padding:5px 0;margin-bottom:23px}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:.5rem;color:var(--color-text-100)!important}::ng-deep .ProseMirror .tableWrapper td,::ng-deep .ProseMirror .tableWrapper th{border:1px solid var(--color-grey-300);padding:3px 6px}::ng-deep .ProseMirror .tableWrapper td p,::ng-deep .ProseMirror .tableWrapper th p{margin-top:0}::ng-deep .ProseMirror .tableWrapper th,::ng-deep .ProseMirror .tableWrapper th p{font-weight:700}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:ew-resize;cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:rgba(175,218,243,.3333333333);pointer-events:none}::ng-deep .menu-separator{border-bottom:1px solid var(--color-grey-400);height:0;margin:6px 0;pointer-events:none}::ng-deep .menu-item-with-icon{display:flex;align-items:center}::ng-deep .menu-item-with-icon clr-icon,::ng-deep .menu-item-with-icon .custom-icon{margin-right:4px;color:var(--color-text-200)}::ng-deep .menu-item-with-icon .hr-icon{width:13px;height:8px;border-bottom:2px solid var(--color-text-100);margin:-8px 5px 0 2px}::ng-deep .menu-item-with-icon .h-icon{width:16px;text-align:center;font-weight:700;font-size:12px}.context-menu{position:fixed}:host{display:block;margin-bottom:.5rem}:host.readonly ::ng-deep .ProseMirror-menubar{display:none}label.rich-text-label{font-size:var(--font-size-sm);color:var(--font-weight-700)}::ng-deep .ProseMirror-menubar{position:sticky;border:1px solid var(--color-component-border-200);border-bottom:none;background-color:var(--color-component-bg-200);color:var(--color-icon-button);border-radius:var(--border-radius-input) var(--border-radius-input) 0 0;padding:6px 12px;display:flex;flex-wrap:wrap}::ng-deep .vdr-prosemirror{background:var(--color-form-input-bg);color:var(--color-text-100);min-height:128px;max-height:600px;min-width:200px;border:1px solid var(--color-component-border-200);border-radius:0 0 var(--border-radius-input) var(--border-radius-input);transition:border-color .2s;overflow:auto;text-align:initial}::ng-deep .vdr-prosemirror:focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}::ng-deep .vdr-prosemirror hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .vdr-prosemirror hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .vdr-prosemirror img{cursor:default;max-width:100%}::ng-deep .vdr-prosemirror a:link,::ng-deep .vdr-prosemirror a:visited{color:var(--color-primary-700);text-decoration:none}::ng-deep .vdr-prosemirror .iframe-wrapper{width:100%;text-align:center;padding:6px;transition:background-color .3s}::ng-deep .vdr-prosemirror .iframe-wrapper:hover{background-color:var(--color-primary-100)}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.ContextMenuComponent, selector: "vdr-context-menu", inputs: ["editorMenuElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+        ], viewQueries: [{ propertyName: "editorEl", first: true, predicate: ["editor"], descendants: true, static: true }], ngImport: i0, template: "<label *ngIf=\"label\" class=\"rich-text-label\">{{ label }}</label>\r\n<div #editor></div>\r\n<vdr-context-menu [editorMenuElement]=\"menuElement\"></vdr-context-menu>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid var(--color-primary-500)}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid var(--color-primary-500);pointer-events:none}::ng-deep .ProseMirror-textblock-dropdown{min-width:3em}::ng-deep .ProseMirror-menu{margin:0 -4px;line-height:1}::ng-deep .ProseMirror-tooltip .ProseMirror-menu{width:-moz-fit-content;width:fit-content;white-space:pre}::ng-deep .ProseMirror-menuitem{margin-inline-end:3px;display:inline-block}::ng-deep .ProseMirror-menuseparator{border-inline-end:1px solid var(--color-component-border-200);margin:0 12px 0 8px;height:18px}::ng-deep .ProseMirror-menu-dropdown,::ng-deep .ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap;border-radius:var(--border-radius-input)}::ng-deep .ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-inline-end:15px}::ng-deep .ProseMirror-menu-dropdown-wrap{padding:1px 3px 1px 6px;display:inline-block;position:relative}::ng-deep .ProseMirror-menu-dropdown:after{content:\"\";border-inline-start:4px solid transparent;border-inline-end:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}::ng-deep .ProseMirror-menu-dropdown-menu,::ng-deep .ProseMirror-menu-submenu{position:absolute;background:var(--color-component-bg-100);border:1px solid var(--color-component-border-200);padding:2px}::ng-deep .ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em;color:var(--color-text-200)}::ng-deep .ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}::ng-deep .ProseMirror-menu-dropdown-item:hover{background:var(--color-component-bg-200)}::ng-deep .ProseMirror-menu-submenu-wrap{position:relative;margin-inline-end:4px}::ng-deep .ProseMirror-menu-submenu-label:after{content:\"\";border-top:4px solid transparent;border-bottom:4px solid transparent;border-inline-start:4px solid currentColor;opacity:.6;position:absolute;right:-8px;top:calc(50% - 4px)}::ng-deep .ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}::ng-deep .ProseMirror-menu-active{background:var(--color-component-bg-100);border-radius:4px}::ng-deep .ProseMirror-menu-disabled{opacity:.3}::ng-deep .ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,::ng-deep .ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}::ng-deep .ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:var(--color-grey-600);padding:1px 6px;top:0;left:0;right:0;background:var(--color-component-bg-100);z-index:10;box-sizing:border-box;overflow:visible;align-items:center}::ng-deep .ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}::ng-deep .ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}::ng-deep .ProseMirror-icon svg{fill:currentColor;height:1em}::ng-deep .ProseMirror-icon span{vertical-align:text-top}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-inline-start:30px;list-style-position:initial}::ng-deep .ProseMirror blockquote{padding-inline-start:1em;border-inline-start:3px solid var(--color-grey-100);margin-inline-start:0;margin-inline-end:0}::ng-deep .ProseMirror-prompt{background:white;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}::ng-deep .ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:var(--color-grey-500)}::ng-deep .ProseMirror-prompt input[type=text],::ng-deep .ProseMirror-prompt textarea{background:var(--color-component-bg-100);border:none;outline:none}::ng-deep .ProseMirror-prompt input[type=text]{padding:0 4px}::ng-deep .ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:var(--color-grey-400);border:none;background:transparent;padding:0}::ng-deep .ProseMirror-prompt-close:after{content:\"\\e2\\153\\2022\";font-size:12px}::ng-deep .ProseMirror-invalid{background:var(--color-warning-200);border:1px solid var(--color-warning-300);border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}::ng-deep .ProseMirror-prompt-buttons{margin-top:5px;display:none}::ng-deep #editor,::ng-deep .editor{background:var(--color-form-input-bg);color:#000;background-clip:padding-box;border-radius:4px;border:2px solid rgba(0,0,0,.2);padding:5px 0;margin-bottom:23px}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:.5rem;color:var(--color-text-100)!important}::ng-deep .ProseMirror .tableWrapper td,::ng-deep .ProseMirror .tableWrapper th{border:1px solid var(--color-grey-300);padding:3px 6px}::ng-deep .ProseMirror .tableWrapper td p,::ng-deep .ProseMirror .tableWrapper th p{margin-top:0}::ng-deep .ProseMirror .tableWrapper th,::ng-deep .ProseMirror .tableWrapper th p{font-weight:700}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:ew-resize;cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:rgba(175,218,243,.3333333333);pointer-events:none}::ng-deep .menu-separator{border-bottom:1px solid var(--color-grey-400);height:0;margin:6px 0;pointer-events:none}::ng-deep .menu-item-with-icon{display:flex;align-items:center}::ng-deep .menu-item-with-icon clr-icon,::ng-deep .menu-item-with-icon .custom-icon{margin-inline-end:4px;color:var(--color-text-200)}::ng-deep .menu-item-with-icon .hr-icon{width:13px;height:8px;border-bottom:2px solid var(--color-text-100);margin:-8px 5px 0 2px}::ng-deep .menu-item-with-icon .h-icon{width:16px;text-align:center;font-weight:700;font-size:12px}.context-menu{position:fixed}:host{display:block;margin-bottom:.5rem}:host.readonly ::ng-deep .ProseMirror-menubar{display:none}label.rich-text-label{font-size:var(--font-size-sm);color:var(--font-weight-700)}::ng-deep .ProseMirror-menubar{position:sticky;border:1px solid var(--color-component-border-200);border-bottom:none;background-color:var(--color-component-bg-200);color:var(--color-icon-button);border-radius:var(--border-radius-input) var(--border-radius-input) 0 0;padding:6px 12px;display:flex;flex-wrap:wrap}::ng-deep .vdr-prosemirror{background:var(--color-form-input-bg);color:var(--color-text-100);min-height:128px;max-height:600px;min-width:200px;border:1px solid var(--color-component-border-200);border-radius:0 0 var(--border-radius-input) var(--border-radius-input);transition:border-color .2s;overflow:auto;text-align:initial}::ng-deep .vdr-prosemirror:focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}::ng-deep .vdr-prosemirror hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .vdr-prosemirror hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .vdr-prosemirror img{cursor:default;max-width:100%}::ng-deep .vdr-prosemirror a:link,::ng-deep .vdr-prosemirror a:visited{color:var(--color-primary-700);text-decoration:none}::ng-deep .vdr-prosemirror .iframe-wrapper{width:100%;text-align:center;padding:6px;transition:background-color .3s}::ng-deep .vdr-prosemirror .iframe-wrapper:hover{background-color:var(--color-primary-100)}\n"], dependencies: [{ kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.ContextMenuComponent, selector: "vdr-context-menu", inputs: ["editorMenuElement"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: RichTextEditorComponent, decorators: [{
             type: Component,
@@ -91,7 +91,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImpor
                         },
                         ProsemirrorService,
                         ContextMenuService,
-                    ], template: "<label *ngIf=\"label\" class=\"rich-text-label\">{{ label }}</label>\r\n<div #editor></div>\r\n<vdr-context-menu [editorMenuElement]=\"menuElement\"></vdr-context-menu>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid var(--color-primary-500)}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid var(--color-primary-500);pointer-events:none}::ng-deep .ProseMirror-textblock-dropdown{min-width:3em}::ng-deep .ProseMirror-menu{margin:0 -4px;line-height:1}::ng-deep .ProseMirror-tooltip .ProseMirror-menu{width:-moz-fit-content;width:fit-content;white-space:pre}::ng-deep .ProseMirror-menuitem{margin-right:3px;display:inline-block}::ng-deep .ProseMirror-menuseparator{border-right:1px solid var(--color-component-border-200);margin:0 12px 0 8px;height:18px}::ng-deep .ProseMirror-menu-dropdown,::ng-deep .ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap;border-radius:var(--border-radius-input)}::ng-deep .ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-right:15px}::ng-deep .ProseMirror-menu-dropdown-wrap{padding:1px 3px 1px 6px;display:inline-block;position:relative}::ng-deep .ProseMirror-menu-dropdown:after{content:\"\";border-left:4px solid transparent;border-right:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}::ng-deep .ProseMirror-menu-dropdown-menu,::ng-deep .ProseMirror-menu-submenu{position:absolute;background:var(--color-component-bg-100);border:1px solid var(--color-component-border-200);padding:2px}::ng-deep .ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em;color:var(--color-text-200)}::ng-deep .ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}::ng-deep .ProseMirror-menu-dropdown-item:hover{background:var(--color-component-bg-200)}::ng-deep .ProseMirror-menu-submenu-wrap{position:relative;margin-right:4px}::ng-deep .ProseMirror-menu-submenu-label:after{content:\"\";border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:4px solid currentColor;opacity:.6;position:absolute;right:-8px;top:calc(50% - 4px)}::ng-deep .ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}::ng-deep .ProseMirror-menu-active{background:var(--color-component-bg-100);border-radius:4px}::ng-deep .ProseMirror-menu-disabled{opacity:.3}::ng-deep .ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,::ng-deep .ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}::ng-deep .ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:var(--color-grey-600);padding:1px 6px;top:0;left:0;right:0;background:var(--color-component-bg-100);z-index:10;box-sizing:border-box;overflow:visible;align-items:center}::ng-deep .ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}::ng-deep .ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}::ng-deep .ProseMirror-icon svg{fill:currentColor;height:1em}::ng-deep .ProseMirror-icon span{vertical-align:text-top}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-left:30px;list-style-position:initial}::ng-deep .ProseMirror blockquote{padding-left:1em;border-left:3px solid var(--color-grey-100);margin-left:0;margin-right:0}::ng-deep .ProseMirror-prompt{background:white;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}::ng-deep .ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:var(--color-grey-500)}::ng-deep .ProseMirror-prompt input[type=text],::ng-deep .ProseMirror-prompt textarea{background:var(--color-component-bg-100);border:none;outline:none}::ng-deep .ProseMirror-prompt input[type=text]{padding:0 4px}::ng-deep .ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:var(--color-grey-400);border:none;background:transparent;padding:0}::ng-deep .ProseMirror-prompt-close:after{content:\"\\e2\\153\\2022\";font-size:12px}::ng-deep .ProseMirror-invalid{background:var(--color-warning-200);border:1px solid var(--color-warning-300);border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}::ng-deep .ProseMirror-prompt-buttons{margin-top:5px;display:none}::ng-deep #editor,::ng-deep .editor{background:var(--color-form-input-bg);color:#000;background-clip:padding-box;border-radius:4px;border:2px solid rgba(0,0,0,.2);padding:5px 0;margin-bottom:23px}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:.5rem;color:var(--color-text-100)!important}::ng-deep .ProseMirror .tableWrapper td,::ng-deep .ProseMirror .tableWrapper th{border:1px solid var(--color-grey-300);padding:3px 6px}::ng-deep .ProseMirror .tableWrapper td p,::ng-deep .ProseMirror .tableWrapper th p{margin-top:0}::ng-deep .ProseMirror .tableWrapper th,::ng-deep .ProseMirror .tableWrapper th p{font-weight:700}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:ew-resize;cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:rgba(175,218,243,.3333333333);pointer-events:none}::ng-deep .menu-separator{border-bottom:1px solid var(--color-grey-400);height:0;margin:6px 0;pointer-events:none}::ng-deep .menu-item-with-icon{display:flex;align-items:center}::ng-deep .menu-item-with-icon clr-icon,::ng-deep .menu-item-with-icon .custom-icon{margin-right:4px;color:var(--color-text-200)}::ng-deep .menu-item-with-icon .hr-icon{width:13px;height:8px;border-bottom:2px solid var(--color-text-100);margin:-8px 5px 0 2px}::ng-deep .menu-item-with-icon .h-icon{width:16px;text-align:center;font-weight:700;font-size:12px}.context-menu{position:fixed}:host{display:block;margin-bottom:.5rem}:host.readonly ::ng-deep .ProseMirror-menubar{display:none}label.rich-text-label{font-size:var(--font-size-sm);color:var(--font-weight-700)}::ng-deep .ProseMirror-menubar{position:sticky;border:1px solid var(--color-component-border-200);border-bottom:none;background-color:var(--color-component-bg-200);color:var(--color-icon-button);border-radius:var(--border-radius-input) var(--border-radius-input) 0 0;padding:6px 12px;display:flex;flex-wrap:wrap}::ng-deep .vdr-prosemirror{background:var(--color-form-input-bg);color:var(--color-text-100);min-height:128px;max-height:600px;min-width:200px;border:1px solid var(--color-component-border-200);border-radius:0 0 var(--border-radius-input) var(--border-radius-input);transition:border-color .2s;overflow:auto;text-align:initial}::ng-deep .vdr-prosemirror:focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}::ng-deep .vdr-prosemirror hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .vdr-prosemirror hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .vdr-prosemirror img{cursor:default;max-width:100%}::ng-deep .vdr-prosemirror a:link,::ng-deep .vdr-prosemirror a:visited{color:var(--color-primary-700);text-decoration:none}::ng-deep .vdr-prosemirror .iframe-wrapper{width:100%;text-align:center;padding:6px;transition:background-color .3s}::ng-deep .vdr-prosemirror .iframe-wrapper:hover{background-color:var(--color-primary-100)}\n"] }]
+                    ], template: "<label *ngIf=\"label\" class=\"rich-text-label\">{{ label }}</label>\r\n<div #editor></div>\r\n<vdr-context-menu [editorMenuElement]=\"menuElement\"></vdr-context-menu>\r\n", styles: ["@charset \"UTF-8\";::ng-deep .ProseMirror{position:relative}::ng-deep .ProseMirror{word-wrap:break-word;white-space:pre-wrap;font-variant-ligatures:none}::ng-deep .ProseMirror pre{white-space:pre-wrap}::ng-deep .ProseMirror li{position:relative}::ng-deep .ProseMirror-hideselection *::selection{background:transparent}::ng-deep .ProseMirror-hideselection *::-moz-selection{background:transparent}::ng-deep .ProseMirror-hideselection{caret-color:transparent}::ng-deep .ProseMirror-selectednode{outline:2px solid var(--color-primary-500)}::ng-deep li.ProseMirror-selectednode{outline:none}::ng-deep li.ProseMirror-selectednode:after{content:\"\";position:absolute;inset:-2px -2px -2px -32px;border:2px solid var(--color-primary-500);pointer-events:none}::ng-deep .ProseMirror-textblock-dropdown{min-width:3em}::ng-deep .ProseMirror-menu{margin:0 -4px;line-height:1}::ng-deep .ProseMirror-tooltip .ProseMirror-menu{width:-moz-fit-content;width:fit-content;white-space:pre}::ng-deep .ProseMirror-menuitem{margin-inline-end:3px;display:inline-block}::ng-deep .ProseMirror-menuseparator{border-inline-end:1px solid var(--color-component-border-200);margin:0 12px 0 8px;height:18px}::ng-deep .ProseMirror-menu-dropdown,::ng-deep .ProseMirror-menu-dropdown-menu{font-size:90%;white-space:nowrap;border-radius:var(--border-radius-input)}::ng-deep .ProseMirror-menu-dropdown{vertical-align:1px;cursor:pointer;position:relative;padding-inline-end:15px}::ng-deep .ProseMirror-menu-dropdown-wrap{padding:1px 3px 1px 6px;display:inline-block;position:relative}::ng-deep .ProseMirror-menu-dropdown:after{content:\"\";border-inline-start:4px solid transparent;border-inline-end:4px solid transparent;border-top:4px solid currentColor;opacity:.6;position:absolute;right:4px;top:calc(50% - 2px)}::ng-deep .ProseMirror-menu-dropdown-menu,::ng-deep .ProseMirror-menu-submenu{position:absolute;background:var(--color-component-bg-100);border:1px solid var(--color-component-border-200);padding:2px}::ng-deep .ProseMirror-menu-dropdown-menu{z-index:15;min-width:6em;color:var(--color-text-200)}::ng-deep .ProseMirror-menu-dropdown-item{cursor:pointer;padding:2px 8px 2px 4px}::ng-deep .ProseMirror-menu-dropdown-item:hover{background:var(--color-component-bg-200)}::ng-deep .ProseMirror-menu-submenu-wrap{position:relative;margin-inline-end:4px}::ng-deep .ProseMirror-menu-submenu-label:after{content:\"\";border-top:4px solid transparent;border-bottom:4px solid transparent;border-inline-start:4px solid currentColor;opacity:.6;position:absolute;right:-8px;top:calc(50% - 4px)}::ng-deep .ProseMirror-menu-submenu{display:none;min-width:4em;left:100%;top:-3px}::ng-deep .ProseMirror-menu-active{background:var(--color-component-bg-100);border-radius:4px}::ng-deep .ProseMirror-menu-disabled{opacity:.3}::ng-deep .ProseMirror-menu-submenu-wrap:hover .ProseMirror-menu-submenu,::ng-deep .ProseMirror-menu-submenu-wrap-active .ProseMirror-menu-submenu{display:block}::ng-deep .ProseMirror-menubar{border-top-left-radius:inherit;border-top-right-radius:inherit;position:relative;min-height:1em;color:var(--color-grey-600);padding:1px 6px;top:0;left:0;right:0;background:var(--color-component-bg-100);z-index:10;box-sizing:border-box;overflow:visible;align-items:center}::ng-deep .ProseMirror-icon{display:inline-block;line-height:.8;vertical-align:-2px;padding:2px 8px;cursor:pointer}::ng-deep .ProseMirror-menu-disabled.ProseMirror-icon{cursor:default}::ng-deep .ProseMirror-icon svg{fill:currentColor;height:1em}::ng-deep .ProseMirror-icon span{vertical-align:text-top}::ng-deep .ProseMirror-gapcursor{display:none;pointer-events:none;position:absolute}::ng-deep .ProseMirror-gapcursor:after{content:\"\";display:block;position:absolute;top:-2px;width:20px;border-top:1px solid black;animation:ProseMirror-cursor-blink 1.1s steps(2,start) infinite}@keyframes ProseMirror-cursor-blink{to{visibility:hidden}}::ng-deep .ProseMirror-focused .ProseMirror-gapcursor{display:block}::ng-deep .ProseMirror ul,::ng-deep .ProseMirror ol{padding-inline-start:30px;list-style-position:initial}::ng-deep .ProseMirror blockquote{padding-inline-start:1em;border-inline-start:3px solid var(--color-grey-100);margin-inline-start:0;margin-inline-end:0}::ng-deep .ProseMirror-prompt{background:white;padding:5px 10px 5px 15px;border:1px solid silver;position:fixed;border-radius:3px;z-index:11;box-shadow:-.5px 2px 5px #0003}::ng-deep .ProseMirror-prompt h5{margin:0;font-weight:400;font-size:100%;color:var(--color-grey-500)}::ng-deep .ProseMirror-prompt input[type=text],::ng-deep .ProseMirror-prompt textarea{background:var(--color-component-bg-100);border:none;outline:none}::ng-deep .ProseMirror-prompt input[type=text]{padding:0 4px}::ng-deep .ProseMirror-prompt-close{position:absolute;left:2px;top:1px;color:var(--color-grey-400);border:none;background:transparent;padding:0}::ng-deep .ProseMirror-prompt-close:after{content:\"\\e2\\153\\2022\";font-size:12px}::ng-deep .ProseMirror-invalid{background:var(--color-warning-200);border:1px solid var(--color-warning-300);border-radius:4px;padding:5px 10px;position:absolute;min-width:10em}::ng-deep .ProseMirror-prompt-buttons{margin-top:5px;display:none}::ng-deep #editor,::ng-deep .editor{background:var(--color-form-input-bg);color:#000;background-clip:padding-box;border-radius:4px;border:2px solid rgba(0,0,0,.2);padding:5px 0;margin-bottom:23px}::ng-deep .ProseMirror p:first-child,::ng-deep .ProseMirror h1:first-child,::ng-deep .ProseMirror h2:first-child,::ng-deep .ProseMirror h3:first-child,::ng-deep .ProseMirror h4:first-child,::ng-deep .ProseMirror h5:first-child,::ng-deep .ProseMirror h6:first-child{margin-top:10px}::ng-deep .ProseMirror{padding:4px 8px 4px 14px;line-height:1.2;outline:none}::ng-deep .ProseMirror p{margin-bottom:.5rem;color:var(--color-text-100)!important}::ng-deep .ProseMirror .tableWrapper td,::ng-deep .ProseMirror .tableWrapper th{border:1px solid var(--color-grey-300);padding:3px 6px}::ng-deep .ProseMirror .tableWrapper td p,::ng-deep .ProseMirror .tableWrapper th p{margin-top:0}::ng-deep .ProseMirror .tableWrapper th,::ng-deep .ProseMirror .tableWrapper th p{font-weight:700}::ng-deep .ProseMirror table{border-collapse:collapse;table-layout:fixed;width:100%;overflow:hidden}::ng-deep .ProseMirror td,::ng-deep .ProseMirror th{vertical-align:top;box-sizing:border-box;position:relative}::ng-deep .ProseMirror .column-resize-handle{position:absolute;right:-2px;top:0;bottom:0;width:4px;z-index:20;background-color:#adf;pointer-events:none}::ng-deep .ProseMirror.resize-cursor{cursor:ew-resize;cursor:col-resize}::ng-deep .ProseMirror .selectedCell:after{z-index:2;position:absolute;content:\"\";inset:0;background:rgba(175,218,243,.3333333333);pointer-events:none}::ng-deep .menu-separator{border-bottom:1px solid var(--color-grey-400);height:0;margin:6px 0;pointer-events:none}::ng-deep .menu-item-with-icon{display:flex;align-items:center}::ng-deep .menu-item-with-icon clr-icon,::ng-deep .menu-item-with-icon .custom-icon{margin-inline-end:4px;color:var(--color-text-200)}::ng-deep .menu-item-with-icon .hr-icon{width:13px;height:8px;border-bottom:2px solid var(--color-text-100);margin:-8px 5px 0 2px}::ng-deep .menu-item-with-icon .h-icon{width:16px;text-align:center;font-weight:700;font-size:12px}.context-menu{position:fixed}:host{display:block;margin-bottom:.5rem}:host.readonly ::ng-deep .ProseMirror-menubar{display:none}label.rich-text-label{font-size:var(--font-size-sm);color:var(--font-weight-700)}::ng-deep .ProseMirror-menubar{position:sticky;border:1px solid var(--color-component-border-200);border-bottom:none;background-color:var(--color-component-bg-200);color:var(--color-icon-button);border-radius:var(--border-radius-input) var(--border-radius-input) 0 0;padding:6px 12px;display:flex;flex-wrap:wrap}::ng-deep .vdr-prosemirror{background:var(--color-form-input-bg);color:var(--color-text-100);min-height:128px;max-height:600px;min-width:200px;border:1px solid var(--color-component-border-200);border-radius:0 0 var(--border-radius-input) var(--border-radius-input);transition:border-color .2s;overflow:auto;text-align:initial}::ng-deep .vdr-prosemirror:focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}::ng-deep .vdr-prosemirror hr{padding:2px 10px;border:none;margin:1em 0}::ng-deep .vdr-prosemirror hr:after{content:\"\";display:block;height:1px;background-color:silver;line-height:2px}::ng-deep .vdr-prosemirror img{cursor:default;max-width:100%}::ng-deep .vdr-prosemirror a:link,::ng-deep .vdr-prosemirror a:visited{color:var(--color-primary-700);text-decoration:none}::ng-deep .vdr-prosemirror .iframe-wrapper{width:100%;text-align:center;padding:6px;transition:background-color .3s}::ng-deep .vdr-prosemirror .iframe-wrapper:hover{background-color:var(--color-primary-100)}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i1.ProsemirrorService }, { type: i0.ViewContainerRef }, { type: i2.ContextMenuService }]; }, propDecorators: { label: [{
                 type: Input
             }], readonly: [{

package/esm2022/core/shared/components/select-toggle/select-toggle.component.mjs

@@ -14,11 +14,11 @@ export class SelectToggleComponent {
         this.selectedChange = new EventEmitter();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: SelectToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: SelectToggleComponent, selector: "vdr-select-toggle", inputs: { size: "size", selected: "selected", hiddenWhenOff: "hiddenWhenOff", disabled: "disabled", label: "label" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<div\r\n    class=\"toggle\"\r\n    [class.hide-when-off]=\"hiddenWhenOff\"\r\n    [class.disabled]=\"disabled\"\r\n    [class.small]=\"size === 'small'\"\r\n    [attr.tabindex]=\"disabled ? null : 0\"\r\n    [class.selected]=\"selected\"\r\n    (keydown.enter)=\"selectedChange.emit(!selected)\"\r\n    (keydown.space)=\"$event.preventDefault(); selectedChange.emit(!selected)\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    <clr-icon\r\n        shape=\"check-circle\"\r\n        [class.is-solid]=\"selected\"\r\n        [attr.size]=\"size === 'small' ? 24 : 32\"\r\n    ></clr-icon>\r\n</div>\r\n<div\r\n    class=\"toggle-label\"\r\n    [class.selected]=\"selected\"\r\n    [class.disabled]=\"disabled\"\r\n    *ngIf=\"label\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    {{ label }}\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;justify-content:center}.toggle{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--color-grey-300);background-color:var(--color-component-bg-100);border-radius:50%;top:-12px;left:-12px;transition:opacity .1s,color .1s}.toggle.hide-when-off{opacity:0}.toggle.small{width:24px;height:24px}.toggle:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle.selected{opacity:1;color:var(--color-success-700)}.toggle.selected:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle:focus{outline:none;box-shadow:0 0 2px 2px var(--color-primary-700)}.toggle.disabled{cursor:default}.toggle-label{flex:1;margin-left:6px;text-align:left;font-size:12px}.toggle-label:not(.disabled){cursor:pointer}.toggle-label.selected{color:var(--color-success-800)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: SelectToggleComponent, selector: "vdr-select-toggle", inputs: { size: "size", selected: "selected", hiddenWhenOff: "hiddenWhenOff", disabled: "disabled", label: "label" }, outputs: { selectedChange: "selectedChange" }, ngImport: i0, template: "<div\r\n    class=\"toggle\"\r\n    [class.hide-when-off]=\"hiddenWhenOff\"\r\n    [class.disabled]=\"disabled\"\r\n    [class.small]=\"size === 'small'\"\r\n    [attr.tabindex]=\"disabled ? null : 0\"\r\n    [class.selected]=\"selected\"\r\n    (keydown.enter)=\"selectedChange.emit(!selected)\"\r\n    (keydown.space)=\"$event.preventDefault(); selectedChange.emit(!selected)\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    <clr-icon\r\n        shape=\"check-circle\"\r\n        [class.is-solid]=\"selected\"\r\n        [attr.size]=\"size === 'small' ? 24 : 32\"\r\n    ></clr-icon>\r\n</div>\r\n<div\r\n    class=\"toggle-label\"\r\n    [class.selected]=\"selected\"\r\n    [class.disabled]=\"disabled\"\r\n    *ngIf=\"label\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    {{ label }}\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;justify-content:center}.toggle{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--color-grey-300);background-color:var(--color-component-bg-100);border-radius:50%;top:-12px;left:-12px;transition:opacity .1s,color .1s}.toggle.hide-when-off{opacity:0}.toggle.small{width:24px;height:24px}.toggle:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle.selected{opacity:1;color:var(--color-success-700)}.toggle.selected:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle:focus{outline:none;box-shadow:0 0 2px 2px var(--color-primary-700)}.toggle.disabled{cursor:default}.toggle-label{flex:1;margin-inline-start:6px;text-align:start;font-size:12px}.toggle-label:not(.disabled){cursor:pointer}.toggle-label.selected{color:var(--color-success-800)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: SelectToggleComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-select-toggle', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n    class=\"toggle\"\r\n    [class.hide-when-off]=\"hiddenWhenOff\"\r\n    [class.disabled]=\"disabled\"\r\n    [class.small]=\"size === 'small'\"\r\n    [attr.tabindex]=\"disabled ? null : 0\"\r\n    [class.selected]=\"selected\"\r\n    (keydown.enter)=\"selectedChange.emit(!selected)\"\r\n    (keydown.space)=\"$event.preventDefault(); selectedChange.emit(!selected)\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    <clr-icon\r\n        shape=\"check-circle\"\r\n        [class.is-solid]=\"selected\"\r\n        [attr.size]=\"size === 'small' ? 24 : 32\"\r\n    ></clr-icon>\r\n</div>\r\n<div\r\n    class=\"toggle-label\"\r\n    [class.selected]=\"selected\"\r\n    [class.disabled]=\"disabled\"\r\n    *ngIf=\"label\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    {{ label }}\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;justify-content:center}.toggle{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--color-grey-300);background-color:var(--color-component-bg-100);border-radius:50%;top:-12px;left:-12px;transition:opacity .1s,color .1s}.toggle.hide-when-off{opacity:0}.toggle.small{width:24px;height:24px}.toggle:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle.selected{opacity:1;color:var(--color-success-700)}.toggle.selected:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle:focus{outline:none;box-shadow:0 0 2px 2px var(--color-primary-700)}.toggle.disabled{cursor:default}.toggle-label{flex:1;margin-left:6px;text-align:left;font-size:12px}.toggle-label:not(.disabled){cursor:pointer}.toggle-label.selected{color:var(--color-success-800)}\n"] }]
+            args: [{ selector: 'vdr-select-toggle', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n    class=\"toggle\"\r\n    [class.hide-when-off]=\"hiddenWhenOff\"\r\n    [class.disabled]=\"disabled\"\r\n    [class.small]=\"size === 'small'\"\r\n    [attr.tabindex]=\"disabled ? null : 0\"\r\n    [class.selected]=\"selected\"\r\n    (keydown.enter)=\"selectedChange.emit(!selected)\"\r\n    (keydown.space)=\"$event.preventDefault(); selectedChange.emit(!selected)\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    <clr-icon\r\n        shape=\"check-circle\"\r\n        [class.is-solid]=\"selected\"\r\n        [attr.size]=\"size === 'small' ? 24 : 32\"\r\n    ></clr-icon>\r\n</div>\r\n<div\r\n    class=\"toggle-label\"\r\n    [class.selected]=\"selected\"\r\n    [class.disabled]=\"disabled\"\r\n    *ngIf=\"label\"\r\n    (click)=\"selectedChange.emit(!selected)\"\r\n>\r\n    {{ label }}\r\n</div>\r\n", styles: [":host{display:flex;align-items:center;justify-content:center}.toggle{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;cursor:pointer;color:var(--color-grey-300);background-color:var(--color-component-bg-100);border-radius:50%;top:-12px;left:-12px;transition:opacity .1s,color .1s}.toggle.hide-when-off{opacity:0}.toggle.small{width:24px;height:24px}.toggle:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle.selected{opacity:1;color:var(--color-success-700)}.toggle.selected:not(.disabled):hover{color:var(--color-success-600);opacity:.9}.toggle:focus{outline:none;box-shadow:0 0 2px 2px var(--color-primary-700)}.toggle.disabled{cursor:default}.toggle-label{flex:1;margin-inline-start:6px;text-align:start;font-size:12px}.toggle-label:not(.disabled){cursor:pointer}.toggle-label.selected{color:var(--color-success-800)}\n"] }]
         }], propDecorators: { size: [{
                 type: Input
             }], selected: [{