@vendure/admin-ui 2.0.0-next.7 → 2.0.0-next.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/catalog/components/product-variants-editor/product-variants-editor.component.d.ts +13 -10
  2. package/core/common/version.d.ts +1 -1
  3. package/core/shared/components/data-table/data-table.component.d.ts +5 -2
  4. package/esm2020/catalog/components/product-variants-editor/product-variants-editor.component.mjs +8 -3
  5. package/esm2020/core/common/version.mjs +2 -2
  6. package/esm2020/core/components/main-nav/main-nav.component.mjs +3 -3
  7. package/esm2020/core/shared/components/address-form/address-form.component.mjs +3 -3
  8. package/esm2020/core/shared/components/data-table/data-table.component.mjs +10 -3
  9. package/esm2020/core/shared/components/formatted-address/formatted-address.component.mjs +3 -3
  10. package/fesm2015/vendure-admin-ui-catalog.mjs +7 -2
  11. package/fesm2015/vendure-admin-ui-catalog.mjs.map +1 -1
  12. package/fesm2015/vendure-admin-ui-core.mjs +16 -9
  13. package/fesm2015/vendure-admin-ui-core.mjs.map +1 -1
  14. package/fesm2020/vendure-admin-ui-catalog.mjs +7 -2
  15. package/fesm2020/vendure-admin-ui-catalog.mjs.map +1 -1
  16. package/fesm2020/vendure-admin-ui-core.mjs +15 -9
  17. package/fesm2020/vendure-admin-ui-core.mjs.map +1 -1
  18. package/package.json +2 -2
  19. package/static/i18n-messages/cs.json +3 -1
  20. package/static/i18n-messages/de.json +3 -1
  21. package/static/i18n-messages/en.json +2 -0
  22. package/static/i18n-messages/es.json +3 -1
  23. package/static/i18n-messages/fr.json +3 -1
  24. package/static/i18n-messages/it.json +3 -1
  25. package/static/i18n-messages/pl.json +3 -1
  26. package/static/i18n-messages/pt_BR.json +3 -1
  27. package/static/i18n-messages/pt_PT.json +3 -1
  28. package/static/i18n-messages/ru.json +3 -1
  29. package/static/i18n-messages/uk.json +3 -1
  30. package/static/i18n-messages/zh_Hans.json +3 -1
  31. package/static/i18n-messages/zh_Hant.json +3 -1
  32. package/static/styles/global/_utilities.scss +9 -0
  33. package/static/theme.min.css +1 -1
@@ -8087,10 +8087,10 @@ class MainNavComponent {
8087
8087
  }
8088
8088
  }
8089
8089
  MainNavComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: MainNavComponent, deps: [{ token: i1$2.ActivatedRoute }, { token: i1$2.Router }, { token: NavBuilderService }, { token: HealthCheckService }, { token: JobQueueService }, { token: DataService }], target: i0.ɵɵFactoryTarget.Component });
8090
- MainNavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: MainNavComponent, selector: "vdr-main-nav", ngImport: i0, template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n <section class=\"sidenav-content\">\r\n <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n <section\r\n class=\"nav-group\"\r\n [attr.data-section-id]=\"section.id\"\r\n [class.collapsible]=\"section.collapsible\"\r\n *ngIf=\"shouldDisplayLink(section)\"\r\n >\r\n <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"sectionBadge !== 'none'\"\r\n [type]=\"sectionBadge\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n <label class=\"nav-group-header\" [for]=\"section.id\">{{ section.label | translate }}</label>\r\n <ul class=\"nav-list\">\r\n <ng-container *ngFor=\"let item of section.items\">\r\n <li *ngIf=\"shouldDisplayLink(item)\">\r\n <a\r\n class=\"nav-link\"\r\n [attr.data-item-id]=\"section.id\"\r\n [routerLink]=\"getRouterLink(item)\"\r\n routerLinkActive=\"active\"\r\n >\r\n <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"itemBadge.type !== 'none'\"\r\n [type]=\"itemBadge.type\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n {{ item.label | translate }}\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </vdr-ui-extension-point>\r\n </section>\r\n </ng-container>\r\n </section>\r\n</nav>\r\n", styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.sidenav .nav-group .nav-list{margin:0}.sidenav .nav-group .nav-group-header{margin:0;line-height:1.2}.sidenav .nav-group .nav-link{display:inline-flex;line-height:1rem;padding-right:.6rem}.nav-list clr-icon{flex-shrink:0;margin-right:12px}.nav-group{-webkit-hyphens:auto;hyphens:auto}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"], components: [{ type: UiExtensionPointComponent, selector: "vdr-ui-extension-point", inputs: ["locationId", "topPx", "leftPx", "api"] }, { type: StatusBadgeComponent, selector: "vdr-status-badge", inputs: ["type"] }], directives: [{ type: i1$3.ClrNavLevel, selector: "[clr-nav-level]", inputs: ["clr-nav-level"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i1$3.ClrLabel, selector: "label", inputs: ["for"] }, { type: i1$2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { type: i1$3.ClrIconCustomTag, selector: "clr-icon" }], pipes: { "async": i3.AsyncPipe, "translate": i7.TranslatePipe } });
8090
+ MainNavComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: MainNavComponent, selector: "vdr-main-nav", ngImport: i0, template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n <section class=\"sidenav-content\">\r\n <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n <section\r\n class=\"nav-group\"\r\n [attr.data-section-id]=\"section.id\"\r\n [class.collapsible]=\"section.collapsible\"\r\n *ngIf=\"shouldDisplayLink(section)\"\r\n >\r\n <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"sectionBadge !== 'none'\"\r\n [type]=\"sectionBadge\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n <label class=\"nav-group-header\" [for]=\"section.id\">{{ section.label | translate }}</label>\r\n <ul class=\"nav-list\">\r\n <ng-container *ngFor=\"let item of section.items\">\r\n <li *ngIf=\"shouldDisplayLink(item)\">\r\n <a\r\n class=\"nav-link\"\r\n [attr.data-item-id]=\"section.id\"\r\n [routerLink]=\"getRouterLink(item)\"\r\n routerLinkActive=\"active\"\r\n (click)=\"item.onClick && item.onClick($event)\"\r\n >\r\n <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"itemBadge.type !== 'none'\"\r\n [type]=\"itemBadge.type\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n {{ item.label | translate }}\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </vdr-ui-extension-point>\r\n </section>\r\n </ng-container>\r\n </section>\r\n</nav>\r\n", styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.sidenav .nav-group .nav-list{margin:0}.sidenav .nav-group .nav-group-header{margin:0;line-height:1.2}.sidenav .nav-group .nav-link{display:inline-flex;line-height:1rem;padding-right:.6rem}.nav-list clr-icon{flex-shrink:0;margin-right:12px}.nav-group{-webkit-hyphens:auto;hyphens:auto}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"], components: [{ type: UiExtensionPointComponent, selector: "vdr-ui-extension-point", inputs: ["locationId", "topPx", "leftPx", "api"] }, { type: StatusBadgeComponent, selector: "vdr-status-badge", inputs: ["type"] }], directives: [{ type: i1$3.ClrNavLevel, selector: "[clr-nav-level]", inputs: ["clr-nav-level"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i1$3.ClrLabel, selector: "label", inputs: ["for"] }, { type: i1$2.RouterLinkWithHref, selector: "a[routerLink],area[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i1$2.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { type: i1$3.ClrIconCustomTag, selector: "clr-icon" }], pipes: { "async": i3.AsyncPipe, "translate": i7.TranslatePipe } });
8091
8091
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: MainNavComponent, decorators: [{
8092
8092
  type: Component,
8093
- args: [{ selector: 'vdr-main-nav', template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n <section class=\"sidenav-content\">\r\n <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n <section\r\n class=\"nav-group\"\r\n [attr.data-section-id]=\"section.id\"\r\n [class.collapsible]=\"section.collapsible\"\r\n *ngIf=\"shouldDisplayLink(section)\"\r\n >\r\n <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"sectionBadge !== 'none'\"\r\n [type]=\"sectionBadge\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n <label class=\"nav-group-header\" [for]=\"section.id\">{{ section.label | translate }}</label>\r\n <ul class=\"nav-list\">\r\n <ng-container *ngFor=\"let item of section.items\">\r\n <li *ngIf=\"shouldDisplayLink(item)\">\r\n <a\r\n class=\"nav-link\"\r\n [attr.data-item-id]=\"section.id\"\r\n [routerLink]=\"getRouterLink(item)\"\r\n routerLinkActive=\"active\"\r\n >\r\n <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"itemBadge.type !== 'none'\"\r\n [type]=\"itemBadge.type\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n {{ item.label | translate }}\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </vdr-ui-extension-point>\r\n </section>\r\n </ng-container>\r\n </section>\r\n</nav>\r\n", styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.sidenav .nav-group .nav-list{margin:0}.sidenav .nav-group .nav-group-header{margin:0;line-height:1.2}.sidenav .nav-group .nav-link{display:inline-flex;line-height:1rem;padding-right:.6rem}.nav-list clr-icon{flex-shrink:0;margin-right:12px}.nav-group{-webkit-hyphens:auto;hyphens:auto}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"] }]
8093
+ args: [{ selector: 'vdr-main-nav', template: "<nav class=\"sidenav\" [clr-nav-level]=\"2\">\r\n <section class=\"sidenav-content\">\r\n <ng-container *ngFor=\"let section of navBuilderService.navMenuConfig$ | async\">\r\n <section\r\n class=\"nav-group\"\r\n [attr.data-section-id]=\"section.id\"\r\n [class.collapsible]=\"section.collapsible\"\r\n *ngIf=\"shouldDisplayLink(section)\"\r\n >\r\n <vdr-ui-extension-point [locationId]=\"section.id\" api=\"navMenu\" [topPx]=\"-6\" [leftPx]=\"8\">\r\n <ng-container *ngIf=\"navBuilderService.sectionBadges[section.id] | async as sectionBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"sectionBadge !== 'none'\"\r\n [type]=\"sectionBadge\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <input [id]=\"section.id\" type=\"checkbox\" [checked]=\"section.collapsedByDefault\" />\r\n <label class=\"nav-group-header\" [for]=\"section.id\">{{ section.label | translate }}</label>\r\n <ul class=\"nav-list\">\r\n <ng-container *ngFor=\"let item of section.items\">\r\n <li *ngIf=\"shouldDisplayLink(item)\">\r\n <a\r\n class=\"nav-link\"\r\n [attr.data-item-id]=\"section.id\"\r\n [routerLink]=\"getRouterLink(item)\"\r\n routerLinkActive=\"active\"\r\n (click)=\"item.onClick && item.onClick($event)\"\r\n >\r\n <ng-container *ngIf=\"item.statusBadge | async as itemBadge\">\r\n <vdr-status-badge\r\n *ngIf=\"itemBadge.type !== 'none'\"\r\n [type]=\"itemBadge.type\"\r\n ></vdr-status-badge>\r\n </ng-container>\r\n <clr-icon [attr.shape]=\"item.icon || 'block'\" size=\"20\"></clr-icon>\r\n {{ item.label | translate }}\r\n </a>\r\n </li>\r\n </ng-container>\r\n </ul>\r\n </vdr-ui-extension-point>\r\n </section>\r\n </ng-container>\r\n </section>\r\n</nav>\r\n", styles: [":host{order:-1;background-color:var(--clr-nav-background-color)}nav.sidenav{height:100%;width:10.8rem;border-right-color:var(--clr-sidenav-border-color)}.sidenav .nav-group .nav-list{margin:0}.sidenav .nav-group .nav-group-header{margin:0;line-height:1.2}.sidenav .nav-group .nav-link{display:inline-flex;line-height:1rem;padding-right:.6rem}.nav-list clr-icon{flex-shrink:0;margin-right:12px}.nav-group{-webkit-hyphens:auto;hyphens:auto}.nav-group,.nav-link{position:relative}.nav-group vdr-status-badge{left:10px;top:6px}.nav-link vdr-status-badge{left:25px;top:3px}\n"] }]
8094
8094
  }], ctorParameters: function () { return [{ type: i1$2.ActivatedRoute }, { type: i1$2.Router }, { type: NavBuilderService }, { type: HealthCheckService }, { type: JobQueueService }, { type: DataService }]; } });
8095
8095
 
8096
8096
  /**
@@ -14328,10 +14328,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImpor
14328
14328
  class AddressFormComponent {
14329
14329
  }
14330
14330
  AddressFormComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: AddressFormComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
14331
- AddressFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: AddressFormComponent, selector: "vdr-address-form", inputs: { customFields: "customFields", formGroup: "formGroup", availableCountries: "availableCountries" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <clr-input-container>\r\n <label>{{ 'customer.full-name' | translate }}</label>\r\n <input formControlName=\"fullName\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-1' | translate }}</label>\r\n <input formControlName=\"streetLine1\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-2' | translate }}</label>\r\n <input formControlName=\"streetLine2\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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\" [value]=\"country.code\">\r\n {{ country.name }}\r\n </option>\r\n </select>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <clr-input-container>\r\n <label>{{ 'customer.phone-number' | translate }}</label>\r\n <input formControlName=\"phoneNumber\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n <section formGroupName=\"customFields\" *ngIf=\"formGroup.get('customFields') as customFieldsGroup\">\r\n <label>{{ 'common.custom-fields' | translate }}</label>\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Address\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsGroup\"\r\n ></vdr-tabbed-custom-fields>\r\n </section>\r\n</form>\r\n", styles: [""], components: [{ type: i1$3.ClrInputContainer, selector: "clr-input-container" }, { type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }], directives: [{ type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$3.ClrLabel, selector: "label", inputs: ["for"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$3.ClrInput, selector: "[clrInput]" }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$3.ClrSelect, selector: "[clrSelect]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }], pipes: { "translate": i7.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
14331
+ AddressFormComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: AddressFormComponent, selector: "vdr-address-form", inputs: { customFields: "customFields", formGroup: "formGroup", availableCountries: "availableCountries" }, ngImport: i0, template: "<form [formGroup]=\"formGroup\">\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.full-name' | translate }}</label>\r\n <input formControlName=\"fullName\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.company' | translate }}</label>\r\n <input formControlName=\"company\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-1' | translate }}</label>\r\n <input formControlName=\"streetLine1\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-2' | translate }}</label>\r\n <input formControlName=\"streetLine2\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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\" [value]=\"country.code\">\r\n {{ country.name }}\r\n </option>\r\n </select>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <clr-input-container>\r\n <label>{{ 'customer.phone-number' | translate }}</label>\r\n <input formControlName=\"phoneNumber\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n <section formGroupName=\"customFields\" *ngIf=\"formGroup.get('customFields') as customFieldsGroup\">\r\n <label>{{ 'common.custom-fields' | translate }}</label>\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Address\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsGroup\"\r\n ></vdr-tabbed-custom-fields>\r\n </section>\r\n</form>\r\n", styles: [""], components: [{ type: i1$3.ClrInputContainer, selector: "clr-input-container" }, { type: TabbedCustomFieldsComponent, selector: "vdr-tabbed-custom-fields", inputs: ["entityName", "customFields", "customFieldsFormGroup", "readonly", "compact", "showLabel"] }], directives: [{ type: i2.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { type: i2.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { type: i2.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { type: i1$3.ClrLabel, selector: "label", inputs: ["for"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i2.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { type: i1$3.ClrInput, selector: "[clrInput]" }, { type: i2.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { type: i1$3.ClrSelect, selector: "[clrSelect]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i2.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.FormGroupName, selector: "[formGroupName]", inputs: ["formGroupName"] }], pipes: { "translate": i7.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
14332
14332
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: AddressFormComponent, decorators: [{
14333
14333
  type: Component,
14334
- args: [{ selector: 'vdr-address-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"formGroup\">\r\n <clr-input-container>\r\n <label>{{ 'customer.full-name' | translate }}</label>\r\n <input formControlName=\"fullName\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-1' | translate }}</label>\r\n <input formControlName=\"streetLine1\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-2' | translate }}</label>\r\n <input formControlName=\"streetLine2\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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\" [value]=\"country.code\">\r\n {{ country.name }}\r\n </option>\r\n </select>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <clr-input-container>\r\n <label>{{ 'customer.phone-number' | translate }}</label>\r\n <input formControlName=\"phoneNumber\" type=\"text\" clrInput/>\r\n </clr-input-container>\r\n <section formGroupName=\"customFields\" *ngIf=\"formGroup.get('customFields') as customFieldsGroup\">\r\n <label>{{ 'common.custom-fields' | translate }}</label>\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Address\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsGroup\"\r\n ></vdr-tabbed-custom-fields>\r\n </section>\r\n</form>\r\n", styles: [""] }]
14334
+ args: [{ selector: 'vdr-address-form', changeDetection: ChangeDetectionStrategy.OnPush, template: "<form [formGroup]=\"formGroup\">\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.full-name' | translate }}</label>\r\n <input formControlName=\"fullName\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.company' | translate }}</label>\r\n <input formControlName=\"company\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-1' | translate }}</label>\r\n <input formControlName=\"streetLine1\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n <div class=\"clr-col-md-4\">\r\n <clr-input-container>\r\n <label>{{ 'customer.street-line-2' | translate }}</label>\r\n <input formControlName=\"streetLine2\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n </div>\r\n <div class=\"clr-row\">\r\n <div class=\"clr-col-md-4\">\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 </div>\r\n <div class=\"clr-col-md-4\">\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\" [value]=\"country.code\">\r\n {{ country.name }}\r\n </option>\r\n </select>\r\n </clr-input-container>\r\n </div>\r\n </div>\r\n <clr-input-container>\r\n <label>{{ 'customer.phone-number' | translate }}</label>\r\n <input formControlName=\"phoneNumber\" type=\"text\" clrInput />\r\n </clr-input-container>\r\n <section formGroupName=\"customFields\" *ngIf=\"formGroup.get('customFields') as customFieldsGroup\">\r\n <label>{{ 'common.custom-fields' | translate }}</label>\r\n <vdr-tabbed-custom-fields\r\n entityName=\"Address\"\r\n [customFields]=\"customFields\"\r\n [customFieldsFormGroup]=\"customFieldsGroup\"\r\n ></vdr-tabbed-custom-fields>\r\n </section>\r\n</form>\r\n", styles: [""] }]
14335
14335
  }], propDecorators: { customFields: [{
14336
14336
  type: Input
14337
14337
  }], formGroup: [{
@@ -14739,12 +14739,18 @@ class DataTableComponent {
14739
14739
  return index;
14740
14740
  }
14741
14741
  }
14742
+ ngOnChanges(changes) {
14743
+ if (changes.items) {
14744
+ this.currentStart = this.itemsPerPage * (this.currentPage - 1);
14745
+ this.currentEnd = this.currentStart + changes.items.currentValue?.length;
14746
+ }
14747
+ }
14742
14748
  }
14743
14749
  DataTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: DataTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
14744
- DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: DataTableComponent, selector: "vdr-data-table", inputs: { items: "items", itemsPerPage: "itemsPerPage", currentPage: "currentPage", totalItems: "totalItems", allSelected: "allSelected", isRowSelectedFn: "isRowSelectedFn", emptyStateLabel: "emptyStateLabel" }, outputs: { allSelectChange: "allSelectChange", rowSelectChange: "rowSelectChange", pageChange: "pageChange", itemsPerPageChange: "itemsPerPageChange" }, providers: [PaginationService], queries: [{ propertyName: "columns", predicate: DataTableColumnComponent }, { propertyName: "templateRefs", predicate: TemplateRef }], ngImport: i0, template: "<ng-container *ngIf=\"!items || (items && items.length); else emptyPlaceholder\">\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"allSelected\"\r\n (change)=\"allSelectChange.emit()\"\r\n />\r\n </th>\r\n <th *ngFor=\"let header of columns?.toArray()\" class=\"left\" [class.expand]=\"header.expand\">\r\n <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"\r\n let item of items\r\n | paginate\r\n : {\r\n itemsPerPage: itemsPerPage,\r\n currentPage: currentPage,\r\n totalItems: totalItems\r\n };\r\n index as i;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <td *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"isRowSelectedFn(item)\"\r\n (change)=\"rowSelectChange.emit(item)\"\r\n />\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: i }\"\r\n ></ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"table-footer\">\r\n <vdr-items-per-page-controls\r\n *ngIf=\"totalItems\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\r\n ></vdr-items-per-page-controls>\r\n\r\n <vdr-pagination-controls\r\n *ngIf=\"totalItems\"\r\n [currentPage]=\"currentPage\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n [totalItems]=\"totalItems\"\r\n (pageChange)=\"pageChange.emit($event)\"\r\n ></vdr-pagination-controls>\r\n </div>\r\n</ng-container>\r\n<ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\r\n</ng-template>\r\n", styles: [":host{display:block;max-width:100%;overflow:auto}thead th{position:sticky;top:24px;z-index:1}thead th.expand{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:6px}\n"], components: [{ type: ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { type: PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { type: EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i1$3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$3.ClrDatagridItemsTrackBy, selector: "[ngForTrackBy]", inputs: ["ngForTrackBy"] }], pipes: { "paginate": i1$5.PaginatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
14750
+ DataTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: DataTableComponent, selector: "vdr-data-table", inputs: { items: "items", itemsPerPage: "itemsPerPage", currentPage: "currentPage", totalItems: "totalItems", allSelected: "allSelected", isRowSelectedFn: "isRowSelectedFn", emptyStateLabel: "emptyStateLabel" }, outputs: { allSelectChange: "allSelectChange", rowSelectChange: "rowSelectChange", pageChange: "pageChange", itemsPerPageChange: "itemsPerPageChange" }, providers: [PaginationService], queries: [{ propertyName: "columns", predicate: DataTableColumnComponent }, { propertyName: "templateRefs", predicate: TemplateRef }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!items || (items && items.length); else emptyPlaceholder\">\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"allSelected\"\r\n (change)=\"allSelectChange.emit()\"\r\n />\r\n </th>\r\n <th *ngFor=\"let header of columns?.toArray()\" class=\"left\" [class.expand]=\"header.expand\">\r\n <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"\r\n let item of items\r\n | paginate\r\n : {\r\n itemsPerPage: itemsPerPage,\r\n currentPage: currentPage,\r\n totalItems: totalItems\r\n };\r\n index as i;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <td *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"isRowSelectedFn(item)\"\r\n (change)=\"rowSelectChange.emit(item)\"\r\n />\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: i }\"\r\n ></ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"table-footer\">\r\n <vdr-items-per-page-controls\r\n *ngIf=\"totalItems\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\r\n ></vdr-items-per-page-controls>\r\n <div>\r\n {{ 'common.total-items' | translate: { currentStart, currentEnd, totalItems } }}\r\n </div>\r\n\r\n <vdr-pagination-controls\r\n *ngIf=\"totalItems\"\r\n [currentPage]=\"currentPage\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n [totalItems]=\"totalItems\"\r\n (pageChange)=\"pageChange.emit($event)\"\r\n ></vdr-pagination-controls>\r\n </div>\r\n</ng-container>\r\n<ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\r\n</ng-template>\r\n", styles: [":host{display:block;max-width:100%;overflow:auto}thead th{position:sticky;top:24px;z-index:1}thead th.expand{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:6px}\n"], components: [{ type: ItemsPerPageControlsComponent, selector: "vdr-items-per-page-controls", inputs: ["itemsPerPage"], outputs: ["itemsPerPageChange"] }, { type: PaginationControlsComponent, selector: "vdr-pagination-controls", inputs: ["id", "currentPage", "itemsPerPage", "totalItems"], outputs: ["pageChange"] }, { type: EmptyPlaceholderComponent, selector: "vdr-empty-placeholder", inputs: ["emptyStateLabel"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: FormFieldControlDirective, selector: "input, textarea, select" }, { type: i1$3.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i1$3.ClrDatagridItemsTrackBy, selector: "[ngForTrackBy]", inputs: ["ngForTrackBy"] }], pipes: { "paginate": i1$5.PaginatePipe, "translate": i7.TranslatePipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
14745
14751
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: DataTableComponent, decorators: [{
14746
14752
  type: Component,
14747
- args: [{ selector: 'vdr-data-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [PaginationService], template: "<ng-container *ngIf=\"!items || (items && items.length); else emptyPlaceholder\">\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"allSelected\"\r\n (change)=\"allSelectChange.emit()\"\r\n />\r\n </th>\r\n <th *ngFor=\"let header of columns?.toArray()\" class=\"left\" [class.expand]=\"header.expand\">\r\n <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"\r\n let item of items\r\n | paginate\r\n : {\r\n itemsPerPage: itemsPerPage,\r\n currentPage: currentPage,\r\n totalItems: totalItems\r\n };\r\n index as i;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <td *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"isRowSelectedFn(item)\"\r\n (change)=\"rowSelectChange.emit(item)\"\r\n />\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: i }\"\r\n ></ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"table-footer\">\r\n <vdr-items-per-page-controls\r\n *ngIf=\"totalItems\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\r\n ></vdr-items-per-page-controls>\r\n\r\n <vdr-pagination-controls\r\n *ngIf=\"totalItems\"\r\n [currentPage]=\"currentPage\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n [totalItems]=\"totalItems\"\r\n (pageChange)=\"pageChange.emit($event)\"\r\n ></vdr-pagination-controls>\r\n </div>\r\n</ng-container>\r\n<ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\r\n</ng-template>\r\n", styles: [":host{display:block;max-width:100%;overflow:auto}thead th{position:sticky;top:24px;z-index:1}thead th.expand{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:6px}\n"] }]
14753
+ args: [{ selector: 'vdr-data-table', changeDetection: ChangeDetectionStrategy.OnPush, providers: [PaginationService], template: "<ng-container *ngIf=\"!items || (items && items.length); else emptyPlaceholder\">\r\n <table class=\"table\">\r\n <thead>\r\n <tr>\r\n <th *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"allSelected\"\r\n (change)=\"allSelectChange.emit()\"\r\n />\r\n </th>\r\n <th *ngFor=\"let header of columns?.toArray()\" class=\"left\" [class.expand]=\"header.expand\">\r\n <ng-container *ngTemplateOutlet=\"header.template\"></ng-container>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr\r\n *ngFor=\"\r\n let item of items\r\n | paginate\r\n : {\r\n itemsPerPage: itemsPerPage,\r\n currentPage: currentPage,\r\n totalItems: totalItems\r\n };\r\n index as i;\r\n trackBy: trackByFn\r\n \"\r\n >\r\n <td *ngIf=\"isRowSelectedFn\" class=\"align-middle\">\r\n <input\r\n type=\"checkbox\"\r\n clrCheckbox\r\n [checked]=\"isRowSelectedFn(item)\"\r\n (change)=\"rowSelectChange.emit(item)\"\r\n />\r\n </td>\r\n <ng-container\r\n *ngTemplateOutlet=\"rowTemplate; context: { item: item, index: i }\"\r\n ></ng-container>\r\n </tr>\r\n </tbody>\r\n </table>\r\n <div class=\"table-footer\">\r\n <vdr-items-per-page-controls\r\n *ngIf=\"totalItems\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n (itemsPerPageChange)=\"itemsPerPageChange.emit($event)\"\r\n ></vdr-items-per-page-controls>\r\n <div>\r\n {{ 'common.total-items' | translate: { currentStart, currentEnd, totalItems } }}\r\n </div>\r\n\r\n <vdr-pagination-controls\r\n *ngIf=\"totalItems\"\r\n [currentPage]=\"currentPage\"\r\n [itemsPerPage]=\"itemsPerPage\"\r\n [totalItems]=\"totalItems\"\r\n (pageChange)=\"pageChange.emit($event)\"\r\n ></vdr-pagination-controls>\r\n </div>\r\n</ng-container>\r\n<ng-template #emptyPlaceholder>\r\n <vdr-empty-placeholder [emptyStateLabel]=\"emptyStateLabel\"></vdr-empty-placeholder>\r\n</ng-template>\r\n", styles: [":host{display:block;max-width:100%;overflow:auto}thead th{position:sticky;top:24px;z-index:1}thead th.expand{width:100%}.table-footer{display:flex;align-items:baseline;justify-content:space-between;margin-top:6px}\n"] }]
14748
14754
  }], propDecorators: { items: [{
14749
14755
  type: Input
14750
14756
  }], itemsPerPage: [{
@@ -15000,10 +15006,10 @@ class FormattedAddressComponent {
15000
15006
  }
15001
15007
  }
15002
15008
  FormattedAddressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: FormattedAddressComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
15003
- FormattedAddressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: FormattedAddressComponent, selector: "vdr-formatted-address", inputs: { address: "address" }, ngImport: i0, template: "<ul class=\"address-lines\">\r\n <li *ngIf=\"address.fullName\">{{ address.fullName }}</li>\r\n <li *ngIf=\"address.streetLine1\">{{ address.streetLine1 }}</li>\r\n <li *ngIf=\"address.streetLine2\">{{ address.streetLine2 }}</li>\r\n <li *ngIf=\"address.city\">{{ address.city }}</li>\r\n <li *ngIf=\"address.province\">{{ address.province }}</li>\r\n <li *ngIf=\"address.postalCode\">{{ address.postalCode }}</li>\r\n <li *ngIf=\"address.country\">\r\n <clr-icon shape=\"world\" size=\"12\"></clr-icon>\r\n {{ getCountryName() }}\r\n </li>\r\n <li *ngIf=\"address.phoneNumber\">\r\n <clr-icon shape=\"phone-handset\" size=\"12\"></clr-icon>\r\n {{ address.phoneNumber }}\r\n </li>\r\n <li *ngFor=\"let customField of getCustomFields()\" class=\"custom-field\">\r\n <vdr-labeled-data [label]=\"customField.key\">{{ customField.value }}</vdr-labeled-data>\r\n </li>\r\n</ul>\r\n", styles: [".address-lines{list-style-type:none;line-height:1.2em}.custom-field{margin-top:6px}\n"], components: [{ type: LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$3.ClrIconCustomTag, selector: "clr-icon" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
15009
+ FormattedAddressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.3", type: FormattedAddressComponent, selector: "vdr-formatted-address", inputs: { address: "address" }, ngImport: i0, template: "<ul class=\"address-lines\">\r\n <li *ngIf=\"address.fullName\">{{ address.fullName }}</li>\r\n <li *ngIf=\"address.company\">{{ address.company }}</li>\r\n <li *ngIf=\"address.streetLine1\">{{ address.streetLine1 }}</li>\r\n <li *ngIf=\"address.streetLine2\">{{ address.streetLine2 }}</li>\r\n <li *ngIf=\"address.city\">{{ address.city }}</li>\r\n <li *ngIf=\"address.province\">{{ address.province }}</li>\r\n <li *ngIf=\"address.postalCode\">{{ address.postalCode }}</li>\r\n <li *ngIf=\"address.country\">\r\n <clr-icon shape=\"world\" size=\"12\"></clr-icon>\r\n {{ getCountryName() }}\r\n </li>\r\n <li *ngIf=\"address.phoneNumber\">\r\n <clr-icon shape=\"phone-handset\" size=\"12\"></clr-icon>\r\n {{ address.phoneNumber }}\r\n </li>\r\n <li *ngFor=\"let customField of getCustomFields()\" class=\"custom-field\">\r\n <vdr-labeled-data [label]=\"customField.key\">{{ customField.value }}</vdr-labeled-data>\r\n </li>\r\n</ul>\r\n", styles: [".address-lines{list-style-type:none;line-height:1.2em}.custom-field{margin-top:6px}\n"], components: [{ type: LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }], directives: [{ type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1$3.ClrIconCustomTag, selector: "clr-icon" }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
15004
15010
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.3", ngImport: i0, type: FormattedAddressComponent, decorators: [{
15005
15011
  type: Component,
15006
- args: [{ selector: 'vdr-formatted-address', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"address-lines\">\r\n <li *ngIf=\"address.fullName\">{{ address.fullName }}</li>\r\n <li *ngIf=\"address.streetLine1\">{{ address.streetLine1 }}</li>\r\n <li *ngIf=\"address.streetLine2\">{{ address.streetLine2 }}</li>\r\n <li *ngIf=\"address.city\">{{ address.city }}</li>\r\n <li *ngIf=\"address.province\">{{ address.province }}</li>\r\n <li *ngIf=\"address.postalCode\">{{ address.postalCode }}</li>\r\n <li *ngIf=\"address.country\">\r\n <clr-icon shape=\"world\" size=\"12\"></clr-icon>\r\n {{ getCountryName() }}\r\n </li>\r\n <li *ngIf=\"address.phoneNumber\">\r\n <clr-icon shape=\"phone-handset\" size=\"12\"></clr-icon>\r\n {{ address.phoneNumber }}\r\n </li>\r\n <li *ngFor=\"let customField of getCustomFields()\" class=\"custom-field\">\r\n <vdr-labeled-data [label]=\"customField.key\">{{ customField.value }}</vdr-labeled-data>\r\n </li>\r\n</ul>\r\n", styles: [".address-lines{list-style-type:none;line-height:1.2em}.custom-field{margin-top:6px}\n"] }]
15012
+ args: [{ selector: 'vdr-formatted-address', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"address-lines\">\r\n <li *ngIf=\"address.fullName\">{{ address.fullName }}</li>\r\n <li *ngIf=\"address.company\">{{ address.company }}</li>\r\n <li *ngIf=\"address.streetLine1\">{{ address.streetLine1 }}</li>\r\n <li *ngIf=\"address.streetLine2\">{{ address.streetLine2 }}</li>\r\n <li *ngIf=\"address.city\">{{ address.city }}</li>\r\n <li *ngIf=\"address.province\">{{ address.province }}</li>\r\n <li *ngIf=\"address.postalCode\">{{ address.postalCode }}</li>\r\n <li *ngIf=\"address.country\">\r\n <clr-icon shape=\"world\" size=\"12\"></clr-icon>\r\n {{ getCountryName() }}\r\n </li>\r\n <li *ngIf=\"address.phoneNumber\">\r\n <clr-icon shape=\"phone-handset\" size=\"12\"></clr-icon>\r\n {{ address.phoneNumber }}\r\n </li>\r\n <li *ngFor=\"let customField of getCustomFields()\" class=\"custom-field\">\r\n <vdr-labeled-data [label]=\"customField.key\">{{ customField.value }}</vdr-labeled-data>\r\n </li>\r\n</ul>\r\n", styles: [".address-lines{list-style-type:none;line-height:1.2em}.custom-field{margin-top:6px}\n"] }]
15007
15013
  }], propDecorators: { address: [{
15008
15014
  type: Input
15009
15015
  }] } });
@@ -16332,7 +16338,7 @@ function patchObject(obj, patch) {
16332
16338
  }
16333
16339
 
16334
16340
  // Auto-generated by the set-version.js script.
16335
- const ADMIN_UI_VERSION = '2.0.0-next.7';
16341
+ const ADMIN_UI_VERSION = '2.0.0-next.8';
16336
16342
 
16337
16343
  /**
16338
16344
  * Responsible for registering dashboard widget components and querying for layouts.