@next-core/editor-bricks-helper 0.40.1 → 0.42.0

package/dist/index.esm.js

@@ -4,11 +4,11 @@ import _defineProperty from '@babel/runtime/helpers/defineProperty';
 import { sortBy, clamp, isEmpty, cloneDeep, upperFirst, omit } from 'lodash';
 import { hasOwnProperty, isBrickNode, normalizeBuilderNode, JsonStorage, isRouteNode } from '@next-core/brick-utils';
 export { isBrickNode, isCustomTemplateNode, isRouteNode, isSnippetNode } from '@next-core/brick-utils';
+import yaml from 'js-yaml';
 import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
 import { useDrag, useDrop, DndProvider } from 'react-dnd';
 import _asyncToGenerator from '@babel/runtime/helpers/asyncToGenerator';
 import { developHelper, getRuntime, BrickAsComponent, property, BrickWrapper, UpdatingElement } from '@next-core/brick-kit';
-import yaml from 'js-yaml';
 import _decorate from '@babel/runtime/helpers/decorate';
 import ReactDOM from 'react-dom';
 import { HTML5Backend } from 'react-dnd-html5-backend';
@@ -658,6 +658,63 @@ function isParentExpandableTemplate(nodes, parentUid) {
   return nodes.find(node => node.$$uid === parentUid).$$isExpandableTemplate;
 }
 
+var jsonFieldsInBrick = ["properties", "events", "lifeCycle", "params", "if", "transform"];
+var yamlFieldsInBrick = ["permissionsPreCheck", "transformFrom"];
+var ignoredFieldsInBrick = ["brick", "template", "portal", "slots", "id", "children", "instanceId"];
+// The reverse operation of *normalize*.
+// https://github.com/easyops-cn/next-basics/blob/5a6710d567821bcb4a0c71e22d55212193d8b0cb/bricks/next-builder/src/shared/storyboard/buildStoryboard.ts#L394
+function reverseNormalize(brickConf, ctx) {
+  return Object.fromEntries(Object.entries(brickConf).map(_ref => {
+    var [key, value] = _ref;
+    return value === undefined || ignoredFieldsInBrick.includes(key) ? undefined : jsonFieldsInBrick.includes(key) ? [key, JSON.stringify(value)] : yamlFieldsInBrick.includes(key) ? [key, yaml.safeDump(value)] : [key, value];
+  }).filter(Boolean).concat(Object.entries(ctx.nodeData), [["brick", ctx.nodeData.type === "template" ? brickConf.template : brickConf.brick], ["portal", ctx.isPortalCanvas || brickConf.portal]]));
+}
+
+function getSnippetNodeDetail(_ref) {
+  var {
+    parent,
+    parentUid,
+    mountPoint,
+    nodeUid,
+    brickConf,
+    isPortalCanvas,
+    sort
+  } = _ref;
+  var type = brickConf.template ? "template" : brickConf.bg ? "provider" : "brick";
+  return {
+    nodeUid,
+    parentUid,
+    nodeData: reverseNormalize(brickConf, {
+      isPortalCanvas,
+      nodeData: {
+        type,
+        parent,
+        mountPoint,
+        sort
+      }
+    }),
+    children: brickConf.slots ? Object.entries(brickConf.slots).flatMap(_ref2 => {
+      var [mountPoint, slotConf] = _ref2;
+      return slotConf.bricks.map(childBrickConf => ({
+        childBrickConf,
+        mountPoint
+      }));
+    }).map((_ref3, index) => {
+      var {
+        childBrickConf,
+        mountPoint
+      } = _ref3;
+      return getSnippetNodeDetail({
+        parentUid: nodeUid,
+        mountPoint,
+        nodeUid: getUniqueNodeId(),
+        brickConf: childBrickConf,
+        sort: index
+      });
+    }) : []
+  };
+}
+
 var BuilderInternalEventType;
 
 (function (BuilderInternalEventType) {
@@ -814,7 +871,8 @@ class BuilderDataManager {
       nodeUid,
       parentUid,
       nodeUids,
-      nodeData
+      nodeData,
+      sort
     } = detail;
     var {
       nodes: addNodes,
@@ -825,7 +883,7 @@ class BuilderDataManager {
       parent: parentUid,
       child: nodeUid,
       mountPoint: nodeData.mountPoint,
-      sort: undefined,
+      sort: sort !== null && sort !== void 0 ? sort : undefined,
       $$isTemplateDelegated: isParentExpandableTemplate(nodes, parentUid)
     }).concat(addEdges);
     var newData = {
@@ -1063,30 +1121,35 @@ class BuilderDataManager {
     this.reorder(parentUid, orderedEdges);
   }
 
-  workbenchTreeNodeMove(detail) {
-    var {
-      rootId,
-      nodes,
-      edges,
-      wrapperNode
-    } = this.data;
+  getDragInfo(_ref3) {
+    var _dragEdge$mountPoint;
+
     var {
+      nodeData,
       dragNodeUid,
       dragOverNodeUid,
-      dragParentNodeUid,
       dragStatus
-    } = detail;
+    } = _ref3;
+    var {
+      rootId,
+      nodes,
+      edges
+    } = this.data;
     var isDragRoot = dragOverNodeUid === rootId;
-    var nodeData = nodes.find(item => item.$$uid === dragNodeUid);
-    var dragEdge = edges.find(item => item.child === dragNodeUid);
+    /*
+     * 如果没有id, 则为新增状态, 没有edge, 否则为移动状态
+     */
+
+    var isAdd = nodeData.id;
+    var dragEdge = !isAdd ? edges.find(item => item.child === dragNodeUid) : null;
     var dragOverEdge = edges.find(item => item.child === dragOverNodeUid);
     /**
      * 如果是根节点, 则mountPoint强制等于 bricks
-     * 如果是属于拖动进某个节点中, 则使用原mountPoint
+     * 如果是属于拖动进某个节点中, 则使用原mountPoint(新增节点为content)
      * 其他情况, 使用被拖拽节点的mountPoint
      */
 
-    var mountPoint = isDragRoot ? "bricks" : dragStatus === "inside" ? dragEdge.mountPoint : dragOverEdge.mountPoint;
+    var mountPoint = isDragRoot ? "bricks" : dragStatus === "inside" ? (_dragEdge$mountPoint = dragEdge === null || dragEdge === void 0 ? void 0 : dragEdge.mountPoint) !== null && _dragEdge$mountPoint !== void 0 ? _dragEdge$mountPoint : "content" : dragOverEdge.mountPoint;
     var parentEdge = edges.find(item => item.child === dragOverNodeUid);
     /**
      * 如果是根节点, parentUid强制等于rootId
@@ -1109,31 +1172,141 @@ class BuilderDataManager {
 
       sortNodeIds.push(nodeData.id);
     } else if (dragStatus === "top" || dragStatus === "bottom") {
-      var _dragEdge = edges.find(edge => edge.child === dragNodeUid);
+      var _dragEdge$child;
 
       var overIndex = sortUids.findIndex(item => item === dragOverNodeUid);
       sortIndex = dragStatus === "top" ? overIndex : overIndex + 1; // 排序修正
 
       sortNodeIds.splice(sortIndex, 0, nodeData.id);
-      sortUids.splice(sortIndex, 0, _dragEdge.child);
+      sortUids.splice(sortIndex, 0, (_dragEdge$child = dragEdge === null || dragEdge === void 0 ? void 0 : dragEdge.child) !== null && _dragEdge$child !== void 0 ? _dragEdge$child : null);
     }
 
+    return {
+      parentUid,
+      mountPoint,
+      sortIndex,
+      parnetNodeData,
+      sortUids,
+      sortNodeIds
+    };
+  }
+
+  workbenchNodeAdd(detail) {
+    var {
+      rootId,
+      nodes
+    } = this.data;
+    var {
+      nodeData,
+      dragOverNodeInstanceId,
+      dragStatus
+    } = detail;
+
+    if (nodeData.instanceId) ; else {
+      var _nodes$find;
+
+      // insert
+      var newNodeUid = getUniqueNodeId();
+      var isRoot = dragOverNodeInstanceId === "#main-mount-point";
+      var parentInstanceId = isRoot ? nodes.find(item => item.$$uid === rootId).instanceId : dragOverNodeInstanceId;
+      var dragOverNodeUid = (_nodes$find = nodes.find(item => isRoot ? item.$$uid === rootId : item.instanceId === dragOverNodeInstanceId)) === null || _nodes$find === void 0 ? void 0 : _nodes$find.$$uid;
+      var {
+        parentUid,
+        mountPoint,
+        sortIndex,
+        sortUids: nodeUids,
+        sortNodeIds: nodeIds
+      } = this.getDragInfo({
+        nodeData: {
+          id: null
+        },
+        dragNodeUid: newNodeUid,
+        dragOverNodeUid,
+        dragStatus
+      });
+      nodeData.parent = nodes.find(item => item.$$uid === parentUid).instanceId;
+      nodeData.mountPoint = mountPoint;
+
+      if (nodeData.bricks) {
+        // snippet
+        this.snippetApply({
+          parentUid,
+          nodeDetails: nodeData.bricks.map(brickConf => getSnippetNodeDetail({
+            parent: parentInstanceId,
+            parentUid: parentUid,
+            mountPoint: mountPoint,
+            nodeUid: newNodeUid,
+            brickConf: brickConf,
+            isPortalCanvas: false
+          })),
+          nodeIds,
+          nodeUids
+        });
+        return;
+      }
+
+      this.runAddNodeAction({
+        nodeUid: newNodeUid,
+        parentUid,
+        nodeUids,
+        nodeIds,
+        nodeData,
+        sort: sortIndex
+      });
+      this.eventTarget.dispatchEvent(new CustomEvent(BuilderInternalEventType.NODE_ADD, {
+        detail: {
+          nodeUid: newNodeUid,
+          parentUid,
+          nodeUids,
+          nodeIds,
+          nodeData
+        }
+      }));
+    }
+  }
+
+  workbenchTreeNodeMove(detail) {
+    var {
+      rootId,
+      nodes,
+      edges,
+      wrapperNode
+    } = this.data;
+    var {
+      dragNodeUid,
+      dragOverNodeUid,
+      dragStatus
+    } = detail;
+    var nodeData = nodes.find(item => item.$$uid === dragNodeUid);
+    var {
+      parentUid,
+      parnetNodeData,
+      mountPoint,
+      sortIndex,
+      sortUids: nodeUids,
+      sortNodeIds: nodeIds
+    } = this.getDragInfo({
+      nodeData,
+      dragNodeUid,
+      dragOverNodeUid,
+      dragStatus
+    });
     var newData = {
       rootId,
       nodes,
       edges: edges.filter(edge => edge.child !== dragNodeUid).concat({
-        parent: dragParentNodeUid,
+        parent: parentUid,
         child: dragNodeUid,
         mountPoint: mountPoint,
         sort: sortIndex,
-        $$isTemplateDelegated: isParentExpandableTemplate(nodes, dragParentNodeUid)
+        $$isTemplateDelegated: isParentExpandableTemplate(nodes, parentUid)
       }),
       wrapperNode
     };
     this.data = _objectSpread(_objectSpread({}, newData), {}, {
       edges: reorderBuilderEdges(newData, {
         parentUid,
-        nodeUids: sortUids
+        nodeUids
       })
     });
     this.triggerDataChange();
@@ -1141,7 +1314,7 @@ class BuilderDataManager {
       detail: {
         nodeUid: dragNodeUid,
         nodeInstanceId: nodeData.instanceId,
-        nodeIds: sortNodeIds,
+        nodeIds,
         nodeData: {
           parent: parnetNodeData.instanceId,
           mountPoint: mountPoint
@@ -1154,10 +1327,10 @@ class BuilderDataManager {
    */
 
 
-  moveMountPoint(_ref3, mountPoint, direction) {
+  moveMountPoint(_ref4, mountPoint, direction) {
     var {
       $$uid: parentUid
-    } = _ref3;
+    } = _ref4;
     var {
       relatedEdges,
       mountPoints
@@ -2252,63 +2425,6 @@ function getSortedIdsAfterDropped(droppingInfo) {
   };
 }
 
-var jsonFieldsInBrick = ["properties", "events", "lifeCycle", "params", "if", "transform"];
-var yamlFieldsInBrick = ["permissionsPreCheck", "transformFrom"];
-var ignoredFieldsInBrick = ["brick", "template", "portal", "slots", "id", "children", "instanceId"];
-// The reverse operation of *normalize*.
-// https://github.com/easyops-cn/next-basics/blob/5a6710d567821bcb4a0c71e22d55212193d8b0cb/bricks/next-builder/src/shared/storyboard/buildStoryboard.ts#L394
-function reverseNormalize(brickConf, ctx) {
-  return Object.fromEntries(Object.entries(brickConf).map(_ref => {
-    var [key, value] = _ref;
-    return value === undefined || ignoredFieldsInBrick.includes(key) ? undefined : jsonFieldsInBrick.includes(key) ? [key, JSON.stringify(value)] : yamlFieldsInBrick.includes(key) ? [key, yaml.safeDump(value)] : [key, value];
-  }).filter(Boolean).concat(Object.entries(ctx.nodeData), [["brick", ctx.nodeData.type === "template" ? brickConf.template : brickConf.brick], ["portal", ctx.isPortalCanvas || brickConf.portal]]));
-}
-
-function getSnippetNodeDetail(_ref) {
-  var {
-    parent,
-    parentUid,
-    mountPoint,
-    nodeUid,
-    brickConf,
-    isPortalCanvas,
-    sort
-  } = _ref;
-  var type = brickConf.template ? "template" : brickConf.bg ? "provider" : "brick";
-  return {
-    nodeUid,
-    parentUid,
-    nodeData: reverseNormalize(brickConf, {
-      isPortalCanvas,
-      nodeData: {
-        type,
-        parent,
-        mountPoint,
-        sort
-      }
-    }),
-    children: brickConf.slots ? Object.entries(brickConf.slots).flatMap(_ref2 => {
-      var [mountPoint, slotConf] = _ref2;
-      return slotConf.bricks.map(childBrickConf => ({
-        childBrickConf,
-        mountPoint
-      }));
-    }).map((_ref3, index) => {
-      var {
-        childBrickConf,
-        mountPoint
-      } = _ref3;
-      return getSnippetNodeDetail({
-        parentUid: nodeUid,
-        mountPoint,
-        nodeUid: getUniqueNodeId(),
-        brickConf: childBrickConf,
-        sort: index
-      });
-    }) : []
-  };
-}
-
 function processDrop(_ref) {
   var {
     manager,