@fonixtree/magic-design 2.0.94 → 2.0.95

package/es/composite-comp/dito/config-panels/GroupBuyConfig/GroupBuyConfigContent/index.js

@@ -0,0 +1,174 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _antd = require("antd");
+
+var _ButtonConfig = _interopRequireDefault(require("../../../../../meta-comp/config-panels/ButtonConfig"));
+
+var _TextConfig = _interopRequireDefault(require("../../../../../meta-comp/config-panels/TextConfig"));
+
+var _coreUtil = require("../../../../../utils/coreUtil");
+
+var _common = require("../../../../../common");
+
+var _locale = require("../../../../../locale");
+
+require("./index.less");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+var __extends = void 0 && (void 0).__extends || function () {
+  var _extendStatics = function extendStatics(d, b) {
+    _extendStatics = Object.setPrototypeOf || {
+      __proto__: []
+    } instanceof Array && function (d, b) {
+      d.__proto__ = b;
+    } || function (d, b) {
+      for (var p in b) {
+        if (b.hasOwnProperty(p)) d[p] = b[p];
+      }
+    };
+
+    return _extendStatics(d, b);
+  };
+
+  return function (d, b) {
+    _extendStatics(d, b);
+
+    function __() {
+      this.constructor = d;
+    }
+
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  };
+}();
+
+var AComponent =
+/** @class */
+function (_super) {
+  __extends(AComponent, _super);
+
+  function AComponent() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {};
+
+    _this.reRender = function () {
+      (0, _coreUtil.renderPreview)();
+
+      _this.setState({});
+    };
+
+    return _this;
+  }
+
+  AComponent.prototype.render = function () {
+    var _this = this;
+
+    var _a, _b;
+
+    var panelProps = this.props.panelProps;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "group_buy_content"
+    }, /*#__PURE__*/_react["default"].createElement(_common.Field, {
+      title: (0, _locale.i18n)('PRODUCT_SORT_BY')
+    }, /*#__PURE__*/_react["default"].createElement(_antd.Select, {
+      onChange: function onChange(v) {
+        panelProps.sortType = v;
+
+        _this.reRender();
+      },
+      value: panelProps.sortType
+    }, /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
+      value: "3"
+    }, (0, _locale.i18n)('PRICE')), /*#__PURE__*/_react["default"].createElement(_antd.Select.Option, {
+      value: "1"
+    }, (0, _locale.i18n)('SALES')))), /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
+      headerSize: "middle",
+      onRefresh: this.reRender,
+      source: [{
+        key: '1',
+        name: (0, _locale.i18n)('GROUP_LABEL'),
+        value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
+          data: panelProps.label
+        }),
+        metaOption: panelProps.label
+      }, {
+        key: '2',
+        name: (0, _locale.i18n)('PRODUCT_NAME'),
+        value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
+          data: panelProps.productName
+        }),
+        metaOption: panelProps.productName
+      }, {
+        key: '3',
+        name: (0, _locale.i18n)('ACTIVITY_PRICE'),
+        value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
+          data: panelProps.activityPrice
+        }),
+        metaOption: panelProps.activityPrice
+      }, {
+        key: '4',
+        name: (0, _locale.i18n)('SALES_PRICE'),
+        value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
+          data: panelProps.salesPrice
+        }),
+        metaOption: panelProps.salesPrice
+      }],
+      type: "switch"
+    }), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "sales_progress_wrap"
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "title"
+    }, /*#__PURE__*/_react["default"].createElement("span", {
+      className: "label"
+    }, (0, _locale.i18n)('SALES_PROGRESS')), /*#__PURE__*/_react["default"].createElement(_antd.Switch, {
+      checked: (_a = panelProps.salesProgress) === null || _a === void 0 ? void 0 : _a.open,
+      onChange: function onChange(v) {
+        panelProps.salesProgress = {
+          open: v
+        };
+
+        _this.reRender();
+      }
+    })), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "content"
+    }, /*#__PURE__*/_react["default"].createElement("p", {
+      className: "name"
+    }, (0, _locale.i18n)('PROGRESS_BAR_COLOR')), /*#__PURE__*/_react["default"].createElement(_common.ColorPickerInput, {
+      colorType: "rgba",
+      onChange: function onChange(v) {
+        panelProps.salesProgress = {
+          color: v
+        };
+
+        _this.reRender();
+      },
+      value: (_b = panelProps.salesProgress) === null || _b === void 0 ? void 0 : _b.color
+    }))));
+  };
+
+  AComponent.defaultProps = {
+    panelProps: {
+      sortType: '1',
+      label: {},
+      productName: {},
+      activityPrice: {},
+      salesPrice: {},
+      salesProgress: {
+        open: false,
+        color: '#000'
+      }
+    }
+  };
+  return AComponent;
+}(_react["default"].Component);
+
+var _default = AComponent;
+exports["default"] = _default;

package/es/composite-comp/dito/config-panels/GroupBuyConfig/GroupBuyConfigContent/index.less

@@ -0,0 +1,38 @@
+.group_buy_content {
+
+  .sales_progress_wrap {
+    border-top: 1px solid #EDF0F4;
+    padding-top: 20px;
+    padding-bottom: 10px;
+
+    .title {
+      display: flex;
+      justify-content: space-between;
+
+      .label {
+        font-size: 16px !important;
+        line-height: 24px !important;
+        height: 24px !important;
+        font-weight: 600 !important;
+        color: hsl(219, 33%, 21%);
+        font-family: 'Open Sans';
+        font-style: normal;
+      }
+    }
+
+    .content {
+      position: relative;
+
+      .name {
+        font-size: 14px;
+        font-family: 'Open Sans';
+        font-weight: 600;
+        color: #232F46;
+        margin-top: 20px;
+        margin-bottom: 10px;
+      }
+
+    }
+
+  }
+}

package/es/composite-comp/dito/config-panels/GroupBuyConfig/GroupBuyConfigTitle/index.js

@@ -0,0 +1,103 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _TextConfig = _interopRequireDefault(require("../../../../../meta-comp/config-panels/TextConfig"));
+
+var _ButtonConfig = _interopRequireDefault(require("../../../../../meta-comp/config-panels/ButtonConfig"));
+
+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 () {
+  var _extendStatics = function extendStatics(d, b) {
+    _extendStatics = Object.setPrototypeOf || {
+      __proto__: []
+    } instanceof Array && function (d, b) {
+      d.__proto__ = b;
+    } || function (d, b) {
+      for (var p in b) {
+        if (b.hasOwnProperty(p)) d[p] = b[p];
+      }
+    };
+
+    return _extendStatics(d, b);
+  };
+
+  return function (d, b) {
+    _extendStatics(d, b);
+
+    function __() {
+      this.constructor = d;
+    }
+
+    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+  };
+}();
+
+var AComponent =
+/** @class */
+function (_super) {
+  __extends(AComponent, _super);
+
+  function AComponent() {
+    var _this = _super !== null && _super.apply(this, arguments) || this;
+
+    _this.state = {};
+
+    _this.reRender = function () {
+      (0, _coreUtil.renderPreview)();
+
+      _this.setState({});
+    };
+
+    return _this;
+  }
+
+  AComponent.prototype.render = function () {
+    var panelProps = this.props.panelProps;
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      className: "group_buy_title"
+    }, /*#__PURE__*/_react["default"].createElement(_common.Collapse, {
+      headerSize: "middle",
+      onRefresh: this.reRender,
+      source: [{
+        key: '1',
+        name: (0, _locale.i18n)('HEADLINE'),
+        value: /*#__PURE__*/_react["default"].createElement(_TextConfig["default"], {
+          data: panelProps.headline
+        }),
+        metaOption: panelProps.headline
+      }, {
+        key: '2',
+        name: (0, _locale.i18n)('BUTTON'),
+        value: /*#__PURE__*/_react["default"].createElement(_ButtonConfig["default"], {
+          data: panelProps.button
+        }),
+        metaOption: panelProps.button
+      }],
+      type: "switch"
+    }));
+  };
+
+  AComponent.defaultProps = {
+    panelProps: {
+      headline: {},
+      button: {}
+    }
+  };
+  return AComponent;
+}(_react["default"].Component);
+
+var _default = AComponent;
+exports["default"] = _default;

package/es/composite-comp/dito/config-panels/GroupBuyConfig/index.js

@@ -0,0 +1,73 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = GroupBuyConfig;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _GroupBuyConfigTitle = _interopRequireDefault(require("./GroupBuyConfigTitle"));
+
+var _GroupBuyConfigContent = _interopRequireDefault(require("./GroupBuyConfigContent"));
+
+var _layout = _interopRequireDefault(require("./imgs/layout1.png"));
+
+var _SpacingConfig = _interopRequireDefault(require("../../../common/config-panels/SpacingConfig"));
+
+var _BackgroundConfig = _interopRequireDefault(require("../../../common/config-panels/BackgroundConfig"));
+
+var _CustomizeConfig = _interopRequireDefault(require("../../../common/config-panels/CustomizeConfig"));
+
+var _Collapse = _interopRequireDefault(require("../../../../common/Collapse"));
+
+var _locale = require("../../../../locale");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+
+function GroupBuyConfig(props) {
+  var data = props.data;
+  return /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Collapse["default"], {
+    divider: "bold",
+    headerSize: "large",
+    source: [{
+      key: '1',
+      name: (0, _locale.i18n)('TITLE'),
+      value: /*#__PURE__*/_react["default"].createElement(_GroupBuyConfigTitle["default"], {
+        panelProps: data.title
+      })
+    }, {
+      key: '2',
+      name: (0, _locale.i18n)('CONTENT'),
+      value: /*#__PURE__*/_react["default"].createElement(_GroupBuyConfigContent["default"], {
+        panelProps: data.content
+      })
+    }, {
+      key: '3',
+      name: (0, _locale.i18n)('SPACING'),
+      value: /*#__PURE__*/_react["default"].createElement(_SpacingConfig["default"], {
+        configCompSpace: true,
+        data: data.spacing
+      })
+    }, {
+      key: '4',
+      name: (0, _locale.i18n)('CUSTOMIZE'),
+      value: /*#__PURE__*/_react["default"].createElement(_CustomizeConfig["default"], {
+        data: data.customize,
+        isHideAlign: true,
+        layoutSource: [{
+          id: 'layout1',
+          name: 'layout1',
+          image: _layout["default"]
+        }]
+      })
+    }, {
+      key: '5',
+      name: (0, _locale.i18n)('BACKGROUND'),
+      value: /*#__PURE__*/_react["default"].createElement(_BackgroundConfig["default"], {
+        data: data.background
+      })
+    }],
+    type: "triangle"
+  }));
+}

package/es/composite-comp/dito/config-panels/SearchBarConfig/SearchBarConfigContent/index.js

@@ -83,11 +83,11 @@ function (_super) {
     }, {
       key: 'search2',
       name: (0, _locale.i18n)('SEARCH_BOX'),
-      value: /*#__PURE__*/_react["default"].createElement(_common.Field, {
+      value: /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_common.Field, {
         style: {
           marginTop: 20
         },
-        title: (0, _locale.i18n)('COLOR')
+        title: (0, _locale.i18n)('BOX_COLOR')
       }, /*#__PURE__*/_react["default"].createElement(_common.ColorPickerInput, {
         colorType: "rgba",
         onChange: function onChange(v) {
@@ -100,6 +100,11 @@ function (_super) {
           _this.selfRender();
         },
         value: (0, _coreUtil.isPc)() ? panelProps.box.color.pc : panelProps.box.color.mobile
+      })), /*#__PURE__*/_react["default"].createElement(_common.Field, {
+        style: {
+          marginTop: 20
+        },
+        title: (0, _locale.i18n)('BOX_BACKGROUND')
       })),
       metaOption: panelProps.box,
       toggleType: 'switch'

package/es/constants/component-types.js

@@ -35,6 +35,8 @@ var _Location = _interopRequireDefault(require("../composite-comp/bol/components
 
 var _FlashDeal = _interopRequireDefault(require("../composite-comp/dito/components/FlashDeal"));
 
+var _GroupBuy = _interopRequireDefault(require("../composite-comp/dito/components/GroupBuy"));
+
 var _SearchBar = _interopRequireDefault(require("../composite-comp/dito/components/SearchBar"));
 
 var _SignBoard = _interopRequireDefault(require("../composite-comp/dito/components/SignBoard"));
@@ -87,6 +89,8 @@ var _WalletNuriConfig = _interopRequireDefault(require("../composite-comp/bol/co
 
 var _FlashDealConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/FlashDealConfig"));
 
+var _GroupBuyConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/GroupBuyConfig"));
+
 var _SearchBarConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/SearchBarConfig"));
 
 var _SignBoardConfig = _interopRequireDefault(require("../composite-comp/dito/config-panels/SignBoardConfig"));
@@ -155,13 +159,13 @@ var _a, _b, _c; // 组件
 /**
  * 渲染组件索引
  */
-var componentMap = (_a = {}, _a[_Banner["default"].type] = _Banner["default"], _a[_Video["default"].type] = _Video["default"], _a[_Text["default"].type] = _Text["default"], _a[_FlashDeal["default"].type] = _FlashDeal["default"], _a[_SearchBar["default"].type] = _SearchBar["default"], _a[_SignBoard["default"].type] = _SignBoard["default"], _a[_MenuNavigation["default"].type] = _MenuNavigation["default"], _a[_HeadNavigation["default"].type] = _HeadNavigation["default"], _a[_PersonalInformation["default"].type] = _PersonalInformation["default"], _a[_Orders["default"].type] = _Orders["default"], _a[_CommonFunctions["default"].type] = _CommonFunctions["default"], _a[_ImageText["default"].type] = _ImageText["default"], _a[_Recommend["default"].type] = _Recommend["default"], _a[_AffiliateRecommend["default"].type] = _AffiliateRecommend["default"], _a[_MobileNavigation["default"].type] = _MobileNavigation["default"], _a[_PcNavigation["default"].type] = _PcNavigation["default"], _a[_Divider["default"].type] = _Divider["default"], _a[_ImageGallery["default"].type] = _ImageGallery["default"], _a[_Newsletter["default"].type] = _Newsletter["default"], _a[_Carousel["default"].type] = _Carousel["default"], _a[_Button["default"].type] = _Button["default"], _a[_Tag["default"].type] = _Tag["default"], _a[_Wallet["default"].type] = _Wallet["default"], _a[_WalletNuri["default"].type] = _WalletNuri["default"], _a[_CustomCode["default"].type] = _CustomCode["default"], _a[_Location["default"].type] = _Location["default"], _a);
+var componentMap = (_a = {}, _a[_Banner["default"].type] = _Banner["default"], _a[_Video["default"].type] = _Video["default"], _a[_Text["default"].type] = _Text["default"], _a[_FlashDeal["default"].type] = _FlashDeal["default"], _a[_GroupBuy["default"].type] = _GroupBuy["default"], _a[_SearchBar["default"].type] = _SearchBar["default"], _a[_SignBoard["default"].type] = _SignBoard["default"], _a[_MenuNavigation["default"].type] = _MenuNavigation["default"], _a[_HeadNavigation["default"].type] = _HeadNavigation["default"], _a[_PersonalInformation["default"].type] = _PersonalInformation["default"], _a[_Orders["default"].type] = _Orders["default"], _a[_CommonFunctions["default"].type] = _CommonFunctions["default"], _a[_ImageText["default"].type] = _ImageText["default"], _a[_Recommend["default"].type] = _Recommend["default"], _a[_AffiliateRecommend["default"].type] = _AffiliateRecommend["default"], _a[_MobileNavigation["default"].type] = _MobileNavigation["default"], _a[_PcNavigation["default"].type] = _PcNavigation["default"], _a[_Divider["default"].type] = _Divider["default"], _a[_ImageGallery["default"].type] = _ImageGallery["default"], _a[_Newsletter["default"].type] = _Newsletter["default"], _a[_Carousel["default"].type] = _Carousel["default"], _a[_Button["default"].type] = _Button["default"], _a[_Tag["default"].type] = _Tag["default"], _a[_Wallet["default"].type] = _Wallet["default"], _a[_WalletNuri["default"].type] = _WalletNuri["default"], _a[_CustomCode["default"].type] = _CustomCode["default"], _a[_Location["default"].type] = _Location["default"], _a);
 /**
  * 一级配置面板索引
  */
 
 exports.componentMap = componentMap;
-var configPanelMap = (_b = {}, _b[_Banner["default"].type] = _BannerConfig["default"], _b[_Video["default"].type] = _VideoConfig["default"], _b[_Text["default"].type] = _TextCompConfig["default"], _b[_FlashDeal["default"].type] = _FlashDealConfig["default"], _b[_SearchBar["default"].type] = _SearchBarConfig["default"], _b[_SignBoard["default"].type] = _SignBoardConfig["default"], _b[_MenuNavigation["default"].type] = _MenuNavigationConfig["default"], _b[_HeadNavigation["default"].type] = _HeadNavigationConfig["default"], _b[_PersonalInformation["default"].type] = _PersonalInformationConfig["default"], _b[_Orders["default"].type] = _OrdersConfig["default"], _b[_CommonFunctions["default"].type] = _CommonFunctionsConfig["default"], _b[_ImageText["default"].type] = _ImageTextConfig["default"], _b[_Recommend["default"].type] = _RecommendConfig["default"], _b[_AffiliateRecommend["default"].type] = _AffiliateRecommendConfig["default"], _b[_MobileNavigation["default"].type] = _MobileNavigationConfig["default"], _b[_PcNavigation["default"].type] = _PcNavigationConfig["default"], _b[_Divider["default"].type] = _DividerConfig["default"], _b[_ImageGallery["default"].type] = _ImageGalleryConfig["default"], _b[_Newsletter["default"].type] = _NewsletterConfig["default"], _b[_Carousel["default"].type] = _CarouselConfig["default"], _b[_Button["default"].type] = _ButtonCompConfig["default"], _b[_Tag["default"].type] = _TagCompConfig["default"], _b[_Wallet["default"].type] = _WalletConfig["default"], _b[_WalletNuri["default"].type] = _WalletNuriConfig["default"], _b[_CustomCode["default"].type] = _CustomCodeConfig["default"], _b[_Location["default"].type] = _LocationConfig["default"], _b);
+var configPanelMap = (_b = {}, _b[_Banner["default"].type] = _BannerConfig["default"], _b[_Video["default"].type] = _VideoConfig["default"], _b[_Text["default"].type] = _TextCompConfig["default"], _b[_FlashDeal["default"].type] = _FlashDealConfig["default"], _b[_GroupBuy["default"].type] = _GroupBuyConfig["default"], _b[_SearchBar["default"].type] = _SearchBarConfig["default"], _b[_SignBoard["default"].type] = _SignBoardConfig["default"], _b[_MenuNavigation["default"].type] = _MenuNavigationConfig["default"], _b[_HeadNavigation["default"].type] = _HeadNavigationConfig["default"], _b[_PersonalInformation["default"].type] = _PersonalInformationConfig["default"], _b[_Orders["default"].type] = _OrdersConfig["default"], _b[_CommonFunctions["default"].type] = _CommonFunctionsConfig["default"], _b[_ImageText["default"].type] = _ImageTextConfig["default"], _b[_Recommend["default"].type] = _RecommendConfig["default"], _b[_AffiliateRecommend["default"].type] = _AffiliateRecommendConfig["default"], _b[_MobileNavigation["default"].type] = _MobileNavigationConfig["default"], _b[_PcNavigation["default"].type] = _PcNavigationConfig["default"], _b[_Divider["default"].type] = _DividerConfig["default"], _b[_ImageGallery["default"].type] = _ImageGalleryConfig["default"], _b[_Newsletter["default"].type] = _NewsletterConfig["default"], _b[_Carousel["default"].type] = _CarouselConfig["default"], _b[_Button["default"].type] = _ButtonCompConfig["default"], _b[_Tag["default"].type] = _TagCompConfig["default"], _b[_Wallet["default"].type] = _WalletConfig["default"], _b[_WalletNuri["default"].type] = _WalletNuriConfig["default"], _b[_CustomCode["default"].type] = _CustomCodeConfig["default"], _b[_Location["default"].type] = _LocationConfig["default"], _b);
 /**
  * 二级配置面板索引
  */

package/es/constants/index.js

@@ -145,6 +145,10 @@ var compInfoMap = {
     name: 'Flash Deal',
     icon: 'icon-flash-deal'
   },
+  GROUP_BUY: {
+    name: 'Group Buy',
+    icon: 'icon-group-buy'
+  },
   SEARCH: {
     name: 'Search',
     icon: 'icon-search'

package/es/core/Renderer/index.js

@@ -88,19 +88,36 @@ var Renderer = function Renderer(props) {
     var filterData = [];
 
     if (pageData && pageData.childNodes && pageData.childNodes.length) {
+      var graduallySetFloors = function graduallySetFloors(data, step, interval, start) {
+        if (step === void 0) {
+          step = 5;
+        }
+
+        if (interval === void 0) {
+          interval = 200;
+        }
+
+        if (start === void 0) {
+          start = 0;
+        } // 计算这一步应该显示的最终索引
+
+
+        var end = Math.min(start + step, data.length); // 更新楼层数量
+
+        setFloors(data.slice(0, end)); // 如果还有更多楼层要显示，设置一个定时器来递归调用此函数
+
+        if (end < data.length) {
+          setTimeout(function () {
+            graduallySetFloors(data, step, interval, end);
+          }, interval);
+        }
+      };
+
       filterData = pageData.childNodes.filter(function (node) {
         return (0, _coreUtil.isActiveFloor)(node.activeTerminal);
       });
-    } // 首页组建分批渲染按5个一组
-
-
-    setFloors(filterData.slice(0, 5));
-    setTimeout(function () {
-      setFloors(filterData.slice(0, 10));
-      setTimeout(function () {
-        setFloors(filterData);
-      }, 200);
-    }, 200);
+      graduallySetFloors(filterData);
+    }
   }, [pageData]);
   (0, _react.useEffect)(function () {
     setTimeout(function () {

package/es/locale/en/en.json

@@ -1,4 +1,8 @@
 {
+  "BOX_BACKGROUND": "Box Background",
+  "BOX_COLOR": "Box Color",
+  "PROGRESS_BAR_COLOR": "Progress Bar Color",
+  "GROUP_LABEL": "Group Label",
   "SUBMIT": "Submit",
   "CANCELLED": "Cancelled",
   "DONE": "Done",
@@ -88,7 +92,7 @@
   "CONTENT_WIDTH": "Content Width",
   "MAGNIFICATION": "Magnification",
   "RECOMMENDED_RULES": "Recommended Rules",
-  "PRODUCT_SORT_BY": "product sort by",
+  "PRODUCT_SORT_BY": "Product Sort By",
   "PADDING": "Padding",
   "COMPONENT_SPACING": "Component spacing",
   "ALIGNMENT": "Alignment",

package/es/locale/es/es.json

@@ -1,4 +1,8 @@
 {
+  "BOX_BACKGROUND": "Box Background",
+  "BOX_COLOR": "Box Color",
+  "PROGRESS_BAR_COLOR": "Progress Bar Color",
+  "GROUP_LABEL": "Group Label",
   "SUBMIT": "Submit",
   "CANCELLED": "Cancelled",
   "DONE": "Hecho",

package/es/locale/id/id.json

@@ -1,4 +1,8 @@
 {
+  "BOX_BACKGROUND": "Box Background",
+  "BOX_COLOR": "Box Color",
+  "PROGRESS_BAR_COLOR": "Progress Bar Color",
+  "GROUP_LABEL": "Group Label",
   "SUBMIT": "Submit",
   "CANCELLED": "Cancelled",
   "DONE": "Done",
@@ -88,7 +92,7 @@
   "CONTENT_WIDTH": "Content Width",
   "MAGNIFICATION": "Magnification",
   "RECOMMENDED_RULES": "Recommended Rules",
-  "PRODUCT_SORT_BY": "product sort by",
+  "PRODUCT_SORT_BY": "Product Sort By",
   "PADDING": "Padding",
   "COMPONENT_SPACING": "Component spacing",
   "ALIGNMENT": "Alignment",

package/lib/assets/fonts/magic-box-iconfont.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: "magic-box-iconfont";
   /* Project id 3317752 */
-  src: url('magic-box-iconfont.woff2?t=1709712007938') format('woff2'),
-    url('magic-box-iconfont.woff?t=1709712007938') format('woff'),
-    url('magic-box-iconfont.ttf?t=1709712007938') format('truetype');
+  src: url('magic-box-iconfont.woff2?t=1713253836150') format('woff2'),
+    url('magic-box-iconfont.woff?t=1713253836150') format('woff'),
+    url('magic-box-iconfont.ttf?t=1713253836150') format('truetype');
 }
 
 .magic-box-iconfont {
@@ -14,6 +14,14 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.magic-box-icon-group-users:before {
+  content: "\e60a";
+}
+
+.magic-box-icon-group-buy:before {
+  content: "\e643";
+}
+
 .magic-box-icon-orders:before {
   content: "\e64c";
 }