@vendure/admin-ui 1.7.4 → 1.8.0

package/fesm2015/vendure-admin-ui-settings.js

@@ -1,2977 +0,0 @@
-import * as i0 from '@angular/core';
-import { Component, ChangeDetectionStrategy, ChangeDetectorRef, EventEmitter, Input, Output, Directive, TemplateRef, ContentChild, Injectable, NgModule } from '@angular/core';
-import * as i2 from '@vendure/admin-ui/core';
-import { DataService, BaseDetailComponent, Permission, ServerConfigService, NotificationService, BaseListComponent, ModalService, CurrencyCode, createUpdatedTranslatable, findTranslation, DeletionResult, LanguageCode, configurableDefinitionToInstance, toConfigurableOperationInput, getConfigArgValue, LocalStorageService, BaseEntityResolver, getDefaultUiLanguage, createResolveData, CanDeactivateDetailGuard, detailBreadcrumb, SharedModule } from '@vendure/admin-ui/core';
-import { map, take, mergeMap, switchMap, startWith, tap, withLatestFrom, takeUntil, distinctUntilChanged, mapTo } from 'rxjs/operators';
-import { Validators, FormBuilder, FormControl } from '@angular/forms';
-import * as i1 from '@angular/router';
-import { Router, ActivatedRoute, RouterModule } from '@angular/router';
-import { marker } from '@biesbjerg/ngx-translate-extract-marker';
-import { CUSTOMER_ROLE_CODE, DEFAULT_CHANNEL_CODE, SUPER_ADMIN_ROLE_CODE } from '@vendure/common/lib/shared-constants';
-import { EMPTY, Subject, combineLatest, of, merge } from 'rxjs';
-import { normalizeString } from '@vendure/common/lib/normalize-string';
-import { unique } from '@vendure/common/lib/unique';
-
-class AddCountryToZoneDialogComponent {
-    constructor(dataService) {
-        this.dataService = dataService;
-        this.currentMembers = [];
-        this.selectedMemberIds = [];
-    }
-    ngOnInit() {
-        const currentMemberIds = this.currentMembers.map(m => m.id);
-        this.availableCountries$ = this.dataService.settings
-            .getCountries(999)
-            .mapStream(data => data.countries.items)
-            .pipe(map(countries => countries.filter(c => !currentMemberIds.includes(c.id))));
-    }
-    cancel() {
-        this.resolveWith();
-    }
-    add() {
-        this.resolveWith(this.selectedMemberIds);
-    }
-}
-AddCountryToZoneDialogComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-add-country-to-zone-dialog',
-                template: "<ng-template vdrDialogTitle>{{ 'settings.add-countries-to-zone' | translate: { zoneName: zoneName } }}</ng-template>\r\n\r\n<vdr-zone-member-list\r\n    [members]=\"availableCountries$ | async\"\r\n    [selectedMemberIds]=\"selectedMemberIds\"\r\n    (selectionChange)=\"selectedMemberIds = $event\"\r\n>\r\n</vdr-zone-member-list>\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)=\"add()\" [disabled]=\"!selectedMemberIds.length\" class=\"btn btn-primary\">\r\n        {{ 'settings.add-countries-to-zone' | translate: { zoneName: zoneName } }}\r\n    </button>\r\n</ng-template>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-AddCountryToZoneDialogComponent.ctorParameters = () => [
-    { type: DataService }
-];
-
-class AdminDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.selectedRoles = [];
-        this.selectedRolePermissions = {};
-        this.selectedChannelId = null;
-        this.customFields = this.getCustomFieldConfig('Administrator');
-        this.detailForm = this.formBuilder.group({
-            emailAddress: ['', Validators.required],
-            firstName: ['', Validators.required],
-            lastName: ['', Validators.required],
-            password: [''],
-            roles: [[]],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    getAvailableChannels() {
-        return Object.values(this.selectedRolePermissions);
-    }
-    ngOnInit() {
-        this.init();
-        this.administrator$ = this.entity$;
-        this.allRoles$ = this.dataService.administrator
-            .getRoles(999)
-            .mapStream(item => item.roles.items.filter(i => i.code !== CUSTOMER_ROLE_CODE));
-        this.dataService.client.userStatus().single$.subscribe(({ userStatus }) => {
-            if (!userStatus.permissions.includes(Permission.UpdateAdministrator)) {
-                const rolesSelect = this.detailForm.get('roles');
-                if (rolesSelect) {
-                    rolesSelect.disable();
-                }
-            }
-        });
-        this.permissionDefinitions = this.serverConfigService.getPermissionDefinitions();
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    rolesChanged(roles) {
-        this.buildPermissionsMap();
-    }
-    getPermissionsForSelectedChannel() {
-        function getActivePermissions(input) {
-            return Object.entries(input)
-                .filter(([permission, active]) => active)
-                .map(([permission, active]) => permission);
-        }
-        if (this.selectedChannelId) {
-            const selectedChannel = this.selectedRolePermissions[this.selectedChannelId];
-            if (selectedChannel) {
-                const permissionMap = this.selectedRolePermissions[this.selectedChannelId].permissions;
-                return getActivePermissions(permissionMap);
-            }
-        }
-        const channels = Object.values(this.selectedRolePermissions);
-        if (0 < channels.length) {
-            this.selectedChannelId = channels[0].channelId;
-            return getActivePermissions(channels[0].permissions);
-        }
-        return [];
-    }
-    create() {
-        const formValue = this.detailForm.value;
-        const administrator = {
-            emailAddress: formValue.emailAddress,
-            firstName: formValue.firstName,
-            lastName: formValue.lastName,
-            password: formValue.password,
-            customFields: formValue.customFields,
-            roleIds: formValue.roles.map(role => role.id),
-        };
-        this.dataService.administrator.createAdministrator(administrator).subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'Administrator',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createAdministrator.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'Administrator',
-            });
-        });
-    }
-    save() {
-        this.administrator$
-            .pipe(take(1), mergeMap(({ id }) => {
-            const formValue = this.detailForm.value;
-            const administrator = {
-                id,
-                emailAddress: formValue.emailAddress,
-                firstName: formValue.firstName,
-                lastName: formValue.lastName,
-                password: formValue.password,
-                customFields: formValue.customFields,
-                roleIds: formValue.roles.map(role => role.id),
-            };
-            return this.dataService.administrator.updateAdministrator(administrator);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'Administrator',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'Administrator',
-            });
-        });
-    }
-    setFormValues(administrator, languageCode) {
-        this.detailForm.patchValue({
-            emailAddress: administrator.emailAddress,
-            firstName: administrator.firstName,
-            lastName: administrator.lastName,
-            roles: administrator.user.roles,
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get(['customFields']), administrator);
-        }
-        const passwordControl = this.detailForm.get('password');
-        if (passwordControl) {
-            if (!administrator.id) {
-                passwordControl.setValidators([Validators.required]);
-            }
-            else {
-                passwordControl.setValidators([]);
-            }
-        }
-        this.buildPermissionsMap();
-    }
-    buildPermissionsMap() {
-        const permissionsControl = this.detailForm.get('roles');
-        if (permissionsControl) {
-            const roles = permissionsControl.value;
-            const channelIdPermissionsMap = new Map();
-            const channelIdCodeMap = new Map();
-            for (const role of roles) {
-                for (const channel of role.channels) {
-                    const channelPermissions = channelIdPermissionsMap.get(channel.id);
-                    const permissionSet = channelPermissions || new Set();
-                    role.permissions.forEach(p => permissionSet.add(p));
-                    channelIdPermissionsMap.set(channel.id, permissionSet);
-                    channelIdCodeMap.set(channel.id, channel.code);
-                }
-            }
-            this.selectedRolePermissions = {};
-            for (const channelId of Array.from(channelIdPermissionsMap.keys())) {
-                // tslint:disable-next-line:no-non-null-assertion
-                const permissionSet = channelIdPermissionsMap.get(channelId);
-                const permissionsHash = {};
-                for (const def of this.serverConfigService.getPermissionDefinitions()) {
-                    permissionsHash[def.name] = permissionSet.has(def.name);
-                }
-                this.selectedRolePermissions[channelId] = {
-                    // tslint:disable:no-non-null-assertion
-                    channelId,
-                    channelCode: channelIdCodeMap.get(channelId),
-                    permissions: permissionsHash,
-                    // tslint:enable:no-non-null-assertion
-                };
-            }
-        }
-    }
-}
-AdminDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-admin-detail',
-                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    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"administrator-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                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                *vdrIfPermissions=\"'UpdateAdministrator'\"\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\">\r\n    <vdr-form-field [label]=\"'settings.email-address' | translate\" for=\"emailAddress\">\r\n        <input\r\n            id=\"emailAddress\"\r\n            type=\"text\"\r\n            formControlName=\"emailAddress\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.first-name' | translate\" for=\"firstName\">\r\n        <input\r\n            id=\"firstName\"\r\n            type=\"text\"\r\n            formControlName=\"firstName\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.last-name' | translate\" for=\"lastName\">\r\n        <input\r\n            id=\"lastName\"\r\n            type=\"text\"\r\n            formControlName=\"lastName\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field *ngIf=\"isNew$ | async\" [label]=\"'settings.password' | translate\" for=\"password\">\r\n        <input id=\"password\" type=\"password\" formControlName=\"password\" />\r\n    </vdr-form-field>\r\n    <vdr-form-field\r\n        *ngIf=\"!(isNew$ | async) && ('UpdateAdministrator' | hasPermission)\"\r\n        [label]=\"'settings.password' | translate\"\r\n        for=\"password\"\r\n        [readOnlyToggle]=\"true\"\r\n    >\r\n        <input id=\"password\" type=\"password\" formControlName=\"password\" />\r\n    </vdr-form-field>\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=\"Administrator\"\r\n            [customFields]=\"customFields\"\r\n            [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        ></vdr-tabbed-custom-fields>\r\n    </section>\r\n    <vdr-custom-detail-component-host\r\n        locationId=\"administrator-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n    <label class=\"clr-control-label\">{{ 'settings.roles' | translate }}</label>\r\n    <ng-select\r\n        [items]=\"allRoles$ | async\"\r\n        [multiple]=\"true\"\r\n        [hideSelected]=\"true\"\r\n        formControlName=\"roles\"\r\n        (change)=\"rolesChanged($event)\"\r\n        bindLabel=\"description\"\r\n    ></ng-select>\r\n\r\n    <ul class=\"nav\" role=\"tablist\">\r\n        <li role=\"presentation\" class=\"nav-item\" *ngFor=\"let channel of getAvailableChannels()\">\r\n            <button\r\n                [id]=\"channel.channelId\"\r\n                (click)=\"selectedChannelId = channel.channelId\"\r\n                class=\"btn btn-link nav-link\"\r\n                [class.active]=\"selectedChannelId === channel.channelId\"\r\n                [attr.aria-selected]=\"selectedChannelId === channel.channelId\"\r\n                type=\"button\"\r\n            >\r\n                {{ channel.channelCode | channelCodeToLabel | translate }}\r\n            </button>\r\n        </li>\r\n    </ul>\r\n    <vdr-permission-grid\r\n        [activePermissions]=\"getPermissionsForSelectedChannel()\"\r\n        [permissionDefinitions]=\"permissionDefinitions\"\r\n        [readonly]=\"true\"\r\n    ></vdr-permission-grid>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-AdminDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class AdministratorListComponent extends BaseListComponent {
-    constructor(dataService, router, route, modalService, notificationService) {
-        super(router, route);
-        this.dataService = dataService;
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        super.setQueryFn((...args) => this.dataService.administrator.getAdministrators(...args), (data) => data.administrators);
-    }
-    deleteAdministrator(administrator) {
-        return this.modalService
-            .dialog({
-            title: marker('catalog.confirm-delete-administrator'),
-            body: `${administrator.firstName} ${administrator.lastName}`,
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap((res) => res ? this.dataService.administrator.deleteAdministrator(administrator.id) : EMPTY))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-delete-success'), {
-                entity: 'Administrator',
-            });
-            this.refresh();
-        }, (err) => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'Administrator',
-            });
-        });
-    }
-}
-AdministratorListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-administrator-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"administrator-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"'CreateAdministrator'\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'admin.create-new-administrator' | 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>{{ 'settings.first-name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.last-name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.email-address' | 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-administrator=\"item\">\r\n        <td class=\"left align-middle\">{{ administrator.firstName }}</td>\r\n        <td class=\"left align-middle\">{{ administrator.lastName }}</td>\r\n        <td class=\"left align-middle\">{{ administrator.emailAddress }}</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]=\"['./', administrator.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td>\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)=\"deleteAdministrator(administrator)\"\r\n                        [disabled]=\"!('DeleteAdministrator' | 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: [""]
-            },] }
-];
-AdministratorListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ModalService },
-    { type: NotificationService }
-];
-
-class ChannelDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.serverConfigService = serverConfigService;
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.currencyCodes = Object.values(CurrencyCode);
-        this.updatePermission = [Permission.SuperAdmin, Permission.UpdateChannel, Permission.CreateChannel];
-        this.customFields = this.getCustomFieldConfig('Channel');
-        this.detailForm = this.formBuilder.group({
-            code: ['', Validators.required],
-            token: ['', Validators.required],
-            pricesIncludeTax: [false],
-            currencyCode: [''],
-            defaultShippingZoneId: ['', Validators.required],
-            defaultLanguageCode: [],
-            defaultTaxZoneId: ['', Validators.required],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.zones$ = this.dataService.settings.getZones().mapSingle(data => data.zones);
-        this.availableLanguageCodes$ = this.serverConfigService.getAvailableLanguages();
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    saveButtonEnabled() {
-        return this.detailForm.dirty && this.detailForm.valid;
-    }
-    create() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        const input = {
-            code: formValue.code,
-            token: formValue.token,
-            defaultLanguageCode: formValue.defaultLanguageCode,
-            pricesIncludeTax: formValue.pricesIncludeTax,
-            currencyCode: formValue.currencyCode,
-            defaultShippingZoneId: formValue.defaultShippingZoneId,
-            defaultTaxZoneId: formValue.defaultTaxZoneId,
-            customFields: formValue.customFields,
-        };
-        this.dataService.settings
-            .createChannel(input)
-            .pipe(mergeMap(({ createChannel }) => this.dataService.auth.currentUser().single$.pipe(map(({ me }) => ({
-            me,
-            createChannel,
-        })))), mergeMap(({ me, createChannel }) => 
-        // tslint:disable-next-line:no-non-null-assertion
-        this.dataService.client.updateUserChannels(me.channels).pipe(map(() => createChannel))))
-            .subscribe(data => {
-            switch (data.__typename) {
-                case 'Channel':
-                    this.notificationService.success(marker('common.notify-create-success'), {
-                        entity: 'Channel',
-                    });
-                    this.detailForm.markAsPristine();
-                    this.changeDetector.markForCheck();
-                    this.router.navigate(['../', data.id], { relativeTo: this.route });
-                    break;
-                case 'LanguageNotAvailableError':
-                    this.notificationService.error(data.message);
-                    break;
-            }
-        });
-    }
-    save() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        this.entity$
-            .pipe(take(1), mergeMap(channel => {
-            const input = {
-                id: channel.id,
-                code: formValue.code,
-                token: formValue.token,
-                pricesIncludeTax: formValue.pricesIncludeTax,
-                currencyCode: formValue.currencyCode,
-                defaultShippingZoneId: formValue.defaultShippingZoneId,
-                defaultLanguageCode: formValue.defaultLanguageCode,
-                defaultTaxZoneId: formValue.defaultTaxZoneId,
-                customFields: formValue.customFields,
-            };
-            return this.dataService.settings.updateChannel(input);
-        }))
-            .subscribe(({ updateChannel }) => {
-            switch (updateChannel.__typename) {
-                case 'Channel':
-                    this.notificationService.success(marker('common.notify-update-success'), {
-                        entity: 'Channel',
-                    });
-                    this.detailForm.markAsPristine();
-                    this.changeDetector.markForCheck();
-                    break;
-                case 'LanguageNotAvailableError':
-                    this.notificationService.error(updateChannel.message);
-            }
-        });
-    }
-    /**
-     * Update the form values when the entity changes.
-     */
-    setFormValues(entity, languageCode) {
-        this.detailForm.patchValue({
-            code: entity.code,
-            token: entity.token || this.generateToken(),
-            pricesIncludeTax: entity.pricesIncludeTax,
-            currencyCode: entity.currencyCode,
-            defaultShippingZoneId: entity.defaultShippingZone ? entity.defaultShippingZone.id : '',
-            defaultLanguageCode: entity.defaultLanguageCode,
-            defaultTaxZoneId: entity.defaultTaxZone ? entity.defaultTaxZone.id : '',
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get(['customFields']), entity);
-        }
-        if (entity.code === DEFAULT_CHANNEL_CODE) {
-            const codeControl = this.detailForm.get('code');
-            if (codeControl) {
-                codeControl.disable();
-            }
-        }
-    }
-    generateToken() {
-        const randomString = () => Math.random().toString(36).substr(3, 10);
-        return `${randomString()}${randomString()}`;
-    }
-}
-ChannelDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-channel-detail',
-                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=\"channel-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]=\"!saveButtonEnabled()\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                *vdrIfPermissions=\"['SuperAdmin', 'UpdateChannel']\"\r\n                [disabled]=\"!saveButtonEnabled()\"\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\">\r\n    <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\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    <vdr-form-field [label]=\"'settings.channel-token' | translate\" for=\"token\">\r\n        <input\r\n            id=\"token\"\r\n            type=\"text\"\r\n            [readonly]=\"!(updatePermission | hasPermission)\"\r\n            formControlName=\"token\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.currency' | translate\" for=\"defaultTaxZoneId\">\r\n        <select\r\n            clrSelect\r\n            name=\"currencyCode\"\r\n            formControlName=\"currencyCode\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option *ngFor=\"let code of currencyCodes\" [value]=\"code\">{{ code | localeCurrencyName }}</option>\r\n        </select>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'common.default-language' | translate\" for=\"defaultLanguage\">\r\n        <select\r\n            clrSelect\r\n            name=\"defaultLanguageCode\"\r\n            formControlName=\"defaultLanguageCode\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option *ngFor=\"let languageCode of availableLanguageCodes$ | async\" [value]=\"languageCode\">\r\n                {{ languageCode | localeLanguageName }} ({{ languageCode | uppercase }})\r\n            </option>\r\n        </select>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.prices-include-tax' | translate\" for=\"pricesIncludeTax\">\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                id=\"pricesIncludeTax\"\r\n                formControlName=\"pricesIncludeTax\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.default-tax-zone' | translate\" for=\"defaultTaxZoneId\">\r\n        <select\r\n            clrSelect\r\n            name=\"defaultTaxZoneId\"\r\n            formControlName=\"defaultTaxZoneId\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option selected value style=\"display: none\"></option>\r\n            <option *ngFor=\"let zone of zones$ | async\" [value]=\"zone.id\">{{ zone.name }}</option>\r\n        </select>\r\n    </vdr-form-field>\r\n    <clr-alert\r\n        *ngIf=\"detailForm.value.code && !detailForm.value.defaultTaxZoneId\"\r\n        clrAlertType=\"danger\"\r\n        [clrAlertClosable]=\"false\"\r\n    >\r\n        <clr-alert-item>\r\n            <span class=\"alert-text\">\r\n                {{ 'error.no-default-tax-zone-set' | translate }}\r\n            </span>\r\n        </clr-alert-item>\r\n    </clr-alert>\r\n\r\n    <vdr-form-field [label]=\"'settings.default-shipping-zone' | translate\" for=\"defaultShippingZoneId\">\r\n        <select\r\n            clrSelect\r\n            name=\"defaultShippingZoneId\"\r\n            formControlName=\"defaultShippingZoneId\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option selected value style=\"display: none\"></option>\r\n            <option *ngFor=\"let zone of zones$ | async\" [value]=\"zone.id\">{{ zone.name }}</option>\r\n        </select>\r\n    </vdr-form-field>\r\n    <clr-alert\r\n        *ngIf=\"detailForm.value.code && !detailForm.value.defaultShippingZoneId\"\r\n        clrAlertType=\"warning\"\r\n        [clrAlertClosable]=\"false\"\r\n    >\r\n        <clr-alert-item>\r\n            <span class=\"alert-text\">\r\n                {{ 'error.no-default-shipping-zone-set' | translate }}\r\n            </span>\r\n        </clr-alert-item>\r\n    </clr-alert>\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=\"Channel\"\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=\"channel-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["clr-alert{max-width:30rem;margin-bottom:12px}\n"]
-            },] }
-];
-ChannelDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class ChannelListComponent {
-    constructor(dataService, modalService, notificationService) {
-        this.dataService = dataService;
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        this.refresh$ = new Subject();
-        this.channels$ = this.refresh$.pipe(startWith(1), switchMap(() => this.dataService.settings.getChannels().mapStream(data => data.channels)));
-    }
-    isDefaultChannel(channelCode) {
-        return channelCode === DEFAULT_CHANNEL_CODE;
-    }
-    deleteChannel(id) {
-        this.modalService
-            .dialog({
-            title: marker('catalog.confirm-delete-channel'),
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(response => (response ? this.dataService.settings.deleteChannel(id) : EMPTY)), mergeMap(() => this.dataService.auth.currentUser().single$), 
-        // tslint:disable-next-line:no-non-null-assertion
-        mergeMap(data => this.dataService.client.updateUserChannels(data.me.channels)))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-delete-success'), {
-                entity: 'Channel',
-            });
-            this.refresh$.next(1);
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'Channel',
-            });
-        });
-    }
-}
-ChannelListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-channel-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"channel-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"['SuperAdmin', 'CreateChannel']\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-channel' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table [items]=\"channels$ | async\">\r\n    <vdr-dt-column>{{ 'common.code' | 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-channel=\"item\">\r\n        <td class=\"left align-middle\">\r\n            <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n            {{ channel.code | channelCodeToLabel | translate }}\r\n        </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]=\"['./', channel.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger [disabled]=\"isDefaultChannel(channel.code)\">\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)=\"deleteChannel(channel.id)\"\r\n                        [disabled]=\"!(['SuperAdmin', 'DeleteChannel'] | 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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-ChannelListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: ModalService },
-    { type: NotificationService }
-];
-
-class CountryDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdateCountry];
-        this.customFields = this.getCustomFieldConfig('Country');
-        this.detailForm = this.formBuilder.group({
-            code: ['', Validators.required],
-            name: ['', Validators.required],
-            enabled: [true],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.country$ = this.entity$;
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    create() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        combineLatest(this.country$, this.languageCode$)
-            .pipe(take(1), mergeMap(([country, languageCode]) => {
-            const formValue = this.detailForm.value;
-            const input = createUpdatedTranslatable({
-                translatable: country,
-                updatedFields: formValue,
-                customFieldConfig: this.customFields,
-                languageCode,
-                defaultTranslation: {
-                    name: formValue.name,
-                    languageCode,
-                },
-            });
-            return this.dataService.settings.createCountry(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'Country',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createCountry.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'Country',
-            });
-        });
-    }
-    save() {
-        combineLatest(this.country$, this.languageCode$)
-            .pipe(take(1), mergeMap(([country, languageCode]) => {
-            const formValue = this.detailForm.value;
-            const input = createUpdatedTranslatable({
-                translatable: country,
-                updatedFields: formValue,
-                customFieldConfig: this.customFields,
-                languageCode,
-                defaultTranslation: {
-                    name: formValue.name,
-                    languageCode,
-                },
-            });
-            return this.dataService.settings.updateCountry(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'Country',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'Country',
-            });
-        });
-    }
-    setFormValues(country, languageCode) {
-        const currentTranslation = findTranslation(country, languageCode);
-        this.detailForm.patchValue({
-            code: country.code,
-            name: currentTranslation ? currentTranslation.name : '',
-            enabled: country.enabled,
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get(['customFields']), country, currentTranslation);
-        }
-    }
-}
-CountryDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-country-detail',
-                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    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"country-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                class=\"btn btn-primary\"\r\n                *vdrIfPermissions=\"updatePermission\"\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\">\r\n    <vdr-form-field [label]=\"'common.code' | translate\" for=\"code\">\r\n        <input\r\n            id=\"code\"\r\n            type=\"text\"\r\n            formControlName=\"code\"\r\n            [readonly]=\"!(updatePermission | hasPermission)\"\r\n        />\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        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'common.enabled' | translate\" for=\"enabled\">\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                id=\"enabled\"\r\n                formControlName=\"enabled\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\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=\"Country\"\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=\"country-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-CountryDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class CountryListComponent {
-    constructor(dataService, notificationService, modalService, serverConfigService) {
-        this.dataService = dataService;
-        this.notificationService = notificationService;
-        this.modalService = modalService;
-        this.serverConfigService = serverConfigService;
-        this.searchTerm = new FormControl('');
-        this.countries = [];
-        this.destroy$ = new Subject();
-        this.refresh$ = new Subject();
-    }
-    ngOnInit() {
-        this.contentLanguage$ = this.dataService.client
-            .uiState()
-            .mapStream(({ uiState }) => uiState.contentLanguage);
-        const countries$ = combineLatest(this.contentLanguage$, this.searchTerm.valueChanges.pipe(startWith(null))).pipe(map(([__, term]) => term), switchMap(term => this.dataService.settings.getCountries(999, 0, term).single$), tap(data => {
-            this.countries = data.countries.items;
-        }), map(data => data.countries.items));
-        this.zones$ = this.dataService.settings.getZones().mapStream(data => data.zones);
-        this.countriesWithZones$ = combineLatest(countries$, this.zones$).pipe(map(([countries, zones]) => {
-            return countries.map(country => (Object.assign(Object.assign({}, country), { zones: zones.filter(z => !!z.members.find(c => c.id === country.id)) })));
-        }));
-        this.availableLanguages$ = this.serverConfigService.getAvailableLanguages();
-    }
-    ngOnDestroy() {
-        this.destroy$.next(undefined);
-        this.destroy$.complete();
-    }
-    setLanguage(code) {
-        this.dataService.client.setContentLanguage(code).subscribe();
-    }
-    deleteCountry(countryId) {
-        this.modalService
-            .dialog({
-            title: marker('catalog.confirm-delete-country'),
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(response => response ? this.dataService.settings.deleteCountry(countryId) : EMPTY))
-            .subscribe(response => {
-            if (response.deleteCountry.result === DeletionResult.DELETED) {
-                this.notificationService.success(marker('common.notify-delete-success'), {
-                    entity: 'Country',
-                });
-                this.dataService.settings.getCountries(999, 0).single$.subscribe();
-            }
-            else {
-                this.notificationService.error(response.deleteCountry.message || '');
-            }
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'Country',
-            });
-        });
-    }
-    isZone(input) {
-        return input.hasOwnProperty('id');
-    }
-}
-CountryListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-country-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <input\r\n            type=\"text\"\r\n            name=\"searchTerm\"\r\n            [formControl]=\"searchTerm\"\r\n            [placeholder]=\"'settings.search-country-by-name' | translate\"\r\n            class=\"search-input\"\r\n        />\r\n        <vdr-language-selector\r\n            [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n            [currentLanguageCode]=\"contentLanguage$ | async\"\r\n            (languageCodeChange)=\"setLanguage($event)\"\r\n        ></vdr-language-selector>\r\n    </vdr-ab-left>\r\n\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"country-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"['CreateSettings', 'CreateCountry']\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-country' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"countriesWithZones$ | async\"\r\n>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column [expand]=\"true\">{{ 'common.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.zone' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.enabled' | 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-country=\"item\">\r\n        <td class=\"left align-middle\">{{ country.code }}</td>\r\n        <td class=\"left align-middle\">{{ country.name }}</td>\r\n        <td class=\"left align-middle\">\r\n            <a [routerLink]=\"['/settings', 'zones', { contents: zone.id }]\" *ngFor=\"let zone of country.zones\">\r\n                <vdr-chip [colorFrom]=\"zone.name\">{{ zone.name }}</vdr-chip>\r\n            </a>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <clr-icon\r\n                [class.is-success]=\"country.enabled\"\r\n                [attr.shape]=\"country.enabled ? 'check' : 'times'\"\r\n            ></clr-icon>\r\n        </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]=\"['./', country.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right 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)=\"deleteCountry(country.id)\"\r\n                        vdrDropdownItem\r\n                        [disabled]=\"!(['DeleteSettings', 'DeleteCountry'] | hasPermission)\"\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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".search-input{margin-top:6px;min-width:300px}\n"]
-            },] }
-];
-CountryListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: NotificationService },
-    { type: ModalService },
-    { type: ServerConfigService }
-];
-
-class GlobalSettingsComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.languageCodes = Object.values(LanguageCode);
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdateGlobalSettings];
-        this.customFields = this.getCustomFieldConfig('GlobalSettings');
-        this.detailForm = this.formBuilder.group({
-            availableLanguages: [''],
-            trackInventory: false,
-            outOfStockThreshold: [0, Validators.required],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.dataService.client.userStatus().single$.subscribe(({ userStatus }) => {
-            if (!userStatus.permissions.includes(Permission.UpdateSettings)) {
-                const languagesSelect = this.detailForm.get('availableLanguages');
-                if (languagesSelect) {
-                    languagesSelect.disable();
-                }
-            }
-        });
-    }
-    save() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        this.dataService.settings
-            .updateGlobalSettings(this.detailForm.value)
-            .pipe(tap(({ updateGlobalSettings }) => {
-            switch (updateGlobalSettings.__typename) {
-                case 'GlobalSettings':
-                    this.detailForm.markAsPristine();
-                    this.changeDetector.markForCheck();
-                    this.notificationService.success(marker('common.notify-update-success'), {
-                        entity: 'Settings',
-                    });
-                    break;
-                case 'ChannelDefaultLanguageError':
-                    this.notificationService.error(updateGlobalSettings.message);
-            }
-        }), switchMap(() => this.serverConfigService.refreshGlobalSettings()), withLatestFrom(this.dataService.client.uiState().single$))
-            .subscribe(([{ globalSettings }, { uiState }]) => {
-            const availableLangs = globalSettings.availableLanguages;
-            if (availableLangs.length && !availableLangs.includes(uiState.contentLanguage)) {
-                this.dataService.client.setContentLanguage(availableLangs[0]).subscribe();
-            }
-        });
-    }
-    setFormValues(entity, languageCode) {
-        this.detailForm.patchValue({
-            availableLanguages: entity.availableLanguages,
-            trackInventory: entity.trackInventory,
-            outOfStockThreshold: entity.outOfStockThreshold,
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get('customFields'), entity);
-        }
-    }
-}
-GlobalSettingsComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-global-settings',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"global-settings-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            (click)=\"save()\"\r\n            *vdrIfPermissions=\"updatePermission\"\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\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n    <vdr-form-field [label]=\"'common.available-languages' | translate\" for=\"availableLanguages\">\r\n        <ng-select\r\n            [items]=\"languageCodes\"\r\n            [addTag]=\"false\"\r\n            [hideSelected]=\"true\"\r\n            multiple=\"true\"\r\n            appendTo=\"body\"\r\n            formControlName=\"availableLanguages\"\r\n        >\r\n            <ng-template ng-label-tmp let-item=\"item\" let-clear=\"clear\">\r\n                <span class=\"ng-value-icon left\" (click)=\"clear.call(null, item)\" aria-hidden=\"true\">\r\n                    \u00D7\r\n                </span>\r\n                <span class=\"ng-value-label\">{{ item | localeLanguageName }} ({{ item }})</span>\r\n            </ng-template>\r\n            <ng-template ng-option-tmp let-item=\"item\">\r\n                {{ item | localeLanguageName }} ({{ item }})\r\n            </ng-template>\r\n        </ng-select>\r\n    </vdr-form-field>\r\n    <vdr-form-field\r\n        [label]=\"'settings.global-out-of-stock-threshold' | translate\"\r\n        for=\"outOfStockThreshold\"\r\n        [tooltip]=\"'settings.global-out-of-stock-threshold-tooltip' | translate\"\r\n    >\r\n        <input\r\n            id=\"outOfStockThreshold\"\r\n            type=\"number\"\r\n            formControlName=\"outOfStockThreshold\"\r\n            [readonly]=\"!(updatePermission | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field\r\n        [label]=\"'settings.track-inventory-default' | translate\"\r\n        for=\"enabled\"\r\n        [tooltip]=\"'catalog.track-inventory-tooltip' | translate\"\r\n    >\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                name=\"enabled\"\r\n                formControlName=\"trackInventory\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\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=\"GlobalSettings\"\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=\"global-settings-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["::ng-deep ng-select .ng-value>span{margin:0!important}::ng-deep ng-select .ng-arrow-wrapper .ng-arrow{margin:0!important}::ng-deep ng-select .ng-select-container>span{margin:0!important}\n"]
-            },] }
-];
-GlobalSettingsComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class PaymentMethodDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.checkers = [];
-        this.handlers = [];
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdatePaymentMethod];
-        this.customFields = this.getCustomFieldConfig('PaymentMethod');
-        this.detailForm = this.formBuilder.group({
-            code: ['', Validators.required],
-            name: ['', Validators.required],
-            description: '',
-            enabled: [true, Validators.required],
-            checker: {},
-            handler: {},
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        combineLatest([
-            this.dataService.settings.getPaymentMethodOperations().single$,
-            this.entity$.pipe(take(1)),
-        ]).subscribe(([data, entity]) => {
-            this.checkers = data.paymentMethodEligibilityCheckers;
-            this.handlers = data.paymentMethodHandlers;
-            this.changeDetector.markForCheck();
-            this.selectedCheckerDefinition = data.paymentMethodEligibilityCheckers.find(c => c.code === (entity.checker && entity.checker.code));
-            this.selectedHandlerDefinition = data.paymentMethodHandlers.find(c => c.code === (entity.handler && entity.handler.code));
-        });
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    updateCode(currentCode, nameValue) {
-        if (!currentCode) {
-            const codeControl = this.detailForm.get(['code']);
-            if (codeControl && codeControl.pristine) {
-                codeControl.setValue(normalizeString(nameValue, '-'));
-            }
-        }
-    }
-    configArgsIsPopulated() {
-        const configArgsGroup = this.detailForm.get('configArgs');
-        if (!configArgsGroup) {
-            return false;
-        }
-        return 0 < Object.keys(configArgsGroup.controls).length;
-    }
-    selectChecker(checker) {
-        this.selectedCheckerDefinition = checker;
-        this.selectedChecker = configurableDefinitionToInstance(checker);
-        const formControl = this.detailForm.get('checker');
-        if (formControl) {
-            formControl.clearValidators();
-            formControl.updateValueAndValidity({ onlySelf: true });
-            formControl.patchValue(this.selectedChecker);
-        }
-        this.detailForm.markAsDirty();
-    }
-    selectHandler(handler) {
-        this.selectedHandlerDefinition = handler;
-        this.selectedHandler = configurableDefinitionToInstance(handler);
-        const formControl = this.detailForm.get('handler');
-        if (formControl) {
-            formControl.clearValidators();
-            formControl.updateValueAndValidity({ onlySelf: true });
-            formControl.patchValue(this.selectedHandler);
-        }
-        this.detailForm.markAsDirty();
-    }
-    removeChecker() {
-        this.selectedChecker = null;
-        this.detailForm.markAsDirty();
-    }
-    removeHandler() {
-        this.selectedHandler = null;
-        this.detailForm.markAsDirty();
-    }
-    create() {
-        const selectedChecker = this.selectedChecker;
-        const selectedHandler = this.selectedHandler;
-        if (!selectedHandler) {
-            return;
-        }
-        this.entity$
-            .pipe(take(1), mergeMap(({ id }) => {
-            const formValue = this.detailForm.value;
-            const input = {
-                name: formValue.name,
-                code: formValue.code,
-                description: formValue.description,
-                enabled: formValue.enabled,
-                checker: selectedChecker
-                    ? toConfigurableOperationInput(selectedChecker, formValue.checker)
-                    : null,
-                handler: toConfigurableOperationInput(selectedHandler, formValue.handler),
-                customFields: formValue.customFields,
-            };
-            return this.dataService.settings.createPaymentMethod(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'PaymentMethod',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createPaymentMethod.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'PaymentMethod',
-            });
-        });
-    }
-    save() {
-        const selectedChecker = this.selectedChecker;
-        const selectedHandler = this.selectedHandler;
-        if (!selectedHandler) {
-            return;
-        }
-        this.entity$
-            .pipe(take(1), mergeMap(({ id }) => {
-            const formValue = this.detailForm.value;
-            const input = {
-                id,
-                name: formValue.name,
-                code: formValue.code,
-                description: formValue.description,
-                enabled: formValue.enabled,
-                checker: selectedChecker
-                    ? toConfigurableOperationInput(selectedChecker, formValue.checker)
-                    : null,
-                handler: toConfigurableOperationInput(selectedHandler, formValue.handler),
-                customFields: formValue.customFields,
-            };
-            return this.dataService.settings.updatePaymentMethod(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'PaymentMethod',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'PaymentMethod',
-            });
-        });
-    }
-    setFormValues(paymentMethod) {
-        this.detailForm.patchValue({
-            name: paymentMethod.name,
-            code: paymentMethod.code,
-            description: paymentMethod.description,
-            enabled: paymentMethod.enabled,
-            checker: paymentMethod.checker || {},
-            handler: paymentMethod.handler || {},
-        });
-        if (!this.selectedChecker) {
-            this.selectedChecker = paymentMethod.checker && {
-                code: paymentMethod.checker.code,
-                args: paymentMethod.checker.args.map(a => (Object.assign(Object.assign({}, a), { value: getConfigArgValue(a.value) }))),
-            };
-        }
-        if (!this.selectedHandler) {
-            this.selectedHandler = paymentMethod.handler && {
-                code: paymentMethod.handler.code,
-                args: paymentMethod.handler.args.map(a => (Object.assign(Object.assign({}, a), { value: getConfigArgValue(a.value) }))),
-            };
-        }
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get('customFields'), paymentMethod);
-        }
-    }
-}
-PaymentMethodDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-payment-method-detail',
-                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=\"payment-method-detail\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *ngIf=\"isNew$ | async; else updateButton\"\r\n            [disabled]=\"detailForm.pristine || detailForm.invalid\"\r\n            (click)=\"create()\"\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.pristine || detailForm.invalid || !selectedHandler\"\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 paymentMethod\">\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(paymentMethod.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            formControlName=\"code\"\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    <vdr-form-field [label]=\"'common.enabled' | translate\" for=\"description\">\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                id=\"enabled\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                formControlName=\"enabled\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\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=\"PaymentMethod\"\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\r\n    <vdr-custom-detail-component-host\r\n        locationId=\"payment-method-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n\r\n    <div class=\"clr-row mt4\">\r\n        <div class=\"clr-col\">\r\n            <label class=\"clr-control-label\">{{ 'settings.payment-eligibility-checker' | translate }}</label>\r\n            <vdr-configurable-input\r\n                *ngIf=\"selectedChecker && selectedCheckerDefinition\"\r\n                [operation]=\"selectedChecker\"\r\n                [operationDefinition]=\"selectedCheckerDefinition\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                (remove)=\"removeChecker()\"\r\n                formControlName=\"checker\"\r\n            ></vdr-configurable-input>\r\n            <div *ngIf=\"!selectedChecker || !selectedCheckerDefinition\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'common.select' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let checker of checkers\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"selectChecker(checker)\"\r\n                        >\r\n                            {{ checker.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            <label class=\"clr-control-label\">{{ 'settings.payment-handler' | translate }}</label>\r\n            <vdr-configurable-input\r\n                *ngIf=\"selectedHandler && selectedHandlerDefinition\"\r\n                [operation]=\"selectedHandler\"\r\n                [operationDefinition]=\"selectedHandlerDefinition\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                (remove)=\"removeHandler()\"\r\n                formControlName=\"handler\"\r\n            ></vdr-configurable-input>\r\n            <div *ngIf=\"!selectedHandler || !selectedHandlerDefinition\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'common.select' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let handler of handlers\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"selectHandler(handler)\"\r\n                        >\r\n                            {{ handler.description }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-PaymentMethodDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class PaymentMethodListComponent extends BaseListComponent {
-    constructor(dataService, router, route, modalService, notificationService) {
-        super(router, route);
-        this.dataService = dataService;
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        super.setQueryFn((...args) => this.dataService.settings.getPaymentMethods(...args).refetchOnChannelChange(), data => data.paymentMethods);
-    }
-    deletePaymentMethod(paymentMethodId) {
-        this.showModalAndDelete(paymentMethodId)
-            .pipe(switchMap(response => {
-            if (response.result === DeletionResult.DELETED) {
-                return [true];
-            }
-            else {
-                return this.showModalAndDelete(paymentMethodId, response.message || '').pipe(map(r => r.result === DeletionResult.DELETED));
-            }
-        }), 
-        // Refresh the cached facets to reflect the changes
-        switchMap(() => this.dataService.settings.getPaymentMethods(100).single$))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-delete-success'), {
-                entity: 'PaymentMethod',
-            });
-            this.refresh();
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'PaymentMethod',
-            });
-        });
-    }
-    showModalAndDelete(paymentMethodId, message) {
-        return this.modalService
-            .dialog({
-            title: marker('settings.confirm-delete-payment-method'),
-            body: message,
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(res => res ? this.dataService.settings.deletePaymentMethod(paymentMethodId, !!message) : EMPTY), map(res => res.deletePaymentMethod));
-    }
-}
-PaymentMethodListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-payment-method-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"payment-method-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"['CreateSettings', 'CreatePaymentMethod']\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-payment-method' | 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.enabled' | 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-paymentMethod=\"item\">\r\n        <td class=\"left align-middle\">{{ paymentMethod.code }}</td>\r\n        <td class=\"left align-middle\">{{ paymentMethod.enabled }}</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]=\"['./', paymentMethod.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right 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)=\"deletePaymentMethod(paymentMethod.id)\"\r\n                        [disabled]=\"!(['DeleteSettings', 'DeletePaymentMethod'] | 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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-PaymentMethodListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ModalService },
-    { type: NotificationService }
-];
-
-/**
- * A table showing and allowing the setting of all possible CRUD permissions.
- */
-class PermissionGridComponent {
-    constructor() {
-        this.readonly = false;
-        this.permissionChange = new EventEmitter();
-    }
-    ngOnInit() {
-        this.buildGrid();
-    }
-    setPermission(permission, value) {
-        if (!this.readonly) {
-            this.permissionChange.emit({ permission, value });
-        }
-    }
-    toggleAll(defs) {
-        const value = defs.some(d => !this.activePermissions.includes(d.name));
-        for (const def of defs) {
-            this.permissionChange.emit({ permission: def.name, value });
-        }
-    }
-    buildGrid() {
-        var _a;
-        const crudGroups = new Map();
-        const nonCrud = [];
-        const crudRe = /^(Create|Read|Update|Delete)([a-zA-Z]+)$/;
-        for (const def of this.permissionDefinitions) {
-            const isCrud = crudRe.test(def.name);
-            if (isCrud) {
-                const groupName = (_a = def.name.match(crudRe)) === null || _a === void 0 ? void 0 : _a[2];
-                if (groupName) {
-                    const existing = crudGroups.get(groupName);
-                    if (existing) {
-                        existing.push(def);
-                    }
-                    else {
-                        crudGroups.set(groupName, [def]);
-                    }
-                }
-            }
-            else if (def.assignable) {
-                nonCrud.push(def);
-            }
-        }
-        this.gridData = [
-            ...nonCrud.map(d => ({
-                label: d.name,
-                description: d.description,
-                permissions: [d],
-            })),
-            ...Array.from(crudGroups.entries()).map(([label, defs]) => {
-                return {
-                    label,
-                    description: this.extractCrudDescription(defs[0]),
-                    permissions: defs,
-                };
-            }),
-        ];
-    }
-    extractCrudDescription(def) {
-        return def.description.replace(/Grants permission to [\w]+/, 'Grants permissions on');
-    }
-}
-PermissionGridComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-permission-grid',
-                template: "<table class=\"table\">\r\n    <tbody>\r\n        <tr *ngFor=\"let section of gridData\">\r\n            <td class=\"permission-group left\">\r\n                <div><strong>{{ section.label | translate }}</strong></div>\r\n                <small>{{ section.description | translate }}</small><br>\r\n                <button *ngIf=\"1 < section.permissions.length && !readonly\" class=\"btn btn-sm btn-link\" (click)=\"toggleAll(section.permissions)\">\r\n                    {{ 'common.toggle-all' | translate }}\r\n                </button>\r\n            </td>\r\n            <td *ngFor=\"let permission of section.permissions\" [attr.colspan]=\"section.permissions.length === 1 ? 4 : 1\">\r\n                <vdr-select-toggle\r\n                    size=\"small\"\r\n                    [title]=\"permission.description\"\r\n                    [label]=\"permission.name\"\r\n                    [disabled]=\"readonly\"\r\n                    [selected]=\"activePermissions?.includes(permission.name)\"\r\n                    (selectedChange)=\"setPermission(permission.name, $event)\"\r\n                ></vdr-select-toggle>\r\n            </td>\r\n        </tr>\r\n    </tbody>\r\n</table>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["td.permission-group{max-width:300px;background-color:var(--color-component-bg-200)}\n"]
-            },] }
-];
-PermissionGridComponent.propDecorators = {
-    permissionDefinitions: [{ type: Input }],
-    activePermissions: [{ type: Input }],
-    readonly: [{ type: Input }],
-    permissionChange: [{ type: Output }]
-};
-
-class ProfileComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.customFields = this.getCustomFieldConfig('Administrator');
-        this.detailForm = this.formBuilder.group({
-            emailAddress: ['', Validators.required],
-            firstName: ['', Validators.required],
-            lastName: ['', Validators.required],
-            password: [''],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    save() {
-        this.entity$
-            .pipe(take(1), mergeMap(({ id }) => {
-            const formValue = this.detailForm.value;
-            const administrator = {
-                emailAddress: formValue.emailAddress,
-                firstName: formValue.firstName,
-                lastName: formValue.lastName,
-                password: formValue.password,
-                customFields: formValue.customFields,
-            };
-            return this.dataService.administrator.updateActiveAdministrator(administrator);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'Administrator',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'Administrator',
-            });
-        });
-    }
-    setFormValues(administrator, languageCode) {
-        this.detailForm.patchValue({
-            emailAddress: administrator.emailAddress,
-            firstName: administrator.firstName,
-            lastName: administrator.lastName,
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get('customFields'), administrator);
-        }
-    }
-}
-ProfileComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-profile',
-                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    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"administrator-detail\"></vdr-action-bar-items>\r\n        <button\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\r\n<form class=\"form\" [formGroup]=\"detailForm\">\r\n    <vdr-form-field [label]=\"'settings.email-address' | translate\" for=\"emailAddress\">\r\n        <input id=\"emailAddress\" type=\"text\" formControlName=\"emailAddress\" />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.first-name' | translate\" for=\"firstName\">\r\n        <input id=\"firstName\" type=\"text\" formControlName=\"firstName\" />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.last-name' | translate\" for=\"lastName\">\r\n        <input id=\"lastName\" type=\"text\" formControlName=\"lastName\" />\r\n    </vdr-form-field>\r\n    <vdr-form-field *ngIf=\"isNew$ | async\" [label]=\"'settings.password' | translate\" for=\"password\">\r\n        <input id=\"password\" type=\"password\" formControlName=\"password\" />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.password' | translate\" for=\"password\" [readOnlyToggle]=\"true\">\r\n        <input id=\"password\" type=\"password\" formControlName=\"password\" />\r\n    </vdr-form-field>\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=\"Administrator\"\r\n            [customFields]=\"customFields\"\r\n            [customFieldsFormGroup]=\"detailForm.get('customFields')\"\r\n        ></vdr-tabbed-custom-fields>\r\n    </section>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-ProfileComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class RoleDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.detailForm = this.formBuilder.group({
-            code: ['', Validators.required],
-            description: ['', Validators.required],
-            channelIds: [],
-            permissions: [],
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.role$ = this.entity$;
-        this.permissionDefinitions = this.serverConfigService.getPermissionDefinitions();
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    updateCode(nameValue) {
-        const codeControl = this.detailForm.get(['code']);
-        if (codeControl && codeControl.pristine) {
-            codeControl.setValue(normalizeString(nameValue, '-'));
-        }
-    }
-    setPermission(change) {
-        const permissionsControl = this.detailForm.get('permissions');
-        if (permissionsControl) {
-            const currentPermissions = permissionsControl.value;
-            const newValue = change.value === true
-                ? unique([...currentPermissions, change.permission])
-                : currentPermissions.filter(p => p !== change.permission);
-            permissionsControl.setValue(newValue);
-            permissionsControl.markAsDirty();
-        }
-    }
-    create() {
-        const formValue = this.detailForm.value;
-        const role = formValue;
-        this.dataService.administrator.createRole(role).subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), { entity: 'Role' });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createRole.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'Role',
-            });
-        });
-    }
-    save() {
-        this.role$
-            .pipe(take(1), mergeMap(({ id }) => {
-            const formValue = this.detailForm.value;
-            const role = Object.assign({ id }, formValue);
-            return this.dataService.administrator.updateRole(role);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), { entity: 'Role' });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'Role',
-            });
-        });
-    }
-    setFormValues(role, languageCode) {
-        this.detailForm.patchValue({
-            description: role.description,
-            code: role.code,
-            channelIds: role.channels.map(c => c.id),
-            permissions: role.permissions,
-        });
-        // This was required to get the channel selector component to
-        // correctly display its contents. A while spent debugging the root
-        // cause did not yield a solution, therefore this next line.
-        this.changeDetector.detectChanges();
-    }
-}
-RoleDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-role-detail',
-                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    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"role-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                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                *vdrIfPermissions=\"'UpdateAdministrator'\"\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\">\r\n    <vdr-form-field [label]=\"'common.description' | translate\" for=\"description\">\r\n        <input\r\n            id=\"description\"\r\n            type=\"text\"\r\n            formControlName=\"description\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n            (input)=\"updateCode($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]=\"'UpdateAdministrator' | hasPermission\"\r\n    >\r\n        <input\r\n            id=\"code\"\r\n            type=\"text\"\r\n            formControlName=\"code\"\r\n            [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.channel' | translate\">\r\n        <vdr-channel-assignment-control\r\n            formControlName=\"channelIds\"\r\n            [vdrDisabled]=\"!('UpdateAdministrator' | hasPermission)\"\r\n        ></vdr-channel-assignment-control>\r\n    </vdr-form-field>\r\n    <label>{{ 'settings.permissions' | translate }}</label>\r\n    <vdr-permission-grid\r\n        [permissionDefinitions]=\"permissionDefinitions\"\r\n        [activePermissions]=\"detailForm.get('permissions')?.value\"\r\n        (permissionChange)=\"setPermission($event)\"\r\n        [readonly]=\"!('UpdateAdministrator' | hasPermission)\"\r\n    ></vdr-permission-grid>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-RoleDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class RoleListComponent extends BaseListComponent {
-    constructor(modalService, notificationService, dataService, router, route) {
-        super(router, route);
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        this.dataService = dataService;
-        this.initialLimit = 3;
-        this.displayLimit = {};
-        super.setQueryFn((...args) => this.dataService.administrator.getRoles(...args), data => data.roles);
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        this.visibleRoles$ = this.items$.pipe(map(roles => roles.filter(role => role.code !== CUSTOMER_ROLE_CODE)));
-    }
-    toggleDisplayLimit(role) {
-        if (this.displayLimit[role.id] === role.permissions.length) {
-            this.displayLimit[role.id] = this.initialLimit;
-        }
-        else {
-            this.displayLimit[role.id] = role.permissions.length;
-        }
-    }
-    isDefaultRole(role) {
-        return role.code === SUPER_ADMIN_ROLE_CODE || role.code === CUSTOMER_ROLE_CODE;
-    }
-    deleteRole(id) {
-        this.modalService
-            .dialog({
-            title: marker('settings.confirm-delete-role'),
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(response => (response ? this.dataService.administrator.deleteRole(id) : EMPTY)))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-delete-success'), {
-                entity: 'Role',
-            });
-            this.refresh();
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'Role',
-            });
-        });
-    }
-}
-RoleListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-role-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"role-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"'CreateAdministrator'\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-role' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table\r\n    [items]=\"visibleRoles$ | 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.description' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'common.code' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.channel' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.permissions' | 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-role=\"item\">\r\n        <td class=\"left align-middle\">{{ role.description }}</td>\r\n        <td class=\"left align-middle\"><span *ngIf=\"!isDefaultRole(role)\">{{ role.code }}</span></td>\r\n        <td class=\"left align-middle\">\r\n            <ng-container *ngIf=\"!isDefaultRole(role)\">\r\n                <vdr-chip *ngFor=\"let channel of role.channels\">\r\n                    <vdr-channel-badge [channelCode]=\"channel.code\"></vdr-channel-badge>\r\n                    {{ channel.code | channelCodeToLabel | translate }}\r\n                </vdr-chip>\r\n            </ng-container>\r\n        </td>\r\n        <td class=\"left align-middle\">\r\n            <ng-container *ngIf=\"!isDefaultRole(role); else defaultRole\">\r\n                <vdr-chip *ngFor=\"let permission of role.permissions |  slice: 0:displayLimit[role.id] || 3\">{{ permission }}</vdr-chip>\r\n                <button\r\n                    class=\"btn btn-sm btn-secondary btn-icon\"\r\n                    *ngIf=\"role.permissions.length > initialLimit\"\r\n                    (click)=\"toggleDisplayLimit(role)\"\r\n                >\r\n                    <ng-container *ngIf=\"(displayLimit[role.id] || 0) < role.permissions.length; else collapse\">\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ role.permissions.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            </ng-container>\r\n            <ng-template #defaultRole>\r\n                <span class=\"default-role-label\">{{ 'settings.default-role-label' | translate }}</span>\r\n            </ng-template>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-table-row-action\r\n                *ngIf=\"!isDefaultRole(role)\"\r\n                iconShape=\"edit\"\r\n                [label]=\"'common.edit' | translate\"\r\n                [linkTo]=\"['./', role.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <vdr-dropdown>\r\n                <button type=\"button\" class=\"btn btn-link btn-sm\" vdrDropdownTrigger [disabled]=\"isDefaultRole(role)\">\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)=\"deleteRole(role.id)\"\r\n                        [disabled]=\"!('SuperAdmin' | 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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".default-role-label{color:var(--color-grey-400)}\n"]
-            },] }
-];
-RoleListComponent.ctorParameters = () => [
-    { type: ModalService },
-    { type: NotificationService },
-    { type: DataService },
-    { type: Router },
-    { type: ActivatedRoute }
-];
-
-class ShippingEligibilityTestResultComponent {
-    constructor() {
-        this.okToRun = false;
-        this.testDataUpdated = false;
-        this.runTest = new EventEmitter();
-    }
-}
-ShippingEligibilityTestResultComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-shipping-eligibility-test-result',
-                template: "<div class=\"test-result card\">\r\n    <div class=\"card-header\">\r\n        {{ 'settings.test-result' | translate }}\r\n    </div>\r\n    <div class=\"card-block\" *ngFor=\"let quote of testResult\">\r\n        <div class=\"result-details\" [class.stale]=\"testDataUpdated\">\r\n            <vdr-labeled-data [label]=\"'settings.shipping-method' | translate\">\r\n                {{ quote.name }}\r\n            </vdr-labeled-data>\r\n            <div class=\"price-row\">\r\n                <vdr-labeled-data [label]=\"'common.price' | translate\">\r\n                    {{ quote.price | localeCurrency: currencyCode }}\r\n                </vdr-labeled-data>\r\n                <vdr-labeled-data [label]=\"'common.price-with-tax' | translate\">\r\n                    {{ quote.priceWithTax | localeCurrency: currencyCode }}\r\n                </vdr-labeled-data>\r\n            </div>\r\n            <vdr-object-tree *ngIf=\"quote.metadata\" [value]=\"quote.metadata\"></vdr-object-tree>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\" *ngIf=\"testResult?.length === 0\">\r\n        <clr-icon shape=\"ban\" class=\"is-solid error\"></clr-icon>\r\n        {{ 'settings.no-eligible-shipping-methods' | translate }}\r\n    </div>\r\n    <div class=\"card-footer\">\r\n        <button class=\"btn btn-secondary\" (click)=\"runTest.emit()\" [disabled]=\"!okToRun\">\r\n            {{ 'settings.test-shipping-methods' | translate }}\r\n        </button>\r\n    </div>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".result-details{transition:opacity .2s}.result-details.stale{opacity:.5}.price-row{display:flex}.price-row>*:not(:first-child){margin-left:24px}clr-icon.error{color:var(--color-error-500)}\n"]
-            },] }
-];
-ShippingEligibilityTestResultComponent.propDecorators = {
-    testResult: [{ type: Input }],
-    okToRun: [{ type: Input }],
-    testDataUpdated: [{ type: Input }],
-    currencyCode: [{ type: Input }],
-    runTest: [{ type: Output }]
-};
-
-class ShippingMethodDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.checkers = [];
-        this.calculators = [];
-        this.fulfillmentHandlers = [];
-        this.testDataUpdated = false;
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdateShippingMethod];
-        this.fetchTestResult$ = new Subject();
-        this.customFields = this.getCustomFieldConfig('ShippingMethod');
-        this.detailForm = this.formBuilder.group({
-            code: ['', Validators.required],
-            name: ['', Validators.required],
-            description: '',
-            fulfillmentHandler: ['', Validators.required],
-            checker: {},
-            calculator: {},
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        combineLatest([
-            this.dataService.shippingMethod.getShippingMethodOperations().single$,
-            this.entity$.pipe(take(1)),
-        ]).subscribe(([data, entity]) => {
-            this.checkers = data.shippingEligibilityCheckers;
-            this.calculators = data.shippingCalculators;
-            this.fulfillmentHandlers = data.fulfillmentHandlers;
-            this.changeDetector.markForCheck();
-            this.selectedCheckerDefinition = data.shippingEligibilityCheckers.find(c => c.code === (entity.checker && entity.checker.code));
-            this.selectedCalculatorDefinition = data.shippingCalculators.find(c => c.code === (entity.calculator && entity.calculator.code));
-        });
-        this.activeChannel$ = this.dataService.settings
-            .getActiveChannel()
-            .mapStream(data => data.activeChannel);
-        this.testResult$ = this.fetchTestResult$.pipe(switchMap(([address, lines]) => {
-            if (!this.selectedChecker || !this.selectedCalculator) {
-                return of(undefined);
-            }
-            const formValue = this.detailForm.value;
-            const input = {
-                shippingAddress: Object.assign(Object.assign({}, address), { streetLine1: 'test' }),
-                lines: lines.map(l => ({ productVariantId: l.id, quantity: l.quantity })),
-                checker: toConfigurableOperationInput(this.selectedChecker, formValue.checker),
-                calculator: toConfigurableOperationInput(this.selectedCalculator, formValue.calculator),
-            };
-            return this.dataService.shippingMethod
-                .testShippingMethod(input)
-                .mapSingle(result => result.testShippingMethod);
-        }));
-        // tslint:disable:no-non-null-assertion
-        merge(this.detailForm.get(['checker']).valueChanges, this.detailForm.get(['calculator']).valueChanges)
-            .pipe(takeUntil(this.destroy$))
-            .subscribe(() => (this.testDataUpdated = true));
-        // tslint:enable:no-non-null-assertion
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    updateCode(currentCode, nameValue) {
-        if (!currentCode) {
-            const codeControl = this.detailForm.get(['code']);
-            if (codeControl && codeControl.pristine) {
-                codeControl.setValue(normalizeString(nameValue, '-'));
-            }
-        }
-    }
-    selectChecker(checker) {
-        this.selectedCheckerDefinition = checker;
-        this.selectedChecker = configurableDefinitionToInstance(checker);
-        const formControl = this.detailForm.get('checker');
-        if (formControl) {
-            formControl.clearValidators();
-            formControl.updateValueAndValidity({ onlySelf: true });
-            formControl.patchValue(this.selectedChecker);
-        }
-        this.detailForm.markAsDirty();
-    }
-    selectCalculator(calculator) {
-        this.selectedCalculatorDefinition = calculator;
-        this.selectedCalculator = configurableDefinitionToInstance(calculator);
-        const formControl = this.detailForm.get('calculator');
-        if (formControl) {
-            formControl.clearValidators();
-            formControl.updateValueAndValidity({ onlySelf: true });
-            formControl.patchValue(this.selectedCalculator);
-        }
-        this.detailForm.markAsDirty();
-    }
-    create() {
-        const selectedChecker = this.selectedChecker;
-        const selectedCalculator = this.selectedCalculator;
-        if (!selectedChecker || !selectedCalculator) {
-            return;
-        }
-        combineLatest([this.entity$, this.languageCode$])
-            .pipe(take(1), mergeMap(([shippingMethod, languageCode]) => {
-            const formValue = this.detailForm.value;
-            const input = Object.assign(Object.assign({}, this.getUpdatedShippingMethod(shippingMethod, this.detailForm, languageCode)), { checker: toConfigurableOperationInput(selectedChecker, formValue.checker), calculator: toConfigurableOperationInput(selectedCalculator, formValue.calculator) });
-            return this.dataService.shippingMethod.createShippingMethod(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'ShippingMethod',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createShippingMethod.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'ShippingMethod',
-            });
-        });
-    }
-    save() {
-        const selectedChecker = this.selectedChecker;
-        const selectedCalculator = this.selectedCalculator;
-        if (!selectedChecker || !selectedCalculator) {
-            return;
-        }
-        combineLatest([this.entity$, this.languageCode$])
-            .pipe(take(1), mergeMap(([shippingMethod, languageCode]) => {
-            const formValue = this.detailForm.value;
-            const input = Object.assign(Object.assign({}, this.getUpdatedShippingMethod(shippingMethod, this.detailForm, languageCode)), { checker: toConfigurableOperationInput(selectedChecker, formValue.checker), calculator: toConfigurableOperationInput(selectedCalculator, formValue.calculator) });
-            return this.dataService.shippingMethod.updateShippingMethod(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'ShippingMethod',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            // tslint:disable-next-line:no-console
-            console.error(err);
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'ShippingMethod',
-            });
-        });
-    }
-    setTestOrderLines(event) {
-        this.testOrderLines = event;
-        this.testDataUpdated = true;
-    }
-    setTestAddress(event) {
-        this.testAddress = event;
-        this.testDataUpdated = true;
-    }
-    allTestDataPresent() {
-        return !!(this.testAddress &&
-            this.testOrderLines &&
-            this.testOrderLines.length &&
-            this.selectedChecker &&
-            this.selectedCalculator);
-    }
-    runTest() {
-        this.fetchTestResult$.next([this.testAddress, this.testOrderLines]);
-        this.testDataUpdated = false;
-    }
-    /**
-     * Given a ShippingMethod and the value of the detailForm, this method creates an updated copy which
-     * can then be persisted to the API.
-     */
-    getUpdatedShippingMethod(shippingMethod, formGroup, languageCode) {
-        const formValue = formGroup.value;
-        const input = createUpdatedTranslatable({
-            translatable: shippingMethod,
-            updatedFields: formValue,
-            customFieldConfig: this.customFields,
-            languageCode,
-            defaultTranslation: {
-                languageCode,
-                name: shippingMethod.name || '',
-                description: shippingMethod.description || '',
-            },
-        });
-        return Object.assign(Object.assign({}, input), { fulfillmentHandler: formValue.fulfillmentHandler });
-    }
-    setFormValues(shippingMethod, languageCode) {
-        var _a, _b, _c, _d;
-        const currentTranslation = findTranslation(shippingMethod, languageCode);
-        this.detailForm.patchValue({
-            name: (_a = currentTranslation === null || currentTranslation === void 0 ? void 0 : currentTranslation.name) !== null && _a !== void 0 ? _a : '',
-            description: (_b = currentTranslation === null || currentTranslation === void 0 ? void 0 : currentTranslation.description) !== null && _b !== void 0 ? _b : '',
-            code: shippingMethod.code,
-            fulfillmentHandler: shippingMethod.fulfillmentHandlerCode,
-            checker: shippingMethod.checker || {},
-            calculator: shippingMethod.calculator || {},
-        });
-        if (!this.selectedChecker) {
-            this.selectedChecker = shippingMethod.checker && {
-                code: shippingMethod.checker.code,
-                args: shippingMethod.checker.args.map(a => (Object.assign(Object.assign({}, a), { value: getConfigArgValue(a.value) }))),
-            };
-        }
-        if (!this.selectedCalculator) {
-            this.selectedCalculator = shippingMethod.calculator && {
-                code: (_c = shippingMethod.calculator) === null || _c === void 0 ? void 0 : _c.code,
-                args: (_d = shippingMethod.calculator) === null || _d === void 0 ? void 0 : _d.args.map(a => (Object.assign(Object.assign({}, a), { value: getConfigArgValue(a.value) }))),
-            };
-        }
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get(['customFields']), shippingMethod, currentTranslation);
-        }
-    }
-}
-ShippingMethodDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-shipping-method-detail',
-                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=\"shipping-method-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.pristine || detailForm.invalid || !selectedChecker || !selectedCalculator\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                *vdrIfPermissions=\"updatePermission\"\r\n                [disabled]=\"\r\n                    detailForm.pristine || detailForm.invalid || !selectedChecker || !selectedCalculator\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=\"entity$ | async as shippingMethod\">\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(shippingMethod.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            formControlName=\"code\"\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    <vdr-form-field [label]=\"'settings.fulfillment-handler' | translate\" for=\"fulfillmentHandler\" class=\"mb2\">\r\n        <select\r\n            name=\"fulfillmentHandler\"\r\n            formControlName=\"fulfillmentHandler\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option *ngFor=\"let handler of fulfillmentHandlers\" [value]=\"handler.code\">\r\n                {{ handler.code }}: {{ handler.description }}\r\n            </option>\r\n        </select>\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=\"ShippingMethod\"\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\r\n    <vdr-custom-detail-component-host\r\n        locationId=\"shipping-method-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n\r\n    <div class=\"clr-row mt4\">\r\n        <div class=\"clr-col\">\r\n            <label class=\"clr-control-label\">{{ 'settings.shipping-eligibility-checker' | translate }}</label>\r\n            <vdr-configurable-input\r\n                *ngIf=\"selectedChecker && selectedCheckerDefinition\"\r\n                [operation]=\"selectedChecker\"\r\n                [operationDefinition]=\"selectedCheckerDefinition\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                (remove)=\"selectedChecker = null\"\r\n                formControlName=\"checker\"\r\n            ></vdr-configurable-input>\r\n            <div *ngIf=\"!selectedChecker || !selectedCheckerDefinition\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'common.select' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let checker of checkers\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"selectChecker(checker)\"\r\n                        >\r\n                            {{ checker.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            <label class=\"clr-control-label\">{{ 'settings.shipping-calculator' | translate }}</label>\r\n            <vdr-configurable-input\r\n                *ngIf=\"selectedCalculator && selectedCalculatorDefinition\"\r\n                [operation]=\"selectedCalculator\"\r\n                [operationDefinition]=\"selectedCalculatorDefinition\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n                (remove)=\"selectedCalculator = null\"\r\n                formControlName=\"calculator\"\r\n            ></vdr-configurable-input>\r\n            <div *ngIf=\"!selectedCalculator || !selectedCalculatorDefinition\">\r\n                <vdr-dropdown>\r\n                    <button class=\"btn btn-outline\" vdrDropdownTrigger>\r\n                        <clr-icon shape=\"plus\"></clr-icon>\r\n                        {{ 'common.select' | translate }}\r\n                    </button>\r\n                    <vdr-dropdown-menu vdrPosition=\"bottom-left\">\r\n                        <button\r\n                            *ngFor=\"let calculator of calculators\"\r\n                            type=\"button\"\r\n                            vdrDropdownItem\r\n                            (click)=\"selectCalculator(calculator)\"\r\n                        >\r\n                            {{ calculator.description }}\r\n                        </button>\r\n                    </vdr-dropdown-menu>\r\n                </vdr-dropdown>\r\n            </div>\r\n        </div>\r\n    </div>\r\n</form>\r\n<div class=\"testing-tool\">\r\n    <clr-accordion>\r\n        <clr-accordion-panel>\r\n            <clr-accordion-title>{{ 'settings.test-shipping-method' | translate }}</clr-accordion-title>\r\n            <clr-accordion-content *clrIfExpanded>\r\n                <div class=\"clr-row\">\r\n                    <div class=\"clr-col\">\r\n                        <vdr-test-order-builder\r\n                            (orderLinesChange)=\"setTestOrderLines($event)\"\r\n                        ></vdr-test-order-builder>\r\n                    </div>\r\n                    <div class=\"clr-col\">\r\n                        <vdr-test-address-form\r\n                            (addressChange)=\"setTestAddress($event)\"\r\n                        ></vdr-test-address-form>\r\n                        <vdr-shipping-method-test-result\r\n                            [currencyCode]=\"(activeChannel$ | async)?.currencyCode\"\r\n                            [okToRun]=\"allTestDataPresent() && testDataUpdated && detailForm.valid\"\r\n                            [testDataUpdated]=\"testDataUpdated\"\r\n                            [testResult]=\"testResult$ | async\"\r\n                            (runTest)=\"runTest()\"\r\n                        ></vdr-shipping-method-test-result>\r\n                    </div>\r\n                </div>\r\n            </clr-accordion-content>\r\n        </clr-accordion-panel>\r\n    </clr-accordion>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".testing-tool{margin-top:48px;margin-bottom:128px}.testing-tool h4{margin-bottom:12px}\n"]
-            },] }
-];
-ShippingMethodDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class ShippingMethodListComponent extends BaseListComponent {
-    constructor(modalService, notificationService, dataService, serverConfigService, router, route) {
-        super(router, route);
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        this.dataService = dataService;
-        this.serverConfigService = serverConfigService;
-        this.testDataUpdated = false;
-        this.fetchTestResult$ = new Subject();
-        super.setQueryFn((...args) => this.dataService.shippingMethod.getShippingMethods(...args).refetchOnChannelChange(), data => data.shippingMethods);
-    }
-    ngOnInit() {
-        super.ngOnInit();
-        this.testResult$ = this.fetchTestResult$.pipe(switchMap(([address, lines]) => {
-            const input = {
-                shippingAddress: Object.assign(Object.assign({}, address), { streetLine1: 'test' }),
-                lines: lines.map(l => ({ productVariantId: l.id, quantity: l.quantity })),
-            };
-            return this.dataService.shippingMethod
-                .testEligibleShippingMethods(input)
-                .mapSingle(result => result.testEligibleShippingMethods);
-        }));
-        this.activeChannel$ = this.dataService.settings
-            .getActiveChannel()
-            .mapStream(data => data.activeChannel);
-        this.availableLanguages$ = this.serverConfigService.getAvailableLanguages();
-        this.contentLanguage$ = this.dataService.client
-            .uiState()
-            .mapStream(({ uiState }) => uiState.contentLanguage)
-            .pipe(tap(() => this.refresh()));
-    }
-    deleteShippingMethod(id) {
-        this.modalService
-            .dialog({
-            title: marker('catalog.confirm-delete-shipping-method'),
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(response => response ? this.dataService.shippingMethod.deleteShippingMethod(id) : EMPTY))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-delete-success'), {
-                entity: 'ShippingMethod',
-            });
-            this.refresh();
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'ShippingMethod',
-            });
-        });
-    }
-    setTestOrderLines(event) {
-        this.testOrderLines = event;
-        this.testDataUpdated = true;
-    }
-    setTestAddress(event) {
-        this.testAddress = event;
-        this.testDataUpdated = true;
-    }
-    allTestDataPresent() {
-        return !!(this.testAddress && this.testOrderLines && this.testOrderLines.length);
-    }
-    runTest() {
-        this.fetchTestResult$.next([this.testAddress, this.testOrderLines]);
-        this.testDataUpdated = false;
-    }
-    setLanguage(code) {
-        this.dataService.client.setContentLanguage(code).subscribe();
-    }
-}
-ShippingMethodListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-shipping-method-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n        <vdr-language-selector\r\n            [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n            [currentLanguageCode]=\"contentLanguage$ | async\"\r\n            (languageCodeChange)=\"setLanguage($event)\"\r\n        ></vdr-language-selector>\r\n    </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"shipping-method-list\"></vdr-action-bar-items>\r\n        <a\r\n            class=\"btn btn-primary\"\r\n            [routerLink]=\"['./create']\"\r\n            *vdrIfPermissions=\"['CreateSettings', 'CreateShippingMethod']\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-shipping-method' | 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></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-shippingMethod=\"item\">\r\n        <td class=\"left align-middle\">{{ shippingMethod.code }}</td>\r\n        <td class=\"left align-middle\">{{ shippingMethod.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]=\"['./', shippingMethod.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right 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)=\"deleteShippingMethod(shippingMethod.id)\"\r\n                        [disabled]=\"!(['DeleteSettings', 'DeleteShippingMethod'] | 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\r\n<div class=\"testing-tool\">\r\n    <clr-accordion>\r\n        <clr-accordion-panel>\r\n            <clr-accordion-title>{{ 'settings.test-shipping-methods' | translate }}</clr-accordion-title>\r\n            <clr-accordion-content *clrIfExpanded>\r\n                <div class=\"clr-row\">\r\n                    <div class=\"clr-col\">\r\n                        <vdr-test-order-builder\r\n                            (orderLinesChange)=\"setTestOrderLines($event)\"\r\n                        ></vdr-test-order-builder>\r\n                    </div>\r\n                    <div class=\"clr-col\">\r\n                        <vdr-test-address-form\r\n                            (addressChange)=\"setTestAddress($event)\"\r\n                        ></vdr-test-address-form>\r\n                        <vdr-shipping-eligibility-test-result\r\n                            [currencyCode]=\"(activeChannel$ | async)?.currencyCode\"\r\n                            [okToRun]=\"allTestDataPresent()\"\r\n                            [testDataUpdated]=\"testDataUpdated\"\r\n                            [testResult]=\"testResult$ | async\"\r\n                            (runTest)=\"runTest()\"\r\n                        ></vdr-shipping-eligibility-test-result>\r\n                    </div>\r\n                </div>\r\n            </clr-accordion-content>\r\n        </clr-accordion-panel>\r\n    </clr-accordion>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".testing-tool{margin-top:48px}\n"]
-            },] }
-];
-ShippingMethodListComponent.ctorParameters = () => [
-    { type: ModalService },
-    { type: NotificationService },
-    { type: DataService },
-    { type: ServerConfigService },
-    { type: Router },
-    { type: ActivatedRoute }
-];
-
-class ShippingMethodTestResultComponent {
-    constructor() {
-        this.okToRun = false;
-        this.testDataUpdated = false;
-        this.runTest = new EventEmitter();
-    }
-}
-ShippingMethodTestResultComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-shipping-method-test-result',
-                template: "<div\r\n    class=\"test-result card\"\r\n    [ngClass]=\"{\r\n        success: testResult?.eligible === true,\r\n        error: testResult?.eligible === false,\r\n        unknown: !testResult\r\n    }\"\r\n>\r\n    <div class=\"card-header\">\r\n        {{ 'settings.test-result' | translate }}\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <div class=\"result-details\" [class.stale]=\"testDataUpdated\">\r\n            <vdr-labeled-data [label]=\"'settings.eligible' | translate\">\r\n                <div class=\"eligible-icon\">\r\n                    <clr-icon\r\n                        shape=\"success-standard\"\r\n                        class=\"is-solid success\"\r\n                        *ngIf=\"testResult?.eligible\"\r\n                    ></clr-icon>\r\n                    <clr-icon\r\n                        shape=\"ban\"\r\n                        class=\"is-solid error\"\r\n                        *ngIf=\"testResult?.eligible === false\"\r\n                    ></clr-icon>\r\n                    <clr-icon shape=\"unknown-status\" *ngIf=\"!testResult\"></clr-icon>\r\n                </div>\r\n                {{ testResult?.eligible }}\r\n            </vdr-labeled-data>\r\n            <div class=\"price-row\">\r\n                <vdr-labeled-data\r\n                    [label]=\"'common.price' | translate\"\r\n                    *ngIf=\"testResult?.quote?.price != null\"\r\n                >\r\n                    {{ testResult.quote?.price | localeCurrency: currencyCode }}\r\n                </vdr-labeled-data>\r\n                <vdr-labeled-data\r\n                    [label]=\"'common.price-with-tax' | translate\"\r\n                    *ngIf=\"testResult?.quote?.priceWithTax != null\"\r\n                >\r\n                    {{ testResult.quote?.priceWithTax | localeCurrency: currencyCode }}\r\n                </vdr-labeled-data>\r\n            </div>\r\n            <vdr-object-tree\r\n                *ngIf=\"testResult?.quote?.metadata\"\r\n                [value]=\"testResult?.quote?.metadata\"\r\n            ></vdr-object-tree>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-footer\">\r\n        <button class=\"btn btn-secondary\" (click)=\"runTest.emit()\" [disabled]=\"!okToRun\">\r\n            {{ 'settings.test-shipping-method' | translate }}\r\n        </button>\r\n    </div>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".test-result.success .card-block{background-color:var(--color-success-100)}.test-result.error .card-block{background-color:var(--color-error-100)}.test-result.unknown .card-block{background-color:var(--color-component-bg-100)}.result-details{transition:opacity .2s}.result-details.stale{opacity:.5}.eligible-icon{display:inline-block}.eligible-icon .success{color:var(--color-success-500)}.eligible-icon .error{color:var(--color-error-500)}.price-row{display:flex}.price-row>*:not(:first-child){margin-left:24px}\n"]
-            },] }
-];
-ShippingMethodTestResultComponent.propDecorators = {
-    testResult: [{ type: Input }],
-    okToRun: [{ type: Input }],
-    testDataUpdated: [{ type: Input }],
-    currencyCode: [{ type: Input }],
-    runTest: [{ type: Output }]
-};
-
-class TaxCategoryDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdateTaxCategory];
-        this.customFields = this.getCustomFieldConfig('TaxCategory');
-        this.detailForm = this.formBuilder.group({
-            name: ['', Validators.required],
-            isDefault: false,
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.taxCategory$ = this.entity$;
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    saveButtonEnabled() {
-        return this.detailForm.dirty && this.detailForm.valid;
-    }
-    create() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        const input = {
-            name: formValue.name,
-            isDefault: formValue.isDefault,
-            customFields: formValue.customFields,
-        };
-        this.dataService.settings.createTaxCategory(input).subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'TaxCategory',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createTaxCategory.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'TaxCategory',
-            });
-        });
-    }
-    save() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        this.taxCategory$
-            .pipe(take(1), mergeMap(taxCategory => {
-            const input = {
-                id: taxCategory.id,
-                name: formValue.name,
-                isDefault: formValue.isDefault,
-                customFields: formValue.customFields,
-            };
-            return this.dataService.settings.updateTaxCategory(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'TaxCategory',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'TaxCategory',
-            });
-        });
-    }
-    /**
-     * Update the form values when the entity changes.
-     */
-    setFormValues(entity, languageCode) {
-        this.detailForm.patchValue({
-            name: entity.name,
-            isDefault: entity.isDefault,
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get('customFields'), entity);
-        }
-    }
-}
-TaxCategoryDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-tax-detail',
-                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=\"tax-category-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]=\"!saveButtonEnabled()\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"!saveButtonEnabled()\"\r\n                *vdrIfPermissions=\"updatePermission\"\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\">\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        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'common.default-tax-category' | translate\" for=\"isDefault\">\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                id=\"isDefault\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n                formControlName=\"isDefault\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\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=\"TaxCategory\"\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=\"tax-category-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-TaxCategoryDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class TaxCategoryListComponent {
-    constructor(dataService, notificationService, modalService) {
-        this.dataService = dataService;
-        this.notificationService = notificationService;
-        this.modalService = modalService;
-        this.queryResult = this.dataService.settings.getTaxCategories();
-        this.taxCategories$ = this.queryResult.mapStream(data => data.taxCategories);
-    }
-    deleteTaxCategory(taxCategory) {
-        return this.modalService
-            .dialog({
-            title: marker('settings.confirm-delete-tax-category'),
-            body: taxCategory.name,
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(res => (res ? this.dataService.settings.deleteTaxCategory(taxCategory.id) : EMPTY)), map(res => res.deleteTaxCategory))
-            .subscribe(res => {
-            if (res.result === DeletionResult.DELETED) {
-                this.notificationService.success(marker('common.notify-delete-success'), {
-                    entity: 'TaxRate',
-                });
-                this.queryResult.ref.refetch();
-            }
-            else {
-                this.notificationService.error(res.message || marker('common.notify-delete-error'), {
-                    entity: 'TaxRate',
-                });
-            }
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'TaxRate',
-            });
-        });
-    }
-}
-TaxCategoryListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-tax-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"tax-category-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"['CreateSettings', 'CreateTaxCategory']\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-tax-category' | translate }}\r\n        </a>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n\r\n<vdr-data-table [items]=\"taxCategories$ | async\">\r\n    <vdr-dt-column>{{ 'common.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-taxCategory=\"item\">\r\n        <td class=\"left align-middle\">{{ taxCategory.name }}</td>\r\n        <td class=\"left align-middle\">\r\n            <vdr-chip *ngIf=\"taxCategory.isDefault\">{{ 'common.default-tax-category' | translate }}</vdr-chip>\r\n        </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]=\"['./', taxCategory.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right 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)=\"deleteTaxCategory(taxCategory)\"\r\n                        [disabled]=\"!(['DeleteSettings', 'DeleteTaxCategory'] | 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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-TaxCategoryListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: NotificationService },
-    { type: ModalService }
-];
-
-class TaxRateDetailComponent extends BaseDetailComponent {
-    constructor(router, route, serverConfigService, changeDetector, dataService, formBuilder, notificationService) {
-        super(route, router, serverConfigService, dataService);
-        this.changeDetector = changeDetector;
-        this.dataService = dataService;
-        this.formBuilder = formBuilder;
-        this.notificationService = notificationService;
-        this.updatePermission = [Permission.UpdateSettings, Permission.UpdateTaxRate];
-        this.customFields = this.getCustomFieldConfig('TaxRate');
-        this.detailForm = this.formBuilder.group({
-            name: ['', Validators.required],
-            enabled: [true],
-            value: [0, Validators.required],
-            taxCategoryId: [''],
-            zoneId: [''],
-            customerGroupId: [''],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-    }
-    ngOnInit() {
-        this.init();
-        this.taxCategories$ = this.dataService.settings
-            .getTaxCategories()
-            .mapSingle(data => data.taxCategories);
-        this.zones$ = this.dataService.settings.getZones().mapSingle(data => data.zones);
-    }
-    ngOnDestroy() {
-        this.destroy();
-    }
-    saveButtonEnabled() {
-        return this.detailForm.dirty && this.detailForm.valid;
-    }
-    create() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        const input = {
-            name: formValue.name,
-            enabled: formValue.enabled,
-            value: formValue.value,
-            categoryId: formValue.taxCategoryId,
-            zoneId: formValue.zoneId,
-            customerGroupId: formValue.customerGroupId,
-            customFields: formValue.customFields,
-        };
-        this.dataService.settings.createTaxRate(input).subscribe(data => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'TaxRate',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-            this.router.navigate(['../', data.createTaxRate.id], { relativeTo: this.route });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'TaxRate',
-            });
-        });
-    }
-    save() {
-        if (!this.detailForm.dirty) {
-            return;
-        }
-        const formValue = this.detailForm.value;
-        this.entity$
-            .pipe(take(1), mergeMap(taxRate => {
-            const input = {
-                id: taxRate.id,
-                name: formValue.name,
-                enabled: formValue.enabled,
-                value: formValue.value,
-                categoryId: formValue.taxCategoryId,
-                zoneId: formValue.zoneId,
-                customerGroupId: formValue.customerGroupId,
-                customFields: formValue.customFields,
-            };
-            return this.dataService.settings.updateTaxRate(input);
-        }))
-            .subscribe(data => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'TaxRate',
-            });
-            this.detailForm.markAsPristine();
-            this.changeDetector.markForCheck();
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'TaxRate',
-            });
-        });
-    }
-    /**
-     * Update the form values when the entity changes.
-     */
-    setFormValues(entity, languageCode) {
-        this.detailForm.patchValue({
-            name: entity.name,
-            enabled: entity.enabled,
-            value: entity.value,
-            taxCategoryId: entity.category ? entity.category.id : '',
-            zoneId: entity.zone ? entity.zone.id : '',
-            customerGroupId: entity.customerGroup ? entity.customerGroup.id : '',
-        });
-        if (this.customFields.length) {
-            this.setCustomFieldFormValues(this.customFields, this.detailForm.get('customFields'), entity);
-        }
-    }
-}
-TaxRateDetailComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-tax-rate-detail',
-                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=\"tax-rate-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]=\"!saveButtonEnabled()\"\r\n        >\r\n            {{ 'common.create' | translate }}\r\n        </button>\r\n        <ng-template #updateButton>\r\n            <button\r\n                class=\"btn btn-primary\"\r\n                (click)=\"save()\"\r\n                [disabled]=\"!saveButtonEnabled()\"\r\n                *vdrIfPermissions=\"updatePermission\"\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\">\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        />\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'common.enabled' | translate\" for=\"enabled\">\r\n        <clr-toggle-wrapper>\r\n            <input\r\n                type=\"checkbox\"\r\n                clrToggle\r\n                id=\"enabled\"\r\n                formControlName=\"enabled\"\r\n                [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n            />\r\n        </clr-toggle-wrapper>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.rate' | translate\" for=\"value\">\r\n        <vdr-affixed-input suffix=\"%\">\r\n            <input\r\n                id=\"value\"\r\n                type=\"number\"\r\n                step=\"0.1\"\r\n                formControlName=\"value\"\r\n                [readonly]=\"!(updatePermission | hasPermission)\"\r\n            />\r\n        </vdr-affixed-input>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.tax-category' | translate\" for=\"taxCategoryId\">\r\n        <select\r\n            clrSelect\r\n            name=\"taxCategoryId\"\r\n            formControlName=\"taxCategoryId\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option *ngFor=\"let taxCategory of taxCategories$ | async\" [value]=\"taxCategory.id\">\r\n                {{ taxCategory.name }}\r\n            </option>\r\n        </select>\r\n    </vdr-form-field>\r\n    <vdr-form-field [label]=\"'settings.zone' | translate\" for=\"zoneId\">\r\n        <select\r\n            clrSelect\r\n            name=\"zoneId\"\r\n            formControlName=\"zoneId\"\r\n            [vdrDisabled]=\"!(updatePermission | hasPermission)\"\r\n        >\r\n            <option *ngFor=\"let zone of zones$ | async\" [value]=\"zone.id\">{{ zone.name }}</option>\r\n        </select>\r\n    </vdr-form-field>\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=\"TaxRate\"\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=\"tax-rate-detail\"\r\n        [entity$]=\"entity$\"\r\n        [detailForm]=\"detailForm\"\r\n    ></vdr-custom-detail-component-host>\r\n</form>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-TaxRateDetailComponent.ctorParameters = () => [
-    { type: Router },
-    { type: ActivatedRoute },
-    { type: ServerConfigService },
-    { type: ChangeDetectorRef },
-    { type: DataService },
-    { type: FormBuilder },
-    { type: NotificationService }
-];
-
-class TaxRateListComponent extends BaseListComponent {
-    constructor(modalService, notificationService, dataService, router, route) {
-        super(router, route);
-        this.modalService = modalService;
-        this.notificationService = notificationService;
-        this.dataService = dataService;
-        super.setQueryFn((...args) => this.dataService.settings.getTaxRates(...args), data => data.taxRates);
-    }
-    deleteTaxRate(taxRate) {
-        return this.modalService
-            .dialog({
-            title: marker('settings.confirm-delete-tax-rate'),
-            body: taxRate.name,
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(res => (res ? this.dataService.settings.deleteTaxRate(taxRate.id) : EMPTY)), map(res => res.deleteTaxRate))
-            .subscribe(res => {
-            if (res.result === DeletionResult.DELETED) {
-                this.notificationService.success(marker('common.notify-delete-success'), {
-                    entity: 'TaxRate',
-                });
-                this.refresh();
-            }
-            else {
-                this.notificationService.error(res.message || marker('common.notify-delete-error'), {
-                    entity: 'TaxRate',
-                });
-            }
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'TaxRate',
-            });
-        });
-    }
-}
-TaxRateListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-tax-rate-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"tax-rate-list\"></vdr-action-bar-items>\r\n        <a class=\"btn btn-primary\" [routerLink]=\"['./create']\" *vdrIfPermissions=\"['CreateSettings', 'CreateTaxRate']\">\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-tax-rate' | 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.name' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.tax-category' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.zone' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column>{{ 'settings.tax-rate' | 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-taxRate=\"item\">\r\n        <td class=\"left align-middle\">{{ taxRate.name }}</td>\r\n        <td class=\"left align-middle\">{{ taxRate.category.name }}</td>\r\n        <td class=\"left align-middle\">{{ taxRate.zone.name }}</td>\r\n        <td class=\"left align-middle\">{{ taxRate.value }}%</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]=\"['./', taxRate.id]\"\r\n            ></vdr-table-row-action>\r\n        </td>\r\n        <td class=\"right 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)=\"deleteTaxRate(taxRate)\"\r\n                        [disabled]=\"!(['DeleteSettings', 'DeleteTaxRate'] | 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",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-TaxRateListComponent.ctorParameters = () => [
-    { type: ModalService },
-    { type: NotificationService },
-    { type: DataService },
-    { type: Router },
-    { type: ActivatedRoute }
-];
-
-class TestAddressFormComponent {
-    constructor(formBuilder, dataService, localStorageService) {
-        this.formBuilder = formBuilder;
-        this.dataService = dataService;
-        this.localStorageService = localStorageService;
-        this.addressChange = new EventEmitter();
-    }
-    ngOnInit() {
-        this.availableCountries$ = this.dataService.settings
-            .getAvailableCountries()
-            .mapSingle(result => result.countries.items);
-        const storedValue = this.localStorageService.getForCurrentLocation('shippingTestAddress');
-        const initialValue = storedValue
-            ? storedValue
-            : {
-                city: '',
-                countryCode: '',
-                postalCode: '',
-                province: '',
-            };
-        this.addressChange.emit(initialValue);
-        this.form = this.formBuilder.group(initialValue);
-        this.subscription = this.form.valueChanges.subscribe(value => {
-            this.localStorageService.setForCurrentLocation('shippingTestAddress', value);
-            this.addressChange.emit(value);
-        });
-    }
-    ngOnDestroy() {
-        if (this.subscription) {
-            this.subscription.unsubscribe();
-        }
-    }
-}
-TestAddressFormComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-test-address-form',
-                template: "<div class=\"card\">\r\n    <div class=\"card-header\">\r\n        {{ 'settings.test-address' | translate }}\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <form [formGroup]=\"form\">\r\n            <clr-input-container>\r\n                <label>{{ 'customer.city' | translate }}</label>\r\n                <input formControlName=\"city\" type=\"text\" clrInput />\r\n            </clr-input-container>\r\n            <clr-input-container>\r\n                <label>{{ 'customer.province' | translate }}</label>\r\n                <input formControlName=\"province\" type=\"text\" clrInput />\r\n            </clr-input-container>\r\n            <clr-input-container>\r\n                <label>{{ 'customer.postal-code' | translate }}</label>\r\n                <input formControlName=\"postalCode\" type=\"text\" clrInput />\r\n            </clr-input-container>\r\n            <clr-input-container>\r\n                <label>{{ 'customer.country' | translate }}</label>\r\n                <select name=\"countryCode\" formControlName=\"countryCode\" clrInput clrSelect>\r\n                    <option *ngFor=\"let country of availableCountries$ | async\" [value]=\"country.code\">\r\n                        {{ country.name }}\r\n                    </option>\r\n                </select>\r\n            </clr-input-container>\r\n        </form>\r\n    </div>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: ["clr-input-container{margin-bottom:12px}\n"]
-            },] }
-];
-TestAddressFormComponent.ctorParameters = () => [
-    { type: FormBuilder },
-    { type: DataService },
-    { type: LocalStorageService }
-];
-TestAddressFormComponent.propDecorators = {
-    addressChange: [{ type: Output }]
-};
-
-class TestOrderBuilderComponent {
-    constructor(dataService, localStorageService) {
-        this.dataService = dataService;
-        this.localStorageService = localStorageService;
-        this.orderLinesChange = new EventEmitter();
-        this.lines = [];
-    }
-    get subTotal() {
-        return this.lines.reduce((sum, l) => sum + l.unitPriceWithTax * l.quantity, 0);
-    }
-    ngOnInit() {
-        this.lines = this.loadFromLocalStorage();
-        if (this.lines) {
-            this.orderLinesChange.emit(this.lines);
-        }
-        this.dataService.settings.getActiveChannel('cache-first').single$.subscribe(result => {
-            this.currencyCode = result.activeChannel.currencyCode;
-        });
-    }
-    selectResult(result) {
-        if (result) {
-            this.addToLines(result);
-        }
-    }
-    addToLines(result) {
-        var _a, _b;
-        if (!this.lines.find(l => l.id === result.productVariantId)) {
-            this.lines.push({
-                id: result.productVariantId,
-                name: result.productVariantName,
-                preview: (_b = (_a = result.productAsset) === null || _a === void 0 ? void 0 : _a.preview) !== null && _b !== void 0 ? _b : '',
-                quantity: 1,
-                sku: result.sku,
-                unitPriceWithTax: (result.priceWithTax.__typename === 'SinglePrice' && result.priceWithTax.value) || 0,
-            });
-            this.persistToLocalStorage();
-            this.orderLinesChange.emit(this.lines);
-        }
-    }
-    updateQuantity() {
-        this.persistToLocalStorage();
-        this.orderLinesChange.emit(this.lines);
-    }
-    removeLine(line) {
-        this.lines = this.lines.filter(l => l.id !== line.id);
-        this.persistToLocalStorage();
-        this.orderLinesChange.emit(this.lines);
-    }
-    persistToLocalStorage() {
-        this.localStorageService.setForCurrentLocation('shippingTestOrder', this.lines);
-    }
-    loadFromLocalStorage() {
-        return this.localStorageService.getForCurrentLocation('shippingTestOrder') || [];
-    }
-}
-TestOrderBuilderComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-test-order-builder',
-                template: "<div class=\"card\">\r\n    <div class=\"card-header\">\r\n        {{ 'settings.test-order' | translate }}\r\n    </div>\r\n    <table class=\"order-table table\" *ngIf=\"lines.length; else emptyPlaceholder\">\r\n        <thead>\r\n            <tr>\r\n                <th></th>\r\n                <th>{{ 'order.product-name' | translate }}</th>\r\n                <th>{{ 'order.product-sku' | translate }}</th>\r\n                <th>{{ 'order.unit-price' | translate }}</th>\r\n                <th>{{ 'order.quantity' | translate }}</th>\r\n                <th>{{ 'order.total' | translate }}</th>\r\n            </tr>\r\n        </thead>\r\n        <tr *ngFor=\"let line of lines\" class=\"order-line\">\r\n            <td class=\"align-middle thumb\">\r\n                <img [src]=\"line.preview + '?preset=tiny'\" />\r\n            </td>\r\n            <td class=\"align-middle name\">{{ line.name }}</td>\r\n            <td class=\"align-middle sku\">{{ line.sku }}</td>\r\n            <td class=\"align-middle unit-price\">\r\n                {{ line.unitPriceWithTax | localeCurrency: currencyCode }}\r\n            </td>\r\n            <td class=\"align-middle quantity\">\r\n                <input\r\n                    [(ngModel)]=\"line.quantity\"\r\n                    (change)=\"updateQuantity()\"\r\n                    type=\"number\"\r\n                    max=\"9999\"\r\n                    min=\"1\"\r\n                />\r\n                <button class=\"icon-button\" (click)=\"removeLine(line)\">\r\n                    <clr-icon shape=\"trash\"></clr-icon>\r\n                </button>\r\n            </td>\r\n            <td class=\"align-middle total\">\r\n                {{ (line.unitPriceWithTax * line.quantity) | localeCurrency: currencyCode }}\r\n            </td>\r\n        </tr>\r\n        <tr class=\"sub-total\">\r\n            <td class=\"left\">{{ 'order.sub-total' | translate }}</td>\r\n            <td></td>\r\n            <td></td>\r\n            <td></td>\r\n            <td></td>\r\n            <td>{{ subTotal | localeCurrency: currencyCode }}</td>\r\n        </tr>\r\n    </table>\r\n\r\n    <ng-template #emptyPlaceholder>\r\n        <div class=\"card-block empty-placeholder\">\r\n            <div class=\"empty-text\">{{ 'settings.add-products-to-test-order' | translate }}</div>\r\n            <clr-icon shape=\"arrow\" dir=\"down\" size=\"96\"></clr-icon>\r\n        </div>\r\n    </ng-template>\r\n    <div class=\"card-block\">\r\n        <vdr-product-selector (productSelected)=\"selectResult($event)\"> </vdr-product-selector>\r\n    </div>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".empty-placeholder{color:var(--color-grey-400);text-align:center}.empty-text{font-size:22px}\n"]
-            },] }
-];
-TestOrderBuilderComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: LocalStorageService }
-];
-TestOrderBuilderComponent.propDecorators = {
-    orderLinesChange: [{ type: Output }]
-};
-
-class ZoneDetailDialogComponent {
-    constructor(serverConfigService, formBuilder) {
-        this.serverConfigService = serverConfigService;
-        this.formBuilder = formBuilder;
-        this.customFields = this.serverConfigService.getCustomFieldsFor('CustomerGroup');
-    }
-    ngOnInit() {
-        var _a;
-        this.form = this.formBuilder.group({
-            name: [this.zone.name, Validators.required],
-            customFields: this.formBuilder.group(this.customFields.reduce((hash, field) => (Object.assign(Object.assign({}, hash), { [field.name]: '' })), {})),
-        });
-        if (this.customFields.length) {
-            const customFieldsGroup = this.form.get('customFields');
-            for (const fieldDef of this.customFields) {
-                const key = fieldDef.name;
-                const value = (_a = this.zone.customFields) === null || _a === void 0 ? void 0 : _a[key];
-                const control = customFieldsGroup.get(key);
-                if (control) {
-                    control.patchValue(value);
-                }
-            }
-        }
-    }
-    cancel() {
-        this.resolveWith();
-    }
-    save() {
-        this.resolveWith(this.form.value);
-    }
-}
-ZoneDetailDialogComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-zone-detail-dialog',
-                template: "<ng-template vdrDialogTitle>\r\n    <span *ngIf=\"zone.id\">{{ 'settings.update-zone' | translate }}</span>\r\n    <span *ngIf=\"!zone.id\">{{ 'settings.create-zone' | translate }}</span>\r\n</ng-template>\r\n<form [formGroup]=\"form\">\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]=\"!(['UpdateSettings', 'UpdateZone'] | hasPermission)\"\r\n        />\r\n    </vdr-form-field>\r\n    <vdr-tabbed-custom-fields\r\n        entityName=\"Zone\"\r\n        [customFields]=\"customFields\"\r\n        [customFieldsFormGroup]=\"form.get('customFields')\"\r\n        [readonly]=\"!(['UpdateSettings', 'UpdateZone'] | hasPermission)\"\r\n    ></vdr-tabbed-custom-fields>\r\n</form>\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)=\"save()\" [disabled]=\"form.invalid\" class=\"btn btn-primary\">\r\n        <span *ngIf=\"zone.id\">{{ 'settings.update-zone' | translate }}</span>\r\n        <span *ngIf=\"!zone.id\">{{ 'settings.create-zone' | translate }}</span>\r\n    </button>\r\n</ng-template>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [""]
-            },] }
-];
-ZoneDetailDialogComponent.ctorParameters = () => [
-    { type: ServerConfigService },
-    { type: FormBuilder }
-];
-
-class ZoneListComponent {
-    constructor(dataService, notificationService, modalService, route, router, serverConfigService) {
-        this.dataService = dataService;
-        this.notificationService = notificationService;
-        this.modalService = modalService;
-        this.route = route;
-        this.router = router;
-        this.serverConfigService = serverConfigService;
-        this.selectedMemberIds = [];
-    }
-    ngOnInit() {
-        const zonesQueryRef = this.dataService.settings.getZones().ref;
-        this.zones$ = zonesQueryRef.valueChanges.pipe(map(data => data.data.zones));
-        const activeZoneId$ = this.route.paramMap.pipe(map(pm => pm.get('contents')), distinctUntilChanged(), tap(() => (this.selectedMemberIds = [])));
-        this.activeZone$ = combineLatest(this.zones$, activeZoneId$).pipe(map(([zones, activeZoneId]) => {
-            if (activeZoneId) {
-                return zones.find(z => z.id === activeZoneId);
-            }
-        }));
-        this.availableLanguages$ = this.serverConfigService.getAvailableLanguages();
-        this.contentLanguage$ = this.dataService.client
-            .uiState()
-            .mapStream(({ uiState }) => uiState.contentLanguage)
-            .pipe(tap(() => zonesQueryRef.refetch()));
-    }
-    setLanguage(code) {
-        this.dataService.client.setContentLanguage(code).subscribe();
-    }
-    create() {
-        this.modalService
-            .fromComponent(ZoneDetailDialogComponent, { locals: { zone: { name: '' } } })
-            .pipe(switchMap(result => result ? this.dataService.settings.createZone(Object.assign(Object.assign({}, result), { memberIds: [] })) : EMPTY), 
-        // refresh list
-        switchMap(() => this.dataService.settings.getZones().single$))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-create-success'), {
-                entity: 'Zone',
-            });
-        }, err => {
-            this.notificationService.error(marker('common.notify-create-error'), {
-                entity: 'Zone',
-            });
-        });
-    }
-    delete(zoneId) {
-        this.modalService
-            .dialog({
-            title: marker('catalog.confirm-delete-zone'),
-            buttons: [
-                { type: 'secondary', label: marker('common.cancel') },
-                { type: 'danger', label: marker('common.delete'), returnValue: true },
-            ],
-        })
-            .pipe(switchMap(response => (response ? this.dataService.settings.deleteZone(zoneId) : EMPTY)), switchMap(result => {
-            if (result.deleteZone.result === DeletionResult.DELETED) {
-                // refresh list
-                return this.dataService.settings
-                    .getZones()
-                    .mapSingle(() => ({ errorMessage: false }));
-            }
-            else {
-                return of({ errorMessage: result.deleteZone.message });
-            }
-        }))
-            .subscribe(result => {
-            if (typeof result.errorMessage === 'string') {
-                this.notificationService.error(result.errorMessage);
-            }
-            else {
-                this.notificationService.success(marker('common.notify-delete-success'), {
-                    entity: 'Zone',
-                });
-            }
-        }, err => {
-            this.notificationService.error(marker('common.notify-delete-error'), {
-                entity: 'Zone',
-            });
-        });
-    }
-    update(zone) {
-        this.modalService
-            .fromComponent(ZoneDetailDialogComponent, { locals: { zone } })
-            .pipe(switchMap(result => result ? this.dataService.settings.updateZone(Object.assign({ id: zone.id }, result)) : EMPTY))
-            .subscribe(() => {
-            this.notificationService.success(marker('common.notify-update-success'), {
-                entity: 'Zone',
-            });
-        }, err => {
-            this.notificationService.error(marker('common.notify-update-error'), {
-                entity: 'Zone',
-            });
-        });
-    }
-    closeMembers() {
-        const params = Object.assign({}, this.route.snapshot.params);
-        delete params.contents;
-        this.router.navigate(['./', params], { relativeTo: this.route, queryParamsHandling: 'preserve' });
-    }
-    addToZone(zone) {
-        this.modalService
-            .fromComponent(AddCountryToZoneDialogComponent, {
-            locals: {
-                zoneName: zone.name,
-                currentMembers: zone.members,
-            },
-            size: 'md',
-        })
-            .pipe(switchMap(memberIds => memberIds
-            ? this.dataService.settings
-                .addMembersToZone(zone.id, memberIds)
-                .pipe(mapTo(memberIds))
-            : EMPTY))
-            .subscribe({
-            next: result => {
-                this.notificationService.success(marker(`settings.add-countries-to-zone-success`), {
-                    countryCount: result.length,
-                    zoneName: zone.name,
-                });
-            },
-            error: err => {
-                this.notificationService.error(err);
-            },
-        });
-    }
-    removeFromZone(zone, memberIds) {
-        this.dataService.settings.removeMembersFromZone(zone.id, memberIds).subscribe({
-            complete: () => {
-                this.notificationService.success(marker(`settings.remove-countries-from-zone-success`), {
-                    countryCount: memberIds.length,
-                    zoneName: zone.name,
-                });
-            },
-        });
-    }
-}
-ZoneListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-zone-list',
-                template: "<vdr-action-bar>\r\n    <vdr-ab-left>\r\n            <vdr-language-selector\r\n                [availableLanguageCodes]=\"availableLanguages$ | async\"\r\n                [currentLanguageCode]=\"contentLanguage$ | async\"\r\n                (languageCodeChange)=\"setLanguage($event)\"\r\n            ></vdr-language-selector>\r\n        </vdr-ab-left>\r\n    <vdr-ab-right>\r\n        <vdr-action-bar-items locationId=\"zone-list\"></vdr-action-bar-items>\r\n        <button\r\n            class=\"btn btn-primary\"\r\n            *vdrIfPermissions=\"['CreateSettings', 'CreateZone']\"\r\n            (click)=\"create()\"\r\n        >\r\n            <clr-icon shape=\"plus\"></clr-icon>\r\n            {{ 'settings.create-new-zone' | translate }}\r\n        </button>\r\n    </vdr-ab-right>\r\n</vdr-action-bar>\r\n<div class=\"zone-wrapper\">\r\n    <div class=\"zone-list\">\r\n        <table class=\"table mt0\">\r\n            <tbody>\r\n                <tr\r\n                    *ngFor=\"let zone of zones$ | async\"\r\n                    [class.active]=\"zone.id === (activeZone$ | async)?.id\"\r\n                >\r\n                    <td class=\"left align-middle\"><vdr-entity-info [entity]=\"zone\"></vdr-entity-info></td>\r\n                    <td class=\"left align-middle\">\r\n                        <vdr-chip [colorFrom]=\"zone.name\">{{ zone.name }}</vdr-chip>\r\n                    </td>\r\n                    <td class=\"text-right align-middle\">\r\n                        <a\r\n                            class=\"btn btn-link btn-sm\"\r\n                            [routerLink]=\"['./', { contents: zone.id }]\"\r\n                            queryParamsHandling=\"preserve\"\r\n                        >\r\n                            <clr-icon shape=\"view-list\"></clr-icon>\r\n                            {{ 'settings.view-zone-members' | translate }}\r\n                        </a>\r\n                    </td>\r\n                    <td class=\"align-middle\">\r\n                        <button class=\"btn btn-link btn-sm\" (click)=\"update(zone)\">\r\n                            <clr-icon shape=\"edit\"></clr-icon>\r\n                            {{ 'common.edit' | translate }}\r\n                        </button>\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                                    class=\"button\"\r\n                                    vdrDropdownItem\r\n                                    (click)=\"delete(zone.id)\"\r\n                                    [disabled]=\"!(['DeleteSettings', 'DeleteZone'] | hasPermission)\"\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    </div>\r\n    <div class=\"zone-members\" [class.expanded]=\"activeZone$ | async\">\r\n        <ng-container *ngIf=\"activeZone$ | async as activeZone\">\r\n            <vdr-zone-member-list\r\n                [members]=\"activeZone.members\"\r\n                [selectedMemberIds]=\"selectedMemberIds\"\r\n                (selectionChange)=\"selectedMemberIds = $event\"\r\n            >\r\n                <div *vdrZoneMemberListHeader>\r\n                    <div class=\"flex\">\r\n                        <div class=\"header-title-row\">\r\n                            {{ activeZone.name }} ({{ activeZone.members.length }})\r\n                        </div>\r\n                        <div class=\"flex-spacer\"></div>\r\n                        <button type=\"button\" class=\"close-button\" (click)=\"closeMembers()\">\r\n                            <clr-icon shape=\"close\"></clr-icon>\r\n                        </button>\r\n                    </div>\r\n                    <div class=\"controls\">\r\n                        <vdr-dropdown>\r\n                            <button\r\n                                type=\"button\"\r\n                                class=\"btn btn-secondary btn-sm\"\r\n                                vdrDropdownTrigger\r\n                                [disabled]=\"selectedMemberIds.length === 0\"\r\n                            >\r\n                                {{ 'common.with-selected' | 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)=\"removeFromZone(activeZone, selectedMemberIds)\"\r\n                                    vdrDropdownItem\r\n                                    [disabled]=\"!(['UpdateSettings', 'UpdateZone'] | hasPermission)\"\r\n                                >\r\n                                    <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                                    {{ 'settings.remove-from-zone' | translate }}\r\n                                </button>\r\n                            </vdr-dropdown-menu>\r\n                        </vdr-dropdown>\r\n                        <button class=\"btn btn-secondary btn-sm\" (click)=\"addToZone(activeZone)\">\r\n                            {{ 'settings.add-countries-to-zone' | translate: { zoneName: activeZone.name } }}\r\n                        </button>\r\n                    </div>\r\n                </div>\r\n                <div *vdrZoneMemberControls=\"let member = member\">\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                            <a\r\n                                type=\"button\"\r\n                                [routerLink]=\"['/settings', 'countries', member.id]\"\r\n                                vdrDropdownItem\r\n                            >\r\n                                <clr-icon shape=\"edit\"></clr-icon>\r\n                                {{ 'common.edit' | translate }}\r\n                            </a>\r\n                            <button\r\n                                type=\"button\"\r\n                                class=\"delete-button\"\r\n                                (click)=\"removeFromZone(activeZone, [member.id])\"\r\n                                vdrDropdownItem\r\n                                [disabled]=\"!(['UpdateSettings', 'UpdateZone'] | hasPermission)\"\r\n                            >\r\n                                <clr-icon shape=\"trash\" class=\"is-danger\"></clr-icon>\r\n                                {{ 'settings.remove-from-zone' | translate }}\r\n                            </button>\r\n                        </vdr-dropdown-menu>\r\n                    </vdr-dropdown>\r\n                </div>\r\n            </vdr-zone-member-list>\r\n        </ng-container>\r\n    </div>\r\n</div>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".zone-wrapper{display:flex;height:calc(100% - 50px)}.zone-wrapper .zone-list{flex:1;overflow:auto;margin-top:0}.zone-wrapper .zone-list tr.active{background-color:var(--color-component-bg-200)}.zone-members{height:100%;width:0;opacity:0;visibility:hidden;overflow:auto;transition:width .3s,opacity .2s .3s,visibility 0s .3s}.zone-members.expanded{width:40vw;visibility:visible;opacity:1;padding-left:12px}.zone-members .close-button{margin:0;background:none;border:none;cursor:pointer}.zone-members ::ng-deep table.table{margin-top:0}.zone-members ::ng-deep table.table th{top:0}.zone-members .controls{display:flex;justify-content:space-between}\n"]
-            },] }
-];
-ZoneListComponent.ctorParameters = () => [
-    { type: DataService },
-    { type: NotificationService },
-    { type: ModalService },
-    { type: ActivatedRoute },
-    { type: Router },
-    { type: ServerConfigService }
-];
-
-class ZoneMemberControlsDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-    }
-}
-ZoneMemberControlsDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[vdrZoneMemberControls]',
-            },] }
-];
-ZoneMemberControlsDirective.ctorParameters = () => [
-    { type: TemplateRef }
-];
-
-class ZoneMemberListHeaderDirective {
-    constructor(templateRef) {
-        this.templateRef = templateRef;
-    }
-}
-ZoneMemberListHeaderDirective.decorators = [
-    { type: Directive, args: [{
-                selector: '[vdrZoneMemberListHeader]',
-            },] }
-];
-ZoneMemberListHeaderDirective.ctorParameters = () => [
-    { type: TemplateRef }
-];
-
-class ZoneMemberListComponent {
-    constructor() {
-        this.members = [];
-        this.selectedMemberIds = [];
-        this.selectionChange = new EventEmitter();
-        this.filterTerm = '';
-        this.isMemberSelected = (member) => {
-            return -1 < this.selectedMemberIds.indexOf(member.id);
-        };
-    }
-    filteredMembers() {
-        if (this.filterTerm !== '') {
-            const term = this.filterTerm.toLocaleLowerCase();
-            return this.members.filter(m => m.name.toLocaleLowerCase().includes(term) || m.code.toLocaleLowerCase().includes(term));
-        }
-        else {
-            return this.members;
-        }
-    }
-    areAllSelected() {
-        if (this.members) {
-            return this.selectedMemberIds.length === this.members.length;
-        }
-        else {
-            return false;
-        }
-    }
-    toggleSelectAll() {
-        if (this.areAllSelected()) {
-            this.selectionChange.emit([]);
-        }
-        else {
-            this.selectionChange.emit(this.members.map(v => v.id));
-        }
-    }
-    toggleSelectMember(member) {
-        if (this.selectedMemberIds.includes(member.id)) {
-            this.selectionChange.emit(this.selectedMemberIds.filter(id => id !== member.id));
-        }
-        else {
-            this.selectionChange.emit([...this.selectedMemberIds, member.id]);
-        }
-    }
-}
-ZoneMemberListComponent.decorators = [
-    { type: Component, args: [{
-                selector: 'vdr-zone-member-list',
-                template: "<div class=\"members-header\">\r\n    <ng-container *ngIf=\"headerTemplate\">\r\n        <ng-container *ngTemplateOutlet=\"headerTemplate.templateRef\"></ng-container>\r\n    </ng-container>\r\n    <input\r\n        type=\"text\"\r\n        [placeholder]=\"'settings.filter-by-member-name' | translate\"\r\n        [(ngModel)]=\"filterTerm\"\r\n    />\r\n</div>\r\n<vdr-data-table\r\n    [items]=\"filteredMembers()\"\r\n    [allSelected]=\"areAllSelected()\"\r\n    [isRowSelectedFn]=\"(['UpdateSettings', 'UpdateZone'] | hasPermission) && isMemberSelected\"\r\n    (rowSelectChange)=\"toggleSelectMember($event)\"\r\n    (allSelectChange)=\"toggleSelectAll()\"\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>{{ 'common.enabled' | translate }}</vdr-dt-column>\r\n    <vdr-dt-column></vdr-dt-column>\r\n    <ng-template let-member=\"item\">\r\n        <td class=\"left align-middle\">{{ member.code }}</td>\r\n        <td class=\"left align-middle\">{{ member.name }}</td>\r\n        <td class=\"left align-middle\">\r\n            <clr-icon\r\n                [class.is-success]=\"member.enabled\"\r\n                [attr.shape]=\"member.enabled ? 'check' : 'times'\"\r\n            ></clr-icon>\r\n        </td>\r\n        <td class=\"right align-middle\">\r\n            <ng-container *ngIf=\"controlsTemplate\">\r\n                <ng-container\r\n                    *ngTemplateOutlet=\"controlsTemplate.templateRef; context: { member: member }\"\r\n                ></ng-container>\r\n            </ng-container>\r\n        </td>\r\n    </ng-template>\r\n</vdr-data-table>\r\n",
-                changeDetection: ChangeDetectionStrategy.OnPush,
-                styles: [".members-header{background-color:var(--color-component-bg-100);position:sticky;top:0;padding:6px;z-index:5;border-bottom:1px solid var(--color-component-border-200)}.members-header .header-title-row{display:flex;justify-content:space-between;align-items:center}.members-header .clr-input{width:100%}\n"]
-            },] }
-];
-ZoneMemberListComponent.propDecorators = {
-    members: [{ type: Input }],
-    selectedMemberIds: [{ type: Input }],
-    selectionChange: [{ type: Output }],
-    headerTemplate: [{ type: ContentChild, args: [ZoneMemberListHeaderDirective,] }],
-    controlsTemplate: [{ type: ContentChild, args: [ZoneMemberControlsDirective,] }]
-};
-
-class AdministratorResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'Administrator',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            emailAddress: '',
-            firstName: '',
-            lastName: '',
-            user: { roles: [] },
-        }, id => dataService.administrator.getAdministrator(id).mapStream(data => data.administrator));
-    }
-}
-AdministratorResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function AdministratorResolver_Factory() { return new AdministratorResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: AdministratorResolver, providedIn: "root" });
-AdministratorResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-AdministratorResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class ChannelResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'Channel',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            code: '',
-            token: '',
-            pricesIncludeTax: false,
-            currencyCode: CurrencyCode.USD,
-            defaultLanguageCode: getDefaultUiLanguage(),
-            defaultShippingZone: {},
-            defaultTaxZone: {},
-        }, (id) => dataService.settings.getChannel(id).mapStream((data) => data.channel));
-    }
-}
-ChannelResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function ChannelResolver_Factory() { return new ChannelResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: ChannelResolver, providedIn: "root" });
-ChannelResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-ChannelResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class CountryResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'Country',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            code: '',
-            name: '',
-            enabled: false,
-            translations: [],
-        }, id => dataService.settings.getCountry(id).mapStream(data => data.country));
-    }
-}
-CountryResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function CountryResolver_Factory() { return new CountryResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: CountryResolver, providedIn: "root" });
-CountryResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-CountryResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the global settings.
- */
-class GlobalSettingsResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, 
-        // we will never be creating a new GlobalSettings entity, so this part is not used.
-        {}, () => dataService.settings.getGlobalSettings().mapStream(data => data.globalSettings));
-    }
-}
-GlobalSettingsResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function GlobalSettingsResolver_Factory() { return new GlobalSettingsResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: GlobalSettingsResolver, providedIn: "root" });
-GlobalSettingsResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-GlobalSettingsResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class PaymentMethodResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'PaymentMethod',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            name: '',
-            code: '',
-            description: '',
-            enabled: true,
-            checker: undefined,
-            handler: undefined,
-        }, id => dataService.settings.getPaymentMethod(id).mapStream(data => data.paymentMethod));
-    }
-}
-PaymentMethodResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function PaymentMethodResolver_Factory() { return new PaymentMethodResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: PaymentMethodResolver, providedIn: "root" });
-PaymentMethodResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-PaymentMethodResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-class ProfileResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'Administrator',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            emailAddress: '',
-            firstName: '',
-            lastName: '',
-            user: { roles: [] },
-        }, id => dataService.administrator
-            .getActiveAdministrator()
-            .mapStream(data => data.activeAdministrator));
-    }
-}
-ProfileResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function ProfileResolver_Factory() { return new ProfileResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: ProfileResolver, providedIn: "root" });
-ProfileResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-ProfileResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-class RoleResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'Role',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            code: '',
-            description: '',
-            permissions: [],
-            channels: [],
-        }, id => dataService.administrator.getRole(id).mapStream(data => data.role));
-    }
-}
-RoleResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function RoleResolver_Factory() { return new RoleResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: RoleResolver, providedIn: "root" });
-RoleResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-RoleResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class ShippingMethodResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'ShippingMethod',
-            createdAt: '',
-            updatedAt: '',
-            id: '',
-            code: '',
-            name: '',
-            description: '',
-            fulfillmentHandlerCode: undefined,
-            checker: undefined,
-            calculator: undefined,
-            translations: [],
-        }, id => dataService.shippingMethod.getShippingMethod(id).mapStream(data => data.shippingMethod));
-    }
-}
-ShippingMethodResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function ShippingMethodResolver_Factory() { return new ShippingMethodResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: ShippingMethodResolver, providedIn: "root" });
-ShippingMethodResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-ShippingMethodResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class TaxCategoryResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'TaxCategory',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            name: '',
-            isDefault: false,
-        }, id => dataService.settings.getTaxCategory(id).mapStream(data => data.taxCategory));
-    }
-}
-TaxCategoryResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function TaxCategoryResolver_Factory() { return new TaxCategoryResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: TaxCategoryResolver, providedIn: "root" });
-TaxCategoryResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-TaxCategoryResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-/**
- * Resolves the id from the path into a Customer entity.
- */
-class TaxRateResolver extends BaseEntityResolver {
-    constructor(router, dataService) {
-        super(router, {
-            __typename: 'TaxRate',
-            id: '',
-            createdAt: '',
-            updatedAt: '',
-            name: '',
-            value: 0,
-            enabled: true,
-            category: {},
-            zone: {},
-            customerGroup: null,
-        }, id => dataService.settings.getTaxRate(id).mapStream(data => data.taxRate));
-    }
-}
-TaxRateResolver.ɵprov = i0.ɵɵdefineInjectable({ factory: function TaxRateResolver_Factory() { return new TaxRateResolver(i0.ɵɵinject(i1.Router), i0.ɵɵinject(i2.DataService)); }, token: TaxRateResolver, providedIn: "root" });
-TaxRateResolver.decorators = [
-    { type: Injectable, args: [{
-                providedIn: 'root',
-            },] }
-];
-TaxRateResolver.ctorParameters = () => [
-    { type: Router },
-    { type: DataService }
-];
-
-const ɵ0 = {
-    breadcrumb: marker('breadcrumb.profile'),
-}, ɵ1 = {
-    breadcrumb: marker('breadcrumb.administrators'),
-}, ɵ2 = { breadcrumb: administratorBreadcrumb }, ɵ3 = {
-    breadcrumb: marker('breadcrumb.channels'),
-}, ɵ4 = { breadcrumb: channelBreadcrumb }, ɵ5 = {
-    breadcrumb: marker('breadcrumb.roles'),
-}, ɵ6 = { breadcrumb: roleBreadcrumb }, ɵ7 = {
-    breadcrumb: marker('breadcrumb.tax-categories'),
-}, ɵ8 = {
-    breadcrumb: taxCategoryBreadcrumb,
-}, ɵ9 = {
-    breadcrumb: marker('breadcrumb.tax-rates'),
-}, ɵ10 = {
-    breadcrumb: taxRateBreadcrumb,
-}, ɵ11 = {
-    breadcrumb: marker('breadcrumb.countries'),
-}, ɵ12 = {
-    breadcrumb: countryBreadcrumb,
-}, ɵ13 = {
-    breadcrumb: marker('breadcrumb.zones'),
-}, ɵ14 = {
-    breadcrumb: marker('breadcrumb.shipping-methods'),
-}, ɵ15 = {
-    breadcrumb: shippingMethodBreadcrumb,
-}, ɵ16 = {
-    breadcrumb: marker('breadcrumb.payment-methods'),
-}, ɵ17 = {
-    breadcrumb: paymentMethodBreadcrumb,
-}, ɵ18 = {
-    breadcrumb: marker('breadcrumb.global-settings'),
-};
-const settingsRoutes = [
-    {
-        path: 'profile',
-        component: ProfileComponent,
-        resolve: createResolveData(ProfileResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ0,
-    },
-    {
-        path: 'administrators',
-        component: AdministratorListComponent,
-        data: ɵ1,
-    },
-    {
-        path: 'administrators/:id',
-        component: AdminDetailComponent,
-        resolve: createResolveData(AdministratorResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ2,
-    },
-    {
-        path: 'channels',
-        component: ChannelListComponent,
-        data: ɵ3,
-    },
-    {
-        path: 'channels/:id',
-        component: ChannelDetailComponent,
-        resolve: createResolveData(ChannelResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ4,
-    },
-    {
-        path: 'roles',
-        component: RoleListComponent,
-        data: ɵ5,
-    },
-    {
-        path: 'roles/:id',
-        component: RoleDetailComponent,
-        resolve: createResolveData(RoleResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ6,
-    },
-    {
-        path: 'tax-categories',
-        component: TaxCategoryListComponent,
-        data: ɵ7,
-    },
-    {
-        path: 'tax-categories/:id',
-        component: TaxCategoryDetailComponent,
-        resolve: createResolveData(TaxCategoryResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ8,
-    },
-    {
-        path: 'tax-rates',
-        component: TaxRateListComponent,
-        data: ɵ9,
-    },
-    {
-        path: 'tax-rates/:id',
-        component: TaxRateDetailComponent,
-        resolve: createResolveData(TaxRateResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ10,
-    },
-    {
-        path: 'countries',
-        component: CountryListComponent,
-        data: ɵ11,
-    },
-    {
-        path: 'countries/:id',
-        component: CountryDetailComponent,
-        resolve: createResolveData(CountryResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ12,
-    },
-    {
-        path: 'zones',
-        component: ZoneListComponent,
-        data: ɵ13,
-    },
-    {
-        path: 'shipping-methods',
-        component: ShippingMethodListComponent,
-        data: ɵ14,
-    },
-    {
-        path: 'shipping-methods/:id',
-        component: ShippingMethodDetailComponent,
-        resolve: createResolveData(ShippingMethodResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ15,
-    },
-    {
-        path: 'payment-methods',
-        component: PaymentMethodListComponent,
-        data: ɵ16,
-    },
-    {
-        path: 'payment-methods/:id',
-        component: PaymentMethodDetailComponent,
-        resolve: createResolveData(PaymentMethodResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ17,
-    },
-    {
-        path: 'global-settings',
-        component: GlobalSettingsComponent,
-        resolve: createResolveData(GlobalSettingsResolver),
-        canDeactivate: [CanDeactivateDetailGuard],
-        data: ɵ18,
-    },
-];
-function administratorBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.administrators',
-        getName: admin => `${admin.firstName} ${admin.lastName}`,
-        route: 'administrators',
-    });
-}
-function channelBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.channels',
-        getName: channel => channel.code,
-        route: 'channels',
-    });
-}
-function roleBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.roles',
-        getName: role => role.description,
-        route: 'roles',
-    });
-}
-function taxCategoryBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.tax-categories',
-        getName: category => category.name,
-        route: 'tax-categories',
-    });
-}
-function taxRateBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.tax-rates',
-        getName: category => category.name,
-        route: 'tax-rates',
-    });
-}
-function countryBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.countries',
-        getName: promotion => promotion.name,
-        route: 'countries',
-    });
-}
-function shippingMethodBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.shipping-methods',
-        getName: method => method.name,
-        route: 'shipping-methods',
-    });
-}
-function paymentMethodBreadcrumb(data, params) {
-    return detailBreadcrumb({
-        entity: data.entity,
-        id: params.id,
-        breadcrumbKey: 'breadcrumb.payment-methods',
-        getName: method => method.code,
-        route: 'payment-methods',
-    });
-}
-
-class SettingsModule {
-}
-SettingsModule.decorators = [
-    { type: NgModule, args: [{
-                imports: [SharedModule, RouterModule.forChild(settingsRoutes)],
-                declarations: [
-                    TaxCategoryListComponent,
-                    TaxCategoryDetailComponent,
-                    AdministratorListComponent,
-                    RoleListComponent,
-                    RoleDetailComponent,
-                    AdminDetailComponent,
-                    PermissionGridComponent,
-                    CountryListComponent,
-                    CountryDetailComponent,
-                    TaxRateListComponent,
-                    TaxRateDetailComponent,
-                    ChannelListComponent,
-                    ChannelDetailComponent,
-                    ShippingMethodListComponent,
-                    ShippingMethodDetailComponent,
-                    PaymentMethodListComponent,
-                    PaymentMethodDetailComponent,
-                    GlobalSettingsComponent,
-                    TestOrderBuilderComponent,
-                    TestAddressFormComponent,
-                    ShippingMethodTestResultComponent,
-                    ShippingEligibilityTestResultComponent,
-                    ZoneListComponent,
-                    AddCountryToZoneDialogComponent,
-                    ZoneMemberListComponent,
-                    ZoneMemberListHeaderDirective,
-                    ZoneMemberControlsDirective,
-                    ZoneDetailDialogComponent,
-                    ProfileComponent,
-                ],
-            },] }
-];
-
-// This file was generated by the build-public-api.ts script
-
-/**
- * Generated bundle index. Do not edit.
- */
-
-export { AddCountryToZoneDialogComponent, AdminDetailComponent, AdministratorListComponent, AdministratorResolver, ChannelDetailComponent, ChannelListComponent, ChannelResolver, CountryDetailComponent, CountryListComponent, CountryResolver, GlobalSettingsComponent, GlobalSettingsResolver, PaymentMethodDetailComponent, PaymentMethodListComponent, PaymentMethodResolver, PermissionGridComponent, ProfileComponent, ProfileResolver, RoleDetailComponent, RoleListComponent, RoleResolver, SettingsModule, ShippingEligibilityTestResultComponent, ShippingMethodDetailComponent, ShippingMethodListComponent, ShippingMethodResolver, ShippingMethodTestResultComponent, TaxCategoryDetailComponent, TaxCategoryListComponent, TaxCategoryResolver, TaxRateDetailComponent, TaxRateListComponent, TaxRateResolver, TestAddressFormComponent, TestOrderBuilderComponent, ZoneDetailDialogComponent, ZoneListComponent, ZoneMemberControlsDirective, ZoneMemberListComponent, ZoneMemberListHeaderDirective, administratorBreadcrumb, channelBreadcrumb, countryBreadcrumb, paymentMethodBreadcrumb, roleBreadcrumb, settingsRoutes, shippingMethodBreadcrumb, taxCategoryBreadcrumb, taxRateBreadcrumb, ɵ0, ɵ1, ɵ10, ɵ11, ɵ12, ɵ13, ɵ14, ɵ15, ɵ16, ɵ17, ɵ18, ɵ2, ɵ3, ɵ4, ɵ5, ɵ6, ɵ7, ɵ8, ɵ9 };
-//# sourceMappingURL=vendure-admin-ui-settings.js.map