survey-angular-ui 1.9.87 → 1.9.89

package/esm2015/questions/text.component.js

@@ -12,7 +12,7 @@ export class TextQuestionComponent extends QuestionAngular {
     }
 }
 TextQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TextQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TextQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TextQuestionComponent, selector: "sv-ng-text-question", usesInheritance: true, ngImport: i0, template: "  <ng-container [ngTemplateOutlet]=\"input\" *ngIf=\"!model.dataListId && !model.isReadOnlyRenderDiv()\"></ng-container>\n  <div *ngIf=\"model.dataListId && !model.isReadOnlyRenderDiv()\">\n    <ng-container [ngTemplateOutlet]=\"input\"></ng-container>\n    <datalist [id]=\"model.dataListId\">\n      <option *ngFor=\"let dataListItem of model.dataList\" [value]=\"dataListItem\"></option>\n    </datalist>\n  </div>\n  <div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>\n  <ng-template #input>\n    <input [style]=\"model.inputStyle\" [class]=\"model.getControlClass()\" [attr.list]=\"model.dataListId\"\n    (change)=\"model.onChange($event)\" [value]=\"value\" [disabled]=\"model.isInputReadOnly\" name=\"user\" [type]=\"model.inputType\" [id]=\"model.inputId\" [attr.placeholder]=\"model.renderedPlaceholder || ''\"\n    (keyup)=\"model.onKeyUp($event)\" (keydown)=\"model.onKeyDown($event)\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\" (compositionupdate)=\"model.onCompositionUpdate($event)\" \n    [attr.size] = \"model.renderedInputSize\" [attr.maxlength]= \"model.getMaxLength()\" [attr.min]=\"model.renderedMin\"\n    [attr.max]=\"model.renderedMax\" [attr.step]=\"model.renderedStep\" [attr.max]=\"model.renderedMax\" [attr.aria-required]=\"model.ariaRequired\"\n    [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.autocomplete]=\"model.autocomplete\" #contentElement/>\n    <sv-ng-character-counter *ngIf=\"model.getMaxLength()\" \n    [counter]=\"model.characterCounter\"\n    [remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n  </sv-ng-character-counter>\n  </ng-template>", styles: [""], components: [{ type: i1.CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], 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: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
+TextQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TextQuestionComponent, selector: "sv-ng-text-question", usesInheritance: true, ngImport: i0, template: "  <ng-container [ngTemplateOutlet]=\"input\" *ngIf=\"!model.dataListId && !model.isReadOnlyRenderDiv()\"></ng-container>\n  <div *ngIf=\"model.dataListId && !model.isReadOnlyRenderDiv()\">\n    <ng-container [ngTemplateOutlet]=\"input\"></ng-container>\n    <datalist [id]=\"model.dataListId\">\n      <option *ngFor=\"let dataListItem of model.dataList\" [value]=\"dataListItem\"></option>\n    </datalist>\n  </div>\n  <div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>\n  <ng-template #input>\n    <input [style]=\"model.inputStyle\" [class]=\"model.getControlClass()\" [attr.list]=\"model.dataListId\"\n    (change)=\"model.onChange($event)\" [value]=\"value\" [disabled]=\"model.isInputReadOnly\" name=\"user\" [type]=\"model.inputType\" [id]=\"model.inputId\" [attr.placeholder]=\"model.renderedPlaceholder || ''\"\n    (keyup)=\"model.onKeyUp($event)\" (keydown)=\"model.onKeyDown($event)\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\" (compositionupdate)=\"model.onCompositionUpdate($event)\" \n    [attr.size] = \"model.renderedInputSize\" [attr.maxlength]= \"model.getMaxLength()\" [attr.min]=\"model.renderedMin\"\n    [attr.max]=\"model.renderedMax\" [attr.step]=\"model.renderedStep\" [attr.max]=\"model.renderedMax\" [attr.aria-required]=\"model.a11y_input_ariaRequired\"\n    [attr.aria-label]=\"model.a11y_input_ariaLabel\" [attr.aria-labelledby]=\"model.a11y_input_ariaLabelledBy\" [attr.aria-invalid]=\"model.a11y_input_ariaInvalid\" [attr.aria-describedby]=\"model.a11y_input_ariaDescribedBy\" [attr.autocomplete]=\"model.autocomplete\" #contentElement/>\n    <sv-ng-character-counter *ngIf=\"model.getMaxLength()\" \n    [counter]=\"model.characterCounter\"\n    [remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n  </sv-ng-character-counter>\n  </ng-template>", styles: [""], components: [{ type: i1.CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], 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: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TextQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -22,4 +22,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 }]
         }] });
 AngularComponentFactory.Instance.registerComponent("text-question", TextQuestionComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGV4dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcXVlc3Rpb25zL3RleHQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vc3JjL3F1ZXN0aW9ucy90ZXh0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7QUFPL0QsTUFBTSxPQUFPLHFCQUFzQixTQUFRLGVBQWtDO0lBQzNFLElBQUksS0FBSzs7UUFDUCxPQUFPLE1BQUEsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLG1DQUFJLEVBQUUsQ0FBQztJQUNoQyxDQUFDOzttSEFIVSxxQkFBcUI7dUdBQXJCLHFCQUFxQixrRkNWbEMsOHREQW1CZ0I7NEZEVEgscUJBQXFCO2tCQUxqQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxxQkFBcUI7b0JBQy9CLFdBQVcsRUFBRSx1QkFBdUI7b0JBQ3BDLFNBQVMsRUFBRSxDQUFDLHVCQUF1QixDQUFDO2lCQUNyQzs7QUFPRCx1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsZUFBZSxFQUFFLHFCQUFxQixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgUXVlc3Rpb25Bbmd1bGFyIH0gZnJvbSBcIi4uL3F1ZXN0aW9uXCI7XG5pbXBvcnQgeyBRdWVzdGlvblRleHRNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi4vY29tcG9uZW50LWZhY3RvcnlcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInN2LW5nLXRleHQtcXVlc3Rpb25cIixcbiAgdGVtcGxhdGVVcmw6IFwiLi90ZXh0LmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsczogW1wiLi90ZXh0LmNvbXBvbmVudC5zY3NzXCJdXG59KVxuZXhwb3J0IGNsYXNzIFRleHRRdWVzdGlvbkNvbXBvbmVudCBleHRlbmRzIFF1ZXN0aW9uQW5ndWxhcjxRdWVzdGlvblRleHRNb2RlbD4ge1xuICBnZXQgdmFsdWUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5tb2RlbC52YWx1ZSA/PyBcIlwiO1xuICB9XG59XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwidGV4dC1xdWVzdGlvblwiLCBUZXh0UXVlc3Rpb25Db21wb25lbnQpOyIsIiAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJpbnB1dFwiICpuZ0lmPVwiIW1vZGVsLmRhdGFMaXN0SWQgJiYgIW1vZGVsLmlzUmVhZE9ubHlSZW5kZXJEaXYoKVwiPjwvbmctY29udGFpbmVyPlxuICA8ZGl2ICpuZ0lmPVwibW9kZWwuZGF0YUxpc3RJZCAmJiAhbW9kZWwuaXNSZWFkT25seVJlbmRlckRpdigpXCI+XG4gICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJpbnB1dFwiPjwvbmctY29udGFpbmVyPlxuICAgIDxkYXRhbGlzdCBbaWRdPVwibW9kZWwuZGF0YUxpc3RJZFwiPlxuICAgICAgPG9wdGlvbiAqbmdGb3I9XCJsZXQgZGF0YUxpc3RJdGVtIG9mIG1vZGVsLmRhdGFMaXN0XCIgW3ZhbHVlXT1cImRhdGFMaXN0SXRlbVwiPjwvb3B0aW9uPlxuICAgIDwvZGF0YWxpc3Q+XG4gIDwvZGl2PlxuICA8ZGl2ICpuZ0lmPVwibW9kZWwuaXNSZWFkT25seVJlbmRlckRpdigpXCIgI2NvbnRlbnRFbGVtZW50Pnt7IG1vZGVsLnZhbHVlIH19PC9kaXY+XG4gIDxuZy10ZW1wbGF0ZSAjaW5wdXQ+XG4gICAgPGlucHV0IFtzdHlsZV09XCJtb2RlbC5pbnB1dFN0eWxlXCIgW2NsYXNzXT1cIm1vZGVsLmdldENvbnRyb2xDbGFzcygpXCIgW2F0dHIubGlzdF09XCJtb2RlbC5kYXRhTGlzdElkXCJcbiAgICAoY2hhbmdlKT1cIm1vZGVsLm9uQ2hhbmdlKCRldmVudClcIiBbdmFsdWVdPVwidmFsdWVcIiBbZGlzYWJsZWRdPVwibW9kZWwuaXNJbnB1dFJlYWRPbmx5XCIgbmFtZT1cInVzZXJcIiBbdHlwZV09XCJtb2RlbC5pbnB1dFR5cGVcIiBbaWRdPVwibW9kZWwuaW5wdXRJZFwiIFthdHRyLnBsYWNlaG9sZGVyXT1cIm1vZGVsLnJlbmRlcmVkUGxhY2Vob2xkZXIgfHwgJydcIlxuICAgIChrZXl1cCk9XCJtb2RlbC5vbktleVVwKCRldmVudClcIiAoa2V5ZG93bik9XCJtb2RlbC5vbktleURvd24oJGV2ZW50KVwiIChibHVyKT1cIm1vZGVsLm9uQmx1cigkZXZlbnQpXCIgKGZvY3VzKT1cIm1vZGVsLm9uRm9jdXMoJGV2ZW50KVwiIChjb21wb3NpdGlvbnVwZGF0ZSk9XCJtb2RlbC5vbkNvbXBvc2l0aW9uVXBkYXRlKCRldmVudClcIiBcbiAgICBbYXR0ci5zaXplXSA9IFwibW9kZWwucmVuZGVyZWRJbnB1dFNpemVcIiBbYXR0ci5tYXhsZW5ndGhdPSBcIm1vZGVsLmdldE1heExlbmd0aCgpXCIgW2F0dHIubWluXT1cIm1vZGVsLnJlbmRlcmVkTWluXCJcbiAgICBbYXR0ci5tYXhdPVwibW9kZWwucmVuZGVyZWRNYXhcIiBbYXR0ci5zdGVwXT1cIm1vZGVsLnJlbmRlcmVkU3RlcFwiIFthdHRyLm1heF09XCJtb2RlbC5yZW5kZXJlZE1heFwiIFthdHRyLmFyaWEtcmVxdWlyZWRdPVwibW9kZWwuYXJpYVJlcXVpcmVkXCJcbiAgICBbYXR0ci5hcmlhLWxhYmVsXT1cIm1vZGVsLmFyaWFMYWJlbFwiIFthdHRyLmFyaWEtaW52YWxpZF09XCJtb2RlbC5hcmlhSW52YWxpZFwiIFthdHRyLmFyaWEtZGVzY3JpYmVkYnldPVwibW9kZWwuYXJpYURlc2NyaWJlZEJ5XCIgW2F0dHIuYXV0b2NvbXBsZXRlXT1cIm1vZGVsLmF1dG9jb21wbGV0ZVwiICNjb250ZW50RWxlbWVudC8+XG4gICAgPHN2LW5nLWNoYXJhY3Rlci1jb3VudGVyICpuZ0lmPVwibW9kZWwuZ2V0TWF4TGVuZ3RoKClcIiBcbiAgICBbY291bnRlcl09XCJtb2RlbC5jaGFyYWN0ZXJDb3VudGVyXCJcbiAgICBbcmVtYWluaW5nQ2hhcmFjdGVyQ291bnRlcl09XCJtb2RlbC5jc3NDbGFzc2VzLnJlbWFpbmluZ0NoYXJhY3RlckNvdW50ZXJcIj5cbiAgPC9zdi1uZy1jaGFyYWN0ZXItY291bnRlcj5cbiAgPC9uZy10ZW1wbGF0ZT4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGV4dC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvcXVlc3Rpb25zL3RleHQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vc3JjL3F1ZXN0aW9ucy90ZXh0LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDMUMsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUU5QyxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7Ozs7QUFPL0QsTUFBTSxPQUFPLHFCQUFzQixTQUFRLGVBQWtDO0lBQzNFLElBQUksS0FBSzs7UUFDUCxPQUFPLE1BQUEsSUFBSSxDQUFDLEtBQUssQ0FBQyxLQUFLLG1DQUFJLEVBQUUsQ0FBQztJQUNoQyxDQUFDOzttSEFIVSxxQkFBcUI7dUdBQXJCLHFCQUFxQixrRkNWbEMscTBEQW1CZ0I7NEZEVEgscUJBQXFCO2tCQUxqQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxxQkFBcUI7b0JBQy9CLFdBQVcsRUFBRSx1QkFBdUI7b0JBQ3BDLFNBQVMsRUFBRSxDQUFDLHVCQUF1QixDQUFDO2lCQUNyQzs7QUFPRCx1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsZUFBZSxFQUFFLHFCQUFxQixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgUXVlc3Rpb25Bbmd1bGFyIH0gZnJvbSBcIi4uL3F1ZXN0aW9uXCI7XG5pbXBvcnQgeyBRdWVzdGlvblRleHRNb2RlbCB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi4vY29tcG9uZW50LWZhY3RvcnlcIjtcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiBcInN2LW5nLXRleHQtcXVlc3Rpb25cIixcbiAgdGVtcGxhdGVVcmw6IFwiLi90ZXh0LmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsczogW1wiLi90ZXh0LmNvbXBvbmVudC5zY3NzXCJdXG59KVxuZXhwb3J0IGNsYXNzIFRleHRRdWVzdGlvbkNvbXBvbmVudCBleHRlbmRzIFF1ZXN0aW9uQW5ndWxhcjxRdWVzdGlvblRleHRNb2RlbD4ge1xuICBnZXQgdmFsdWUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5tb2RlbC52YWx1ZSA/PyBcIlwiO1xuICB9XG59XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwidGV4dC1xdWVzdGlvblwiLCBUZXh0UXVlc3Rpb25Db21wb25lbnQpOyIsIiAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJpbnB1dFwiICpuZ0lmPVwiIW1vZGVsLmRhdGFMaXN0SWQgJiYgIW1vZGVsLmlzUmVhZE9ubHlSZW5kZXJEaXYoKVwiPjwvbmctY29udGFpbmVyPlxuICA8ZGl2ICpuZ0lmPVwibW9kZWwuZGF0YUxpc3RJZCAmJiAhbW9kZWwuaXNSZWFkT25seVJlbmRlckRpdigpXCI+XG4gICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJpbnB1dFwiPjwvbmctY29udGFpbmVyPlxuICAgIDxkYXRhbGlzdCBbaWRdPVwibW9kZWwuZGF0YUxpc3RJZFwiPlxuICAgICAgPG9wdGlvbiAqbmdGb3I9XCJsZXQgZGF0YUxpc3RJdGVtIG9mIG1vZGVsLmRhdGFMaXN0XCIgW3ZhbHVlXT1cImRhdGFMaXN0SXRlbVwiPjwvb3B0aW9uPlxuICAgIDwvZGF0YWxpc3Q+XG4gIDwvZGl2PlxuICA8ZGl2ICpuZ0lmPVwibW9kZWwuaXNSZWFkT25seVJlbmRlckRpdigpXCIgI2NvbnRlbnRFbGVtZW50Pnt7IG1vZGVsLnZhbHVlIH19PC9kaXY+XG4gIDxuZy10ZW1wbGF0ZSAjaW5wdXQ+XG4gICAgPGlucHV0IFtzdHlsZV09XCJtb2RlbC5pbnB1dFN0eWxlXCIgW2NsYXNzXT1cIm1vZGVsLmdldENvbnRyb2xDbGFzcygpXCIgW2F0dHIubGlzdF09XCJtb2RlbC5kYXRhTGlzdElkXCJcbiAgICAoY2hhbmdlKT1cIm1vZGVsLm9uQ2hhbmdlKCRldmVudClcIiBbdmFsdWVdPVwidmFsdWVcIiBbZGlzYWJsZWRdPVwibW9kZWwuaXNJbnB1dFJlYWRPbmx5XCIgbmFtZT1cInVzZXJcIiBbdHlwZV09XCJtb2RlbC5pbnB1dFR5cGVcIiBbaWRdPVwibW9kZWwuaW5wdXRJZFwiIFthdHRyLnBsYWNlaG9sZGVyXT1cIm1vZGVsLnJlbmRlcmVkUGxhY2Vob2xkZXIgfHwgJydcIlxuICAgIChrZXl1cCk9XCJtb2RlbC5vbktleVVwKCRldmVudClcIiAoa2V5ZG93bik9XCJtb2RlbC5vbktleURvd24oJGV2ZW50KVwiIChibHVyKT1cIm1vZGVsLm9uQmx1cigkZXZlbnQpXCIgKGZvY3VzKT1cIm1vZGVsLm9uRm9jdXMoJGV2ZW50KVwiIChjb21wb3NpdGlvbnVwZGF0ZSk9XCJtb2RlbC5vbkNvbXBvc2l0aW9uVXBkYXRlKCRldmVudClcIiBcbiAgICBbYXR0ci5zaXplXSA9IFwibW9kZWwucmVuZGVyZWRJbnB1dFNpemVcIiBbYXR0ci5tYXhsZW5ndGhdPSBcIm1vZGVsLmdldE1heExlbmd0aCgpXCIgW2F0dHIubWluXT1cIm1vZGVsLnJlbmRlcmVkTWluXCJcbiAgICBbYXR0ci5tYXhdPVwibW9kZWwucmVuZGVyZWRNYXhcIiBbYXR0ci5zdGVwXT1cIm1vZGVsLnJlbmRlcmVkU3RlcFwiIFthdHRyLm1heF09XCJtb2RlbC5yZW5kZXJlZE1heFwiIFthdHRyLmFyaWEtcmVxdWlyZWRdPVwibW9kZWwuYTExeV9pbnB1dF9hcmlhUmVxdWlyZWRcIlxuICAgIFthdHRyLmFyaWEtbGFiZWxdPVwibW9kZWwuYTExeV9pbnB1dF9hcmlhTGFiZWxcIiBbYXR0ci5hcmlhLWxhYmVsbGVkYnldPVwibW9kZWwuYTExeV9pbnB1dF9hcmlhTGFiZWxsZWRCeVwiIFthdHRyLmFyaWEtaW52YWxpZF09XCJtb2RlbC5hMTF5X2lucHV0X2FyaWFJbnZhbGlkXCIgW2F0dHIuYXJpYS1kZXNjcmliZWRieV09XCJtb2RlbC5hMTF5X2lucHV0X2FyaWFEZXNjcmliZWRCeVwiIFthdHRyLmF1dG9jb21wbGV0ZV09XCJtb2RlbC5hdXRvY29tcGxldGVcIiAjY29udGVudEVsZW1lbnQvPlxuICAgIDxzdi1uZy1jaGFyYWN0ZXItY291bnRlciAqbmdJZj1cIm1vZGVsLmdldE1heExlbmd0aCgpXCIgXG4gICAgW2NvdW50ZXJdPVwibW9kZWwuY2hhcmFjdGVyQ291bnRlclwiXG4gICAgW3JlbWFpbmluZ0NoYXJhY3RlckNvdW50ZXJdPVwibW9kZWwuY3NzQ2xhc3Nlcy5yZW1haW5pbmdDaGFyYWN0ZXJDb3VudGVyXCI+XG4gIDwvc3YtbmctY2hhcmFjdGVyLWNvdW50ZXI+XG4gIDwvbmctdGVtcGxhdGU+Il19

package/esm2015/string-viewer.component.js

@@ -3,6 +3,7 @@ import { LocalizableString } from "survey-core";
 import { AngularComponentFactory } from "./component-factory";
 import * as i0 from "@angular/core";
 import * as i1 from "@angular/common";
+import * as i2 from "./utils/safe-html.pipe";
 export class StringViewerComponent {
     constructor(changeDetectorRef) {
         this.changeDetectorRef = changeDetectorRef;
@@ -26,7 +27,7 @@ export class StringViewerComponent {
     }
 }
 StringViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: StringViewerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-StringViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringViewerComponent, selector: "sv-ng-string-viewer, string-viewer, '[sv-ng-string-viewer]'", inputs: { model: "model" }, ngImport: i0, template: "<span *ngIf=\"!model.hasHtml\" class=\"sv-string-viewer\">{{model.renderedHtml}}</span>\n<span *ngIf=\"model.hasHtml\" class=\"sv-string-viewer\" [innerHtml]=\"model.renderedHtml\"></span>", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+StringViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringViewerComponent, selector: "sv-ng-string-viewer, string-viewer, '[sv-ng-string-viewer]'", inputs: { model: "model" }, ngImport: i0, template: "<span *ngIf=\"!model.hasHtml\" class=\"sv-string-viewer\">{{model.renderedHtml}}</span>\n<span *ngIf=\"model.hasHtml\" class=\"sv-string-viewer\" [innerHtml]=\"model.renderedHtml | safeHtml\"></span>", styles: [""], directives: [{ type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "safeHtml": i2.SafeHtmlPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: StringViewerComponent, decorators: [{
             type: Component,
             args: [{
@@ -38,4 +39,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 type: Input
             }] } });
 AngularComponentFactory.Instance.registerComponent(LocalizableString.defaultRenderer, StringViewerComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RyaW5nLXZpZXdlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvc3RyaW5nLXZpZXdlci5jb21wb25lbnQudHMiLCIuLi8uLi9zcmMvc3RyaW5nLXZpZXdlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQXFCLFNBQVMsRUFBVyxLQUFLLEVBQXVDLE1BQU0sZUFBZSxDQUFDO0FBQ2xILE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUNoRCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQzs7O0FBTzlELE1BQU0sT0FBTyxxQkFBcUI7SUFHaEMsWUFBb0IsaUJBQW9DO1FBQXBDLHNCQUFpQixHQUFqQixpQkFBaUIsQ0FBbUI7SUFBRyxDQUFDO0lBQzVELFNBQVM7UUFDUCxJQUFHLElBQUksQ0FBQyxLQUFLLEtBQUssSUFBSSxDQUFDLGFBQWEsRUFBRTtZQUNwQyxJQUFHLENBQUMsQ0FBQyxJQUFJLENBQUMsYUFBYSxFQUFFO2dCQUN2QixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQzthQUN6QztZQUNELElBQUcsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUU7Z0JBQ2YsSUFBSSxDQUFDLEtBQUssQ0FBQyxTQUFTLEdBQUcsR0FBRyxFQUFFLEdBQUcsSUFBSSxDQUFDLGlCQUFpQixDQUFDLGFBQWEsRUFBRSxDQUFDLENBQUMsQ0FBQyxDQUFDO2FBQzFFO1lBQ0QsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDO1NBQ2pDO0lBQ0gsQ0FBQztJQUNELGNBQWMsQ0FBQyxLQUF3QjtRQUNyQyxLQUFLLENBQUMsU0FBUyxHQUFHLEdBQUcsRUFBRSxHQUFFLENBQUMsQ0FBQztJQUM3QixDQUFDO0lBQ0QsV0FBVztRQUNULENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxJQUFJLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2xELENBQUM7O21IQXBCVSxxQkFBcUI7dUdBQXJCLHFCQUFxQiwrSENUbEMsOExBQzZGOzRGRFFoRixxQkFBcUI7a0JBTGpDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLDZEQUE2RDtvQkFDdkUsV0FBVyxFQUFFLGdDQUFnQztvQkFDN0MsU0FBUyxFQUFFLENBQUMsZ0NBQWdDLENBQUM7aUJBQzlDO3dHQUVVLEtBQUs7c0JBQWIsS0FBSzs7QUFxQlIsdUJBQXVCLENBQUMsUUFBUSxDQUFDLGlCQUFpQixDQUFDLGlCQUFpQixDQUFDLGVBQWUsRUFBRSxxQkFBcUIsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ2hhbmdlRGV0ZWN0b3JSZWYsIENvbXBvbmVudCwgRG9DaGVjaywgSW5wdXQsIE9uQ2hhbmdlcywgT25EZXN0cm95LCBTaW1wbGVDaGFuZ2VzIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IExvY2FsaXphYmxlU3RyaW5nIH0gZnJvbSBcInN1cnZleS1jb3JlXCI7XG5pbXBvcnQgeyBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeSB9IGZyb20gXCIuL2NvbXBvbmVudC1mYWN0b3J5XCI7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJzdi1uZy1zdHJpbmctdmlld2VyLCBzdHJpbmctdmlld2VyLCAnW3N2LW5nLXN0cmluZy12aWV3ZXJdJ1wiLFxuICB0ZW1wbGF0ZVVybDogXCIuL3N0cmluZy12aWV3ZXIuY29tcG9uZW50Lmh0bWxcIixcbiAgc3R5bGVVcmxzOiBbXCIuL3N0cmluZy12aWV3ZXIuY29tcG9uZW50LnNjc3NcIl1cbn0pXG5leHBvcnQgY2xhc3MgU3RyaW5nVmlld2VyQ29tcG9uZW50IGltcGxlbWVudHMgRG9DaGVjayB7XG4gIEBJbnB1dCgpIG1vZGVsITogTG9jYWxpemFibGVTdHJpbmc7XG4gIHByaXZhdGUgcHJldmlvdXNNb2RlbDogTG9jYWxpemFibGVTdHJpbmcgfCB1bmRlZmluZWQ7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgY2hhbmdlRGV0ZWN0b3JSZWY6IENoYW5nZURldGVjdG9yUmVmKSB7fVxuICBuZ0RvQ2hlY2soKTogdm9pZCB7XG4gICAgaWYodGhpcy5tb2RlbCAhPT0gdGhpcy5wcmV2aW91c01vZGVsKSB7XG4gICAgICBpZighIXRoaXMucHJldmlvdXNNb2RlbCkge1xuICAgICAgICB0aGlzLmNsZWFyT25DaGFuZ2VkKHRoaXMucHJldmlvdXNNb2RlbCk7XG4gICAgICB9XG4gICAgICBpZighIXRoaXMubW9kZWwpIHtcbiAgICAgICAgdGhpcy5tb2RlbC5vbkNoYW5nZWQgPSAoKSA9PiB7IHRoaXMuY2hhbmdlRGV0ZWN0b3JSZWYuZGV0ZWN0Q2hhbmdlcygpOyB9O1xuICAgICAgfVxuICAgICAgdGhpcy5wcmV2aW91c01vZGVsID0gdGhpcy5tb2RlbDtcbiAgICB9XG4gIH1cbiAgY2xlYXJPbkNoYW5nZWQobW9kZWw6IExvY2FsaXphYmxlU3RyaW5nKSB7XG4gICAgbW9kZWwub25DaGFuZ2VkID0gKCkgPT4ge307XG4gIH1cbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgISF0aGlzLm1vZGVsICYmIHRoaXMuY2xlYXJPbkNoYW5nZWQodGhpcy5tb2RlbCk7XG4gIH1cbn1cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KExvY2FsaXphYmxlU3RyaW5nLmRlZmF1bHRSZW5kZXJlciwgU3RyaW5nVmlld2VyQ29tcG9uZW50KTsiLCI8c3BhbiAqbmdJZj1cIiFtb2RlbC5oYXNIdG1sXCIgY2xhc3M9XCJzdi1zdHJpbmctdmlld2VyXCI+e3ttb2RlbC5yZW5kZXJlZEh0bWx9fTwvc3Bhbj5cbjxzcGFuICpuZ0lmPVwibW9kZWwuaGFzSHRtbFwiIGNsYXNzPVwic3Ytc3RyaW5nLXZpZXdlclwiIFtpbm5lckh0bWxdPVwibW9kZWwucmVuZGVyZWRIdG1sXCI+PC9zcGFuPiJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3RyaW5nLXZpZXdlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi9zcmMvc3RyaW5nLXZpZXdlci5jb21wb25lbnQudHMiLCIuLi8uLi9zcmMvc3RyaW5nLXZpZXdlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQXFCLFNBQVMsRUFBVyxLQUFLLEVBQXVDLE1BQU0sZUFBZSxDQUFDO0FBQ2xILE9BQU8sRUFBRSxpQkFBaUIsRUFBRSxNQUFNLGFBQWEsQ0FBQztBQUNoRCxPQUFPLEVBQUUsdUJBQXVCLEVBQUUsTUFBTSxxQkFBcUIsQ0FBQzs7OztBQU85RCxNQUFNLE9BQU8scUJBQXFCO0lBR2hDLFlBQW9CLGlCQUFvQztRQUFwQyxzQkFBaUIsR0FBakIsaUJBQWlCLENBQW1CO0lBQUcsQ0FBQztJQUM1RCxTQUFTO1FBQ1AsSUFBRyxJQUFJLENBQUMsS0FBSyxLQUFLLElBQUksQ0FBQyxhQUFhLEVBQUU7WUFDcEMsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRTtnQkFDdkIsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7YUFDekM7WUFDRCxJQUFHLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFO2dCQUNmLElBQUksQ0FBQyxLQUFLLENBQUMsU0FBUyxHQUFHLEdBQUcsRUFBRSxHQUFHLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQyxDQUFDLENBQUMsQ0FBQzthQUMxRTtZQUNELElBQUksQ0FBQyxhQUFhLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQztTQUNqQztJQUNILENBQUM7SUFDRCxjQUFjLENBQUMsS0FBd0I7UUFDckMsS0FBSyxDQUFDLFNBQVMsR0FBRyxHQUFHLEVBQUUsR0FBRSxDQUFDLENBQUM7SUFDN0IsQ0FBQztJQUNELFdBQVc7UUFDVCxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNsRCxDQUFDOzttSEFwQlUscUJBQXFCO3VHQUFyQixxQkFBcUIsK0hDVGxDLHlNQUN3Rzs0RkRRM0YscUJBQXFCO2tCQUxqQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSw2REFBNkQ7b0JBQ3ZFLFdBQVcsRUFBRSxnQ0FBZ0M7b0JBQzdDLFNBQVMsRUFBRSxDQUFDLGdDQUFnQyxDQUFDO2lCQUM5Qzt3R0FFVSxLQUFLO3NCQUFiLEtBQUs7O0FBcUJSLHVCQUF1QixDQUFDLFFBQVEsQ0FBQyxpQkFBaUIsQ0FBQyxpQkFBaUIsQ0FBQyxlQUFlLEVBQUUscUJBQXFCLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENoYW5nZURldGVjdG9yUmVmLCBDb21wb25lbnQsIERvQ2hlY2ssIElucHV0LCBPbkNoYW5nZXMsIE9uRGVzdHJveSwgU2ltcGxlQ2hhbmdlcyB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBMb2NhbGl6YWJsZVN0cmluZyB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQW5ndWxhckNvbXBvbmVudEZhY3RvcnkgfSBmcm9tIFwiLi9jb21wb25lbnQtZmFjdG9yeVwiO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3Ytbmctc3RyaW5nLXZpZXdlciwgc3RyaW5nLXZpZXdlciwgJ1tzdi1uZy1zdHJpbmctdmlld2VyXSdcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9zdHJpbmctdmlld2VyLmNvbXBvbmVudC5odG1sXCIsXG4gIHN0eWxlVXJsczogW1wiLi9zdHJpbmctdmlld2VyLmNvbXBvbmVudC5zY3NzXCJdXG59KVxuZXhwb3J0IGNsYXNzIFN0cmluZ1ZpZXdlckNvbXBvbmVudCBpbXBsZW1lbnRzIERvQ2hlY2sge1xuICBASW5wdXQoKSBtb2RlbCE6IExvY2FsaXphYmxlU3RyaW5nO1xuICBwcml2YXRlIHByZXZpb3VzTW9kZWw6IExvY2FsaXphYmxlU3RyaW5nIHwgdW5kZWZpbmVkO1xuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGNoYW5nZURldGVjdG9yUmVmOiBDaGFuZ2VEZXRlY3RvclJlZikge31cbiAgbmdEb0NoZWNrKCk6IHZvaWQge1xuICAgIGlmKHRoaXMubW9kZWwgIT09IHRoaXMucHJldmlvdXNNb2RlbCkge1xuICAgICAgaWYoISF0aGlzLnByZXZpb3VzTW9kZWwpIHtcbiAgICAgICAgdGhpcy5jbGVhck9uQ2hhbmdlZCh0aGlzLnByZXZpb3VzTW9kZWwpO1xuICAgICAgfVxuICAgICAgaWYoISF0aGlzLm1vZGVsKSB7XG4gICAgICAgIHRoaXMubW9kZWwub25DaGFuZ2VkID0gKCkgPT4geyB0aGlzLmNoYW5nZURldGVjdG9yUmVmLmRldGVjdENoYW5nZXMoKTsgfTtcbiAgICAgIH1cbiAgICAgIHRoaXMucHJldmlvdXNNb2RlbCA9IHRoaXMubW9kZWw7XG4gICAgfVxuICB9XG4gIGNsZWFyT25DaGFuZ2VkKG1vZGVsOiBMb2NhbGl6YWJsZVN0cmluZykge1xuICAgIG1vZGVsLm9uQ2hhbmdlZCA9ICgpID0+IHt9O1xuICB9XG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgICEhdGhpcy5tb2RlbCAmJiB0aGlzLmNsZWFyT25DaGFuZ2VkKHRoaXMubW9kZWwpO1xuICB9XG59XG5Bbmd1bGFyQ29tcG9uZW50RmFjdG9yeS5JbnN0YW5jZS5yZWdpc3RlckNvbXBvbmVudChMb2NhbGl6YWJsZVN0cmluZy5kZWZhdWx0UmVuZGVyZXIsIFN0cmluZ1ZpZXdlckNvbXBvbmVudCk7IiwiPHNwYW4gKm5nSWY9XCIhbW9kZWwuaGFzSHRtbFwiIGNsYXNzPVwic3Ytc3RyaW5nLXZpZXdlclwiPnt7bW9kZWwucmVuZGVyZWRIdG1sfX08L3NwYW4+XG48c3BhbiAqbmdJZj1cIm1vZGVsLmhhc0h0bWxcIiBjbGFzcz1cInN2LXN0cmluZy12aWV3ZXJcIiBbaW5uZXJIdG1sXT1cIm1vZGVsLnJlbmRlcmVkSHRtbCB8IHNhZmVIdG1sXCI+PC9zcGFuPiJdfQ==

package/esm2015/survey-content.component.js

@@ -48,6 +48,7 @@ export class SurveyContentComponent extends BaseAngular {
     ngAfterViewChecked() {
         if (!!this.model && this.isSurveyUpdated) {
             this.model.afterRenderSurvey(this.rootEl.nativeElement);
+            this.model.startTimerFromUI();
         }
         super.ngAfterViewChecked();
     }
@@ -67,4 +68,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                 args: ["surveyContainer", { static: false }]
             }] } });
 AngularComponentFactory.Instance.registerComponent("survey", SurveyContentComponent);
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3VydmV5LWNvbnRlbnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3N1cnZleS1jb250ZW50LmNvbXBvbmVudC50cyIsIi4uLy4uL3NyYy9zdXJ2ZXktY29udGVudC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLEVBQWlCLFNBQVMsRUFBYyxLQUFLLEVBQVUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9GLE9BQU8sRUFBZSxXQUFXLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFDdkQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzdDLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7Ozs7QUFLOUQsTUFBTSxPQUFPLHNCQUF1QixTQUFRLFdBQXdCO0lBSnBFOztRQU9VLG9CQUFlLEdBQVksS0FBSyxDQUFDO0tBcUMxQztJQXBDVyxRQUFRO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNwQixDQUFDO0lBQ2tCLGNBQWM7UUFDL0IsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRTtZQUN2QixJQUFJLENBQUMsYUFBYSxDQUFDLHFCQUFxQixFQUFFLENBQUM7WUFDM0MsSUFBSSxDQUFDLGFBQWEsQ0FBQyxjQUFjLEdBQVEsU0FBUyxDQUFDO1NBQ3BEO1FBQ0QsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNmLElBQUksQ0FBQyxLQUFLLENBQUMsY0FBYyxHQUFHLEdBQUcsRUFBRTtnQkFDL0IsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQ3ZCLENBQUMsQ0FBQztTQUNIO1FBQ0QsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUM7SUFDOUIsQ0FBQztJQUNRLFFBQVE7UUFDZixLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDakIsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLGlCQUFpQixDQUFDLEVBQUU7WUFDaEQsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQzNCO0lBQ0gsQ0FBQztJQUNRLFdBQVc7UUFDbEIsS0FBSyxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ3BCLElBQUcsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDZixJQUFJLENBQUMsS0FBSyxDQUFDLGNBQWMsR0FBUSxTQUFTLENBQUM7U0FDNUM7SUFDSCxDQUFDO0lBQ0QsZUFBZTtRQUNiLElBQUksQ0FBQyxlQUFlLEdBQUcsSUFBSSxDQUFDO0lBQzlCLENBQUM7SUFDUSxrQkFBa0I7UUFDekIsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsZUFBZSxFQUFFO1lBQ3ZDLElBQUksQ0FBQyxLQUFLLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQztTQUN6RDtRQUNELEtBQUssQ0FBQyxrQkFBa0IsRUFBRSxDQUFDO0lBQzdCLENBQUM7O29IQXZDVSxzQkFBc0I7d0dBQXRCLHNCQUFzQixvTkNUbkMsODJGQW9DYzs0RkQzQkQsc0JBQXNCO2tCQUpsQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxnQkFBZ0I7b0JBQzFCLFdBQVcsRUFBRSxpQ0FBaUM7aUJBQzdDOzhCQUVRLEtBQUs7c0JBQWIsS0FBSztnQkFDMkMsTUFBTTtzQkFBdEQsU0FBUzt1QkFBQyxpQkFBaUIsRUFBRSxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUU7O0FBd0NqRCx1QkFBdUIsQ0FBQyxRQUFRLENBQUMsaUJBQWlCLENBQUMsUUFBUSxFQUFFLHNCQUFzQixDQUFDLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJcbmltcG9ydCB7IEFmdGVyVmlld0luaXQsIENvbXBvbmVudCwgRWxlbWVudFJlZiwgSW5wdXQsIE9uSW5pdCwgVmlld0NoaWxkIH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IFN1cnZleU1vZGVsLCBTdmdSZWdpc3RyeSB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuaW1wb3J0IHsgQmFzZUFuZ3VsYXIgfSBmcm9tIFwiLi9iYXNlLWFuZ3VsYXJcIjtcbmltcG9ydCB7IEFuZ3VsYXJDb21wb25lbnRGYWN0b3J5IH0gZnJvbSBcIi4vY29tcG9uZW50LWZhY3RvcnlcIjtcbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogXCJzdXJ2ZXktY29udGVudFwiLFxuICB0ZW1wbGF0ZVVybDogXCIuL3N1cnZleS1jb250ZW50LmNvbXBvbmVudC5odG1sXCJcbiAgfSlcbmV4cG9ydCBjbGFzcyBTdXJ2ZXlDb250ZW50Q29tcG9uZW50IGV4dGVuZHMgQmFzZUFuZ3VsYXI8U3VydmV5TW9kZWw+IGltcGxlbWVudHMgT25Jbml0LCBBZnRlclZpZXdJbml0IHtcbiAgQElucHV0KCkgbW9kZWwhOiBTdXJ2ZXlNb2RlbDtcbiAgQFZpZXdDaGlsZChcInN1cnZleUNvbnRhaW5lclwiLCB7IHN0YXRpYzogZmFsc2UgfSkgcm9vdEVsITogRWxlbWVudFJlZjxIVE1MRGl2RWxlbWVudD47XG4gIHByaXZhdGUgaXNTdXJ2ZXlVcGRhdGVkOiBib29sZWFuID0gZmFsc2U7XG4gIHByb3RlY3RlZCBnZXRNb2RlbCgpOiBTdXJ2ZXlNb2RlbCB7XG4gICAgcmV0dXJuIHRoaXMubW9kZWw7XG4gIH1cbiAgcHJvdGVjdGVkIG92ZXJyaWRlIG9uTW9kZWxDaGFuZ2VkKCk6IHZvaWQge1xuICAgIGlmKCEhdGhpcy5wcmV2aW91c01vZGVsKSB7XG4gICAgICB0aGlzLnByZXZpb3VzTW9kZWwuZGVzdHJveVJlc2l6ZU9ic2VydmVyKCk7XG4gICAgICB0aGlzLnByZXZpb3VzTW9kZWwucmVuZGVyQ2FsbGJhY2sgPSA8YW55PnVuZGVmaW5lZDtcbiAgICB9XG4gICAgaWYoISF0aGlzLm1vZGVsKSB7XG4gICAgICB0aGlzLm1vZGVsLnJlbmRlckNhbGxiYWNrID0gKCkgPT4ge1xuICAgICAgICB0aGlzLmRldGVjdENoYW5nZXMoKTtcbiAgICAgIH07XG4gICAgfVxuICAgIHRoaXMuaXNTdXJ2ZXlVcGRhdGVkID0gdHJ1ZTtcbiAgfVxuICBvdmVycmlkZSBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICBzdXBlci5uZ09uSW5pdCgpO1xuICAgIGlmKCEhdGhpcy5tb2RlbCAmJiB0aGlzLm1vZGVsW1wibmVlZFJlbmRlckljb25zXCJdKSB7XG4gICAgICBTdmdSZWdpc3RyeS5yZW5kZXJJY29ucygpO1xuICAgIH1cbiAgfVxuICBvdmVycmlkZSBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICBzdXBlci5uZ09uRGVzdHJveSgpO1xuICAgIGlmKCEhdGhpcy5tb2RlbCkge1xuICAgICAgdGhpcy5tb2RlbC5yZW5kZXJDYWxsYmFjayA9IDxhbnk+dW5kZWZpbmVkO1xuICAgIH1cbiAgfVxuICBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgdGhpcy5pc1N1cnZleVVwZGF0ZWQgPSB0cnVlO1xuICB9XG4gIG92ZXJyaWRlIG5nQWZ0ZXJWaWV3Q2hlY2tlZCgpOiB2b2lkIHtcbiAgICBpZighIXRoaXMubW9kZWwgJiYgdGhpcy5pc1N1cnZleVVwZGF0ZWQpIHtcbiAgICAgIHRoaXMubW9kZWwuYWZ0ZXJSZW5kZXJTdXJ2ZXkodGhpcy5yb290RWwubmF0aXZlRWxlbWVudCk7XG4gICAgfVxuICAgIHN1cGVyLm5nQWZ0ZXJWaWV3Q2hlY2tlZCgpO1xuICB9XG59XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwic3VydmV5XCIsIFN1cnZleUNvbnRlbnRDb21wb25lbnQpOyIsIjxuZy10ZW1wbGF0ZSAjdGVtcGxhdGU+XG4gIDxkaXYgI3N1cnZleUNvbnRhaW5lciAqbmdJZj1cIiEhbW9kZWxcIiBbY2xhc3NdPVwibW9kZWwuZ2V0Um9vdENzcygpXCIgW3N0eWxlLmJhY2tncm91bmRJbWFnZV09XCJtb2RlbC5yZW5kZXJCYWNrZ3JvdW5kSW1hZ2VcIiBbc3R5bGUuYmFja2dyb3VuZFNpemVdPVwibW9kZWwuYmFja2dyb3VuZEltYWdlRml0XCI+XG4gICAgPGZvcm0gb25zdWJtaXQ9XCJyZXR1cm4gZmFsc2U7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJtb2RlbC5yZW5kZXJCYWNrZ3JvdW5kT3BhY2l0eVwiPlxuICAgICAgPGRpdiBjbGFzcz1cInN2X2N1c3RvbV9oZWFkZXJcIiBbaGlkZGVuXT1cIm1vZGVsLmhhc0xvZ29cIj48L2Rpdj5cbiAgICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzcy5jb250YWluZXJcIj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIm1vZGVsLnJlbmRlcmVkSGFzSGVhZGVyXCIgW2NsYXNzXT1cIm1vZGVsLmNzcy5oZWFkZXJcIiBbc3VydmV5XT1cIm1vZGVsXCIgc3Ytbmctc3VydmV5LWhlYWRlcj48L2Rpdj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2hlYWRlcicsIG5lZWRSZW5kZXJXcmFwcGVyOiBmYWxzZSB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuaXNTaG93aW5nUGFnZVwiIFtjbGFzc109XCJtb2RlbC5ib2R5Q29udGFpbmVyQ3NzXCI+XG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2xlZnQnIH0gfVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuYm9keUNzc1wiIFtzdHlsZS5tYXhXaWR0aF09XCJtb2RlbC5yZW5kZXJlZFdpZHRoXCIgW2lkXT1cIm1vZGVsLmFjdGl2ZVBhZ2UgPyBtb2RlbC5hY3RpdmVQYWdlLmlkIDogJydcIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBbY29tcG9uZW50XT1cInsgbmFtZTogJ3N2LWNvbXBvbmVudHMtY29udGFpbmVyJywgZGF0YTogeyBzdXJ2ZXk6IG1vZGVsLCBjb250YWluZXI6ICdjb250ZW50VG9wJyB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICAgICAgPCEtLSBrbyBpZjogYWN0aXZlUGFnZSAtLT5cbiAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1vZGVsLmFjdGl2ZVBhZ2VcIj5cbiAgICAgICAgICAgICAgICAgIDxzdi1uZy1wYWdlIFttb2RlbF09XCJtb2RlbC5hY3RpdmVQYWdlXCIgW3N1cnZleV09XCJtb2RlbFwiPjwvc3YtbmctcGFnZT5cbiAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgIDwhLS0ga28gaWY6IGFjdGl2ZVBhZ2Uucm93cy5sZW5ndGggPT0gMCAmJiAkZGF0YS5lbXB0eVBhZ2VUZW1wbGF0ZSAtLT5cbiAgICAgICAgICAgICAgPCEtLSBrbyB0ZW1wbGF0ZTogeyBuYW1lOiBlbXB0eVBhZ2VUZW1wbGF0ZSwgZGF0YTogJGRhdGEuZW1wdHlQYWdlVGVtcGxhdGVEYXRhIHx8ICRkYXRhIH0gLS0+XG4gICAgICAgICAgICAgIDwhLS0gL2tvIC0tPlxuICAgICAgICAgICAgICA8IS0tIC9rbyAtLT5cbiAgICAgICAgICAgIDwhLS0gL2tvIC0tPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2NvbnRlbnRCb3R0b20nIH0gfVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ3JpZ2h0JyB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2Zvb3RlcicsIG5lZWRSZW5kZXJXcmFwcGVyOiBmYWxzZSB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuc3RhdGUgPT09ICdjb21wbGV0ZWQnICYmIG1vZGVsLnNob3dDb21wbGV0ZWRQYWdlXCIgW2NsYXNzXT1cIm1vZGVsLmNvbXBsZXRlZENzc1wiXG4gICAgICAgICAgW2lubmVySHRtbF09XCJtb2RlbC5wcm9jZXNzZWRDb21wbGV0ZWRIdG1sXCI+PC9kaXY+XG4gICAgICAgIDxkaXYgKm5nSWY9XCJtb2RlbC5zdGF0ZSA9PT0gJ2NvbXBsZXRlZGJlZm9yZSdcIiBbY2xhc3NdPVwibW9kZWwuY3NzLmJvZHlcIlxuICAgICAgICAgIFtpbm5lckh0bWxdPVwibW9kZWwucHJvY2Vzc2VkQ29tcGxldGVkQmVmb3JlSHRtbFwiPjwvZGl2PlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuc3RhdGUgPT09ICdsb2FkaW5nJ1wiIFtjbGFzc109XCJtb2RlbC5jc3MuYm9keVwiIFtpbm5lckh0bWxdPVwibW9kZWwucHJvY2Vzc2VkTG9hZGluZ0h0bWxcIj48L2Rpdj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIm1vZGVsLnN0YXRlID09PSAnZW1wdHknXCIgW2NsYXNzXT1cIm1vZGVsLmNzcy5ib2R5RW1wdHlcIj57e21vZGVsLmVtcHR5U3VydmV5VGV4dH19PC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Zvcm0+XG4gICAgPHN2LWJyYW5kLWluZm8gKm5nSWY9XCJtb2RlbC5zaG93QnJhbmRJbmZvXCI+PC9zdi1icmFuZC1pbmZvPlxuICAgIDxzdi1ub3RpZmllciBbbm90aWZpZXJdPVwibW9kZWwubm90aWZpZXJcIj48L3N2LW5vdGlmaWVyPlxuICA8L2Rpdj5cbjwvbmctdGVtcGxhdGU+Il19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3VydmV5LWNvbnRlbnQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vc3JjL3N1cnZleS1jb250ZW50LmNvbXBvbmVudC50cyIsIi4uLy4uL3NyYy9zdXJ2ZXktY29udGVudC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFDQSxPQUFPLEVBQWlCLFNBQVMsRUFBYyxLQUFLLEVBQVUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQy9GLE9BQU8sRUFBZSxXQUFXLEVBQUUsTUFBTSxhQUFhLENBQUM7QUFDdkQsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLGdCQUFnQixDQUFDO0FBQzdDLE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7Ozs7QUFLOUQsTUFBTSxPQUFPLHNCQUF1QixTQUFRLFdBQXdCO0lBSnBFOztRQU9VLG9CQUFlLEdBQVksS0FBSyxDQUFDO0tBc0MxQztJQXJDVyxRQUFRO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNwQixDQUFDO0lBQ2tCLGNBQWM7UUFDL0IsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLGFBQWEsRUFBRTtZQUN2QixJQUFJLENBQUMsYUFBYSxDQUFDLHFCQUFxQixFQUFFLENBQUM7WUFDM0MsSUFBSSxDQUFDLGFBQWEsQ0FBQyxjQUFjLEdBQVEsU0FBUyxDQUFDO1NBQ3BEO1FBQ0QsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNmLElBQUksQ0FBQyxLQUFLLENBQUMsY0FBYyxHQUFHLEdBQUcsRUFBRTtnQkFDL0IsSUFBSSxDQUFDLGFBQWEsRUFBRSxDQUFDO1lBQ3ZCLENBQUMsQ0FBQztTQUNIO1FBQ0QsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUM7SUFDOUIsQ0FBQztJQUNRLFFBQVE7UUFDZixLQUFLLENBQUMsUUFBUSxFQUFFLENBQUM7UUFDakIsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLGlCQUFpQixDQUFDLEVBQUU7WUFDaEQsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDO1NBQzNCO0lBQ0gsQ0FBQztJQUNRLFdBQVc7UUFDbEIsS0FBSyxDQUFDLFdBQVcsRUFBRSxDQUFDO1FBQ3BCLElBQUcsQ0FBQyxDQUFDLElBQUksQ0FBQyxLQUFLLEVBQUU7WUFDZixJQUFJLENBQUMsS0FBSyxDQUFDLGNBQWMsR0FBUSxTQUFTLENBQUM7U0FDNUM7SUFDSCxDQUFDO0lBQ0QsZUFBZTtRQUNiLElBQUksQ0FBQyxlQUFlLEdBQUcsSUFBSSxDQUFDO0lBQzlCLENBQUM7SUFDUSxrQkFBa0I7UUFDekIsSUFBRyxDQUFDLENBQUMsSUFBSSxDQUFDLEtBQUssSUFBSSxJQUFJLENBQUMsZUFBZSxFQUFFO1lBQ3ZDLElBQUksQ0FBQyxLQUFLLENBQUMsaUJBQWlCLENBQUMsSUFBSSxDQUFDLE1BQU0sQ0FBQyxhQUFhLENBQUMsQ0FBQztZQUN4RCxJQUFJLENBQUMsS0FBSyxDQUFDLGdCQUFnQixFQUFFLENBQUM7U0FDL0I7UUFDRCxLQUFLLENBQUMsa0JBQWtCLEVBQUUsQ0FBQztJQUM3QixDQUFDOztvSEF4Q1Usc0JBQXNCO3dHQUF0QixzQkFBc0Isb05DVG5DLDgyRkFvQ2M7NEZEM0JELHNCQUFzQjtrQkFKbEMsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsZ0JBQWdCO29CQUMxQixXQUFXLEVBQUUsaUNBQWlDO2lCQUM3Qzs4QkFFUSxLQUFLO3NCQUFiLEtBQUs7Z0JBQzJDLE1BQU07c0JBQXRELFNBQVM7dUJBQUMsaUJBQWlCLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFOztBQXlDakQsdUJBQXVCLENBQUMsUUFBUSxDQUFDLGlCQUFpQixDQUFDLFFBQVEsRUFBRSxzQkFBc0IsQ0FBQyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiXG5pbXBvcnQgeyBBZnRlclZpZXdJbml0LCBDb21wb25lbnQsIEVsZW1lbnRSZWYsIElucHV0LCBPbkluaXQsIFZpZXdDaGlsZCB9IGZyb20gXCJAYW5ndWxhci9jb3JlXCI7XG5pbXBvcnQgeyBTdXJ2ZXlNb2RlbCwgU3ZnUmVnaXN0cnkgfSBmcm9tIFwic3VydmV5LWNvcmVcIjtcbmltcG9ydCB7IEJhc2VBbmd1bGFyIH0gZnJvbSBcIi4vYmFzZS1hbmd1bGFyXCI7XG5pbXBvcnQgeyBBbmd1bGFyQ29tcG9uZW50RmFjdG9yeSB9IGZyb20gXCIuL2NvbXBvbmVudC1mYWN0b3J5XCI7XG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6IFwic3VydmV5LWNvbnRlbnRcIixcbiAgdGVtcGxhdGVVcmw6IFwiLi9zdXJ2ZXktY29udGVudC5jb21wb25lbnQuaHRtbFwiXG4gIH0pXG5leHBvcnQgY2xhc3MgU3VydmV5Q29udGVudENvbXBvbmVudCBleHRlbmRzIEJhc2VBbmd1bGFyPFN1cnZleU1vZGVsPiBpbXBsZW1lbnRzIE9uSW5pdCwgQWZ0ZXJWaWV3SW5pdCB7XG4gIEBJbnB1dCgpIG1vZGVsITogU3VydmV5TW9kZWw7XG4gIEBWaWV3Q2hpbGQoXCJzdXJ2ZXlDb250YWluZXJcIiwgeyBzdGF0aWM6IGZhbHNlIH0pIHJvb3RFbCE6IEVsZW1lbnRSZWY8SFRNTERpdkVsZW1lbnQ+O1xuICBwcml2YXRlIGlzU3VydmV5VXBkYXRlZDogYm9vbGVhbiA9IGZhbHNlO1xuICBwcm90ZWN0ZWQgZ2V0TW9kZWwoKTogU3VydmV5TW9kZWwge1xuICAgIHJldHVybiB0aGlzLm1vZGVsO1xuICB9XG4gIHByb3RlY3RlZCBvdmVycmlkZSBvbk1vZGVsQ2hhbmdlZCgpOiB2b2lkIHtcbiAgICBpZighIXRoaXMucHJldmlvdXNNb2RlbCkge1xuICAgICAgdGhpcy5wcmV2aW91c01vZGVsLmRlc3Ryb3lSZXNpemVPYnNlcnZlcigpO1xuICAgICAgdGhpcy5wcmV2aW91c01vZGVsLnJlbmRlckNhbGxiYWNrID0gPGFueT51bmRlZmluZWQ7XG4gICAgfVxuICAgIGlmKCEhdGhpcy5tb2RlbCkge1xuICAgICAgdGhpcy5tb2RlbC5yZW5kZXJDYWxsYmFjayA9ICgpID0+IHtcbiAgICAgICAgdGhpcy5kZXRlY3RDaGFuZ2VzKCk7XG4gICAgICB9O1xuICAgIH1cbiAgICB0aGlzLmlzU3VydmV5VXBkYXRlZCA9IHRydWU7XG4gIH1cbiAgb3ZlcnJpZGUgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgc3VwZXIubmdPbkluaXQoKTtcbiAgICBpZighIXRoaXMubW9kZWwgJiYgdGhpcy5tb2RlbFtcIm5lZWRSZW5kZXJJY29uc1wiXSkge1xuICAgICAgU3ZnUmVnaXN0cnkucmVuZGVySWNvbnMoKTtcbiAgICB9XG4gIH1cbiAgb3ZlcnJpZGUgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgc3VwZXIubmdPbkRlc3Ryb3koKTtcbiAgICBpZighIXRoaXMubW9kZWwpIHtcbiAgICAgIHRoaXMubW9kZWwucmVuZGVyQ2FsbGJhY2sgPSA8YW55PnVuZGVmaW5lZDtcbiAgICB9XG4gIH1cbiAgbmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuICAgIHRoaXMuaXNTdXJ2ZXlVcGRhdGVkID0gdHJ1ZTtcbiAgfVxuICBvdmVycmlkZSBuZ0FmdGVyVmlld0NoZWNrZWQoKTogdm9pZCB7XG4gICAgaWYoISF0aGlzLm1vZGVsICYmIHRoaXMuaXNTdXJ2ZXlVcGRhdGVkKSB7XG4gICAgICB0aGlzLm1vZGVsLmFmdGVyUmVuZGVyU3VydmV5KHRoaXMucm9vdEVsLm5hdGl2ZUVsZW1lbnQpO1xuICAgICAgdGhpcy5tb2RlbC5zdGFydFRpbWVyRnJvbVVJKCk7XG4gICAgfVxuICAgIHN1cGVyLm5nQWZ0ZXJWaWV3Q2hlY2tlZCgpO1xuICB9XG59XG5cbkFuZ3VsYXJDb21wb25lbnRGYWN0b3J5Lkluc3RhbmNlLnJlZ2lzdGVyQ29tcG9uZW50KFwic3VydmV5XCIsIFN1cnZleUNvbnRlbnRDb21wb25lbnQpOyIsIjxuZy10ZW1wbGF0ZSAjdGVtcGxhdGU+XG4gIDxkaXYgI3N1cnZleUNvbnRhaW5lciAqbmdJZj1cIiEhbW9kZWxcIiBbY2xhc3NdPVwibW9kZWwuZ2V0Um9vdENzcygpXCIgW3N0eWxlLmJhY2tncm91bmRJbWFnZV09XCJtb2RlbC5yZW5kZXJCYWNrZ3JvdW5kSW1hZ2VcIiBbc3R5bGUuYmFja2dyb3VuZFNpemVdPVwibW9kZWwuYmFja2dyb3VuZEltYWdlRml0XCI+XG4gICAgPGZvcm0gb25zdWJtaXQ9XCJyZXR1cm4gZmFsc2U7XCIgW3N0eWxlLmJhY2tncm91bmRDb2xvcl09XCJtb2RlbC5yZW5kZXJCYWNrZ3JvdW5kT3BhY2l0eVwiPlxuICAgICAgPGRpdiBjbGFzcz1cInN2X2N1c3RvbV9oZWFkZXJcIiBbaGlkZGVuXT1cIm1vZGVsLmhhc0xvZ29cIj48L2Rpdj5cbiAgICAgIDxkaXYgW2NsYXNzXT1cIm1vZGVsLmNzcy5jb250YWluZXJcIj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIm1vZGVsLnJlbmRlcmVkSGFzSGVhZGVyXCIgW2NsYXNzXT1cIm1vZGVsLmNzcy5oZWFkZXJcIiBbc3VydmV5XT1cIm1vZGVsXCIgc3Ytbmctc3VydmV5LWhlYWRlcj48L2Rpdj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2hlYWRlcicsIG5lZWRSZW5kZXJXcmFwcGVyOiBmYWxzZSB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuaXNTaG93aW5nUGFnZVwiIFtjbGFzc109XCJtb2RlbC5ib2R5Q29udGFpbmVyQ3NzXCI+XG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2xlZnQnIH0gfVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgICAgPGRpdiBbY2xhc3NdPVwibW9kZWwuYm9keUNzc1wiIFtzdHlsZS5tYXhXaWR0aF09XCJtb2RlbC5yZW5kZXJlZFdpZHRoXCIgW2lkXT1cIm1vZGVsLmFjdGl2ZVBhZ2UgPyBtb2RlbC5hY3RpdmVQYWdlLmlkIDogJydcIj5cbiAgICAgICAgICAgIDxuZy10ZW1wbGF0ZSBbY29tcG9uZW50XT1cInsgbmFtZTogJ3N2LWNvbXBvbmVudHMtY29udGFpbmVyJywgZGF0YTogeyBzdXJ2ZXk6IG1vZGVsLCBjb250YWluZXI6ICdjb250ZW50VG9wJyB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICAgICAgPCEtLSBrbyBpZjogYWN0aXZlUGFnZSAtLT5cbiAgICAgICAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm1vZGVsLmFjdGl2ZVBhZ2VcIj5cbiAgICAgICAgICAgICAgICAgIDxzdi1uZy1wYWdlIFttb2RlbF09XCJtb2RlbC5hY3RpdmVQYWdlXCIgW3N1cnZleV09XCJtb2RlbFwiPjwvc3YtbmctcGFnZT5cbiAgICAgICAgICAgICAgPC9uZy1jb250YWluZXI+XG4gICAgICAgICAgICAgIDwhLS0ga28gaWY6IGFjdGl2ZVBhZ2Uucm93cy5sZW5ndGggPT0gMCAmJiAkZGF0YS5lbXB0eVBhZ2VUZW1wbGF0ZSAtLT5cbiAgICAgICAgICAgICAgPCEtLSBrbyB0ZW1wbGF0ZTogeyBuYW1lOiBlbXB0eVBhZ2VUZW1wbGF0ZSwgZGF0YTogJGRhdGEuZW1wdHlQYWdlVGVtcGxhdGVEYXRhIHx8ICRkYXRhIH0gLS0+XG4gICAgICAgICAgICAgIDwhLS0gL2tvIC0tPlxuICAgICAgICAgICAgICA8IS0tIC9rbyAtLT5cbiAgICAgICAgICAgIDwhLS0gL2tvIC0tPlxuICAgICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2NvbnRlbnRCb3R0b20nIH0gfVwiPjwvbmctdGVtcGxhdGU+XG4gICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ3JpZ2h0JyB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8L2Rpdj5cbiAgICAgICAgPG5nLXRlbXBsYXRlIFtjb21wb25lbnRdPVwieyBuYW1lOiAnc3YtY29tcG9uZW50cy1jb250YWluZXInLCBkYXRhOiB7IHN1cnZleTogbW9kZWwsIGNvbnRhaW5lcjogJ2Zvb3RlcicsIG5lZWRSZW5kZXJXcmFwcGVyOiBmYWxzZSB9IH1cIj48L25nLXRlbXBsYXRlPlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuc3RhdGUgPT09ICdjb21wbGV0ZWQnICYmIG1vZGVsLnNob3dDb21wbGV0ZWRQYWdlXCIgW2NsYXNzXT1cIm1vZGVsLmNvbXBsZXRlZENzc1wiXG4gICAgICAgICAgW2lubmVySHRtbF09XCJtb2RlbC5wcm9jZXNzZWRDb21wbGV0ZWRIdG1sXCI+PC9kaXY+XG4gICAgICAgIDxkaXYgKm5nSWY9XCJtb2RlbC5zdGF0ZSA9PT0gJ2NvbXBsZXRlZGJlZm9yZSdcIiBbY2xhc3NdPVwibW9kZWwuY3NzLmJvZHlcIlxuICAgICAgICAgIFtpbm5lckh0bWxdPVwibW9kZWwucHJvY2Vzc2VkQ29tcGxldGVkQmVmb3JlSHRtbFwiPjwvZGl2PlxuICAgICAgICA8ZGl2ICpuZ0lmPVwibW9kZWwuc3RhdGUgPT09ICdsb2FkaW5nJ1wiIFtjbGFzc109XCJtb2RlbC5jc3MuYm9keVwiIFtpbm5lckh0bWxdPVwibW9kZWwucHJvY2Vzc2VkTG9hZGluZ0h0bWxcIj48L2Rpdj5cbiAgICAgICAgPGRpdiAqbmdJZj1cIm1vZGVsLnN0YXRlID09PSAnZW1wdHknXCIgW2NsYXNzXT1cIm1vZGVsLmNzcy5ib2R5RW1wdHlcIj57e21vZGVsLmVtcHR5U3VydmV5VGV4dH19PC9kaXY+XG4gICAgICA8L2Rpdj5cbiAgICA8L2Zvcm0+XG4gICAgPHN2LWJyYW5kLWluZm8gKm5nSWY9XCJtb2RlbC5zaG93QnJhbmRJbmZvXCI+PC9zdi1icmFuZC1pbmZvPlxuICAgIDxzdi1ub3RpZmllciBbbm90aWZpZXJdPVwibW9kZWwubm90aWZpZXJcIj48L3N2LW5vdGlmaWVyPlxuICA8L2Rpdj5cbjwvbmctdGVtcGxhdGU+Il19

package/esm2015/utils/ng-key2click.directive.js

@@ -5,7 +5,7 @@ export class Key2ClickDirective {
     constructor(el) {
         this.el = el;
         this.isSubscribed = false;
-        this.options = Key2ClickDirective.defaultOptions;
+        this.options = Object.assign({}, Key2ClickDirective.defaultOptions);
         this.onkeyup = (evt) => {
             evt.preventDefault();
             evt.stopPropagation();
@@ -27,8 +27,8 @@ export class Key2ClickDirective {
         if (this.isSubscribed)
             return;
         this.element.tabIndex = 0;
-        this.element.addEventListener("keyup", this.onkeyup);
-        this.element.addEventListener("keydown", this.onkeydown);
+        this.element.addEventListener("keyup", this.onkeyup.bind(this));
+        this.element.addEventListener("keydown", this.onkeydown.bind(this));
         this.element.addEventListener("blur", this.blur);
         this.isSubscribed = true;
     }
@@ -36,8 +36,8 @@ export class Key2ClickDirective {
         if (!this.isSubscribed)
             return;
         this.element.tabIndex = -1;
-        this.element.removeEventListener("keyup", this.onkeyup);
-        this.element.removeEventListener("keydown", this.onkeydown);
+        this.element.removeEventListener("keyup", this.onkeyup.bind(this));
+        this.element.removeEventListener("keydown", this.onkeydown.bind(this));
         this.element.removeEventListener("blur", this.blur);
         this.isSubscribed = false;
     }
@@ -66,4 +66,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
         }], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { key2click: [{
                 type: Input
             }] } });
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmcta2V5MmNsaWNrLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy91dGlscy9uZy1rZXkyY2xpY2suZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsS0FBSyxFQUF1QyxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUUsZUFBZSxFQUFFLGFBQWEsRUFBRSxlQUFlLEVBQTJCLE1BQU0sYUFBYSxDQUFDOztBQUt2RyxNQUFNLE9BQU8sa0JBQWtCO0lBbUI3QixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQWpCMUIsaUJBQVksR0FBRyxLQUFLLENBQUM7UUFFN0IsWUFBTyxHQUE2QixrQkFBa0IsQ0FBQyxjQUFjLENBQUM7UUFNOUQsWUFBTyxHQUFHLENBQUMsR0FBUSxFQUFFLEVBQUU7WUFDN0IsR0FBRyxDQUFDLGNBQWMsRUFBRSxDQUFDO1lBQ3JCLEdBQUcsQ0FBQyxlQUFlLEVBQUUsQ0FBQztZQUN0QixhQUFhLENBQUMsR0FBRyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztZQUNqQyxPQUFPLEtBQUssQ0FBQztRQUNmLENBQUMsQ0FBQTtRQUtDLElBQUksQ0FBQyx1QkFBdUIsRUFBRSxDQUFDO0lBQ2pDLENBQUM7SUFkTyxTQUFTLENBQUUsR0FBUTtRQUN6QixlQUFlLENBQUMsR0FBRyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztJQUNyQyxDQUFDO0lBT08sSUFBSSxDQUFFLEdBQVE7UUFDcEIsZUFBZSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ3ZCLENBQUM7SUFLRCxJQUFJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDO0lBQy9CLENBQUM7SUFFRCx1QkFBdUI7UUFDckIsSUFBRyxJQUFJLENBQUMsWUFBWTtZQUFFLE9BQU87UUFFN0IsSUFBSSxDQUFDLE9BQU8sQ0FBQyxRQUFRLEdBQUcsQ0FBQyxDQUFDO1FBQzFCLElBQUksQ0FBQyxPQUFPLENBQUMsZ0JBQWdCLENBQUMsT0FBTyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUNyRCxJQUFJLENBQUMsT0FBTyxDQUFDLGdCQUFnQixDQUFDLFNBQVMsRUFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLENBQUM7UUFDekQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxnQkFBZ0IsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRWpELElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO0lBQzNCLENBQUM7SUFDRCx5QkFBeUI7UUFDdkIsSUFBRyxDQUFDLElBQUksQ0FBQyxZQUFZO1lBQUUsT0FBTztRQUU5QixJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsR0FBRyxDQUFDLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsT0FBTyxDQUFDLG1CQUFtQixDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDeEQsSUFBSSxDQUFDLE9BQU8sQ0FBQyxtQkFBbUIsQ0FBQyxTQUFTLEVBQUUsSUFBSSxDQUFDLFNBQVMsQ0FBQyxDQUFDO1FBQzVELElBQUksQ0FBQyxPQUFPLENBQUMsbUJBQW1CLENBQUMsTUFBTSxFQUFFLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztRQUVwRCxJQUFJLENBQUMsWUFBWSxHQUFHLEtBQUssQ0FBQztJQUM1QixDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLE1BQU0sUUFBUSxHQUFHLE9BQU8sQ0FBQyxXQUFXLENBQUMsQ0FBQyxZQUFZLENBQUM7UUFDbkQsSUFBRyxRQUFRLENBQUMsY0FBYyxFQUFFO1lBQzFCLElBQUksQ0FBQyx5QkFBeUIsRUFBRSxDQUFDO1NBQ2xDO2FBQU07WUFDTCxJQUFJLENBQUMsdUJBQXVCLEVBQUUsQ0FBQztTQUNoQztRQUNELElBQUksQ0FBQyxPQUFPLEdBQUcsTUFBTSxDQUFDLE1BQU0sQ0FBQyxFQUFFLEVBQUUsa0JBQWtCLENBQUMsY0FBYyxFQUFFLFFBQVEsQ0FBQyxDQUFDO0lBQ2hGLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLHlCQUF5QixFQUFFLENBQUM7SUFDbkMsQ0FBQzs7QUEzRE0saUNBQWMsR0FBNEIsRUFBRSxVQUFVLEVBQUUsSUFBSSxFQUFFLGNBQWMsRUFBRSxLQUFLLEVBQUUsQ0FBQztnSEFEbEYsa0JBQWtCO29HQUFsQixrQkFBa0I7NEZBQWxCLGtCQUFrQjtrQkFIOUIsU0FBUzttQkFBQztvQkFDVCxRQUFRLEVBQUUsYUFBYTtpQkFDeEI7aUdBTVUsU0FBUztzQkFBakIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIFNpbXBsZUNoYW5nZXMsIE9uQ2hhbmdlcywgT25EZXN0cm95IH0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcbmltcG9ydCB7IGRvS2V5MkNsaWNrRG93biwgZG9LZXkyQ2xpY2tVcCwgZG9LZXkyQ2xpY2tCbHVyLCBJQXR0YWNoS2V5MmNsaWNrT3B0aW9ucyB9IGZyb20gXCJzdXJ2ZXktY29yZVwiO1xuXG5ARGlyZWN0aXZlKHtcbiAgc2VsZWN0b3I6IFwiW2tleTJjbGlja11cIlxufSlcbmV4cG9ydCBjbGFzcyBLZXkyQ2xpY2tEaXJlY3RpdmUgaW1wbGVtZW50cyBPbkNoYW5nZXMsIE9uRGVzdHJveSB7XG4gIHN0YXRpYyBkZWZhdWx0T3B0aW9uczogSUF0dGFjaEtleTJjbGlja09wdGlvbnMgPSB7IHByb2Nlc3NFc2M6IHRydWUsIGRpc2FibGVUYWJTdG9wOiBmYWxzZSB9O1xuICBwcml2YXRlIGlzU3Vic2NyaWJlZCA9IGZhbHNlO1xuXG4gIG9wdGlvbnM/OiBJQXR0YWNoS2V5MmNsaWNrT3B0aW9ucyA9IEtleTJDbGlja0RpcmVjdGl2ZS5kZWZhdWx0T3B0aW9ucztcbiAgQElucHV0KCkga2V5MmNsaWNrPzogSUF0dGFjaEtleTJjbGlja09wdGlvbnM7XG5cbiAgcHJpdmF0ZSBvbmtleWRvd24gKGV2dDogYW55KSB7XG4gICAgZG9LZXkyQ2xpY2tEb3duKGV2dCwgdGhpcy5vcHRpb25zKTtcbiAgfVxuICBwcml2YXRlIG9ua2V5dXAgPSAoZXZ0OiBhbnkpID0+IHtcbiAgICBldnQucHJldmVudERlZmF1bHQoKTtcbiAgICBldnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgZG9LZXkyQ2xpY2tVcChldnQsIHRoaXMub3B0aW9ucyk7XG4gICAgcmV0dXJuIGZhbHNlO1xuICB9XG4gIHByaXZhdGUgYmx1ciAoZXZ0OiBhbnkpIHtcbiAgICBkb0tleTJDbGlja0JsdXIoZXZ0KTtcbiAgfVxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKSB7XG4gICAgdGhpcy5zdWJzY3JpYmVFdmVudExpc3RlbmVycygpO1xuICB9XG5cbiAgZ2V0IGVsZW1lbnQoKSB7XG4gICAgcmV0dXJuIHRoaXMuZWwubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIHN1YnNjcmliZUV2ZW50TGlzdGVuZXJzKCkge1xuICAgIGlmKHRoaXMuaXNTdWJzY3JpYmVkKSByZXR1cm47XG5cbiAgICB0aGlzLmVsZW1lbnQudGFiSW5kZXggPSAwO1xuICAgIHRoaXMuZWxlbWVudC5hZGRFdmVudExpc3RlbmVyKFwia2V5dXBcIiwgdGhpcy5vbmtleXVwKTtcbiAgICB0aGlzLmVsZW1lbnQuYWRkRXZlbnRMaXN0ZW5lcihcImtleWRvd25cIiwgdGhpcy5vbmtleWRvd24pO1xuICAgIHRoaXMuZWxlbWVudC5hZGRFdmVudExpc3RlbmVyKFwiYmx1clwiLCB0aGlzLmJsdXIpO1xuXG4gICAgdGhpcy5pc1N1YnNjcmliZWQgPSB0cnVlO1xuICB9XG4gIHVuc3Vic2NyaWJlRXZlbnRMaXN0ZW5lcnMoKSB7XG4gICAgaWYoIXRoaXMuaXNTdWJzY3JpYmVkKSByZXR1cm47XG5cbiAgICB0aGlzLmVsZW1lbnQudGFiSW5kZXggPSAtMTtcbiAgICB0aGlzLmVsZW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcihcImtleXVwXCIsIHRoaXMub25rZXl1cCk7XG4gICAgdGhpcy5lbGVtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoXCJrZXlkb3duXCIsIHRoaXMub25rZXlkb3duKTtcbiAgICB0aGlzLmVsZW1lbnQucmVtb3ZlRXZlbnRMaXN0ZW5lcihcImJsdXJcIiwgdGhpcy5ibHVyKTtcblxuICAgIHRoaXMuaXNTdWJzY3JpYmVkID0gZmFsc2U7XG4gIH1cblxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XG4gICAgY29uc3QgY3VyVmFsdWUgPSBjaGFuZ2VzW1wia2V5MmNsaWNrXCJdLmN1cnJlbnRWYWx1ZTtcbiAgICBpZihjdXJWYWx1ZS5kaXNhYmxlVGFiU3RvcCkge1xuICAgICAgdGhpcy51bnN1YnNjcmliZUV2ZW50TGlzdGVuZXJzKCk7XG4gICAgfSBlbHNlIHtcbiAgICAgIHRoaXMuc3Vic2NyaWJlRXZlbnRMaXN0ZW5lcnMoKTtcbiAgICB9XG4gICAgdGhpcy5vcHRpb25zID0gT2JqZWN0LmFzc2lnbih7fSwgS2V5MkNsaWNrRGlyZWN0aXZlLmRlZmF1bHRPcHRpb25zLCBjdXJWYWx1ZSk7XG4gIH1cblxuICBuZ09uRGVzdHJveSgpOiB2b2lkIHtcbiAgICB0aGlzLnVuc3Vic2NyaWJlRXZlbnRMaXN0ZW5lcnMoKTtcbiAgfVxufSJdfQ==
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmcta2V5MmNsaWNrLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy91dGlscy9uZy1rZXkyY2xpY2suZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQWMsS0FBSyxFQUF1QyxNQUFNLGVBQWUsQ0FBQztBQUNsRyxPQUFPLEVBQUUsZUFBZSxFQUFFLGFBQWEsRUFBRSxlQUFlLEVBQTJCLE1BQU0sYUFBYSxDQUFDOztBQUt2RyxNQUFNLE9BQU8sa0JBQWtCO0lBbUI3QixZQUFvQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQWpCMUIsaUJBQVksR0FBRyxLQUFLLENBQUM7UUFFN0IsWUFBTyxxQkFBa0Msa0JBQWtCLENBQUMsY0FBYyxFQUFHO1FBTXJFLFlBQU8sR0FBRyxDQUFDLEdBQVEsRUFBRSxFQUFFO1lBQzdCLEdBQUcsQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUNyQixHQUFHLENBQUMsZUFBZSxFQUFFLENBQUM7WUFDdEIsYUFBYSxDQUFDLEdBQUcsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7WUFDakMsT0FBTyxLQUFLLENBQUM7UUFDZixDQUFDLENBQUE7UUFLQyxJQUFJLENBQUMsdUJBQXVCLEVBQUUsQ0FBQztJQUNqQyxDQUFDO0lBZE8sU0FBUyxDQUFFLEdBQVE7UUFDekIsZUFBZSxDQUFDLEdBQUcsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDckMsQ0FBQztJQU9PLElBQUksQ0FBRSxHQUFRO1FBQ3BCLGVBQWUsQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUN2QixDQUFDO0lBS0QsSUFBSSxPQUFPO1FBQ1QsT0FBTyxJQUFJLENBQUMsRUFBRSxDQUFDLGFBQWEsQ0FBQztJQUMvQixDQUFDO0lBRUQsdUJBQXVCO1FBQ3JCLElBQUcsSUFBSSxDQUFDLFlBQVk7WUFBRSxPQUFPO1FBRTdCLElBQUksQ0FBQyxPQUFPLENBQUMsUUFBUSxHQUFHLENBQUMsQ0FBQztRQUMxQixJQUFJLENBQUMsT0FBTyxDQUFDLGdCQUFnQixDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ2hFLElBQUksQ0FBQyxPQUFPLENBQUMsZ0JBQWdCLENBQUMsU0FBUyxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDcEUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxnQkFBZ0IsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRWpELElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO0lBQzNCLENBQUM7SUFDRCx5QkFBeUI7UUFDdkIsSUFBRyxDQUFDLElBQUksQ0FBQyxZQUFZO1lBQUUsT0FBTztRQUU5QixJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsR0FBRyxDQUFDLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsT0FBTyxDQUFDLG1CQUFtQixDQUFDLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQyxDQUFDO1FBQ25FLElBQUksQ0FBQyxPQUFPLENBQUMsbUJBQW1CLENBQUMsU0FBUyxFQUFFLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDLENBQUM7UUFDdkUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxtQkFBbUIsQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO1FBRXBELElBQUksQ0FBQyxZQUFZLEdBQUcsS0FBSyxDQUFDO0lBQzVCLENBQUM7SUFFRCxXQUFXLENBQUMsT0FBc0I7UUFDaEMsTUFBTSxRQUFRLEdBQUcsT0FBTyxDQUFDLFdBQVcsQ0FBQyxDQUFDLFlBQVksQ0FBQztRQUNuRCxJQUFHLFFBQVEsQ0FBQyxjQUFjLEVBQUU7WUFDMUIsSUFBSSxDQUFDLHlCQUF5QixFQUFFLENBQUM7U0FDbEM7YUFBTTtZQUNMLElBQUksQ0FBQyx1QkFBdUIsRUFBRSxDQUFDO1NBQ2hDO1FBQ0QsSUFBSSxDQUFDLE9BQU8sR0FBRyxNQUFNLENBQUMsTUFBTSxDQUFDLEVBQUUsRUFBRSxrQkFBa0IsQ0FBQyxjQUFjLEVBQUUsUUFBUSxDQUFDLENBQUM7SUFDaEYsQ0FBQztJQUVELFdBQVc7UUFDVCxJQUFJLENBQUMseUJBQXlCLEVBQUUsQ0FBQztJQUNuQyxDQUFDOztBQTNETSxpQ0FBYyxHQUE0QixFQUFFLFVBQVUsRUFBRSxJQUFJLEVBQUUsY0FBYyxFQUFFLEtBQUssRUFBRSxDQUFDO2dIQURsRixrQkFBa0I7b0dBQWxCLGtCQUFrQjs0RkFBbEIsa0JBQWtCO2tCQUg5QixTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSxhQUFhO2lCQUN4QjtpR0FNVSxTQUFTO3NCQUFqQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBFbGVtZW50UmVmLCBJbnB1dCwgU2ltcGxlQ2hhbmdlcywgT25DaGFuZ2VzLCBPbkRlc3Ryb3kgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xuaW1wb3J0IHsgZG9LZXkyQ2xpY2tEb3duLCBkb0tleTJDbGlja1VwLCBkb0tleTJDbGlja0JsdXIsIElBdHRhY2hLZXkyY2xpY2tPcHRpb25zIH0gZnJvbSBcInN1cnZleS1jb3JlXCI7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogXCJba2V5MmNsaWNrXVwiXG59KVxuZXhwb3J0IGNsYXNzIEtleTJDbGlja0RpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uQ2hhbmdlcywgT25EZXN0cm95IHtcbiAgc3RhdGljIGRlZmF1bHRPcHRpb25zOiBJQXR0YWNoS2V5MmNsaWNrT3B0aW9ucyA9IHsgcHJvY2Vzc0VzYzogdHJ1ZSwgZGlzYWJsZVRhYlN0b3A6IGZhbHNlIH07XG4gIHByaXZhdGUgaXNTdWJzY3JpYmVkID0gZmFsc2U7XG5cbiAgb3B0aW9ucz86IElBdHRhY2hLZXkyY2xpY2tPcHRpb25zID0geyAuLi5LZXkyQ2xpY2tEaXJlY3RpdmUuZGVmYXVsdE9wdGlvbnMgfTtcbiAgQElucHV0KCkga2V5MmNsaWNrPzogSUF0dGFjaEtleTJjbGlja09wdGlvbnM7XG5cbiAgcHJpdmF0ZSBvbmtleWRvd24gKGV2dDogYW55KSB7XG4gICAgZG9LZXkyQ2xpY2tEb3duKGV2dCwgdGhpcy5vcHRpb25zKTtcbiAgfVxuICBwcml2YXRlIG9ua2V5dXAgPSAoZXZ0OiBhbnkpID0+IHtcbiAgICBldnQucHJldmVudERlZmF1bHQoKTtcbiAgICBldnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgZG9LZXkyQ2xpY2tVcChldnQsIHRoaXMub3B0aW9ucyk7XG4gICAgcmV0dXJuIGZhbHNlO1xuICB9XG4gIHByaXZhdGUgYmx1ciAoZXZ0OiBhbnkpIHtcbiAgICBkb0tleTJDbGlja0JsdXIoZXZ0KTtcbiAgfVxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIGVsOiBFbGVtZW50UmVmKSB7XG4gICAgdGhpcy5zdWJzY3JpYmVFdmVudExpc3RlbmVycygpO1xuICB9XG5cbiAgZ2V0IGVsZW1lbnQoKSB7XG4gICAgcmV0dXJuIHRoaXMuZWwubmF0aXZlRWxlbWVudDtcbiAgfVxuXG4gIHN1YnNjcmliZUV2ZW50TGlzdGVuZXJzKCkge1xuICAgIGlmKHRoaXMuaXNTdWJzY3JpYmVkKSByZXR1cm47XG5cbiAgICB0aGlzLmVsZW1lbnQudGFiSW5kZXggPSAwO1xuICAgIHRoaXMuZWxlbWVudC5hZGRFdmVudExpc3RlbmVyKFwia2V5dXBcIiwgdGhpcy5vbmtleXVwLmJpbmQodGhpcykpO1xuICAgIHRoaXMuZWxlbWVudC5hZGRFdmVudExpc3RlbmVyKFwia2V5ZG93blwiLCB0aGlzLm9ua2V5ZG93bi5iaW5kKHRoaXMpKTtcbiAgICB0aGlzLmVsZW1lbnQuYWRkRXZlbnRMaXN0ZW5lcihcImJsdXJcIiwgdGhpcy5ibHVyKTtcblxuICAgIHRoaXMuaXNTdWJzY3JpYmVkID0gdHJ1ZTtcbiAgfVxuICB1bnN1YnNjcmliZUV2ZW50TGlzdGVuZXJzKCkge1xuICAgIGlmKCF0aGlzLmlzU3Vic2NyaWJlZCkgcmV0dXJuO1xuXG4gICAgdGhpcy5lbGVtZW50LnRhYkluZGV4ID0gLTE7XG4gICAgdGhpcy5lbGVtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoXCJrZXl1cFwiLCB0aGlzLm9ua2V5dXAuYmluZCh0aGlzKSk7XG4gICAgdGhpcy5lbGVtZW50LnJlbW92ZUV2ZW50TGlzdGVuZXIoXCJrZXlkb3duXCIsIHRoaXMub25rZXlkb3duLmJpbmQodGhpcykpO1xuICAgIHRoaXMuZWxlbWVudC5yZW1vdmVFdmVudExpc3RlbmVyKFwiYmx1clwiLCB0aGlzLmJsdXIpO1xuXG4gICAgdGhpcy5pc1N1YnNjcmliZWQgPSBmYWxzZTtcbiAgfVxuXG4gIG5nT25DaGFuZ2VzKGNoYW5nZXM6IFNpbXBsZUNoYW5nZXMpOiB2b2lkIHtcbiAgICBjb25zdCBjdXJWYWx1ZSA9IGNoYW5nZXNbXCJrZXkyY2xpY2tcIl0uY3VycmVudFZhbHVlO1xuICAgIGlmKGN1clZhbHVlLmRpc2FibGVUYWJTdG9wKSB7XG4gICAgICB0aGlzLnVuc3Vic2NyaWJlRXZlbnRMaXN0ZW5lcnMoKTtcbiAgICB9IGVsc2Uge1xuICAgICAgdGhpcy5zdWJzY3JpYmVFdmVudExpc3RlbmVycygpO1xuICAgIH1cbiAgICB0aGlzLm9wdGlvbnMgPSBPYmplY3QuYXNzaWduKHt9LCBLZXkyQ2xpY2tEaXJlY3RpdmUuZGVmYXVsdE9wdGlvbnMsIGN1clZhbHVlKTtcbiAgfVxuXG4gIG5nT25EZXN0cm95KCk6IHZvaWQge1xuICAgIHRoaXMudW5zdWJzY3JpYmVFdmVudExpc3RlbmVycygpO1xuICB9XG59Il19

package/fesm2015/survey-angular-ui.js

@@ -697,7 +697,7 @@ class NotifierComponent extends BaseAngular {
     }
 }
 NotifierComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: NotifierComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-NotifierComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotifierComponent, selector: "sv-notifier", inputs: { notifier: "notifier" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <ng-container *ngIf=\"notifier.isDisplayed\">\n    <div [class]=\"notifier.css\" [style]=\"{ visibility: notifier.active ? 'visible' : 'hidden' }\">\n      <span>{{notifier.message}}</span>\n      <sv-action-bar [model]=\"notifier.actionBar\"></sv-action-bar> \n    </div>\n  </ng-container>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+NotifierComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: NotifierComponent, selector: "sv-notifier", inputs: { notifier: "notifier" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <ng-container *ngIf=\"notifier.isDisplayed\">\n    <div [class]=\"notifier.css\" [style]=\"{ visibility: notifier.active ? 'visible' : 'hidden' }\" role=\"alert\" aria-live=\"polite\">\n      <span>{{notifier.message}}</span>\n      <sv-action-bar [model]=\"notifier.actionBar\"></sv-action-bar> \n    </div>\n  </ng-container>\n</ng-template>", styles: [":host { display: none; }"], components: [{ 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: NotifierComponent, decorators: [{
             type: Component,
             args: [{
@@ -747,6 +747,7 @@ class SurveyContentComponent extends BaseAngular {
     ngAfterViewChecked() {
         if (!!this.model && this.isSurveyUpdated) {
             this.model.afterRenderSurvey(this.rootEl.nativeElement);
+            this.model.startTimerFromUI();
         }
         super.ngAfterViewChecked();
     }
@@ -1009,7 +1010,7 @@ class QuestionComponent extends EmbeddedViewContentComponent {
     }
 }
 QuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-QuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionComponent, selector: "sv-ng-question", inputs: { model: "model" }, viewQueries: [{ propertyName: "rootEl", first: true, predicate: ["elementContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div *ngIf=\"!!model\" #elementContainer [class]=\"model.getRootCss()\" [style]=\"model.getRootStyle()\" [id]=\"model.id\" [attr.data-name]=\"model.name\" [attr.role]=\"model.ariaRole\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-labelledby]=\"model.ariaLabelledBy\">\n    <div *ngIf=\"model.showErrorsAboveQuestion && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div [element]=\"model\" *ngIf=\"model.hasTitleOnLeftTop\" sv-ng-element-header></div>\n    <div [class]=\"model.cssContent\" role=\"presentation\" [visible]=\"!model.isCollapsed\">\n      <div *ngIf=\"model.showErrorOnTop && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n      <ng-template [component]=\"{ name: getQuestionContentWrapperComponentName(), data: getQuestionContentWrapperComponentData(), default: 'skeleton-question' }\">\n      </ng-template>\n      <div *ngIf=\"model.hasComment\" [class]=\"model.getCommentAreaCss(false)\">\n        <div [model]=\"model.locCommentText\" sv-ng-string></div>\n        <sv-ng-comment [question]=\"model\"></sv-ng-comment>\n      </div>\n      <div *ngIf=\"model.showErrorOnBottom && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n      <div *ngIf=\"model.isErrorsModeTooltip && model.hasVisibleErrors\" [element]=\"model\" [location]=\"'tooltip'\" sv-ng-errors></div>\n      <div *ngIf=\"model.hasDescriptionUnderInput\" [class]=\"model.cssDescription\" [model]=\"model.locDescription\" sv-ng-string></div>\n  </div>\n    <div [element]=\"model\" *ngIf=\"model.hasTitleOnBottom\" sv-ng-element-header></div>\n    <div *ngIf=\"model.showErrorsBelowQuestion && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></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: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: SurveyCommentComponent, selector: "sv-ng-comment, '[sv-ng-comment]'", inputs: ["question"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+QuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionComponent, selector: "sv-ng-question", inputs: { model: "model" }, viewQueries: [{ propertyName: "rootEl", first: true, predicate: ["elementContainer"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div *ngIf=\"!!model\" #elementContainer [class]=\"model.getRootCss()\" [style]=\"model.getRootStyle()\" [id]=\"model.id\" [attr.data-name]=\"model.name\" [attr.role]=\"model.ariaRole\" [attr.aria-required]=\"model.ariaRequired\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-labelledby]=\"model.ariaLabelledBy\" [attr.aria-expanded]=\"model.ariaExpanded\">\n    <div *ngIf=\"model.showErrorsAboveQuestion && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n    <div [element]=\"model\" *ngIf=\"model.hasTitleOnLeftTop\" sv-ng-element-header></div>\n    <div [class]=\"model.cssContent\" role=\"presentation\" [visible]=\"!model.isCollapsed\">\n      <div *ngIf=\"model.showErrorOnTop && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n      <ng-template [component]=\"{ name: getQuestionContentWrapperComponentName(), data: getQuestionContentWrapperComponentData(), default: 'skeleton-question' }\">\n      </ng-template>\n      <div *ngIf=\"model.hasComment\" [class]=\"model.getCommentAreaCss(false)\">\n        <div [model]=\"model.locCommentText\" sv-ng-string></div>\n        <sv-ng-comment [question]=\"model\"></sv-ng-comment>\n      </div>\n      <div *ngIf=\"model.showErrorOnBottom && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></div>\n      <div *ngIf=\"model.isErrorsModeTooltip && model.hasVisibleErrors\" [element]=\"model\" [location]=\"'tooltip'\" sv-ng-errors></div>\n      <div *ngIf=\"model.hasDescriptionUnderInput\" [class]=\"model.cssDescription\" [model]=\"model.locDescription\" sv-ng-string></div>\n  </div>\n    <div [element]=\"model\" *ngIf=\"model.hasTitleOnBottom\" sv-ng-element-header></div>\n    <div *ngIf=\"model.showErrorsBelowQuestion && model.hasVisibleErrors\" [element]=\"model\" sv-ng-errors></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: SurveyStringComponent, selector: "sv-ng-string, '[sv-ng-string]'", inputs: ["model"] }, { type: SurveyCommentComponent, selector: "sv-ng-comment, '[sv-ng-comment]'", inputs: ["question"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -1024,6 +1025,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
             }] } });
 AngularComponentFactory.Instance.registerComponent("question", QuestionComponent);
 
+class SafeHtmlPipe {
+    constructor(domSanitizer) {
+        this.domSanitizer = domSanitizer;
+    }
+    transform(url) {
+        return this.domSanitizer.bypassSecurityTrustHtml(url);
+    }
+}
+SafeHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
+SafeHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, name: "safeHtml" });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, decorators: [{
+            type: Pipe,
+            args: [{ name: "safeHtml" }]
+        }], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; } });
+
 class StringViewerComponent {
     constructor(changeDetectorRef) {
         this.changeDetectorRef = changeDetectorRef;
@@ -1047,7 +1063,7 @@ class StringViewerComponent {
     }
 }
 StringViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: StringViewerComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
-StringViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringViewerComponent, selector: "sv-ng-string-viewer, string-viewer, '[sv-ng-string-viewer]'", inputs: { model: "model" }, ngImport: i0, template: "<span *ngIf=\"!model.hasHtml\" class=\"sv-string-viewer\">{{model.renderedHtml}}</span>\n<span *ngIf=\"model.hasHtml\" class=\"sv-string-viewer\" [innerHtml]=\"model.renderedHtml\"></span>", styles: [""], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+StringViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringViewerComponent, selector: "sv-ng-string-viewer, string-viewer, '[sv-ng-string-viewer]'", inputs: { model: "model" }, ngImport: i0, template: "<span *ngIf=\"!model.hasHtml\" class=\"sv-string-viewer\">{{model.renderedHtml}}</span>\n<span *ngIf=\"model.hasHtml\" class=\"sv-string-viewer\" [innerHtml]=\"model.renderedHtml | safeHtml\"></span>", styles: [""], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "safeHtml": SafeHtmlPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: StringViewerComponent, decorators: [{
             type: Component,
             args: [{
@@ -1252,7 +1268,7 @@ class DropdownComponent extends BaseAngular {
     }
 }
 DropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DropdownComponent, selector: "sv-ng-dropdown, '[sv-ng-dropdown]'", inputs: { model: "model" }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.selectWrapper\">\n    <div *ngIf=\"!model.isReadOnly\" [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : 0\" [class]=\"model.getControlClass()\"\n        [attr.disabled]=\"model.isInputReadOnly ? true : null\" (click)=\"click($event)\" (blur)=\"blur($event)\"\n        (keydown)=\"keyhandler($event)\" [attr.id]=\"model.inputId\" [attr.aria-required]=\"model.ariaRequired\"\n        [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\"\n        [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.role]=\"model.ariaRole\"\n        [attr.aria-controls]=\"dropdownModel.listElementId\"\n        [attr.aria-expanded]=\"model.ariaExpanded ? 'true' : 'false'\"\n        [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\">\n        <div *ngIf=\"dropdownModel.showHintPrefix\" [class]=\"model.cssClasses.hintPrefix\">\n            <span>{{ dropdownModel.hintStringPrefix }}</span>\n        </div>\n        <div [class]=\"model.cssClasses.controlValue\">\n            <div *ngIf=\"dropdownModel.showHintString\" [class]=\"model.cssClasses.hintSuffix\">\n                <span style=\"visibility: hidden\">{{ dropdownModel.inputStringRendered }}</span>\n                <span>{{ dropdownModel.hintStringSuffix }}</span>\n            </div>\n            <ng-container *ngIf=\"dropdownModel.showInputFieldComponent\">\n                <ng-template [component]=\"{ name: model.inputFieldComponentName, data: { model: dropdownModel.getSelectedAction(), question: model } }\"></ng-template>\n            </ng-container>\n            <sv-ng-string *ngIf=\"dropdownModel.showSelectedItemLocText\" [model]=\"model.selectedItemLocText\"></sv-ng-string>\n            <input #inputElement type=\"text\" autocomplete=\"off\" [(ngModel)]=\"dropdownModel.inputStringRendered\" [class]=\"model.cssClasses.filterStringInput\"\n            [attr.role]=\"dropdownModel.filterStringEnabled ? model.ariaRole : null\"\n            [attr.id]=\"model.getInputId()\"\n            [attr.inputmode]=\"dropdownModel.inputMode\"\n            [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : -1\"\n            [attr.disabled]=\"model.isInputReadOnly ? true : null\"\n            [attr.aria-label]=\"model.placeholder\"\n            [attr.aria-controls]=\"dropdownModel.listElementId\"\n            [attr.aria-expanded]=\"model.ariaExpanded ? 'true' : 'false'\"\n            [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\"\n            [attr.placeholder]=\"dropdownModel.placeholderRendered\" [attr.readonly]=\"!dropdownModel.searchEnabled ? true : null\" \n            (change)=\"inputChange($event)\" (blur)=\"blur($event)\" (focus)=\"focus($event)\"/>\n        </div>\n        <div *ngIf=\"(model.allowClear && model.cssClasses.cleanButtonIconId)\"\n            [class]=\"model.cssClasses.cleanButton\" (click)=\"clear($event)\" [visible]=\"!model.isEmpty()\">\n            <!-- ko component: { name: 'sv-svg-icon', params: { css: model.cssClasses.cleanButtonSvg, iconName: model.cssClasses.cleanButtonIconId, size: 'auto' } } -->\n            <!-- /ko -->\n            <svg [iconName]=\"model.cssClasses.cleanButtonIconId\" [partCss]=\"model.cssClasses.cleanButtonSvg\" [title]=\"model.clearCaption\"\n                [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </div>\n    </div>\n    <sv-ng-popup *ngIf=\"!model.isReadOnly\" [popupModel]=\"dropdownModel.popupModel\"></sv-ng-popup>\n    <div disabled *ngIf=\"model.isReadOnly\" [class]=\"model.getControlClass()\" [attr.id]=\"model.inputId\">\n        <sv-ng-string *ngIf=\"model.selectedItemLocText\" [model]=\"model.selectedItemLocText\"></sv-ng-string>\n        <div>{{ model.readOnlyText }}</div>\n    </div>\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: PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }] });
+DropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: DropdownComponent, selector: "sv-ng-dropdown, '[sv-ng-dropdown]'", inputs: { model: "model" }, viewQueries: [{ propertyName: "inputElementRef", first: true, predicate: ["inputElement"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.selectWrapper\">\n    <div *ngIf=\"!model.isReadOnly\" [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : 0\" [class]=\"model.getControlClass()\"\n        [attr.disabled]=\"model.isInputReadOnly ? true : null\" (click)=\"click($event)\" (blur)=\"blur($event)\"\n        (keydown)=\"keyhandler($event)\" [attr.id]=\"model.inputId\" [attr.aria-required]=\"model.ariaRequired\"\n        [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\"\n        [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.role]=\"model.ariaRole\"\n        [attr.aria-controls]=\"dropdownModel.listElementId\"\n        [attr.aria-expanded]=\"model.ariaExpanded\"\n        [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\">\n        <div *ngIf=\"dropdownModel.showHintPrefix\" [class]=\"model.cssClasses.hintPrefix\">\n            <span>{{ dropdownModel.hintStringPrefix }}</span>\n        </div>\n        <div [class]=\"model.cssClasses.controlValue\">\n            <div *ngIf=\"dropdownModel.showHintString\" [class]=\"model.cssClasses.hintSuffix\">\n                <span style=\"visibility: hidden\">{{ dropdownModel.inputStringRendered }}</span>\n                <span>{{ dropdownModel.hintStringSuffix }}</span>\n            </div>\n            <ng-container *ngIf=\"dropdownModel.showInputFieldComponent\">\n                <ng-template [component]=\"{ name: model.inputFieldComponentName, data: { model: dropdownModel.getSelectedAction(), question: model } }\"></ng-template>\n            </ng-container>\n            <sv-ng-string *ngIf=\"dropdownModel.showSelectedItemLocText\" [model]=\"model.selectedItemLocText\"></sv-ng-string>\n            <input #inputElement type=\"text\" autocomplete=\"off\" [(ngModel)]=\"dropdownModel.inputStringRendered\" [class]=\"model.cssClasses.filterStringInput\"\n            [attr.role]=\"dropdownModel.filterStringEnabled ? model.ariaRole : null\"\n            [attr.id]=\"model.getInputId()\"\n            [attr.inputmode]=\"dropdownModel.inputMode\"\n            [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : -1\"\n            [attr.disabled]=\"model.isInputReadOnly ? true : null\"\n            [attr.aria-label]=\"model.placeholder\"\n            [attr.aria-controls]=\"dropdownModel.listElementId\"\n            [attr.aria-expanded]=\"model.ariaExpanded\"\n            [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\"\n            [attr.placeholder]=\"dropdownModel.placeholderRendered\" [attr.readonly]=\"!dropdownModel.searchEnabled ? true : null\" \n            (change)=\"inputChange($event)\" (blur)=\"blur($event)\" (focus)=\"focus($event)\"/>\n        </div>\n        <div *ngIf=\"(model.allowClear && model.cssClasses.cleanButtonIconId)\"\n            [class]=\"model.cssClasses.cleanButton\" (click)=\"clear($event)\" [visible]=\"!model.isEmpty()\">\n            <!-- ko component: { name: 'sv-svg-icon', params: { css: model.cssClasses.cleanButtonSvg, iconName: model.cssClasses.cleanButtonIconId, size: 'auto' } } -->\n            <!-- /ko -->\n            <svg [iconName]=\"model.cssClasses.cleanButtonIconId\" [partCss]=\"model.cssClasses.cleanButtonSvg\" [title]=\"model.clearCaption\"\n                [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </div>\n    </div>\n    <sv-ng-popup *ngIf=\"!model.isReadOnly\" [popupModel]=\"dropdownModel.popupModel\"></sv-ng-popup>\n    <div disabled *ngIf=\"model.isReadOnly\" [class]=\"model.getControlClass()\" [attr.id]=\"model.inputId\">\n        <sv-ng-string *ngIf=\"model.selectedItemLocText\" [model]=\"model.selectedItemLocText\"></sv-ng-string>\n        <div>{{ model.readOnlyText }}</div>\n    </div>\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: PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DynamicComponentDirective, selector: "[component]", inputs: ["component"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: DropdownComponent, decorators: [{
             type: Component,
             args: [{
@@ -1272,7 +1288,7 @@ class TagboxFilterComponent extends BaseAngular {
     }
 }
 TagboxFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxFilterComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TagboxFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TagboxFilterComponent, selector: "sv-tagbox-filter", inputs: { model: "model", question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div [class]=\"question.cssClasses.hint\">\n    <div *ngIf=\"model.showHintPrefix\" [class]=\"question.cssClasses.hintPrefix\">\n        <span>{{ model.hintStringPrefix }}</span>\n    </div>\n    <div [class]=\"question.cssClasses.hintSuffixWrapper\">\n        <div *ngIf=\"model.showHintString\" [class]=\"question.cssClasses.hintSuffix\">\n            <span style=\"visibility: hidden\">{{ model.inputStringRendered }}</span>\n            <span>{{ model.hintStringSuffix }}</span>\n        </div>\n    <input\n      type=\"text\"\n      autocomplete=\"off\"\n      [(ngModel)]=\"model.inputStringRendered\"\n      [attr.id]=\"question.getInputId()\"\n      [class]=\"question.cssClasses.filterStringInput\"\n      [attr.inputmode]=\"model.inputMode\"\n      [attr.role]=\"model.filterStringEnabled ? question.ariaRole : null\"\n      [attr.readonly]=\"!model.searchEnabled ? true : null\"\n      [attr.disabled]=\"question.isInputReadOnly ? true : null\"\n      [attr.size]=\"!model.inputStringRendered ? 1 : null\"\n      [attr.aria-label]=\"question.placeholder\"\n      [attr.aria-controls]=\"model.listElementId\"\n      [attr.aria-expanded]=\"question.ariaExpanded ? 'true' : 'false'\"\n      [attr.aria-activedescendant]=\"model.ariaActivedescendant\"\n      [attr.placeholder]=\"model.filterStringPlaceholder\"\n      (keydown)=\"model.inputKeyHandler($event)\"\n      (blur)=\"model.onBlur($event)\"\n      (focus)=\"model.onFocus($event)\"\n    />\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{display:none}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
+TagboxFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TagboxFilterComponent, selector: "sv-tagbox-filter", inputs: { model: "model", question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div [class]=\"question.cssClasses.hint\">\n    <div *ngIf=\"model.showHintPrefix\" [class]=\"question.cssClasses.hintPrefix\">\n        <span>{{ model.hintStringPrefix }}</span>\n    </div>\n    <div [class]=\"question.cssClasses.hintSuffixWrapper\">\n        <div *ngIf=\"model.showHintString\" [class]=\"question.cssClasses.hintSuffix\">\n            <span style=\"visibility: hidden\">{{ model.inputStringRendered }}</span>\n            <span>{{ model.hintStringSuffix }}</span>\n        </div>\n    <input\n      type=\"text\"\n      autocomplete=\"off\"\n      [(ngModel)]=\"model.inputStringRendered\"\n      [attr.id]=\"question.getInputId()\"\n      [class]=\"question.cssClasses.filterStringInput\"\n      [attr.inputmode]=\"model.inputMode\"\n      [attr.role]=\"model.filterStringEnabled ? question.ariaRole : null\"\n      [attr.readonly]=\"!model.searchEnabled ? true : null\"\n      [attr.disabled]=\"question.isInputReadOnly ? true : null\"\n      [attr.size]=\"!model.inputStringRendered ? 1 : null\"\n      [attr.aria-label]=\"question.placeholder\"\n      [attr.aria-controls]=\"model.listElementId\"\n      [attr.aria-expanded]=\"question.ariaExpanded\"\n      [attr.aria-activedescendant]=\"model.ariaActivedescendant\"\n      [attr.placeholder]=\"model.filterStringPlaceholder\"\n      (keydown)=\"model.inputKeyHandler($event)\"\n      (blur)=\"model.onBlur($event)\"\n      (focus)=\"model.onFocus($event)\"\n    />\n    </div>\n  </div>\n</ng-template>\n", styles: [":host{display:none}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.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: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxFilterComponent, decorators: [{
             type: Component,
             args: [{
@@ -1342,7 +1358,7 @@ class TagboxComponent {
     }
 }
 TagboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-TagboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TagboxComponent, selector: "sv-ng-tagbox, '[sv-ng-tagbox]'", inputs: { model: "model" }, ngImport: i0, template: "<div [class]=\"model.cssClasses.selectWrapper\">\n    <div *ngIf=\"!model.isReadOnly\" [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : 0\" [class]=\"model.getControlClass()\"\n        [attr.disabled]=\"model.isInputReadOnly ? true : null\" (click)=\"click($event)\" (blur)=\"blur($event)\"\n        (keydown)=\"keyhandler($event)\" [attr.id]=\"model.inputId\" [attr.aria-required]=\"model.ariaRequired\"\n        [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\"\n        [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.role]=\"model.ariaRole\"\n        [attr.aria-controls]=\"dropdownModel.listElementId\"\n        [attr.aria-expanded]=\"model.ariaExpanded ? 'true' : 'false'\"\n        [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\">\n        <div [class]=\"model.cssClasses.controlValue\">\n            <ng-container *ngIf=\"!model.isEmpty()\">\n                <sv-ng-tagbox-item *ngFor=\"let item of model.selectedChoices\" [item]=\"item\" [question]=\"model\">\n                </sv-ng-tagbox-item>\n            </ng-container>\n            <ng-template [component]=\"{ name: 'sv-tagbox-filter', data: { model: dropdownModel, question: model } }\"></ng-template>\n        </div>\n        <div *ngIf=\"(model.allowClear && model.cssClasses.cleanButtonIconId)\" [class]=\"model.cssClasses.cleanButton\"\n            (click)=\"clear($event)\" [visible]=\"!model.isEmpty()\">\n            <!-- ko component: { name: 'sv-svg-icon', params: { css: model.cssClasses.cleanButtonSvg, iconName: model.cssClasses.cleanButtonIconId, size: 'auto' } } -->\n            <!-- /ko -->\n            <svg [iconName]=\"model.cssClasses.cleanButtonIconId\" [partCss]=\"model.cssClasses.cleanButtonSvg\" [title]=\"model.clearCaption\"\n                [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </div>\n    </div>\n    <sv-ng-popup *ngIf=\"!model.isReadOnly\" [popupModel]=\"model.popupModel\"></sv-ng-popup>\n    <div disabled *ngIf=\"model.isReadOnly\" [class]=\"model.getControlClass()\" [attr.id]=\"model.inputId\">\n        <div>{{ model.readOnlyText }}</div>\n    </div>\n</div>", components: [{ type: TagboxItemComponent, selector: "sv-ng-tagbox-item, '[sv-ng-tagbox-item]'", inputs: ["item", "question"] }, { type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel"] }], 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"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }] });
+TagboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TagboxComponent, selector: "sv-ng-tagbox, '[sv-ng-tagbox]'", inputs: { model: "model" }, ngImport: i0, template: "<div [class]=\"model.cssClasses.selectWrapper\">\n    <div *ngIf=\"!model.isReadOnly\" [attr.tabindex]=\"dropdownModel.inputReadOnly ? null : 0\" [class]=\"model.getControlClass()\"\n        [attr.disabled]=\"model.isInputReadOnly ? true : null\" (click)=\"click($event)\" (blur)=\"blur($event)\"\n        (keydown)=\"keyhandler($event)\" [attr.id]=\"model.inputId\" [attr.aria-required]=\"model.ariaRequired\"\n        [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\"\n        [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.role]=\"model.ariaRole\"\n        [attr.aria-controls]=\"dropdownModel.listElementId\"\n        [attr.aria-expanded]=\"model.ariaExpanded\"\n        [attr.aria-activedescendant]=\"dropdownModel.ariaActivedescendant\">\n        <div [class]=\"model.cssClasses.controlValue\">\n            <ng-container *ngIf=\"!model.isEmpty()\">\n                <sv-ng-tagbox-item *ngFor=\"let item of model.selectedChoices\" [item]=\"item\" [question]=\"model\">\n                </sv-ng-tagbox-item>\n            </ng-container>\n            <ng-template [component]=\"{ name: 'sv-tagbox-filter', data: { model: dropdownModel, question: model } }\"></ng-template>\n        </div>\n        <div *ngIf=\"(model.allowClear && model.cssClasses.cleanButtonIconId)\" [class]=\"model.cssClasses.cleanButton\"\n            (click)=\"clear($event)\" [visible]=\"!model.isEmpty()\">\n            <!-- ko component: { name: 'sv-svg-icon', params: { css: model.cssClasses.cleanButtonSvg, iconName: model.cssClasses.cleanButtonIconId, size: 'auto' } } -->\n            <!-- /ko -->\n            <svg [iconName]=\"model.cssClasses.cleanButtonIconId\" [partCss]=\"model.cssClasses.cleanButtonSvg\" [title]=\"model.clearCaption\"\n                [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </div>\n    </div>\n    <sv-ng-popup *ngIf=\"!model.isReadOnly\" [popupModel]=\"model.popupModel\"></sv-ng-popup>\n    <div disabled *ngIf=\"model.isReadOnly\" [class]=\"model.getControlClass()\" [attr.id]=\"model.inputId\">\n        <div>{{ model.readOnlyText }}</div>\n    </div>\n</div>", components: [{ type: TagboxItemComponent, selector: "sv-ng-tagbox-item, '[sv-ng-tagbox-item]'", inputs: ["item", "question"] }, { type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel"] }], 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"] }, { type: VisibleDirective, selector: "[visible]", inputs: ["visible"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TagboxComponent, decorators: [{
             type: Component,
             args: [{
@@ -1520,7 +1536,7 @@ class TextQuestionComponent extends QuestionAngular {
     }
 }
 TextQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TextQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-TextQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TextQuestionComponent, selector: "sv-ng-text-question", usesInheritance: true, ngImport: i0, template: "  <ng-container [ngTemplateOutlet]=\"input\" *ngIf=\"!model.dataListId && !model.isReadOnlyRenderDiv()\"></ng-container>\n  <div *ngIf=\"model.dataListId && !model.isReadOnlyRenderDiv()\">\n    <ng-container [ngTemplateOutlet]=\"input\"></ng-container>\n    <datalist [id]=\"model.dataListId\">\n      <option *ngFor=\"let dataListItem of model.dataList\" [value]=\"dataListItem\"></option>\n    </datalist>\n  </div>\n  <div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>\n  <ng-template #input>\n    <input [style]=\"model.inputStyle\" [class]=\"model.getControlClass()\" [attr.list]=\"model.dataListId\"\n    (change)=\"model.onChange($event)\" [value]=\"value\" [disabled]=\"model.isInputReadOnly\" name=\"user\" [type]=\"model.inputType\" [id]=\"model.inputId\" [attr.placeholder]=\"model.renderedPlaceholder || ''\"\n    (keyup)=\"model.onKeyUp($event)\" (keydown)=\"model.onKeyDown($event)\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\" (compositionupdate)=\"model.onCompositionUpdate($event)\" \n    [attr.size] = \"model.renderedInputSize\" [attr.maxlength]= \"model.getMaxLength()\" [attr.min]=\"model.renderedMin\"\n    [attr.max]=\"model.renderedMax\" [attr.step]=\"model.renderedStep\" [attr.max]=\"model.renderedMax\" [attr.aria-required]=\"model.ariaRequired\"\n    [attr.aria-label]=\"model.ariaLabel\" [attr.aria-invalid]=\"model.ariaInvalid\" [attr.aria-describedby]=\"model.ariaDescribedBy\" [attr.autocomplete]=\"model.autocomplete\" #contentElement/>\n    <sv-ng-character-counter *ngIf=\"model.getMaxLength()\" \n    [counter]=\"model.characterCounter\"\n    [remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n  </sv-ng-character-counter>\n  </ng-template>", styles: [""], components: [{ type: CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], 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: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
+TextQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: TextQuestionComponent, selector: "sv-ng-text-question", usesInheritance: true, ngImport: i0, template: "  <ng-container [ngTemplateOutlet]=\"input\" *ngIf=\"!model.dataListId && !model.isReadOnlyRenderDiv()\"></ng-container>\n  <div *ngIf=\"model.dataListId && !model.isReadOnlyRenderDiv()\">\n    <ng-container [ngTemplateOutlet]=\"input\"></ng-container>\n    <datalist [id]=\"model.dataListId\">\n      <option *ngFor=\"let dataListItem of model.dataList\" [value]=\"dataListItem\"></option>\n    </datalist>\n  </div>\n  <div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>\n  <ng-template #input>\n    <input [style]=\"model.inputStyle\" [class]=\"model.getControlClass()\" [attr.list]=\"model.dataListId\"\n    (change)=\"model.onChange($event)\" [value]=\"value\" [disabled]=\"model.isInputReadOnly\" name=\"user\" [type]=\"model.inputType\" [id]=\"model.inputId\" [attr.placeholder]=\"model.renderedPlaceholder || ''\"\n    (keyup)=\"model.onKeyUp($event)\" (keydown)=\"model.onKeyDown($event)\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\" (compositionupdate)=\"model.onCompositionUpdate($event)\" \n    [attr.size] = \"model.renderedInputSize\" [attr.maxlength]= \"model.getMaxLength()\" [attr.min]=\"model.renderedMin\"\n    [attr.max]=\"model.renderedMax\" [attr.step]=\"model.renderedStep\" [attr.max]=\"model.renderedMax\" [attr.aria-required]=\"model.a11y_input_ariaRequired\"\n    [attr.aria-label]=\"model.a11y_input_ariaLabel\" [attr.aria-labelledby]=\"model.a11y_input_ariaLabelledBy\" [attr.aria-invalid]=\"model.a11y_input_ariaInvalid\" [attr.aria-describedby]=\"model.a11y_input_ariaDescribedBy\" [attr.autocomplete]=\"model.autocomplete\" #contentElement/>\n    <sv-ng-character-counter *ngIf=\"model.getMaxLength()\" \n    [counter]=\"model.characterCounter\"\n    [remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n  </sv-ng-character-counter>\n  </ng-template>", styles: [""], components: [{ type: CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], 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: i3.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { type: i3.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: TextQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -1531,21 +1547,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
         }] });
 AngularComponentFactory.Instance.registerComponent("text-question", TextQuestionComponent);
 
-class SafeHtmlPipe {
-    constructor(domSanitizer) {
-        this.domSanitizer = domSanitizer;
-    }
-    transform(url) {
-        return this.domSanitizer.bypassSecurityTrustHtml(url);
-    }
-}
-SafeHtmlPipe.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, deps: [{ token: i1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Pipe });
-SafeHtmlPipe.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, name: "safeHtml" });
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SafeHtmlPipe, decorators: [{
-            type: Pipe,
-            args: [{ name: "safeHtml" }]
-        }], ctorParameters: function () { return [{ type: i1.DomSanitizer }]; } });
-
 class HtmlQuestionComponent extends QuestionAngular {
     onModelChanged() {
         super.onModelChanged();
@@ -1891,7 +1892,7 @@ class Key2ClickDirective {
     constructor(el) {
         this.el = el;
         this.isSubscribed = false;
-        this.options = Key2ClickDirective.defaultOptions;
+        this.options = Object.assign({}, Key2ClickDirective.defaultOptions);
         this.onkeyup = (evt) => {
             evt.preventDefault();
             evt.stopPropagation();
@@ -1913,8 +1914,8 @@ class Key2ClickDirective {
         if (this.isSubscribed)
             return;
         this.element.tabIndex = 0;
-        this.element.addEventListener("keyup", this.onkeyup);
-        this.element.addEventListener("keydown", this.onkeydown);
+        this.element.addEventListener("keyup", this.onkeyup.bind(this));
+        this.element.addEventListener("keydown", this.onkeydown.bind(this));
         this.element.addEventListener("blur", this.blur);
         this.isSubscribed = true;
     }
@@ -1922,8 +1923,8 @@ class Key2ClickDirective {
         if (!this.isSubscribed)
             return;
         this.element.tabIndex = -1;
-        this.element.removeEventListener("keyup", this.onkeyup);
-        this.element.removeEventListener("keydown", this.onkeydown);
+        this.element.removeEventListener("keyup", this.onkeyup.bind(this));
+        this.element.removeEventListener("keydown", this.onkeydown.bind(this));
         this.element.removeEventListener("blur", this.blur);
         this.isSubscribed = false;
     }
@@ -2543,7 +2544,7 @@ class FileQuestionComponent extends QuestionAngular {
     }
 }
 FileQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: FileQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-FileQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FileQuestionComponent, selector: "sv-ng-file-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.fileRootCss\" #contentElement>\n  <input\n    [class]=\"model.cssClasses.fileInput\"\n    *ngIf=\"!model.isReadOnly\"\n    tabindex=\"-1\"\n    type=\"file\"\n    [attr.id]=\"model.inputId\"\n    (change)=\"model.doChange($event)\"\n    [attr.aria-required]=\"model.ariaRequired\"\n    [attr.aria-label]=\"model.ariaLabel\"\n    [attr.aria-invalid]=\"model.ariaInvalid\"\n    [attr.aria-describedby]=\"model.ariaDescribedBy\"\n    [attr.multiple]=\"model.multipleRendered\"\n    [attr.title]=\"model.inputTitle\"\n    [attr.accept]=\"model.acceptedTypes\"\n  />\n  <input\n    *ngIf=\"model.isReadOnly\"\n    type=\"file\"\n    disabled\n    [class]=\"model.getReadOnlyFileCss()\"\n    [attr.id]=\"model.inputId\"\n    [attr.multiple]=\"model.multipleRendered\"\n    [attr.placeholder]=\"model.title\"\n    style=\"color: transparent\"\n  />\n  <div [class]=\"model.cssClasses.dragArea\"\n    (dragenter)=\"model.onDragEnter($event)\"\n    (drop)=\"model.onDrop($event)\"\n    (dragover)=\"model.onDragOver($event)\"\n    (dragleave)=\"model.onDragLeave($event)\">  \n    <div\n      [class]=\"model.getFileDecoratorCss()\"\n    >\n      <span [class]=\"model.cssClasses.dragAreaPlaceholder\">{{ model.dragAreaPlaceholder }}</span>\n      <div [class]=\"model.cssClasses.wrapper\">\n        <label\n          role=\"button\"\n          tabindex=\"0\"\n          [class]=\"model.getChooseFileCss()\"\n          [attr.for]=\"model.inputId\"\n          [attr.aria-label]=\"model.chooseButtonCaption\"\n          >\n          <span>{{ model.chooseButtonCaption }}</span>\n          <svg *ngIf=\"model.cssClasses.chooseFileIconId\" [title]=\"model.chooseButtonCaption\" [iconName]=\"model.cssClasses.chooseFileIconId\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </label>\n        <span\n          [class]=\"model.cssClasses.noFileChosen\"\n          *ngIf=\"model.isEmpty()\"\n          >{{ model.noFileChosenCaption }}</span\n        >\n      </div>\n    </div>\n    <button\n      type=\"button\"\n      *ngIf=\"model.showRemoveButton\"\n      [class]=\"model.cssClasses.removeButton\"\n      (click)=\"model.doClean($event)\"\n    >\n      <span>{{ model.clearButtonCaption }}</span>\n      <svg *ngIf=\"model.cssClasses.removeButtonIconId\" [iconName]=\"model.cssClasses.removeButtonIconId\" [size]=\"'auto'\" [title]=\"model.clearButtonCaption\" sv-ng-svg-icon></svg>\n    </button>\n    <div [class]=\"model.cssClasses.fileList || undefined\" *ngIf=\"!model.isEmpty()\">\n      <span\n        *ngFor=\"let val of model.previewValue; index as index; trackBy: trackFilesFn\"\n        [visible]=\"val && model.isPreviewVisible(index)\"\n        [class]=\"model.cssClasses.preview\"\n      >\n        <div *ngIf=\"val.name && model.cssClasses.fileSign\" [class]=\"model.cssClasses.fileSign\">\n          <a\n            (click)=\"model.doDownloadFile($event, val)\"\n            [attr.href]=\"val.content | safeUrl\"\n            [attr.title]=\"val.name\"\n            [attr.download]=\"val.name\"\n            [style.width]=\"model.imageWidth\"\n            >{{ val.name }}</a\n          >\n        </div>\n        <div [class]=\"model.cssClasses.imageWrapper\">\n          <img\n            *ngIf=\"model.canPreviewImage(val)\"\n            [attr.src]=\"val.content | safeUrl\"\n            [style.height]=\"model.imageHeight\"\n            [style.width]=\"model.imageWidth\"\n            alt=\"File preview\"\n          />\n          <svg *ngIf=\"model.defaultImage(val)\" \n            [iconName]=\"model.cssClasses.defaultImageIconId\" [partCss]=\"model.cssClasses.defaultImage\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n          <div *ngIf=\"val.name && !model.isReadOnly\" [class]=\"model.cssClasses.removeFileButton\" (click)=\"model.doRemoveFile(val)\">\n            <span\n              [class]=\"model.cssClasses.removeFile\"\n              >{{ model.removeFileCaption }}</span\n            >\n            <svg *ngIf=\"model.cssClasses.removeFileSvgIconId\" [title]=\"model.removeFileCaption\" [partCss]=\"model.cssClasses.removeFileSvg\" [iconName]=\"model.cssClasses.removeFileSvgIconId\" [size]=\"'auto'\" sv-ng-svg-icon ></svg>\n          </div>\n        </div>\n        <div *ngIf=\"val.name && model.cssClasses.fileSignBottom\" [class]=\"model.cssClasses.fileSignBottom\">\n          <a\n            (click)=\"model.doDownloadFile($event, val)\"\n            [attr.href]=\"val.content | safeUrl\"\n            [attr.title]=\"val.name\"\n            [attr.download]=\"val.name\"\n            [style.width]=\"model.imageWidth\"\n            >{{ val.name }}</a\n          >\n        </div>\n      </span>\n    </div>\n    <button\n      type=\"button\"\n      *ngIf=\"model.showRemoveButtonBottom\"\n      [class]=\"model.showRemoveButtonBottom\"\n      (click)=\"model.doClean($event)\"\n    >\n      <span>{{ model.clearButtonCaption }}</span>\n      <svg *ngIf=\"model.cssClasses.removeButtonIconId\" [iconName]=\"model.cssClasses.removeButtonIconId\" [size]=\"'auto'\" [title]=\"model.clearButtonCaption\" sv-ng-svg-icon></svg>\n    </button>\n    <sv-action-bar *ngIf=\"model.mobileFileNavigatorVisible\" [model]=\"model.mobileFileNavigator\"></sv-action-bar>\n  </div>\n</div>", components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { 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: VisibleDirective, selector: "[visible]", inputs: ["visible"] }], pipes: { "safeUrl": SafeUrlPipe } });
+FileQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: FileQuestionComponent, selector: "sv-ng-file-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.fileRootCss\" #contentElement>\n  <input\n    [class]=\"model.cssClasses.fileInput\"\n    *ngIf=\"!model.isReadOnly\"\n    tabindex=\"-1\"\n    type=\"file\"\n    [attr.id]=\"model.inputId\"\n    (change)=\"model.doChange($event)\"\n    [attr.aria-required]=\"model.ariaRequired\"\n    [attr.aria-label]=\"model.ariaLabel\"\n    [attr.aria-invalid]=\"model.ariaInvalid\"\n    [attr.aria-describedby]=\"model.ariaDescribedBy\"\n    [attr.multiple]=\"model.multipleRendered\"\n    [attr.title]=\"model.inputTitle\"\n    [attr.accept]=\"model.acceptedTypes\"\n  />\n  <input\n    *ngIf=\"model.isReadOnly\"\n    type=\"file\"\n    disabled\n    [class]=\"model.getReadOnlyFileCss()\"\n    [attr.id]=\"model.inputId\"\n    [attr.multiple]=\"model.multipleRendered\"\n    [attr.placeholder]=\"model.title\"\n    style=\"color: transparent\"\n  />\n  <div [class]=\"model.cssClasses.dragArea\"\n    (dragenter)=\"model.onDragEnter($event)\"\n    (drop)=\"model.onDrop($event)\"\n    (dragover)=\"model.onDragOver($event)\"\n    (dragleave)=\"model.onDragLeave($event)\">  \n    <div\n      [class]=\"model.getFileDecoratorCss()\"\n    >\n      <span [class]=\"model.cssClasses.dragAreaPlaceholder\">{{ model.dragAreaPlaceholder }}</span>\n      <div [class]=\"model.cssClasses.wrapper\">\n        <label\n          role=\"button\"\n          tabindex=\"0\"\n          [class]=\"model.getChooseFileCss()\"\n          [attr.for]=\"model.inputId\"\n          [attr.aria-label]=\"model.chooseButtonCaption\"\n          [key2click]\n          >\n          <span>{{ model.chooseButtonCaption }}</span>\n          <svg *ngIf=\"model.cssClasses.chooseFileIconId\" [title]=\"model.chooseButtonCaption\" [iconName]=\"model.cssClasses.chooseFileIconId\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n        </label>\n        <span\n          [class]=\"model.cssClasses.noFileChosen\"\n          *ngIf=\"model.isEmpty()\"\n          >{{ model.noFileChosenCaption }}</span\n        >\n      </div>\n    </div>\n    <button\n      type=\"button\"\n      *ngIf=\"model.showRemoveButton\"\n      [class]=\"model.cssClasses.removeButton\"\n      (click)=\"model.doClean($event)\"\n    >\n      <span>{{ model.clearButtonCaption }}</span>\n      <svg *ngIf=\"model.cssClasses.removeButtonIconId\" [iconName]=\"model.cssClasses.removeButtonIconId\" [size]=\"'auto'\" [title]=\"model.clearButtonCaption\" sv-ng-svg-icon></svg>\n    </button>\n    <div [class]=\"model.cssClasses.fileList || undefined\" *ngIf=\"!model.isEmpty()\">\n      <span\n        *ngFor=\"let val of model.previewValue; index as index; trackBy: trackFilesFn\"\n        [visible]=\"val && model.isPreviewVisible(index)\"\n        [class]=\"model.cssClasses.preview\"\n      >\n        <div *ngIf=\"val.name && model.cssClasses.fileSign\" [class]=\"model.cssClasses.fileSign\">\n          <a\n            (click)=\"model.doDownloadFile($event, val)\"\n            [attr.href]=\"val.content | safeUrl\"\n            [attr.title]=\"val.name\"\n            [attr.download]=\"val.name\"\n            [style.width]=\"model.imageWidth\"\n            >{{ val.name }}</a\n          >\n        </div>\n        <div [class]=\"model.cssClasses.imageWrapper\">\n          <img\n            *ngIf=\"model.canPreviewImage(val)\"\n            [attr.src]=\"val.content | safeUrl\"\n            [style.height]=\"model.imageHeight\"\n            [style.width]=\"model.imageWidth\"\n            alt=\"File preview\"\n          />\n          <svg *ngIf=\"model.defaultImage(val)\" \n            [iconName]=\"model.cssClasses.defaultImageIconId\" [partCss]=\"model.cssClasses.defaultImage\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n          <div *ngIf=\"val.name && !model.isReadOnly\" [class]=\"model.cssClasses.removeFileButton\" (click)=\"model.doRemoveFile(val)\">\n            <span\n              [class]=\"model.cssClasses.removeFile\"\n              >{{ model.removeFileCaption }}</span\n            >\n            <svg *ngIf=\"model.cssClasses.removeFileSvgIconId\" [title]=\"model.removeFileCaption\" [partCss]=\"model.cssClasses.removeFileSvg\" [iconName]=\"model.cssClasses.removeFileSvgIconId\" [size]=\"'auto'\" sv-ng-svg-icon ></svg>\n          </div>\n        </div>\n        <div *ngIf=\"val.name && model.cssClasses.fileSignBottom\" [class]=\"model.cssClasses.fileSignBottom\">\n          <a\n            (click)=\"model.doDownloadFile($event, val)\"\n            [attr.href]=\"val.content | safeUrl\"\n            [attr.title]=\"val.name\"\n            [attr.download]=\"val.name\"\n            [style.width]=\"model.imageWidth\"\n            >{{ val.name }}</a\n          >\n        </div>\n      </span>\n    </div>\n    <button\n      type=\"button\"\n      *ngIf=\"model.showRemoveButtonBottom\"\n      [class]=\"model.showRemoveButtonBottom\"\n      (click)=\"model.doClean($event)\"\n    >\n      <span>{{ model.clearButtonCaption }}</span>\n      <svg *ngIf=\"model.cssClasses.removeButtonIconId\" [iconName]=\"model.cssClasses.removeButtonIconId\" [size]=\"'auto'\" [title]=\"model.clearButtonCaption\" sv-ng-svg-icon></svg>\n    </button>\n    <sv-action-bar *ngIf=\"model.mobileFileNavigatorVisible\" [model]=\"model.mobileFileNavigator\"></sv-action-bar>\n  </div>\n</div>", components: [{ type: SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { 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: FileQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -2560,7 +2561,7 @@ class CommentQuestionComponent extends QuestionAngular {
     }
 }
 CommentQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CommentQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-CommentQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CommentQuestionComponent, selector: "sv-ng-question-comment", usesInheritance: true, ngImport: i0, template: "<textarea\n*ngIf=\"!model.isReadOnlyRenderDiv()\"\n[readonly]=\"model.isInputReadOnly\"\n[attr.disabled]=\"model.renderedInputDisabled\"\n[id]=\"model.inputId\"\n[attr.maxlength]=\"model.getMaxLength()\"\n[attr.cols]=\"model.cols\"\n[attr.rows]=\"model.rows\"\n[attr.placeholder]=\"model.renderedPlaceholder\"\n[class]=\"model.className\"\n[value]=\"model.value || null\"\n(input)=\"model.onInput($event)\"\n(keydown)=\"model.onKeyDown($event)\"\n(change)=\"onChange($event)\"\n[attr.aria-required]=\"model.ariaRequired\"\n[attr.aria-label]=\"model.ariaLabel\"\n[attr.aria-invalid]=\"model.ariaInvalid\"\n[attr.aria-describedby]=\"model.ariaDescribedBy\"\n[style.resize]=\"model.resizeStyle\"\n#contentElement></textarea>\n<sv-ng-character-counter *ngIf=\"!model.isReadOnlyRenderDiv() && model.getMaxLength()\" \n[counter]=\"model.characterCounter\"\n[remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n</sv-ng-character-counter>\n<div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>", components: [{ type: CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+CommentQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CommentQuestionComponent, selector: "sv-ng-question-comment", usesInheritance: true, ngImport: i0, template: "<textarea\n*ngIf=\"!model.isReadOnlyRenderDiv()\"\n[readonly]=\"model.isInputReadOnly\"\n[attr.disabled]=\"model.renderedInputDisabled\"\n[id]=\"model.inputId\"\n[attr.maxlength]=\"model.getMaxLength()\"\n[attr.cols]=\"model.cols\"\n[attr.rows]=\"model.rows\"\n[attr.placeholder]=\"model.renderedPlaceholder\"\n[class]=\"model.className\"\n[value]=\"model.value || null\"\n(input)=\"model.onInput($event)\"\n(keydown)=\"model.onKeyDown($event)\"\n(change)=\"onChange($event)\"\n[attr.aria-required]=\"model.a11y_input_ariaRequired\"\n[attr.aria-label]=\"model.a11y_input_ariaLabel\"\n[attr.aria-labelledby]=\"model.a11y_input_ariaLabelledBy\"\n[attr.aria-invalid]=\"model.a11y_input_ariaInvalid\"\n[attr.aria-describedby]=\"model.a11y_input_ariaDescribedBy\"\n[style.resize]=\"model.resizeStyle\"\n#contentElement></textarea>\n<sv-ng-character-counter *ngIf=\"!model.isReadOnlyRenderDiv() && model.getMaxLength()\" \n[counter]=\"model.characterCounter\"\n[remainingCharacterCounter]=\"model.cssClasses.remainingCharacterCounter\">\n</sv-ng-character-counter>\n<div *ngIf=\"model.isReadOnlyRenderDiv()\" #contentElement>{{ model.value }}</div>", components: [{ type: CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CommentQuestionComponent, decorators: [{
             type: Component,
             args: [{
@@ -2796,7 +2797,7 @@ AngularComponentFactory.Instance.registerComponent("sv-paneldynamic-progress-tex
 class PanelDynamicQuestionComponent extends QuestionAngular {
     get renderedPanels() {
         if (this.model.isRenderModeList)
-            return this.model.panels;
+            return this.model.visiblePanels;
         const panels = [];
         if (this.model.currentPanel) {
             panels.push(this.model.currentPanel);
@@ -2852,7 +2853,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()\">\n      <ng-template [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n      <ng-container *ngIf=\"model.panelRemoveButtonLocation ==='right'\">\n        <sv-ng-paneldynamic-remove-btn *ngIf=\"model.canRemovePanel && panel.state != 'collapsed' && model.panelRemoveButtonLocation == 'right'\" [data]=\"{ panel: panel, question: model }\"></sv-ng-paneldynamic-remove-btn>\n      </ng-container>\n    </div>\n    <!-- add track by [key]=\"'separator' + panel.id\" -->\n    <hr [class]=\"model.cssClasses.separator\" *ngIf=\"model.isRenderModeList && index < model.panelCount - 1\"/>\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.panelCount !== 0 && !model.showLegacyNavigation\"></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: PaneldynamicRemoveButtonComponent, selector: "sv-ng-paneldynamic-remove-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 [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()\">\n      <ng-template [component]=\"{ name: getPanelComponentName(panel), data: getPanelComponentData(panel) }\"></ng-template>\n      <ng-container *ngIf=\"model.panelRemoveButtonLocation ==='right'\">\n        <sv-ng-paneldynamic-remove-btn *ngIf=\"model.canRemovePanel && panel.state != 'collapsed' && model.panelRemoveButtonLocation == 'right'\" [data]=\"{ panel: panel, question: model }\"></sv-ng-paneldynamic-remove-btn>\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: PaneldynamicRemoveButtonComponent, selector: "sv-ng-paneldynamic-remove-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: [{
@@ -3197,7 +3198,7 @@ class ImageQuestionComponent extends QuestionAngular {
     }
 }
 ImageQuestionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageQuestionComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ImageQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ImageQuestionComponent, selector: "sv-ng-image-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <img\n    *ngIf=\"model.renderedMode === 'image'\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml\"\n    [attr.alt]=\"model.altText || model.title\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    (loadedmetadata)=\"model.onLoadHandler()\"\n    (error)=\"model.onErrorHandler()\"\n  /><video\n    controls\n    *ngIf=\"model.renderedMode === 'video'\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    (loadedmetadata)=\"model.onLoadHandler()\"\n    (error)=\"model.onErrorHandler()\"\n  ></video>\n  <iframe\n    *ngIf=\"model.renderedMode === 'youtube'\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml | safeResourceUrl\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    ></iframe>\n    <div *ngIf=\"!model.imageLink || model.contentNotLoaded\" [class]=\"model.cssClasses.noImage\">\n      <svg [iconName]=\"model.cssClasses.noImageSvgIconId\" [size]=\"48\" sv-ng-svg-icon></svg>\n    </div>\n</div>", 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"] }], pipes: { "safeResourceUrl": SafeResourceUrlPipe } });
+ImageQuestionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ImageQuestionComponent, selector: "sv-ng-image-question", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" #contentElement>\n  <img\n    *ngIf=\"model.renderedMode === 'image'\"\n    [visible]=\"!!model.locImageLink.renderedHtml && !model.contentNotLoaded\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml\"\n    [attr.alt]=\"model.altText || model.title\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    (load)=\"model.onLoadHandler()\"\n    (error)=\"model.onErrorHandler()\"\n  /><video\n    controls\n    *ngIf=\"model.renderedMode === 'video'\"\n    [visible]=\"!!model.locImageLink.renderedHtml && !model.contentNotLoaded\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    (loadedmetadata)=\"model.onLoadHandler()\"\n    (error)=\"model.onErrorHandler()\"\n  ></video>\n  <iframe\n    *ngIf=\"model.renderedMode === 'youtube'\"\n    [class]=\"model.getImageCss()\"\n    [attr.src]=\"model.locImageLink.renderedHtml | safeResourceUrl\"\n    [attr.width]=\"model.renderedWidth\"\n    [attr.height]=\"model.renderedHeight\"\n    [style]=\"{ objectFit: model.imageFit }\"\n    ></iframe>\n    <div *ngIf=\"!model.locImageLink.renderedHtml || model.contentNotLoaded\" [class]=\"model.cssClasses.noImage\">\n      <svg [iconName]=\"model.cssClasses.noImageSvgIconId\" [size]=\"48\" sv-ng-svg-icon></svg>\n    </div>\n</div>", 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: VisibleDirective, selector: "[visible]", inputs: ["visible"] }], pipes: { "safeResourceUrl": SafeResourceUrlPipe } });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageQuestionComponent, decorators: [{
             type: Component,
             args: [{