@luck-design-biz/luckda 1.0.0-alpha → 1.0.1-10

package/lib/lowcode/view/lc-components/PageLayout/meta.json

@@ -1,59 +1,59 @@
-{
-  "component": "PageLayout",
-  "name": "页面布局容器",
-  "icon": "icon-pagelayout",
-  "group": "container",
-  "groupName": "布局",
-  "desc": "页面布局容器一般用于构建页面时根节点的基础布局，分为左右布局、左上下布局以及左中右布局。",
-  "order": 1,
-  "props": [
-    {
-      "key": "id",
-      "name": "唯一标识",
-      "type": "string",
-      "disabled": true
-    },
-    {
-      "key": "width",
-      "name": "宽度",
-      "type": "_WidthHeight",
-      "default": "100%"
-    },
-    {
-      "key": "height",
-      "name": "高度",
-      "type": "_WidthHeight",
-      "default": "100%"
-    },
-    {
-      "key": "displaySetting",
-      "name": "展现形式",
-      "type": "group",
-      "props": [
-        {
-          "key": "display",
-          "name": "#展现形式",
-          "type": "_PageLayoutDisplay",
-          "default": "lr"
-        }
-      ]
-    }
-  ],
-  "css": "width: 100%; height: 100%; background-color: transparent",
-  "advance": {
-    "events": [
-      {
-        "key": "onMount",
-        "name": "组件首次渲染时",
-        "desc": "在组件首次渲染时，执行方法",
-        "func": "function onMount() {\n\t\n}"
-      },
-      {
-        "key": "onUnmount",
-        "name": "组件卸载时",
-        "desc": "在组件卸载时，执行方法。",
-        "func": "function onUnmount() {\n\t\n}"
-      }
-    ]
-  }
-}
+{
+  "component": "PageLayout",
+  "name": "页面布局容器",
+  "icon": "icon-pagelayout",
+  "group": "container",
+  "groupName": "布局",
+  "desc": "页面布局容器一般用于构建页面时根节点的基础布局，分为左右布局、左上下布局以及左中右布局。",
+  "order": 1,
+  "props": [
+    {
+      "key": "id",
+      "name": "唯一标识",
+      "type": "string",
+      "disabled": true
+    },
+    {
+      "key": "width",
+      "name": "宽度",
+      "type": "_WidthHeight",
+      "default": "100%"
+    },
+    {
+      "key": "height",
+      "name": "高度",
+      "type": "_WidthHeight",
+      "default": "100%"
+    },
+    {
+      "key": "displaySetting",
+      "name": "展现形式",
+      "type": "group",
+      "props": [
+        {
+          "key": "display",
+          "name": "#展现形式",
+          "type": "_PageLayoutDisplay",
+          "default": "lr"
+        }
+      ]
+    }
+  ],
+  "css": "width: 100%; height: 100%; background-color: transparent;",
+  "advance": {
+    "events": [
+      {
+        "key": "onMount",
+        "name": "组件首次渲染时",
+        "desc": "在组件首次渲染时，执行方法",
+        "func": "function onMount() {\n\t\n}"
+      },
+      {
+        "key": "onUnmount",
+        "name": "组件卸载时",
+        "desc": "在组件卸载时，执行方法。",
+        "func": "function onUnmount() {\n\t\n}"
+      }
+    ]
+  }
+}

package/lib/lowcode/view/lc-components/Section/index.js

@@ -98,13 +98,9 @@ var LCSection = function LCSection(_ref2) {
     _collapseProps = _useCreation._collapseProps,
     _panelProps = _useCreation._panelProps;
   (0, _react.useEffect)(function () {
-    ctx.doAction(advance.events.onMount, {
-      instance: ref.current
-    });
+    ctx.doAction(advance.events.onMount);
     return function () {
-      ctx.doAction(advance.events.onUnmount, {
-        instance: ref.current
-      });
+      ctx.doAction(advance.events.onUnmount);
     };
   }, []);
   var getTargetDom = (0, _ahooks.useMemoizedFn)(function () {

package/lib/lowcode/view/lc-components/Section/index.less

@@ -1,7 +1,7 @@
-.lc-component-Section.simple-theme {
-  :global {
-    .ant-collapse-item {
-      border-bottom: none !important;
-    }
-  }
-}
+.lc-component-Section.simple-theme {
+  :global {
+    .ant-collapse-item {
+      border-bottom: none !important;
+    }
+  }
+}

package/lib/lowcode/view/lc-components/Section/meta.json

@@ -1,107 +1,108 @@
-{
-  "component": "Section",
-  "name": "分组",
-  "icon": "icon-section",
-  "group": "container",
-  "groupName": "布局",
-  "desc": "分组组件用于将相关组件或内容进行分组和组织。使用户能够轻松创建具有分组效果的界面，并根据需要进行定制。s",
-  "order": 1,
-  "props": [
-    {
-      "key": "id",
-      "name": "唯一标识",
-      "type": "string",
-      "disabled": true
-    },
-    {
-      "key": "collapse",
-      "name": "折叠",
-      "type": "switch",
-      "default": true
-    },
-    {
-      "key": "simple",
-      "name": "简洁风格",
-      "type": "switch",
-      "default": false
-    },
-    {
-      "key": "padding",
-      "name": "内边距",
-      "type": "switch",
-      "default": true,
-      "repositioning": true
-    },
-    {
-      "key": "destroyInactivePanel",
-      "name": "隐藏销毁",
-      "desc": "面板被折叠隐藏时销毁面板中的组件",
-      "type": "switch",
-      "default": false
-    },
-    {
-      "key": "title",
-      "name": "分组标题",
-      "type": "_I18nInput",
-      "default": "分组"
-    },
-    {
-      "key": "iconFont",
-      "name": "图标",
-      "type": "_Icon",
-      "next": {
-        "name": "选择图标",
-        "autoClose": true,
-        "props": [
-          {
-            "key": "iconFont",
-            "name": "#图标选择器",
-            "type": "_IconSelector"
-          }
-        ]
-      }
-    },
-    {
-      "key": "tooltip",
-      "name": "用户提示",
-      "type": "_I18nInput"
-    },
-    {
-      "key": "subtitle",
-      "name": "副标题插槽",
-      "desc": "分组副标题的插槽内容",
-      "type": "_JSEditor",
-      "defaultCode": "function Component() { \n return <span>subtitle</span>; \n}",
-      "mustConfirm": true,
-      "wrapper": "collapse",
-      "wrapperProps": { "suppressIcon": true }
-    },
-    {
-      "key": "extra",
-      "name": "扩展区域插槽",
-      "desc": "分组扩展区域的插槽内容",
-      "type": "_JSEditor",
-      "defaultCode": "function Component() { \n return <div>extra</div>; \n}",
-      "mustConfirm": true,
-      "wrapper": "collapse",
-      "wrapperProps": { "suppressIcon": true }
-    }
-  ],
-  "css": "width: 100%;",
-  "advance": {
-    "events": [
-      {
-        "key": "onMount",
-        "name": "组件首次渲染时",
-        "desc": "在组件首次渲染时，执行方法",
-        "func": "function onMount(){\n\t\n}"
-      },
-      {
-        "key": "onUnmount",
-        "name": "组件卸载时",
-        "desc": "在组件卸载时，执行方法。",
-        "func": "function onUnmount()=>{\n\t\n}"
-      }
-    ]
-  }
-}
+{
+  "component": "Section",
+  "name": "分组",
+  "icon": "icon-section",
+  "group": "container",
+  "groupName": "布局",
+  "desc": "分组组件用于将相关组件或内容进行分组和组织。使用户能够轻松创建具有分组效果的界面，并根据需要进行定制。s",
+  "order": 1,
+  "props": [
+    {
+      "key": "id",
+      "name": "唯一标识",
+      "type": "string",
+      "disabled": true
+    },
+    {
+      "key": "collapse",
+      "name": "折叠",
+      "type": "switch",
+      "default": true
+    },
+    {
+      "key": "simple",
+      "name": "简洁风格",
+      "type": "switch",
+      "default": false
+    },
+    {
+      "key": "padding",
+      "name": "内边距",
+      "type": "switch",
+      "default": true,
+      "repositioning": true
+    },
+    {
+      "key": "destroyInactivePanel",
+      "name": "隐藏销毁",
+      "desc": "面板被折叠隐藏时销毁面板中的组件",
+      "type": "switch",
+      "default": false
+    },
+    {
+      "key": "title",
+      "name": "分组标题",
+      "type": "_I18nInput",
+      "default": "分组"
+    },
+    {
+      "key": "iconFont",
+      "name": "图标",
+      "type": "_Icon",
+      "next": {
+        "name": "选择图标",
+        "autoClose": true,
+        "props": [
+          {
+            "key": "iconFont",
+            "name": "#图标选择器",
+            "type": "_IconSelector"
+          }
+        ]
+      }
+    },
+    {
+      "key": "tooltip",
+      "name": "用户提示",
+      "type": "_I18nInput",
+      "wrapped": "textarea"
+    },
+    {
+      "key": "subtitle",
+      "name": "副标题插槽",
+      "desc": "分组副标题的插槽内容",
+      "type": "_JSEditor",
+      "defaultCode": "function Component() { \n return <span>subtitle</span>; \n}",
+      "mustConfirm": true,
+      "wrapper": "collapse",
+      "wrapperProps": { "suppressIcon": true }
+    },
+    {
+      "key": "extra",
+      "name": "扩展区域插槽",
+      "desc": "分组扩展区域的插槽内容",
+      "type": "_JSEditor",
+      "defaultCode": "function Component() { \n return <div>extra</div>; \n}",
+      "mustConfirm": true,
+      "wrapper": "collapse",
+      "wrapperProps": { "suppressIcon": true }
+    }
+  ],
+  "css": "width: 100%;",
+  "advance": {
+    "events": [
+      {
+        "key": "onMount",
+        "name": "组件首次渲染时",
+        "desc": "在组件首次渲染时，执行方法",
+        "func": "function onMount(){\n\t\n}"
+      },
+      {
+        "key": "onUnmount",
+        "name": "组件卸载时",
+        "desc": "在组件卸载时，执行方法。",
+        "func": "function onUnmount()=>{\n\t\n}"
+      }
+    ]
+  }
+}

package/lib/lowcode/view/lc-components/Split/index.js

@@ -11,9 +11,10 @@ var _ahooks = require("ahooks");
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _lodash = require("lodash");
 var _base = require("@luck-design-biz/base");
+var _ContextProvider = require("../../../engine/provider/ContextProvider");
+var _Wrapper = _interopRequireDefault(require("../Wrapper"));
 var _helper = require("../../../engine/tools/helper");
 var _splitPropsDefault = _interopRequireDefault(require("../../../engine/meta/split.props.default.json"));
-var _Wrapper = _interopRequireDefault(require("../Wrapper"));
 var _MAPPING_ = {
   left: 'min',
   up: 'min',
@@ -30,8 +31,16 @@ var LCSplit = function LCSplit(_ref) {
   var id = _ref.id,
     children = _ref.children,
     css = _ref.css,
-    display = _ref.display;
+    display = _ref.display,
+    advance = _ref.advance;
   var ref = (0, _react.useRef)();
+  var ctx = (0, _ContextProvider.useContext)();
+  (0, _react.useEffect)(function () {
+    ctx.doAction(advance.events.onMount);
+    return function () {
+      return ctx.doAction(advance.events.onUnmount);
+    };
+  }, []);
   var getTargetDom = (0, _ahooks.useMemoizedFn)(function () {
     return ref.current;
   });
@@ -46,6 +55,11 @@ var LCSplit = function LCSplit(_ref) {
     }, [display.ratio]),
     ratioArr = _useCreation.ratioArr,
     total = _useCreation.total;
+  var handleChange = (0, _ahooks.useMemoizedFn)(function (value) {
+    ctx.doAction(advance.events.onChange, {
+      value: value
+    });
+  });
   return /*#__PURE__*/_react.default.createElement(_Wrapper.default, {
     id: id,
     displayName: "Split",
@@ -54,7 +68,8 @@ var LCSplit = function LCSplit(_ref) {
     ref: ref,
     $css: css
   }, /*#__PURE__*/_react.default.createElement(_base.MemorySplit, {
-    split: display.split
+    split: display.split,
+    onChange: handleChange
   }, ratioArr.map(function (r, i) {
     return /*#__PURE__*/_react.default.createElement(_base.MemorySplit.Pane, {
       fastTo: !display.fastTo || i === display.fastTo.length ? 'max' : _MAPPING_[display.fastTo[i]],

package/lib/lowcode/view/lc-components/Split/meta.json

@@ -1,53 +1,53 @@
-{
-  "component": "Split",
-  "name": "分割面板容器",
-  "icon": "icon-split",
-  "group": "container",
-  "groupName": "布局",
-  "desc": "分割面板容器是一种可以通过拖拽分割线调整面板大小的容器组件，用于创建页面布局或需要调整可视区域的布局场景",
-  "order": 1,
-  "props": [
-    {
-      "key": "id",
-      "name": "唯一标识",
-      "type": "string",
-      "disabled": true
-    },
-    {
-      "key": "displaySetting",
-      "name": "展现形式",
-      "type": "group",
-      "props": [
-        {
-          "key": "display",
-          "name": "#展现形式",
-          "type": "_SplitDisplay",
-          "default": { "type": "normal", "split": "horizontal", "ratio": "1:1" }
-        }
-      ]
-    }
-  ],
-  "css": "width: 100%, height: 100%, background-color: transparent",
-  "advance": {
-    "events": [
-      {
-        "key": "onMount",
-        "name": "组件首次渲染时",
-        "desc": "在组件首次渲染时，执行方法",
-        "func": "function onMount() {\n\t\n}"
-      },
-      {
-        "key": "onUnmount",
-        "name": "组件卸载时",
-        "desc": "在组件卸载时，执行方法。",
-        "func": "function onUnmount() {\n\t\n}"
-      },
-      {
-        "key": "onChange",
-        "name": "尺寸变化事件",
-        "desc": "在面板尺寸发生变化时，执行方法",
-        "func": "function onChange(value) {\n\t\n}"
-      }
-    ]
-  }
-}
+{
+  "component": "Split",
+  "name": "分割面板容器",
+  "icon": "icon-split",
+  "group": "container",
+  "groupName": "布局",
+  "desc": "分割面板容器是一种可以通过拖拽分割线调整面板大小的容器组件，用于创建页面布局或需要调整可视区域的布局场景",
+  "order": 1,
+  "props": [
+    {
+      "key": "id",
+      "name": "唯一标识",
+      "type": "string",
+      "disabled": true
+    },
+    {
+      "key": "displaySetting",
+      "name": "展现形式",
+      "type": "group",
+      "props": [
+        {
+          "key": "display",
+          "name": "#展现形式",
+          "type": "_SplitDisplay",
+          "default": { "type": "normal", "split": "horizontal", "ratio": "1:1" }
+        }
+      ]
+    }
+  ],
+  "css": "width: 100%; height: 100%; background-color: transparent;",
+  "advance": {
+    "events": [
+      {
+        "key": "onMount",
+        "name": "组件首次渲染时",
+        "desc": "在组件首次渲染时，执行方法",
+        "func": "function onMount() {\n\t\n}"
+      },
+      {
+        "key": "onUnmount",
+        "name": "组件卸载时",
+        "desc": "在组件卸载时，执行方法。",
+        "func": "function onUnmount() {\n\t\n}"
+      },
+      {
+        "key": "onChange",
+        "name": "尺寸变化事件",
+        "desc": "在面板尺寸发生变化时，执行方法",
+        "func": "function onChange(value) {\n\t\n}"
+      }
+    ]
+  }
+}