@fonixtree/magic-design 0.0.28 → 0.0.29

package/lib/composite-comp/bol/config-panels/CarouselConfig/CarouselConfigSetting/index.js

@@ -13,6 +13,8 @@ require("./index.less");
 
 var _coreUtil = require("../../../../../utils/coreUtil");
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -64,7 +66,7 @@ function (_super) {
     var setting = this.props.setting;
 
     var autoplaySetting = /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "How long between slides (secs)"
+      title: (0, _locale.i18n)('HOW_LONG_BETWEEN_SLIDES_(SECS)')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       maxVal: 60,
       minVal: 1,
@@ -80,7 +82,7 @@ function (_super) {
     }));
 
     var navigationSetting = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Navigation arrow"
+      title: (0, _locale.i18n)('NAVIGATION_ARROW')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       needColor: true,
       onChange: function onChange(value) {
@@ -95,7 +97,7 @@ function (_super) {
         color: setting.navigation.color
       }
     })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Selected arrow"
+      title: (0, _locale.i18n)('SELECTED_ARROW')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       needColor: true,
       onChange: function onChange(value) {
@@ -112,7 +114,7 @@ function (_super) {
     })));
 
     var dotsSetting = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Slide button"
+      title: (0, _locale.i18n)('SLIDE_BUTTON')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       needColor: true,
       onChange: function onChange(value) {
@@ -127,7 +129,7 @@ function (_super) {
         color: setting.dots.color
       }
     })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Selected button"
+      title: (0, _locale.i18n)('SELECTED_BUTTON')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       needColor: true,
       onChange: function onChange(value) {
@@ -150,19 +152,19 @@ function (_super) {
       onRefresh: this.reRender,
       source: [{
         key: '1',
-        name: 'Autoplays',
+        name: (0, _locale.i18n)('AUTOPLAYS'),
         value: autoplaySetting,
         metaOption: setting.autoplay,
         toggleType: 'switch'
       }, {
         key: '2',
-        name: 'Show navigation arrow',
+        name: (0, _locale.i18n)('SHOW_NAVIGATION_ARROW'),
         value: navigationSetting,
         metaOption: setting.navigation,
         toggleType: 'switch'
       }, {
         key: '3',
-        name: 'Show slide button',
+        name: (0, _locale.i18n)('SHOW_SLIDE_BUTTON'),
         value: dotsSetting,
         metaOption: setting.dots,
         toggleType: 'switch'

package/lib/composite-comp/bol/config-panels/CarouselConfig/index.js

@@ -21,6 +21,8 @@ var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-pa
 
 var _layout = require("../../../../constants/layout");
 
+var _locale = require("../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function CarouselConfig(props) {
@@ -30,26 +32,25 @@ function CarouselConfig(props) {
     headerSize: "large",
     source: [{
       key: '1',
-      name: 'Image',
+      name: (0, _locale.i18n)('IMAGE'),
       value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigImageGroup["default"], {
         source: data.groupSource
       })
     }, {
       key: '2',
-      name: 'Setting',
+      name: (0, _locale.i18n)('SETTING'),
       value: /*#__PURE__*/_react["default"].createElement(_CarouselConfigSetting["default"], {
         setting: data.setting
       })
     }, {
       key: '3',
-      name: 'Spacing',
+      name: (0, _locale.i18n)('SPACING'),
       value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
-        configWidth: true,
         data: data.spacing
       })
     }, {
       key: '4',
-      name: 'Customize',
+      name: (0, _locale.i18n)('CUSTOMIZE'),
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         component: "carousel",
         data: data.customize,
@@ -59,7 +60,7 @@ function CarouselConfig(props) {
       })
     }, {
       key: '5',
-      name: 'Background',
+      name: (0, _locale.i18n)('BACKGROUND'),
       value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
         data: data.background
       })

package/lib/composite-comp/bol/config-panels/DividerConfig/DividerConfigSetting/index.js

@@ -7,6 +7,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
+var _locale = require("../../../../../locale");
+
 var _common = require("../../../../../common");
 
 var _coreUtil = require("../../../../../utils/coreUtil");
@@ -66,7 +68,7 @@ function (_super) {
     return /*#__PURE__*/_react["default"].createElement("div", {
       className: "banner_setting"
     }, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Height And Color"
+      title: (0, _locale.i18n)('HEIGHT_AND_COLOR')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       needColor: true,
       onChange: function onChange(value) {

package/lib/composite-comp/bol/config-panels/DividerConfig/DividerContentSetting/index.js

@@ -15,6 +15,8 @@ var _common = require("../../../../../common");
 
 var _coreUtil = require("../../../../../utils/coreUtil");
 
+var _locale = require("../../../../../locale");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -80,7 +82,7 @@ function (_super) {
       var content = _this.props.content;
       return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
         split: true,
-        title: "Line Color"
+        title: (0, _locale.i18n)('LINE_COLOR')
       }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
         maxVal: 100,
         minVal: 0,
@@ -100,7 +102,7 @@ function (_super) {
         }
       })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
         split: true,
-        title: "Line Weight"
+        title: (0, _locale.i18n)('LINE_WEIGHT')
       }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
         maxVal: 10,
         minVal: 1,
@@ -116,7 +118,7 @@ function (_super) {
         }
       })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
         split: true,
-        title: "Line Style"
+        title: (0, _locale.i18n)('LINE_STYLE')
       }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
         onChange: function onChange(data) {
           content.style = data;
@@ -134,7 +136,7 @@ function (_super) {
         value: "double"
       }, _this.getLineStyleDom('double')))), /*#__PURE__*/_react["default"].createElement(_common.Field, {
         split: true,
-        title: "Line Width"
+        title: (0, _locale.i18n)('LINE_WIDTH')
       }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
         maxVal: 100,
         minVal: 0,
@@ -157,7 +159,7 @@ function (_super) {
   DividerContentSetting.prototype.render = function () {
     var source = [{
       key: '1',
-      name: 'Show Divider',
+      name: (0, _locale.i18n)('SHOW_DIVIDER'),
       value: this.getDividerConfig(),
       metaOption: this.props.content
     }];

package/lib/composite-comp/bol/config-panels/DividerConfig/DividerSpacingSetting/index.js

@@ -9,6 +9,8 @@ exports["default"] = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
+var _locale = require("../../../../../locale");
+
 var _common = require("../../../../../common");
 
 var _coreUtil = require("../../../../../utils/coreUtil");
@@ -65,7 +67,7 @@ function (_super) {
 
     var spacing = this.props.spacing;
     return /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Line Spacing"
+      title: (0, _locale.i18n)('LINE_SPACING')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       maxVal: 50,
       minVal: 0,

package/lib/composite-comp/bol/config-panels/DividerConfig/index.js

@@ -19,6 +19,8 @@ var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-pa
 
 var _BackgroundConfig = _interopRequireDefault(require("../../../common/config-panels/BackgroundConfig"));
 
+var _locale = require("../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function DividerConfig(props) {
@@ -28,26 +30,26 @@ function DividerConfig(props) {
     headerSize: "large",
     source: [{
       key: 'content',
-      name: 'Content',
+      name: (0, _locale.i18n)('CONTENT'),
       value: /*#__PURE__*/_react["default"].createElement(_DividerContentSetting["default"], {
         content: data.content
       })
     }, {
       key: 'spacing',
-      name: 'Spacing',
+      name: (0, _locale.i18n)('SPACING'),
       value: /*#__PURE__*/_react["default"].createElement(_DividerSpacingSetting["default"], {
         spacing: data.spacing
       })
     }, {
       key: 'customize',
-      name: 'Customize',
+      name: (0, _locale.i18n)('CUSTOMIZE'),
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         data: data.customize,
         layoutSource: _layout.dividerLayout
       })
     }, {
       key: 'background',
-      name: 'Background',
+      name: (0, _locale.i18n)('BACKGROUND'),
       value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
         data: data.background
       })

package/lib/composite-comp/bol/config-panels/ImageGalleryConfig/ImageGalleryConfigImageGroup/index.js

@@ -19,6 +19,8 @@ var _defaultJSON = require("../../../components/ImageGallery/defaultJSON");
 
 var _defaultImg = _interopRequireDefault(require("../imgs/defaultImg.png"));
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
@@ -130,7 +132,7 @@ function (_super) {
       icon: "icon-add",
       onClick: this.onAddClick,
       type: "primary"
-    }, "Add Image")));
+    }, (0, _locale.i18n)('ADD_IMAGE'))));
   };
 
   AComponent.defaultProps = {

package/lib/composite-comp/bol/config-panels/ImageGalleryConfig/index.js

@@ -19,6 +19,8 @@ var _layout = require("../../../../constants/layout");
 
 var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
 
+var _locale = require("../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function ImageGalleryConfig(props) {
@@ -28,26 +30,26 @@ function ImageGalleryConfig(props) {
     headerSize: "large",
     source: [{
       key: '1',
-      name: 'Image',
+      name: (0, _locale.i18n)('IMAGE'),
       value: /*#__PURE__*/_react["default"].createElement(_ImageGalleryConfigImageGroup["default"], {
         source: data.groupSource
       })
     }, {
       key: '2',
-      name: 'Spacing',
+      name: (0, _locale.i18n)('SPACING'),
       value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
         data: data.spacing
       })
     }, {
       key: '5',
-      name: 'Customize',
+      name: (0, _locale.i18n)('CUSTOMIZE'),
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         data: data.customize,
         layoutSource: _layout.imageGalleryLayout
       })
     }, {
       key: '6',
-      name: 'Background',
+      name: (0, _locale.i18n)('BACKGROUND'),
       value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
         data: data.background
       })

package/lib/composite-comp/bol/config-panels/ImageTextConfig/ImageTextConfigGroup/index.js

@@ -17,6 +17,8 @@ var _Button = _interopRequireDefault(require("../../../../../common/Button"));
 
 var _defaultJSON = require("../../../components/ImageText/defaultJSON");
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
@@ -112,7 +114,7 @@ function (_super) {
       icon: "icon-add",
       onClick: this.onAddClick,
       type: "primary"
-    }, "Add Banner")));
+    }, (0, _locale.i18n)('ADD_GROUP'))));
   };
 
   ImageTextConfigGroup.defaultProps = {

package/lib/composite-comp/bol/config-panels/ImageTextConfig/index.js

@@ -9,6 +9,8 @@ var _react = _interopRequireDefault(require("react"));
 
 var _ImageTextConfigGroup = _interopRequireDefault(require("./ImageTextConfigGroup"));
 
+var _locale = require("../../../../locale");
+
 var _layout = require("../../../../constants/layout");
 
 var _common = require("../../../../common");
@@ -74,7 +76,7 @@ function (_super) {
       var data = _this.props.data;
       var source = [{
         key: 'imageTextTitle1',
-        name: 'Headline',
+        name: (0, _locale.i18n)('HEADLINE'),
         value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
           data: data.headline
         }),
@@ -82,7 +84,7 @@ function (_super) {
         toggleType: 'switch'
       }, {
         key: 'imageTextTitle2',
-        name: 'Subtitle',
+        name: (0, _locale.i18n)('SUBTITLE'),
         value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
           data: data.subtitle
         }),
@@ -104,7 +106,7 @@ function (_super) {
       var data = _this.props.data;
       var source = [{
         key: 'imageTextButton1',
-        name: 'Button',
+        name: (0, _locale.i18n)('BUTTON'),
         value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
           data: data.button
         }),
@@ -112,7 +114,7 @@ function (_super) {
         toggleType: 'switch'
       }, {
         key: 'imageTextButton2',
-        name: 'Secondary button',
+        name: (0, _locale.i18n)('SECONDARY_BUTTON'),
         value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
           data: data.secondButton
         }),
@@ -154,24 +156,22 @@ function (_super) {
     }, /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
       divider: "bold",
       headerSize: "large",
-      source: [// { key: 'imageText1', name: 'Title', value: this.getTitlePanel() },
-      {
+      source: [{
         key: 'imageText2',
-        name: 'Group',
+        name: (0, _locale.i18n)('GROUP'),
         value: /*#__PURE__*/_react["default"].createElement(_ImageTextConfigGroup["default"], {
           source: data.groupSource
         }),
         metaOption: data.groupSource
-      }, // { key: 'imageText3', name: 'Button', value: this.getButtonPanel() },
-      {
+      }, {
         key: '2',
-        name: 'Spacing',
+        name: (0, _locale.i18n)('SPACING'),
         value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
           data: data.spacing
         })
       }, {
         key: 'imageText4',
-        name: 'Customize',
+        name: (0, _locale.i18n)('CUSTOMIZE'),
         value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
           data: data.customize,
           layoutSource: (0, _coreUtil.isPc)() ? _layout.imageTextLayoutPc : _layout.imageTextLayoutMobile,
@@ -181,7 +181,7 @@ function (_super) {
         })
       }, {
         key: 'imageText5',
-        name: 'Background',
+        name: (0, _locale.i18n)('BACKGROUND'),
         value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
           data: data.background
         })

package/lib/composite-comp/bol/config-panels/NewsletterConfig/InputField/index.js

@@ -17,6 +17,8 @@ var _businessUtil = require("../../../../../utils/businessUtil");
 
 var _TextConfig = require("../../../../../meta-comp/config-panels/TextConfig");
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -93,14 +95,14 @@ function (_super) {
         paddingTop: 20
       }
     }, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Placeholder"
+      title: (0, _locale.i18n)('PLACEHOLDER')
     }, /*#__PURE__*/_react["default"].createElement(_antd.Input, {
       onChange: function onChange(v) {
         data.placeholder = v;
       },
       value: data.placeholder
     })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Font Style"
+      title: (0, _locale.i18n)('FONT_STYLE')
     }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
       onChange: function onChange(v) {
         if (v == 'Customize font styles') {
@@ -124,7 +126,7 @@ function (_super) {
         value: sizeType.key
       }, sizeType.key);
     }))), textData.sizeType == 'Customize font styles' && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "font Family"
+      title: (0, _locale.i18n)('FONT_FAMILY')
     }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
       onChange: function onChange(v) {
         textData.fontFamily = v;
@@ -137,7 +139,7 @@ function (_super) {
     }, "Montserrat"), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
       value: "Open Sans"
     }, "Open Sans"))), /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "font Weight"
+      title: (0, _locale.i18n)('FONT_WEIGHT')
     }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
       onChange: function onChange(v) {
         textData.fontWeight = v;
@@ -147,10 +149,10 @@ function (_super) {
       value: textData.fontWeight
     }, /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
       value: 400
-    }, "Regular"), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
+    }, (0, _locale.i18n)('REGULAR')), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
       value: 600
-    }, "Medium"))), /*#__PURE__*/_react["default"].createElement(_common.Field, {
-      title: "Font Size"
+    }, (0, _locale.i18n)('MEDIUM')))), /*#__PURE__*/_react["default"].createElement(_common.Field, {
+      title: (0, _locale.i18n)('FONT_SIZE')
     }, /*#__PURE__*/_react["default"].createElement(_common.Slider, {
       onChange: function onChange(_a) {
         var count = _a.count;

package/lib/composite-comp/bol/config-panels/NewsletterConfig/NewsletterContentSetting/index.js

@@ -17,6 +17,8 @@ var _common = require("../../../../../common");
 
 var _InputField = _interopRequireDefault(require("../InputField"));
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -73,21 +75,21 @@ function (_super) {
       onRefresh: this.reRender,
       source: [{
         key: '1',
-        name: 'Input Field',
+        name: (0, _locale.i18n)('INPUT_FIELD'),
         value: /*#__PURE__*/_react["default"].createElement(_InputField["default"], {
           data: panelProps.inputField
         }),
         metaOption: panelProps.inputField
       }, {
         key: '2',
-        name: 'Button',
+        name: (0, _locale.i18n)('BUTTON'),
         value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
           data: panelProps.button
         }),
         metaOption: panelProps.button
       }, {
         key: '3',
-        name: 'Confirmation',
+        name: (0, _locale.i18n)('CONFIRMATION'),
         value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
           data: panelProps.confirmation
         }),

package/lib/composite-comp/bol/config-panels/NewsletterConfig/index.js

@@ -28,26 +28,26 @@ function NewsletterConfig(props) {
     headerSize: "large",
     source: [{
       key: '1',
-      name: 'Content',
+      name: i18n('CONTENT'),
       value: /*#__PURE__*/_react["default"].createElement(_NewsletterContentSetting["default"], {
         panelProps: data.content
       })
     }, {
       key: '2',
-      name: 'Spacing',
+      name: i18n('SPACING'),
       value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
         data: data.spacing
       })
     }, {
       key: '3',
-      name: 'Customize',
+      name: i18n('CUSTOMIZE'),
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         data: data.customize,
         layoutSource: _layout.newsletterLayout
       })
     }, {
       key: '4',
-      name: 'Background',
+      name: i18n('BACKGROUND'),
       value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
         data: data.background
       })

package/lib/composite-comp/bol/config-panels/TagCompConfig/TagConfigContent/index.js

@@ -71,21 +71,21 @@ function (_super) {
       onRefresh: this.reRender,
       source: [{
         key: '1',
-        name: 'Image Tag',
+        name: i18n('IMAGE_TAG'),
         value: /*#__PURE__*/_react["default"].createElement(_ImageConfig["default"], {
           data: panelProps.image
         }),
         metaOption: panelProps.image
       }, {
         key: '2',
-        name: 'Button Tag',
+        name: i18n('BUTTON_TAG'),
         value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
           data: panelProps.button
         }),
         metaOption: panelProps.button
       }, {
         key: '3',
-        name: 'Secondary Button Tag',
+        name: i18n('SECONDARY_BUTTON_TAG'),
         value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
           data: panelProps.secondaryButton
         }),

package/lib/composite-comp/bol/config-panels/TagCompConfig/index.js

@@ -28,19 +28,19 @@ function TagCompConfig(props) {
     headerSize: "large",
     source: [{
       key: '1',
-      name: 'Content',
+      name: i18n('CONTENT'),
       value: /*#__PURE__*/_react["default"].createElement(_TagConfigContent["default"], {
         panelProps: data.content
       })
     }, {
       key: '2',
-      name: 'Spacing',
+      name: i18n('SPACING'),
       value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
         data: data.spacing
       })
     }, {
       key: '3',
-      name: 'Customize',
+      name: i18n('CUSTOMIZE'),
       value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
         data: data.customize,
         layoutSource: [{
@@ -51,7 +51,7 @@ function TagCompConfig(props) {
       })
     }, {
       key: '4',
-      name: 'Background',
+      name: i18n('BACKGROUND'),
       value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
         data: data.background
       })

package/lib/composite-comp/bol/config-panels/TextCompConfig/TextConfigContent/index.js

@@ -13,6 +13,8 @@ var _coreUtil = require("../../../../../utils/coreUtil");
 
 var _common = require("../../../../../common");
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 var __extends = void 0 && (void 0).__extends || function () {
@@ -69,14 +71,14 @@ function (_super) {
       onRefresh: this.reRender,
       source: [{
         key: '1',
-        name: 'Headline',
+        name: (0, _locale.i18n)('HEADLINE'),
         value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
           data: panelProps.headline
         }),
         metaOption: panelProps.headline
       }, {
         key: '2',
-        name: 'Subtitle',
+        name: (0, _locale.i18n)('SUBTITLE'),
         value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
           data: panelProps.subtitle
         }),

package/lib/composite-comp/bol/config-panels/TextCompConfig/TextConfigGroup/index.js

@@ -19,6 +19,8 @@ var _defaultJSON = require("../../../components/Text/defaultJSON");
 
 require("./index.less");
 
+var _locale = require("../../../../../locale");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
@@ -124,7 +126,7 @@ function (_super) {
       icon: "icon-add",
       onClick: this.onAddClick,
       type: "primary"
-    }, "Add Group")));
+    }, (0, _locale.i18n)('ADD_GROUP'))));
   };
 
   default_1.defaultProps = {