tntd 1.4.4 → 1.4.7

package/lib/Ellipsis/Svg/TickSVG.js

@@ -1,50 +1,18 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-var _default = function _default(props) {
-  return React.createElement("div", props, React.createElement("svg", {
-    width: "17px",
-    height: "16px",
-    viewBox: "0 0 17 16"
-  }, React.createElement("g", {
-    id: "\u5168\u5BB6\u6876\u89C6\u89C9\u65B9\u6848\u4F18\u5316",
-    stroke: "none",
-    "stroke-width": "1",
-    fill: "none",
-    "fill-rule": "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",
-    "fill-opacity": "0.01",
-    fill: "#FFFFFF",
-    "fill-rule": "nonzero",
-    x: "0",
-    y: "0",
-    width: "16",
-    height: "16"
-  }), React.createElement("polyline", {
-    id: "\u8DEF\u5F84",
-    stroke: "#07C790",
-    "stroke-width": "1.2",
-    "stroke-linecap": "round",
-    "stroke-linejoin": "round",
-    points: "14.3333333 3.66666667 5.625 12.3333333 1.66666667 8.39393333"
-  }))))))));
+export default props => {
+	return <div {...props}>
+		<svg width="17px" height="16px" viewBox="0 0 17 16">
+			<g id="全家桶视觉方案优化" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+				<g id="工作台1" transform="translate(-754.000000, -299.000000)">
+					<g id="分组-6" transform="translate(240.000000, 96.000000)">
+						<g id="编组-18" transform="translate(0.000000, 171.000000)">
+							<g id="复制成功" transform="translate(514.500000, 32.000000)">
+								<rect id="矩形" fill-opacity="0.01" fill="#FFFFFF" fill-rule="nonzero" x="0" y="0" width="16" height="16"></rect>
+								<polyline id="路径" stroke="#07C790" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round" points="14.3333333 3.66666667 5.625 12.3333333 1.66666667 8.39393333"></polyline>
+							</g>
+						</g>
+					</g>
+				</g>
+			</g>
+		</svg>
+	</div>;
 };
-
-exports["default"] = _default;

package/lib/Ellipsis/index.js

@@ -1,157 +1,151 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-require("antd/lib/tooltip/style");
-
-var _tooltip = _interopRequireDefault(require("antd/lib/tooltip"));
-
-require("antd/lib/popover/style");
-
-var _popover2 = _interopRequireDefault(require("antd/lib/popover"));
-
-var _react = require("react");
-
-var _copyToClipboard = _interopRequireDefault(require("copy-to-clipboard"));
-
-var _CopySVG = _interopRequireDefault(require("./Svg/CopySVG"));
-
-var _TickSVG = _interopRequireDefault(require("./Svg/TickSVG"));
-
-require("./index.less");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-function _extends() { _extends = Object.assign || 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 _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }
-
-function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
-var tolerance = 0; // In px. Depends on the font you are using
-
-var isEllipsisActive = function isEllipsisActive(e) {
-  return e.offsetWidth + tolerance < e.scrollWidth || e.offsetHeight < e.scrollHeight;
+/*
+ * @Author: 梁洪刚
+ * @CreatDate: 2021-03-31 13:57:32
+ * @Describe: 省略号组件
+ */
+
+import { useState, useEffect, useRef } from 'react';
+import { Popover, Tooltip } from 'antd';
+import copy from 'copy-to-clipboard';
+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) => {
+    return e.offsetWidth + tolerance < e.scrollWidth || e.offsetHeight < e.scrollHeight;
 };
 
-var _default = function _default(props) {
-  var _props$_popover = props._popover,
-      _popover = _props$_popover === void 0 ? props.Popover : _props$_popover,
-      title = props.title,
-      content = props.content,
-      className = props.className,
-      style = props.style,
-      widthLimit = props.widthLimit,
-      _props$_lines = props._lines,
-      _lines = _props$_lines === void 0 ? props.lines !== 1 && props.lines : _props$_lines,
-      children = props.children,
-      emptyText = props.emptyText,
-      _props$_copyable = props._copyable,
-      _copyable = _props$_copyable === void 0 ? props.copyable : _props$_copyable,
-      prefix = props.prefix,
-      suffix = props.suffix; // allow visible or not state
-
-
-  var _useState = (0, _react.useState)(true),
-      _useState2 = _slicedToArray(_useState, 2),
-      flag = _useState2[0],
-      setFlag = _useState2[1]; // visible[Tooltip/Popover] state
-
-
-  var _useState3 = (0, _react.useState)(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      tipVisible = _useState4[0],
-      setTipVisible = _useState4[1]; // copy animation state
-
-
-  var _useState5 = (0, _react.useState)(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      hasCopy = _useState6[0],
-      setHasCopy = _useState6[1];
-
-  var elementRef = (0, _react.useRef)();
-  (0, _react.useEffect)(function () {
-    elementRef.current && isEllipsisActive(elementRef.current) ? setFlag(true) : (setFlag(false), setTipVisible(false));
-  }); // original Node
-
-  var inner = typeof children === 'string' ? children : _popover ? content : title; // for className
-
-  var getClassName = function getClassName() {
-    return "overflow ".concat(_lines ? 'ellipsis-wrap' : 'ellipsis-nowrap', " ").concat(className || '');
-  }; // Tooltip.trigger(default 'hover') ==trigger==> onVisibleChange(visible)
-
-
-  var handleVisibleChange = function handleVisibleChange(visible) {
-    // const { onVisibleChange } = props;
-    // onVisibleChange(visible);
-    flag && setTipVisible(visible);
-  }; // onClick Copy Button
-
-
-  var handleCopy = function handleCopy(innerText) {
-    (0, _copyToClipboard["default"])(innerText);
-    setHasCopy(!hasCopy);
-    setTimeout(function () {
-      setHasCopy(false);
-    }, 1000);
-  };
-
-  var renderNode = function renderNode() {
-    var popoverNode = React.createElement(_popover2["default"], _extends({}, props, {
-      content: content || children,
-      visible: tipVisible,
-      onVisibleChange: function onVisibleChange(visible) {
-        return handleVisibleChange(visible);
-      }
-    }), React.createElement("div", {
-      className: className,
-      style: {
-        WebkitLineClamp: _lines
-      },
-      ref: elementRef
-    }, children || content));
-    var tooltipNode = React.createElement(_tooltip["default"], _extends({}, props, {
-      title: title || children,
-      visible: tipVisible,
-      onVisibleChange: function onVisibleChange(visible) {
-        return 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: "tnt-ellipsis",
-    style: _objectSpread({}, style, {
-      maxWidth: widthLimit
-    })
-  }, prefix && prefix, React.createElement("div", {
-    className: getClassName()
-  }, inner ? renderNode() : emptyText), suffix && suffix, inner && _copyable && React.createElement("div", {
-    className: "svg-button",
-    onClick: function onClick() {
-      return handleCopy(elementRef.current.innerText);
-    }
-  }, !hasCopy ? React.createElement(_CopySVG["default"], null) : React.createElement(_TickSVG["default"], null))));
+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
+    } = props;
+
+    // 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 elementRef = useRef();
+
+    useEffect(() => {
+        elementRef.current && isEllipsisActive(elementRef.current)
+            ? setFlag(true)
+            : (
+                setFlag(false),
+                setTipVisible(false)
+            );
+    });
+
+    // original Node
+    const inner = typeof children === 'string' ? children : (_popover ? content : title);
+
+    // for className
+    const getClassName = () => {
+        return `overflow ${_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 = (
+            <Popover
+                {...props}
+                content={content || children}
+                visible={tipVisible}
+                onVisibleChange={(visible) => handleVisibleChange(visible)}
+            >
+                <div
+                    className={className}
+                    style={{ WebkitLineClamp: _lines }}
+                    ref={elementRef}
+                >
+                    {children || content}
+                </div>
+            </Popover>
+        );
+
+        const tooltipNode = (
+            <Tooltip
+                {...props}
+                title={title || children}
+                visible={tipVisible}
+                onVisibleChange={(visible) => handleVisibleChange(visible)}
+            >
+                <div
+                    className={className}
+                    style={{ WebkitLineClamp: _lines }}
+                    ref={elementRef}
+                >
+                    {children || title}
+                </div>
+            </Tooltip>
+        );
+
+        return _popover ? popoverNode : tooltipNode;
+
+    };
+
+    return <>
+        <div
+            className="tnt-ellipsis"
+            style={{
+                ...style,
+                maxWidth: widthLimit
+            }}
+        >
+            {/* prefix */}
+            {prefix && prefix}
+            {/* content */}
+            <div
+                className={getClassName()}
+            >
+                {inner ? renderNode() : emptyText}
+            </div>
+            {/* suffix */}
+            {suffix && suffix}
+            {/* copyable button */}
+            {
+                inner && _copyable &&
+                <div
+                    className='svg-button'
+                    onClick={() => handleCopy(elementRef.current.innerText)}
+                >
+                    {
+                        !hasCopy
+                            ? <CopySVG />
+                            : <TickSVG />
+                    }
+                </div>
+            }
+        </div>
+    </>;
 };
-
-exports["default"] = _default;

package/lib/Handle/index.js

@@ -1,112 +1,75 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = void 0;
-
-require("antd/lib/dropdown/style");
-
-var _dropdown = _interopRequireDefault(require("antd/lib/dropdown"));
-
-require("antd/lib/menu/style");
-
-var _menu = _interopRequireDefault(require("antd/lib/menu"));
-
-require("antd/lib/divider/style");
-
-var _divider = _interopRequireDefault(require("antd/lib/divider"));
-
-var _react = require("react");
-
-var _Icon = _interopRequireDefault(require("../Icon"));
-
-require("./index.less");
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _extends() { _extends = Object.assign || 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 _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; }
-
-var clsPrefix = 'tnt-more-menus';
-
-var _default = function _default(props) {
-  var _lastChildPart2, _lastChildPart3;
-
-  var _ref = props || {},
-      _ref$children = _ref.children,
-      children = _ref$children === void 0 ? [] : _ref$children,
-      type = _ref.type,
-      _ref$num = _ref.num,
-      num = _ref$num === void 0 ? 3 : _ref$num,
-      lang = _ref.lang,
-      _ref$divider = _ref.divider,
-      divider = _ref$divider === void 0 ? true : _ref$divider,
-      lessOneMoreFit = _ref.lessOneMoreFit,
-      rest = _objectWithoutProperties(_ref, ["children", "type", "num", "lang", "divider", "lessOneMoreFit"]);
-
-  var newChildren = [];
-
-  if (Array.isArray(children)) {
-    newChildren = (children == null ? void 0 : children.filter(function (item) {
-      return !!item;
-    })) || [];
-  } else if (children) {
-    newChildren.push(children);
-  }
-
-  var preChildPart = newChildren,
-      lastChildPart = null; // 只有1个时不适配
-
-  if (lessOneMoreFit && newChildren.length - num === 1) {
-    preChildPart = newChildren;
-  } else if (newChildren && num && !isNaN(num) && newChildren.length > num) {
-    preChildPart = newChildren.slice(0, num);
-    lastChildPart = newChildren.slice(num);
-  }
-
-  ;
-
-  if (divider && preChildPart) {
-    var preChildLen = preChildPart.length;
-    preChildPart = preChildPart.map(function (dom, i) {
-      var _lastChildPart;
-
-      return React.createElement(_react.Fragment, {
-        key: i
-      }, dom, !(i === preChildLen - 1 && !((_lastChildPart = lastChildPart) == null ? void 0 : _lastChildPart.length) // 没有更多 且 是最后一个时 不显示 Divider
-      ) && React.createElement(_divider["default"], {
-        type: "vertical"
-      }));
-    });
-  }
+import { Fragment } from 'react';
+import { Dropdown, Menu, Divider } from 'antd';
+import Icon from '../Icon';
+import './index.less';
+
+const clsPrefix = 'tnt-more-menus';
+
+export default props => {
+    const { children = [], type, num = 3, lang, divider = true, lessOneMoreFit, ...rest } = props || {};
+    let newChildren = [];
+    if(Array.isArray(children)){
+        newChildren = children?.filter(item => !!item) || [];
+    }else if(children){
+        newChildren.push(children);
+    }
 
-  var menu = React.createElement(_menu["default"], {
-    className: "org-pop-opera-btn"
-  }, (_lastChildPart2 = lastChildPart) == null ? void 0 : _lastChildPart2.map(function (child, i) {
-    return React.createElement(_menu["default"].Item, {
-      key: i
-    }, child);
-  }));
-  return React.createElement("div", _extends({
-    onClick: function onClick(e) {
-      e.stopPropagation();
+    let [preChildPart, lastChildPart] = [newChildren, null];
+
+    // 只有1个时不适配
+    if (lessOneMoreFit && newChildren.length - num === 1) {
+        preChildPart = newChildren;
+    } else if (newChildren && num && !isNaN(num) && newChildren.length > num) {
+        preChildPart = newChildren.slice(0, num);
+        lastChildPart = newChildren.slice(num);
+    };
+
+    if (divider && preChildPart) {
+        const preChildLen = preChildPart.length;
+        preChildPart = preChildPart.map((dom, i) => (
+            <Fragment key = {i}>
+                {dom}
+                {
+                    !(
+                        i === (preChildLen - 1) &&
+                        !lastChildPart?.length // 没有更多 且 是最后一个时 不显示 Divider
+                    ) &&
+                    <Divider type="vertical" />
+                }
+            </Fragment>
+        ));
     }
-  }, rest), preChildPart, ((_lastChildPart3 = lastChildPart) == null ? void 0 : _lastChildPart3.length) > 0 && React.createElement(_dropdown["default"], {
-    overlay: menu,
-    arrow: true
-  }, type === 'icon' ? React.createElement(_Icon["default"], {
-    type: "more"
-  }) : React.createElement("a", {
-    className: "ant-dropdown-more"
-  }, lang === 'en' ? 'More' : '更多', React.createElement("i", {
-    className: "".concat(clsPrefix, "-dropdown-icon")
-  }, React.createElement(_Icon["default"], {
-    type: "down"
-  })))));
+    const menu = (
+        <Menu className="org-pop-opera-btn">
+            {
+                lastChildPart?.map(
+                    (child,i) => <Menu.Item key={i}>{child}</Menu.Item>
+                )
+            }
+        </Menu>
+    );
+
+    return (
+        <div
+            onClick={(e) => { e.stopPropagation(); }}
+            {...rest}
+        >
+            {preChildPart}
+            {
+                lastChildPart?.length > 0 &&
+                <Dropdown overlay={menu} arrow>
+                    {
+                        type === 'icon' ?
+                            <Icon type="more" /> :
+                            <a className="ant-dropdown-more">
+                                {lang === 'en' ? 'More' : '更多'}
+                                <i className={`${clsPrefix}-dropdown-icon`}>
+                                    <Icon type="down" />
+                                </i>
+                            </a>
+                    }
+                </Dropdown>
+            }
+        </div>
+    );
 };
-
-exports["default"] = _default;