@luck-design-biz/luckda 0.0.22-5 → 0.0.22-6

package/lib/lowcode/engine/provider/ContextProvider.js

@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _umi = require("umi");
 var _ahooks = require("ahooks");
 var _EventBusProvider = require("./EventBusProvider");
+var _usePromiseState3 = _interopRequireDefault(require("../tools/usePromiseState"));
 var topics = _interopRequireWildcard(require("../../constants/event-topics"));
 var Context = exports.Context = /*#__PURE__*/(0, _react.createContext)(null);
 var useLDContext = exports.useLDContext = function useLDContext() {
@@ -35,20 +36,15 @@ var _default = exports.default = function _default(_ref) {
   /**
    * 页面数据
    */
-  var _useSafeState = (0, _ahooks.useSafeState)(null),
-    _useSafeState2 = (0, _slicedToArray2.default)(_useSafeState, 2),
-    pageData = _useSafeState2[0],
-    _setPageData = _useSafeState2[1];
+  var _usePromiseState = (0, _usePromiseState3.default)(null),
+    _usePromiseState2 = (0, _slicedToArray2.default)(_usePromiseState, 2),
+    pageData = _usePromiseState2[0],
+    _setPageData = _usePromiseState2[1];
 
   /**
    * 组件列表
    */
   var _componentList = (0, _react.useRef)([]);
-
-  /**
-   * 组件id与组件的映射
-   */
-  var _componentMap = (0, _react.useRef)(new Map());
   var _privateGetter = (0, _react.useRef)({
     pageCode: function pageCode() {
       return _pageCode.current;
@@ -60,7 +56,7 @@ var _default = exports.default = function _default(_ref) {
       return _componentList.current;
     },
     componentMap: function componentMap() {
-      return _componentMap.current;
+      return new Map(_componentList.current);
     }
   });
 
@@ -70,7 +66,6 @@ var _default = exports.default = function _default(_ref) {
    * component:ReactNode 组件
    */
   var register = (0, _ahooks.useMemoizedFn)(function (id, component) {
-    _componentMap.current.set(id, component);
     _componentList.current.push([id, component]);
   });
 
@@ -79,7 +74,6 @@ var _default = exports.default = function _default(_ref) {
    * id:string 组件id
    */
   var unregister = (0, _ahooks.useMemoizedFn)(function (id) {
-    _componentMap.current.delete(id);
     _componentList.current = _componentList.current.filter(function (_ref2) {
       var _ref3 = (0, _slicedToArray2.default)(_ref2, 1),
         _id = _ref3[0];
@@ -138,8 +132,6 @@ var _default = exports.default = function _default(_ref) {
       _pageCode: _pageCode,
       _moduleCode: _moduleCode,
       _setPageData: _setPageData,
-      _componentList: _componentList,
-      _componentMap: _componentMap,
       pageData: pageData,
       history: _umi.history,
       topics: topics,

package/lib/lowcode/engine/provider/EventBusProvider.js

@@ -11,7 +11,7 @@ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/sli
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _ahooks = require("ahooks");
-var _lcid = _interopRequireDefault(require("../tools/lcid"));
+var _utils = require("@luck-design-biz/base/utils");
 var _helper = require("../tools/helper");
 var _excluded = ["topic"];
 var EventBus = exports.EventBus = /*#__PURE__*/(0, _react.createContext)(null);
@@ -95,7 +95,7 @@ var _default = exports.default = function _default(_ref) {
   });
   var $subscriber = (0, _ahooks.useMemoizedFn)(function (topic) {
     if (!subscriberPool.has(topic)) subscriberPool.set(topic, []);
-    var id = (0, _lcid.default)();
+    var id = (0, _utils.suid)();
     var _subscriber = Subscriber(id);
     subscriberPool.get(topic).push([id, _subscriber]);
     return _subscriber;

package/lib/lowcode/engine/tools/usePromiseState.js

@@ -0,0 +1,31 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+var _react = require("react");
+var _ahooks = require("ahooks");
+var usePromiseState = function usePromiseState(initialState) {
+  var _useSafeState = (0, _ahooks.useSafeState)(initialState),
+    _useSafeState2 = (0, _slicedToArray2.default)(_useSafeState, 2),
+    state = _useSafeState2[0],
+    setState = _useSafeState2[1];
+  var promiseRef = (0, _react.useRef)(null);
+  var setStatePromise = (0, _react.useCallback)(function (_state) {
+    return new Promise(function (resolve) {
+      promiseRef.current = resolve;
+      setState(_state);
+    });
+  }, []);
+  (0, _ahooks.useDeepCompareEffect)(function () {
+    if (promiseRef.current) {
+      promiseRef.current(state);
+      promiseRef.current = null;
+    }
+  }, [state]);
+  return [state, setStatePromise];
+};
+var _default = exports.default = usePromiseState;

package/lib/lowcode/painter/Design.js

@@ -9,61 +9,94 @@ exports.default = void 0;
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _react = _interopRequireWildcard(require("react"));
-var _ahooks = require("ahooks");
-var _antd = require("luck-design/antd");
+var _moment = _interopRequireDefault(require("moment"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _lodash = require("lodash");
+var _umi = require("umi");
+var _ahooks = require("ahooks");
+var _antd = require("luck-design/antd");
+var _utils = require("@luck-design-biz/base/utils");
 var _ContextProvider = require("../engine/provider/ContextProvider");
 var _Page = _interopRequireDefault(require("../view/Page"));
 var _dataProcess = require("../engine/tools/dataProcess");
-var _lcid = _interopRequireDefault(require("../engine/tools/lcid"));
 var _constants = require("../constants");
 var _design = _interopRequireDefault(require("./style/design.less"));
-var setRect = function setRect(page, node, cellNode) {
+var getOperatorStyle = function getOperatorStyle(page, cellNode) {
   var _page$getBoundingClie = page.getBoundingClientRect(),
     pageLeft = _page$getBoundingClie.left,
     pageTop = _page$getBoundingClie.top;
   var _cellNode$getBounding = cellNode.getBoundingClientRect(),
     cellNodeLeft = _cellNode$getBounding.left,
     cellNodeTop = _cellNode$getBounding.top;
-  node.style.left = "".concat(cellNodeLeft - pageLeft, "px");
-  node.style.top = "".concat(cellNodeTop - pageTop, "px");
-  node.style.width = "".concat(cellNode.offsetWidth, "px");
-  node.style.height = "".concat(cellNode.offsetHeight, "px");
+  return {
+    left: "".concat(cellNodeLeft - pageLeft, "px"),
+    top: "".concat(cellNodeTop - pageTop, "px"),
+    width: "".concat(cellNode.offsetWidth, "px"),
+    height: "".concat(cellNode.offsetHeight, "px")
+  };
 };
 var Design = function Design() {
+  var _selectorRef$current, _localeInfo$locale2;
   var context = (0, _ContextProvider.useLDContext)();
-  var detectorRef = (0, _react.useRef)(null);
   var selectorRef = (0, _react.useRef)(null);
   var simulatorRef = (0, _react.useRef)(null);
-  var hoverCellRef = (0, _react.useRef)(null);
-  var activeCellRef = (0, _react.useRef)(null);
-  var size = (0, _ahooks.useSize)(simulatorRef);
-  var scroll = (0, _ahooks.useScroll)(simulatorRef);
-  var _useState = (0, _react.useState)('pc'),
+  var _useSetState = (0, _ahooks.useSetState)({
+      selector: null,
+      detector: null
+    }),
+    _useSetState2 = (0, _slicedToArray2.default)(_useSetState, 2),
+    operatorId = _useSetState2[0],
+    setOperatorId = _useSetState2[1];
+  var _useState = (0, _react.useState)(null),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    activedTarget = _useState2[0],
-    setActivedTarget = _useState2[1];
+    acticeProps = _useState2[0],
+    setActiceProps = _useState2[1];
+  var _useState3 = (0, _react.useState)(null),
+    _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
+    langList = _useState4[0],
+    setLangList = _useState4[1];
+  var _useState5 = (0, _react.useState)(function () {
+      return (0, _umi.getLocale)();
+    }),
+    _useState6 = (0, _slicedToArray2.default)(_useState5, 2),
+    locale = _useState6[0],
+    setLocale = _useState6[1];
+  var _useState7 = (0, _react.useState)(function () {
+      return (0, _umi.getIntl)(locale, true);
+    }),
+    _useState8 = (0, _slicedToArray2.default)(_useState7, 2),
+    intl = _useState8[0],
+    setContainerIntl = _useState8[1];
+  var _useState9 = (0, _react.useState)('pc'),
+    _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+    activedTarget = _useState10[0],
+    setActivedTarget = _useState10[1];
   (0, _ahooks.useEventListener)('mousemove', function (event) {
     var elem = event.target;
     var targetCell = elem.closest(".".concat(_constants.CELL_CLASS_NAME));
-    if (targetCell && !targetCell.isEqualNode(hoverCellRef.current) && !targetCell.isEqualNode(activeCellRef.current)) {
-      var _id = targetCell.id;
-      hoverCellRef.current = targetCell;
+    var targetCellId = targetCell === null || targetCell === void 0 ? void 0 : targetCell.id;
+    if (targetCellId && targetCellId !== operatorId.detector && targetCellId !== operatorId.selector) {
+      setOperatorId({
+        detector: targetCellId
+      });
       context.$publisher(context.topics.COMPONENT_HOVER, {
-        id: _id,
+        id: targetCellId,
         cellNode: targetCell
       });
-    } else if (!targetCell || targetCell.isEqualNode(activeCellRef.current)) {
-      hoverCellRef.current = null;
+    } else if (!targetCell || targetCellId === operatorId.selector) {
+      setOperatorId({
+        detector: null
+      });
       context.$publisher(context.topics.COMPONENT_HOVER, null);
     }
   }, {
     target: simulatorRef
   });
   (0, _ahooks.useEventListener)('mouseleave', function () {
-    if (hoverCellRef.current) {
-      hoverCellRef.current = null;
+    if (operatorId.detector) {
+      setOperatorId({
+        detector: null
+      });
       context.$publisher(context.topics.COMPONENT_HOVER, null);
     }
   }, {
@@ -72,7 +105,8 @@ var Design = function Design() {
   (0, _ahooks.useEventListener)('click', function (event) {
     var elem = event.target;
     var targetCell = elem.closest(".".concat(_constants.CELL_CLASS_NAME));
-    if (!targetCell || targetCell.isEqualNode(activeCellRef.current)) return;
+    var targetCellId = targetCell === null || targetCell === void 0 ? void 0 : targetCell.id;
+    if (!targetCellId || targetCellId === operatorId.selector) return;
     context.$publisher(context.topics.COMPONENT_HOVER, null);
     context.$publisher(context.topics.COMPONENT_ACTIVE, {
       id: targetCell.id,
@@ -81,34 +115,30 @@ var Design = function Design() {
   }, {
     target: simulatorRef
   });
-  (0, _react.useEffect)(function () {
-    if (selectorRef.current && activeCellRef.current) setRect(simulatorRef.current, selectorRef.current, activeCellRef.current);
-    if (detectorRef.current && hoverCellRef.current) setRect(simulatorRef.current, detectorRef.current, hoverCellRef.current);
-  }, [size, scroll]);
   (0, _react.useEffect)(function () {
     var hcid = context.$subscriber(context.topics.COMPONENT_HOVER).on(function (payload) {
-      if (payload.id) {
-        detectorRef.current.style.display = 'block';
-        setRect(simulatorRef.current, detectorRef.current, payload.cellNode);
-      } else {
-        detectorRef.current.style.display = 'none';
-      }
+      if (payload.id) setOperatorId({
+        detector: payload.id
+      });else setOperatorId({
+        detector: null
+      });
     }).watch();
     var acid = context.$subscriber(context.topics.COMPONENT_ACTIVE).on(function (payload) {
       if (payload.id) {
-        activeCellRef.current = payload.cellNode;
-        hoverCellRef.current = null;
-        selectorRef.current.style.display = 'block';
-        setRect(simulatorRef.current, selectorRef.current, payload.cellNode);
+        setOperatorId({
+          selector: payload.id,
+          detector: null
+        });
+        setActiceProps(context.componentMap.get(payload.id).api.getLevelNodes());
       } else {
-        selectorRef.current.style.display = 'none';
+        setActiceProps(null);
       }
     }).watch();
     return function () {
       context.$unsubscriber(context.topics.COMPONENT_HOVER, hcid);
       context.$unsubscriber(context.topics.COMPONENT_ACTIVE, acid);
     };
-  }, [scroll]);
+  }, [context.pageData]);
   (0, _react.useEffect)(function () {
     var moid = context.$subscriber(context.topics.MODAL_OPEN).on(function () {
       simulatorRef.current.style['overflow-y'] = 'hidden';
@@ -116,31 +146,35 @@ var Design = function Design() {
     var mcid = context.$subscriber(context.topics.MODAL_CLOSE).on(function () {
       simulatorRef.current.style['overflow-y'] = 'auto';
     }).watch();
+    var laid = context.$subscriber(context.topics.LANG_SETTING_SELECT).on(function (_ref) {
+      var _langList = _ref.langList;
+      return setLangList(_langList);
+    }).watch();
     return function () {
       context.$unsubscriber(context.topics.MODAL_OPEN, moid);
       context.$unsubscriber(context.topics.MODAL_CLOSE, mcid);
+      context.$unsubscriber(context.topics.LANG_SETTING_SELECT, laid);
     };
   }, []);
   (0, _react.useEffect)(function () {
-    var csid = context.$subscriber(context.topics.COMPONENT_SETTING_CLICK).on(function (_ref) {
-      var data = _ref.data;
-      if (!activeCellRef.current) {
+    var csid = context.$subscriber(context.topics.COMPONENT_SETTING_CLICK).on(function (_ref2) {
+      var data = _ref2.data;
+      if (!operatorId.selector) {
         _antd.message.info('请在右侧画布选择节点');
         return;
       }
-      if (activeCellRef.current.getAttribute('name') !== 'box') {
+      if (context.componentMap.get(operatorId.selector).dom.getAttribute('name') !== 'box') {
         _antd.message.info('该节点不支持添加子节点');
         return;
       }
       var json = require("../engine/meta/".concat(data.component.toLowerCase(), ".props.default.json"));
-      var _id = "".concat(data.component.toLowerCase(), "_").concat((0, _lcid.default)());
+      var _id = "".concat(data.component.toLowerCase(), "_").concat((0, _utils.suid)());
       var cloneData = (0, _lodash.cloneDeep)(context.pageData);
-      (0, _dataProcess.add)(cloneData, activeCellRef.current.id, _id, json);
-      context._setPageData(cloneData);
-      setTimeout(function () {
+      (0, _dataProcess.add)(cloneData, operatorId.selector, _id, json);
+      context._setPageData(cloneData).then(function (newData) {
         context.$publisher(context.topics.COMPONENT_APPEND, {
           id: _id,
-          pageData: (0, _lodash.cloneDeep)(cloneData)
+          pageData: newData
         });
       });
     }).watch();
@@ -148,22 +182,68 @@ var Design = function Design() {
       return context.$unsubscriber(context.topics.COMPONENT_SETTING_CLICK, csid);
     };
   }, [context.pageData]);
+  var getDomById = (0, _ahooks.useMemoizedFn)(function (id) {
+    return context.componentMap.get(id).dom;
+  });
+  var handleLangChange = (0, _ahooks.useMemoizedFn)(function (locale) {
+    if (_moment.default !== null && _moment.default !== void 0 && _moment.default.locale) {
+      var _localeInfo$locale;
+      _moment.default.locale(((_localeInfo$locale = _umi.localeInfo[locale]) === null || _localeInfo$locale === void 0 ? void 0 : _localeInfo$locale.momentLocale) || 'en');
+    }
+    setLocale(locale);
+    setContainerIntl((0, _umi.getIntl)(locale));
+  });
+  var handleSelect = function handleSelect(_key) {
+    context.$publisher(context.topics.COMPONENT_ACTIVE, _key ? {
+      id: _key,
+      cellNode: getDomById(_key)
+    } : null);
+  };
+  var handleHover = function handleHover(_key) {
+    context.$publisher(context.topics.COMPONENT_HOVER, _key ? {
+      id: _key,
+      cellNode: getDomById(_key)
+    } : null);
+  };
+  var menu = (0, _ahooks.useCreation)(function () {
+    if ((acticeProps === null || acticeProps === void 0 ? void 0 : acticeProps.length) > 0) return /*#__PURE__*/_react.default.createElement("div", {
+      className: _design.default['next-overlay-wrapper'],
+      onMouseLeave: function onMouseLeave() {
+        return handleHover();
+      }
+    }, (0, _lodash.reverse)((0, _lodash.initial)(acticeProps)).map(function (m) {
+      return /*#__PURE__*/_react.default.createElement("div", {
+        key: m.id
+      }, /*#__PURE__*/_react.default.createElement("span", {
+        onClick: function onClick() {
+          return handleSelect(m.id);
+        },
+        onMouseOver: function onMouseOver() {
+          return handleHover(m.id);
+        }
+      }, m.name));
+    }));
+    return [];
+  }, [acticeProps]);
+  console.log('operatorId', operatorId);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: _design.default['lc-painter-design']
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: _design.default['lc-painter-design-toolbar']
   }, /*#__PURE__*/_react.default.createElement(_antd.Select, {
     size: "small",
-    defaultValue: "chinese",
+    value: langList ? locale : undefined,
     className: _design.default['i18n-selecter'],
     style: {
       fontSize: 12
-    }
-  }, /*#__PURE__*/_react.default.createElement(_antd.Select.Option, {
-    value: "chinese"
-  }, "\u7B80\u4F53\u4E2D\u6587"), /*#__PURE__*/_react.default.createElement(_antd.Select.Option, {
-    value: "endlish"
-  }, "English")), /*#__PURE__*/_react.default.createElement("span", {
+    },
+    onSelect: handleLangChange
+  }, langList === null || langList === void 0 ? void 0 : langList.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement(_antd.Select.Option, {
+      key: item.field,
+      value: item.field
+    }, item.title);
+  })), /*#__PURE__*/_react.default.createElement("span", {
     className: (0, _classnames.default)(_design.default['toolbar-item'], (0, _defineProperty2.default)({}, _design.default.actived, activedTarget === 'pc')),
     onClick: function onClick() {
       return setActivedTarget('pc');
@@ -188,31 +268,61 @@ var Design = function Design() {
     onClick: function onClick() {
       context.$publisher(context.topics.COMPONENT_ACTIVE, {
         id: _constants.CELL_KEY.PAGE_ROOT,
-        cellNode: context.componentMap.get(_constants.CELL_KEY.PAGE_ROOT).dom
+        cellNode: getDomById(_constants.CELL_KEY.PAGE_ROOT)
       });
     }
   }, "\u9875\u9762\u5C5E\u6027"), /*#__PURE__*/_react.default.createElement(_antd.Divider, {
     type: "vertical"
+  }), /*#__PURE__*/_react.default.createElement(_antd.Button, {
+    size: "small",
+    style: {
+      fontSize: 12,
+      margin: '0 2px'
+    }
+  }, "\u9884\u89C8"), /*#__PURE__*/_react.default.createElement(_antd.Divider, {
+    type: "vertical"
   }), /*#__PURE__*/_react.default.createElement(_antd.Button, {
     size: "small",
     type: "primary",
     style: {
-      fontSize: 12
+      fontSize: 12,
+      margin: '0 0 0 2px'
     }
   }, "\u4FDD\u5B58")), /*#__PURE__*/_react.default.createElement("div", {
     className: _design.default['lc-painter-design-workspace']
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, operatorId.detector && /*#__PURE__*/_react.default.createElement("div", {
     id: "lc-detector",
-    ref: detectorRef,
-    className: _design.default['lc-painter-design-detector']
-  }), /*#__PURE__*/_react.default.createElement("div", {
+    className: _design.default['lc-painter-design-detector'],
+    style: getOperatorStyle(simulatorRef.current, getDomById(operatorId.detector))
+  }), operatorId.selector && /*#__PURE__*/_react.default.createElement("div", {
     id: "lc-selector",
     ref: selectorRef,
-    className: _design.default['lc-painter-design-selector']
-  }), /*#__PURE__*/_react.default.createElement(_Page.default, {
+    className: _design.default['lc-painter-design-selector'],
+    style: getOperatorStyle(simulatorRef.current, getDomById(operatorId.selector))
+  }, acticeProps && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: _design.default['lc-borders-actions'],
+    style: (0, _lodash.last)(acticeProps).id === "page_root" ? {
+      top: 0
+    } : ((_selectorRef$current = selectorRef.current) === null || _selectorRef$current === void 0 ? void 0 : _selectorRef$current.offsetTop) < 23 ? {
+      bottom: '-23px'
+    } : {
+      top: '-23px'
+    }
+  }, /*#__PURE__*/_react.default.createElement(_antd.Dropdown, {
+    overlay: menu,
+    placement: "bottomLeft"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "instance-node-selector"
+  }, (0, _lodash.last)(acticeProps).name)), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_antd.Icon, {
+    type: "delete"
+  }))))), /*#__PURE__*/_react.default.createElement(_antd.ConfigProvider, {
+    locale: ((_localeInfo$locale2 = _umi.localeInfo[locale]) === null || _localeInfo$locale2 === void 0 ? void 0 : _localeInfo$locale2.antd) || {}
+  }, /*#__PURE__*/_react.default.createElement(_umi.RawIntlProvider, {
+    value: intl
+  }, /*#__PURE__*/_react.default.createElement(_Page.default, {
     ref: simulatorRef,
     pageCode: "mk2i87qb",
     className: _design.default['lc-painter-design-simulator']
-  })));
+  })))));
 };
 var _default = exports.default = Design;

package/lib/lowcode/painter/I18n.js

@@ -18,14 +18,14 @@ var _luckDesign = require("luck-design");
 var _lodash = require("lodash");
 var _antd = require("luck-design/antd");
 var _utils = require("@luck-design-biz/base/utils");
-var _lcid = _interopRequireDefault(require("../engine/tools/lcid"));
+var _ContextProvider = require("../engine/provider/ContextProvider");
 var _I18n = require("./services/I18n");
 var _getDvaApp;
 var Search = _antd.Input.Search;
 var _getDvaApp$_store = (_getDvaApp = (0, _umi.getDvaApp)()) === null || _getDvaApp === void 0 ? void 0 : _getDvaApp._store,
   dispatch = _getDvaApp$_store.dispatch;
 var getLangKey = function getLangKey() {
-  return "app.lowcode.".concat((0, _lcid.default)());
+  return "app.lowcode.".concat((0, _utils.suid)());
 };
 var formatDataFunc = function formatDataFunc(data) {
   return (0, _objectSpread3.default)((0, _objectSpread3.default)({}, data), (0, _lodash.reduce)(data.languages, function (ret, value, key) {
@@ -34,6 +34,7 @@ var formatDataFunc = function formatDataFunc(data) {
   }, {}));
 };
 var I18n = function I18n() {
+  var context = (0, _ContextProvider.useLDContext)();
   var _useState = (0, _react.useState)([]),
     _useState2 = (0, _slicedToArray2.default)(_useState, 2),
     langList = _useState2[0],
@@ -67,8 +68,11 @@ var I18n = function I18n() {
         case 2:
           _langList = _context.sent;
           setLangList(_langList);
+          context.$publisher(context.topics.LANG_SETTING_SELECT, {
+            langList: _langList
+          });
           doQuery();
-        case 5:
+        case 6:
         case "end":
           return _context.stop();
       }

package/lib/lowcode/painter/Panel.js

@@ -56,7 +56,12 @@ var Panel = function Panel() {
     console.log('handleChange', activeNode, field, value);
     var cloneData = (0, _lodash.cloneDeep)(context.pageData);
     (0, _dataProcess.modifyById)(cloneData, activeNode.node.id, (0, _objectSpread3.default)((0, _objectSpread3.default)({}, activeNode.node), {}, (0, _defineProperty2.default)({}, field, value)));
-    context._setPageData(cloneData);
+    context._setPageData(cloneData).then(function (newData) {
+      context.$publisher(context.topics.COMPONENT_MODIFY, {
+        id: activeNode.node.id,
+        pageData: (0, _lodash.cloneDeep)(newData)
+      });
+    });
     setFalse();
   });
   var renderPanelItems = (0, _ahooks.useMemoizedFn)(function (items) {
@@ -67,7 +72,7 @@ var Panel = function Panel() {
         label: item.name
       }, Comp && /*#__PURE__*/_react.default.createElement(Comp, {
         field: item.key,
-        value: activeNode.node[item.key],
+        defaultValue: activeNode.node[item.key],
         next: function next() {
           if (!item.next) return;
           nextRef.current = {

package/lib/lowcode/painter/components/RuleInput.js

@@ -7,11 +7,13 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 var _createForOfIteratorHelper2 = _interopRequireDefault(require("@babel/runtime/helpers/createForOfIteratorHelper"));
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
 var _react = _interopRequireWildcard(require("react"));
 var _antd = require("luck-design/antd");
+var _classnames = _interopRequireDefault(require("classnames"));
 var _ruleInput = _interopRequireDefault(require("../style/rule-input.less"));
 var _excluded = ["onValueChange", "rules", "value"];
 /**
@@ -92,16 +94,14 @@ var _default = exports.default = /*#__PURE__*/(0, _react.forwardRef)(function (_
       onValueChange(e, value);
     } else {
       setErr(error);
-      console.log('err', error);
+      console.error(error);
     }
   };
-  var className = _ruleInput.default['lc-painter-components-ruleinput'];
-  if (err) className += ' ' + _ruleInput.default['err'];
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_antd.Tooltip, {
     title: err,
     visible: err
   }, /*#__PURE__*/_react.default.createElement(_antd.Input, (0, _extends2.default)({
-    className: className,
+    className: (0, _classnames.default)(_ruleInput.default['lc-painter-components-ruleinput'], (0, _defineProperty2.default)({}, _ruleInput.default.err, !!err)),
     size: "small",
     value: inputValue // 绑定输入值
     ,