@vendure/admin-ui 3.0.0 → 3.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -44,12 +44,15 @@ export class CouponCodeSelectorComponent {
44
44
  this.control = new UntypedFormControl(this.couponCodes ?? []);
45
45
  }
46
46
  }
47
+ remove(code) {
48
+ this.removeCouponCode.emit(code);
49
+ }
47
50
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CouponCodeSelectorComponent, deps: [{ token: i1.DataService }], target: i0.ɵɵFactoryTarget.Component }); }
48
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CouponCodeSelectorComponent, selector: "vdr-coupon-code-selector", inputs: { couponCodes: "couponCodes", control: "control" }, outputs: { addCouponCode: "addCouponCode", removeCouponCode: "removeCouponCode" }, ngImport: i0, template: "<ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"control\"\r\n (add)=\"addCouponCode.emit($event.code)\"\r\n (remove)=\"removeCouponCode.emit($event.value?.code)\"\r\n>\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <div class=\"flex items-center\">\r\n <vdr-chip class=\"mr-1\">{{ item.code }}</vdr-chip>\r\n <span>{{ item.promotionName }}</span>\r\n </div>\r\n </ng-template>\r\n</ng-select>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
51
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: CouponCodeSelectorComponent, selector: "vdr-coupon-code-selector", inputs: { couponCodes: "couponCodes", control: "control" }, outputs: { addCouponCode: "addCouponCode", removeCouponCode: "removeCouponCode" }, ngImport: i0, template: "<ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"control\"\r\n (add)=\"addCouponCode.emit($event.code)\"\r\n (remove)=\"remove($event.code)\"\r\n>\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <div class=\"flex items-center\">\r\n <vdr-chip class=\"mr-1\">{{ item.code }}</vdr-chip>\r\n <span>{{ item.promotionName }}</span>\r\n </div>\r\n </ng-template>\r\n</ng-select>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "component", type: i3.NgSelectComponent, selector: "ng-select", inputs: ["bindLabel", "bindValue", "markFirst", "placeholder", "notFoundText", "typeToSearchText", "addTagText", "loadingText", "clearAllText", "appearance", "dropdownPosition", "appendTo", "loading", "closeOnSelect", "hideSelected", "selectOnTab", "openOnEnter", "maxSelectedItems", "groupBy", "groupValue", "bufferAmount", "virtualScroll", "selectableGroup", "selectableGroupAsModel", "searchFn", "trackByFn", "clearOnBackspace", "labelForId", "inputAttrs", "tabIndex", "readonly", "searchWhileComposing", "minTermLength", "editableSearchTerm", "keyDownFn", "typeahead", "multiple", "addTag", "searchable", "clearable", "isOpen", "items", "compareWith", "clearSearchOnAdd", "deselectOnClick"], outputs: ["blur", "focus", "change", "open", "close", "search", "clear", "add", "remove", "scroll", "scrollToEnd"] }, { kind: "directive", type: i3.NgOptionTemplateDirective, selector: "[ng-option-tmp]" }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "pipe", type: i4.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
49
52
  }
50
53
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: CouponCodeSelectorComponent, decorators: [{
51
54
  type: Component,
52
- args: [{ selector: 'vdr-coupon-code-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"control\"\r\n (add)=\"addCouponCode.emit($event.code)\"\r\n (remove)=\"removeCouponCode.emit($event.value?.code)\"\r\n>\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <div class=\"flex items-center\">\r\n <vdr-chip class=\"mr-1\">{{ item.code }}</vdr-chip>\r\n <span>{{ item.promotionName }}</span>\r\n </div>\r\n </ng-template>\r\n</ng-select>\r\n" }]
55
+ args: [{ selector: 'vdr-coupon-code-selector', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-select\r\n [items]=\"availableCouponCodes$ | async\"\r\n appendTo=\"body\"\r\n bindLabel=\"code\"\r\n bindValue=\"code\"\r\n [addTag]=\"false\"\r\n [multiple]=\"true\"\r\n [hideSelected]=\"true\"\r\n [minTermLength]=\"2\"\r\n typeToSearchText=\"\"\r\n [typeahead]=\"couponCodeInput$\"\r\n [formControl]=\"control\"\r\n (add)=\"addCouponCode.emit($event.code)\"\r\n (remove)=\"remove($event.code)\"\r\n>\r\n <ng-template ng-option-tmp let-item=\"item\">\r\n <div class=\"flex items-center\">\r\n <vdr-chip class=\"mr-1\">{{ item.code }}</vdr-chip>\r\n <span>{{ item.promotionName }}</span>\r\n </div>\r\n </ng-template>\r\n</ng-select>\r\n" }]
53
56
  }], ctorParameters: () => [{ type: i1.DataService }], propDecorators: { couponCodes: [{
54
57
  type: Input
55
58
  }], control: [{
@@ -59,4 +62,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImpor
59
62
  }], removeCouponCode: [{
60
63
  type: Output
61
64
  }] } });
62
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY291cG9uLWNvZGUtc2VsZWN0b3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9vcmRlci9zcmMvY29tcG9uZW50cy9jb3Vwb24tY29kZS1zZWxlY3Rvci9jb3Vwb24tY29kZS1zZWxlY3Rvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL2NvdXBvbi1jb2RlLXNlbGVjdG9yL2NvdXBvbi1jb2RlLXNlbGVjdG9yLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDeEcsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDcEQsT0FBTyxFQUVILDBDQUEwQyxHQUU3QyxNQUFNLHdCQUF3QixDQUFDO0FBQ2hDLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNyQyxPQUFPLEVBQUUsTUFBTSxFQUFjLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUNuRCxPQUFPLEVBQUUsWUFBWSxFQUFFLG9CQUFvQixFQUFFLEdBQUcsRUFBUSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQUVyRyxNQUFNLENBQUMsTUFBTSx1Q0FBdUMsR0FBRyxHQUFHLENBQUE7Ozs7Ozs7Ozs7O0NBV3pELENBQUM7QUFRRixNQUFNLE9BQU8sMkJBQTJCO0lBT3BDLFlBQW9CLFdBQXdCO1FBQXhCLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBSmxDLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUMzQyxxQkFBZ0IsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBRXhELHFCQUFnQixHQUFHLElBQUksT0FBTyxFQUFVLENBQUM7SUFDTSxDQUFDO0lBRWhELFFBQVE7UUFDSixJQUFJLENBQUMscUJBQXFCLEdBQUcsTUFBTSxDQUMvQixJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUN0QixZQUFZLENBQUMsR0FBRyxDQUFDLEVBQ2pCLG9CQUFvQixFQUFFLEVBQ3RCLFNBQVMsQ0FDTCxJQUFJLENBQUMsRUFBRSxDQUNILElBQUksQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLDBDQUEwQyxFQUFFO1lBQy9ELE9BQU8sRUFBRTtnQkFDTCxJQUFJLEVBQUUsRUFBRTtnQkFDUixJQUFJLEVBQUUsQ0FBQztnQkFDUCxNQUFNLEVBQUU7b0JBQ0osVUFBVSxFQUFFLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRTtpQkFDakM7YUFDSjtTQUNKLENBQUMsQ0FBQyxPQUFPLENBQ2pCLEVBQ0QsR0FBRyxDQUFDLENBQUMsRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFO1FBQ25CLG9FQUFvRTtRQUNwRSxVQUFVLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDLFVBQVcsRUFBRSxhQUFhLEVBQUUsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDLENBQUMsQ0FDOUUsRUFDRCxTQUFTLENBQUMsRUFBRSxDQUFDLENBQ2hCLENBQ0osQ0FBQztRQUNGLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7WUFDaEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLGtCQUFrQixDQUFDLElBQUksQ0FBQyxXQUFXLElBQUksRUFBRSxDQUFDLENBQUM7UUFDbEUsQ0FBQztJQUNMLENBQUM7OEdBcENRLDJCQUEyQjtrR0FBM0IsMkJBQTJCLCtNQzlCeEMsMnVCQXNCQTs7MkZEUWEsMkJBQTJCO2tCQU52QyxTQUFTOytCQUNJLDBCQUEwQixtQkFHbkIsdUJBQXVCLENBQUMsTUFBTTtnRkFHdEMsV0FBVztzQkFBbkIsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUs7Z0JBQ0ksYUFBYTtzQkFBdEIsTUFBTTtnQkFDRyxnQkFBZ0I7c0JBQXpCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneSwgQ29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBVbnR5cGVkRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7XHJcbiAgICBEYXRhU2VydmljZSxcclxuICAgIEdldENvdXBvbkNvZGVTZWxlY3RvclByb21vdGlvbkxpc3REb2N1bWVudCxcclxuICAgIFBST01PVElPTl9GUkFHTUVOVCxcclxufSBmcm9tICdAdmVuZHVyZS9hZG1pbi11aS9jb3JlJztcclxuaW1wb3J0IHsgZ3FsIH0gZnJvbSAnYXBvbGxvLWFuZ3VsYXInO1xyXG5pbXBvcnQgeyBjb25jYXQsIE9ic2VydmFibGUsIFN1YmplY3QgfSBmcm9tICdyeGpzJztcclxuaW1wb3J0IHsgZGVib3VuY2VUaW1lLCBkaXN0aW5jdFVudGlsQ2hhbmdlZCwgbWFwLCBza2lwLCBzdGFydFdpdGgsIHN3aXRjaE1hcCB9IGZyb20gJ3J4anMvb3BlcmF0b3JzJztcclxuXHJcbmV4cG9ydCBjb25zdCBHRVRfQ09VUE9OX0NPREVfU0VMRUNUT1JfUFJPTU9USU9OX0xJU1QgPSBncWxgXHJcbiAgICBxdWVyeSBHZXRDb3Vwb25Db2RlU2VsZWN0b3JQcm9tb3Rpb25MaXN0KCRvcHRpb25zOiBQcm9tb3Rpb25MaXN0T3B0aW9ucykge1xyXG4gICAgICAgIHByb21vdGlvbnMob3B0aW9uczogJG9wdGlvbnMpIHtcclxuICAgICAgICAgICAgaXRlbXMge1xyXG4gICAgICAgICAgICAgICAgaWRcclxuICAgICAgICAgICAgICAgIG5hbWVcclxuICAgICAgICAgICAgICAgIGNvdXBvbkNvZGVcclxuICAgICAgICAgICAgfVxyXG4gICAgICAgICAgICB0b3RhbEl0ZW1zXHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG5gO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgICBzZWxlY3RvcjogJ3Zkci1jb3Vwb24tY29kZS1zZWxlY3RvcicsXHJcbiAgICB0ZW1wbGF0ZVVybDogJy4vY291cG9uLWNvZGUtc2VsZWN0b3IuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vY291cG9uLWNvZGUtc2VsZWN0b3IuY29tcG9uZW50LnNjc3MnXSxcclxuICAgIGNoYW5nZURldGVjdGlvbjogQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3kuT25QdXNoLFxyXG59KVxyXG5leHBvcnQgY2xhc3MgQ291cG9uQ29kZVNlbGVjdG9yQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICAgIEBJbnB1dCgpIGNvdXBvbkNvZGVzOiBzdHJpbmdbXTtcclxuICAgIEBJbnB1dCgpIGNvbnRyb2w6IFVudHlwZWRGb3JtQ29udHJvbCB8IHVuZGVmaW5lZDtcclxuICAgIEBPdXRwdXQoKSBhZGRDb3Vwb25Db2RlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XHJcbiAgICBAT3V0cHV0KCkgcmVtb3ZlQ291cG9uQ29kZSA9IG5ldyBFdmVudEVtaXR0ZXI8c3RyaW5nPigpO1xyXG4gICAgYXZhaWxhYmxlQ291cG9uQ29kZXMkOiBPYnNlcnZhYmxlPEFycmF5PHsgY29kZTogc3RyaW5nOyBwcm9tb3Rpb25OYW1lOiBzdHJpbmcgfT4+O1xyXG4gICAgY291cG9uQ29kZUlucHV0JCA9IG5ldyBTdWJqZWN0PHN0cmluZz4oKTtcclxuICAgIGNvbnN0cnVjdG9yKHByaXZhdGUgZGF0YVNlcnZpY2U6IERhdGFTZXJ2aWNlKSB7fVxyXG5cclxuICAgIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgICAgIHRoaXMuYXZhaWxhYmxlQ291cG9uQ29kZXMkID0gY29uY2F0KFxyXG4gICAgICAgICAgICB0aGlzLmNvdXBvbkNvZGVJbnB1dCQucGlwZShcclxuICAgICAgICAgICAgICAgIGRlYm91bmNlVGltZSgyMDApLFxyXG4gICAgICAgICAgICAgICAgZGlzdGluY3RVbnRpbENoYW5nZWQoKSxcclxuICAgICAgICAgICAgICAgIHN3aXRjaE1hcChcclxuICAgICAgICAgICAgICAgICAgICB0ZXJtID0+XHJcbiAgICAgICAgICAgICAgICAgICAgICAgIHRoaXMuZGF0YVNlcnZpY2UucXVlcnkoR2V0Q291cG9uQ29kZVNlbGVjdG9yUHJvbW90aW9uTGlzdERvY3VtZW50LCB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICBvcHRpb25zOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgdGFrZTogMTAsXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgc2tpcDogMCxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBmaWx0ZXI6IHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgY291cG9uQ29kZTogeyBjb250YWluczogdGVybSB9LFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICAgICAgICAgICAgICB9KS5zaW5nbGUkLFxyXG4gICAgICAgICAgICAgICAgKSxcclxuICAgICAgICAgICAgICAgIG1hcCgoeyBwcm9tb3Rpb25zIH0pID0+XHJcbiAgICAgICAgICAgICAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1ub24tbnVsbC1hc3NlcnRpb25cclxuICAgICAgICAgICAgICAgICAgICBwcm9tb3Rpb25zLml0ZW1zLm1hcChwID0+ICh7IGNvZGU6IHAuY291cG9uQ29kZSEsIHByb21vdGlvbk5hbWU6IHAubmFtZSB9KSksXHJcbiAgICAgICAgICAgICAgICApLFxyXG4gICAgICAgICAgICAgICAgc3RhcnRXaXRoKFtdKSxcclxuICAgICAgICAgICAgKSxcclxuICAgICAgICApO1xyXG4gICAgICAgIGlmICghdGhpcy5jb250cm9sKSB7XHJcbiAgICAgICAgICAgIHRoaXMuY29udHJvbCA9IG5ldyBVbnR5cGVkRm9ybUNvbnRyb2wodGhpcy5jb3Vwb25Db2RlcyA/PyBbXSk7XHJcbiAgICAgICAgfVxyXG4gICAgfVxyXG59XHJcbiIsIjxuZy1zZWxlY3RcclxuICAgIFtpdGVtc109XCJhdmFpbGFibGVDb3Vwb25Db2RlcyQgfCBhc3luY1wiXHJcbiAgICBhcHBlbmRUbz1cImJvZHlcIlxyXG4gICAgYmluZExhYmVsPVwiY29kZVwiXHJcbiAgICBiaW5kVmFsdWU9XCJjb2RlXCJcclxuICAgIFthZGRUYWddPVwiZmFsc2VcIlxyXG4gICAgW211bHRpcGxlXT1cInRydWVcIlxyXG4gICAgW2hpZGVTZWxlY3RlZF09XCJ0cnVlXCJcclxuICAgIFttaW5UZXJtTGVuZ3RoXT1cIjJcIlxyXG4gICAgdHlwZVRvU2VhcmNoVGV4dD1cIlwiXHJcbiAgICBbdHlwZWFoZWFkXT1cImNvdXBvbkNvZGVJbnB1dCRcIlxyXG4gICAgW2Zvcm1Db250cm9sXT1cImNvbnRyb2xcIlxyXG4gICAgKGFkZCk9XCJhZGRDb3Vwb25Db2RlLmVtaXQoJGV2ZW50LmNvZGUpXCJcclxuICAgIChyZW1vdmUpPVwicmVtb3ZlQ291cG9uQ29kZS5lbWl0KCRldmVudC52YWx1ZT8uY29kZSlcIlxyXG4+XHJcbiAgICA8bmctdGVtcGxhdGUgbmctb3B0aW9uLXRtcCBsZXQtaXRlbT1cIml0ZW1cIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwiZmxleCBpdGVtcy1jZW50ZXJcIj5cclxuICAgICAgICAgICAgPHZkci1jaGlwIGNsYXNzPVwibXItMVwiPnt7IGl0ZW0uY29kZSB9fTwvdmRyLWNoaXA+XHJcbiAgICAgICAgICAgIDxzcGFuPnt7IGl0ZW0ucHJvbW90aW9uTmFtZSB9fTwvc3Bhbj5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvbmctdGVtcGxhdGU+XHJcbjwvbmctc2VsZWN0PlxyXG4iXX0=
65
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY291cG9uLWNvZGUtc2VsZWN0b3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9vcmRlci9zcmMvY29tcG9uZW50cy9jb3Vwb24tY29kZS1zZWxlY3Rvci9jb3Vwb24tY29kZS1zZWxlY3Rvci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL2NvdXBvbi1jb2RlLXNlbGVjdG9yL2NvdXBvbi1jb2RlLXNlbGVjdG9yLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBVSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDeEcsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDcEQsT0FBTyxFQUVILDBDQUEwQyxHQUU3QyxNQUFNLHdCQUF3QixDQUFDO0FBQ2hDLE9BQU8sRUFBRSxHQUFHLEVBQUUsTUFBTSxnQkFBZ0IsQ0FBQztBQUNyQyxPQUFPLEVBQUUsTUFBTSxFQUFjLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQztBQUNuRCxPQUFPLEVBQUUsWUFBWSxFQUFFLG9CQUFvQixFQUFFLEdBQUcsRUFBUSxTQUFTLEVBQUUsU0FBUyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7OztBQUVyRyxNQUFNLENBQUMsTUFBTSx1Q0FBdUMsR0FBRyxHQUFHLENBQUE7Ozs7Ozs7Ozs7O0NBV3pELENBQUM7QUFRRixNQUFNLE9BQU8sMkJBQTJCO0lBT3BDLFlBQW9CLFdBQXdCO1FBQXhCLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBSmxDLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUMzQyxxQkFBZ0IsR0FBRyxJQUFJLFlBQVksRUFBVSxDQUFDO1FBRXhELHFCQUFnQixHQUFHLElBQUksT0FBTyxFQUFVLENBQUM7SUFDTSxDQUFDO0lBRWhELFFBQVE7UUFDSixJQUFJLENBQUMscUJBQXFCLEdBQUcsTUFBTSxDQUMvQixJQUFJLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUN0QixZQUFZLENBQUMsR0FBRyxDQUFDLEVBQ2pCLG9CQUFvQixFQUFFLEVBQ3RCLFNBQVMsQ0FDTCxJQUFJLENBQUMsRUFBRSxDQUNILElBQUksQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLDBDQUEwQyxFQUFFO1lBQy9ELE9BQU8sRUFBRTtnQkFDTCxJQUFJLEVBQUUsRUFBRTtnQkFDUixJQUFJLEVBQUUsQ0FBQztnQkFDUCxNQUFNLEVBQUU7b0JBQ0osVUFBVSxFQUFFLEVBQUUsUUFBUSxFQUFFLElBQUksRUFBRTtpQkFDakM7YUFDSjtTQUNKLENBQUMsQ0FBQyxPQUFPLENBQ2pCLEVBQ0QsR0FBRyxDQUFDLENBQUMsRUFBRSxVQUFVLEVBQUUsRUFBRSxFQUFFO1FBQ25CLG9FQUFvRTtRQUNwRSxVQUFVLENBQUMsS0FBSyxDQUFDLEdBQUcsQ0FBQyxDQUFDLENBQUMsRUFBRSxDQUFDLENBQUMsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDLFVBQVcsRUFBRSxhQUFhLEVBQUUsQ0FBQyxDQUFDLElBQUksRUFBRSxDQUFDLENBQUMsQ0FDOUUsRUFDRCxTQUFTLENBQUMsRUFBRSxDQUFDLENBQ2hCLENBQ0osQ0FBQztRQUNGLElBQUksQ0FBQyxJQUFJLENBQUMsT0FBTyxFQUFFLENBQUM7WUFDaEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLGtCQUFrQixDQUFDLElBQUksQ0FBQyxXQUFXLElBQUksRUFBRSxDQUFDLENBQUM7UUFDbEUsQ0FBQztJQUNMLENBQUM7SUFFRCxNQUFNLENBQUMsSUFBWTtRQUNmLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDckMsQ0FBQzs4R0F4Q1EsMkJBQTJCO2tHQUEzQiwyQkFBMkIsK01DOUJ4QyxxdEJBc0JBOzsyRkRRYSwyQkFBMkI7a0JBTnZDLFNBQVM7K0JBQ0ksMEJBQTBCLG1CQUduQix1QkFBdUIsQ0FBQyxNQUFNO2dGQUd0QyxXQUFXO3NCQUFuQixLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDSSxhQUFhO3NCQUF0QixNQUFNO2dCQUNHLGdCQUFnQjtzQkFBekIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IFVudHlwZWRGb3JtQ29udHJvbCB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHtcclxuICAgIERhdGFTZXJ2aWNlLFxyXG4gICAgR2V0Q291cG9uQ29kZVNlbGVjdG9yUHJvbW90aW9uTGlzdERvY3VtZW50LFxyXG4gICAgUFJPTU9USU9OX0ZSQUdNRU5ULFxyXG59IGZyb20gJ0B2ZW5kdXJlL2FkbWluLXVpL2NvcmUnO1xyXG5pbXBvcnQgeyBncWwgfSBmcm9tICdhcG9sbG8tYW5ndWxhcic7XHJcbmltcG9ydCB7IGNvbmNhdCwgT2JzZXJ2YWJsZSwgU3ViamVjdCB9IGZyb20gJ3J4anMnO1xyXG5pbXBvcnQgeyBkZWJvdW5jZVRpbWUsIGRpc3RpbmN0VW50aWxDaGFuZ2VkLCBtYXAsIHNraXAsIHN0YXJ0V2l0aCwgc3dpdGNoTWFwIH0gZnJvbSAncnhqcy9vcGVyYXRvcnMnO1xyXG5cclxuZXhwb3J0IGNvbnN0IEdFVF9DT1VQT05fQ09ERV9TRUxFQ1RPUl9QUk9NT1RJT05fTElTVCA9IGdxbGBcclxuICAgIHF1ZXJ5IEdldENvdXBvbkNvZGVTZWxlY3RvclByb21vdGlvbkxpc3QoJG9wdGlvbnM6IFByb21vdGlvbkxpc3RPcHRpb25zKSB7XHJcbiAgICAgICAgcHJvbW90aW9ucyhvcHRpb25zOiAkb3B0aW9ucykge1xyXG4gICAgICAgICAgICBpdGVtcyB7XHJcbiAgICAgICAgICAgICAgICBpZFxyXG4gICAgICAgICAgICAgICAgbmFtZVxyXG4gICAgICAgICAgICAgICAgY291cG9uQ29kZVxyXG4gICAgICAgICAgICB9XHJcbiAgICAgICAgICAgIHRvdGFsSXRlbXNcclxuICAgICAgICB9XHJcbiAgICB9XHJcbmA7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAndmRyLWNvdXBvbi1jb2RlLXNlbGVjdG9yJyxcclxuICAgIHRlbXBsYXRlVXJsOiAnLi9jb3Vwb24tY29kZS1zZWxlY3Rvci5jb21wb25lbnQuaHRtbCcsXHJcbiAgICBzdHlsZVVybHM6IFsnLi9jb3Vwb24tY29kZS1zZWxlY3Rvci5jb21wb25lbnQuc2NzcyddLFxyXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDb3Vwb25Db2RlU2VsZWN0b3JDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gICAgQElucHV0KCkgY291cG9uQ29kZXM6IHN0cmluZ1tdO1xyXG4gICAgQElucHV0KCkgY29udHJvbDogVW50eXBlZEZvcm1Db250cm9sIHwgdW5kZWZpbmVkO1xyXG4gICAgQE91dHB1dCgpIGFkZENvdXBvbkNvZGUgPSBuZXcgRXZlbnRFbWl0dGVyPHN0cmluZz4oKTtcclxuICAgIEBPdXRwdXQoKSByZW1vdmVDb3Vwb25Db2RlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XHJcbiAgICBhdmFpbGFibGVDb3Vwb25Db2RlcyQ6IE9ic2VydmFibGU8QXJyYXk8eyBjb2RlOiBzdHJpbmc7IHByb21vdGlvbk5hbWU6IHN0cmluZyB9Pj47XHJcbiAgICBjb3Vwb25Db2RlSW5wdXQkID0gbmV3IFN1YmplY3Q8c3RyaW5nPigpO1xyXG4gICAgY29uc3RydWN0b3IocHJpdmF0ZSBkYXRhU2VydmljZTogRGF0YVNlcnZpY2UpIHt9XHJcblxyXG4gICAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICAgICAgdGhpcy5hdmFpbGFibGVDb3Vwb25Db2RlcyQgPSBjb25jYXQoXHJcbiAgICAgICAgICAgIHRoaXMuY291cG9uQ29kZUlucHV0JC5waXBlKFxyXG4gICAgICAgICAgICAgICAgZGVib3VuY2VUaW1lKDIwMCksXHJcbiAgICAgICAgICAgICAgICBkaXN0aW5jdFVudGlsQ2hhbmdlZCgpLFxyXG4gICAgICAgICAgICAgICAgc3dpdGNoTWFwKFxyXG4gICAgICAgICAgICAgICAgICAgIHRlcm0gPT5cclxuICAgICAgICAgICAgICAgICAgICAgICAgdGhpcy5kYXRhU2VydmljZS5xdWVyeShHZXRDb3Vwb25Db2RlU2VsZWN0b3JQcm9tb3Rpb25MaXN0RG9jdW1lbnQsIHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIG9wdGlvbnM6IHtcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICB0YWtlOiAxMCxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBza2lwOiAwLFxyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgIGZpbHRlcjoge1xyXG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICBjb3Vwb25Db2RlOiB7IGNvbnRhaW5zOiB0ZXJtIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgICAgIH0pLnNpbmdsZSQsXHJcbiAgICAgICAgICAgICAgICApLFxyXG4gICAgICAgICAgICAgICAgbWFwKCh7IHByb21vdGlvbnMgfSkgPT5cclxuICAgICAgICAgICAgICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLW5vbi1udWxsLWFzc2VydGlvblxyXG4gICAgICAgICAgICAgICAgICAgIHByb21vdGlvbnMuaXRlbXMubWFwKHAgPT4gKHsgY29kZTogcC5jb3Vwb25Db2RlISwgcHJvbW90aW9uTmFtZTogcC5uYW1lIH0pKSxcclxuICAgICAgICAgICAgICAgICksXHJcbiAgICAgICAgICAgICAgICBzdGFydFdpdGgoW10pLFxyXG4gICAgICAgICAgICApLFxyXG4gICAgICAgICk7XHJcbiAgICAgICAgaWYgKCF0aGlzLmNvbnRyb2wpIHtcclxuICAgICAgICAgICAgdGhpcy5jb250cm9sID0gbmV3IFVudHlwZWRGb3JtQ29udHJvbCh0aGlzLmNvdXBvbkNvZGVzID8/IFtdKTtcclxuICAgICAgICB9XHJcbiAgICB9XHJcblxyXG4gICAgcmVtb3ZlKGNvZGU6IHN0cmluZykge1xyXG4gICAgICAgIHRoaXMucmVtb3ZlQ291cG9uQ29kZS5lbWl0KGNvZGUpO1xyXG4gICAgfVxyXG59XHJcbiIsIjxuZy1zZWxlY3RcclxuICAgIFtpdGVtc109XCJhdmFpbGFibGVDb3Vwb25Db2RlcyQgfCBhc3luY1wiXHJcbiAgICBhcHBlbmRUbz1cImJvZHlcIlxyXG4gICAgYmluZExhYmVsPVwiY29kZVwiXHJcbiAgICBiaW5kVmFsdWU9XCJjb2RlXCJcclxuICAgIFthZGRUYWddPVwiZmFsc2VcIlxyXG4gICAgW211bHRpcGxlXT1cInRydWVcIlxyXG4gICAgW2hpZGVTZWxlY3RlZF09XCJ0cnVlXCJcclxuICAgIFttaW5UZXJtTGVuZ3RoXT1cIjJcIlxyXG4gICAgdHlwZVRvU2VhcmNoVGV4dD1cIlwiXHJcbiAgICBbdHlwZWFoZWFkXT1cImNvdXBvbkNvZGVJbnB1dCRcIlxyXG4gICAgW2Zvcm1Db250cm9sXT1cImNvbnRyb2xcIlxyXG4gICAgKGFkZCk9XCJhZGRDb3Vwb25Db2RlLmVtaXQoJGV2ZW50LmNvZGUpXCJcclxuICAgIChyZW1vdmUpPVwicmVtb3ZlKCRldmVudC5jb2RlKVwiXHJcbj5cclxuICAgIDxuZy10ZW1wbGF0ZSBuZy1vcHRpb24tdG1wIGxldC1pdGVtPVwiaXRlbVwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJmbGV4IGl0ZW1zLWNlbnRlclwiPlxyXG4gICAgICAgICAgICA8dmRyLWNoaXAgY2xhc3M9XCJtci0xXCI+e3sgaXRlbS5jb2RlIH19PC92ZHItY2hpcD5cclxuICAgICAgICAgICAgPHNwYW4+e3sgaXRlbS5wcm9tb3Rpb25OYW1lIH19PC9zcGFuPlxyXG4gICAgICAgIDwvZGl2PlxyXG4gICAgPC9uZy10ZW1wbGF0ZT5cclxuPC9uZy1zZWxlY3Q+XHJcbiJdfQ==
@@ -504,7 +504,7 @@ class CreateProductVariantDialogComponent {
504
504
  this.formBuilder = formBuilder;
505
505
  this.form = this.formBuilder.group({
506
506
  name: ['', Validators.required],
507
- sku: ['', Validators.required],
507
+ sku: [''],
508
508
  price: [''],
509
509
  options: this.formBuilder.record({}),
510
510
  });
@@ -535,13 +535,13 @@ class CreateProductVariantDialogComponent {
535
535
  }
536
536
  confirm() {
537
537
  const { name, sku, options, price } = this.form.value;
538
- if (!name || !sku || !options || price == null) {
538
+ if (!name || !options || price == null) {
539
539
  return;
540
540
  }
541
541
  const optionIds = Object.values(options).filter(notNullOrUndefined);
542
542
  this.resolveWith({
543
543
  productId: this.product.id,
544
- sku,
544
+ sku: sku || '',
545
545
  price: Number(price),
546
546
  optionIds,
547
547
  translations: [
@@ -3769,11 +3769,11 @@ class ProductDetailComponent extends TypedBaseDetailComponent {
3769
3769
  }
3770
3770
  }
3771
3771
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductDetailComponent, deps: [{ token: ProductDetailService }, { token: i2.FormBuilder }, { token: i1.ModalService }, { token: i1.NotificationService }, { token: i1.DataService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
3772
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductDetailComponent, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></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 || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\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-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\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 [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"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 </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\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]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\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>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\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]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\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 <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}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-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;max-height:144px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "directive", type: i1.IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.ChannelBadgeComponent, selector: "vdr-channel-badge", inputs: ["channelCode"] }, { kind: "directive", type: i1.IfDefaultChannelActiveDirective, selector: "[vdrIfDefaultChannelActive]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: GenerateProductVariantsComponent, selector: "vdr-generate-product-variants", outputs: ["variantsChange"] }, { kind: "component", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: ["productId", "hideLanguageSelect", "dataTableId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.ChannelLabelPipe, name: "channelCodeToLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3772
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.2.4", type: ProductDetailComponent, selector: "vdr-product-detail2", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></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 || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\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-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\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 [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"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 </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\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]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\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>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\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]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\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 <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}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-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;min-height:24px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"], dependencies: [{ kind: "directive", type: i3.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i3.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "directive", type: i1$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarLeftComponent, selector: "vdr-ab-left", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ActionBarDropdownMenuComponent, selector: "vdr-action-bar-dropdown-menu", inputs: ["alwaysShow"] }, { kind: "component", type: i1.AssetsComponent, selector: "vdr-assets", inputs: ["assets", "featuredAsset", "compact", "updatePermissions"], outputs: ["change"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.FacetValueChipComponent, selector: "vdr-facet-value-chip", inputs: ["facetValue", "removable", "displayFacetName"], outputs: ["remove"] }, { kind: "component", type: i1.FormFieldComponent, selector: "vdr-form-field", inputs: ["label", "for", "tooltip", "errors", "readOnlyToggle"], outputs: ["readOnlyToggleChange"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select, vdr-currency-input" }, { kind: "component", type: i1.FormItemComponent, selector: "vdr-form-item", inputs: ["label", "tooltip"] }, { kind: "component", type: i1.LanguageSelectorComponent, selector: "vdr-language-selector", inputs: ["currentLanguageCode", "availableLanguageCodes", "disabled"], outputs: ["languageCodeChange"] }, { kind: "component", type: i1.RichTextEditorComponent, selector: "vdr-rich-text-editor", inputs: ["label", "readonly"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "directive", type: i1.IfMultichannelDirective, selector: "[vdrIfMultichannel]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items" }, { kind: "component", type: i1.ChannelBadgeComponent, selector: "vdr-channel-badge", inputs: ["channelCode"] }, { kind: "directive", type: i1.IfDefaultChannelActiveDirective, selector: "[vdrIfDefaultChannelActive]", inputs: ["vdrIfMultichannelElse"] }, { kind: "component", type: i1.TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }, { kind: "component", type: i1.CustomDetailComponentHostComponent, selector: "vdr-custom-detail-component-host", inputs: ["locationId", "entity$", "detailForm"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "component", type: i1.PageEntityInfoComponent, selector: "vdr-page-entity-info", inputs: ["entity"] }, { kind: "component", type: i1.PageDetailLayoutComponent, selector: "vdr-page-detail-layout" }, { kind: "component", type: i1.PageDetailSidebarComponent, selector: "vdr-page-detail-sidebar" }, { kind: "component", type: i1.CardComponent, selector: "vdr-card", inputs: ["title", "paddingX"] }, { kind: "component", type: GenerateProductVariantsComponent, selector: "vdr-generate-product-variants", outputs: ["variantsChange"] }, { kind: "component", type: ProductVariantListComponent, selector: "vdr-product-variant-list", inputs: ["productId", "hideLanguageSelect", "dataTableId"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.SortPipe, name: "sort" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.ChannelLabelPipe, name: "channelCodeToLabel" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
3773
3773
  }
3774
3774
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.2.4", ngImport: i0, type: ProductDetailComponent, decorators: [{
3775
3775
  type: Component,
3776
- args: [{ selector: 'vdr-product-detail2', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></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 || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\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-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\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 [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"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 </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\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]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\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>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\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]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\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 <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}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-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;max-height:144px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"] }]
3776
+ args: [{ selector: 'vdr-product-detail2', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-block>\r\n <vdr-action-bar>\r\n <vdr-ab-left>\r\n <div class=\"flex clr-flex-row\"></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 || createVariantsConfig.variants.length === 0\"\r\n >\r\n {{ 'common.create' | translate }}\r\n </button>\r\n <ng-template #updateButton>\r\n <button\r\n *vdrIfPermissions=\"updatePermissions\"\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-action-bar-dropdown-menu locationId=\"product-detail\"></vdr-action-bar-dropdown-menu>\r\n </vdr-ab-right>\r\n </vdr-action-bar>\r\n</vdr-page-block>\r\n\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n <vdr-page-detail-layout>\r\n <vdr-page-detail-sidebar>\r\n <vdr-card>\r\n <vdr-form-field [label]=\"'catalog.visibility' | translate\" for=\"visibility\">\r\n <clr-toggle-wrapper *vdrIfPermissions=\"updatePermissions\">\r\n <input\r\n type=\"checkbox\"\r\n clrToggle\r\n name=\"enabled\"\r\n [formControl]=\"detailForm.get(['enabled'])\"\r\n />\r\n <label>{{ 'common.enabled' | translate }}</label>\r\n </clr-toggle-wrapper>\r\n </vdr-form-field>\r\n </vdr-card>\r\n <ng-container *ngIf=\"!(isNew$ | async)\">\r\n <vdr-card *vdrIfMultichannel [title]=\"'common.channels' | translate\">\r\n <vdr-form-item *vdrIfDefaultChannelActive>\r\n <div class=\"flex channel-assignment\">\r\n <div class=\"mb-2\">\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 [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n {{ channel.code | channelCodeToLabel }}\r\n </vdr-chip>\r\n </ng-container>\r\n </div>\r\n <button class=\"button-small\" (click)=\"assignToChannel()\">\r\n <clr-icon shape=\"layers\"></clr-icon>\r\n {{ 'common.assign-to-channel' | translate }}\r\n </button>\r\n </div>\r\n </vdr-form-item>\r\n </vdr-card>\r\n </ng-container>\r\n <vdr-card *ngIf=\"entity?.optionGroups.length\" [title]=\"'catalog.product-options' | translate\">\r\n <div class=\"options\">\r\n <vdr-chip\r\n *ngFor=\"let optionGroup of entity?.optionGroups | sort : 'id'\"\r\n [colorFrom]=\"optionGroup.code\"\r\n [invert]=\"true\"\r\n >\r\n {{ optionGroup.name }}\r\n </vdr-chip>\r\n </div>\r\n <div>\r\n <a [routerLink]=\"['options']\" class=\"button-small mt-2\" *vdrIfPermissions=\"updatePermissions\">\r\n <clr-icon shape=\"pencil\"></clr-icon>\r\n {{ 'catalog.edit-options' | translate }}\r\n </a>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'catalog.facets' | translate\">\r\n <div class=\"facets\">\r\n <vdr-facet-value-chip\r\n *ngFor=\"let facetValue of facetValues$ | async\"\r\n [facetValue]=\"facetValue\"\r\n [removable]=\"updatePermissions | hasPermission\"\r\n (remove)=\"removeProductFacetValue(facetValue.id)\"\r\n ></vdr-facet-value-chip>\r\n </div>\r\n <div>\r\n <button\r\n class=\"button-small mt-2\"\r\n *vdrIfPermissions=\"updatePermissions\"\r\n (click)=\"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 </vdr-card>\r\n <vdr-card *ngIf=\"entity$ | async as entity\">\r\n <vdr-page-entity-info [entity]=\"entity\"></vdr-page-entity-info>\r\n </vdr-card>\r\n </vdr-page-detail-sidebar>\r\n\r\n <vdr-page-block>\r\n <button type=\"submit\" hidden x-data=\"prevents enter key from triggering other buttons\"></button>\r\n <vdr-card>\r\n <div class=\"form-grid\">\r\n <div>\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]=\"!(updatePermissions | hasPermission)\"\r\n (input)=\"updateSlug($event.target.value)\"\r\n />\r\n </vdr-form-field>\r\n <div *ngIf=\"(isNew$ | async) === false && detailForm.get(['name'])?.dirty\">\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>{{ 'catalog.auto-update-product-variant-name' | translate }}</label>\r\n </clr-checkbox-wrapper>\r\n </div>\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]=\"!(updatePermissions | hasPermission)\"\r\n />\r\n </vdr-form-field>\r\n <vdr-form-field\r\n class=\"form-grid-span\"\r\n [label]=\"'common.description' | translate\"\r\n for=\"slug\"\r\n [errors]=\"{ pattern: 'catalog.slug-pattern-error' | translate }\"\r\n >\r\n <vdr-rich-text-editor\r\n formControlName=\"description\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-rich-text-editor>\r\n </vdr-form-field>\r\n </div>\r\n </vdr-card>\r\n <vdr-card [title]=\"'common.custom-fields' | translate\" *ngIf=\"customFields.length\">\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Product\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n [readonly]=\"!(updatePermissions | hasPermission)\"\r\n ></vdr-tabbed-custom-fields>\r\n </vdr-card>\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 <vdr-card [title]=\"'catalog.assets' | translate\">\r\n <vdr-assets\r\n [assets]=\"assetChanges.assets || entity?.assets\"\r\n [featuredAsset]=\"assetChanges.featuredAsset || entity?.featuredAsset\"\r\n [updatePermissions]=\"updatePermissions\"\r\n (change)=\"assetChanges = $event\"\r\n ></vdr-assets>\r\n </vdr-card>\r\n\r\n <vdr-card [title]=\"'catalog.product-variants' | translate\" [paddingX]=\"isNew$ | async\">\r\n <div *ngIf=\"isNew$ | async; else variantList\">\r\n <vdr-generate-product-variants\r\n (variantsChange)=\"createVariantsConfig = $event\"\r\n ></vdr-generate-product-variants>\r\n </div>\r\n <ng-template #variantList>\r\n <vdr-product-variant-list\r\n [productId]=\"this.id\"\r\n dataTableId=\"product-detail-variants-list\"\r\n [hideLanguageSelect]=\"true\"\r\n ></vdr-product-variant-list>\r\n </ng-template>\r\n <div class=\"mx-3\" *ngIf=\"(isNew$ | async) === false\">\r\n <a class=\"button\" [routerLink]=\"['manage-variants']\">\r\n <clr-icon shape=\"add-text\"></clr-icon>\r\n {{ 'catalog.manage-variants' | translate }}</a\r\n >\r\n </div>\r\n </vdr-card>\r\n </vdr-page-block>\r\n </vdr-page-detail-layout>\r\n</form>\r\n", styles: [":host ::ng-deep trix-toolbar{top:24px}.facets,.options{display:flex;flex-wrap:wrap;gap:3px}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-inline-start:none}.group-name{padding-inline-end:6px}.view-mode{display:flex;flex-direction:column;justify-content:space-between}@media screen and (min-width: 768px){.view-mode{flex-direction:row}}.edit-variants-btn{margin-top:0}.channel-assignment{flex-wrap:wrap;min-height:24px}.pagination-row{display:flex;align-items:baseline;justify-content:space-between}\n"] }]
3777
3777
  }], ctorParameters: () => [{ type: ProductDetailService }, { type: i2.FormBuilder }, { type: i1.ModalService }, { type: i1.NotificationService }, { type: i1.DataService }, { type: i0.ChangeDetectorRef }] });
3778
3778
 
3779
3779
  const deleteProductsBulkAction = {