@luck-design-biz/luckda 0.0.25-6 → 0.0.25-8

package/es/lowcode/painter/panel-section/StylePanel/index.js

@@ -1,29 +1,35 @@
 import React from 'react';
+import { useGet } from "../../../engine/provider/ContextProvider";
 import { StyleProvider } from "./StyleContext";
 import MainPanel from "./MainPanel";
 
 /**
  * StylePanel 组件是一个 React 组件，用于提供样式设置主面板。
  * 该组件通过 StyleProvider 将样式变更和当前样式值传递给其子组件。
- * 
+ *
  * @component
  * @example
  * const handleChange = (newValue) => console.log(newValue);
  * const initialValue = "dark";
  * <StylePanel onChange={handleChange} value={initialValue} />
- * 
+ *
  * @param {Object} props - 组件的属性。
  * @param {Function} props.onChange - 当样式变更时调用的函数，该函数接受新的样式值作为参数。
  * @param {any} props.value - 样式字符串
- * 
+ *
  * @returns {ReactElement} 返回一个 React 元素，其中包含了 StyleProvider 和 MainPanel 组件。
  */
 var StylePanel = function StylePanel(_ref) {
   var onChange = _ref.onChange,
+    nodeId = _ref.nodeId,
     value = _ref.value;
+  var _value = useGet({
+    id: nodeId,
+    path: 'props.css'
+  });
   return /*#__PURE__*/React.createElement(StyleProvider, {
     onChange: onChange,
-    value: value
+    value: value || _value
   }, /*#__PURE__*/React.createElement(MainPanel, null));
 };
 export default StylePanel;

package/es/lowcode/painter/panel-section/TreeRootEditor.js

@@ -55,8 +55,8 @@ var TreeRootEditor = function TreeRootEditor(_ref) {
     }
   }))), /*#__PURE__*/React.createElement(Tooltip, {
     title: formatMessage({
-      id: 'luckda.lowcode.painter.edit',
-      label: '编辑'
+      id: 'luckda.lowcode.painter.bind',
+      label: '绑定动作'
     })
   }, /*#__PURE__*/React.createElement(Icon, {
     type: "paper-clip",

package/es/lowcode/painter/style/action-bind-modal.less

@@ -1,7 +1,7 @@
 .lc-painter-panel-action-bind-modal {
   &-body {
     width: 100%;
-    height: 460px;
+    height: 660px;
     display: flex;
     font-size: 12px;
 
@@ -10,7 +10,7 @@
 
       .selector-box {
         width: 100%;
-        height: 420px;
+        height: 620px;
         border: 1px solid #e8e8e8;
         border-radius: 6px;
         display: flex;
@@ -68,7 +68,7 @@
 
       .code-box {
         width: 100%;
-        height: 420px;
+        height: 620px;
         border: 1px solid #e8e8e8;
         border-radius: 6px;
         overflow: hidden;

package/es/lowcode/painter/style/design.less

@@ -123,7 +123,7 @@
         .selector-item();
       }
 
-      :local {
+      :global {
         .instance-node-selector {
           padding: 0 6px;
           margin-right: 3px;

package/es/lowcode/painter/style/page-layout-display.less

@@ -0,0 +1,28 @@
+.lc-painter-panel-section-pagelayoutdisplay {
+  .display-type-box {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    grid-column-gap: 4px;
+
+    .display-type-item {
+      border: 1px solid rgba(0, 0, 0, 0.2);
+      border-radius: 4px;
+      padding: 3px;
+      height: 42px;
+      display: flex;
+
+      &:hover {
+        cursor: pointer;
+        border-color: var(--ant-primary-color);
+      }
+
+      &.active {
+        border-color: var(--ant-primary-color);
+      }
+
+      .item-block {
+        background-color: rgb(192, 194, 196);
+      }
+    }
+  }
+}

package/es/lowcode/painter/style/panel-item.less

@@ -32,7 +32,7 @@
     }
 
     /* 使.item-component-box的直接子元素铺满 */
-    .item-component > *:not(.ant-switch) {
+    .item-component > *:not(:global(.ant-switch)) {
       flex-grow: 1;
     }
     .panel-pointer {

package/es/lowcode/painter/style/split-display.less

@@ -11,15 +11,6 @@
       height: 42px;
       display: flex;
 
-      &:hover {
-        cursor: pointer;
-        border-color: var(--ant-primary-color);
-      }
-
-      &.active {
-        border-color: var(--ant-primary-color);
-      }
-
       .item-block {
         background-color: rgb(192, 194, 196);
       }

package/es/lowcode/preview/index.js

@@ -7,7 +7,8 @@ import Page from "../view/Page";
 import { RUNTIME } from "../constants/index";
 var Preview = function Preview(_ref) {
   var code = _ref.code,
-    userId = _ref.userId;
+    userId = _ref.userId,
+    debug = _ref.debug;
   var _useState = useState(userId),
     _useState2 = _slicedToArray(_useState, 2),
     currentKey = _useState2[0],
@@ -21,7 +22,8 @@ var Preview = function Preview(_ref) {
   return code && currentKey ? /*#__PURE__*/React.createElement(EventBusProvider, {
     runtime: RUNTIME.PREVIEW
   }, /*#__PURE__*/React.createElement(ContextProvider, {
-    code: code
+    code: code,
+    debug: debug
   }, /*#__PURE__*/React.createElement(Page, null))) : null;
 };
 export default Preview;

package/es/lowcode/view/Canvas.js

@@ -3,7 +3,7 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import React from 'react';
 import styled from 'styled-components';
 import classNames from 'classnames';
-import { usePageData } from "../engine/provider/ContextProvider";
+import { useGet } from "../engine/provider/ContextProvider";
 import PageHeader from "./lc-components/PageHeader";
 import PageContent from "./lc-components/PageContent";
 import PageFooter from "./lc-components/PageFooter";
@@ -18,12 +18,11 @@ var PageRoot = styled.div.withConfig({
 });
 var Canvas = function Canvas(_ref) {
   var className = _ref.className;
-  var _usePageData = usePageData(['props.css', 'props.enableHeader', 'props.enableFooter']),
-    _usePageData2 = _slicedToArray(_usePageData, 1),
-    _usePageData2$ = _slicedToArray(_usePageData2[0], 3),
-    pagerootCss = _usePageData2$[0],
-    enableHeader = _usePageData2$[1],
-    enableFooter = _usePageData2$[2];
+  var _useGet = useGet(['props.css', 'props.enableHeader', 'props.enableFooter']),
+    _useGet2 = _slicedToArray(_useGet, 3),
+    pagerootCss = _useGet2[0],
+    enableHeader = _useGet2[1],
+    enableFooter = _useGet2[2];
   return /*#__PURE__*/React.createElement(PageRoot, {
     id: "page-canvas",
     className: classNames(styles['lc-view-canvas'], _defineProperty({}, className, !!className)),

package/es/lowcode/view/Page.js

@@ -23,8 +23,7 @@ var LCPage = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   var _ref = useRef(null);
   var _rootRef = ref || _ref;
   var _useRemoteSource = useRemoteSource(),
-    loading = _useRemoteSource.loading,
-    pageData = _useRemoteSource.pageData;
+    loading = _useRemoteSource.loading;
   var getTargetDom = useMemoizedFn(function () {
     return _rootRef.current;
   });
@@ -34,6 +33,6 @@ var LCPage = /*#__PURE__*/forwardRef(function (_ref2, ref) {
   }, /*#__PURE__*/React.createElement("div", _extends({
     ref: _rootRef,
     className: classNames(styles['lc-view-page'], _defineProperty(_defineProperty({}, styles.isloading, loading), className, !!className))
-  }, props), isNil(pageData) ? null : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Canvas, null), loading ? /*#__PURE__*/React.createElement(Masker, null, /*#__PURE__*/React.createElement(Loading, null)) : null)));
+  }, props), /*#__PURE__*/React.createElement(Canvas, null), loading ? /*#__PURE__*/React.createElement(Masker, null, /*#__PURE__*/React.createElement(Loading, null)) : null));
 });
 export default LCPage;

package/es/lowcode/view/lc-components/Box/FunctionDesign.js

@@ -1,7 +1,7 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["children"];
+var _excluded = ["children", "className"];
 import React from 'react';
 import { useCreation } from 'ahooks';
 import classNames from 'classnames';
@@ -9,12 +9,13 @@ import Index from "./index";
 import styles from "./index.less";
 var FunctionDesign = function FunctionDesign(_ref) {
   var children = _ref.children,
+    className = _ref.className,
     props = _objectWithoutProperties(_ref, _excluded);
   var isEmpty = useCreation(function () {
     return !children || React.Children.count(children) === 0;
   }, [children]);
   return /*#__PURE__*/React.createElement(Index, _extends({
-    className: classNames(styles['lc-component-box-design'], _defineProperty({}, styles.placeholder, isEmpty))
+    className: classNames(styles['lc-component-box-design'], _defineProperty(_defineProperty({}, styles.placeholder, isEmpty), "className", !!className))
   }, props), isEmpty ? '点击组件库的组件或拖拽组件到这里' : children);
 };
 export default FunctionDesign;

package/es/lowcode/view/lc-components/Box/meta.json

@@ -21,19 +21,19 @@
         "key": "onMount",
         "name": "组件首次渲染时",
         "desc": "在组件首次渲染时，执行方法",
-        "func": "(params)=>{\n\t\n}"
+        "func": "function onMount(params) {\n\t\n}"
       },
       {
         "key": "onUnmount",
         "name": "组件卸载时",
         "desc": "在组件卸载时，执行方法。",
-        "func": "(params)=>{\n\t\n}"
+        "func": "function onUnmount(params) {\n\t\n}"
       },
       {
         "key": "onClick",
         "name": "点击事件",
         "desc": "点击文本时，执行方法",
-        "func": "(e)=>{\n\t\n}"
+        "func": "function onClick(e) {\n\t\n}"
       }
     ]
   }

package/es/lowcode/view/lc-components/Button/index.js

@@ -33,14 +33,10 @@ var LCButton = function LCButton(_ref) {
   var ref = useRef();
   var ctx = useContext();
   useMount(function () {
-    ctx.doAction(advance.events.onMount, {
-      instance: ref.current
-    });
+    ctx.doAction(advance.events.onMount);
   });
   useUnmount(function () {
-    ctx.doAction(advance.events.onUnmount, {
-      instance: ref.current
-    });
+    ctx.doAction(advance.events.onUnmount);
   });
   var handleClick = useMemoizedFn(function (e) {
     if (onClick) {

package/es/lowcode/view/lc-components/Button/meta.json

@@ -108,19 +108,19 @@
         "key": "onMount",
         "name": "组件首次渲染时",
         "desc": "在组件首次渲染时，执行方法",
-        "func": "(instance)=>{\n\t\n}"
+        "func": "function onMount() {\n\t\n}"
       },
       {
         "key": "onUnmount",
         "name": "组件卸载时",
         "desc": "在组件卸载时，执行方法。",
-        "func": "(instance)=>{\n\t\n}"
+        "func": "function onUnmount() {\n\t\n}"
       },
       {
         "key": "onClick",
         "name": "点击事件",
         "desc": "点击文本时，执行方法",
-        "func": "(e)=>{\n\t\n}"
+        "func": "function onClick(e) {\n\t\n}"
       }
     ]
   }

package/es/lowcode/view/lc-components/Dialog/FunctionDesign.js

@@ -1,15 +1,13 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
 var _excluded = ["id", "children", "className"];
 import React from 'react';
 import { useCreation } from 'ahooks';
 import Index from "./index";
 import { suid } from '@luck-design-biz/base/utils';
-import { useContext, usePageData } from "../../../engine/provider/ContextProvider";
-import { add } from "../../../engine/tools/dataProcess";
+import { useContext, addNode } from "../../../engine/provider/ContextProvider";
 import classNames from 'classnames';
 import styles from "./index.less";
 import boxDefaultMeta from "../../../engine/meta/box.props.default.json";
@@ -19,19 +17,14 @@ var FunctionDesign = function FunctionDesign(_ref) {
     className = _ref.className,
     props = _objectWithoutProperties(_ref, _excluded);
   var ctx = useContext();
-  var _usePageData = usePageData(),
-    _usePageData2 = _slicedToArray(_usePageData, 2),
-    setPageData = _usePageData2[1].setPageData;
   useCreation(function () {
     if (children !== null && children !== void 0 && children.length) return;
     ctx.$subscriber(ctx.topics.COMPONENT_APPEND).once(function (_ref2) {
-      var compId = _ref2.id,
-        pageData = _ref2.pageData;
+      var compId = _ref2.id;
       if (compId !== id) return;
-      add(pageData, id, "box_".concat(suid()), _objectSpread(_objectSpread({}, boxDefaultMeta), {}, {
+      addNode(id, "box_".concat(suid()), _objectSpread(_objectSpread({}, boxDefaultMeta), {}, {
         buildIn: true
       }));
-      setPageData(pageData);
     }).watch();
   }, []);
   return /*#__PURE__*/React.createElement(Index, _extends({

package/es/lowcode/view/lc-components/Dialog/index.js

@@ -1,52 +1,147 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["id", "children", "getContainer", "wrapClassName", "maskStyle"];
-import React, { useRef, useImperativeHandle } from 'react';
-import { useMemoizedFn, useBoolean } from 'ahooks';
-import { Modal } from 'luck-design/antd';
+import React, { useRef, useEffect, useImperativeHandle } from 'react';
+import { useMemoizedFn, useUpdateEffect, useCreation } from 'ahooks';
+import { Modal, Button } from 'luck-design/antd';
 import classNames from 'classnames';
+import styled from 'styled-components';
+import { LDActions } from "../../../../index";
+import { useContext } from "../../../engine/provider/ContextProvider";
+import usePromiseState from "../../../engine/tools/usePromiseState";
 import Wrapper from "../Wrapper";
 import styles from "./index.less";
+var Footer = styled.div.withConfig({
+  displayName: "Footer",
+  componentId: "luckda-6530__sc-1aeozvd-0"
+})(["width:100%;display:flex;justify-content:flex-end;"]);
 var LCDialog = function LCDialog(_ref) {
   var id = _ref.id,
     children = _ref.children,
+    title = _ref.title,
+    width = _ref.width,
+    height = _ref.height,
     getContainer = _ref.getContainer,
     wrapClassName = _ref.wrapClassName,
     maskStyle = _ref.maskStyle,
-    props = _objectWithoutProperties(_ref, _excluded);
+    defaultOpen = _ref.defaultOpen,
+    mask = _ref.mask,
+    okText = _ref.okText,
+    cancelText = _ref.cancelText,
+    footer = _ref.footer,
+    btnGroup = _ref.btnGroup,
+    advance = _ref.advance;
+  var ctx = useContext();
   var apiRef = useRef();
   var domRef = useRef();
-  var _useBoolean = useBoolean(false),
-    _useBoolean2 = _slicedToArray(_useBoolean, 2),
-    open = _useBoolean2[0],
-    _useBoolean2$ = _useBoolean2[1],
-    setTrue = _useBoolean2$.setTrue,
-    setFalse = _useBoolean2$.setFalse,
-    toggle = _useBoolean2$.toggle;
+  var _usePromiseState = usePromiseState(defaultOpen),
+    _usePromiseState2 = _slicedToArray(_usePromiseState, 2),
+    open = _usePromiseState2[0],
+    setOpen = _usePromiseState2[1];
+  var _usePromiseState3 = usePromiseState(title),
+    _usePromiseState4 = _slicedToArray(_usePromiseState3, 2),
+    _title = _usePromiseState4[0],
+    _setTitle = _usePromiseState4[1];
+  useEffect(function () {
+    ctx.doAction(advance.events.onMount);
+    return function () {
+      _setTitle(title);
+      ctx.doAction(advance.events.onUnmount);
+    };
+  }, []);
+  useUpdateEffect(function () {
+    if (open) {
+      ctx.doAction(advance.events.onOpen);
+    } else {
+      ctx.doAction(advance.events.onClose);
+    }
+  }, [open]);
+  var handleOk = useMemoizedFn(function () {
+    ctx.doAction(advance.events.onOk);
+  });
+  var _footer = useCreation(function () {
+    var _btnGroup$todoList;
+    if (!footer) return {
+      footer: null
+    };
+    if (!(btnGroup !== null && btnGroup !== void 0 && (_btnGroup$todoList = btnGroup.todoList) !== null && _btnGroup$todoList !== void 0 && _btnGroup$todoList.length)) return {};
+    return {
+      footer: /*#__PURE__*/React.createElement(Footer, null, /*#__PURE__*/React.createElement(LDActions, _extends({}, btnGroup, {
+        doAction: function doAction(action) {
+          return ctx.doAction(action);
+        }
+      })), /*#__PURE__*/React.createElement(Button, {
+        onClick: function onClick() {
+          return setOpen(false);
+        },
+        style: {
+          marginLeft: 8
+        }
+      }, cancelText), /*#__PURE__*/React.createElement(Button, {
+        type: "primary",
+        onClick: handleOk
+      }, okText))
+    };
+  }, [footer, btnGroup]);
   var getTargetDom = useMemoizedFn(function () {
     var _domRef$current;
     return (_domRef$current = domRef.current) === null || _domRef$current === void 0 ? void 0 : _domRef$current.closest('.ant-modal-content');
   });
   useImperativeHandle(apiRef, function () {
     return {
+      /**
+       * 弹窗打开状态
+       * @property
+       */
       open: open,
-      doOpen: setTrue,
-      doClose: setFalse,
-      toggle: toggle
+      /**
+       * 打开弹窗
+       * @method
+       */
+      doOpen: function doOpen() {
+        return setOpen(true);
+      },
+      /**
+       * 关闭弹窗
+       * @method
+       */
+      doClose: function doClose() {
+        return setOpen(false);
+      },
+      /**
+       * 设置弹窗标题
+       * @method
+       * @param {stirng} title -标题
+       */
+      setTitle: function setTitle(_title) {
+        return _setTitle(_title);
+      }
     };
-  });
+  }, []);
   return /*#__PURE__*/React.createElement(Wrapper, {
     id: id,
     displayName: "Dialog",
     getTargetDom: getTargetDom,
     api: apiRef
-  }, /*#__PURE__*/React.createElement(Modal, {
+  }, /*#__PURE__*/React.createElement(Modal, _extends({
+    title: _title,
     visible: open,
     getContainer: getContainer,
+    width: width,
+    mask: mask,
     maskStyle: maskStyle,
+    bodyStyle: {
+      height: height,
+      overflowY: 'auto',
+      marginTop: 0
+    },
     wrapClassName: classNames(styles['lc-component-dialog-wrapper'], _defineProperty({}, wrapClassName, !!wrapClassName))
-  }, /*#__PURE__*/React.createElement("div", {
+  }, _footer, {
+    onOk: handleOk,
+    onCancel: function onCancel() {
+      return setOpen(false);
+    }
+  }), /*#__PURE__*/React.createElement("div", {
     style: {
       height: 0,
       width: 0,