@chaoswise/ui 2.5.9 → 2.6.1

package/lib/ColorPicker/index.js

@@ -9,18 +9,18 @@ import _Input from "@chaoswise/ui/lib/Input";
 import _useLocale2 from "@chaoswise/ui/lib/useLocale";
 import "@chaoswise/ui/lib/Tabs/index.less";
 import _Tabs from "@chaoswise/ui/lib/Tabs";
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-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 _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
 import React, { useEffect, useState } from "react";
 import SketchPicker from "./SketchPicker/components/sketch";
 import classnames from "classnames";

package/lib/ConfigProvider/ConfigProvider.js

@@ -2,20 +2,20 @@ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" ==
 import "antd/es/config-provider/style";
 import _ConfigProvider from "antd/es/config-provider";
 var _excluded = ["children", "locales", "defaultLocale", "messages"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-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 _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-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; }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
 import React, { useEffect, useState } from 'react';
 import Antd4ConfigProvider from '../Antd4/config-provider';
 import { IntlProvider } from 'react-intl';

package/lib/CustomNotification/PurePanel.js

@@ -0,0 +1,126 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+import _Icon from "@chaoswise/ui/lib/Icon";
+var _excluded = ["prefixCls", "className", "icon", "type", "message", "description", "btn", "closable", "closeIcon", "className"];
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], t.indexOf(o) >= 0 || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
+function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.indexOf(n) >= 0) continue; t[n] = r[n]; } return t; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+import React from "react";
+import classNames from "classnames";
+import { Notice } from "rc-notification-v5";
+import { ConfigContext } from "antd/es/config-provider/context";
+export var TypeIcon = {
+  info: /*#__PURE__*/React.createElement(_Icon, {
+    type: "info-circle"
+  }),
+  success: /*#__PURE__*/React.createElement(_Icon, {
+    type: "check-circle"
+  }),
+  error: /*#__PURE__*/React.createElement(_Icon, {
+    type: "close-circle"
+  }),
+  warning: /*#__PURE__*/React.createElement(_Icon, {
+    type: "exclamation-circle"
+  }),
+  loading: /*#__PURE__*/React.createElement(_Icon, {
+    type: "loading",
+    theme: "outlined"
+  })
+};
+export function getCloseIcon(prefixCls, closeIcon) {
+  if (closeIcon === null || closeIcon === false) {
+    return null;
+  }
+  return closeIcon || /*#__PURE__*/React.createElement(_Icon, {
+    type: "close",
+    theme: "outlined",
+    className: "".concat(prefixCls, "-close-icon")
+  });
+}
+var typeToIcon = {
+  success: /*#__PURE__*/React.createElement(_Icon, {
+    type: "check-circle"
+  }),
+  info: /*#__PURE__*/React.createElement(_Icon, {
+    type: "info-circle"
+  }),
+  error: /*#__PURE__*/React.createElement(_Icon, {
+    type: "close-circle"
+  }),
+  warning: /*#__PURE__*/React.createElement(_Icon, {
+    type: "exclamation-circle"
+  })
+};
+export var PureContent = function PureContent(props) {
+  var prefixCls = props.prefixCls,
+    icon = props.icon,
+    type = props.type,
+    message = props.message,
+    description = props.description,
+    btn = props.btn,
+    _props$role = props.role,
+    role = _props$role === void 0 ? "alert" : _props$role;
+  var iconNode = null;
+  if (icon) {
+    iconNode = /*#__PURE__*/React.createElement("span", {
+      className: "".concat(prefixCls, "-icon")
+    }, icon);
+  } else if (type) {
+    iconNode = /*#__PURE__*/React.createElement(typeToIcon[type] || null, {
+      className: classNames("".concat(prefixCls, "-icon"), "".concat(prefixCls, "-icon-").concat(type))
+    });
+  }
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames(_defineProperty({}, "".concat(prefixCls, "-with-icon"), iconNode)),
+    role: role
+  }, iconNode, /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-message")
+  }, message), /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-description")
+  }, description), btn && /*#__PURE__*/React.createElement("div", {
+    className: "".concat(prefixCls, "-btn")
+  }, btn));
+};
+
+/** @private Internal Component. Do not use in your production. */
+var PurePanel = function PurePanel(props) {
+  var staticPrefixCls = props.prefixCls,
+    className = props.className,
+    icon = props.icon,
+    type = props.type,
+    message = props.message,
+    description = props.description,
+    btn = props.btn,
+    _props$closable = props.closable,
+    closable = _props$closable === void 0 ? true : _props$closable,
+    closeIcon = props.closeIcon,
+    notificationClassName = props.className,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var _React$useContext = React.useContext(ConfigContext),
+    getPrefixCls = _React$useContext.getPrefixCls;
+  var prefixCls = staticPrefixCls || getPrefixCls("notification");
+  var noticePrefixCls = "".concat(prefixCls, "-notice");
+  return /*#__PURE__*/React.createElement("div", {
+    className: classNames("".concat(noticePrefixCls, "-pure-panel"), className)
+  }, /*#__PURE__*/React.createElement(Notice, _extends({}, restProps, {
+    prefixCls: prefixCls,
+    eventKey: "pure",
+    duration: null,
+    closable: closable,
+    className: classNames({
+      notificationClassName: notificationClassName
+    }),
+    closeIcon: getCloseIcon(prefixCls, closeIcon),
+    content: /*#__PURE__*/React.createElement(PureContent, {
+      prefixCls: noticePrefixCls,
+      icon: icon,
+      type: type,
+      message: message,
+      description: description,
+      btn: btn
+    })
+  })));
+};
+export default PurePanel;

package/lib/CustomNotification/index.js

@@ -0,0 +1,210 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+import _ConfigProvider from "@chaoswise/ui/lib/ConfigProvider";
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
+function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
+import React, { useContext } from "react";
+import { render } from "rc-util/lib/React/render";
+import { ConfigContext } from "antd/es/config-provider/context";
+import PurePanel from "./PurePanel";
+import useNotification, { useInternalNotification } from "./useNotification";
+import "antd/es/notification/style/index.less";
+import "../Antd4/notification/style/index.less";
+import "./index.less";
+var notification = null;
+var act = function act(callback) {
+  return callback();
+};
+var taskQueue = [];
+var defaultGlobalConfig = {};
+function getGlobalContext() {
+  var _defaultGlobalConfig = defaultGlobalConfig,
+    getContainer = _defaultGlobalConfig.getContainer,
+    rtl = _defaultGlobalConfig.rtl,
+    maxCount = _defaultGlobalConfig.maxCount,
+    top = _defaultGlobalConfig.top,
+    bottom = _defaultGlobalConfig.bottom;
+  var mergedContainer = (getContainer === null || getContainer === void 0 ? void 0 : getContainer()) || document.body;
+  return {
+    getContainer: function getContainer() {
+      return mergedContainer;
+    },
+    rtl: rtl,
+    maxCount: maxCount,
+    top: top,
+    bottom: bottom
+  };
+}
+var GlobalHolder = /*#__PURE__*/React.forwardRef(function (props, ref) {
+  var notificationConfig = props.notificationConfig,
+    sync = props.sync;
+  var _useContext = useContext(ConfigContext),
+    getPrefixCls = _useContext.getPrefixCls;
+  var prefixCls = defaultGlobalConfig.prefixCls || getPrefixCls("notification");
+  var _useInternalNotificat = useInternalNotification(_objectSpread(_objectSpread({}, notificationConfig), {}, {
+      prefixCls: prefixCls
+    })),
+    _useInternalNotificat2 = _slicedToArray(_useInternalNotificat, 2),
+    api = _useInternalNotificat2[0],
+    holder = _useInternalNotificat2[1];
+  React.useEffect(sync, []);
+  React.useImperativeHandle(ref, function () {
+    var instance = _objectSpread({}, api);
+    Object.keys(instance).forEach(function (method) {
+      instance[method] = function () {
+        sync();
+        return api[method].apply(api, arguments);
+      };
+    });
+    return {
+      instance: instance,
+      sync: sync
+    };
+  });
+  return holder;
+});
+var GlobalHolderWrapper = /*#__PURE__*/React.forwardRef(function (_, ref) {
+  var _React$useState = React.useState(getGlobalContext),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    notificationConfig = _React$useState2[0],
+    setNotificationConfig = _React$useState2[1];
+  var sync = function sync() {
+    setNotificationConfig(getGlobalContext);
+  };
+  React.useEffect(sync, []);
+  var dom = /*#__PURE__*/React.createElement(GlobalHolder, {
+    ref: ref,
+    sync: sync,
+    notificationConfig: notificationConfig
+  });
+  return /*#__PURE__*/React.createElement(_ConfigProvider, null, dom);
+});
+function flushNotice() {
+  if (!notification) {
+    var holderFragment = document.createDocumentFragment();
+    var newNotification = {
+      fragment: holderFragment
+    };
+    notification = newNotification;
+    // Delay render to avoid sync issue
+    act(function () {
+      render( /*#__PURE__*/React.createElement(GlobalHolderWrapper, {
+        ref: function ref(node) {
+          var _ref = node || {},
+            instance = _ref.instance,
+            sync = _ref.sync;
+          Promise.resolve().then(function () {
+            if (!newNotification.instance && instance) {
+              newNotification.instance = instance;
+              newNotification.sync = sync;
+              flushNotice();
+            }
+          });
+        }
+      }), holderFragment);
+    });
+    return;
+  }
+  // Notification not ready
+  if (!notification.instance) {
+    return;
+  }
+
+  // >>> Execute task
+  taskQueue.forEach(function (task) {
+    // eslint-disable-next-line default-case
+    switch (task.type) {
+      case "open":
+        {
+          act(function () {
+            notification.instance.open(_objectSpread(_objectSpread({}, defaultGlobalConfig), task.config));
+          });
+          break;
+        }
+      case "destroy":
+        act(function () {
+          notification.instance.destroy(task.key);
+        });
+        break;
+    }
+  });
+
+  // Clean up
+  taskQueue = [];
+}
+
+// ==============================================================================
+// ==                                  Export                                  ==
+// ==============================================================================
+
+function setNotificationGlobalConfig(config) {
+  defaultGlobalConfig = _objectSpread(_objectSpread({}, defaultGlobalConfig), config);
+
+  // Trigger sync for it
+  act(function () {
+    var _notification, _notification$sync;
+    (_notification = notification) === null || _notification === void 0 || (_notification$sync = _notification.sync) === null || _notification$sync === void 0 || _notification$sync.call(_notification);
+  });
+}
+function open(config) {
+  taskQueue.push({
+    type: "open",
+    config: config
+  });
+  flushNotice();
+}
+var destroy = function destroy(key) {
+  taskQueue.push({
+    type: "destroy",
+    key: key
+  });
+  flushNotice();
+};
+var methods = ["success", "info", "warning", "error"];
+var baseStaticMethods = {
+  open: open,
+  destroy: destroy,
+  config: setNotificationGlobalConfig,
+  useNotification: useNotification,
+  _InternalPanelDoNotUseOrYouWillBeFired: PurePanel
+};
+var staticMethods = baseStaticMethods;
+methods.forEach(function (type) {
+  staticMethods[type] = function (config) {
+    return open(_objectSpread(_objectSpread({}, config), {}, {
+      type: type
+    }));
+  };
+});
+
+// ==============================================================================
+// ==                                   Test                                   ==
+// ==============================================================================
+var noop = function noop() {};
+
+/** @internal Only Work in test env */
+// eslint-disable-next-line import/no-mutable-exports
+export var actWrapper = function actWrapper() {};
+if (process.env.NODE_ENV === "test") {
+  actWrapper = function actWrapper(wrapper) {
+    act = wrapper;
+  };
+}
+
+/** @internal Only Work in test env */
+// eslint-disable-next-line import/no-mutable-exports
+export var actDestroy = noop;
+if (process.env.NODE_ENV === "test") {
+  actDestroy = function actDestroy() {
+    notification = null;
+  };
+}
+export default staticMethods;

package/lib/CustomNotification/index.less

@@ -0,0 +1,102 @@
+@notificationPrefixCls: ~'@{ant-prefix}-notification';
+
+.@{notificationPrefixCls}.cw-message-custom-notification-wrapper{
+  // ====================== Notification ======================
+  position: fixed;
+  display: flex;
+  width: 404px;
+  max-height: ~"calc(100% - @{layout-header-height})";
+  align-items: flex-end;
+  overflow-x: hidden;
+  overflow-y: auto;
+  height: ~"calc(100% - @{layout-header-height})";
+  box-sizing: border-box;
+  pointer-events: none;
+  flex-direction: column;
+  margin: 0;
+  // Position
+  &.@{notificationPrefixCls}-top,
+  &.@{notificationPrefixCls}-topLeft,
+  &.@{notificationPrefixCls}-topRight {
+    top: 0;
+  }
+
+  &.@{notificationPrefixCls}-bottomRight,
+  &.@{notificationPrefixCls}-topRight {
+    right: 0;
+  }
+
+  // ========================= Notice =========================
+  .@{notificationPrefixCls}-notice {
+    position: relative;
+    display: block;
+    box-sizing: border-box;
+    line-height: 1.5;
+    width: 100%;
+
+    &-wrapper {
+      pointer-events: auto;
+      position: relative;
+      display: block;
+      box-sizing: border-box;
+      margin: 0;
+      width: 404px;
+      height: unset !important;
+      padding-left: 20px; // 滚动条出现情况&&展现盒子阴影
+    }
+
+  }
+
+  .@{notificationPrefixCls}-fade {
+    overflow: hidden;
+    transition: all 0.3s;
+  }
+
+  .@{notificationPrefixCls}-fade-appear-prepare {
+    pointer-events: none;
+    opacity: 0 !important;
+  }
+
+  .@{notificationPrefixCls}-fade-appear-start {
+    transform: translateX(100%);
+    opacity: 0;
+  }
+
+  .@{notificationPrefixCls}-fade-appear-active {
+    transform: translateX(0);
+    opacity: 1;
+  }
+
+
+  // ========================= Stack =========================
+  &.@{notificationPrefixCls}-stack {
+    & > .@{notificationPrefixCls}-notice {
+      &-wrapper {
+        transition: all 0.3s;
+        position: absolute;
+        top: 2px;
+        opacity: 1;
+
+        &:not(:nth-last-child(-n + 3)) {
+          opacity: 0;
+        }
+      }
+    }
+
+    &&-expanded {
+      & > .@{notificationPrefixCls}-notice {
+        &-wrapper {
+          &:not(:nth-last-child(-n + 1)) {
+            opacity: 1;
+            width: 404px;
+            overflow: unset;
+            color: inherit;
+            pointer-events: auto;
+          }
+
+        }
+      }
+    }
+
+  }
+}