@para-ui/core 3.0.55 → 3.0.56

package/MultiBox/index.js

@@ -0,0 +1,277 @@
+import { _ as _typeof } from '../_verture/typeof-498dd2b1.js';
+import { _ as _toConsumableArray } from '../_verture/toConsumableArray-81040c9e.js';
+import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import { TextField } from '../TextField/index.js';
+import Label from '../Label/index.js';
+import HelperText from '../HelperText/index.js';
+import Delete from '@para-ui/icons/Delete';
+import PlusCircleF from '@para-ui/icons/PlusCircleF';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import '../_verture/tslib.es6-55ed4bd2.js';
+import '@paraview/lib';
+import '@para-ui/icons/PreviewClose';
+import '@para-ui/icons/PreviewOpen';
+import '@para-ui/icons/CloseCircle';
+import '../AutoTips/index.js';
+import '../Tooltip/index.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+import 'clsx';
+import '../Loading/index.js';
+import '@para-ui/icons/LoadingF';
+import '../_verture/useGlobalProps-1b846a65.js';
+import '@para-ui/core/GlobalContext';
+import '../_verture/index-77f9e0fb.js';
+import 'rc-dropdown';
+import '../_verture/usePopupContainer-87febeb9.js';
+import 'dayjs';
+import '../Help/index.js';
+import '@para-ui/icons/Help';
+
+var en = {
+  add: 'Newly Added'
+};
+
+var zh = {
+  add: '新增'
+};
+
+var localeJson = {
+  zh: zh,
+  en: en
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-multi-box {\n  width: 100%;\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item {\n  display: flex;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input {\n  flex: 1;\n  display: flex;\n  align-items: center;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field:first-child {\n  margin-right: 12px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field {\n  flex: 1;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field .paraui-v3-helper-text {\n  min-height: 12px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-separator {\n  padding-bottom: 20px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  height: 100%;\n  margin: 0 12px;\n  line-height: 1;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box {\n  display: flex;\n  align-items: center;\n  margin-left: 12px;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  cursor: pointer;\n  border-radius: 4px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover {\n  background-color: rgba(171, 176, 185, 0.12);\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover svg {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-multi-box > .multi-box-content > .multi-box-content-item > .opera-box > .del-box svg {\n  font-size: 24px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box > .multi-box-add {\n  text-align: center;\n  border: 1px dashed;\n  border-color: rgba(171, 176, 185, 0.4);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border-radius: 4px;\n  cursor: pointer;\n  background-color: rgba(171, 176, 185, 0.12);\n  color: rgb(54, 102, 214);\n  font-size: 14px;\n}\n.paraui-v3-multi-box > .multi-box-add > svg {\n  font-size: 16px;\n  color: rgb(54, 102, 214);\n  margin-right: 8px;\n}\n.paraui-v3-multi-box > .multi-box-add:hover {\n  border-color: rgba(54, 102, 214, 0.4);\n  background-color: rgba(54, 102, 214, 0.05);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-separator > .multi-box-content > .multi-box-content-item > .multi-box-content-item-input > .multi-box-text-field:first-child {\n  margin-right: 0;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-add {\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-small > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 28px;\n  height: 28px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-add {\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-medium > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 32px;\n  height: 32px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-add {\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-content > .multi-box-content-item > .opera-box {\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-large > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  width: 36px;\n  height: 36px;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box {\n  cursor: not-allowed;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover {\n  background-color: transparent;\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box:hover svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-content > .multi-box-content-item > .opera-box > .del-box svg {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add {\n  border-color: rgba(171, 176, 185, 0.4);\n  cursor: not-allowed;\n  background-color: rgba(171, 176, 185, 0.12);\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add > svg {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-multi-box.paraui-v3-multi-box-disabled > .multi-box-add:hover {\n  border-color: rgba(171, 176, 185, 0.4);\n  color: rgba(46, 55, 67, 0.4);\n}";
+styleInject(css_248z);
+
+var MultiBox = function MultiBox(props) {
+  var className = props.className,
+    style = props.style,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'large' : _props$size,
+    _props$placeholderKey = props.placeholderKey,
+    placeholderKey = _props$placeholderKey === void 0 ? '' : _props$placeholderKey,
+    _props$placeholderVal = props.placeholderValue,
+    placeholderValue = _props$placeholderVal === void 0 ? '' : _props$placeholderVal,
+    _props$label = props.label,
+    label = _props$label === void 0 ? '' : _props$label,
+    labelTooltip = props.labelTooltip,
+    labelSign = props.labelSign,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$required = props.required,
+    required = _props$required === void 0 ? false : _props$required,
+    _props$error = props.error,
+    error = _props$error === void 0 ? false : _props$error,
+    hideErrorDom = props.hideErrorDom,
+    _props$separator = props.separator,
+    separator = _props$separator === void 0 ? ':' : _props$separator,
+    _props$helperText = props.helperText,
+    helperText = _props$helperText === void 0 ? '' : _props$helperText,
+    value = props.value,
+    replaceFields = props.replaceFields,
+    onChange = props.onChange,
+    fetchSuggestionsKey = props.fetchSuggestionsKey,
+    fetchSuggestionsValue = props.fetchSuggestionsValue;
+  var isError = helperText && typeof helperText === 'string' ? true : false;
+  var isErrorArr = helperText instanceof Array;
+  var intl = useFormatMessage('MultiBox', localeJson);
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    valueCom = _useState2[0],
+    setValueCom = _useState2[1];
+  var _useState3 = useState({
+      key: 'label',
+      value: 'value'
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    replaceFieldsCom = _useState4[0],
+    setReplaceFieldsCom = _useState4[1];
+  useEffect(function () {
+    if (props.defaultValue !== undefined) setValueCom(_toConsumableArray(props.defaultValue));
+  }, []);
+  useEffect(function () {
+    if (value !== undefined) setValueCom(_toConsumableArray(value));
+  }, [value]);
+  useEffect(function () {
+    if (replaceFields) {
+      var json = Object.assign(Object.assign({}, replaceFieldsCom), replaceFields);
+      setReplaceFieldsCom(json);
+    }
+  }, [replaceFields]);
+  /** 处理错误 */
+  var handError = function handError(index, name) {
+    var obj = {
+      error: false,
+      helperText: ''
+    };
+    if (isErrorArr) {
+      var errorItem = helperText[index];
+      if (errorItem && errorItem[name]) {
+        obj = {
+          error: true,
+          helperText: errorItem[name]
+        };
+      }
+    }
+    return obj;
+  };
+  /** 增加 */
+  var add = function add() {
+    if (disabled === true) return;
+    valueCom.push({});
+    if (props.value === undefined) setValueCom(_toConsumableArray(valueCom));
+    onChange && onChange(valueCom);
+  };
+  /** 删除 */
+  var del = function del(index) {
+    return function () {
+      if (disabled === true) return;
+      valueCom.splice(index, 1);
+      if (props.value === undefined) setValueCom(_toConsumableArray(valueCom));
+      onChange && onChange(valueCom);
+    };
+  };
+  /** 改变值 */
+  var changeValue = function changeValue(key, index) {
+    return function (event) {
+      valueCom[index][key] = event.target.value;
+      if (props.value === undefined) setValueCom(_toConsumableArray(valueCom));
+      onChange && onChange(valueCom);
+    };
+  };
+  /**
+   * 处理label
+   * */
+  var handLabel = function handLabel() {
+    if (!label && !labelSign) return null;
+    var handLabelClass = function handLabelClass() {
+      var str = 'multi-box-label';
+      if (labelTooltip && labelTooltip.className) {
+        str += ' ' + labelTooltip.className;
+      }
+      return str;
+    };
+    return jsx(Label, Object.assign({
+      label: label,
+      required: required,
+      labelSign: labelSign
+    }, labelTooltip, {
+      className: handLabelClass()
+    }));
+  };
+  /** 处理内容每一项 */
+  var handContentItem = function handContentItem(item, index) {
+    var _a, _b;
+    var keyValue = item[replaceFieldsCom.key || ''] || '';
+    var valValue = item[replaceFieldsCom.value || ''] || '';
+    var disabledKey = disabled instanceof Array ? (_a = disabled[index]) === null || _a === void 0 ? void 0 : _a[keyValue] : disabled;
+    var disabledVal = disabled instanceof Array ? (_b = disabled[index]) === null || _b === void 0 ? void 0 : _b[valValue] : disabled;
+    return jsxs("div", Object.assign({
+      className: "multi-box-content-item-input"
+    }, {
+      children: [jsx(TextField, Object.assign({
+        className: 'multi-box-text-field',
+        size: size,
+        disabled: disabledKey,
+        placeholder: placeholderKey,
+        value: keyValue
+      }, handError(index, replaceFieldsCom.key || ''), {
+        onChange: changeValue(replaceFieldsCom.key || '', index),
+        fetchSuggestions: fetchSuggestionsKey ? fetchSuggestions('key') : undefined,
+        onSelect: selectValue(replaceFieldsCom.key || '', index)
+      })), separator && jsx("span", Object.assign({
+        className: 'multi-box-separator'
+      }, {
+        children: separator
+      })), jsx(TextField, Object.assign({
+        className: 'multi-box-text-field',
+        size: size,
+        disabled: disabledVal,
+        placeholder: placeholderValue,
+        value: valValue
+      }, handError(index, replaceFieldsCom.value || ''), {
+        onChange: changeValue(replaceFieldsCom.value || '', index),
+        fetchSuggestions: fetchSuggestionsValue ? fetchSuggestions('value') : undefined,
+        onSelect: selectValue(replaceFieldsCom.value || '', index)
+      }))]
+    }));
+  };
+  /** 处理内容 */
+  var handContent = function handContent() {
+    return jsx("div", Object.assign({
+      className: "multi-box-content"
+    }, {
+      children: valueCom.map(function (item, index) {
+        return jsxs("div", Object.assign({
+          className: "multi-box-content-item"
+        }, {
+          children: [handContentItem(item, index), disabled !== true && jsx("div", Object.assign({
+            className: "opera-box"
+          }, {
+            children: jsx("span", Object.assign({
+              className: "del-box",
+              onClick: del(index)
+            }, {
+              children: jsx(Delete, {})
+            }))
+          }))]
+        }), index);
+      })
+    }));
+  };
+  /** 模糊匹配 */
+  var fetchSuggestions = function fetchSuggestions(key) {
+    return function (val, cb) {
+      if (key === 'key') fetchSuggestionsKey && fetchSuggestionsKey(val, cb);else fetchSuggestionsValue && fetchSuggestionsValue(val, cb);
+    };
+  };
+  /** 选择值 */
+  var selectValue = function selectValue(key, index) {
+    return function (item) {
+      valueCom[index][key] = item;
+      if (_typeof(item) === 'object' && item !== null) {
+        valueCom[index][key] = item.value;
+      }
+      if (props.value === undefined) setValueCom(_toConsumableArray(valueCom));
+      onChange && onChange(valueCom);
+    };
+  };
+  /** 处理class */
+  var handClass = function handClass() {
+    var str = $prefixCls + '-multi-box multi-box';
+    if (className) str += ' ' + className;
+    if (size) str += " ".concat($prefixCls, "-multi-box-").concat(size);
+    if (error) str += " ".concat($prefixCls, "-multi-box-error");
+    if (disabled === true) str += " ".concat($prefixCls, "-multi-box-disabled");
+    if (separator) str += " ".concat($prefixCls, "-multi-box-separator");
+    return str;
+  };
+  return jsxs("div", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: [handLabel(), handContent(), jsxs("div", Object.assign({
+      className: "multi-box-add",
+      onClick: add
+    }, {
+      children: [jsx(PlusCircleF, {}), jsx("span", {
+        children: intl({
+          id: 'add'
+        })
+      })]
+    })), jsx(HelperText, {
+      className: "multi-box-error-text",
+      error: isError,
+      helperText: isError ? helperText : undefined,
+      hideErrorDom: hideErrorDom
+    })]
+  }));
+};
+
+export { MultiBox, MultiBox as default };

package/MultiBox/lang/en_US.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    add: string;
+};
+export default _default;

package/MultiBox/lang/index.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    zh: {
+        add: string;
+    };
+    en: {
+        add: string;
+    };
+};
+export default _default;

package/MultiBox/lang/zh_CN.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    add: string;
+};
+export default _default;

package/Notification/index.d.ts

@@ -0,0 +1,74 @@
+/**
+ * @author Hanz
+ * @date 2022/1/13 上午10:30
+ * @description 通知提醒框
+ */
+import React from 'react';
+import './index.scss';
+export type NotificationPlacement = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+export type IconType = 'success' | 'info' | 'error' | 'warning';
+export interface ConfigProps {
+    /** 消息从顶部弹出时，距离顶部的位置，单位像素 */
+    top?: number;
+    /** 消息从底部弹出时，距离底部的位置，单位像素 */
+    bottom?: number;
+    /** 默认自动关闭延时，单位秒 */
+    duration?: number;
+    /** 弹出位置 */
+    placement?: NotificationPlacement;
+    /** 配置渲染输出位置 */
+    getContainer?: () => HTMLElement;
+    /** 自定义关闭图标 */
+    closeIcon?: React.ReactNode;
+    /** 最大显示数 */
+    maxCount?: number;
+}
+export interface ArgsProps {
+    /** 通知提醒标题 */
+    message: React.ReactNode;
+    /** 通知提醒内容 */
+    description?: React.ReactNode;
+    /** 自定义关闭按钮 */
+    btn?: React.ReactNode;
+    /** 当前通知唯一标志 */
+    key?: string;
+    /** 关闭时触发 */
+    onClose?: () => void;
+    /** 默认 4.5 秒后自动关闭，配置为 null 则不自动关闭 */
+    duration?: number | null;
+    /** 自定义图标 */
+    icon?: React.ReactNode;
+    /** 弹出位置 */
+    placement?: NotificationPlacement;
+    /** style */
+    style?: React.CSSProperties;
+    /** cls */
+    className?: string;
+    /**  图标类型 内部使用*/
+    readonly type?: IconType;
+    /** 点击通知时触发 */
+    onClick?: () => void;
+    /** 消息从顶部弹出时，距离顶部的位置，单位像素 */
+    top?: number;
+    /** 消息从底部弹出时，距离底部的位置，单位像素 */
+    bottom?: number;
+    /** 渲染容器 */
+    getContainer?: () => HTMLElement;
+    /** 自定义关闭图标 */
+    closeIcon?: React.ReactNode;
+}
+export interface NotificationInstance {
+    success(args: ArgsProps): void;
+    error(args: ArgsProps): void;
+    info(args: ArgsProps): void;
+    warning(args: ArgsProps): void;
+    open(args: ArgsProps): void;
+}
+export interface NotificationApi extends NotificationInstance {
+    warn(args: ArgsProps): void;
+    close(key: string): void;
+    config(options: ConfigProps): void;
+    destroy(): void;
+}
+declare const _default: NotificationApi;
+export default _default;

package/Notification/index.js

@@ -0,0 +1,252 @@
+import { _ as _defineProperty } from '../_verture/defineProperty-62acccfc.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import React__default from 'react';
+import Notification from 'rc-notification';
+import WarningCircleF from '@para-ui/icons/WarningCircleF';
+import CompleteIcon from '@para-ui/icons/CheckCircleF';
+import CloseIcon from '@para-ui/icons/Close';
+import CloseCircleFilled from '@para-ui/icons/CloseCircleF';
+import clsx from 'clsx';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/typeof-498dd2b1.js';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n * @author Hanz\n * @date 2022/1/13 上午10:30\n * @description 通知提醒框\n */\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-notification {\n  position: fixed;\n  margin: 0 24px 0 0;\n  padding: 0;\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  z-index: 9999;\n}\n.paraui-v3-notification-topLeft, .paraui-v3-notification-bottomLeft {\n  margin-right: 0;\n  margin-left: 24px;\n}\n.paraui-v3-notification-topLeft .paraui-v3-notification-fade-enter.paraui-v3-notification-fade-enter-active, .paraui-v3-notification-bottomLeft .paraui-v3-notification-fade-enter.paraui-v3-notification-fade-enter-active, .paraui-v3-notification-topLeft .paraui-v3-notification-fade-appear.paraui-v3-notification-fade-appear-active, .paraui-v3-notification-bottomLeft .paraui-v3-notification-fade-appear.paraui-v3-notification-fade-appear-active {\n  animation-name: NotificationLeftFadeIn;\n}\n.paraui-v3-notification-hook-holder, .paraui-v3-notification-notice {\n  position: relative;\n  width: 430px;\n  max-width: calc(100vw - 48px);\n  margin-bottom: 16px;\n  margin-left: auto;\n  overflow: hidden;\n  word-wrap: break-word;\n  background: rgb(255, 255, 255);\n  border-radius: 4px;\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-notification-topLeft .paraui-v3-notification-hook-holder, .paraui-v3-notification-topLeft .paraui-v3-notification-notice, .paraui-v3-notification-bottomLeft .paraui-v3-notification-hook-holder, .paraui-v3-notification-bottomLeft .paraui-v3-notification-notice {\n  margin-right: auto;\n  margin-left: 0;\n}\n.paraui-v3-notification-hook-holder > .paraui-v3-notification-notice {\n  margin-bottom: 0;\n  box-shadow: none;\n}\n.paraui-v3-notification-notice {\n  padding: 20px;\n  line-height: 1.5715;\n}\n.paraui-v3-notification-notice-content {\n  position: relative;\n}\n.paraui-v3-notification-notice-message {\n  margin-bottom: 8px;\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  font-weight: 700;\n  line-height: 24px;\n}\n.paraui-v3-notification-notice-message-single-line-auto-margin {\n  display: block;\n  width: calc(264px - 100%);\n  max-width: 4px;\n  background-color: transparent;\n  pointer-events: none;\n}\n.paraui-v3-notification-notice-message-single-line-auto-margin::before {\n  display: block;\n  content: \"\";\n}\n.paraui-v3-notification-notice-description {\n  font-size: 14px;\n  font-weight: 400;\n}\n.paraui-v3-notification-notice-closable .paraui-v3-notification-notice-message {\n  padding-right: 24px;\n}\n.paraui-v3-notification-notice-with-icon .paraui-v3-notification-notice-message {\n  margin-bottom: 4px;\n  margin-left: 24px;\n}\n.paraui-v3-notification-notice-with-icon .paraui-v3-notification-notice-description {\n  margin-left: 24px;\n}\n.paraui-v3-notification-notice-without-description .paraui-v3-notification-notice-message {\n  margin-bottom: 0;\n}\n.paraui-v3-notification .paraui-v3-notification-notice-icon {\n  position: absolute;\n  top: 4px;\n  font-size: 16px;\n  line-height: 24px;\n}\n.paraui-v3-notification .paraui-v3-notification-notice-icon-success {\n  color: rgb(83, 195, 27);\n}\n.paraui-v3-notification .paraui-v3-notification-notice-icon-info {\n  color: rgb(54, 102, 214);\n}\n.paraui-v3-notification .paraui-v3-notification-notice-icon-warning {\n  color: rgb(255, 161, 80);\n}\n.paraui-v3-notification .paraui-v3-notification-notice-icon-error {\n  color: rgb(235, 96, 84);\n}\n.paraui-v3-notification-notice-close {\n  position: absolute;\n  top: 16px;\n  right: 22px;\n  color: rgba(46, 55, 67, 0.7);\n  outline: none;\n}\n.paraui-v3-notification-notice-close:hover {\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-notification .paraui-v3-notification-close-icon {\n  font-size: 18px;\n  cursor: pointer;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-notification-notice-btn {\n  float: right;\n  margin-top: 16px;\n}\n.paraui-v3-notification .notification-fade-effect {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n}\n.paraui-v3-notification-fade-enter, .paraui-v3-notification-fade-appear {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  opacity: 0;\n  animation-play-state: paused;\n}\n.paraui-v3-notification-fade-leave {\n  animation-duration: 0.24s;\n  animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);\n  animation-fill-mode: both;\n  animation-play-state: paused;\n}\n.paraui-v3-notification-fade-enter.paraui-v3-notification-fade-enter-active, .paraui-v3-notification-fade-appear.paraui-v3-notification-fade-appear-active {\n  animation-name: NotificationFadeIn;\n  animation-play-state: running;\n}\n.paraui-v3-notification-fade-leave.paraui-v3-notification-fade-leave-active {\n  animation-name: NotificationFadeOut;\n  animation-play-state: running;\n}\n@keyframes NotificationFadeIn {\n  0% {\n    left: 430px;\n    opacity: 0;\n  }\n  100% {\n    left: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationLeftFadeIn {\n  0% {\n    right: 430px;\n    opacity: 0;\n  }\n  100% {\n    right: 0;\n    opacity: 1;\n  }\n}\n@keyframes NotificationFadeOut {\n  0% {\n    max-height: 150px;\n    margin-bottom: 16px;\n    opacity: 1;\n  }\n  100% {\n    max-height: 0;\n    margin-bottom: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n    opacity: 0;\n  }\n}";
+styleInject(css_248z);
+
+//通知框实例存储
+var notificationInstance = {};
+// 默认值
+var defaultDuration = 4.5; //默认 4.5 秒后自动关闭，配置为 null 则不自动关闭
+var defaultTop = 24;
+var defaultBottom = 24;
+var defaultPlacement = 'topRight';
+var defaultGetContainer;
+var prefixCls = "".concat($prefixCls, "-notification");
+var defaultCloseIcon = jsx(CloseIcon, {
+  className: "".concat(prefixCls, "-close-icon")
+});
+var rtl = false;
+var maxCount;
+//设置全局配置
+function setNotificationConfig(options) {
+  var duration = options.duration,
+    placement = options.placement,
+    bottom = options.bottom,
+    top = options.top,
+    getContainer = options.getContainer,
+    closeIcon = options.closeIcon;
+  if (duration !== undefined) {
+    defaultDuration = duration;
+  }
+  if (placement !== undefined) {
+    defaultPlacement = placement;
+  }
+  if (bottom !== undefined) {
+    defaultBottom = bottom;
+  }
+  if (top !== undefined) {
+    defaultTop = top;
+  }
+  if (getContainer !== undefined) {
+    defaultGetContainer = getContainer;
+  }
+  if (closeIcon !== undefined) {
+    defaultCloseIcon = closeIcon;
+  }
+  if (options.maxCount !== undefined) {
+    maxCount = options.maxCount;
+  }
+}
+//获得位置样式
+function getPlacementStyle(placement) {
+  var top = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : defaultTop;
+  var bottom = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : defaultBottom;
+  var style;
+  switch (placement) {
+    case 'topLeft':
+      style = {
+        left: 0,
+        top: top,
+        bottom: 'auto'
+      };
+      break;
+    case 'topRight':
+      style = {
+        right: 0,
+        top: top,
+        bottom: 'auto'
+      };
+      break;
+    case 'bottomLeft':
+      style = {
+        left: 0,
+        top: 'auto',
+        bottom: bottom
+      };
+      break;
+    default:
+      style = {
+        right: 0,
+        top: 'auto',
+        bottom: bottom
+      };
+      break;
+  }
+  return style;
+}
+//创建通知框实例
+function getNotificationInstance(args, callback) {
+  var _args$placement = args.placement,
+    placement = _args$placement === void 0 ? defaultPlacement : _args$placement,
+    top = args.top,
+    bottom = args.bottom,
+    _args$getContainer = args.getContainer,
+    getContainer = _args$getContainer === void 0 ? defaultGetContainer : _args$getContainer,
+    _args$closeIcon = args.closeIcon,
+    closeIcon = _args$closeIcon === void 0 ? defaultCloseIcon : _args$closeIcon;
+  // const prefixCls = `${$prefixCls}-notification`;
+  var cacheKey = "".concat(prefixCls, "-").concat(placement);
+  var cacheInstance = notificationInstance[cacheKey];
+  if (cacheInstance) {
+    Promise.resolve(cacheInstance).then(function (instance) {
+      callback({
+        prefixCls: "".concat(prefixCls, "-notice"),
+        instance: instance
+      });
+    });
+    return;
+  }
+  //close icon
+  var closeIconToRender = jsx("span", Object.assign({
+    className: "".concat(prefixCls, "-close-x")
+  }, {
+    children: closeIcon || jsx(CloseIcon, {
+      className: "".concat(prefixCls, "-close-icon")
+    })
+  }));
+  //通知框cls
+  var notificationCls = clsx("".concat(prefixCls, "-").concat(placement), _defineProperty({}, "".concat(prefixCls, "-rtl"), rtl === true));
+  notificationInstance[cacheKey] = new Promise(function (resolve) {
+    Notification.newInstance({
+      prefixCls: prefixCls,
+      className: notificationCls,
+      style: getPlacementStyle(placement, top, bottom),
+      getContainer: getContainer,
+      closeIcon: closeIconToRender,
+      maxCount: maxCount
+    }, function (notification) {
+      resolve(notification);
+      callback({
+        prefixCls: "".concat(prefixCls, "-notice"),
+        instance: notification
+      });
+    });
+  });
+}
+//通知框类型图标
+var typeToIcon = {
+  success: CompleteIcon,
+  info: WarningCircleF,
+  error: CloseCircleFilled,
+  warning: WarningCircleF
+};
+//创建通知框内容配置
+function getNoticeProps(args, prefixCls) {
+  var durationArg = args.duration,
+    icon = args.icon,
+    type = args.type,
+    description = args.description,
+    message = args.message,
+    btn = args.btn,
+    onClose = args.onClose,
+    onClick = args.onClick,
+    key = args.key,
+    style = args.style,
+    className = args.className,
+    _args$closeIcon2 = args.closeIcon,
+    closeIcon = _args$closeIcon2 === void 0 ? defaultCloseIcon : _args$closeIcon2;
+  var duration = durationArg === undefined ? defaultDuration : durationArg;
+  var iconNode = null;
+  if (icon) {
+    iconNode = jsx("span", Object.assign({
+      className: "".concat(prefixCls, "-icon")
+    }, {
+      children: icon
+    }));
+  } else if (type) {
+    iconNode = /*#__PURE__*/React__default.createElement(typeToIcon[type] || null, {
+      className: "".concat(prefixCls, "-icon ").concat(prefixCls, "-icon-").concat(type)
+    });
+  }
+  var autoMarginTag = !description && iconNode ? jsx("span", {
+    className: "".concat(prefixCls, "-message-single-line-auto-margin")
+  }) : null;
+  return {
+    content: jsxs("div", Object.assign({
+      className: "".concat(iconNode ? "".concat(prefixCls, "-with-icon") : '', " ").concat(description ? '' : prefixCls + '-without-description')
+    }, {
+      children: [iconNode, jsxs("div", Object.assign({
+        className: "".concat(prefixCls, "-message")
+      }, {
+        children: [autoMarginTag, message]
+      })), description && jsx("div", Object.assign({
+        className: "".concat(prefixCls, "-description")
+      }, {
+        children: description
+      })), btn ? jsx("span", Object.assign({
+        className: "".concat(prefixCls, "-btn")
+      }, {
+        children: btn
+      })) : null]
+    })),
+    duration: duration,
+    closable: true,
+    onClose: onClose,
+    onClick: onClick,
+    key: key,
+    style: style || {},
+    className: clsx(className, _defineProperty({}, "".concat(prefixCls, "-").concat(type), !!type)),
+    closeIcon: closeIcon
+  };
+}
+//通知框调用方法
+function notice(args) {
+  getNotificationInstance(args, function (_ref) {
+    var prefixCls = _ref.prefixCls,
+      instance = _ref.instance;
+    instance.notice(getNoticeProps(args, prefixCls));
+  });
+}
+//通知框api method
+var api = {
+  open: notice,
+  close: function close(key) {
+    Object.keys(notificationInstance).forEach(function (cacheKey) {
+      return Promise.resolve(notificationInstance[cacheKey]).then(function (instance) {
+        instance.removeNotice(key);
+      });
+    });
+  },
+  config: setNotificationConfig,
+  destroy: function destroy() {
+    Object.keys(notificationInstance).forEach(function (cacheKey) {
+      Promise.resolve(notificationInstance[cacheKey]).then(function (instance) {
+        instance.destroy();
+      });
+      delete notificationInstance[cacheKey];
+    });
+  }
+};
+//通知框预设类型 'success', 'info', 'warning', 'error'
+['success', 'info', 'warning', 'error'].forEach(function (type) {
+  api[type] = function (args) {
+    return api.open(Object.assign(Object.assign({}, args), {
+      type: type
+    }));
+  };
+});
+//兼容warn、warning
+api.warn = api.warning;
+
+export { api as default };