shineout 1.8.0-beta.2 → 1.8.0-rc.4

package/css/AnimationList/AbsoluteList.js

@@ -50,6 +50,16 @@ function initRoot() {
   document.body.appendChild(root);
 }
 
+var getOverDocStyle = function getOverDocStyle() {
+  return (0, _config.isRTL)() ? {
+    left: 0,
+    right: 'auto'
+  } : {
+    right: 0,
+    left: 'auto'
+  };
+};
+
 var listPosition = ['drop-down', 'drop-up'];
 var pickerPosition = ['left-bottom', 'left-top', 'right-bottom', 'right-top'];
 var dropdownPosition = ['bottom-left', 'bottom-right', 'top-left', 'top-right'];
@@ -121,7 +131,8 @@ function _default(List) {
       var position = this.props.position;
       var rtl = (0, _config.isRTL)();
       var style = {
-        position: 'absolute'
+        position: 'absolute',
+        right: 'auto'
       };
 
       if (fixed) {
@@ -137,13 +148,8 @@ function _default(List) {
         position = (0, _strings.getRTLPosition)(position);
       }
 
-      var containerScroll = _document.docScroll;
-      var containerRect = {
-        left: 0,
-        top: 0,
-        right: 0,
-        bottom: 0
-      };
+      var containerScroll;
+      var containerRect;
       var container = this.container;
 
       if (typeof absolute === 'function' && container) {
@@ -152,6 +158,22 @@ function _default(List) {
           left: container.scrollLeft,
           top: container.scrollTop
         };
+
+        if (rtl) {
+          containerScroll.width = container.scrollWidth;
+        }
+      } else {
+        containerRect = {
+          left: 0,
+          top: 0,
+          right: 0,
+          bottom: 0
+        };
+        containerScroll = _document.docScroll;
+
+        if (rtl) {
+          containerRect.width = document.documentElement.clientWidth || document.body.clientWidth;
+        }
       }
 
       this.containerRect = containerRect;
@@ -159,10 +181,6 @@ function _default(List) {
       if (listPosition.includes(position)) {
         style.left = rect.left - containerRect.left + containerScroll.left;
 
-        if (rtl) {
-          style.left += rect.width;
-        }
-
         if (position === 'drop-down') {
           style.top = rect.top - containerRect.top + rect.height + containerScroll.top;
         } else {
@@ -188,6 +206,11 @@ function _default(List) {
         }
       }
 
+      if (rtl && style.left) {
+        style.right = containerRect.width - rect.width - style.left;
+        style.left = 'auto';
+      }
+
       return style;
     };
 
@@ -243,7 +266,14 @@ function _default(List) {
         left: 0,
         width: 0
       };
-      var overdoc = left - containerRect.left + pos.width > (containerRect.width || _document.docSize.width);
+      var overdoc;
+
+      if ((0, _config.isRTL)()) {
+        overdoc = pos.left < containerRect.left;
+      } else {
+        overdoc = left - containerRect.left + pos.width > (containerRect.width || _document.docSize.width);
+      }
+
       if (this.state.overdoc === overdoc) return;
       this.ajustdoc = true;
       this.setState({
@@ -273,10 +303,7 @@ function _default(List) {
           props = (0, _objectWithoutPropertiesLoose2.default)(_this$props4, ["parentElement", "absolute", "focus", "rootClass", "position", "scrollLeft", "scrollTop", "scrollElement", "style", "zIndex", "getResetPosition", "autoAdapt"]);
       var parsed = parseInt(zIndex, 10);
       if (!Number.isNaN(parsed)) style.zIndex = parsed;
-      var mergeStyle = Object.assign({}, style, this.state.overdoc ? {
-        right: 0,
-        left: 'auto'
-      } : undefined);
+      var mergeStyle = Object.assign({}, style, this.state.overdoc ? getOverDocStyle() : undefined);
       return _react.default.createElement(List, (0, _extends2.default)({
         getRef: this.handleRef
       }, props, {
@@ -321,10 +348,7 @@ function _default(List) {
           style = _ref.style;
 
       this.element.className = mergeClass;
-      var mergeStyle = Object.assign({}, style, props.style, this.state.overdoc ? {
-        right: 0,
-        left: 'auto'
-      } : undefined);
+      var mergeStyle = Object.assign({}, style, props.style, this.state.overdoc ? getOverDocStyle() : undefined);
       if (zIndex || typeof zIndex === 'number') mergeStyle.zIndex = parseInt(zIndex, 10);
       return _reactDom.default.createPortal(_react.default.createElement(List, (0, _extends2.default)({
         getRef: this.handleRef

package/css/Form/Field.js

@@ -52,15 +52,13 @@ function (_Component) {
     var _this$props = this.props,
         children = _this$props.children,
         value = _this$props.value,
-        error = _this$props.error,
-        disabled = _this$props.disabled;
+        error = _this$props.error;
 
     if (typeof children === 'function') {
       return children({
         value: value,
         error: error,
-        onChange: this.handleChange,
-        disabled: disabled
+        onChange: this.handleChange
       });
     }
 
@@ -68,8 +66,7 @@ function (_Component) {
       return (0, _react.cloneElement)(children, {
         value: value,
         error: error,
-        onChange: this.handleChange,
-        disabled: disabled
+        onChange: this.handleChange
       });
     }
 
@@ -85,8 +82,7 @@ Field.propTypes = {
   children: _propTypes.default.oneOfType([_propTypes.default.func, _propTypes.default.element]).isRequired,
   error: _propTypes.default.object,
   onChange: _propTypes.default.func.isRequired,
-  value: _propTypes.default.any,
-  disabled: _propTypes.default.bool
+  value: _propTypes.default.any
 };
 Field.defaultProps = {
   cache: false

package/css/Form/FieldSet.js

@@ -193,7 +193,6 @@ function (_Component) {
       result.push(empty(this.handleInsert.bind(this, 0)));
     } else {
       var errorList = (Array.isArray(errors) ? errors : [errors]).filter(Boolean);
-      console.log(errorList);
       values.forEach(function (v, i) {
         result.push(_react.default.createElement(Provider, {
           key: i,

package/css/Form/index.d.ts

@@ -28,7 +28,6 @@ export interface FieldChildrenFunc<Value = any> {
   value: Value;
   error: Error;
   onChange: (value: Value) => void;
-  disabled: boolean;
 }
 
 export interface FormProps<Value> extends StandardProps {

package/css/Menu/Root.js

@@ -158,6 +158,11 @@ function (_React$Component) {
     var active = this.props.active;
     var act = typeof active === 'function' ? active(data) : id === this.state.activeKey;
     if (act) this.state.activeKey = id;
+
+    if (!act && this.state.activeKey === id) {
+      this.state.activeKey = '';
+    }
+
     return act;
   };
 

package/css/Menu/styles/menu.css

@@ -533,48 +533,85 @@ ul.so-menu-root {
 }
 .so-menu.so-menu-rtl {
   direction: rtl;
-  text-align: right;
 }
-.so-menu.so-menu-rtl:not(.so-menu-horizontal) .so-menu-active.so-menu-no-children a:before {
-  position: absolute;
-  top: 0;
-  left: 0px;
-  width: 3px;
-  height: 100%;
-  background: var(--primary-color, #3399ff);
-  content: ' ';
-}
-.so-menu.so-menu-rtl:not(.so-menu-horizontal) .so-menu-active.so-menu-no-children a:after {
-  content: none;
+.so-menu.so-menu-rtl ul.so-menu-root {
+  margin-left: 0;
+  margin-right: -1px;
 }
-.so-menu.so-menu-rtl .so-menu-has-children:not(.so-menu-caret-solid) > .so-menu-title {
-  padding-left: 32px;
+.so-menu.so-menu-rtl .so-menu-has-children > .so-menu-title {
   padding-right: 16px;
+  padding-left: 32px;
 }
-.so-menu.so-menu-rtl .so-menu-has-children:not(.so-menu-caret-solid) > .so-menu-title:after {
+.so-menu.so-menu-rtl .so-menu-has-children > .so-menu-title .so-menu-expand {
   right: auto;
-  left: 16px;
+  left: 0;
+}
+.so-menu.so-menu-rtl .so-menu-has-children > .so-menu-title .so-menu-expand:after {
+  right: 14px;
 }
-.so-menu.so-menu-rtl .so-menu-has-children:not(.so-menu-caret-solid) > .so-menu-title:before {
+.so-menu.so-menu-rtl.so-menu-inline {
+  border-left: solid 1px #e8e8e8;
+  border-right: none;
+}
+.so-menu.so-menu-rtl .so-menu-inline .so-menu-active.so-menu-no-children > a:before,
+.so-menu.so-menu-rtl .so-menu-inline .so-menu-active.so-menu-selectable > a:before {
+  right: auto;
+  left: 0;
+}
+.so-menu.so-menu-rtl .so-menu-horizontal {
+  margin-right: 0;
+}
+.so-menu.so-menu-rtl .so-menu-horizontal .so-menu-root .so-menu-list {
   left: auto;
   right: 0;
 }
-.so-menu.so-menu-rtl .so-menu-has-children.so-menu-open > .so-menu-title:after {
+.so-menu.so-menu-rtl ul.so-menu-horizontal.so-menu-root {
+  margin-right: 0;
+}
+.so-menu.so-menu-rtl.so-menu-vertical.so-menu-root {
+  border-left: solid 1px #e8e8e8;
+  border-right: none;
+}
+.so-menu.so-menu-rtl.so-menu-vertical .so-menu-root .so-menu-list {
+  left: auto;
+  right: 100%;
+  margin-left: 0;
+  margin-right: 3px;
+}
+.so-menu.so-menu-rtl.so-menu-vertical .so-menu-has-children > .so-menu-title .so-menu-expand:after,
+.so-menu.so-menu-rtl.so-menu-vertical .so-menu-has-children.so-menu-open > .so-menu-title .so-menu-expand:after {
   -webkit-transform: translateY(-50%) rotate(180deg);
       -ms-transform: translateY(-50%) rotate(180deg);
           transform: translateY(-50%) rotate(180deg);
 }
-.so-menu.so-menu-rtl .so-menu-has-children.so-menu-caret-solid > .so-menu-title .so-menu-caret {
+.so-menu.so-menu-rtl.so-menu-vertical .so-menu-in-path.so-menu-has-children > a::before {
+  right: auto;
+  left: 0;
+}
+.so-menu.so-menu-rtl.so-menu-dark:not(.so-menu-horizontal) .so-menu-has-children.so-menu-in-path > a:before {
+  left: auto;
+  right: 0;
+}
+.so-menu.so-menu-rtl.so-menu-dark.so-menu-vertical ul.so-menu-root {
   margin-right: 0;
-  margin-left: 8px;
+  border-left: none;
 }
-.so-menu.so-menu-rtl .so-menu-has-children.so-menu-caret-hollow > .so-menu-title .so-menu-caret {
-  margin-left: 10px;
-  margin-right: 4px;
+.so-menu.so-menu-rtl.so-menu-dark.so-menu-vertical .so-menu-has-children .so-menu-title::after {
+  left: 18px;
+  right: auto;
 }
-.so-menu.so-menu-rtl.so-menu-vertical .so-menu-root .so-menu-list.so-menu-vertical {
+.so-menu.so-menu-rtl.so-menu-dark.so-menu-vertical .so-menu-in-path.so-menu-has-children > a::before {
   left: auto;
-  right: 100%;
-  margin-left: 0;
-  margin-right: 3px;
+  right: 0;
+}
+.so-menu.so-menu-rtl .so-menu-has-children.so-menu-caret-solid > .so-menu-title {
+  padding-left: 16px;
+}
+.so-menu.so-menu-rtl .so-menu-caret-solid .so-menu-title > .so-menu-caret {
+  margin-right: 0;
+  margin-left: 8px;
+}
+.so-menu.so-menu-rtl .so-menu-caret-hollow .so-menu-caret {
+  margin-right: -4px;
+  margin-left: 14px;
 }

package/css/Scroll/Bar.js

@@ -21,6 +21,8 @@ var _styles = require("./styles");
 
 var _fixedLength = _interopRequireDefault(require("./fixedLength"));
 
+var _config = require("../config");
+
 var ScrollBar =
 /*#__PURE__*/
 function (_PureComponent) {
@@ -96,7 +98,14 @@ function (_PureComponent) {
         onScroll = _this$props.onScroll,
         barLength = _this$props.barLength;
     var value = direction === 'x' ? x : y;
-    var newOffset = this.cacheOffset + value / (length - barLength);
+    var newOffset;
+
+    if (direction === 'x' && (0, _config.isRTL)()) {
+      newOffset = this.cacheOffset - value / (length - barLength);
+    } else {
+      newOffset = this.cacheOffset + value / (length - barLength);
+    }
+
     if (newOffset < 0) newOffset = 0;
     if (newOffset > 1) newOffset = 1;
     if (newOffset === this.cacheOffset) return;
@@ -115,11 +124,13 @@ function (_PureComponent) {
     var rect = this.handle.getBoundingClientRect();
     var newOffset = offset;
     var page = length / (scrollLength - length);
+    var plus = (0, _config.isRTL)() ? event.clientX < rect.left : event.clientX > rect.left;
+    var add = (0, _config.isRTL)() ? event.clientX > rect.left : event.clientX < rect.left;
 
-    if (direction === 'x' && event.clientX < rect.left || direction === 'y' && event.clientY < rect.top) {
+    if (direction === 'x' && add || direction === 'y' && event.clientY < rect.top) {
       newOffset = offset - page;
       if (newOffset < 0) newOffset = 0;
-    } else if (direction === 'x' && event.clientX > rect.right || direction === 'y' && event.clientY > rect.top) {
+    } else if (direction === 'x' && plus || direction === 'y' && event.clientY > rect.top) {
       newOffset = offset + page;
       if (newOffset > 1) newOffset = 1;
     }
@@ -137,14 +148,16 @@ function (_PureComponent) {
         forceHeight = _this$props3.forceHeight;
     var dragging = this.state.dragging;
     var show = scrollLength > length;
+    var rtl = (0, _config.isRTL)();
     var className = (0, _classnames.default)((0, _styles.scrollClass)('bar', direction, show && 'show', dragging && 'dragging', !forceHeight && 'padding-y'), this.props.className);
     var value = (length - barLength) * offset;
+    var x = rtl ? 'right' : 'left';
     var style = {};
 
     if (scrollLength > 0) {
       if (direction === 'x') {
         style.width = length / scrollLength * 100 + "%";
-        style.left = value;
+        style[x] = value;
       } else {
         style.height = length / scrollLength * 100 + "%";
         style.top = value;

package/css/Scroll/Scroll.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
 
 exports.__esModule = true;
@@ -29,7 +31,7 @@ var _styles = require("./styles");
 
 var _Bar = _interopRequireDefault(require("./Bar"));
 
-var _config = _interopRequireDefault(require("../config"));
+var _config = _interopRequireWildcard(require("../config"));
 
 var _context = require("./context");
 
@@ -221,7 +223,7 @@ function (_PureComponent) {
     if (target !== this.wheelElement) return;
     var wheel = (0, _normalizeWheel.default)(event);
     this.setBaseScrollHeightRatio(wheel.pixelY);
-    if (scrollX) this.pixelX += wheel.pixelX;
+    if (scrollX) this.pixelX = (0, _config.isRTL)() ? this.pixelX - wheel.pixelX : this.pixelX + wheel.pixelX;
     if (scrollY) this.pixelY += wheel.pixelY * this.baseScrollRatio;
 
     if (Math.abs(wheel.pixelX) > Math.abs(wheel.pixelY)) {
@@ -295,7 +297,8 @@ function (_PureComponent) {
         width = _this$getWheelRect2.width,
         height = _this$getWheelRect2.height;
 
-    var className = (0, _classnames.default)((0, _styles.scrollClass)('_', scrollX && 'show-x', scrollY && 'show-y'), this.props.className);
+    var rtl = (0, _config.isRTL)();
+    var className = (0, _classnames.default)((0, _styles.scrollClass)('_', scrollX && 'show-x', scrollY && 'show-y', rtl && 'rtl'), this.props.className);
     var yLength = scrollHeight < height ? scrollHeight : height;
     this.wheelY = scrollY && Math.ceil(scrollHeight) > Math.ceil(yLength);
     this.wheelX = scrollX && Math.ceil(scrollWidth) > Math.ceil(width);

package/css/Scroll/styles/scroll.css

@@ -103,17 +103,38 @@
 .so-scroll-show-y .so-scroll-inner {
   bottom: 16px;
 }
-.so-select-rtl .so-scroll-show-y,
-.so-menu-rtl .so-scroll-show-y,
-.so-input-rtl .so-scroll-show-y,
-.so-transfer-rtl .so-scroll-show-y {
+.so-scroll.so-scroll-rtl {
+  direction: rtl;
+}
+.so-scroll.so-scroll-rtl .so-scroll-inner {
+  left: auto;
+  right: 0;
+}
+.so-scroll.so-scroll-rtl .so-scroll-bar.so-scroll-y {
+  right: auto;
+  left: 0;
+}
+.so-scroll.so-scroll-rtl .so-scroll-bar.so-scroll-y .so-scroll-handle {
+  right: 2px;
+  left: auto;
+}
+.so-scroll.so-scroll-rtl .so-scroll-bar.so-scroll-y.so-scroll-padding-y:after {
+  right: -1px;
+  left: auto;
+}
+.so-scroll.so-scroll-rtl.so-scroll-show-y {
   padding-right: 0;
   padding-left: 16px;
 }
-.so-select-rtl .so-scroll-bar.so-scroll-y,
-.so-menu-rtl .so-scroll-bar.so-scroll-y,
-.so-input-rtl .so-scroll-bar.so-scroll-y,
-.so-transfer-rtl .so-scroll-bar.so-scroll-y {
+.so-scroll.so-scroll-rtl.so-scroll-show-y .so-scroll-x {
+  right: 0;
+  left: 16px;
+}
+.so-scroll-show-x .so-scroll.so-scroll-rtl-inner {
+  right: 0;
+  left: 16px;
+}
+.so-scroll.so-scroll-rtl .so-scroll-bar.so-scroll-y {
   right: auto;
   left: 0;
 }

package/css/Select/BoxList.js

@@ -17,16 +17,12 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 
 var _locale = require("../locale");
 
-var _icons = _interopRequireDefault(require("../icons"));
-
 var _uid = require("../utils/uid");
 
 var _AnimationList = _interopRequireDefault(require("../AnimationList"));
 
 var _Spin = _interopRequireDefault(require("../Spin"));
 
-var _Input = _interopRequireDefault(require("../Input"));
-
 var _Checkbox = _interopRequireDefault(require("../Checkbox/Checkbox"));
 
 var _styles = require("./styles");
@@ -35,6 +31,8 @@ var _BoxOption = _interopRequireDefault(require("./BoxOption"));
 
 var _LazyList = _interopRequireDefault(require("../AnimationList/LazyList"));
 
+// import icons from '../icons'
+// import Input from '../Input'
 var ScaleList = (0, _AnimationList.default)(['fade', 'scale-y'], 'fast', 'flex');
 
 var emptyFunc = function emptyFunc() {};
@@ -109,18 +107,16 @@ function (_Component) {
         renderItem: renderItem
       });
     }));
-  };
-
-  _proto.renderFilter = function renderFilter() {
-    var filterText = this.props.filterText;
-    return _react.default.createElement(_Input.default.Group, {
-      size: "small",
-      className: (0, _styles.selectClass)('filter-input')
-    }, _react.default.createElement(_Input.default, {
-      value: filterText,
-      onChange: this.handleSearch
-    }), _icons.default.SEARCH);
-  };
+  } // renderFilter() {
+  //   const { filterText } = this.props
+  //   return (
+  //     <Input.Group size="small" className={selectClass('filter-input')}>
+  //       <Input value={filterText} onChange={this.handleSearch} />
+  //       {icons.SEARCH}
+  //     </Input.Group>
+  //   )
+  // }
+  ;
 
   _proto.renderHeader = function renderHeader(count) {
     var _this$props4 = this.props,
@@ -247,7 +243,7 @@ BoxList.propTypes = {
   columns: _propTypes.default.number,
   data: _propTypes.default.array,
   datum: _propTypes.default.object.isRequired,
-  filterText: _propTypes.default.string,
+  // filterText: PropTypes.string,
   focus: _propTypes.default.bool,
   keygen: _propTypes.default.any,
   loading: _propTypes.default.oneOfType([_propTypes.default.element, _propTypes.default.bool]),

package/css/Select/Input.js

@@ -44,6 +44,8 @@ function (_Component) {
     _this.bindElement = _this.bindElement.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
     _this.handleInput = _this.handleInput.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
     _this.handleBlur = _this.handleBlur.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
+    _this.geHandleMax = _this.geHandleMax.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
+    _this.handlePaste = _this.handlePaste.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)));
     _this.focusInput = _this.focusInput.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this))); // for mutiple select
 
     _this.props.setInputReset(_this.reset.bind((0, _assertThisInitialized2.default)((0, _assertThisInitialized2.default)(_this)))); // set focus func to Select
@@ -78,13 +80,91 @@ function (_Component) {
     return trim ? text.trim() : text.replace(/\u00A0/g, ' ');
   };
 
+  _proto.handlePaste = function handlePaste(e) {
+    var _this2 = this;
+
+    (0, _element.preventPasteFile)(e, function (text) {
+      if (window.getSelection) {
+        var selection = window.getSelection();
+        _this2.lastSelect = {
+          anchorOffset: selection.anchorOffset,
+          focusOffset: selection.focusOffset,
+          text: text
+        };
+      }
+    });
+  };
+
+  _proto.geHandleMax = function geHandleMax(e) {
+    var maxLength = this.props.maxLength;
+
+    if (!maxLength) {
+      return true;
+    }
+
+    var change = true;
+    var text = e.target.innerText;
+
+    if (text.length >= maxLength) {
+      var lastPos;
+
+      if (window.getSelection) {
+        lastPos = Math.min(window.getSelection().anchorOffset - (text.length > maxLength ? 1 : 0), maxLength);
+      }
+
+      if (!this.lastMaxValue) {
+        this.lastMaxValue = text.slice(0, maxLength);
+      } else if (this.lastSelect) {
+        var _this$lastSelect = this.lastSelect,
+            anchorOffset = _this$lastSelect.anchorOffset,
+            focusOffset = _this$lastSelect.focusOffset,
+            str = _this$lastSelect.text;
+        var start = anchorOffset < focusOffset ? anchorOffset : focusOffset;
+        var end = anchorOffset > focusOffset ? anchorOffset : focusOffset;
+
+        if (end - start > 0) {
+          this.lastMaxValue = this.lastMaxValue.slice(0, start) + str.slice(0, end - start) + this.lastMaxValue.slice(end);
+          lastPos = focusOffset;
+        } else {
+          change = false;
+        }
+      } else {
+        change = false;
+      } // clear select info
+
+
+      this.lastSelect = false;
+      e.target.innerText = this.lastMaxValue;
+
+      if (lastPos) {
+        var selection = window.getSelection();
+        var range = selection.getRangeAt(0);
+        var textNode = range.startContainer;
+
+        if (textNode.nodeName !== '#text') {
+          ;
+          var _textNode$childNodes = textNode.childNodes;
+          textNode = _textNode$childNodes[0];
+        }
+
+        range.setStart(textNode, lastPos);
+        range.collapse(true);
+      }
+    } else {
+      this.lastMaxValue = '';
+    } // eslint-disable-next-line consistent-return
+
+
+    return change;
+  };
+
   _proto.reset = function reset() {
     if (this.editElement) this.editElement.innerText = '';
     if (this.blurTimer) clearTimeout(this.blurTimer);
   };
 
   _proto.focusInput = function focusInput(flag) {
-    var _this2 = this;
+    var _this3 = this;
 
     if (flag === void 0) {
       flag = false;
@@ -100,17 +180,17 @@ function (_Component) {
     this.setState({
       editable: true
     }, function () {
-      return _this2.focus();
+      return _this3.focus();
     });
   };
 
   _proto.focus = function focus() {
-    var _this3 = this;
+    var _this4 = this;
 
     var focusSelected = this.props.focusSelected;
     var action = focusSelected ? _element.focusElement.select : _element.focusElement.end;
     requestAnimationFrame(function () {
-      action(_this3.editElement);
+      action(_this4.editElement);
     });
   };
 
@@ -119,6 +199,12 @@ function (_Component) {
   };
 
   _proto.handleInput = function handleInput(e) {
+    var change = this.geHandleMax(e);
+
+    if (!change) {
+      return;
+    }
+
     var text = e.target.innerText.replace('\feff ', '');
     this.lastCursorOffset = (0, _element.getCursorOffset)(text.length);
     var t = this.getProcessedValue(text);
@@ -161,7 +247,7 @@ function (_Component) {
         __html: value
       }
     }, props, {
-      onPaste: _element.preventPasteFile
+      onPaste: this.handlePaste
     }));
   };
 
@@ -180,7 +266,8 @@ FilterInput.propTypes = {
   trim: _propTypes.default.bool,
   focusSelected: _propTypes.default.bool,
   bindFocusInputFunc: _propTypes.default.func,
-  collapse: _propTypes.default.func
+  collapse: _propTypes.default.func,
+  maxLength: _propTypes.default.number
 };
 FilterInput.defaultProps = {
   text: '',