tntd 1.4.17 → 2.0.0-beta-1

package/es/Ellipsis/index.js

@@ -1,155 +0,0 @@
-import "antd/lib/tooltip/style";
-import _Tooltip from "antd/lib/tooltip";
-import "antd/lib/popover/style";
-import _Popover from "antd/lib/popover";
-
-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; }
-
-/*
- * @Author: 梁洪刚
- * @CreatDate: 2021-03-31 13:57:32
- * @Describe: 省略号组件
- */
-import { useState, useEffect, useRef } from 'react';
-import copy from 'copy-to-clipboard';
-import CopySVG from './Svg/CopySVG';
-import TickSVG from './Svg/TickSVG';
-import './index.less';
-var tolerance = 0; // In px. Depends on the font you are using
-
-var isEllipsisActive = function isEllipsisActive(e) {
-  if (e.offsetWidth === e.scrollWidth && e.offsetHeight === e.scrollHeight) {
-    var _e$parentNode, _e$parentNode$getAttr;
-
-    var styleStr = 'overflow:visible; ';
-
-    if (!(e == null ? void 0 : (_e$parentNode = e.parentNode) == null ? void 0 : (_e$parentNode$getAttr = _e$parentNode.getAttribute('style')) == null ? void 0 : _e$parentNode$getAttr.includes('width'))) {
-      styleStr += 'width:100%;';
-    }
-
-    e.parentNode.setAttribute('style', styleStr);
-  }
-
-  return e.offsetWidth + tolerance < e.scrollWidth || e.offsetHeight < e.scrollHeight;
-};
-
-export default (function (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 = useState(true),
-      _useState2 = _slicedToArray(_useState, 2),
-      flag = _useState2[0],
-      setFlag = _useState2[1]; // visible[Tooltip/Popover] state
-
-
-  var _useState3 = useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      tipVisible = _useState4[0],
-      setTipVisible = _useState4[1]; // copy animation state
-
-
-  var _useState5 = useState(false),
-      _useState6 = _slicedToArray(_useState5, 2),
-      hasCopy = _useState6[0],
-      setHasCopy = _useState6[1];
-
-  var elementRef = useRef();
-  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) {
-    copy(innerText);
-    setHasCopy(!hasCopy);
-    setTimeout(function () {
-      setHasCopy(false);
-    }, 1000);
-  };
-
-  var renderNode = function renderNode() {
-    var popoverNode = React.createElement(_Popover, _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, _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, null) : React.createElement(TickSVG, null))));
-});

package/es/Ellipsis/index.less

@@ -1,56 +0,0 @@
-.tnt-ellipsis{
-    display:flex;
-    .overflow{
-        // white-space:nowrap;     //溢出不换行
-        overflow:hidden;        //超出的文本隐藏
-        text-overflow:ellipsis; //溢出用省略号显示
-        i {
-            margin: 0 0.3em;
-        }
-    }
-    
-    .ellipsis-nowrap{
-        white-space:nowrap;     //溢出不换行
-        & * {
-            overflow:hidden;        //超出的文本隐藏
-            text-overflow:ellipsis; //溢出用省略号显示
-        }
-    }
-    
-    .ellipsis-wrap{
-        display:-webkit-inline-box;
-        -webkit-line-clamp:2;
-        -webkit-box-orient:vertical;
-        overflow:hidden;
-        text-overflow:ellipsis;
-    }
-    
-    .button{
-        height:20px;
-        width:20px;
-        display: inline-flex;
-        align-items: center;
-        margin-left: 8px;
-        :hover{
-            cursor: pointer;
-        }
-    }
-    
-    .button-hidden{
-        display:none !important;
-    }
-    
-    .button-active{
-        display: inline-flex;
-        g{
-            animation: copy-active 0.3s;
-        }
-    }
-    
-    @keyframes copy-active
-    {
-        from {stroke: #07C790;}
-        to {stroke: #1e90ff;}
-    }
-}
-

package/es/Handle/README.md

@@ -1,104 +0,0 @@
-## Handle组件
-### 代码演示
-```jsx
-import React from 'react';
-import ReactDOM from 'react-dom';
-import 'antd/dist/antd.css';
-import {Button, Table, Popconfirm} from 'antd';
-import { Handle } from 'tntd';
-
-const Demo = props => {
-    const dataSource = [
-        {
-            key: '1',
-            name: '胡彦斌',
-            age: 32,
-            address: '西湖区湖底公园1号',
-        },
-        {
-            key: '2',
-            name: '胡彦祖',
-            age: 42,
-            address: '西湖区湖底公园1号',
-        },
-    ];
-
-    const columns = [
-        {
-            title: '姓名',
-            dataIndex: 'name',
-            key: 'name',
-            width: 500,
-        },
-        {
-            title: '年龄',
-            dataIndex: 'age',
-            key: 'age',
-            width: 600,
-        },
-        {
-            title: '住址',
-            dataIndex: 'address',
-            key: 'address',
-            width: 400,
-        },
-        {
-            title: '操作',
-            dataIndex:'opera',
-            fixed:"right",
-            width: 230,
-            render:()=>{
-                return (
-                    <Handle className="custom-class" num={3}>
-                        <a onClick={()=>{console.log("online")}}>上线</a>
-                        <a>查看</a>
-                        <a>编辑</a>
-                        <a>测试</a>
-                        {
-                            false && 
-                            <a>导入</a>
-                        }
-                        <a>导出</a>
-                        <Popconfirm
-                            title="Are you sure delete this task?"
-                            onConfirm={void 0}
-                            onCancel={void 0}
-                            okText="Yes"
-                            cancelText="No"
-                            onClick={e => e.stopPropagation()}
-                            getPopupContainer={trigger => trigger.parentNode}
-                            trigger="hover"
-                            overlayStyle={{
-                                width: 300
-                            }}
-                        >
-                            <a>Delete</a>
-                        </Popconfirm>
-                    </Handle>
-                )
-            }
-        }
-    ];
-
-    return (
-        <Table dataSource={dataSource} columns={columns} rowKey={(e,i)=>i} scroll={{x:1000}}/>
-    );
-};
-
-
-ReactDOM.render(
-    <Demo />,
-    document.getElementById('root')
-);
-```
-### API
-#### Handle
-| 属性名称    | 属性说明                           | 类型     | 默认值      | 是否必须 |
-| :---------- | :------------------------------ | :------ | :---------- | :------- |
-| type        | 类型，展示“更多”的模式，Icon或者文字 | String   | 文字          | 否       |
-| num        | 最多展示的个数                     | Number   |    3      | 否      |
-| lessOneMoreFit  | 当更多中等于1个的时候不显示更多                     | Bool   | false         | 否       |
-| divider  | 分隔线                     | Bool   | true          | 否       |
-| lang       | 中英文                     | String   | cn          | 否       |
-| className  | 自定义类名                     | String   | 无          | 否       |
-

package/es/Handle/index.js

@@ -1,92 +0,0 @@
-import "antd/lib/dropdown/style";
-import _Dropdown from "antd/lib/dropdown";
-import "antd/lib/menu/style";
-import _Menu from "antd/lib/menu";
-import "antd/lib/divider/style";
-import _Divider from "antd/lib/divider";
-
-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; }
-
-import { Fragment } from 'react';
-import Icon from '../Icon';
-import './index.less';
-var clsPrefix = 'tnt-more-menus';
-export default (function (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(Fragment, {
-        key: i
-      }, dom, !(i === preChildLen - 1 && !((_lastChildPart = lastChildPart) == null ? void 0 : _lastChildPart.length) // 没有更多 且 是最后一个时 不显示 Divider
-      ) && React.createElement(_Divider, {
-        type: "vertical"
-      }));
-    });
-  }
-
-  var menu = React.createElement(_Menu, {
-    className: "org-pop-opera-btn"
-  }, (_lastChildPart2 = lastChildPart) == null ? void 0 : _lastChildPart2.map(function (child, i) {
-    return React.createElement(_Menu.Item, {
-      key: i
-    }, child);
-  }));
-  return React.createElement("div", _extends({
-    onClick: function onClick(e) {
-      e.stopPropagation();
-    }
-  }, rest), preChildPart, ((_lastChildPart3 = lastChildPart) == null ? void 0 : _lastChildPart3.length) > 0 && React.createElement(_Dropdown, {
-    overlay: menu,
-    arrow: true
-  }, type === 'icon' ? React.createElement(Icon, {
-    type: "more"
-  }) : React.createElement("a", {
-    className: "ant-dropdown-more"
-  }, lang === 'en' ? 'More' : '更多', React.createElement("i", {
-    className: "".concat(clsPrefix, "-dropdown-icon")
-  }, React.createElement(Icon, {
-    type: "down"
-  })))));
-});

package/es/Handle/index.less

@@ -1,9 +0,0 @@
-.tnt-more-menus {
-    // display: flex;
-    // align-items: center;
-
-    &-dropdown-icon {
-        font-size: 12px;
-        margin-left: 2px;
-    }
-}

package/es/Icon/README.md

@@ -1,119 +0,0 @@
-## Icon组件
-### 代码演示
-```jsx
-import { Fragment, useState } from 'react';
-import ReactDOM from 'react-dom';
-import { createGlobalStyle } from 'styled-components';
-import { Icon } from 'tntd';
-import 'antd/dist/antd.css';
-
-const GlobalStyle = createGlobalStyle`
-  .site-body {
-    .ichYgh {
-        padding: 0;
-        overflow: visible;
-    }
-}
-`;
-
-ReactDOM.render(
-    <Icon type="analysis" />,
-    document.getElementById('root')
-);
-```
-
-```jsx
-import { Fragment, useState } from 'react';
-import ReactDOM from 'react-dom';
-import styled, { createGlobalStyle } from 'styled-components';
-import { Input } from 'antd';
-import { Icon } from 'tntd';
-import icons from 'tntd/Icon/iconList';
-import 'antd/dist/antd.css';
-
-const GlobalStyle = createGlobalStyle`
-  .site-body {
-    .ichYgh {
-        padding: 0;
-        overflow: visible;
-    }
-}
-`;
-
-const IconList = styled.ul`
-    margin: 10px 0;
-    overflow: hidden;
-    list-style: none;
-`;
-const IconItem = styled.li`
-    position: relative;
-    float: left;
-    width: 16.66%;
-    height: 100px;
-    margin: 3px 0;
-    padding: 10px 0 0;
-    overflow: hidden;
-    color: #555;
-    text-align: center;
-    list-style: none;
-    background-color: inherit;
-    border-radius: 4px;
-    cursor: pointer;
-    -webkit-transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
-    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
-    &:hover {
-        color: #fff;
-        background-color: #1890ff;
-    }
-    .tnt-icon {
-        margin: 12px 0 8px;
-        font-size: 36px;
-        -webkit-transition: -webkit-transform 0.3s ease-in-out;
-        transition: -webkit-transform 0.3s ease-in-out;
-        transition: transform 0.3s ease-in-out;
-        transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
-        will-change: transform;
-    }
-`;
-
-const IconsDemo = props => {
-    const [searchValue, setSearchValue] = useState();
-
-    return (
-        <Fragment>
-            <Input.Search
-                onChange={evt => setSearchValue(evt.target.value)}
-                placeholder="输入icon标识搜索"
-            />
-            <IconList>
-                {
-                    icons.filter(
-                        icon => (!searchValue || new RegExp(searchValue, 'i').test(icon))
-                    ).map(icon => (
-                        <IconItem key={icon}>
-                            <Icon type={icon} />
-                            <p>{icon}</p>
-                        </IconItem>
-                    ))
-                }
-            </IconList>
-            <GlobalStyle />
-        </Fragment>
-    );
-};
-
-
-ReactDOM.render(
-    <IconsDemo />,
-    document.getElementById('root')
-);
-```
-
-
-### API
-#### Icon
-
-| 属性名称    | 属性说明                           | 类型     | 默认值      | 是否必须 |
-| :---------- | :------------------------------ | :------ | :---------- | :------- |
-| type        | icon类型标识                     | string   | 无          | 是       |
-| prefix      | type 前缀                       | string   |         | 否       |