npm - @vendure/admin-ui - Versions diffs - 3.1.0-next.1 → 3.1.0-next.3 - Mend

@vendure/admin-ui 3.1.0-next.1 → 3.1.0-next.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (117) hide show

package/esm2022/catalog/components/product-list/product-list.component.mjs CHANGED Viewed

@@ -17,6 +17,8 @@ export class ProductListComponent extends TypedBaseListComponent {
         this.notificationService = notificationService;
         this.jobQueueService = jobQueueService;
         this.pendingSearchIndexUpdates = 0;
+        this.dataTableListId = 'product-list';
+        this.pageLocationId = 'product-list';
         this.customFields = this.getCustomFieldConfig('Product');
         this.filters = this.createFilterCollection()
             .addIdFilter()
@@ -150,10 +152,10 @@ export class ProductListComponent extends TypedBaseListComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductListComponent, deps: [{ token: i1.DataService }, { token: i1.ModalService }, { token: i1.NotificationService }, { token: i1.JobQueueService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductListComponent, selector: "vdr-products-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left>\r\n            <vdr-language-selector\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n        </vdr-ab-left>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"product-list\"></vdr-action-bar-items>\r\n            <a\r\n                class=\"button primary mr-1\"\r\n                [routerLink]=\"['./create']\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n            >\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-new-product' | translate }}\r\n            </a>\r\n            <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" locationId=\"product-list\">\r\n                <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\r\n                    <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\r\n                    {{ 'catalog.rebuild-search-index' | translate }}\r\n                </button>\r\n            </vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    id=\"product-list\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"product-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-product=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-product=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\r\n                ><span>{{ product.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.slug }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-product=\"item\">\r\n            <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\r\n        <ng-template let-product=\"item\">\r\n            {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-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: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductListComponent, selector: "vdr-products-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left>\r\n            <vdr-language-selector\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n        </vdr-ab-left>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items [locationId]=\"pageLocationId\"></vdr-action-bar-items>\r\n            <a\r\n                class=\"button primary mr-1\"\r\n                [routerLink]=\"['./create']\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n            >\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-new-product' | translate }}\r\n            </a>\r\n            <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" [locationId]=\"pageLocationId\">\r\n                <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\r\n                    <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\r\n                    {{ 'catalog.rebuild-search-index' | translate }}\r\n                </button>\r\n            </vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    [id]=\"dataTableListId\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n    (visibleColumnsChange)=\"setVisibleColumns($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        [locationId]=\"dataTableListId\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-product=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-product=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\r\n                ><span>{{ product.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.slug }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-product=\"item\">\r\n            <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\r\n        <ng-template let-product=\"item\">\r\n            {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-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: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductListComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-products-list', template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left>\r\n            <vdr-language-selector\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n        </vdr-ab-left>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"product-list\"></vdr-action-bar-items>\r\n            <a\r\n                class=\"button primary mr-1\"\r\n                [routerLink]=\"['./create']\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n            >\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-new-product' | translate }}\r\n            </a>\r\n            <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" locationId=\"product-list\">\r\n                <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\r\n                    <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\r\n                    {{ 'catalog.rebuild-search-index' | translate }}\r\n                </button>\r\n            </vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    id=\"product-list\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"product-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-product=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-product=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\r\n                ><span>{{ product.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.slug }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-product=\"item\">\r\n            <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\r\n        <ng-template let-product=\"item\">\r\n            {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"] }]
+            args: [{ selector: 'vdr-products-list', template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left>\r\n            <vdr-language-selector\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n        </vdr-ab-left>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items [locationId]=\"pageLocationId\"></vdr-action-bar-items>\r\n            <a\r\n                class=\"button primary mr-1\"\r\n                [routerLink]=\"['./create']\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n            >\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-new-product' | translate }}\r\n            </a>\r\n            <vdr-action-bar-dropdown-menu [alwaysShow]=\"true\" [locationId]=\"pageLocationId\">\r\n                <button type=\"button\" vdrDropdownItem (click)=\"rebuildSearchIndex()\">\r\n                    <clr-icon shape=\"refresh\" class=\"\"></clr-icon>\r\n                    {{ 'catalog.rebuild-search-index' | translate }}\r\n                </button>\r\n            </vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    [id]=\"dataTableListId\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n    (visibleColumnsChange)=\"setVisibleColumns($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        [locationId]=\"dataTableListId\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-product=\"item\">\r\n            {{ product.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-product=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"product.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-product=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"['./', product.id]\"\r\n                ><span>{{ product.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.slug' | translate\" id=\"slug\" [sort]=\"sorts.get('slug')\">\r\n        <ng-template let-product=\"item\">\r\n            {{ product.slug }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-product=\"item\">\r\n            <vdr-chip *ngIf=\"product.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!product.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.number-of-variants' | translate\" id=\"number-of-variants\">\r\n        <ng-template let-product=\"item\">\r\n            {{ 'catalog.variant-count' | translate : { count: product.variantList?.totalItems } }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"] }]
         }], ctorParameters: () => [{ type: i1.DataService }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.JobQueueService }] });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZHVjdC1saXN0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY2F0YWxvZy9zcmMvY29tcG9uZW50cy9wcm9kdWN0LWxpc3QvcHJvZHVjdC1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY2F0YWxvZy9zcmMvY29tcG9uZW50cy9wcm9kdWN0LWxpc3QvcHJvZHVjdC1saXN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLE1BQU0sSUFBSSxDQUFDLEVBQUUsTUFBTSx5Q0FBeUMsQ0FBQztBQUN0RSxPQUFPLEVBRUgsNEJBQTRCLEVBRTVCLFFBQVEsRUFDUixlQUFlLEVBR2Ysd0JBQXdCLEVBQ3hCLHNCQUFzQixHQUN6QixNQUFNLHdCQUF3QixDQUFDO0FBQ2hDLE9BQU8sRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQzVDLE9BQU8sRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFPbEQsTUFBTSxPQUFPLG9CQUNULFNBQVEsc0JBQW1FO0lBb0UzRSxZQUNjLFdBQXdCLEVBQzFCLFlBQTBCLEVBQzFCLG1CQUF3QyxFQUN4QyxlQUFnQztRQUV4QyxLQUFLLEVBQUUsQ0FBQztRQUxFLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBQzFCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQzFCLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFDeEMsb0JBQWUsR0FBZixlQUFlLENBQWlCO1FBckU1Qyw4QkFBeUIsR0FBRyxDQUFDLENBQUM7UUFDckIsaUJBQVksR0FBRyxJQUFJLENBQUMsb0JBQW9CLENBQUMsU0FBUyxDQUFDLENBQUM7UUFDcEQsWUFBTyxHQUFHLElBQUksQ0FB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QUUsV0FBVyxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUMsZUFBZSxDQUFDLEVBQUU7Z0JBQ2hELEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFDLGVBQWUsQ0FBQyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUU7YUFDbkU7U0FDSixDQUFDO2FBQ0QsSUFBSSxDQUNELFNBQVMsQ0FBQyxRQUFRLENBQUMsRUFBRSxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzdGLDhFQUE4RTtRQUM5RSxjQUFjO1FBQ2QsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUNiO2FBQ0EsU0FBUyxDQUNOLEdBQUcsRUFBRTtZQUNELElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLDhCQUE4QixDQUFDLEVBQUU7Z0JBQ2hFLE1BQU0sRUFBRSxTQUFTO2FBQ3BCLENBQUMsQ0FBQztZQUNILElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztRQUNuQixDQUFDLEVBQ0QsR0FBRyxDQUFDLEVBQUU7WUFDRixJQUFJLENBQUMsbUJBQW1CLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyw0QkFBNEIsQ0FBQyxFQUFFO2dCQUM1RCxNQUFNLEVBQUUsU0FBUzthQUNwQixDQUFDLENBQUM7UUFDUCxDQUFDLENBQ0osQ0FBQztJQUNWLENBQUM7OEdBMUpRLG9CQUFvQjtrR0FBcEIsb0JBQW9CLGdGQ3JCakMsbXZLQXdIQTs7MkZEbkdhLG9CQUFvQjtrQkFMaEMsU0FBUzsrQkFDSSxtQkFBbUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBtYXJrZXIgYXMgXyB9IGZyb20gJ0BiaWVzYmplcmcvbmd4LXRyYW5zbGF0ZS1leHRyYWN0LW1hcmtlcic7XHJcbmltcG9ydCB7XHJcbiAgICBEYXRhU2VydmljZSxcclxuICAgIEZhY2V0VmFsdWVGb3JtSW5wdXRDb21wb25lbnQsXHJcbiAgICBKb2JRdWV1ZVNlcnZpY2UsXHJcbiAgICBKb2JTdGF0ZSxcclxuICAgIExvZ2ljYWxPcGVyYXRvcixcclxuICAgIE1vZGFsU2VydmljZSxcclxuICAgIE5vdGlmaWNhdGlvblNlcnZpY2UsXHJcbiAgICBQcm9kdWN0TGlzdFF1ZXJ5RG9jdW1lbnQsXHJcbiAgICBUeXBlZEJhc2VMaXN0Q29tcG9uZW50LFxyXG59IGZyb20gJ0B2ZW5kdXJlL2FkbWluLXVpL2NvcmUnO1xyXG5pbXBvcnQgeyBFTVBUWSwgbGFzdFZhbHVlRnJvbSB9IGZyb20gJ3J4anMnO1xyXG5pbXBvcnQgeyBkZWxheSwgc3dpdGNoTWFwIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Zkci1wcm9kdWN0cy1saXN0JyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9kdWN0LWxpc3QuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vcHJvZHVjdC1saXN0LmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBQcm9kdWN0TGlzdENvbXBvbmVudFxyXG4gICAgZXh0ZW5kcyBUeXBlZEJhc2VMaXN0Q29tcG9uZW50PHR5cGVvZiBQcm9kdWN0TGlzdFF1ZXJ5RG9jdW1lbnQsICdwcm9kdWN0cyc+XHJcbiAgICBpbXBsZW1lbnRzIE9uSW5pdFxyXG57XHJcbiAgICBwZW5kaW5nU2VhcmNoSW5kZXhVcGRhdGVzID0gMDtcclxuICAgIHJlYWRvbmx5IGN1c3RvbUZpZWxkcyA9IHRoaXMuZ2V0Q3VzdG9tRmllbGRDb25maWcoJ1Byb2R1Y3QnKTtcclxuICAgIHJlYWRvbmx5IGZpbHRlcnMgPSB0aGlzLmNyZWF0ZUZpbHRlckNvbGxlY3Rpb24oKVxyXG4gICAgICAgIC5hZGRJZEZpbHRlcigpXHJcbiAgICAgICAgLmFkZERhdGVGaWx0ZXJzKClcclxuICAgICAgICAuYWRkRmlsdGVycyhbXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgIG5hbWU6ICdlbmFibGVkJyxcclxuICAgICAgICAgICAgICAgIHR5cGU6IHsga2luZDogJ2Jvb2xlYW4nIH0sXHJcbiAgICAgICAgICAgICAgICBsYWJlbDogXygnY29tbW9uLmVuYWJsZWQnKSxcclxuICAgICAgICAgICAgICAgIGZpbHRlckZpZWxkOiAnZW5hYmxlZCcsXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIHtcclxuICAgICAgICAgICAgICAgIG5hbWU6ICdzbHVnJyxcclxuICAgICAgICAgICAgICAgIHR5cGU6IHsga2luZDogJ3RleHQnIH0sXHJcbiAgICAgICAgICAgICAgICBsYWJlbDogXygnY29tbW9uLnNsdWcnKSxcclxuICAgICAgICAgICAgICAgIGZpbHRlckZpZWxkOiAnc2x1ZycsXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgXSlcclxuICAgICAgICAuYWRkRmlsdGVyKHtcclxuICAgICAgICAgICAgbmFtZTogJ2ZhY2V0VmFsdWVzJyxcclxuICAgICAgICAgICAgdHlwZToge1xyXG4gICAgICAgICAgICAgICAga2luZDogJ2N1c3RvbScsXHJcbiAgICAgICAgICAgICAgICBjb21wb25lbnQ6IEZhY2V0VmFsdWVGb3JtSW5wdXRDb21wb25lbnQsXHJcbiAgICAgICAgICAgICAgICBzZXJpYWxpemVWYWx1ZTogdmFsdWUgPT4gdmFsdWUubWFwKHYgPT4gdi5pZCkuam9pbignLCcpLFxyXG4gICAgICAgICAgICAgICAgZGVzZXJpYWxpemVWYWx1ZTogdmFsdWUgPT4gdmFsdWUuc3BsaXQoJywnKS5tYXAoaWQgPT4gKHsgaWQgfSkpLFxyXG4gICAgICAgICAgICAgICAgZ2V0TGFiZWw6IHZhbHVlID0+IHtcclxuICAgICAgICAgICAgICAgICAgICBpZiAodmFsdWUubGVuZ3RoID09PSAwKSB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiAnJztcclxuICAgICAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgICAgICAgICAgaWYgKHZhbHVlWzBdLm5hbWUpIHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgcmV0dXJuIHZhbHVlLm1hcCh2ID0+IHYubmFtZSkuam9pbignLCAnKTtcclxuICAgICAgICAgICAgICAgICAgICB9IGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gbGFzdFZhbHVlRnJvbShcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIHRoaXMuZGF0YVNlcnZpY2UuZmFjZXRcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAuZ2V0RmFjZXRWYWx1ZXMoeyBmaWx0ZXI6IHsgaWQ6IHsgaW46IHZhbHVlLm1hcCh2ID0+IHYuaWQpIH0gfSB9KVxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC5tYXBTaW5nbGUoKHsgZmFjZXRWYWx1ZXMgfSkgPT5cclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgZmFjZXRWYWx1ZXMuaXRlbXMubWFwKGZ2ID0+IGZ2Lm5hbWUpLmpvaW4oJywgJyksXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgKSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgKTtcclxuICAgICAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnY2F0YWxvZy5mYWNldC12YWx1ZXMnKSxcclxuICAgICAgICAgICAgdG9GaWx0ZXJJbnB1dDogKHZhbHVlOiBhbnlbXSkgPT4gKHtcclxuICAgICAgICAgICAgICAgIGZhY2V0VmFsdWVJZDoge1xyXG4gICAgICAgICAgICAgICAgICAgIGluOiB2YWx1ZS5tYXAodiA9PiB2LmlkKSxcclxuICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIH0pLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEN1c3RvbUZpZWxkRmlsdGVycyh0aGlzLmN1c3RvbUZpZWxkcylcclxuICAgICAgICAuY29ubmVjdFRvUm91dGUodGhpcy5yb3V0ZSk7XHJcblxyXG4gICAgcmVhZG9ubHkgc29ydHMgPSB0aGlzLmNyZWF0ZVNvcnRDb2xsZWN0aW9uKClcclxuICAgICAgICAuZGVmYXVsdFNvcnQoJ2NyZWF0ZWRBdCcsICdERVNDJylcclxuICAgICAgICAuYWRkU29ydHMoW1xyXG4gICAgICAgICAgICB7IG5hbWU6ICdpZCcgfSxcclxuICAgICAgICAgICAgeyBuYW1lOiAnY3JlYXRlZEF0JyB9LFxyXG4gICAgICAgICAgICB7IG5hbWU6ICd1cGRhdGVkQXQnIH0sXHJcbiAgICAgICAgICAgIHsgbmFtZTogJ25hbWUnIH0sXHJcbiAgICAgICAgICAgIHsgbmFtZTogJ3NsdWcnIH0sXHJcbiAgICAgICAgXSlcclxuICAgICAgICAuYWRkQ3VzdG9tRmllbGRTb3J0cyh0aGlzLmN1c3RvbUZpZWxkcylcclxuICAgICAgICAuY29ubmVjdFRvUm91dGUodGhpcy5yb3V0ZSk7XHJcblxyXG4gICAgY29uc3RydWN0b3IoXHJcbiAgICAgICAgcHJvdGVjdGVkIGRhdGFTZXJ2aWNlOiBEYXRhU2VydmljZSxcclxuICAgICAgICBwcml2YXRlIG1vZGFsU2VydmljZTogTW9kYWxTZXJ2aWNlLFxyXG4gICAgICAgIHByaXZhdGUgbm90aWZpY2F0aW9uU2VydmljZTogTm90aWZpY2F0aW9uU2VydmljZSxcclxuICAgICAgICBwcml2YXRlIGpvYlF1ZXVlU2VydmljZTogSm9iUXVldWVTZXJ2aWNlLFxyXG4gICAgKSB7XHJcbiAgICAgICAgc3VwZXIoKTtcclxuICAgICAgICB0aGlzLmNvbmZpZ3VyZSh7XHJcbiAgICAgICAgICAgIGRvY3VtZW50OiBQcm9kdWN0TGlzdFF1ZXJ5RG9jdW1lbnQsXHJcbiAgICAgICAgICAgIGdldEl0ZW1zOiBkYXRhID0+IGRhdGEucHJvZHVjdHMsXHJcbiAgICAgICAgICAgIHNldFZhcmlhYmxlczogKHNraXAsIHRha2UpID0+IHtcclxuICAgICAgICAgICAgICAgIGNvbnN0IHNlYXJjaFRlcm0gPSB0aGlzLnNlYXJjaFRlcm1Db250cm9sLnZhbHVlO1xyXG4gICAgICAgICAgICAgICAgbGV0IGZpbHRlcklucHV0ID0gdGhpcy5maWx0ZXJzLmNyZWF0ZUZpbHRlcklucHV0KCk7XHJcbiAgICAgICAgICAgICAgICBpZiAoc2VhcmNoVGVybSkge1xyXG4gICAgICAgICAgICAgICAgICAgIGZpbHRlcklucHV0ID0ge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBuYW1lOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgc2t1OiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgICAgICB9O1xyXG4gICAgICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICAgICAgcmV0dXJuIHtcclxuICAgICAgICAgICAgICAgICAgICBvcHRpb25zOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHNraXAsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHRha2UsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIGZpbHRlcjoge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgLi4uKGZpbHRlcklucHV0ID8/IHt9KSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgZmlsdGVyT3BlcmF0b3I6IHNlYXJjaFRlcm0gPyBMb2dpY2FsT3BlcmF0b3IuT1IgOiBMb2dpY2FsT3BlcmF0b3IuQU5ELFxyXG4gICAgICAgICAgICAgICAgICAgICAgICBzb3J0OiB0aGlzLnNvcnRzLmNyZWF0ZVNvcnRJbnB1dCgpLFxyXG4gICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICB9O1xyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICByZWZyZXNoTGlzdE9uQ2hhbmdlczogW3RoaXMuc29ydHMudmFsdWVDaGFuZ2VzLCB0aGlzLmZpbHRlcnMudmFsdWVDaGFuZ2VzXSxcclxuICAgICAgICB9KTtcclxuICAgIH1cclxuXHJcbiAgICByZWJ1aWxkU2VhcmNoSW5kZXgoKSB7XHJcbiAgICAgICAgdGhpcy5kYXRhU2VydmljZS5wcm9kdWN0LnJlaW5kZXgoKS5zdWJzY3JpYmUoKHsgcmVpbmRleCB9KSA9PiB7XHJcbiAgICAgICAgICAgIHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5pbmZvKF8oJ2NhdGFsb2cucmVpbmRleGluZycpKTtcclxuICAgICAgICAgICAgdGhpcy5qb2JRdWV1ZVNlcnZpY2UuYWRkSm9iKHJlaW5kZXguaWQsIGpvYiA9PiB7XHJcbiAgICAgICAgICAgICAgICBpZiAoam9iLnN0YXRlID09PSBKb2JTdGF0ZS5DT01QTEVURUQpIHtcclxuICAgICAgICAgICAgICAgICAgICBjb25zdCB0aW1lID0gbmV3IEludGwuTnVtYmVyRm9ybWF0KCkuZm9ybWF0KGpvYi5kdXJhdGlvbiB8fCAwKTtcclxuICAgICAgICAgICAgICAgICAgICB0aGlzLm5vdGlmaWNhdGlvblNlcnZpY2Uuc3VjY2VzcyhfKCdjYXRhbG9nLnJlaW5kZXgtc3VjY2Vzc2Z1bCcpLCB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIGNvdW50OiBqb2IucmVzdWx0LmluZGV4ZWRJdGVtQ291bnQsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHRpbWUsXHJcbiAgICAgICAgICAgICAgICAgICAgfSk7XHJcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5yZWZyZXNoKCk7XHJcbiAgICAgICAgICAgICAgICB9IGVsc2Uge1xyXG4gICAgICAgICAgICAgICAgICAgIHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5lcnJvcihfKCdjYXRhbG9nLnJlaW5kZXgtZXJyb3InKSk7XHJcbiAgICAgICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIH0pO1xyXG4gICAgICAgIH0pO1xyXG4gICAgfVxyXG5cclxuICAgIGRlbGV0ZVByb2R1Y3QocHJvZHVjdElkOiBzdHJpbmcpIHtcclxuICAgICAgICB0aGlzLm1vZGFsU2VydmljZVxyXG4gICAgICAgICAgICAuZGlhbG9nKHtcclxuICAgICAgICAgICAgICAgIHRpdGxlOiBfKCdjYXRhbG9nLmNvbmZpcm0tZGVsZXRlLXByb2R1Y3QnKSxcclxuICAgICAgICAgICAgICAgIGJ1dHRvbnM6IFtcclxuICAgICAgICAgICAgICAgICAgICB7IHR5cGU6ICdzZWNvbmRhcnknLCBsYWJlbDogXygnY29tbW9uLmNhbmNlbCcpIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgeyB0eXBlOiAnZGFuZ2VyJywgbGFiZWw6IF8oJ2NvbW1vbi5kZWxldGUnKSwgcmV0dXJuVmFsdWU6IHRydWUgfSxcclxuICAgICAgICAgICAgICAgIF0sXHJcbiAgICAgICAgICAgIH0pXHJcbiAgICAgICAgICAgIC5waXBlKFxyXG4gICAgICAgICAgICAgICAgc3dpdGNoTWFwKHJlc3BvbnNlID0+IChyZXNwb25zZSA/IHRoaXMuZGF0YVNlcnZpY2UucHJvZHVjdC5kZWxldGVQcm9kdWN0KHByb2R1Y3RJZCkgOiBFTVBUWSkpLFxyXG4gICAgICAgICAgICAgICAgLy8gU2hvcnQgZGVsYXkgdG8gYWxsb3cgdGhlIHByb2R1Y3QgdG8gYmUgcmVtb3ZlZCBmcm9tIHRoZSBzZWFyY2ggaW5kZXggYmVmb3JlXHJcbiAgICAgICAgICAgICAgICAvLyByZWZyZXNoaW5nLlxyXG4gICAgICAgICAgICAgICAgZGVsYXkoNTAwKSxcclxuICAgICAgICAgICAgKVxyXG4gICAgICAgICAgICAuc3Vic2NyaWJlKFxyXG4gICAgICAgICAgICAgICAgKCkgPT4ge1xyXG4gICAgICAgICAgICAgICAgICAgIHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5zdWNjZXNzKF8oJ2NvbW1vbi5ub3RpZnktZGVsZXRlLXN1Y2Nlc3MnKSwge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICBlbnRpdHk6ICdQcm9kdWN0JyxcclxuICAgICAgICAgICAgICAgICAgICB9KTtcclxuICAgICAgICAgICAgICAgICAgICB0aGlzLnJlZnJlc2goKTtcclxuICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICBlcnIgPT4ge1xyXG4gICAgICAgICAgICAgICAgICAgIHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5lcnJvcihfKCdjb21tb24ubm90aWZ5LWRlbGV0ZS1lcnJvcicpLCB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIGVudGl0eTogJ1Byb2R1Y3QnLFxyXG4gICAgICAgICAgICAgICAgICAgIH0pO1xyXG4gICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgKTtcclxuICAgIH1cclxufVxyXG4iLCI8dmRyLXBhZ2UtYmxvY2s+XHJcbiAgICA8dmRyLWFjdGlvbi1iYXI+XHJcbiAgICAgICAgPHZkci1hYi1sZWZ0PlxyXG4gICAgICAgICAgICA8dmRyLWxhbmd1YWdlLXNlbGVjdG9yXHJcbiAgICAgICAgICAgICAgICBbYXZhaWxhYmxlTGFuZ3VhZ2VDb2Rlc109XCJhdmFpbGFibGVMYW5ndWFnZXMkIHwgYXN5bmNcIlxyXG4gICAgICAgICAgICAgICAgW2N1cnJlbnRMYW5ndWFnZUNvZGVdPVwiY29udGVudExhbmd1YWdlJCB8IGFzeW5jXCJcclxuICAgICAgICAgICAgICAgIChsYW5ndWFnZUNvZGVDaGFuZ2UpPVwic2V0TGFuZ3VhZ2UoJGV2ZW50KVwiXHJcbiAgICAgICAgICAgID48L3Zkci1sYW5ndWFnZS1zZWxlY3Rvcj5cclxuICAgICAgICA8L3Zkci1hYi1sZWZ0PlxyXG4gICAgICAgIDx2ZHItYWItcmlnaHQ+XHJcbiAgICAgICAgICAgIDx2ZHItYWN0aW9uLWJhci1pdGVtcyBsb2NhdGlvbklkPVwicHJvZHVjdC1saXN0XCI+PC92ZHItYWN0aW9uLWJhci1pdGVtcz5cclxuICAgICAgICAgICAgPGFcclxuICAgICAgICAgICAgICAgIGNsYXNzPVwiYnV0dG9uIHByaW1hcnkgbXItMVwiXHJcbiAgICAgICAgICAgICAgICBbcm91dGVyTGlua109XCJbJy4vY3JlYXRlJ11cIlxyXG4gICAgICAgICAgICAgICAgKnZkcklmUGVybWlzc2lvbnM9XCJbJ0NyZWF0ZUNhdGFsb2cnLCAnQ3JlYXRlUHJvZHVjdCddXCJcclxuICAgICAgICAgICAgPlxyXG4gICAgICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwicGx1c1wiPjwvY2xyLWljb24+XHJcbiAgICAgICAgICAgICAgICB7eyAnY2F0YWxvZy5jcmVhdGUtbmV3LXByb2R1Y3QnIHwgdHJhbnNsYXRlIH19XHJcbiAgICAgICAgICAgIDwvYT5cclxuICAgICAgICAgICAgPHZkci1hY3Rpb24tYmFyLWRyb3Bkb3duLW1lbnUgW2Fsd2F5c1Nob3ddPVwidHJ1ZVwiIGxvY2F0aW9uSWQ9XCJwcm9kdWN0LWxpc3RcIj5cclxuICAgICAgICAgICAgICAgIDxidXR0b24gdHlwZT1cImJ1dHRvblwiIHZkckRyb3Bkb3duSXRlbSAoY2xpY2spPVwicmVidWlsZFNlYXJjaEluZGV4KClcIj5cclxuICAgICAgICAgICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJyZWZyZXNoXCIgY2xhc3M9XCJcIj48L2Nsci1pY29uPlxyXG4gICAgICAgICAgICAgICAgICAgIHt7ICdjYXRhbG9nLnJlYnVpbGQtc2VhcmNoLWluZGV4JyB8IHRyYW5zbGF0ZSB9fVxyXG4gICAgICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgICAgIDwvdmRyLWFjdGlvbi1iYXItZHJvcGRvd24tbWVudT5cclxuICAgICAgICA8L3Zkci1hYi1yaWdodD5cclxuICAgIDwvdmRyLWFjdGlvbi1iYXI+XHJcbjwvdmRyLXBhZ2UtYmxvY2s+XHJcbjx2ZHItZGF0YS10YWJsZS0yXHJcbiAgICBjbGFzcz1cIm10LTJcIlxyXG4gICAgaWQ9XCJwcm9kdWN0LWxpc3RcIlxyXG4gICAgW2l0ZW1zXT1cIml0ZW1zJCB8IGFzeW5jXCJcclxuICAgIFtpdGVtc1BlclBhZ2VdPVwiaXRlbXNQZXJQYWdlJCB8IGFzeW5jXCJcclxuICAgIFt0b3RhbEl0ZW1zXT1cInRvdGFsSXRlbXMkIHwgYXN5bmNcIlxyXG4gICAgW2N1cnJlbnRQYWdlXT1cImN1cnJlbnRQYWdlJCB8IGFzeW5jXCJcclxuICAgIFtmaWx0ZXJzXT1cImZpbHRlcnNcIlxyXG4gICAgKHBhZ2VDaGFuZ2UpPVwic2V0UGFnZU51bWJlcigkZXZlbnQpXCJcclxuICAgIChpdGVtc1BlclBhZ2VDaGFuZ2UpPVwic2V0SXRlbXNQZXJQYWdlKCRldmVudClcIlxyXG4+XHJcbiAgICA8dmRyLWJ1bGstYWN0aW9uLW1lbnVcclxuICAgICAgICBsb2NhdGlvbklkPVwicHJvZHVjdC1saXN0XCJcclxuICAgICAgICBbaG9zdENvbXBvbmVudF09XCJ0aGlzXCJcclxuICAgICAgICBbc2VsZWN0aW9uTWFuYWdlcl09XCJzZWxlY3Rpb25NYW5hZ2VyXCJcclxuICAgID48L3Zkci1idWxrLWFjdGlvbi1tZW51PlxyXG4gICAgPHZkci1kdDItc2VhcmNoXHJcbiAgICAgICAgW3NlYXJjaFRlcm1Db250cm9sXT1cInNlYXJjaFRlcm1Db250cm9sXCJcclxuICAgICAgICBbc2VhcmNoVGVybVBsYWNlaG9sZGVyXT1cIidzZXR0aW5ncy5zZWFyY2gtYnktcHJvZHVjdC1uYW1lLW9yLXNrdScgfCB0cmFuc2xhdGVcIlxyXG4gICAgLz5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY29tbW9uLmlkJyB8IHRyYW5zbGF0ZVwiIGlkPVwiaWRcIiBbaGlkZGVuQnlEZWZhdWx0XT1cInRydWVcIiBbc29ydF09XCJzb3J0cy5nZXQoJ2lkJylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IHByb2R1Y3QuaWQgfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtblxyXG4gICAgICAgIFtoZWFkaW5nXT1cIidjb21tb24uY3JlYXRlZC1hdCcgfCB0cmFuc2xhdGVcIiBpZD1cImNyZWF0ZWQtYXRcIlxyXG4gICAgICAgIFtoaWRkZW5CeURlZmF1bHRdPVwidHJ1ZVwiXHJcbiAgICAgICAgW3NvcnRdPVwic29ydHMuZ2V0KCdjcmVhdGVkQXQnKVwiXHJcbiAgICA+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1wcm9kdWN0PVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBwcm9kdWN0LmNyZWF0ZWRBdCB8IGxvY2FsZURhdGUgOiAnc2hvcnQnIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW5cclxuICAgICAgICBbaGVhZGluZ109XCInY29tbW9uLnVwZGF0ZWQtYXQnIHwgdHJhbnNsYXRlXCIgaWQ9XCJ1cGRhdGVkLWF0XCJcclxuICAgICAgICBbaGlkZGVuQnlEZWZhdWx0XT1cInRydWVcIlxyXG4gICAgICAgIFtzb3J0XT1cInNvcnRzLmdldCgndXBkYXRlZEF0JylcIlxyXG4gICAgPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgcHJvZHVjdC51cGRhdGVkQXQgfCBsb2NhbGVEYXRlIDogJ3Nob3J0JyB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uaW1hZ2UnIHwgdHJhbnNsYXRlXCIgaWQ9XCJpbWFnZVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cImltYWdlLXBsYWNlaG9sZGVyXCI+XHJcbiAgICAgICAgICAgICAgICA8aW1nXHJcbiAgICAgICAgICAgICAgICAgICAgKm5nSWY9XCJwcm9kdWN0LmZlYXR1cmVkQXNzZXQgYXMgYXNzZXQ7IGVsc2UgaW1hZ2VQbGFjZWhvbGRlclwiXHJcbiAgICAgICAgICAgICAgICAgICAgW3NyY109XCJhc3NldCB8IGFzc2V0UHJldmlldyA6ICd0aW55J1wiXHJcbiAgICAgICAgICAgICAgICAvPlxyXG4gICAgICAgICAgICAgICAgPG5nLXRlbXBsYXRlICNpbWFnZVBsYWNlaG9sZGVyPlxyXG4gICAgICAgICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJwbGFjZWhvbGRlclwiPlxyXG4gICAgICAgICAgICAgICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJpbWFnZVwiIHNpemU9XCI0OFwiPjwvY2xyLWljb24+XHJcbiAgICAgICAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY2F0YWxvZy5uYW1lJyB8IHRyYW5zbGF0ZVwiIGlkPVwibmFtZVwiIFtvcHRpb25hbF09XCJmYWxzZVwiIFtzb3J0XT1cInNvcnRzLmdldCgnbmFtZScpXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1wcm9kdWN0PVwiaXRlbVwiPlxyXG4gICAgICAgICAgICA8YSBjbGFzcz1cImJ1dHRvbi1naG9zdFwiIFtyb3V0ZXJMaW5rXT1cIlsnLi8nLCBwcm9kdWN0LmlkXVwiXHJcbiAgICAgICAgICAgICAgICA+PHNwYW4+e3sgcHJvZHVjdC5uYW1lIH19PC9zcGFuXHJcbiAgICAgICAgICAgICAgICA+PGNsci1pY29uIHNoYXBlPVwiYXJyb3cgcmlnaHRcIlxyXG4gICAgICAgICAgICAvPjwvYT5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY29tbW9uLnNsdWcnIHwgdHJhbnNsYXRlXCIgaWQ9XCJzbHVnXCIgW3NvcnRdPVwic29ydHMuZ2V0KCdzbHVnJylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IHByb2R1Y3Quc2x1ZyB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uZW5hYmxlZCcgfCB0cmFuc2xhdGVcIiBpZD1cImVuYWJsZWRcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIDx2ZHItY2hpcCAqbmdJZj1cInByb2R1Y3QuZW5hYmxlZFwiIGNvbG9yVHlwZT1cInN1Y2Nlc3NcIj57e1xyXG4gICAgICAgICAgICAgICAgJ2NvbW1vbi5lbmFibGVkJyB8IHRyYW5zbGF0ZVxyXG4gICAgICAgICAgICB9fTwvdmRyLWNoaXA+XHJcbiAgICAgICAgICAgIDx2ZHItY2hpcCAqbmdJZj1cIiFwcm9kdWN0LmVuYWJsZWRcIiBjb2xvclR5cGU9XCJ3YXJuaW5nXCI+e3tcclxuICAgICAgICAgICAgICAgICdjb21tb24uZGlzYWJsZWQnIHwgdHJhbnNsYXRlXHJcbiAgICAgICAgICAgIH19PC92ZHItY2hpcD5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY2F0YWxvZy5udW1iZXItb2YtdmFyaWFudHMnIHwgdHJhbnNsYXRlXCIgaWQ9XCJudW1iZXItb2YtdmFyaWFudHNcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7ICdjYXRhbG9nLnZhcmlhbnQtY291bnQnIHwgdHJhbnNsYXRlIDogeyBjb3VudDogcHJvZHVjdC52YXJpYW50TGlzdD8udG90YWxJdGVtcyB9IH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jdXN0b20tZmllbGQtY29sdW1uXHJcbiAgICAgICAgKm5nRm9yPVwibGV0IGN1c3RvbUZpZWxkIG9mIGN1c3RvbUZpZWxkc1wiXHJcbiAgICAgICAgW2N1c3RvbUZpZWxkXT1cImN1c3RvbUZpZWxkXCJcclxuICAgICAgICBbc29ydHNdPVwic29ydHNcIlxyXG4gICAgLz5cclxuPC92ZHItZGF0YS10YWJsZS0yPlxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHJvZHVjdC1saXN0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY2F0YWxvZy9zcmMvY29tcG9uZW50cy9wcm9kdWN0LWxpc3QvcHJvZHVjdC1saXN0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3NyYy9saWIvY2F0YWxvZy9zcmMvY29tcG9uZW50cy9wcm9kdWN0LWxpc3QvcHJvZHVjdC1saXN0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLE1BQU0sSUFBSSxDQUFDLEVBQUUsTUFBTSx5Q0FBeUMsQ0FBQztBQUN0RSxPQUFPLEVBRUgsNEJBQTRCLEVBRTVCLFFBQVEsRUFDUixlQUFlLEVBR2Ysd0JBQXdCLEVBQ3hCLHNCQUFzQixHQUN6QixNQUFNLHdCQUF3QixDQUFDO0FBQ2hDLE9BQU8sRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFLE1BQU0sTUFBTSxDQUFDO0FBQzVDLE9BQU8sRUFBRSxLQUFLLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFPbEQsTUFBTSxPQUFPLG9CQUNULFNBQVEsc0JBQW1FO0lBc0UzRSxZQUNjLFdBQXdCLEVBQzFCLFlBQTBCLEVBQzFCLG1CQUF3QyxFQUN4QyxlQUFnQztRQUV4QyxLQUFLLEVBQUUsQ0FBQztRQUxFLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBQzFCLGlCQUFZLEdBQVosWUFBWSxDQUFjO1FBQzFCLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFDeEMsb0JBQWUsR0FBZixlQUFlLENBQWlCO1FBdkU1Qyw4QkFBeUIsR0FBRyxDQUFDLENBQUM7UUFDOUIsb0JBQWUsR0FBRyxjQUFjLENBQUM7UUFDakMsbUJBQWMsR0FBRyxjQUFjLENBQUM7UUFDdkIsaUJBQVksR0FBRyxJQUFJLENB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QUMsQ0FBQyxnQ0FBZ0MsQ0FBQztZQUMxQyxPQUFPLEVBQUU7Z0JBQ0wsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFLEtBQUssRUFBRSxDQUFDLENBQUMsZUFBZSxDQUFDLEVBQUU7Z0JBQ2hELEVBQUUsSUFBSSxFQUFFLFFBQVEsRUFBRSxLQUFLLEVBQUUsQ0FBQyxDQUFDLGVBQWUsQ0FBQyxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUU7YUFDbkU7U0FDSixDQUFDO2FBQ0QsSUFBSSxDQUNELFNBQVMsQ0FBQyxRQUFRLENBQUMsRUFBRSxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsV0FBVyxDQUFDLE9BQU8sQ0FBQyxhQUFhLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBQzdGLDhFQUE4RTtRQUM5RSxjQUFjO1FBQ2QsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUNiO2FBQ0EsU0FBUyxDQUNOLEdBQUcsRUFBRTtZQUNELElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxPQUFPLENBQUMsQ0FBQyxDQUFDLDhCQUE4QixDQUFDLEVBQUU7Z0JBQ2hFLE1BQU0sRUFBRSxTQUFTO2FBQ3BCLENBQUMsQ0FBQztZQUNILElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztRQUNuQixDQUFDLEVBQ0QsR0FBRyxDQUFDLEVBQUU7WUFDRixJQUFJLENBQUMsbUJBQW1CLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyw0QkFBNEIsQ0FBQyxFQUFFO2dCQUM1RCxNQUFNLEVBQUUsU0FBUzthQUNwQixDQUFDLENBQUM7UUFDUCxDQUFDLENBQ0osQ0FBQztJQUNWLENBQUM7OEdBNUpRLG9CQUFvQjtrR0FBcEIsb0JBQW9CLGdGQ3JCakMsaTBLQXlIQTs7MkZEcEdhLG9CQUFvQjtrQkFMaEMsU0FBUzsrQkFDSSxtQkFBbUIiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgbWFya2VyIGFzIF8gfSBmcm9tICdAYmllc2JqZXJnL25neC10cmFuc2xhdGUtZXh0cmFjdC1tYXJrZXInO1xuaW1wb3J0IHtcbiAgICBEYXRhU2VydmljZSxcbiAgICBGYWNldFZhbHVlRm9ybUlucHV0Q29tcG9uZW50LFxuICAgIEpvYlF1ZXVlU2VydmljZSxcbiAgICBKb2JTdGF0ZSxcbiAgICBMb2dpY2FsT3BlcmF0b3IsXG4gICAgTW9kYWxTZXJ2aWNlLFxuICAgIE5vdGlmaWNhdGlvblNlcnZpY2UsXG4gICAgUHJvZHVjdExpc3RRdWVyeURvY3VtZW50LFxuICAgIFR5cGVkQmFzZUxpc3RDb21wb25lbnQsXG59IGZyb20gJ0B2ZW5kdXJlL2FkbWluLXVpL2NvcmUnO1xuaW1wb3J0IHsgRU1QVFksIGxhc3RWYWx1ZUZyb20gfSBmcm9tICdyeGpzJztcbmltcG9ydCB7IGRlbGF5LCBzd2l0Y2hNYXAgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XG5cbkBDb21wb25lbnQoe1xuICAgIHNlbGVjdG9yOiAndmRyLXByb2R1Y3RzLWxpc3QnLFxuICAgIHRlbXBsYXRlVXJsOiAnLi9wcm9kdWN0LWxpc3QuY29tcG9uZW50Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3Byb2R1Y3QtbGlzdC5jb21wb25lbnQuc2NzcyddLFxufSlcbmV4cG9ydCBjbGFzcyBQcm9kdWN0TGlzdENvbXBvbmVudFxuICAgIGV4dGVuZHMgVHlwZWRCYXNlTGlzdENvbXBvbmVudDx0eXBlb2YgUHJvZHVjdExpc3RRdWVyeURvY3VtZW50LCAncHJvZHVjdHMnPlxuICAgIGltcGxlbWVudHMgT25Jbml0XG57XG4gICAgcGVuZGluZ1NlYXJjaEluZGV4VXBkYXRlcyA9IDA7XG4gICAgZGF0YVRhYmxlTGlzdElkID0gJ3Byb2R1Y3QtbGlzdCc7XG4gICAgcGFnZUxvY2F0aW9uSWQgPSAncHJvZHVjdC1saXN0JztcbiAgICByZWFkb25seSBjdXN0b21GaWVsZHMgPSB0aGlzLmdldEN1c3RvbUZpZWxkQ29uZmlnKCdQcm9kdWN0Jyk7XG4gICAgcmVhZG9ubHkgZmlsdGVycyA9IHRoaXMuY3JlYXRlRmlsdGVyQ29sbGVjdGlvbigpXG4gICAgICAgIC5hZGRJZEZpbHRlcigpXG4gICAgICAgIC5hZGREYXRlRmlsdGVycygpXG4gICAgICAgIC5hZGRGaWx0ZXJzKFtcbiAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBuYW1lOiAnZW5hYmxlZCcsXG4gICAgICAgICAgICAgICAgdHlwZTogeyBraW5kOiAnYm9vbGVhbicgfSxcbiAgICAgICAgICAgICAgICBsYWJlbDogXygnY29tbW9uLmVuYWJsZWQnKSxcbiAgICAgICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ2VuYWJsZWQnLFxuICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIHtcbiAgICAgICAgICAgICAgICBuYW1lOiAnc2x1ZycsXG4gICAgICAgICAgICAgICAgdHlwZTogeyBraW5kOiAndGV4dCcgfSxcbiAgICAgICAgICAgICAgICBsYWJlbDogXygnY29tbW9uLnNsdWcnKSxcbiAgICAgICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ3NsdWcnLFxuICAgICAgICAgICAgfSxcbiAgICAgICAgXSlcbiAgICAgICAgLmFkZEZpbHRlcih7XG4gICAgICAgICAgICBuYW1lOiAnZmFjZXRWYWx1ZXMnLFxuICAgICAgICAgICAgdHlwZToge1xuICAgICAgICAgICAgICAgIGtpbmQ6ICdjdXN0b20nLFxuICAgICAgICAgICAgICAgIGNvbXBvbmVudDogRmFjZXRWYWx1ZUZvcm1JbnB1dENvbXBvbmVudCxcbiAgICAgICAgICAgICAgICBzZXJpYWxpemVWYWx1ZTogdmFsdWUgPT4gdmFsdWUubWFwKHYgPT4gdi5pZCkuam9pbignLCcpLFxuICAgICAgICAgICAgICAgIGRlc2VyaWFsaXplVmFsdWU6IHZhbHVlID0+IHZhbHVlLnNwbGl0KCcsJykubWFwKGlkID0+ICh7IGlkIH0pKSxcbiAgICAgICAgICAgICAgICBnZXRMYWJlbDogdmFsdWUgPT4ge1xuICAgICAgICAgICAgICAgICAgICBpZiAodmFsdWUubGVuZ3RoID09PSAwKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gJyc7XG4gICAgICAgICAgICAgICAgICAgIH1cbiAgICAgICAgICAgICAgICAgICAgaWYgKHZhbHVlWzBdLm5hbWUpIHtcbiAgICAgICAgICAgICAgICAgICAgICAgIHJldHVybiB2YWx1ZS5tYXAodiA9PiB2Lm5hbWUpLmpvaW4oJywgJyk7XG4gICAgICAgICAgICAgICAgICAgIH0gZWxzZSB7XG4gICAgICAgICAgICAgICAgICAgICAgICByZXR1cm4gbGFzdFZhbHVlRnJvbShcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB0aGlzLmRhdGFTZXJ2aWNlLmZhY2V0XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC5nZXRGYWNldFZhbHVlcyh7IGZpbHRlcjogeyBpZDogeyBpbjogdmFsdWUubWFwKHYgPT4gdi5pZCkgfSB9IH0pXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIC5tYXBTaW5nbGUoKHsgZmFjZXRWYWx1ZXMgfSkgPT5cbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZhY2V0VmFsdWVzLml0ZW1zLm1hcChmdiA9PiBmdi5uYW1lKS5qb2luKCcsICcpLFxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICApLFxuICAgICAgICAgICAgICAgICAgICAgICAgKTtcbiAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICB9LFxuICAgICAgICAgICAgbGFiZWw6IF8oJ2NhdGFsb2cuZmFjZXQtdmFsdWVzJyksXG4gICAgICAgICAgICB0b0ZpbHRlcklucHV0OiAodmFsdWU6IGFueVtdKSA9PiAoe1xuICAgICAgICAgICAgICAgIGZhY2V0VmFsdWVJZDoge1xuICAgICAgICAgICAgICAgICAgICBpbjogdmFsdWUubWFwKHYgPT4gdi5pZCksXG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgIH0pLFxuICAgICAgICB9KVxuICAgICAgICAuYWRkQ3VzdG9tRmllbGRGaWx0ZXJzKHRoaXMuY3VzdG9tRmllbGRzKVxuICAgICAgICAuY29ubmVjdFRvUm91dGUodGhpcy5yb3V0ZSk7XG5cbiAgICByZWFkb25seSBzb3J0cyA9IHRoaXMuY3JlYXRlU29ydENvbGxlY3Rpb24oKVxuICAgICAgICAuZGVmYXVsdFNvcnQoJ2NyZWF0ZWRBdCcsICdERVNDJylcbiAgICAgICAgLmFkZFNvcnRzKFtcbiAgICAgICAgICAgIHsgbmFtZTogJ2lkJyB9LFxuICAgICAgICAgICAgeyBuYW1lOiAnY3JlYXRlZEF0JyB9LFxuICAgICAgICAgICAgeyBuYW1lOiAndXBkYXRlZEF0JyB9LFxuICAgICAgICAgICAgeyBuYW1lOiAnbmFtZScgfSxcbiAgICAgICAgICAgIHsgbmFtZTogJ3NsdWcnIH0sXG4gICAgICAgIF0pXG4gICAgICAgIC5hZGRDdXN0b21GaWVsZFNvcnRzKHRoaXMuY3VzdG9tRmllbGRzKVxuICAgICAgICAuY29ubmVjdFRvUm91dGUodGhpcy5yb3V0ZSk7XG5cbiAgICBjb25zdHJ1Y3RvcihcbiAgICAgICAgcHJvdGVjdGVkIGRhdGFTZXJ2aWNlOiBEYXRhU2VydmljZSxcbiAgICAgICAgcHJpdmF0ZSBtb2RhbFNlcnZpY2U6IE1vZGFsU2VydmljZSxcbiAgICAgICAgcHJpdmF0ZSBub3RpZmljYXRpb25TZXJ2aWNlOiBOb3RpZmljYXRpb25TZXJ2aWNlLFxuICAgICAgICBwcml2YXRlIGpvYlF1ZXVlU2VydmljZTogSm9iUXVldWVTZXJ2aWNlLFxuICAgICkge1xuICAgICAgICBzdXBlcigpO1xuICAgICAgICB0aGlzLmNvbmZpZ3VyZSh7XG4gICAgICAgICAgICBkb2N1bWVudDogUHJvZHVjdExpc3RRdWVyeURvY3VtZW50LFxuICAgICAgICAgICAgZ2V0SXRlbXM6IGRhdGEgPT4gZGF0YS5wcm9kdWN0cyxcbiAgICAgICAgICAgIHNldFZhcmlhYmxlczogKHNraXAsIHRha2UpID0+IHtcbiAgICAgICAgICAgICAgICBjb25zdCBzZWFyY2hUZXJtID0gdGhpcy5zZWFyY2hUZXJtQ29udHJvbC52YWx1ZTtcbiAgICAgICAgICAgICAgICBsZXQgZmlsdGVySW5wdXQgPSB0aGlzLmZpbHRlcnMuY3JlYXRlRmlsdGVySW5wdXQoKTtcbiAgICAgICAgICAgICAgICBpZiAoc2VhcmNoVGVybSkge1xuICAgICAgICAgICAgICAgICAgICBmaWx0ZXJJbnB1dCA9IHtcbiAgICAgICAgICAgICAgICAgICAgICAgIG5hbWU6IHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcbiAgICAgICAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgICAgICAgICBza3U6IHtcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcbiAgICAgICAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgICAgIH07XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgIHJldHVybiB7XG4gICAgICAgICAgICAgICAgICAgIG9wdGlvbnM6IHtcbiAgICAgICAgICAgICAgICAgICAgICAgIHNraXAsXG4gICAgICAgICAgICAgICAgICAgICAgICB0YWtlLFxuICAgICAgICAgICAgICAgICAgICAgICAgZmlsdGVyOiB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgLi4uKGZpbHRlcklucHV0ID8/IHt9KSxcbiAgICAgICAgICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICAgICAgICAgICAgICBmaWx0ZXJPcGVyYXRvcjogc2VhcmNoVGVybSA/IExvZ2ljYWxPcGVyYXRvci5PUiA6IExvZ2ljYWxPcGVyYXRvci5BTkQsXG4gICAgICAgICAgICAgICAgICAgICAgICBzb3J0OiB0aGlzLnNvcnRzLmNyZWF0ZVNvcnRJbnB1dCgpLFxuICAgICAgICAgICAgICAgICAgICB9LFxuICAgICAgICAgICAgICAgIH07XG4gICAgICAgICAgICB9LFxuICAgICAgICAgICAgcmVmcmVzaExpc3RPbkNoYW5nZXM6IFt0aGlzLnNvcnRzLnZhbHVlQ2hhbmdlcywgdGhpcy5maWx0ZXJzLnZhbHVlQ2hhbmdlc10sXG4gICAgICAgIH0pO1xuICAgIH1cblxuICAgIHJlYnVpbGRTZWFyY2hJbmRleCgpIHtcbiAgICAgICAgdGhpcy5kYXRhU2VydmljZS5wcm9kdWN0LnJlaW5kZXgoKS5zdWJzY3JpYmUoKHsgcmVpbmRleCB9KSA9PiB7XG4gICAgICAgICAgICB0aGlzLm5vdGlmaWNhdGlvblNlcnZpY2UuaW5mbyhfKCdjYXRhbG9nLnJlaW5kZXhpbmcnKSk7XG4gICAgICAgICAgICB0aGlzLmpvYlF1ZXVlU2VydmljZS5hZGRKb2IocmVpbmRleC5pZCwgam9iID0+IHtcbiAgICAgICAgICAgICAgICBpZiAoam9iLnN0YXRlID09PSBKb2JTdGF0ZS5DT01QTEVURUQpIHtcbiAgICAgICAgICAgICAgICAgICAgY29uc3QgdGltZSA9IG5ldyBJbnRsLk51bWJlckZvcm1hdCgpLmZvcm1hdChqb2IuZHVyYXRpb24gfHwgMCk7XG4gICAgICAgICAgICAgICAgICAgIHRoaXMubm90aWZpY2F0aW9uU2VydmljZS5zdWNjZXNzKF8oJ2NhdGFsb2cucmVpbmRleC1zdWNjZXNzZnVsJyksIHtcbiAgICAgICAgICAgICAgICAgICAgICAgIGNvdW50OiBqb2IucmVzdWx0LmluZGV4ZWRJdGVtQ291bnQsXG4gICAgICAgICAgICAgICAgICAgICAgICB0aW1lLFxuICAgICAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5yZWZyZXNoKCk7XG4gICAgICAgICAgICAgICAgfSBlbHNlIHtcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5ub3RpZmljYXRpb25TZXJ2aWNlLmVycm9yKF8oJ2NhdGFsb2cucmVpbmRleC1lcnJvcicpKTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICB9KTtcbiAgICAgICAgfSk7XG4gICAgfVxuXG4gICAgZGVsZXRlUHJvZHVjdChwcm9kdWN0SWQ6IHN0cmluZykge1xuICAgICAgICB0aGlzLm1vZGFsU2VydmljZVxuICAgICAgICAgICAgLmRpYWxvZyh7XG4gICAgICAgICAgICAgICAgdGl0bGU6IF8oJ2NhdGFsb2cuY29uZmlybS1kZWxldGUtcHJvZHVjdCcpLFxuICAgICAgICAgICAgICAgIGJ1dHRvbnM6IFtcbiAgICAgICAgICAgICAgICAgICAgeyB0eXBlOiAnc2Vjb25kYXJ5JywgbGFiZWw6IF8oJ2NvbW1vbi5jYW5jZWwnKSB9LFxuICAgICAgICAgICAgICAgICAgICB7IHR5cGU6ICdkYW5nZXInLCBsYWJlbDogXygnY29tbW9uLmRlbGV0ZScpLCByZXR1cm5WYWx1ZTogdHJ1ZSB9LFxuICAgICAgICAgICAgICAgIF0sXG4gICAgICAgICAgICB9KVxuICAgICAgICAgICAgLnBpcGUoXG4gICAgICAgICAgICAgICAgc3dpdGNoTWFwKHJlc3BvbnNlID0+IChyZXNwb25zZSA/IHRoaXMuZGF0YVNlcnZpY2UucHJvZHVjdC5kZWxldGVQcm9kdWN0KHByb2R1Y3RJZCkgOiBFTVBUWSkpLFxuICAgICAgICAgICAgICAgIC8vIFNob3J0IGRlbGF5IHRvIGFsbG93IHRoZSBwcm9kdWN0IHRvIGJlIHJlbW92ZWQgZnJvbSB0aGUgc2VhcmNoIGluZGV4IGJlZm9yZVxuICAgICAgICAgICAgICAgIC8vIHJlZnJlc2hpbmcuXG4gICAgICAgICAgICAgICAgZGVsYXkoNTAwKSxcbiAgICAgICAgICAgIClcbiAgICAgICAgICAgIC5zdWJzY3JpYmUoXG4gICAgICAgICAgICAgICAgKCkgPT4ge1xuICAgICAgICAgICAgICAgICAgICB0aGlzLm5vdGlmaWNhdGlvblNlcnZpY2Uuc3VjY2VzcyhfKCdjb21tb24ubm90aWZ5LWRlbGV0ZS1zdWNjZXNzJyksIHtcbiAgICAgICAgICAgICAgICAgICAgICAgIGVudGl0eTogJ1Byb2R1Y3QnLFxuICAgICAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgICAgICAgICAgdGhpcy5yZWZyZXNoKCk7XG4gICAgICAgICAgICAgICAgfSxcbiAgICAgICAgICAgICAgICBlcnIgPT4ge1xuICAgICAgICAgICAgICAgICAgICB0aGlzLm5vdGlmaWNhdGlvblNlcnZpY2UuZXJyb3IoXygnY29tbW9uLm5vdGlmeS1kZWxldGUtZXJyb3InKSwge1xuICAgICAgICAgICAgICAgICAgICAgICAgZW50aXR5OiAnUHJvZHVjdCcsXG4gICAgICAgICAgICAgICAgICAgIH0pO1xuICAgICAgICAgICAgICAgIH0sXG4gICAgICAgICAgICApO1xuICAgIH1cbn1cbiIsIjx2ZHItcGFnZS1ibG9jaz5cclxuICAgIDx2ZHItYWN0aW9uLWJhcj5cclxuICAgICAgICA8dmRyLWFiLWxlZnQ+XHJcbiAgICAgICAgICAgIDx2ZHItbGFuZ3VhZ2Utc2VsZWN0b3JcclxuICAgICAgICAgICAgICAgIFthdmFpbGFibGVMYW5ndWFnZUNvZGVzXT1cImF2YWlsYWJsZUxhbmd1YWdlcyQgfCBhc3luY1wiXHJcbiAgICAgICAgICAgICAgICBbY3VycmVudExhbmd1YWdlQ29kZV09XCJjb250ZW50TGFuZ3VhZ2UkIHwgYXN5bmNcIlxyXG4gICAgICAgICAgICAgICAgKGxhbmd1YWdlQ29kZUNoYW5nZSk9XCJzZXRMYW5ndWFnZSgkZXZlbnQpXCJcclxuICAgICAgICAgICAgPjwvdmRyLWxhbmd1YWdlLXNlbGVjdG9yPlxyXG4gICAgICAgIDwvdmRyLWFiLWxlZnQ+XHJcbiAgICAgICAgPHZkci1hYi1yaWdodD5cclxuICAgICAgICAgICAgPHZkci1hY3Rpb24tYmFyLWl0ZW1zIFtsb2NhdGlvbklkXT1cInBhZ2VMb2NhdGlvbklkXCI+PC92ZHItYWN0aW9uLWJhci1pdGVtcz5cclxuICAgICAgICAgICAgPGFcclxuICAgICAgICAgICAgICAgIGNsYXNzPVwiYnV0dG9uIHByaW1hcnkgbXItMVwiXHJcbiAgICAgICAgICAgICAgICBbcm91dGVyTGlua109XCJbJy4vY3JlYXRlJ11cIlxyXG4gICAgICAgICAgICAgICAgKnZkcklmUGVybWlzc2lvbnM9XCJbJ0NyZWF0ZUNhdGFsb2cnLCAnQ3JlYXRlUHJvZHVjdCddXCJcclxuICAgICAgICAgICAgPlxyXG4gICAgICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwicGx1c1wiPjwvY2xyLWljb24+XHJcbiAgICAgICAgICAgICAgICB7eyAnY2F0YWxvZy5jcmVhdGUtbmV3LXByb2R1Y3QnIHwgdHJhbnNsYXRlIH19XHJcbiAgICAgICAgICAgIDwvYT5cclxuICAgICAgICAgICAgPHZkci1hY3Rpb24tYmFyLWRyb3Bkb3duLW1lbnUgW2Fsd2F5c1Nob3ddPVwidHJ1ZVwiIFtsb2NhdGlvbklkXT1cInBhZ2VMb2NhdGlvbklkXCI+XHJcbiAgICAgICAgICAgICAgICA8YnV0dG9uIHR5cGU9XCJidXR0b25cIiB2ZHJEcm9wZG93bkl0ZW0gKGNsaWNrKT1cInJlYnVpbGRTZWFyY2hJbmRleCgpXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwicmVmcmVzaFwiIGNsYXNzPVwiXCI+PC9jbHItaWNvbj5cclxuICAgICAgICAgICAgICAgICAgICB7eyAnY2F0YWxvZy5yZWJ1aWxkLXNlYXJjaC1pbmRleCcgfCB0cmFuc2xhdGUgfX1cclxuICAgICAgICAgICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICAgICAgICA8L3Zkci1hY3Rpb24tYmFyLWRyb3Bkb3duLW1lbnU+XHJcbiAgICAgICAgPC92ZHItYWItcmlnaHQ+XHJcbiAgICA8L3Zkci1hY3Rpb24tYmFyPlxyXG48L3Zkci1wYWdlLWJsb2NrPlxyXG48dmRyLWRhdGEtdGFibGUtMlxyXG4gICAgY2xhc3M9XCJtdC0yXCJcclxuICAgIFtpZF09XCJkYXRhVGFibGVMaXN0SWRcIlxyXG4gICAgW2l0ZW1zXT1cIml0ZW1zJCB8IGFzeW5jXCJcclxuICAgIFtpdGVtc1BlclBhZ2VdPVwiaXRlbXNQZXJQYWdlJCB8IGFzeW5jXCJcclxuICAgIFt0b3RhbEl0ZW1zXT1cInRvdGFsSXRlbXMkIHwgYXN5bmNcIlxyXG4gICAgW2N1cnJlbnRQYWdlXT1cImN1cnJlbnRQYWdlJCB8IGFzeW5jXCJcclxuICAgIFtmaWx0ZXJzXT1cImZpbHRlcnNcIlxyXG4gICAgKHBhZ2VDaGFuZ2UpPVwic2V0UGFnZU51bWJlcigkZXZlbnQpXCJcclxuICAgIChpdGVtc1BlclBhZ2VDaGFuZ2UpPVwic2V0SXRlbXNQZXJQYWdlKCRldmVudClcIlxyXG4gICAgKHZpc2libGVDb2x1bW5zQ2hhbmdlKT1cInNldFZpc2libGVDb2x1bW5zKCRldmVudClcIlxyXG4+XHJcbiAgICA8dmRyLWJ1bGstYWN0aW9uLW1lbnVcclxuICAgICAgICBbbG9jYXRpb25JZF09XCJkYXRhVGFibGVMaXN0SWRcIlxyXG4gICAgICAgIFtob3N0Q29tcG9uZW50XT1cInRoaXNcIlxyXG4gICAgICAgIFtzZWxlY3Rpb25NYW5hZ2VyXT1cInNlbGVjdGlvbk1hbmFnZXJcIlxyXG4gICAgPjwvdmRyLWJ1bGstYWN0aW9uLW1lbnU+XHJcbiAgICA8dmRyLWR0Mi1zZWFyY2hcclxuICAgICAgICBbc2VhcmNoVGVybUNvbnRyb2xdPVwic2VhcmNoVGVybUNvbnRyb2xcIlxyXG4gICAgICAgIFtzZWFyY2hUZXJtUGxhY2Vob2xkZXJdPVwiJ3NldHRpbmdzLnNlYXJjaC1ieS1wcm9kdWN0LW5hbWUtb3Itc2t1JyB8IHRyYW5zbGF0ZVwiXHJcbiAgICAvPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uaWQnIHwgdHJhbnNsYXRlXCIgaWQ9XCJpZFwiIFtoaWRkZW5CeURlZmF1bHRdPVwidHJ1ZVwiIFtzb3J0XT1cInNvcnRzLmdldCgnaWQnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgcHJvZHVjdC5pZCB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uXHJcbiAgICAgICAgW2hlYWRpbmddPVwiJ2NvbW1vbi5jcmVhdGVkLWF0JyB8IHRyYW5zbGF0ZVwiIGlkPVwiY3JlYXRlZC1hdFwiXHJcbiAgICAgICAgW2hpZGRlbkJ5RGVmYXVsdF09XCJ0cnVlXCJcclxuICAgICAgICBbc29ydF09XCJzb3J0cy5nZXQoJ2NyZWF0ZWRBdCcpXCJcclxuICAgID5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IHByb2R1Y3QuY3JlYXRlZEF0IHwgbG9jYWxlRGF0ZSA6ICdzaG9ydCcgfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtblxyXG4gICAgICAgIFtoZWFkaW5nXT1cIidjb21tb24udXBkYXRlZC1hdCcgfCB0cmFuc2xhdGVcIiBpZD1cInVwZGF0ZWQtYXRcIlxyXG4gICAgICAgIFtoaWRkZW5CeURlZmF1bHRdPVwidHJ1ZVwiXHJcbiAgICAgICAgW3NvcnRdPVwic29ydHMuZ2V0KCd1cGRhdGVkQXQnKVwiXHJcbiAgICA+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1wcm9kdWN0PVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBwcm9kdWN0LnVwZGF0ZWRBdCB8IGxvY2FsZURhdGUgOiAnc2hvcnQnIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ2NvbW1vbi5pbWFnZScgfCB0cmFuc2xhdGVcIiBpZD1cImltYWdlXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1wcm9kdWN0PVwiaXRlbVwiPlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaW1hZ2UtcGxhY2Vob2xkZXJcIj5cclxuICAgICAgICAgICAgICAgIDxpbWdcclxuICAgICAgICAgICAgICAgICAgICAqbmdJZj1cInByb2R1Y3QuZmVhdHVyZWRBc3NldCBhcyBhc3NldDsgZWxzZSBpbWFnZVBsYWNlaG9sZGVyXCJcclxuICAgICAgICAgICAgICAgICAgICBbc3JjXT1cImFzc2V0IHwgYXNzZXRQcmV2aWV3IDogJ3RpbnknXCJcclxuICAgICAgICAgICAgICAgIC8+XHJcbiAgICAgICAgICAgICAgICA8bmctdGVtcGxhdGUgI2ltYWdlUGxhY2Vob2xkZXI+XHJcbiAgICAgICAgICAgICAgICAgICAgPGRpdiBjbGFzcz1cInBsYWNlaG9sZGVyXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIDxjbHItaWNvbiBzaGFwZT1cImltYWdlXCIgc2l6ZT1cIjQ4XCI+PC9jbHItaWNvbj5cclxuICAgICAgICAgICAgICAgICAgICA8L2Rpdj5cclxuICAgICAgICAgICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjYXRhbG9nLm5hbWUnIHwgdHJhbnNsYXRlXCIgaWQ9XCJuYW1lXCIgW29wdGlvbmFsXT1cImZhbHNlXCIgW3NvcnRdPVwic29ydHMuZ2V0KCduYW1lJylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LXByb2R1Y3Q9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIDxhIGNsYXNzPVwiYnV0dG9uLWdob3N0XCIgW3JvdXRlckxpbmtdPVwiWycuLycsIHByb2R1Y3QuaWRdXCJcclxuICAgICAgICAgICAgICAgID48c3Bhbj57eyBwcm9kdWN0Lm5hbWUgfX08L3NwYW5cclxuICAgICAgICAgICAgICAgID48Y2xyLWljb24gc2hhcGU9XCJhcnJvdyByaWdodFwiXHJcbiAgICAgICAgICAgIC8+PC9hPlxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uc2x1ZycgfCB0cmFuc2xhdGVcIiBpZD1cInNsdWdcIiBbc29ydF09XCJzb3J0cy5nZXQoJ3NsdWcnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgcHJvZHVjdC5zbHVnIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ2NvbW1vbi5lbmFibGVkJyB8IHRyYW5zbGF0ZVwiIGlkPVwiZW5hYmxlZFwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAgPHZkci1jaGlwICpuZ0lmPVwicHJvZHVjdC5lbmFibGVkXCIgY29sb3JUeXBlPVwic3VjY2Vzc1wiPnt7XHJcbiAgICAgICAgICAgICAgICAnY29tbW9uLmVuYWJsZWQnIHwgdHJhbnNsYXRlXHJcbiAgICAgICAgICAgIH19PC92ZHItY2hpcD5cclxuICAgICAgICAgICAgPHZkci1jaGlwICpuZ0lmPVwiIXByb2R1Y3QuZW5hYmxlZFwiIGNvbG9yVHlwZT1cIndhcm5pbmdcIj57e1xyXG4gICAgICAgICAgICAgICAgJ2NvbW1vbi5kaXNhYmxlZCcgfCB0cmFuc2xhdGVcclxuICAgICAgICAgICAgfX08L3Zkci1jaGlwPlxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjYXRhbG9nLm51bWJlci1vZi12YXJpYW50cycgfCB0cmFuc2xhdGVcIiBpZD1cIm51bWJlci1vZi12YXJpYW50c1wiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtcHJvZHVjdD1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgJ2NhdGFsb2cudmFyaWFudC1jb3VudCcgfCB0cmFuc2xhdGUgOiB7IGNvdW50OiBwcm9kdWN0LnZhcmlhbnRMaXN0Py50b3RhbEl0ZW1zIH0gfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWN1c3RvbS1maWVsZC1jb2x1bW5cclxuICAgICAgICAqbmdGb3I9XCJsZXQgY3VzdG9tRmllbGQgb2YgY3VzdG9tRmllbGRzXCJcclxuICAgICAgICBbY3VzdG9tRmllbGRdPVwiY3VzdG9tRmllbGRcIlxyXG4gICAgICAgIFtzb3J0c109XCJzb3J0c1wiXHJcbiAgICAvPlxyXG48L3Zkci1kYXRhLXRhYmxlLTI+XHJcbiJdfQ==

package/esm2022/catalog/components/product-options-editor/product-options-editor.component.mjs CHANGED Viewed

@@ -198,7 +198,7 @@ export class ProductOptionsEditorComponent extends BaseDetailComponent {
         return optionForm;
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductOptionsEditorComponent, deps: [{ token: i1.ActivatedRoute }, { token: i1.Router }, { token: i2.ServerConfigService }, { token: i2.DataService }, { token: i2.PermissionsService }, { token: i3.ProductDetailService }, { token: i4.UntypedFormBuilder }, { token: i0.ChangeDetectorRef }, { token: i2.NotificationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductOptionsEditorComponent, selector: "vdr-product-options-editor", usesInheritance: true, ngImport: i0, template: "<vdr-page-header>\r\n    <vdr-page-title></vdr-page-title>\r\n    <vdr-page-header-description>{{ 'catalog.page-description-options-editor' | translate }}</vdr-page-header-description>\r\n</vdr-page-header>\r\n<vdr-page-body>\r\n    <vdr-page-block>\r\n        <vdr-action-bar>\r\n            <vdr-ab-left>\r\n                <vdr-language-selector\r\n                    [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                    [currentLanguageCode]=\"languageCode$ | async\"\r\n                    (languageCodeChange)=\"setLanguage($event)\"\r\n                ></vdr-language-selector>\r\n            </vdr-ab-left>\r\n\r\n            <vdr-ab-right>\r\n                <div class=\"flex center\">\r\n                    <div class=\"mr-2\">\r\n                        <clr-checkbox-wrapper>\r\n                            <input\r\n                                clrCheckbox\r\n                                type=\"checkbox\"\r\n                                id=\"auto-update\"\r\n                                [(ngModel)]=\"autoUpdateVariantNames\"\r\n                            />\r\n                            <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n                        </clr-checkbox-wrapper>\r\n                    </div>\r\n                    <button\r\n                        *vdrIfPermissions=\"updatePermission\"\r\n                        class=\"btn btn-primary\"\r\n                        (click)=\"save()\"\r\n                        [disabled]=\"detailForm.pristine || detailForm.invalid\"\r\n                    >\r\n                        {{ 'common.update' | translate }}\r\n                    </button>\r\n                </div>\r\n            </vdr-ab-right>\r\n        </vdr-action-bar>\r\n    </vdr-page-block>\r\n    <vdr-page-block>\r\n        <form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\r\n            <div formGroupName=\"optionGroups\">\r\n                <vdr-card\r\n                    *ngFor=\"let optionGroup of getOptionGroups(); index as i\"\r\n                    [formArrayName]=\"i\"\r\n                    [title]=\"optionGroup.value.code\"\r\n                >\r\n                    <vdr-page-entity-info [entity]=\"optionGroup.value\"></vdr-page-entity-info>\r\n                    <div class=\"form-grid\">\r\n                        <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\r\n                            <input\r\n                                [id]=\"'name-' + i\"\r\n                                type=\"text\"\r\n                                formControlName=\"name\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            />\r\n                        </vdr-form-field>\r\n                        <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\r\n                            <input\r\n                                [id]=\"'code-' + i\"\r\n                                type=\"text\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                formControlName=\"code\"\r\n                            />\r\n                        </vdr-form-field>\r\n                    </div>\r\n                    <ng-container formGroupName=\"customFields\" *ngIf=\"optionGroupCustomFields.length\">\r\n                        <vdr-tabbed-custom-fields\r\n                            entityName=\"ProductOptionGroup\"\r\n                            [customFields]=\"optionGroupCustomFields\"\r\n                            [customFieldsFormGroup]=\"optionGroup.get('customFields')\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        ></vdr-tabbed-custom-fields>\r\n                    </ng-container>\r\n\r\n                    <vdr-data-table-2\r\n                        id=\"edit-options-list\"\r\n                        *ngIf=\"getOptions(optionGroup) as options\"\r\n                        [items]=\"options\"\r\n                        [itemsPerPage]=\"paginationSettings[optionGroup.value.id]?.itemsPerPage\"\r\n                        [currentPage]=\"paginationSettings[optionGroup.value.id]?.currentPage\"\r\n                        (pageChange)=\"paginationSettings[optionGroup.value.id].currentPage = $event\"\r\n                        [totalItems]=\"options.length\"\r\n                    >\r\n                        <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.id }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.createdAt | localeDate : 'short' }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.updatedAt | localeDate : 'short' }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <input\r\n                                    type=\"text\"\r\n                                    [formControl]=\"optionControl.get('name')\"\r\n                                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                />\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\" [optional]=\"false\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <input type=\"text\" [formControl]=\"optionControl.get('code')\" />\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column\r\n                            [heading]=\"'common.custom-fields' | translate\" id=\"custom-fields\"\r\n                            [hiddenByDefault]=\"optionCustomFields.length === 0\"\r\n                        >\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <vdr-tabbed-custom-fields\r\n                                    entityName=\"ProductOption\"\r\n                                    [customFields]=\"optionCustomFields\"\r\n                                    [compact]=\"true\"\r\n                                    [customFieldsFormGroup]=\"optionControl.get('customFields')\"\r\n                                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                ></vdr-tabbed-custom-fields>\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                    </vdr-data-table-2>\r\n                </vdr-card>\r\n            </div>\r\n        </form>\r\n    </vdr-page-block>\r\n</vdr-page-body>\r\n", styles: [".option-group-header{display:flex;align-items:baseline}\n"], dependencies: [{ kind: "directive", type: i5.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i5.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i5.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.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: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i2.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i2.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i2.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i2.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i2.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i2.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i2.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i2.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i2.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i2.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i2.PageHeaderComponent, selector: "vdr-page-header" }, { kind: "component", type: i2.PageTitleComponent, selector: "vdr-page-title", inputs: ["title"] }, { kind: "component", type: i2.PageHeaderDescriptionComponent, selector: "vdr-page-header-description" }, { kind: "component", type: i2.PageBodyComponent, selector: "vdr-page-body" }, { kind: "component", type: i2.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i2.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i2.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i2.LocaleDatePipe, name: "localeDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductOptionsEditorComponent, selector: "vdr-product-options-editor", usesInheritance: true, ngImport: i0, template: "<vdr-page-header>\r\n    <vdr-page-title></vdr-page-title>\r\n    <vdr-page-header-description>{{ 'catalog.page-description-options-editor' | translate }}</vdr-page-header-description>\r\n</vdr-page-header>\r\n<vdr-page-body>\r\n    <vdr-page-block>\r\n        <vdr-action-bar>\r\n            <vdr-ab-left>\r\n                <vdr-language-selector\r\n                    [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                    [currentLanguageCode]=\"languageCode$ | async\"\r\n                    (languageCodeChange)=\"setLanguage($event)\"\r\n                ></vdr-language-selector>\r\n            </vdr-ab-left>\r\n\r\n            <vdr-ab-right>\r\n                <div class=\"flex center\">\r\n                    <div class=\"mr-2\">\r\n                        <clr-checkbox-wrapper>\r\n                            <input\r\n                                clrCheckbox\r\n                                type=\"checkbox\"\r\n                                id=\"auto-update\"\r\n                                [(ngModel)]=\"autoUpdateVariantNames\"\r\n                            />\r\n                            <label>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n                        </clr-checkbox-wrapper>\r\n                    </div>\r\n                    <button\r\n                        *vdrIfPermissions=\"updatePermission\"\r\n                        class=\"btn btn-primary\"\r\n                        (click)=\"save()\"\r\n                        [disabled]=\"detailForm.pristine || detailForm.invalid\"\r\n                    >\r\n                        {{ 'common.update' | translate }}\r\n                    </button>\r\n                </div>\r\n            </vdr-ab-right>\r\n        </vdr-action-bar>\r\n    </vdr-page-block>\r\n    <vdr-page-block>\r\n        <form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\r\n            <div formGroupName=\"optionGroups\">\r\n                <vdr-card\r\n                    *ngFor=\"let optionGroup of getOptionGroups(); index as i\"\r\n                    [formArrayName]=\"i\"\r\n                    [title]=\"optionGroup.value.code\"\r\n                >\r\n                    <vdr-page-entity-info [entity]=\"optionGroup.value\"></vdr-page-entity-info>\r\n                    <div class=\"form-grid\">\r\n                        <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\r\n                            <input\r\n                                [id]=\"'name-' + i\"\r\n                                type=\"text\"\r\n                                formControlName=\"name\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            />\r\n                        </vdr-form-field>\r\n                        <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\r\n                            <input\r\n                                [id]=\"'code-' + i\"\r\n                                type=\"text\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                formControlName=\"code\"\r\n                            />\r\n                        </vdr-form-field>\r\n                    </div>\r\n                    <ng-container formGroupName=\"customFields\" *ngIf=\"optionGroupCustomFields.length\">\r\n                        <vdr-tabbed-custom-fields\r\n                            entityName=\"ProductOptionGroup\"\r\n                            [customFields]=\"optionGroupCustomFields\"\r\n                            [customFieldsFormGroup]=\"optionGroup.get('customFields')\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        ></vdr-tabbed-custom-fields>\r\n                    </ng-container>\r\n\r\n                    <vdr-data-table-2\r\n                        id=\"edit-options-list\"\r\n                        *ngIf=\"getOptions(optionGroup) as options\"\r\n                        [items]=\"options\"\r\n                        [itemsPerPage]=\"paginationSettings[optionGroup.value.id]?.itemsPerPage\"\r\n                        [currentPage]=\"paginationSettings[optionGroup.value.id]?.currentPage\"\r\n                        (pageChange)=\"paginationSettings[optionGroup.value.id].currentPage = $event\"\r\n                        [totalItems]=\"options.length\"\r\n                    >\r\n                        <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.id }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.createdAt | localeDate : 'short' }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                {{ optionControl.value.updatedAt | localeDate : 'short' }}\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.name' | translate\" id=\"name\" [optional]=\"false\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <input\r\n                                    type=\"text\"\r\n                                    [formControl]=\"optionControl.get('name')\"\r\n                                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                />\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column [heading]=\"'common.code' | translate\" id=\"code\" [optional]=\"false\">\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <input type=\"text\" [formControl]=\"optionControl.get('code')\" />\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                        <vdr-dt2-column\r\n                            [heading]=\"'common.custom-fields' | translate\" id=\"custom-fields\"\r\n                            [hiddenByDefault]=\"optionCustomFields.length === 0\"\r\n                        >\r\n                            <ng-template let-optionControl=\"item\">\r\n                                <vdr-tabbed-custom-fields\r\n                                    entityName=\"ProductOption\"\r\n                                    [customFields]=\"optionCustomFields\"\r\n                                    [compact]=\"true\"\r\n                                    [customFieldsFormGroup]=\"optionControl.get('customFields')\"\r\n                                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                ></vdr-tabbed-custom-fields>\r\n                            </ng-template>\r\n                        </vdr-dt2-column>\r\n                    </vdr-data-table-2>\r\n                </vdr-card>\r\n            </div>\r\n        </form>\r\n    </vdr-page-block>\r\n</vdr-page-body>\r\n", styles: [".option-group-header{display:flex;align-items:baseline}\n"], dependencies: [{ kind: "directive", type: i5.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i5.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i5.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i6.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i6.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i4.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: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i4.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i4.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i4.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }, { kind: "directive", type: i4.FormArrayName, selector: "[formArrayName]", inputs: ["formArrayName"] }, { kind: "component", type: i2.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i2.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i2.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i2.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i2.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i2.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "directive", type: i2.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i2.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i2.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i2.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i2.PageHeaderComponent, selector: "vdr-page-header" }, { kind: "component", type: i2.PageTitleComponent, selector: "vdr-page-title", inputs: ["title"] }, { kind: "component", type: i2.PageHeaderDescriptionComponent, selector: "vdr-page-header-description" }, { kind: "component", type: i2.PageBodyComponent, selector: "vdr-page-body" }, { kind: "component", type: i2.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i2.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i2.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i2.LocaleDatePipe, name: "localeDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductOptionsEditorComponent, decorators: [{
             type: Component,

package/esm2022/catalog/components/product-variant-detail/product-variant-detail.component.mjs CHANGED Viewed

@@ -258,7 +258,7 @@ export class ProductVariantDetailComponent extends TypedBaseDetailComponent {
         };
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantDetailComponent, deps: [{ token: i1.ProductDetailService }, { token: i2.FormBuilder }, { token: i3.ModalService }, { token: i3.NotificationService }, { token: i3.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantDetailComponent, selector: "vdr-product-variant-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left [grow]=\"true\">\r\n            <div class=\"flex center\">\r\n                <ng-container *ngIf=\"availableLanguages$ | async as availableLanguages\">\r\n                    <vdr-language-selector\r\n                        *ngIf=\"availableLanguages.length > 1\"\r\n                        class=\"mr-2\"\r\n                        [disabled]=\"isNew$ | async\"\r\n                        [availableLanguageCodes]=\"availableLanguages\"\r\n                        [currentLanguageCode]=\"languageCode$ | async\"\r\n                        (languageCodeChange)=\"setLanguage($event)\"\r\n                    ></vdr-language-selector>\r\n                </ng-container>\r\n                <vdr-product-variant-quick-jump [productId]=\"entity?.product.id\" />\r\n            </div>\r\n        </vdr-ab-left>\r\n\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"product-variant-detail\"></vdr-action-bar-items>\r\n            <button\r\n                *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"\r\n                    (detailForm.invalid ||\r\n                        stockLevelsForm.invalid ||\r\n                        pricesForm.invalid ||\r\n                        (detailForm.pristine && stockLevelsForm.pristine && pricesForm.pristine)) &&\r\n                    !assetsChanged()\r\n                \"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n            <vdr-action-bar-dropdown-menu locationId=\"product-variant-detail\"></vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as variant\">\r\n    <vdr-page-detail-layout>\r\n        <vdr-page-detail-sidebar\r\n            ><vdr-card>\r\n                <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n                    <clr-toggle-wrapper *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\">\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrToggle\r\n                            name=\"enabled\"\r\n                            [formControl]=\"detailForm.get(['enabled'])\"\r\n                        />\r\n                        <label>{{ 'common.enabled' | translate }}</label>\r\n                    </clr-toggle-wrapper>\r\n                </vdr-form-field>\r\n            </vdr-card>\r\n            <vdr-card *ngIf=\"variant.options.length\" [title]=\"'catalog.product-options' | translate\">\r\n                <div class=\"options\">\r\n                    <vdr-chip\r\n                        *ngFor=\"let option of variant.options | sort : 'groupId'\"\r\n                        [colorFrom]=\"optionGroupCode(option.groupId)\"\r\n                        [invert]=\"true\"\r\n                    >\r\n                        <span>{{ optionGroupCode(option.groupId) }}:</span>\r\n                        {{ optionName(option) }}\r\n                    </vdr-chip>\r\n                </div>\r\n                <div>\r\n                    <a\r\n                        [routerLink]=\"['../../', 'options']\"\r\n                        class=\"button-small mt-2\"\r\n                        *vdrIfPermissions=\"updatePermissions\"\r\n                    >\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'catalog.edit-options' | translate }}\r\n                    </a>\r\n                </div>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.facets' | translate\">\r\n                <div class=\"facets\">\r\n                    <vdr-facet-value-chip\r\n                        *ngFor=\"let facetValue of facetValues$ | async\"\r\n                        [facetValue]=\"facetValue\"\r\n                        [removable]=\"updatePermissions | hasPermission\"\r\n                        (remove)=\"removeFacetValue(facetValue.id)\"\r\n                    ></vdr-facet-value-chip>\r\n                </div>\r\n                <div>\r\n                    <button\r\n                        class=\"button-small mt-2\"\r\n                        *vdrIfPermissions=\"updatePermissions\"\r\n                        (click)=\"selectFacetValue()\"\r\n                    >\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'catalog.add-facets' | translate }}\r\n                    </button>\r\n                </div>\r\n            </vdr-card>\r\n\r\n            <vdr-card>\r\n                <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\r\n            </vdr-card>\r\n        </vdr-page-detail-sidebar>\r\n\r\n        <vdr-page-block>\r\n            <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n            <vdr-card>\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\r\n                        <input\r\n                            id=\"name\"\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                    <vdr-form-field [label]=\"'catalog.sku' | translate\" for=\"sku\">\r\n                        <input\r\n                            id=\"sku\"\r\n                            type=\"text\"\r\n                            formControlName=\"sku\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                </div>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n                <vdr-tabbed-custom-fields\r\n                    entityName=\"ProductVariant\"\r\n                    [customFields]=\"customFields\"\r\n                    [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n                    [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                />\r\n            </vdr-card>\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"product-variant-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            />\r\n            <vdr-card [title]=\"'catalog.assets' | translate\">\r\n                <vdr-assets\r\n                    [assets]=\"assetChanges.assets || variant.assets\"\r\n                    [featuredAsset]=\"assetChanges.featuredAsset || variant.featuredAsset\"\r\n                    [updatePermissions]=\"updatePermissions\"\r\n                    (change)=\"assetChanges = $event\"\r\n                />\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.price-and-tax' | translate\">\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field [label]=\"'catalog.tax-category' | translate\" for=\"taxCategory\">\r\n                        <select name=\"taxCategory\" formControlName=\"taxCategoryId\">\r\n                            <option\r\n                                *ngFor=\"let taxCategory of taxCategories$ | async\"\r\n                                [value]=\"taxCategory.id\"\r\n                            >\r\n                                {{ taxCategory.name }}\r\n                            </option>\r\n                        </select>\r\n                    </vdr-form-field>\r\n                </div>\r\n                <div class=\"form-grid prices\" *ngFor=\"let price of pricesForm.controls\" [formGroup]=\"price\">\r\n                    <vdr-form-field\r\n                        [label]=\"\r\n                            ('catalog.price' | translate) +\r\n                            (1 < pricesForm.length ? ' (' + price.value.currencyCode + ')' : '')\r\n                        \"\r\n                        [tooltip]=\"\r\n                            1 < pricesForm.length && price.value.currencyCode === channelDefaultCurrencyCode\r\n                                ? ('catalog.default-currency' | translate)\r\n                                : undefined\r\n                        \"\r\n                        for=\"price\"\r\n                    >\r\n                        <div class=\"price-wrapper\" [class.pending-deletion]=\"price.value.delete === true\">\r\n                            <vdr-currency-input\r\n                                name=\"price\"\r\n                                [currencyCode]=\"price.value.currencyCode\"\r\n                                [readonly]=\"\r\n                                    !(updatePermissions | hasPermission) || price.value.delete === true\r\n                                \"\r\n                                formControlName=\"price\"\r\n                            />\r\n                            <div *ngIf=\"1 < pricesForm.controls.length\">\r\n                                <button\r\n                                    class=\"button-small delete-button\"\r\n                                    [disabled]=\"price.value.currencyCode === channelDefaultCurrencyCode\"\r\n                                    (click)=\"toggleDeletePrice(price.get('delete'))\"\r\n                                >\r\n                                    <clr-icon shape=\"trash\"></clr-icon>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n                    </vdr-form-field>\r\n                    <vdr-variant-price-detail\r\n                        [price]=\"price.value.price\"\r\n                        [currencyCode]=\"price.value.currencyCode\"\r\n                        [priceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [taxCategoryId]=\"detailForm.get('taxCategoryId')!.value\"\r\n                    />\r\n                </div>\r\n                <vdr-variant-price-strategy-detail\r\n                    [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                    [channelDefaultCurrencyCode]=\"channelDefaultCurrencyCode\"\r\n                    [variant]=\"variant\"\r\n                />\r\n                <ng-container *ngIf=\"unusedCurrencyCodes$ | async as unusedCurrencyCodes\">\r\n                    <div *ngIf=\"unusedCurrencyCodes.length\">\r\n                        <vdr-dropdown>\r\n                            <button class=\"button mt-2\" vdrDropdownTrigger>\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-price-in-another-currency' | translate }}\r\n                                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu>\r\n                                <button\r\n                                    vdrDropdownItem\r\n                                    *ngFor=\"let currencyCode of unusedCurrencyCodes\"\r\n                                    (click)=\"addPriceInCurrency(currencyCode)\"\r\n                                >\r\n                                    {{ currencyCode | localeCurrencyName }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </div>\r\n                </ng-container>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.stock-levels' | translate\">\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field\r\n                        for=\"track-inventory\"\r\n                        [label]=\"'catalog.track-inventory' | translate\"\r\n                        [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\r\n                    >\r\n                        <select\r\n                            name=\"track-inventory\"\r\n                            formControlName=\"trackInventory\"\r\n                            [disabled]=\"!(updatePermissions | hasPermission)\"\r\n                        >\r\n                            <option [value]=\"GlobalFlag.TRUE\">\r\n                                {{ 'catalog.track-inventory-true' | translate }}\r\n                            </option>\r\n                            <option [value]=\"GlobalFlag.FALSE\">\r\n                                {{ 'catalog.track-inventory-false' | translate }}\r\n                            </option>\r\n                            <option [value]=\"GlobalFlag.INHERIT\">\r\n                                {{ 'catalog.track-inventory-inherit' | translate }}\r\n                            </option>\r\n                        </select>\r\n                    </vdr-form-field>\r\n\r\n                    <vdr-form-item\r\n                        [label]=\"'catalog.out-of-stock-threshold' | translate\"\r\n                        [tooltip]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\r\n                    >\r\n                        <input\r\n                            type=\"number\"\r\n                            formControlName=\"outOfStockThreshold\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                            [vdrDisabled]=\"\r\n                                detailForm.get('useGlobalOutOfStockThreshold')?.value !== false ||\r\n                                inventoryIsNotTracked(detailForm)\r\n                            \"\r\n                        />\r\n                        <clr-toggle-wrapper>\r\n                            <input\r\n                                type=\"checkbox\"\r\n                                clrToggle\r\n                                name=\"useGlobalOutOfStockThreshold\"\r\n                                formControlName=\"useGlobalOutOfStockThreshold\"\r\n                                [vdrDisabled]=\"\r\n                                    !(updatePermissions | hasPermission) || inventoryIsNotTracked(detailForm)\r\n                                \"\r\n                            />\r\n                            <label\r\n                                >{{ 'catalog.use-global-value' | translate }} ({{\r\n                                    globalOutOfStockThreshold\r\n                                }})</label\r\n                            >\r\n                        </clr-toggle-wrapper>\r\n                    </vdr-form-item>\r\n                </div>\r\n                <div\r\n                    class=\"form-grid stock-levels\"\r\n                    *ngFor=\"let stockLevel of stockLevelsForm.controls\"\r\n                    [formGroup]=\"stockLevel\"\r\n                >\r\n                    <vdr-form-field\r\n                        [label]=\"\r\n                            stockLevel.get('stockLocationName')?.value +\r\n                            ': ' +\r\n                            ('catalog.stock-on-hand' | translate)\r\n                        \"\r\n                        [for]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\r\n                    >\r\n                        <input\r\n                            [id]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\r\n                            type=\"number\"\r\n                            formControlName=\"stockOnHand\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                    <vdr-form-item\r\n                        [label]=\"\r\n                            stockLevel.get('stockLocationName')?.value +\r\n                            ': ' +\r\n                            ('catalog.stock-allocated' | translate)\r\n                        \"\r\n                    >\r\n                        {{ stockLevel.get('stockAllocated')?.value }}\r\n                    </vdr-form-item>\r\n                </div>\r\n                <ng-container *ngIf=\"unusedStockLocation$ | async as unusedStockLocations\">\r\n                    <div *ngIf=\"unusedStockLocations.length\">\r\n                        <vdr-dropdown>\r\n                            <button class=\"button mt-2\" vdrDropdownTrigger>\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-stock-location' | translate }}\r\n                                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu>\r\n                                <button\r\n                                    vdrDropdownItem\r\n                                    *ngFor=\"let stockLocation of unusedStockLocations\"\r\n                                    (click)=\"addStockLocation(stockLocation)\"\r\n                                >\r\n                                    <clr-icon shape=\"map-marker\"></clr-icon> {{ stockLocation.name }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </div>\r\n                </ng-container>\r\n            </vdr-card>\r\n        </vdr-page-block>\r\n    </vdr-page-detail-layout>\r\n</form>\r\n", styles: [".facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-product-variant-quick-jump{flex:1;margin-inline-end:calc(var(--space-unit) * 2)}.stock-levels,.prices{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}.price-wrapper{display:flex;align-items:center;gap:var(--space-unit);width:100%}.price-wrapper.pending-deletion vdr-currency-input{opacity:.7}.price-wrapper.pending-deletion .delete-button{background-color:var(--color-error-700);color:var(--color-error-100)}\n"], dependencies: [{ kind: "directive", type: i4.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i4.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i4.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i6.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i3.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i3.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i3.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i3.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions"], outputs: ["change"] }, { kind: "component", type: i3.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i3.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i3.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i3.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i3.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i3.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i3.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i3.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i3.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i3.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i3.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i3.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i3.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i3.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i3.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i3.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i3.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i3.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i3.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i3.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i3.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: i7.VariantPriceDetailComponent, selector: "vdr-variant-price-detail", inputs: ["priceIncludesTax", "price", "currencyCode", "taxCategoryId"] }, { kind: "component", type: i8.VariantPriceStrategyDetailComponent, selector: "vdr-variant-price-strategy-detail", inputs: ["channelPriceIncludesTax", "variant", "channelDefaultCurrencyCode"] }, { kind: "component", type: i9.ProductVariantQuickJumpComponent, selector: "vdr-product-variant-quick-jump", inputs: ["productId"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }, { kind: "pipe", type: i3.LocaleCurrencyNamePipe, name: "localeCurrencyName" }, { kind: "pipe", type: i3.SortPipe, name: "sort" }, { kind: "pipe", type: i3.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantDetailComponent, selector: "vdr-product-variant-detail", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-left [grow]=\"true\">\r\n            <div class=\"flex center\">\r\n                <ng-container *ngIf=\"availableLanguages$ | async as availableLanguages\">\r\n                    <vdr-language-selector\r\n                        *ngIf=\"availableLanguages.length > 1\"\r\n                        class=\"mr-2\"\r\n                        [disabled]=\"isNew$ | async\"\r\n                        [availableLanguageCodes]=\"availableLanguages\"\r\n                        [currentLanguageCode]=\"languageCode$ | async\"\r\n                        (languageCodeChange)=\"setLanguage($event)\"\r\n                    ></vdr-language-selector>\r\n                </ng-container>\r\n                <vdr-product-variant-quick-jump [productId]=\"entity?.product.id\" />\r\n            </div>\r\n        </vdr-ab-left>\r\n\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"product-variant-detail\"></vdr-action-bar-items>\r\n            <button\r\n                *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"\r\n                    (detailForm.invalid ||\r\n                        stockLevelsForm.invalid ||\r\n                        pricesForm.invalid ||\r\n                        (detailForm.pristine && stockLevelsForm.pristine && pricesForm.pristine)) &&\r\n                    !assetsChanged()\r\n                \"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n            <vdr-action-bar-dropdown-menu locationId=\"product-variant-detail\"></vdr-action-bar-dropdown-menu>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as variant\">\r\n    <vdr-page-detail-layout>\r\n        <vdr-page-detail-sidebar\r\n            ><vdr-card>\r\n                <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n                    <clr-toggle-wrapper *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\">\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrToggle\r\n                            name=\"enabled\"\r\n                            [formControl]=\"detailForm.get(['enabled'])\"\r\n                        />\r\n                        <label>{{ 'common.enabled' | translate }}</label>\r\n                    </clr-toggle-wrapper>\r\n                </vdr-form-field>\r\n            </vdr-card>\r\n            <vdr-card *ngIf=\"variant.options.length\" [title]=\"'catalog.product-options' | translate\">\r\n                <div class=\"options\">\r\n                    <vdr-chip\r\n                        *ngFor=\"let option of variant.options | sort : 'groupId'\"\r\n                        [colorFrom]=\"optionGroupCode(option.groupId)\"\r\n                        [invert]=\"true\"\r\n                    >\r\n                        <span>{{ optionGroupCode(option.groupId) }}:</span>\r\n                        {{ optionName(option) }}\r\n                    </vdr-chip>\r\n                </div>\r\n                <div>\r\n                    <a\r\n                        [routerLink]=\"['../../', 'options']\"\r\n                        class=\"button-small mt-2\"\r\n                        *vdrIfPermissions=\"updatePermissions\"\r\n                    >\r\n                        <clr-icon shape=\"pencil\"></clr-icon>\r\n                        {{ 'catalog.edit-options' | translate }}\r\n                    </a>\r\n                </div>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.facets' | translate\">\r\n                <div class=\"facets\">\r\n                    <vdr-facet-value-chip\r\n                        *ngFor=\"let facetValue of facetValues$ | async\"\r\n                        [facetValue]=\"facetValue\"\r\n                        [removable]=\"updatePermissions | hasPermission\"\r\n                        (remove)=\"removeFacetValue(facetValue.id)\"\r\n                    ></vdr-facet-value-chip>\r\n                </div>\r\n                <div>\r\n                    <button\r\n                        class=\"button-small mt-2\"\r\n                        *vdrIfPermissions=\"updatePermissions\"\r\n                        (click)=\"selectFacetValue()\"\r\n                    >\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'catalog.add-facets' | translate }}\r\n                    </button>\r\n                </div>\r\n            </vdr-card>\r\n\r\n            <vdr-card>\r\n                <vdr-page-entity-info *ngIf=\"entity$ | async as entity\" [entity]=\"entity\" />\r\n            </vdr-card>\r\n        </vdr-page-detail-sidebar>\r\n\r\n        <vdr-page-block>\r\n            <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n            <vdr-card>\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field [label]=\"'common.name' | translate\" for=\"name\">\r\n                        <input\r\n                            id=\"name\"\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                    <vdr-form-field [label]=\"'catalog.sku' | translate\" for=\"sku\">\r\n                        <input\r\n                            id=\"sku\"\r\n                            type=\"text\"\r\n                            formControlName=\"sku\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                </div>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n                <vdr-tabbed-custom-fields\r\n                    entityName=\"ProductVariant\"\r\n                    [customFields]=\"customFields\"\r\n                    [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n                    [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                />\r\n            </vdr-card>\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"product-variant-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            />\r\n            <vdr-card [title]=\"'catalog.assets' | translate\">\r\n                <vdr-assets\r\n                    [assets]=\"assetChanges.assets || variant.assets\"\r\n                    [featuredAsset]=\"assetChanges.featuredAsset || variant.featuredAsset\"\r\n                    [updatePermissions]=\"updatePermissions\"\r\n                    (change)=\"assetChanges = $event\"\r\n                />\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.price-and-tax' | translate\">\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field [label]=\"'catalog.tax-category' | translate\" for=\"taxCategory\">\r\n                        <select name=\"taxCategory\" formControlName=\"taxCategoryId\">\r\n                            <option\r\n                                *ngFor=\"let taxCategory of taxCategories$ | async\"\r\n                                [value]=\"taxCategory.id\"\r\n                            >\r\n                                {{ taxCategory.name }}\r\n                            </option>\r\n                        </select>\r\n                    </vdr-form-field>\r\n                </div>\r\n                <div class=\"form-grid prices\" *ngFor=\"let price of pricesForm.controls\" [formGroup]=\"price\">\r\n                    <vdr-form-field\r\n                        [label]=\"\r\n                            ('catalog.price' | translate) +\r\n                            (1 < pricesForm.length ? ' (' + price.value.currencyCode + ')' : '')\r\n                        \"\r\n                        [tooltip]=\"\r\n                            1 < pricesForm.length && price.value.currencyCode === channelDefaultCurrencyCode\r\n                                ? ('catalog.default-currency' | translate)\r\n                                : undefined\r\n                        \"\r\n                        for=\"price\"\r\n                    >\r\n                        <div class=\"price-wrapper\" [class.pending-deletion]=\"price.value.delete === true\">\r\n                            <vdr-currency-input\r\n                                name=\"price\"\r\n                                [currencyCode]=\"price.value.currencyCode\"\r\n                                [readonly]=\"\r\n                                    !(updatePermissions | hasPermission) || price.value.delete === true\r\n                                \"\r\n                                formControlName=\"price\"\r\n                            />\r\n                            <div *ngIf=\"1 < pricesForm.controls.length\">\r\n                                <button\r\n                                    class=\"button-small delete-button\"\r\n                                    [disabled]=\"price.value.currencyCode === channelDefaultCurrencyCode\"\r\n                                    (click)=\"toggleDeletePrice(price.get('delete'))\"\r\n                                >\r\n                                    <clr-icon shape=\"trash\"></clr-icon>\r\n                                </button>\r\n                            </div>\r\n                        </div>\r\n                    </vdr-form-field>\r\n                    <vdr-variant-price-detail\r\n                        [price]=\"price.value.price\"\r\n                        [currencyCode]=\"price.value.currencyCode\"\r\n                        [priceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [taxCategoryId]=\"detailForm.get('taxCategoryId')!.value\"\r\n                    />\r\n                </div>\r\n                <vdr-variant-price-strategy-detail\r\n                    [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                    [channelDefaultCurrencyCode]=\"channelDefaultCurrencyCode\"\r\n                    [variant]=\"variant\"\r\n                />\r\n                <ng-container *ngIf=\"unusedCurrencyCodes$ | async as unusedCurrencyCodes\">\r\n                    <div *ngIf=\"unusedCurrencyCodes.length\">\r\n                        <vdr-dropdown>\r\n                            <button class=\"button mt-2\" vdrDropdownTrigger>\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-price-in-another-currency' | translate }}\r\n                                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu>\r\n                                <button\r\n                                    vdrDropdownItem\r\n                                    *ngFor=\"let currencyCode of unusedCurrencyCodes\"\r\n                                    (click)=\"addPriceInCurrency(currencyCode)\"\r\n                                >\r\n                                    {{ currencyCode | localeCurrencyName }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </div>\r\n                </ng-container>\r\n            </vdr-card>\r\n            <vdr-card [title]=\"'catalog.stock-levels' | translate\">\r\n                <div class=\"form-grid\">\r\n                    <vdr-form-field\r\n                        for=\"track-inventory\"\r\n                        [label]=\"'catalog.track-inventory' | translate\"\r\n                        [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\r\n                    >\r\n                        <select\r\n                            name=\"track-inventory\"\r\n                            formControlName=\"trackInventory\"\r\n                            [disabled]=\"!(updatePermissions | hasPermission)\"\r\n                        >\r\n                            <option [value]=\"GlobalFlag.TRUE\">\r\n                                {{ 'catalog.track-inventory-true' | translate }}\r\n                            </option>\r\n                            <option [value]=\"GlobalFlag.FALSE\">\r\n                                {{ 'catalog.track-inventory-false' | translate }}\r\n                            </option>\r\n                            <option [value]=\"GlobalFlag.INHERIT\">\r\n                                {{ 'catalog.track-inventory-inherit' | translate }}\r\n                            </option>\r\n                        </select>\r\n                    </vdr-form-field>\r\n\r\n                    <vdr-form-item\r\n                        [label]=\"'catalog.out-of-stock-threshold' | translate\"\r\n                        [tooltip]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\r\n                    >\r\n                        <input\r\n                            type=\"number\"\r\n                            formControlName=\"outOfStockThreshold\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                            [vdrDisabled]=\"\r\n                                detailForm.get('useGlobalOutOfStockThreshold')?.value !== false ||\r\n                                inventoryIsNotTracked(detailForm)\r\n                            \"\r\n                        />\r\n                        <clr-toggle-wrapper>\r\n                            <input\r\n                                type=\"checkbox\"\r\n                                clrToggle\r\n                                name=\"useGlobalOutOfStockThreshold\"\r\n                                formControlName=\"useGlobalOutOfStockThreshold\"\r\n                                [vdrDisabled]=\"\r\n                                    !(updatePermissions | hasPermission) || inventoryIsNotTracked(detailForm)\r\n                                \"\r\n                            />\r\n                            <label\r\n                                >{{ 'catalog.use-global-value' | translate }} ({{\r\n                                    globalOutOfStockThreshold\r\n                                }})</label\r\n                            >\r\n                        </clr-toggle-wrapper>\r\n                    </vdr-form-item>\r\n                </div>\r\n                <div\r\n                    class=\"form-grid stock-levels\"\r\n                    *ngFor=\"let stockLevel of stockLevelsForm.controls\"\r\n                    [formGroup]=\"stockLevel\"\r\n                >\r\n                    <vdr-form-field\r\n                        [label]=\"\r\n                            stockLevel.get('stockLocationName')?.value +\r\n                            ': ' +\r\n                            ('catalog.stock-on-hand' | translate)\r\n                        \"\r\n                        [for]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\r\n                    >\r\n                        <input\r\n                            [id]=\"'stockOnHand_' + stockLevel.get('stockLocationId')?.value\"\r\n                            type=\"number\"\r\n                            formControlName=\"stockOnHand\"\r\n                            [readonly]=\"!(updatePermissions | hasPermission)\"\r\n                        />\r\n                    </vdr-form-field>\r\n                    <vdr-form-item\r\n                        [label]=\"\r\n                            stockLevel.get('stockLocationName')?.value +\r\n                            ': ' +\r\n                            ('catalog.stock-allocated' | translate)\r\n                        \"\r\n                    >\r\n                        {{ stockLevel.get('stockAllocated')?.value }}\r\n                    </vdr-form-item>\r\n                </div>\r\n                <ng-container *ngIf=\"unusedStockLocation$ | async as unusedStockLocations\">\r\n                    <div *ngIf=\"unusedStockLocations.length\">\r\n                        <vdr-dropdown>\r\n                            <button class=\"button mt-2\" vdrDropdownTrigger>\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-stock-location' | translate }}\r\n                                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu>\r\n                                <button\r\n                                    vdrDropdownItem\r\n                                    *ngFor=\"let stockLocation of unusedStockLocations\"\r\n                                    (click)=\"addStockLocation(stockLocation)\"\r\n                                >\r\n                                    <clr-icon shape=\"map-marker\"></clr-icon> {{ stockLocation.name }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </div>\r\n                </ng-container>\r\n            </vdr-card>\r\n        </vdr-page-block>\r\n    </vdr-page-detail-layout>\r\n</form>\r\n", styles: [".facets,.options{display:flex;flex-wrap:wrap;gap:3px}vdr-product-variant-quick-jump{flex:1;margin-inline-end:calc(var(--space-unit) * 2)}.stock-levels,.prices{margin-top:calc(var(--space-unit) * 2);padding-top:calc(var(--space-unit) * 2);border-top:1px solid var(--color-weight-150)}.price-wrapper{display:flex;align-items:center;gap:var(--space-unit);width:100%}.price-wrapper.pending-deletion vdr-currency-input{opacity:.7}.price-wrapper.pending-deletion .delete-button{background-color:var(--color-error-700);color:var(--color-error-100)}\n"], dependencies: [{ kind: "directive", type: i4.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i4.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i4.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2.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: i2.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i6.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i3.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i3.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i3.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i3.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions", "multiSelect"], outputs: ["change"] }, { kind: "component", type: i3.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i3.CurrencyInputComponent, selector: "vdr-currency-input", inputs: ["disabled", "readonly", "value", "currencyCode"], outputs: ["valueChange"] }, { kind: "component", type: i3.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i3.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i3.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i3.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i3.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i3.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i3.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i3.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i3.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "directive", type: i3.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i3.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "directive", type: i3.DisabledDirective, selector: "[vdrDisabled]", inputs: ["vdrDisabled"] }, { kind: "component", type: i3.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i3.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i3.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i3.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i3.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i3.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i3.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: i7.VariantPriceDetailComponent, selector: "vdr-variant-price-detail", inputs: ["priceIncludesTax", "price", "currencyCode", "taxCategoryId"] }, { kind: "component", type: i8.VariantPriceStrategyDetailComponent, selector: "vdr-variant-price-strategy-detail", inputs: ["channelPriceIncludesTax", "variant", "channelDefaultCurrencyCode"] }, { kind: "component", type: i9.ProductVariantQuickJumpComponent, selector: "vdr-product-variant-quick-jump", inputs: ["productId"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i10.TranslatePipe, name: "translate" }, { kind: "pipe", type: i3.LocaleCurrencyNamePipe, name: "localeCurrencyName" }, { kind: "pipe", type: i3.SortPipe, name: "sort" }, { kind: "pipe", type: i3.HasPermissionPipe, name: "hasPermission" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantDetailComponent, decorators: [{
             type: Component,

package/esm2022/catalog/components/product-variant-list/product-variant-list.component.mjs CHANGED Viewed

@@ -103,7 +103,7 @@ export class ProductVariantListComponent extends TypedBaseListComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: { productId: "productId", hideLanguageSelect: "hideLanguageSelect", dataTableId: "dataTableId" }, usesInheritance: true, ngImport: i0, template: "<vdr-page-block *ngIf=\"!hideLanguageSelect\">\r\n    <vdr-language-selector\r\n        [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n        [currentLanguageCode]=\"contentLanguage$ | async\"\r\n        (languageCodeChange)=\"setLanguage($event)\"\r\n    ></vdr-language-selector>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    [id]=\"dataTableId || 'product-variant-list'\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"product-variant-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    />\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-variant=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"variant.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-variant=\"item\">\r\n            <a\r\n                class=\"button-ghost\"\r\n                [routerLink]=\"['/catalog/products', variant.productId, 'variants', variant.id]\"\r\n                ><span>{{ variant.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [sort]=\"sorts.get('sku')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.sku }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-variant=\"item\">\r\n            <vdr-chip *ngIf=\"variant.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!variant.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.price' | translate\" id=\"price\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('price')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.price | localeCurrency : variant.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [sort]=\"sorts.get('priceWithTax')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n\r\n    <vdr-dt2-column [heading]=\"'catalog.stock-on-hand' | translate\" id=\"stock-on-hand\" [hiddenByDefault]=\"false\">\r\n        <ng-template let-variant=\"item\">\r\n            <vdr-chip *ngFor=\"let stockLevel of variant.stockLevels\" [title]=\"stockLevel.stockLocation?.name\">\r\n                <div class=\"flex center\">\r\n                    <div>\r\n                        {{ stockLevel.stockOnHand\r\n                        }}<span class=\"ml-1\" *ngIf=\"stockLevel.stockAllocated\"\r\n                            >({{ stockLevel.stockAllocated }} allocated)</span\r\n                        >\r\n                    </div>\r\n                </div>\r\n            </vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column *ngFor=\"let field of customFields\" [customField]=\"field\" [sorts]=\"sorts\" />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i4.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i4.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i4.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i4.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i4.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i4.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i4.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i4.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i4.LocaleCurrencyPipe, name: "localeCurrency" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: { productId: "productId", hideLanguageSelect: "hideLanguageSelect", dataTableId: "dataTableId" }, usesInheritance: true, ngImport: i0, template: "<vdr-page-block *ngIf=\"!hideLanguageSelect\">\r\n    <vdr-language-selector\r\n        [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n        [currentLanguageCode]=\"contentLanguage$ | async\"\r\n        (languageCodeChange)=\"setLanguage($event)\"\r\n    ></vdr-language-selector>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    [id]=\"dataTableId || 'product-variant-list'\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"product-variant-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    />\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'settings.search-by-product-name-or-sku' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.created-at' | translate\" id=\"created-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('createdAt')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.updated-at' | translate\" id=\"updated-at\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('updatedAt')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.updatedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.image' | translate\" id=\"image\">\r\n        <ng-template let-variant=\"item\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"variant.featuredAsset as asset; else imagePlaceholder\"\r\n                    [src]=\"asset | assetPreview : 'tiny'\"\r\n                />\r\n                <ng-template #imagePlaceholder>\r\n                    <div class=\"placeholder\">\r\n                        <clr-icon shape=\"image\" size=\"48\"></clr-icon>\r\n                    </div>\r\n                </ng-template>\r\n            </div>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\" [sort]=\"sorts.get('name')\">\r\n        <ng-template let-variant=\"item\">\r\n            <a\r\n                class=\"button-ghost\"\r\n                [routerLink]=\"['/catalog/products', variant.productId, 'variants', variant.id]\"\r\n                ><span>{{ variant.name }}</span\r\n                ><clr-icon shape=\"arrow right\"\r\n            /></a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [sort]=\"sorts.get('sku')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.sku }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.enabled' | translate\" id=\"enabled\">\r\n        <ng-template let-variant=\"item\">\r\n            <vdr-chip *ngIf=\"variant.enabled\" colorType=\"success\">{{\r\n                'common.enabled' | translate\r\n            }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"!variant.enabled\" colorType=\"warning\">{{\r\n                'common.disabled' | translate\r\n            }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column\r\n        [heading]=\"'common.price' | translate\" id=\"price\"\r\n        [hiddenByDefault]=\"true\"\r\n        [sort]=\"sorts.get('price')\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.price | localeCurrency : variant.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [sort]=\"sorts.get('priceWithTax')\">\r\n        <ng-template let-variant=\"item\">\r\n            {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n\r\n    <vdr-dt2-column [heading]=\"'catalog.stock-on-hand' | translate\" id=\"stock-on-hand\" [hiddenByDefault]=\"false\">\r\n        <ng-template let-variant=\"item\">\r\n            <vdr-chip *ngFor=\"let stockLevel of variant.stockLevels\" [title]=\"stockLevel.stockLocation?.name\">\r\n                <div class=\"flex center\">\r\n                    <div>\r\n                        {{ stockLevel.stockOnHand\r\n                        }}<span class=\"ml-1\" *ngIf=\"stockLevel.stockAllocated\"\r\n                            >({{ stockLevel.stockAllocated }} allocated)</span\r\n                        >\r\n                    </div>\r\n                </div>\r\n            </vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column *ngFor=\"let field of customFields\" [customField]=\"field\" [sorts]=\"sorts\" />\r\n</vdr-data-table-2>\r\n", styles: [".image-col{width:70px}.image-placeholder{width:50px;height:50px;margin-top:calc(var(--space-unit) * -1);margin-bottom:calc(var(--space-unit) * -1);background-color:var(--color-component-bg-200)}.image-placeholder img{border-radius:var(--border-radius-img)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%}vdr-product-search-input{min-width:300px}@media screen and (max-width: 768px){vdr-product-search-input{min-width:100px}}.search-settings-menu{margin:0 12px}td.disabled{background-color:var(--color-component-bg-200)}.search-index-button{position:relative}.search-index-button vdr-status-badge{right:0;top:0}.run-updates-button{position:relative}.run-updates-button vdr-status-badge{left:10px;top:10px}.edit-button{margin-inline-end:24px}.sku{color:var(--color-text-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i4.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i4.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i4.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i4.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i4.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i4.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i4.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i4.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.AssetPreviewPipe, name: "assetPreview" }, { kind: "pipe", type: i4.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i4.LocaleCurrencyPipe, name: "localeCurrency" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantListComponent, decorators: [{
             type: Component,

package/esm2022/catalog/components/product-variants-editor/product-variants-editor.component.mjs CHANGED Viewed

@@ -283,7 +283,7 @@ export class ProductVariantsEditorComponent {
         return variant.options.find(o => o.groupId === groupId);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantsEditorComponent, deps: [{ token: i1.ActivatedRoute }, { token: i2.DataService }, { token: i3.ProductDetailService }, { token: i2.NotificationService }, { token: i2.ModalService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantsEditorComponent, selector: "vdr-product-variants-editor", ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-card>\r\n        <div *ngFor=\"let group of optionGroups; index as i\" class=\"option-groups\">\r\n            <vdr-form-field [label]=\"'catalog.option' | translate\">\r\n                <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\r\n            </vdr-form-field>\r\n            <vdr-form-field [label]=\"'catalog.option-values' | translate\" class=\"flex-spacer\">\r\n                <vdr-option-value-input\r\n                    #optionValueInputComponent\r\n                    [options]=\"group.values\"\r\n                    [groupName]=\"group.name\"\r\n                    [disabled]=\"group.name === ''\"\r\n                    (add)=\"addOption(i, $event.name)\"\r\n                    (remove)=\"removeOption(i, $event)\"\r\n                ></vdr-option-value-input>\r\n            </vdr-form-field>\r\n            <div>\r\n                <button class=\"button-small mt-4\" (click)=\"removeOptionGroup(group)\">\r\n                    <clr-icon shape=\"trash\"></clr-icon>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <button class=\"button mt-1\" (click)=\"addOptionGroup()\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-product-option-group' | translate }}\r\n        </button>\r\n    </vdr-card>\r\n    <vdr-card [paddingX]=\"false\">\r\n        <div class=\"mx-3\">\r\n            <button class=\"button\" (click)=\"createNewVariant()\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-product-variant' | translate }}\r\n            </button>\r\n        </div>\r\n        <vdr-data-table-2\r\n            id=\"manage-product-variant-list\"\r\n            [items]=\"variants$ | async\"\r\n            [itemsPerPage]=\"itemsPerPage\"\r\n            [totalItems]=\"totalItems$ | async\"\r\n            [currentPage]=\"currentPage\"\r\n            (pageChange)=\"setPageNumber($event)\"\r\n            (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n        >\r\n            <vdr-dt2-search\r\n                [searchTermControl]=\"searchTermControl\"\r\n                [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\r\n            />\r\n            <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.id }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.createdAt | localeDate : 'short' }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.updatedAt | localeDate : 'short' }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.name }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.sku }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column *ngFor=\"let optionGroup of optionGroups$ | async\" [heading]=\"optionGroup.name\" [id]=\"optionGroup.code\">\r\n                <ng-template let-variant=\"item\">\r\n                    <vdr-chip\r\n                        *ngIf=\"getOption(variant, optionGroup.id) as option; else selectOption\"\r\n                        [colorFrom]=\"optionGroup.code\"\r\n                        >{{ option.name }}</vdr-chip\r\n                    >\r\n                    <ng-template #selectOption>\r\n                        <div class=\"flex center\">\r\n                            <ng-select\r\n                                [items]=\"optionGroup.options\"\r\n                                bindLabel=\"name\"\r\n                                bindValue=\"id\"\r\n                                appendTo=\"body\"\r\n                                (change)=\"setOptionToAddToVariant(variant.id, optionGroup.id, $event?.id)\"\r\n                            ></ng-select>\r\n                            <button\r\n                                class=\"button-small ml-1\"\r\n                                [class.primary]=\"!!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\r\n                                (click)=\"addOptionToVariant(variant)\"\r\n                                [disabled]=\"!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\r\n                            >\r\n                                <clr-icon shape=\"floppy\"></clr-icon>\r\n                            </button>\r\n                        </div>\r\n                    </ng-template>\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.price' | translate\" id=\"price\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.price | localeCurrency : variant.currencyCode }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.delete' | translate\" id=\"delete\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    <button class=\"button-small\" (click)=\"deleteVariant(variant)\">\r\n                        <clr-icon shape=\"trash is-danger\"></clr-icon>\r\n                    </button>\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n        </vdr-data-table-2>\r\n    </vdr-card>\r\n</vdr-page-block>\r\n", styles: [".option-groups{display:flex;width:100%;gap:var(--space-unit)}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"], dependencies: [{ kind: "directive", type: i4.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.ClrInput, selector: "[clrInput]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.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", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i2.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i2.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i2.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i2.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i2.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i2.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i2.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i2.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: i8.OptionValueInputComponent, selector: "vdr-option-value-input", inputs: ["groupName", "options", "disabled"], outputs: ["add", "remove", "edit"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i2.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductVariantsEditorComponent, selector: "vdr-product-variants-editor", ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-card>\r\n        <div *ngFor=\"let group of optionGroups; index as i\" class=\"option-groups\">\r\n            <vdr-form-field [label]=\"'catalog.option' | translate\">\r\n                <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\r\n            </vdr-form-field>\r\n            <vdr-form-field [label]=\"'catalog.option-values' | translate\" class=\"flex-spacer\">\r\n                <vdr-option-value-input\r\n                    #optionValueInputComponent\r\n                    [options]=\"group.values\"\r\n                    [groupName]=\"group.name\"\r\n                    [disabled]=\"group.name === ''\"\r\n                    (add)=\"addOption(i, $event.name)\"\r\n                    (remove)=\"removeOption(i, $event)\"\r\n                ></vdr-option-value-input>\r\n            </vdr-form-field>\r\n            <div>\r\n                <button class=\"button-small mt-4\" (click)=\"removeOptionGroup(group)\">\r\n                    <clr-icon shape=\"trash\"></clr-icon>\r\n                </button>\r\n            </div>\r\n        </div>\r\n        <button class=\"button mt-1\" (click)=\"addOptionGroup()\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-product-option-group' | translate }}\r\n        </button>\r\n    </vdr-card>\r\n    <vdr-card [paddingX]=\"false\">\r\n        <div class=\"mx-3\">\r\n            <button class=\"button\" (click)=\"createNewVariant()\">\r\n                <clr-icon shape=\"plus\"></clr-icon>\r\n                {{ 'catalog.create-product-variant' | translate }}\r\n            </button>\r\n        </div>\r\n        <vdr-data-table-2\r\n            id=\"manage-product-variant-list\"\r\n            [items]=\"variants$ | async\"\r\n            [itemsPerPage]=\"itemsPerPage\"\r\n            [totalItems]=\"totalItems$ | async\"\r\n            [currentPage]=\"currentPage\"\r\n            (pageChange)=\"setPageNumber($event)\"\r\n            (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n        >\r\n            <vdr-dt2-search\r\n                [searchTermControl]=\"searchTermControl\"\r\n                [searchTermPlaceholder]=\"'catalog.filter-by-name' | translate\"\r\n            />\r\n            <vdr-dt2-column [heading]=\"'common.id' | translate\" id=\"id\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.id }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.created-at' | translate\" id=\"created-at\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.createdAt | localeDate : 'short' }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.updated-at' | translate\" id=\"updated-at\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.updatedAt | localeDate : 'short' }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'catalog.name' | translate\" id=\"name\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.name }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'catalog.sku' | translate\" id=\"sku\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.sku }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column *ngFor=\"let optionGroup of optionGroups$ | async\" [heading]=\"optionGroup.name\" [id]=\"optionGroup.code\">\r\n                <ng-template let-variant=\"item\">\r\n                    <vdr-chip\r\n                        *ngIf=\"getOption(variant, optionGroup.id) as option; else selectOption\"\r\n                        [colorFrom]=\"optionGroup.code\"\r\n                        >{{ option.name }}</vdr-chip\r\n                    >\r\n                    <ng-template #selectOption>\r\n                        <div class=\"flex center\">\r\n                            <ng-select\r\n                                [items]=\"optionGroup.options\"\r\n                                bindLabel=\"name\"\r\n                                bindValue=\"id\"\r\n                                appendTo=\"body\"\r\n                                (change)=\"setOptionToAddToVariant(variant.id, optionGroup.id, $event?.id)\"\r\n                            ></ng-select>\r\n                            <button\r\n                                class=\"button-small ml-1\"\r\n                                [class.primary]=\"!!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\r\n                                (click)=\"addOptionToVariant(variant)\"\r\n                                [disabled]=\"!optionsToAddToVariant[variant.id]?.[optionGroup.id]\"\r\n                            >\r\n                                <clr-icon shape=\"floppy\"></clr-icon>\r\n                            </button>\r\n                        </div>\r\n                    </ng-template>\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.price' | translate\" id=\"price\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.price | localeCurrency : variant.currencyCode }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.price-with-tax' | translate\" id=\"price-with-tax\" [hiddenByDefault]=\"true\">\r\n                <ng-template let-variant=\"item\">\r\n                    {{ variant.priceWithTax | localeCurrency : variant.currencyCode }}\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n            <vdr-dt2-column [heading]=\"'common.delete' | translate\" id=\"delete\" [optional]=\"false\">\r\n                <ng-template let-variant=\"item\">\r\n                    <button class=\"button-small\" (click)=\"deleteVariant(variant)\">\r\n                        <clr-icon shape=\"trash is-danger\"></clr-icon>\r\n                    </button>\r\n                </ng-template>\r\n            </vdr-dt2-column>\r\n        </vdr-data-table-2>\r\n    </vdr-card>\r\n</vdr-page-block>\r\n", styles: [".option-groups{display:flex;width:100%;gap:var(--space-unit)}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"], dependencies: [{ kind: "directive", type: i4.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i4.ClrInput, selector: "[clrInput]" }, { kind: "directive", type: i5.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i6.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: i6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i6.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i7.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", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "component", type: i2.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i2.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i2.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i2.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange", "visibleColumnsChange"] }, { kind: "component", type: i2.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["id", "expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i2.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i2.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i2.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: i8.OptionValueInputComponent, selector: "vdr-option-value-input", inputs: ["groupName", "options", "disabled"], outputs: ["add", "remove", "edit"] }, { kind: "pipe", type: i5.AsyncPipe, name: "async" }, { kind: "pipe", type: i9.TranslatePipe, name: "translate" }, { kind: "pipe", type: i2.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i2.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductVariantsEditorComponent, decorators: [{
             type: Component,