work for #5094 renames

surveyjs · May 24, 2024 · 13d1aa0 · 13d1aa0
1 parent 860fdb9
commit 13d1aa0
Show file tree

Hide file tree

Showing 50 changed files with 1,055 additions and 1,343 deletions.
diff --git a/packages/survey-creator-core/src/components/tabs/header-model.ts b/packages/survey-creator-core/src/components/tabs/header-model.ts
@@ -45,9 +45,9 @@ export class HeaderModel extends Base implements IHeader {
 
     const backgroundColorValue = cssVariables["--sjs-header-backcolor"];
     if (!!backgroundColorValue) {
-      this["backgroundColorSwitch"] = this.getBackgroundColorSwitchByValue(backgroundColorValue);
-      this["backgroundColor"] = this["backgroundColorSwitch"] === "custom" ? backgroundColorValue : undefined;
-      // this._setPGEditorPropertyValue(panel.getQuestionByName("backgroundColorSwitch"), "value", this.getBackgroundColorSwitchByValue(backgroundColorValue));
+      this["backgroundColorType"] = this.getBackgroundColorSwitchByValue(backgroundColorValue);
+      this["backgroundColor"] = this["backgroundColorType"] === "custom" ? backgroundColorValue : undefined;
+      // this._setPGEditorPropertyValue(panel.getQuestionByName("backgroundColorType"), "value", this.getBackgroundColorSwitchByValue(backgroundColorValue));
     }
   }
 
@@ -65,7 +65,7 @@ export class HeaderModel extends Base implements IHeader {
     Object.keys(result).forEach(key => {
       if (typeof result[key] === "object") {
         const property = this.getPropertyByName(key);
-        if (property.type === "fontsettings") {
+        if (property.type === "font") {
           fontsettingsToCssVariable(result[key], property, cssVariables);
           delete result[key];
         }
@@ -75,7 +75,7 @@ export class HeaderModel extends Base implements IHeader {
     this.setHeaderBackgroundColorCssVariable(cssVariables);
     result.cssVariables = cssVariables;
 
-    delete result.backgroundColorSwitch;
+    delete result.backgroundColorType;
     delete result.backgroundColor;
     return result;
   }
@@ -91,9 +91,9 @@ export class HeaderModel extends Base implements IHeader {
   }
 
   private setHeaderBackgroundColorCssVariable(cssVariables: any) {
-    if (this["backgroundColorSwitch"] === "none") {
+    if (this["backgroundColorType"] === "none") {
       cssVariables["--sjs-header-backcolor"] = "transparent";
-    } else if (this["backgroundColorSwitch"] === "custom") {
+    } else if (this["backgroundColorType"] === "custom") {
       cssVariables["--sjs-header-backcolor"] = this["backgroundColor"] ?? "transparent";
     }
   }
@@ -145,7 +145,7 @@ export class HeaderModel extends Base implements IHeader {
 
   //     const backgroundColorValue = themeCssVariables["--sjs-header-backcolor"];
   //     if (!!backgroundColorValue) {
-  //       this._setPGEditorPropertyValue(panel.getQuestionByName("backgroundColorSwitch"), "value", this.getBackgroundColorSwitchByValue(backgroundColorValue));
+  //       this._setPGEditorPropertyValue(panel.getQuestionByName("backgroundColorType"), "value", this.getBackgroundColorSwitchByValue(backgroundColorValue));
   //     }
   //   }
   // }
@@ -182,7 +182,7 @@ export class HeaderModel extends Base implements IHeader {
   // }
 
   public getType(): string {
-    return "headersettings";
+    return "header";
   }
 }
 
@@ -229,7 +229,7 @@ function getVerticalAlignment(questionName: string, defaultValue: string): IJson
 }
 
 Serializer.addClass(
-  "headersettings",
+  "header",
   [
     {
       type: "buttongroup",
@@ -268,18 +268,18 @@ Serializer.addClass(
     {
       type: "buttongroup",
       name: "inheritWidthFrom",
-      displayName: getLocString("theme.coverInheritWidthFrom"),
+      displayName: getLocString("theme.headerInheritWidthFrom"),
       visibleIf: (obj) => obj.headerView === "advanced",
       default: "container",
       choices: [
-        { value: "survey", text: getLocString("theme.coverInheritWidthFromSurvey") },
-        { value: "container", text: getLocString("theme.coverInheritWidthFromContainer") }
+        { value: "survey", text: getLocString("theme.headerInheritWidthFromSurvey") },
+        { value: "container", text: getLocString("theme.headerInheritWidthFromContainer") }
       ],
     },
     {
       type: "spinedit",
       name: "textAreaWidth",
-      displayName: getLocString("theme.coverTextAreaWidth"),
+      displayName: getLocString("theme.headerTextAreaWidth"),
       visibleIf: (obj) => obj.headerView === "advanced",
       default: 512,
       onPropertyEditorUpdate: function (obj: any, editor: any) {
@@ -291,15 +291,15 @@ Serializer.addClass(
     },
     {
       type: "buttongroup",
-      name: "backgroundColorSwitch",
-      displayName: getLocString("theme.coverBackgroundColorSwitch"),
+      name: "backgroundColorType",
+      displayName: getLocString("theme.headerBackgroundColorSwitch"),
       visibleIf: (obj) => obj.headerView === "advanced",
       isSerializable: false,
       default: "accentColor",
       choices: [
-        { value: "none", text: getLocString("theme.coverBackgroundColorNone") },
-        { value: "accentColor", text: getLocString("theme.coverBackgroundColorAccentColor") },
-        { value: "custom", text: getLocString("theme.coverBackgroundColorCustom") },
+        { value: "none", text: getLocString("theme.headerBackgroundColorNone") },
+        { value: "accentColor", text: getLocString("theme.headerBackgroundColorAccentColor") },
+        { value: "custom", text: getLocString("theme.headerBackgroundColorCustom") },
       ],
     },
     {
@@ -311,7 +311,7 @@ Serializer.addClass(
       onPropertyEditorUpdate: function (obj: any, editor: any) {
         if (!!editor) {
           editor.allowEmptyValue = true;
-          editor.enableIf = "{composite.backgroundColorSwitch} = 'custom'";
+          editor.enableIf = "{composite.backgroundColorType} = 'custom'";
         }
       }
     },
@@ -375,31 +375,31 @@ Serializer.addClass(
 
     getHorizontalAlignment("logoPositionX", getLocString("theme.logoPosition"), "right"),
     getVerticalAlignment("logoPositionY", "top"),
-    getHorizontalAlignment("titlePositionX", getLocString("theme.coverTitlePosition"), "left"),
+    getHorizontalAlignment("titlePositionX", getLocString("theme.headerTitlePosition"), "left"),
     getVerticalAlignment("titlePositionY", "bottom"),
-    getHorizontalAlignment("descriptionPositionX", getLocString("theme.coverDescriptionPosition"), "left"),
+    getHorizontalAlignment("descriptionPositionX", getLocString("theme.headerDescriptionPosition"), "left"),
     getVerticalAlignment("descriptionPositionY", "bottom"),
   ]);
 
-Serializer.addProperties("headersettings", [
+Serializer.addProperties("header", [
   {
-    type: "fontsettings",
+    type: "font",
     name: "surveyTitle",
-    displayName: getLocString("theme.surveyTitle"),
+    displayName: getLocString("theme.surveyTitleFont"),
     visibleIf: (obj) => obj.headerView === "basic",
     default: getDefaultTitleSetting(),
   },
   {
-    type: "fontsettings",
+    type: "font",
     name: "surveyDescription",
-    displayName: getLocString("theme.surveyDescription"),
+    displayName: getLocString("theme.surveyDescriptionFont"),
     visibleIf: (obj) => obj.headerView === "basic",
     default: getDefaultDescriptionSetting(),
   },
   {
-    type: "fontsettings",
+    type: "font",
     name: "headerTitle",
-    displayName: getLocString("theme.surveyTitle"),
+    displayName: getLocString("theme.surveyTitleFont"),
     default: getDefaultTitleSetting(),
     visibleIf: (obj) => obj.headerView === "advanced",
     onPropertyEditorUpdate: function (obj: any, editor: any) {
@@ -409,9 +409,9 @@ Serializer.addProperties("headersettings", [
     },
   },
   {
-    type: "fontsettings",
+    type: "font",
     name: "headerDescription",
-    displayName: getLocString("theme.surveyDescription"),
+    displayName: getLocString("theme.surveyDescriptionFont"),
     default: getDefaultDescriptionSetting(true),
     visibleIf: (obj) => obj.headerView === "advanced",
     onPropertyEditorUpdate: function (obj: any, editor: any) {

diff --git a/...heme-custom-questions/element-settings.ts → ...tom-questions/background-corner-radius.ts b/...heme-custom-questions/element-settings.ts → ...tom-questions/background-corner-radius.ts
@@ -5,15 +5,15 @@ import { assign } from "../../../utils/utils";
 function getElementsJSON() {
   return [
     {
-      type: "colorsettings",
+      type: "coloralpha",
       name: "backcolor",
       colorTitle: getLocString("theme.backcolor"),
       colorTitleLocation: "left",
       titleLocation: "hidden",
       descriptionLocation: "hidden"
     },
     {
-      type: "colorsettings",
+      type: "coloralpha",
       name: "hovercolor",
       colorTitle: getLocString("theme.hovercolor"),
       colorTitleLocation: "left",
@@ -32,9 +32,9 @@ function getElementsJSON() {
   ];
 }
 
-if (!ComponentCollection.Instance.getCustomQuestionByName("elementsettings")) {
+if (!ComponentCollection.Instance.getCustomQuestionByName("backgroundcornerradius")) {
   ComponentCollection.Instance.add({
-    name: "elementsettings",
+    name: "backgroundcornerradius",
     showInToolbox: false,
     internal: true,
     elementsJSON: getElementsJSON(),
@@ -50,12 +50,12 @@ if (!ComponentCollection.Instance.getCustomQuestionByName("elementsettings")) {
   });
 }
 
-export function updateElementSettingsJSON() {
-  const config = ComponentCollection.Instance.getCustomQuestionByName("elementsettings");
+export function updateBackgroundCornerRadiusJSON() {
+  const config = ComponentCollection.Instance.getCustomQuestionByName("backgroundcornerradius");
   config.json.elementsJSON = getElementsJSON();
 }
 
-export function elementSettingsToCssVariable(value: any = {}, property: JsonObjectProperty, themeCssVariables: { [index: string]: string }) {
+export function backgroundCornerRadiusToCssVariable(value: any = {}, property: JsonObjectProperty, themeCssVariables: { [index: string]: string }) {
   Object.keys(value).forEach(key => {
     const propertyName = `--sjs-${property.name.toLocaleLowerCase()}-${key}`;
     if (!property.defaultValue || value[key] !== property.defaultValue[key]) {
@@ -66,7 +66,7 @@ export function elementSettingsToCssVariable(value: any = {}, property: JsonObje
   });
 }
 
-export function elementSettingsFromCssVariable(property: JsonObjectProperty, themeCssVariables: { [index: string]: string }, defaultBackcolorVariableName: string, defaultHovercolorVariableName: string, defaultCornerRadius: number = 4): any {
+export function backgroundCornerRadiusFromCssVariable(property: JsonObjectProperty, themeCssVariables: { [index: string]: string }, defaultBackcolorVariableName: string, defaultHovercolorVariableName: string, defaultCornerRadius: number = 4): any {
   if (!property) return;
 
   if (!property.defaultValue) property.defaultValue = {};
@@ -77,9 +77,9 @@ export function elementSettingsFromCssVariable(property: JsonObjectProperty, the
   });
 
   const result = { ...property.defaultValue };
-  const elementSettingsFromTheme = Object.keys(themeCssVariables).filter(key => key.indexOf(property.name.toLocaleLowerCase()) !== -1);
+  const objFromTheme = Object.keys(themeCssVariables).filter(key => key.indexOf(property.name.toLocaleLowerCase()) !== -1);
 
-  elementSettingsFromTheme.forEach(key => {
+  objFromTheme.forEach(key => {
     const propertyName = key.split("-").pop();
     if (propertyName === "cornerRadius" && themeCssVariables[key] !== undefined) {
       result[propertyName] = parseFloat(themeCssVariables[key].toString());

diff --git a/.../theme-custom-questions/color-settings.ts → ...abs/theme-custom-questions/color-alpha.ts b/.../theme-custom-questions/color-settings.ts → ...abs/theme-custom-questions/color-alpha.ts
@@ -20,14 +20,14 @@ function getElementsJSON() {
     }
   ];
 }
-if(!ComponentCollection.Instance.getCustomQuestionByName("colorsettings")) {
+if (!ComponentCollection.Instance.getCustomQuestionByName("coloralpha")) {
   ComponentCollection.Instance.add({
-    name: "colorsettings",
+    name: "coloralpha",
     showInToolbox: false,
     internal: true,
     elementsJSON: getElementsJSON(),
     onInit() {
-      Serializer.addProperties("colorsettings", [{
+      Serializer.addProperties("coloralpha", [{
         name: "choices:itemvalue[]",
         visible: false
       },
@@ -67,8 +67,8 @@ if(!ComponentCollection.Instance.getCustomQuestionByName("colorsettings")) {
     }
   });
 }
-export function updateColorSettingsJSON() {
-  const config = ComponentCollection.Instance.getCustomQuestionByName("colorsettings");
+export function updatecoloralphaJSON() {
+  const config = ComponentCollection.Instance.getCustomQuestionByName("coloralpha");
   config.json.elementsJSON = getElementsJSON();
 }
 

diff --git a/packages/survey-creator-core/src/components/tabs/theme-custom-questions/font-settings.ts b/packages/survey-creator-core/src/components/tabs/theme-custom-questions/font-settings.ts
@@ -39,15 +39,15 @@ function getElementsJSON() {
       ],
     },
     {
-      type: "colorsettings",
+      type: "coloralpha",
       name: "color",
       colorTitle: getLocString("theme.color"),
       colorTitleLocation: "left",
       titleLocation: "hidden",
       descriptionLocation: "hidden"
     },
     {
-      type: "colorsettings",
+      type: "coloralpha",
       name: "placeholdercolor",
       colorTitle: getLocString("theme.placeholderColor"),
       colorTitleLocation: "left",
@@ -66,14 +66,14 @@ function getElementsJSON() {
   ];
 }
 
-if (!ComponentCollection.Instance.getCustomQuestionByName("fontsettings")) {
+if (!ComponentCollection.Instance.getCustomQuestionByName("font")) {
   ComponentCollection.Instance.add({
-    name: "fontsettings",
+    name: "font",
     showInToolbox: false,
     internal: true,
     elementsJSON: getElementsJSON(),
     onInit() {
-      Serializer.addProperties("fontsettings", [
+      Serializer.addProperties("font", [
         {
           name: "allowEmptyColorValue:boolean",
           default: false,
@@ -109,7 +109,7 @@ function syncPropertiesFromComposite(question: Question, propertyName: string, n
 }
 
 export function updateFontSettingsJSON() {
-  const config = ComponentCollection.Instance.getCustomQuestionByName("fontsettings");
+  const config = ComponentCollection.Instance.getCustomQuestionByName("font");
   config.json.elementsJSON = getElementsJSON();
 }
 

diff --git a/packages/survey-creator-core/src/components/tabs/theme-custom-questions/index.ts b/packages/survey-creator-core/src/components/tabs/theme-custom-questions/index.ts
@@ -1,11 +1,11 @@
-import { updateBoxShadowSettingsJSON } from "./boxshadow-settings";
-import { updateColorSettingsJSON } from "./color-settings";
-import { updateElementSettingsJSON } from "./element-settings";
+import { updateShadowEffectsJSON } from "./shadow-effects";
+import { updatecoloralphaJSON } from "./color-alpha";
+import { updateBackgroundCornerRadiusJSON } from "./background-corner-radius";
 import { updateFontSettingsJSON } from "./font-settings";
 
 export function updateCustomQuestionJSONs() {
-  updateBoxShadowSettingsJSON();
+  updateShadowEffectsJSON();
   updateFontSettingsJSON();
-  updateColorSettingsJSON();
-  updateElementSettingsJSON();
+  updatecoloralphaJSON();
+  updateBackgroundCornerRadiusJSON();
 }
diff --git a/...me-custom-questions/boxshadow-settings.ts → .../theme-custom-questions/shadow-effects.ts b/...me-custom-questions/boxshadow-settings.ts → .../theme-custom-questions/shadow-effects.ts
@@ -40,7 +40,7 @@ function getQuestionJSON() {
         "titleLocation": "left"
       },
       {
-        "type": "colorsettings",
+        "type": "coloralpha",
         "name": "color",
         "titleLocation": "hidden"
       },
@@ -54,9 +54,9 @@ function getQuestionJSON() {
   };
 }
 
-if(!ComponentCollection.Instance.getCustomQuestionByName("boxshadowsettings")) {
+if (!ComponentCollection.Instance.getCustomQuestionByName("shadoweffects")) {
   ComponentCollection.Instance.add({
-    name: "boxshadowsettings",
+    name: "shadoweffects",
     showInToolbox: false,
     internal: true,
     questionJSON: getQuestionJSON(),
@@ -71,16 +71,16 @@ if(!ComponentCollection.Instance.getCustomQuestionByName("boxshadowsettings")) {
   });
 }
 
-export function updateBoxShadowSettingsJSON() {
-  const config = ComponentCollection.Instance.getCustomQuestionByName("boxshadowsettings");
+export function updateShadowEffectsJSON() {
+  const config = ComponentCollection.Instance.getCustomQuestionByName("shadoweffects");
   config.json.questionJSON = getQuestionJSON();
 }
 
 export function createBoxShadow(value: Array<any>): string {
-  if(!Array.isArray(value)) return undefined;
+  if (!Array.isArray(value)) return undefined;
   let hasValue = false;
-  value.forEach(val => { for(let key in val) { hasValue = true; } });
-  if(!hasValue) return undefined;
+  value.forEach(val => { for (let key in val) { hasValue = true; } });
+  if (!hasValue) return undefined;
   return value.map((val => `${val.isInset == true ? "inset " : ""}${val.x ?? 0}px ${val.y ?? 0}px ${val.blur ?? 0}px ${val.spread ?? 0}px ${val.color ?? "#000000"}`
   )).join(", ");
 }

diff --git a/packages/survey-creator-core/src/components/tabs/theme-model-definition.ts b/packages/survey-creator-core/src/components/tabs/theme-model-definition.ts
@@ -57,7 +57,7 @@ const themeModelProperties: ISurveyPropertiesDefinition = {
       { name: "appearancelines", parent: "appearance", index: 800 },
     ]
   },
-  "headersettings@header": {
+  "header@header": {
     properties: [
       { name: "headerView" },
       { name: "logoPosition" },
@@ -67,7 +67,7 @@ const themeModelProperties: ISurveyPropertiesDefinition = {
       { name: "inheritWidthFrom", tab: "layout" },
       { name: "textAreaWidth", tab: "layout" },
 
-      { name: "backgroundColorSwitch", tab: "background" },
+      { name: "backgroundColorType", tab: "background" },
       { name: "backgroundColor", tab: "background" },
       { name: "backgroundImage", tab: "background" },
       { name: "backgroundImageFit", tab: "background" },