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

package/lib/client/GraphDrawPage.js

@@ -72,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; }
@@ -449,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)();
@@ -634,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'
@@ -642,7 +648,7 @@ const GraphDrawPage = _react2().default.memo(() => {
           node: node,
           setTargetNode: setTargetNode,
           targetGraph: targetGraph
-        })))))));
+        }))))))));
       },
       ports: {
         groups: {
@@ -1193,7 +1199,7 @@ const GraphDrawPage = _react2().default.memo(() => {
     };
   }();
   return _react2().default.createElement(_antd().Layout, null, _react2().default.createElement("div", {
-    className: (0, _client().cx)(_style.graphCollectionContainerClass)
+    className: styles.graphCollectionContainerClass
   }, _react2().default.createElement(_client().CollectionManagerProvider, {
     collections: (_targetGraph7 = targetGraph) === null || _targetGraph7 === void 0 ? void 0 : _targetGraph7.collections,
     refreshCM: refreshGM
@@ -1203,7 +1209,7 @@ const GraphDrawPage = _react2().default.memo(() => {
       handleSearchCollection
     }
   }, _react2().default.createElement("div", {
-    className: (0, _client().cx)(_style.collectionListClass)
+    className: (0, _client().cx)(styles.collectionListClass)
   }, _react2().default.createElement(_client().SchemaComponent, {
     components: {
       Select: props => _react2().default.createElement(_client().Select, _objectSpread(_objectSpread({
@@ -1526,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 _client2() {
-  const data = require("@nocobase/utils/client");
-  _client2 = function _client2() {
+function _antd() {
+  const data = require("antd");
+  _antd = function _antd() {
     return data;
   };
   return data;
@@ -310,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

@@ -29,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,
@@ -40,17 +41,7 @@ const EditCollectionAction = ({
     },
     getContainer: _utils.getPopupContainer
   }, _react().default.createElement(_icons().EditOutlined, {
-    className: (0, _client().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;

package/lib/client/components/Entity.js

@@ -48,7 +48,7 @@ function _react() {
   return data;
 }
 var _actionHooks = require("../action-hooks");
-var _style = require("../style");
+var _style = _interopRequireDefault(require("../style"));
 var _utils = require("../utils");
 var _AddFieldAction = require("./AddFieldAction");
 var _CollectionNodeProvder = require("./CollectionNodeProvder");
@@ -57,6 +57,7 @@ var _EditFieldAction = require("./EditFieldAction");
 var _FieldSummary = require("./FieldSummary");
 var _OverrideFieldAction = require("./OverrideFieldAction");
 var _ViewFieldAction = require("./ViewFieldAction");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
@@ -73,6 +74,8 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
 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); }
 const Entity = props => {
+  const _useStyles = (0, _style.default)(),
+    styles = _useStyles.styles;
   const node = props.node,
     setTargetNode = props.setTargetNode,
     targetGraph = props.targetGraph;
@@ -123,13 +126,14 @@ const Entity = props => {
     loadCollections
   };
   return _react().default.createElement("div", {
-    className: (0, _client().cx)(_style.entityContainer),
+    className: styles.entityContainer,
     style: {
       boxShadow: attrs === null || attrs === void 0 ? void 0 : attrs.boxShadow,
       border: select ? '2px dashed #f5a20a' : 0
     }
   }, category.map((v, index) => {
     return _react().default.createElement(_antd().Badge.Ribbon, {
+      key: index,
       color: v.color,
       style: {
         width: '103%',
@@ -140,15 +144,15 @@ const Entity = props => {
       placement: "start"
     });
   }), _react().default.createElement("div", {
-    className: _style.headClass,
+    className: styles.headClass,
     style: {
       background: attrs !== null && attrs !== void 0 && attrs.hightLight ? '#1890ff' : null,
       paddingTop: category.length * 3
     }
   }, _react().default.createElement("span", {
-    className: _style.tableNameClass
+    className: styles.tableNameClass
   }, compile(title)), _react().default.createElement("div", {
-    className: _style.tableBtnClass
+    className: styles.tableBtnClass
   }, _react().default.createElement(_client().SchemaComponentProvider, null, _react().default.createElement(_CollectionNodeProvder.CollectionNodeProvder, {
     setTargetNode: setTargetNode,
     node: node
@@ -185,7 +189,8 @@ const Entity = props => {
           'x-component': 'EditCollectionAction',
           'x-component-props': {
             type: 'primary',
-            item: collectionData.current
+            item: collectionData.current,
+            className: 'btn-edit-in-head'
           }
         },
         delete: {
@@ -195,16 +200,7 @@ const Entity = props => {
           'x-component-props': {
             component: _icons().DeleteOutlined,
             icon: 'DeleteOutlined',
-            className: (0, _client().css)`
-                            background-color: rgb(255 236 232);
-                            border-color: transparent;
-                            color: #e31c1c;
-                            height: 20px;
-                            padding: 5px;
-                            &:hover {
-                              background-color: rgb(253 205 197);
-                            }
-                          `,
+            className: 'btn-del',
             confirm: {
               title: "{{t('Delete record')}}",
               getContainer: _utils.getPopupContainer,
@@ -256,13 +252,15 @@ const PortsCom = _react().default.memo(({
     return `${prefix || ''}${(0, _shared().uid)()}`;
   };
   const CollectionConten = data => {
+    const _useStyles2 = (0, _style.default)(),
+      styles = _useStyles2.styles;
     const type = data.type,
       name = data.name,
       primaryKey = data.primaryKey,
       allowNull = data.allowNull,
       autoIncrement = data.autoIncrement;
     return _react().default.createElement("div", {
-      className: (0, _client().cx)(_style.collectiionPopoverClass)
+      className: styles.collectionPopoverClass
     }, _react().default.createElement("div", {
       className: "field-content"
     }, _react().default.createElement("div", null, _react().default.createElement("span", null, "name"), ": ", _react().default.createElement("span", {
@@ -368,17 +366,7 @@ const PortsCom = _react().default.memo(({
             'x-component-props': {
               component: _icons().DeleteOutlined,
               icon: 'DeleteOutlined',
-              className: (0, _client().css)`
-                        background-color: rgb(255 236 232);
-                        border-color: transparent;
-                        color: #e31c1c;
-                        height: 20px;
-                        width: 20px;
-                        padding: 5px;
-                        &:hover {
-                          background-color: rgb(253 205 197);
-                        }
-                      `,
+              className: 'btn-del',
               confirm: {
                 title: "{{t('Delete record')}}",
                 getContainer: _utils.getPopupContainer,

package/lib/client/style.d.ts

@@ -1,9 +1,12 @@
-export declare const nodeSubtreeClass: string;
-export declare const addButtonClass: string;
-export declare const entityContainer: string;
-export declare const headClass: string;
-export declare const tableNameClass: string;
-export declare const tableBtnClass: string;
-export declare const collectiionPopoverClass: string;
-export declare const collectionListClass: string;
-export declare const graphCollectionContainerClass: string;
+declare const useStyles: (props?: unknown) => import("antd-style").ReturnStyles<{
+    graphMinimap: import("antd-style").SerializedStyles;
+    addButtonClass: import("antd-style").SerializedStyles;
+    entityContainer: import("antd-style").SerializedStyles;
+    headClass: import("antd-style").SerializedStyles;
+    tableNameClass: import("antd-style").SerializedStyles;
+    tableBtnClass: import("antd-style").SerializedStyles;
+    collectionPopoverClass: import("antd-style").SerializedStyles;
+    collectionListClass: import("antd-style").SerializedStyles;
+    graphCollectionContainerClass: import("antd-style").SerializedStyles;
+}>;
+export default useStyles;