survey-angular-ui 1.9.127 → 1.9.128

package/bundles/survey-angular-ui.umd.js

@@ -3336,28 +3336,27 @@
       function ProgressButtonsComponent(changeDetectorRef) {
           this.changeDetectorRef = changeDetectorRef;
           this.hasScroller = false;
-          this.updateScroller = undefined;
+          this.canShowHeader = false;
+          this.canShowFooter = false;
+          this.canShowItemTitles = true;
       }
-      ProgressButtonsComponent.prototype.createProgressButtonsModel = function () {
-          this.progressButtonsModel = new Survey.SurveyProgressButtonsModel(this.model);
-      };
-      ProgressButtonsComponent.prototype.ngOnInit = function () {
-          this.createProgressButtonsModel();
-      };
-      ProgressButtonsComponent.prototype.ngOnChanges = function (changes) {
-          this.createProgressButtonsModel();
+      ProgressButtonsComponent.prototype.onResize = function (canShowItemTitles) {
+          this.canShowItemTitles = canShowItemTitles;
+          this.canShowHeader = !this.canShowItemTitles;
+          this.changeDetectorRef.detectChanges();
       };
-      ProgressButtonsComponent.prototype.isListElementClickable = function (index) {
-          return this.progressButtonsModel.isListElementClickable(index);
+      ProgressButtonsComponent.prototype.onUpdateScroller = function (hasScroller) {
+          this.hasScroller = hasScroller;
+          this.changeDetectorRef.detectChanges();
       };
-      ProgressButtonsComponent.prototype.getListElementCss = function (index) {
-          return this.progressButtonsModel.getListElementCss(index);
+      ProgressButtonsComponent.prototype.onUpdateSettings = function () {
+          this.canShowItemTitles = this.model.showItemTitles;
+          this.canShowFooter = !this.model.showItemTitles;
+          this.changeDetectorRef.detectChanges();
       };
-      ProgressButtonsComponent.prototype.clickListElement = function (index) {
-          this.progressButtonsModel.clickListElement(index);
+      ProgressButtonsComponent.prototype.ngOnInit = function () {
       };
-      ProgressButtonsComponent.prototype.getScrollButtonCss = function (isLeftScroll) {
-          return this.progressButtonsModel.getScrollButtonCss(this.hasScroller, isLeftScroll);
+      ProgressButtonsComponent.prototype.ngOnChanges = function (changes) {
       };
       ProgressButtonsComponent.prototype.clickScrollButton = function (isLeftScroll) {
           if (this.progressButtonsListContainer) {
@@ -3365,27 +3364,20 @@
           }
       };
       ProgressButtonsComponent.prototype.ngAfterViewInit = function () {
-          var _this = this;
-          this.progressButtonsModel = new Survey.SurveyProgressButtonsModel(this.model);
-          this.updateScroller = setInterval(function () {
-              var _a;
-              if (!!((_a = _this.progressButtonsListContainer) === null || _a === void 0 ? void 0 : _a.nativeElement)) {
-                  var listContainerElement = _this.progressButtonsListContainer.nativeElement;
-                  _this.hasScroller = listContainerElement.scrollWidth > listContainerElement.offsetWidth;
-                  _this.changeDetectorRef.detectChanges();
-              }
-          }, 100);
+          var _a;
+          if (!!((_a = this.progressButtonsListContainer) === null || _a === void 0 ? void 0 : _a.nativeElement)) {
+              var element = this.progressButtonsListContainer.nativeElement;
+              this.respManager = new Survey.ProgressButtonsResponsivityManager(this.model, element, this);
+          }
       };
       ProgressButtonsComponent.prototype.ngOnDestroy = function () {
-          if (typeof this.updateScroller !== "undefined") {
-              clearInterval(this.updateScroller);
-              this.updateScroller = undefined;
-          }
+          var _a;
+          (_a = this.respManager) === null || _a === void 0 ? void 0 : _a.dispose();
       };
       return ProgressButtonsComponent;
   }());
   ProgressButtonsComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ProgressButtonsComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  ProgressButtonsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ProgressButtonsComponent, selector: "sv-ng-progress-buttons", inputs: { model: "model" }, viewQueries: [{ propertyName: "progressButtonsListContainer", first: true, predicate: ["progressButtonsListContainer"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div [class]=\"model.css.progressButtonsContainerCenter\">\n  <div [class]=\"model.css.progressButtonsContainer\">\n    <div\n      [class]=\"getScrollButtonCss(true)\"\n      (click)=\"clickScrollButton(true)\"\n      role=\"button\"\n    ></div>\n    <div\n      [class]=\"model.css.progressButtonsListContainer\" #progressButtonsListContainer>\n      <ul [class]=\"model.css.progressButtonsList\">\n        <li\n          *ngFor=\"let page of model.visiblePages; index as index\"\n          [class]=\"getListElementCss(index)\"\n          (click)=\"isListElementClickable(index) ? clickListElement(index) : null\">\n          <div\n            [class]=\"model.css.progressButtonsPageTitle\"\n            [title]=\"page.renderedNavigationTitle\"\n          >\n            {{ page.renderedNavigationTitle }}\n          </div>\n          <div\n            [class]=\"model.css.progressButtonsPageDescription\"\n            [title]=\"page.locNavigationDescription.renderedHtml\"\n          >\n            {{ page.locNavigationDescription.renderedHtml }}\n          </div>\n        </li>\n      </ul>\n    </div>\n    <div\n      [class]=\"getScrollButtonCss(false)\"\n      (click)=\"clickScrollButton(false)\"\n      role=\"button\"\n    ></div>\n  </div>\n</div>", directives: [{ type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  ProgressButtonsComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ProgressButtonsComponent, selector: "sv-ng-progress-buttons", inputs: { model: "model", survey: "survey", container: "container" }, viewQueries: [{ propertyName: "progressButtonsListContainer", first: true, predicate: ["progressButtonsListContainer"], descendants: true }], usesOnChanges: true, ngImport: i0__namespace, template: "<div [class]=\"model.getRootCss(container)\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuemax=\"100\" aria-label=\"progress\">\n  <div *ngIf=\"canShowHeader\" [class]=\"survey.css.progressButtonsHeader\">\n    <div [class]=\"survey.css.progressButtonsPageTitle\" [title]=\"model.headerText\">{{ model.headerText }}</div>\n  </div>\n  <div [class]=\"survey.css.progressButtonsContainer\">\n    <div\n      [class]=\"model.getScrollButtonCss(hasScroller, true)\"\n      (click)=\"clickScrollButton(true)\"\n      role=\"button\"\n    ></div>\n    <div\n      [class]=\"survey.css.progressButtonsListContainer\" #progressButtonsListContainer>\n      <ul [class]=\"survey.css.progressButtonsList\">\n        <li\n          *ngFor=\"let page of survey.visiblePages; index as index\"\n          [class]=\"model.getListElementCss(index)\"\n          (click)=\"model.isListElementClickable(index) ? model.clickListElement(page) : null\"\n          [attr.data-page-number]=\"model.getItemNumber(page)\">\n          <div [class]=\"survey.css.progressButtonsConnector\"></div>\n          <div *ngIf=\"canShowItemTitles\"\n            [class]=\"survey.css.progressButtonsPageTitle\"\n            [title]=\"page.renderedNavigationTitle\"\n          >\n            {{ page.renderedNavigationTitle }}\n          </div>\n          <div *ngIf=\"canShowItemTitles\"\n            [class]=\"survey.css.progressButtonsPageDescription\"\n            [title]=\"page.locNavigationDescription.renderedHtml\"\n          >\n            {{ page.locNavigationDescription.renderedHtml }}\n          </div>\n        </li>\n      </ul>\n    </div>\n    <div\n      [class]=\"model.getScrollButtonCss(hasScroller, false)\"\n      (click)=\"clickScrollButton(false)\"\n      role=\"button\"\n    ></div>\n  </div>\n  <div *ngIf=\"canShowFooter\" [class]=\"survey.css.progressButtonsFooter\">\n    <div [class]=\"survey.css.progressButtonsPageTitle\" [title]=\"model.footerText\">{{ model.footerText }}</div>\n  </div>\n</div>", directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ProgressButtonsComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -3394,6 +3386,10 @@
                   }]
           }], ctorParameters: function () { return [{ type: i0__namespace.ChangeDetectorRef }]; }, propDecorators: { model: [{
                   type: i0.Input
+              }], survey: [{
+                  type: i0.Input
+              }], container: [{
+                  type: i0.Input
               }], progressButtonsListContainer: [{
                   type: i0.ViewChild,
                   args: ["progressButtonsListContainer"]