@lemon-fe/components 1.3.7-alpha.0 → 1.3.7

package/es/data-grid/components/custom-panel/index.js

@@ -211,7 +211,7 @@ export default function CustomColumnPanel(params) {
       if ((e.type === 'columnMoved' || e.type === 'columnResized') && !e.finished) {
         return;
       }
-      if ((e.type === 'columnMoved' || e.type === 'columnResized' || e.type === 'columnPinned') && e.source !== 'api' && e.api.getOpenedToolPanel() !== 'columns' && enableSave) {
+      if ((e.type === 'columnMoved' || e.type === 'columnResized' || e.type === 'columnPinned' || e.type === 'columnVisible') && e.source !== 'api' && e.api.getOpenedToolPanel() !== 'columns' && enableSave) {
         save('ui');
       }
       handleColumnState();

package/es/index.d.ts

@@ -32,7 +32,7 @@ export { default as DataGrid, type DataGridRef } from './data-grid';
 export * from './data-grid/typings';
 export * from './data-grid/hooks';
 export { default as TipMark } from './tip-mark';
-export { default as Portal } from './portal';
+export { default as Portal, createPortal } from './portal';
 export { default as State } from './state';
 export { default as GreyPanel } from './grey-panel';
 export { default as InputCompact } from './input-compact';

package/es/index.js

@@ -26,7 +26,7 @@ export { default as DataGrid } from "./data-grid";
 export * from "./data-grid/typings";
 export * from "./data-grid/hooks";
 export { default as TipMark } from "./tip-mark";
-export { default as Portal } from "./portal";
+export { default as Portal, createPortal } from "./portal";
 export { default as State } from "./state";
 export { default as GreyPanel } from "./grey-panel";
 export { default as InputCompact } from "./input-compact";

package/es/portal/index.d.ts

@@ -1,22 +1,52 @@
-import React from 'react';
+import React, { type ReactElement } from 'react';
 import type { ReactNode } from 'react';
 declare type ContentType = ReactNode;
-declare function PortalHost(props: {
-    children: ContentType;
-}): JSX.Element;
-declare function Portal(props: {
-    children: ContentType;
-    slot: string;
-}): null;
-declare namespace Portal {
-    var Host: typeof PortalHost;
-    var Slot: React.NamedExoticComponent<{
+declare type Nodes = Map<string, Map<string, ContentType>>;
+interface Observer<T> {
+    next: (state: T) => void;
+}
+export interface PortalContext {
+    set: (slot: string, id: string, node: ContentType) => void;
+    delete: (slot: string, id: string) => void;
+    observable: {
+        subscribe: (observer: Observer<Nodes>) => {
+            unsubscribe: () => void;
+        };
+        get: () => Nodes;
+    };
+}
+export declare function createPortal(): {
+    (props: {
+        children: ContentType;
         slot: string;
-        render?: ((children: React.ReactNode) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null) | undefined;
+    }): null;
+    Host: (props: {
+        children: ContentType;
+    }) => JSX.Element;
+    Slot: React.NamedExoticComponent<{
+        slot: string;
+        render?: ((children: ReactNode) => ReactElement | null) | undefined;
     }>;
-    var usePortal: (slot: string) => {
-        add: (node: React.ReactNode) => void;
+    usePortal: (slot: string) => {
+        add: (node: ReactNode) => void;
         remove: () => void;
     };
-}
+};
+declare const Portal: {
+    (props: {
+        children: ContentType;
+        slot: string;
+    }): null;
+    Host: (props: {
+        children: ContentType;
+    }) => JSX.Element;
+    Slot: React.NamedExoticComponent<{
+        slot: string;
+        render?: ((children: ReactNode) => ReactElement | null) | undefined;
+    }>;
+    usePortal: (slot: string) => {
+        add: (node: ReactNode) => void;
+        remove: () => void;
+    };
+};
 export default Portal;

package/es/portal/index.js

@@ -14,20 +14,6 @@ var Slot = /*#__PURE__*/memo(function Content(props) {
   var children = props.children;
   return /*#__PURE__*/React.createElement(React.Fragment, null, children);
 });
-var Context = /*#__PURE__*/createContext({
-  set: function set() {},
-  delete: function _delete() {},
-  observable: {
-    subscribe: function subscribe() {
-      return {
-        unsubscribe: function unsubscribe() {}
-      };
-    },
-    get: function get() {
-      return new Map();
-    }
-  }
-});
 function Subject(initialData) {
   var observers = [];
   var data = initialData;
@@ -56,124 +42,146 @@ function Subject(initialData) {
     }
   };
 }
-function PortalHost(props) {
-  var children = props.children;
-  var _useState = useState(new Map()),
-    _useState2 = _slicedToArray(_useState, 2),
-    nodes = _useState2[0],
-    setNodes = _useState2[1];
-  var observable = useMemo(function () {
-    return Subject(nodes);
-  }, []);
-  var portal = useMemo(function () {
-    return {
-      set: function set(slot, id, node) {
-        setNodes(function (prev) {
-          var next = new Map(prev);
-          var elms = new Map(next.get(slot));
-          elms.set(id, node);
-          next.set(slot, elms);
-          return next;
-        });
-      },
-      delete: function _delete(slot, id) {
-        setNodes(function (prev) {
-          var next = new Map(prev);
-          var elms = new Map(next.get(slot));
-          if (elms) {
-            elms.delete(id);
-          }
-          if (elms.size <= 0) {
-            next.delete(slot);
+var defaultContext = {
+  set: function set() {},
+  delete: function _delete() {},
+  observable: {
+    subscribe: function subscribe() {
+      return {
+        unsubscribe: function unsubscribe() {}
+      };
+    },
+    get: function get() {
+      return new Map();
+    }
+  }
+};
+
+// 用工厂函数生成，目的是为了可以实现不同Portal上下文，从而实现挂载节点到多个上下文内
+
+export function createPortal() {
+  var Context = /*#__PURE__*/createContext(defaultContext);
+  function PortalHost(props) {
+    var children = props.children;
+    var _useState = useState(new Map()),
+      _useState2 = _slicedToArray(_useState, 2),
+      nodes = _useState2[0],
+      setNodes = _useState2[1];
+    var observable = useMemo(function () {
+      return Subject(nodes);
+    }, []);
+    var portal = useMemo(function () {
+      return {
+        set: function set(slot, id, node) {
+          setNodes(function (prev) {
+            var next = new Map(prev);
+            var elms = new Map(next.get(slot));
+            elms.set(id, node);
+            next.set(slot, elms);
+            return next;
+          });
+        },
+        delete: function _delete(slot, id) {
+          setNodes(function (prev) {
+            var next = new Map(prev);
+            var elms = new Map(next.get(slot));
+            if (elms) {
+              elms.delete(id);
+            }
+            if (elms.size <= 0) {
+              next.delete(slot);
+            }
+            return next;
+          });
+        },
+        observable: observable
+      };
+    }, []);
+    useEffect(function () {
+      observable.next(nodes);
+    }, [nodes]);
+    return /*#__PURE__*/React.createElement(Context.Provider, {
+      value: portal
+    }, /*#__PURE__*/React.createElement(Slot, null, children));
+  }
+  var PortalSlot = /*#__PURE__*/memo(function PortalSlotContent(props) {
+    var slot = props.slot,
+      render = props.render;
+    var _useContext = useContext(Context),
+      observable = _useContext.observable;
+    var _useState3 = useState(observable.get().get(slot) || null),
+      _useState4 = _slicedToArray(_useState3, 2),
+      node = _useState4[0],
+      setNode = _useState4[1];
+    useEffect(function () {
+      var _observable$subscribe = observable.subscribe({
+          next: function next(state) {
+            setNode(state.get(slot) || null);
           }
-          return next;
-        });
-      },
-      observable: observable
-    };
-  }, []);
-  useEffect(function () {
-    observable.next(nodes);
-  }, [nodes]);
-  return /*#__PURE__*/React.createElement(Context.Provider, {
-    value: portal
-  }, /*#__PURE__*/React.createElement(Slot, null, children));
-}
-var PortalSlot = /*#__PURE__*/memo(function PortalSlotContent(props) {
-  var slot = props.slot,
-    render = props.render;
-  var _useContext = useContext(Context),
-    observable = _useContext.observable;
-  var _useState3 = useState(observable.get().get(slot) || null),
-    _useState4 = _slicedToArray(_useState3, 2),
-    node = _useState4[0],
-    setNode = _useState4[1];
-  useEffect(function () {
-    var _observable$subscribe = observable.subscribe({
-        next: function next(state) {
-          setNode(state.get(slot) || null);
-        }
-      }),
-      unsubscribe = _observable$subscribe.unsubscribe;
-    return unsubscribe;
-  }, [slot]);
-  var result = useMemo(function () {
-    if (node === null) {
-      return null;
+        }),
+        unsubscribe = _observable$subscribe.unsubscribe;
+      return unsubscribe;
+    }, [slot]);
+    var result = useMemo(function () {
+      if (node === null) {
+        return null;
+      }
+      return _toConsumableArray(node).map(function (_ref) {
+        var _ref2 = _slicedToArray(_ref, 2),
+          id = _ref2[0],
+          elm = _ref2[1];
+        return /*#__PURE__*/React.createElement(Fragment, {
+          key: id
+        }, elm);
+      });
+    }, [node]);
+    if (render) {
+      return result ? render(result) : null;
     }
-    return _toConsumableArray(node).map(function (_ref) {
-      var _ref2 = _slicedToArray(_ref, 2),
-        id = _ref2[0],
-        elm = _ref2[1];
-      return /*#__PURE__*/React.createElement(Fragment, {
-        key: id
-      }, elm);
-    });
-  }, [node]);
-  if (render) {
-    return result ? render(result) : null;
+    return /*#__PURE__*/React.createElement(React.Fragment, null, result);
+  });
+  function Portal(props) {
+    var slot = props.slot,
+      children = props.children;
+    var portal = useContext(Context);
+    var id = useMemo(function () {
+      return uniqueId('slot');
+    }, []);
+    useEffect(function () {
+      return function () {
+        portal.delete(slot, id);
+      };
+    }, [slot]);
+    useEffect(function () {
+      portal.set(slot, id, children);
+    }, [slot, children]);
+    return null;
   }
-  return /*#__PURE__*/React.createElement(React.Fragment, null, result);
-});
-function Portal(props) {
-  var slot = props.slot,
-    children = props.children;
-  var portal = useContext(Context);
-  var id = useMemo(function () {
-    return uniqueId('slot');
-  }, []);
-  useEffect(function () {
-    return function () {
-      portal.delete(slot, id);
-    };
-  }, [slot]);
-  useEffect(function () {
-    portal.set(slot, id, children);
-  }, [slot, children]);
-  return null;
-}
-function usePortal(slot) {
-  var portal = useContext(Context);
-  var id = useMemo(function () {
-    return uniqueId('slot');
-  }, []);
-  useEffect(function () {
-    return function () {
+  function usePortal(slot) {
+    var portal = useContext(Context);
+    var id = useMemo(function () {
+      return uniqueId('slot');
+    }, []);
+    useEffect(function () {
+      return function () {
+        portal.delete(slot, id);
+      };
+    }, [slot]);
+    var add = useCallback(function (node) {
+      portal.set(slot, id, node);
+    }, [slot]);
+    var remove = useCallback(function () {
       portal.delete(slot, id);
+    }, [slot]);
+    return {
+      add: add,
+      remove: remove
     };
-  }, [slot]);
-  var add = useCallback(function (node) {
-    portal.set(slot, id, node);
-  }, [slot]);
-  var remove = useCallback(function () {
-    portal.delete(slot, id);
-  }, [slot]);
-  return {
-    add: add,
-    remove: remove
-  };
+  }
+  Portal.Host = PortalHost;
+  Portal.Slot = PortalSlot;
+  Portal.usePortal = usePortal;
+  return Portal;
 }
-Portal.Host = PortalHost;
-Portal.Slot = PortalSlot;
-Portal.usePortal = usePortal;
+var Portal = createPortal();
 export default Portal;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lemon-fe/components",
-  "version": "1.3.7-alpha.0",
+  "version": "1.3.7",
   "description": "> TODO: description",
   "homepage": "",
   "license": "MIT",
@@ -58,5 +58,5 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
-  "gitHead": "d028d80cfa4608351b34c1804ee709c659b86889"
+  "gitHead": "b41f095b38f4e4d26ea4554c4c5680aa868f41d9"
 }