@para-ui/core 3.0.55 → 3.0.56

package/AutoBox/index.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @author linhd
+ * @date 2021/8/9 16:16
+ * @description 超出自适应盒子
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import './index.scss';
+export interface AutoBoxProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** list选项 */
+    list?: any[];
+    /** 指定渲染几项,存在这个参数,则不自适应 */
+    showNum?: number;
+    /** 下拉框样式 */
+    popoverClassName?: string;
+    /** 自定义更多内容 */
+    moreCustomize?: ReactNode;
+    /** 隐藏更多按钮 */
+    hideMore?: boolean;
+    /** 打开下拉框 */
+    openMore?: boolean;
+    /** 定位元素 */
+    anchorEl?: any;
+    /** 关闭弹窗 */
+    onCloseMore?: () => void;
+    /** 显示更多 */
+    onShowMore?: (bol: boolean) => void;
+    [name: string]: any;
+}
+export declare const AutoBox: FunctionComponent<AutoBoxProps>;
+export default AutoBox;

package/AutoBox/index.js

@@ -0,0 +1,277 @@
+import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { useState, useRef, useEffect, Fragment as Fragment$1 } from 'react';
+import { Popover } from '../Popover/index.js';
+import { createPortal } from 'react-dom';
+import { UUID } from '@paraview/lib';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import More from '@para-ui/icons/More';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import '../_verture/tslib.es6-55ed4bd2.js';
+import '../Tooltip/index.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+import 'clsx';
+import '../_verture/usePopupContainer-87febeb9.js';
+
+var Protal = function Protal(props) {
+  var children = props.children,
+    className = props.className,
+    anchorEl = props.anchorEl,
+    onClose = props.onClose;
+  var _useState = useState({}),
+    _useState2 = _slicedToArray(_useState, 2),
+    styleCom = _useState2[0],
+    setStyleCom = _useState2[1];
+  var constData = useRef({
+    uuid: $prefixCls + '-protal-box-content-' + UUID()
+  });
+  var domRef = useRef();
+  var contentRef = useRef();
+  useEffect(function () {
+    handStyle();
+    window.addEventListener('click', clickFunc);
+    return function () {
+      domRef && domRef.current && domRef.current.remove();
+      window.removeEventListener('click', clickFunc);
+    };
+  }, []);
+  /**
+   * 查找元素
+   * @param el 当前元素
+   * @param selector 查找元素class
+   */
+  var closest = function closest(el, selector) {
+    var matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
+    while (el) {
+      if (matchesSelector.call(el, selector)) {
+        break;
+      }
+      el = el.parentElement;
+    }
+    return el;
+  };
+  /** 全局监听点击事件 */
+  var clickFunc = function clickFunc(e) {
+    if (!constData.current) return;
+    var bol = closest(e.target, '.' + constData.current.uuid); // 是否存在下拉当中
+    if (!bol) onClose && onClose();
+  };
+  /** 处理内容的定位样式 */
+  var handStyle = function handStyle() {
+    if (!anchorEl || !contentRef.current) return;
+    var posDomRect = anchorEl.getBoundingClientRect();
+    var contentDomRect = contentRef.current.getBoundingClientRect();
+    var json = {
+      opacity: 1,
+      left: posDomRect.left,
+      top: posDomRect.top + posDomRect.height
+    };
+    var winHeight = window.innerHeight;
+    var winWidth = window.innerWidth;
+    if (json.left + contentDomRect.width > winWidth) {
+      json.left = winWidth - contentDomRect.width - 8;
+      if (json.left < 0) json.left = 0;
+    }
+    if (json.top + contentDomRect.height > winHeight) {
+      json.top = winHeight - contentDomRect.height - 8;
+      if (json.top < 0) json.top = 0;
+    }
+    setStyleCom(json);
+  };
+  /** 处理className */
+  var handClass = function handClass() {
+    var str = $prefixCls + '-protal-box';
+    if (className) str += ' ' + className;
+    return str;
+  };
+  var handContent = function handContent() {
+    return jsxs("div", Object.assign({
+      className: handClass(),
+      ref: domRef
+    }, {
+      children: [jsx("div", {
+        className: "protal-mask"
+      }), jsx("div", Object.assign({
+        className: 'protal-content ' + constData.current.uuid,
+        style: styleCom,
+        ref: contentRef
+      }, {
+        children: children
+      }))]
+    }));
+  };
+  return jsx(Fragment, {
+    children: /*#__PURE__*/createPortal(handContent(), document.getElementsByTagName('body')[0])
+  });
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-auto-box {\n  width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n}\n.paraui-v3-auto-box > .auto-box-more {\n  display: inline-block;\n  height: 100%;\n  cursor: pointer;\n}\n\n.paraui-v3-auto-box-popover .auto-box-popover-content {\n  display: flex;\n  flex-direction: column;\n}\n\n.paraui-v3-protal-box {\n  position: fixed;\n  z-index: 1500;\n  inset: 0px;\n}\n.paraui-v3-protal-box .protal-mask {\n  z-index: -1;\n  position: fixed;\n  inset: 0px;\n  background-color: transparent;\n}\n.paraui-v3-protal-box .protal-content {\n  border-radius: 4px;\n  box-shadow: 0px 2px 8px 0px rgba(171, 176, 185, 0.4);\n  background-color: white;\n  outline: 0;\n  position: absolute;\n  max-width: calc(100% - 32px);\n  min-width: 16px;\n  max-height: calc(100% - 32px);\n  min-height: 16px;\n  overflow-x: hidden;\n  overflow-y: auto;\n  opacity: 0;\n  transform: none;\n  transition: opacity 243ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, transform 162ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;\n}";
+styleInject(css_248z);
+
+var AutoBox = function AutoBox(props) {
+  var className = props.className,
+    _props$list = props.list,
+    list = _props$list === void 0 ? [] : _props$list,
+    popoverClassName = props.popoverClassName,
+    moreCustomize = props.moreCustomize,
+    anchorEl = props.anchorEl,
+    _props$hideMore = props.hideMore,
+    hideMore = _props$hideMore === void 0 ? false : _props$hideMore,
+    showNum = props.showNum,
+    onCloseMore = props.onCloseMore,
+    onShowMore = props.onShowMore,
+    style = props.style;
+  var _useState = useState('auto-box-' + UUID()),
+    _useState2 = _slicedToArray(_useState, 1),
+    classOne = _useState2[0]; // 唯一class
+  var _useState3 = useState(null),
+    _useState4 = _slicedToArray(_useState3, 2),
+    morePos = _useState4[0],
+    setMorePos = _useState4[1]; // 超出在原始位置
+  var _useState5 = useState(false),
+    _useState6 = _slicedToArray(_useState5, 2),
+    openMoreCom = _useState6[0],
+    setOpenMoreCom = _useState6[1]; // 显示更多
+  var _useState7 = useState({}),
+    _useState8 = _slicedToArray(_useState7, 1),
+    timer = _useState8[0];
+  var posDom = useRef();
+  // 监听打开更多
+  useEffect(function () {
+    if (props.openMore !== undefined) {
+      setOpenMoreCom(props.openMore);
+    }
+  }, [props.openMore]);
+  useEffect(function () {
+    if (props.showNum !== undefined) return;
+    changeSize();
+    window.addEventListener("resize", changeSize);
+    return function () {
+      window.removeEventListener("resize", changeSize);
+      clearTimeout(timer.timer);
+    };
+  }, [list]);
+  useEffect(function () {
+    if (showNum !== undefined) {
+      setMorePos(showNum);
+      window.removeEventListener("resize", changeSize);
+    }
+  }, [showNum]);
+  useEffect(function () {
+    if (morePos !== null && list.length > morePos) {
+      onShowMore && onShowMore(true);
+    } else {
+      onShowMore && onShowMore(false);
+    }
+  }, [list, morePos, onShowMore]);
+  var onVisibleChange = function onVisibleChange(bol) {
+    if (bol) return setOpenMoreCom(true);
+    closeMore();
+  };
+  // 关闭显示更多
+  var closeMore = function closeMore() {
+    setOpenMoreCom(false);
+    onCloseMore && onCloseMore();
+  };
+  // 关闭显示更多
+  var handleCloseMore = function handleCloseMore() {
+    closeMore();
+  };
+  // 不换行 计算
+  var handMultiline = function handMultiline(index) {
+    if (index === null || index === 0) return;
+    if (index === undefined) index = list.length;
+    var boxDom = document.querySelector('.' + classOne);
+    if (!boxDom) return;
+    if (boxDom.scrollWidth > boxDom.clientWidth) {
+      var num = Number(index) - 1;
+      // 超出
+      setMorePos(num);
+      handMultiline(num);
+    } else {
+      // 一个
+      if (list.length <= index) handleCloseMore();
+    }
+  };
+  // 多选 不换行
+  var changeSize = function changeSize() {
+    clearTimeout(timer.timer);
+    closeMore();
+    timer.timer = setTimeout(function () {
+      setMorePos(list.length);
+      handMultiline();
+    }, 100);
+  };
+  // 处理class
+  var handClass = function handClass() {
+    var str = $prefixCls + '-auto-box';
+    if (classOne) str += ' ' + classOne;
+    if (className) str += ' ' + className;
+    return str;
+  };
+  // 处理handClassPopover
+  var handClassPopover = function handClassPopover() {
+    var str = $prefixCls + '-auto-box-popover';
+    if (popoverClassName) str += ' ' + popoverClassName;
+    return str;
+  };
+  // 处理更多内容
+  var handMoreDom = function handMoreDom() {
+    return jsx("div", Object.assign({
+      className: "auto-box-popover-content"
+    }, {
+      children: list && list.map(function (item, index) {
+        if (morePos !== null && morePos > index) return null;
+        return jsx(Fragment$1, {
+          children: item
+        }, index);
+      })
+    }));
+  };
+  /** 处理更多按钮 */
+  var handMoreBtn = function handMoreBtn() {
+    if (morePos !== null && list.length > morePos && !hideMore) {
+      return jsx(Popover, Object.assign({
+        open: openMoreCom,
+        content: handMoreDom(),
+        overlayClassName: handClassPopover(),
+        placement: "bottomLeft",
+        onVisibleChange: onVisibleChange
+      }, {
+        children: jsx("div", Object.assign({
+          className: "auto-box-more",
+          ref: posDom
+        }, {
+          children: moreCustomize ? moreCustomize : jsx(More, {})
+        }))
+      }));
+    }
+  };
+  /** 自定义更多按钮 */
+  var handCustomDialog = function handCustomDialog() {
+    if (anchorEl && openMoreCom) {
+      return jsx(Protal, Object.assign({
+        className: handClassPopover(),
+        anchorEl: anchorEl,
+        onClose: closeMore
+      }, {
+        children: handMoreDom()
+      }));
+    }
+  };
+  return jsxs("div", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: [list.map(function (item, index) {
+      if (morePos !== null && morePos <= index) return null;
+      return jsx(Fragment$1, {
+        children: item
+      }, index);
+    }), handMoreBtn(), handCustomDialog()]
+  }));
+};
+
+export { AutoBox, AutoBox as default };

package/AutoBox/protal.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @author linhd
+ * @date 2022/8/10 10:32 AM
+ * @description 全局弹窗-自定义用的
+ */
+import { FunctionComponent, ReactNode } from 'react';
+export interface ProtalBoxProps {
+    className?: string;
+    /** 定位元素 */
+    anchorEl?: any;
+    /** 关闭事件 */
+    onClose?: () => void;
+    children?: ReactNode;
+    [name: string]: any;
+}
+export declare const Protal: FunctionComponent<ProtalBoxProps>;
+export default Protal;

package/AutoTips/autoTipsMultiline/index.d.ts

@@ -0,0 +1,18 @@
+/**
+ * @author linhd
+ * @date 2023/3/29 14:18
+ * @description 超出多行显示
+ */
+import { FunctionComponent } from 'react';
+import { AutoTipsProps } from "../index";
+import './index.scss';
+export interface AutoTipsMultilineProps extends Omit<AutoTipsProps, 'children'> {
+    /** 内容 */
+    children: string;
+    /** 行数 */
+    line?: number;
+    /** 刷新 */
+    refresh?: any;
+}
+declare const AutoTipsMultiline: FunctionComponent<AutoTipsMultilineProps>;
+export default AutoTipsMultiline;

package/AutoTips/index.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @author linhd
+ * @date 2021/8/9 15:15
+ * @description 超出...
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import AutoTipsMultiline from "./autoTipsMultiline";
+import './index.scss';
+export interface AutoTipsProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 超出显示的内容 */
+    tips?: React.ReactNode;
+    /** 文字下拉提示箭头 */
+    arrow?: boolean;
+    /** 显示文字还是元素 */
+    beyondText?: boolean;
+    /** 定位方向 */
+    placement?: "top-start" | "bottom-end" | "bottom-start" | "bottom" | "left-end" | "left-start" | "left" | "right-end" | "right-start" | "right" | "top-end" | "top" | undefined;
+    /** 提示最大宽度 */
+    tipMaxWidth?: number | string;
+    /** interactive */
+    interactive?: boolean;
+    /** 内容
+     *  单行不限制类型
+     *  多行限制为string
+     * */
+    children?: ReactNode;
+    [name: string]: any;
+}
+declare const AutoTips: FunctionComponent<AutoTipsProps>;
+export { AutoTipsMultiline };
+export default AutoTips;

package/AutoTips/index.js

@@ -0,0 +1,271 @@
+import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useRef, useState, useEffect, useMemo } from 'react';
+import { Tooltip } from '../Tooltip/index.js';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { isIE } from '@paraview/lib';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import '../_verture/tslib.es6-55ed4bd2.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+import 'clsx';
+
+var css_248z$1 = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2021/11/1 20:28\n* @description 文字隐藏...\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-auto-tips-multiline {\n  max-width: 100%;\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v3-auto-tips-multiline > .auto-tips-multiline-content-box {\n  position: relative;\n}\n.paraui-v3-auto-tips-multiline > .auto-tips-multiline-content-box > .auto-tips-multiline-content > .last-line {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n.paraui-v3-auto-tips-multiline > .auto-tips-multiline-content-box > .hidden {\n  opacity: 0;\n  visibility: hidden;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n  z-index: -100000;\n}\n.paraui-v3-auto-tips-multiline.paraui-v3-auto-tips-multiline-safari > .auto-tips-multiline-content-box > .auto-tips-multiline-content > .last-line::before {\n  content: \"\";\n  display: block;\n}\n\n.paraui-v3-auto-tips-multiline-tooltip .component-tooltip-inner {\n  max-height: calc(100vh - 25px);\n  overflow: auto;\n}";
+styleInject(css_248z$1);
+
+var AutoTipsMultiline = function AutoTipsMultiline(props) {
+  var children = props.children,
+    _props$arrow = props.arrow,
+    arrow = _props$arrow === void 0 ? false : _props$arrow,
+    _props$placement = props.placement,
+    placement = _props$placement === void 0 ? "bottom-start" : _props$placement,
+    _props$tips = props.tips,
+    tips = _props$tips === void 0 ? '' : _props$tips,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$interactive = props.interactive,
+    interactive = _props$interactive === void 0 ? true : _props$interactive,
+    tipMaxWidth = props.tipMaxWidth,
+    _props$line = props.line,
+    line = _props$line === void 0 ? 2 : _props$line,
+    refresh = props.refresh,
+    style = props.style;
+  var boxRef = useRef(null);
+  var singleWordRefs = useRef([]);
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    lineClamp = _useState2[0],
+    setLineClamp = _useState2[1];
+  var constData = useRef({
+    line: line,
+    tips: tips
+  });
+  constData.current.line = line;
+  constData.current.tips = tips;
+  var _useState3 = useState(''),
+    _useState4 = _slicedToArray(_useState3, 2),
+    tTips = _useState4[0],
+    setTTips = _useState4[1];
+  useEffect(function () {
+    window.addEventListener('resize', calcLine);
+    return function () {
+      window.removeEventListener('resize', calcLine);
+    };
+  }, []);
+  useEffect(function () {
+    calcLine();
+  }, [children, refresh]);
+  // 计算行数
+  var calcLine = function calcLine() {
+    var _a;
+    if (!children) return;
+    var lineArr = [];
+    var showTooltip = false;
+    var boxRefWidth = ((_a = boxRef === null || boxRef === void 0 ? void 0 : boxRef.current) === null || _a === void 0 ? void 0 : _a.clientWidth) || 0;
+    var addWidth = 0;
+    var linePos = 0;
+    for (var i = 0; i < singleWordRefs.current.length; i++) {
+      var dom = singleWordRefs.current[i];
+      var offsetWidth = dom.offsetWidth;
+      addWidth += offsetWidth;
+      // 累计宽度超出了一行宽度
+      if (addWidth > boxRefWidth) {
+        if (lineArr.length < constData.current.line - 1) {
+          lineArr.push(children.slice(linePos, i));
+          linePos = i;
+          addWidth = offsetWidth; // 重置宽度
+        } else {
+          // 超出
+          showTooltip = true;
+          setTTips(constData.current.tips || children);
+          lineArr.push(children.slice(linePos, children.length));
+          break;
+        }
+      } else {
+        // 未超过且是最后一个字符
+        if (i === singleWordRefs.current.length - 1) {
+          lineArr.push(children.slice(linePos, children.length));
+        }
+      }
+    }
+    setLineClamp({
+      lineArr: lineArr,
+      showTooltip: showTooltip
+    });
+  };
+  /**
+   * 描述文字span包裹
+   */
+  var descriptionRender = useMemo(function () {
+    singleWordRefs.current = [];
+    return jsx("div", Object.assign({
+      className: 'hidden'
+    }, {
+      children: children === null || children === void 0 ? void 0 : children.split('').map(function (word, wIdx) {
+        return jsx("span", Object.assign({
+          ref: function ref(dom) {
+            return dom && singleWordRefs.current.push(dom);
+          }
+        }, {
+          children: word
+        }), wIdx);
+      })
+    }));
+  }, [children]);
+  // 判断浏览器是否是safari
+  var isSafari = function isSafari() {
+    var userAgent = navigator.userAgent;
+    if (userAgent.indexOf("Safari") > -1) {
+      return true;
+    }
+  };
+  // 处理最大宽度
+  var handMaxWidth = function handMaxWidth() {
+    if (tipMaxWidth) return tipMaxWidth;
+    return boxRef && boxRef.current ? boxRef.current.offsetWidth : 0;
+  };
+  // 处理class
+  var handClass = function handClass() {
+    var str = $prefixCls + '-auto-tips-multiline';
+    if (isSafari()) str += ' ' + $prefixCls + '-auto-tips-multiline-safari';
+    if (className) str += ' ' + className;
+    return str;
+  };
+  return jsx("div", Object.assign({
+    ref: boxRef,
+    className: handClass(),
+    style: style
+  }, {
+    children: jsx(Tooltip, Object.assign({
+      arrow: arrow,
+      title: tTips,
+      placement: placement,
+      interactive: interactive,
+      boundariesElement: 'viewport',
+      overlayClassName: $prefixCls + '-auto-tips-multiline-tooltip',
+      maxWidth: handMaxWidth()
+    }, {
+      children: jsxs("div", Object.assign({
+        className: "auto-tips-multiline-content-box"
+      }, {
+        children: [jsx("div", Object.assign({
+          className: 'auto-tips-multiline-content'
+        }, {
+          children: lineClamp === null || lineClamp === void 0 ? void 0 : lineClamp.lineArr.map(function (line, lIdx) {
+            var str = 'line-text';
+            if (lIdx === lineClamp.lineArr.length - 1) str += ' last-line';
+            return jsx("div", Object.assign({
+              className: str
+            }, {
+              children: line
+            }), lIdx);
+          })
+        })), descriptionRender]
+      }))
+    }))
+  }));
+};
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2021/11/1 20:28\n* @description 文字隐藏...\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-auto-tips {\n  max-width: 100%;\n  display: block;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v3-auto-tips > .auto-tips-content {\n  display: inline;\n  max-width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.paraui-v3-auto-tips.paraui-v3-auto-tips-safari > .auto-tips-content::before {\n  content: \"\";\n  display: block;\n}\n\n.paraui-v3-auto-tips-tooltip .component-tooltip-inner {\n  max-height: calc(100vh - 25px);\n  overflow: auto;\n}";
+styleInject(css_248z);
+
+var AutoTips = function AutoTips(props) {
+  var children = props.children,
+    _props$arrow = props.arrow,
+    arrow = _props$arrow === void 0 ? false : _props$arrow,
+    _props$placement = props.placement,
+    placement = _props$placement === void 0 ? "bottom-start" : _props$placement,
+    _props$tips = props.tips,
+    tips = _props$tips === void 0 ? '' : _props$tips,
+    _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$beyondText = props.beyondText,
+    beyondText = _props$beyondText === void 0 ? true : _props$beyondText,
+    _props$interactive = props.interactive,
+    interactive = _props$interactive === void 0 ? true : _props$interactive,
+    tipMaxWidth = props.tipMaxWidth,
+    style = props.style;
+  var tipsElm = useRef();
+  var textElm = useRef();
+  var _useState = useState(''),
+    _useState2 = _slicedToArray(_useState, 2),
+    tTips = _useState2[0],
+    setTTips = _useState2[1];
+  useEffect(function () {
+    setTTips(tips);
+  }, [tips]);
+  // 鼠标移入事件
+  var mouseHover = function mouseHover() {
+    var val = '';
+    var tipsEle = tipsElm.current;
+    var tipsEleRect = tipsEle.getBoundingClientRect();
+    var textEleRect = textElm.current.getBoundingClientRect();
+    if (tipsElm.current) {
+      if (isIE()) {
+        if (tipsEleRect.width > textEleRect.width) {
+          if (tips) {
+            val = tips;
+          } else {
+            val = beyondText ? tipsEle.innerText : children;
+          }
+        }
+      } else {
+        // mac：safari,firefox,chrome
+        // windows: firefox,chrome
+        if (textEleRect.width > tipsEleRect.width) {
+          if (tips) {
+            val = tips;
+          } else {
+            val = beyondText ? tipsEle.innerText : children;
+          }
+        }
+      }
+    }
+    setTTips(val);
+  };
+  // 处理最大宽度
+  var handMaxWidth = function handMaxWidth() {
+    if (tipMaxWidth) return tipMaxWidth;
+    return tipsElm && tipsElm.current ? tipsElm.current.offsetWidth : 0;
+  };
+  // 判断浏览器是否是safari
+  var isSafari = function isSafari() {
+    var userAgent = navigator.userAgent;
+    if (userAgent.indexOf("Safari") > -1) {
+      return true;
+    }
+  };
+  // 处理class
+  var handClass = function handClass() {
+    var str = $prefixCls + '-auto-tips';
+    if (isSafari()) str += ' ' + $prefixCls + '-auto-tips-safari';
+    if (className) str += ' ' + className;
+    return str;
+  };
+  return jsx("div", Object.assign({
+    ref: tipsElm,
+    className: handClass(),
+    onMouseOver: mouseHover,
+    style: style
+  }, {
+    children: jsx(Tooltip, Object.assign({
+      arrow: arrow,
+      title: tTips,
+      placement: placement,
+      interactive: interactive,
+      boundariesElement: 'viewport',
+      overlayClassName: $prefixCls + '-auto-tips-tooltip',
+      maxWidth: handMaxWidth()
+    }, {
+      children: jsx("div", Object.assign({
+        className: "auto-tips-content",
+        ref: textElm
+      }, {
+        children: children
+      }))
+    }))
+  }));
+};
+
+export { AutoTipsMultiline, AutoTips as default };