Add iconName into IPropertyTabInfo inteface

Author: andrewtelnov

packages/survey-creator-core/src/question-editor/definition.ts

@@ -11,6 +11,7 @@ export interface IPropertyTabInfo {
   title?: string;
   visible?: boolean;
   parent?: string;
+  iconName?: string;
 }
 
 export interface ISurveyQuestionEditorDefinition {

packages/survey-creator-core/src/question-editor/properties.ts

@@ -231,7 +231,7 @@ export class SurveyQuestionProperties {
     return true;
   }
   private setTabProperties(defProperty: any): void {
-    let tab = this.getTabOrCreate(defProperty.name);
+    let tab = this.getTabOrCreate(defProperty.name, defProperty.iconName);
     if (defProperty.index > 0) {
       tab.index = defProperty.index;
     }
@@ -290,13 +290,13 @@ export class SurveyQuestionProperties {
     }
     return null;
   }
-  private getTabOrCreate(tabName: string): SurveyQuestionEditorTabDefinition {
+  private getTabOrCreate(tabName: string, iconName?: string): SurveyQuestionEditorTabDefinition {
     for (var i = 0; i < this.tabs.length; i++) {
       if (this.tabs[i].name == tabName) return this.tabs[i];
     }
     var res = new SurveyQuestionEditorTabDefinition();
     res.name = tabName;
-    res.iconName = pgTabIcons[tabName] || pgTabIcons["undefined"];
+    res.iconName = iconName || pgTabIcons[tabName] || pgTabIcons["undefined"];
     if (tabName == settings.propertyGrid.generalTabName) {
       res.index = -1;
     }

packages/survey-creator-core/tests/presets.tests.ts

@@ -223,6 +223,43 @@ test("set property grid defintion: just one tab for page", () => {
   expect(pages[0].name).toBe("general");
   expect(pages[0].elements).toHaveLength(3);
 });
+test("set property grid defintion & icons", () => {
+  const creator = new CreatorTester();
+  creator.JSON = { elements: [{ type: "text", name: "q1" }] };
+  creator.selectQuestionByName("q1");
+  const preset = new CreatorPreset({
+    propertyGrid: {
+      definition: {
+        autoGenerateProperties: false,
+        classes: {
+          question: {
+            properties: [
+              "name",
+              "title",
+              "indent",
+              { name: "visibleIf", tab: "logic" },
+              { name: "enableIf", tab: "logic" },
+            ],
+            tabs: [
+              { name: "general", iconName: "general!" },
+              { name: "logic", index: 15, iconName: "logic!" }
+            ]
+          },
+        }
+      }
+    }
+  });
+  preset.apply(creator);
+  const survey = creator.propertyGrid;
+  const pages = survey.pages;
+  expect(pages).toHaveLength(2);
+  expect(pages[0].name).toBe("general");
+  expect(pages[0]["iconName"]).toEqual("general!");
+  expect(pages[1].name).toBe("logic");
+  expect(pages[1]["iconName"]).toEqual("logic!");
+  expect(pages[0].elements).toHaveLength(3);
+  expect(pages[1].elements).toHaveLength(2);
+});
 test("apply localization for tabs", () => {
   expect(editorLocalization.presetStrings).toBeFalsy();
   expect(editorLocalization.getString("tabs.logic")).toEqual("Logic");