tntd 3.0.0-beta → 3.0.0-beta.1

package/es/drawer/drawer.js

@@ -1,10 +1,13 @@
-var __rest = this && this.__rest || function (s, e) {
-  var t = {};
-  for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
-  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
-  }
-  return t;
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
 import { ConfigConsumer } from 'antd/es/config-provider';
 import { default as AntdDrawer } from 'antd/es/drawer';
@@ -13,106 +16,50 @@ import classNames from 'classnames';
 import React, { useEffect } from 'react';
 import { Button } from '../button';
 import Icon from '../icon';
-const DefaultFooter = ({
-  locale,
-  onClose,
-  onSubmit,
-  okText,
-  okType,
-  cancelText,
-  confirmLoading,
-  okButtonProps,
-  cancelButtonProps
-}) => {
-  return React.createElement(React.Fragment, null, React.createElement(Button, Object.assign({
-    onClick: onClose,
-    style: {
-      marginRight: 8
-    },
-    type: 'tertiary'
-  }, cancelButtonProps), cancelText || (locale === null || locale === void 0 ? void 0 : locale.cancelText)), React.createElement(Button, Object.assign({
-    onClick: onSubmit,
-    type: okType,
-    loading: confirmLoading
-  }, okButtonProps), okText || (locale === null || locale === void 0 ? void 0 : locale.okText)));
+const DefaultFooter = ({ locale, onClose, onSubmit, okText, okType, cancelText, confirmLoading, okButtonProps, cancelButtonProps, }) => {
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Button, Object.assign({ onClick: onClose, style: { marginRight: 8 }, type: 'tertiary' }, cancelButtonProps), cancelText || (locale === null || locale === void 0 ? void 0 : locale.cancelText)),
+        React.createElement(Button, Object.assign({ onClick: onSubmit, type: okType, loading: confirmLoading }, okButtonProps), okText || (locale === null || locale === void 0 ? void 0 : locale.okText))));
 };
-export const Drawer = _a => {
-  var {
-      closable = true,
-      className,
-      footer,
-      showFooter,
-      onClose,
-      onSubmit,
-      okText = '',
-      cancelText = '',
-      locale,
-      okType = 'primary',
-      confirmLoading = false,
-      okButtonProps = {},
-      cancelButtonProps = {},
-      clickOnBlankToClose = false
-    } = _a,
-    rest = __rest(_a, ["closable", "className", "footer", "showFooter", "onClose", "onSubmit", "okText", "cancelText", "locale", "okType", "confirmLoading", "okButtonProps", "cancelButtonProps", "clickOnBlankToClose"]);
-  const drawerDom = React.useRef(null);
-  useEffect(() => {
-    if (clickOnBlankToClose) {
-      const handleOutsideClick = event => {
-        const drawer = drawerDom.current;
-        const targetElement = event.target;
-        let isInDrawer = false;
-        if (drawer && targetElement) {
-          isInDrawer = drawer.contains(targetElement) || targetElement === drawer;
-        }
-        drawerDom.current = null;
-        if (rest.visible && !isInDrawer && onClose) {
-          onClose();
+export const Drawer = (_a) => {
+    var { closable = true, className, footer, showFooter, onClose, onSubmit, okText = '', cancelText = '', locale, okType = 'primary', confirmLoading = false, okButtonProps = {}, cancelButtonProps = {}, clickOnBlankToClose = false } = _a, rest = __rest(_a, ["closable", "className", "footer", "showFooter", "onClose", "onSubmit", "okText", "cancelText", "locale", "okType", "confirmLoading", "okButtonProps", "cancelButtonProps", "clickOnBlankToClose"]);
+    const drawerDom = React.useRef(null);
+    useEffect(() => {
+        if (clickOnBlankToClose) {
+            const handleOutsideClick = (event) => {
+                const drawer = drawerDom.current;
+                const targetElement = event.target;
+                let isInDrawer = false;
+                if (drawer && targetElement) {
+                    isInDrawer = drawer.contains(targetElement) || targetElement === drawer;
+                }
+                drawerDom.current = null;
+                if (rest.visible && !isInDrawer && onClose) {
+                    onClose();
+                }
+            };
+            document.removeEventListener('click', handleOutsideClick);
+            document.addEventListener('click', handleOutsideClick);
+            return () => {
+                document.removeEventListener('click', handleOutsideClick);
+            };
         }
-      };
-      document.removeEventListener('click', handleOutsideClick);
-      document.addEventListener('click', handleOutsideClick);
-      return () => {
-        document.removeEventListener('click', handleOutsideClick);
-      };
-    }
-  }, [rest.visible, clickOnBlankToClose, onClose]);
-  return React.createElement(ConfigConsumer, null, ({
-    getPrefixCls
-  }) => {
-    const prefixCls = getPrefixCls('drawer');
-    return React.createElement(LocaleReceiver, {
-      componentName: "Drawer",
-      defaultLocale: locale
-    }, locale => {
-      return React.createElement("div", {
-        onClick: event => {
-          drawerDom.current = event.target;
-        }
-      }, React.createElement(AntdDrawer, Object.assign({
-        className: classNames(prefixCls, 'tnt-drawer', className, {
-          [`${prefixCls}-contain-closable`]: closable !== false,
-          [`${prefixCls}-footer`]: showFooter
-        }),
-        closable: false,
-        onClose: onClose,
-        width: 480
-      }, rest), React.createElement(React.Fragment, null, closable !== false && React.createElement(Icon, {
-        type: "close",
-        className: `${prefixCls}-close`,
-        onClick: onClose
-      }), rest.children, showFooter && React.createElement("div", {
-        className: `${prefixCls}-footer-style`
-      }, showFooter && !footer ? React.createElement(DefaultFooter, {
-        confirmLoading: confirmLoading,
-        okButtonProps: okButtonProps,
-        cancelButtonProps: cancelButtonProps,
-        okType: okType,
-        locale: locale,
-        okText: okText,
-        cancelText: cancelText,
-        onClose: onClose,
-        onSubmit: onSubmit
-      }) : footer))));
-    });
-  });
-};
+    }, [rest.visible, clickOnBlankToClose, onClose]);
+    return (React.createElement(ConfigConsumer, null, ({ getPrefixCls }) => {
+        const prefixCls = getPrefixCls('drawer');
+        return (React.createElement(LocaleReceiver, { componentName: "Drawer", defaultLocale: locale }, (locale) => {
+            return (React.createElement("div", { onClick: (event) => {
+                    drawerDom.current = event.target;
+                } },
+                React.createElement(AntdDrawer, Object.assign({ className: classNames(prefixCls, 'tnt-drawer', className, {
+                        [`${prefixCls}-contain-closable`]: closable !== false,
+                        [`${prefixCls}-footer`]: showFooter,
+                    }), closable: false, onClose: onClose, width: 480 }, rest),
+                    React.createElement(React.Fragment, null,
+                        closable !== false && (React.createElement(Icon, { type: "close", className: `${prefixCls}-close`, onClick: onClose })),
+                        rest.children,
+                        showFooter && (React.createElement("div", { className: `${prefixCls}-footer-style` }, showFooter && !footer ? (React.createElement(DefaultFooter, { confirmLoading: confirmLoading, okButtonProps: okButtonProps, cancelButtonProps: cancelButtonProps, okType: okType, locale: locale, okText: okText, cancelText: cancelText, onClose: onClose, onSubmit: onSubmit })) : (footer)))))));
+        }));
+    }));
+};
+//# sourceMappingURL=drawer.js.map

package/es/drawer/index.js

@@ -2,4 +2,5 @@ import './style';
 import { Drawer } from './drawer';
 import './index.less';
 export * from 'antd/es/drawer';
-export default Drawer;
+export default Drawer;
+//# sourceMappingURL=index.js.map

package/es/drawer/style/index.js

@@ -1,4 +1,5 @@
 // deps-lint-skip: empty
 import '../../style/index.less';
 import './index.less';
-import '../index.less';
+import '../index.less';
+//# sourceMappingURL=index.js.map

package/es/dropdown/index.js

@@ -1,4 +1,5 @@
 import Dropdown from 'antd/es/dropdown';
 import './style';
 export * from 'antd/es/dropdown';
-export default Dropdown;
+export default Dropdown;
+//# sourceMappingURL=index.js.map

package/es/dropdown/style/index.js

@@ -1,4 +1,5 @@
 import '../../style/index.less';
 import './index.less';
 // style dependencies
-import '../../button/style';
+import '../../button/style';
+//# sourceMappingURL=index.js.map

package/es/ellipsis/Svg/CopySVG.js

@@ -1,64 +1,17 @@
 import React from 'react';
-export default (props => {
-  return React.createElement("svg", Object.assign({
-    width: "16px",
-    height: "16px",
-    viewBox: "0 0 16 16"
-  }, props), React.createElement("g", {
-    id: "\u5168\u5BB6\u6876\u89C6\u89C9\u65B9\u6848\u4F18\u5316",
-    stroke: "none",
-    strokeWidth: "1",
-    fill: "none",
-    fillRule: "evenodd"
-  }, React.createElement("g", {
-    id: "\u5DE5\u4F5C\u53F01",
-    transform: "translate(-730.000000, -299.000000)"
-  }, React.createElement("g", {
-    id: "\u5206\u7EC4-6",
-    transform: "translate(240.000000, 96.000000)"
-  }, React.createElement("g", {
-    id: "\u7F16\u7EC4-18",
-    transform: "translate(0.000000, 171.000000)"
-  }, React.createElement("g", {
-    id: "\u590D\u5236",
-    transform: "translate(490.000000, 32.000000)"
-  }, React.createElement("rect", {
-    id: "\u77E9\u5F62",
-    fill: "#D8D8D8",
-    opacity: "0",
-    x: "0",
-    y: "0",
-    width: "16",
-    height: "16"
-  }), React.createElement("g", {
-    id: "\u7F16\u7EC4-5",
-    transform: "translate(2.223389, 1.330322)",
-    stroke: "#1e90ff",
-    strokeLinecap: "round",
-    strokeWidth: "1.2"
-  }, React.createElement("polygon", {
-    id: "\u8DEF\u5F84",
-    strokeLinejoin: "round",
-    points: "2 11.3333333 11.3333333 11.3333333 11.3333333 4 7.66666667 -8.8817842e-15 2 -8.8817842e-15"
-  }), React.createElement("polyline", {
-    id: "\u8DEF\u5F84",
-    strokeLinejoin: "round",
-    points: "7.66666667 0 7.66666667 4 11.3333333 4"
-  }), React.createElement("polyline", {
-    id: "\u8DEF\u5F84",
-    strokeLinejoin: "round",
-    points: "0 5.33333333 0 13.3333333 7 13.3333333"
-  }), React.createElement("line", {
-    x1: "4",
-    y1: "5.33333333",
-    x2: "5.33333333",
-    y2: "5.33333333",
-    id: "\u8DEF\u5F84"
-  }), React.createElement("line", {
-    x1: "4",
-    y1: "8",
-    x2: "8",
-    y2: "8",
-    id: "\u8DEF\u5F84"
-  }))))))));
-});
+export default (props) => {
+    return (React.createElement("svg", Object.assign({ width: "16px", height: "16px", viewBox: "0 0 16 16" }, props),
+        React.createElement("g", { id: "\u5168\u5BB6\u6876\u89C6\u89C9\u65B9\u6848\u4F18\u5316", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
+            React.createElement("g", { id: "\u5DE5\u4F5C\u53F01", transform: "translate(-730.000000, -299.000000)" },
+                React.createElement("g", { id: "\u5206\u7EC4-6", transform: "translate(240.000000, 96.000000)" },
+                    React.createElement("g", { id: "\u7F16\u7EC4-18", transform: "translate(0.000000, 171.000000)" },
+                        React.createElement("g", { id: "\u590D\u5236", transform: "translate(490.000000, 32.000000)" },
+                            React.createElement("rect", { id: "\u77E9\u5F62", fill: "#D8D8D8", opacity: "0", x: "0", y: "0", width: "16", height: "16" }),
+                            React.createElement("g", { id: "\u7F16\u7EC4-5", transform: "translate(2.223389, 1.330322)", stroke: "#1e90ff", strokeLinecap: "round", strokeWidth: "1.2" },
+                                React.createElement("polygon", { id: "\u8DEF\u5F84", strokeLinejoin: "round", points: "2 11.3333333 11.3333333 11.3333333 11.3333333 4 7.66666667 -8.8817842e-15 2 -8.8817842e-15" }),
+                                React.createElement("polyline", { id: "\u8DEF\u5F84", strokeLinejoin: "round", points: "7.66666667 0 7.66666667 4 11.3333333 4" }),
+                                React.createElement("polyline", { id: "\u8DEF\u5F84", strokeLinejoin: "round", points: "0 5.33333333 0 13.3333333 7 13.3333333" }),
+                                React.createElement("line", { x1: "4", y1: "5.33333333", x2: "5.33333333", y2: "5.33333333", id: "\u8DEF\u5F84" }),
+                                React.createElement("line", { x1: "4", y1: "8", x2: "8", y2: "8", id: "\u8DEF\u5F84" })))))))));
+};
+//# sourceMappingURL=CopySVG.js.map

package/es/ellipsis/Svg/TickSVG.js

@@ -1,42 +1,12 @@
 import React from 'react';
-export default (props => {
-  return React.createElement("svg", Object.assign({
-    width: "17px",
-    height: "16px",
-    viewBox: "0 0 17 16"
-  }, props), React.createElement("g", {
-    id: "\u5168\u5BB6\u6876\u89C6\u89C9\u65B9\u6848\u4F18\u5316",
-    stroke: "none",
-    strokeWidth: "1",
-    fill: "none",
-    fillRule: "evenodd"
-  }, React.createElement("g", {
-    id: "\u5DE5\u4F5C\u53F01",
-    transform: "translate(-754.000000, -299.000000)"
-  }, React.createElement("g", {
-    id: "\u5206\u7EC4-6",
-    transform: "translate(240.000000, 96.000000)"
-  }, React.createElement("g", {
-    id: "\u7F16\u7EC4-18",
-    transform: "translate(0.000000, 171.000000)"
-  }, React.createElement("g", {
-    id: "\u590D\u5236\u6210\u529F",
-    transform: "translate(514.500000, 32.000000)"
-  }, React.createElement("rect", {
-    id: "\u77E9\u5F62",
-    fillOpacity: "0.01",
-    fill: "#FFFFFF",
-    fillRule: "nonzero",
-    x: "0",
-    y: "0",
-    width: "16",
-    height: "16"
-  }), React.createElement("polyline", {
-    id: "\u8DEF\u5F84",
-    stroke: "#07C790",
-    strokeWidth: "1.2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    points: "14.3333333 3.66666667 5.625 12.3333333 1.66666667 8.39393333"
-  })))))));
-});
+export default (props) => {
+    return (React.createElement("svg", Object.assign({ width: "17px", height: "16px", viewBox: "0 0 17 16" }, props),
+        React.createElement("g", { id: "\u5168\u5BB6\u6876\u89C6\u89C9\u65B9\u6848\u4F18\u5316", stroke: "none", strokeWidth: "1", fill: "none", fillRule: "evenodd" },
+            React.createElement("g", { id: "\u5DE5\u4F5C\u53F01", transform: "translate(-754.000000, -299.000000)" },
+                React.createElement("g", { id: "\u5206\u7EC4-6", transform: "translate(240.000000, 96.000000)" },
+                    React.createElement("g", { id: "\u7F16\u7EC4-18", transform: "translate(0.000000, 171.000000)" },
+                        React.createElement("g", { id: "\u590D\u5236\u6210\u529F", transform: "translate(514.500000, 32.000000)" },
+                            React.createElement("rect", { id: "\u77E9\u5F62", fillOpacity: "0.01", fill: "#FFFFFF", fillRule: "nonzero", x: "0", y: "0", width: "16", height: "16" }),
+                            React.createElement("polyline", { id: "\u8DEF\u5F84", stroke: "#07C790", strokeWidth: "1.2", strokeLinecap: "round", strokeLinejoin: "round", points: "14.3333333 3.66666667 5.625 12.3333333 1.66666667 8.39393333" }))))))));
+};
+//# sourceMappingURL=TickSVG.js.map

package/es/ellipsis/index.js

@@ -11,146 +11,109 @@ import CopySVG from './Svg/CopySVG';
 import TickSVG from './Svg/TickSVG';
 import './index.less';
 const tolerance = 0; // In px. Depends on the font you are using
-const isEllipsisActive = e => {
-  var _a, _b;
-  if (e.offsetWidth === e.scrollWidth && e.offsetHeight === e.scrollHeight) {
-    let styleStr = 'overflow:visible; ';
-    if (!((_b = (_a = e === null || e === void 0 ? void 0 : e.parentNode) === null || _a === void 0 ? void 0 : _a.getAttribute('style')) === null || _b === void 0 ? void 0 : _b.includes('width'))) {
-      styleStr += 'max-width:100%;';
+const isEllipsisActive = (e) => {
+    var _a, _b;
+    if (e.offsetWidth === e.scrollWidth && e.offsetHeight === e.scrollHeight) {
+        let styleStr = 'overflow:visible; ';
+        if (!((_b = (_a = e === null || e === void 0 ? void 0 : e.parentNode) === null || _a === void 0 ? void 0 : _a.getAttribute('style')) === null || _b === void 0 ? void 0 : _b.includes('width'))) {
+            styleStr += 'max-width:100%;';
+        }
+        e.parentNode.setAttribute('style', styleStr);
+        e.setAttribute("style", 'overflow:inherit');
     }
-    e.parentNode.setAttribute('style', styleStr);
-    e.setAttribute("style", 'overflow:inherit');
-  } else {
-    e.setAttribute("style", "");
-  }
-  return e.offsetWidth + tolerance < e.scrollWidth || e.offsetHeight < e.scrollHeight;
+    else {
+        e.setAttribute("style", "");
+    }
+    return e.offsetWidth + tolerance < e.scrollWidth || e.offsetHeight < e.scrollHeight;
 };
-export default (props => {
-  let {
-    _popover = props.Popover,
-    // `Popover` or `Tooltip` ?
-    title,
-    // in most cases for `Tooltip`
-    content,
-    // in most cases for `Popover`
-    className,
-    style,
-    widthLimit,
-    // width trigger value
-    _lines = props.lines !== 1 && props.lines,
-    // number or lines, default 1 line;
-    children,
-    // children Node
-    emptyText,
-    // default: null
-    _copyable = props.copyable,
-    // copy function
-    prefix,
-    // 前缀dom
-    suffix,
-    // 后缀dom
+export default (props) => {
+    let { _popover = props.Popover, // `Popover` or `Tooltip` ?
+    title, // in most cases for `Tooltip`
+    content, // in most cases for `Popover`
+    className, style, widthLimit, // width trigger value
+    _lines = props.lines !== 1 && props.lines, // number or lines, default 1 line;
+    children, // children Node
+    emptyText, // default: null
+    _copyable = props.copyable, // copy function
+    prefix, // 前缀dom
+    suffix, // 后缀dom
     needRefresh = true // select.options的情况下不要刷新
-  } = props;
-  const [renderId, setRenderId] = useState(1);
-  // allow visible or not state
-  const [flag, setFlag] = useState(true);
-  // visible[Tooltip/Popover] state
-  const [tipVisible, setTipVisible] = useState(false);
-  // copy animation state
-  const [hasCopy, setHasCopy] = useState(false);
-  const [lineHeight, setLineHeight] = useState();
-  const elementRef = useRef();
-  const computeElement = () => {
-    elementRef.current && isEllipsisActive(elementRef.current) ? setFlag(true) : (setFlag(false), setTipVisible(false));
-    if (elementRef.current) {
-      setLineHeight(getComputedStyle(elementRef.current, null).getPropertyValue('line-height'));
-    }
-  };
-  useLayoutEffect(() => {
-    if (needRefresh) {
-      setRenderId(id => id + 1);
-    } else {
-      if (renderId < 2) {
-        setRenderId(id => id + 1);
-      }
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [title, needRefresh, content, children]);
-  useEffect(() => {
-    computeElement();
-  }, [renderId]);
-  useEffect(() => {
-    window.addEventListener("resize", computeElement);
-    return () => {
-      window.removeEventListener('resize', computeElement);
+     } = props;
+    const [renderId, setRenderId] = useState(1);
+    // allow visible or not state
+    const [flag, setFlag] = useState(true);
+    // visible[Tooltip/Popover] state
+    const [tipVisible, setTipVisible] = useState(false);
+    // copy animation state
+    const [hasCopy, setHasCopy] = useState(false);
+    const [lineHeight, setLineHeight] = useState();
+    const elementRef = useRef();
+    const computeElement = () => {
+        elementRef.current && isEllipsisActive(elementRef.current)
+            ? setFlag(true)
+            : (setFlag(false), setTipVisible(false));
+        if (elementRef.current) {
+            setLineHeight(getComputedStyle(elementRef.current, null).getPropertyValue('line-height'));
+        }
     };
-  }, []);
-  // original Node
-  const inner = typeof children === 'string' ? children : _popover ? content : title;
-  // for className
-  const getClassName = () => {
-    return `overflow min-width-0 ${_lines ? 'ellipsis-wrap' : 'ellipsis-nowrap'} ${className || ''}`;
-  };
-  // Tooltip.trigger(default 'hover') ==trigger==> onVisibleChange(visible)
-  const handleVisibleChange = visible => {
-    // const { onVisibleChange } = props;
-    // onVisibleChange(visible);
-    flag && setTipVisible(visible);
-  };
-  // onClick Copy Button
-  const handleCopy = innerText => {
-    copy(innerText);
-    setHasCopy(!hasCopy);
-    setTimeout(() => {
-      setHasCopy(false);
-    }, 1000);
-  };
-  const renderNode = () => {
-    const popoverNode = React.createElement(Popover, Object.assign({}, props, {
-      content: content || children,
-      visible: tipVisible,
-      onVisibleChange: visible => handleVisibleChange(visible)
-    }), React.createElement("div", {
-      className: className,
-      style: {
-        WebkitLineClamp: _lines
-      },
-      ref: elementRef
-    }, children || content));
-    const tooltipNode = React.createElement(Tooltip, Object.assign({}, props, {
-      title: title || children,
-      visible: tipVisible,
-      onVisibleChange: visible => handleVisibleChange(visible)
-    }), React.createElement("div", {
-      className: className,
-      style: {
-        WebkitLineClamp: _lines
-      },
-      ref: elementRef
-    }, children || title));
-    return _popover ? popoverNode : tooltipNode;
-  };
-  return React.createElement(React.Fragment, null, React.createElement("div", {
-    className: "tntd-ellipsis",
-    style: Object.assign(Object.assign({}, style), {
-      maxWidth: widthLimit
-    })
-  }, prefix && prefix, React.createElement("div", {
-    className: getClassName(),
-    key: renderId
-  }, inner ? renderNode() : emptyText), suffix && suffix, inner && _copyable && lineHeight && React.createElement("div", {
-    className: "svg-button",
-    style: {
-      height: lineHeight
-    },
-    onClick: () => handleCopy(elementRef.current.innerText)
-  }, !hasCopy ? React.createElement(CopySVG, {
-    style: {
-      height: lineHeight
-    }
-  }) : React.createElement(TickSVG, {
-    style: {
-      height: lineHeight
-    }
-  }))));
-});
+    useLayoutEffect(() => {
+        if (needRefresh) {
+            setRenderId(id => id + 1);
+        }
+        else {
+            if (renderId < 2) {
+                setRenderId(id => id + 1);
+            }
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [title, needRefresh, content, children]);
+    useEffect(() => {
+        computeElement();
+    }, [renderId]);
+    useEffect(() => {
+        window.addEventListener("resize", computeElement);
+        return () => {
+            window.removeEventListener('resize', computeElement);
+        };
+    }, []);
+    // original Node
+    const inner = typeof children === 'string' ? children : _popover ? content : title;
+    // for className
+    const getClassName = () => {
+        return `overflow min-width-0 ${_lines ? 'ellipsis-wrap' : 'ellipsis-nowrap'} ${className || ''}`;
+    };
+    // Tooltip.trigger(default 'hover') ==trigger==> onVisibleChange(visible)
+    const handleVisibleChange = (visible) => {
+        // const { onVisibleChange } = props;
+        // onVisibleChange(visible);
+        flag && setTipVisible(visible);
+    };
+    // onClick Copy Button
+    const handleCopy = (innerText) => {
+        copy(innerText);
+        setHasCopy(!hasCopy);
+        setTimeout(() => {
+            setHasCopy(false);
+        }, 1000);
+    };
+    const renderNode = () => {
+        const popoverNode = (React.createElement(Popover, Object.assign({}, props, { content: content || children, visible: tipVisible, onVisibleChange: (visible) => handleVisibleChange(visible) }),
+            React.createElement("div", { className: className, style: { WebkitLineClamp: _lines }, ref: elementRef }, children || content)));
+        const tooltipNode = (React.createElement(Tooltip, Object.assign({}, props, { title: title || children, visible: tipVisible, onVisibleChange: (visible) => handleVisibleChange(visible) }),
+            React.createElement("div", { className: className, style: { WebkitLineClamp: _lines }, ref: elementRef }, children || title)));
+        return _popover ? popoverNode : tooltipNode;
+    };
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "tntd-ellipsis", style: Object.assign(Object.assign({}, style), { maxWidth: widthLimit }) },
+            prefix && prefix,
+            React.createElement("div", { className: getClassName(), key: renderId }, inner ? renderNode() : emptyText),
+            suffix && suffix,
+            inner && _copyable && lineHeight && (React.createElement("div", { className: "svg-button", style: {
+                    height: lineHeight,
+                }, onClick: () => handleCopy(elementRef.current.innerText) }, !hasCopy ? (React.createElement(CopySVG, { style: {
+                    height: lineHeight,
+                } })) : (React.createElement(TickSVG, { style: {
+                    height: lineHeight,
+                } })))))));
+};
+//# sourceMappingURL=index.js.map