@vendure/admin-ui 2.0.6 → 2.1.0-next.1

package/esm2022/order/components/order-history/order-history.component.mjs

@@ -148,12 +148,12 @@ export class OrderHistoryComponent {
         this.note = '';
         this.noteIsPrivate = true;
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderHistoryComponent, deps: [{ token: i1.HistoryEntryComponentService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderHistoryComponent, selector: "vdr-order-history", inputs: { order: "order", history: "history" }, outputs: { addNote: "addNote", updateNote: "updateNote", deleteNote: "deleteNote" }, ngImport: i0, template: "<div class=\"entry-list\" [class.expanded]=\"expanded\">\r\n    <vdr-timeline-entry iconShape=\"note\" displayType=\"muted\" [featured]=\"true\">\r\n        <div class=\"note-entry\">\r\n            <textarea [(ngModel)]=\"note\" name=\"note\" class=\"note\"></textarea>\r\n            <button class=\"btn btn-secondary\" [disabled]=\"!note\" (click)=\"addNoteToOrder()\">\r\n                {{ 'common.add-note' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"visibility-select\">\r\n            <clr-checkbox-wrapper>\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"noteIsPrivate\" />\r\n                <label>{{ 'order.note-is-private' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <span *ngIf=\"noteIsPrivate\" class=\"private\">\r\n                {{ 'order.note-only-visible-to-administrators' | translate }}\r\n            </span>\r\n            <span *ngIf=\"!noteIsPrivate\" class=\"public\">\r\n                {{ 'order.note-visible-to-customer' | translate }}\r\n            </span>\r\n        </div>\r\n    </vdr-timeline-entry>\r\n    <ng-container *ngFor=\"let entry of history\">\r\n        <vdr-order-history-entry-host\r\n            *ngIf=\"hasCustomComponent(entry.type); else defaultComponents\"\r\n            [order]=\"order\"\r\n            [entry]=\"entry\"\r\n            [expanded]=\"expanded\"\r\n            (expandClick)=\"expanded = !expanded\"\r\n        ></vdr-order-history-entry-host>\r\n        <ng-template #defaultComponents>\r\n            <vdr-timeline-entry\r\n                [displayType]=\"getDisplayType(entry)\"\r\n                [iconShape]=\"getTimelineIcon(entry)\"\r\n                [createdAt]=\"entry.createdAt\"\r\n                [name]=\"getName(entry)\"\r\n                [featured]=\"isFeatured(entry)\"\r\n                [collapsed]=\"!expanded && !isFeatured(entry)\"\r\n                (expandClick)=\"expanded = !expanded\"\r\n            >\r\n                <ng-container [ngSwitch]=\"entry.type\">\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_STATE_TRANSITION\">\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            {{ 'order.history-order-fulfilled' | translate }}\r\n                        </div>\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Cancelled'\">\r\n                            {{ 'order.history-order-cancelled' | translate }}\r\n                        </div>\r\n                        <ng-template [ngIf]=\"entry.data.to !== 'Cancelled' && entry.data.to !== 'Delivered'\">\r\n                            {{\r\n                                'order.history-order-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_MODIFIED\">\r\n                        <div class=\"title\">\r\n                            {{ 'order.history-order-modified' | translate }}\r\n                        </div>\r\n                        <ng-container *ngIf=\"getModification(entry.data.modificationId) as modification\">\r\n                            {{ 'order.modify-order-price-difference' | translate }}:\r\n                            <strong>{{\r\n                                modification.priceChange | localeCurrency: order.currencyCode\r\n                            }}</strong>\r\n                            <vdr-chip colorType=\"success\" *ngIf=\"modification.isSettled\">{{\r\n                                'order.modification-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-chip colorType=\"error\" *ngIf=\"!modification.isSettled\">{{\r\n                                'order.modification-not-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-history-entry-detail>\r\n                                <vdr-modification-detail\r\n                                    [order]=\"order\"\r\n                                    [modification]=\"modification\"\r\n                                ></vdr-modification-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_PAYMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Settled'; else regularPaymentTransition\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-payment-settled' | translate }}\r\n                            </div>\r\n                            {{ 'order.transaction-id' | translate }}: {{ getPayment(entry)?.transactionId }}\r\n                            <vdr-history-entry-detail *ngIf=\"getPayment(entry) as payment\">\r\n                                <vdr-payment-detail\r\n                                    [payment]=\"payment\"\r\n                                    [currencyCode]=\"order.currencyCode\"\r\n                                ></vdr-payment-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                        <ng-template #regularPaymentTransition>\r\n                            {{\r\n                                'order.history-payment-transition'\r\n                                    | translate\r\n                                        : {\r\n                                              from: entry.data.from,\r\n                                              to: entry.data.to,\r\n                                              id: getPayment(entry)?.transactionId\r\n                                          }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_REFUND_TRANSITION\">\r\n                        {{\r\n                            'order.history-refund-transition'\r\n                                | translate\r\n                                    : { from: entry.data.from, to: entry.data.to, id: entry.data.refundId }\r\n                        }}\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_CANCELLATION\">\r\n                        {{\r\n                            'order.history-items-cancelled'\r\n                                | translate: { count: getCancelledQuantity(entry) }\r\n                        }}\r\n                        <vdr-history-entry-detail *ngIf=\"getCancelledItems(entry) as items\">\r\n                            <vdr-labeled-data [label]=\"'order.cancellation-reason' | translate\">\r\n                                {{ entry.data.reason }}\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.contents' | translate\">\r\n                                <vdr-simple-item-list [items]=\"items\"></vdr-simple-item-list>\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.shipping-cancelled' | translate\">\r\n                                {{ entry.data.shippingCancelled }}\r\n                            </vdr-labeled-data>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT\">\r\n                        {{ 'order.history-fulfillment-created' | translate }}\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-delivered' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to === 'Shipped'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-shipped' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to !== 'Delivered' && entry.data.to !== 'Shipped'\">\r\n                            {{\r\n                                'order.history-fulfillment-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-container>\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_NOTE\">\r\n                        <div class=\"flex\">\r\n                            <div class=\"note-text\">\r\n                                <span *ngIf=\"entry.isPublic\" class=\"note-visibility public\">{{\r\n                                    'common.public' | translate\r\n                                }}</span>\r\n                                <span *ngIf=\"!entry.isPublic\" class=\"note-visibility private\">{{\r\n                                    'common.private' | translate\r\n                                }}</span>\r\n                                {{ entry.data.note }}\r\n                            </div>\r\n                            <div class=\"flex-spacer\"></div>\r\n                            <vdr-dropdown>\r\n                                <button class=\"icon-button\" vdrDropdownTrigger>\r\n                                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                                </button>\r\n                                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"updateNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | hasPermission)\"\r\n                                    >\r\n                                        <clr-icon shape=\"edit\"></clr-icon>\r\n                                        {{ 'common.edit' | translate }}\r\n                                    </button>\r\n                                    <div class=\"dropdown-divider\"></div>\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"deleteNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | 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                        </div>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_APPLIED\">\r\n                        {{ 'order.history-coupon-code-applied' | translate }}:\r\n                        <vdr-chip>\r\n                            <a [routerLink]=\"['/marketing', 'promotions', entry.data.promotionId]\">{{\r\n                                entry.data.couponCode\r\n                            }}</a>\r\n                        </vdr-chip>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_REMOVED\">\r\n                        {{ 'order.history-coupon-code-removed' | translate }}:\r\n                        <vdr-chip\r\n                            ><span class=\"cancelled-coupon-code\">{{ entry.data.couponCode }}</span></vdr-chip\r\n                        >\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchDefault>\r\n                        <div class=\"title\">\r\n                            {{ entry.type | translate }}\r\n                        </div>\r\n                        <vdr-history-entry-detail *ngIf=\"entry.data\">\r\n                            <vdr-object-tree [value]=\"entry.data\"></vdr-object-tree>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </vdr-timeline-entry>\r\n        </ng-template>\r\n    </ng-container>\r\n\r\n    <vdr-timeline-entry [isLast]=\"true\" [createdAt]=\"order.createdAt\" [featured]=\"true\">\r\n        <div class=\"title\">\r\n            {{ 'order.history-order-created' | translate }}\r\n        </div>\r\n    </vdr-timeline-entry>\r\n</div>\r\n", styles: [":host{display:block}.entry-list{margin-left:calc(var(--space-unit) * 2)}.note-entry{display:flex;align-items:center}.note-entry .note{flex:1}.note-entry button{margin:0}.visibility-select{display:flex;justify-content:space-between;align-items:baseline}.visibility-select .public{color:var(--color-warning-700)}.visibility-select .private{color:var(--color-success-700)}textarea.note{flex:1;height:36px;border-radius:3px;margin-right:6px}.note-text{color:var(--color-grey-800);white-space:pre-wrap}.cancelled-coupon-code{text-decoration:line-through}.note-visibility{text-transform:lowercase}.note-visibility.public{color:var(--color-warning-700)}.note-visibility.private{color:var(--color-success-700)}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i2.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i2.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "component", type: i1.LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: i1.ObjectTreeComponent, selector: "vdr-object-tree", inputs: ["value", "isArrayItem"] }, { kind: "component", type: i1.TimelineEntryComponent, selector: "vdr-timeline-entry", inputs: ["displayType", "createdAt", "name", "featured", "iconShape", "isLast", "collapsed"], outputs: ["expandClick"] }, { kind: "component", type: i1.HistoryEntryDetailComponent, selector: "vdr-history-entry-detail" }, { kind: "component", type: i6.FulfillmentDetailComponent, selector: "vdr-fulfillment-detail", inputs: ["fulfillmentId", "order"] }, { kind: "component", type: i7.PaymentDetailComponent, selector: "vdr-payment-detail", inputs: ["payment", "currencyCode"] }, { kind: "component", type: i8.SimpleItemListComponent, selector: "vdr-simple-item-list", inputs: ["items"] }, { kind: "component", type: i9.ModificationDetailComponent, selector: "vdr-modification-detail", inputs: ["order", "modification"] }, { kind: "component", type: i10.OrderHistoryEntryHostComponent, selector: "vdr-order-history-entry-host", inputs: ["entry", "order", "expanded"], outputs: ["expandClick"], exportAs: ["historyEntry"] }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderHistoryComponent, deps: [{ token: i1.HistoryEntryComponentService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderHistoryComponent, selector: "vdr-order-history", inputs: { order: "order", history: "history" }, outputs: { addNote: "addNote", updateNote: "updateNote", deleteNote: "deleteNote" }, ngImport: i0, template: "<div class=\"entry-list\" [class.expanded]=\"expanded\">\r\n    <vdr-timeline-entry iconShape=\"note\" displayType=\"muted\" [featured]=\"true\">\r\n        <div class=\"note-entry\">\r\n            <textarea [(ngModel)]=\"note\" name=\"note\" class=\"note\"></textarea>\r\n            <button class=\"btn btn-secondary\" [disabled]=\"!note\" (click)=\"addNoteToOrder()\">\r\n                {{ 'common.add-note' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"visibility-select\">\r\n            <clr-checkbox-wrapper>\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"noteIsPrivate\" />\r\n                <label>{{ 'order.note-is-private' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <span *ngIf=\"noteIsPrivate\" class=\"private\">\r\n                {{ 'order.note-only-visible-to-administrators' | translate }}\r\n            </span>\r\n            <span *ngIf=\"!noteIsPrivate\" class=\"public\">\r\n                {{ 'order.note-visible-to-customer' | translate }}\r\n            </span>\r\n        </div>\r\n    </vdr-timeline-entry>\r\n    <ng-container *ngFor=\"let entry of history\">\r\n        <vdr-order-history-entry-host\r\n            *ngIf=\"hasCustomComponent(entry.type); else defaultComponents\"\r\n            [order]=\"order\"\r\n            [entry]=\"entry\"\r\n            [expanded]=\"expanded\"\r\n            (expandClick)=\"expanded = !expanded\"\r\n        ></vdr-order-history-entry-host>\r\n        <ng-template #defaultComponents>\r\n            <vdr-timeline-entry\r\n                [displayType]=\"getDisplayType(entry)\"\r\n                [iconShape]=\"getTimelineIcon(entry)\"\r\n                [createdAt]=\"entry.createdAt\"\r\n                [name]=\"getName(entry)\"\r\n                [featured]=\"isFeatured(entry)\"\r\n                [collapsed]=\"!expanded && !isFeatured(entry)\"\r\n                (expandClick)=\"expanded = !expanded\"\r\n            >\r\n                <ng-container [ngSwitch]=\"entry.type\">\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_STATE_TRANSITION\">\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            {{ 'order.history-order-fulfilled' | translate }}\r\n                        </div>\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Cancelled'\">\r\n                            {{ 'order.history-order-cancelled' | translate }}\r\n                        </div>\r\n                        <ng-template [ngIf]=\"entry.data.to !== 'Cancelled' && entry.data.to !== 'Delivered'\">\r\n                            {{\r\n                                'order.history-order-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_MODIFIED\">\r\n                        <div class=\"title\">\r\n                            {{ 'order.history-order-modified' | translate }}\r\n                        </div>\r\n                        <ng-container *ngIf=\"getModification(entry.data.modificationId) as modification\">\r\n                            {{ 'order.modify-order-price-difference' | translate }}:\r\n                            <strong>{{\r\n                                modification.priceChange | localeCurrency: order.currencyCode\r\n                            }}</strong>\r\n                            <vdr-chip colorType=\"success\" *ngIf=\"modification.isSettled\">{{\r\n                                'order.modification-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-chip colorType=\"error\" *ngIf=\"!modification.isSettled\">{{\r\n                                'order.modification-not-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-history-entry-detail>\r\n                                <vdr-modification-detail\r\n                                    [order]=\"order\"\r\n                                    [modification]=\"modification\"\r\n                                ></vdr-modification-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_PAYMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Settled'; else regularPaymentTransition\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-payment-settled' | translate }}\r\n                            </div>\r\n                            {{ 'order.transaction-id' | translate }}: {{ getPayment(entry)?.transactionId }}\r\n                            <vdr-history-entry-detail *ngIf=\"getPayment(entry) as payment\">\r\n                                <vdr-payment-detail\r\n                                    [payment]=\"payment\"\r\n                                    [currencyCode]=\"order.currencyCode\"\r\n                                ></vdr-payment-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                        <ng-template #regularPaymentTransition>\r\n                            {{\r\n                                'order.history-payment-transition'\r\n                                    | translate\r\n                                        : {\r\n                                              from: entry.data.from,\r\n                                              to: entry.data.to,\r\n                                              id: getPayment(entry)?.transactionId\r\n                                          }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_REFUND_TRANSITION\">\r\n                        {{\r\n                            'order.history-refund-transition'\r\n                                | translate\r\n                                    : { from: entry.data.from, to: entry.data.to, id: entry.data.refundId }\r\n                        }}\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_CANCELLATION\">\r\n                        {{\r\n                            'order.history-items-cancelled'\r\n                                | translate: { count: getCancelledQuantity(entry) }\r\n                        }}\r\n                        <vdr-history-entry-detail *ngIf=\"getCancelledItems(entry) as items\">\r\n                            <vdr-labeled-data [label]=\"'order.cancellation-reason' | translate\">\r\n                                {{ entry.data.reason }}\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.contents' | translate\">\r\n                                <vdr-simple-item-list [items]=\"items\"></vdr-simple-item-list>\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.shipping-cancelled' | translate\">\r\n                                {{ entry.data.shippingCancelled }}\r\n                            </vdr-labeled-data>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT\">\r\n                        {{ 'order.history-fulfillment-created' | translate }}\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-delivered' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to === 'Shipped'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-shipped' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to !== 'Delivered' && entry.data.to !== 'Shipped'\">\r\n                            {{\r\n                                'order.history-fulfillment-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-container>\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_NOTE\">\r\n                        <div class=\"flex\">\r\n                            <div class=\"note-text\">\r\n                                <span *ngIf=\"entry.isPublic\" class=\"note-visibility public\">{{\r\n                                    'common.public' | translate\r\n                                }}</span>\r\n                                <span *ngIf=\"!entry.isPublic\" class=\"note-visibility private\">{{\r\n                                    'common.private' | translate\r\n                                }}</span>\r\n                                {{ entry.data.note }}\r\n                            </div>\r\n                            <div class=\"flex-spacer\"></div>\r\n                            <vdr-dropdown>\r\n                                <button class=\"icon-button\" vdrDropdownTrigger>\r\n                                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                                </button>\r\n                                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"updateNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | hasPermission)\"\r\n                                    >\r\n                                        <clr-icon shape=\"edit\"></clr-icon>\r\n                                        {{ 'common.edit' | translate }}\r\n                                    </button>\r\n                                    <div class=\"dropdown-divider\"></div>\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"deleteNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | 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                        </div>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_APPLIED\">\r\n                        {{ 'order.history-coupon-code-applied' | translate }}:\r\n                        <vdr-chip>\r\n                            <a [routerLink]=\"['/marketing', 'promotions', entry.data.promotionId]\">{{\r\n                                entry.data.couponCode\r\n                            }}</a>\r\n                        </vdr-chip>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_REMOVED\">\r\n                        {{ 'order.history-coupon-code-removed' | translate }}:\r\n                        <vdr-chip\r\n                            ><span class=\"cancelled-coupon-code\">{{ entry.data.couponCode }}</span></vdr-chip\r\n                        >\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchDefault>\r\n                        <div class=\"title\">\r\n                            {{ entry.type | translate }}\r\n                        </div>\r\n                        <vdr-history-entry-detail *ngIf=\"entry.data\">\r\n                            <vdr-object-tree [value]=\"entry.data\"></vdr-object-tree>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </vdr-timeline-entry>\r\n        </ng-template>\r\n    </ng-container>\r\n\r\n    <vdr-timeline-entry [isLast]=\"true\" [createdAt]=\"order.createdAt\" [featured]=\"true\">\r\n        <div class=\"title\">\r\n            {{ 'order.history-order-created' | translate }}\r\n        </div>\r\n    </vdr-timeline-entry>\r\n</div>\r\n", styles: [":host{display:block}.entry-list{margin-inline-start:calc(var(--space-unit) * 2)}.note-entry{display:flex;align-items:center}.note-entry .note{flex:1}.note-entry button{margin:0}.visibility-select{display:flex;justify-content:space-between;align-items:baseline}.visibility-select .public{color:var(--color-warning-700)}.visibility-select .private{color:var(--color-success-700)}textarea.note{flex:1;height:36px;border-radius:3px;margin-inline-end:6px}.note-text{color:var(--color-grey-800);white-space:pre-wrap}.cancelled-coupon-code{text-decoration:line-through}.note-visibility{text-transform:lowercase}.note-visibility.public{color:var(--color-warning-700)}.note-visibility.private{color:var(--color-success-700)}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.ClrLabel, selector: "label", inputs: ["for"] }, { kind: "directive", type: i2.ClrCheckbox, selector: "[clrCheckbox],[clrToggle]" }, { kind: "component", type: i2.ClrCheckboxWrapper, selector: "clr-checkbox-wrapper,clr-toggle-wrapper" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "directive", type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { kind: "directive", type: i4.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4.CheckboxControlValueAccessor, selector: "input[type=checkbox][formControlName],input[type=checkbox][formControl],input[type=checkbox][ngModel]" }, { kind: "directive", type: i4.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i5.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "directive", type: i1.FormFieldControlDirective, selector: "input, textarea, select" }, { kind: "component", type: i1.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i1.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i1.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i1.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "component", type: i1.LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: i1.ObjectTreeComponent, selector: "vdr-object-tree", inputs: ["value", "isArrayItem"] }, { kind: "component", type: i1.TimelineEntryComponent, selector: "vdr-timeline-entry", inputs: ["displayType", "createdAt", "name", "featured", "iconShape", "isLast", "collapsed"], outputs: ["expandClick"] }, { kind: "component", type: i1.HistoryEntryDetailComponent, selector: "vdr-history-entry-detail" }, { kind: "component", type: i6.FulfillmentDetailComponent, selector: "vdr-fulfillment-detail", inputs: ["fulfillmentId", "order"] }, { kind: "component", type: i7.PaymentDetailComponent, selector: "vdr-payment-detail", inputs: ["payment", "currencyCode"] }, { kind: "component", type: i8.SimpleItemListComponent, selector: "vdr-simple-item-list", inputs: ["items"] }, { kind: "component", type: i9.ModificationDetailComponent, selector: "vdr-modification-detail", inputs: ["order", "modification"] }, { kind: "component", type: i10.OrderHistoryEntryHostComponent, selector: "vdr-order-history-entry-host", inputs: ["entry", "order", "expanded"], outputs: ["expandClick"], exportAs: ["historyEntry"] }, { kind: "pipe", type: i11.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.HasPermissionPipe, name: "hasPermission" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderHistoryComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderHistoryComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-order-history', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"entry-list\" [class.expanded]=\"expanded\">\r\n    <vdr-timeline-entry iconShape=\"note\" displayType=\"muted\" [featured]=\"true\">\r\n        <div class=\"note-entry\">\r\n            <textarea [(ngModel)]=\"note\" name=\"note\" class=\"note\"></textarea>\r\n            <button class=\"btn btn-secondary\" [disabled]=\"!note\" (click)=\"addNoteToOrder()\">\r\n                {{ 'common.add-note' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"visibility-select\">\r\n            <clr-checkbox-wrapper>\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"noteIsPrivate\" />\r\n                <label>{{ 'order.note-is-private' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <span *ngIf=\"noteIsPrivate\" class=\"private\">\r\n                {{ 'order.note-only-visible-to-administrators' | translate }}\r\n            </span>\r\n            <span *ngIf=\"!noteIsPrivate\" class=\"public\">\r\n                {{ 'order.note-visible-to-customer' | translate }}\r\n            </span>\r\n        </div>\r\n    </vdr-timeline-entry>\r\n    <ng-container *ngFor=\"let entry of history\">\r\n        <vdr-order-history-entry-host\r\n            *ngIf=\"hasCustomComponent(entry.type); else defaultComponents\"\r\n            [order]=\"order\"\r\n            [entry]=\"entry\"\r\n            [expanded]=\"expanded\"\r\n            (expandClick)=\"expanded = !expanded\"\r\n        ></vdr-order-history-entry-host>\r\n        <ng-template #defaultComponents>\r\n            <vdr-timeline-entry\r\n                [displayType]=\"getDisplayType(entry)\"\r\n                [iconShape]=\"getTimelineIcon(entry)\"\r\n                [createdAt]=\"entry.createdAt\"\r\n                [name]=\"getName(entry)\"\r\n                [featured]=\"isFeatured(entry)\"\r\n                [collapsed]=\"!expanded && !isFeatured(entry)\"\r\n                (expandClick)=\"expanded = !expanded\"\r\n            >\r\n                <ng-container [ngSwitch]=\"entry.type\">\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_STATE_TRANSITION\">\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            {{ 'order.history-order-fulfilled' | translate }}\r\n                        </div>\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Cancelled'\">\r\n                            {{ 'order.history-order-cancelled' | translate }}\r\n                        </div>\r\n                        <ng-template [ngIf]=\"entry.data.to !== 'Cancelled' && entry.data.to !== 'Delivered'\">\r\n                            {{\r\n                                'order.history-order-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_MODIFIED\">\r\n                        <div class=\"title\">\r\n                            {{ 'order.history-order-modified' | translate }}\r\n                        </div>\r\n                        <ng-container *ngIf=\"getModification(entry.data.modificationId) as modification\">\r\n                            {{ 'order.modify-order-price-difference' | translate }}:\r\n                            <strong>{{\r\n                                modification.priceChange | localeCurrency: order.currencyCode\r\n                            }}</strong>\r\n                            <vdr-chip colorType=\"success\" *ngIf=\"modification.isSettled\">{{\r\n                                'order.modification-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-chip colorType=\"error\" *ngIf=\"!modification.isSettled\">{{\r\n                                'order.modification-not-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-history-entry-detail>\r\n                                <vdr-modification-detail\r\n                                    [order]=\"order\"\r\n                                    [modification]=\"modification\"\r\n                                ></vdr-modification-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_PAYMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Settled'; else regularPaymentTransition\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-payment-settled' | translate }}\r\n                            </div>\r\n                            {{ 'order.transaction-id' | translate }}: {{ getPayment(entry)?.transactionId }}\r\n                            <vdr-history-entry-detail *ngIf=\"getPayment(entry) as payment\">\r\n                                <vdr-payment-detail\r\n                                    [payment]=\"payment\"\r\n                                    [currencyCode]=\"order.currencyCode\"\r\n                                ></vdr-payment-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                        <ng-template #regularPaymentTransition>\r\n                            {{\r\n                                'order.history-payment-transition'\r\n                                    | translate\r\n                                        : {\r\n                                              from: entry.data.from,\r\n                                              to: entry.data.to,\r\n                                              id: getPayment(entry)?.transactionId\r\n                                          }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_REFUND_TRANSITION\">\r\n                        {{\r\n                            'order.history-refund-transition'\r\n                                | translate\r\n                                    : { from: entry.data.from, to: entry.data.to, id: entry.data.refundId }\r\n                        }}\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_CANCELLATION\">\r\n                        {{\r\n                            'order.history-items-cancelled'\r\n                                | translate: { count: getCancelledQuantity(entry) }\r\n                        }}\r\n                        <vdr-history-entry-detail *ngIf=\"getCancelledItems(entry) as items\">\r\n                            <vdr-labeled-data [label]=\"'order.cancellation-reason' | translate\">\r\n                                {{ entry.data.reason }}\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.contents' | translate\">\r\n                                <vdr-simple-item-list [items]=\"items\"></vdr-simple-item-list>\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.shipping-cancelled' | translate\">\r\n                                {{ entry.data.shippingCancelled }}\r\n                            </vdr-labeled-data>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT\">\r\n                        {{ 'order.history-fulfillment-created' | translate }}\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-delivered' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to === 'Shipped'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-shipped' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to !== 'Delivered' && entry.data.to !== 'Shipped'\">\r\n                            {{\r\n                                'order.history-fulfillment-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-container>\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_NOTE\">\r\n                        <div class=\"flex\">\r\n                            <div class=\"note-text\">\r\n                                <span *ngIf=\"entry.isPublic\" class=\"note-visibility public\">{{\r\n                                    'common.public' | translate\r\n                                }}</span>\r\n                                <span *ngIf=\"!entry.isPublic\" class=\"note-visibility private\">{{\r\n                                    'common.private' | translate\r\n                                }}</span>\r\n                                {{ entry.data.note }}\r\n                            </div>\r\n                            <div class=\"flex-spacer\"></div>\r\n                            <vdr-dropdown>\r\n                                <button class=\"icon-button\" vdrDropdownTrigger>\r\n                                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                                </button>\r\n                                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"updateNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | hasPermission)\"\r\n                                    >\r\n                                        <clr-icon shape=\"edit\"></clr-icon>\r\n                                        {{ 'common.edit' | translate }}\r\n                                    </button>\r\n                                    <div class=\"dropdown-divider\"></div>\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"deleteNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | 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                        </div>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_APPLIED\">\r\n                        {{ 'order.history-coupon-code-applied' | translate }}:\r\n                        <vdr-chip>\r\n                            <a [routerLink]=\"['/marketing', 'promotions', entry.data.promotionId]\">{{\r\n                                entry.data.couponCode\r\n                            }}</a>\r\n                        </vdr-chip>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_REMOVED\">\r\n                        {{ 'order.history-coupon-code-removed' | translate }}:\r\n                        <vdr-chip\r\n                            ><span class=\"cancelled-coupon-code\">{{ entry.data.couponCode }}</span></vdr-chip\r\n                        >\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchDefault>\r\n                        <div class=\"title\">\r\n                            {{ entry.type | translate }}\r\n                        </div>\r\n                        <vdr-history-entry-detail *ngIf=\"entry.data\">\r\n                            <vdr-object-tree [value]=\"entry.data\"></vdr-object-tree>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </vdr-timeline-entry>\r\n        </ng-template>\r\n    </ng-container>\r\n\r\n    <vdr-timeline-entry [isLast]=\"true\" [createdAt]=\"order.createdAt\" [featured]=\"true\">\r\n        <div class=\"title\">\r\n            {{ 'order.history-order-created' | translate }}\r\n        </div>\r\n    </vdr-timeline-entry>\r\n</div>\r\n", styles: [":host{display:block}.entry-list{margin-left:calc(var(--space-unit) * 2)}.note-entry{display:flex;align-items:center}.note-entry .note{flex:1}.note-entry button{margin:0}.visibility-select{display:flex;justify-content:space-between;align-items:baseline}.visibility-select .public{color:var(--color-warning-700)}.visibility-select .private{color:var(--color-success-700)}textarea.note{flex:1;height:36px;border-radius:3px;margin-right:6px}.note-text{color:var(--color-grey-800);white-space:pre-wrap}.cancelled-coupon-code{text-decoration:line-through}.note-visibility{text-transform:lowercase}.note-visibility.public{color:var(--color-warning-700)}.note-visibility.private{color:var(--color-success-700)}\n"] }]
+            args: [{ selector: 'vdr-order-history', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"entry-list\" [class.expanded]=\"expanded\">\r\n    <vdr-timeline-entry iconShape=\"note\" displayType=\"muted\" [featured]=\"true\">\r\n        <div class=\"note-entry\">\r\n            <textarea [(ngModel)]=\"note\" name=\"note\" class=\"note\"></textarea>\r\n            <button class=\"btn btn-secondary\" [disabled]=\"!note\" (click)=\"addNoteToOrder()\">\r\n                {{ 'common.add-note' | translate }}\r\n            </button>\r\n        </div>\r\n        <div class=\"visibility-select\">\r\n            <clr-checkbox-wrapper>\r\n                <input type=\"checkbox\" clrCheckbox [(ngModel)]=\"noteIsPrivate\" />\r\n                <label>{{ 'order.note-is-private' | translate }}</label>\r\n            </clr-checkbox-wrapper>\r\n            <span *ngIf=\"noteIsPrivate\" class=\"private\">\r\n                {{ 'order.note-only-visible-to-administrators' | translate }}\r\n            </span>\r\n            <span *ngIf=\"!noteIsPrivate\" class=\"public\">\r\n                {{ 'order.note-visible-to-customer' | translate }}\r\n            </span>\r\n        </div>\r\n    </vdr-timeline-entry>\r\n    <ng-container *ngFor=\"let entry of history\">\r\n        <vdr-order-history-entry-host\r\n            *ngIf=\"hasCustomComponent(entry.type); else defaultComponents\"\r\n            [order]=\"order\"\r\n            [entry]=\"entry\"\r\n            [expanded]=\"expanded\"\r\n            (expandClick)=\"expanded = !expanded\"\r\n        ></vdr-order-history-entry-host>\r\n        <ng-template #defaultComponents>\r\n            <vdr-timeline-entry\r\n                [displayType]=\"getDisplayType(entry)\"\r\n                [iconShape]=\"getTimelineIcon(entry)\"\r\n                [createdAt]=\"entry.createdAt\"\r\n                [name]=\"getName(entry)\"\r\n                [featured]=\"isFeatured(entry)\"\r\n                [collapsed]=\"!expanded && !isFeatured(entry)\"\r\n                (expandClick)=\"expanded = !expanded\"\r\n            >\r\n                <ng-container [ngSwitch]=\"entry.type\">\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_STATE_TRANSITION\">\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            {{ 'order.history-order-fulfilled' | translate }}\r\n                        </div>\r\n                        <div class=\"title\" *ngIf=\"entry.data.to === 'Cancelled'\">\r\n                            {{ 'order.history-order-cancelled' | translate }}\r\n                        </div>\r\n                        <ng-template [ngIf]=\"entry.data.to !== 'Cancelled' && entry.data.to !== 'Delivered'\">\r\n                            {{\r\n                                'order.history-order-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_MODIFIED\">\r\n                        <div class=\"title\">\r\n                            {{ 'order.history-order-modified' | translate }}\r\n                        </div>\r\n                        <ng-container *ngIf=\"getModification(entry.data.modificationId) as modification\">\r\n                            {{ 'order.modify-order-price-difference' | translate }}:\r\n                            <strong>{{\r\n                                modification.priceChange | localeCurrency: order.currencyCode\r\n                            }}</strong>\r\n                            <vdr-chip colorType=\"success\" *ngIf=\"modification.isSettled\">{{\r\n                                'order.modification-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-chip colorType=\"error\" *ngIf=\"!modification.isSettled\">{{\r\n                                'order.modification-not-settled' | translate\r\n                            }}</vdr-chip>\r\n                            <vdr-history-entry-detail>\r\n                                <vdr-modification-detail\r\n                                    [order]=\"order\"\r\n                                    [modification]=\"modification\"\r\n                                ></vdr-modification-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_PAYMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Settled'; else regularPaymentTransition\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-payment-settled' | translate }}\r\n                            </div>\r\n                            {{ 'order.transaction-id' | translate }}: {{ getPayment(entry)?.transactionId }}\r\n                            <vdr-history-entry-detail *ngIf=\"getPayment(entry) as payment\">\r\n                                <vdr-payment-detail\r\n                                    [payment]=\"payment\"\r\n                                    [currencyCode]=\"order.currencyCode\"\r\n                                ></vdr-payment-detail>\r\n                            </vdr-history-entry-detail>\r\n                        </ng-container>\r\n                        <ng-template #regularPaymentTransition>\r\n                            {{\r\n                                'order.history-payment-transition'\r\n                                    | translate\r\n                                        : {\r\n                                              from: entry.data.from,\r\n                                              to: entry.data.to,\r\n                                              id: getPayment(entry)?.transactionId\r\n                                          }\r\n                            }}\r\n                        </ng-template>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_REFUND_TRANSITION\">\r\n                        {{\r\n                            'order.history-refund-transition'\r\n                                | translate\r\n                                    : { from: entry.data.from, to: entry.data.to, id: entry.data.refundId }\r\n                        }}\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_CANCELLATION\">\r\n                        {{\r\n                            'order.history-items-cancelled'\r\n                                | translate: { count: getCancelledQuantity(entry) }\r\n                        }}\r\n                        <vdr-history-entry-detail *ngIf=\"getCancelledItems(entry) as items\">\r\n                            <vdr-labeled-data [label]=\"'order.cancellation-reason' | translate\">\r\n                                {{ entry.data.reason }}\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.contents' | translate\">\r\n                                <vdr-simple-item-list [items]=\"items\"></vdr-simple-item-list>\r\n                            </vdr-labeled-data>\r\n                            <vdr-labeled-data [label]=\"'order.shipping-cancelled' | translate\">\r\n                                {{ entry.data.shippingCancelled }}\r\n                            </vdr-labeled-data>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT\">\r\n                        {{ 'order.history-fulfillment-created' | translate }}\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_FULFILLMENT_TRANSITION\">\r\n                        <ng-container *ngIf=\"entry.data.to === 'Delivered'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-delivered' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to === 'Shipped'\">\r\n                            <div class=\"title\">\r\n                                {{ 'order.history-fulfillment-shipped' | translate }}\r\n                            </div>\r\n                            {{ 'order.tracking-code' | translate }}: {{ getFulfillment(entry)?.trackingCode }}\r\n                        </ng-container>\r\n                        <ng-container *ngIf=\"entry.data.to !== 'Delivered' && entry.data.to !== 'Shipped'\">\r\n                            {{\r\n                                'order.history-fulfillment-transition'\r\n                                    | translate: { from: entry.data.from, to: entry.data.to }\r\n                            }}\r\n                        </ng-container>\r\n                        <vdr-history-entry-detail *ngIf=\"getFulfillment(entry) as fulfillment\">\r\n                            <vdr-fulfillment-detail\r\n                                [fulfillmentId]=\"fulfillment.id\"\r\n                                [order]=\"order\"\r\n                            ></vdr-fulfillment-detail>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_NOTE\">\r\n                        <div class=\"flex\">\r\n                            <div class=\"note-text\">\r\n                                <span *ngIf=\"entry.isPublic\" class=\"note-visibility public\">{{\r\n                                    'common.public' | translate\r\n                                }}</span>\r\n                                <span *ngIf=\"!entry.isPublic\" class=\"note-visibility private\">{{\r\n                                    'common.private' | translate\r\n                                }}</span>\r\n                                {{ entry.data.note }}\r\n                            </div>\r\n                            <div class=\"flex-spacer\"></div>\r\n                            <vdr-dropdown>\r\n                                <button class=\"icon-button\" vdrDropdownTrigger>\r\n                                    <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n                                </button>\r\n                                <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"updateNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | hasPermission)\"\r\n                                    >\r\n                                        <clr-icon shape=\"edit\"></clr-icon>\r\n                                        {{ 'common.edit' | translate }}\r\n                                    </button>\r\n                                    <div class=\"dropdown-divider\"></div>\r\n                                    <button\r\n                                        vdrDropdownItem\r\n                                        (click)=\"deleteNote.emit(entry)\"\r\n                                        [disabled]=\"!('UpdateOrder' | 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                        </div>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_APPLIED\">\r\n                        {{ 'order.history-coupon-code-applied' | translate }}:\r\n                        <vdr-chip>\r\n                            <a [routerLink]=\"['/marketing', 'promotions', entry.data.promotionId]\">{{\r\n                                entry.data.couponCode\r\n                            }}</a>\r\n                        </vdr-chip>\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchCase=\"type.ORDER_COUPON_REMOVED\">\r\n                        {{ 'order.history-coupon-code-removed' | translate }}:\r\n                        <vdr-chip\r\n                            ><span class=\"cancelled-coupon-code\">{{ entry.data.couponCode }}</span></vdr-chip\r\n                        >\r\n                    </ng-container>\r\n                    <ng-container *ngSwitchDefault>\r\n                        <div class=\"title\">\r\n                            {{ entry.type | translate }}\r\n                        </div>\r\n                        <vdr-history-entry-detail *ngIf=\"entry.data\">\r\n                            <vdr-object-tree [value]=\"entry.data\"></vdr-object-tree>\r\n                        </vdr-history-entry-detail>\r\n                    </ng-container>\r\n                </ng-container>\r\n            </vdr-timeline-entry>\r\n        </ng-template>\r\n    </ng-container>\r\n\r\n    <vdr-timeline-entry [isLast]=\"true\" [createdAt]=\"order.createdAt\" [featured]=\"true\">\r\n        <div class=\"title\">\r\n            {{ 'order.history-order-created' | translate }}\r\n        </div>\r\n    </vdr-timeline-entry>\r\n</div>\r\n", styles: [":host{display:block}.entry-list{margin-inline-start:calc(var(--space-unit) * 2)}.note-entry{display:flex;align-items:center}.note-entry .note{flex:1}.note-entry button{margin:0}.visibility-select{display:flex;justify-content:space-between;align-items:baseline}.visibility-select .public{color:var(--color-warning-700)}.visibility-select .private{color:var(--color-success-700)}textarea.note{flex:1;height:36px;border-radius:3px;margin-inline-end:6px}.note-text{color:var(--color-grey-800);white-space:pre-wrap}.cancelled-coupon-code{text-decoration:line-through}.note-visibility{text-transform:lowercase}.note-visibility.public{color:var(--color-warning-700)}.note-visibility.private{color:var(--color-success-700)}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.HistoryEntryComponentService }]; }, propDecorators: { order: [{
                 type: Input
             }], history: [{

package/esm2022/order/components/order-list/order-list.component.mjs

@@ -17,6 +17,7 @@ export class OrderListComponent extends TypedBaseListComponent {
         this.OrderType = OrderType;
         this.customFields = this.getCustomFieldConfig('Order');
         this.filters = this.createFilterCollection()
+            .addIdFilter()
             .addDateFilters()
             .addFilter({
             name: 'active',
@@ -143,11 +144,11 @@ export class OrderListComponent extends TypedBaseListComponent {
             return '';
         }
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderListComponent, deps: [{ token: i1.ServerConfigService }, { token: i1.ChannelService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderListComponent, selector: "vdr-order-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n            <ng-container *ngIf=\"canCreateDraftOrder\">\r\n                <a class=\"btn\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                    <clr-icon shape=\"plus\"></clr-icon>\r\n                    {{ 'catalog.create-draft-order' | translate }}\r\n                </a>\r\n            </ng-container>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    id=\"order-list\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"order-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'order.search-by-order-filters' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.created-at' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.code' | translate\" [optional]=\"false\">\r\n        <ng-template let-order=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"order.state === 'Draft' ? ['./draft', order.id] : ['./', order.id]\"\r\n                ><span>{{ order.code }}</span>\r\n                <clr-icon shape=\"arrow right\"></clr-icon>\r\n            </a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.customer' | translate\" [sort]=\"sorts.get('customerLastName')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-customer-label\r\n                [customer]=\"order.customer\"\r\n                (click)=\"$event.stopPropagation()\"\r\n            ></vdr-customer-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.order-type' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Regular\">{{ 'order.order-type-regular' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Aggregate\">{{ 'order.order-type-aggregate' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Seller\">{{ 'order.order-type-seller' | translate }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.state' | translate\" [sort]=\"sorts.get('state')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.total' | translate\" [sort]=\"sorts.get('totalWithTax')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.totalWithTax | localeCurrency : order.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.updated-at' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.updatedAt | timeAgo }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.placed-at' | translate\" [sort]=\"sorts.get('orderPlacedAt')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.orderPlacedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.shipping' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ getShippingNames(order) }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { kind: "component", type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.TimeAgoPipe, name: "timeAgo" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderListComponent, deps: [{ token: i1.ServerConfigService }, { token: i1.ChannelService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderListComponent, selector: "vdr-order-list", usesInheritance: true, ngImport: i0, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n            <ng-container *ngIf=\"canCreateDraftOrder\">\r\n                <a class=\"btn\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                    <clr-icon shape=\"plus\"></clr-icon>\r\n                    {{ 'catalog.create-draft-order' | translate }}\r\n                </a>\r\n            </ng-container>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    id=\"order-list\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"order-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'order.search-by-order-filters' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.created-at' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.code' | translate\" [optional]=\"false\">\r\n        <ng-template let-order=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"order.state === 'Draft' ? ['./draft', order.id] : ['./', order.id]\"\r\n                ><span>{{ order.code }}</span>\r\n                <clr-icon shape=\"arrow right\"></clr-icon>\r\n            </a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.customer' | translate\" [sort]=\"sorts.get('customerLastName')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-customer-label\r\n                [customer]=\"order.customer\"\r\n                (click)=\"$event.stopPropagation()\"\r\n            ></vdr-customer-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.order-type' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Regular\">{{ 'order.order-type-regular' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Aggregate\">{{ 'order.order-type-aggregate' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Seller\">{{ 'order.order-type-seller' | translate }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.state' | translate\" [sort]=\"sorts.get('state')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.total' | translate\" [sort]=\"sorts.get('totalWithTax')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.totalWithTax | localeCurrency : order.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.updated-at' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.updatedAt | timeAgo }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.placed-at' | translate\" [sort]=\"sorts.get('orderPlacedAt')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.orderPlacedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.shipping' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ getShippingNames(order) }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"], dependencies: [{ kind: "directive", type: i2.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i1.ActionBarComponent, selector: "vdr-action-bar" }, { kind: "component", type: i1.ActionBarRightComponent, selector: "vdr-ab-right", inputs: ["grow"] }, { kind: "component", type: i1.ChipComponent, selector: "vdr-chip", inputs: ["icon", "invert", "colorFrom", "colorType"], outputs: ["iconClick"] }, { kind: "component", type: i1.CustomerLabelComponent, selector: "vdr-customer-label", inputs: ["customer"] }, { kind: "component", type: i1.OrderStateLabelComponent, selector: "vdr-order-state-label", inputs: ["state"] }, { kind: "directive", type: i1.IfPermissionsDirective, selector: "[vdrIfPermissions]", inputs: ["vdrIfPermissions", "vdrIfPermissionsElse"] }, { kind: "component", type: i1.ActionBarItemsComponent, selector: "vdr-action-bar-items", inputs: ["locationId"] }, { kind: "component", type: i1.BulkActionMenuComponent, selector: "vdr-bulk-action-menu", inputs: ["locationId", "selectionManager", "hostComponent"] }, { kind: "component", type: i1.DataTable2Component, selector: "vdr-data-table-2", inputs: ["id", "items", "itemsPerPage", "currentPage", "totalItems", "emptyStateLabel", "filters", "activeIndex"], outputs: ["pageChange", "itemsPerPageChange"] }, { kind: "component", type: i1.DataTable2ColumnComponent, selector: "vdr-dt2-column", inputs: ["expand", "heading", "align", "sort", "optional", "hiddenByDefault", "orderable"], exportAs: ["row"] }, { kind: "component", type: i1.DataTable2SearchComponent, selector: "vdr-dt2-search", inputs: ["searchTermControl", "searchTermPlaceholder"] }, { kind: "component", type: i1.DataTableCustomFieldColumnComponent, selector: "vdr-dt2-custom-field-column", inputs: ["customField", "sorts"], exportAs: ["row"] }, { kind: "component", type: i1.PageBlockComponent, selector: "vdr-page-block" }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }, { kind: "pipe", type: i5.TranslatePipe, name: "translate" }, { kind: "pipe", type: i1.TimeAgoPipe, name: "timeAgo" }, { kind: "pipe", type: i1.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i1.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderListComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderListComponent, decorators: [{
             type: Component,
             args: [{ selector: 'vdr-order-list', changeDetection: ChangeDetectionStrategy.OnPush, template: "<vdr-page-block>\r\n    <vdr-action-bar>\r\n        <vdr-ab-right>\r\n            <vdr-action-bar-items locationId=\"order-list\"></vdr-action-bar-items>\r\n            <ng-container *ngIf=\"canCreateDraftOrder\">\r\n                <a class=\"btn\" *vdrIfPermissions=\"['CreateOrder']\" [routerLink]=\"['./draft/create']\">\r\n                    <clr-icon shape=\"plus\"></clr-icon>\r\n                    {{ 'catalog.create-draft-order' | translate }}\r\n                </a>\r\n            </ng-container>\r\n        </vdr-ab-right>\r\n    </vdr-action-bar>\r\n</vdr-page-block>\r\n<vdr-data-table-2\r\n    class=\"mt-2\"\r\n    id=\"order-list\"\r\n    [items]=\"items$ | async\"\r\n    [itemsPerPage]=\"itemsPerPage$ | async\"\r\n    [totalItems]=\"totalItems$ | async\"\r\n    [currentPage]=\"currentPage$ | async\"\r\n    [filters]=\"filters\"\r\n    (pageChange)=\"setPageNumber($event)\"\r\n    (itemsPerPageChange)=\"setItemsPerPage($event)\"\r\n>\r\n    <vdr-bulk-action-menu\r\n        locationId=\"order-list\"\r\n        [hostComponent]=\"this\"\r\n        [selectionManager]=\"selectionManager\"\r\n    ></vdr-bulk-action-menu>\r\n    <vdr-dt2-search\r\n        [searchTermControl]=\"searchTermControl\"\r\n        [searchTermPlaceholder]=\"'order.search-by-order-filters' | translate\"\r\n    />\r\n    <vdr-dt2-column [heading]=\"'common.id' | translate\" [hiddenByDefault]=\"true\" [sort]=\"sorts.get('id')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.id }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.created-at' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.createdAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.code' | translate\" [optional]=\"false\">\r\n        <ng-template let-order=\"item\">\r\n            <a class=\"button-ghost\" [routerLink]=\"order.state === 'Draft' ? ['./draft', order.id] : ['./', order.id]\"\r\n                ><span>{{ order.code }}</span>\r\n                <clr-icon shape=\"arrow right\"></clr-icon>\r\n            </a>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.customer' | translate\" [sort]=\"sorts.get('customerLastName')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-customer-label\r\n                [customer]=\"order.customer\"\r\n                (click)=\"$event.stopPropagation()\"\r\n            ></vdr-customer-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.order-type' | translate\" [hiddenByDefault]=\"true\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Regular\">{{ 'order.order-type-regular' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Aggregate\">{{ 'order.order-type-aggregate' | translate }}</vdr-chip>\r\n            <vdr-chip *ngIf=\"order.type === OrderType.Seller\">{{ 'order.order-type-seller' | translate }}</vdr-chip>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.state' | translate\" [sort]=\"sorts.get('state')\">\r\n        <ng-template let-order=\"item\">\r\n            <vdr-order-state-label [state]=\"order.state\"></vdr-order-state-label>\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.total' | translate\" [sort]=\"sorts.get('totalWithTax')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.totalWithTax | localeCurrency : order.currencyCode }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'common.updated-at' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.updatedAt | timeAgo }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.placed-at' | translate\" [sort]=\"sorts.get('orderPlacedAt')\">\r\n        <ng-template let-order=\"item\">\r\n            {{ order.orderPlacedAt | localeDate : 'short' }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-column [heading]=\"'order.shipping' | translate\">\r\n        <ng-template let-order=\"item\">\r\n            {{ getShippingNames(order) }}\r\n        </ng-template>\r\n    </vdr-dt2-column>\r\n    <vdr-dt2-custom-field-column\r\n        *ngFor=\"let customField of customFields\"\r\n        [customField]=\"customField\"\r\n        [sorts]=\"sorts\"\r\n    />\r\n</vdr-data-table-2>\r\n", styles: [".search-form{display:flex;flex-direction:column;align-items:baseline;width:100%;max-width:100vw;margin-bottom:6px}.filter-presets{max-width:90vw;overflow-x:auto}.search-input{margin-top:6px;min-width:300px}.custom-filters{overflow:hidden;max-height:0;padding-bottom:6px}.custom-filters.expanded{max-height:initial}.custom-filters>form{display:flex;flex-direction:column;align-items:center}.custom-filters>form>div{width:100%}ng-select{flex:1;min-width:200px;height:36px}ng-select ::ng-deep .ng-select-container{height:36px}\n"] }]
         }], ctorParameters: function () { return [{ type: i1.ServerConfigService }, { type: i1.ChannelService }]; } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3JkZXItbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL29yZGVyLWxpc3Qvb3JkZXItbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL29yZGVyLWxpc3Qvb3JkZXItbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzNFLE9BQU8sRUFBRSxNQUFNLElBQUksQ0FBQyxFQUFFLE1BQU0seUNBQXlDLENBQUM7QUFDdEUsT0FBTyxFQUVILG9CQUFvQixFQUNwQiw2QkFBNkIsRUFDN0IsZUFBZSxFQUVmLFNBQVMsRUFFVCxzQkFBc0IsR0FDekIsTUFBTSx3QkFBd0IsQ0FBQztBQUVoQyxPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFRckMsTUFBTSxPQUFPLGtCQUNULFNBQVEsc0JBQTZEO0lBOEVyRSxZQUFzQixtQkFBd0MsRUFBVSxjQUE4QjtRQUNsRyxLQUFLLEVBQUUsQ0FBQztRQURVLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFBVSxtQkFBYyxHQUFkLGNBQWMsQ0FBZ0I7UUEzRXRHLGdCQUFXLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLHFCQUFxQixFQUFFLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzdFLGNBQVMsR0FBRyxTQUFTLENBQUM7UUFDdEIsaUJBQVksR0FBRyxJQUFJLENBQUMsb0JBQW9CLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDbEQsWUFBTyxHQUFHLElBQUksQ0FBQyxzQkFBc0IsRUFBRTthQUMzQyxjQUFjLEVBQUU7YUFD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LENBQUMsTUFBTSxFQUFFO1lBQzVCLE9BQU8sS0FBSyxDQUFDLGFBQWEsQ0FBQyxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQUUsQ0FBQyxZQUFZLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUMvRjthQUFNO1lBQ0gsT0FBTyxFQUFFLENBQUM7U0FDYjtJQUNMLENBQUM7OEdBbEpRLGtCQUFrQjtrR0FBbEIsa0JBQWtCLDZFQ3JCL0IsOGdKQWlHQTs7MkZENUVhLGtCQUFrQjtrQkFOOUIsU0FBUzsrQkFDSSxnQkFBZ0IsbUJBR1QsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBtYXJrZXIgYXMgXyB9IGZyb20gJ0BiaWVzYmplcmcvbmd4LXRyYW5zbGF0ZS1leHRyYWN0LW1hcmtlcic7XHJcbmltcG9ydCB7XHJcbiAgICBDaGFubmVsU2VydmljZSxcclxuICAgIEdldE9yZGVyTGlzdERvY3VtZW50LFxyXG4gICAgZ2V0T3JkZXJTdGF0ZVRyYW5zbGF0aW9uVG9rZW4sXHJcbiAgICBMb2dpY2FsT3BlcmF0b3IsXHJcbiAgICBPcmRlckxpc3RPcHRpb25zLFxyXG4gICAgT3JkZXJUeXBlLFxyXG4gICAgU2VydmVyQ29uZmlnU2VydmljZSxcclxuICAgIFR5cGVkQmFzZUxpc3RDb21wb25lbnQsXHJcbn0gZnJvbSAnQHZlbmR1cmUvYWRtaW4tdWkvY29yZSc7XHJcbmltcG9ydCB7IE9yZGVyIH0gZnJvbSAnQHZlbmR1cmUvY29tbW9uL2xpYi9nZW5lcmF0ZWQtdHlwZXMnO1xyXG5pbXBvcnQgeyB0YXAgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAndmRyLW9yZGVyLWxpc3QnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL29yZGVyLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vb3JkZXItbGlzdC5jb21wb25lbnQuc2NzcyddLFxyXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBPcmRlckxpc3RDb21wb25lbnRcclxuICAgIGV4dGVuZHMgVHlwZWRCYXNlTGlzdENvbXBvbmVudDx0eXBlb2YgR2V0T3JkZXJMaXN0RG9jdW1lbnQsICdvcmRlcnMnPlxyXG4gICAgaW1wbGVtZW50cyBPbkluaXRcclxue1xyXG4gICAgb3JkZXJTdGF0ZXMgPSB0aGlzLnNlcnZlckNvbmZpZ1NlcnZpY2UuZ2V0T3JkZXJQcm9jZXNzU3RhdGVzKCkubWFwKGl0ZW0gPT4gaXRlbS5uYW1lKTtcclxuICAgIHJlYWRvbmx5IE9yZGVyVHlwZSA9IE9yZGVyVHlwZTtcclxuICAgIHJlYWRvbmx5IGN1c3RvbUZpZWxkcyA9IHRoaXMuZ2V0Q3VzdG9tRmllbGRDb25maWcoJ09yZGVyJyk7XHJcbiAgICByZWFkb25seSBmaWx0ZXJzID0gdGhpcy5jcmVhdGVGaWx0ZXJDb2xsZWN0aW9uKClcclxuICAgICAgICAuYWRkRGF0ZUZpbHRlcnMoKVxyXG4gICAgICAgIC5hZGRGaWx0ZXIoe1xyXG4gICAgICAgICAgICBuYW1lOiAnYWN0aXZlJyxcclxuICAgICAgICAgICAgdHlwZTogeyBraW5kOiAnYm9vbGVhbicgfSxcclxuICAgICAgICAgICAgbGFiZWw6IF8oJ29yZGVyLmZpbHRlci1pcy1hY3RpdmUnKSxcclxuICAgICAgICAgICAgZmlsdGVyRmllbGQ6ICdhY3RpdmUnLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEZpbHRlcih7XHJcbiAgICAgICAgICAgIG5hbWU6ICd0b3RhbFdpdGhUYXgnLFxyXG4gICAgICAgICAgICB0eXBlOiB7IGtpbmQ6ICdudW1iZXInLCBpbnB1dFR5cGU6ICdjdXJyZW5jeScsIGN1cnJlbmN5Q29kZTogJ1VTRCcgfSxcclxuICAgICAgICAgICAgbGFiZWw6IF8oJ29yZGVyLnRvdGFsJyksXHJcbiAgICAgICAgICAgIGZpbHRlckZpZWxkOiAndG90YWxXaXRoVGF4JyxcclxuICAgICAgICB9KVxyXG4gICAgICAgIC5hZGRGaWx0ZXIoe1xyXG4gICAgICAgICAgICBuYW1lOiAnc3RhdGUnLFxyXG4gICAgICAgICAgICB0eXBlOiB7XHJcbiAgICAgICAgICAgICAgICBraW5kOiAnc2VsZWN0JyxcclxuICAgICAgICAgICAgICAgIG9wdGlvbnM6IHRoaXMub3JkZXJTdGF0ZXMubWFwKHMgPT4gKHsgdmFsdWU6IHMsIGxhYmVsOiBnZXRPcmRlclN0YXRlVHJhbnNsYXRpb25Ub2tlbihzKSB9KSksXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIGxhYmVsOiBfKCdvcmRlci5zdGF0ZScpLFxyXG4gICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ3N0YXRlJyxcclxuICAgICAgICB9KVxyXG4gICAgICAgIC5hZGRGaWx0ZXIoe1xyXG4gICAgICAgICAgICBuYW1lOiAndHlwZScsXHJcbiAgICAgICAgICAgIHR5cGU6IHtcclxuICAgICAgICAgICAgICAgIGtpbmQ6ICdzZWxlY3QnLFxyXG4gICAgICAgICAgICAgICAgb3B0aW9uczogW1xyXG4gICAgICAgICAgICAgICAgICAgIHsgdmFsdWU6IE9yZGVyVHlwZS5SZWd1bGFyLCBsYWJlbDogXygnb3JkZXIub3JkZXItdHlwZS1yZWd1bGFyJykgfSxcclxuICAgICAgICAgICAgICAgICAgICB7IHZhbHVlOiBPcmRlclR5cGUuQWdncmVnYXRlLCBsYWJlbDogXygnb3JkZXIub3JkZXItdHlwZS1hZ2dyZWdhdGUnKSB9LFxyXG4gICAgICAgICAgICAgICAgICAgIHsgdmFsdWU6IE9yZGVyVHlwZS5TZWxsZXIsIGxhYmVsOiBfKCdvcmRlci5vcmRlci10eXBlLXNlbGxlcicpIH0sXHJcbiAgICAgICAgICAgICAgICBdLFxyXG4gICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnb3JkZXIub3JkZXItdHlwZScpLFxyXG4gICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ3R5cGUnLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEZpbHRlcih7XHJcbiAgICAgICAgICAgIG5hbWU6ICdvcmRlclBsYWNlZEF0JyxcclxuICAgICAgICAgICAgdHlwZTogeyBraW5kOiAnZGF0ZVJhbmdlJyB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnb3JkZXIucGxhY2VkLWF0JyksXHJcbiAgICAgICAgICAgIGZpbHRlckZpZWxkOiAnb3JkZXJQbGFjZWRBdCcsXHJcbiAgICAgICAgfSlcclxuICAgICAgICAuYWRkRmlsdGVyKHtcclxuICAgICAgICAgICAgbmFtZTogJ2N1c3RvbWVyTGFzdE5hbWUnLFxyXG4gICAgICAgICAgICB0eXBlOiB7IGtpbmQ6ICd0ZXh0JyB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnY3VzdG9tZXIubGFzdC1uYW1lJyksXHJcbiAgICAgICAgICAgIGZpbHRlckZpZWxkOiAnY3VzdG9tZXJMYXN0TmFtZScsXHJcbiAgICAgICAgfSlcclxuICAgICAgICAuYWRkRmlsdGVyKHtcclxuICAgICAgICAgICAgbmFtZTogJ3RyYW5zYWN0aW9uSWQnLFxyXG4gICAgICAgICAgICB0eXBlOiB7IGtpbmQ6ICd0ZXh0JyB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnb3JkZXIudHJhbnNhY3Rpb24taWQnKSxcclxuICAgICAgICAgICAgZmlsdGVyRmllbGQ6ICd0cmFuc2FjdGlvbklkJyxcclxuICAgICAgICB9KVxyXG4gICAgICAgIC5hZGRDdXN0b21GaWVsZEZpbHRlcnModGhpcy5jdXN0b21GaWVsZHMpXHJcbiAgICAgICAgLmNvbm5lY3RUb1JvdXRlKHRoaXMucm91dGUpO1xyXG5cclxuICAgIHJlYWRvbmx5IHNvcnRzID0gdGhpcy5jcmVhdGVTb3J0Q29sbGVjdGlvbigpXHJcbiAgICAgICAgLmRlZmF1bHRTb3J0KCd1cGRhdGVkQXQnLCAnREVTQycpXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAnaWQnIH0pXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAnY3JlYXRlZEF0JyB9KVxyXG4gICAgICAgIC5hZGRTb3J0KHsgbmFtZTogJ3VwZGF0ZWRBdCcgfSlcclxuICAgICAgICAuYWRkU29ydCh7IG5hbWU6ICdvcmRlclBsYWNlZEF0JyB9KVxyXG4gICAgICAgIC5hZGRTb3J0KHsgbmFtZTogJ2N1c3RvbWVyTGFzdE5hbWUnIH0pXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAnc3RhdGUnIH0pXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAndG90YWxXaXRoVGF4JyB9KVxyXG4gICAgICAgIC5hZGRDdXN0b21GaWVsZFNvcnRzKHRoaXMuY3VzdG9tRmllbGRzKVxyXG4gICAgICAgIC5jb25uZWN0VG9Sb3V0ZSh0aGlzLnJvdXRlKTtcclxuXHJcbiAgICBjYW5DcmVhdGVEcmFmdE9yZGVyID0gZmFsc2U7XHJcbiAgICBwcml2YXRlIGFjdGl2ZUNoYW5uZWxJc0RlZmF1bHRDaGFubmVsID0gZmFsc2U7XHJcblxyXG4gICAgY29uc3RydWN0b3IocHJvdGVjdGVkIHNlcnZlckNvbmZpZ1NlcnZpY2U6IFNlcnZlckNvbmZpZ1NlcnZpY2UsIHByaXZhdGUgY2hhbm5lbFNlcnZpY2U6IENoYW5uZWxTZXJ2aWNlKSB7XHJcbiAgICAgICAgc3VwZXIoKTtcclxuICAgICAgICBzdXBlci5jb25maWd1cmUoe1xyXG4gICAgICAgICAgICBkb2N1bWVudDogR2V0T3JkZXJMaXN0RG9jdW1lbnQsXHJcbiAgICAgICAgICAgIGdldEl0ZW1zOiByZXN1bHQgPT4gcmVzdWx0Lm9yZGVycyxcclxuICAgICAgICAgICAgc2V0VmFyaWFibGVzOiAoc2tpcCwgdGFrZSkgPT4gdGhpcy5jcmVhdGVRdWVyeU9wdGlvbnMoc2tpcCwgdGFrZSwgdGhpcy5zZWFyY2hUZXJtQ29udHJvbC52YWx1ZSksXHJcbiAgICAgICAgICAgIHJlZnJlc2hMaXN0T25DaGFuZ2VzOiBbdGhpcy5maWx0ZXJzLnZhbHVlQ2hhbmdlcywgdGhpcy5zb3J0cy52YWx1ZUNoYW5nZXNdLFxyXG4gICAgICAgIH0pO1xyXG5cclxuICAgICAgICB0aGlzLmNhbkNyZWF0ZURyYWZ0T3JkZXIgPSAhIXRoaXMuc2VydmVyQ29uZmlnU2VydmljZVxyXG4gICAgICAgICAgICAuZ2V0T3JkZXJQcm9jZXNzU3RhdGVzKClcclxuICAgICAgICAgICAgLmZpbmQoc3RhdGUgPT4gc3RhdGUubmFtZSA9PT0gJ0NyZWF0ZWQnKVxyXG4gICAgICAgICAgICA/LnRvLmluY2x1ZGVzKCdEcmFmdCcpO1xyXG4gICAgfVxyXG5cclxuICAgIG5nT25Jbml0KCkge1xyXG4gICAgICAgIHN1cGVyLm5nT25Jbml0KCk7XHJcbiAgICAgICAgY29uc3QgaXNEZWZhdWx0Q2hhbm5lbCQgPSB0aGlzLmNoYW5uZWxTZXJ2aWNlLmRlZmF1bHRDaGFubmVsSXNBY3RpdmUkLnBpcGUoXHJcbiAgICAgICAgICAgIHRhcChpc0RlZmF1bHQgPT4gKHRoaXMuYWN0aXZlQ2hhbm5lbElzRGVmYXVsdENoYW5uZWwgPSBpc0RlZmF1bHQpKSxcclxuICAgICAgICApO1xyXG4gICAgICAgIHN1cGVyLnJlZnJlc2hMaXN0T25DaGFuZ2VzKHRoaXMuZmlsdGVycy52YWx1ZUNoYW5nZXMsIHRoaXMuc29ydHMudmFsdWVDaGFuZ2VzLCBpc0RlZmF1bHRDaGFubmVsJCk7XHJcbiAgICB9XHJcblxyXG4gICAgcHJpdmF0ZSBjcmVhdGVRdWVyeU9wdGlvbnMoXHJcbiAgICAgICAgLy8gZXNsaW50LWRpc2FibGUtbmV4dC1saW5lIEB0eXBlc2NyaXB0LWVzbGludC9uby1zaGFkb3dcclxuICAgICAgICBza2lwOiBudW1iZXIsXHJcbiAgICAgICAgdGFrZTogbnVtYmVyLFxyXG4gICAgICAgIHNlYXJjaFRlcm06IHN0cmluZyB8IG51bGwsXHJcbiAgICApOiB7IG9wdGlvbnM6IE9yZGVyTGlzdE9wdGlvbnMgfSB7XHJcbiAgICAgICAgbGV0IGZpbHRlcklucHV0ID0gdGhpcy5maWx0ZXJzLmNyZWF0ZUZpbHRlcklucHV0KCk7XHJcbiAgICAgICAgaWYgKHRoaXMuYWN0aXZlQ2hhbm5lbElzRGVmYXVsdENoYW5uZWwpIHtcclxuICAgICAgICAgICAgZmlsdGVySW5wdXQgPSB7XHJcbiAgICAgICAgICAgICAgICAuLi4oZmlsdGVySW5wdXQgPz8ge30pLFxyXG4gICAgICAgICAgICB9O1xyXG4gICAgICAgIH1cclxuICAgICAgICBpZiAoc2VhcmNoVGVybSkge1xyXG4gICAgICAgICAgICBmaWx0ZXJJbnB1dCA9IHtcclxuICAgICAgICAgICAgICAgIGNvZGU6IHtcclxuICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcclxuICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICBjdXN0b21lckxhc3ROYW1lOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgY29udGFpbnM6IHNlYXJjaFRlcm0sXHJcbiAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICAgICAgdHJhbnNhY3Rpb25JZDoge1xyXG4gICAgICAgICAgICAgICAgICAgIGNvbnRhaW5zOiBzZWFyY2hUZXJtLFxyXG4gICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgfTtcclxuICAgICAgICB9XHJcbiAgICAgICAgcmV0dXJuIHtcclxuICAgICAgICAgICAgb3B0aW9uczoge1xyXG4gICAgICAgICAgICAgICAgc2tpcCxcclxuICAgICAgICAgICAgICAgIHRha2UsXHJcbiAgICAgICAgICAgICAgICBmaWx0ZXI6IHtcclxuICAgICAgICAgICAgICAgICAgICAuLi4oZmlsdGVySW5wdXQgPz8ge30pLFxyXG4gICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgIGZpbHRlck9wZXJhdG9yOiBzZWFyY2hUZXJtID8gTG9naWNhbE9wZXJhdG9yLk9SIDogTG9naWNhbE9wZXJhdG9yLkFORCxcclxuICAgICAgICAgICAgICAgIHNvcnQ6IHRoaXMuc29ydHMuY3JlYXRlU29ydElucHV0KCksXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgfTtcclxuICAgIH1cclxuXHJcbiAgICBnZXRTaGlwcGluZ05hbWVzKG9yZGVyOiBPcmRlcikge1xyXG4gICAgICAgIGlmIChvcmRlci5zaGlwcGluZ0xpbmVzLmxlbmd0aCkge1xyXG4gICAgICAgICAgICByZXR1cm4gb3JkZXIuc2hpcHBpbmdMaW5lcy5tYXAoc2hpcHBpbmdMaW5lID0+IHNoaXBwaW5nTGluZS5zaGlwcGluZ01ldGhvZC5uYW1lKS5qb2luKCcsICcpO1xyXG4gICAgICAgIH0gZWxzZSB7XHJcbiAgICAgICAgICAgIHJldHVybiAnJztcclxuICAgICAgICB9XHJcbiAgICB9XHJcbn1cclxuIiwiPHZkci1wYWdlLWJsb2NrPlxyXG4gICAgPHZkci1hY3Rpb24tYmFyPlxyXG4gICAgICAgIDx2ZHItYWItcmlnaHQ+XHJcbiAgICAgICAgICAgIDx2ZHItYWN0aW9uLWJhci1pdGVtcyBsb2NhdGlvbklkPVwib3JkZXItbGlzdFwiPjwvdmRyLWFjdGlvbi1iYXItaXRlbXM+XHJcbiAgICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJjYW5DcmVhdGVEcmFmdE9yZGVyXCI+XHJcbiAgICAgICAgICAgICAgICA8YSBjbGFzcz1cImJ0blwiICp2ZHJJZlBlcm1pc3Npb25zPVwiWydDcmVhdGVPcmRlciddXCIgW3JvdXRlckxpbmtdPVwiWycuL2RyYWZ0L2NyZWF0ZSddXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgPGNsci1pY29uIHNoYXBlPVwicGx1c1wiPjwvY2xyLWljb24+XHJcbiAgICAgICAgICAgICAgICAgICAge3sgJ2NhdGFsb2cuY3JlYXRlLWRyYWZ0LW9yZGVyJyB8IHRyYW5zbGF0ZSB9fVxyXG4gICAgICAgICAgICAgICAgPC9hPlxyXG4gICAgICAgICAgICA8L25nLWNvbnRhaW5lcj5cclxuICAgICAgICA8L3Zkci1hYi1yaWdodD5cclxuICAgIDwvdmRyLWFjdGlvbi1iYXI+XHJcbjwvdmRyLXBhZ2UtYmxvY2s+XHJcbjx2ZHItZGF0YS10YWJsZS0yXHJcbiAgICBjbGFzcz1cIm10LTJcIlxyXG4gICAgaWQ9XCJvcmRlci1saXN0XCJcclxuICAgIFtpdGVtc109XCJpdGVtcyQgfCBhc3luY1wiXHJcbiAgICBbaXRlbXNQZXJQYWdlXT1cIml0ZW1zUGVyUGFnZSQgfCBhc3luY1wiXHJcbiAgICBbdG90YWxJdGVtc109XCJ0b3RhbEl0ZW1zJCB8IGFzeW5jXCJcclxuICAgIFtjdXJyZW50UGFnZV09XCJjdXJyZW50UGFnZSQgfCBhc3luY1wiXHJcbiAgICBbZmlsdGVyc109XCJmaWx0ZXJzXCJcclxuICAgIChwYWdlQ2hhbmdlKT1cInNldFBhZ2VOdW1iZXIoJGV2ZW50KVwiXHJcbiAgICAoaXRlbXNQZXJQYWdlQ2hhbmdlKT1cInNldEl0ZW1zUGVyUGFnZSgkZXZlbnQpXCJcclxuPlxyXG4gICAgPHZkci1idWxrLWFjdGlvbi1tZW51XHJcbiAgICAgICAgbG9jYXRpb25JZD1cIm9yZGVyLWxpc3RcIlxyXG4gICAgICAgIFtob3N0Q29tcG9uZW50XT1cInRoaXNcIlxyXG4gICAgICAgIFtzZWxlY3Rpb25NYW5hZ2VyXT1cInNlbGVjdGlvbk1hbmFnZXJcIlxyXG4gICAgPjwvdmRyLWJ1bGstYWN0aW9uLW1lbnU+XHJcbiAgICA8dmRyLWR0Mi1zZWFyY2hcclxuICAgICAgICBbc2VhcmNoVGVybUNvbnRyb2xdPVwic2VhcmNoVGVybUNvbnRyb2xcIlxyXG4gICAgICAgIFtzZWFyY2hUZXJtUGxhY2Vob2xkZXJdPVwiJ29yZGVyLnNlYXJjaC1ieS1vcmRlci1maWx0ZXJzJyB8IHRyYW5zbGF0ZVwiXHJcbiAgICAvPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uaWQnIHwgdHJhbnNsYXRlXCIgW2hpZGRlbkJ5RGVmYXVsdF09XCJ0cnVlXCIgW3NvcnRdPVwic29ydHMuZ2V0KCdpZCcpXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1vcmRlcj1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgb3JkZXIuaWQgfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY29tbW9uLmNyZWF0ZWQtYXQnIHwgdHJhbnNsYXRlXCIgW2hpZGRlbkJ5RGVmYXVsdF09XCJ0cnVlXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1vcmRlcj1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgb3JkZXIuY3JlYXRlZEF0IHwgbG9jYWxlRGF0ZSA6ICdzaG9ydCcgfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInY29tbW9uLmNvZGUnIHwgdHJhbnNsYXRlXCIgW29wdGlvbmFsXT1cImZhbHNlXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1vcmRlcj1cIml0ZW1cIj5cclxuICAgICAgICAgICAgPGEgY2xhc3M9XCJidXR0b24tZ2hvc3RcIiBbcm91dGVyTGlua109XCJvcmRlci5zdGF0ZSA9PT0gJ0RyYWZ0JyA/IFsnLi9kcmFmdCcsIG9yZGVyLmlkXSA6IFsnLi8nLCBvcmRlci5pZF1cIlxyXG4gICAgICAgICAgICAgICAgPjxzcGFuPnt7IG9yZGVyLmNvZGUgfX08L3NwYW4+XHJcbiAgICAgICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJhcnJvdyByaWdodFwiPjwvY2xyLWljb24+XHJcbiAgICAgICAgICAgIDwvYT5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInb3JkZXIuY3VzdG9tZXInIHwgdHJhbnNsYXRlXCIgW3NvcnRdPVwic29ydHMuZ2V0KCdjdXN0b21lckxhc3ROYW1lJylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICA8dmRyLWN1c3RvbWVyLWxhYmVsXHJcbiAgICAgICAgICAgICAgICBbY3VzdG9tZXJdPVwib3JkZXIuY3VzdG9tZXJcIlxyXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cIiRldmVudC5zdG9wUHJvcGFnYXRpb24oKVwiXHJcbiAgICAgICAgICAgID48L3Zkci1jdXN0b21lci1sYWJlbD5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInb3JkZXIub3JkZXItdHlwZScgfCB0cmFuc2xhdGVcIiBbaGlkZGVuQnlEZWZhdWx0XT1cInRydWVcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICA8dmRyLWNoaXAgKm5nSWY9XCJvcmRlci50eXBlID09PSBPcmRlclR5cGUuUmVndWxhclwiPnt7ICdvcmRlci5vcmRlci10eXBlLXJlZ3VsYXInIHwgdHJhbnNsYXRlIH19PC92ZHItY2hpcD5cclxuICAgICAgICAgICAgPHZkci1jaGlwICpuZ0lmPVwib3JkZXIudHlwZSA9PT0gT3JkZXJUeXBlLkFnZ3JlZ2F0ZVwiPnt7ICdvcmRlci5vcmRlci10eXBlLWFnZ3JlZ2F0ZScgfCB0cmFuc2xhdGUgfX08L3Zkci1jaGlwPlxyXG4gICAgICAgICAgICA8dmRyLWNoaXAgKm5nSWY9XCJvcmRlci50eXBlID09PSBPcmRlclR5cGUuU2VsbGVyXCI+e3sgJ29yZGVyLm9yZGVyLXR5cGUtc2VsbGVyJyB8IHRyYW5zbGF0ZSB9fTwvdmRyLWNoaXA+XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ29yZGVyLnN0YXRlJyB8IHRyYW5zbGF0ZVwiIFtzb3J0XT1cInNvcnRzLmdldCgnc3RhdGUnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIDx2ZHItb3JkZXItc3RhdGUtbGFiZWwgW3N0YXRlXT1cIm9yZGVyLnN0YXRlXCI+PC92ZHItb3JkZXItc3RhdGUtbGFiZWw+XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ29yZGVyLnRvdGFsJyB8IHRyYW5zbGF0ZVwiIFtzb3J0XT1cInNvcnRzLmdldCgndG90YWxXaXRoVGF4JylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBvcmRlci50b3RhbFdpdGhUYXggfCBsb2NhbGVDdXJyZW5jeSA6IG9yZGVyLmN1cnJlbmN5Q29kZSB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24udXBkYXRlZC1hdCcgfCB0cmFuc2xhdGVcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBvcmRlci51cGRhdGVkQXQgfCB0aW1lQWdvIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ29yZGVyLnBsYWNlZC1hdCcgfCB0cmFuc2xhdGVcIiBbc29ydF09XCJzb3J0cy5nZXQoJ29yZGVyUGxhY2VkQXQnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IG9yZGVyLm9yZGVyUGxhY2VkQXQgfCBsb2NhbGVEYXRlIDogJ3Nob3J0JyB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidvcmRlci5zaGlwcGluZycgfCB0cmFuc2xhdGVcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBnZXRTaGlwcGluZ05hbWVzKG9yZGVyKSB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY3VzdG9tLWZpZWxkLWNvbHVtblxyXG4gICAgICAgICpuZ0Zvcj1cImxldCBjdXN0b21GaWVsZCBvZiBjdXN0b21GaWVsZHNcIlxyXG4gICAgICAgIFtjdXN0b21GaWVsZF09XCJjdXN0b21GaWVsZFwiXHJcbiAgICAgICAgW3NvcnRzXT1cInNvcnRzXCJcclxuICAgIC8+XHJcbjwvdmRyLWRhdGEtdGFibGUtMj5cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib3JkZXItbGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL29yZGVyLWxpc3Qvb3JkZXItbGlzdC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL29yZGVyL3NyYy9jb21wb25lbnRzL29yZGVyLWxpc3Qvb3JkZXItbGlzdC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsU0FBUyxFQUFVLE1BQU0sZUFBZSxDQUFDO0FBQzNFLE9BQU8sRUFBRSxNQUFNLElBQUksQ0FBQyxFQUFFLE1BQU0seUNBQXlDLENBQUM7QUFDdEUsT0FBTyxFQUVILG9CQUFvQixFQUNwQiw2QkFBNkIsRUFDN0IsZUFBZSxFQUVmLFNBQVMsRUFFVCxzQkFBc0IsR0FDekIsTUFBTSx3QkFBd0IsQ0FBQztBQUVoQyxPQUFPLEVBQUUsR0FBRyxFQUFFLE1BQU0sZ0JBQWdCLENBQUM7Ozs7Ozs7QUFRckMsTUFBTSxPQUFPLGtCQUNULFNBQVEsc0JBQTZEO0lBK0VyRSxZQUFzQixtQkFBd0MsRUFBVSxjQUE4QjtRQUNsRyxLQUFLLEVBQUUsQ0FBQztRQURVLHdCQUFtQixHQUFuQixtQkFBbUIsQ0FBcUI7UUFBVSxtQkFBYyxHQUFkLGNBQWMsQ0FBZ0I7UUE1RXRHLGdCQUFXLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLHFCQUFxQixFQUFFLENBQUMsR0FBRyxDQUFDLElBQUksQ0FBQyxFQUFFLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBQzdFLGNBQVMsR0FBRyxTQUFTLENBQUM7UUFDdEIsaUJBQVksR0FBRyxJQUFJLENBQUMsb0JBQW9CLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDbEQsWUFBTyxHQUFHLElBQUksQ0FBQyxzQkFBc0IsRUFBRTthQUMzQyxXQUFXLEVBQUU7YUFD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LEtBQUssQ0FBQyxhQUFhLENBQUMsTUFBTSxFQUFFO1lBQzVCLE9BQU8sS0FBSyxDQUFDLGFBQWEsQ0FBQyxHQUFHLENBQUMsWUFBWSxDQUFDLEVBQUUsQ0FBQyxZQUFZLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztTQUMvRjthQUFNO1lBQ0gsT0FBTyxFQUFFLENBQUM7U0FDYjtJQUNMLENBQUM7OEdBbkpRLGtCQUFrQjtrR0FBbEIsa0JBQWtCLDZFQ3JCL0IsOGdKQWlHQTs7MkZENUVhLGtCQUFrQjtrQkFOOUIsU0FBUzsrQkFDSSxnQkFBZ0IsbUJBR1QsdUJBQXVCLENBQUMsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdGlvblN0cmF0ZWd5LCBDb21wb25lbnQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBtYXJrZXIgYXMgXyB9IGZyb20gJ0BiaWVzYmplcmcvbmd4LXRyYW5zbGF0ZS1leHRyYWN0LW1hcmtlcic7XHJcbmltcG9ydCB7XHJcbiAgICBDaGFubmVsU2VydmljZSxcclxuICAgIEdldE9yZGVyTGlzdERvY3VtZW50LFxyXG4gICAgZ2V0T3JkZXJTdGF0ZVRyYW5zbGF0aW9uVG9rZW4sXHJcbiAgICBMb2dpY2FsT3BlcmF0b3IsXHJcbiAgICBPcmRlckxpc3RPcHRpb25zLFxyXG4gICAgT3JkZXJUeXBlLFxyXG4gICAgU2VydmVyQ29uZmlnU2VydmljZSxcclxuICAgIFR5cGVkQmFzZUxpc3RDb21wb25lbnQsXHJcbn0gZnJvbSAnQHZlbmR1cmUvYWRtaW4tdWkvY29yZSc7XHJcbmltcG9ydCB7IE9yZGVyIH0gZnJvbSAnQHZlbmR1cmUvY29tbW9uL2xpYi9nZW5lcmF0ZWQtdHlwZXMnO1xyXG5pbXBvcnQgeyB0YXAgfSBmcm9tICdyeGpzL29wZXJhdG9ycyc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICAgIHNlbGVjdG9yOiAndmRyLW9yZGVyLWxpc3QnLFxyXG4gICAgdGVtcGxhdGVVcmw6ICcuL29yZGVyLWxpc3QuY29tcG9uZW50Lmh0bWwnLFxyXG4gICAgc3R5bGVVcmxzOiBbJy4vb3JkZXItbGlzdC5jb21wb25lbnQuc2NzcyddLFxyXG4gICAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBPcmRlckxpc3RDb21wb25lbnRcclxuICAgIGV4dGVuZHMgVHlwZWRCYXNlTGlzdENvbXBvbmVudDx0eXBlb2YgR2V0T3JkZXJMaXN0RG9jdW1lbnQsICdvcmRlcnMnPlxyXG4gICAgaW1wbGVtZW50cyBPbkluaXRcclxue1xyXG4gICAgb3JkZXJTdGF0ZXMgPSB0aGlzLnNlcnZlckNvbmZpZ1NlcnZpY2UuZ2V0T3JkZXJQcm9jZXNzU3RhdGVzKCkubWFwKGl0ZW0gPT4gaXRlbS5uYW1lKTtcclxuICAgIHJlYWRvbmx5IE9yZGVyVHlwZSA9IE9yZGVyVHlwZTtcclxuICAgIHJlYWRvbmx5IGN1c3RvbUZpZWxkcyA9IHRoaXMuZ2V0Q3VzdG9tRmllbGRDb25maWcoJ09yZGVyJyk7XHJcbiAgICByZWFkb25seSBmaWx0ZXJzID0gdGhpcy5jcmVhdGVGaWx0ZXJDb2xsZWN0aW9uKClcclxuICAgICAgICAuYWRkSWRGaWx0ZXIoKVxyXG4gICAgICAgIC5hZGREYXRlRmlsdGVycygpXHJcbiAgICAgICAgLmFkZEZpbHRlcih7XHJcbiAgICAgICAgICAgIG5hbWU6ICdhY3RpdmUnLFxyXG4gICAgICAgICAgICB0eXBlOiB7IGtpbmQ6ICdib29sZWFuJyB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnb3JkZXIuZmlsdGVyLWlzLWFjdGl2ZScpLFxyXG4gICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ2FjdGl2ZScsXHJcbiAgICAgICAgfSlcclxuICAgICAgICAuYWRkRmlsdGVyKHtcclxuICAgICAgICAgICAgbmFtZTogJ3RvdGFsV2l0aFRheCcsXHJcbiAgICAgICAgICAgIHR5cGU6IHsga2luZDogJ251bWJlcicsIGlucHV0VHlwZTogJ2N1cnJlbmN5JywgY3VycmVuY3lDb2RlOiAnVVNEJyB9LFxyXG4gICAgICAgICAgICBsYWJlbDogXygnb3JkZXIudG90YWwnKSxcclxuICAgICAgICAgICAgZmlsdGVyRmllbGQ6ICd0b3RhbFdpdGhUYXgnLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEZpbHRlcih7XHJcbiAgICAgICAgICAgIG5hbWU6ICdzdGF0ZScsXHJcbiAgICAgICAgICAgIHR5cGU6IHtcclxuICAgICAgICAgICAgICAgIGtpbmQ6ICdzZWxlY3QnLFxyXG4gICAgICAgICAgICAgICAgb3B0aW9uczogdGhpcy5vcmRlclN0YXRlcy5tYXAocyA9PiAoeyB2YWx1ZTogcywgbGFiZWw6IGdldE9yZGVyU3RhdGVUcmFuc2xhdGlvblRva2VuKHMpIH0pKSxcclxuICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgbGFiZWw6IF8oJ29yZGVyLnN0YXRlJyksXHJcbiAgICAgICAgICAgIGZpbHRlckZpZWxkOiAnc3RhdGUnLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEZpbHRlcih7XHJcbiAgICAgICAgICAgIG5hbWU6ICd0eXBlJyxcclxuICAgICAgICAgICAgdHlwZToge1xyXG4gICAgICAgICAgICAgICAga2luZDogJ3NlbGVjdCcsXHJcbiAgICAgICAgICAgICAgICBvcHRpb25zOiBbXHJcbiAgICAgICAgICAgICAgICAgICAgeyB2YWx1ZTogT3JkZXJUeXBlLlJlZ3VsYXIsIGxhYmVsOiBfKCdvcmRlci5vcmRlci10eXBlLXJlZ3VsYXInKSB9LFxyXG4gICAgICAgICAgICAgICAgICAgIHsgdmFsdWU6IE9yZGVyVHlwZS5BZ2dyZWdhdGUsIGxhYmVsOiBfKCdvcmRlci5vcmRlci10eXBlLWFnZ3JlZ2F0ZScpIH0sXHJcbiAgICAgICAgICAgICAgICAgICAgeyB2YWx1ZTogT3JkZXJUeXBlLlNlbGxlciwgbGFiZWw6IF8oJ29yZGVyLm9yZGVyLXR5cGUtc2VsbGVyJykgfSxcclxuICAgICAgICAgICAgICAgIF0sXHJcbiAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgIGxhYmVsOiBfKCdvcmRlci5vcmRlci10eXBlJyksXHJcbiAgICAgICAgICAgIGZpbHRlckZpZWxkOiAndHlwZScsXHJcbiAgICAgICAgfSlcclxuICAgICAgICAuYWRkRmlsdGVyKHtcclxuICAgICAgICAgICAgbmFtZTogJ29yZGVyUGxhY2VkQXQnLFxyXG4gICAgICAgICAgICB0eXBlOiB7IGtpbmQ6ICdkYXRlUmFuZ2UnIH0sXHJcbiAgICAgICAgICAgIGxhYmVsOiBfKCdvcmRlci5wbGFjZWQtYXQnKSxcclxuICAgICAgICAgICAgZmlsdGVyRmllbGQ6ICdvcmRlclBsYWNlZEF0JyxcclxuICAgICAgICB9KVxyXG4gICAgICAgIC5hZGRGaWx0ZXIoe1xyXG4gICAgICAgICAgICBuYW1lOiAnY3VzdG9tZXJMYXN0TmFtZScsXHJcbiAgICAgICAgICAgIHR5cGU6IHsga2luZDogJ3RleHQnIH0sXHJcbiAgICAgICAgICAgIGxhYmVsOiBfKCdjdXN0b21lci5sYXN0LW5hbWUnKSxcclxuICAgICAgICAgICAgZmlsdGVyRmllbGQ6ICdjdXN0b21lckxhc3ROYW1lJyxcclxuICAgICAgICB9KVxyXG4gICAgICAgIC5hZGRGaWx0ZXIoe1xyXG4gICAgICAgICAgICBuYW1lOiAndHJhbnNhY3Rpb25JZCcsXHJcbiAgICAgICAgICAgIHR5cGU6IHsga2luZDogJ3RleHQnIH0sXHJcbiAgICAgICAgICAgIGxhYmVsOiBfKCdvcmRlci50cmFuc2FjdGlvbi1pZCcpLFxyXG4gICAgICAgICAgICBmaWx0ZXJGaWVsZDogJ3RyYW5zYWN0aW9uSWQnLFxyXG4gICAgICAgIH0pXHJcbiAgICAgICAgLmFkZEN1c3RvbUZpZWxkRmlsdGVycyh0aGlzLmN1c3RvbUZpZWxkcylcclxuICAgICAgICAuY29ubmVjdFRvUm91dGUodGhpcy5yb3V0ZSk7XHJcblxyXG4gICAgcmVhZG9ubHkgc29ydHMgPSB0aGlzLmNyZWF0ZVNvcnRDb2xsZWN0aW9uKClcclxuICAgICAgICAuZGVmYXVsdFNvcnQoJ3VwZGF0ZWRBdCcsICdERVNDJylcclxuICAgICAgICAuYWRkU29ydCh7IG5hbWU6ICdpZCcgfSlcclxuICAgICAgICAuYWRkU29ydCh7IG5hbWU6ICdjcmVhdGVkQXQnIH0pXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAndXBkYXRlZEF0JyB9KVxyXG4gICAgICAgIC5hZGRTb3J0KHsgbmFtZTogJ29yZGVyUGxhY2VkQXQnIH0pXHJcbiAgICAgICAgLmFkZFNvcnQoeyBuYW1lOiAnY3VzdG9tZXJMYXN0TmFtZScgfSlcclxuICAgICAgICAuYWRkU29ydCh7IG5hbWU6ICdzdGF0ZScgfSlcclxuICAgICAgICAuYWRkU29ydCh7IG5hbWU6ICd0b3RhbFdpdGhUYXgnIH0pXHJcbiAgICAgICAgLmFkZEN1c3RvbUZpZWxkU29ydHModGhpcy5jdXN0b21GaWVsZHMpXHJcbiAgICAgICAgLmNvbm5lY3RUb1JvdXRlKHRoaXMucm91dGUpO1xyXG5cclxuICAgIGNhbkNyZWF0ZURyYWZ0T3JkZXIgPSBmYWxzZTtcclxuICAgIHByaXZhdGUgYWN0aXZlQ2hhbm5lbElzRGVmYXVsdENoYW5uZWwgPSBmYWxzZTtcclxuXHJcbiAgICBjb25zdHJ1Y3Rvcihwcm90ZWN0ZWQgc2VydmVyQ29uZmlnU2VydmljZTogU2VydmVyQ29uZmlnU2VydmljZSwgcHJpdmF0ZSBjaGFubmVsU2VydmljZTogQ2hhbm5lbFNlcnZpY2UpIHtcclxuICAgICAgICBzdXBlcigpO1xyXG4gICAgICAgIHN1cGVyLmNvbmZpZ3VyZSh7XHJcbiAgICAgICAgICAgIGRvY3VtZW50OiBHZXRPcmRlckxpc3REb2N1bWVudCxcclxuICAgICAgICAgICAgZ2V0SXRlbXM6IHJlc3VsdCA9PiByZXN1bHQub3JkZXJzLFxyXG4gICAgICAgICAgICBzZXRWYXJpYWJsZXM6IChza2lwLCB0YWtlKSA9PiB0aGlzLmNyZWF0ZVF1ZXJ5T3B0aW9ucyhza2lwLCB0YWtlLCB0aGlzLnNlYXJjaFRlcm1Db250cm9sLnZhbHVlKSxcclxuICAgICAgICAgICAgcmVmcmVzaExpc3RPbkNoYW5nZXM6IFt0aGlzLmZpbHRlcnMudmFsdWVDaGFuZ2VzLCB0aGlzLnNvcnRzLnZhbHVlQ2hhbmdlc10sXHJcbiAgICAgICAgfSk7XHJcblxyXG4gICAgICAgIHRoaXMuY2FuQ3JlYXRlRHJhZnRPcmRlciA9ICEhdGhpcy5zZXJ2ZXJDb25maWdTZXJ2aWNlXHJcbiAgICAgICAgICAgIC5nZXRPcmRlclByb2Nlc3NTdGF0ZXMoKVxyXG4gICAgICAgICAgICAuZmluZChzdGF0ZSA9PiBzdGF0ZS5uYW1lID09PSAnQ3JlYXRlZCcpXHJcbiAgICAgICAgICAgID8udG8uaW5jbHVkZXMoJ0RyYWZ0Jyk7XHJcbiAgICB9XHJcblxyXG4gICAgbmdPbkluaXQoKSB7XHJcbiAgICAgICAgc3VwZXIubmdPbkluaXQoKTtcclxuICAgICAgICBjb25zdCBpc0RlZmF1bHRDaGFubmVsJCA9IHRoaXMuY2hhbm5lbFNlcnZpY2UuZGVmYXVsdENoYW5uZWxJc0FjdGl2ZSQucGlwZShcclxuICAgICAgICAgICAgdGFwKGlzRGVmYXVsdCA9PiAodGhpcy5hY3RpdmVDaGFubmVsSXNEZWZhdWx0Q2hhbm5lbCA9IGlzRGVmYXVsdCkpLFxyXG4gICAgICAgICk7XHJcbiAgICAgICAgc3VwZXIucmVmcmVzaExpc3RPbkNoYW5nZXModGhpcy5maWx0ZXJzLnZhbHVlQ2hhbmdlcywgdGhpcy5zb3J0cy52YWx1ZUNoYW5nZXMsIGlzRGVmYXVsdENoYW5uZWwkKTtcclxuICAgIH1cclxuXHJcbiAgICBwcml2YXRlIGNyZWF0ZVF1ZXJ5T3B0aW9ucyhcclxuICAgICAgICAvLyBlc2xpbnQtZGlzYWJsZS1uZXh0LWxpbmUgQHR5cGVzY3JpcHQtZXNsaW50L25vLXNoYWRvd1xyXG4gICAgICAgIHNraXA6IG51bWJlcixcclxuICAgICAgICB0YWtlOiBudW1iZXIsXHJcbiAgICAgICAgc2VhcmNoVGVybTogc3RyaW5nIHwgbnVsbCxcclxuICAgICk6IHsgb3B0aW9uczogT3JkZXJMaXN0T3B0aW9ucyB9IHtcclxuICAgICAgICBsZXQgZmlsdGVySW5wdXQgPSB0aGlzLmZpbHRlcnMuY3JlYXRlRmlsdGVySW5wdXQoKTtcclxuICAgICAgICBpZiAodGhpcy5hY3RpdmVDaGFubmVsSXNEZWZhdWx0Q2hhbm5lbCkge1xyXG4gICAgICAgICAgICBmaWx0ZXJJbnB1dCA9IHtcclxuICAgICAgICAgICAgICAgIC4uLihmaWx0ZXJJbnB1dCA/PyB7fSksXHJcbiAgICAgICAgICAgIH07XHJcbiAgICAgICAgfVxyXG4gICAgICAgIGlmIChzZWFyY2hUZXJtKSB7XHJcbiAgICAgICAgICAgIGZpbHRlcklucHV0ID0ge1xyXG4gICAgICAgICAgICAgICAgY29kZToge1xyXG4gICAgICAgICAgICAgICAgICAgIGNvbnRhaW5zOiBzZWFyY2hUZXJtLFxyXG4gICAgICAgICAgICAgICAgfSxcclxuICAgICAgICAgICAgICAgIGN1c3RvbWVyTGFzdE5hbWU6IHtcclxuICAgICAgICAgICAgICAgICAgICBjb250YWluczogc2VhcmNoVGVybSxcclxuICAgICAgICAgICAgICAgIH0sXHJcbiAgICAgICAgICAgICAgICB0cmFuc2FjdGlvbklkOiB7XHJcbiAgICAgICAgICAgICAgICAgICAgY29udGFpbnM6IHNlYXJjaFRlcm0sXHJcbiAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICB9O1xyXG4gICAgICAgIH1cclxuICAgICAgICByZXR1cm4ge1xyXG4gICAgICAgICAgICBvcHRpb25zOiB7XHJcbiAgICAgICAgICAgICAgICBza2lwLFxyXG4gICAgICAgICAgICAgICAgdGFrZSxcclxuICAgICAgICAgICAgICAgIGZpbHRlcjoge1xyXG4gICAgICAgICAgICAgICAgICAgIC4uLihmaWx0ZXJJbnB1dCA/PyB7fSksXHJcbiAgICAgICAgICAgICAgICB9LFxyXG4gICAgICAgICAgICAgICAgZmlsdGVyT3BlcmF0b3I6IHNlYXJjaFRlcm0gPyBMb2dpY2FsT3BlcmF0b3IuT1IgOiBMb2dpY2FsT3BlcmF0b3IuQU5ELFxyXG4gICAgICAgICAgICAgICAgc29ydDogdGhpcy5zb3J0cy5jcmVhdGVTb3J0SW5wdXQoKSxcclxuICAgICAgICAgICAgfSxcclxuICAgICAgICB9O1xyXG4gICAgfVxyXG5cclxuICAgIGdldFNoaXBwaW5nTmFtZXMob3JkZXI6IE9yZGVyKSB7XHJcbiAgICAgICAgaWYgKG9yZGVyLnNoaXBwaW5nTGluZXMubGVuZ3RoKSB7XHJcbiAgICAgICAgICAgIHJldHVybiBvcmRlci5zaGlwcGluZ0xpbmVzLm1hcChzaGlwcGluZ0xpbmUgPT4gc2hpcHBpbmdMaW5lLnNoaXBwaW5nTWV0aG9kLm5hbWUpLmpvaW4oJywgJyk7XHJcbiAgICAgICAgfSBlbHNlIHtcclxuICAgICAgICAgICAgcmV0dXJuICcnO1xyXG4gICAgICAgIH1cclxuICAgIH1cclxufVxyXG4iLCI8dmRyLXBhZ2UtYmxvY2s+XHJcbiAgICA8dmRyLWFjdGlvbi1iYXI+XHJcbiAgICAgICAgPHZkci1hYi1yaWdodD5cclxuICAgICAgICAgICAgPHZkci1hY3Rpb24tYmFyLWl0ZW1zIGxvY2F0aW9uSWQ9XCJvcmRlci1saXN0XCI+PC92ZHItYWN0aW9uLWJhci1pdGVtcz5cclxuICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cImNhbkNyZWF0ZURyYWZ0T3JkZXJcIj5cclxuICAgICAgICAgICAgICAgIDxhIGNsYXNzPVwiYnRuXCIgKnZkcklmUGVybWlzc2lvbnM9XCJbJ0NyZWF0ZU9yZGVyJ11cIiBbcm91dGVyTGlua109XCJbJy4vZHJhZnQvY3JlYXRlJ11cIj5cclxuICAgICAgICAgICAgICAgICAgICA8Y2xyLWljb24gc2hhcGU9XCJwbHVzXCI+PC9jbHItaWNvbj5cclxuICAgICAgICAgICAgICAgICAgICB7eyAnY2F0YWxvZy5jcmVhdGUtZHJhZnQtb3JkZXInIHwgdHJhbnNsYXRlIH19XHJcbiAgICAgICAgICAgICAgICA8L2E+XHJcbiAgICAgICAgICAgIDwvbmctY29udGFpbmVyPlxyXG4gICAgICAgIDwvdmRyLWFiLXJpZ2h0PlxyXG4gICAgPC92ZHItYWN0aW9uLWJhcj5cclxuPC92ZHItcGFnZS1ibG9jaz5cclxuPHZkci1kYXRhLXRhYmxlLTJcclxuICAgIGNsYXNzPVwibXQtMlwiXHJcbiAgICBpZD1cIm9yZGVyLWxpc3RcIlxyXG4gICAgW2l0ZW1zXT1cIml0ZW1zJCB8IGFzeW5jXCJcclxuICAgIFtpdGVtc1BlclBhZ2VdPVwiaXRlbXNQZXJQYWdlJCB8IGFzeW5jXCJcclxuICAgIFt0b3RhbEl0ZW1zXT1cInRvdGFsSXRlbXMkIHwgYXN5bmNcIlxyXG4gICAgW2N1cnJlbnRQYWdlXT1cImN1cnJlbnRQYWdlJCB8IGFzeW5jXCJcclxuICAgIFtmaWx0ZXJzXT1cImZpbHRlcnNcIlxyXG4gICAgKHBhZ2VDaGFuZ2UpPVwic2V0UGFnZU51bWJlcigkZXZlbnQpXCJcclxuICAgIChpdGVtc1BlclBhZ2VDaGFuZ2UpPVwic2V0SXRlbXNQZXJQYWdlKCRldmVudClcIlxyXG4+XHJcbiAgICA8dmRyLWJ1bGstYWN0aW9uLW1lbnVcclxuICAgICAgICBsb2NhdGlvbklkPVwib3JkZXItbGlzdFwiXHJcbiAgICAgICAgW2hvc3RDb21wb25lbnRdPVwidGhpc1wiXHJcbiAgICAgICAgW3NlbGVjdGlvbk1hbmFnZXJdPVwic2VsZWN0aW9uTWFuYWdlclwiXHJcbiAgICA+PC92ZHItYnVsay1hY3Rpb24tbWVudT5cclxuICAgIDx2ZHItZHQyLXNlYXJjaFxyXG4gICAgICAgIFtzZWFyY2hUZXJtQ29udHJvbF09XCJzZWFyY2hUZXJtQ29udHJvbFwiXHJcbiAgICAgICAgW3NlYXJjaFRlcm1QbGFjZWhvbGRlcl09XCInb3JkZXIuc2VhcmNoLWJ5LW9yZGVyLWZpbHRlcnMnIHwgdHJhbnNsYXRlXCJcclxuICAgIC8+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ2NvbW1vbi5pZCcgfCB0cmFuc2xhdGVcIiBbaGlkZGVuQnlEZWZhdWx0XT1cInRydWVcIiBbc29ydF09XCJzb3J0cy5nZXQoJ2lkJylcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBvcmRlci5pZCB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uY3JlYXRlZC1hdCcgfCB0cmFuc2xhdGVcIiBbaGlkZGVuQnlEZWZhdWx0XT1cInRydWVcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICB7eyBvcmRlci5jcmVhdGVkQXQgfCBsb2NhbGVEYXRlIDogJ3Nob3J0JyB9fVxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidjb21tb24uY29kZScgfCB0cmFuc2xhdGVcIiBbb3B0aW9uYWxdPVwiZmFsc2VcIj5cclxuICAgICAgICA8bmctdGVtcGxhdGUgbGV0LW9yZGVyPVwiaXRlbVwiPlxyXG4gICAgICAgICAgICA8YSBjbGFzcz1cImJ1dHRvbi1naG9zdFwiIFtyb3V0ZXJMaW5rXT1cIm9yZGVyLnN0YXRlID09PSAnRHJhZnQnID8gWycuL2RyYWZ0Jywgb3JkZXIuaWRdIDogWycuLycsIG9yZGVyLmlkXVwiXHJcbiAgICAgICAgICAgICAgICA+PHNwYW4+e3sgb3JkZXIuY29kZSB9fTwvc3Bhbj5cclxuICAgICAgICAgICAgICAgIDxjbHItaWNvbiBzaGFwZT1cImFycm93IHJpZ2h0XCI+PC9jbHItaWNvbj5cclxuICAgICAgICAgICAgPC9hPlxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidvcmRlci5jdXN0b21lcicgfCB0cmFuc2xhdGVcIiBbc29ydF09XCJzb3J0cy5nZXQoJ2N1c3RvbWVyTGFzdE5hbWUnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIDx2ZHItY3VzdG9tZXItbGFiZWxcclxuICAgICAgICAgICAgICAgIFtjdXN0b21lcl09XCJvcmRlci5jdXN0b21lclwiXHJcbiAgICAgICAgICAgICAgICAoY2xpY2spPVwiJGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpXCJcclxuICAgICAgICAgICAgPjwvdmRyLWN1c3RvbWVyLWxhYmVsPlxyXG4gICAgICAgIDwvbmctdGVtcGxhdGU+XHJcbiAgICA8L3Zkci1kdDItY29sdW1uPlxyXG4gICAgPHZkci1kdDItY29sdW1uIFtoZWFkaW5nXT1cIidvcmRlci5vcmRlci10eXBlJyB8IHRyYW5zbGF0ZVwiIFtoaWRkZW5CeURlZmF1bHRdPVwidHJ1ZVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIDx2ZHItY2hpcCAqbmdJZj1cIm9yZGVyLnR5cGUgPT09IE9yZGVyVHlwZS5SZWd1bGFyXCI+e3sgJ29yZGVyLm9yZGVyLXR5cGUtcmVndWxhcicgfCB0cmFuc2xhdGUgfX08L3Zkci1jaGlwPlxyXG4gICAgICAgICAgICA8dmRyLWNoaXAgKm5nSWY9XCJvcmRlci50eXBlID09PSBPcmRlclR5cGUuQWdncmVnYXRlXCI+e3sgJ29yZGVyLm9yZGVyLXR5cGUtYWdncmVnYXRlJyB8IHRyYW5zbGF0ZSB9fTwvdmRyLWNoaXA+XHJcbiAgICAgICAgICAgIDx2ZHItY2hpcCAqbmdJZj1cIm9yZGVyLnR5cGUgPT09IE9yZGVyVHlwZS5TZWxsZXJcIj57eyAnb3JkZXIub3JkZXItdHlwZS1zZWxsZXInIHwgdHJhbnNsYXRlIH19PC92ZHItY2hpcD5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInb3JkZXIuc3RhdGUnIHwgdHJhbnNsYXRlXCIgW3NvcnRdPVwic29ydHMuZ2V0KCdzdGF0ZScpXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1vcmRlcj1cIml0ZW1cIj5cclxuICAgICAgICAgICAgPHZkci1vcmRlci1zdGF0ZS1sYWJlbCBbc3RhdGVdPVwib3JkZXIuc3RhdGVcIj48L3Zkci1vcmRlci1zdGF0ZS1sYWJlbD5cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInb3JkZXIudG90YWwnIHwgdHJhbnNsYXRlXCIgW3NvcnRdPVwic29ydHMuZ2V0KCd0b3RhbFdpdGhUYXgnKVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IG9yZGVyLnRvdGFsV2l0aFRheCB8IGxvY2FsZUN1cnJlbmN5IDogb3JkZXIuY3VycmVuY3lDb2RlIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ2NvbW1vbi51cGRhdGVkLWF0JyB8IHRyYW5zbGF0ZVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IG9yZGVyLnVwZGF0ZWRBdCB8IHRpbWVBZ28gfX1cclxuICAgICAgICA8L25nLXRlbXBsYXRlPlxyXG4gICAgPC92ZHItZHQyLWNvbHVtbj5cclxuICAgIDx2ZHItZHQyLWNvbHVtbiBbaGVhZGluZ109XCInb3JkZXIucGxhY2VkLWF0JyB8IHRyYW5zbGF0ZVwiIFtzb3J0XT1cInNvcnRzLmdldCgnb3JkZXJQbGFjZWRBdCcpXCI+XHJcbiAgICAgICAgPG5nLXRlbXBsYXRlIGxldC1vcmRlcj1cIml0ZW1cIj5cclxuICAgICAgICAgICAge3sgb3JkZXIub3JkZXJQbGFjZWRBdCB8IGxvY2FsZURhdGUgOiAnc2hvcnQnIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jb2x1bW4gW2hlYWRpbmddPVwiJ29yZGVyLnNoaXBwaW5nJyB8IHRyYW5zbGF0ZVwiPlxyXG4gICAgICAgIDxuZy10ZW1wbGF0ZSBsZXQtb3JkZXI9XCJpdGVtXCI+XHJcbiAgICAgICAgICAgIHt7IGdldFNoaXBwaW5nTmFtZXMob3JkZXIpIH19XHJcbiAgICAgICAgPC9uZy10ZW1wbGF0ZT5cclxuICAgIDwvdmRyLWR0Mi1jb2x1bW4+XHJcbiAgICA8dmRyLWR0Mi1jdXN0b20tZmllbGQtY29sdW1uXHJcbiAgICAgICAgKm5nRm9yPVwibGV0IGN1c3RvbUZpZWxkIG9mIGN1c3RvbUZpZWxkc1wiXHJcbiAgICAgICAgW2N1c3RvbUZpZWxkXT1cImN1c3RvbUZpZWxkXCJcclxuICAgICAgICBbc29ydHNdPVwic29ydHNcIlxyXG4gICAgLz5cclxuPC92ZHItZGF0YS10YWJsZS0yPlxyXG4iXX0=

package/esm2022/order/components/order-payment-card/order-payment-card.component.mjs

@@ -23,12 +23,12 @@ export class OrderPaymentCardComponent {
         }
         return this.payment.nextStates.filter(s => s !== 'Settled' && s !== 'Error');
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderPaymentCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderPaymentCardComponent, selector: "vdr-order-payment-card", inputs: { payment: "payment", currencyCode: "currencyCode" }, outputs: { settlePayment: "settlePayment", transitionPaymentState: "transitionPaymentState", settleRefund: "settleRefund" }, ngImport: i0, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.payment' | translate }}\r\n            <ng-container *ngIf=\"payment.transactionId\">#{{ payment.transactionId }}</ng-container>\r\n        </div>\r\n        <div class=\"payment-state\">\r\n            <vdr-payment-state-label [state]=\"payment.state\"></vdr-payment-state-label>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <vdr-payment-detail [payment]=\"payment\" [currencyCode]=\"currencyCode\"></vdr-payment-detail>\r\n    </div>\r\n    <ng-container *ngFor=\"let refund of payment.refunds\">\r\n        <div class=\"card-header payment-header\">\r\n            <clr-icon shape=\"redo\" class=\"refund-icon\" dir=\"down\"></clr-icon>\r\n            {{ 'order.refund' | translate }} #{{ refund.id }}\r\n            <div class=\"clr-flex-fill\"></div>\r\n            <vdr-refund-state-label [state]=\"refund.state\"></vdr-refund-state-label>\r\n        </div>\r\n        <div class=\"card-block\">\r\n            <vdr-labeled-data [label]=\"'common.created-at' | translate\">\r\n                {{ refund.createdAt | localeDate: 'medium' }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-total' | translate\">\r\n                {{ refund.total | localeCurrency: currencyCode }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.transaction-id' | translate\" *ngIf=\"refund.transactionId\">\r\n                {{ refund.transactionId }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-reason' | translate\" *ngIf=\"refund.reason\">\r\n                {{ refund.reason }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-metadata' | translate\" *ngIf=\"refundHasMetadata(refund)\">\r\n                <vdr-object-tree [value]=\"refund.metadata\"></vdr-object-tree>\r\n            </vdr-labeled-data>\r\n        </div>\r\n        <div class=\"card-footer\" *ngIf=\"refund.state === 'Pending'\">\r\n            <button class=\"btn btn-sm btn-primary\" (click)=\"settleRefund.emit(refund)\">\r\n                {{ 'order.settle-refund' | translate }}\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n    <div class=\"card-footer\" *ngIf=\"payment.nextStates.length\">\r\n        <button\r\n            class=\"btn btn-sm btn-primary\"\r\n            *ngIf=\"payment.nextStates.includes('Settled')\"\r\n            (click)=\"settlePayment.emit(payment)\"\r\n        >\r\n            {{ 'order.settle-payment' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngFor=\"let nextState of nextOtherStates()\">\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionPaymentState.emit({ payment: payment, state: nextState })\"\r\n                    >\r\n                        <ng-container *ngIf=\"nextState !== 'Cancelled'; else cancel\">\r\n                            <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                            {{\r\n                                'order.transition-to-state'\r\n                                    | translate: { state: (nextState | stateI18nToken | translate) }\r\n                            }}\r\n                        </ng-container>\r\n                        <ng-template #cancel>\r\n                            <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                            {{ 'order.cancel-payment' | translate }}\r\n                        </ng-template>\r\n                    </button>\r\n                </ng-container>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </div>\r\n</div>\r\n", styles: [".payment-header{display:flex;justify-content:space-between;align-items:center}.refund-icon{margin-right:6px;color:var(--color-grey-400)}.card-footer{display:flex;align-items:center;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i4.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i4.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i4.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i4.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "component", type: i4.LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: i4.ObjectTreeComponent, selector: "vdr-object-tree", inputs: ["value", "isArrayItem"] }, { kind: "component", type: i5.PaymentStateLabelComponent, selector: "vdr-payment-state-label", inputs: ["state"] }, { kind: "component", type: i6.RefundStateLabelComponent, selector: "vdr-refund-state-label", inputs: ["state"] }, { kind: "component", type: i7.PaymentDetailComponent, selector: "vdr-payment-detail", inputs: ["payment", "currencyCode"] }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.StateI18nTokenPipe, name: "stateI18nToken" }, { kind: "pipe", type: i4.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i4.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderPaymentCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderPaymentCardComponent, selector: "vdr-order-payment-card", inputs: { payment: "payment", currencyCode: "currencyCode" }, outputs: { settlePayment: "settlePayment", transitionPaymentState: "transitionPaymentState", settleRefund: "settleRefund" }, ngImport: i0, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.payment' | translate }}\r\n            <ng-container *ngIf=\"payment.transactionId\">#{{ payment.transactionId }}</ng-container>\r\n        </div>\r\n        <div class=\"payment-state\">\r\n            <vdr-payment-state-label [state]=\"payment.state\"></vdr-payment-state-label>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <vdr-payment-detail [payment]=\"payment\" [currencyCode]=\"currencyCode\"></vdr-payment-detail>\r\n    </div>\r\n    <ng-container *ngFor=\"let refund of payment.refunds\">\r\n        <div class=\"card-header payment-header\">\r\n            <clr-icon shape=\"redo\" class=\"refund-icon\" dir=\"down\"></clr-icon>\r\n            {{ 'order.refund' | translate }} #{{ refund.id }}\r\n            <div class=\"clr-flex-fill\"></div>\r\n            <vdr-refund-state-label [state]=\"refund.state\"></vdr-refund-state-label>\r\n        </div>\r\n        <div class=\"card-block\">\r\n            <vdr-labeled-data [label]=\"'common.created-at' | translate\">\r\n                {{ refund.createdAt | localeDate: 'medium' }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-total' | translate\">\r\n                {{ refund.total | localeCurrency: currencyCode }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.transaction-id' | translate\" *ngIf=\"refund.transactionId\">\r\n                {{ refund.transactionId }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-reason' | translate\" *ngIf=\"refund.reason\">\r\n                {{ refund.reason }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-metadata' | translate\" *ngIf=\"refundHasMetadata(refund)\">\r\n                <vdr-object-tree [value]=\"refund.metadata\"></vdr-object-tree>\r\n            </vdr-labeled-data>\r\n        </div>\r\n        <div class=\"card-footer\" *ngIf=\"refund.state === 'Pending'\">\r\n            <button class=\"btn btn-sm btn-primary\" (click)=\"settleRefund.emit(refund)\">\r\n                {{ 'order.settle-refund' | translate }}\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n    <div class=\"card-footer\" *ngIf=\"payment.nextStates.length\">\r\n        <button\r\n            class=\"btn btn-sm btn-primary\"\r\n            *ngIf=\"payment.nextStates.includes('Settled')\"\r\n            (click)=\"settlePayment.emit(payment)\"\r\n        >\r\n            {{ 'order.settle-payment' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngFor=\"let nextState of nextOtherStates()\">\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionPaymentState.emit({ payment: payment, state: nextState })\"\r\n                    >\r\n                        <ng-container *ngIf=\"nextState !== 'Cancelled'; else cancel\">\r\n                            <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                            {{\r\n                                'order.transition-to-state'\r\n                                    | translate: { state: (nextState | stateI18nToken | translate) }\r\n                            }}\r\n                        </ng-container>\r\n                        <ng-template #cancel>\r\n                            <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                            {{ 'order.cancel-payment' | translate }}\r\n                        </ng-template>\r\n                    </button>\r\n                </ng-container>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </div>\r\n</div>\r\n", styles: [".payment-header{display:flex;justify-content:space-between;align-items:center}.refund-icon{margin-inline-end:6px;color:var(--color-grey-400)}.card-footer{display:flex;align-items:center;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.Dir, selector: "[dir]", inputs: ["dir"], outputs: ["dirChange"], exportAs: ["dir"] }, { kind: "component", type: i4.DropdownComponent, selector: "vdr-dropdown", inputs: ["manualToggle"] }, { kind: "component", type: i4.DropdownMenuComponent, selector: "vdr-dropdown-menu", inputs: ["vdrPosition", "customClasses"] }, { kind: "directive", type: i4.DropdownTriggerDirective, selector: "[vdrDropdownTrigger]" }, { kind: "directive", type: i4.DropdownItemDirective, selector: "[vdrDropdownItem]" }, { kind: "component", type: i4.LabeledDataComponent, selector: "vdr-labeled-data", inputs: ["label"] }, { kind: "component", type: i4.ObjectTreeComponent, selector: "vdr-object-tree", inputs: ["value", "isArrayItem"] }, { kind: "component", type: i5.PaymentStateLabelComponent, selector: "vdr-payment-state-label", inputs: ["state"] }, { kind: "component", type: i6.RefundStateLabelComponent, selector: "vdr-refund-state-label", inputs: ["state"] }, { kind: "component", type: i7.PaymentDetailComponent, selector: "vdr-payment-detail", inputs: ["payment", "currencyCode"] }, { kind: "pipe", type: i8.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.StateI18nTokenPipe, name: "stateI18nToken" }, { kind: "pipe", type: i4.LocaleDatePipe, name: "localeDate" }, { kind: "pipe", type: i4.LocaleCurrencyPipe, name: "localeCurrency" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderPaymentCardComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderPaymentCardComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-order-payment-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.payment' | translate }}\r\n            <ng-container *ngIf=\"payment.transactionId\">#{{ payment.transactionId }}</ng-container>\r\n        </div>\r\n        <div class=\"payment-state\">\r\n            <vdr-payment-state-label [state]=\"payment.state\"></vdr-payment-state-label>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <vdr-payment-detail [payment]=\"payment\" [currencyCode]=\"currencyCode\"></vdr-payment-detail>\r\n    </div>\r\n    <ng-container *ngFor=\"let refund of payment.refunds\">\r\n        <div class=\"card-header payment-header\">\r\n            <clr-icon shape=\"redo\" class=\"refund-icon\" dir=\"down\"></clr-icon>\r\n            {{ 'order.refund' | translate }} #{{ refund.id }}\r\n            <div class=\"clr-flex-fill\"></div>\r\n            <vdr-refund-state-label [state]=\"refund.state\"></vdr-refund-state-label>\r\n        </div>\r\n        <div class=\"card-block\">\r\n            <vdr-labeled-data [label]=\"'common.created-at' | translate\">\r\n                {{ refund.createdAt | localeDate: 'medium' }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-total' | translate\">\r\n                {{ refund.total | localeCurrency: currencyCode }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.transaction-id' | translate\" *ngIf=\"refund.transactionId\">\r\n                {{ refund.transactionId }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-reason' | translate\" *ngIf=\"refund.reason\">\r\n                {{ refund.reason }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-metadata' | translate\" *ngIf=\"refundHasMetadata(refund)\">\r\n                <vdr-object-tree [value]=\"refund.metadata\"></vdr-object-tree>\r\n            </vdr-labeled-data>\r\n        </div>\r\n        <div class=\"card-footer\" *ngIf=\"refund.state === 'Pending'\">\r\n            <button class=\"btn btn-sm btn-primary\" (click)=\"settleRefund.emit(refund)\">\r\n                {{ 'order.settle-refund' | translate }}\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n    <div class=\"card-footer\" *ngIf=\"payment.nextStates.length\">\r\n        <button\r\n            class=\"btn btn-sm btn-primary\"\r\n            *ngIf=\"payment.nextStates.includes('Settled')\"\r\n            (click)=\"settlePayment.emit(payment)\"\r\n        >\r\n            {{ 'order.settle-payment' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngFor=\"let nextState of nextOtherStates()\">\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionPaymentState.emit({ payment: payment, state: nextState })\"\r\n                    >\r\n                        <ng-container *ngIf=\"nextState !== 'Cancelled'; else cancel\">\r\n                            <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                            {{\r\n                                'order.transition-to-state'\r\n                                    | translate: { state: (nextState | stateI18nToken | translate) }\r\n                            }}\r\n                        </ng-container>\r\n                        <ng-template #cancel>\r\n                            <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                            {{ 'order.cancel-payment' | translate }}\r\n                        </ng-template>\r\n                    </button>\r\n                </ng-container>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </div>\r\n</div>\r\n", styles: [".payment-header{display:flex;justify-content:space-between;align-items:center}.refund-icon{margin-right:6px;color:var(--color-grey-400)}.card-footer{display:flex;align-items:center;justify-content:flex-end}\n"] }]
+            args: [{ selector: 'vdr-order-payment-card', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"card\">\r\n    <div class=\"card-header payment-header\">\r\n        <div>\r\n            {{ 'order.payment' | translate }}\r\n            <ng-container *ngIf=\"payment.transactionId\">#{{ payment.transactionId }}</ng-container>\r\n        </div>\r\n        <div class=\"payment-state\">\r\n            <vdr-payment-state-label [state]=\"payment.state\"></vdr-payment-state-label>\r\n        </div>\r\n    </div>\r\n    <div class=\"card-block\">\r\n        <vdr-payment-detail [payment]=\"payment\" [currencyCode]=\"currencyCode\"></vdr-payment-detail>\r\n    </div>\r\n    <ng-container *ngFor=\"let refund of payment.refunds\">\r\n        <div class=\"card-header payment-header\">\r\n            <clr-icon shape=\"redo\" class=\"refund-icon\" dir=\"down\"></clr-icon>\r\n            {{ 'order.refund' | translate }} #{{ refund.id }}\r\n            <div class=\"clr-flex-fill\"></div>\r\n            <vdr-refund-state-label [state]=\"refund.state\"></vdr-refund-state-label>\r\n        </div>\r\n        <div class=\"card-block\">\r\n            <vdr-labeled-data [label]=\"'common.created-at' | translate\">\r\n                {{ refund.createdAt | localeDate: 'medium' }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-total' | translate\">\r\n                {{ refund.total | localeCurrency: currencyCode }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.transaction-id' | translate\" *ngIf=\"refund.transactionId\">\r\n                {{ refund.transactionId }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-reason' | translate\" *ngIf=\"refund.reason\">\r\n                {{ refund.reason }}\r\n            </vdr-labeled-data>\r\n            <vdr-labeled-data [label]=\"'order.refund-metadata' | translate\" *ngIf=\"refundHasMetadata(refund)\">\r\n                <vdr-object-tree [value]=\"refund.metadata\"></vdr-object-tree>\r\n            </vdr-labeled-data>\r\n        </div>\r\n        <div class=\"card-footer\" *ngIf=\"refund.state === 'Pending'\">\r\n            <button class=\"btn btn-sm btn-primary\" (click)=\"settleRefund.emit(refund)\">\r\n                {{ 'order.settle-refund' | translate }}\r\n            </button>\r\n        </div>\r\n    </ng-container>\r\n    <div class=\"card-footer\" *ngIf=\"payment.nextStates.length\">\r\n        <button\r\n            class=\"btn btn-sm btn-primary\"\r\n            *ngIf=\"payment.nextStates.includes('Settled')\"\r\n            (click)=\"settlePayment.emit(payment)\"\r\n        >\r\n            {{ 'order.settle-payment' | translate }}\r\n        </button>\r\n        <vdr-dropdown>\r\n            <button class=\"icon-button\" vdrDropdownTrigger>\r\n                <clr-icon shape=\"ellipsis-vertical\"></clr-icon>\r\n            </button>\r\n            <vdr-dropdown-menu vdrPosition=\"bottom-right\">\r\n                <ng-container *ngFor=\"let nextState of nextOtherStates()\">\r\n                    <button\r\n                        type=\"button\"\r\n                        vdrDropdownItem\r\n                        (click)=\"transitionPaymentState.emit({ payment: payment, state: nextState })\"\r\n                    >\r\n                        <ng-container *ngIf=\"nextState !== 'Cancelled'; else cancel\">\r\n                            <clr-icon shape=\"step-forward-2\"></clr-icon>\r\n                            {{\r\n                                'order.transition-to-state'\r\n                                    | translate: { state: (nextState | stateI18nToken | translate) }\r\n                            }}\r\n                        </ng-container>\r\n                        <ng-template #cancel>\r\n                            <clr-icon shape=\"error-standard\" class=\"is-error\"></clr-icon>\r\n                            {{ 'order.cancel-payment' | translate }}\r\n                        </ng-template>\r\n                    </button>\r\n                </ng-container>\r\n            </vdr-dropdown-menu>\r\n        </vdr-dropdown>\r\n    </div>\r\n</div>\r\n", styles: [".payment-header{display:flex;justify-content:space-between;align-items:center}.refund-icon{margin-inline-end:6px;color:var(--color-grey-400)}.card-footer{display:flex;align-items:center;justify-content:flex-end}\n"] }]
         }], propDecorators: { payment: [{
                 type: Input
             }], currencyCode: [{

package/esm2022/order/components/order-process-graph/order-process-edge.component.mjs

@@ -29,10 +29,10 @@ export class OrderProcessEdgeComponent {
                 : {}),
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessEdgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderProcessEdgeComponent, selector: "vdr-order-process-edge", inputs: { from: "from", to: "to", index: "index" }, ngImport: i0, template: "<div\r\n    [attr.data-from]=\"from.node.name\"\r\n    [attr.data-to]=\"to.node.name\"\r\n    [ngStyle]=\"getStyle()\"\r\n    [class.active]=\"active$ | async\"\r\n    class=\"edge\">\r\n    <clr-icon shape=\"arrow\" flip=\"vertical\" class=\"arrow\"></clr-icon>\r\n</div>\r\n", styles: [".edge{position:absolute;border:1px solid var(--color-component-border-200);background-color:var(--color-component-bg-300);opacity:.3;transition:border .2s,opacity .2s,background-color .2s}.edge.active{border-color:var(--color-primary-500);background-color:var(--color-primary-500);opacity:1}.edge.active .arrow{color:var(--color-primary-500)}.edge .arrow{position:absolute;bottom:-4px;left:-8px;color:var(--color-grey-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessEdgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderProcessEdgeComponent, selector: "vdr-order-process-edge", inputs: { from: "from", to: "to", index: "index" }, ngImport: i0, template: "<div\r\n    [attr.data-from]=\"from.node.name\"\r\n    [attr.data-to]=\"to.node.name\"\r\n    [ngStyle]=\"getStyle()\"\r\n    [class.active]=\"active$ | async\"\r\n    class=\"edge\">\r\n    <clr-icon shape=\"arrow\" flip=\"vertical\" class=\"arrow\"></clr-icon>\r\n</div>\r\n", styles: [".edge{position:absolute;border:1px solid var(--color-component-border-200);background-color:var(--color-component-bg-300);opacity:.3;transition:border .2s,opacity .2s,background-color .2s}.edge.active{border-color:var(--color-primary-500);background-color:var(--color-primary-500);opacity:1}.edge.active .arrow{color:var(--color-primary-500)}.edge .arrow{position:absolute;bottom:-4px;left:-8px;color:var(--color-grey-300)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessEdgeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessEdgeComponent, decorators: [{
             type: Component,
             args: [{ selector: 'vdr-order-process-edge', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\r\n    [attr.data-from]=\"from.node.name\"\r\n    [attr.data-to]=\"to.node.name\"\r\n    [ngStyle]=\"getStyle()\"\r\n    [class.active]=\"active$ | async\"\r\n    class=\"edge\">\r\n    <clr-icon shape=\"arrow\" flip=\"vertical\" class=\"arrow\"></clr-icon>\r\n</div>\r\n", styles: [".edge{position:absolute;border:1px solid var(--color-component-border-200);background-color:var(--color-component-bg-300);opacity:.3;transition:border .2s,opacity .2s,background-color .2s}.edge.active{border-color:var(--color-primary-500);background-color:var(--color-primary-500);opacity:1}.edge.active .arrow{color:var(--color-primary-500)}.edge .arrow{position:absolute;bottom:-4px;left:-8px;color:var(--color-grey-300)}\n"] }]
         }], propDecorators: { from: [{

package/esm2022/order/components/order-process-graph/order-process-graph.component.mjs

@@ -76,10 +76,10 @@ export class OrderProcessGraphComponent {
         this.edges = [...this.edges];
         this.changeDetector.markForCheck();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessGraphComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderProcessGraphComponent, selector: "vdr-order-process-graph", inputs: { states: "states", initialState: "initialState" }, host: { properties: { "style.height.px": "this.outerHeight" } }, viewQueries: [{ propertyName: "nodeComponents", predicate: OrderProcessNodeComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngFor=\"let state of nodes; let i = index\">\r\n    <vdr-order-process-node\r\n        [node]=\"state\"\r\n        [index]=\"i\"\r\n        [active]=\"(activeState$ | async) === state.name\"\r\n        (mouseenter)=\"onMouseOver(state.name)\"\r\n        (mouseleave)=\"onMouseOut()\"\r\n    ></vdr-order-process-node>\r\n</ng-container>\r\n<ng-container *ngFor=\"let edge of edges\">\r\n    <vdr-order-process-edge [from]=\"edge.from\" [to]=\"edge.to\" [index]=\"edge.index\"></vdr-order-process-edge>\r\n</ng-container>\r\n", styles: [":host{display:block;border:1px hotpink;margin:20px;padding:12px;position:relative}.state-row{display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.OrderProcessNodeComponent, selector: "vdr-order-process-node", inputs: ["node", "index", "active"] }, { kind: "component", type: i3.OrderProcessEdgeComponent, selector: "vdr-order-process-edge", inputs: ["from", "to", "index"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessGraphComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderProcessGraphComponent, selector: "vdr-order-process-graph", inputs: { states: "states", initialState: "initialState" }, host: { properties: { "style.height.px": "this.outerHeight" } }, viewQueries: [{ propertyName: "nodeComponents", predicate: OrderProcessNodeComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngFor=\"let state of nodes; let i = index\">\r\n    <vdr-order-process-node\r\n        [node]=\"state\"\r\n        [index]=\"i\"\r\n        [active]=\"(activeState$ | async) === state.name\"\r\n        (mouseenter)=\"onMouseOver(state.name)\"\r\n        (mouseleave)=\"onMouseOut()\"\r\n    ></vdr-order-process-node>\r\n</ng-container>\r\n<ng-container *ngFor=\"let edge of edges\">\r\n    <vdr-order-process-edge [from]=\"edge.from\" [to]=\"edge.to\" [index]=\"edge.index\"></vdr-order-process-edge>\r\n</ng-container>\r\n", styles: [":host{display:block;border:1px hotpink;margin:20px;padding:12px;position:relative}.state-row{display:flex}\n"], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "component", type: i2.OrderProcessNodeComponent, selector: "vdr-order-process-node", inputs: ["node", "index", "active"] }, { kind: "component", type: i3.OrderProcessEdgeComponent, selector: "vdr-order-process-edge", inputs: ["from", "to", "index"] }, { kind: "pipe", type: i1.AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessGraphComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessGraphComponent, decorators: [{
             type: Component,
             args: [{ selector: 'vdr-order-process-graph', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngFor=\"let state of nodes; let i = index\">\r\n    <vdr-order-process-node\r\n        [node]=\"state\"\r\n        [index]=\"i\"\r\n        [active]=\"(activeState$ | async) === state.name\"\r\n        (mouseenter)=\"onMouseOver(state.name)\"\r\n        (mouseleave)=\"onMouseOut()\"\r\n    ></vdr-order-process-node>\r\n</ng-container>\r\n<ng-container *ngFor=\"let edge of edges\">\r\n    <vdr-order-process-edge [from]=\"edge.from\" [to]=\"edge.to\" [index]=\"edge.index\"></vdr-order-process-edge>\r\n</ng-container>\r\n", styles: [":host{display:block;border:1px hotpink;margin:20px;padding:12px;position:relative}.state-row{display:flex}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { states: [{

package/esm2022/order/components/order-process-graph/order-process-node.component.mjs

@@ -37,12 +37,12 @@ export class OrderProcessNodeComponent {
             'left.px': pos.x,
         };
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessNodeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderProcessNodeComponent, selector: "vdr-order-process-node", inputs: { node: "node", index: "index", active: "active" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"node-wrapper\" [ngStyle]=\"getStyle()\" [class.active]=\"active$ | async\">\r\n    <div\r\n        class=\"node\"\r\n        [class.active-target]=\"activeTarget$ | async\"\r\n    >\r\n        {{ node.name | stateI18nToken | translate }}\r\n    </div>\r\n    <div class=\"cancelled-wrapper\" *ngIf=\"isCancellable\">\r\n        <div class=\"cancelled-edge\">\r\n        </div>\r\n        <clr-icon shape=\"dot-circle\"></clr-icon>\r\n        <div class=\"cancelled-node\">\r\n            {{ cancelledState | stateI18nToken | translate }}\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}.node-wrapper{position:absolute;z-index:1;display:flex;align-items:center}.node{display:inline-block;border:2px solid var(--color-component-border-200);border-radius:3px;padding:3px 6px;z-index:1;background-color:var(--color-component-bg-100);opacity:.7;transition:opacity .2s,background-color .2s,color .2s;cursor:default}.node.active-target{border-color:var(--color-primary-500);opacity:.9}.cancelled-wrapper{display:flex;align-items:center;color:var(--color-grey-300);transition:color .2s,opacity .2s;opacity:.7}.cancelled-edge{width:48px;height:2px;background-color:var(--color-component-bg-300);transition:background-color .2s}clr-icon{margin-left:-1px}.cancelled-node{margin-left:6px}.active .cancelled-wrapper{opacity:1}.active .node{opacity:1;background-color:var(--color-primary-600);border-color:var(--color-primary-600);color:var(--color-primary-100)}.active .cancelled-wrapper{color:var(--color-error-500)}.active .cancelled-edge{background-color:var(--color-error-500)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.StateI18nTokenPipe, name: "stateI18nToken" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessNodeComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderProcessNodeComponent, selector: "vdr-order-process-node", inputs: { node: "node", index: "index", active: "active" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"node-wrapper\" [ngStyle]=\"getStyle()\" [class.active]=\"active$ | async\">\r\n    <div\r\n        class=\"node\"\r\n        [class.active-target]=\"activeTarget$ | async\"\r\n    >\r\n        {{ node.name | stateI18nToken | translate }}\r\n    </div>\r\n    <div class=\"cancelled-wrapper\" *ngIf=\"isCancellable\">\r\n        <div class=\"cancelled-edge\">\r\n        </div>\r\n        <clr-icon shape=\"dot-circle\"></clr-icon>\r\n        <div class=\"cancelled-node\">\r\n            {{ cancelledState | stateI18nToken | translate }}\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}.node-wrapper{position:absolute;z-index:1;display:flex;align-items:center}.node{display:inline-block;border:2px solid var(--color-component-border-200);border-radius:3px;padding:3px 6px;z-index:1;background-color:var(--color-component-bg-100);opacity:.7;transition:opacity .2s,background-color .2s,color .2s;cursor:default}.node.active-target{border-color:var(--color-primary-500);opacity:.9}.cancelled-wrapper{display:flex;align-items:center;color:var(--color-grey-300);transition:color .2s,opacity .2s;opacity:.7}.cancelled-edge{width:48px;height:2px;background-color:var(--color-component-bg-300);transition:background-color .2s}clr-icon{margin-inline-start:-1px}.cancelled-node{margin-inline-start:6px}.active .cancelled-wrapper{opacity:1}.active .node{opacity:1;background-color:var(--color-primary-600);border-color:var(--color-primary-600);color:var(--color-primary-100)}.active .cancelled-wrapper{color:var(--color-error-500)}.active .cancelled-edge{background-color:var(--color-error-500)}\n"], dependencies: [{ kind: "directive", type: i1.ClrIconCustomTag, selector: "clr-icon" }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: i4.StateI18nTokenPipe, name: "stateI18nToken" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessNodeComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessNodeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'vdr-order-process-node', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"node-wrapper\" [ngStyle]=\"getStyle()\" [class.active]=\"active$ | async\">\r\n    <div\r\n        class=\"node\"\r\n        [class.active-target]=\"activeTarget$ | async\"\r\n    >\r\n        {{ node.name | stateI18nToken | translate }}\r\n    </div>\r\n    <div class=\"cancelled-wrapper\" *ngIf=\"isCancellable\">\r\n        <div class=\"cancelled-edge\">\r\n        </div>\r\n        <clr-icon shape=\"dot-circle\"></clr-icon>\r\n        <div class=\"cancelled-node\">\r\n            {{ cancelledState | stateI18nToken | translate }}\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}.node-wrapper{position:absolute;z-index:1;display:flex;align-items:center}.node{display:inline-block;border:2px solid var(--color-component-border-200);border-radius:3px;padding:3px 6px;z-index:1;background-color:var(--color-component-bg-100);opacity:.7;transition:opacity .2s,background-color .2s,color .2s;cursor:default}.node.active-target{border-color:var(--color-primary-500);opacity:.9}.cancelled-wrapper{display:flex;align-items:center;color:var(--color-grey-300);transition:color .2s,opacity .2s;opacity:.7}.cancelled-edge{width:48px;height:2px;background-color:var(--color-component-bg-300);transition:background-color .2s}clr-icon{margin-left:-1px}.cancelled-node{margin-left:6px}.active .cancelled-wrapper{opacity:1}.active .node{opacity:1;background-color:var(--color-primary-600);border-color:var(--color-primary-600);color:var(--color-primary-100)}.active .cancelled-wrapper{color:var(--color-error-500)}.active .cancelled-edge{background-color:var(--color-error-500)}\n"] }]
+            args: [{ selector: 'vdr-order-process-node', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"node-wrapper\" [ngStyle]=\"getStyle()\" [class.active]=\"active$ | async\">\r\n    <div\r\n        class=\"node\"\r\n        [class.active-target]=\"activeTarget$ | async\"\r\n    >\r\n        {{ node.name | stateI18nToken | translate }}\r\n    </div>\r\n    <div class=\"cancelled-wrapper\" *ngIf=\"isCancellable\">\r\n        <div class=\"cancelled-edge\">\r\n        </div>\r\n        <clr-icon shape=\"dot-circle\"></clr-icon>\r\n        <div class=\"cancelled-node\">\r\n            {{ cancelledState | stateI18nToken | translate }}\r\n        </div>\r\n    </div>\r\n</div>\r\n", styles: [":host{display:block}.node-wrapper{position:absolute;z-index:1;display:flex;align-items:center}.node{display:inline-block;border:2px solid var(--color-component-border-200);border-radius:3px;padding:3px 6px;z-index:1;background-color:var(--color-component-bg-100);opacity:.7;transition:opacity .2s,background-color .2s,color .2s;cursor:default}.node.active-target{border-color:var(--color-primary-500);opacity:.9}.cancelled-wrapper{display:flex;align-items:center;color:var(--color-grey-300);transition:color .2s,opacity .2s;opacity:.7}.cancelled-edge{width:48px;height:2px;background-color:var(--color-component-bg-300);transition:background-color .2s}clr-icon{margin-inline-start:-1px}.cancelled-node{margin-inline-start:6px}.active .cancelled-wrapper{opacity:1}.active .node{opacity:1;background-color:var(--color-primary-600);border-color:var(--color-primary-600);color:var(--color-primary-100)}.active .cancelled-wrapper{color:var(--color-error-500)}.active .cancelled-edge{background-color:var(--color-error-500)}\n"] }]
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { node: [{
                 type: Input
             }], index: [{

package/esm2022/order/components/order-process-graph-dialog/order-process-graph-dialog.component.mjs

@@ -11,10 +11,10 @@ export class OrderProcessGraphDialogComponent {
     ngOnInit() {
         this.states = this.serverConfigService.getOrderProcessStates();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessGraphDialogComponent, deps: [{ token: i1.ServerConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.0.3", type: OrderProcessGraphDialogComponent, selector: "vdr-order-process-graph-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>{{ 'order.order-state-diagram' | translate }}</ng-template>\r\n\r\n<vdr-order-process-graph [states]=\"states\" [initialState]=\"activeState\"></vdr-order-process-graph>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i2.OrderProcessGraphComponent, selector: "vdr-order-process-graph", inputs: ["states", "initialState"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessGraphDialogComponent, deps: [{ token: i1.ServerConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.2", type: OrderProcessGraphDialogComponent, selector: "vdr-order-process-graph-dialog", ngImport: i0, template: "<ng-template vdrDialogTitle>{{ 'order.order-state-diagram' | translate }}</ng-template>\r\n\r\n<vdr-order-process-graph [states]=\"states\" [initialState]=\"activeState\"></vdr-order-process-graph>\r\n", styles: [""], dependencies: [{ kind: "directive", type: i1.DialogTitleDirective, selector: "[vdrDialogTitle]" }, { kind: "component", type: i2.OrderProcessGraphComponent, selector: "vdr-order-process-graph", inputs: ["states", "initialState"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.0.3", ngImport: i0, type: OrderProcessGraphDialogComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.2", ngImport: i0, type: OrderProcessGraphDialogComponent, decorators: [{
             type: Component,
             args: [{ selector: 'vdr-order-process-graph-dialog', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-template vdrDialogTitle>{{ 'order.order-state-diagram' | translate }}</ng-template>\r\n\r\n<vdr-order-process-graph [states]=\"states\" [initialState]=\"activeState\"></vdr-order-process-graph>\r\n" }]
         }], ctorParameters: function () { return [{ type: i1.ServerConfigService }]; } });