@luck-design-biz/luckda 0.0.27 → 1.0.0-alpha

package/es/lowcode/engine/tools/dataProcess.js

@@ -1,7 +1,9 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
 import * as LZString from 'lz-string';
+import { LC_BUILDIN_UNIT_KEY } from "../../constants";
 
 /**
  * 数据压缩
@@ -12,7 +14,7 @@ export function compress(data) {
   // 将对象转换为JSON字符串
   var jsonString = JSON.stringify(data);
   // 使用LZ-String压缩JSON字符串
-  return LZString.compressToUTF16(jsonString);
+  return LZString.compressToBase64(jsonString);
 }
 
 /**
@@ -22,7 +24,7 @@ export function compress(data) {
  */
 export function decompress(compressedData) {
   // 使用LZ-String解压数据
-  var jsonString = LZString.decompressFromUTF16(compressedData);
+  var jsonString = LZString.decompressFromBase64(compressedData);
   // 将JSON字符串转换回对象
   return JSON.parse(jsonString);
 }
@@ -37,6 +39,16 @@ export function decompress(compressedData) {
  */
 export function findNodeAndParent(id, current) {
   var parent = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  if (!id) return {
+    node: null,
+    parent: null
+  };
+  if (!parent && current.props.id === id) {
+    return {
+      node: current,
+      parent: null
+    };
+  }
   if (current.hasOwnProperty('children') && current.children.includes(id)) {
     return {
       node: current[id],
@@ -44,7 +56,7 @@ export function findNodeAndParent(id, current) {
     };
   }
   for (var key in current) {
-    if (current[key] && _typeof(current[key]) === 'object' && key !== 'props') {
+    if (current[key] && _typeof(current[key]) === 'object' && key !== 'props' && key !== 'children') {
       var result = findNodeAndParent(id, current[key], current);
       if (result.node) {
         return result;
@@ -98,7 +110,7 @@ function process(json, path, id, data) {
     current[id] = {
       props: _objectSpread(_objectSpread({}, data), {}, {
         id: id,
-        parentId: current.id
+        parentId: current.props.id
       })
     };
   } else if (!path && id && data) {
@@ -133,12 +145,74 @@ function process(json, path, id, data) {
  * 对指定的JSON结构进行节点的添加操作。
  *
  * @param {Object} json - 要操作的JSON对象。
- * @param {string|null} path - 要操作的节点路径，使用'/'分隔。
+ * @param {string} parentId - 父节点的唯一标识符。
  * @param {string} id - 操作节点的唯一标识符。
  * @param {Object|null} data - 要添加或修改的数据。如果为null，表示删除操作。
  */
-export function add(json, path, id, data) {
-  process(json, path, id, data);
+export function add(json, parentId, id, data) {
+  process(json, getPathById(json, parentId), id, data);
+}
+
+/**
+ * 移动指定的节点到另一个节点的指定位置。
+ *
+ * @param {Object} json - 要操作的JSON对象。
+ * @param {string} sid - 被移动的节点id
+ * @param {string} tid - 目标节点id
+ * @param {string} action - 'left': 往节点前面插入，'right'：往节点后面插，'inside'：往节点子节点插
+ */
+export function move(json, sid, tid, action) {
+  // 验证节点存在性
+  var _findNodeAndParent3 = findNodeAndParent(sid, json),
+    sourceNode = _findNodeAndParent3.node,
+    sourceParent = _findNodeAndParent3.parent;
+  var _findNodeAndParent4 = findNodeAndParent(tid, json),
+    targetNode = _findNodeAndParent4.node,
+    targetParent = _findNodeAndParent4.parent;
+  if (!sourceNode || !targetNode) {
+    throw new Error('Source or target node does not exist.');
+  }
+
+  // 从原父节点中移除
+  if (sourceParent) {
+    sourceParent.children = sourceParent.children.filter(function (id) {
+      return id !== sid;
+    });
+    if (sourceParent.children.length === 0) {
+      delete sourceParent.children;
+    }
+    delete sourceParent[sid];
+  }
+  switch (action) {
+    case 'inside':
+      // 插入到目标节点的children数组
+      if (!targetNode.children) {
+        targetNode.children = [];
+      }
+      targetNode.children.push(sid);
+      sourceNode.props.parentId = tid;
+      targetNode[sid] = sourceNode;
+      break;
+    case 'left':
+    case 'right':
+      if (!targetParent) {
+        throw new Error('Target node must have a parent for left or right operations.');
+      }
+      // 插入到目标节点同级的前面或后面
+      var idx = targetParent.children.indexOf(tid);
+      if (idx === -1) {
+        throw new Error("Target node is not found in its parent's children list.");
+      }
+      if (action === 'right') {
+        idx++;
+      }
+      targetParent.children.splice(idx, 0, sid);
+      sourceNode.props.parentId = targetParent.props.id;
+      targetParent[sid] = sourceNode;
+      break;
+    default:
+      throw new Error('Invalid action type.');
+  }
 }
 
 /**
@@ -153,7 +227,7 @@ export function modifyById(json, id, data) {
 }
 
 /**
- * 查找指定ID的节点及其父节点。
+ * 删除指定id的节点。
  *
  * @param {Object} json - JSON对象。
  * @param {string} id - 要删除的节点ID。
@@ -173,6 +247,7 @@ export function deleteById(json, id) {
 export function getPathById(json, id) {
   var currentPath = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
   for (var key in json) {
+    if (id === LC_BUILDIN_UNIT_KEY.PAGE_ROOT) return '/';
     var newPath = currentPath ? "".concat(currentPath, "/").concat(key) : key;
     if (json[key].props && json[key].props.id === id) {
       return newPath;
@@ -185,4 +260,72 @@ export function getPathById(json, id) {
     }
   }
   return null;
+}
+
+/**
+ * 在给定的JSON结构中搜索具有特定id的节点，并返回包含该节点及其所有父节点的props属性的路径数组。
+ *
+ * @param {Object} data - 待搜索的JSON对象，它代表了一个复杂的树状结构，每个节点都可能有props和children属性。
+ * @param {string} targetId - 需要找到的目标节点的id。
+ * @returns {Array<Object>} 一个包含目标节点及其所有父节点的props属性的数组。如果未找到目标节点，则返回空数组。
+ *
+ * @example
+ * const data = {
+ *   props: {
+ *     id: 'page_root',
+ *     type: 'Page',
+ *     name: '页面',
+ *     hasHeder: true,
+ *     hasFooter: true,
+ *   },
+ *   // ...其他节点
+ * };
+ *
+ * const path = getPathNodesById(data, 'form_jknbjkun');
+ * console.log(path);
+ * // 输出目标节点及其所有父节点的props属性的数组
+ */
+export function getPathNodesById(data, targetId) {
+  // 初始化结果数组
+  var result = [];
+
+  // 定义递归函数以搜索路径
+  function search(node) {
+    var path = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+    // 检查当前节点是否是目标节点
+    if (node && node.props && node.props.id === targetId) {
+      // 如果是，将当前路径和节点自身添加到结果中
+      result = [].concat(_toConsumableArray(path), [node.props]);
+      return true;
+    }
+
+    // 遍历子节点
+    if (node && node.children) {
+      var _iterator2 = _createForOfIteratorHelper(node.children),
+        _step2;
+      try {
+        for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+          var childId = _step2.value;
+          // 对每个子节点，首先尝试从当前节点获取子节点数据
+          var childNode = node[childId];
+          if (search(childNode, [].concat(_toConsumableArray(path), [node.props]))) {
+            return true;
+          }
+        }
+      } catch (err) {
+        _iterator2.e(err);
+      } finally {
+        _iterator2.f();
+      }
+    }
+    return false;
+  }
+
+  // 从顶层"data"对象开始搜索
+  if (search(data)) {
+    return result;
+  }
+
+  // 如果未找到目标节点，返回空数组
+  return [];
 }

package/es/lowcode/engine/tools/diff.js

@@ -0,0 +1,60 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+var richTypes = {
+  Date: true,
+  RegExp: true,
+  String: true,
+  Number: true
+};
+export default function diff(obj, newObj) {
+  var options = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {
+    cyclesFix: true
+  };
+  var _stack = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : [];
+  var diffs = [];
+  var isObjArray = Array.isArray(obj);
+  var _loop = function _loop() {
+    var _Object$getPrototypeO;
+    var objKey = obj[key];
+    var path = isObjArray ? +key : key;
+    if (!(key in newObj)) {
+      diffs.push({
+        type: 'REMOVE',
+        path: [path],
+        oldValue: obj[key]
+      });
+      return 1; // continue
+    }
+    var newObjKey = newObj[key];
+    var areCompatibleObjects = _typeof(objKey) === 'object' && _typeof(newObjKey) === 'object' && Array.isArray(objKey) === Array.isArray(newObjKey);
+    if (objKey && newObjKey && areCompatibleObjects && !richTypes[(_Object$getPrototypeO = Object.getPrototypeOf(objKey)) === null || _Object$getPrototypeO === void 0 || (_Object$getPrototypeO = _Object$getPrototypeO.constructor) === null || _Object$getPrototypeO === void 0 ? void 0 : _Object$getPrototypeO.name] && (!options.cyclesFix || !_stack.includes(objKey))) {
+      var nestedDiffs = diff(objKey, newObjKey, options, options.cyclesFix ? _stack.concat([objKey]) : []);
+      diffs.push.apply(diffs, nestedDiffs.map(function (difference) {
+        difference.path.unshift(path);
+        return difference;
+      }));
+    } else if (objKey !== newObjKey &&
+    // treat NaN values as equivalent
+    !(Number.isNaN(objKey) && Number.isNaN(newObjKey)) && !(areCompatibleObjects && (isNaN(objKey) ? objKey + '' === newObjKey + '' : +objKey === +newObjKey))) {
+      diffs.push({
+        path: [path],
+        type: 'CHANGE',
+        value: newObjKey,
+        oldValue: objKey
+      });
+    }
+  };
+  for (var key in obj) {
+    if (_loop()) continue;
+  }
+  var isNewObjArray = Array.isArray(newObj);
+  for (var _key in newObj) {
+    if (!obj || !(_key in obj)) {
+      diffs.push({
+        type: 'CREATE',
+        path: [isNewObjArray ? +_key : _key],
+        value: newObj[_key]
+      });
+    }
+  }
+  return diffs;
+}

package/es/lowcode/engine/tools/helper.js

@@ -1,4 +1,239 @@
+import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
+import _construct from "@babel/runtime/helpers/esm/construct";
+import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
+import { omit, isNil, isString, isArray, has, get } from 'lodash';
+import postcss from 'postcss';
+import { META_TAG_NAME } from "../../constants";
 export function isPromise(value) {
   return !!value && _typeof(value) === 'object' && typeof value.then === 'function';
+}
+export function omitBadProps(props) {
+  var rubbish = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : [];
+  return omit(props, ['component', 'name', 'desc', 'icon', 'group', 'groupName', 'order'].concat(_toConsumableArray(rubbish)));
+}
+export function listReducer(state, action) {
+  switch (action.type) {
+    case 'insert':
+      {
+        var _action$callback;
+        var newState = _toConsumableArray(state);
+        newState.splice(action.payload.index + 1, 0, action.payload.data);
+        (_action$callback = action.callback) === null || _action$callback === void 0 || _action$callback.call(action, newState);
+        return newState;
+      }
+    case 'add':
+      {
+        var _action$callback2;
+        var _newState = [].concat(_toConsumableArray(state), [action.payload]);
+        (_action$callback2 = action.callback) === null || _action$callback2 === void 0 || _action$callback2.call(action, _newState);
+        return _newState;
+      }
+    case 'delete':
+      {
+        var _action$callback3;
+        var _newState2 = state.filter(function (item) {
+          return item.id !== action.payload;
+        });
+        (_action$callback3 = action.callback) === null || _action$callback3 === void 0 || _action$callback3.call(action, _newState2);
+        return _newState2;
+      }
+    case 'edit':
+      {
+        var _action$callback4;
+        var _newState3 = state.map(function (item) {
+          return item.id === action.payload.id ? _objectSpread(_objectSpread({}, item), action.payload.data) : item;
+        });
+        (_action$callback4 = action.callback) === null || _action$callback4 === void 0 || _action$callback4.call(action, _newState3);
+        return _newState3;
+      }
+    case 'batchEdit':
+      {
+        var _action$callback5;
+        var _newState4 = state.map(function (item) {
+          var newItem = action.payload.items.find(function (_id) {
+            return _id === item.id;
+          });
+          if (newItem) {
+            return _objectSpread(_objectSpread({}, item), action.payload.data);
+          }
+          return item;
+        });
+        (_action$callback5 = action.callback) === null || _action$callback5 === void 0 || _action$callback5.call(action, _newState4);
+        return _newState4;
+      }
+    case 'active':
+      {
+        var _action$callback6;
+        var _newState5 = state.map(function (item) {
+          item.active = false;
+          return item.id === action.payload.id ? _objectSpread(_objectSpread({}, item), action.payload.data) : item;
+        });
+        (_action$callback6 = action.callback) === null || _action$callback6 === void 0 || _action$callback6.call(action, _newState5);
+        return _newState5;
+      }
+    case 'init':
+    case 'new':
+      {
+        var _action$callback7;
+        (_action$callback7 = action.callback) === null || _action$callback7 === void 0 || _action$callback7.call(action, action.payload);
+        return action.payload;
+      }
+    case 'sort':
+      {
+        var _action$callback8;
+        var sortItems = action.payload;
+        var newItems = state.sort(function (a, b) {
+          var indexA = sortItems.indexOf(a.id);
+          var indexB = sortItems.indexOf(b.id);
+          return indexA - indexB;
+        });
+        var _newState6 = _toConsumableArray(newItems);
+        (_action$callback8 = action.callback) === null || _action$callback8 === void 0 || _action$callback8.call(action, _newState6);
+        return _newState6;
+      }
+    default:
+      throw new Error();
+  }
+}
+export function getCtx(context) {
+  return context;
+  // return omitBy(context, (_, key) => startsWith(key, '_'));
+}
+export function getFuncBody(funcCode) {
+  var regex = /{([\s\S]*?)}(?![\s\S]*})/;
+  var matches = funcCode.match(regex);
+  if (matches) {
+    return matches[1].replace(/\s*\n\s*/g, ' ').trim();
+  }
+  return '';
+}
+export function executeCode(context, code, argsName) {
+  if (!isString(code)) {
+    throw new Error('executeCode编码参数无效');
+  }
+  for (var _len = arguments.length, args = new Array(_len > 3 ? _len - 3 : 0), _key = 3; _key < _len; _key++) {
+    args[_key - 3] = arguments[_key];
+  }
+  if (isNil(argsName) && args.length > 0 || !isNil(argsName) && !isArray(argsName) || isArray(argsName) && argsName.length !== (args === null || args === void 0 ? void 0 : args.length)) {
+    throw new Error('executeCode参数不匹配');
+  }
+  var ctx = getCtx(context);
+  var func = _construct(Function, _toConsumableArray(argsName || []).concat(['ctx', 'window', "\"use strict\"; ".concat(getFuncBody(code))]));
+  return func.apply(void 0, args.concat([ctx, _objectSpread(_objectSpread({}, window.proxy), window)]));
+}
+export function parseCSS(cssString) {
+  // 创建一个空对象来存储解析后的样式
+  var parsedStyles = {};
+  if (cssString) {
+    try {
+      // 解析CSS字符串
+      var ast = postcss.parse(cssString);
+
+      // 遍历AST中的每个规则
+      ast.walkDecls(function (decl) {
+        // 将每个声明的属性和值存储在对象中
+        var selector = decl.parent.selector;
+        if (!parsedStyles[selector]) {
+          parsedStyles[selector] = {};
+        }
+        parsedStyles[selector][decl.prop] = decl.value;
+      });
+    } catch (e) {
+      console.error(e);
+    }
+  }
+  // 返回包含所有样式的对象
+  return parsedStyles;
+}
+export function isColor(str) {
+  var hexRegex = /^#(?:[A-Fa-f0-9]{3,4}){1,2}$/;
+  var rgbaRegex = /^rgba?\(\s*(\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})(,\s*(0|1|0?\.\d+))?\s*\)$/;
+  return hexRegex.test(str) || rgbaRegex.test(str);
+}
+export function setMetaAttrs(name, data) {
+  var meta = document.querySelector("meta[name=\"".concat(name, "\"]"));
+  if (!meta) {
+    meta = document.createElement('meta');
+  }
+  meta.name = name;
+  meta.content = isString(data) ? data : new URLSearchParams(data).toString().replaceAll('&', ',');
+  document.head.appendChild(meta);
+}
+export function getMetaAttr(name, _) {
+  if (isNil(name)) return void 0;
+  var meta = document.querySelector("meta[name=\"".concat(name, "\"]"));
+  if (meta.content.includes(',')) {
+    var data = new URLSearchParams(meta.content.replaceAll(',', '&'));
+    if (isNil(_)) {
+      return Object.fromEntries(data.entries());
+    }
+    if (isArray(_)) {
+      return _.map(function (n) {
+        return data.get(n);
+      });
+    }
+    return data.get(_);
+  }
+  return meta.content;
+}
+export function getLDMetaAttr(_) {
+  return getMetaAttr(META_TAG_NAME, _);
+}
+export function extractKeywords(obj, keys) {
+  var keywords = [];
+  function recurse(currentObj) {
+    if (_typeof(currentObj) !== 'object' || currentObj === null) {
+      return;
+    }
+    for (var key in currentObj) {
+      var _iterator = _createForOfIteratorHelper(keys),
+        _step;
+      try {
+        tag: for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var triggerKey = _step.value;
+          var flag = isString(triggerKey) ? key === triggerKey : has(currentObj[key], triggerKey);
+          if (flag) {
+            var keyword = isString(triggerKey) ? currentObj[triggerKey] : get(currentObj[key], triggerKey);
+            keywords.push({
+              label: keyword,
+              kind: 'property',
+              insertText: keyword,
+              documentation: JSON.stringify(currentObj)
+            });
+            break tag;
+          }
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+      recurse(currentObj[key]);
+    }
+  }
+  recurse(obj);
+  return keywords;
+}
+export function loadScript(path) {
+  var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var script = document.querySelector("script[src=\"".concat(path, "\"]"));
+  if (!script) {
+    var newScript = document.createElement('script');
+    newScript.src = path;
+    Object.keys(props).forEach(function (key) {
+      newScript[key] = props[key];
+    });
+    newScript.setAttribute('data-status', 'loading');
+    document.body.appendChild(newScript);
+    return {
+      ref: newScript,
+      status: 'loading'
+    };
+  }
+  return {
+    ref: script,
+    status: script.getAttribute('data-status') || 'ready'
+  };
 }

package/es/lowcode/engine/tools/useCanvasRender.js

@@ -0,0 +1,81 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
+import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["props", "children"],
+  _excluded2 = ["id", "component", "name", "desc", "icon", "group", "groupName", "order"];
+import React, { useRef } from 'react';
+import { dynamic } from 'umi';
+import { useMemoizedFn, useCreation } from 'ahooks';
+import { upperFirst, isNil } from 'lodash';
+import { useContext } from "../provider/ContextProvider";
+import { LC_BUILDIN_UNIT_KEY_LIST, RUNTIME } from "../../constants";
+import { executeCode } from "../tools/helper";
+export default function useCanvasRender(data, deps) {
+  var dynamicCompMap = useRef({});
+  var ctx = useContext();
+  var render = useMemoizedFn(function () {
+    var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
+      props = _ref.props,
+      children = _ref.children,
+      childrenMap = _objectWithoutProperties(_ref, _excluded);
+    if (props && !LC_BUILDIN_UNIT_KEY_LIST.includes(props.id)) {
+      var _rest$advance;
+      var id = props.id,
+        component = props.component,
+        name = props.name,
+        desc = props.desc,
+        icon = props.icon,
+        group = props.group,
+        groupName = props.groupName,
+        order = props.order,
+        rest = _objectWithoutProperties(props, _excluded2);
+      if (!dynamicCompMap.current[component]) {
+        dynamicCompMap.current[component] = dynamic({
+          loader: function () {
+            var _loader = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+              var _runtime, _yield$import, _Comp;
+              return _regeneratorRuntime().wrap(function _callee$(_context) {
+                while (1) switch (_context.prev = _context.next) {
+                  case 0:
+                    _runtime = upperFirst(ctx.runtime);
+                    _context.next = 3;
+                    return import("../../view/lc-components/".concat(component, "/Function").concat(_runtime));
+                  case 3:
+                    _yield$import = _context.sent;
+                    _Comp = _yield$import.default;
+                    return _context.abrupt("return", _Comp);
+                  case 6:
+                  case "end":
+                    return _context.stop();
+                }
+              }, _callee);
+            }));
+            function loader() {
+              return _loader.apply(this, arguments);
+            }
+            return loader;
+          }()
+        });
+      }
+      var renderable = true;
+      if (ctx.runtime !== RUNTIME.DESIGN && (_rest$advance = rest.advance) !== null && _rest$advance !== void 0 && _rest$advance.render) {
+        renderable = rest.advance.render.value && (isNil(rest.advance.render.code) ? true : executeCode(ctx, rest.advance.render.code));
+      }
+      if (!renderable) return null;
+      var Comp = dynamicCompMap.current[component];
+      return /*#__PURE__*/React.createElement(Comp, _extends({
+        key: id,
+        id: id
+      }, rest), (children === null || children === void 0 ? void 0 : children.length) > 0 ? children.map(function (_id) {
+        return render(childrenMap[_id]);
+      }) : null);
+    }
+    return (children === null || children === void 0 ? void 0 : children.length) > 0 ? children.map(function (_id) {
+      return render(childrenMap[_id]);
+    }) : null;
+  });
+  return useCreation(function () {
+    return render(data);
+  }, deps || [data, ctx.state]);
+}

package/es/lowcode/engine/tools/useCombinedRefs.js

@@ -0,0 +1,14 @@
+import { useRef, useEffect } from 'react';
+var useCombinedRefs = function useCombinedRefs(forwardedRef) {
+  var innerRef = useRef(null);
+  useEffect(function () {
+    if (!forwardedRef) return;
+    if (typeof forwardedRef === 'function') {
+      forwardedRef(innerRef.current);
+    } else {
+      forwardedRef.current = innerRef.current;
+    }
+  }, [forwardedRef]);
+  return forwardedRef || innerRef;
+};
+export default useCombinedRefs;