survey-creator-angular 1.11.4 → 1.11.6

package/angular-ui.d.ts

@@ -38,6 +38,8 @@ export * from "./panel.component";
 export * from "./toolbox/adaptive-toolbox.component";
 export * from "./toolbox/toolbox-tool.component";
 export * from "./toolbox/toolbox-item.component";
+export * from "./toolbox/toolbox-item-group.component";
+export * from "./toolbox/toolbox-list.component";
 export * from "./toolbox/toolbox-category.component";
 export * from "./string-editor.component";
 export * from "./page-navigator/page-navigator.component";

package/angular-ui.module.d.ts

@@ -31,40 +31,42 @@ import * as i29 from "./tabs/theme/theme.component";
 import * as i30 from "./toolbox/adaptive-toolbox.component";
 import * as i31 from "./toolbox/toolbox-tool.component";
 import * as i32 from "./toolbox/toolbox-item.component";
-import * as i33 from "./toolbox/toolbox-category.component";
-import * as i34 from "./string-editor.component";
-import * as i35 from "./page-navigator/page-navigator.component";
-import * as i36 from "./page-navigator/page-navigator-item.component";
-import * as i37 from "./adorners/question-dropdown.component";
-import * as i38 from "./adorners/question-image.component";
-import * as i39 from "./adorners/item-value.component";
-import * as i40 from "./adorners/image-item-value.component";
-import * as i41 from "./questions/logic-operator.component";
-import * as i42 from "./adorners/matrix-cell.component";
-import * as i43 from "./question-editor.component";
-import * as i44 from "./adorners/cell-question-dropdown.component";
-import * as i45 from "./row.component";
-import * as i46 from "./tabs/designer/designer-pages.component";
-import * as i47 from "./tabs/designer/designer-survey.component";
-import * as i48 from "./adorners/cell-question.component";
-import * as i49 from "./question-widget.component";
-import * as i50 from "./toolbox/toolbox.component";
-import * as i51 from "./header/logo-image.component";
-import * as i52 from "./adorners/question-rating.component";
-import * as i53 from "./custom-questions/spin-editor.component";
-import * as i54 from "./custom-questions/color-item.component";
-import * as i55 from "./custom-questions/color.component";
-import * as i56 from "./custom-questions/file.component";
-import * as i57 from "./page-add-question.component";
-import * as i58 from "./question-banner.component";
-import * as i59 from "./tabs/json/json-error-item.component";
-import * as i60 from "./custom-questions/text-with-reset.component";
-import * as i61 from "./tabs/translation/translate-from-action.component";
-import * as i62 from "@angular/common";
-import * as i63 from "@angular/forms";
-import * as i64 from "survey-angular-ui";
+import * as i33 from "./toolbox/toolbox-item-group.component";
+import * as i34 from "./toolbox/toolbox-list.component";
+import * as i35 from "./toolbox/toolbox-category.component";
+import * as i36 from "./string-editor.component";
+import * as i37 from "./page-navigator/page-navigator.component";
+import * as i38 from "./page-navigator/page-navigator-item.component";
+import * as i39 from "./adorners/question-dropdown.component";
+import * as i40 from "./adorners/question-image.component";
+import * as i41 from "./adorners/item-value.component";
+import * as i42 from "./adorners/image-item-value.component";
+import * as i43 from "./questions/logic-operator.component";
+import * as i44 from "./adorners/matrix-cell.component";
+import * as i45 from "./question-editor.component";
+import * as i46 from "./adorners/cell-question-dropdown.component";
+import * as i47 from "./row.component";
+import * as i48 from "./tabs/designer/designer-pages.component";
+import * as i49 from "./tabs/designer/designer-survey.component";
+import * as i50 from "./adorners/cell-question.component";
+import * as i51 from "./question-widget.component";
+import * as i52 from "./toolbox/toolbox.component";
+import * as i53 from "./header/logo-image.component";
+import * as i54 from "./adorners/question-rating.component";
+import * as i55 from "./custom-questions/spin-editor.component";
+import * as i56 from "./custom-questions/color-item.component";
+import * as i57 from "./custom-questions/color.component";
+import * as i58 from "./custom-questions/file.component";
+import * as i59 from "./page-add-question.component";
+import * as i60 from "./question-banner.component";
+import * as i61 from "./tabs/json/json-error-item.component";
+import * as i62 from "./custom-questions/text-with-reset.component";
+import * as i63 from "./tabs/translation/translate-from-action.component";
+import * as i64 from "@angular/common";
+import * as i65 from "@angular/forms";
+import * as i66 from "survey-angular-ui";
 export declare class SurveyCreatorModule {
     static ɵfac: i0.ɵɵFactoryDeclaration<SurveyCreatorModule, never>;
-    static ɵmod: i0.ɵɵNgModuleDeclaration<SurveyCreatorModule, [typeof i1.CreatorComponent, typeof i2.DesignerTabComponent, typeof i3.PageDesignerComponent, typeof i4.QuestionDesignerComponent, typeof i5.PanelDesignerComponent, typeof i6.TabbledMenuComponent, typeof i7.TabbedMenuItemComponent, typeof i8.TabbedMenuItemWrapperComponent, typeof i9.SidebarComponent, typeof i10.SidebarTabComponent, typeof i11.ObjectSelectorComponent, typeof i12.PropertyGridComponent, typeof i13.SearchComponent, typeof i14.TextareaJsonEditorComponent, typeof i15.AceJsonEditorComponent, typeof i16.LogicTabComponent, typeof i17.LogicAddButtonComponent, typeof i18.ActionButtonComponent, typeof i19.SwitcherComponent, typeof i20.LinkValueQuestionComponent, typeof i21.EmbeddedSurveyQuestionComponent, typeof i22.TranslationTabComponent, typeof i23.TranslationSkeletonComponent, typeof i24.SimulatorComponent, typeof i25.TestTabComponent, typeof i26.TestAgainActionComponent, typeof i27.SurveyResultsComponent, typeof i28.SurveyResultsTableRowComponent, typeof i29.ThemeTabComponent, typeof i30.AdaptiveToolboxComponent, typeof i31.ToolboxToolComponent, typeof i32.ToolboxItemComponent, typeof i33.ToolboxCategoryComponent, typeof i34.StringEditorComponent, typeof i35.PageNavigatorComponent, typeof i36.PageNavigatorItemComponent, typeof i37.QuestionDropdownDesignerComponent, typeof i37.QuestionDropdownAdornerDesignerComponent, typeof i38.QuestionImageDesignerComponent, typeof i38.QuestionImageAdornerDesignerComponent, typeof i39.ItemValueDesignerComponent, typeof i40.ImageItemValueDesignerComponent, typeof i41.LogicOperatorComponent, typeof i42.MatrixCellComponent, typeof i43.QuestionEditorComponent, typeof i44.CellQuestionDropdownComponent, typeof i45.CreatorRowComponent, typeof i46.DesignerPagesComponent, typeof i47.DesignerSurveyComponent, typeof i48.CellQuestionComponent, typeof i49.QuestionWidgetDesignerComponent, typeof i50.ToolboxComponent, typeof i51.CreatorLogoImageComponent, typeof i52.QuestionRatingAdornerDesignerComponent, typeof i52.QuestionRatingDesignerComponent, typeof i53.QuestionSpinEditorComponent, typeof i54.ColorItemComponent, typeof i55.QuestionColorComponent, typeof i56.QuestionFileEditorComponent, typeof i57.AddQuestionButtonComponent, typeof i58.QuestionBannerComponent, typeof i59.JsonErrorItemComponent, typeof i60.QuestionTextWithResetComponent, typeof i61.TranslateFromAction], [typeof i62.CommonModule, typeof i63.FormsModule, typeof i64.SurveyModule], [typeof i1.CreatorComponent, typeof i2.DesignerTabComponent, typeof i3.PageDesignerComponent, typeof i4.QuestionDesignerComponent, typeof i5.PanelDesignerComponent, typeof i6.TabbledMenuComponent, typeof i7.TabbedMenuItemComponent, typeof i8.TabbedMenuItemWrapperComponent, typeof i9.SidebarComponent, typeof i10.SidebarTabComponent, typeof i11.ObjectSelectorComponent, typeof i12.PropertyGridComponent, typeof i13.SearchComponent, typeof i14.TextareaJsonEditorComponent, typeof i15.AceJsonEditorComponent, typeof i16.LogicTabComponent, typeof i17.LogicAddButtonComponent, typeof i18.ActionButtonComponent, typeof i19.SwitcherComponent, typeof i20.LinkValueQuestionComponent, typeof i21.EmbeddedSurveyQuestionComponent, typeof i22.TranslationTabComponent, typeof i23.TranslationSkeletonComponent, typeof i24.SimulatorComponent, typeof i25.TestTabComponent, typeof i26.TestAgainActionComponent, typeof i27.SurveyResultsComponent, typeof i28.SurveyResultsTableRowComponent, typeof i29.ThemeTabComponent, typeof i30.AdaptiveToolboxComponent, typeof i31.ToolboxToolComponent, typeof i32.ToolboxItemComponent, typeof i33.ToolboxCategoryComponent, typeof i34.StringEditorComponent, typeof i35.PageNavigatorComponent, typeof i36.PageNavigatorItemComponent, typeof i37.QuestionDropdownDesignerComponent, typeof i37.QuestionDropdownAdornerDesignerComponent, typeof i38.QuestionImageDesignerComponent, typeof i38.QuestionImageAdornerDesignerComponent, typeof i39.ItemValueDesignerComponent, typeof i40.ImageItemValueDesignerComponent, typeof i41.LogicOperatorComponent, typeof i42.MatrixCellComponent, typeof i43.QuestionEditorComponent, typeof i44.CellQuestionDropdownComponent, typeof i45.CreatorRowComponent, typeof i46.DesignerPagesComponent, typeof i47.DesignerSurveyComponent, typeof i48.CellQuestionComponent, typeof i49.QuestionWidgetDesignerComponent, typeof i50.ToolboxComponent, typeof i51.CreatorLogoImageComponent, typeof i52.QuestionRatingAdornerDesignerComponent, typeof i52.QuestionRatingDesignerComponent, typeof i53.QuestionSpinEditorComponent, typeof i54.ColorItemComponent, typeof i55.QuestionColorComponent, typeof i56.QuestionFileEditorComponent, typeof i57.AddQuestionButtonComponent, typeof i58.QuestionBannerComponent, typeof i59.JsonErrorItemComponent, typeof i60.QuestionTextWithResetComponent, typeof i61.TranslateFromAction]>;
+    static ɵmod: i0.ɵɵNgModuleDeclaration<SurveyCreatorModule, [typeof i1.CreatorComponent, typeof i2.DesignerTabComponent, typeof i3.PageDesignerComponent, typeof i4.QuestionDesignerComponent, typeof i5.PanelDesignerComponent, typeof i6.TabbledMenuComponent, typeof i7.TabbedMenuItemComponent, typeof i8.TabbedMenuItemWrapperComponent, typeof i9.SidebarComponent, typeof i10.SidebarTabComponent, typeof i11.ObjectSelectorComponent, typeof i12.PropertyGridComponent, typeof i13.SearchComponent, typeof i14.TextareaJsonEditorComponent, typeof i15.AceJsonEditorComponent, typeof i16.LogicTabComponent, typeof i17.LogicAddButtonComponent, typeof i18.ActionButtonComponent, typeof i19.SwitcherComponent, typeof i20.LinkValueQuestionComponent, typeof i21.EmbeddedSurveyQuestionComponent, typeof i22.TranslationTabComponent, typeof i23.TranslationSkeletonComponent, typeof i24.SimulatorComponent, typeof i25.TestTabComponent, typeof i26.TestAgainActionComponent, typeof i27.SurveyResultsComponent, typeof i28.SurveyResultsTableRowComponent, typeof i29.ThemeTabComponent, typeof i30.AdaptiveToolboxComponent, typeof i31.ToolboxToolComponent, typeof i32.ToolboxItemComponent, typeof i33.ToolboxItemGroupComponent, typeof i34.ToolboxListComponent, typeof i35.ToolboxCategoryComponent, typeof i36.StringEditorComponent, typeof i37.PageNavigatorComponent, typeof i38.PageNavigatorItemComponent, typeof i39.QuestionDropdownDesignerComponent, typeof i39.QuestionDropdownAdornerDesignerComponent, typeof i40.QuestionImageDesignerComponent, typeof i40.QuestionImageAdornerDesignerComponent, typeof i41.ItemValueDesignerComponent, typeof i42.ImageItemValueDesignerComponent, typeof i43.LogicOperatorComponent, typeof i44.MatrixCellComponent, typeof i45.QuestionEditorComponent, typeof i46.CellQuestionDropdownComponent, typeof i47.CreatorRowComponent, typeof i48.DesignerPagesComponent, typeof i49.DesignerSurveyComponent, typeof i50.CellQuestionComponent, typeof i51.QuestionWidgetDesignerComponent, typeof i52.ToolboxComponent, typeof i53.CreatorLogoImageComponent, typeof i54.QuestionRatingAdornerDesignerComponent, typeof i54.QuestionRatingDesignerComponent, typeof i55.QuestionSpinEditorComponent, typeof i56.ColorItemComponent, typeof i57.QuestionColorComponent, typeof i58.QuestionFileEditorComponent, typeof i59.AddQuestionButtonComponent, typeof i60.QuestionBannerComponent, typeof i61.JsonErrorItemComponent, typeof i62.QuestionTextWithResetComponent, typeof i63.TranslateFromAction], [typeof i64.CommonModule, typeof i65.FormsModule, typeof i66.SurveyModule], [typeof i1.CreatorComponent, typeof i2.DesignerTabComponent, typeof i3.PageDesignerComponent, typeof i4.QuestionDesignerComponent, typeof i5.PanelDesignerComponent, typeof i6.TabbledMenuComponent, typeof i7.TabbedMenuItemComponent, typeof i8.TabbedMenuItemWrapperComponent, typeof i9.SidebarComponent, typeof i10.SidebarTabComponent, typeof i11.ObjectSelectorComponent, typeof i12.PropertyGridComponent, typeof i13.SearchComponent, typeof i14.TextareaJsonEditorComponent, typeof i15.AceJsonEditorComponent, typeof i16.LogicTabComponent, typeof i17.LogicAddButtonComponent, typeof i18.ActionButtonComponent, typeof i19.SwitcherComponent, typeof i20.LinkValueQuestionComponent, typeof i21.EmbeddedSurveyQuestionComponent, typeof i22.TranslationTabComponent, typeof i23.TranslationSkeletonComponent, typeof i24.SimulatorComponent, typeof i25.TestTabComponent, typeof i26.TestAgainActionComponent, typeof i27.SurveyResultsComponent, typeof i28.SurveyResultsTableRowComponent, typeof i29.ThemeTabComponent, typeof i30.AdaptiveToolboxComponent, typeof i31.ToolboxToolComponent, typeof i32.ToolboxItemComponent, typeof i33.ToolboxItemGroupComponent, typeof i34.ToolboxListComponent, typeof i35.ToolboxCategoryComponent, typeof i36.StringEditorComponent, typeof i37.PageNavigatorComponent, typeof i38.PageNavigatorItemComponent, typeof i39.QuestionDropdownDesignerComponent, typeof i39.QuestionDropdownAdornerDesignerComponent, typeof i40.QuestionImageDesignerComponent, typeof i40.QuestionImageAdornerDesignerComponent, typeof i41.ItemValueDesignerComponent, typeof i42.ImageItemValueDesignerComponent, typeof i43.LogicOperatorComponent, typeof i44.MatrixCellComponent, typeof i45.QuestionEditorComponent, typeof i46.CellQuestionDropdownComponent, typeof i47.CreatorRowComponent, typeof i48.DesignerPagesComponent, typeof i49.DesignerSurveyComponent, typeof i50.CellQuestionComponent, typeof i51.QuestionWidgetDesignerComponent, typeof i52.ToolboxComponent, typeof i53.CreatorLogoImageComponent, typeof i54.QuestionRatingAdornerDesignerComponent, typeof i54.QuestionRatingDesignerComponent, typeof i55.QuestionSpinEditorComponent, typeof i56.ColorItemComponent, typeof i57.QuestionColorComponent, typeof i58.QuestionFileEditorComponent, typeof i59.AddQuestionButtonComponent, typeof i60.QuestionBannerComponent, typeof i61.JsonErrorItemComponent, typeof i62.QuestionTextWithResetComponent, typeof i63.TranslateFromAction]>;
     static ɵinj: i0.ɵɵInjectorDeclaration<SurveyCreatorModule>;
 }

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

@@ -724,7 +724,7 @@
           return _this;
       }
       ToolboxToolComponent.prototype.createModel = function () {
-          this.model = new surveyCreatorCore.ToolboxToolViewModel(this.item, this.creator);
+          this.model = new surveyCreatorCore.ToolboxToolViewModel(this.item, this.creator, this.parentModel);
       };
       ToolboxToolComponent.prototype.getPropertiesToTrack = function () {
           return ["creator", "item"];
@@ -732,6 +732,13 @@
       ToolboxToolComponent.prototype.getModel = function () {
           return this.item;
       };
+      Object.defineProperty(ToolboxToolComponent.prototype, "itemCssClasses", {
+          get: function () {
+              return this.item.css;
+          },
+          enumerable: false,
+          configurable: true
+      });
       ToolboxToolComponent.prototype.getPropertiesToUpdateSync = function () {
           return ["mode"];
       };
@@ -742,7 +749,7 @@
       return ToolboxToolComponent;
   }(CreatorModelComponent));
   ToolboxToolComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxToolComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  ToolboxToolComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: { creator: "creator", item: "item", isCompact: "isCompact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n    <div class=\"svc-toolbox__tool\"\n        [class.sv-action--hidden]=\"!item.isVisible\" [class]=\"item.css\" (pointerdown)=\"model.onPointerDown($event)\">\n        <div class=\"sv-action__content\">\n            <div class=\"svc-toolbox__category-separator\" *ngIf=\"item.needSeparator && !creator.toolbox.showCategoryTitles\"></div>\n            <ng-template [component]=\"{ name: item.component || 'svc-toolbox-item', default: 'svc-toolbox-item', data: { model: item, viewModel: model, creator: creator, isCompact: isCompact } }\"></ng-template>\n        </div>\n    </div>\n</ng-template>", styles: [":host { display: none; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  ToolboxToolComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: { creator: "creator", item: "item", parentModel: "parentModel", isCompact: "isCompact" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n    <div [class]=\"itemCssClasses\">\n        <div class=\"svc-toolbox__category-separator\" *ngIf=\"item.needSeparator && !creator.toolbox.showCategoryTitles\">\n        </div>\n        <div class=\"sv-action__content\" (pointerdown)=\"model.onPointerDown($event)\"\n            (mouseover)=\"model.onMouseOver(item, $event)\"\n        (mouseleave)=\"model.onMouseLeave(item, $event)\">\n            <ng-template [component]=\"{ name: item.component || 'svc-toolbox-item', default: 'svc-toolbox-item', \n            data: { model: item, viewModel: model, creator: creator, isCompact: isCompact } }\"></ng-template>\n        </div>\n    </div>\n</ng-template>", styles: [":host { display: none; }"], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxToolComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -754,6 +761,8 @@
                   type: i0.Input
               }], item: [{
                   type: i0.Input
+              }], parentModel: [{
+                  type: i0.Input
               }], isCompact: [{
                   type: i0.Input
               }] } });
@@ -793,7 +802,7 @@
       return ToolboxCategoryComponent;
   }(i1.BaseAngular));
   ToolboxCategoryComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxCategoryComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  ToolboxCategoryComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: { category: "category", toolbox: "toolbox" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox__category\" [class.svc-toolbox__category--collapsed]=\"category.collapsed\"\n    [class.svc-toolbox__category--empty]=\"category.empty\">\n    <div class=\"svc-toolbox__category-header\"\n      (click)=\"category.toggleState()\" [key2click] [class.svc-toolbox__category-header--collapsed]=\"toolbox.canCollapseCategories\" >\n      <span class=\"svc-toolbox__category-title\">{{category.title}}</span>\n      <div *ngIf=\"toolbox.canCollapseCategories\" class=\"svc-toolbox__category-header__controls\">\n        <svg [iconName]=\"'icon-arrow-down'\" class=\"svc-toolbox__category-header__button svc-string-editor__button--expand\" [size]=\"24\" sv-ng-svg-icon [visible]=\"category.collapsed\"></svg>\n        <svg [iconName]=\"'icon-arrow-up'\" class=\"svc-toolbox__category-header__button svc-string-editor__button--collapse\" [size]=\"24\" sv-ng-svg-icon [visible]=\"!category.collapsed\"></svg>\n      </div>\n    </div>\n      <ng-container *ngFor=\"let item of category.items\">\n        <svc-toolbox-tool [item]=\"item\" [creator]=\"toolbox.creator\" [isCompact]=\"false\" ></svc-toolbox-tool>\n      </ng-container>\n  </div>\n</ng-template>\n", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "isCompact"] }], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  ToolboxCategoryComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: { category: "category", toolbox: "toolbox" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox__category\" [class.svc-toolbox__category--collapsed]=\"category.collapsed\"\n    [class.svc-toolbox__category--empty]=\"category.empty\">\n    <div class=\"svc-toolbox__category-header\"\n      (click)=\"category.toggleState()\" [key2click] [class.svc-toolbox__category-header--collapsed]=\"toolbox.canCollapseCategories\" >\n      <span class=\"svc-toolbox__category-title\">{{category.title}}</span>\n      <div *ngIf=\"toolbox.canCollapseCategories\" class=\"svc-toolbox__category-header__controls\">\n        <svg [iconName]=\"'icon-arrow-down'\" class=\"svc-toolbox__category-header__button svc-string-editor__button--expand\" [size]=\"24\" sv-ng-svg-icon [visible]=\"category.collapsed\"></svg>\n        <svg [iconName]=\"'icon-arrow-up'\" class=\"svc-toolbox__category-header__button svc-string-editor__button--collapse\" [size]=\"24\" sv-ng-svg-icon [visible]=\"!category.collapsed\"></svg>\n      </div>\n    </div>\n      <ng-container *ngFor=\"let item of category.items\">\n        <svc-toolbox-tool [item]=\"item\" [creator]=\"toolbox.creator\" [parentModel]=\"toolbox\" [isCompact]=\"false\" ></svc-toolbox-tool>\n      </ng-container>\n  </div>\n</ng-template>\n", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "parentModel", "isCompact"] }], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.VisibleDirective, selector: "[visible]", inputs: ["visible"] }, { 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: ToolboxCategoryComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -842,7 +851,7 @@
       return AdaptiveToolboxComponent;
   }(i1.BaseAngular));
   AdaptiveToolboxComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: AdaptiveToolboxComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  AdaptiveToolboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AdaptiveToolboxComponent, selector: "svc-adaptive-toolbox", inputs: { creator: "creator" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div [class]=\"model.classNames\" #container>\n    <div (focusout)=\"model.focusOut($event)\" class=\"svc-toolbox__panel\">\n      <div class=\"svc-toolbox__scroller\">\n        <div *ngIf=\"model.showSearch\" class=\"svc-toolbox__search-container\">\n          <ng-container *ngIf=\"model.isCompactRendered\">\n          <svc-toolbox-tool [creator]=\"creator\" [item]=\"searchItem\" [isCompact]=\"model.isCompactRendered\"></svc-toolbox-tool>\n          <div class=\"svc-toolbox__category-separator svc-toolbox__category-separator--search\"></div>\n          </ng-container>\n          <svc-search [model]=\"model.searchManager\"></svc-search>\n        </div>\n        <div *ngIf=\"model.showPlaceholder\" class=\"svc-toolbox__placeholder\">{{model.toolboxNoResultsFound}}</div>\n        <div class=\"svc-toolbox__container\">\n          <ng-container *ngIf=\"!model.showInSingleCategory\">\n            <svc-toolbox-category *ngFor=\"let category of model.categories\" [category]=\"category\" [toolbox]=\"model\"></svc-toolbox-category>\n          </ng-container>\n          <ng-container *ngIf=\"model.showInSingleCategory\">\n            <div class=\"svc-toolbox__category\">\n              <svc-toolbox-tool *ngFor=\"let item of model.renderedActions\" [creator]=\"creator\" [item]=\"item\" [isCompact]=\"model.isCompactRendered\"></svc-toolbox-tool>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "isCompact"] }, { type: SearchComponent, selector: "svc-search", inputs: ["model"] }, { type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: ["category", "toolbox"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  AdaptiveToolboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: AdaptiveToolboxComponent, selector: "svc-adaptive-toolbox", inputs: { creator: "creator" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div [class]=\"model.classNames\" #container>\n    <div (focusout)=\"model.focusOut($event)\" class=\"svc-toolbox__panel\">\n      <div class=\"svc-toolbox__scroller\" (scroll)=\"model.onScroll(model, $event)\">\n        <div *ngIf=\"model.showSearch\" class=\"svc-toolbox__search-container\">\n          <ng-container *ngIf=\"model.isCompactRendered\">\n          <svc-toolbox-tool [creator]=\"creator\" [item]=\"searchItem\" [parentModel]=\"model\" [isCompact]=\"model.isCompactRendered\"></svc-toolbox-tool>\n          <div class=\"svc-toolbox__category-separator svc-toolbox__category-separator--search\"></div>\n          </ng-container>\n          <svc-search [model]=\"model.searchManager\"></svc-search>\n        </div>\n        <div *ngIf=\"model.showPlaceholder\" class=\"svc-toolbox__placeholder\">{{model.toolboxNoResultsFound}}</div>\n        <div class=\"svc-toolbox__container\">\n          <ng-container *ngIf=\"!model.showInSingleCategory\">\n            <svc-toolbox-category *ngFor=\"let category of model.categories\" [category]=\"category\" [toolbox]=\"model\"></svc-toolbox-category>\n          </ng-container>\n          <ng-container *ngIf=\"model.showInSingleCategory\">\n            <div class=\"svc-toolbox__category\">\n              <ng-container *ngFor=\"let item of model.renderedActions\">\n                <svc-toolbox-tool [creator]=\"creator\" [item]=\"item\" [parentModel]=\"model\" [isCompact]=\"model.isCompactRendered\"></svc-toolbox-tool>\n              </ng-container>\n            </div>\n          </ng-container>\n        </div>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "parentModel", "isCompact"] }, { type: SearchComponent, selector: "svc-search", inputs: ["model"] }, { type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: ["category", "toolbox"] }], 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: AdaptiveToolboxComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -959,7 +968,7 @@
       return PageNavigatorItemComponent;
   }(i1.BaseAngular));
   PageNavigatorItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PageNavigatorItemComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  PageNavigatorItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PageNavigatorItemComponent, selector: "svc-page-navigator-item", inputs: { model: "model" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-page-navigator-item\">\n    <div class=\"svc-page-navigator-item-content\" (click)=\"click($event)\" [key2click]\n      [class.svc-page-navigator-item--selected]=\"model.active\"\n      [class.svc-page-navigator-item--disabled]=\"anyModel.disabled\">\n      <div class=\"svc-page-navigator-item__dot\" [attr.title]=\"model.title\"></div>\n\n      <div class=\"svc-page-navigator-item__banner svc-item__banner\">\n        <span class=\"svc-text svc-text--small svc-text--bold\">{{model.title}}</span>\n        <span class=\"svc-page-navigator-item__dot\"></span>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
+  PageNavigatorItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PageNavigatorItemComponent, selector: "svc-page-navigator-item", inputs: { model: "model" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-page-navigator-item\">\n    <div class=\"svc-page-navigator-item-content\" (click)=\"click($event)\" [key2click]\n      [class.svc-page-navigator-item--selected]=\"model.active\"\n      [class.svc-page-navigator-item--disabled]=\"anyModel.disabled\">\n      <div class=\"svc-page-navigator-item__dot\" [attr.title]=\"model.title\"></div>\n\n      <div class=\"svc-page-navigator-item__banner\">\n        <span class=\"svc-text svc-text--small svc-text--bold\">{{model.title}}</span>\n        <span class=\"svc-page-navigator-item__dot\"></span>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PageNavigatorItemComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -1768,7 +1777,7 @@
       return QuestionDesignerComponent;
   }(CreatorModelComponent));
   QuestionDesignerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionDesignerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  QuestionDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionDesignerComponent, selector: "svc-question", inputs: { componentName: "componentName", componentData: "componentData" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  QuestionDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionDesignerComponent, selector: "svc-question", inputs: { componentName: "componentName", componentData: "componentData" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n        <div class=\"svc-question__top-actions\">\n          <sv-action-bar [model]=\"adorner.topActionContainer\" [handleClick]=\"false\"></sv-action-bar>\n        </div>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionDesignerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -1942,7 +1951,7 @@
       return QuestionDropdownDesignerComponent;
   }(QuestionDesignerComponent));
   QuestionDropdownDesignerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionDropdownDesignerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  QuestionDropdownDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionDropdownDesignerComponent, selector: "svc-dropdown-question", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  QuestionDropdownDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionDropdownDesignerComponent, selector: "svc-dropdown-question", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n        <div class=\"svc-question__top-actions\">\n          <sv-action-bar [model]=\"adorner.topActionContainer\" [handleClick]=\"false\"></sv-action-bar>\n        </div>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionDropdownDesignerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2029,7 +2038,7 @@
       return QuestionImageDesignerComponent;
   }(QuestionDesignerComponent));
   QuestionImageDesignerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionImageDesignerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  QuestionImageDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionImageDesignerComponent, selector: "svc-image-question", viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: i0.ElementRef }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  QuestionImageDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionImageDesignerComponent, selector: "svc-image-question", viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true, read: i0.ElementRef }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n        <div class=\"svc-question__top-actions\">\n          <sv-action-bar [model]=\"adorner.topActionContainer\" [handleClick]=\"false\"></sv-action-bar>\n        </div>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionImageDesignerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2073,7 +2082,7 @@
       return PanelDesignerComponent;
   }(QuestionDesignerComponent));
   PanelDesignerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PanelDesignerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  PanelDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDesignerComponent, selector: "svc-panel", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\"\n      (click)=\"adorner.element.isInteractiveDesignElement ? adorner.select(adorner, $event) : null\">\n      <div *ngIf=\"adorner.allowDragging && adorner.element.isInteractiveDesignElement\" class=\"svc-question__drag-area\"\n        (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n\n      <div *ngIf=\"adorner.isEmptyElement\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n          <div *ngIf=\"adorner.showAddQuestionButton\" class=\"svc-panel__add-new-question svc-action-button\" [key2click]\n            (click)=\"addNewQuestion($event)\">\n            <svg class=\"svc-panel__add-new-question-icon\" [iconName]=\"('icon-add_24x24')\"\n            [size]=\"24\" sv-ng-svg-icon></svg>\n            <span class=\"svc-text svc-text--normal svc-text--bold\">\n              {{ adorner.addNewQuestionText }}\n            </span>\n          </div>\n        </div>\n      </div>\n\n      <ng-template *ngIf=\"adornerComponent && adorner.element.isInteractiveDesignElement\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n\n      <div *ngIf=\"!adorner.isEmptyElement && adorner.showAddQuestionButton\"\n        class=\"svc-panel__add-new-question-container\">\n        <div class=\"svc-panel__question-type-selector-popup\"> <sv-ng-popup\n            [popupModel]=\"adorner.questionTypeSelectorModel.popupModel\"></sv-ng-popup>\n        </div>\n        <div class=\"svc-panel__add-new-question-wrapper\">\n          <div class=\"svc-panel__add-new-question svc-action-button\" [key2click] (click)=\"addNewQuestion($event)\">\n            <svg class=\"svc-panel__add-new-question-icon\" [iconName]=\"('icon-add_24x24')\" [size]=\"24\" sv-ng-svg-icon></svg>\n            <span class=\"svc-text svc-text--normal svc-text--bold\">\n              {{ adorner.addNewQuestionText }}\n            </span>\n          </div>\n          <button type=\"button\" [attr.title]=\"adorner.addNewQuestionText\" [key2click] (click)=\"selectQuestionType($event)\"\n            class=\"svc-panel__question-type-selector\">\n            <svg class=\"svc-panel__question-type-selector-icon\" [iconName]=\"adorner.questionTypeSelectorModel.iconName\"\n              [size]=\"24\" sv-ng-svg-icon></svg>\n          </button>\n        </div>\n      </div>\n\n      <div *ngIf=\"adorner.element.isInteractiveDesignElement\" class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel", "getTarget", "getArea"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  PanelDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: PanelDesignerComponent, selector: "svc-panel", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\"\n      (click)=\"adorner.element.isInteractiveDesignElement ? adorner.select(adorner, $event) : null\">\n      <div *ngIf=\"adorner.allowDragging && adorner.element.isInteractiveDesignElement\" class=\"svc-question__drag-area\"\n        (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n          <div class=\"svc-question__top-actions\">\n            <sv-action-bar [model]=\"adorner.topActionContainer\" [handleClick]=\"false\"></sv-action-bar>\n          </div>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n\n      <div *ngIf=\"adorner.isEmptyElement\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n          <div *ngIf=\"adorner.showAddQuestionButton\" class=\"svc-panel__add-new-question svc-action-button\" [key2click]\n            (click)=\"addNewQuestion($event)\">\n            <svg class=\"svc-panel__add-new-question-icon\" [iconName]=\"('icon-add_24x24')\"\n            [size]=\"24\" sv-ng-svg-icon></svg>\n            <span class=\"svc-text svc-text--normal svc-text--bold\">\n              {{ adorner.addNewQuestionText }}\n            </span>\n          </div>\n        </div>\n      </div>\n\n      <ng-template *ngIf=\"adornerComponent && adorner.element.isInteractiveDesignElement\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n\n      <div *ngIf=\"!adorner.isEmptyElement && adorner.showAddQuestionButton\"\n        class=\"svc-panel__add-new-question-container\">\n        <div class=\"svc-panel__question-type-selector-popup\"> <sv-ng-popup\n            [popupModel]=\"adorner.questionTypeSelectorModel.popupModel\"></sv-ng-popup>\n        </div>\n        <div class=\"svc-panel__add-new-question-wrapper\">\n          <div class=\"svc-panel__add-new-question svc-action-button\" [key2click] (click)=\"addNewQuestion($event)\">\n            <svg class=\"svc-panel__add-new-question-icon\" [iconName]=\"('icon-add_24x24')\" [size]=\"24\" sv-ng-svg-icon></svg>\n            <span class=\"svc-text svc-text--normal svc-text--bold\">\n              {{ adorner.addNewQuestionText }}\n            </span>\n          </div>\n          <button type=\"button\" [attr.title]=\"adorner.addNewQuestionText\" [key2click] (click)=\"selectQuestionType($event)\"\n            class=\"svc-panel__question-type-selector\">\n            <svg class=\"svc-panel__question-type-selector-icon\" [iconName]=\"adorner.questionTypeSelectorModel.iconName\"\n              [size]=\"24\" sv-ng-svg-icon></svg>\n          </button>\n        </div>\n      </div>\n\n      <div *ngIf=\"adorner.element.isInteractiveDesignElement\" class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: i1__namespace.PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel", "getTarget", "getArea"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: PanelDesignerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2104,7 +2113,7 @@
       return ToolboxItemComponent;
   }(i1.BaseAngular));
   ToolboxItemComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxItemComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  ToolboxItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxItemComponent, selector: "svc-toolbox-item", inputs: { creator: "creator", model: "model", isCompact: "isCompact", viewModel: "viewModel" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox__item\" role=\"button\" [attr.aria-label]=\"this.item.tooltip\" [title]=\"this.item.tooltip\"\n    [class]=\"item.className\" (click)=\"viewModel.click($event)\" [key2click]>\n    <span class=\"svc-toolbox__item-container\">\n      <svg [iconName]=\"item.iconName\" [size]=\"24\" [title]=\"this.item.tooltip\" sv-ng-svg-icon></svg>\n    </span>\n    <span *ngIf=\"isCompact\" class=\"svc-toolbox__item-banner svc-item__banner\">\n      <svg [iconName]=\"item.iconName\" [size]=\"24\" [title]=\"this.item.tooltip\" class=\"svc-toolbox__item-icon\" sv-ng-svg-icon></svg>\n      <span class=\"svc-toolbox__item-title\">{{item.title}}</span>\n    </span>\n    <span *ngIf=\"!isCompact\" class=\"svc-toolbox__item-title\">\n      {{item.title}}\n    </span>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+  ToolboxItemComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxItemComponent, selector: "svc-toolbox-item", inputs: { creator: "creator", model: "model", isCompact: "isCompact", viewModel: "viewModel" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox__item\" role=\"button\" [attr.aria-label]=\"this.item.tooltip\" [title]=\"this.item.tooltip\"\n    [class]=\"item.className\" (click)=\"viewModel.click($event)\" [key2click]>\n    <span class=\"svc-toolbox__item-container\">\n      <svg *ngIf=\"item.iconName\" [iconName]=\"item.iconName\" [size]=\"24\" [title]=\"this.item.tooltip\"\n        sv-ng-svg-icon></svg>\n    </span>\n    <span *ngIf=\"isCompact\" class=\"svc-toolbox__item-banner svc-item__banner\">\n      <svg *ngIf=\"item.iconName\" [iconName]=\"item.iconName\" [size]=\"24\" [title]=\"this.item.tooltip\"\n        class=\"svc-toolbox__item-icon\" sv-ng-svg-icon></svg>\n      <span class=\"svc-toolbox__item-title\">{{item.title}}</span>\n    </span>\n    <span *ngIf=\"!isCompact\" class=\"svc-toolbox__item-title\">{{item.title}}</span>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }], directives: [{ type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxItemComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2123,6 +2132,71 @@
               }] } });
   i1.AngularComponentFactory.Instance.registerComponent("svc-toolbox-item", ToolboxItemComponent);
 
+  var ToolboxItemGroupComponent = /** @class */ (function (_super) {
+      __extends(ToolboxItemGroupComponent, _super);
+      function ToolboxItemGroupComponent() {
+          var _this = _super.apply(this, __spreadArray([], __read(arguments))) || this;
+          _this.isCompact = false;
+          return _this;
+      }
+      ToolboxItemGroupComponent.prototype.getModel = function () {
+          return this.viewModel;
+      };
+      Object.defineProperty(ToolboxItemGroupComponent.prototype, "item", {
+          get: function () {
+              return this.model;
+          },
+          enumerable: false,
+          configurable: true
+      });
+      return ToolboxItemGroupComponent;
+  }(i1.BaseAngular));
+  ToolboxItemGroupComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxItemGroupComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  ToolboxItemGroupComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxItemGroupComponent, selector: "svc-toolbox-item-group", inputs: { creator: "creator", model: "model", isCompact: "isCompact", viewModel: "viewModel" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <svc-toolbox-item [model]=\"item\" [viewModel]=\"viewModel\" [creator]=\"creator\" [isCompact]=\"isCompact\"></svc-toolbox-item>\n  <sv-ng-popup [popupModel]=\"model.popupModel\" [getArea]=\"model.getArea\"></sv-ng-popup>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxItemComponent, selector: "svc-toolbox-item", inputs: ["creator", "model", "isCompact", "viewModel"] }, { type: i1__namespace.PopupComponent, selector: "sv-ng-popup, '[sv-ng-popup]'", inputs: ["popupModel", "getTarget", "getArea"] }] });
+  i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxItemGroupComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: "svc-toolbox-item-group",
+                      templateUrl: "./toolbox-item-group.component.html",
+                      styles: [":host { display: none; }"]
+                  }]
+          }], propDecorators: { creator: [{
+                  type: i0.Input
+              }], model: [{
+                  type: i0.Input
+              }], isCompact: [{
+                  type: i0.Input
+              }], viewModel: [{
+                  type: i0.Input
+              }] } });
+  i1.AngularComponentFactory.Instance.registerComponent("svc-toolbox-item-group", ToolboxItemGroupComponent);
+
+  var ToolboxListComponent = /** @class */ (function (_super) {
+      __extends(ToolboxListComponent, _super);
+      function ToolboxListComponent() {
+          return _super !== null && _super.apply(this, arguments) || this;
+      }
+      ToolboxListComponent.prototype.getModel = function () {
+          return this.model;
+      };
+      return ToolboxListComponent;
+  }(i1.BaseAngular));
+  ToolboxListComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxListComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
+  ToolboxListComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxListComponent, selector: "svc-toolbox-list ", inputs: { model: "model", toolbox: "toolbox" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div [class]=\"model.cssClasses.root\">\n    <ng-container *ngFor=\"let item of model.renderedActions\">\n      <svc-toolbox-tool [item]=\"item\" [creator]=\"toolbox.creator\" [parentModel]=\"model\"\n        [isCompact]=\"false\"></svc-toolbox-tool>\n    </ng-container>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "parentModel", "isCompact"] }], directives: [{ 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: ToolboxListComponent, decorators: [{
+              type: i0.Component,
+              args: [{
+                      selector: "svc-toolbox-list ",
+                      templateUrl: "./toolbox-list.component.html",
+                      styles: [":host { display: none; }"]
+                  }]
+          }], propDecorators: { model: [{
+                  type: i0.Input
+              }], toolbox: [{
+                  type: i0.Input
+              }] } });
+  i1.AngularComponentFactory.Instance.registerComponent("svc-toolbox-list", ToolboxListComponent);
+
   var StringEditorComponent = /** @class */ (function (_super) {
       __extends(StringEditorComponent, _super);
       function StringEditorComponent(cdr, vcr, ngZone) {
@@ -2216,13 +2290,6 @@
           enumerable: false,
           configurable: true
       });
-      Object.defineProperty(StringEditorComponent.prototype, "editValue", {
-          get: function () {
-              return this.baseModel.focused && this.baseModel.editAsText && this.locString.text || this.locString.renderedHtml;
-          },
-          enumerable: false,
-          configurable: true
-      });
       StringEditorComponent.prototype.onBlur = function (event) {
           this.container.nativeElement.spellcheck = false;
           this.locString.__isEditing = false;
@@ -2267,7 +2334,7 @@
       return StringEditorComponent;
   }(CreatorModelComponent));
   StringEditorComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: StringEditorComponent, deps: [{ token: i0__namespace.ChangeDetectorRef }, { token: i0__namespace.ViewContainerRef }, { token: i0__namespace.NgZone }], target: i0__namespace.ɵɵFactoryTarget.Component });
-  StringEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringEditorComponent, selector: "svc-string-edtior", inputs: { model: "model" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <span [class]=\"className\">\n    <span class=\"svc-string-editor__content\">\n        <div class=\"svc-string-editor__border\">\n          <svg [iconName]=\"'icon-arrow-up'\" class=\"svc-string-editor__button svc-string-editor__button--edit\" [size]=\"24\" sv-ng-svg-icon \n            (click)=\"edit($event)\" [iconName]=\"'icon-edit'\" [size]=\"16\"></svg>\n        </div>\n        <span class=\"svc-string-editor__input\">\n          <span role=\"textbox\" *ngIf=\"!locString.hasHtml\" class=\"sv-string-editor\" spellcheck=\"false\"\n              (focus)=\"onFocus($event)\" (paste)=\"onPaste($event)\" (blur)=\"onBlur($event)\"  (input)=\"baseModel.onInput($event)\" (keydown)=\"baseModel.onKeyDown($event)\" (keyup)=\"baseModel.onKeyUp($event)\" (compositionstart)=\"baseModel.onCompositionStart($event)\" (compositionend)=\"baseModel.onCompositionEnd($event)\" (mouseup)=\"baseModel.onMouseUp($event)\" (click)=\"edit($event)\" [textContent]=\"editValue\" [attr.aria-placeholder]=\"placeholder\" [attr.contenteditable]=\"contentEditable\" #container></span>\n          <span role=\"textbox\" *ngIf=\"locString.hasHtml\" class=\"sv-string-editor sv-string-editor--html\" spellcheck=\"false\"\n          (focus)=\"onFocus($event)\" (blur)=\"onBlur($event)\" (keydown)=\"baseModel.onKeyDown($event)\" (keyup)=\"baseModel.onKeyUp($event)\" (compositionstart)=\"baseModel.onCompositionStart($event)\" (compositionend)=\"baseModel.onCompositionEnd($event)\" (mouseup)=\"baseModel.onMouseUp($event)\"\n          (click)=\"edit($event)\" [attr.aria-placeholder]=\"placeholder\" [attr.contenteditable]=\"contentEditable\" [innerHtml]=\"editValue | safeHtml\" #container></span>\n          <sv-ng-character-counter *ngIf=\"showCharacterCounter\" [counter]=\"characterCounter\" [remainingCharacterCounter]=\"getCharacterCounterClass\"></sv-ng-character-counter>\n        </span>\n    </span>\n    <span *ngIf=\"errorText\" class=\"svc-string-editor__error\">{{errorText}}</span>\n  </span>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "safeHtml": i1__namespace.SafeHtmlPipe } });
+  StringEditorComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: StringEditorComponent, selector: "svc-string-edtior", inputs: { model: "model" }, viewQueries: [{ propertyName: "container", first: true, predicate: ["container"], descendants: true }], usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <span [class]=\"className\">\n    <span class=\"svc-string-editor__content\">\n        <div class=\"svc-string-editor__border\">\n          <svg [iconName]=\"'icon-arrow-up'\" class=\"svc-string-editor__button svc-string-editor__button--edit\" [size]=\"24\" sv-ng-svg-icon \n            (click)=\"edit($event)\" [iconName]=\"'icon-edit'\" [size]=\"16\"></svg>\n        </div>\n        <span class=\"svc-string-editor__input\">\n          <span role=\"textbox\" *ngIf=\"!locString.hasHtml\" class=\"sv-string-editor\" spellcheck=\"false\"\n              (focus)=\"onFocus($event)\" (paste)=\"onPaste($event)\" (blur)=\"onBlur($event)\"  (input)=\"baseModel.onInput($event)\" (keydown)=\"baseModel.onKeyDown($event)\" (keyup)=\"baseModel.onKeyUp($event)\" (compositionstart)=\"baseModel.onCompositionStart($event)\" (compositionend)=\"baseModel.onCompositionEnd($event)\" (mouseup)=\"baseModel.onMouseUp($event)\" (click)=\"edit($event)\" [textContent]=\"locString.renderedHtml\" [attr.aria-placeholder]=\"placeholder\" [attr.contenteditable]=\"contentEditable\" #container></span>\n          <span role=\"textbox\" *ngIf=\"locString.hasHtml\" class=\"sv-string-editor sv-string-editor--html\" spellcheck=\"false\"\n          (focus)=\"onFocus($event)\" (blur)=\"onBlur($event)\" (keydown)=\"baseModel.onKeyDown($event)\" (keyup)=\"baseModel.onKeyUp($event)\" (compositionstart)=\"baseModel.onCompositionStart($event)\" (compositionend)=\"baseModel.onCompositionEnd($event)\" (mouseup)=\"baseModel.onMouseUp($event)\"\n          (click)=\"edit($event)\" [attr.aria-placeholder]=\"placeholder\" [attr.contenteditable]=\"contentEditable\" [innerHtml]=\"locString.renderedHtml | safeHtml\" #container></span>\n          <sv-ng-character-counter *ngIf=\"showCharacterCounter\" [counter]=\"characterCounter\" [remainingCharacterCounter]=\"getCharacterCounterClass\"></sv-ng-character-counter>\n        </span>\n    </span>\n    <span *ngIf=\"errorText\" class=\"svc-string-editor__error\">{{errorText}}</span>\n  </span>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.CharacterCounterComponent, selector: "sv-ng-character-counter", inputs: ["counter", "remainingCharacterCounter"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], pipes: { "safeHtml": i1__namespace.SafeHtmlPipe } });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: StringEditorComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2634,7 +2701,7 @@
       return ToolboxComponent;
   }(i1.BaseAngular));
   ToolboxComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: ToolboxComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  ToolboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxComponent, selector: "svc-toolbox", inputs: { model: "model" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox\">\n    <div class=\"svc-toolbox__container\">\n      <ng-container *ngIf=\"!(toolbox.categories.length == 1 || !toolbox.showCategoryTitles)\">\n        <svc-toolbox-category *ngFor=\"let category of toolbox.categories\" [category]=\"category\" [toolbox]=\"toolbox\"></svc-toolbox-category>\n      </ng-container>\n      <ng-container *ngIf=\"toolbox.categories.length == 1 || !toolbox.showCategoryTitles\">\n        <div class=\"svc-toolbox__category\">\n          <svc-toolbox-tool *ngFor=\"let item of toolbox.visibleActions\" [creator]=\"model\" [item]=\"item\" [isCompact]=\"toolbox.isCompact\"></svc-toolbox-tool>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: ["category", "toolbox"] }, { type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "isCompact"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2__namespace.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
+  ToolboxComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: ToolboxComponent, selector: "svc-toolbox", inputs: { model: "model" }, usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div class=\"svc-toolbox\">\n    <div class=\"svc-toolbox__container\">\n      <ng-container *ngIf=\"!(toolbox.categories.length == 1 || !toolbox.showCategoryTitles)\">\n        <svc-toolbox-category *ngFor=\"let category of toolbox.categories\" [category]=\"category\" [toolbox]=\"toolbox\"></svc-toolbox-category>\n      </ng-container>\n      <ng-container *ngIf=\"toolbox.categories.length == 1 || !toolbox.showCategoryTitles\">\n        <div class=\"svc-toolbox__category\">\n          <svc-toolbox-tool *ngFor=\"let item of toolbox.visibleActions\" [creator]=\"model\" [item]=\"item\" [parentModel]=\"toolbox\" [isCompact]=\"toolbox.isCompact\"></svc-toolbox-tool>\n        </div>\n      </ng-container>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: ToolboxCategoryComponent, selector: "svc-toolbox-category ", inputs: ["category", "toolbox"] }, { type: ToolboxToolComponent, selector: "svc-toolbox-tool", inputs: ["creator", "item", "parentModel", "isCompact"] }], 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: ToolboxComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2657,7 +2724,7 @@
       return QuestionRatingDesignerComponent;
   }(QuestionDesignerComponent));
   QuestionRatingDesignerComponent.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionRatingDesignerComponent, deps: null, target: i0__namespace.ɵɵFactoryTarget.Component });
-  QuestionRatingDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionRatingDesignerComponent, selector: "svc-rating-question", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
+  QuestionRatingDesignerComponent.ɵcmp = i0__namespace.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.2.17", type: QuestionRatingDesignerComponent, selector: "svc-rating-question", usesInheritance: true, ngImport: i0__namespace, template: "<ng-template #template>\n  <div *ngIf=\"adorner\" class=\"svc-question__adorner\" [class]=\"adorner.rootCss()\"\n    (mouseover)=\"adorner.hover($event, $event.currentTarget)\" (mouseleave)=\"adorner.hover($event, $event.currentTarget)\"\n    [attr.data-sv-drop-target-survey-element]=\"adorner.element.name || null\" #container>\n\n    <div [class]=\"adorner.css()\" [key2click]=\"{ disableTabStop: true }\" (click)=\"adorner.select(adorner, $event)\">\n      <div *ngIf=\"adorner.allowDragging\" class=\"svc-question__drag-area\" (pointerdown)=\"adorner.onPointerDown($event)\">\n        <svg class=\"svc-question__drag-element\" [iconName]=\"'icon-drag-area-indicator_24x16'\" [size]=\"24\"\n          sv-ng-svg-icon></svg>\n        <div class=\"svc-question__top-actions\">\n          <sv-action-bar [model]=\"adorner.topActionContainer\" [handleClick]=\"false\"></sv-action-bar>\n        </div>\n      </div>\n\n      <ng-template [component]=\"{ name: componentName, data: componentData }\"></ng-template>\n      <div *ngIf=\"adorner.isEmptyElement && !showPlaceholderComponent\" class=\"svc-panel__placeholder_frame-wrapper\">\n        <div class=\"svc-panel__placeholder_frame\">\n          <div class=\"svc-panel__placeholder\">{{ adorner.placeholderText }}</div>\n        </div>\n      </div>\n      <ng-template *ngIf=\"adorner.isEmptyElement && !!showPlaceholderComponent\"\n        [component]=\"{ name: placeholderComponent, data: placeholderComponentData }\">\n      </ng-template>\n      <ng-template *ngIf=\"adornerComponent\"\n        [component]=\"{ name: adornerComponent, data: { adorner: adorner, question: model } }\">\n      </ng-template>\n      <svc-question-banner *ngIf=\"adorner.isBannerShowing\" [model]=\"adorner.createBannerParams()\">\n      </svc-question-banner>\n      <div class=\"svc-question__content-actions\" (focusin)=\"adorner.select(adorner, $event)\">\n        <sv-action-bar [model]=\"adorner.actionContainer\" [handleClick]=\"false\"></sv-action-bar>\n      </div>\n    </div>\n  </div>\n</ng-template>", styles: [":host { display: none; }"], components: [{ type: i1__namespace.SvgIconComponent, selector: "'[sv-ng-svg-icon]'", inputs: ["size", "width", "height", "iconName", "partCss", "css", "title"] }, { type: i1__namespace.ActionBarComponent, selector: "sv-action-bar, sv-ng-action-bar", inputs: ["model", "handleClick"] }, { type: QuestionBannerComponent, selector: "svc-question-banner", inputs: ["model"] }], directives: [{ type: i2__namespace.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i1__namespace.Key2ClickDirective, selector: "[key2click]", inputs: ["key2click"] }, { type: i1__namespace.DynamicComponentDirective, selector: "[component]", inputs: ["component"] }] });
   i0__namespace.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: QuestionRatingDesignerComponent, decorators: [{
               type: i0.Component,
               args: [{
@@ -2918,11 +2985,11 @@
   }());
   SurveyCreatorModule.ɵfac = i0__namespace.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: SurveyCreatorModule, deps: [], target: i0__namespace.ɵɵFactoryTarget.NgModule });
   SurveyCreatorModule.ɵmod = i0__namespace.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0__namespace, type: SurveyCreatorModule, declarations: [CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, SearchComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, SwitcherComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent, ThemeTabComponent,
-          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
+          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxItemGroupComponent, ToolboxListComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
           QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
           ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
           QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, ColorItemComponent, QuestionColorComponent, QuestionFileEditorComponent, AddQuestionButtonComponent, QuestionBannerComponent, JsonErrorItemComponent, QuestionTextWithResetComponent, TranslateFromAction], imports: [i2.CommonModule, i3.FormsModule, i1.SurveyModule], exports: [CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, SearchComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, SwitcherComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent, ThemeTabComponent,
-          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
+          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxItemGroupComponent, ToolboxListComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
           QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
           ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
           QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, ColorItemComponent, QuestionColorComponent, QuestionFileEditorComponent, AddQuestionButtonComponent, QuestionBannerComponent, JsonErrorItemComponent, QuestionTextWithResetComponent, TranslateFromAction] });
@@ -2933,7 +3000,7 @@
               type: i0.NgModule,
               args: [{
                       declarations: [CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, SearchComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, SwitcherComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent, ThemeTabComponent,
-                          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
+                          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxItemGroupComponent, ToolboxListComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
                           QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
                           ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
                           QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, ColorItemComponent, QuestionColorComponent, QuestionFileEditorComponent, AddQuestionButtonComponent, QuestionBannerComponent, JsonErrorItemComponent, QuestionTextWithResetComponent, TranslateFromAction],
@@ -2942,7 +3009,7 @@
                       ],
                       exports: [
                           CreatorComponent, DesignerTabComponent, PageDesignerComponent, QuestionDesignerComponent, PanelDesignerComponent, TabbledMenuComponent, TabbedMenuItemComponent, TabbedMenuItemWrapperComponent, SidebarComponent, SidebarTabComponent, ObjectSelectorComponent, PropertyGridComponent, SearchComponent, TextareaJsonEditorComponent, AceJsonEditorComponent, LogicTabComponent, LogicAddButtonComponent, ActionButtonComponent, SwitcherComponent, LinkValueQuestionComponent, EmbeddedSurveyQuestionComponent, TranslationTabComponent, TranslationSkeletonComponent, SimulatorComponent, TestTabComponent, TestAgainActionComponent, SurveyResultsComponent, SurveyResultsTableRowComponent, ThemeTabComponent,
-                          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
+                          AdaptiveToolboxComponent, ToolboxToolComponent, ToolboxItemComponent, ToolboxItemGroupComponent, ToolboxListComponent, ToolboxCategoryComponent, StringEditorComponent, PageNavigatorComponent, PageNavigatorItemComponent,
                           QuestionDropdownDesignerComponent, QuestionDropdownAdornerDesignerComponent, QuestionImageDesignerComponent, QuestionImageAdornerDesignerComponent,
                           ItemValueDesignerComponent, ImageItemValueDesignerComponent, LogicOperatorComponent, MatrixCellComponent, QuestionEditorComponent, CellQuestionDropdownComponent, CreatorRowComponent, DesignerPagesComponent, DesignerSurveyComponent, CellQuestionComponent, QuestionWidgetDesignerComponent, ToolboxComponent, CreatorLogoImageComponent,
                           QuestionRatingAdornerDesignerComponent, QuestionRatingDesignerComponent, QuestionSpinEditorComponent, ColorItemComponent, QuestionColorComponent, QuestionFileEditorComponent, AddQuestionButtonComponent, QuestionBannerComponent, JsonErrorItemComponent, QuestionTextWithResetComponent, TranslateFromAction
@@ -3016,6 +3083,8 @@
   exports.ToolboxCategoryComponent = ToolboxCategoryComponent;
   exports.ToolboxComponent = ToolboxComponent;
   exports.ToolboxItemComponent = ToolboxItemComponent;
+  exports.ToolboxItemGroupComponent = ToolboxItemGroupComponent;
+  exports.ToolboxListComponent = ToolboxListComponent;
   exports.ToolboxToolComponent = ToolboxToolComponent;
   exports.TranslateFromAction = TranslateFromAction;
   exports.TranslationSkeletonComponent = TranslationSkeletonComponent;