survey-creator-angular 1.9.80 → 1.9.82

package/fesm2015/survey-creator-angular.js

@@ -369,8 +369,9 @@ class PageNavigatorItemComponent extends BaseAngular {
         return this.model;
     }
     click(event) {
-        event.stopPropagation();
         this.getModel().action();
+        event.stopPropagation();
+        event.preventDefault();
     }
 }
 PageNavigatorItemComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: PageNavigatorItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
@@ -402,9 +403,11 @@ class PageNavigatorComponent extends CreatorModelComponent {
             const el = this.container.nativeElement;
             if (!!el && !!((_b = (_a = el.parentElement) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement)) {
                 const self = this;
-                el.parentElement.parentElement.parentElement.onscroll = function (ev) {
+                const scrollableViewPort = el.parentElement.parentElement.parentElement;
+                scrollableViewPort.onscroll = function (ev) {
                     return self.model.onContainerScroll(ev.currentTarget);
                 };
+                self.model.setScrollableContainer(scrollableViewPort);
                 self.model.setItemsContainer(el.parentElement);
             }
         }
@@ -996,7 +999,7 @@ class ImageItemValueDesignerComponent extends CreatorModelComponent {
     }
 }
 ImageItemValueDesignerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageItemValueDesignerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-ImageItemValueDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ImageItemValueDesignerComponent, selector: "svc-image-item-value", inputs: { componentName: "componentName", componentData: "componentData" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div (pointerdown)=\"adorner.onPointerDown($event)\" [class]=\"adorner.getRootCss()\" [attr.data-sv-drop-target-item-value]=\"adorner.isDraggable ? this.item.value : null\" #container>\n    <div class=\"svc-image-item-value-wrapper__ghost\" [style]=\"getNewItemStyle()\"></div>\n\n    <div class=\"svc-image-item-value-wrapper__content\">\n      <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n\n      <ng-container *ngIf=\"!adorner.isNew\">\n        <div *ngIf=\"!adorner.isNew\" class=\"svc-image-item-value__item\">\n          <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n        </div>\n        <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__drag-area-indicator\" (pointerdown)=\"adorner.onPointerDown($event)\" [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n          <svg [iconName]=\"'icon-drag-area-indicator'\" [size]=\"24\" sv-ng-svg-icon></svg>\n        </span>\n        <div class=\"svc-image-item-value-controls\" data-bind=\"event: { pointerdown: blockEvent }\">\n          <ng-container *ngIf=\"adorner.allowRemove\">\n            <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__choose-file\" (click)=\"adorner.chooseFile(adorner)\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n              <svg [iconName]=\"'icon-file'\" [size]=\"24\" sv-ng-svg-icon></svg>\n            </span>\n            <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__remove\" (click)=\"adorner.remove(adorner)\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n              <svg [iconName]=\"'icon-delete'\" [size]=\"24\" sv-ng-svg-icon></svg>\n            </span>\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"adorner.isNew\">\n        <div class=\"svc-image-item-value__item\"\n          data-bind=\"event: { dragover: dragover, drop: drop, dragleave: dragleave }\">\n          <div class=\"sd-imagepicker__item sd-imagepicker__item--inline\">\n            <label class=\"sd-imagepicker__label\">\n              <div [style]=\"getNewItemStyle()\" class=\"sd-imagepicker__image\"></div>\n            </label>\n          </div>\n        </div>\n\n        <div class=\"svc-image-item-value-controls\" data-bind=\"event: { pointerdown: blockEvent }\">\n          <span  class=\"svc-image-item-value-controls__button svc-image-item-value-controls__add\" [key2click] (click)=\"adorner.chooseNewFile(adorner)\" [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n            <svg *ngIf=\"adorner.allowAdd\" [iconName]=\"'icon-add-lg'\" [size]=\"24\" sv-ng-svg-icon></svg>\n          </span>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.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: i1.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }, { type: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
+ImageItemValueDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ImageItemValueDesignerComponent, selector: "svc-image-item-value", inputs: { componentName: "componentName", componentData: "componentData" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div (pointerdown)=\"adorner.onPointerDown($event)\" [class]=\"adorner.getRootCss()\" [attr.data-sv-drop-target-item-value]=\"adorner.isDraggable ? this.item.value : null\" #container>\n    <div class=\"svc-image-item-value-wrapper__ghost\" [style]=\"getNewItemStyle()\"></div>\n\n    <div class=\"svc-image-item-value-wrapper__content\">\n      <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n\n      <ng-container *ngIf=\"!adorner.isNew\">\n        <div *ngIf=\"!adorner.isNew\" class=\"svc-image-item-value__item\">\n          <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n        </div>\n        <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__drag-area-indicator\" (pointerdown)=\"adorner.onPointerDown($event)\" [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n          <svg [iconName]=\"'icon-drag-area-indicator'\" [size]=\"24\" sv-ng-svg-icon></svg>\n        </span>\n        <div class=\"svc-image-item-value-controls\" data-bind=\"event: { pointerdown: blockEvent }\">\n          <ng-container *ngIf=\"adorner.allowRemove && !adorner.isUploading\">\n            <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__choose-file\" (click)=\"adorner.chooseFile(adorner)\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n              <svg [iconName]=\"'icon-file'\" [size]=\"24\" sv-ng-svg-icon></svg>\n            </span>\n            <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__remove\" (click)=\"adorner.remove(adorner)\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n              <svg [iconName]=\"'icon-delete'\" [size]=\"24\" sv-ng-svg-icon></svg>\n            </span>\n          </ng-container>\n        </div>\n      </ng-container>\n\n      <ng-container *ngIf=\"adorner.isNew\">\n        <div class=\"svc-image-item-value__item\"\n          data-bind=\"event: { dragover: dragover, drop: drop, dragleave: dragleave }\">\n          <div class=\"sd-imagepicker__item sd-imagepicker__item--inline\">\n            <label class=\"sd-imagepicker__label\">\n              <div [style]=\"getNewItemStyle()\" class=\"sd-imagepicker__image\"></div>\n            </label>\n          </div>\n        </div>\n\n        <div class=\"svc-image-item-value-controls\" data-bind=\"event: { pointerdown: blockEvent }\">\n          <span class=\"svc-image-item-value-controls__button svc-image-item-value-controls__add\" [key2click] (click)=\"adorner.chooseNewFile(adorner)\" [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n            <svg *ngIf=\"adorner.allowAdd && !adorner.isUploading\" [iconName]=\"'icon-add-lg'\" [size]=\"24\" sv-ng-svg-icon></svg>\n          </span>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.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: i1.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }, { type: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: ImageItemValueDesignerComponent, decorators: [{
             type: Component,
             args: [{
@@ -1100,7 +1103,7 @@ AngularComponentFactory.Instance.registerComponent("svc-image-question", Questio
 class QuestionImageAdornerDesignerComponent extends EmbeddedViewContentComponent {
 }
 QuestionImageAdornerDesignerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionImageAdornerDesignerComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-QuestionImageAdornerDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionImageAdornerDesignerComponent, selector: "svc-image-question-adorner", inputs: { adorner: "adorner", question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div class=\"svc-image-question-controls\">\n    <ng-container *ngIf=\"adorner.allowEdit\">\n      <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n      <span class=\"svc-image-question-controls__button\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n        <svg  [iconName]=\"'icon-file'\" [size]=\"24\" (click)=\"adorner.chooseFile(adorner)\" sv-ng-svg-icon></svg>\n      </span>\n    </ng-container>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.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: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
+QuestionImageAdornerDesignerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionImageAdornerDesignerComponent, selector: "svc-image-question-adorner", inputs: { adorner: "adorner", question: "question" }, usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div class=\"svc-image-question-controls\">\n    <ng-container *ngIf=\"adorner.allowEdit && !adorner.isUploading\">\n      <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n      <span class=\"svc-image-question-controls__button\" [key2click] [attr.title]=\"undefined\" [attr.aria-label]=\"undefined\">\n        <svg  [iconName]=\"'icon-file'\" [size]=\"24\" (click)=\"adorner.chooseFile(adorner)\" sv-ng-svg-icon></svg>\n      </span>\n    </ng-container>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.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: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionImageAdornerDesignerComponent, decorators: [{
             type: Component,
             args: [{
@@ -1583,7 +1586,7 @@ class CreatorLogoImageComponent extends CreatorModelComponent {
     }
 }
 CreatorLogoImageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreatorLogoImageComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
-CreatorLogoImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CreatorLogoImageComponent, selector: "svc-logo-image", inputs: { data: "data" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div class=\"svc-logo-image\" #container>\n    <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n    <ng-container *ngIf=\"!survey.locLogo.renderedHtml\">\n      <ng-container *ngIf=\"model.allowEdit\">\n        <div class=\"svc-logo-image-placeholder\" (click)=\"model.chooseFile(model)\" [key2click]>\n          <svg>\n            <use xlink:href=\"#icon-logo\"></use>\n          </svg>\n        </div>\n      </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"survey.locLogo.renderedHtml\">\n      <div [class]=\"model.containerCss\" (click)=\"model.chooseFile(model)\" [key2click]>\n        <sv-logo-image [data]=\"survey\"></sv-logo-image>\n      </div>\n    </ng-container>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.LogoImageComponent, selector: "sv-logo-image", inputs: ["data"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
+CreatorLogoImageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: CreatorLogoImageComponent, selector: "svc-logo-image", inputs: { data: "data" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: ElementRef }], usesInheritance: true, ngImport: i0, template: "<ng-template #template>\n  <div class=\"svc-logo-image\" #container>\n    <input type=\"file\" aria-hidden=\"true\" tabindex=\"-1\" accept=\"image/*\" class=\"svc-choose-file-input\" />\n    <ng-container *ngIf=\"!survey.locLogo.renderedHtml\">\n      <ng-container *ngIf=\"model.allowEdit && !model.isUploading\">\n        <div class=\"svc-logo-image-placeholder\" (click)=\"model.chooseFile(model)\" [key2click]>\n          <svg>\n            <use xlink:href=\"#icon-logo\"></use>\n          </svg>\n        </div>\n      </ng-container>\n    </ng-container>\n    <ng-container *ngIf=\"survey.locLogo.renderedHtml\">\n      <div [class]=\"model.containerCss\" (click)=\"model.chooseFile(model)\" [key2click]>\n        <sv-logo-image [data]=\"survey\"></sv-logo-image>\n      </div>\n    </ng-container>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1.LogoImageComponent, selector: "sv-logo-image", inputs: ["data"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: CreatorLogoImageComponent, decorators: [{
             type: Component,
             args: [{
@@ -1599,6 +1602,31 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
             }] } });
 AngularComponentFactory.Instance.registerComponent("svc-logo-image", CreatorLogoImageComponent);
 
+class QuestionSpinEditorComponent extends QuestionAngular {
+}
+QuestionSpinEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionSpinEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+QuestionSpinEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionSpinEditorComponent, selector: "ng-component", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\" (keydown)=\"model.onKeyDown($event)\">\n  <input \n    autocomplete=\"off\"\n    [disabled]=\"model.isInputReadOnly\" \n    [attr.id]=\"model.inputId\"\n    [attr.placeholder]=\"model.renderedPlaceholder\" \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    (change)=\"model.onChange($event)\" \n    (keydown)=\"model.onInputKeyDown($event)\" \n    (blur)=\"model.onBlur($event)\" \n    (focus)=\"model.onFocus($event)\" \n    (beforeinput)=\"model.onBeforeInput($event)\"\n    [value]=\"model.renderedValue\"\n    [class]=\"model.cssClasses.control\"/>\n  <span [class]=\"model.cssClasses.buttonsContainer\">\n    <button\n      [class]=\"model.cssClasses.arrowButton\" (mousedown)=\"model.onDownButtonMouseDown()\" (mouseup)=\"model.onButtonMouseUp()\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\">\n      <svg [iconName]=\"model.cssClasses.decreaseButtonIcon\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n    </button>\n    <button\n    [class]=\"model.cssClasses.arrowButton\" (mousedown)=\"model.onUpButtonMouseDown()\" (mouseup)=\"model.onButtonMouseUp()\" (blur)=\"model.onBlur($event)\" (focus)=\"model.onFocus($event)\">\n    <svg [iconName]=\"model.cssClasses.increaseButtonIcon\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n  </button>\n  </span>\n</div>", components: [{ type: i1.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionSpinEditorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    templateUrl: "./spin-editor.component.html"
+                }]
+        }] });
+AngularComponentFactory.Instance.registerComponent("spinedit-question", QuestionSpinEditorComponent);
+
+class QuestionColorComponent extends QuestionAngular {
+}
+QuestionColorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionColorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
+QuestionColorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionColorComponent, selector: "svc-color", usesInheritance: true, ngImport: i0, template: "<div [class]=\"model.cssClasses.root\">\n  <span [class]=\"model.cssClasses.swatch\" [style]=\"model.getSwatchStyle()\"></span>\n  <input autocomplete=\"off\" \n    [disabled]=\"model.isInputReadOnly\" \n    [attr.id]=\"model.inputId\" \n    [placeholder]=\"model.renderedPlaceholder\" \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    (change)=\"model.onChange($event)\" \n    (blur)=\"model.onBlur($event)\" \n    (beforeinput)=\"model.onBeforeInput($event)\"\n    [value]=\"model.renderedValue\"\n    [class]=\"model.cssClasses.control\"/>  \n    <label [class]=\"model.cssClasses.colorDropdown\">\n      <svg [iconName]=\"model.cssClasses.colorDrodownIcon\" [size]=\"'auto'\" sv-ng-svg-icon></svg>\n    <input type=\"color\" [class]=\"model.cssClasses.colorInput\" [value]=\"model.renderedValue\" (change)=\"model.onColorInputChange($event)\"/>\n  </label>\n</div>", components: [{ type: i1.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: QuestionColorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    templateUrl: "color.component.html",
+                    selector: "svc-color"
+                }]
+        }] });
+AngularComponentFactory.Instance.registerComponent("color-question", QuestionColorComponent);
+
 class SurveyCreatorModule {
 }
 SurveyCreatorModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SurveyCreatorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
@@ -1606,11 +1634,11 @@ SurveyCreatorModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", ver
         AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
         QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
         ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
-        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent], imports: [CommonModule, FormsModule, SurveyModule], exports: [CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, SvgBundleComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent,
+        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, QuestionColorComponent], imports: [CommonModule, FormsModule, SurveyModule], exports: [CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, SvgBundleComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent,
         AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
         QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
         ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
-        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent] });
+        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, QuestionColorComponent] });
 SurveyCreatorModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: SurveyCreatorModule, providers: [], imports: [[
             CommonModule, FormsModule, SurveyModule
         ]] });
@@ -1621,7 +1649,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
                         QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
                         ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
-                        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent],
+                        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, QuestionColorComponent],
                     imports: [
                         CommonModule, FormsModule, SurveyModule
                     ],
@@ -1630,7 +1658,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
                         AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
                         QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
                         ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
-                        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent
+                        QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, QuestionColorComponent
                     ],
                     providers: [],
                 }]
@@ -1640,5 +1668,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AceJsonEditorComponent, ActionButtonComponent, AdaptiveToolboxComponent, CellQuestionComponent, CellQuestionDropdownComponent, CreatorComponent, CreatorLogoImageComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, DesignerTabComponent, EmbeddedSurveyQuestionComponent, ImageItemValueDesignerComponent, ItemValueDesignerComponent, LinkValueQuestionComponent, LogicAddButtonComponent, LogicOperatorComponent, LogicTabComponent, MatrixCellComponent, ObjectSelectorComponent, PageDesignerComponent, PageNavigatorComponent, PageNavigatorItemComponent, PanelDesignerComponent, PropertyGridComponent, QuestionDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionDropdownDesignerComponent, QuestionEditorComponent, QuestionImageAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionWidgetDesignerComponent, SidebarComponent, SidebarTabComponent, SimulatorComponent, StringEditorComponent, SurveyCreatorModule, SurveyResultsComponent, SurveyResultsTableRowComponent, SvgBundleComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, TabbledMenuComponent, TestAgainActionComponent, TestTabComponent, TextareaJsonEditorComponent, ToolboxCategoryComponent, ToolboxComponent, ToolboxItemComponent, ToolboxToolComponent, TranslationSkeletonComponent, TranslationTabComponent };
+export { AceJsonEditorComponent, ActionButtonComponent, AdaptiveToolboxComponent, CellQuestionComponent, CellQuestionDropdownComponent, CreatorComponent, CreatorLogoImageComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, DesignerTabComponent, EmbeddedSurveyQuestionComponent, ImageItemValueDesignerComponent, ItemValueDesignerComponent, LinkValueQuestionComponent, LogicAddButtonComponent, LogicOperatorComponent, LogicTabComponent, MatrixCellComponent, ObjectSelectorComponent, PageDesignerComponent, PageNavigatorComponent, PageNavigatorItemComponent, PanelDesignerComponent, PropertyGridComponent, QuestionColorComponent, QuestionDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionDropdownDesignerComponent, QuestionEditorComponent, QuestionImageAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, QuestionWidgetDesignerComponent, SidebarComponent, SidebarTabComponent, SimulatorComponent, StringEditorComponent, SurveyCreatorModule, SurveyResultsComponent, SurveyResultsTableRowComponent, SvgBundleComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, TabbledMenuComponent, TestAgainActionComponent, TestTabComponent, TextareaJsonEditorComponent, ToolboxCategoryComponent, ToolboxComponent, ToolboxItemComponent, ToolboxToolComponent, TranslationSkeletonComponent, TranslationTabComponent };
 //# sourceMappingURL=survey-creator-angular.js.map