🚮 remove prop-types and findDOMNode

react-component · Nov 4, 2019 · e1a201e · e1a201e
1 parent 59e4614
commit e1a201e
Show file tree

Hide file tree

Showing 6 changed files with 11 additions and 147 deletions.
diff --git a/package.json b/package.json
@@ -37,7 +37,6 @@
   "dependencies": {
     "classnames": "2.x",
     "moment": "2.x",
-    "prop-types": "^15.5.8",
     "raf": "^3.4.1",
     "rc-trigger": "^4.0.0-alpha.4"
   },

diff --git a/src/Combobox.jsx b/src/Combobox.jsx
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import Select from './Select';
 
 const formatOption = (option, disabledOptions) => {
@@ -20,28 +19,6 @@ const formatOption = (option, disabledOptions) => {
 };
 
 class Combobox extends Component {
-  static propTypes = {
-    format: PropTypes.string,
-    defaultOpenValue: PropTypes.object,
-    prefixCls: PropTypes.string,
-    value: PropTypes.object,
-    onChange: PropTypes.func,
-    onAmPmChange: PropTypes.func,
-    showHour: PropTypes.bool,
-    showMinute: PropTypes.bool,
-    showSecond: PropTypes.bool,
-    hourOptions: PropTypes.array,
-    minuteOptions: PropTypes.array,
-    secondOptions: PropTypes.array,
-    disabledHours: PropTypes.func,
-    disabledMinutes: PropTypes.func,
-    disabledSeconds: PropTypes.func,
-    onCurrentSelectPanelChange: PropTypes.func,
-    use12Hours: PropTypes.bool,
-    onEsc: PropTypes.func,
-    isAM: PropTypes.bool,
-  };
-
   onItemChange = (type, itemValue) => {
     const {
       onChange,

diff --git a/src/Header.jsx b/src/Header.jsx
@@ -1,32 +1,8 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import moment from 'moment';
 import classNames from 'classnames';
 
 class Header extends Component {
-  static propTypes = {
-    format: PropTypes.string,
-    prefixCls: PropTypes.string,
-    disabledDate: PropTypes.func,
-    placeholder: PropTypes.string,
-    clearText: PropTypes.string,
-    value: PropTypes.object,
-    inputReadOnly: PropTypes.bool,
-    hourOptions: PropTypes.array,
-    minuteOptions: PropTypes.array,
-    secondOptions: PropTypes.array,
-    disabledHours: PropTypes.func,
-    disabledMinutes: PropTypes.func,
-    disabledSeconds: PropTypes.func,
-    onChange: PropTypes.func,
-    onEsc: PropTypes.func,
-    defaultOpenValue: PropTypes.object,
-    currentSelectPanel: PropTypes.string,
-    focusOnOpen: PropTypes.bool,
-    onKeyDown: PropTypes.func,
-    clearIcon: PropTypes.node,
-  };
-
   static defaultProps = {
     inputReadOnly: false,
   };

diff --git a/src/Panel.jsx b/src/Panel.jsx
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import moment from 'moment';
 import classNames from 'classnames';
 import Header from './Header';
@@ -31,35 +30,6 @@ function toNearestValidTime(time, hourOptions, minuteOptions, secondOptions) {
 }
 
 class Panel extends Component {
-  static propTypes = {
-    clearText: PropTypes.string,
-    prefixCls: PropTypes.string,
-    className: PropTypes.string,
-    defaultOpenValue: PropTypes.object,
-    value: PropTypes.object,
-    placeholder: PropTypes.string,
-    format: PropTypes.string,
-    inputReadOnly: PropTypes.bool,
-    disabledHours: PropTypes.func,
-    disabledMinutes: PropTypes.func,
-    disabledSeconds: PropTypes.func,
-    hideDisabledOptions: PropTypes.bool,
-    onChange: PropTypes.func,
-    onAmPmChange: PropTypes.func,
-    onEsc: PropTypes.func,
-    showHour: PropTypes.bool,
-    showMinute: PropTypes.bool,
-    showSecond: PropTypes.bool,
-    use12Hours: PropTypes.bool,
-    hourStep: PropTypes.number,
-    minuteStep: PropTypes.number,
-    secondStep: PropTypes.number,
-    addon: PropTypes.func,
-    focusOnOpen: PropTypes.bool,
-    onKeyDown: PropTypes.func,
-    clearIcon: PropTypes.node,
-  };
-
   static defaultProps = {
     prefixCls: 'rc-time-picker-panel',
     onChange: noop,

diff --git a/src/Select.jsx b/src/Select.jsx
@@ -1,14 +1,13 @@
 /* eslint jsx-a11y/no-noninteractive-element-to-interactive-role: 0 */
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import ReactDom from 'react-dom';
 import classNames from 'classnames';
 import raf from 'raf';
 
 const scrollTo = (element, to, duration) => {
   // jump to target if duration zero
   if (duration <= 0) {
     raf(() => {
+      // eslint-disable-next-line no-param-reassign
       element.scrollTop = to;
     });
     return;
@@ -17,23 +16,14 @@ const scrollTo = (element, to, duration) => {
   const perTick = (difference / duration) * 10;
 
   raf(() => {
+    // eslint-disable-next-line no-param-reassign
     element.scrollTop += perTick;
     if (element.scrollTop === to) return;
     scrollTo(element, to, duration - 10);
   });
 };
 
 class Select extends Component {
-  static propTypes = {
-    prefixCls: PropTypes.string,
-    options: PropTypes.array,
-    selectedIndex: PropTypes.number,
-    type: PropTypes.string,
-    onSelect: PropTypes.func,
-    onMouseEnter: PropTypes.func,
-    onEsc: PropTypes.func,
-  };
-
   state = {
     active: false,
   };
@@ -72,13 +62,12 @@ class Select extends Component {
         if (e.keyCode === 13) onClick();
         else if (e.keyCode === 27) onEsc();
       };
-
       return (
         <li
           role="button"
           onClick={onClick}
           className={cls}
-          key={index}
+          key={index} // eslint-disable-line react/no-array-index-key
           disabled={item.disabled}
           tabIndex="0"
           onKeyDown={onKeyDown}
@@ -99,25 +88,27 @@ class Select extends Component {
     this.setState({ active: false });
   };
 
+  saveRoot = node => {
+    this.root = node;
+  };
+
   saveList = node => {
     this.list = node;
   };
 
   scrollToSelected(duration) {
     // move to selected item
     const { selectedIndex } = this.props;
-    const select = ReactDom.findDOMNode(this);
-    const list = ReactDom.findDOMNode(this.list);
-    if (!list) {
+    if (!this.list) {
       return;
     }
     let index = selectedIndex;
     if (index < 0) {
       index = 0;
     }
-    const topOption = list.children[index];
+    const topOption = this.list.children[index];
     const to = topOption.offsetTop;
-    scrollTo(select, to, duration);
+    scrollTo(this.root, to, duration);
   }
 
   render() {
@@ -134,6 +125,7 @@ class Select extends Component {
         className={cls}
         onMouseEnter={this.handleMouseEnter}
         onMouseLeave={this.handleMouseLeave}
+        ref={this.saveRoot}
       >
         <ul ref={this.saveList}>{this.getOptions()}</ul>
       </div>

diff --git a/src/TimePicker.jsx b/src/TimePicker.jsx
@@ -1,6 +1,5 @@
 /* eslint jsx-a11y/no-autofocus: 0 */
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
 import Trigger from 'rc-trigger';
 import moment from 'moment';
 import classNames from 'classnames';
@@ -14,55 +13,6 @@ function refFn(field, component) {
 }
 
 class Picker extends Component {
-  static propTypes = {
-    prefixCls: PropTypes.string,
-    clearText: PropTypes.string,
-    value: PropTypes.object,
-    defaultOpenValue: PropTypes.object,
-    inputReadOnly: PropTypes.bool,
-    disabled: PropTypes.bool,
-    allowEmpty: PropTypes.bool,
-    defaultValue: PropTypes.object,
-    open: PropTypes.bool,
-    defaultOpen: PropTypes.bool,
-    align: PropTypes.object,
-    placement: PropTypes.any,
-    transitionName: PropTypes.string,
-    getPopupContainer: PropTypes.func,
-    placeholder: PropTypes.string,
-    format: PropTypes.string,
-    showHour: PropTypes.bool,
-    showMinute: PropTypes.bool,
-    showSecond: PropTypes.bool,
-    style: PropTypes.object,
-    className: PropTypes.string,
-    popupClassName: PropTypes.string,
-    popupStyle: PropTypes.object,
-    disabledHours: PropTypes.func,
-    disabledMinutes: PropTypes.func,
-    disabledSeconds: PropTypes.func,
-    hideDisabledOptions: PropTypes.bool,
-    onChange: PropTypes.func,
-    onAmPmChange: PropTypes.func,
-    onOpen: PropTypes.func,
-    onClose: PropTypes.func,
-    onFocus: PropTypes.func,
-    onBlur: PropTypes.func,
-    addon: PropTypes.func,
-    name: PropTypes.string,
-    autoComplete: PropTypes.string,
-    use12Hours: PropTypes.bool,
-    hourStep: PropTypes.number,
-    minuteStep: PropTypes.number,
-    secondStep: PropTypes.number,
-    focusOnOpen: PropTypes.bool,
-    onKeyDown: PropTypes.func,
-    autoFocus: PropTypes.bool,
-    id: PropTypes.string,
-    inputIcon: PropTypes.node,
-    clearIcon: PropTypes.node,
-  };
-
   static defaultProps = {
     clearText: 'clear',
     prefixCls: 'rc-time-picker',