@nocobase/plugin-graph-collection-manager 0.10.1-alpha.1 → 0.11.1-alpha.1

package/client.d.ts

@@ -1,4 +1,3 @@
-// @ts-nocheck
-export * from './lib/client';
-export { default } from './lib/client';
+export * from './src/client';
+export { default } from './src/client';
 

package/client.js

@@ -1,30 +1 @@
-"use strict";
-
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-var _index = _interopRequireWildcard(require("./lib/client"));
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {};
-Object.defineProperty(exports, "default", {
-  enumerable: true,
-  get: function get() {
-    return _index.default;
-  }
-});
-
-Object.keys(_index).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _index[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _index[key];
-    }
-  });
-});
+module.exports = require('./lib/client/index.js');

package/lib/client/GraphCollectionProvider.js

@@ -20,7 +20,6 @@ function _react() {
 }
 var _GraphCollectionShortcut = require("./GraphCollectionShortcut");
 var _utils = require("./utils");
-const _excluded = ["routes", "components"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -28,14 +27,8 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 const GraphCollectionProvider = _react().default.memo(props => {
   const ctx = (0, _react().useContext)(_client().PluginManagerContext);
-  const _useContext = (0, _react().useContext)(_client().RouteSwitchContext),
-    routes = _useContext.routes,
-    components = _useContext.components,
-    others = _objectWithoutProperties(_useContext, _excluded);
   // i18n.addResources('en-US', 'graphPositions', enUS);
   // i18n.addResources('ja-JP', 'graphPositions', jaJP);
   // i18n.addResources('zh-CN', 'graphPositions', zhCN);
@@ -52,13 +45,7 @@ const GraphCollectionProvider = _react().default.memo(props => {
     value: {
       components: _objectSpread({}, ctx === null || ctx === void 0 ? void 0 : ctx.components)
     }
-  }, _react().default.createElement(_client().RouteSwitchContext.Provider, {
-    value: _objectSpread(_objectSpread({
-      components: _objectSpread({}, components)
-    }, others), {}, {
-      routes
-    })
-  }, props.children)));
+  }, props.children));
 });
 exports.GraphCollectionProvider = GraphCollectionProvider;
 GraphCollectionProvider.displayName = 'GraphCollectionProvider';

package/lib/client/GraphCollectionShortcut.js

@@ -11,13 +11,6 @@ function _icons() {
   };
   return data;
 }
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
-    return data;
-  };
-  return data;
-}
 function _shared() {
   const data = require("@formily/shared");
   _shared = function _shared() {
@@ -39,8 +32,8 @@ function _react() {
   };
   return data;
 }
-var _GraphDrawPage = require("./GraphDrawPage");
 var _actionHooks = require("./action-hooks");
+var _GraphDrawPage = require("./GraphDrawPage");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -145,7 +138,7 @@ const useCollectionValues = options => {
 };
 const GraphCollectionPane = () => {
   return _react().default.createElement("div", {
-    className: (0, _css().css)`
+    className: (0, _client().css)`
         height: calc(100vh - 160px);
         overflow: auto;
         margin: calc(var(--nb-spacing) * -1);

package/lib/client/GraphDrawPage.js

@@ -19,13 +19,6 @@ function _x4() {
   return data;
 }
 require("@antv/x6-react-shape");
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
-    return data;
-  };
-  return data;
-}
 function _react() {
   const data = require("@formily/react");
   _react = function _react() {
@@ -40,6 +33,13 @@ function _client() {
   };
   return data;
 }
+function _client2() {
+  const data = require("@nocobase/utils/client");
+  _client2 = function _client2() {
+    return data;
+  };
+  return data;
+}
 function _ahooks() {
   const data = require("ahooks");
   _ahooks = function _ahooks() {
@@ -61,13 +61,6 @@ function _dagre() {
   };
   return data;
 }
-function _lodash() {
-  const data = require("lodash");
-  _lodash = function _lodash() {
-    return data;
-  };
-  return data;
-}
 function _react2() {
   const data = _interopRequireWildcard(require("react"));
   _react2 = function _react2() {
@@ -79,7 +72,7 @@ var _actionHooks = require("./action-hooks");
 var _AddCollectionAction = require("./components/AddCollectionAction");
 var _Entity = _interopRequireDefault(require("./components/Entity"));
 var _ViewNode = require("./components/ViewNode");
-var _style = require("./style");
+var _style = _interopRequireDefault(require("./style"));
 var _utils = require("./utils");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -97,6 +90,12 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typ
 function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+const drop = _client2().lodash.drop,
+  groupBy = _client2().lodash.groupBy,
+  last = _client2().lodash.last,
+  maxBy = _client2().lodash.maxBy,
+  minBy = _client2().lodash.minBy,
+  take = _client2().lodash.take;
 const LINE_HEIGHT = 40;
 const NODE_WIDTH = 250;
 let targetGraph;
@@ -184,7 +183,7 @@ function _layout() {
     });
     targetGraph.unfreeze();
     if (targetNode) {
-      typeof targetNode === 'string' ? targetGraph.positionCell((0, _lodash().last)(nodes), 'top', {
+      typeof targetNode === 'string' ? targetGraph.positionCell(last(nodes), 'top', {
         padding: 100
       }) : targetGraph.positionCell(targetNode, 'top', {
         padding: 100
@@ -307,7 +306,7 @@ const formatNodeData = () => {
     layoutNodes.push(edge.getSourceCellId());
     layoutNodes.push(edge.getTargetCellId());
   });
-  const nodeGroup = (0, _lodash().groupBy)(nodes, v => {
+  const nodeGroup = groupBy(nodes, v => {
     if (layoutNodes.includes(v.id)) {
       return 'linkNodes';
     } else {
@@ -357,8 +356,8 @@ const handelResetLayout = () => {
   _dagre().default.layout(g);
   targetGraph.freeze();
   const gNodes = g.nodes();
-  const nodeWithEdges = (0, _lodash().take)(gNodes, linkNodes.length);
-  const nodeWithoutEdges = (0, _lodash().drop)(gNodes, linkNodes.length);
+  const nodeWithEdges = take(gNodes, linkNodes.length);
+  const nodeWithoutEdges = drop(gNodes, linkNodes.length);
   nodeWithEdges.forEach(id => {
     var _positions$find;
     const node = targetGraph.getCell(id);
@@ -375,25 +374,25 @@ const handelResetLayout = () => {
   });
   if (nodeWithEdges.length) {
     var _targetGraph$getCell;
-    maxY = targetGraph.getCellById((0, _lodash().maxBy)(nodeWithEdges, k => {
+    maxY = targetGraph.getCellById(maxBy(nodeWithEdges, k => {
       return targetGraph.getCellById(k).position().y;
     })).position().y;
-    minX = targetGraph.getCellById((0, _lodash().minBy)(nodeWithEdges, k => {
+    minX = targetGraph.getCellById(minBy(nodeWithEdges, k => {
       return targetGraph.getCellById(k).position().x;
     })).position().x;
-    const maxX = targetGraph.getCellById((0, _lodash().maxBy)(nodeWithEdges, k => {
+    const maxX = targetGraph.getCellById(maxBy(nodeWithEdges, k => {
       return targetGraph.getCellById(k).position().x;
     })).position().x;
     const yNodes = nodeWithEdges.filter(v => {
       return Math.abs(targetGraph.getCellById(v).position().y - maxY) < 50;
     });
-    const referenceNode = (_targetGraph$getCell = targetGraph.getCell((0, _lodash().maxBy)(yNodes, k => targetGraph.getCellById(k).position().x))) === null || _targetGraph$getCell === void 0 ? void 0 : _targetGraph$getCell.position();
+    const referenceNode = (_targetGraph$getCell = targetGraph.getCell(maxBy(yNodes, k => targetGraph.getCellById(k).position().x))) === null || _targetGraph$getCell === void 0 ? void 0 : _targetGraph$getCell.position();
     num = Math.round(maxX / 320) || 1;
     alternateNum = Math.floor((4500 - (maxX + 100 - referenceNode.x)) / 280);
     rawEntity = getGridData(num, rawNodes);
     if (alternateNum >= 1) {
-      const alternateNodes = (0, _lodash().take)(nodeWithoutEdges, alternateNum);
-      rawEntity = getGridData(num, (0, _lodash().drop)(nodeWithoutEdges, alternateNum));
+      const alternateNodes = take(nodeWithoutEdges, alternateNum);
+      rawEntity = getGridData(num, drop(nodeWithoutEdges, alternateNum));
       alternateNodes.forEach((id, index) => {
         const node = targetGraph.getCell(id);
         if (node) {
@@ -450,6 +449,10 @@ const handelResetLayout = () => {
 };
 const GraphDrawPage = _react2().default.memo(() => {
   var _targetGraph7;
+  const _useGlobalTheme = (0, _client().useGlobalTheme)(),
+    theme = _useGlobalTheme.theme;
+  const _useStyles = (0, _style.default)(),
+    styles = _useStyles.styles;
   const options = (0, _react2().useContext)(_react().SchemaOptionsContext);
   const ctx = (0, _react2().useContext)(_client().CollectionManagerContext);
   const api = (0, _client().useAPIClient)();
@@ -635,6 +638,8 @@ const GraphDrawPage = _react2().default.memo(() => {
           collections: (_targetGraph2 = targetGraph) === null || _targetGraph2 === void 0 ? void 0 : _targetGraph2.collections,
           refreshCM: refreshGM,
           interfaces: ctx.interfaces
+        }, _react2().default.createElement(_antd().ConfigProvider, {
+          theme: theme
         }, _react2().default.createElement("div", {
           style: {
             height: 'auto'
@@ -643,7 +648,7 @@ const GraphDrawPage = _react2().default.memo(() => {
           node: node,
           setTargetNode: setTargetNode,
           targetGraph: targetGraph
-        })))))));
+        }))))))));
       },
       ports: {
         groups: {
@@ -711,7 +716,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     });
     targetGraph.on('blank:click', e => {
       var _targetGraph3, _targetGraph$collapse;
-      if ((_targetGraph3 = targetGraph) === null || _targetGraph3 === void 0 ? void 0 : _targetGraph3.activeEdge) {
+      if ((_targetGraph3 = targetGraph) !== null && _targetGraph3 !== void 0 && _targetGraph3.activeEdge) {
         var _targetGraph4;
         handleEdgeUnActive((_targetGraph4 = targetGraph) === null || _targetGraph4 === void 0 ? void 0 : _targetGraph4.activeEdge);
       }
@@ -861,7 +866,7 @@ const GraphDrawPage = _react2().default.memo(() => {
       inheritEdges = _formatData2.inheritEdges;
     const currentNodes = targetGraph.getNodes().map(v => v.store.data);
     const totalEdges = targetGraph.getEdges().map(v => v.store.data);
-    const currentEdgesGroup = (0, _lodash().groupBy)(totalEdges, v => {
+    const currentEdgesGroup = groupBy(totalEdges, v => {
       if (v.connectionType) {
         return 'currentInheritEdges';
       } else {
@@ -879,15 +884,15 @@ const GraphDrawPage = _react2().default.memo(() => {
       const updateNode = targetGraph.getCellById(node.id);
       switch (status) {
         case 'add':
-          const maxY = (0, _lodash().maxBy)(positions, 'y').y;
+          const maxY = maxBy(positions, 'y').y;
           const yNodes = positions.filter(v => {
             return Math.abs(v.y - maxY) < 100;
           });
-          let referenceNode = (0, _lodash().maxBy)(yNodes, 'x');
+          let referenceNode = maxBy(yNodes, 'x');
           let position;
           if (referenceNode.x > 4500) {
-            const minX = (0, _lodash().minBy)(positions, 'x').x;
-            referenceNode = (0, _lodash().minBy)(yNodes, 'x');
+            const minX = minBy(positions, 'x').x;
+            referenceNode = minBy(yNodes, 'x');
             position = {
               x: minX,
               y: referenceNode.y + 400
@@ -990,7 +995,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     const connectedEdges = targetGraph.getConnectedEdges(node);
     const visibleEdges = connectedEdges.filter(v => {
       var _v$store$data;
-      return !((_v$store$data = v.store.data) === null || _v$store$data === void 0 ? void 0 : _v$store$data.connectionType) && v.getTargetCellId() === key;
+      return !((_v$store$data = v.store.data) !== null && _v$store$data !== void 0 && _v$store$data.connectionType) && v.getTargetCellId() === key;
     });
     visibleEdges.forEach(v => {
       var _node$store$data$attr2;
@@ -1001,7 +1006,7 @@ const GraphDrawPage = _react2().default.memo(() => {
             var _node$store$data$attr;
             const sourceId = m2mEdge.getSourceCellId();
             const node = targetGraph.getCellById(sourceId);
-            if (!((_node$store$data$attr = node.store.data.attrs) === null || _node$store$data$attr === void 0 ? void 0 : _node$store$data$attr.hightLight)) {
+            if (!((_node$store$data$attr = node.store.data.attrs) !== null && _node$store$data$attr !== void 0 && _node$store$data$attr.hightLight)) {
               node.setAttrs({
                 hightLight: true,
                 direction: DirectionType.Target,
@@ -1014,7 +1019,7 @@ const GraphDrawPage = _react2().default.memo(() => {
       }
       const sourceId = v.getSourceCellId();
       const node = targetGraph.getCellById(sourceId);
-      if (!((_node$store$data$attr2 = node.store.data.attrs) === null || _node$store$data$attr2 === void 0 ? void 0 : _node$store$data$attr2.hightLight)) {
+      if (!((_node$store$data$attr2 = node.store.data.attrs) !== null && _node$store$data$attr2 !== void 0 && _node$store$data$attr2.hightLight)) {
         node.setAttrs({
           hightLight: true,
           direction: DirectionType.Target,
@@ -1030,7 +1035,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     const connectedEdges = targetGraph.getConnectedEdges(node);
     const visibleEdges = connectedEdges.filter(v => {
       var _v$store$data2;
-      return !((_v$store$data2 = v.store.data) === null || _v$store$data2 === void 0 ? void 0 : _v$store$data2.connectionType) && v.getSourceCellId() === key;
+      return !((_v$store$data2 = v.store.data) !== null && _v$store$data2 !== void 0 && _v$store$data2.connectionType) && v.getSourceCellId() === key;
     });
     visibleEdges.forEach(v => {
       var _node$store$data$attr4;
@@ -1041,7 +1046,7 @@ const GraphDrawPage = _react2().default.memo(() => {
             var _node$store$data$attr3;
             const targetId = m2mEdge.getTargetCellId();
             const node = targetGraph.getCellById(targetId);
-            if (!((_node$store$data$attr3 = node.store.data.attrs) === null || _node$store$data$attr3 === void 0 ? void 0 : _node$store$data$attr3.hightLight)) {
+            if (!((_node$store$data$attr3 = node.store.data.attrs) !== null && _node$store$data$attr3 !== void 0 && _node$store$data$attr3.hightLight)) {
               node.setAttrs({
                 hightLight: true,
                 direction: DirectionType.Source,
@@ -1054,7 +1059,7 @@ const GraphDrawPage = _react2().default.memo(() => {
       }
       const targetId = v.getTargetCellId();
       const node = targetGraph.getCellById(targetId);
-      if (!((_node$store$data$attr4 = node.store.data.attrs) === null || _node$store$data$attr4 === void 0 ? void 0 : _node$store$data$attr4.hightLight)) {
+      if (!((_node$store$data$attr4 = node.store.data.attrs) !== null && _node$store$data$attr4 !== void 0 && _node$store$data$attr4.hightLight)) {
         node.setAttrs({
           hightLight: true,
           direction: DirectionType.Source,
@@ -1194,7 +1199,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     };
   }();
   return _react2().default.createElement(_antd().Layout, null, _react2().default.createElement("div", {
-    className: (0, _css().cx)(_style.graphCollectionContainerClass)
+    className: styles.graphCollectionContainerClass
   }, _react2().default.createElement(_client().CollectionManagerProvider, {
     collections: (_targetGraph7 = targetGraph) === null || _targetGraph7 === void 0 ? void 0 : _targetGraph7.collections,
     refreshCM: refreshGM
@@ -1204,11 +1209,11 @@ const GraphDrawPage = _react2().default.memo(() => {
       handleSearchCollection
     }
   }, _react2().default.createElement("div", {
-    className: (0, _css().cx)(_style.collectionListClass)
+    className: (0, _client().cx)(styles.collectionListClass)
   }, _react2().default.createElement(_client().SchemaComponent, {
     components: {
       Select: props => _react2().default.createElement(_client().Select, _objectSpread(_objectSpread({
-        dropdownMatchSelectWidth: false
+        popupMatchSelectWidth: false
       }, props), {}, {
         getPopupContainer: _utils.getPopupContainer
       })),
@@ -1299,7 +1304,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                     }), _react2().default.createElement(_antd().Menu, {
                       selectedKeys: selectedKeys,
                       selectable: true,
-                      className: (0, _css().css)`
+                      className: (0, _client().css)`
                                         .ant-menu-item {
                                           height: 32px;
                                           line-height: 32px;
@@ -1335,7 +1340,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                       placement: "bottomRight",
                       trigger: ['click'],
                       getPopupContainer: _utils.getPopupContainer,
-                      overlayClassName: (0, _css().css)`
+                      overlayClassName: (0, _client().css)`
                                       .ant-popover-inner-content {
                                         padding: 0;
                                       }
@@ -1388,7 +1393,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                     const content = _react2().default.createElement("div", null, _react2().default.createElement(_antd().Menu, {
                       defaultSelectedKeys: [ConnectionType.Both],
                       selectable: true,
-                      className: (0, _css().css)`
+                      className: (0, _client().css)`
                                         .ant-menu-item {
                                           height: 32px;
                                           line-height: 32px;
@@ -1421,7 +1426,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                       placement: "bottomRight",
                       trigger: ['click'],
                       getPopupContainer: _utils.getPopupContainer,
-                      overlayClassName: (0, _css().css)`
+                      overlayClassName: (0, _client().css)`
                                       .ant-popover-inner-content {
                                         padding: 0;
                                       }
@@ -1453,7 +1458,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                     const content = _react2().default.createElement("div", null, _react2().default.createElement(_antd().Menu, {
                       defaultSelectedKeys: [DirectionType.Target],
                       selectable: true,
-                      className: (0, _css().css)`
+                      className: (0, _client().css)`
                                         .ant-menu-item {
                                           height: 32px;
                                           line-height: 32px;
@@ -1487,7 +1492,7 @@ const GraphDrawPage = _react2().default.memo(() => {
                       placement: "bottomRight",
                       trigger: ['click'],
                       getPopupContainer: _utils.getPopupContainer,
-                      overlayClassName: (0, _css().css)`
+                      overlayClassName: (0, _client().css)`
                                       .ant-popover-inner-content {
                                         padding: 0;
                                       }
@@ -1527,6 +1532,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     }
   }), _react2().default.createElement("div", {
     id: "graph-minimap",
+    className: styles.graphMinimap,
     style: {
       width: '300px',
       height: '250px',

package/lib/client/action-hooks.d.ts

@@ -1,5 +1,18 @@
 import React from 'react';
-export declare const useValuesFromRecord: (options: any, data: any) => any;
+export declare const useValuesFromRecord: (options: any, data: any) => {
+    state: {};
+    setState: import("ahooks/lib/useSetState").SetState<{}>;
+    loading: boolean;
+    data?: unknown;
+    error?: Error;
+    params: any;
+    cancel: () => void;
+    refresh: () => void;
+    refreshAsync: () => Promise<unknown>;
+    run: (...params: any) => void;
+    runAsync: (...params: any) => Promise<unknown>;
+    mutate: (data?: unknown) => void;
+};
 export declare const SourceCollection: React.MemoExoticComponent<import("@formily/react").ReactFC<unknown>>;
 export declare const useCancelAction: () => {
     run(): Promise<void>;

package/lib/client/action-hooks.js

@@ -25,16 +25,16 @@ function _client() {
   };
   return data;
 }
-function _antd() {
-  const data = require("antd");
-  _antd = function _antd() {
+function _client2() {
+  const data = require("@nocobase/utils/client");
+  _client2 = function _client2() {
     return data;
   };
   return data;
 }
-function _omit() {
-  const data = _interopRequireDefault(require("lodash/omit"));
-  _omit = function _omit() {
+function _antd() {
+  const data = require("antd");
+  _antd = function _antd() {
     return data;
   };
   return data;
@@ -56,7 +56,6 @@ function _reactI18next() {
 var _CollectionNodeProvder = require("./components/CollectionNodeProvder");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
 function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -84,7 +83,7 @@ const SourceCollection = (0, _react().observer)(() => {
     record = _useContext.record;
   const compile = (0, _client().useCompile)();
   return _react2().default.createElement("div", null, _react2().default.createElement(_antd().Select, {
-    dropdownMatchSelectWidth: false,
+    popupMatchSelectWidth: false,
     disabled: true,
     value: record.name,
     options: [{
@@ -147,7 +146,7 @@ const useCreateAction = (collectionName, targetId) => {
       return _asyncToGenerator(function* () {
         yield form.submit();
         const values = getValues();
-        const formValues = (0, _omit().default)(values, ['key', 'uiSchemaUid', 'collectionName', 'autoCreateReverseField', 'uiSchema.x-uid', 'reverseField.key', 'reverseField.uiSchemaUid']);
+        const formValues = _client2().lodash.omit(values, ['key', 'uiSchemaUid', 'collectionName', 'autoCreateReverseField', 'uiSchema.x-uid', 'reverseField.key', 'reverseField.uiSchemaUid']);
         const isOpenPorts = !['obo', 'oho', 'o2o', 'o2m', 'm2o', 'm2m', 'linkTo', 'id'].includes(values.interface);
         const _yield$api$resource$c = yield api.resource('collections.fields', collectionName).create({
             values: formValues
@@ -223,7 +222,7 @@ const useUpdateCollectionActionAndRefreshCM = () => {
         yield form.submit();
         yield api.resource('collections').update({
           filterByTk: name,
-          values: _objectSpread({}, (0, _omit().default)(form.values, ['fields']))
+          values: _objectSpread({}, _client2().lodash.omit(form.values, ['fields']))
         });
         ctx.setVisible(false);
         _antd().message.success(t('Saved successfully'));
@@ -311,7 +310,9 @@ const useAsyncDataSource = service => {
     service(targetScope).then(_reactive().action.bound(data => {
       field.dataSource = data;
       field.loading = false;
-    }));
+    })).catch(err => {
+      (0, _client2().error)(err);
+    });
   };
 };
 exports.useAsyncDataSource = useAsyncDataSource;

package/lib/client/components/EditCollectionAction.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
-export declare const EditCollectionAction: ({ item: record }: {
+export declare const EditCollectionAction: ({ item: record, className }: {
     item: any;
+    className: any;
 }) => React.JSX.Element;

package/lib/client/components/EditCollectionAction.js

@@ -11,13 +11,6 @@ function _icons() {
   };
   return data;
 }
-function _css() {
-  const data = require("@emotion/css");
-  _css = function _css() {
-    return data;
-  };
-  return data;
-}
 function _client() {
   const data = require("@nocobase/client");
   _client = function _client() {
@@ -36,7 +29,8 @@ var _actionHooks = require("../action-hooks");
 var _utils = require("../utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const EditCollectionAction = ({
-  item: record
+  item: record,
+  className
 }) => {
   return _react().default.createElement(_client().EditCollection, {
     item: record,
@@ -47,17 +41,7 @@ const EditCollectionAction = ({
     },
     getContainer: _utils.getPopupContainer
   }, _react().default.createElement(_icons().EditOutlined, {
-    className: (0, _css().css)`
-          border-color: transparent;
-          color: rgb(78 89 105);
-          height: 20px;
-          width: 22px;
-          margin: 0px 5px 4px;
-          line-height: 25px;
-          &:hover {
-            background-color: rgb(229 230 235);
-          }
-        `
+    className: className
   }));
 };
 exports.EditCollectionAction = EditCollectionAction;