@vendure/admin-ui 1.5.2 → 1.6.0

package/catalog/vendure-admin-ui-catalog.metadata.json

@@ -1 +1 @@
-{"__symbolic":"module","version":4,"metadata":{"CatalogModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":57,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"SharedModule","line":58,"character":14},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":58,"character":28},"member":"forChild"},"arguments":[{"__symbolic":"reference","name":"catalogRoutes"}]}],"exports":[{"__symbolic":"reference","name":"ProductListComponent"},{"__symbolic":"reference","name":"ProductDetailComponent"},{"__symbolic":"reference","name":"FacetListComponent"},{"__symbolic":"reference","name":"FacetDetailComponent"},{"__symbolic":"reference","name":"GenerateProductVariantsComponent"},{"__symbolic":"reference","name":"ProductVariantsListComponent"},{"__symbolic":"reference","name":"ApplyFacetDialogComponent"},{"__symbolic":"reference","name":"AssetListComponent"},{"__symbolic":"reference","name":"AssetsComponent"},{"__symbolic":"reference","name":"VariantPriceDetailComponent"},{"__symbolic":"reference","name":"CollectionListComponent"},{"__symbolic":"reference","name":"CollectionDetailComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionContentsComponent"},{"__symbolic":"reference","name":"ProductVariantsTableComponent"},{"__symbolic":"reference","name":"ProductSearchInputComponent"},{"__symbolic":"reference","name":"OptionValueInputComponent"},{"__symbolic":"reference","name":"UpdateProductOptionDialogComponent"},{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},{"__symbolic":"reference","name":"AssignProductsToChannelDialogComponent"},{"__symbolic":"reference","name":"AssetDetailComponent"},{"__symbolic":"reference","name":"ConfirmVariantDeletionDialogComponent"},{"__symbolic":"reference","name":"ProductOptionsEditorComponent"}],"declarations":[{"__symbolic":"reference","name":"ProductListComponent"},{"__symbolic":"reference","name":"ProductDetailComponent"},{"__symbolic":"reference","name":"FacetListComponent"},{"__symbolic":"reference","name":"FacetDetailComponent"},{"__symbolic":"reference","name":"GenerateProductVariantsComponent"},{"__symbolic":"reference","name":"ProductVariantsListComponent"},{"__symbolic":"reference","name":"ApplyFacetDialogComponent"},{"__symbolic":"reference","name":"AssetListComponent"},{"__symbolic":"reference","name":"AssetsComponent"},{"__symbolic":"reference","name":"VariantPriceDetailComponent"},{"__symbolic":"reference","name":"CollectionListComponent"},{"__symbolic":"reference","name":"CollectionDetailComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionContentsComponent"},{"__symbolic":"reference","name":"ProductVariantsTableComponent"},{"__symbolic":"reference","name":"ProductSearchInputComponent"},{"__symbolic":"reference","name":"OptionValueInputComponent"},{"__symbolic":"reference","name":"UpdateProductOptionDialogComponent"},{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},{"__symbolic":"reference","name":"AssignProductsToChannelDialogComponent"},{"__symbolic":"reference","name":"AssetDetailComponent"},{"__symbolic":"reference","name":"ConfirmVariantDeletionDialogComponent"},{"__symbolic":"reference","name":"ProductOptionsEditorComponent"}]}]}],"members":{}},"catalogRoutes":[{"path":"products","component":{"__symbolic":"reference","name":"ProductListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":34,"character":24},"arguments":["breadcrumb.products"]}}},{"path":"products/:id","component":{"__symbolic":"reference","name":"ProductDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":40,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":41,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productBreadcrumb"}}},{"path":"products/:id/manage-variants","component":{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":49,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductVariantsResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":50,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productVariantEditorBreadcrumb"}}},{"path":"products/:id/options","component":{"__symbolic":"reference","name":"ProductOptionsEditorComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":58,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductVariantsResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":59,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productOptionsEditorBreadcrumb"}}},{"path":"facets","component":{"__symbolic":"reference","name":"FacetListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":68,"character":24},"arguments":["breadcrumb.facets"]}}},{"path":"facets/:id","component":{"__symbolic":"reference","name":"FacetDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":74,"character":17},"arguments":[{"__symbolic":"reference","name":"FacetResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":75,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"facetBreadcrumb"}}},{"path":"collections","component":{"__symbolic":"reference","name":"CollectionListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":84,"character":24},"arguments":["breadcrumb.collections"]}}},{"path":"collections/:id","component":{"__symbolic":"reference","name":"CollectionDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":90,"character":17},"arguments":[{"__symbolic":"reference","name":"CollectionResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":91,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"collectionBreadcrumb"}}},{"path":"assets","component":{"__symbolic":"reference","name":"AssetListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":100,"character":24},"arguments":["breadcrumb.assets"]}}},{"path":"assets/:id","component":{"__symbolic":"reference","name":"AssetDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":106,"character":17},"arguments":[{"__symbolic":"reference","name":"AssetResolver"}]},"data":{"breadcrumb":{"__symbolic":"reference","name":"assetBreadcrumb"}}}],"productBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":114,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":118,"character":17,"module":"./catalog.routes"}]}},"productVariantEditorBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"data"},"member":"entity"},"member":"pipe"},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"rxjs/operators","name":"map","line":125,"character":8},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":125,"character":12,"module":"./catalog.routes"}]}]}},"productOptionsEditorBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"data"},"member":"entity"},"member":"pipe"},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"rxjs/operators","name":"map","line":146,"character":8},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":146,"character":12,"module":"./catalog.routes"}]}]}},"facetBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":166,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":170,"character":17,"module":"./catalog.routes"}]}},"collectionBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":176,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":180,"character":17,"module":"./catalog.routes"}]}},"assetBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":186,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":190,"character":17,"module":"./catalog.routes"}]}},"ApplyFacetDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"vdr-apply-facet-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":13,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>{{ 'catalog.add-facets' | translate }}</ng-template>\r\n\r\n<vdr-facet-value-selector\r\n    [facets]=\"facets\"\r\n    (selectedValuesChange)=\"selectedValues = $event\"\r\n></vdr-facet-value-selector>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"selectValues()\"\r\n        [disabled]=\"selectedValues.length === 0\"\r\n        class=\"btn btn-primary\"\r\n    >\r\n        {{ 'catalog.add-facets' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"selector":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":16,"character":5},"arguments":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"FacetValueSelectorComponent","line":16,"character":15}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":22,"character":40}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"selectValues":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}]}},"AssetDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":19,"character":42},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"vdr-asset-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":17,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"asset-detail\"></vdr-action-bar-items>\r\n        <button\r\n            *vdrIfPermissions=\"['UpdateCatalog', 'UpdateAsset']\"\r\n            class=\"btn btn-primary\"\r\n            (click)=\"save()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.update' | translate }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n<vdr-asset-preview\r\n    [asset]=\"entity$ | async\"\r\n    [editable]=\"true\"\r\n    [customFields]=\"customFields\"\r\n    [customFieldsForm]=\"detailForm.get('customFields')\"\r\n    (assetChange)=\"onAssetChange($event)\"\r\n></vdr-asset-preview>\r\n","styles":[":host{display:flex;flex-direction:column;height:100%}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":24,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":25,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":26,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":27,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":28,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":29,"character":29}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onAssetChange":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}]}},"AssetListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":26,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"vdr-asset-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left [grow]=\"true\">\r\n        <vdr-asset-search-input\r\n            class=\"pr4 mt1\"\r\n            [tags]=\"allTags$ | async\"\r\n            (searchTermChange)=\"searchTerm$.next($event)\"\r\n            (tagsChange)=\"filterByTags$.next($event)\"\r\n        ></vdr-asset-search-input>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"asset-list\"></vdr-action-bar-items>\r\n        <vdr-asset-file-input\r\n            (selectFiles)=\"filesSelected($event)\"\r\n            [uploading]=\"uploading\"\r\n            dropZoneTarget=\".content-area\"\r\n        ></vdr-asset-file-input>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-asset-gallery\r\n    [assets]=\"(items$ | async)! | paginate: (paginationConfig$ | async) || {}\"\r\n    [multiSelect]=\"true\"\r\n    [canDelete]=\"['DeleteCatalog', 'DeleteAsset'] | hasPermission\"\r\n    (deleteAssets)=\"deleteAssets($event)\"\r\n></vdr-asset-gallery>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n        (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"currentPage$ | async\"\r\n        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n        [totalItems]=\"totalItems$ | async\"\r\n        (pageChange)=\"setPageNumber($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n","styles":[":host{display:flex;flex-direction:column;height:100%}vdr-asset-gallery{flex:1}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}.search-input{margin-top:6px;min-width:300px}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":35,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":36,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":37,"character":29},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":38,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":39,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"filesSelected":[{"__symbolic":"method"}],"deleteAssets":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}]}},"AssetChange":{"__symbolic":"interface"},"AssetsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"selector":"vdr-assets","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":35,"character":21},"member":"OnPush"},"template":"<div class=\"card\" *ngIf=\"!compact; else compactView\">\r\n    <div class=\"card-img\">\r\n        <div class=\"featured-asset\">\r\n            <img\r\n                *ngIf=\"featuredAsset\"\r\n                [src]=\"featuredAsset | assetPreview:'small'\"\r\n                (click)=\"previewAsset(featuredAsset)\"\r\n            />\r\n            <div class=\"placeholder\" *ngIf=\"!featuredAsset\" (click)=\"selectAssets()\">\r\n                <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n                <div>{{ 'catalog.no-featured-asset' | translate }}</div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\"><ng-container *ngTemplateOutlet=\"assetList\"></ng-container></div>\r\n    <div class=\"card-footer\" *vdrIfPermissions=\"updatePermissions\">\r\n        <button class=\"btn\" (click)=\"selectAssets()\">\r\n            <clr-icon shape=\"attachment\"></clr-icon>\r\n            {{ 'asset.add-asset' | translate }}\r\n        </button>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #compactView>\r\n    <div class=\"featured-asset compact\">\r\n        <img\r\n            *ngIf=\"featuredAsset\"\r\n            [src]=\"featuredAsset | assetPreview:'thumb'\"\r\n            (click)=\"previewAsset(featuredAsset)\"\r\n        />\r\n\r\n        <div class=\"placeholder\" *ngIf=\"!featuredAsset\" (click)=\"selectAssets()\"><clr-icon shape=\"image\" size=\"150\"></clr-icon></div>\r\n    </div>\r\n    <ng-container *ngTemplateOutlet=\"assetList\"></ng-container>\r\n    <button\r\n        *vdrIfPermissions=\"updatePermissions\"\r\n        class=\"compact-select btn btn-icon btn-sm btn-block\"\r\n        [title]=\"'asset.add-asset' | translate\"\r\n        (click)=\"selectAssets()\"\r\n    >\r\n        <clr-icon shape=\"attachment\"></clr-icon>\r\n        {{ 'asset.add-asset' | translate }}\r\n    </button>\r\n</ng-template>\r\n\r\n<ng-template #assetList>\r\n    <div class=\"all-assets\" [class.compact]=\"compact\" cdkDropListGroup>\r\n        <div\r\n            *ngFor=\"let asset of assets; let index = index\"\r\n            class=\"drop-list\"\r\n            cdkDropList\r\n            cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListData]=\"index\"\r\n            [cdkDropListDisabled]=\"!(updatePermissions | hasPermission)\"\r\n            (cdkDropListDropped)=\"dropListDropped($event)\"\r\n        >\r\n            <vdr-dropdown cdkDrag>\r\n                <div\r\n                    class=\"asset-thumb\"\r\n                    vdrDropdownTrigger\r\n                    [class.featured]=\"isFeatured(asset)\"\r\n                    [title]=\"\"\r\n                    tabindex=\"0\"\r\n                >\r\n                    <img [src]=\"asset | assetPreview:'tiny'\" />\r\n                </div>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button type=\"button\" vdrDropdownItem (click)=\"previewAsset(asset)\">\r\n                        {{ 'asset.preview' | translate }}\r\n                    </button>\r\n                    <button\r\n                        type=\"button\"\r\n                        [disabled]=\"isFeatured(asset) || !(updatePermissions | hasPermission)\"\r\n                        vdrDropdownItem\r\n                        (click)=\"setAsFeatured(asset)\"\r\n                    >\r\n                        {{ 'asset.set-as-featured-asset' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"remove-asset\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"!(updatePermissions | hasPermission)\"\r\n                        (click)=\"removeAsset(asset)\"\r\n                    >\r\n                        {{ 'asset.remove-asset' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n","styles":[":host{width:340px;display:block}:host.compact{width:162px}.placeholder{text-align:center;color:var(--color-grey-300)}.featured-asset{text-align:center;background:var(--color-component-bg-200);padding:6px;cursor:pointer}.featured-asset.compact{width:100%;min-height:40px;position:relative;padding:6px}.featured-asset .compact-select{position:absolute;bottom:6px;right:6px;margin:0}.all-assets{display:flex;flex-wrap:wrap}.all-assets .drop-list{min-width:60px}.all-assets .asset-thumb{margin:3px;padding:0;border:2px solid var(--color-component-border-100);cursor:pointer}.all-assets .asset-thumb img{width:50px;height:50px}.all-assets .asset-thumb.featured{border-color:var(--color-primary-500)}.all-assets .remove-asset{color:var(--color-warning-500)}.all-assets.compact .drop-list{min-width:54px}.all-assets.compact .asset-thumb{margin:1px;border-width:1px}.all-assets.compact .cdk-drag-placeholder{width:50px}.all-assets.compact .cdk-drag-placeholder .asset-thumb{width:50px}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.all-assets.cdk-drop-list-dragging vdr-dropdown:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drop-list-dragging>*:not(.cdk-drag-placeholder){display:none}\n"]}]}],"members":{"assetsSetter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":5},"arguments":["assets"]}]}],"featuredAsset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":5}}]}],"compact":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":44,"character":5},"arguments":["class.compact"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":5}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":5}}]}],"updatePermissions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":54,"character":38},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":54,"character":76}]}],"selectAssets":[{"__symbolic":"method"}],"setAsFeatured":[{"__symbolic":"method"}],"isFeatured":[{"__symbolic":"method"}],"previewAsset":[{"__symbolic":"method"}],"removeAsset":[{"__symbolic":"method"}],"emitChangeEvent":[{"__symbolic":"method"}],"dropListDropped":[{"__symbolic":"method"}]}},"AssignProductsToChannelDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"vdr-assign-products-to-channel-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":14,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>\r\n    <ng-container *ngIf=\"isProductVariantMode; else productModeTitle\">{{\r\n        'catalog.assign-variants-to-channel' | translate\r\n    }}</ng-container>\r\n    <ng-template #productModeTitle>{{ 'catalog.assign-products-to-channel' | translate }}</ng-template>\r\n</ng-template>\r\n\r\n<div class=\"flex\">\r\n    <clr-input-container>\r\n        <label>{{ 'common.channel' | translate }}</label>\r\n        <vdr-channel-assignment-control\r\n            clrInput\r\n            [multiple]=\"false\"\r\n            [includeDefaultChannel]=\"false\"\r\n            [disableChannelIds]=\"currentChannelIds\"\r\n            [formControl]=\"selectedChannelIdControl\"\r\n        ></vdr-channel-assignment-control>\r\n    </clr-input-container>\r\n    <div class=\"flex-spacer\"></div>\r\n    <clr-input-container>\r\n        <label>{{ 'catalog.price-conversion-factor' | translate }}</label>\r\n        <input clrInput type=\"number\" min=\"0\" max=\"99999\" [formControl]=\"priceFactorControl\" />\r\n    </clr-input-container>\r\n</div>\r\n\r\n<div class=\"channel-price-preview\">\r\n    <label class=\"clr-control-label\">{{ 'catalog.channel-price-preview' | translate }}</label>\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th>{{ 'common.name' | translate }}</th>\r\n                <th>\r\n                    {{\r\n                        'catalog.price-in-channel'\r\n                            | translate: { channel: currentChannel?.code | channelCodeToLabel | translate }\r\n                    }}\r\n                </th>\r\n                <th>\r\n                    <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\r\n                        {{ 'catalog.price-in-channel' | translate: { channel: selectedChannel?.code } }}\r\n                    </ng-template>\r\n                    <ng-template #noSelection>\r\n                        {{ 'catalog.no-channel-selected' | translate }}\r\n                    </ng-template>\r\n                </th>\r\n            </tr>\r\n        </thead>\r\n        <tbody>\r\n            <tr *ngFor=\"let row of variantsPreview$ | async\">\r\n                <td>{{ row.name }}</td>\r\n                <td>{{ row.price | localeCurrency: currentChannel?.currencyCode }}</td>\r\n                <td>\r\n                    <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noChannelSelected\">\r\n                        {{ row.pricePreview | localeCurrency: selectedChannel?.currencyCode }}\r\n                    </ng-template>\r\n                    <ng-template #noChannelSelected> - </ng-template>\r\n                </td>\r\n            </tr>\r\n        </tbody>\r\n    </table>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button type=\"submit\" (click)=\"assign()\" [disabled]=\"!selectedChannel\" class=\"btn btn-primary\">\r\n        <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\r\n            {{ 'catalog.assign-to-named-channel' | translate: { channelCode: selectedChannel?.code } }}\r\n        </ng-template>\r\n        <ng-template #noSelection>\r\n            {{ 'catalog.no-channel-selected' | translate }}\r\n        </ng-template>\r\n    </button>\r\n</ng-template>\r\n","styles":["vdr-channel-assignment-control{min-width:200px}.channel-price-preview{margin-top:24px}.channel-price-preview table.table{margin-top:6px}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":34,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":34,"character":79}]}],"ngOnInit":[{"__symbolic":"method"}],"selectChannel":[{"__symbolic":"method"}],"assign":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}],"getTopVariants":[{"__symbolic":"method"}]}},"CollectionContentsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"vdr-collection-contents","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":21},"member":"OnPush"},"template":"<div class=\"contents-header\">\r\n    <div class=\"header-title-row\">\r\n        <ng-container\r\n            *ngTemplateOutlet=\"headerTemplate; context: { $implicit: contentsTotalItems$ | async }\"\r\n        ></ng-container>\r\n    </div>\r\n    <input\r\n        type=\"text\"\r\n        [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n        [formControl]=\"filterTermControl\"\r\n    />\r\n</div>\r\n<vdr-data-table\r\n    [items]=\"contents$ | async\"\r\n    [itemsPerPage]=\"contentsItemsPerPage$ | async\"\r\n    [totalItems]=\"contentsTotalItems$ | async\"\r\n    [currentPage]=\"contentsCurrentPage$ | async\"\r\n    (pageChange)=\"setContentsPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setContentsItemsPerPage($event)\"\r\n>\r\n    <ng-template let-variant=\"item\">\r\n        <td class=\"left align-middle\">{{ variant.name }}</td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['/catalog/products', variant.productId, { tab: 'variants' }]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n","styles":[".contents-header{background-color:var(--color-component-bg-100);position:sticky;top:0;padding:6px;z-index:1;border-bottom:1px solid var(--color-component-border-200)}.contents-header .header-title-row{display:flex;justify-content:space-between;align-items:center}.contents-header .clr-input{width:100%}:host ::ng-deep table{margin-top:-1px}\n"]}]}],"members":{"collectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":34,"character":5}}]}],"headerTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":35,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":35,"character":18},{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":46,"character":31},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":46,"character":63},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":46,"character":92}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"setContentsPageNumber":[{"__symbolic":"method"}],"setContentsItemsPerPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}],"setParam":[{"__symbolic":"method"}]}},"CollectionDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":46,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":39,"character":1},"arguments":[{"selector":"vdr-collection-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":43,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"collection-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                *vdrIfPermissions=\"updatePermission\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as category\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col\">\r\n            <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n                <clr-toggle-wrapper>\r\n                    <input\r\n                        type=\"checkbox\"\r\n                        clrToggle\r\n                        formControlName=\"visible\"\r\n                        id=\"visibility\"\r\n                        [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                    />\r\n                    <label class=\"visible-toggle\">\r\n                        <ng-container *ngIf=\"detailForm.value.visible; else private\">{{ 'catalog.public' | translate }}</ng-container>\r\n                        <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n                    </label>\r\n                </clr-toggle-wrapper>\r\n            </vdr-form-field>\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]=\"!(updatePermission | hasPermission)\"\r\n                    (input)=\"updateSlug($event.target.value)\"\r\n                />\r\n            </vdr-form-field>\r\n            <vdr-form-field\r\n                [label]=\"'catalog.slug' | translate\"\r\n                for=\"slug\"\r\n                [errors]=\"{ pattern: ('catalog.slug-pattern-error' | translate) }\"\r\n            >\r\n                <input\r\n                    id=\"slug\"\r\n                    type=\"text\"\r\n                    formControlName=\"slug\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                />\r\n            </vdr-form-field>\r\n            <vdr-rich-text-editor\r\n                formControlName=\"description\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                [label]=\"'common.description' | translate\"\r\n            ></vdr-rich-text-editor>\r\n\r\n            <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                <label>{{ 'common.custom-fields' | translate }}</label>\r\n                <vdr-tabbed-custom-fields\r\n                    entityName=\"Collection\"\r\n                    [customFields]=\"customFields\"\r\n                    [customFieldsFormGroup]=\"detailForm.get(['customFields'])\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                ></vdr-tabbed-custom-fields>\r\n            </section>\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"collection-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n        </div>\r\n        <div class=\"clr-col-md-auto\">\r\n            <vdr-assets\r\n                [assets]=\"category.assets\"\r\n                [featuredAsset]=\"category.featuredAsset\"\r\n                [updatePermissions]=\"updatePermission\"\r\n                (change)=\"assetChanges = $event\"\r\n            ></vdr-assets>\r\n        </div>\r\n    </div>\r\n    <div class=\"clr-row\" formArrayName=\"filters\">\r\n        <div class=\"clr-col\">\r\n            <label>{{ 'catalog.filters' | translate }}</label>\r\n            <ng-container *ngFor=\"let filter of filters; index as i\">\r\n                <vdr-configurable-input\r\n                    (remove)=\"removeFilter($event)\"\r\n                    [operation]=\"filter\"\r\n                    [operationDefinition]=\"getFilterDefinition(filter)\"\r\n                    [formControlName]=\"i\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                ></vdr-configurable-input>\r\n            </ng-container>\r\n\r\n            <div *vdrIfPermissions=\"updatePermission\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'marketing.add-condition' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let filter of allFilters\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"addFilter(filter)\"\r\n                        >\r\n                            {{ filter.description }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </div>\r\n        </div>\r\n        <div class=\"clr-col\">\r\n            <vdr-collection-contents [collectionId]=\"id\" #collectionContents>\r\n                <ng-template let-count>\r\n                    <div class=\"contents-title\">\r\n                        {{ 'catalog.collection-contents' | translate }} ({{\r\n                            'common.results-count' | translate: { count: count }\r\n                        }})\r\n                    </div>\r\n                </ng-template>\r\n            </vdr-collection-contents>\r\n        </div>\r\n    </div>\r\n</form>\r\n","styles":[".visible-toggle{margin-top:-3px!important}\n"]}]}],"members":{"contentsComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":55,"character":5},"arguments":["collectionContents"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":58,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":59,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":60,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":61,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":62,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":63,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":64,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":65,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"getFilterDefinition":[{"__symbolic":"method"}],"assetsChanged":[{"__symbolic":"method"}],"updateSlug":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"getUpdatedCollection":[{"__symbolic":"method"}],"mapOperationsToInputs":[{"__symbolic":"method"}]}},"CollectionListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"vdr-collection-list","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex center wrap\">\r\n            <vdr-language-selector\r\n                class=\"mt2\"\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n            <clr-checkbox-wrapper\r\n                class=\"expand-all-toggle ml3\"\r\n                [ngClass]=\"(availableLanguages$ | async)?.length === 1 ? 'mt3' : 'mt1'\"\r\n            >\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"expandAll\" />\r\n                <label>{{ 'catalog.expand-all-collections' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <input\r\n                type='text'\r\n                name='searchTerm'\r\n                [formControl]='filterTermControl'\r\n                [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n                class='clr-input search-input ml4'\r\n            />\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"collection-list\"></vdr-action-bar-items>\r\n        <a\r\n            class=\"btn btn-primary\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\r\n            [routerLink]=\"['./create']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-new-collection' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"collection-wrapper\">\r\n    <vdr-collection-tree\r\n        [collections]=\"items$ | async\"\r\n        [activeCollectionId]=\"activeCollectionId$ | async\"\r\n        [expandAll]=\"expandAll\"\r\n        (rearrange)=\"onRearrange($event)\"\r\n        (deleteCollection)=\"deleteCollection($event)\"\r\n    ></vdr-collection-tree>\r\n\r\n    <div class=\"collection-contents\" [class.expanded]=\"activeCollectionId$ | async\">\r\n        <vdr-collection-contents [collectionId]=\"activeCollectionId$ | async\">\r\n            <ng-template let-count>\r\n                <div class=\"collection-title\">\r\n                    {{ activeCollectionTitle$ | async }} ({{\r\n                        'common.results-count' | translate: { count: count }\r\n                    }})\r\n                </div>\r\n                <button type=\"button\" class=\"close-button\" (click)=\"closeContents()\">\r\n                    <clr-icon shape=\"close\"></clr-icon>\r\n                </button>\r\n            </ng-template>\r\n        </vdr-collection-contents>\r\n    </div>\r\n</div>\r\n","styles":[":host{height:100%;display:flex;flex-direction:column}.expand-all-toggle{display:block}.collection-wrapper{display:flex;height:calc(100% - 50px)}.collection-wrapper vdr-collection-tree{flex:1;height:100%;overflow:auto}.collection-wrapper .collection-contents{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.collection-wrapper .collection-contents.expanded{width:30vw;visibility:visible;opacity:1;padding-left:12px}.collection-wrapper .collection-contents .close-button{margin:0;background:none;border:none;cursor:pointer}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":45,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":46,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":47,"character":30},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":48,"character":24},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":49,"character":23},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":50,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onRearrange":[{"__symbolic":"method"}],"deleteCollection":[{"__symbolic":"method"}],"closeContents":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}},"HasParent":{"__symbolic":"interface"},"TreeNode":{"__symbolic":"interface"},"RootNode":{"__symbolic":"interface"},"arrayToTree":{"__symbolic":"function"},"CollectionTreeNodeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"vdr-collection-tree-node","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":22,"character":21},"member":"OnPush"},"template":"<div\r\n    cdkDropList\r\n    class=\"tree-node\"\r\n    #dropList\r\n    [cdkDropListData]=\"collectionTree\"\r\n    [cdkDropListDisabled]=\"!(hasUpdatePermission$ | async)\"\r\n    (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n    <div\r\n        class=\"collection\"\r\n        [class.private]=\"collection.isPrivate\"\r\n        *ngFor=\"let collection of collectionTree.children; index as i; trackBy: trackByFn\"\r\n        cdkDrag\r\n        [cdkDragData]=\"collection\"\r\n    >\r\n        <div\r\n            class=\"collection-detail\"\r\n            [ngClass]=\"'depth-' + depth\"\r\n            [class.active]=\"collection.id === activeCollectionId\"\r\n        >\r\n            <div class=\"name\">\r\n                <button\r\n                    class=\"icon-button folder-button\"\r\n                    [disabled]=\"expandAll\"\r\n                    *ngIf=\"collection.children?.length; else folderSpacer\"\r\n                    (click)=\"collection.expanded = !collection.expanded\"\r\n                >\r\n                    <clr-icon shape=\"folder\" *ngIf=\"!collection.expanded && !expandAll\"></clr-icon>\r\n                    <clr-icon shape=\"folder-open\" *ngIf=\"collection.expanded || expandAll\"></clr-icon>\r\n                </button>\r\n                <ng-template #folderSpacer>\r\n                    <div class=\"folder-button-spacer\"></div>\r\n                </ng-template>\r\n                {{ collection.name }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <vdr-chip *ngIf=\"collection.isPrivate\">{{ 'catalog.private' | translate }}</vdr-chip>\r\n            <a\r\n                class=\"btn btn-link btn-sm\"\r\n                [routerLink]=\"['./', { contents: collection.id }]\"\r\n                queryParamsHandling=\"preserve\"\r\n            >\r\n                <clr-icon shape=\"view-list\"></clr-icon>\r\n                {{ 'catalog.view-contents' | translate }}\r\n            </a>\r\n            <a class=\"btn btn-link btn-sm\" [routerLink]=\"['/catalog/collections/', collection.id]\">\r\n                <clr-icon shape=\"edit\"></clr-icon>\r\n                {{ 'common.edit' | translate }}\r\n            </a>\r\n            <div class=\"drag-handle\" cdkDragHandle *vdrIfPermissions=\"['UpdateCatalog', 'UpdateCollection']\">\r\n                <clr-icon shape=\"drag-handle\" size=\"24\"></clr-icon>\r\n            </div>\r\n            <vdr-dropdown>\r\n                <button class=\"icon-button\" vdrDropdownTrigger (click)=\"getMoveListItems(collection)\">\r\n                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <a\r\n                        class=\"dropdown-item\"\r\n                        [routerLink]=\"['./', 'create', { parentId: collection.id }]\"\r\n                        *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\r\n                    >\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'catalog.create-new-collection' | translate }}\r\n                    </a>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"i === 0 || !(hasUpdatePermission$ | async)\"\r\n                        (click)=\"moveUp(collection, i)\"\r\n                    >\r\n                        <clr-icon shape=\"caret up\"></clr-icon>\r\n                        {{ 'catalog.move-up' | translate }}\r\n                    </button>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"\r\n                            i === collectionTree.children.length - 1 || !(hasUpdatePermission$ | async)\r\n                        \"\r\n                        (click)=\"moveDown(collection, i)\"\r\n                    >\r\n                        <clr-icon shape=\"caret down\"></clr-icon>\r\n                        {{ 'catalog.move-down' | translate }}\r\n                    </button>\r\n                    <h4 class=\"dropdown-header\">{{ 'catalog.move-to' | translate }}</h4>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        *ngFor=\"let item of moveListItems\"\r\n                        (click)=\"move(collection, item.id)\"\r\n                        [disabled]=\"!(hasUpdatePermission$ | async)\"\r\n                    >\r\n                        <div class=\"move-to-item\">\r\n                            <div class=\"move-icon\">\r\n                                <clr-icon shape=\"child-arrow\"></clr-icon>\r\n                            </div>\r\n                            <div class=\"path\">\r\n                                {{ item.path }}\r\n                            </div>\r\n                        </div>\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        class=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"delete(collection.id)\"\r\n                        [disabled]=\"!(hasDeletePermission$ | async)\"\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n        <vdr-collection-tree-node\r\n            *ngIf=\"collection.expanded || expandAll\"\r\n            [expandAll]=\"expandAll\"\r\n            [collectionTree]=\"collection\"\r\n            [activeCollectionId]=\"activeCollectionId\"\r\n        ></vdr-collection-tree-node>\r\n    </div>\r\n</div>\r\n","styles":[":host{display:block}.collection{background-color:var(--color-component-bg-100);font-size:.65rem;transition:transform .25s cubic-bezier(0,0,.2,1);margin-bottom:2px;border-left:2px solid transparent;transition:border-left-color .2s}.collection.private{background-color:var(--color-component-bg-200)}.collection .collection-detail{padding:6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-component-border-100)}.collection .collection-detail.active{background-color:var(--clr-global-selection-color)}.collection .collection-detail.depth-1{padding-left:36px}.collection .collection-detail.depth-2{padding-left:60px}.collection .collection-detail.depth-3{padding-left:84px}.collection .collection-detail.depth-4{padding-left:108px}.collection .collection-detail .folder-button-spacer{display:inline-block;width:28px}.tree-node{display:block;background:var(--color-component-bg-100);overflow:hidden}.tree-node.cdk-drop-list-dragging>.collection{border-left-color:var(--color-primary-300)}.drag-placeholder{min-height:120px;background-color:var(--color-component-bg-300);transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.move-to-item{display:flex;white-space:normal;align-items:baseline}.move-to-item .move-icon{flex:none;margin-right:3px}.move-to-item .path{line-height:18px}\n"]}]}],"members":{"collectionTree":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"activeCollectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":5}}]}],"expandAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":35,"character":9}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":35,"character":21}}],null,null],"parameters":[{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":37,"character":29}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"getMoveListItems":[{"__symbolic":"method"}],"move":[{"__symbolic":"method"}],"moveUp":[{"__symbolic":"method"}],"moveDown":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"delete":[{"__symbolic":"method"}]}},"RearrangeEvent":{"__symbolic":"interface"},"CollectionPartial":{"__symbolic":"interface"},"CollectionTreeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"vdr-collection-tree","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":21,"character":21},"member":"OnPush"},"template":"<vdr-collection-tree-node\r\n    *ngIf=\"collectionTree\"\r\n    cdkDropListGroup\r\n    [expandAll]=\"expandAll\"\r\n    [collectionTree]=\"collectionTree\"\r\n    [activeCollectionId]=\"activeCollectionId\"\r\n></vdr-collection-tree-node>\r\n","styles":[""]}]}],"members":{"collections":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"activeCollectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"expandAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5}}]}],"rearrange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":5}}]}],"deleteCollection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":5}}]}],"ngOnChanges":[{"__symbolic":"method"}],"onDrop":[{"__symbolic":"method"}],"onMove":[{"__symbolic":"method"}],"onDelete":[{"__symbolic":"method"}],"getMoveListItems":[{"__symbolic":"method"}],"calculateAllMoveListItems":[{"__symbolic":"method"}],"isRootNode":[{"__symbolic":"method"}]}},"ConfirmVariantDeletionDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"vdr-confirm-variant-deletion-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":7,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>\r\n    {{ 'catalog.confirm-deletion-of-unused-variants-title' | translate }}\r\n</ng-template>\r\n{{ 'catalog.confirm-deletion-of-unused-variants-body' | translate }}\r\n<ul>\r\n    <li *ngFor=\"let variant of variants\">{{ variant.name }} ({{ variant.sku }})</li>\r\n</ul>\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\">\r\n        {{ 'common.confirm' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"confirm":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}]}},"FacetDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":34,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"vdr-facet-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"facet-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                *vdrIfPermissions=\"updatePermission\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as facet\">\r\n    <section class=\"form-block\" formGroupName=\"facet\">\r\n        <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n            <clr-toggle-wrapper>\r\n                <input\r\n                    type=\"checkbox\"\r\n                    clrToggle\r\n                    [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                    formControlName=\"visible\"\r\n                    id=\"visibility\"\r\n                />\r\n                <label class=\"visible-toggle\">\r\n                    <ng-container *ngIf=\"detailForm.value.facet.visible; else private\">{{\r\n                        'catalog.public' | translate\r\n                    }}</ng-container>\r\n                    <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n                </label>\r\n            </clr-toggle-wrapper>\r\n        </vdr-form-field>\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]=\"!(updatePermission | hasPermission)\"\r\n                (input)=\"updateCode(facet.code, $event.target.value)\"\r\n            />\r\n        </vdr-form-field>\r\n        <vdr-form-field\r\n            [label]=\"'common.code' | translate\"\r\n            for=\"code\"\r\n            [readOnlyToggle]=\"updatePermission | hasPermission\"\r\n        >\r\n            <input\r\n                id=\"code\"\r\n                type=\"text\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                formControlName=\"code\"\r\n            />\r\n        </vdr-form-field>\r\n\r\n        <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n            <label>{{ 'common.custom-fields' | translate }}</label>\r\n            <vdr-tabbed-custom-fields\r\n                entityName=\"Facet\"\r\n                [customFields]=\"customFields\"\r\n                [customFieldsFormGroup]=\"detailForm.get(['facet', 'customFields'])\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n            ></vdr-tabbed-custom-fields>\r\n        </section>\r\n        <vdr-custom-detail-component-host\r\n            locationId=\"facet-detail\"\r\n            [entity$]=\"entity$\"\r\n            [detailForm]=\"detailForm\"\r\n        ></vdr-custom-detail-component-host>\r\n    </section>\r\n\r\n    <section class=\"form-block\" *ngIf=\"!(isNew$ | async)\">\r\n        <label>{{ 'catalog.facet-values' | translate }}</label>\r\n\r\n        <table class=\"facet-values-list table\" formArrayName=\"values\" *ngIf=\"0 < getValuesFormArray().length\">\r\n            <thead>\r\n                <tr>\r\n                    <th></th>\r\n                    <th>{{ 'common.name' | translate }}</th>\r\n                    <th>{{ 'common.code' | translate }}</th>\r\n                    <ng-container *ngIf=\"customValueFields.length\">\r\n                        <th>{{ 'common.custom-fields' | translate }}</th>\r\n                    </ng-container>\r\n                    <th></th>\r\n                </tr>\r\n            </thead>\r\n            <tbody>\r\n                <tr class=\"facet-value\" *ngFor=\"let value of values; let i = index\" [formGroupName]=\"i\">\r\n                    <td class=\"align-middle\">\r\n                        <vdr-entity-info [entity]=\"value\"></vdr-entity-info>\r\n                    </td>\r\n                    <td class=\"align-middle\">\r\n                        <input\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            (input)=\"updateValueCode(facet.values[i]?.code, $event.target.value, i)\"\r\n                        />\r\n                    </td>\r\n                    <td class=\"align-middle\"><input type=\"text\" formControlName=\"code\" readonly /></td>\r\n                    <td class=\"\" *ngIf=\"customValueFields.length\">\r\n                        <vdr-tabbed-custom-fields\r\n                            entityName=\"FacetValue\"\r\n                            [customFields]=\"customValueFields\"\r\n                            [compact]=\"true\"\r\n                            [customFieldsFormGroup]=\"detailForm.get(['values', i, 'customFields'])\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        ></vdr-tabbed-custom-fields>\r\n                    </td>\r\n                    <td class=\"align-middle\">\r\n                        <vdr-dropdown>\r\n                            <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                                {{ 'common.actions' | translate }}\r\n                                <clr-icon shape=\"caret down\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                <button\r\n                                    type=\"button\"\r\n                                    class=\"delete-button\"\r\n                                    (click)=\"deleteFacetValue(facet.values[i]?.id, i)\"\r\n                                    [disabled]=\"!(updatePermission | hasPermission)\"\r\n                                    vdrDropdownItem\r\n                                >\r\n                                    <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                                    {{ 'common.delete' | translate }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n\r\n        <div>\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-secondary\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\r\n                (click)=\"addFacetValue()\"\r\n            >\r\n                <clr-icon shape=\"add\"></clr-icon>\r\n                {{ 'catalog.add-facet-value' | translate }}\r\n            </button>\r\n        </div>\r\n    </section>\r\n</form>\r\n","styles":[".visible-toggle{margin-top:-3px!important}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":44,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":45,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":46,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":47,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":48,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":49,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":50,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":51,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"updateCode":[{"__symbolic":"method"}],"updateValueCode":[{"__symbolic":"method"}],"customValueFieldIsSet":[{"__symbolic":"method"}],"getValuesFormArray":[{"__symbolic":"method"}],"addFacetValue":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"deleteFacetValue":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"getUpdatedFacet":[{"__symbolic":"method"}],"getCreatedFacetValues":[{"__symbolic":"method"}],"getUpdatedFacetValues":[{"__symbolic":"method"}]}},"FacetListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":24,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"vdr-facet-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex center wrap\">\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            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"filterTermControl\"\r\n                [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n                class=\"clr-input search-input ml4\"\r\n            />\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"facet-list\"></vdr-action-bar-items>\r\n        <a\r\n            class=\"btn btn-primary\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\r\n            [routerLink]=\"['./create']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-new-facet' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column [expand]=\"true\">{{ 'catalog.values' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'catalog.visibility' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-facet=\"item\">\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">{{ facet.code }}</td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">{{ facet.name }}</td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-facet-value-chip\r\n                *ngFor=\"let value of facet.values | slice: 0:displayLimit[facet.id] || 3\"\r\n                [facetValue]=\"value\"\r\n                [removable]=\"false\"\r\n                [displayFacetName]=\"false\"\r\n            ></vdr-facet-value-chip>\r\n            <button\r\n                class=\"btn btn-sm btn-secondary btn-icon\"\r\n                *ngIf=\"facet.values.length > initialLimit\"\r\n                (click)=\"toggleDisplayLimit(facet)\"\r\n            >\r\n                <ng-container *ngIf=\"(displayLimit[facet.id] || 0) < facet.values.length; else collapse\">\r\n                    <clr-icon shape=\"plus\"></clr-icon>\r\n                    {{ facet.values.length - initialLimit }}\r\n                </ng-container>\r\n                <ng-template #collapse>\r\n                    <clr-icon shape=\"minus\"></clr-icon>\r\n                </ng-template>\r\n            </button>\r\n        </td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-chip>\r\n                <ng-container *ngIf=\"!facet.isPrivate; else private\">{{\r\n                    'catalog.public' | translate\r\n                }}</ng-container>\r\n                <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n            </vdr-chip>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', facet.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                    {{ 'common.actions' | translate }}\r\n                    <clr-icon shape=\"caret down\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteFacet(facet.id)\"\r\n                        [disabled]=\"!(['DeleteCatalog', 'DeleteFacet'] | hasPermission)\"\r\n                        vdrDropdownItem\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n","styles":["td.private{background-color:var(--color-component-bg-200)}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":33,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":34,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":35,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":36,"character":37},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":37,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":38,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"toggleDisplayLimit":[{"__symbolic":"method"}],"deleteFacet":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}]}},"CreateVariantValues":{"__symbolic":"interface"},"CreateProductVariantsConfig":{"__symbolic":"interface"},"GenerateProductVariantsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"vdr-generate-product-variants","template":"<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\r\n    <div class=\"name\">\r\n        <label>{{ 'catalog.option' | translate }}</label>\r\n        <input\r\n            placeholder=\"e.g. Size\"\r\n            clrInput\r\n            [(ngModel)]=\"group.name\"\r\n            name=\"name\"\r\n            required\r\n            (keydown.enter)=\"handleEnter($event, optionValueInputComponent)\"\r\n        />\r\n    </div>\r\n    <div class=\"values\">\r\n        <label>{{ 'catalog.option-values' | translate }}</label>\r\n        <vdr-option-value-input\r\n            #optionValueInputComponent\r\n            [(ngModel)]=\"group.values\"\r\n            (ngModelChange)=\"generateVariants()\"\r\n            [groupName]=\"group.name\"\r\n            [disabled]=\"group.name === ''\"\r\n        ></vdr-option-value-input>\r\n    </div>\r\n    <div class=\"remove-group\">\r\n        <button\r\n            class=\"btn btn-icon btn-warning-outline\"\r\n            [title]=\"'catalog.remove-option' | translate\"\r\n            (click)=\"removeOption(group.name)\"\r\n        >\r\n            <clr-icon shape=\"trash\"></clr-icon>\r\n        </button>\r\n    </div>\r\n</div>\r\n<button class=\"btn btn-primary-outline btn-sm\" (click)=\"addOption()\">\r\n    <clr-icon shape=\"plus\"></clr-icon>\r\n    {{ 'catalog.add-option' | translate }}\r\n</button>\r\n\r\n<div class=\"variants-preview\">\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th *ngIf=\"1 < variants.length\">{{ 'common.create' | translate }}</th>\r\n                <th *ngIf=\"1 < variants.length\">{{ 'catalog.variant' | translate }}</th>\r\n                <th>{{ 'catalog.sku' | translate }}</th>\r\n                <th>{{ 'catalog.price' | translate }}</th>\r\n                <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n            </tr>\r\n        </thead>\r\n        <tr\r\n            *ngFor=\"let variant of variants; trackBy: trackByFn\"\r\n            [class.disabled]=\"!variantFormValues[variant.id].enabled\"\r\n        >\r\n            <td *ngIf=\"1 < variants.length\">\r\n                <input\r\n                    type=\"checkbox\"\r\n                    (change)=\"onFormChange()\"\r\n                    [(ngModel)]=\"variantFormValues[variant.id].enabled\"\r\n                    clrCheckbox\r\n                />\r\n            </td>\r\n            <td *ngIf=\"1 < variants.length\">\r\n                {{ variant.values.join(' ') }}\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <input\r\n                        clrInput\r\n                        type=\"text\"\r\n                        (change)=\"onFormChange()\"\r\n                        [(ngModel)]=\"variantFormValues[variant.id].sku\"\r\n                        [placeholder]=\"'catalog.sku' | translate\"\r\n                    />\r\n                </clr-input-container>\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <vdr-currency-input\r\n                        clrInput\r\n                        [(ngModel)]=\"variantFormValues[variant.id].price\"\r\n                        (ngModelChange)=\"onFormChange()\"\r\n                        [currencyCode]=\"currencyCode\"\r\n                    ></vdr-currency-input>\r\n                </clr-input-container>\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <input\r\n                        clrInput\r\n                        type=\"number\"\r\n                        [(ngModel)]=\"variantFormValues[variant.id].stock\"\r\n                        (change)=\"onFormChange()\"\r\n                        min=\"0\"\r\n                        step=\"1\"\r\n                    />\r\n                </clr-input-container>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>\r\n","styles":[":host{display:block;margin-bottom:120px}.option-groups{display:flex}.values{flex:1;margin:0 6px}.remove-group{padding-top:18px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"]}]}],"members":{"variantsChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":31,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"addOption":[{"__symbolic":"method"}],"removeOption":[{"__symbolic":"method"}],"generateVariants":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"handleEnter":[{"__symbolic":"method"}],"onFormChange":[{"__symbolic":"method"}],"copyFromDefault":[{"__symbolic":"method"}]}},"OPTION_VALUE_INPUT_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":14,"character":13},"useExisting":{"__symbolic":"reference","name":"OptionValueInputComponent"},"multi":true},"OptionValueInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"vdr-option-value-input","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":21},"member":"Default"},"providers":[{"__symbolic":"reference","name":"OPTION_VALUE_INPUT_VALUE_ACCESSOR"}],"template":"<div class=\"input-wrapper\" [class.focus]=\"isFocussed\" (click)=\"textArea.focus()\">\r\n    <div class=\"chips\" *ngIf=\"0 < options.length\">\r\n        <vdr-chip\r\n            *ngFor=\"let option of options; last as isLast\"\r\n            [icon]=\"option.locked ? 'lock' : 'times'\"\r\n            [class.selected]=\"isLast && lastSelected\"\r\n            [class.locked]=\"option.locked\"\r\n            [colorFrom]=\"groupName\"\r\n            (iconClick)=\"removeOption(option)\"\r\n        >\r\n            {{ option.name }}\r\n        </vdr-chip>\r\n    </div>\r\n    <textarea\r\n        #textArea\r\n        (keyup)=\"handleKey($event)\"\r\n        (focus)=\"isFocussed = true\"\r\n        (blur)=\"handleBlur()\"\r\n        [(ngModel)]=\"input\"\r\n        [disabled]=\"disabled\"\r\n    ></textarea>\r\n</div>\r\n","styles":[".input-wrapper{background-color:#fff;border-radius:3px!important;border:1px solid var(--color-grey-300)!important;cursor:text}.input-wrapper.focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}.input-wrapper .chips{padding:5px}.input-wrapper textarea{border:none;width:100%;height:24px;margin-top:3px;padding:0 6px}.input-wrapper textarea:focus{outline:none}.input-wrapper textarea:disabled{background-color:var(--color-component-bg-100)}vdr-chip ::ng-deep .wrapper{margin:0 3px}vdr-chip.locked{opacity:.8}vdr-chip.selected ::ng-deep .wrapper{border-color:var(--color-warning-500)!important;box-shadow:0 0 1px 1px var(--color-warning-400);opacity:.6}\n"]}]}],"members":{"groupName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"textArea":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":28,"character":5},"arguments":["textArea",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":37,"character":40}]}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"removeOption":[{"__symbolic":"method"}],"handleKey":[{"__symbolic":"method"}],"handleBlur":[{"__symbolic":"method"}],"addOptionValue":[{"__symbolic":"method"}],"parseInputIntoOptions":[{"__symbolic":"method"}],"removeLastOption":[{"__symbolic":"method"}]}},"TabName":{"__symbolic":"interface"},"VariantFormValue":{"__symbolic":"interface"},"SelectedAssets":{"__symbolic":"interface"},"PaginationConfig":{"__symbolic":"interface"},"ProductDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":96,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":89,"character":1},"arguments":[{"selector":"vdr-product-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":93,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-flex-row\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\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(['product', 'enabled'])\"\r\n                />\r\n                <label>{{ 'common.enabled' | translate }}</label>\r\n            </clr-toggle-wrapper>\r\n        </div>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine || !variantsToCreateAreValid()\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\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 || detailForm.pristine) && !assetsChanged() && !variantAssetsChanged()\r\n                \"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"product$ | async as product\">\r\n    <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n    <clr-tabs>\r\n        <clr-tab>\r\n            <button clrTabLink (click)=\"navigateToTab('details')\">\r\n                {{ 'catalog.product-details' | translate }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive=\"(activeTab$ | async) === 'details'\">\r\n                <div class=\"clr-row\">\r\n                    <div class=\"clr-col\">\r\n                        <section class=\"form-block\" formGroupName=\"product\">\r\n                            <ng-container *ngIf=\"!(isNew$ | async)\">\r\n                                <ng-container *vdrIfMultichannel>\r\n                                    <vdr-form-item\r\n                                        [label]=\"'common.channels' | translate\"\r\n                                        *vdrIfDefaultChannelActive\r\n                                    >\r\n                                        <div class=\"flex channel-assignment\">\r\n                                            <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n                                                <vdr-chip\r\n                                                    *ngIf=\"!isDefaultChannel(channel.code)\"\r\n                                                    icon=\"times-circle\"\r\n                                                    (iconClick)=\"removeFromChannel(channel.id)\"\r\n                                                >\r\n                                                    <vdr-channel-badge\r\n                                                        [channelCode]=\"channel.code\"\r\n                                                    ></vdr-channel-badge>\r\n                                                    {{ channel.code | channelCodeToLabel }}\r\n                                                </vdr-chip>\r\n                                            </ng-container>\r\n                                            <button class=\"btn btn-sm\" (click)=\"assignToChannel()\">\r\n                                                <clr-icon shape=\"layers\"></clr-icon>\r\n                                                {{ 'catalog.assign-to-channel' | translate }}\r\n                                            </button>\r\n                                        </div>\r\n                                    </vdr-form-item>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                            <vdr-form-field [label]=\"'catalog.product-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                                    (input)=\"updateSlug($event.target.value)\"\r\n                                />\r\n                            </vdr-form-field>\r\n                            <div\r\n                                class=\"auto-rename-wrapper\"\r\n                                [class.visible]=\"\r\n                                    (isNew$ | async) === false && detailForm.get(['product', 'name'])?.dirty\r\n                                \"\r\n                            >\r\n                                <clr-checkbox-wrapper>\r\n                                    <input\r\n                                        clrCheckbox\r\n                                        type=\"checkbox\"\r\n                                        id=\"auto-update\"\r\n                                        formControlName=\"autoUpdateVariantNames\"\r\n                                    />\r\n                                    <label>{{\r\n                                        'catalog.auto-update-product-variant-name' | translate\r\n                                    }}</label>\r\n                                </clr-checkbox-wrapper>\r\n                            </div>\r\n                            <vdr-form-field\r\n                                [label]=\"'catalog.slug' | translate\"\r\n                                for=\"slug\"\r\n                                [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n                            >\r\n                                <input\r\n                                    id=\"slug\"\r\n                                    type=\"text\"\r\n                                    formControlName=\"slug\"\r\n                                    [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                />\r\n                            </vdr-form-field>\r\n                            <vdr-rich-text-editor\r\n                                formControlName=\"description\"\r\n                                [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                [label]=\"'common.description' | translate\"\r\n                            ></vdr-rich-text-editor>\r\n\r\n                            <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                                <label>{{ 'common.custom-fields' | translate }}</label>\r\n                                <vdr-tabbed-custom-fields\r\n                                    entityName=\"Product\"\r\n                                    [customFields]=\"customFields\"\r\n                                    [customFieldsFormGroup]=\"detailForm.get(['product', 'customFields'])\"\r\n                                    [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                ></vdr-tabbed-custom-fields>\r\n                            </section>\r\n                            <vdr-custom-detail-component-host\r\n                                locationId=\"product-detail\"\r\n                                [entity$]=\"entity$\"\r\n                                [detailForm]=\"detailForm\"\r\n                            ></vdr-custom-detail-component-host>\r\n                        </section>\r\n                    </div>\r\n                    <div class=\"clr-col-md-auto\">\r\n                        <vdr-assets\r\n                            [assets]=\"assetChanges.assets || product.assets\"\r\n                            [featuredAsset]=\"assetChanges.featuredAsset || product.featuredAsset\"\r\n                            [updatePermissions]=\"updatePermissions\"\r\n                            (change)=\"assetChanges = $event\"\r\n                        ></vdr-assets>\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]=\"['UpdateCatalog', 'UpdateProduct'] | hasPermission\"\r\n                                (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n                            ></vdr-facet-value-chip>\r\n                            <button\r\n                                class=\"btn btn-sm btn-secondary\"\r\n                                *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                                (click)=\"selectProductFacetValue()\"\r\n                            >\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-facets' | translate }}\r\n                            </button>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div *ngIf=\"isNew$ | async\">\r\n                    <h4>{{ 'catalog.product-variants' | translate }}</h4>\r\n                    <vdr-generate-product-variants\r\n                        (variantsChange)=\"createVariantsConfig = $event\"\r\n                    ></vdr-generate-product-variants>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n        <clr-tab *ngIf=\"!(isNew$ | async)\">\r\n            <button clrTabLink (click)=\"navigateToTab('variants')\">\r\n                {{ 'catalog.product-variants' | translate }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive=\"(activeTab$ | async) === 'variants'\">\r\n                <section class=\"form-block\">\r\n                    <div class=\"view-mode\">\r\n                        <div class=\"btn-group\">\r\n                            <button\r\n                                class=\"btn btn-secondary-outline\"\r\n                                (click)=\"variantDisplayMode = 'card'\"\r\n                                [class.btn-primary]=\"variantDisplayMode === 'card'\"\r\n                            >\r\n                                <clr-icon shape=\"list\"></clr-icon>\r\n                                {{ 'catalog.display-variant-cards' | translate }}\r\n                            </button>\r\n                            <button\r\n                                class=\"btn\"\r\n                                (click)=\"variantDisplayMode = 'table'\"\r\n                                [class.btn-primary]=\"variantDisplayMode === 'table'\"\r\n                            >\r\n                                <clr-icon shape=\"table\"></clr-icon>\r\n                                {{ 'catalog.display-variant-table' | translate }}\r\n                            </button>\r\n                        </div>\r\n                        <div class=\"variant-filter\">\r\n                            <input\r\n                                [formControl]=\"filterInput\"\r\n                                [placeholder]=\"'catalog.filter-by-name-or-sku' | translate\"\r\n                            />\r\n                            <button class=\"icon-button\" (click)=\"filterInput.setValue('')\">\r\n                                <clr-icon shape=\"times\"></clr-icon>\r\n                            </button>\r\n                        </div>\r\n                        <div class=\"flex-spacer\"></div>\r\n                        <a\r\n                            *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                            [routerLink]=\"['./', 'manage-variants']\"\r\n                            class=\"btn btn-secondary edit-variants-btn\"\r\n                        >\r\n                            <clr-icon shape=\"add-text\"></clr-icon>\r\n                            {{ 'catalog.manage-variants' | translate }}\r\n                        </a>\r\n                    </div>\r\n\r\n                    <div class=\"pagination-row mt4\" *ngIf=\"10 < (paginationConfig$ | async)?.totalItems\">\r\n                        <vdr-items-per-page-controls\r\n                            [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                            (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n                        ></vdr-items-per-page-controls>\r\n\r\n                        <vdr-pagination-controls\r\n                            [id]=\"(paginationConfig$ | async)?.id\"\r\n                            [currentPage]=\"currentPage$ | async\"\r\n                            [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                            (pageChange)=\"setPage($event)\"\r\n                        ></vdr-pagination-controls>\r\n                    </div>\r\n\r\n                    <vdr-product-variants-table\r\n                        *ngIf=\"variantDisplayMode === 'table'\"\r\n                        [variants]=\"variants$ | async\"\r\n                        [paginationConfig]=\"paginationConfig$ | async\"\r\n                        [optionGroups]=\"product.optionGroups\"\r\n                        [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [productVariantsFormArray]=\"detailForm.get('variants')\"\r\n                        [pendingAssetChanges]=\"variantAssetChanges\"\r\n                    ></vdr-product-variants-table>\r\n                    <vdr-product-variants-list\r\n                        *ngIf=\"variantDisplayMode === 'card'\"\r\n                        [variants]=\"variants$ | async\"\r\n                        [paginationConfig]=\"paginationConfig$ | async\"\r\n                        [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [facets]=\"facets$ | async\"\r\n                        [optionGroups]=\"product.optionGroups\"\r\n                        [productVariantsFormArray]=\"detailForm.get('variants')\"\r\n                        [taxCategories]=\"taxCategories$ | async\"\r\n                        [customFields]=\"customVariantFields\"\r\n                        [customOptionFields]=\"customOptionFields\"\r\n                        [activeLanguage]=\"languageCode$ | async\"\r\n                        [pendingAssetChanges]=\"variantAssetChanges\"\r\n                        (assignToChannel)=\"assignVariantToChannel($event)\"\r\n                        (removeFromChannel)=\"removeVariantFromChannel($event)\"\r\n                        (assetChange)=\"variantAssetChange($event)\"\r\n                        (updateProductOption)=\"updateProductOption($event)\"\r\n                        (selectionChange)=\"selectedVariantIds = $event\"\r\n                        (selectFacetValueClick)=\"selectVariantFacetValue($event)\"\r\n                    ></vdr-product-variants-list>\r\n                </section>\r\n                <div class=\"pagination-row mt4\" *ngIf=\"10 < (paginationConfig$ | async)?.totalItems\">\r\n                    <vdr-items-per-page-controls\r\n                        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                        (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n                    ></vdr-items-per-page-controls>\r\n\r\n                    <vdr-pagination-controls\r\n                        [id]=\"(paginationConfig$ | async)?.id\"\r\n                        [currentPage]=\"currentPage$ | async\"\r\n                        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                        (pageChange)=\"setPage($event)\"\r\n                    ></vdr-pagination-controls>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</form>\r\n","styles":[":host ::ng-deep trix-toolbar{top:24px}.facets{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center}@media screen and (min-width: 768px){.facets{max-width:340px}}vdr-action-bar clr-toggle-wrapper{margin-top:12px}.variant-filter{flex:1;display:flex}.variant-filter input{flex:1;max-width:initial;border-radius:3px 0 0 3px!important}.variant-filter .icon-button{border:1px solid var(--color-component-border-300);background-color:var(--color-component-bg-100);border-radius:0 3px 3px 0;border-left:none}.group-name{padding-right:6px}.view-mode{display:flex;justify-content:flex-end;align-items:center}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap}.auto-rename-wrapper{overflow:hidden;max-height:0;padding-left:9.5rem;margin-bottom:0;transition:max-height .2s,margin-bottom .2s}.auto-rename-wrapper.visible{max-height:24px;margin-bottom:12px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":129,"character":15},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":130,"character":16},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":131,"character":29},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":133,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":134,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":135,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":136,"character":31},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":137,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":138,"character":32}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"navigateToTab":[{"__symbolic":"method"}],"isDefaultChannel":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"setItemsPerPage":[{"__symbolic":"method"}],"assignToChannel":[{"__symbolic":"method"}],"removeFromChannel":[{"__symbolic":"method"}],"assignVariantToChannel":[{"__symbolic":"method"}],"removeVariantFromChannel":[{"__symbolic":"method"}],"assetsChanged":[{"__symbolic":"method"}],"variantAssetsChanged":[{"__symbolic":"method"}],"variantAssetChange":[{"__symbolic":"method"}],"updateSlug":[{"__symbolic":"method"}],"selectProductFacetValue":[{"__symbolic":"method"}],"updateProductOption":[{"__symbolic":"method"}],"removeProductFacetValue":[{"__symbolic":"method"}],"selectVariantFacetValue":[{"__symbolic":"method"}],"variantsToCreateAreValid":[{"__symbolic":"method"}],"displayFacetValueModal":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"buildVariantFormArray":[{"__symbolic":"method"}],"getUpdatedProduct":[{"__symbolic":"method"}],"getUpdatedProductVariants":[{"__symbolic":"method"}],"getProductFormGroup":[{"__symbolic":"method"}],"updateSlugAfterSave":[{"__symbolic":"method"}]}},"ProductListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":37,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"selector":"vdr-products-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left [grow]=\"true\">\r\n        <div class=\"search-form\">\r\n            <vdr-product-search-input\r\n                #productSearchInputComponent\r\n                [facetValueResults]=\"facetValues$ | async\"\r\n                (searchTermChange)=\"setSearchTerm($event)\"\r\n                (facetValueChange)=\"setFacetValueIds($event)\"\r\n            ></vdr-product-search-input>\r\n            <vdr-dropdown class=\"search-settings-menu mr3\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"icon-button search-index-button\"\r\n                    [title]=\"\r\n                        (pendingSearchIndexUpdates\r\n                            ? 'catalog.pending-search-index-updates'\r\n                            : 'catalog.search-index-controls'\r\n                        ) | translate\r\n                    \"\r\n                    vdrDropdownTrigger\r\n                >\r\n                    <clr-icon shape=\"cog\"></clr-icon>\r\n                    <vdr-status-badge *ngIf=\"pendingSearchIndexUpdates\" type=\"warning\"> </vdr-status-badge>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <h4 class=\"dropdown-header\">{{ 'catalog.search-index-controls' | translate }}</h4>\r\n                    <ng-container *ngIf=\"pendingSearchIndexUpdates\">\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"run-updates-button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"runPendingSearchIndexUpdates()\"\r\n                            [disabled]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                        >\r\n                            <vdr-status-badge type=\"warning\"> </vdr-status-badge>\r\n                            {{\r\n                                'catalog.run-pending-search-index-updates'\r\n                                    | translate: { count: pendingSearchIndexUpdates }\r\n                            }}\r\n                        </button>\r\n                        <div class=\"dropdown-divider\"></div>\r\n                    </ng-container>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"rebuildSearchIndex()\"\r\n                        [disabled]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                    >\r\n                        {{ 'catalog.rebuild-search-index' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n        <div class=\"flex wrap\">\r\n            <clr-checkbox-wrapper class=\"mt2\">\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"groupByProduct\" (ngModelChange)=\"refresh()\" />\r\n                <label>{{ 'catalog.group-by-product' | translate }}</label>\r\n            </clr-checkbox-wrapper>\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        </div>\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=\"btn btn-primary\"\r\n            [routerLink]=\"['./create']\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            <span class=\"full-label\">{{ 'catalog.create-new-product' | translate }}</span>\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <ng-template let-result=\"item\">\r\n        <td class=\"left align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"\r\n                        groupByProduct\r\n                            ? result.productAsset\r\n                            : result.productVariantAsset || result.productAsset as asset;\r\n                        else imagePlaceholder\r\n                    \"\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        </td>\r\n        <td class=\"left align-middle\" [class.disabled]=\"!result.enabled\">\r\n            {{ groupByProduct ? result.productName : result.productVariantName }}\r\n        </td>\r\n        <td class=\"align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <vdr-chip *ngIf=\"!result.enabled\">{{ 'common.disabled' | translate }}</vdr-chip>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', result.productId]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                    {{ 'common.actions' | translate }}\r\n                    <clr-icon shape=\"caret down\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteProduct(result.productId)\"\r\n                        [disabled]=\"!(['DeleteCatalog', 'DeleteProduct'] | hasPermission)\"\r\n                        vdrDropdownItem\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n","styles":[".image-placeholder{width:50px;height:50px;background-color:var(--color-component-bg-200)}.image-placeholder .placeholder{text-align:center;color:var(--color-grey-300)}.search-form{display:flex;align-items:center;width:100%;margin-bottom:6px}.search-input{min-width:300px}@media screen and (max-width: 768px){.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}\n"]}]}],"members":{"productSearchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":49,"character":5},"arguments":["productSearchInputComponent",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":52,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":53,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":54,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"JobQueueService","line":55,"character":33},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":56,"character":37},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":57,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":58,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"setSearchTerm":[{"__symbolic":"method"}],"setFacetValueIds":[{"__symbolic":"method"}],"rebuildSearchIndex":[{"__symbolic":"method"}],"runPendingSearchIndexUpdates":[{"__symbolic":"method"}],"deleteProduct":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}]}},"ProductOptionsEditorComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":35,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":28,"character":1},"arguments":[{"selector":"vdr-product-options-editor","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":32,"character":21},"member":"OnPush"},"template":"<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=\"mr2\">\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<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\r\n    <div formGroupName=\"optionGroups\" class=\"clr-row\">\r\n        <div class=\"clr-col-12 clr-col-xl-6\" *ngFor=\"let optionGroup of getOptionGroups(); index as i\">\r\n            <section class=\"card\" [formArrayName]=\"i\">\r\n                <div class=\"card-header option-group-header\">\r\n                    <vdr-entity-info [entity]=\"optionGroup.value\"></vdr-entity-info>\r\n                    <div class=\"ml2\">{{ optionGroup.value.code }}</div>\r\n                </div>\r\n                <div class=\"card-block\">\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                <section class=\"card-block\">\r\n                    <table class=\"facet-values-list table mt2 mb4\" formGroupName=\"options\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th></th>\r\n                                <th>{{ 'common.name' | translate }}</th>\r\n                                <th>{{ 'common.code' | translate }}</th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody>\r\n                            <tr\r\n                                class=\"facet-value\"\r\n                                *ngFor=\"let option of getOptions(optionGroup); let i = index\"\r\n                                [formGroupName]=\"i\"\r\n                            >\r\n                                <td class=\"align-middle\">\r\n                                    <vdr-entity-info [entity]=\"option.value\"></vdr-entity-info>\r\n                                </td>\r\n                                <td class=\"align-middle\">\r\n                                    <input\r\n                                        type=\"text\"\r\n                                        formControlName=\"name\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                    />\r\n                                </td>\r\n                                <td class=\"align-middle\"><input type=\"text\" formControlName=\"code\" /></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </section>\r\n            </section>\r\n        </div>\r\n    </div>\r\n</form>\r\n","styles":[".option-group-header{display:flex;align-items:baseline}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":48,"character":25},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":26},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":50,"character":39},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":51,"character":31},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":53,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":54,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":55,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"getOptionGroups":[{"__symbolic":"method"}],"getOptions":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"getUpdatedOptionGroup":[{"__symbolic":"method"}],"getUpdatedOption":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}]}},"ProductSearchInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"vdr-product-search-input","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":9,"character":21},"member":"OnPush"},"providers":[{"provide":{"__symbolic":"reference","module":"@ng-select/ng-select","name":"SELECTION_MODEL_FACTORY","line":10,"character":27},"useValue":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"SingleSearchSelectionModelFactory","line":10,"character":62}}],"template":"<ng-select\r\n    [addTag]=\"addTagFn\"\r\n    [placeholder]=\"'catalog.search-product-name-or-code' | translate\"\r\n    [items]=\"facetValueResults\"\r\n    [searchFn]=\"filterFacetResults\"\r\n    [hideSelected]=\"true\"\r\n    [multiple]=\"true\"\r\n    [markFirst]=\"false\"\r\n    (change)=\"onSelectChange($event)\"\r\n    #selectComponent\r\n>\r\n    <ng-template ng-header-tmp>\r\n        <div\r\n            class=\"search-header\"\r\n            *ngIf=\"selectComponent.searchTerm\"\r\n            [class.selected]=\"isSearchHeaderSelected()\"\r\n            (click)=\"selectComponent.selectTag()\"\r\n        >\r\n            {{ 'catalog.search-for-term' | translate }}: {{ selectComponent.searchTerm }}\r\n        </div>\r\n    </ng-template>\r\n    <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip\r\n                [facetValue]=\"item.facetValue\"\r\n                [removable]=\"true\"\r\n                (remove)=\"clear(item)\"\r\n            ></vdr-facet-value-chip>\r\n        </ng-container>\r\n        <ng-container *ngIf=\"!item.facetValue\">\r\n            <vdr-chip [icon]=\"'times'\" (iconClick)=\"clear(item)\">\"{{ item.label }}\"</vdr-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n    <ng-template ng-option-tmp let-item=\"item\" let-index=\"index\" let-search=\"searchTerm\">\r\n        <ng-container *ngIf=\"item.facetValue\">\r\n            <vdr-facet-value-chip [facetValue]=\"item.facetValue\" [removable]=\"false\"></vdr-facet-value-chip>\r\n        </ng-container>\r\n    </ng-template>\r\n</ng-select>\r\n","styles":[":host{margin-top:6px;display:block;width:100%}:host ::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-value{background:none;margin:0}:host ::ng-deep .ng-dropdown-panel-items div.ng-option:last-child{display:none}:host ::ng-deep .ng-dropdown-panel .ng-dropdown-header{border:none;padding:0}:host ::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container{padding:0}:host ::ng-deep .ng-select.ng-select-multiple .ng-select-container .ng-value-container .ng-placeholder{padding-left:8px}ng-select{width:100%;min-width:300px;margin-right:12px}.search-header{padding:8px 10px;border-bottom:1px solid var(--color-component-border-100);cursor:pointer}.search-header.selected,.search-header:hover{background-color:var(--color-component-bg-200)}\n"]}]}],"members":{"facetValueResults":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"searchTermChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":14,"character":5}}]}],"facetValueChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":5}}]}],"selectComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":16,"character":5},"arguments":["selectComponent",{"static":true}]}]}],"setSearchTerm":[{"__symbolic":"method"}],"setFacetValues":[{"__symbolic":"method"}],"onSelectChange":[{"__symbolic":"method"}],"addTagFn":[{"__symbolic":"method"}],"isSearchHeaderSelected":[{"__symbolic":"method"}]}},"GeneratedVariant":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":36,"character":24,"context":{"typeName":"Partial"},"module":"./components/product-variants-editor/product-variants-editor.component"}]}]}},"ProductVariantsEditorComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":43,"character":1},"arguments":[{"selector":"vdr-product-variants-editor","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":47,"character":21},"member":"Default"},"template":"<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            (click)=\"save()\"\r\n            [disabled]=\"!formValueChanged || getVariantsToAdd().length === 0\"\r\n        >\r\n            {{ 'common.add-new-variants' | translate: { count: getVariantsToAdd().length } }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\r\n    <div class=\"name\">\r\n        <label>{{ 'catalog.option' | translate }}</label>\r\n        <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\r\n    </div>\r\n    <div class=\"values\">\r\n        <label>{{ 'catalog.option-values' | translate }}</label>\r\n        <vdr-option-value-input\r\n            #optionValueInputComponent\r\n            [(ngModel)]=\"group.values\"\r\n            (ngModelChange)=\"generateVariants()\"\r\n            [groupName]=\"group.name\"\r\n            [disabled]=\"group.name === ''\"\r\n        ></vdr-option-value-input>\r\n    </div>\r\n</div>\r\n<button\r\n    class=\"btn btn-primary-outline btn-sm\"\r\n    (click)=\"addOption()\"\r\n>\r\n    <clr-icon shape=\"plus\"></clr-icon>\r\n    {{ 'catalog.add-option' | translate }}\r\n</button>\r\n\r\n<div class=\"variants-preview\">\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th>{{ 'common.create' | translate }}</th>\r\n                <th>{{ 'catalog.variant' | translate }}</th>\r\n                <th>{{ 'catalog.sku' | translate }}</th>\r\n                <th>{{ 'catalog.price' | translate }}</th>\r\n                <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n                <th></th>\r\n            </tr>\r\n        </thead>\r\n        <tr *ngFor=\"let variant of generatedVariants\" [class.disabled]=\"!variant.enabled || variant.existing\">\r\n            <td>\r\n                <input\r\n                    type=\"checkbox\"\r\n                    *ngIf=\"!variant.existing\"\r\n                    [(ngModel)]=\"variant.enabled\"\r\n                    name=\"enabled\"\r\n                    clrCheckbox\r\n                    (ngModelChange)=\"formValueChanged = true\"\r\n                />\r\n            </td>\r\n            <td>\r\n                {{ getVariantName(variant) | translate }}\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <input\r\n                        clrInput\r\n                        type=\"text\"\r\n                        [(ngModel)]=\"variant.sku\"\r\n                        [placeholder]=\"'catalog.sku' | translate\"\r\n                        name=\"sku\"\r\n                        required\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    />\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.sku }}</span>\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <vdr-currency-input\r\n                        clrInput\r\n                        [(ngModel)]=\"variant.price\"\r\n                        name=\"price\"\r\n                        [currencyCode]=\"currencyCode\"\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    ></vdr-currency-input>\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.price | localeCurrency: currencyCode }}</span>\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <input\r\n                        clrInput\r\n                        type=\"number\"\r\n                        [(ngModel)]=\"variant.stock\"\r\n                        name=\"stock\"\r\n                        min=\"0\"\r\n                        step=\"1\"\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    />\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.stock }}</span>\r\n            </td>\r\n            <td>\r\n                <vdr-dropdown *ngIf=\"variant.productVariantId as productVariantId\">\r\n                    <button class=\"icon-button\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"delete-button\"\r\n                            (click)=\"deleteVariant(productVariantId)\"\r\n                            vdrDropdownItem\r\n                        >\r\n                            <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                            {{ 'common.delete' | translate }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>\r\n","styles":[".option-groups{display:flex}.option-groups:first-of-type{margin-top:24px}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":67,"character":23},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":68,"character":29},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":70,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":71,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"onFormChanged":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"getVariantsToAdd":[{"__symbolic":"method"}],"getVariantName":[{"__symbolic":"method"}],"addOption":[{"__symbolic":"method"}],"generateVariants":[{"__symbolic":"method"}],"getVariantPrototype":[{"__symbolic":"method"}],"deleteVariant":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"checkUniqueSkus":[{"__symbolic":"method"}],"confirmDeletionOfObsoleteVariants":[{"__symbolic":"method"}],"getObsoleteVariants":[{"__symbolic":"method"}],"hasOnlyDefaultVariant":[{"__symbolic":"method"}],"addOptionGroupsToProduct":[{"__symbolic":"method"}],"addNewOptionsToGroups":[{"__symbolic":"method"}],"fetchOptionGroups":[{"__symbolic":"method"}],"createNewProductVariants":[{"__symbolic":"method"}],"deleteObsoleteVariants":[{"__symbolic":"method"}],"reFetchProduct":[{"__symbolic":"method"}],"initOptionsAndVariants":[{"__symbolic":"method"}],"optionsAreEqual":[{"__symbolic":"method"}],"optionsAreSubset":[{"__symbolic":"method"}],"toOptionString":[{"__symbolic":"method"}]}},"VariantAssetChange":{"__symbolic":"interface"},"ProductVariantsListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":47,"character":1},"arguments":[{"selector":"vdr-product-variants-list","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":51,"character":21},"member":"OnPush"},"template":"<div class=\"variants-list\">\r\n    <div\r\n        class=\"variant-container card\"\r\n        *ngFor=\"\r\n            let variant of variants | paginate: paginationConfig || { itemsPerPage: 10, currentPage: 1 };\r\n            trackBy: trackById;\r\n            let i = index\r\n        \"\r\n        [class.disabled]=\"!formGroupMap.get(variant.id)?.get('enabled')?.value\"\r\n    >\r\n        <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\r\n            <div class=\"card-block header-row\">\r\n                <div class=\"details\">\r\n                    <vdr-title-input class=\"sku\" [readonly]=\"!(updatePermission | hasPermission)\">\r\n                        <clr-input-container>\r\n                            <input\r\n                                clrInput\r\n                                type=\"text\"\r\n                                formControlName=\"sku\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                [placeholder]=\"'catalog.sku' | translate\"\r\n                            />\r\n                        </clr-input-container>\r\n                    </vdr-title-input>\r\n                    <vdr-title-input class=\"name\" [readonly]=\"!(updatePermission | hasPermission)\">\r\n                        <clr-input-container>\r\n                            <input\r\n                                clrInput\r\n                                type=\"text\"\r\n                                formControlName=\"name\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                [placeholder]=\"'common.name' | translate\"\r\n                            />\r\n                        </clr-input-container>\r\n                    </vdr-title-input>\r\n                </div>\r\n                <div class=\"right-controls\">\r\n                    <clr-toggle-wrapper *vdrIfPermissions=\"updatePermission\">\r\n                        <input type=\"checkbox\" clrToggle name=\"enabled\" formControlName=\"enabled\" />\r\n                        <label>{{ 'common.enabled' | translate }}</label>\r\n                    </clr-toggle-wrapper>\r\n                </div>\r\n            </div>\r\n            <div class=\"card-block\">\r\n                <div class=\"variant-body\">\r\n                    <div class=\"assets\">\r\n                        <vdr-assets\r\n                            [compact]=\"true\"\r\n                            [assets]=\"pendingAssetChanges[variant.id]?.assets || variant.assets\"\r\n                            [featuredAsset]=\"\r\n                                pendingAssetChanges[variant.id]?.featuredAsset || variant.featuredAsset\r\n                            \"\r\n                            [updatePermissions]=\"updatePermission\"\r\n                            (change)=\"onAssetChange(variant.id, $event)\"\r\n                        ></vdr-assets>\r\n                    </div>\r\n                    <div class=\"variant-form-inputs\">\r\n                        <div class=\"standard-fields\">\r\n                            <div class=\"variant-form-input-row\">\r\n                                <div class=\"tax-category\">\r\n                                    <clr-select-container\r\n                                        *vdrIfPermissions=\"updatePermission; else taxCategoryLabel\"\r\n                                    >\r\n                                        <label>{{ 'catalog.tax-category' | translate }}</label>\r\n                                        <select clrSelect name=\"options\" formControlName=\"taxCategoryId\">\r\n                                            <option\r\n                                                *ngFor=\"let taxCategory of taxCategories\"\r\n                                                [value]=\"taxCategory.id\"\r\n                                            >\r\n                                                {{ taxCategory.name }}\r\n                                            </option>\r\n                                        </select>\r\n                                    </clr-select-container>\r\n                                    <ng-template #taxCategoryLabel>\r\n                                        <label class=\"clr-control-label\">{{\r\n                                            'catalog.tax-category' | translate\r\n                                        }}</label>\r\n                                        <div class=\"tax-category-label\">\r\n                                            {{ getTaxCategoryName(formGroup) }}\r\n                                        </div>\r\n                                    </ng-template>\r\n                                </div>\r\n                                <div class=\"price\">\r\n                                    <clr-input-container>\r\n                                        <label>{{ 'catalog.price' | translate }}</label>\r\n                                        <vdr-currency-input\r\n                                            *ngIf=\"!channelPriceIncludesTax\"\r\n                                            clrInput\r\n                                            [currencyCode]=\"variant.currencyCode\"\r\n                                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                            formControlName=\"price\"\r\n                                        ></vdr-currency-input>\r\n                                        <vdr-currency-input\r\n                                            *ngIf=\"channelPriceIncludesTax\"\r\n                                            clrInput\r\n                                            [currencyCode]=\"variant.currencyCode\"\r\n                                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                            formControlName=\"priceWithTax\"\r\n                                        ></vdr-currency-input>\r\n                                    </clr-input-container>\r\n                                </div>\r\n                                <vdr-variant-price-detail\r\n                                    [price]=\"formGroup.get('price')!.value\"\r\n                                    [currencyCode]=\"variant.currencyCode\"\r\n                                    [priceIncludesTax]=\"channelPriceIncludesTax\"\r\n                                    [taxCategoryId]=\"formGroup.get('taxCategoryId')!.value\"\r\n                                ></vdr-variant-price-detail>\r\n                            </div>\r\n                            <div class=\"variant-form-input-row\">\r\n                                <clr-select-container *vdrIfPermissions=\"updatePermission\">\r\n                                    <label\r\n                                        >{{ 'catalog.track-inventory' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.track-inventory-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip>\r\n                                    </label>\r\n                                    <select clrSelect name=\"options\" formControlName=\"trackInventory\">\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                                </clr-select-container>\r\n                                <clr-input-container>\r\n                                    <label\r\n                                        >{{ 'catalog.stock-on-hand' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-on-hand-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <input\r\n                                        [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\"\r\n                                        clrInput\r\n                                        type=\"number\"\r\n                                        [min]=\"getStockOnHandMinValue(formGroup)\"\r\n                                        step=\"1\"\r\n                                        formControlName=\"stockOnHand\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                        [vdrDisabled]=\"inventoryIsNotTracked(formGroup)\"\r\n                                    />\r\n                                </clr-input-container>\r\n                                <div [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\">\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.stock-allocated' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-allocated-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"value\">\r\n                                        {{ variant.stockAllocated }}\r\n                                    </div>\r\n                                </div>\r\n                                <div [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\">\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.stock-saleable' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-saleable-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"value\">\r\n                                        {{ getSaleableStockLevel(variant) }}\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n\r\n                            <div class=\"variant-form-input-row\">\r\n                                <div\r\n                                    class=\"out-of-stock-threshold-wrapper\"\r\n                                    [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\"\r\n                                >\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.out-of-stock-threshold' | translate\r\n                                        }}<vdr-help-tooltip\r\n                                            [content]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"flex\">\r\n                                        <clr-input-container>\r\n                                            <input\r\n                                                clrInput\r\n                                                type=\"number\"\r\n                                                [formControl]=\"formGroup.get('outOfStockThreshold')\"\r\n                                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                                [vdrDisabled]=\"\r\n                                                    formGroup.get('useGlobalOutOfStockThreshold')?.value !==\r\n                                                        false || inventoryIsNotTracked(formGroup)\r\n                                                \"\r\n                                            />\r\n                                        </clr-input-container>\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                                                    !(updatePermission | hasPermission) ||\r\n                                                    inventoryIsNotTracked(formGroup)\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                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"custom-fields\">\r\n                            <div class=\"variant-form-input-row\">\r\n                                <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                                    <vdr-tabbed-custom-fields\r\n                                        entityName=\"ProductVariant\"\r\n                                        [customFields]=\"customFields\"\r\n                                        [compact]=\"true\"\r\n                                        [customFieldsFormGroup]=\"formGroup.get('customFields')\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                    ></vdr-tabbed-custom-fields>\r\n                                </section>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"card-block\">\r\n                <div class=\"options-facets\">\r\n                    <vdr-entity-info [entity]=\"variant\"></vdr-entity-info>\r\n                    <div *ngIf=\"variant.options.length\">\r\n                        <div class=\"options\">\r\n                            <vdr-chip\r\n                                *ngFor=\"let option of variant.options | sort: 'groupId'\"\r\n                                [colorFrom]=\"optionGroupName(option.groupId)\"\r\n                                [invert]=\"true\"\r\n                                (iconClick)=\"editOption(option)\"\r\n                                [icon]=\"(updatePermission | hasPermission) && 'pencil'\"\r\n                            >\r\n                                <span class=\"option-group-name\">{{ optionGroupName(option.groupId) }}</span>\r\n                                {{ optionName(option) }}\r\n                            </vdr-chip>\r\n                            <a [routerLink]=\"['./', 'options']\" class=\"btn btn-link btn-sm\"\r\n                                >{{ 'catalog.edit-options' | translate }}...</a\r\n                            >\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"flex-spacer\"></div>\r\n                    <div class=\"facets\">\r\n                        <vdr-facet-value-chip\r\n                            *ngFor=\"let facetValue of existingFacetValues(variant)\"\r\n                            [facetValue]=\"facetValue\"\r\n                            [removable]=\"updatePermission | hasPermission\"\r\n                            (remove)=\"removeFacetValue(variant, facetValue.id)\"\r\n                        ></vdr-facet-value-chip>\r\n                        <vdr-facet-value-chip\r\n                            *ngFor=\"let facetValue of pendingFacetValues(variant)\"\r\n                            [facetValue]=\"facetValue\"\r\n                            [removable]=\"updatePermission | hasPermission\"\r\n                            (remove)=\"removeFacetValue(variant, facetValue.id)\"\r\n                        ></vdr-facet-value-chip>\r\n                        <button\r\n                            *vdrIfPermissions=\"updatePermission\"\r\n                            class=\"btn btn-sm btn-secondary\"\r\n                            (click)=\"selectFacetValueClick.emit([variant.id])\"\r\n                        >\r\n                            <clr-icon shape=\"plus\"></clr-icon>\r\n                            {{ 'catalog.add-facets' | translate }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *vdrIfMultichannel>\r\n                <div class=\"card-block\" *vdrIfDefaultChannelActive>\r\n                    <div class=\"flex channel-assignment\">\r\n                        <ng-container *ngFor=\"let channel of variant.channels\">\r\n                            <vdr-chip\r\n                                *ngIf=\"!isDefaultChannel(channel.code)\"\r\n                                icon=\"times-circle\"\r\n                                [title]=\"'catalog.remove-from-channel' | translate\"\r\n                                (iconClick)=\"\r\n                                    removeFromChannel.emit({ channelId: channel.id, variant: variant })\r\n                                \"\r\n                            >\r\n                                <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n                                {{ channel.code | channelCodeToLabel }}\r\n                            </vdr-chip>\r\n                        </ng-container>\r\n                        <button class=\"btn btn-sm\" (click)=\"assignToChannel.emit(variant)\">\r\n                            <clr-icon shape=\"layers\"></clr-icon>\r\n                            {{ 'catalog.assign-to-channel' | translate }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n</div>\r\n","styles":[".with-selected{display:flex;min-height:52px;align-items:center;border:1px solid var(--color-component-border-100);border-radius:3px;padding:6px 18px}.with-selected vdr-select-toggle{margin-right:12px}.with-selected>label{margin-right:12px}.variant-container{transition:background-color .2s;min-height:330px}.variant-container.disabled{background-color:var(--color-component-bg-200)}.variant-container .header-row{display:flex;align-items:center;flex-wrap:wrap}.variant-container .variant-body{display:flex;flex-direction:column}@media screen and (min-width: 768px){.variant-container .variant-body{flex-direction:row}}.variant-container .details{display:flex;flex-direction:column;flex:1;margin-right:12px}@media screen and (min-width: 768px){.variant-container .details{flex-direction:row;height:36px}}.variant-container .details .name{flex:1}.variant-container .details .name ::ng-deep .clr-control-container{width:100%}.variant-container .details .name ::ng-deep .clr-control-container input.clr-input{min-width:100%}.variant-container .details .sku{width:160px;margin-right:20px;flex:0}.variant-container .details ::ng-deep .name input{min-width:300px}.variant-container .right-controls{display:flex}.variant-container .tax-category-label{margin-top:3px}.variant-container .variant-form-inputs{flex:1;display:flex;flex-direction:column}@media screen and (min-width: 768px){.variant-container .variant-form-inputs{flex-direction:row}}.variant-container .variant-form-input-row{display:flex;flex-wrap:wrap}@media screen and (min-width: 768px){.variant-container .variant-form-input-row{margin:0 6px 8px 24px}}.variant-container .variant-form-input-row>*{margin-right:24px;margin-bottom:24px}.variant-container .track-inventory-toggle{margin-top:22px}.variant-container .clr-form-control{margin-top:0}.variant-container .facets{display:flex;flex-wrap:wrap;align-items:center}.variant-container .pricing{display:flex}.variant-container .pricing>div{margin-right:12px}.variant-container .option-group-name{color:var(--color-text-200);text-transform:uppercase;font-size:10px;margin-right:3px;height:11px}.variant-container .options-facets{display:flex;color:var(--color-grey-400)}.variant-container ::ng-deep .clr-control-container{width:100%}.channel-assignment{justify-content:flex-end}.channel-assignment .btn{margin:6px 12px 6px 0}.out-of-stock-threshold-wrapper{display:flex;flex-direction:column}.out-of-stock-threshold-wrapper clr-toggle-wrapper{margin-left:24px}.inventory-untracked{opacity:.5}\n"]}]}],"members":{"formArray":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":5},"arguments":["productVariantsFormArray"]}]}],"variants":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":5}}]}],"paginationConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":5}}]}],"channelPriceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":5}}]}],"taxCategories":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":5}}]}],"facets":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":5}}]}],"optionGroups":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":5}}]}],"customFields":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":5}}]}],"customOptionFields":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":5}}]}],"activeLanguage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":5}}]}],"pendingAssetChanges":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":5}}]}],"assignToChannel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":65,"character":5}}]}],"removeFromChannel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":66,"character":5}}]}],"assetChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":70,"character":5}}]}],"selectionChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":71,"character":5}}]}],"selectFacetValueClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":5}}]}],"updateProductOption":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":73,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":84,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":85,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":86,"character":29}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"isDefaultChannel":[{"__symbolic":"method"}],"trackById":[{"__symbolic":"method"}],"inventoryIsNotTracked":[{"__symbolic":"method"}],"getTaxCategoryName":[{"__symbolic":"method"}],"getStockOnHandMinValue":[{"__symbolic":"method"}],"getSaleableStockLevel":[{"__symbolic":"method"}],"areAllSelected":[{"__symbolic":"method"}],"onAssetChange":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}],"toggleSelectVariant":[{"__symbolic":"method"}],"optionGroupName":[{"__symbolic":"method"}],"optionName":[{"__symbolic":"method"}],"pendingFacetValues":[{"__symbolic":"method"}],"existingFacetValues":[{"__symbolic":"method"}],"removeFacetValue":[{"__symbolic":"method"}],"isVariantSelected":[{"__symbolic":"method"}],"editOption":[{"__symbolic":"method"}],"buildFormGroupMap":[{"__symbolic":"method"}],"getFacetValueIds":[{"__symbolic":"method"}]}},"ProductVariantsTableComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"vdr-product-variants-table","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":19,"character":21},"member":"OnPush"},"template":"<table class=\"table\">\r\n    <thead>\r\n        <tr>\r\n            <th></th>\r\n            <th>{{ 'common.name' | translate }}</th>\r\n            <th>{{ 'catalog.sku' | translate }}</th>\r\n            <ng-container *ngFor=\"let optionGroup of optionGroups | sort: 'id'\">\r\n                <th>{{ optionGroup.name }}</th>\r\n            </ng-container>\r\n            <th>{{ 'catalog.price' | translate }}</th>\r\n            <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n            <th>{{ 'common.enabled' | translate }}</th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        <tr *ngFor=\"let variant of variants | paginate: paginationConfig; index as i; trackBy: trackByFn\">\r\n            <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <div class=\"card-img\">\r\n                        <div class=\"featured-asset\">\r\n                            <img\r\n                                *ngIf=\"getFeaturedAsset(variant) as featuredAsset; else placeholder\"\r\n                                [src]=\"featuredAsset | assetPreview: 'tiny'\"\r\n                            />\r\n                            <ng-template #placeholder>\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                    </div>\r\n                </td>\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            [placeholder]=\"'common.name' | translate\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"text\"\r\n                            formControlName=\"sku\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            [placeholder]=\"'catalog.sku' | translate\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <ng-container *ngFor=\"let option of variant.options | sort: 'groupId'\">\r\n                    <td\r\n                        class=\"left align-middle\"\r\n                        [class.disabled]=\"!formGroup.get('enabled')!.value\"\r\n                        [style.color]=\"optionGroupName(option.groupId) | stringToColor\"\r\n                    >\r\n                        {{ option.name }}\r\n                    </td>\r\n                </ng-container>\r\n                <td class=\"left align-middle price\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <vdr-currency-input\r\n                            *ngIf=\"!channelPriceIncludesTax\"\r\n                            clrInput\r\n                            [currencyCode]=\"variant.currencyCode\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            formControlName=\"price\"\r\n                        ></vdr-currency-input>\r\n                        <vdr-currency-input\r\n                            *ngIf=\"channelPriceIncludesTax\"\r\n                            clrInput\r\n                            [currencyCode]=\"variant.currencyCode\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            formControlName=\"priceWithTax\"\r\n                        ></vdr-currency-input>\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"number\"\r\n                            min=\"0\"\r\n                            step=\"1\"\r\n                            formControlName=\"stockOnHand\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-toggle-wrapper>\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrToggle\r\n                            name=\"enabled\"\r\n                            formControlName=\"enabled\"\r\n                            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                        />\r\n                    </clr-toggle-wrapper>\r\n                </td>\r\n            </ng-container>\r\n        </tr>\r\n    </tbody>\r\n</table>\r\n","styles":[".placeholder{color:var(--color-grey-300)}.stock input,.price input{max-width:96px}td{transition:background-color .2s}td.disabled{background-color:var(--color-component-bg-200)}\n"]}]}],"members":{"formArray":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5},"arguments":["productVariantsFormArray"]}]}],"variants":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5}}]}],"paginationConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"channelPriceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"optionGroups":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5}}]}],"pendingAssetChanges":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":32,"character":40}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"getFeaturedAsset":[{"__symbolic":"method"}],"optionGroupName":[{"__symbolic":"method"}],"buildFormGroupMap":[{"__symbolic":"method"}]}},"UpdateProductOptionDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"vdr-update-product-option-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":16,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>{{ 'catalog.update-product-option' | translate }}</ng-template>\r\n<vdr-form-field [label]=\"'catalog.option-name' | translate\" for=\"name\">\r\n    <input\r\n        id=\"name\"\r\n        type=\"text\"\r\n        #nameInput=\"ngModel\"\r\n        [(ngModel)]=\"name\"\r\n        required\r\n        (input)=\"updateCode($event.target.value)\"\r\n    />\r\n</vdr-form-field>\r\n<vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\r\n    <input id=\"code\" type=\"text\" #codeInput=\"ngModel\" required [(ngModel)]=\"code\" pattern=\"[a-z0-9_-]+\" />\r\n</vdr-form-field>\r\n<clr-checkbox-wrapper>\r\n    <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"updateVariantName\" />\r\n    <label>{{ 'catalog.auto-update-option-variant-name' | translate }}</label>\r\n</clr-checkbox-wrapper>\r\n<section *ngIf=\"customFields.length\">\r\n    <label>{{ 'common.custom-fields' | translate }}</label>\r\n    <vdr-tabbed-custom-fields\r\n        entityName=\"ProductOption\"\r\n        [customFields]=\"customFields\"\r\n        [customFieldsFormGroup]=\"customFieldsForm\"\r\n        [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n    ></vdr-tabbed-custom-fields>\r\n</section>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"update()\"\r\n        [disabled]=\"\r\n            nameInput.invalid ||\r\n            codeInput.invalid ||\r\n            (nameInput.pristine && codeInput.pristine && customFieldsForm.pristine)\r\n        \"\r\n        class=\"btn btn-primary\"\r\n    >\r\n        {{ 'catalog.update-product-option' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"ngOnInit":[{"__symbolic":"method"}],"update":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}],"updateCode":[{"__symbolic":"method"}]}},"VariantPriceDetailComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"vdr-variant-price-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":9,"character":21},"member":"OnPush"},"template":"<label class=\"clr-control-label\">{{ 'catalog.taxes' | translate }}</label>\r\n<div *ngIf=\"priceIncludesTax\" class=\"value\">\r\n    {{ 'catalog.price-includes-tax-at' | translate: { rate: taxRate$ | async } }}\r\n</div>\r\n<div *ngIf=\"!priceIncludesTax\" class=\"value\">\r\n    {{\r\n        'catalog.price-with-tax-in-default-zone'\r\n            | translate: { price: grossPrice$ | async | localeCurrency: currencyCode, rate: taxRate$ | async }\r\n    }}\r\n</div>\r\n","styles":[":host{display:flex;flex-direction:column}.value{margin-top:3px}\n"]}]}],"members":{"priceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":5}}]}],"price":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"currencyCode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"taxCategoryId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":23,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}]}},"ProductDetailService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":29,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":33,"character":37}]}],"getFacets":[{"__symbolic":"method"}],"getTaxCategories":[{"__symbolic":"method"}],"createProductWithVariants":[{"__symbolic":"method"}],"createProductOptionGroups":[{"__symbolic":"method"}],"createProductVariants":[{"__symbolic":"method"}],"updateProduct":[{"__symbolic":"method"}],"updateProductOption":[{"__symbolic":"method"}],"deleteProductVariant":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"replaceLast":{"__symbolic":"function"},"AssetResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":8,"character":35},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":9,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":9,"character":45}]}]},"statics":{"ɵprov":{}}},"CollectionResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":7,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":8,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":8,"character":45}]}]},"statics":{"ɵprov":{}}},"FacetResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":10,"character":35},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":11,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":11,"character":45}]}]},"statics":{"ɵprov":{}}},"ProductResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":12,"character":37},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":13,"character":29},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":13,"character":50}]}]},"statics":{"ɵprov":{}}},"ProductVariantsResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":9,"character":45},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":10,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":10,"character":45}]}]},"statics":{"ɵprov":{}}}},"origins":{"CatalogModule":"./catalog.module","catalogRoutes":"./catalog.routes","productBreadcrumb":"./catalog.routes","productVariantEditorBreadcrumb":"./catalog.routes","productOptionsEditorBreadcrumb":"./catalog.routes","facetBreadcrumb":"./catalog.routes","collectionBreadcrumb":"./catalog.routes","assetBreadcrumb":"./catalog.routes","ApplyFacetDialogComponent":"./components/apply-facet-dialog/apply-facet-dialog.component","AssetDetailComponent":"./components/asset-detail/asset-detail.component","AssetListComponent":"./components/asset-list/asset-list.component","AssetChange":"./components/assets/assets.component","AssetsComponent":"./components/assets/assets.component","AssignProductsToChannelDialogComponent":"./components/assign-products-to-channel-dialog/assign-products-to-channel-dialog.component","CollectionContentsComponent":"./components/collection-contents/collection-contents.component","CollectionDetailComponent":"./components/collection-detail/collection-detail.component","CollectionListComponent":"./components/collection-list/collection-list.component","HasParent":"./components/collection-tree/array-to-tree","TreeNode":"./components/collection-tree/array-to-tree","RootNode":"./components/collection-tree/array-to-tree","arrayToTree":"./components/collection-tree/array-to-tree","CollectionTreeNodeComponent":"./components/collection-tree/collection-tree-node.component","RearrangeEvent":"./components/collection-tree/collection-tree.component","CollectionPartial":"./components/collection-tree/collection-tree.component","CollectionTreeComponent":"./components/collection-tree/collection-tree.component","ConfirmVariantDeletionDialogComponent":"./components/confirm-variant-deletion-dialog/confirm-variant-deletion-dialog.component","FacetDetailComponent":"./components/facet-detail/facet-detail.component","FacetListComponent":"./components/facet-list/facet-list.component","CreateVariantValues":"./components/generate-product-variants/generate-product-variants.component","CreateProductVariantsConfig":"./components/generate-product-variants/generate-product-variants.component","GenerateProductVariantsComponent":"./components/generate-product-variants/generate-product-variants.component","OPTION_VALUE_INPUT_VALUE_ACCESSOR":"./components/option-value-input/option-value-input.component","OptionValueInputComponent":"./components/option-value-input/option-value-input.component","TabName":"./components/product-detail/product-detail.component","VariantFormValue":"./components/product-detail/product-detail.component","SelectedAssets":"./components/product-detail/product-detail.component","PaginationConfig":"./components/product-detail/product-detail.component","ProductDetailComponent":"./components/product-detail/product-detail.component","ProductListComponent":"./components/product-list/product-list.component","ProductOptionsEditorComponent":"./components/product-options-editor/product-options-editor.component","ProductSearchInputComponent":"./components/product-search-input/product-search-input.component","GeneratedVariant":"./components/product-variants-editor/product-variants-editor.component","ProductVariantsEditorComponent":"./components/product-variants-editor/product-variants-editor.component","VariantAssetChange":"./components/product-variants-list/product-variants-list.component","ProductVariantsListComponent":"./components/product-variants-list/product-variants-list.component","ProductVariantsTableComponent":"./components/product-variants-table/product-variants-table.component","UpdateProductOptionDialogComponent":"./components/update-product-option-dialog/update-product-option-dialog.component","VariantPriceDetailComponent":"./components/variant-price-detail/variant-price-detail.component","ProductDetailService":"./providers/product-detail/product-detail.service","replaceLast":"./providers/product-detail/replace-last","AssetResolver":"./providers/routing/asset-resolver","CollectionResolver":"./providers/routing/collection-resolver","FacetResolver":"./providers/routing/facet-resolver","ProductResolver":"./providers/routing/product-resolver","ProductVariantsResolver":"./providers/routing/product-variants-resolver"},"importAs":"@vendure/admin-ui/catalog"}
+{"__symbolic":"module","version":4,"metadata":{"CatalogModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":55,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"SharedModule","line":56,"character":14},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/router","name":"RouterModule","line":56,"character":28},"member":"forChild"},"arguments":[{"__symbolic":"reference","name":"catalogRoutes"}]}],"exports":[{"__symbolic":"reference","name":"ProductListComponent"},{"__symbolic":"reference","name":"ProductDetailComponent"},{"__symbolic":"reference","name":"FacetListComponent"},{"__symbolic":"reference","name":"FacetDetailComponent"},{"__symbolic":"reference","name":"GenerateProductVariantsComponent"},{"__symbolic":"reference","name":"ProductVariantsListComponent"},{"__symbolic":"reference","name":"ApplyFacetDialogComponent"},{"__symbolic":"reference","name":"AssetListComponent"},{"__symbolic":"reference","name":"AssetsComponent"},{"__symbolic":"reference","name":"VariantPriceDetailComponent"},{"__symbolic":"reference","name":"CollectionListComponent"},{"__symbolic":"reference","name":"CollectionDetailComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionContentsComponent"},{"__symbolic":"reference","name":"ProductVariantsTableComponent"},{"__symbolic":"reference","name":"OptionValueInputComponent"},{"__symbolic":"reference","name":"UpdateProductOptionDialogComponent"},{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},{"__symbolic":"reference","name":"AssignProductsToChannelDialogComponent"},{"__symbolic":"reference","name":"AssetDetailComponent"},{"__symbolic":"reference","name":"ConfirmVariantDeletionDialogComponent"},{"__symbolic":"reference","name":"ProductOptionsEditorComponent"}],"declarations":[{"__symbolic":"reference","name":"ProductListComponent"},{"__symbolic":"reference","name":"ProductDetailComponent"},{"__symbolic":"reference","name":"FacetListComponent"},{"__symbolic":"reference","name":"FacetDetailComponent"},{"__symbolic":"reference","name":"GenerateProductVariantsComponent"},{"__symbolic":"reference","name":"ProductVariantsListComponent"},{"__symbolic":"reference","name":"ApplyFacetDialogComponent"},{"__symbolic":"reference","name":"AssetListComponent"},{"__symbolic":"reference","name":"AssetsComponent"},{"__symbolic":"reference","name":"VariantPriceDetailComponent"},{"__symbolic":"reference","name":"CollectionListComponent"},{"__symbolic":"reference","name":"CollectionDetailComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionContentsComponent"},{"__symbolic":"reference","name":"ProductVariantsTableComponent"},{"__symbolic":"reference","name":"OptionValueInputComponent"},{"__symbolic":"reference","name":"UpdateProductOptionDialogComponent"},{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},{"__symbolic":"reference","name":"AssignProductsToChannelDialogComponent"},{"__symbolic":"reference","name":"AssetDetailComponent"},{"__symbolic":"reference","name":"ConfirmVariantDeletionDialogComponent"},{"__symbolic":"reference","name":"ProductOptionsEditorComponent"}]}]}],"members":{}},"catalogRoutes":[{"path":"products","component":{"__symbolic":"reference","name":"ProductListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":34,"character":24},"arguments":["breadcrumb.products"]}}},{"path":"products/:id","component":{"__symbolic":"reference","name":"ProductDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":40,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":41,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productBreadcrumb"}}},{"path":"products/:id/manage-variants","component":{"__symbolic":"reference","name":"ProductVariantsEditorComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":49,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductVariantsResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":50,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productVariantEditorBreadcrumb"}}},{"path":"products/:id/options","component":{"__symbolic":"reference","name":"ProductOptionsEditorComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":58,"character":17},"arguments":[{"__symbolic":"reference","name":"ProductVariantsResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":59,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"productOptionsEditorBreadcrumb"}}},{"path":"facets","component":{"__symbolic":"reference","name":"FacetListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":68,"character":24},"arguments":["breadcrumb.facets"]}}},{"path":"facets/:id","component":{"__symbolic":"reference","name":"FacetDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":74,"character":17},"arguments":[{"__symbolic":"reference","name":"FacetResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":75,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"facetBreadcrumb"}}},{"path":"collections","component":{"__symbolic":"reference","name":"CollectionListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":84,"character":24},"arguments":["breadcrumb.collections"]}}},{"path":"collections/:id","component":{"__symbolic":"reference","name":"CollectionDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":90,"character":17},"arguments":[{"__symbolic":"reference","name":"CollectionResolver"}]},"canDeactivate":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"CanDeactivateDetailGuard","line":91,"character":24}],"data":{"breadcrumb":{"__symbolic":"reference","name":"collectionBreadcrumb"}}},{"path":"assets","component":{"__symbolic":"reference","name":"AssetListComponent"},"data":{"breadcrumb":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@biesbjerg/ngx-translate-extract-marker","name":"marker","line":100,"character":24},"arguments":["breadcrumb.assets"]}}},{"path":"assets/:id","component":{"__symbolic":"reference","name":"AssetDetailComponent"},"resolve":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"createResolveData","line":106,"character":17},"arguments":[{"__symbolic":"reference","name":"AssetResolver"}]},"data":{"breadcrumb":{"__symbolic":"reference","name":"assetBreadcrumb"}}}],"productBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":114,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":118,"character":17,"module":"./catalog.routes"}]}},"productVariantEditorBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"data"},"member":"entity"},"member":"pipe"},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"rxjs/operators","name":"map","line":125,"character":8},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":125,"character":12,"module":"./catalog.routes"}]}]}},"productOptionsEditorBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"data"},"member":"entity"},"member":"pipe"},"arguments":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"rxjs/operators","name":"map","line":146,"character":8},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":146,"character":12,"module":"./catalog.routes"}]}]}},"facetBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":166,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":170,"character":17,"module":"./catalog.routes"}]}},"collectionBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":176,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":180,"character":17,"module":"./catalog.routes"}]}},"assetBreadcrumb":{"__symbolic":"function","parameters":["data","params"],"value":{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"detailBreadcrumb","line":186,"character":11},"arguments":[{"__symbolic":"error","message":"Lambda not supported","line":190,"character":17,"module":"./catalog.routes"}]}},"ApplyFacetDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":9,"character":1},"arguments":[{"selector":"vdr-apply-facet-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":13,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>{{ 'catalog.add-facets' | translate }}</ng-template>\r\n\r\n<vdr-facet-value-selector\r\n    [facets]=\"facets\"\r\n    (selectedValuesChange)=\"selectedValues = $event\"\r\n></vdr-facet-value-selector>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"selectValues()\"\r\n        [disabled]=\"selectedValues.length === 0\"\r\n        class=\"btn btn-primary\"\r\n    >\r\n        {{ 'catalog.add-facets' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"selector":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":16,"character":5},"arguments":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"FacetValueSelectorComponent","line":16,"character":15}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":22,"character":40}]}],"ngAfterViewInit":[{"__symbolic":"method"}],"selectValues":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}]}},"AssetDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":19,"character":42},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"vdr-asset-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":17,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"asset-detail\"></vdr-action-bar-items>\r\n        <button\r\n            *vdrIfPermissions=\"['UpdateCatalog', 'UpdateAsset']\"\r\n            class=\"btn btn-primary\"\r\n            (click)=\"save()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.update' | translate }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n<vdr-asset-preview\r\n    [asset]=\"entity$ | async\"\r\n    [editable]=\"true\"\r\n    [customFields]=\"customFields\"\r\n    [customFieldsForm]=\"detailForm.get('customFields')\"\r\n    (assetChange)=\"onAssetChange($event)\"\r\n></vdr-asset-preview>\r\n","styles":[":host{display:flex;flex-direction:column;height:100%}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":24,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":25,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":26,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":27,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":28,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":29,"character":29}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"onAssetChange":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}]}},"AssetListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":26,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"vdr-asset-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left [grow]=\"true\">\r\n        <vdr-asset-search-input\r\n            class=\"pr4 mt1\"\r\n            [tags]=\"allTags$ | async\"\r\n            (searchTermChange)=\"searchTerm$.next($event)\"\r\n            (tagsChange)=\"filterByTags$.next($event)\"\r\n        ></vdr-asset-search-input>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"asset-list\"></vdr-action-bar-items>\r\n        <vdr-asset-file-input\r\n            (selectFiles)=\"filesSelected($event)\"\r\n            [uploading]=\"uploading\"\r\n            dropZoneTarget=\".content-area\"\r\n        ></vdr-asset-file-input>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-asset-gallery\r\n    [assets]=\"(items$ | async)! | paginate: (paginationConfig$ | async) || {}\"\r\n    [multiSelect]=\"true\"\r\n    [canDelete]=\"['DeleteCatalog', 'DeleteAsset'] | hasPermission\"\r\n    (deleteAssets)=\"deleteAssets($event)\"\r\n></vdr-asset-gallery>\r\n\r\n<div class=\"paging-controls\">\r\n    <vdr-items-per-page-controls\r\n        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n        (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n    ></vdr-items-per-page-controls>\r\n\r\n    <vdr-pagination-controls\r\n        [currentPage]=\"currentPage$ | async\"\r\n        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n        [totalItems]=\"totalItems$ | async\"\r\n        (pageChange)=\"setPageNumber($event)\"\r\n    ></vdr-pagination-controls>\r\n</div>\r\n","styles":[":host{display:flex;flex-direction:column;height:100%}vdr-asset-gallery{flex:1}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}.search-input{margin-top:6px;min-width:300px}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":35,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":36,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":37,"character":29},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":38,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":39,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"filesSelected":[{"__symbolic":"method"}],"deleteAssets":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}]}},"AssetChange":{"__symbolic":"interface"},"AssetsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":31,"character":1},"arguments":[{"selector":"vdr-assets","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":35,"character":21},"member":"OnPush"},"template":"<div class=\"card\" *ngIf=\"!compact; else compactView\">\r\n    <div class=\"card-img\">\r\n        <div class=\"featured-asset\">\r\n            <img\r\n                *ngIf=\"featuredAsset\"\r\n                [src]=\"featuredAsset | assetPreview:'small'\"\r\n                (click)=\"previewAsset(featuredAsset)\"\r\n            />\r\n            <div class=\"placeholder\" *ngIf=\"!featuredAsset\" (click)=\"selectAssets()\">\r\n                <clr-icon shape=\"image\" size=\"128\"></clr-icon>\r\n                <div>{{ 'catalog.no-featured-asset' | translate }}</div>\r\n            </div>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\"><ng-container *ngTemplateOutlet=\"assetList\"></ng-container></div>\r\n    <div class=\"card-footer\" *vdrIfPermissions=\"updatePermissions\">\r\n        <button class=\"btn\" (click)=\"selectAssets()\">\r\n            <clr-icon shape=\"attachment\"></clr-icon>\r\n            {{ 'asset.add-asset' | translate }}\r\n        </button>\r\n    </div>\r\n</div>\r\n\r\n<ng-template #compactView>\r\n    <div class=\"featured-asset compact\">\r\n        <img\r\n            *ngIf=\"featuredAsset\"\r\n            [src]=\"featuredAsset | assetPreview:'thumb'\"\r\n            (click)=\"previewAsset(featuredAsset)\"\r\n        />\r\n\r\n        <div class=\"placeholder\" *ngIf=\"!featuredAsset\" (click)=\"selectAssets()\"><clr-icon shape=\"image\" size=\"150\"></clr-icon></div>\r\n    </div>\r\n    <ng-container *ngTemplateOutlet=\"assetList\"></ng-container>\r\n    <button\r\n        *vdrIfPermissions=\"updatePermissions\"\r\n        class=\"compact-select btn btn-icon btn-sm btn-block\"\r\n        [title]=\"'asset.add-asset' | translate\"\r\n        (click)=\"selectAssets()\"\r\n    >\r\n        <clr-icon shape=\"attachment\"></clr-icon>\r\n        {{ 'asset.add-asset' | translate }}\r\n    </button>\r\n</ng-template>\r\n\r\n<ng-template #assetList>\r\n    <div class=\"all-assets\" [class.compact]=\"compact\" cdkDropListGroup>\r\n        <div\r\n            *ngFor=\"let asset of assets; let index = index\"\r\n            class=\"drop-list\"\r\n            cdkDropList\r\n            cdkDropListOrientation=\"horizontal\"\r\n            [cdkDropListData]=\"index\"\r\n            [cdkDropListDisabled]=\"!(updatePermissions | hasPermission)\"\r\n            (cdkDropListDropped)=\"dropListDropped($event)\"\r\n        >\r\n            <vdr-dropdown cdkDrag>\r\n                <div\r\n                    class=\"asset-thumb\"\r\n                    vdrDropdownTrigger\r\n                    [class.featured]=\"isFeatured(asset)\"\r\n                    [title]=\"\"\r\n                    tabindex=\"0\"\r\n                >\r\n                    <img [src]=\"asset | assetPreview:'tiny'\" />\r\n                </div>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button type=\"button\" vdrDropdownItem (click)=\"previewAsset(asset)\">\r\n                        {{ 'asset.preview' | translate }}\r\n                    </button>\r\n                    <button\r\n                        type=\"button\"\r\n                        [disabled]=\"isFeatured(asset) || !(updatePermissions | hasPermission)\"\r\n                        vdrDropdownItem\r\n                        (click)=\"setAsFeatured(asset)\"\r\n                    >\r\n                        {{ 'asset.set-as-featured-asset' | translate }}\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"remove-asset\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"!(updatePermissions | hasPermission)\"\r\n                        (click)=\"removeAsset(asset)\"\r\n                    >\r\n                        {{ 'asset.remove-asset' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n    </div>\r\n</ng-template>\r\n","styles":[":host{width:340px;display:block}:host.compact{width:162px}.placeholder{text-align:center;color:var(--color-grey-300)}.featured-asset{text-align:center;background:var(--color-component-bg-200);padding:6px;cursor:pointer;border-radius:var(--border-radius-img)}.featured-asset img{border-radius:var(--border-radius-img)}.featured-asset.compact{width:100%;min-height:40px;position:relative;padding:6px}.featured-asset .compact-select{position:absolute;bottom:6px;right:6px;margin:0}.all-assets{display:flex;flex-wrap:wrap}.all-assets .drop-list{min-width:60px}.all-assets .asset-thumb{margin:3px;padding:0;border:2px solid var(--color-component-border-100);border-radius:var(--border-radius-img);cursor:pointer}.all-assets .asset-thumb img{width:50px;height:50px;border-radius:var(--border-radius-img)}.all-assets .asset-thumb.featured{border-color:var(--color-primary-500);border-radius:calc(var(--border-radius-img) + 2px)}.all-assets .remove-asset{color:var(--color-warning-500)}.all-assets.compact .drop-list{min-width:54px}.all-assets.compact .asset-thumb{margin:1px;border-width:1px}.all-assets.compact .cdk-drag-placeholder{width:50px}.all-assets.compact .cdk-drag-placeholder .asset-thumb{width:50px}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-box:last-child{border:none}.all-assets.cdk-drop-list-dragging vdr-dropdown:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drop-list-dragging>*:not(.cdk-drag-placeholder){display:none}\n"]}]}],"members":{"assetsSetter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":38,"character":5},"arguments":["assets"]}]}],"featuredAsset":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":5}}]}],"compact":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding","line":44,"character":5},"arguments":["class.compact"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":45,"character":5}}]}],"change":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":47,"character":5}}]}],"updatePermissions":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":51,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":54,"character":38},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":54,"character":76}]}],"selectAssets":[{"__symbolic":"method"}],"setAsFeatured":[{"__symbolic":"method"}],"isFeatured":[{"__symbolic":"method"}],"previewAsset":[{"__symbolic":"method"}],"removeAsset":[{"__symbolic":"method"}],"emitChangeEvent":[{"__symbolic":"method"}],"dropListDropped":[{"__symbolic":"method"}]}},"AssignProductsToChannelDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":10,"character":1},"arguments":[{"selector":"vdr-assign-products-to-channel-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":14,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>\r\n    <ng-container *ngIf=\"isProductVariantMode; else productModeTitle\">{{\r\n        'catalog.assign-variants-to-channel' | translate\r\n    }}</ng-container>\r\n    <ng-template #productModeTitle>{{ 'catalog.assign-products-to-channel' | translate }}</ng-template>\r\n</ng-template>\r\n\r\n<div class=\"flex\">\r\n    <clr-input-container>\r\n        <label>{{ 'common.channel' | translate }}</label>\r\n        <vdr-channel-assignment-control\r\n            clrInput\r\n            [multiple]=\"false\"\r\n            [includeDefaultChannel]=\"false\"\r\n            [disableChannelIds]=\"currentChannelIds\"\r\n            [formControl]=\"selectedChannelIdControl\"\r\n        ></vdr-channel-assignment-control>\r\n    </clr-input-container>\r\n    <div class=\"flex-spacer\"></div>\r\n    <clr-input-container>\r\n        <label>{{ 'catalog.price-conversion-factor' | translate }}</label>\r\n        <input clrInput type=\"number\" min=\"0\" max=\"99999\" [formControl]=\"priceFactorControl\" />\r\n    </clr-input-container>\r\n</div>\r\n\r\n<div class=\"channel-price-preview\">\r\n    <label class=\"clr-control-label\">{{ 'catalog.channel-price-preview' | translate }}</label>\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th>{{ 'common.name' | translate }}</th>\r\n                <th>\r\n                    {{\r\n                        'catalog.price-in-channel'\r\n                            | translate: { channel: currentChannel?.code | channelCodeToLabel | translate }\r\n                    }}\r\n                </th>\r\n                <th>\r\n                    <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\r\n                        {{ 'catalog.price-in-channel' | translate: { channel: selectedChannel?.code } }}\r\n                    </ng-template>\r\n                    <ng-template #noSelection>\r\n                        {{ 'catalog.no-channel-selected' | translate }}\r\n                    </ng-template>\r\n                </th>\r\n            </tr>\r\n        </thead>\r\n        <tbody>\r\n            <tr *ngFor=\"let row of variantsPreview$ | async\">\r\n                <td>{{ row.name }}</td>\r\n                <td>{{ row.price | localeCurrency: currentChannel?.currencyCode }}</td>\r\n                <td>\r\n                    <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noChannelSelected\">\r\n                        {{ row.pricePreview | localeCurrency: selectedChannel?.currencyCode }}\r\n                    </ng-template>\r\n                    <ng-template #noChannelSelected> - </ng-template>\r\n                </td>\r\n            </tr>\r\n        </tbody>\r\n    </table>\r\n</div>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button type=\"submit\" (click)=\"assign()\" [disabled]=\"!selectedChannel\" class=\"btn btn-primary\">\r\n        <ng-template [ngIf]=\"selectedChannel\" [ngIfElse]=\"noSelection\">\r\n            {{ 'catalog.assign-to-named-channel' | translate: { channelCode: selectedChannel?.code } }}\r\n        </ng-template>\r\n        <ng-template #noSelection>\r\n            {{ 'catalog.no-channel-selected' | translate }}\r\n        </ng-template>\r\n    </button>\r\n</ng-template>\r\n","styles":["vdr-channel-assignment-control{min-width:200px}.channel-price-preview{margin-top:24px}.channel-price-preview table.table{margin-top:6px}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":34,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":34,"character":79}]}],"ngOnInit":[{"__symbolic":"method"}],"selectChannel":[{"__symbolic":"method"}],"assign":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}],"getTopVariants":[{"__symbolic":"method"}]}},"CollectionContentsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":33,"character":1},"arguments":[{"selector":"vdr-collection-contents","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":37,"character":21},"member":"OnPush"},"template":"<div class=\"contents-header\">\r\n    <div class=\"header-title-row\">\r\n        <ng-container\r\n            *ngTemplateOutlet=\"headerTemplate; context: { $implicit: contentsTotalItems$ | async }\"\r\n        ></ng-container>\r\n    </div>\r\n    <input\r\n        type=\"text\"\r\n        [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n        [formControl]=\"filterTermControl\"\r\n    />\r\n</div>\r\n<div class=\"table-wrapper\">\r\n    <div class=\"progress loop\" [class.visible]=\"isLoading\"></div>\r\n    <vdr-data-table\r\n        [class.loading]=\"isLoading\"\r\n        [items]=\"contents$ | async\"\r\n        [itemsPerPage]=\"contentsItemsPerPage$ | async\"\r\n        [totalItems]=\"contentsTotalItems$ | async\"\r\n        [currentPage]=\"contentsCurrentPage$ | async\"\r\n        (pageChange)=\"setContentsPageNumber($event)\"\r\n        (itemsPerPageChange)=\"setContentsItemsPerPage($event)\"\r\n    >\r\n        <ng-template let-variant=\"item\">\r\n            <td class=\"left align-middle\">{{ variant.name }}</td>\r\n            <td class=\"left align-middle\"><small class=\"sku\">{{ variant.sku }}</small></td>\r\n            <td class=\"right align-middle\">\r\n                <vdr-table-row-action\r\n                    iconShape=\"edit\"\r\n                    [label]=\"'common.edit' | translate\"\r\n                    [linkTo]=\"['/catalog/products', variant.productId, { tab: 'variants' }]\"\r\n                ></vdr-table-row-action>\r\n            </td>\r\n        </ng-template>\r\n    </vdr-data-table>\r\n</div>\r\n","styles":[".contents-header{background-color:var(--color-component-bg-100);position:sticky;top:0;padding:6px;z-index:1;border-bottom:1px solid var(--color-component-border-200)}.contents-header .header-title-row{display:flex;justify-content:space-between;align-items:center}.contents-header .clr-input{width:100%}:host{display:block}:host ::ng-deep table{margin-top:-1px}vdr-data-table{opacity:1;transition:opacity .3s}vdr-data-table.loading{opacity:.5}.table-wrapper{position:relative}.progress{position:absolute;top:0;left:0;overflow:hidden;height:6px;opacity:0;transition:opacity .1s}.progress.visible{opacity:1}.sku{color:var(--color-text-200)}\n"]}]}],"members":{"collectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":40,"character":5}}]}],"parentId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":41,"character":5}}]}],"updatedFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":42,"character":5}}]}],"previewUpdatedFilters":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":43,"character":5}}]}],"headerTemplate":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ContentChild","line":44,"character":5},"arguments":[{"__symbolic":"reference","module":"@angular/core","name":"TemplateRef","line":44,"character":18},{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":58,"character":31},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":58,"character":63},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":58,"character":92}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"setContentsPageNumber":[{"__symbolic":"method"}],"setContentsItemsPerPage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}],"setParam":[{"__symbolic":"method"}]}},"CollectionDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":47,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":40,"character":1},"arguments":[{"selector":"vdr-collection-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":44,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"collection-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                *vdrIfPermissions=\"updatePermission\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"(detailForm.invalid || detailForm.pristine) && !assetsChanged()\"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as category\">\r\n    <div class=\"clr-row\">\r\n        <div class=\"clr-col\">\r\n            <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n                <clr-toggle-wrapper>\r\n                    <input\r\n                        type=\"checkbox\"\r\n                        clrToggle\r\n                        formControlName=\"visible\"\r\n                        id=\"visibility\"\r\n                        [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                    />\r\n                    <label class=\"visible-toggle\">\r\n                        <ng-container *ngIf=\"detailForm.value.visible; else private\">{{\r\n                            'catalog.public' | translate\r\n                        }}</ng-container>\r\n                        <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n                    </label>\r\n                </clr-toggle-wrapper>\r\n            </vdr-form-field>\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]=\"!(updatePermission | hasPermission)\"\r\n                    (input)=\"updateSlug($event.target.value)\"\r\n                />\r\n            </vdr-form-field>\r\n            <vdr-form-field\r\n                [label]=\"'catalog.slug' | translate\"\r\n                for=\"slug\"\r\n                [errors]=\"{ pattern: ('catalog.slug-pattern-error' | translate) }\"\r\n            >\r\n                <input\r\n                    id=\"slug\"\r\n                    type=\"text\"\r\n                    formControlName=\"slug\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                />\r\n            </vdr-form-field>\r\n            <vdr-rich-text-editor\r\n                formControlName=\"description\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                [label]=\"'common.description' | translate\"\r\n            ></vdr-rich-text-editor>\r\n\r\n            <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                <label>{{ 'common.custom-fields' | translate }}</label>\r\n                <vdr-tabbed-custom-fields\r\n                    entityName=\"Collection\"\r\n                    [customFields]=\"customFields\"\r\n                    [customFieldsFormGroup]=\"detailForm.get(['customFields'])\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                ></vdr-tabbed-custom-fields>\r\n            </section>\r\n            <vdr-custom-detail-component-host\r\n                locationId=\"collection-detail\"\r\n                [entity$]=\"entity$\"\r\n                [detailForm]=\"detailForm\"\r\n            ></vdr-custom-detail-component-host>\r\n        </div>\r\n        <div class=\"clr-col-md-auto\">\r\n            <vdr-assets\r\n                [assets]=\"category.assets\"\r\n                [featuredAsset]=\"category.featuredAsset\"\r\n                [updatePermissions]=\"updatePermission\"\r\n                (change)=\"assetChanges = $event\"\r\n            ></vdr-assets>\r\n        </div>\r\n    </div>\r\n    <div class=\"clr-row\" formArrayName=\"filters\">\r\n        <div class=\"clr-col\">\r\n            <label>{{ 'catalog.filters' | translate }}</label>\r\n            <ng-container *ngFor=\"let filter of filters; index as i; trackBy:trackByFn\">\r\n                <vdr-configurable-input\r\n                    (remove)=\"removeFilter(i)\"\r\n                    [position]=\"i\"\r\n                    [operation]=\"filter\"\r\n                    [operationDefinition]=\"getFilterDefinition(filter)\"\r\n                    [formControlName]=\"i\"\r\n                    [readonly]=\"!(updatePermission | hasPermission)\"\r\n                ></vdr-configurable-input>\r\n            </ng-container>\r\n\r\n            <div *vdrIfPermissions=\"updatePermission\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'marketing.add-condition' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let filter of allFilters\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"addFilter(filter)\"\r\n                        >\r\n                            {{ filter.description }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </div>\r\n        </div>\r\n        <div class=\"clr-col\">\r\n            <vdr-collection-contents\r\n                [collectionId]=\"id\"\r\n                [parentId]=\"parentId$ | async\"\r\n                [updatedFilters]=\"updatedFilters$ | async\"\r\n                [previewUpdatedFilters]=\"livePreview\"\r\n                #collectionContents\r\n            >\r\n                <ng-template let-count>\r\n                    <div class=\"contents-title\">\r\n                        {{ 'catalog.collection-contents' | translate }} ({{\r\n                            'common.results-count' | translate: { count: count }\r\n                        }})\r\n                    </div>\r\n                    <clr-checkbox-wrapper [class.disabled]=\"detailForm.get('filters')?.pristine\">\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrCheckbox\r\n                            [ngModelOptions]=\"{ standalone: true }\"\r\n                            [disabled]=\"detailForm.get('filters')?.pristine\"\r\n                            [ngModel]=\"livePreview\"\r\n                            (ngModelChange)=\"toggleLivePreview()\"\r\n                        />\r\n                        <label>{{ 'catalog.live-preview-contents' | translate }}</label>\r\n                    </clr-checkbox-wrapper>\r\n                </ng-template>\r\n            </vdr-collection-contents>\r\n        </div>\r\n    </div>\r\n</form>\r\n","styles":[".visible-toggle{margin-top:-3px!important}clr-checkbox-wrapper{transition:opacity .3s}clr-checkbox-wrapper.disabled{opacity:.5}\n"]}]}],"members":{"contentsComponent":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":60,"character":5},"arguments":["collectionContents"]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":63,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":64,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":65,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":66,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":67,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":68,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":69,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":70,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"LocalStorageService","line":71,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"getFilterDefinition":[{"__symbolic":"method"}],"assetsChanged":[{"__symbolic":"method"}],"updateSlug":[{"__symbolic":"method"}],"addFilter":[{"__symbolic":"method"}],"removeFilter":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"toggleLivePreview":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"getUpdatedCollection":[{"__symbolic":"method"}],"mapOperationsToInputs":[{"__symbolic":"method"}]}},"CollectionListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"vdr-collection-list","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex center wrap\">\r\n            <vdr-language-selector\r\n                class=\"mt2\"\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n            <clr-checkbox-wrapper\r\n                class=\"expand-all-toggle ml3\"\r\n                [ngClass]=\"(availableLanguages$ | async)?.length === 1 ? 'mt3' : 'mt1'\"\r\n            >\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"expandAll\" (change)=\"toggleExpandAll()\"/>\r\n                <label>{{ 'catalog.expand-all-collections' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <input\r\n                type='text'\r\n                name='searchTerm'\r\n                [formControl]='filterTermControl'\r\n                [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n                class='clr-input search-input ml4'\r\n            />\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"collection-list\"></vdr-action-bar-items>\r\n        <a\r\n            class=\"btn btn-primary\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\r\n            [routerLink]=\"['./create']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-new-collection' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"collection-wrapper\">\r\n    <vdr-collection-tree\r\n        [collections]=\"items$ | async\"\r\n        [activeCollectionId]=\"activeCollectionId$ | async\"\r\n        [expandAll]=\"expandAll\"\r\n        [expandedIds]=\"expandedIds\"\r\n        (rearrange)=\"onRearrange($event)\"\r\n        (deleteCollection)=\"deleteCollection($event)\"\r\n    ></vdr-collection-tree>\r\n\r\n    <div class=\"collection-contents\" [class.expanded]=\"activeCollectionId$ | async\">\r\n        <vdr-collection-contents [collectionId]=\"activeCollectionId$ | async\">\r\n            <ng-template let-count>\r\n                <div class=\"collection-title\">\r\n                    {{ activeCollectionTitle$ | async }} ({{\r\n                        'common.results-count' | translate: { count: count }\r\n                    }})\r\n                </div>\r\n                <button type=\"button\" class=\"close-button\" (click)=\"closeContents()\">\r\n                    <clr-icon shape=\"close\"></clr-icon>\r\n                </button>\r\n            </ng-template>\r\n        </vdr-collection-contents>\r\n    </div>\r\n</div>\r\n","styles":[":host{height:100%;display:flex;flex-direction:column}.expand-all-toggle{display:block}.collection-wrapper{display:flex;height:calc(100% - 50px)}.collection-wrapper vdr-collection-tree{flex:1;height:100%;overflow:auto}.collection-wrapper .collection-contents{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.collection-wrapper .collection-contents.expanded{width:30vw;visibility:visible;opacity:1;padding-left:12px}.collection-wrapper .collection-contents .close-button{margin:0;background:none;border:none;cursor:pointer}.paging-controls{padding-top:6px;border-top:1px solid var(--color-component-border-100);display:flex;justify-content:space-between}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":46,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":47,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":48,"character":30},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":24},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":50,"character":23},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":51,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"toggleExpandAll":[{"__symbolic":"method"}],"onRearrange":[{"__symbolic":"method"}],"deleteCollection":[{"__symbolic":"method"}],"closeContents":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}],"refresh":[{"__symbolic":"method"}]}},"HasParent":{"__symbolic":"interface"},"TreeNode":{"__symbolic":"interface"},"RootNode":{"__symbolic":"interface"},"arrayToTree":{"__symbolic":"function"},"CollectionTreeNodeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"vdr-collection-tree-node","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":21},"member":"OnPush"},"template":"<div\r\n    cdkDropList\r\n    class=\"tree-node\"\r\n    #dropList\r\n    [cdkDropListData]=\"collectionTree\"\r\n    [cdkDropListDisabled]=\"!(hasUpdatePermission$ | async)\"\r\n    (cdkDropListDropped)=\"drop($event)\"\r\n>\r\n    <div\r\n        class=\"collection\"\r\n        [class.private]=\"collection.isPrivate\"\r\n        *ngFor=\"let collection of collectionTree.children; index as i; trackBy: trackByFn\"\r\n        cdkDrag\r\n        [cdkDragData]=\"collection\"\r\n    >\r\n        <div\r\n            class=\"collection-detail\"\r\n            [ngClass]=\"'depth-' + depth\"\r\n            [class.active]=\"collection.id === activeCollectionId\"\r\n        >\r\n            <div class=\"name\">\r\n                <button\r\n                    class=\"icon-button folder-button\"\r\n                    [disabled]=\"expandAll\"\r\n                    *ngIf=\"collection.children?.length; else folderSpacer\"\r\n                    (click)=\"toggleExpanded(collection)\"\r\n                >\r\n                    <clr-icon shape=\"folder\" *ngIf=\"!collection.expanded && !expandAll\"></clr-icon>\r\n                    <clr-icon shape=\"folder-open\" *ngIf=\"collection.expanded || expandAll\"></clr-icon>\r\n                </button>\r\n                <ng-template #folderSpacer>\r\n                    <div class=\"folder-button-spacer\"></div>\r\n                </ng-template>\r\n                {{ collection.name }}\r\n            </div>\r\n            <div class=\"flex-spacer\"></div>\r\n            <vdr-chip *ngIf=\"collection.isPrivate\">{{ 'catalog.private' | translate }}</vdr-chip>\r\n            <a\r\n                class=\"btn btn-link btn-sm\"\r\n                [routerLink]=\"['./', { contents: collection.id }]\"\r\n                queryParamsHandling=\"preserve\"\r\n            >\r\n                <clr-icon shape=\"view-list\"></clr-icon>\r\n                {{ 'catalog.view-contents' | translate }}\r\n            </a>\r\n            <a class=\"btn btn-link btn-sm\" [routerLink]=\"['/catalog/collections/', collection.id]\">\r\n                <clr-icon shape=\"edit\"></clr-icon>\r\n                {{ 'common.edit' | translate }}\r\n            </a>\r\n            <div class=\"drag-handle\" cdkDragHandle *vdrIfPermissions=\"['UpdateCatalog', 'UpdateCollection']\">\r\n                <clr-icon shape=\"drag-handle\" size=\"24\"></clr-icon>\r\n            </div>\r\n            <vdr-dropdown>\r\n                <button class=\"icon-button\" vdrDropdownTrigger (click)=\"getMoveListItems(collection)\">\r\n                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <a\r\n                        class=\"dropdown-item\"\r\n                        [routerLink]=\"['./', 'create', { parentId: collection.id }]\"\r\n                        *vdrIfPermissions=\"['CreateCatalog', 'CreateCollection']\"\r\n                    >\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'catalog.create-new-collection' | translate }}\r\n                    </a>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"i === 0 || !(hasUpdatePermission$ | async)\"\r\n                        (click)=\"moveUp(collection, i)\"\r\n                    >\r\n                        <clr-icon shape=\"caret up\"></clr-icon>\r\n                        {{ 'catalog.move-up' | translate }}\r\n                    </button>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"\r\n                            i === collectionTree.children.length - 1 || !(hasUpdatePermission$ | async)\r\n                        \"\r\n                        (click)=\"moveDown(collection, i)\"\r\n                    >\r\n                        <clr-icon shape=\"caret down\"></clr-icon>\r\n                        {{ 'catalog.move-down' | translate }}\r\n                    </button>\r\n                    <h4 class=\"dropdown-header\">{{ 'catalog.move-to' | translate }}</h4>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        *ngFor=\"let item of moveListItems\"\r\n                        (click)=\"move(collection, item.id)\"\r\n                        [disabled]=\"!(hasUpdatePermission$ | async)\"\r\n                    >\r\n                        <div class=\"move-to-item\">\r\n                            <div class=\"move-icon\">\r\n                                <clr-icon shape=\"child-arrow\"></clr-icon>\r\n                            </div>\r\n                            <div class=\"path\">\r\n                                {{ item.path }}\r\n                            </div>\r\n                        </div>\r\n                    </button>\r\n                    <div class=\"dropdown-divider\"></div>\r\n                    <button\r\n                        class=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"delete(collection.id)\"\r\n                        [disabled]=\"!(hasDeletePermission$ | async)\"\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n        <vdr-collection-tree-node\r\n            *ngIf=\"collection.expanded || expandAll\"\r\n            [expandAll]=\"expandAll\"\r\n            [collectionTree]=\"collection\"\r\n            [activeCollectionId]=\"activeCollectionId\"\r\n        ></vdr-collection-tree-node>\r\n    </div>\r\n</div>\r\n","styles":[":host{display:block}.collection{background-color:var(--color-component-bg-100);font-size:.65rem;transition:transform .25s cubic-bezier(0,0,.2,1);margin-bottom:2px;border-left:2px solid transparent;transition:border-left-color .2s}.collection.private{background-color:var(--color-component-bg-200)}.collection .collection-detail{padding:6px 12px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-component-border-100)}.collection .collection-detail.active{background-color:var(--clr-global-selection-color)}.collection .collection-detail.depth-1{padding-left:36px}.collection .collection-detail.depth-2{padding-left:60px}.collection .collection-detail.depth-3{padding-left:84px}.collection .collection-detail.depth-4{padding-left:108px}.collection .collection-detail .folder-button-spacer{display:inline-block;width:28px}.tree-node{display:block;background:var(--color-component-bg-100);overflow:hidden}.tree-node.cdk-drop-list-dragging>.collection{border-left-color:var(--color-primary-300)}.drag-placeholder{min-height:120px;background-color:var(--color-component-bg-300);transition:transform .25s cubic-bezier(0,0,.2,1)}.cdk-drag-preview{box-sizing:border-box;border-radius:4px;box-shadow:0 5px 5px -3px #0003,0 8px 10px 1px #00000024,0 3px 14px 2px #0000001f}.cdk-drag-placeholder{opacity:0}.cdk-drag-animating{transition:transform .25s cubic-bezier(0,0,.2,1)}.example-list.cdk-drop-list-dragging .tree-node:not(.cdk-drag-placeholder){transition:transform .25s cubic-bezier(0,0,.2,1)}.move-to-item{display:flex;white-space:normal;align-items:baseline}.move-to-item .move-icon{flex:none;margin-right:3px}.move-to-item .path{line-height:18px}\n"]}]}],"members":{"collectionTree":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":28,"character":5}}]}],"activeCollectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":29,"character":5}}]}],"expandAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":30,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"SkipSelf","line":36,"character":9}},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Optional","line":36,"character":21}}],null,null,null,null],"parameters":[{"__symbolic":"reference","name":"CollectionTreeNodeComponent"},{"__symbolic":"reference","name":"CollectionTreeComponent"},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":38,"character":29},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":39,"character":24},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":40,"character":23}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"toggleExpanded":[{"__symbolic":"method"}],"getMoveListItems":[{"__symbolic":"method"}],"move":[{"__symbolic":"method"}],"moveUp":[{"__symbolic":"method"}],"moveDown":[{"__symbolic":"method"}],"drop":[{"__symbolic":"method"}],"delete":[{"__symbolic":"method"}]}},"RearrangeEvent":{"__symbolic":"interface"},"CollectionPartial":{"__symbolic":"interface"},"CollectionTreeComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":17,"character":1},"arguments":[{"selector":"vdr-collection-tree","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":21,"character":21},"member":"OnPush"},"template":"<vdr-collection-tree-node\r\n    *ngIf=\"collectionTree\"\r\n    cdkDropListGroup\r\n    [expandAll]=\"expandAll\"\r\n    [collectionTree]=\"collectionTree\"\r\n    [activeCollectionId]=\"activeCollectionId\"\r\n></vdr-collection-tree-node>\r\n","styles":[""]}]}],"members":{"collections":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"activeCollectionId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"expandAll":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5}}]}],"expandedIds":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"rearrange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":5}}]}],"deleteCollection":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":29,"character":5}}]}],"ngOnChanges":[{"__symbolic":"method"}],"onDrop":[{"__symbolic":"method"}],"onMove":[{"__symbolic":"method"}],"onDelete":[{"__symbolic":"method"}],"getMoveListItems":[{"__symbolic":"method"}],"calculateAllMoveListItems":[{"__symbolic":"method"}],"isRootNode":[{"__symbolic":"method"}]}},"ConfirmVariantDeletionDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"vdr-confirm-variant-deletion-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":7,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>\r\n    {{ 'catalog.confirm-deletion-of-unused-variants-title' | translate }}\r\n</ng-template>\r\n{{ 'catalog.confirm-deletion-of-unused-variants-body' | translate }}\r\n<ul>\r\n    <li *ngFor=\"let variant of variants\">{{ variant.name }} ({{ variant.sku }})</li>\r\n</ul>\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button type=\"submit\" (click)=\"confirm()\" class=\"btn btn-primary\">\r\n        {{ 'common.confirm' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"confirm":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}]}},"FacetDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":34,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":27,"character":1},"arguments":[{"selector":"vdr-facet-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":31,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"facet-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                *vdrIfPermissions=\"updatePermission\"\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"detailForm.invalid || detailForm.pristine\"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"entity$ | async as facet\">\r\n    <section class=\"form-block\" formGroupName=\"facet\">\r\n        <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n            <clr-toggle-wrapper>\r\n                <input\r\n                    type=\"checkbox\"\r\n                    clrToggle\r\n                    [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                    formControlName=\"visible\"\r\n                    id=\"visibility\"\r\n                />\r\n                <label class=\"visible-toggle\">\r\n                    <ng-container *ngIf=\"detailForm.value.facet.visible; else private\">{{\r\n                        'catalog.public' | translate\r\n                    }}</ng-container>\r\n                    <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n                </label>\r\n            </clr-toggle-wrapper>\r\n        </vdr-form-field>\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]=\"!(updatePermission | hasPermission)\"\r\n                (input)=\"updateCode(facet.code, $event.target.value)\"\r\n            />\r\n        </vdr-form-field>\r\n        <vdr-form-field\r\n            [label]=\"'common.code' | translate\"\r\n            for=\"code\"\r\n            [readOnlyToggle]=\"updatePermission | hasPermission\"\r\n        >\r\n            <input\r\n                id=\"code\"\r\n                type=\"text\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                formControlName=\"code\"\r\n            />\r\n        </vdr-form-field>\r\n\r\n        <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n            <label>{{ 'common.custom-fields' | translate }}</label>\r\n            <vdr-tabbed-custom-fields\r\n                entityName=\"Facet\"\r\n                [customFields]=\"customFields\"\r\n                [customFieldsFormGroup]=\"detailForm.get(['facet', 'customFields'])\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n            ></vdr-tabbed-custom-fields>\r\n        </section>\r\n        <vdr-custom-detail-component-host\r\n            locationId=\"facet-detail\"\r\n            [entity$]=\"entity$\"\r\n            [detailForm]=\"detailForm\"\r\n        ></vdr-custom-detail-component-host>\r\n    </section>\r\n\r\n    <section class=\"form-block\" *ngIf=\"!(isNew$ | async)\">\r\n        <label>{{ 'catalog.facet-values' | translate }}</label>\r\n\r\n        <table class=\"facet-values-list table\" formArrayName=\"values\" *ngIf=\"0 < getValuesFormArray().length\">\r\n            <thead>\r\n                <tr>\r\n                    <th></th>\r\n                    <th>{{ 'common.name' | translate }}</th>\r\n                    <th>{{ 'common.code' | translate }}</th>\r\n                    <ng-container *ngIf=\"customValueFields.length\">\r\n                        <th>{{ 'common.custom-fields' | translate }}</th>\r\n                    </ng-container>\r\n                    <th></th>\r\n                </tr>\r\n            </thead>\r\n            <tbody>\r\n                <tr class=\"facet-value\" *ngFor=\"let value of values; let i = index\" [formGroupName]=\"i\">\r\n                    <td class=\"align-middle\">\r\n                        <vdr-entity-info [entity]=\"value\"></vdr-entity-info>\r\n                    </td>\r\n                    <td class=\"align-middle\">\r\n                        <input\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            (input)=\"updateValueCode(facet.values[i]?.code, $event.target.value, i)\"\r\n                        />\r\n                    </td>\r\n                    <td class=\"align-middle\"><input type=\"text\" formControlName=\"code\" readonly /></td>\r\n                    <td class=\"\" *ngIf=\"customValueFields.length\">\r\n                        <vdr-tabbed-custom-fields\r\n                            entityName=\"FacetValue\"\r\n                            [customFields]=\"customValueFields\"\r\n                            [compact]=\"true\"\r\n                            [customFieldsFormGroup]=\"detailForm.get(['values', i, 'customFields'])\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        ></vdr-tabbed-custom-fields>\r\n                    </td>\r\n                    <td class=\"align-middle\">\r\n                        <vdr-dropdown>\r\n                            <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                                {{ 'common.actions' | translate }}\r\n                                <clr-icon shape=\"caret down\"></clr-icon>\r\n                            </button>\r\n                            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                <button\r\n                                    type=\"button\"\r\n                                    class=\"delete-button\"\r\n                                    (click)=\"deleteFacetValue(facet.values[i]?.id, i)\"\r\n                                    [disabled]=\"!(updatePermission | hasPermission)\"\r\n                                    vdrDropdownItem\r\n                                >\r\n                                    <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                                    {{ 'common.delete' | translate }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                    </td>\r\n                </tr>\r\n            </tbody>\r\n        </table>\r\n\r\n        <div>\r\n            <button\r\n                type=\"button\"\r\n                class=\"btn btn-secondary\"\r\n                *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\r\n                (click)=\"addFacetValue()\"\r\n            >\r\n                <clr-icon shape=\"add\"></clr-icon>\r\n                {{ 'catalog.add-facet-value' | translate }}\r\n            </button>\r\n        </div>\r\n    </section>\r\n</form>\r\n","styles":[".visible-toggle{margin-top:-3px!important}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":44,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":45,"character":15},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":46,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":47,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":48,"character":31},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":49,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":50,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":51,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"updateCode":[{"__symbolic":"method"}],"updateValueCode":[{"__symbolic":"method"}],"customValueFieldIsSet":[{"__symbolic":"method"}],"getValuesFormArray":[{"__symbolic":"method"}],"addFacetValue":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"deleteFacetValue":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"getUpdatedFacet":[{"__symbolic":"method"}],"getCreatedFacetValues":[{"__symbolic":"method"}],"getUpdatedFacetValues":[{"__symbolic":"method"}]}},"FacetListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":24,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":18,"character":1},"arguments":[{"selector":"vdr-facet-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex center wrap\">\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            <input\r\n                type=\"text\"\r\n                name=\"searchTerm\"\r\n                [formControl]=\"filterTermControl\"\r\n                [placeholder]=\"'catalog.filter-by-name' | translate\"\r\n                class=\"clr-input search-input ml4\"\r\n            />\r\n        </div>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"facet-list\"></vdr-action-bar-items>\r\n        <a\r\n            class=\"btn btn-primary\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateFacet']\"\r\n            [routerLink]=\"['./create']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'catalog.create-new-facet' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column [expand]=\"true\">{{ 'catalog.values' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'catalog.visibility' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-facet=\"item\">\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">{{ facet.code }}</td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">{{ facet.name }}</td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-facet-value-chip\r\n                *ngFor=\"let value of facet.values | slice: 0:displayLimit[facet.id] || 3\"\r\n                [facetValue]=\"value\"\r\n                [removable]=\"false\"\r\n                [displayFacetName]=\"false\"\r\n            ></vdr-facet-value-chip>\r\n            <button\r\n                class=\"btn btn-sm btn-secondary btn-icon\"\r\n                *ngIf=\"facet.values.length > initialLimit\"\r\n                (click)=\"toggleDisplayLimit(facet)\"\r\n            >\r\n                <ng-container *ngIf=\"(displayLimit[facet.id] || 0) < facet.values.length; else collapse\">\r\n                    <clr-icon shape=\"plus\"></clr-icon>\r\n                    {{ facet.values.length - initialLimit }}\r\n                </ng-container>\r\n                <ng-template #collapse>\r\n                    <clr-icon shape=\"minus\"></clr-icon>\r\n                </ng-template>\r\n            </button>\r\n        </td>\r\n        <td class=\"left align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-chip>\r\n                <ng-container *ngIf=\"!facet.isPrivate; else private\">{{\r\n                    'catalog.public' | translate\r\n                }}</ng-container>\r\n                <ng-template #private>{{ 'catalog.private' | translate }}</ng-template>\r\n            </vdr-chip>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-table-row-action\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', facet.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.private]=\"facet.isPrivate\">\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                    {{ 'common.actions' | translate }}\r\n                    <clr-icon shape=\"caret down\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteFacet(facet.id)\"\r\n                        [disabled]=\"!(['DeleteCatalog', 'DeleteFacet'] | hasPermission)\"\r\n                        vdrDropdownItem\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n","styles":["td.private{background-color:var(--color-component-bg-200)}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":33,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":34,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":35,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":36,"character":37},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":37,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":38,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"toggleDisplayLimit":[{"__symbolic":"method"}],"deleteFacet":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}],"showModalAndDelete":[{"__symbolic":"method"}]}},"CreateVariantValues":{"__symbolic":"interface"},"CreateProductVariantsConfig":{"__symbolic":"interface"},"GenerateProductVariantsComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":20,"character":1},"arguments":[{"selector":"vdr-generate-product-variants","template":"<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\r\n    <div class=\"name\">\r\n        <label>{{ 'catalog.option' | translate }}</label>\r\n        <input\r\n            placeholder=\"e.g. Size\"\r\n            clrInput\r\n            [(ngModel)]=\"group.name\"\r\n            name=\"name\"\r\n            required\r\n            (keydown.enter)=\"handleEnter($event, optionValueInputComponent)\"\r\n        />\r\n    </div>\r\n    <div class=\"values\">\r\n        <label>{{ 'catalog.option-values' | translate }}</label>\r\n        <vdr-option-value-input\r\n            #optionValueInputComponent\r\n            [(ngModel)]=\"group.values\"\r\n            (ngModelChange)=\"generateVariants()\"\r\n            [groupName]=\"group.name\"\r\n            [disabled]=\"group.name === ''\"\r\n        ></vdr-option-value-input>\r\n    </div>\r\n    <div class=\"remove-group\">\r\n        <button\r\n            class=\"btn btn-icon btn-warning-outline\"\r\n            [title]=\"'catalog.remove-option' | translate\"\r\n            (click)=\"removeOption(group.name)\"\r\n        >\r\n            <clr-icon shape=\"trash\"></clr-icon>\r\n        </button>\r\n    </div>\r\n</div>\r\n<button class=\"btn btn-primary-outline btn-sm\" (click)=\"addOption()\">\r\n    <clr-icon shape=\"plus\"></clr-icon>\r\n    {{ 'catalog.add-option' | translate }}\r\n</button>\r\n\r\n<div class=\"variants-preview\">\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th *ngIf=\"1 < variants.length\">{{ 'common.create' | translate }}</th>\r\n                <th *ngIf=\"1 < variants.length\">{{ 'catalog.variant' | translate }}</th>\r\n                <th>{{ 'catalog.sku' | translate }}</th>\r\n                <th>{{ 'catalog.price' | translate }}</th>\r\n                <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n            </tr>\r\n        </thead>\r\n        <tr\r\n            *ngFor=\"let variant of variants; trackBy: trackByFn\"\r\n            [class.disabled]=\"!variantFormValues[variant.id].enabled\"\r\n        >\r\n            <td *ngIf=\"1 < variants.length\">\r\n                <input\r\n                    type=\"checkbox\"\r\n                    (change)=\"onFormChange()\"\r\n                    [(ngModel)]=\"variantFormValues[variant.id].enabled\"\r\n                    clrCheckbox\r\n                />\r\n            </td>\r\n            <td *ngIf=\"1 < variants.length\">\r\n                {{ variant.values.join(' ') }}\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <input\r\n                        clrInput\r\n                        type=\"text\"\r\n                        (change)=\"onFormChange()\"\r\n                        [(ngModel)]=\"variantFormValues[variant.id].sku\"\r\n                        [placeholder]=\"'catalog.sku' | translate\"\r\n                    />\r\n                </clr-input-container>\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <vdr-currency-input\r\n                        clrInput\r\n                        [(ngModel)]=\"variantFormValues[variant.id].price\"\r\n                        (ngModelChange)=\"onFormChange()\"\r\n                        [currencyCode]=\"currencyCode\"\r\n                    ></vdr-currency-input>\r\n                </clr-input-container>\r\n            </td>\r\n            <td>\r\n                <clr-input-container>\r\n                    <input\r\n                        clrInput\r\n                        type=\"number\"\r\n                        [(ngModel)]=\"variantFormValues[variant.id].stock\"\r\n                        (change)=\"onFormChange()\"\r\n                        min=\"0\"\r\n                        step=\"1\"\r\n                    />\r\n                </clr-input-container>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>\r\n","styles":[":host{display:block;margin-bottom:120px}.option-groups{display:flex}.values{flex:1;margin:0 6px}.remove-group{padding-top:18px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"]}]}],"members":{"variantsChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":31,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"addOption":[{"__symbolic":"method"}],"removeOption":[{"__symbolic":"method"}],"generateVariants":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"handleEnter":[{"__symbolic":"method"}],"onFormChange":[{"__symbolic":"method"}],"copyFromDefault":[{"__symbolic":"method"}]}},"OPTION_VALUE_INPUT_VALUE_ACCESSOR":{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":14,"character":13},"useExisting":{"__symbolic":"reference","name":"OptionValueInputComponent"},"multi":true},"OptionValueInputComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":19,"character":1},"arguments":[{"selector":"vdr-option-value-input","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":23,"character":21},"member":"Default"},"providers":[{"__symbolic":"reference","name":"OPTION_VALUE_INPUT_VALUE_ACCESSOR"}],"template":"<div class=\"input-wrapper\" [class.focus]=\"isFocussed\" (click)=\"textArea.focus()\">\r\n    <div class=\"chips\" *ngIf=\"0 < options.length\">\r\n        <vdr-chip\r\n            *ngFor=\"let option of options; last as isLast\"\r\n            [icon]=\"option.locked ? 'lock' : 'times'\"\r\n            [class.selected]=\"isLast && lastSelected\"\r\n            [class.locked]=\"option.locked\"\r\n            [colorFrom]=\"groupName\"\r\n            (iconClick)=\"removeOption(option)\"\r\n        >\r\n            {{ option.name }}\r\n        </vdr-chip>\r\n    </div>\r\n    <textarea\r\n        #textArea\r\n        (keyup)=\"handleKey($event)\"\r\n        (focus)=\"isFocussed = true\"\r\n        (blur)=\"handleBlur()\"\r\n        [(ngModel)]=\"input\"\r\n        [disabled]=\"disabled\"\r\n    ></textarea>\r\n</div>\r\n","styles":[".input-wrapper{background-color:#fff;border-radius:3px!important;border:1px solid var(--color-grey-300)!important;cursor:text}.input-wrapper.focus{border-color:var(--color-primary-500)!important;box-shadow:0 0 1px 1px var(--color-primary-100)}.input-wrapper .chips{padding:5px}.input-wrapper textarea{border:none;width:100%;height:24px;margin-top:3px;padding:0 6px}.input-wrapper textarea:focus{outline:none}.input-wrapper textarea:disabled{background-color:var(--color-component-bg-100)}vdr-chip ::ng-deep .wrapper{margin:0 3px}vdr-chip.locked{opacity:.8}vdr-chip.selected ::ng-deep .wrapper{border-color:var(--color-warning-500)!important;box-shadow:0 0 1px 1px var(--color-warning-400);opacity:.6}\n"]}]}],"members":{"groupName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"textArea":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":28,"character":5},"arguments":["textArea",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":37,"character":40}]}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"setDisabledState":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"focus":[{"__symbolic":"method"}],"removeOption":[{"__symbolic":"method"}],"handleKey":[{"__symbolic":"method"}],"handleBlur":[{"__symbolic":"method"}],"addOptionValue":[{"__symbolic":"method"}],"parseInputIntoOptions":[{"__symbolic":"method"}],"removeLastOption":[{"__symbolic":"method"}]}},"TabName":{"__symbolic":"interface"},"VariantFormValue":{"__symbolic":"interface"},"SelectedAssets":{"__symbolic":"interface"},"PaginationConfig":{"__symbolic":"interface"},"ProductDetailComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":96,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":89,"character":1},"arguments":[{"selector":"vdr-product-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":93,"character":21},"member":"OnPush"},"template":"<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <div class=\"flex clr-flex-row\">\r\n            <vdr-entity-info [entity]=\"entity$ | async\"></vdr-entity-info>\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(['product', 'enabled'])\"\r\n                />\r\n                <label>{{ 'common.enabled' | translate }}</label>\r\n            </clr-toggle-wrapper>\r\n        </div>\r\n        <vdr-language-selector\r\n            [disabled]=\"isNew$ | async\"\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        <vdr-action-bar-items locationId=\"product-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            (click)=\"create()\"\r\n            [disabled]=\"detailForm.invalid || detailForm.pristine || !variantsToCreateAreValid()\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\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 || detailForm.pristine) && !assetsChanged() && !variantAssetsChanged()\r\n                \"\r\n            >\r\n                {{ 'common.update' | translate }}\r\n            </button>\r\n        </ng-template>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"product$ | async as product\">\r\n    <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n    <clr-tabs>\r\n        <clr-tab>\r\n            <button clrTabLink (click)=\"navigateToTab('details')\">\r\n                {{ 'catalog.product-details' | translate }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive=\"(activeTab$ | async) === 'details'\">\r\n                <div class=\"clr-row\">\r\n                    <div class=\"clr-col\">\r\n                        <section class=\"form-block\" formGroupName=\"product\">\r\n                            <ng-container *ngIf=\"!(isNew$ | async)\">\r\n                                <ng-container *vdrIfMultichannel>\r\n                                    <vdr-form-item\r\n                                        [label]=\"'common.channels' | translate\"\r\n                                        *vdrIfDefaultChannelActive\r\n                                    >\r\n                                        <div class=\"flex channel-assignment\">\r\n                                            <ng-container *ngFor=\"let channel of productChannels$ | async\">\r\n                                                <vdr-chip\r\n                                                    *ngIf=\"!isDefaultChannel(channel.code)\"\r\n                                                    icon=\"times-circle\"\r\n                                                    (iconClick)=\"removeFromChannel(channel.id)\"\r\n                                                >\r\n                                                    <vdr-channel-badge\r\n                                                        [channelCode]=\"channel.code\"\r\n                                                    ></vdr-channel-badge>\r\n                                                    {{ channel.code | channelCodeToLabel }}\r\n                                                </vdr-chip>\r\n                                            </ng-container>\r\n                                            <button class=\"btn btn-sm\" (click)=\"assignToChannel()\">\r\n                                                <clr-icon shape=\"layers\"></clr-icon>\r\n                                                {{ 'catalog.assign-to-channel' | translate }}\r\n                                            </button>\r\n                                        </div>\r\n                                    </vdr-form-item>\r\n                                </ng-container>\r\n                            </ng-container>\r\n                            <vdr-form-field [label]=\"'catalog.product-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                                    (input)=\"updateSlug($event.target.value)\"\r\n                                />\r\n                            </vdr-form-field>\r\n                            <div\r\n                                class=\"auto-rename-wrapper\"\r\n                                [class.visible]=\"\r\n                                    (isNew$ | async) === false && detailForm.get(['product', 'name'])?.dirty\r\n                                \"\r\n                            >\r\n                                <clr-checkbox-wrapper>\r\n                                    <input\r\n                                        clrCheckbox\r\n                                        type=\"checkbox\"\r\n                                        id=\"auto-update\"\r\n                                        formControlName=\"autoUpdateVariantNames\"\r\n                                    />\r\n                                    <label>{{\r\n                                        'catalog.auto-update-product-variant-name' | translate\r\n                                    }}</label>\r\n                                </clr-checkbox-wrapper>\r\n                            </div>\r\n                            <vdr-form-field\r\n                                [label]=\"'catalog.slug' | translate\"\r\n                                for=\"slug\"\r\n                                [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n                            >\r\n                                <input\r\n                                    id=\"slug\"\r\n                                    type=\"text\"\r\n                                    formControlName=\"slug\"\r\n                                    [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                />\r\n                            </vdr-form-field>\r\n                            <vdr-rich-text-editor\r\n                                formControlName=\"description\"\r\n                                [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                [label]=\"'common.description' | translate\"\r\n                            ></vdr-rich-text-editor>\r\n\r\n                            <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                                <label>{{ 'common.custom-fields' | translate }}</label>\r\n                                <vdr-tabbed-custom-fields\r\n                                    entityName=\"Product\"\r\n                                    [customFields]=\"customFields\"\r\n                                    [customFieldsFormGroup]=\"detailForm.get(['product', 'customFields'])\"\r\n                                    [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                                ></vdr-tabbed-custom-fields>\r\n                            </section>\r\n                            <vdr-custom-detail-component-host\r\n                                locationId=\"product-detail\"\r\n                                [entity$]=\"entity$\"\r\n                                [detailForm]=\"detailForm\"\r\n                            ></vdr-custom-detail-component-host>\r\n                        </section>\r\n                    </div>\r\n                    <div class=\"clr-col-md-auto\">\r\n                        <vdr-assets\r\n                            [assets]=\"assetChanges.assets || product.assets\"\r\n                            [featuredAsset]=\"assetChanges.featuredAsset || product.featuredAsset\"\r\n                            [updatePermissions]=\"updatePermissions\"\r\n                            (change)=\"assetChanges = $event\"\r\n                        ></vdr-assets>\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]=\"['UpdateCatalog', 'UpdateProduct'] | hasPermission\"\r\n                                (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n                            ></vdr-facet-value-chip>\r\n                            <button\r\n                                class=\"btn btn-sm btn-secondary\"\r\n                                *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                                (click)=\"selectProductFacetValue()\"\r\n                            >\r\n                                <clr-icon shape=\"plus\"></clr-icon>\r\n                                {{ 'catalog.add-facets' | translate }}\r\n                            </button>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n\r\n                <div *ngIf=\"isNew$ | async\">\r\n                    <h4>{{ 'catalog.product-variants' | translate }}</h4>\r\n                    <vdr-generate-product-variants\r\n                        (variantsChange)=\"createVariantsConfig = $event\"\r\n                    ></vdr-generate-product-variants>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n        <clr-tab *ngIf=\"!(isNew$ | async)\">\r\n            <button clrTabLink (click)=\"navigateToTab('variants')\">\r\n                {{ 'catalog.product-variants' | translate }}\r\n            </button>\r\n            <clr-tab-content *clrIfActive=\"(activeTab$ | async) === 'variants'\">\r\n                <section class=\"form-block\">\r\n                    <div class=\"view-mode\">\r\n                        <div class=\"btn-group\">\r\n                            <button\r\n                                class=\"btn btn-secondary-outline\"\r\n                                (click)=\"variantDisplayMode = 'card'\"\r\n                                [class.btn-primary]=\"variantDisplayMode === 'card'\"\r\n                            >\r\n                                <clr-icon shape=\"list\"></clr-icon>\r\n                                {{ 'catalog.display-variant-cards' | translate }}\r\n                            </button>\r\n                            <button\r\n                                class=\"btn\"\r\n                                (click)=\"variantDisplayMode = 'table'\"\r\n                                [class.btn-primary]=\"variantDisplayMode === 'table'\"\r\n                            >\r\n                                <clr-icon shape=\"table\"></clr-icon>\r\n                                {{ 'catalog.display-variant-table' | translate }}\r\n                            </button>\r\n                        </div>\r\n                        <div class=\"variant-filter\">\r\n                            <input\r\n                                [formControl]=\"filterInput\"\r\n                                [placeholder]=\"'catalog.filter-by-name-or-sku' | translate\"\r\n                            />\r\n                            <button class=\"icon-button\" (click)=\"filterInput.setValue('')\">\r\n                                <clr-icon shape=\"times\"></clr-icon>\r\n                            </button>\r\n                        </div>\r\n                        <div class=\"flex-spacer\"></div>\r\n                        <a\r\n                            *vdrIfPermissions=\"['UpdateCatalog', 'UpdateProduct']\"\r\n                            [routerLink]=\"['./', 'manage-variants']\"\r\n                            class=\"btn btn-secondary edit-variants-btn\"\r\n                        >\r\n                            <clr-icon shape=\"add-text\"></clr-icon>\r\n                            {{ 'catalog.manage-variants' | translate }}\r\n                        </a>\r\n                    </div>\r\n\r\n                    <div class=\"pagination-row mt4\" *ngIf=\"10 < (paginationConfig$ | async)?.totalItems\">\r\n                        <vdr-items-per-page-controls\r\n                            [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                            (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n                        ></vdr-items-per-page-controls>\r\n\r\n                        <vdr-pagination-controls\r\n                            [id]=\"(paginationConfig$ | async)?.id\"\r\n                            [currentPage]=\"currentPage$ | async\"\r\n                            [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                            (pageChange)=\"setPage($event)\"\r\n                        ></vdr-pagination-controls>\r\n                    </div>\r\n\r\n                    <vdr-product-variants-table\r\n                        *ngIf=\"variantDisplayMode === 'table'\"\r\n                        [variants]=\"variants$ | async\"\r\n                        [paginationConfig]=\"paginationConfig$ | async\"\r\n                        [optionGroups]=\"product.optionGroups\"\r\n                        [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [productVariantsFormArray]=\"detailForm.get('variants')\"\r\n                        [pendingAssetChanges]=\"variantAssetChanges\"\r\n                    ></vdr-product-variants-table>\r\n                    <vdr-product-variants-list\r\n                        *ngIf=\"variantDisplayMode === 'card'\"\r\n                        [variants]=\"variants$ | async\"\r\n                        [paginationConfig]=\"paginationConfig$ | async\"\r\n                        [channelPriceIncludesTax]=\"channelPriceIncludesTax$ | async\"\r\n                        [facets]=\"facets$ | async\"\r\n                        [optionGroups]=\"product.optionGroups\"\r\n                        [productVariantsFormArray]=\"detailForm.get('variants')\"\r\n                        [taxCategories]=\"taxCategories$ | async\"\r\n                        [customFields]=\"customVariantFields\"\r\n                        [customOptionFields]=\"customOptionFields\"\r\n                        [activeLanguage]=\"languageCode$ | async\"\r\n                        [pendingAssetChanges]=\"variantAssetChanges\"\r\n                        (assignToChannel)=\"assignVariantToChannel($event)\"\r\n                        (removeFromChannel)=\"removeVariantFromChannel($event)\"\r\n                        (assetChange)=\"variantAssetChange($event)\"\r\n                        (updateProductOption)=\"updateProductOption($event)\"\r\n                        (selectionChange)=\"selectedVariantIds = $event\"\r\n                        (selectFacetValueClick)=\"selectVariantFacetValue($event)\"\r\n                    ></vdr-product-variants-list>\r\n                </section>\r\n                <div class=\"pagination-row mt4\" *ngIf=\"10 < (paginationConfig$ | async)?.totalItems\">\r\n                    <vdr-items-per-page-controls\r\n                        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                        (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n                    ></vdr-items-per-page-controls>\r\n\r\n                    <vdr-pagination-controls\r\n                        [id]=\"(paginationConfig$ | async)?.id\"\r\n                        [currentPage]=\"currentPage$ | async\"\r\n                        [itemsPerPage]=\"itemsPerPage$ | async\"\r\n                        (pageChange)=\"setPage($event)\"\r\n                    ></vdr-pagination-controls>\r\n                </div>\r\n            </clr-tab-content>\r\n        </clr-tab>\r\n    </clr-tabs>\r\n</form>\r\n","styles":[":host ::ng-deep trix-toolbar{top:24px}.facets{margin-top:12px;display:flex;flex-wrap:wrap;align-items:center}@media screen and (min-width: 768px){.facets{max-width:340px}}vdr-action-bar clr-toggle-wrapper{margin-top:12px}.variant-filter{flex:1;display:flex}.variant-filter input{flex:1;max-width:initial;border-radius:3px 0 0 3px!important}.variant-filter .icon-button{border:1px solid var(--color-component-border-300);background-color:var(--color-component-bg-100);border-radius:0 3px 3px 0;border-left:none}.group-name{padding-right:6px}.view-mode{display:flex;justify-content:flex-end;align-items:center}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;max-height:144px;overflow-y:auto}.auto-rename-wrapper{overflow:hidden;max-height:0;padding-left:9.5rem;margin-bottom:0;transition:max-height .2s,margin-bottom .2s}.auto-rename-wrapper.visible{max-height:24px;margin-bottom:12px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":129,"character":15},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":130,"character":16},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":131,"character":29},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":133,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":134,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":135,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":136,"character":31},{"__symbolic":"reference","module":"@angular/common","name":"Location","line":137,"character":26},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":138,"character":32}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"navigateToTab":[{"__symbolic":"method"}],"isDefaultChannel":[{"__symbolic":"method"}],"setPage":[{"__symbolic":"method"}],"setItemsPerPage":[{"__symbolic":"method"}],"assignToChannel":[{"__symbolic":"method"}],"removeFromChannel":[{"__symbolic":"method"}],"assignVariantToChannel":[{"__symbolic":"method"}],"removeVariantFromChannel":[{"__symbolic":"method"}],"assetsChanged":[{"__symbolic":"method"}],"variantAssetsChanged":[{"__symbolic":"method"}],"variantAssetChange":[{"__symbolic":"method"}],"updateSlug":[{"__symbolic":"method"}],"selectProductFacetValue":[{"__symbolic":"method"}],"updateProductOption":[{"__symbolic":"method"}],"removeProductFacetValue":[{"__symbolic":"method"}],"selectVariantFacetValue":[{"__symbolic":"method"}],"variantsToCreateAreValid":[{"__symbolic":"method"}],"displayFacetValueModal":[{"__symbolic":"method"}],"create":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}],"buildVariantFormArray":[{"__symbolic":"method"}],"getUpdatedProduct":[{"__symbolic":"method"}],"getUpdatedProductVariants":[{"__symbolic":"method"}],"getProductFormGroup":[{"__symbolic":"method"}],"updateSlugAfterSave":[{"__symbolic":"method"}]}},"ProductListComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseListComponent","line":36,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":30,"character":1},"arguments":[{"selector":"vdr-products-list","template":"<vdr-action-bar>\r\n    <vdr-ab-left [grow]=\"true\">\r\n        <div class=\"search-form\">\r\n            <vdr-product-search-input\r\n                #productSearchInputComponent\r\n                [facetValueResults]=\"facetValues$ | async\"\r\n                (searchTermChange)=\"setSearchTerm($event)\"\r\n                (facetValueChange)=\"setFacetValueIds($event)\"\r\n            ></vdr-product-search-input>\r\n            <vdr-dropdown class=\"search-settings-menu mr3\">\r\n                <button\r\n                    type=\"button\"\r\n                    class=\"icon-button search-index-button\"\r\n                    [title]=\"\r\n                        (pendingSearchIndexUpdates\r\n                            ? 'catalog.pending-search-index-updates'\r\n                            : 'catalog.search-index-controls'\r\n                        ) | translate\r\n                    \"\r\n                    vdrDropdownTrigger\r\n                >\r\n                    <clr-icon shape=\"cog\"></clr-icon>\r\n                    <vdr-status-badge *ngIf=\"pendingSearchIndexUpdates\" type=\"warning\"></vdr-status-badge>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <h4 class=\"dropdown-header\">{{ 'catalog.search-index-controls' | translate }}</h4>\r\n                    <ng-container *ngIf=\"pendingSearchIndexUpdates\">\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"run-updates-button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"runPendingSearchIndexUpdates()\"\r\n                            [disabled]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                        >\r\n                            <vdr-status-badge type=\"warning\"></vdr-status-badge>\r\n                            {{\r\n                            'catalog.run-pending-search-index-updates'\r\n                                | translate: {count: pendingSearchIndexUpdates}\r\n                            }}\r\n                        </button>\r\n                        <div class=\"dropdown-divider\"></div>\r\n                    </ng-container>\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"rebuildSearchIndex()\"\r\n                        [disabled]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n                    >\r\n                        {{ 'catalog.rebuild-search-index' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </div>\r\n        <div class=\"flex wrap\">\r\n            <clr-checkbox-wrapper class=\"mt2\">\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"groupByProduct\" (ngModelChange)=\"refresh()\"/>\r\n                <label>{{ 'catalog.group-by-product' | translate }}</label>\r\n            </clr-checkbox-wrapper>\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        </div>\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=\"btn btn-primary\"\r\n            [routerLink]=\"['./create']\"\r\n            *vdrIfPermissions=\"['CreateCatalog', 'CreateProduct']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            <span class=\"full-label\">{{ 'catalog.create-new-product' | translate }}</span>\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <ng-template let-result=\"item\">\r\n        <td class=\"left align-middle image-col\" [class.disabled]=\"!result.enabled\">\r\n            <div class=\"image-placeholder\">\r\n                <img\r\n                    *ngIf=\"\r\n                        groupByProduct\r\n                            ? result.productAsset\r\n                            : result.productVariantAsset || result.productAsset as asset;\r\n                        else imagePlaceholder\r\n                    \"\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        </td>\r\n        <td class=\"left align-middle\" [class.disabled]=\"!result.enabled\">\r\n            {{ groupByProduct ? result.productName : result.productVariantName }}\r\n        </td>\r\n        <td class=\"align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <vdr-chip *ngIf=\"!result.enabled\">{{ 'common.disabled' | translate }}</vdr-chip>\r\n        </td>\r\n        <td class=\"right align-middle\" [class.disabled]=\"!result.enabled\">\r\n            <vdr-table-row-action\r\n                class=\"edit-button\"\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', result.productId]\"\r\n            ></vdr-table-row-action>\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger>\r\n                    {{ 'common.actions' | translate }}\r\n                    <clr-icon shape=\"caret down\"></clr-icon>\r\n                </button>\r\n                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                    <button\r\n                        type=\"button\"\r\n                        class=\"delete-button\"\r\n                        (click)=\"deleteProduct(result.productId)\"\r\n                        [disabled]=\"!(['DeleteCatalog', 'DeleteProduct'] | hasPermission)\"\r\n                        vdrDropdownItem\r\n                    >\r\n                        <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                        {{ 'common.delete' | translate }}\r\n                    </button>\r\n                </vdr-dropdown-menu>\r\n            </vdr-dropdown>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n","styles":[".image-col{width:70px}.image-placeholder{width:50px;height:50px;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%;margin-bottom:6px}.search-input{min-width:300px}@media screen and (max-width: 768px){.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-right:24px}\n"]}]}],"members":{"productSearchInput":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":48,"character":5},"arguments":["productSearchInputComponent",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":51,"character":29},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":52,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":53,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"JobQueueService","line":54,"character":33},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":55,"character":37},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":56,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":57,"character":15}]}],"ngOnInit":[{"__symbolic":"method"}],"ngAfterViewInit":[{"__symbolic":"method"}],"setSearchTerm":[{"__symbolic":"method"}],"setFacetValueIds":[{"__symbolic":"method"}],"rebuildSearchIndex":[{"__symbolic":"method"}],"runPendingSearchIndexUpdates":[{"__symbolic":"method"}],"deleteProduct":[{"__symbolic":"method"}],"setLanguage":[{"__symbolic":"method"}]}},"ProductOptionsEditorComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseDetailComponent","line":35,"character":12},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":28,"character":1},"arguments":[{"selector":"vdr-product-options-editor","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":32,"character":21},"member":"OnPush"},"template":"<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=\"mr2\">\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<form class=\"form\" [formGroup]=\"detailForm\" *ngIf=\"optionGroups$ | async as optionGroups\">\r\n    <div formGroupName=\"optionGroups\" class=\"clr-row\">\r\n        <div class=\"clr-col-12 clr-col-xl-6\" *ngFor=\"let optionGroup of getOptionGroups(); index as i\">\r\n            <section class=\"card\" [formArrayName]=\"i\">\r\n                <div class=\"card-header option-group-header\">\r\n                    <vdr-entity-info [entity]=\"optionGroup.value\"></vdr-entity-info>\r\n                    <div class=\"ml2\">{{ optionGroup.value.code }}</div>\r\n                </div>\r\n                <div class=\"card-block\">\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                <section class=\"card-block\">\r\n                    <table class=\"facet-values-list table mt2 mb4\" formGroupName=\"options\">\r\n                        <thead>\r\n                            <tr>\r\n                                <th></th>\r\n                                <th>{{ 'common.name' | translate }}</th>\r\n                                <th>{{ 'common.code' | translate }}</th>\r\n                            </tr>\r\n                        </thead>\r\n                        <tbody>\r\n                            <tr\r\n                                class=\"facet-value\"\r\n                                *ngFor=\"let option of getOptions(optionGroup); let i = index\"\r\n                                [formGroupName]=\"i\"\r\n                            >\r\n                                <td class=\"align-middle\">\r\n                                    <vdr-entity-info [entity]=\"option.value\"></vdr-entity-info>\r\n                                </td>\r\n                                <td class=\"align-middle\">\r\n                                    <input\r\n                                        type=\"text\"\r\n                                        formControlName=\"name\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                    />\r\n                                </td>\r\n                                <td class=\"align-middle\"><input type=\"text\" formControlName=\"code\" /></td>\r\n                            </tr>\r\n                        </tbody>\r\n                    </table>\r\n                </section>\r\n            </section>\r\n        </div>\r\n    </div>\r\n</form>\r\n","styles":[".option-group-header{display:flex;align-items:baseline}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":48,"character":25},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":49,"character":26},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ServerConfigService","line":50,"character":39},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":51,"character":31},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":53,"character":29},{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":54,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":55,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"getOptionGroups":[{"__symbolic":"method"}],"getOptions":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"getUpdatedOptionGroup":[{"__symbolic":"method"}],"getUpdatedOption":[{"__symbolic":"method"}],"setFormValues":[{"__symbolic":"method"}]}},"GeneratedVariant":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"error","message":"Could not resolve type","line":36,"character":24,"context":{"typeName":"Partial"},"module":"./components/product-variants-editor/product-variants-editor.component"}]}]}},"ProductVariantsEditorComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":43,"character":1},"arguments":[{"selector":"vdr-product-variants-editor","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":47,"character":21},"member":"Default"},"template":"<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            (click)=\"save()\"\r\n            [disabled]=\"!formValueChanged || getVariantsToAdd().length === 0\"\r\n        >\r\n            {{ 'common.add-new-variants' | translate: { count: getVariantsToAdd().length } }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<div *ngFor=\"let group of optionGroups\" class=\"option-groups\">\r\n    <div class=\"name\">\r\n        <label>{{ 'catalog.option' | translate }}</label>\r\n        <input clrInput [(ngModel)]=\"group.name\" name=\"name\" [readonly]=\"!group.isNew\" />\r\n    </div>\r\n    <div class=\"values\">\r\n        <label>{{ 'catalog.option-values' | translate }}</label>\r\n        <vdr-option-value-input\r\n            #optionValueInputComponent\r\n            [(ngModel)]=\"group.values\"\r\n            (ngModelChange)=\"generateVariants()\"\r\n            [groupName]=\"group.name\"\r\n            [disabled]=\"group.name === ''\"\r\n        ></vdr-option-value-input>\r\n    </div>\r\n</div>\r\n<button\r\n    class=\"btn btn-primary-outline btn-sm\"\r\n    (click)=\"addOption()\"\r\n>\r\n    <clr-icon shape=\"plus\"></clr-icon>\r\n    {{ 'catalog.add-option' | translate }}\r\n</button>\r\n\r\n<div class=\"variants-preview\">\r\n    <table class=\"table\">\r\n        <thead>\r\n            <tr>\r\n                <th>{{ 'common.create' | translate }}</th>\r\n                <th>{{ 'catalog.variant' | translate }}</th>\r\n                <th>{{ 'catalog.sku' | translate }}</th>\r\n                <th>{{ 'catalog.price' | translate }}</th>\r\n                <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n                <th></th>\r\n            </tr>\r\n        </thead>\r\n        <tr *ngFor=\"let variant of generatedVariants\" [class.disabled]=\"!variant.enabled || variant.existing\">\r\n            <td>\r\n                <input\r\n                    type=\"checkbox\"\r\n                    *ngIf=\"!variant.existing\"\r\n                    [(ngModel)]=\"variant.enabled\"\r\n                    name=\"enabled\"\r\n                    clrCheckbox\r\n                    (ngModelChange)=\"formValueChanged = true\"\r\n                />\r\n            </td>\r\n            <td>\r\n                {{ getVariantName(variant) | translate }}\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <input\r\n                        clrInput\r\n                        type=\"text\"\r\n                        [(ngModel)]=\"variant.sku\"\r\n                        [placeholder]=\"'catalog.sku' | translate\"\r\n                        name=\"sku\"\r\n                        required\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    />\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.sku }}</span>\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <vdr-currency-input\r\n                        clrInput\r\n                        [(ngModel)]=\"variant.price\"\r\n                        name=\"price\"\r\n                        [currencyCode]=\"currencyCode\"\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    ></vdr-currency-input>\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.price | localeCurrency: currencyCode }}</span>\r\n            </td>\r\n            <td>\r\n                <clr-input-container *ngIf=\"!variant.existing\">\r\n                    <input\r\n                        clrInput\r\n                        type=\"number\"\r\n                        [(ngModel)]=\"variant.stock\"\r\n                        name=\"stock\"\r\n                        min=\"0\"\r\n                        step=\"1\"\r\n                        (ngModelChange)=\"onFormChanged(variant)\"\r\n                    />\r\n                </clr-input-container>\r\n                <span *ngIf=\"variant.existing\">{{ variant.stock }}</span>\r\n            </td>\r\n            <td>\r\n                <vdr-dropdown *ngIf=\"variant.productVariantId as productVariantId\">\r\n                    <button class=\"icon-button\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                        <button\r\n                            type=\"button\"\r\n                            class=\"delete-button\"\r\n                            (click)=\"deleteVariant(productVariantId)\"\r\n                            vdrDropdownItem\r\n                        >\r\n                            <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                            {{ 'common.delete' | translate }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </td>\r\n        </tr>\r\n    </table>\r\n</div>\r\n","styles":[".option-groups{display:flex}.option-groups:first-of-type{margin-top:24px}.values{flex:1;margin:0 6px}.variants-preview tr.disabled td{background-color:var(--color-component-bg-100);color:var(--color-grey-400)}\n"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"ActivatedRoute","line":67,"character":23},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":68,"character":29},{"__symbolic":"reference","name":"ProductDetailService"},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"NotificationService","line":70,"character":37},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":71,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"onFormChanged":[{"__symbolic":"method"}],"canDeactivate":[{"__symbolic":"method"}],"getVariantsToAdd":[{"__symbolic":"method"}],"getVariantName":[{"__symbolic":"method"}],"addOption":[{"__symbolic":"method"}],"generateVariants":[{"__symbolic":"method"}],"getVariantPrototype":[{"__symbolic":"method"}],"deleteVariant":[{"__symbolic":"method"}],"save":[{"__symbolic":"method"}],"checkUniqueSkus":[{"__symbolic":"method"}],"confirmDeletionOfObsoleteVariants":[{"__symbolic":"method"}],"getObsoleteVariants":[{"__symbolic":"method"}],"hasOnlyDefaultVariant":[{"__symbolic":"method"}],"addOptionGroupsToProduct":[{"__symbolic":"method"}],"addNewOptionsToGroups":[{"__symbolic":"method"}],"fetchOptionGroups":[{"__symbolic":"method"}],"createNewProductVariants":[{"__symbolic":"method"}],"deleteObsoleteVariants":[{"__symbolic":"method"}],"reFetchProduct":[{"__symbolic":"method"}],"initOptionsAndVariants":[{"__symbolic":"method"}],"optionsAreEqual":[{"__symbolic":"method"}],"optionsAreSubset":[{"__symbolic":"method"}],"toOptionString":[{"__symbolic":"method"}]}},"VariantAssetChange":{"__symbolic":"interface"},"ProductVariantsListComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":47,"character":1},"arguments":[{"selector":"vdr-product-variants-list","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":51,"character":21},"member":"OnPush"},"template":"<div class=\"variants-list\">\r\n    <div\r\n        class=\"variant-container card\"\r\n        *ngFor=\"\r\n            let variant of variants | paginate: paginationConfig || { itemsPerPage: 10, currentPage: 1 };\r\n            trackBy: trackById;\r\n            let i = index\r\n        \"\r\n        [class.disabled]=\"!formGroupMap.get(variant.id)?.get('enabled')?.value\"\r\n    >\r\n        <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\r\n            <div class=\"card-block header-row\">\r\n                <div class=\"details\">\r\n                    <vdr-title-input class=\"sku\" [readonly]=\"!(updatePermission | hasPermission)\">\r\n                        <clr-input-container>\r\n                            <input\r\n                                clrInput\r\n                                type=\"text\"\r\n                                formControlName=\"sku\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                [placeholder]=\"'catalog.sku' | translate\"\r\n                            />\r\n                        </clr-input-container>\r\n                    </vdr-title-input>\r\n                    <vdr-title-input class=\"name\" [readonly]=\"!(updatePermission | hasPermission)\">\r\n                        <clr-input-container>\r\n                            <input\r\n                                clrInput\r\n                                type=\"text\"\r\n                                formControlName=\"name\"\r\n                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                [placeholder]=\"'common.name' | translate\"\r\n                            />\r\n                        </clr-input-container>\r\n                    </vdr-title-input>\r\n                </div>\r\n                <div class=\"right-controls\">\r\n                    <clr-toggle-wrapper *vdrIfPermissions=\"updatePermission\">\r\n                        <input type=\"checkbox\" clrToggle name=\"enabled\" formControlName=\"enabled\" />\r\n                        <label>{{ 'common.enabled' | translate }}</label>\r\n                    </clr-toggle-wrapper>\r\n                </div>\r\n            </div>\r\n            <div class=\"card-block\">\r\n                <div class=\"variant-body\">\r\n                    <div class=\"assets\">\r\n                        <vdr-assets\r\n                            [compact]=\"true\"\r\n                            [assets]=\"pendingAssetChanges[variant.id]?.assets || variant.assets\"\r\n                            [featuredAsset]=\"\r\n                                pendingAssetChanges[variant.id]?.featuredAsset || variant.featuredAsset\r\n                            \"\r\n                            [updatePermissions]=\"updatePermission\"\r\n                            (change)=\"onAssetChange(variant.id, $event)\"\r\n                        ></vdr-assets>\r\n                    </div>\r\n                    <div class=\"variant-form-inputs\">\r\n                        <div class=\"standard-fields\">\r\n                            <div class=\"variant-form-input-row\">\r\n                                <div class=\"tax-category\">\r\n                                    <clr-select-container\r\n                                        *vdrIfPermissions=\"updatePermission; else taxCategoryLabel\"\r\n                                    >\r\n                                        <label>{{ 'catalog.tax-category' | translate }}</label>\r\n                                        <select clrSelect name=\"options\" formControlName=\"taxCategoryId\">\r\n                                            <option\r\n                                                *ngFor=\"let taxCategory of taxCategories\"\r\n                                                [value]=\"taxCategory.id\"\r\n                                            >\r\n                                                {{ taxCategory.name }}\r\n                                            </option>\r\n                                        </select>\r\n                                    </clr-select-container>\r\n                                    <ng-template #taxCategoryLabel>\r\n                                        <label class=\"clr-control-label\">{{\r\n                                            'catalog.tax-category' | translate\r\n                                        }}</label>\r\n                                        <div class=\"tax-category-label\">\r\n                                            {{ getTaxCategoryName(formGroup) }}\r\n                                        </div>\r\n                                    </ng-template>\r\n                                </div>\r\n                                <div class=\"price\">\r\n                                    <clr-input-container>\r\n                                        <label>{{ 'catalog.price' | translate }}</label>\r\n                                        <vdr-currency-input\r\n                                            *ngIf=\"!channelPriceIncludesTax\"\r\n                                            clrInput\r\n                                            [currencyCode]=\"variant.currencyCode\"\r\n                                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                            formControlName=\"price\"\r\n                                        ></vdr-currency-input>\r\n                                        <vdr-currency-input\r\n                                            *ngIf=\"channelPriceIncludesTax\"\r\n                                            clrInput\r\n                                            [currencyCode]=\"variant.currencyCode\"\r\n                                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                            formControlName=\"priceWithTax\"\r\n                                        ></vdr-currency-input>\r\n                                    </clr-input-container>\r\n                                </div>\r\n                                <vdr-variant-price-detail\r\n                                    [price]=\"formGroup.get('price')!.value\"\r\n                                    [currencyCode]=\"variant.currencyCode\"\r\n                                    [priceIncludesTax]=\"channelPriceIncludesTax\"\r\n                                    [taxCategoryId]=\"formGroup.get('taxCategoryId')!.value\"\r\n                                ></vdr-variant-price-detail>\r\n                            </div>\r\n                            <div class=\"variant-form-input-row\">\r\n                                <clr-select-container *vdrIfPermissions=\"updatePermission\">\r\n                                    <label\r\n                                        >{{ 'catalog.track-inventory' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.track-inventory-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip>\r\n                                    </label>\r\n                                    <select clrSelect name=\"options\" formControlName=\"trackInventory\">\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                                </clr-select-container>\r\n                                <clr-input-container>\r\n                                    <label\r\n                                        >{{ 'catalog.stock-on-hand' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-on-hand-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <input\r\n                                        [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\"\r\n                                        clrInput\r\n                                        type=\"number\"\r\n                                        [min]=\"getStockOnHandMinValue(formGroup)\"\r\n                                        step=\"1\"\r\n                                        formControlName=\"stockOnHand\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                        [vdrDisabled]=\"inventoryIsNotTracked(formGroup)\"\r\n                                    />\r\n                                </clr-input-container>\r\n                                <div [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\">\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.stock-allocated' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-allocated-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"value\">\r\n                                        {{ variant.stockAllocated }}\r\n                                    </div>\r\n                                </div>\r\n                                <div [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\">\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.stock-saleable' | translate }}\r\n                                        <vdr-help-tooltip\r\n                                            [content]=\"'catalog.stock-saleable-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"value\">\r\n                                        {{ getSaleableStockLevel(variant) }}\r\n                                    </div>\r\n                                </div>\r\n                            </div>\r\n\r\n                            <div class=\"variant-form-input-row\">\r\n                                <div\r\n                                    class=\"out-of-stock-threshold-wrapper\"\r\n                                    [class.inventory-untracked]=\"inventoryIsNotTracked(formGroup)\"\r\n                                >\r\n                                    <label class=\"clr-control-label\"\r\n                                        >{{ 'catalog.out-of-stock-threshold' | translate\r\n                                        }}<vdr-help-tooltip\r\n                                            [content]=\"'catalog.out-of-stock-threshold-tooltip' | translate\"\r\n                                        ></vdr-help-tooltip\r\n                                    ></label>\r\n                                    <div class=\"flex\">\r\n                                        <clr-input-container>\r\n                                            <input\r\n                                                clrInput\r\n                                                type=\"number\"\r\n                                                [formControl]=\"formGroup.get('outOfStockThreshold')\"\r\n                                                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                                [vdrDisabled]=\"\r\n                                                    formGroup.get('useGlobalOutOfStockThreshold')?.value !==\r\n                                                        false || inventoryIsNotTracked(formGroup)\r\n                                                \"\r\n                                            />\r\n                                        </clr-input-container>\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                                                    !(updatePermission | hasPermission) ||\r\n                                                    inventoryIsNotTracked(formGroup)\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                                    </div>\r\n                                </div>\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"custom-fields\">\r\n                            <div class=\"variant-form-input-row\">\r\n                                <section formGroupName=\"customFields\" *ngIf=\"customFields.length\">\r\n                                    <vdr-tabbed-custom-fields\r\n                                        entityName=\"ProductVariant\"\r\n                                        [customFields]=\"customFields\"\r\n                                        [compact]=\"true\"\r\n                                        [customFieldsFormGroup]=\"formGroup.get('customFields')\"\r\n                                        [readonly]=\"!(updatePermission | hasPermission)\"\r\n                                    ></vdr-tabbed-custom-fields>\r\n                                </section>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <div class=\"card-block\">\r\n                <div class=\"options-facets\">\r\n                    <vdr-entity-info [entity]=\"variant\"></vdr-entity-info>\r\n                    <div *ngIf=\"variant.options.length\">\r\n                        <div class=\"options\">\r\n                            <vdr-chip\r\n                                *ngFor=\"let option of variant.options | sort: 'groupId'\"\r\n                                [colorFrom]=\"optionGroupName(option.groupId)\"\r\n                                [invert]=\"true\"\r\n                                (iconClick)=\"editOption(option)\"\r\n                                [icon]=\"(updatePermission | hasPermission) && 'pencil'\"\r\n                            >\r\n                                <span class=\"option-group-name\">{{ optionGroupName(option.groupId) }}</span>\r\n                                {{ optionName(option) }}\r\n                            </vdr-chip>\r\n                            <a [routerLink]=\"['./', 'options']\" class=\"btn btn-link btn-sm\"\r\n                                >{{ 'catalog.edit-options' | translate }}...</a\r\n                            >\r\n                        </div>\r\n                    </div>\r\n                    <div class=\"flex-spacer\"></div>\r\n                    <div class=\"facets\">\r\n                        <vdr-facet-value-chip\r\n                            *ngFor=\"let facetValue of existingFacetValues(variant)\"\r\n                            [facetValue]=\"facetValue\"\r\n                            [removable]=\"updatePermission | hasPermission\"\r\n                            (remove)=\"removeFacetValue(variant, facetValue.id)\"\r\n                        ></vdr-facet-value-chip>\r\n                        <vdr-facet-value-chip\r\n                            *ngFor=\"let facetValue of pendingFacetValues(variant)\"\r\n                            [facetValue]=\"facetValue\"\r\n                            [removable]=\"updatePermission | hasPermission\"\r\n                            (remove)=\"removeFacetValue(variant, facetValue.id)\"\r\n                        ></vdr-facet-value-chip>\r\n                        <button\r\n                            *vdrIfPermissions=\"updatePermission\"\r\n                            class=\"btn btn-sm btn-secondary\"\r\n                            (click)=\"selectFacetValueClick.emit([variant.id])\"\r\n                        >\r\n                            <clr-icon shape=\"plus\"></clr-icon>\r\n                            {{ 'catalog.add-facets' | translate }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <ng-container *vdrIfMultichannel>\r\n                <div class=\"card-block\" *vdrIfDefaultChannelActive>\r\n                    <div class=\"flex channel-assignment\">\r\n                        <ng-container *ngFor=\"let channel of variant.channels\">\r\n                            <vdr-chip\r\n                                *ngIf=\"!isDefaultChannel(channel.code)\"\r\n                                icon=\"times-circle\"\r\n                                [title]=\"'catalog.remove-from-channel' | translate\"\r\n                                (iconClick)=\"\r\n                                    removeFromChannel.emit({ channelId: channel.id, variant: variant })\r\n                                \"\r\n                            >\r\n                                <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n                                {{ channel.code | channelCodeToLabel }}\r\n                            </vdr-chip>\r\n                        </ng-container>\r\n                        <button class=\"btn btn-sm\" (click)=\"assignToChannel.emit(variant)\">\r\n                            <clr-icon shape=\"layers\"></clr-icon>\r\n                            {{ 'catalog.assign-to-channel' | translate }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n            </ng-container>\r\n        </ng-container>\r\n    </div>\r\n</div>\r\n","styles":[".with-selected{display:flex;min-height:52px;align-items:center;border:1px solid var(--color-component-border-100);border-radius:3px;padding:6px 18px}.with-selected vdr-select-toggle{margin-right:12px}.with-selected>label{margin-right:12px}.variant-container{transition:background-color .2s;min-height:330px}.variant-container.disabled{background-color:var(--color-component-bg-200)}.variant-container .header-row{display:flex;align-items:center;flex-wrap:wrap}.variant-container .variant-body{display:flex;flex-direction:column}@media screen and (min-width: 768px){.variant-container .variant-body{flex-direction:row}}.variant-container .details{display:flex;flex-direction:column;flex:1;margin-right:12px}@media screen and (min-width: 768px){.variant-container .details{flex-direction:row;height:36px}}.variant-container .details .name{flex:1}.variant-container .details .name ::ng-deep .clr-control-container{width:100%}.variant-container .details .name ::ng-deep .clr-control-container input.clr-input{min-width:100%}.variant-container .details .sku{width:160px;margin-right:20px;flex:0}.variant-container .details ::ng-deep .name input{min-width:300px}.variant-container .right-controls{display:flex}.variant-container .tax-category-label{margin-top:3px}.variant-container .variant-form-inputs{flex:1;display:flex;flex-direction:column}@media screen and (min-width: 768px){.variant-container .variant-form-inputs{flex-direction:row}}.variant-container .variant-form-input-row{display:flex;flex-wrap:wrap}@media screen and (min-width: 768px){.variant-container .variant-form-input-row{margin:0 6px 8px 24px}}.variant-container .variant-form-input-row>*{margin-right:24px;margin-bottom:24px}.variant-container .track-inventory-toggle{margin-top:22px}.variant-container .clr-form-control{margin-top:0}.variant-container .facets{display:flex;flex-wrap:wrap;align-items:center}.variant-container .pricing{display:flex}.variant-container .pricing>div{margin-right:12px}.variant-container .option-group-name{color:var(--color-text-200);text-transform:uppercase;font-size:10px;margin-right:3px;height:11px}.variant-container .options-facets{display:flex;color:var(--color-grey-400)}.variant-container ::ng-deep .clr-control-container{width:100%}.channel-assignment{justify-content:flex-end;flex-wrap:wrap;max-height:110px;overflow-y:auto}.channel-assignment .btn{margin:6px 12px 6px 0}.out-of-stock-threshold-wrapper{display:flex;flex-direction:column}.out-of-stock-threshold-wrapper clr-toggle-wrapper{margin-left:24px}.inventory-untracked{opacity:.5}\n"]}]}],"members":{"formArray":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":54,"character":5},"arguments":["productVariantsFormArray"]}]}],"variants":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":55,"character":5}}]}],"paginationConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":56,"character":5}}]}],"channelPriceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":57,"character":5}}]}],"taxCategories":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":58,"character":5}}]}],"facets":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":59,"character":5}}]}],"optionGroups":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":60,"character":5}}]}],"customFields":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":61,"character":5}}]}],"customOptionFields":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":62,"character":5}}]}],"activeLanguage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":63,"character":5}}]}],"pendingAssetChanges":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":64,"character":5}}]}],"assignToChannel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":65,"character":5}}]}],"removeFromChannel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":66,"character":5}}]}],"assetChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":70,"character":5}}]}],"selectionChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":71,"character":5}}]}],"selectFacetValueClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":72,"character":5}}]}],"updateProductOption":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":73,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":84,"character":32},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"ModalService","line":85,"character":30},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":86,"character":29}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"isDefaultChannel":[{"__symbolic":"method"}],"trackById":[{"__symbolic":"method"}],"inventoryIsNotTracked":[{"__symbolic":"method"}],"getTaxCategoryName":[{"__symbolic":"method"}],"getStockOnHandMinValue":[{"__symbolic":"method"}],"getSaleableStockLevel":[{"__symbolic":"method"}],"areAllSelected":[{"__symbolic":"method"}],"onAssetChange":[{"__symbolic":"method"}],"toggleSelectAll":[{"__symbolic":"method"}],"toggleSelectVariant":[{"__symbolic":"method"}],"optionGroupName":[{"__symbolic":"method"}],"optionName":[{"__symbolic":"method"}],"pendingFacetValues":[{"__symbolic":"method"}],"existingFacetValues":[{"__symbolic":"method"}],"removeFacetValue":[{"__symbolic":"method"}],"isVariantSelected":[{"__symbolic":"method"}],"editOption":[{"__symbolic":"method"}],"buildFormGroupMap":[{"__symbolic":"method"}],"getFacetValueIds":[{"__symbolic":"method"}]}},"ProductVariantsTableComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"vdr-product-variants-table","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":19,"character":21},"member":"OnPush"},"template":"<table class=\"table\">\r\n    <thead>\r\n        <tr>\r\n            <th></th>\r\n            <th>{{ 'common.name' | translate }}</th>\r\n            <th>{{ 'catalog.sku' | translate }}</th>\r\n            <ng-container *ngFor=\"let optionGroup of optionGroups | sort: 'id'\">\r\n                <th>{{ optionGroup.name }}</th>\r\n            </ng-container>\r\n            <th>{{ 'catalog.price' | translate }}</th>\r\n            <th>{{ 'catalog.stock-on-hand' | translate }}</th>\r\n            <th>{{ 'common.enabled' | translate }}</th>\r\n        </tr>\r\n    </thead>\r\n    <tbody>\r\n        <tr *ngFor=\"let variant of variants | paginate: paginationConfig; index as i; trackBy: trackByFn\">\r\n            <ng-container *ngIf=\"formGroupMap.get(variant.id) as formGroup\" [formGroup]=\"formGroup\">\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <div class=\"card-img\">\r\n                        <div class=\"featured-asset\">\r\n                            <img\r\n                                *ngIf=\"getFeaturedAsset(variant) as featuredAsset; else placeholder\"\r\n                                [src]=\"featuredAsset | assetPreview: 'tiny'\"\r\n                            />\r\n                            <ng-template #placeholder>\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                    </div>\r\n                </td>\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"text\"\r\n                            formControlName=\"name\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            [placeholder]=\"'common.name' | translate\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"text\"\r\n                            formControlName=\"sku\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            [placeholder]=\"'catalog.sku' | translate\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <ng-container *ngFor=\"let option of variant.options | sort: 'groupId'\">\r\n                    <td\r\n                        class=\"left align-middle\"\r\n                        [class.disabled]=\"!formGroup.get('enabled')!.value\"\r\n                        [style.color]=\"optionGroupName(option.groupId) | stringToColor\"\r\n                    >\r\n                        {{ option.name }}\r\n                    </td>\r\n                </ng-container>\r\n                <td class=\"left align-middle price\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <vdr-currency-input\r\n                            *ngIf=\"!channelPriceIncludesTax\"\r\n                            clrInput\r\n                            [currencyCode]=\"variant.currencyCode\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            formControlName=\"price\"\r\n                        ></vdr-currency-input>\r\n                        <vdr-currency-input\r\n                            *ngIf=\"channelPriceIncludesTax\"\r\n                            clrInput\r\n                            [currencyCode]=\"variant.currencyCode\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                            formControlName=\"priceWithTax\"\r\n                        ></vdr-currency-input>\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-input-container>\r\n                        <input\r\n                            clrInput\r\n                            type=\"number\"\r\n                            min=\"0\"\r\n                            step=\"1\"\r\n                            formControlName=\"stockOnHand\"\r\n                            [readonly]=\"!(updatePermission | hasPermission)\"\r\n                        />\r\n                    </clr-input-container>\r\n                </td>\r\n                <td class=\"left align-middle stock\" [class.disabled]=\"!formGroup.get('enabled')!.value\">\r\n                    <clr-toggle-wrapper>\r\n                        <input\r\n                            type=\"checkbox\"\r\n                            clrToggle\r\n                            name=\"enabled\"\r\n                            formControlName=\"enabled\"\r\n                            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                        />\r\n                    </clr-toggle-wrapper>\r\n                </td>\r\n            </ng-container>\r\n        </tr>\r\n    </tbody>\r\n</table>\r\n","styles":[".placeholder{color:var(--color-grey-300)}.stock input,.price input{max-width:96px}td{transition:background-color .2s}td.disabled{background-color:var(--color-component-bg-200)}\n"]}]}],"members":{"formArray":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":5},"arguments":["productVariantsFormArray"]}]}],"variants":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":5}}]}],"paginationConfig":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":5}}]}],"channelPriceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":5}}]}],"optionGroups":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":5}}]}],"pendingAssetChanges":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":27,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectorRef","line":32,"character":40}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"trackByFn":[{"__symbolic":"method"}],"getFeaturedAsset":[{"__symbolic":"method"}],"optionGroupName":[{"__symbolic":"method"}],"buildFormGroupMap":[{"__symbolic":"method"}]}},"UpdateProductOptionDialogComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"vdr-update-product-option-dialog","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":16,"character":21},"member":"OnPush"},"template":"<ng-template vdrDialogTitle>{{ 'catalog.update-product-option' | translate }}</ng-template>\r\n<vdr-form-field [label]=\"'catalog.option-name' | translate\" for=\"name\">\r\n    <input\r\n        id=\"name\"\r\n        type=\"text\"\r\n        #nameInput=\"ngModel\"\r\n        [(ngModel)]=\"name\"\r\n        required\r\n        (input)=\"updateCode($event.target.value)\"\r\n    />\r\n</vdr-form-field>\r\n<vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\r\n    <input id=\"code\" type=\"text\" #codeInput=\"ngModel\" required [(ngModel)]=\"code\" pattern=\"[a-z0-9_-]+\" />\r\n</vdr-form-field>\r\n<clr-checkbox-wrapper>\r\n    <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"updateVariantName\" />\r\n    <label>{{ 'catalog.auto-update-option-variant-name' | translate }}</label>\r\n</clr-checkbox-wrapper>\r\n<section *ngIf=\"customFields.length\">\r\n    <label>{{ 'common.custom-fields' | translate }}</label>\r\n    <vdr-tabbed-custom-fields\r\n        entityName=\"ProductOption\"\r\n        [customFields]=\"customFields\"\r\n        [customFieldsFormGroup]=\"customFieldsForm\"\r\n        [readonly]=\"!(['UpdateCatalog', 'UpdateProduct'] | hasPermission)\"\r\n    ></vdr-tabbed-custom-fields>\r\n</section>\r\n\r\n<ng-template vdrDialogButtons>\r\n    <button type=\"button\" class=\"btn\" (click)=\"cancel()\">{{ 'common.cancel' | translate }}</button>\r\n    <button\r\n        type=\"submit\"\r\n        (click)=\"update()\"\r\n        [disabled]=\"\r\n            nameInput.invalid ||\r\n            codeInput.invalid ||\r\n            (nameInput.pristine && codeInput.pristine && customFieldsForm.pristine)\r\n        \"\r\n        class=\"btn btn-primary\"\r\n    >\r\n        {{ 'catalog.update-product-option' | translate }}\r\n    </button>\r\n</ng-template>\r\n","styles":[""]}]}],"members":{"ngOnInit":[{"__symbolic":"method"}],"update":[{"__symbolic":"method"}],"cancel":[{"__symbolic":"method"}],"updateCode":[{"__symbolic":"method"}]}},"VariantPriceDetailComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"vdr-variant-price-detail","changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":9,"character":21},"member":"OnPush"},"template":"<label class=\"clr-control-label\">{{ 'catalog.taxes' | translate }}</label>\r\n<div *ngIf=\"priceIncludesTax\" class=\"value\">\r\n    {{ 'catalog.price-includes-tax-at' | translate: { rate: taxRate$ | async } }}\r\n</div>\r\n<div *ngIf=\"!priceIncludesTax\" class=\"value\">\r\n    {{\r\n        'catalog.price-with-tax-in-default-zone'\r\n            | translate: { price: grossPrice$ | async | localeCurrency: currencyCode, rate: taxRate$ | async }\r\n    }}\r\n</div>\r\n","styles":[":host{display:flex;flex-direction:column}.value{margin-top:3px}\n"]}]}],"members":{"priceIncludesTax":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":5}}]}],"price":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":5}}]}],"currencyCode":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":5}}]}],"taxCategoryId":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":5}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":23,"character":37}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}]}},"ProductDetailService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":29,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":33,"character":37}]}],"getFacets":[{"__symbolic":"method"}],"getTaxCategories":[{"__symbolic":"method"}],"createProductWithVariants":[{"__symbolic":"method"}],"createProductOptionGroups":[{"__symbolic":"method"}],"createProductVariants":[{"__symbolic":"method"}],"updateProduct":[{"__symbolic":"method"}],"updateProductOption":[{"__symbolic":"method"}],"deleteProductVariant":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"replaceLast":{"__symbolic":"function"},"AssetResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":8,"character":35},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":9,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":9,"character":45}]}]},"statics":{"ɵprov":{}}},"CollectionResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":7,"character":40},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":8,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":8,"character":45}]}]},"statics":{"ɵprov":{}}},"FacetResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":10,"character":35},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":7,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":11,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":11,"character":45}]}]},"statics":{"ɵprov":{}}},"ProductResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":12,"character":37},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":9,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":13,"character":29},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":13,"character":50}]}]},"statics":{"ɵprov":{}}},"ProductVariantsResolver":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"BaseEntityResolver","line":9,"character":45},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":6,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":10,"character":24},{"__symbolic":"reference","module":"@vendure/admin-ui/core","name":"DataService","line":10,"character":45}]}]},"statics":{"ɵprov":{}}}},"origins":{"CatalogModule":"./catalog.module","catalogRoutes":"./catalog.routes","productBreadcrumb":"./catalog.routes","productVariantEditorBreadcrumb":"./catalog.routes","productOptionsEditorBreadcrumb":"./catalog.routes","facetBreadcrumb":"./catalog.routes","collectionBreadcrumb":"./catalog.routes","assetBreadcrumb":"./catalog.routes","ApplyFacetDialogComponent":"./components/apply-facet-dialog/apply-facet-dialog.component","AssetDetailComponent":"./components/asset-detail/asset-detail.component","AssetListComponent":"./components/asset-list/asset-list.component","AssetChange":"./components/assets/assets.component","AssetsComponent":"./components/assets/assets.component","AssignProductsToChannelDialogComponent":"./components/assign-products-to-channel-dialog/assign-products-to-channel-dialog.component","CollectionContentsComponent":"./components/collection-contents/collection-contents.component","CollectionDetailComponent":"./components/collection-detail/collection-detail.component","CollectionListComponent":"./components/collection-list/collection-list.component","HasParent":"./components/collection-tree/array-to-tree","TreeNode":"./components/collection-tree/array-to-tree","RootNode":"./components/collection-tree/array-to-tree","arrayToTree":"./components/collection-tree/array-to-tree","CollectionTreeNodeComponent":"./components/collection-tree/collection-tree-node.component","RearrangeEvent":"./components/collection-tree/collection-tree.component","CollectionPartial":"./components/collection-tree/collection-tree.component","CollectionTreeComponent":"./components/collection-tree/collection-tree.component","ConfirmVariantDeletionDialogComponent":"./components/confirm-variant-deletion-dialog/confirm-variant-deletion-dialog.component","FacetDetailComponent":"./components/facet-detail/facet-detail.component","FacetListComponent":"./components/facet-list/facet-list.component","CreateVariantValues":"./components/generate-product-variants/generate-product-variants.component","CreateProductVariantsConfig":"./components/generate-product-variants/generate-product-variants.component","GenerateProductVariantsComponent":"./components/generate-product-variants/generate-product-variants.component","OPTION_VALUE_INPUT_VALUE_ACCESSOR":"./components/option-value-input/option-value-input.component","OptionValueInputComponent":"./components/option-value-input/option-value-input.component","TabName":"./components/product-detail/product-detail.component","VariantFormValue":"./components/product-detail/product-detail.component","SelectedAssets":"./components/product-detail/product-detail.component","PaginationConfig":"./components/product-detail/product-detail.component","ProductDetailComponent":"./components/product-detail/product-detail.component","ProductListComponent":"./components/product-list/product-list.component","ProductOptionsEditorComponent":"./components/product-options-editor/product-options-editor.component","GeneratedVariant":"./components/product-variants-editor/product-variants-editor.component","ProductVariantsEditorComponent":"./components/product-variants-editor/product-variants-editor.component","VariantAssetChange":"./components/product-variants-list/product-variants-list.component","ProductVariantsListComponent":"./components/product-variants-list/product-variants-list.component","ProductVariantsTableComponent":"./components/product-variants-table/product-variants-table.component","UpdateProductOptionDialogComponent":"./components/update-product-option-dialog/update-product-option-dialog.component","VariantPriceDetailComponent":"./components/variant-price-detail/variant-price-detail.component","ProductDetailService":"./providers/product-detail/product-detail.service","replaceLast":"./providers/product-detail/replace-last","AssetResolver":"./providers/routing/asset-resolver","CollectionResolver":"./providers/routing/collection-resolver","FacetResolver":"./providers/routing/facet-resolver","ProductResolver":"./providers/routing/product-resolver","ProductVariantsResolver":"./providers/routing/product-variants-resolver"},"importAs":"@vendure/admin-ui/catalog"}