survey-angular-ui 1.9.138 → 1.10.1

package/esm2015/questions/paneldynamic.component.js

@@ -11,14 +11,8 @@ import * as i6 from "../components/paneldynamic-actions/paneldynamic-progress-te
 import * as i7 from "@angular/common";
 import * as i8 from "../utils/dynamic.directive";
 export class PanelDynamicQuestionComponent extends QuestionAngular {
-    get renderedPanels() {
-        if (this.model.isRenderModeList)
-            return this.model.visiblePanels;
-        const panels = [];
-        if (this.model.currentPanel) {
-            panels.push(this.model.currentPanel);
-        }
-        return panels;
+    trackPanelBy(_, panel) {
+        return panel.id;
     }
     onModelChanged() {
         super.onModelChanged();
@@ -69,7 +63,7 @@ export class PanelDynamicQuestionComponent extends QuestionAngular {
     }
 }
 PanelDynamicQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelDynamicQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-PanelDynamicQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDynamicQuestionComponent, selector: "sv-ng-paneldynamic-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <div *ngIf=\"model.getShowNoEntriesPlaceholder()\" [class]=\"model.cssClasses.noEntriesPlaceholder\">\n    <span [model]=\"model.locNoEntriesText\" sv-ng-string></span>\n    <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  </div>\n  <div [class]=\"model.cssClasses.progress\" *ngIf=\"!model.showLegacyNavigation && model.isProgressTopShowing && model.isRangeShowing\">\n    <div\n      [class]=\"model.cssClasses.progressBar\"\n      [style]=\"{ width: model.progress }\"\n      role=\"progressbar\"\n    ></div>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\" *ngIf=\"model.showLegacyNavigation && model.isProgressTopShowing\"></ng-container>\n  <!-- add track by [key]=\"panel.id\" -->\n  <ng-container *ngFor=\"let panel of renderedPanels; index as index\"> \n    <div [class]=\"model.getPanelWrapperCss(panel)\">\n      <ng-template [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n      <ng-container *ngIf=\"model.panelRemoveButtonLocation ==='right' && model.canRemovePanel && panel.state != 'collapsed'\">\n        <ng-template [component]=\"{ name: 'sv-paneldynamic-remove-btn', data: { data: { panel, question: model }}}\"></ng-template>\n      </ng-container>\n    </div>\n    <!-- add track by [key]=\"'separator' + panel.id\" -->\n    <hr [class]=\"model.cssClasses.separator\" *ngIf=\"model.showSeparator(index)\"/>\n  </ng-container>\n  <ng-container [ngTemplateOutlet]=\"progress\" *ngIf=\"model.showLegacyNavigation && model.isProgressBottomShowing\"></ng-container>\n  <sv-ng-paneldynamic-add-btn *ngIf=\"model.showLegacyNavigation && model.isRenderModeList\" [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  <ng-container [ngTemplateOutlet]=\"progressV2\" *ngIf=\"model.showNavigation\"></ng-container>\n</div>\n\n<ng-template #progressV2>\n  <div [class]=\"model.cssClasses.footer\" *ngIf=\"!!model.cssClasses.footer\">\n    <hr [class]=\"model.cssClasses.separator\"/>\n    <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing && model.isProgressBottomShowing\">\n      <div\n        [class]=\"model.cssClasses.progressBar\"\n        [style]=\"{ width: model.progress }\"\n        role=\"progressbar\"\n      ></div>\n    </div>\n    <div *ngIf=\"model.footerToolbar.visibleActions.length\" [class]=\"model.cssClasses.footerButtonsContainer\">\n      <sv-ng-action-bar [model]=\"model.footerToolbar\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>\n<ng-template #progress>\n  <div [class]=\"this.progressCssClass\">\n    <div style=\"clear: both\" [class]=\"this.progressCssClass\">\n      <div [class]=\"model.cssClasses.progressContainer\">\n        <sv-ng-paneldynamic-prev-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-prev-btn>\n        <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing\">\n          <div\n            [class]=\"model.cssClasses.progressBar\"\n            [style]=\"{ width: model.progress }\"\n            role=\"progressbar\"\n          ></div>\n        </div>\n          <sv-ng-paneldynamic-next-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-next-btn>\n      </div>\n      <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n      <sv-ng-paneldynamic-progress-text [data]=\"{ question: model }\"></sv-ng-paneldynamic-progress-text>\n    </div>\n  </div>\n</ng-template>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: i2.PanelDynamicAddBtn, selector: "sv-ng-paneldynamic-add-btn" }, { type: i3.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: i4.PanelDynamicPrevBtn, selector: "sv-ng-paneldynamic-prev-btn" }, { type: i5.PanelDynamicNextBtn, selector: "sv-ng-paneldynamic-next-btn" }, { type: i6.PanelDynamicProgressText, selector: "sv-ng-paneldynamic-progress-text" }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+PanelDynamicQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDynamicQuestionComponent, selector: "sv-ng-paneldynamic-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <div *ngIf=\"model.getShowNoEntriesPlaceholder()\" [class]=\"model.cssClasses.noEntriesPlaceholder\">\n    <span [model]=\"model.locNoEntriesText\" sv-ng-string></span>\n    <sv-ng-paneldynamic-add-btn *ngIf=\"model.canAddPanel\" [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  </div>\n  <div [class]=\"model.cssClasses.progress\"\n    *ngIf=\"!model.showLegacyNavigation && model.isProgressTopShowing && model.isRangeShowing\">\n    <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\"\n    *ngIf=\"model.showLegacyNavigation && model.isProgressTopShowing\"></ng-container>\n  <div [class]=\"model.cssClasses.panelsContainer\">\n    <ng-container *ngFor=\"let panel of model.renderedPanels; index as index; trackBy: trackPanelBy\">\n      <div [class]=\"model.getPanelWrapperCss(panel)\">\n        <ng-template\n          [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n        <ng-container\n          *ngIf=\"model.panelRemoveButtonLocation ==='right' && model.canRemovePanel && panel.state != 'collapsed'\">\n          <ng-template\n            [component]=\"{ name: 'sv-paneldynamic-remove-btn', data: { data: { panel, question: model }}}\"></ng-template>\n        </ng-container>\n      </div>\n      <hr [class]=\"model.cssClasses.separator\" *ngIf=\"model.showSeparator(index)\" />\n    </ng-container>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\"\n    *ngIf=\"model.showLegacyNavigation && model.isProgressBottomShowing\"></ng-container>\n  <sv-ng-paneldynamic-add-btn *ngIf=\"model.showLegacyNavigation && model.isRenderModeList\"\n    [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  <ng-container [ngTemplateOutlet]=\"progressV2\" *ngIf=\"model.showNavigation\"></ng-container>\n</div>\n\n<ng-template #progressV2>\n  <div [class]=\"model.cssClasses.footer\" *ngIf=\"!!model.cssClasses.footer\">\n    <hr [class]=\"model.cssClasses.separator\" />\n    <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing && model.isProgressBottomShowing\">\n      <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n    </div>\n    <div *ngIf=\"model.footerToolbar.visibleActions.length\" [class]=\"model.cssClasses.footerButtonsContainer\">\n      <sv-ng-action-bar [model]=\"model.footerToolbar\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>\n<ng-template #progress>\n  <div [class]=\"this.progressCssClass\">\n    <div style=\"clear: both\" [class]=\"this.progressCssClass\">\n      <div [class]=\"model.cssClasses.progressContainer\">\n        <sv-ng-paneldynamic-prev-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-prev-btn>\n        <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing\">\n          <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n        </div>\n        <sv-ng-paneldynamic-next-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-next-btn>\n      </div>\n      <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n      <sv-ng-paneldynamic-progress-text [data]=\"{ question: model }\"></sv-ng-paneldynamic-progress-text>\n    </div>\n  </div>\n</ng-template>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: i2.PanelDynamicAddBtn, selector: "sv-ng-paneldynamic-add-btn" }, { type: i3.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: i4.PanelDynamicPrevBtn, selector: "sv-ng-paneldynamic-prev-btn" }, { type: i5.PanelDynamicNextBtn, selector: "sv-ng-paneldynamic-next-btn" }, { type: i6.PanelDynamicProgressText, selector: "sv-ng-paneldynamic-progress-text" }], directives: [{ type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i7.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i8.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelDynamicQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -78,4 +72,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 }]
         }] });
 AngularComponentFactory.Instance.registerComponent("paneldynamic-question", PanelDynamicQuestionComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFuZWxkeW5hbWljLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcGFuZWxkeW5hbWljLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcGFuZWxkeW5hbWljLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7OztBQU0vRCxNQUFNLE9BQU8sNkJBQThCLFNBQVEsZUFBZ0Q7SUFDakcsSUFBSSxjQUFjO1FBQ2hCLElBQUksSUFBSSxDQUFDLEtBQUssQ0FBQyxnQkFBZ0I7WUFBRSxPQUFPLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxDQUFDO1FBQ2pFLE1BQU0sTUFBTSxHQUFHLEVBQUUsQ0FBQztRQUNsQixJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsWUFBWSxFQUFFO1lBQzNCLE1BQU0sQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxZQUFZLENBQUMsQ0FBQztTQUN0QztRQUNELE9BQU8sTUFBTSxDQUFDO0lBQ2hCLENBQUM7SUFDa0IsY0FBYztRQUMvQixLQUFLLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdkIsSUFBSSxDQUFDLEtBQUssQ0FBQyx5QkFBeUIsR0FBRyxHQUFHLEVBQUU7WUFDMUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQ2hCLENBQUMsQ0FBQztRQUNGLElBQUksQ0FBQyxLQUFLLENBQUMsMkJBQTJCLEdBQUcsR0FBRyxFQUFFO1lBQzVDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQTtRQUNmLENBQUMsQ0FBQztRQUNGLElBQUksQ0FBQyxLQUFLLENBQUMseUJBQXlCLEdBQUcsR0FBRyxFQUFFO1lBQzFDLElBQUksQ0FBQyxNQUFNLEVBQUUsQ0FBQztRQUNoQixDQUFDLENBQUM7SUFDSixDQUFDO0lBQ0QsSUFBSSxnQkFBZ0I7UUFDbEIsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDLG9CQUFvQjtZQUNwQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxVQUFVLENBQUMsV0FBVztZQUNuQyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxVQUFVLENBQUMsY0FBYyxDQUFDO0lBQzNDLENBQUM7SUFDUSxXQUFXO1FBQ2xCLElBQUksQ0FBQyxLQUFLLENBQUMseUJBQXlCLEdBQUcsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO1FBQ2hELElBQUksQ0FBQyxLQUFLLENBQUMsMkJBQTJCLEdBQUcsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO1FBQ2xELElBQUksQ0FBQyxLQUFLLENBQUMseUJBQXlCLEdBQUcsR0FBRyxFQUFFLEdBQUUsQ0FBQyxDQUFDO1FBQ2hELEtBQUssQ0FBQyxXQUFXLEVBQUUsQ0FBQztJQUN0QixDQUFDO0lBQ00scUJBQXFCLENBQUMsS0FBaUI7UUFDNUMsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFdBQTBCLENBQUM7UUFDL0MsSUFBRyxDQUFDLENBQUMsTUFBTSxFQUFFO1lBQ1gsTUFBTSxJQUFJLEdBQUcsTUFBTSxDQUFDLDhCQUE4QixDQUFDLEtBQUssQ0FBQyxDQUFDO1lBQzFELElBQUcsQ0FBQyxDQUFDLElBQUksRUFBRTtnQkFDVCxPQUFPLElBQUksQ0FBQzthQUNiO1NBQ0Y7UUFDRCxPQUFPLE9BQU8sQ0FBQztJQUNqQixDQUFDO0lBQ00scUJBQXFCLENBQUMsS0FBaUI7UUFDNUMsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFdBQTBCLENBQUM7UUFDL0MsSUFBSSxJQUFTLENBQUM7UUFDZCxJQUFHLENBQUMsQ0FBQyxNQUFNLEVBQUU7WUFDWCxJQUFJLEdBQUcsTUFBTSxDQUFDLDhCQUE4QixDQUFDLEtBQUssQ0FBQyxDQUFDO1NBQ3JEO1FBQ0QsT0FBTztZQUNMLGFBQWEsRUFBRSxPQUFPO1lBQ3RCLGFBQWEsRUFBRTtnQkFDYixLQUFLLEVBQUUsS0FBSztnQkFDWixJQUFJLEVBQUUsSUFBSTthQUNYO1NBQ0YsQ0FBQztJQUNKLENBQUM7OzJIQXZEVSw2QkFBNkI7K0dBQTdCLDZCQUE2QiwwRkNUMUMseTdHQThEYzs0RkRyREQsNkJBQTZCO2tCQUp6QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSw2QkFBNkI7b0JBQ3ZDLFdBQVcsRUFBRSwrQkFBK0I7aUJBQzdDOztBQTJERCx1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsdUJBQXVCLEVBQUUsNkJBQTZCLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IFF1ZXN0aW9uQW5ndWxhciB9IGZyb20gXCIuLi9xdWVzdGlvblwiO1xuaW1wb3J0IHsgUGFuZWxNb2RlbCwgUXVlc3Rpb25QYW5lbER5bmFtaWNNb2RlbCwgU3VydmV5TW9kZWwgfSBmcm9tIFwic3VydmV5LWNvcmVcIjtcbmltcG9ydCB7IEFuZ3VsYXJDb21wb25lbnRGYWN0b3J5IH0gZnJvbSBcIi4uL2NvbXBvbmVudC1mYWN0b3J5XCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJzdi1uZy1wYW5lbGR5bmFtaWMtcXVlc3Rpb25cIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9wYW5lbGR5bmFtaWMuY29tcG9uZW50Lmh0bWxcIlxufSlcbmV4cG9ydCBjbGFzcyBQYW5lbER5bmFtaWNRdWVzdGlvbkNvbXBvbmVudCBleHRlbmRzIFF1ZXN0aW9uQW5ndWxhcjxRdWVzdGlvblBhbmVsRHluYW1pY01vZGVsIHwgYW55PiBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIGdldCByZW5kZXJlZFBhbmVscygpOiBQYW5lbE1vZGVsW10ge1xuICAgIGlmICh0aGlzLm1vZGVsLmlzUmVuZGVyTW9kZUxpc3QpIHJldHVybiB0aGlzLm1vZGVsLnZpc2libGVQYW5lbHM7XG4gICAgY29uc3QgcGFuZWxzID0gW107XG4gICAgaWYgKHRoaXMubW9kZWwuY3VycmVudFBhbmVsKSB7XG4gICAgICBwYW5lbHMucHVzaCh0aGlzLm1vZGVsLmN1cnJlbnRQYW5lbCk7XG4gICAgfVxuICAgIHJldHVybiBwYW5lbHM7XG4gIH1cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIG9uTW9kZWxDaGFuZ2VkKCk6IHZvaWQge1xuICAgIHN1cGVyLm9uTW9kZWxDaGFuZ2VkKCk7XG4gICAgdGhpcy5tb2RlbC5wYW5lbENvdW50Q2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge1xuICAgICAgdGhpcy51cGRhdGUoKTtcbiAgICB9O1xuICAgIHRoaXMubW9kZWwuY3VycmVudEluZGV4Q2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge1xuICAgICAgdGhpcy51cGRhdGUoKVxuICAgIH07XG4gICAgdGhpcy5tb2RlbC5yZW5kZXJNb2RlQ2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge1xuICAgICAgdGhpcy51cGRhdGUoKTtcbiAgICB9O1xuICB9XG4gIGdldCBwcm9ncmVzc0Nzc0NsYXNzKCkge1xuICAgIHJldHVybiB0aGlzLm1vZGVsLmlzUHJvZ3Jlc3NUb3BTaG93aW5nXG4gICAgICA/IHRoaXMubW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc1RvcFxuICAgICAgOiB0aGlzLm1vZGVsLmNzc0NsYXNzZXMucHJvZ3Jlc3NCb3R0b207XG4gIH1cbiAgb3ZlcnJpZGUgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgdGhpcy5tb2RlbC5wYW5lbENvdW50Q2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge307XG4gICAgdGhpcy5tb2RlbC5jdXJyZW50SW5kZXhDaGFuZ2VkQ2FsbGJhY2sgPSAoKSA9PiB7fTtcbiAgICB0aGlzLm1vZGVsLnJlbmRlck1vZGVDaGFuZ2VkQ2FsbGJhY2sgPSAoKSA9PiB7fTtcbiAgICBzdXBlci5uZ09uRGVzdHJveSgpO1xuICB9XG4gIHB1YmxpYyBnZXRQYW5lbENvbXBvbmVudE5hbWUocGFuZWw6IFBhbmVsTW9kZWwpOiBzdHJpbmcge1xuICAgIGNvbnN0IHN1cnZleSA9IHRoaXMuc3VydmV5TW9kZWwgYXMgU3VydmV5TW9kZWw7XG4gICAgaWYoISFzdXJ2ZXkpIHtcbiAgICAgIGNvbnN0IG5hbWUgPSBzdXJ2ZXkuZ2V0RWxlbWVudFdyYXBwZXJDb21wb25lbnROYW1lKHBhbmVsKTtcbiAgICAgIGlmKCEhbmFtZSkge1xuICAgICAgICByZXR1cm4gbmFtZTtcbiAgICAgIH1cbiAgICB9XG4gICAgcmV0dXJuIFwicGFuZWxcIjtcbiAgfVxuICBwdWJsaWMgZ2V0UGFuZWxDb21wb25lbnREYXRhKHBhbmVsOiBQYW5lbE1vZGVsKTogYW55IHtcbiAgICBjb25zdCBzdXJ2ZXkgPSB0aGlzLnN1cnZleU1vZGVsIGFzIFN1cnZleU1vZGVsO1xuICAgIGxldCBkYXRhOiBhbnk7XG4gICAgaWYoISFzdXJ2ZXkpIHtcbiAgICAgIGRhdGEgPSBzdXJ2ZXkuZ2V0RWxlbWVudFdyYXBwZXJDb21wb25lbnREYXRhKHBhbmVsKTtcbiAgICB9XG4gICAgcmV0dXJuIHtcbiAgICAgIGNvbXBvbmVudE5hbWU6IFwicGFuZWxcIixcbiAgICAgIGNvbXBvbmVudERhdGE6IHtcbiAgICAgICAgbW9kZWw6IHBhbmVsLFxuICAgICAgICBkYXRhOiBkYXRhXG4gICAgICB9XG4gICAgfTtcbiAgfVxufVxuXG5Bbmd1bGFyQ29tcG9uZW50RmFjdG9yeS5JbnN0YW5jZS5yZWdpc3RlckNvbXBvbmVudChcInBhbmVsZHluYW1pYy1xdWVzdGlvblwiLCBQYW5lbER5bmFtaWNRdWVzdGlvbkNvbXBvbmVudCk7IiwiPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5yb290XCIgI2NvbnRlbnRFbGVtZW50PlxuICA8ZGl2ICpuZ0lmPVwibW9kZWwuZ2V0U2hvd05vRW50cmllc1BsYWNlaG9sZGVyKClcIiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5ub0VudHJpZXNQbGFjZWhvbGRlclwiPlxuICAgIDxzcGFuIFttb2RlbF09XCJtb2RlbC5sb2NOb0VudHJpZXNUZXh0XCIgc3Ytbmctc3RyaW5nPjwvc3Bhbj5cbiAgICA8c3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4gW2RhdGFdPVwieyBxdWVzdGlvbjogbW9kZWwgfVwiPjwvc3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4+XG4gIDwvZGl2PlxuICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnByb2dyZXNzXCIgKm5nSWY9XCIhbW9kZWwuc2hvd0xlZ2FjeU5hdmlnYXRpb24gJiYgbW9kZWwuaXNQcm9ncmVzc1RvcFNob3dpbmcgJiYgbW9kZWwuaXNSYW5nZVNob3dpbmdcIj5cbiAgICA8ZGl2XG4gICAgICBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0JhclwiXG4gICAgICBbc3R5bGVdPVwieyB3aWR0aDogbW9kZWwucHJvZ3Jlc3MgfVwiXG4gICAgICByb2xlPVwicHJvZ3Jlc3NiYXJcIlxuICAgID48L2Rpdj5cbiAgPC9kaXY+XG4gIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwicHJvZ3Jlc3NcIiAqbmdJZj1cIm1vZGVsLnNob3dMZWdhY3lOYXZpZ2F0aW9uICYmIG1vZGVsLmlzUHJvZ3Jlc3NUb3BTaG93aW5nXCI+PC9uZy1jb250YWluZXI+XG4gIDwhLS0gYWRkIHRyYWNrIGJ5IFtrZXldPVwicGFuZWwuaWRcIiAtLT5cbiAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgcGFuZWwgb2YgcmVuZGVyZWRQYW5lbHM7IGluZGV4IGFzIGluZGV4XCI+IFxuICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmdldFBhbmVsV3JhcHBlckNzcyhwYW5lbClcIj5cbiAgICAgIDxuZy10ZW1wbGF0ZSBbY29tcG9uZW50XT1cInsgbmFtZTogZ2V0UGFuZWxDb21wb25lbnROYW1lKHBhbmVsKSwgZGF0YTogZ2V0UGFuZWxDb21wb25lbnREYXRhKHBhbmVsKSB9XCI+PC9uZy10ZW1wbGF0ZT5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJtb2RlbC5wYW5lbFJlbW92ZUJ1dHRvbkxvY2F0aW9uID09PSdyaWdodCcgJiYgbW9kZWwuY2FuUmVtb3ZlUGFuZWwgJiYgcGFuZWwuc3RhdGUgIT0gJ2NvbGxhcHNlZCdcIj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtcGFuZWxkeW5hbWljLXJlbW92ZS1idG4nLCBkYXRhOiB7IGRhdGE6IHsgcGFuZWwsIHF1ZXN0aW9uOiBtb2RlbCB9fX1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgPC9kaXY+XG4gICAgPCEtLSBhZGQgdHJhY2sgYnkgW2tleV09XCInc2VwYXJhdG9yJyArIHBhbmVsLmlkXCIgLS0+XG4gICAgPGhyIFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnNlcGFyYXRvclwiICpuZ0lmPVwibW9kZWwuc2hvd1NlcGFyYXRvcihpbmRleClcIi8+XG4gIDwvbmctY29udGFpbmVyPlxuICA8bmctY29udGFpbmVyIFtuZ1RlbXBsYXRlT3V0bGV0XT1cInByb2dyZXNzXCIgKm5nSWY9XCJtb2RlbC5zaG93TGVnYWN5TmF2aWdhdGlvbiAmJiBtb2RlbC5pc1Byb2dyZXNzQm90dG9tU2hvd2luZ1wiPjwvbmctY29udGFpbmVyPlxuICA8c3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4gKm5nSWY9XCJtb2RlbC5zaG93TGVnYWN5TmF2aWdhdGlvbiAmJiBtb2RlbC5pc1JlbmRlck1vZGVMaXN0XCIgW2RhdGFdPVwieyBxdWVzdGlvbjogbW9kZWwgfVwiPjwvc3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4+XG4gIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwicHJvZ3Jlc3NWMlwiICpuZ0lmPVwibW9kZWwuc2hvd05hdmlnYXRpb25cIj48L25nLWNvbnRhaW5lcj5cbjwvZGl2PlxuXG48bmctdGVtcGxhdGUgI3Byb2dyZXNzVjI+XG4gIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMuZm9vdGVyXCIgKm5nSWY9XCIhIW1vZGVsLmNzc0NsYXNzZXMuZm9vdGVyXCI+XG4gICAgPGhyIFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnNlcGFyYXRvclwiLz5cbiAgICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnByb2dyZXNzXCIgKm5nSWY9XCJtb2RlbC5pc1JhbmdlU2hvd2luZyAmJiBtb2RlbC5pc1Byb2dyZXNzQm90dG9tU2hvd2luZ1wiPlxuICAgICAgPGRpdlxuICAgICAgICBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0JhclwiXG4gICAgICAgIFtzdHlsZV09XCJ7IHdpZHRoOiBtb2RlbC5wcm9ncmVzcyB9XCJcbiAgICAgICAgcm9sZT1cInByb2dyZXNzYmFyXCJcbiAgICAgID48L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuZm9vdGVyVG9vbGJhci52aXNpYmxlQWN0aW9ucy5sZW5ndGhcIiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5mb290ZXJCdXR0b25zQ29udGFpbmVyXCI+XG4gICAgICA8c3YtbmctYWN0aW9uLWJhciBbbW9kZWxdPVwibW9kZWwuZm9vdGVyVG9vbGJhclwiPjwvc3YtbmctYWN0aW9uLWJhcj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L25nLXRlbXBsYXRlPlxuPG5nLXRlbXBsYXRlICNwcm9ncmVzcz5cbiAgPGRpdiBbY2xhc3NdPVwidGhpcy5wcm9ncmVzc0Nzc0NsYXNzXCI+XG4gICAgPGRpdiBzdHlsZT1cImNsZWFyOiBib3RoXCIgW2NsYXNzXT1cInRoaXMucHJvZ3Jlc3NDc3NDbGFzc1wiPlxuICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0NvbnRhaW5lclwiPlxuICAgICAgICA8c3YtbmctcGFuZWxkeW5hbWljLXByZXYtYnRuIFtkYXRhXT1cInsgcXVlc3Rpb246IG1vZGVsIH1cIj48L3N2LW5nLXBhbmVsZHluYW1pYy1wcmV2LWJ0bj5cbiAgICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc1wiICpuZ0lmPVwibW9kZWwuaXNSYW5nZVNob3dpbmdcIj5cbiAgICAgICAgICA8ZGl2XG4gICAgICAgICAgICBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0JhclwiXG4gICAgICAgICAgICBbc3R5bGVdPVwieyB3aWR0aDogbW9kZWwucHJvZ3Jlc3MgfVwiXG4gICAgICAgICAgICByb2xlPVwicHJvZ3Jlc3NiYXJcIlxuICAgICAgICAgID48L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPHN2LW5nLXBhbmVsZHluYW1pYy1uZXh0LWJ0biBbZGF0YV09XCJ7IHF1ZXN0aW9uOiBtb2RlbCB9XCI+PC9zdi1uZy1wYW5lbGR5bmFtaWMtbmV4dC1idG4+XG4gICAgICA8L2Rpdj5cbiAgICAgIDxzdi1uZy1wYW5lbGR5bmFtaWMtYWRkLWJ0biBbZGF0YV09XCJ7IHF1ZXN0aW9uOiBtb2RlbCB9XCI+PC9zdi1uZy1wYW5lbGR5bmFtaWMtYWRkLWJ0bj5cbiAgICAgIDxzdi1uZy1wYW5lbGR5bmFtaWMtcHJvZ3Jlc3MtdGV4dCBbZGF0YV09XCJ7IHF1ZXN0aW9uOiBtb2RlbCB9XCI+PC9zdi1uZy1wYW5lbGR5bmFtaWMtcHJvZ3Jlc3MtdGV4dD5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L25nLXRlbXBsYXRlPiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicGFuZWxkeW5hbWljLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcGFuZWxkeW5hbWljLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcGFuZWxkeW5hbWljLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7Ozs7OztBQU0vRCxNQUFNLE9BQU8sNkJBQThCLFNBQVEsZUFBZ0Q7SUFDMUYsWUFBWSxDQUFDLENBQVMsRUFBRSxLQUFpQjtRQUM5QyxPQUFPLEtBQUssQ0FBQyxFQUFFLENBQUM7SUFDbEIsQ0FBQztJQUNrQixjQUFjO1FBQy9CLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN2QixJQUFJLENBQUMsS0FBSyxDQUFDLHlCQUF5QixHQUFHLEdBQUcsRUFBRTtZQUMxQyxJQUFJLENBQUMsTUFBTSxFQUFFLENBQUM7UUFDaEIsQ0FBQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLEtBQUssQ0FBQywyQkFBMkIsR0FBRyxHQUFHLEVBQUU7WUFDNUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFBO1FBQ2YsQ0FBQyxDQUFDO1FBQ0YsSUFBSSxDQUFDLEtBQUssQ0FBQyx5QkFBeUIsR0FBRyxHQUFHLEVBQUU7WUFDMUMsSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDO1FBQ2hCLENBQUMsQ0FBQztJQUNKLENBQUM7SUFDRCxJQUFJLGdCQUFnQjtRQUNsQixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUMsb0JBQW9CO1lBQ3BDLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFVBQVUsQ0FBQyxXQUFXO1lBQ25DLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLFVBQVUsQ0FBQyxjQUFjLENBQUM7SUFDM0MsQ0FBQztJQUNRLFdBQVc7UUFDbEIsSUFBSSxDQUFDLEtBQUssQ0FBQyx5QkFBeUIsR0FBRyxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDaEQsSUFBSSxDQUFDLEtBQUssQ0FBQywyQkFBMkIsR0FBRyxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDbEQsSUFBSSxDQUFDLEtBQUssQ0FBQyx5QkFBeUIsR0FBRyxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7UUFDaEQsS0FBSyxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3RCLENBQUM7SUFDTSxxQkFBcUIsQ0FBQyxLQUFpQjtRQUM1QyxNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsV0FBMEIsQ0FBQztRQUMvQyxJQUFHLENBQUMsQ0FBQyxNQUFNLEVBQUU7WUFDWCxNQUFNLElBQUksR0FBRyxNQUFNLENBQUMsOEJBQThCLENBQUMsS0FBSyxDQUFDLENBQUM7WUFDMUQsSUFBRyxDQUFDLENBQUMsSUFBSSxFQUFFO2dCQUNULE9BQU8sSUFBSSxDQUFDO2FBQ2I7U0FDRjtRQUNELE9BQU8sT0FBTyxDQUFDO0lBQ2pCLENBQUM7SUFDTSxxQkFBcUIsQ0FBQyxLQUFpQjtRQUM1QyxNQUFNLE1BQU0sR0FBRyxJQUFJLENBQUMsV0FBMEIsQ0FBQztRQUMvQyxJQUFJLElBQVMsQ0FBQztRQUNkLElBQUcsQ0FBQyxDQUFDLE1BQU0sRUFBRTtZQUNYLElBQUksR0FBRyxNQUFNLENBQUMsOEJBQThCLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDckQ7UUFDRCxPQUFPO1lBQ0wsYUFBYSxFQUFFLE9BQU87WUFDdEIsYUFBYSxFQUFFO2dCQUNiLEtBQUssRUFBRSxLQUFLO2dCQUNaLElBQUksRUFBRSxJQUFJO2FBQ1g7U0FDRixDQUFDO0lBQ0osQ0FBQzs7MkhBbERVLDZCQUE2QjsrR0FBN0IsNkJBQTZCLDBGQ1QxQyxpNkdBeURjOzRGRGhERCw2QkFBNkI7a0JBSnpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLDZCQUE2QjtvQkFDdkMsV0FBVyxFQUFFLCtCQUErQjtpQkFDN0M7O0FBc0RELHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyx1QkFBdUIsRUFBRSw2QkFBNkIsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgUXVlc3Rpb25Bbmd1bGFyIH0gZnJvbSBcIi4uL3F1ZXN0aW9uXCI7XG5pbXBvcnQgeyBQYW5lbE1vZGVsLCBRdWVzdGlvblBhbmVsRHluYW1pY01vZGVsLCBTdXJ2ZXlNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi4vY29tcG9uZW50LWZhY3RvcnlcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInN2LW5nLXBhbmVsZHluYW1pYy1xdWVzdGlvblwiLFxuICB0ZW1wbGF0ZVVybDogXCIuL3BhbmVsZHluYW1pYy5jb21wb25lbnQuaHRtbFwiXG59KVxuZXhwb3J0IGNsYXNzIFBhbmVsRHluYW1pY1F1ZXN0aW9uQ29tcG9uZW50IGV4dGVuZHMgUXVlc3Rpb25Bbmd1bGFyPFF1ZXN0aW9uUGFuZWxEeW5hbWljTW9kZWwgfCBhbnk+IGltcGxlbWVudHMgT25Jbml0IHtcbiAgcHVibGljIHRyYWNrUGFuZWxCeShfOiBudW1iZXIsIHBhbmVsOiBQYW5lbE1vZGVsKSB7XG4gICAgcmV0dXJuIHBhbmVsLmlkO1xuICB9XG4gIHByb3RlY3RlZCBvdmVycmlkZSBvbk1vZGVsQ2hhbmdlZCgpOiB2b2lkIHtcbiAgICBzdXBlci5vbk1vZGVsQ2hhbmdlZCgpO1xuICAgIHRoaXMubW9kZWwucGFuZWxDb3VudENoYW5nZWRDYWxsYmFjayA9ICgpID0+IHtcbiAgICAgIHRoaXMudXBkYXRlKCk7XG4gICAgfTtcbiAgICB0aGlzLm1vZGVsLmN1cnJlbnRJbmRleENoYW5nZWRDYWxsYmFjayA9ICgpID0+IHtcbiAgICAgIHRoaXMudXBkYXRlKClcbiAgICB9O1xuICAgIHRoaXMubW9kZWwucmVuZGVyTW9kZUNoYW5nZWRDYWxsYmFjayA9ICgpID0+IHtcbiAgICAgIHRoaXMudXBkYXRlKCk7XG4gICAgfTtcbiAgfVxuICBnZXQgcHJvZ3Jlc3NDc3NDbGFzcygpIHtcbiAgICByZXR1cm4gdGhpcy5tb2RlbC5pc1Byb2dyZXNzVG9wU2hvd2luZ1xuICAgICAgPyB0aGlzLm1vZGVsLmNzc0NsYXNzZXMucHJvZ3Jlc3NUb3BcbiAgICAgIDogdGhpcy5tb2RlbC5jc3NDbGFzc2VzLnByb2dyZXNzQm90dG9tO1xuICB9XG4gIG92ZXJyaWRlIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMubW9kZWwucGFuZWxDb3VudENoYW5nZWRDYWxsYmFjayA9ICgpID0+IHt9O1xuICAgIHRoaXMubW9kZWwuY3VycmVudEluZGV4Q2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge307XG4gICAgdGhpcy5tb2RlbC5yZW5kZXJNb2RlQ2hhbmdlZENhbGxiYWNrID0gKCkgPT4ge307XG4gICAgc3VwZXIubmdPbkRlc3Ryb3koKTtcbiAgfVxuICBwdWJsaWMgZ2V0UGFuZWxDb21wb25lbnROYW1lKHBhbmVsOiBQYW5lbE1vZGVsKTogc3RyaW5nIHtcbiAgICBjb25zdCBzdXJ2ZXkgPSB0aGlzLnN1cnZleU1vZGVsIGFzIFN1cnZleU1vZGVsO1xuICAgIGlmKCEhc3VydmV5KSB7XG4gICAgICBjb25zdCBuYW1lID0gc3VydmV5LmdldEVsZW1lbnRXcmFwcGVyQ29tcG9uZW50TmFtZShwYW5lbCk7XG4gICAgICBpZighIW5hbWUpIHtcbiAgICAgICAgcmV0dXJuIG5hbWU7XG4gICAgICB9XG4gICAgfVxuICAgIHJldHVybiBcInBhbmVsXCI7XG4gIH1cbiAgcHVibGljIGdldFBhbmVsQ29tcG9uZW50RGF0YShwYW5lbDogUGFuZWxNb2RlbCk6IGFueSB7XG4gICAgY29uc3Qgc3VydmV5ID0gdGhpcy5zdXJ2ZXlNb2RlbCBhcyBTdXJ2ZXlNb2RlbDtcbiAgICBsZXQgZGF0YTogYW55O1xuICAgIGlmKCEhc3VydmV5KSB7XG4gICAgICBkYXRhID0gc3VydmV5LmdldEVsZW1lbnRXcmFwcGVyQ29tcG9uZW50RGF0YShwYW5lbCk7XG4gICAgfVxuICAgIHJldHVybiB7XG4gICAgICBjb21wb25lbnROYW1lOiBcInBhbmVsXCIsXG4gICAgICBjb21wb25lbnREYXRhOiB7XG4gICAgICAgIG1vZGVsOiBwYW5lbCxcbiAgICAgICAgZGF0YTogZGF0YVxuICAgICAgfVxuICAgIH07XG4gIH1cbn1cblxuQW5ndWxhckNvbXBvbmVudEZhY3RvcnkuSW5zdGFuY2UucmVnaXN0ZXJDb21wb25lbnQoXCJwYW5lbGR5bmFtaWMtcXVlc3Rpb25cIiwgUGFuZWxEeW5hbWljUXVlc3Rpb25Db21wb25lbnQpOyIsIjxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMucm9vdFwiICNjb250ZW50RWxlbWVudD5cbiAgPGRpdiAqbmdJZj1cIm1vZGVsLmdldFNob3dOb0VudHJpZXNQbGFjZWhvbGRlcigpXCIgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMubm9FbnRyaWVzUGxhY2Vob2xkZXJcIj5cbiAgICA8c3BhbiBbbW9kZWxdPVwibW9kZWwubG9jTm9FbnRyaWVzVGV4dFwiIHN2LW5nLXN0cmluZz48L3NwYW4+XG4gICAgPHN2LW5nLXBhbmVsZHluYW1pYy1hZGQtYnRuICpuZ0lmPVwibW9kZWwuY2FuQWRkUGFuZWxcIiBbZGF0YV09XCJ7IHF1ZXN0aW9uOiBtb2RlbCB9XCI+PC9zdi1uZy1wYW5lbGR5bmFtaWMtYWRkLWJ0bj5cbiAgPC9kaXY+XG4gIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMucHJvZ3Jlc3NcIlxuICAgICpuZ0lmPVwiIW1vZGVsLnNob3dMZWdhY3lOYXZpZ2F0aW9uICYmIG1vZGVsLmlzUHJvZ3Jlc3NUb3BTaG93aW5nICYmIG1vZGVsLmlzUmFuZ2VTaG93aW5nXCI+XG4gICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0JhclwiIFtzdHlsZV09XCJ7IHdpZHRoOiBtb2RlbC5wcm9ncmVzcyB9XCIgcm9sZT1cInByb2dyZXNzYmFyXCI+PC9kaXY+XG4gIDwvZGl2PlxuICA8bmctY29udGFpbmVyIFtuZ1RlbXBsYXRlT3V0bGV0XT1cInByb2dyZXNzXCJcbiAgICAqbmdJZj1cIm1vZGVsLnNob3dMZWdhY3lOYXZpZ2F0aW9uICYmIG1vZGVsLmlzUHJvZ3Jlc3NUb3BTaG93aW5nXCI+PC9uZy1jb250YWluZXI+XG4gIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMucGFuZWxzQ29udGFpbmVyXCI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgcGFuZWwgb2YgbW9kZWwucmVuZGVyZWRQYW5lbHM7IGluZGV4IGFzIGluZGV4OyB0cmFja0J5OiB0cmFja1BhbmVsQnlcIj5cbiAgICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmdldFBhbmVsV3JhcHBlckNzcyhwYW5lbClcIj5cbiAgICAgICAgPG5nLXRlbXBsYXRlXG4gICAgICAgICAgW2NvbXBvbmVudF09XCJ7IG5hbWU6IGdldFBhbmVsQ29tcG9uZW50TmFtZShwYW5lbCksIGRhdGE6IGdldFBhbmVsQ29tcG9uZW50RGF0YShwYW5lbCkgfVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgIDxuZy1jb250YWluZXJcbiAgICAgICAgICAqbmdJZj1cIm1vZGVsLnBhbmVsUmVtb3ZlQnV0dG9uTG9jYXRpb24gPT09J3JpZ2h0JyAmJiBtb2RlbC5jYW5SZW1vdmVQYW5lbCAmJiBwYW5lbC5zdGF0ZSAhPSAnY29sbGFwc2VkJ1wiPlxuICAgICAgICAgIDxuZy10ZW1wbGF0ZVxuICAgICAgICAgICAgW2NvbXBvbmVudF09XCJ7IG5hbWU6ICdzdi1wYW5lbGR5bmFtaWMtcmVtb3ZlLWJ0bicsIGRhdGE6IHsgZGF0YTogeyBwYW5lbCwgcXVlc3Rpb246IG1vZGVsIH19fVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgPC9kaXY+XG4gICAgICA8aHIgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMuc2VwYXJhdG9yXCIgKm5nSWY9XCJtb2RlbC5zaG93U2VwYXJhdG9yKGluZGV4KVwiIC8+XG4gICAgPC9uZy1jb250YWluZXI+XG4gIDwvZGl2PlxuICA8bmctY29udGFpbmVyIFtuZ1RlbXBsYXRlT3V0bGV0XT1cInByb2dyZXNzXCJcbiAgICAqbmdJZj1cIm1vZGVsLnNob3dMZWdhY3lOYXZpZ2F0aW9uICYmIG1vZGVsLmlzUHJvZ3Jlc3NCb3R0b21TaG93aW5nXCI+PC9uZy1jb250YWluZXI+XG4gIDxzdi1uZy1wYW5lbGR5bmFtaWMtYWRkLWJ0biAqbmdJZj1cIm1vZGVsLnNob3dMZWdhY3lOYXZpZ2F0aW9uICYmIG1vZGVsLmlzUmVuZGVyTW9kZUxpc3RcIlxuICAgIFtkYXRhXT1cInsgcXVlc3Rpb246IG1vZGVsIH1cIj48L3N2LW5nLXBhbmVsZHluYW1pYy1hZGQtYnRuPlxuICA8bmctY29udGFpbmVyIFtuZ1RlbXBsYXRlT3V0bGV0XT1cInByb2dyZXNzVjJcIiAqbmdJZj1cIm1vZGVsLnNob3dOYXZpZ2F0aW9uXCI+PC9uZy1jb250YWluZXI+XG48L2Rpdj5cblxuPG5nLXRlbXBsYXRlICNwcm9ncmVzc1YyPlxuICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmZvb3RlclwiICpuZ0lmPVwiISFtb2RlbC5jc3NDbGFzc2VzLmZvb3RlclwiPlxuICAgIDxociBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5zZXBhcmF0b3JcIiAvPlxuICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMucHJvZ3Jlc3NcIiAqbmdJZj1cIm1vZGVsLmlzUmFuZ2VTaG93aW5nICYmIG1vZGVsLmlzUHJvZ3Jlc3NCb3R0b21TaG93aW5nXCI+XG4gICAgICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnByb2dyZXNzQmFyXCIgW3N0eWxlXT1cInsgd2lkdGg6IG1vZGVsLnByb2dyZXNzIH1cIiByb2xlPVwicHJvZ3Jlc3NiYXJcIj48L2Rpdj5cbiAgICA8L2Rpdj5cbiAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuZm9vdGVyVG9vbGJhci52aXNpYmxlQWN0aW9ucy5sZW5ndGhcIiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5mb290ZXJCdXR0b25zQ29udGFpbmVyXCI+XG4gICAgICA8c3YtbmctYWN0aW9uLWJhciBbbW9kZWxdPVwibW9kZWwuZm9vdGVyVG9vbGJhclwiPjwvc3YtbmctYWN0aW9uLWJhcj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L25nLXRlbXBsYXRlPlxuPG5nLXRlbXBsYXRlICNwcm9ncmVzcz5cbiAgPGRpdiBbY2xhc3NdPVwidGhpcy5wcm9ncmVzc0Nzc0NsYXNzXCI+XG4gICAgPGRpdiBzdHlsZT1cImNsZWFyOiBib3RoXCIgW2NsYXNzXT1cInRoaXMucHJvZ3Jlc3NDc3NDbGFzc1wiPlxuICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc0NvbnRhaW5lclwiPlxuICAgICAgICA8c3YtbmctcGFuZWxkeW5hbWljLXByZXYtYnRuIFtkYXRhXT1cInsgcXVlc3Rpb246IG1vZGVsIH1cIj48L3N2LW5nLXBhbmVsZHluYW1pYy1wcmV2LWJ0bj5cbiAgICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wcm9ncmVzc1wiICpuZ0lmPVwibW9kZWwuaXNSYW5nZVNob3dpbmdcIj5cbiAgICAgICAgICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLnByb2dyZXNzQmFyXCIgW3N0eWxlXT1cInsgd2lkdGg6IG1vZGVsLnByb2dyZXNzIH1cIiByb2xlPVwicHJvZ3Jlc3NiYXJcIj48L2Rpdj5cbiAgICAgICAgPC9kaXY+XG4gICAgICAgIDxzdi1uZy1wYW5lbGR5bmFtaWMtbmV4dC1idG4gW2RhdGFdPVwieyBxdWVzdGlvbjogbW9kZWwgfVwiPjwvc3YtbmctcGFuZWxkeW5hbWljLW5leHQtYnRuPlxuICAgICAgPC9kaXY+XG4gICAgICA8c3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4gW2RhdGFdPVwieyBxdWVzdGlvbjogbW9kZWwgfVwiPjwvc3YtbmctcGFuZWxkeW5hbWljLWFkZC1idG4+XG4gICAgICA8c3YtbmctcGFuZWxkeW5hbWljLXByb2dyZXNzLXRleHQgW2RhdGFdPVwieyBxdWVzdGlvbjogbW9kZWwgfVwiPjwvc3YtbmctcGFuZWxkeW5hbWljLXByb2dyZXNzLXRleHQ+XG4gICAgPC9kaXY+XG4gIDwvZGl2PlxuPC9uZy10ZW1wbGF0ZT4iXX0=

package/esm2015/questions/ranking-item.component.js

@@ -10,7 +10,7 @@ export class RankingItemComponent extends BaseAngular {
     }
 }
 RankingItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RankingItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-RankingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RankingItemComponent, selector: "sv-ng-ranking-item", inputs: { question: "question", model: "model", index: "index", unrankedItem: "unrankedItem" }, usesInheritance: true, ngImport: i0, template: "\n\n\n<div [attr.tabindex]=\"question.getItemTabIndex(model)\" [attr.data-sv-drop-target-ranking-item]=\"index\" \n    [class]=\"question.getItemClass(model)\"\n    (keydown)=\"question.handleKeydown($event, model)\"\n    (pointerdown)=\"question.handlePointerDown($event, model, $any($event.currentTarget))\">\n  <div tabindex=\"-1\" style=\"outline: none;\">\n    <div [class]=\"question.cssClasses.itemGhostNode\"></div>\n    <div [class]=\"question.cssClasses.itemContent\">\n      <div [class]=\"question.cssClasses.itemIconContainer\">\n        <svg [class]=\"question.getIconHoverCss()\">\n          <use [attr.xlink:href]=\"question.dragDropSvgIcon\"></use>\n        </svg> \n        <svg [class]=\"question.getIconFocusCss()\">\n          <use [attr.xlink:href]=\"question.arrowsSvgIcon\"></use>\n        </svg> \n      </div>\n\n      <div *ngIf=\"!unrankedItem && question.getNumberByIndex(index); else elseBlock\" [class]=\"question.getItemIndexClasses(model)\">{{ question.getNumberByIndex(index) }}</div>\n      <ng-template #elseBlock><div [class]=\"question.getItemIndexClasses(model)\">\n        <svg>\n          <use [attr.xlink:href]=\"question.dashSvgIcon\"></use>\n        </svg> \n      </div></ng-template>\n      <div [class]=\"question.cssClasses.controlLabel\">\n        <sv-ng-string [model]=\"model.locText\"></sv-ng-string>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+RankingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RankingItemComponent, selector: "sv-ng-ranking-item", inputs: { question: "question", model: "model", index: "index", unrankedItem: "unrankedItem" }, usesInheritance: true, ngImport: i0, template: "\n\n\n<div [attr.tabindex]=\"question.getItemTabIndex(model)\" [attr.data-sv-drop-target-ranking-item]=\"index\" \n    [class]=\"question.getItemClass(model)\"\n    (keydown)=\"question.handleKeydown($event, model)\"\n    (pointerdown)=\"question.handlePointerDown($event, model, $any($event.currentTarget))\"\n    (pointerup)=\"question.handlePointerUp($event, model, $any($event.currentTarget))\">\n  <div tabindex=\"-1\" style=\"outline: none;\">\n    <div [class]=\"question.cssClasses.itemGhostNode\"></div>\n    <div [class]=\"question.cssClasses.itemContent\">\n      <div [class]=\"question.cssClasses.itemIconContainer\">\n        <svg [class]=\"question.getIconHoverCss()\">\n          <use [attr.xlink:href]=\"question.dragDropSvgIcon\"></use>\n        </svg> \n        <svg [class]=\"question.getIconFocusCss()\">\n          <use [attr.xlink:href]=\"question.arrowsSvgIcon\"></use>\n        </svg> \n      </div>\n\n      <div *ngIf=\"!unrankedItem && question.getNumberByIndex(index); else elseBlock\" [class]=\"question.getItemIndexClasses(model)\">{{ question.getNumberByIndex(index) }}</div>\n      <ng-template #elseBlock><div [class]=\"question.getItemIndexClasses(model)\">\n        <svg>\n          <use [attr.xlink:href]=\"question.dashSvgIcon\"></use>\n        </svg> \n      </div></ng-template>\n      <div [class]=\"question.cssClasses.controlLabel\">\n        <sv-ng-string [model]=\"model.locText\"></sv-ng-string>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RankingItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -27,4 +27,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 AngularComponentFactory.Instance.registerComponent("sv-ng-ranking-item", RankingItemComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmFua2luZy1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcmFua2luZy1pdGVtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcmFua2luZy1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7OztBQU0vRCxNQUFNLE9BQU8sb0JBQXFCLFNBQVEsV0FBc0I7SUFLcEQsUUFBUTtRQUNoQixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDcEIsQ0FBQzs7a0hBUFUsb0JBQW9CO3NHQUFwQixvQkFBb0IsaUxDVGpDLHMzQ0E4Qk07NEZEckJPLG9CQUFvQjtrQkFKaEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixXQUFXLEVBQUUsK0JBQStCO2lCQUM3Qzs4QkFFVSxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSzs7QUFLUix1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsb0JBQW9CLEVBQUUsb0JBQW9CLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQmFzZUFuZ3VsYXIgfSBmcm9tIFwiLi4vYmFzZS1hbmd1bGFyXCI7XG5pbXBvcnQgeyBJdGVtVmFsdWUsIFF1ZXN0aW9uUmFua2luZ01vZGVsIH0gZnJvbSBcInN1cnZleS1jb3JlXCI7XG5pbXBvcnQgeyBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeSB9IGZyb20gXCIuLi9jb21wb25lbnQtZmFjdG9yeVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3YtbmctcmFua2luZy1pdGVtXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vcmFua2luZy1pdGVtLmNvbXBvbmVudC5odG1sXCJcbn0pXG5leHBvcnQgY2xhc3MgUmFua2luZ0l0ZW1Db21wb25lbnQgZXh0ZW5kcyBCYXNlQW5ndWxhcjxJdGVtVmFsdWU+IHtcbiAgQElucHV0KCkgcXVlc3Rpb24hOiBRdWVzdGlvblJhbmtpbmdNb2RlbDtcbiAgQElucHV0KCkgbW9kZWwhOiBJdGVtVmFsdWU7XG4gIEBJbnB1dCgpIGluZGV4ITogbnVtYmVyO1xuICBASW5wdXQoKSB1bnJhbmtlZEl0ZW0hOiBib29sZWFuO1xuICBwcm90ZWN0ZWQgZ2V0TW9kZWwoKTogSXRlbVZhbHVlIHtcbiAgICByZXR1cm4gdGhpcy5tb2RlbDtcbiAgfVxufVxuQW5ndWxhckNvbXBvbmVudEZhY3RvcnkuSW5zdGFuY2UucmVnaXN0ZXJDb21wb25lbnQoXCJzdi1uZy1yYW5raW5nLWl0ZW1cIiwgUmFua2luZ0l0ZW1Db21wb25lbnQpOyIsIlxuXG5cbjxkaXYgW2F0dHIudGFiaW5kZXhdPVwicXVlc3Rpb24uZ2V0SXRlbVRhYkluZGV4KG1vZGVsKVwiIFthdHRyLmRhdGEtc3YtZHJvcC10YXJnZXQtcmFua2luZy1pdGVtXT1cImluZGV4XCIgXG4gICAgW2NsYXNzXT1cInF1ZXN0aW9uLmdldEl0ZW1DbGFzcyhtb2RlbClcIlxuICAgIChrZXlkb3duKT1cInF1ZXN0aW9uLmhhbmRsZUtleWRvd24oJGV2ZW50LCBtb2RlbClcIlxuICAgIChwb2ludGVyZG93bik9XCJxdWVzdGlvbi5oYW5kbGVQb2ludGVyRG93bigkZXZlbnQsIG1vZGVsLCAkYW55KCRldmVudC5jdXJyZW50VGFyZ2V0KSlcIj5cbiAgPGRpdiB0YWJpbmRleD1cIi0xXCIgc3R5bGU9XCJvdXRsaW5lOiBub25lO1wiPlxuICAgIDxkaXYgW2NsYXNzXT1cInF1ZXN0aW9uLmNzc0NsYXNzZXMuaXRlbUdob3N0Tm9kZVwiPjwvZGl2PlxuICAgIDxkaXYgW2NsYXNzXT1cInF1ZXN0aW9uLmNzc0NsYXNzZXMuaXRlbUNvbnRlbnRcIj5cbiAgICAgIDxkaXYgW2NsYXNzXT1cInF1ZXN0aW9uLmNzc0NsYXNzZXMuaXRlbUljb25Db250YWluZXJcIj5cbiAgICAgICAgPHN2ZyBbY2xhc3NdPVwicXVlc3Rpb24uZ2V0SWNvbkhvdmVyQ3NzKClcIj5cbiAgICAgICAgICA8dXNlIFthdHRyLnhsaW5rOmhyZWZdPVwicXVlc3Rpb24uZHJhZ0Ryb3BTdmdJY29uXCI+PC91c2U+XG4gICAgICAgIDwvc3ZnPiBcbiAgICAgICAgPHN2ZyBbY2xhc3NdPVwicXVlc3Rpb24uZ2V0SWNvbkZvY3VzQ3NzKClcIj5cbiAgICAgICAgICA8dXNlIFthdHRyLnhsaW5rOmhyZWZdPVwicXVlc3Rpb24uYXJyb3dzU3ZnSWNvblwiPjwvdXNlPlxuICAgICAgICA8L3N2Zz4gXG4gICAgICA8L2Rpdj5cblxuICAgICAgPGRpdiAqbmdJZj1cIiF1bnJhbmtlZEl0ZW0gJiYgcXVlc3Rpb24uZ2V0TnVtYmVyQnlJbmRleChpbmRleCk7IGVsc2UgZWxzZUJsb2NrXCIgW2NsYXNzXT1cInF1ZXN0aW9uLmdldEl0ZW1JbmRleENsYXNzZXMobW9kZWwpXCI+e3sgcXVlc3Rpb24uZ2V0TnVtYmVyQnlJbmRleChpbmRleCkgfX08L2Rpdj5cbiAgICAgIDxuZy10ZW1wbGF0ZSAjZWxzZUJsb2NrPjxkaXYgW2NsYXNzXT1cInF1ZXN0aW9uLmdldEl0ZW1JbmRleENsYXNzZXMobW9kZWwpXCI+XG4gICAgICAgIDxzdmc+XG4gICAgICAgICAgPHVzZSBbYXR0ci54bGluazpocmVmXT1cInF1ZXN0aW9uLmRhc2hTdmdJY29uXCI+PC91c2U+XG4gICAgICAgIDwvc3ZnPiBcbiAgICAgIDwvZGl2PjwvbmctdGVtcGxhdGU+XG4gICAgICA8ZGl2IFtjbGFzc109XCJxdWVzdGlvbi5jc3NDbGFzc2VzLmNvbnRyb2xMYWJlbFwiPlxuICAgICAgICA8c3Ytbmctc3RyaW5nIFttb2RlbF09XCJtb2RlbC5sb2NUZXh0XCI+PC9zdi1uZy1zdHJpbmc+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Rpdj5cbiAgPC9kaXY+XG48L2Rpdj4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicmFua2luZy1pdGVtLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcmFua2luZy1pdGVtLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvcmFua2luZy1pdGVtLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2pELE9BQU8sRUFBRSxXQUFXLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7OztBQU0vRCxNQUFNLE9BQU8sb0JBQXFCLFNBQVEsV0FBc0I7SUFLcEQsUUFBUTtRQUNoQixPQUFPLElBQUksQ0FBQyxLQUFLLENBQUM7SUFDcEIsQ0FBQzs7a0hBUFUsb0JBQW9CO3NHQUFwQixvQkFBb0IsaUxDVGpDLCs4Q0ErQk07NEZEdEJPLG9CQUFvQjtrQkFKaEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsb0JBQW9CO29CQUM5QixXQUFXLEVBQUUsK0JBQStCO2lCQUM3Qzs4QkFFVSxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csWUFBWTtzQkFBcEIsS0FBSzs7QUFLUix1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsb0JBQW9CLEVBQUUsb0JBQW9CLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgQmFzZUFuZ3VsYXIgfSBmcm9tIFwiLi4vYmFzZS1hbmd1bGFyXCI7XG5pbXBvcnQgeyBJdGVtVmFsdWUsIFF1ZXN0aW9uUmFua2luZ01vZGVsIH0gZnJvbSBcInN1cnZleS1jb3JlXCI7XG5pbXBvcnQgeyBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeSB9IGZyb20gXCIuLi9jb21wb25lbnQtZmFjdG9yeVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3YtbmctcmFua2luZy1pdGVtXCIsXG4gIHRlbXBsYXRlVXJsOiBcIi4vcmFua2luZy1pdGVtLmNvbXBvbmVudC5odG1sXCJcbn0pXG5leHBvcnQgY2xhc3MgUmFua2luZ0l0ZW1Db21wb25lbnQgZXh0ZW5kcyBCYXNlQW5ndWxhcjxJdGVtVmFsdWU+IHtcbiAgQElucHV0KCkgcXVlc3Rpb24hOiBRdWVzdGlvblJhbmtpbmdNb2RlbDtcbiAgQElucHV0KCkgbW9kZWwhOiBJdGVtVmFsdWU7XG4gIEBJbnB1dCgpIGluZGV4ITogbnVtYmVyO1xuICBASW5wdXQoKSB1bnJhbmtlZEl0ZW0hOiBib29sZWFuO1xuICBwcm90ZWN0ZWQgZ2V0TW9kZWwoKTogSXRlbVZhbHVlIHtcbiAgICByZXR1cm4gdGhpcy5tb2RlbDtcbiAgfVxufVxuQW5ndWxhckNvbXBvbmVudEZhY3RvcnkuSW5zdGFuY2UucmVnaXN0ZXJDb21wb25lbnQoXCJzdi1uZy1yYW5raW5nLWl0ZW1cIiwgUmFua2luZ0l0ZW1Db21wb25lbnQpOyIsIlxuXG5cbjxkaXYgW2F0dHIudGFiaW5kZXhdPVwicXVlc3Rpb24uZ2V0SXRlbVRhYkluZGV4KG1vZGVsKVwiIFthdHRyLmRhdGEtc3YtZHJvcC10YXJnZXQtcmFua2luZy1pdGVtXT1cImluZGV4XCIgXG4gICAgW2NsYXNzXT1cInF1ZXN0aW9uLmdldEl0ZW1DbGFzcyhtb2RlbClcIlxuICAgIChrZXlkb3duKT1cInF1ZXN0aW9uLmhhbmRsZUtleWRvd24oJGV2ZW50LCBtb2RlbClcIlxuICAgIChwb2ludGVyZG93bik9XCJxdWVzdGlvbi5oYW5kbGVQb2ludGVyRG93bigkZXZlbnQsIG1vZGVsLCAkYW55KCRldmVudC5jdXJyZW50VGFyZ2V0KSlcIlxuICAgIChwb2ludGVydXApPVwicXVlc3Rpb24uaGFuZGxlUG9pbnRlclVwKCRldmVudCwgbW9kZWwsICRhbnkoJGV2ZW50LmN1cnJlbnRUYXJnZXQpKVwiPlxuICA8ZGl2IHRhYmluZGV4PVwiLTFcIiBzdHlsZT1cIm91dGxpbmU6IG5vbmU7XCI+XG4gICAgPGRpdiBbY2xhc3NdPVwicXVlc3Rpb24uY3NzQ2xhc3Nlcy5pdGVtR2hvc3ROb2RlXCI+PC9kaXY+XG4gICAgPGRpdiBbY2xhc3NdPVwicXVlc3Rpb24uY3NzQ2xhc3Nlcy5pdGVtQ29udGVudFwiPlxuICAgICAgPGRpdiBbY2xhc3NdPVwicXVlc3Rpb24uY3NzQ2xhc3Nlcy5pdGVtSWNvbkNvbnRhaW5lclwiPlxuICAgICAgICA8c3ZnIFtjbGFzc109XCJxdWVzdGlvbi5nZXRJY29uSG92ZXJDc3MoKVwiPlxuICAgICAgICAgIDx1c2UgW2F0dHIueGxpbms6aHJlZl09XCJxdWVzdGlvbi5kcmFnRHJvcFN2Z0ljb25cIj48L3VzZT5cbiAgICAgICAgPC9zdmc+IFxuICAgICAgICA8c3ZnIFtjbGFzc109XCJxdWVzdGlvbi5nZXRJY29uRm9jdXNDc3MoKVwiPlxuICAgICAgICAgIDx1c2UgW2F0dHIueGxpbms6aHJlZl09XCJxdWVzdGlvbi5hcnJvd3NTdmdJY29uXCI+PC91c2U+XG4gICAgICAgIDwvc3ZnPiBcbiAgICAgIDwvZGl2PlxuXG4gICAgICA8ZGl2ICpuZ0lmPVwiIXVucmFua2VkSXRlbSAmJiBxdWVzdGlvbi5nZXROdW1iZXJCeUluZGV4KGluZGV4KTsgZWxzZSBlbHNlQmxvY2tcIiBbY2xhc3NdPVwicXVlc3Rpb24uZ2V0SXRlbUluZGV4Q2xhc3Nlcyhtb2RlbClcIj57eyBxdWVzdGlvbi5nZXROdW1iZXJCeUluZGV4KGluZGV4KSB9fTwvZGl2PlxuICAgICAgPG5nLXRlbXBsYXRlICNlbHNlQmxvY2s+PGRpdiBbY2xhc3NdPVwicXVlc3Rpb24uZ2V0SXRlbUluZGV4Q2xhc3Nlcyhtb2RlbClcIj5cbiAgICAgICAgPHN2Zz5cbiAgICAgICAgICA8dXNlIFthdHRyLnhsaW5rOmhyZWZdPVwicXVlc3Rpb24uZGFzaFN2Z0ljb25cIj48L3VzZT5cbiAgICAgICAgPC9zdmc+IFxuICAgICAgPC9kaXY+PC9uZy10ZW1wbGF0ZT5cbiAgICAgIDxkaXYgW2NsYXNzXT1cInF1ZXN0aW9uLmNzc0NsYXNzZXMuY29udHJvbExhYmVsXCI+XG4gICAgICAgIDxzdi1uZy1zdHJpbmcgW21vZGVsXT1cIm1vZGVsLmxvY1RleHRcIj48L3N2LW5nLXN0cmluZz5cbiAgICAgIDwvZGl2PlxuICAgIDwvZGl2PlxuICA8L2Rpdj5cbjwvZGl2PiJdfQ==

package/esm2015/questions/signature.component.js

@@ -10,7 +10,7 @@ import * as i5 from "@angular/common";
 export class SignaturePadQuestionComponent extends QuestionAngular {
 }
 SignaturePadQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SignaturePadQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-SignaturePadQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: SignaturePadQuestionComponent, selector: "sv-ng-signature-component", usesInheritance: true, ngImport: i0, template: "<div\n[class]=\"model.cssClasses.root\"\n[style.width]=\"model.renderedCanvasWidth\" #contentElement>\n<div [class]=\"model.cssClasses.placeholder\" [visible]=\"model.needShowPlaceholder()\" [model]=\"$any(model).locPlaceholder\" sv-ng-string></div>\n<div>\n  <img *ngIf=\"!!model.backgroundImage\" [src]=\"model.backgroundImage\" [style.width]=\"model.renderedCanvasWidth\" [class]=\"model.cssClasses.backgroundImage\">\n  <canvas tabindex=\"-1\" [class]=\"model.cssClasses.canvas\" (blur)=\"model.onBlur($event)\"></canvas>\n</div>\n<div [class]=\"model.cssClasses.controls\" *ngIf=\"model.canShowClearButton\">\n  <button\n    type=\"button\"\n    [class]=\"model.cssClasses.clearButton\"\n    [title]=\"model.clearButtonCaption\"\n    (click)=\"model.clearValue()\"\n  >\n    <span *ngIf=\"!model.cssClasses.clearButtonIconId\">\u2716</span>\n    <svg\n      *ngIf=\"model.cssClasses.clearButtonIconId\"\n      [iconName]=\"model.cssClasses.clearButtonIconId\"\n      [size]=\"'auto'\" sv-ng-svg-icon></svg>\n  </button>\n</div>\n<ng-container *ngIf=\"model.showLoadingIndicator\">\n  <div [class]=\"model.cssClasses.loadingIndicator\">\n    <sv-ng-loading-indicator></sv-ng-loading-indicator>\n  </div>\n</ng-container>\n</div>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: i2.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i3.LoadingIndicatorComponent, selector: "sv-ng-loading-indicator" }], directives: [{ type: i4.VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SignaturePadQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: SignaturePadQuestionComponent, selector: "sv-ng-signature-component", usesInheritance: true, ngImport: i0, template: "<div\n[class]=\"model.cssClasses.root\"\n[style.width]=\"model.renderedCanvasWidth\" #contentElement>\n<div [class]=\"model.cssClasses.placeholder\" [visible]=\"model.needShowPlaceholder()\" [model]=\"$any(model).locRenderedPlaceholder\" sv-ng-string></div>\n<div>\n  <img *ngIf=\"!!model.backgroundImage\" [src]=\"model.backgroundImage\" [style.width]=\"model.renderedCanvasWidth\" [class]=\"model.cssClasses.backgroundImage\">\n  <canvas tabindex=\"-1\" [class]=\"model.cssClasses.canvas\" (blur)=\"model.onBlur($event)\"></canvas>\n</div>\n<div [class]=\"model.cssClasses.controls\" *ngIf=\"model.canShowClearButton\">\n  <button\n    type=\"button\"\n    [class]=\"model.cssClasses.clearButton\"\n    [title]=\"model.clearButtonCaption\"\n    (click)=\"model.clearValue()\"\n  >\n    <span *ngIf=\"!model.cssClasses.clearButtonIconId\">\u2716</span>\n    <svg\n      *ngIf=\"model.cssClasses.clearButtonIconId\"\n      [iconName]=\"model.cssClasses.clearButtonIconId\"\n      [size]=\"'auto'\" sv-ng-svg-icon></svg>\n  </button>\n</div>\n<ng-container *ngIf=\"model.showLoadingIndicator\">\n  <div [class]=\"model.cssClasses.loadingIndicator\">\n    <sv-ng-loading-indicator></sv-ng-loading-indicator>\n  </div>\n</ng-container>\n</div>", components: [{ type: i1.SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: i2.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i3.LoadingIndicatorComponent, selector: "sv-ng-loading-indicator" }], directives: [{ type: i4.VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SignaturePadQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -19,4 +19,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 }]
         }] });
 AngularComponentFactory.Instance.registerComponent("signaturepad-question", SignaturePadQuestionComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lnbmF0dXJlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvc2lnbmF0dXJlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvc2lnbmF0dXJlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7OztBQU0vRCxNQUFNLE9BQU8sNkJBQThCLFNBQVEsZUFBMEM7OzJIQUFoRiw2QkFBNkI7K0dBQTdCLDZCQUE2Qix3RkNUMUMsa3RDQTJCTTs0RkRsQk8sNkJBQTZCO2tCQUp6QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSwyQkFBMkI7b0JBQ3JDLFdBQVcsRUFBRSw0QkFBNEI7aUJBQ3hDOztBQUdILHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyx1QkFBdUIsRUFBRSw2QkFBNkIsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IFF1ZXN0aW9uQW5ndWxhciB9IGZyb20gXCIuLi9xdWVzdGlvblwiO1xuaW1wb3J0IHsgUXVlc3Rpb25TaWduYXR1cmVQYWRNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi4vY29tcG9uZW50LWZhY3RvcnlcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInN2LW5nLXNpZ25hdHVyZS1jb21wb25lbnRcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9zaWduYXR1cmUuY29tcG9uZW50Lmh0bWxcIlxuICB9KVxuZXhwb3J0IGNsYXNzIFNpZ25hdHVyZVBhZFF1ZXN0aW9uQ29tcG9uZW50IGV4dGVuZHMgUXVlc3Rpb25Bbmd1bGFyPFF1ZXN0aW9uU2lnbmF0dXJlUGFkTW9kZWw+IHt9XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwic2lnbmF0dXJlcGFkLXF1ZXN0aW9uXCIsIFNpZ25hdHVyZVBhZFF1ZXN0aW9uQ29tcG9uZW50KTsiLCI8ZGl2XG5bY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5yb290XCJcbltzdHlsZS53aWR0aF09XCJtb2RlbC5yZW5kZXJlZENhbnZhc1dpZHRoXCIgI2NvbnRlbnRFbGVtZW50PlxuPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wbGFjZWhvbGRlclwiIFt2aXNpYmxlXT1cIm1vZGVsLm5lZWRTaG93UGxhY2Vob2xkZXIoKVwiIFttb2RlbF09XCIkYW55KG1vZGVsKS5sb2NQbGFjZWhvbGRlclwiIHN2LW5nLXN0cmluZz48L2Rpdj5cbjxkaXY+XG4gIDxpbWcgKm5nSWY9XCIhIW1vZGVsLmJhY2tncm91bmRJbWFnZVwiIFtzcmNdPVwibW9kZWwuYmFja2dyb3VuZEltYWdlXCIgW3N0eWxlLndpZHRoXT1cIm1vZGVsLnJlbmRlcmVkQ2FudmFzV2lkdGhcIiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5iYWNrZ3JvdW5kSW1hZ2VcIj5cbiAgPGNhbnZhcyB0YWJpbmRleD1cIi0xXCIgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMuY2FudmFzXCIgKGJsdXIpPVwibW9kZWwub25CbHVyKCRldmVudClcIj48L2NhbnZhcz5cbjwvZGl2PlxuPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5jb250cm9sc1wiICpuZ0lmPVwibW9kZWwuY2FuU2hvd0NsZWFyQnV0dG9uXCI+XG4gIDxidXR0b25cbiAgICB0eXBlPVwiYnV0dG9uXCJcbiAgICBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5jbGVhckJ1dHRvblwiXG4gICAgW3RpdGxlXT1cIm1vZGVsLmNsZWFyQnV0dG9uQ2FwdGlvblwiXG4gICAgKGNsaWNrKT1cIm1vZGVsLmNsZWFyVmFsdWUoKVwiXG4gID5cbiAgICA8c3BhbiAqbmdJZj1cIiFtb2RlbC5jc3NDbGFzc2VzLmNsZWFyQnV0dG9uSWNvbklkXCI+4pyWPC9zcGFuPlxuICAgIDxzdmdcbiAgICAgICpuZ0lmPVwibW9kZWwuY3NzQ2xhc3Nlcy5jbGVhckJ1dHRvbkljb25JZFwiXG4gICAgICBbaWNvbk5hbWVdPVwibW9kZWwuY3NzQ2xhc3Nlcy5jbGVhckJ1dHRvbkljb25JZFwiXG4gICAgICBbc2l6ZV09XCInYXV0bydcIiBzdi1uZy1zdmctaWNvbj48L3N2Zz5cbiAgPC9idXR0b24+XG48L2Rpdj5cbjxuZy1jb250YWluZXIgKm5nSWY9XCJtb2RlbC5zaG93TG9hZGluZ0luZGljYXRvclwiPlxuICA8ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmxvYWRpbmdJbmRpY2F0b3JcIj5cbiAgICA8c3YtbmctbG9hZGluZy1pbmRpY2F0b3I+PC9zdi1uZy1sb2FkaW5nLWluZGljYXRvcj5cbiAgPC9kaXY+XG48L25nLWNvbnRhaW5lcj5cbjwvZGl2PiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2lnbmF0dXJlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvc2lnbmF0dXJlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uL3NyYy9xdWVzdGlvbnMvc2lnbmF0dXJlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7OztBQU0vRCxNQUFNLE9BQU8sNkJBQThCLFNBQVEsZUFBMEM7OzJIQUFoRiw2QkFBNkI7K0dBQTdCLDZCQUE2Qix3RkNUMUMsMHRDQTJCTTs0RkRsQk8sNkJBQTZCO2tCQUp6QyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSwyQkFBMkI7b0JBQ3JDLFdBQVcsRUFBRSw0QkFBNEI7aUJBQ3hDOztBQUdILHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyx1QkFBdUIsRUFBRSw2QkFBNkIsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IFF1ZXN0aW9uQW5ndWxhciB9IGZyb20gXCIuLi9xdWVzdGlvblwiO1xuaW1wb3J0IHsgUXVlc3Rpb25TaWduYXR1cmVQYWRNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi4vY29tcG9uZW50LWZhY3RvcnlcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInN2LW5nLXNpZ25hdHVyZS1jb21wb25lbnRcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9zaWduYXR1cmUuY29tcG9uZW50Lmh0bWxcIlxuICB9KVxuZXhwb3J0IGNsYXNzIFNpZ25hdHVyZVBhZFF1ZXN0aW9uQ29tcG9uZW50IGV4dGVuZHMgUXVlc3Rpb25Bbmd1bGFyPFF1ZXN0aW9uU2lnbmF0dXJlUGFkTW9kZWw+IHt9XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwic2lnbmF0dXJlcGFkLXF1ZXN0aW9uXCIsIFNpZ25hdHVyZVBhZFF1ZXN0aW9uQ29tcG9uZW50KTsiLCI8ZGl2XG5bY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5yb290XCJcbltzdHlsZS53aWR0aF09XCJtb2RlbC5yZW5kZXJlZENhbnZhc1dpZHRoXCIgI2NvbnRlbnRFbGVtZW50PlxuPGRpdiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5wbGFjZWhvbGRlclwiIFt2aXNpYmxlXT1cIm1vZGVsLm5lZWRTaG93UGxhY2Vob2xkZXIoKVwiIFttb2RlbF09XCIkYW55KG1vZGVsKS5sb2NSZW5kZXJlZFBsYWNlaG9sZGVyXCIgc3Ytbmctc3RyaW5nPjwvZGl2PlxuPGRpdj5cbiAgPGltZyAqbmdJZj1cIiEhbW9kZWwuYmFja2dyb3VuZEltYWdlXCIgW3NyY109XCJtb2RlbC5iYWNrZ3JvdW5kSW1hZ2VcIiBbc3R5bGUud2lkdGhdPVwibW9kZWwucmVuZGVyZWRDYW52YXNXaWR0aFwiIFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmJhY2tncm91bmRJbWFnZVwiPlxuICA8Y2FudmFzIHRhYmluZGV4PVwiLTFcIiBbY2xhc3NdPVwibW9kZWwuY3NzQ2xhc3Nlcy5jYW52YXNcIiAoYmx1cik9XCJtb2RlbC5vbkJsdXIoJGV2ZW50KVwiPjwvY2FudmFzPlxuPC9kaXY+XG48ZGl2IFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmNvbnRyb2xzXCIgKm5nSWY9XCJtb2RlbC5jYW5TaG93Q2xlYXJCdXR0b25cIj5cbiAgPGJ1dHRvblxuICAgIHR5cGU9XCJidXR0b25cIlxuICAgIFtjbGFzc109XCJtb2RlbC5jc3NDbGFzc2VzLmNsZWFyQnV0dG9uXCJcbiAgICBbdGl0bGVdPVwibW9kZWwuY2xlYXJCdXR0b25DYXB0aW9uXCJcbiAgICAoY2xpY2spPVwibW9kZWwuY2xlYXJWYWx1ZSgpXCJcbiAgPlxuICAgIDxzcGFuICpuZ0lmPVwiIW1vZGVsLmNzc0NsYXNzZXMuY2xlYXJCdXR0b25JY29uSWRcIj7inJY8L3NwYW4+XG4gICAgPHN2Z1xuICAgICAgKm5nSWY9XCJtb2RlbC5jc3NDbGFzc2VzLmNsZWFyQnV0dG9uSWNvbklkXCJcbiAgICAgIFtpY29uTmFtZV09XCJtb2RlbC5jc3NDbGFzc2VzLmNsZWFyQnV0dG9uSWNvbklkXCJcbiAgICAgIFtzaXplXT1cIidhdXRvJ1wiIHN2LW5nLXN2Zy1pY29uPjwvc3ZnPlxuICA8L2J1dHRvbj5cbjwvZGl2PlxuPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1vZGVsLnNob3dMb2FkaW5nSW5kaWNhdG9yXCI+XG4gIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzc0NsYXNzZXMubG9hZGluZ0luZGljYXRvclwiPlxuICAgIDxzdi1uZy1sb2FkaW5nLWluZGljYXRvcj48L3N2LW5nLWxvYWRpbmctaW5kaWNhdG9yPlxuICA8L2Rpdj5cbjwvbmctY29udGFpbmVyPlxuPC9kaXY+Il19

package/fesm2015/survey-angular-ui.js

@@ -333,7 +333,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 class PopupBaseContainerComponent extends BaseAngular {
     constructor(changeDetectorRef) {
         super(changeDetectorRef);
-        this.prevIsVisible = false;
         this.changeDetectorRef.detach();
     }
     getModel() {
@@ -363,12 +362,9 @@ class PopupBaseContainerComponent extends BaseAngular {
     afterUpdate(isSync = false) {
         super.afterUpdate(isSync);
         if (!isSync) {
-            if (!this.prevIsVisible && this.model.isVisible) {
+            if (!this.model.isPositionSet && this.model.isVisible) {
                 this.model.updateOnShowing();
             }
-            if (this.prevIsVisible !== this.model.isVisible) {
-                this.prevIsVisible = this.model.isVisible;
-            }
         }
     }
     clickInside(event) {
@@ -1096,7 +1092,7 @@ class ElementHeaderComponent {
     }
 }
 ElementHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-ElementHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementHeaderComponent, selector: "'[sv-ng-element-header]'", inputs: { element: "element" }, host: { listeners: { "click": "click($event)" }, properties: { "class": "this.rootClass" } }, ngImport: i0, template: "<sv-ng-element-title [element]=\"element\"></sv-ng-element-title>\n<div *ngIf=\"element.hasDescriptionUnderTitle\" [class]=\"element.cssDescription\" [model]=\"element.locDescription\" [attr.id]=\"element.ariaDescriptionId\" [style.display]=\"element.hasDescription ? '': 'none' \" sv-ng-string></div>\n<ng-container *ngIf=\"!!element.additionalTitleToolbar\">\n<sv-ng-action-bar [model]=\"element.additionalTitleToolbar\"></sv-ng-action-bar>\n</ng-container>", components: [{ type: ElementTitleComponent, selector: "sv-ng-element-title", inputs: ["element"] }, { type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+ElementHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ElementHeaderComponent, selector: "'[sv-ng-element-header]'", inputs: { element: "element" }, host: { listeners: { "click": "click($event)" }, properties: { "class": "this.rootClass" } }, ngImport: i0, template: "<sv-ng-element-title [element]=\"element\"></sv-ng-element-title>\n<div *ngIf=\"element.hasDescriptionUnderTitle\" [class]=\"element.cssDescription\" [model]=\"element.locDescription\" [attr.id]=\"element.ariaDescriptionId\" [style.display]=\"element.hasDescription ? '': 'none' \" sv-ng-string></div>\n<ng-container *ngIf=\"element.hasAdditionalTitleToolbar\">\n<sv-ng-action-bar [model]=\"element.additionalTitleToolbar\"></sv-ng-action-bar>\n</ng-container>", components: [{ type: ElementTitleComponent, selector: "sv-ng-element-title", inputs: ["element"] }, { type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ElementHeaderComponent, decorators: [{
             type: Component,
             args: [{
@@ -2200,7 +2196,7 @@ class ListItemComponent extends BaseAngular {
     }
 }
 ListItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ListItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ListItemComponent, selector: "sv-ng-list-item, '[sv-ng-list-item]'", inputs: { element: "element", model: "model", listModel: "listModel" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <li role=\"option\" [key2click] [visible]=\"listModel.isItemVisible(model)\" [class]=\"class\" [attr.id]=\"elementId\" [attr.aria-selected]=\"ariaSelected ? 'true' : 'false'\" (click)=\"click($event)\" (pointerdown)=\"pointerdown($event)\">\n    <ng-container *ngIf=\"model.needSeparator\">\n    <div [class]=\"listModel.cssClasses.itemSeparator\"></div>\n    </ng-container>\n    <div [class]=\"listModel.cssClasses.itemBody\" [style.paddingInlineStart]=\"paddingLeft\" [attr.title]=\"model.locTitle.calculatedText\">\n    <ng-container *ngIf=\"!model.component\">\n      <svg *ngIf=\"model.iconName\" [class]=\"listModel.cssClasses.itemIcon\" [iconName]=\"model.iconName\" [size]=\"model.iconSize\"\n        sv-ng-svg-icon></svg>\n      <sv-ng-string [model]=\"model.locTitle\"></sv-ng-string>\n    </ng-container>\n    <ng-container *ngIf=\"model.component\">\n      <ng-template [component]=\"{ name: model.component, data: { model: model } }\"></ng-template>\n    </ng-container>\n    </div>\n  </li>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+ListItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ListItemComponent, selector: "sv-ng-list-item, '[sv-ng-list-item]'", inputs: { element: "element", model: "model", listModel: "listModel" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <li role=\"option\" [key2click]=\"{ processEsc: false, disableTabStop: model.disableTabStop }\" [visible]=\"listModel.isItemVisible(model)\" [class]=\"class\" [attr.id]=\"elementId\" [attr.aria-selected]=\"ariaSelected ? 'true' : 'false'\" (click)=\"click($event)\" (pointerdown)=\"pointerdown($event)\">\n    <ng-container *ngIf=\"model.needSeparator\">\n    <div [class]=\"listModel.cssClasses.itemSeparator\"></div>\n    </ng-container>\n    <div [class]=\"listModel.cssClasses.itemBody\" [style.paddingInlineStart]=\"paddingLeft\" [attr.title]=\"model.locTitle.calculatedText\">\n    <ng-container *ngIf=\"!model.component\">\n      <svg *ngIf=\"model.iconName\" [class]=\"listModel.cssClasses.itemIcon\" [iconName]=\"model.iconName\" [size]=\"model.iconSize\"\n        sv-ng-svg-icon></svg>\n      <sv-ng-string [model]=\"model.locTitle\"></sv-ng-string>\n    </ng-container>\n    <ng-container *ngIf=\"model.component\">\n      <ng-template [component]=\"{ name: model.component, data: { model: model } }\"></ng-template>\n    </ng-container>\n    </div>\n  </li>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ListItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -2280,7 +2276,7 @@ class RatingItemComponent extends BaseAngular {
     }
 }
 RatingItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-RatingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemComponent, selector: "sv-ng-rating-item", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [class]=\"model.getItemClassByText(item.itemValue, item.text)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.name\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <span [class]=\"model.cssClasses.itemText\" [model]=\"item.locText\" sv-ng-string></span>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }] });
+RatingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemComponent, selector: "sv-ng-rating-item", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [class]=\"model.getItemClassByText(item.itemValue, item.text)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.questionName\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <span [class]=\"model.cssClasses.itemText\" [model]=\"item.locText\" sv-ng-string></span>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -2309,7 +2305,7 @@ class RatingItemStarComponent extends BaseAngular {
     }
 }
 RatingItemStarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemStarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-RatingItemStarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemStarComponent, selector: "sv-ng-rating-item-star", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [class]=\"model.getItemClass(item.itemValue, item.highlight)\" (mouseover)=\"model.onItemMouseIn(item)\" (mouseout)=\"model.onItemMouseOut(item)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.name\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <svg [iconName]=\"model.itemStarIcon\" [size]=\"'auto'\" [title]=\"item.text\" [class]=\"'sv-star'\" sv-ng-svg-icon></svg>\n      <svg [iconName]=\"model.itemStarIconAlt\" [size]=\"'auto'\" [title]=\"item.text\" [class]=\"'sv-star-2'\" sv-ng-svg-icon></svg>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
+RatingItemStarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemStarComponent, selector: "sv-ng-rating-item-star", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [class]=\"model.getItemClass(item.itemValue, item.highlight)\" (mouseover)=\"model.onItemMouseIn(item)\" (mouseout)=\"model.onItemMouseOut(item)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.questionName\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <svg [iconName]=\"model.itemStarIcon\" [size]=\"'auto'\" [title]=\"item.text\" [class]=\"'sv-star'\" sv-ng-svg-icon></svg>\n      <svg [iconName]=\"model.itemStarIconAlt\" [size]=\"'auto'\" [title]=\"item.text\" [class]=\"'sv-star-2'\" sv-ng-svg-icon></svg>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemStarComponent, decorators: [{
             type: Component,
             args: [{
@@ -2338,7 +2334,7 @@ class RatingItemSmileyComponent extends BaseAngular {
     }
 }
 RatingItemSmileyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemSmileyComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-RatingItemSmileyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemSmileyComponent, selector: "sv-ng-rating-item-smiley", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [style]=\"model.getItemStyle(item.itemValue, item.highlight)\" [class]=\"model.getItemClass(item.itemValue, item.highlight)\" (mouseover)=\"model.onItemMouseIn(item)\" (mouseout)=\"model.onItemMouseOut(item)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.name\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <svg [iconName]=\"model.getItemSmileyIconName(item.itemValue)\" [size]=\"'auto'\" [title]=\"item.text\" sv-ng-svg-icon></svg>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
+RatingItemSmileyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RatingItemSmileyComponent, selector: "sv-ng-rating-item-smiley", inputs: { element: "element", model: "model", item: "item", index: "index" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <label [style]=\"model.getItemStyle(item.itemValue, item.highlight)\" [class]=\"model.getItemClass(item.itemValue, item.highlight)\" (mouseover)=\"model.onItemMouseIn(item)\" (mouseout)=\"model.onItemMouseOut(item)\" (mousedown)=\"model.onMouseDown()\">\n    <input type=\"radio\"\n      class=\"sv-visuallyhidden\"\n      [attr.name]=\"model.questionName\" [attr.id]=\"model.getInputId(index)\" [value]=\"item.value\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-errormessage]=\"model.ariaErrormessage\"\n      [disabled]=\"model.isInputReadOnly\" [checked]=\"model.value === item.value\" (click)=\"onClick($event)\"\n      />\n      <svg [iconName]=\"model.getItemSmileyIconName(item.itemValue)\" [size]=\"'auto'\" [title]=\"item.text\" sv-ng-svg-icon></svg>\n  </label>\n</ng-template>", styles: [":host{display:none}\n"], components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RatingItemSmileyComponent, decorators: [{
             type: Component,
             args: [{
@@ -2415,7 +2411,7 @@ class BooleanRadioItemComponent {
     }
 }
 BooleanRadioItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: BooleanRadioItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-BooleanRadioItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BooleanRadioItemComponent, selector: "sv-ng-boolean-radio-item", inputs: { question: "question", value: "value", locText: "locText" }, ngImport: i0, template: "<div role=\"presentation\" [class]=\"question.getRadioItemClass(question.cssClasses, value)\">\n  <label [class]=\"question.cssClasses.radioLabel\">\n    <input\n      type=\"radio\"\n      [attr.name]=\"question.name\" [attr.aria-errormessage]=\"question.ariaErrormessage\" [value]=\"value\" [(ngModel)]=\"question.booleanValue\"\n      [disabled]=\"question.isInputReadOnly\" [class]=\"question.cssClasses.itemRadioControl || ''\"\n    />\n    <span *ngIf=\"question.cssClasses.materialRadioDecorator\" [class]=\"question.cssClasses.materialRadioDecorator\"></span>\n    <span [class]=\"question.cssClasses.radioControlLabel\" [model]=\"locText\" sv-ng-string>\n    </span>\n  </label>\n</div>\n", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+BooleanRadioItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: BooleanRadioItemComponent, selector: "sv-ng-boolean-radio-item", inputs: { question: "question", value: "value", locText: "locText" }, ngImport: i0, template: "<div role=\"presentation\" [class]=\"question.getRadioItemClass(question.cssClasses, value)\">\n  <label [class]=\"question.cssClasses.radioLabel\">\n    <input\n      type=\"radio\"\n      [attr.name]=\"question.name\" [attr.aria-errormessage]=\"question.ariaErrormessage\" [value]=\"value\" [(ngModel)]=\"question.booleanValue\"\n      [disabled]=\"question.isInputReadOnly\" [class]=\"question.cssClasses.itemRadioControl || ''\"\n    />\n    <span *ngIf=\"question.cssClasses.materialRadioDecorator\" [class]=\"question.cssClasses.materialRadioDecorator\">\n      <svg\n        *ngIf=\"question.itemSvgIcon\"\n        [class]=\"question.cssClasses.itemRadioDecorator\"\n      >\n        <use [attr.xlink:href]=\"question.itemSvgIcon\"></use>\n      </svg>\n    </span>\n    <span [class]=\"question.cssClasses.radioControlLabel\" [model]=\"locText\" sv-ng-string>\n    </span>\n  </label>\n</div>\n", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2$1.RadioControlValueAccessor, selector: "input[type=radio][formControlName],input[type=radio][formControl],input[type=radio][ngModel]", inputs: ["name", "formControlName", "value"] }, { type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: BooleanRadioItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -2573,9 +2569,12 @@ class PanelComponent extends BaseAngular {
             (_b = this.model.survey) === null || _b === void 0 ? void 0 : _b.afterRenderPanel(this.model, this.panelContainerRef.nativeElement);
         }
     }
+    get canRender() {
+        return this.model && this.model.survey && this.model.getIsContentVisible();
+    }
 }
 PanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-PanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelComponent, selector: "sv-ng-panel, '[sv-ng-panel]'", inputs: { model: "model" }, viewQueries: [{ propertyName: "panelContainerRef", first: true, predicate: ["panelContainer"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div *ngIf=\"!!model && model.getIsContentVisible()\" [attr.id]=\"model.id\" [class]=\"model.getContainerCss()\" (focusin)=\"model.focusIn()\" #panelContainer>\n    <div *ngIf=\"model.showErrorsAbovePanel && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div *ngIf=\"model.hasDescription || model.hasTitle\" [element]=\"model\" sv-ng-element-header></div>\n    <div *ngIf=\"!model.showErrorsAbovePanel && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div *ngIf=\"model.renderedIsExpanded\" [style.paddingLeft]=\"model.innerPaddingLeft\" [class]=\"model.cssClasses.panel.content\" [attr.id]=\"model.contentId\">\n      <ng-container *ngFor=\"let row of model.visibleRows; trackBy: trackRowBy\">\n        <ng-template [component]=\"{ name: $any(model.survey).getRowWrapperComponentName(row), data: { componentData: $any(model.survey).getRowWrapperComponentData(row) } }\">\n          <sv-ng-row [row]=\"row\"></sv-ng-row>\n        </ng-template>\n      </ng-container>\n      <sv-ng-action-bar [model]=\"model.getFooterToolbar()\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>", components: [{ type: ErrorsComponent, selector: "'[sv-ng-errors]'", inputs: ["element", "location"] }, { type: ElementHeaderComponent, selector: "'[sv-ng-element-header]'", inputs: ["element"] }, { type: RowComponent, selector: "sv-ng-row", inputs: ["row"] }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+PanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelComponent, selector: "sv-ng-panel, '[sv-ng-panel]'", inputs: { model: "model" }, viewQueries: [{ propertyName: "panelContainerRef", first: true, predicate: ["panelContainer"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div *ngIf=\"canRender\" [attr.id]=\"model.id\" [class]=\"model.getContainerCss()\" (focusin)=\"model.focusIn()\" #panelContainer>\n    <div *ngIf=\"model.showErrorsAbovePanel && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div *ngIf=\"model.hasDescription || model.hasTitle\" [element]=\"model\" sv-ng-element-header></div>\n    <div *ngIf=\"!model.showErrorsAbovePanel && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div *ngIf=\"model.renderedIsExpanded\" [style.paddingLeft]=\"model.innerPaddingLeft\" [class]=\"model.cssClasses.panel.content\" [attr.id]=\"model.contentId\">\n      <ng-container *ngFor=\"let row of model.visibleRows; trackBy: trackRowBy\">\n        <ng-template [component]=\"{ name: $any(model.survey).getRowWrapperComponentName(row), data: { componentData: $any(model.survey).getRowWrapperComponentData(row) } }\">\n          <sv-ng-row [row]=\"row\"></sv-ng-row>\n        </ng-template>\n      </ng-container>\n      <sv-ng-action-bar [model]=\"model.getFooterToolbar()\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>", components: [{ type: ErrorsComponent, selector: "'[sv-ng-errors]'", inputs: ["element", "location"] }, { type: ElementHeaderComponent, selector: "'[sv-ng-element-header]'", inputs: ["element"] }, { type: RowComponent, selector: "sv-ng-row", inputs: ["row"] }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelComponent, decorators: [{
             type: Component,
             args: [{
@@ -2621,7 +2620,7 @@ class FilePreviewComponent extends EmbeddedViewContentComponent {
     }
 }
 FilePreviewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FilePreviewComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FilePreviewComponent, selector: "sv-ng-file-preview", inputs: { question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n    <ng-container *ngIf=\"question.showPreviewContainer\">\n        <div [class]=\"question.cssClasses.fileList || undefined\">\n            <span *ngFor=\"let val of question.previewValue; index as index; trackBy: trackFilesFn\"\n                [visible]=\"val && question.isPreviewVisible(index)\" [class]=\"question.cssClasses.preview\">\n                <div *ngIf=\"val.name && question.cssClasses.fileSign\" [class]=\"question.cssClasses.fileSign\">\n                    <a (click)=\"question.doDownloadFile($event, val)\" [attr.href]=\"val.content | safeUrl\"\n                        [attr.title]=\"val.name\" [attr.download]=\"val.name\" [style.width]=\"question.imageWidth\">{{\n                        val.name\n                        }}</a>\n                </div>\n                <div [class]=\"question.getImageWrapperCss(val)\">\n                    <img *ngIf=\"question.canPreviewImage(val)\" [attr.src]=\"val.content | safeUrl\"\n                        [style.height]=\"question.imageHeight\" [style.width]=\"question.imageWidth\" alt=\"File preview\" />\n                    <svg *ngIf=\"question.defaultImage(val)\" [iconName]=\"question.cssClasses.defaultImageIconId\"\n                        [partCss]=\"question.cssClasses.defaultImage\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n                    <div *ngIf=\"val.name && !question.isReadOnly\" [class]=\"question.getRemoveButtonCss()\"\n                        (click)=\"question.doRemoveFile(val)\">\n                        <span [class]=\"question.cssClasses.removeFile\">{{ question.removeFileCaption }}</span>\n                        <svg *ngIf=\"question.cssClasses.removeFileSvgIconId\" [title]=\"question.removeFileCaption\"\n                            [partCss]=\"question.cssClasses.removeFileSvg\"\n                            [iconName]=\"question.cssClasses.removeFileSvgIconId\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n                    </div>\n                </div>\n                <div *ngIf=\"val.name && question.cssClasses.fileSignBottom\"\n                    [class]=\"question.cssClasses.fileSignBottom\">\n                    <a (click)=\"question.doDownloadFile($event, val)\" [attr.href]=\"val.content | safeUrl\"\n                        [attr.title]=\"val.name\" [attr.download]=\"val.name\" [style.width]=\"question.imageWidth\">{{\n                        val.name\n                        }}</a>\n                </div>\n            </span>\n        </div>\n    </ng-container>\n</ng-template>", components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }], pipes: { "safeUrl": SafeUrlPipe } });
+FilePreviewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FilePreviewComponent, selector: "sv-ng-file-preview", inputs: { question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n    <ng-container *ngIf=\"question.showPreviewContainer\">\n        <div [class]=\"question.cssClasses.fileList || undefined\">\n            <span *ngFor=\"let val of question.previewValue; index as index; trackBy: trackFilesFn\"\n                [visible]=\"val && question.isPreviewVisible(index)\" [class]=\"question.cssClasses.previewItem\">\n                <div *ngIf=\"val.name && question.cssClasses.fileSign\" [class]=\"question.cssClasses.fileSign\">\n                    <a (click)=\"question.doDownloadFile($event, val)\" [attr.href]=\"val.content | safeUrl\"\n                        [attr.title]=\"val.name\" [attr.download]=\"val.name\" [style.width]=\"question.imageWidth\">{{\n                        val.name\n                        }}</a>\n                </div>\n                <div [class]=\"question.getImageWrapperCss(val)\">\n                    <img *ngIf=\"question.canPreviewImage(val)\" [attr.src]=\"val.content | safeUrl\"\n                        [style.height]=\"question.imageHeight\" [style.width]=\"question.imageWidth\" alt=\"File preview\" />\n                    <svg *ngIf=\"question.defaultImage(val)\" [iconName]=\"question.cssClasses.defaultImageIconId\"\n                        [partCss]=\"question.cssClasses.defaultImage\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n                    <div *ngIf=\"val.name && !question.isReadOnly\" [class]=\"question.getRemoveButtonCss()\"\n                        (click)=\"question.doRemoveFile(val)\">\n                        <span [class]=\"question.cssClasses.removeFile\">{{ question.removeFileCaption }}</span>\n                        <svg *ngIf=\"question.cssClasses.removeFileSvgIconId\" [title]=\"question.removeFileCaption\"\n                            [partCss]=\"question.cssClasses.removeFileSvg\"\n                            [iconName]=\"question.cssClasses.removeFileSvgIconId\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n                    </div>\n                </div>\n                <div *ngIf=\"val.name && question.cssClasses.fileSignBottom\"\n                    [class]=\"question.cssClasses.fileSignBottom\">\n                    <a (click)=\"question.doDownloadFile($event, val)\" [attr.href]=\"val.content | safeUrl\"\n                        [attr.title]=\"val.name\" [attr.download]=\"val.name\" [style.width]=\"question.imageWidth\">{{\n                        val.name\n                        }}</a>\n                </div>\n            </span>\n        </div>\n    </ng-container>\n</ng-template>", components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }], pipes: { "safeUrl": SafeUrlPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FilePreviewComponent, decorators: [{
             type: Component,
             args: [{
@@ -2729,7 +2728,7 @@ AngularComponentFactory.Instance.registerComponent("comment-question", CommentQu
 class SignaturePadQuestionComponent extends QuestionAngular {
 }
 SignaturePadQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SignaturePadQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-SignaturePadQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: SignaturePadQuestionComponent, selector: "sv-ng-signature-component", usesInheritance: true, ngImport: i0, template: "<div\n[class]=\"model.cssClasses.root\"\n[style.width]=\"model.renderedCanvasWidth\" #contentElement>\n<div [class]=\"model.cssClasses.placeholder\" [visible]=\"model.needShowPlaceholder()\" [model]=\"$any(model).locPlaceholder\" sv-ng-string></div>\n<div>\n  <img *ngIf=\"!!model.backgroundImage\" [src]=\"model.backgroundImage\" [style.width]=\"model.renderedCanvasWidth\" [class]=\"model.cssClasses.backgroundImage\">\n  <canvas tabindex=\"-1\" [class]=\"model.cssClasses.canvas\" (blur)=\"model.onBlur($event)\"></canvas>\n</div>\n<div [class]=\"model.cssClasses.controls\" *ngIf=\"model.canShowClearButton\">\n  <button\n    type=\"button\"\n    [class]=\"model.cssClasses.clearButton\"\n    [title]=\"model.clearButtonCaption\"\n    (click)=\"model.clearValue()\"\n  >\n    <span *ngIf=\"!model.cssClasses.clearButtonIconId\">\u2716</span>\n    <svg\n      *ngIf=\"model.cssClasses.clearButtonIconId\"\n      [iconName]=\"model.cssClasses.clearButtonIconId\"\n      [size]=\"'auto'\" sv-ng-svg-icon></svg>\n  </button>\n</div>\n<ng-container *ngIf=\"model.showLoadingIndicator\">\n  <div [class]=\"model.cssClasses.loadingIndicator\">\n    <sv-ng-loading-indicator></sv-ng-loading-indicator>\n  </div>\n</ng-container>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: LoadingIndicatorComponent, selector: "sv-ng-loading-indicator" }], directives: [{ type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+SignaturePadQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: SignaturePadQuestionComponent, selector: "sv-ng-signature-component", usesInheritance: true, ngImport: i0, template: "<div\n[class]=\"model.cssClasses.root\"\n[style.width]=\"model.renderedCanvasWidth\" #contentElement>\n<div [class]=\"model.cssClasses.placeholder\" [visible]=\"model.needShowPlaceholder()\" [model]=\"$any(model).locRenderedPlaceholder\" sv-ng-string></div>\n<div>\n  <img *ngIf=\"!!model.backgroundImage\" [src]=\"model.backgroundImage\" [style.width]=\"model.renderedCanvasWidth\" [class]=\"model.cssClasses.backgroundImage\">\n  <canvas tabindex=\"-1\" [class]=\"model.cssClasses.canvas\" (blur)=\"model.onBlur($event)\"></canvas>\n</div>\n<div [class]=\"model.cssClasses.controls\" *ngIf=\"model.canShowClearButton\">\n  <button\n    type=\"button\"\n    [class]=\"model.cssClasses.clearButton\"\n    [title]=\"model.clearButtonCaption\"\n    (click)=\"model.clearValue()\"\n  >\n    <span *ngIf=\"!model.cssClasses.clearButtonIconId\">\u2716</span>\n    <svg\n      *ngIf=\"model.cssClasses.clearButtonIconId\"\n      [iconName]=\"model.cssClasses.clearButtonIconId\"\n      [size]=\"'auto'\" sv-ng-svg-icon></svg>\n  </button>\n</div>\n<ng-container *ngIf=\"model.showLoadingIndicator\">\n  <div [class]=\"model.cssClasses.loadingIndicator\">\n    <sv-ng-loading-indicator></sv-ng-loading-indicator>\n  </div>\n</ng-container>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: LoadingIndicatorComponent, selector: "sv-ng-loading-indicator" }], directives: [{ type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SignaturePadQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -2858,7 +2857,7 @@ class RankingItemComponent extends BaseAngular {
     }
 }
 RankingItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RankingItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-RankingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RankingItemComponent, selector: "sv-ng-ranking-item", inputs: { question: "question", model: "model", index: "index", unrankedItem: "unrankedItem" }, usesInheritance: true, ngImport: i0, template: "\n\n\n<div [attr.tabindex]=\"question.getItemTabIndex(model)\" [attr.data-sv-drop-target-ranking-item]=\"index\" \n    [class]=\"question.getItemClass(model)\"\n    (keydown)=\"question.handleKeydown($event, model)\"\n    (pointerdown)=\"question.handlePointerDown($event, model, $any($event.currentTarget))\">\n  <div tabindex=\"-1\" style=\"outline: none;\">\n    <div [class]=\"question.cssClasses.itemGhostNode\"></div>\n    <div [class]=\"question.cssClasses.itemContent\">\n      <div [class]=\"question.cssClasses.itemIconContainer\">\n        <svg [class]=\"question.getIconHoverCss()\">\n          <use [attr.xlink:href]=\"question.dragDropSvgIcon\"></use>\n        </svg> \n        <svg [class]=\"question.getIconFocusCss()\">\n          <use [attr.xlink:href]=\"question.arrowsSvgIcon\"></use>\n        </svg> \n      </div>\n\n      <div *ngIf=\"!unrankedItem && question.getNumberByIndex(index); else elseBlock\" [class]=\"question.getItemIndexClasses(model)\">{{ question.getNumberByIndex(index) }}</div>\n      <ng-template #elseBlock><div [class]=\"question.getItemIndexClasses(model)\">\n        <svg>\n          <use [attr.xlink:href]=\"question.dashSvgIcon\"></use>\n        </svg> \n      </div></ng-template>\n      <div [class]=\"question.cssClasses.controlLabel\">\n        <sv-ng-string [model]=\"model.locText\"></sv-ng-string>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+RankingItemComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: RankingItemComponent, selector: "sv-ng-ranking-item", inputs: { question: "question", model: "model", index: "index", unrankedItem: "unrankedItem" }, usesInheritance: true, ngImport: i0, template: "\n\n\n<div [attr.tabindex]=\"question.getItemTabIndex(model)\" [attr.data-sv-drop-target-ranking-item]=\"index\" \n    [class]=\"question.getItemClass(model)\"\n    (keydown)=\"question.handleKeydown($event, model)\"\n    (pointerdown)=\"question.handlePointerDown($event, model, $any($event.currentTarget))\"\n    (pointerup)=\"question.handlePointerUp($event, model, $any($event.currentTarget))\">\n  <div tabindex=\"-1\" style=\"outline: none;\">\n    <div [class]=\"question.cssClasses.itemGhostNode\"></div>\n    <div [class]=\"question.cssClasses.itemContent\">\n      <div [class]=\"question.cssClasses.itemIconContainer\">\n        <svg [class]=\"question.getIconHoverCss()\">\n          <use [attr.xlink:href]=\"question.dragDropSvgIcon\"></use>\n        </svg> \n        <svg [class]=\"question.getIconFocusCss()\">\n          <use [attr.xlink:href]=\"question.arrowsSvgIcon\"></use>\n        </svg> \n      </div>\n\n      <div *ngIf=\"!unrankedItem && question.getNumberByIndex(index); else elseBlock\" [class]=\"question.getItemIndexClasses(model)\">{{ question.getNumberByIndex(index) }}</div>\n      <ng-template #elseBlock><div [class]=\"question.getItemIndexClasses(model)\">\n        <svg>\n          <use [attr.xlink:href]=\"question.dashSvgIcon\"></use>\n        </svg> \n      </div></ng-template>\n      <div [class]=\"question.cssClasses.controlLabel\">\n        <sv-ng-string [model]=\"model.locText\"></sv-ng-string>\n      </div>\n    </div>\n  </div>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: RankingItemComponent, decorators: [{
             type: Component,
             args: [{
@@ -2996,14 +2995,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
 AngularComponentFactory.Instance.registerComponent("sv-paneldynamic-progress-text", PanelDynamicProgressText);
 
 class PanelDynamicQuestionComponent extends QuestionAngular {
-    get renderedPanels() {
-        if (this.model.isRenderModeList)
-            return this.model.visiblePanels;
-        const panels = [];
-        if (this.model.currentPanel) {
-            panels.push(this.model.currentPanel);
-        }
-        return panels;
+    trackPanelBy(_, panel) {
+        return panel.id;
     }
     onModelChanged() {
         super.onModelChanged();
@@ -3054,7 +3047,7 @@ class PanelDynamicQuestionComponent extends QuestionAngular {
     }
 }
 PanelDynamicQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelDynamicQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-PanelDynamicQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDynamicQuestionComponent, selector: "sv-ng-paneldynamic-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <div *ngIf=\"model.getShowNoEntriesPlaceholder()\" [class]=\"model.cssClasses.noEntriesPlaceholder\">\n    <span [model]=\"model.locNoEntriesText\" sv-ng-string></span>\n    <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  </div>\n  <div [class]=\"model.cssClasses.progress\" *ngIf=\"!model.showLegacyNavigation && model.isProgressTopShowing && model.isRangeShowing\">\n    <div\n      [class]=\"model.cssClasses.progressBar\"\n      [style]=\"{ width: model.progress }\"\n      role=\"progressbar\"\n    ></div>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\" *ngIf=\"model.showLegacyNavigation && model.isProgressTopShowing\"></ng-container>\n  <!-- add track by [key]=\"panel.id\" -->\n  <ng-container *ngFor=\"let panel of renderedPanels; index as index\"> \n    <div [class]=\"model.getPanelWrapperCss(panel)\">\n      <ng-template [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n      <ng-container *ngIf=\"model.panelRemoveButtonLocation ==='right' && model.canRemovePanel && panel.state != 'collapsed'\">\n        <ng-template [component]=\"{ name: 'sv-paneldynamic-remove-btn', data: { data: { panel, question: model }}}\"></ng-template>\n      </ng-container>\n    </div>\n    <!-- add track by [key]=\"'separator' + panel.id\" -->\n    <hr [class]=\"model.cssClasses.separator\" *ngIf=\"model.showSeparator(index)\"/>\n  </ng-container>\n  <ng-container [ngTemplateOutlet]=\"progress\" *ngIf=\"model.showLegacyNavigation && model.isProgressBottomShowing\"></ng-container>\n  <sv-ng-paneldynamic-add-btn *ngIf=\"model.showLegacyNavigation && model.isRenderModeList\" [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  <ng-container [ngTemplateOutlet]=\"progressV2\" *ngIf=\"model.showNavigation\"></ng-container>\n</div>\n\n<ng-template #progressV2>\n  <div [class]=\"model.cssClasses.footer\" *ngIf=\"!!model.cssClasses.footer\">\n    <hr [class]=\"model.cssClasses.separator\"/>\n    <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing && model.isProgressBottomShowing\">\n      <div\n        [class]=\"model.cssClasses.progressBar\"\n        [style]=\"{ width: model.progress }\"\n        role=\"progressbar\"\n      ></div>\n    </div>\n    <div *ngIf=\"model.footerToolbar.visibleActions.length\" [class]=\"model.cssClasses.footerButtonsContainer\">\n      <sv-ng-action-bar [model]=\"model.footerToolbar\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>\n<ng-template #progress>\n  <div [class]=\"this.progressCssClass\">\n    <div style=\"clear: both\" [class]=\"this.progressCssClass\">\n      <div [class]=\"model.cssClasses.progressContainer\">\n        <sv-ng-paneldynamic-prev-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-prev-btn>\n        <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing\">\n          <div\n            [class]=\"model.cssClasses.progressBar\"\n            [style]=\"{ width: model.progress }\"\n            role=\"progressbar\"\n          ></div>\n        </div>\n          <sv-ng-paneldynamic-next-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-next-btn>\n      </div>\n      <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n      <sv-ng-paneldynamic-progress-text [data]=\"{ question: model }\"></sv-ng-paneldynamic-progress-text>\n    </div>\n  </div>\n</ng-template>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: PanelDynamicAddBtn, selector: "sv-ng-paneldynamic-add-btn" }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: PanelDynamicPrevBtn, selector: "sv-ng-paneldynamic-prev-btn" }, { type: PanelDynamicNextBtn, selector: "sv-ng-paneldynamic-next-btn" }, { type: PanelDynamicProgressText, selector: "sv-ng-paneldynamic-progress-text" }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+PanelDynamicQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDynamicQuestionComponent, selector: "sv-ng-paneldynamic-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <div *ngIf=\"model.getShowNoEntriesPlaceholder()\" [class]=\"model.cssClasses.noEntriesPlaceholder\">\n    <span [model]=\"model.locNoEntriesText\" sv-ng-string></span>\n    <sv-ng-paneldynamic-add-btn *ngIf=\"model.canAddPanel\" [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  </div>\n  <div [class]=\"model.cssClasses.progress\"\n    *ngIf=\"!model.showLegacyNavigation && model.isProgressTopShowing && model.isRangeShowing\">\n    <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\"\n    *ngIf=\"model.showLegacyNavigation && model.isProgressTopShowing\"></ng-container>\n  <div [class]=\"model.cssClasses.panelsContainer\">\n    <ng-container *ngFor=\"let panel of model.renderedPanels; index as index; trackBy: trackPanelBy\">\n      <div [class]=\"model.getPanelWrapperCss(panel)\">\n        <ng-template\n          [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n        <ng-container\n          *ngIf=\"model.panelRemoveButtonLocation ==='right' && model.canRemovePanel && panel.state != 'collapsed'\">\n          <ng-template\n            [component]=\"{ name: 'sv-paneldynamic-remove-btn', data: { data: { panel, question: model }}}\"></ng-template>\n        </ng-container>\n      </div>\n      <hr [class]=\"model.cssClasses.separator\" *ngIf=\"model.showSeparator(index)\" />\n    </ng-container>\n  </div>\n  <ng-container [ngTemplateOutlet]=\"progress\"\n    *ngIf=\"model.showLegacyNavigation && model.isProgressBottomShowing\"></ng-container>\n  <sv-ng-paneldynamic-add-btn *ngIf=\"model.showLegacyNavigation && model.isRenderModeList\"\n    [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n  <ng-container [ngTemplateOutlet]=\"progressV2\" *ngIf=\"model.showNavigation\"></ng-container>\n</div>\n\n<ng-template #progressV2>\n  <div [class]=\"model.cssClasses.footer\" *ngIf=\"!!model.cssClasses.footer\">\n    <hr [class]=\"model.cssClasses.separator\" />\n    <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing && model.isProgressBottomShowing\">\n      <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n    </div>\n    <div *ngIf=\"model.footerToolbar.visibleActions.length\" [class]=\"model.cssClasses.footerButtonsContainer\">\n      <sv-ng-action-bar [model]=\"model.footerToolbar\"></sv-ng-action-bar>\n    </div>\n  </div>\n</ng-template>\n<ng-template #progress>\n  <div [class]=\"this.progressCssClass\">\n    <div style=\"clear: both\" [class]=\"this.progressCssClass\">\n      <div [class]=\"model.cssClasses.progressContainer\">\n        <sv-ng-paneldynamic-prev-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-prev-btn>\n        <div [class]=\"model.cssClasses.progress\" *ngIf=\"model.isRangeShowing\">\n          <div [class]=\"model.cssClasses.progressBar\" [style]=\"{ width: model.progress }\" role=\"progressbar\"></div>\n        </div>\n        <sv-ng-paneldynamic-next-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-next-btn>\n      </div>\n      <sv-ng-paneldynamic-add-btn [data]=\"{ question: model }\"></sv-ng-paneldynamic-add-btn>\n      <sv-ng-paneldynamic-progress-text [data]=\"{ question: model }\"></sv-ng-paneldynamic-progress-text>\n    </div>\n  </div>\n</ng-template>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: PanelDynamicAddBtn, selector: "sv-ng-paneldynamic-add-btn" }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: PanelDynamicPrevBtn, selector: "sv-ng-paneldynamic-prev-btn" }, { type: PanelDynamicNextBtn, selector: "sv-ng-paneldynamic-next-btn" }, { type: PanelDynamicProgressText, selector: "sv-ng-paneldynamic-progress-text" }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PanelDynamicQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -3314,9 +3307,29 @@ class MatrixRowComponent extends BaseAngular {
     trackCellBy(_, cell) {
         return cell.id;
     }
+    onModelChanged() {
+        var _a;
+        super.onModelChanged();
+        if (this.previousModel) {
+            this.previousModel.setRootElement(undefined);
+        }
+        if (this.model && ((_a = this.container) === null || _a === void 0 ? void 0 : _a.nativeElement)) {
+            this.model.setRootElement(this.container.nativeElement);
+        }
+    }
+    ngAfterViewInit() {
+        var _a;
+        if (this.model && ((_a = this.container) === null || _a === void 0 ? void 0 : _a.nativeElement)) {
+            this.model.setRootElement(this.container.nativeElement);
+        }
+    }
+    ngOnDestroy() {
+        super.ngOnDestroy();
+        this.model.setRootElement(undefined);
+    }
 }
 MatrixRowComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MatrixRowComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MatrixRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatrixRowComponent, selector: "sv-ng-matrix-row", inputs: { model: "model", question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <tr *ngIf=\"model.visible\" [class]=\"model.className\" (pointerdown)=\"question.onPointerDown($event, row)\"\n    [attr.data-sv-drop-target-matrix-row]=\"row && row.id\">\n    <sv-ng-matrixdropdown-cell [cell]=\"cell\" [question]=\"question\"\n      *ngFor=\"let cell of model.cells; trackBy: trackCellBy\"></sv-ng-matrixdropdown-cell>\n  </tr>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: MatrixDropdownCellComponent, selector: "sv-ng-matrixdropdown-cell", inputs: ["question", "cell"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+MatrixRowComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatrixRowComponent, selector: "sv-ng-matrix-row", inputs: { model: "model", question: "question" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <tr *ngIf=\"model.visible\" [class]=\"model.className\" (pointerdown)=\"question.onPointerDown($event, row)\"\n    [attr.data-sv-drop-target-matrix-row]=\"row && row.id\" #container>\n    <sv-ng-matrixdropdown-cell [cell]=\"cell\" [question]=\"question\"\n      *ngFor=\"let cell of model.cells; trackBy: trackCellBy\"></sv-ng-matrixdropdown-cell>\n  </tr>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: MatrixDropdownCellComponent, selector: "sv-ng-matrixdropdown-cell", inputs: ["question", "cell"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MatrixRowComponent, decorators: [{
             type: Component,
             args: [{
@@ -3328,6 +3341,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }], question: [{
                 type: Input
+            }], container: [{
+                type: ViewChild,
+                args: ["container", { static: false, read: ElementRef }]
             }] } });
 
 class MatrixTableComponent extends BaseAngular {
@@ -3342,7 +3358,7 @@ class MatrixTableComponent extends BaseAngular {
     }
 }
 MatrixTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MatrixTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-MatrixTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatrixTableComponent, selector: "sv-ng-matrix-table", inputs: { question: "question", table: "table" }, usesInheritance: true, ngImport: i0, template: "<div [style]=\"{ overflowX: question.showHorizontalScroll ? 'scroll' : '' }\" #contentElement [class]=\"question.cssClasses.tableWrapper\">\n  <table [class]=\"question.getTableCss()\">\n    <thead *ngIf=\"table.showHeader\">\n      <tr>\n        <ng-container\n          *ngFor=\"let cell of table.headerRow.cells; trackBy: trackCellBy\"\n        >\n              <th *ngIf=\"cell.hasTitle\" [class]=\"cell.className\" [style]=\"{ minWidth: cell.minWidth, width: cell.width }\">\n                <ng-template [component]=\"{ name: question.getColumnHeaderWrapperComponentName($any(cell)), data: { componentData: question.getColumnHeaderWrapperComponentData($any(cell)) } }\">\n                  <sv-ng-string [model]=\"cell.locTitle\"></sv-ng-string>\n                  <sv-ng-matrixheaderrequired *ngIf=\"!!cell.column\" [column]=\"cell.column\" [question]=\"question\">\n                  </sv-ng-matrixheaderrequired>\n                </ng-template>\n              </th>\n              \n              <td *ngIf=\"!cell.hasTitle\" [class]=\"cell.className\" [style]=\"{ minWidth: cell.minWidth, width: cell.width }\"></td>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <ng-container *ngFor=\"let row of table.rows; trackBy: trackRowBy\">\n        <sv-ng-matrix-row [model]=\"row\" [question]=\"question\"></sv-ng-matrix-row>\n      </ng-container>\n    </tbody>\n    <tfoot *ngIf=\"table.showFooter\">\n      <tr>\n        <sv-ng-matrixdropdown-cell [cell]=\"cell\" [question]=\"question\" *ngFor=\"let cell of table.footerRow.cells; trackBy: trackCellBy\">\n        </sv-ng-matrixdropdown-cell>\n      </tr>\n    </tfoot>\n  </table>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: MatrixRequiredHeader, selector: "sv-ng-matrixheaderrequired", inputs: ["column", "question"] }, { type: MatrixRowComponent, selector: "sv-ng-matrix-row", inputs: ["model", "question"] }, { type: MatrixDropdownCellComponent, selector: "sv-ng-matrixdropdown-cell", inputs: ["question", "cell"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+MatrixTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: MatrixTableComponent, selector: "sv-ng-matrix-table", inputs: { question: "question", table: "table" }, usesInheritance: true, ngImport: i0, template: "<div [style]=\"{ overflowX: question.showHorizontalScroll ? 'scroll' : '' }\" #contentElement\n  [class]=\"question.cssClasses.tableWrapper\">\n  <table [class]=\"question.getTableCss()\">\n    <thead *ngIf=\"table.showHeader\">\n      <tr>\n        <ng-container *ngFor=\"let cell of table.headerRow.cells; trackBy: trackCellBy\">\n          <th *ngIf=\"cell.hasTitle\" [class]=\"cell.className\" [style]=\"{ minWidth: cell.minWidth, width: cell.width }\">\n            <ng-template\n              [component]=\"{ name: question.getColumnHeaderWrapperComponentName($any(cell)), data: { componentData: question.getColumnHeaderWrapperComponentData($any(cell)) } }\">\n              <sv-ng-string [model]=\"cell.locTitle\"></sv-ng-string>\n              <sv-ng-matrixheaderrequired *ngIf=\"!!cell.column\" [column]=\"cell.column\" [question]=\"question\">\n              </sv-ng-matrixheaderrequired>\n            </ng-template>\n          </th>\n\n          <td *ngIf=\"!cell.hasTitle\" [class]=\"cell.className\" [style]=\"{ minWidth: cell.minWidth, width: cell.width }\">\n          </td>\n        </ng-container>\n      </tr>\n    </thead>\n    <tbody>\n      <ng-container *ngFor=\"let row of table.renderedRows; trackBy: trackRowBy\">\n        <sv-ng-matrix-row [model]=\"row\" [question]=\"question\"></sv-ng-matrix-row>\n      </ng-container>\n    </tbody>\n    <tfoot *ngIf=\"table.showFooter\">\n      <tr>\n        <sv-ng-matrixdropdown-cell [cell]=\"cell\" [question]=\"question\"\n          *ngFor=\"let cell of table.footerRow.cells; trackBy: trackCellBy\">\n        </sv-ng-matrixdropdown-cell>\n      </tr>\n    </tfoot>\n  </table>\n</div>", components: [{ type: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: MatrixRequiredHeader, selector: "sv-ng-matrixheaderrequired", inputs: ["column", "question"] }, { type: MatrixRowComponent, selector: "sv-ng-matrix-row", inputs: ["model", "question"] }, { type: MatrixDropdownCellComponent, selector: "sv-ng-matrixdropdown-cell", inputs: ["question", "cell"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: MatrixTableComponent, decorators: [{
             type: Component,
             args: [{