chore: Prettier code

Author: zombieJ

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "endOfLine": "lf",
+  "semi": true,
+  "singleQuote": true,
+  "tabWidth": 2,
+  "trailingComma": "all"
+}

src/DOMWrap.jsx

@@ -35,22 +35,29 @@ class DOMWrap extends React.Component {
         entries.forEach(this.setChildrenWidthAndResize);
       });
 
-      [].slice.call(menuUl.children).concat(menuUl).forEach(el => {
-        this.resizeObserver.observe(el);
-      });
+      [].slice
+        .call(menuUl.children)
+        .concat(menuUl)
+        .forEach(el => {
+          this.resizeObserver.observe(el);
+        });
 
       if (typeof MutationObserver !== 'undefined') {
         this.mutationObserver = new MutationObserver(() => {
           this.resizeObserver.disconnect();
-          [].slice.call(menuUl.children).concat(menuUl).forEach(el => {
-            this.resizeObserver.observe(el);
-          });
+          [].slice
+            .call(menuUl.children)
+            .concat(menuUl)
+            .forEach(el => {
+              this.resizeObserver.observe(el);
+            });
           this.setChildrenWidthAndResize();
         });
-        this.mutationObserver.observe(
-          menuUl,
-          { attributes: false, childList: true, subTree: false }
-        );
+        this.mutationObserver.observe(menuUl, {
+          attributes: false,
+          childList: true,
+          subTree: false,
+        });
       }
     }
   }
@@ -73,21 +80,31 @@ class DOMWrap extends React.Component {
     }
 
     // filter out all overflowed indicator placeholder
-    return [].slice.call(ul.children)
-      .filter(node => {
-        return node.className.split(' ').indexOf(`${prefixCls}-overflowed-submenu`) < 0;
-      });
-  }
+    return [].slice.call(ul.children).filter(node => {
+      return (
+        node.className.split(' ').indexOf(`${prefixCls}-overflowed-submenu`) < 0
+      );
+    });
+  };
 
-  getOverflowedSubMenuItem = (keyPrefix, overflowedItems, renderPlaceholder) => {
+  getOverflowedSubMenuItem = (
+    keyPrefix,
+    overflowedItems,
+    renderPlaceholder,
+  ) => {
     const { overflowedIndicator, level, mode, prefixCls, theme } = this.props;
     if (level !== 1 || mode !== 'horizontal') {
       return null;
     }
     // put all the overflowed item inside a submenu
     // with a title of overflow indicator ('...')
     const copy = this.props.children[0];
-    const { children: throwAway, title, style: propStyle, ...rest } = copy.props;
+    const {
+      children: throwAway,
+      title,
+      style: propStyle,
+      ...rest,
+    } = copy.props;
 
     let style = { ...propStyle };
     let key = `${keyPrefix}-overflowed-indicator`;
@@ -131,7 +148,7 @@ class DOMWrap extends React.Component {
         {overflowedItems}
       </SubMenu>
     );
-  }
+  };
 
   // memorize rendered menuSize
   setChildrenWidthAndResize = () => {
@@ -150,7 +167,8 @@ class DOMWrap extends React.Component {
       return;
     }
 
-    const lastOverflowedIndicatorPlaceholder = ul.children[ulChildrenNodes.length - 1];
+    const lastOverflowedIndicatorPlaceholder =
+      ul.children[ulChildrenNodes.length - 1];
 
     // need last overflowed indicator for calculating length;
     setStyle(lastOverflowedIndicatorPlaceholder, 'display', 'inline-block');
@@ -160,8 +178,9 @@ class DOMWrap extends React.Component {
     // reset display attribute for all hidden elements caused by overflow to calculate updated width
     // and then reset to original state after width calculation
 
-    const overflowedItems = menuItemNodes
-      .filter(c => c.className.split(' ').indexOf(MENUITEM_OVERFLOWED_CLASSNAME) >= 0);
+    const overflowedItems = menuItemNodes.filter(
+      c => c.className.split(' ').indexOf(MENUITEM_OVERFLOWED_CLASSNAME) >= 0,
+    );
 
     overflowedItems.forEach(c => {
       setStyle(c, 'display', 'inline-block');
@@ -172,12 +191,17 @@ class DOMWrap extends React.Component {
     overflowedItems.forEach(c => {
       setStyle(c, 'display', 'none');
     });
-    this.overflowedIndicatorWidth = getWidth(ul.children[ul.children.length - 1]);
-    this.originalTotalWidth = this.menuItemSizes.reduce((acc, cur) => acc + cur, 0);
+    this.overflowedIndicatorWidth = getWidth(
+      ul.children[ul.children.length - 1],
+    );
+    this.originalTotalWidth = this.menuItemSizes.reduce(
+      (acc, cur) => acc + cur,
+      0,
+    );
     this.handleResize();
     // prevent the overflowed indicator from taking space;
     setStyle(lastOverflowedIndicatorPlaceholder, 'display', 'none');
-  }
+  };
 
   resizeObserver = null;
   mutationObserver = null;
@@ -223,18 +247,21 @@ class DOMWrap extends React.Component {
     }
 
     this.setState({ lastVisibleIndex });
-  }
+  };
 
   renderChildren(children) {
     // need to take care of overflowed items in horizontal mode
     const { lastVisibleIndex } = this.state;
     return (children || []).reduce((acc, childNode, index) => {
       let item = childNode;
       if (this.props.mode === 'horizontal') {
-        let overflowed = this.getOverflowedSubMenuItem(childNode.props.eventKey, []);
-        if (lastVisibleIndex !== undefined
-            &&
-            this.props.className.indexOf(`${this.props.prefixCls}-root`) !== -1
+        let overflowed = this.getOverflowedSubMenuItem(
+          childNode.props.eventKey,
+          [],
+        );
+        if (
+          lastVisibleIndex !== undefined &&
+          this.props.className.indexOf(`${this.props.prefixCls}-root`) !== -1
         ) {
           if (index > lastVisibleIndex) {
             item = React.cloneElement(
@@ -248,14 +275,16 @@ class DOMWrap extends React.Component {
             );
           }
           if (index === lastVisibleIndex + 1) {
-            this.overflowedItems = children.slice(lastVisibleIndex + 1).map(c => {
-              return React.cloneElement(
-                c,
-                // children[index].key will become '.$key' in clone by default,
-                // we have to overwrite with the correct key explicitly
-                { key: c.props.eventKey, mode: 'vertical-left' },
-              );
-            });
+            this.overflowedItems = children
+              .slice(lastVisibleIndex + 1)
+              .map(c => {
+                return React.cloneElement(
+                  c,
+                  // children[index].key will become '.$key' in clone by default,
+                  // we have to overwrite with the correct key explicitly
+                  { key: c.props.eventKey, mode: 'vertical-left' },
+                );
+              });
 
             overflowed = this.getOverflowedSubMenuItem(
               childNode.props.eventKey,
@@ -268,7 +297,9 @@ class DOMWrap extends React.Component {
 
         if (index === children.length - 1) {
           // need a placeholder for calculating overflowed indicator width
-          ret.push(this.getOverflowedSubMenuItem(childNode.props.eventKey, [], true));
+          ret.push(
+            this.getOverflowedSubMenuItem(childNode.props.eventKey, [], true),
+          );
         }
         return ret;
       }
@@ -294,18 +325,20 @@ class DOMWrap extends React.Component {
       rest.className += ` ${hiddenClassName}`;
     }
 
-    return (
-      <Tag {...rest}>
-        {this.renderChildren(this.props.children)}
-      </Tag>
-    );
+    return <Tag {...rest}>{this.renderChildren(this.props.children)}</Tag>;
   }
 }
 
 DOMWrap.propTypes = {
   className: PropTypes.string,
   children: PropTypes.node,
-  mode: PropTypes.oneOf(['horizontal', 'vertical', 'vertical-left', 'vertical-right', 'inline']),
+  mode: PropTypes.oneOf([
+    'horizontal',
+    'vertical',
+    'vertical-left',
+    'vertical-right',
+    'inline',
+  ]),
   prefixCls: PropTypes.string,
   level: PropTypes.number,
   theme: PropTypes.string,

src/Menu.jsx

@@ -11,7 +11,13 @@ class Menu extends React.Component {
     selectedKeys: PropTypes.arrayOf(PropTypes.string),
     defaultOpenKeys: PropTypes.arrayOf(PropTypes.string),
     openKeys: PropTypes.arrayOf(PropTypes.string),
-    mode: PropTypes.oneOf(['horizontal', 'vertical', 'vertical-left', 'vertical-right', 'inline']),
+    mode: PropTypes.oneOf([
+      'horizontal',
+      'vertical',
+      'vertical-left',
+      'vertical-right',
+      'inline',
+    ]),
     getPopupContainer: PropTypes.func,
     onClick: PropTypes.func,
     onSelect: PropTypes.func,
@@ -85,7 +91,7 @@ class Menu extends React.Component {
     this.updateMiniStore();
   }
 
-  onSelect = (selectInfo) => {
+  onSelect = selectInfo => {
     const props = this.props;
     if (props.selectable) {
       // root menu
@@ -106,24 +112,24 @@ class Menu extends React.Component {
         selectedKeys,
       });
     }
-  }
+  };
 
-  onClick = (e) => {
+  onClick = e => {
     this.props.onClick(e);
-  }
+  };
 
   // onKeyDown needs to be exposed as a instance method
   // e.g., in rc-select, we need to navigate menu item while
   // current active item is rc-select input box rather than the menu itself
   onKeyDown = (e, callback) => {
     this.innerMenu.getWrappedInstance().onKeyDown(e, callback);
-  }
+  };
 
-  onOpenChange = (event) => {
+  onOpenChange = event => {
     const props = this.props;
     const openKeys = this.store.getState().openKeys.concat();
     let changed = false;
-    const processSingle = (e) => {
+    const processSingle = e => {
       let oneChanged = false;
       if (e.open) {
         oneChanged = openKeys.indexOf(e.key) === -1;
@@ -151,9 +157,9 @@ class Menu extends React.Component {
       }
       props.onOpenChange(openKeys);
     }
-  }
+  };
 
-  onDeselect = (selectInfo) => {
+  onDeselect = selectInfo => {
     const props = this.props;
     if (props.selectable) {
       const selectedKeys = this.store.getState().selectedKeys.concat();
@@ -172,7 +178,7 @@ class Menu extends React.Component {
         selectedKeys,
       });
     }
-  }
+  };
 
   getOpenTransitionName = () => {
     const props = this.props;
@@ -182,7 +188,7 @@ class Menu extends React.Component {
       transitionName = `${props.prefixCls}-open-${animationName}`;
     }
     return transitionName;
-  }
+  };
 
   updateMiniStore() {
     if ('selectedKeys' in this.props) {
@@ -211,7 +217,9 @@ class Menu extends React.Component {
     };
     return (
       <Provider store={this.store}>
-        <SubPopupMenu {...props} ref={c => this.innerMenu = c}>{this.props.children}</SubPopupMenu>
+        <SubPopupMenu {...props} ref={c => (this.innerMenu = c)}>
+          {this.props.children}
+        </SubPopupMenu>
       </Provider>
     );
   }

src/MenuItem.jsx

@@ -53,7 +53,11 @@ export class MenuItem extends React.Component {
     const { active, parentMenu, eventKey } = this.props;
     // 在 parentMenu 上层保存滚动状态，避免重复的 MenuItem key 导致滚动跳动
     // https://github.com/ant-design/ant-design/issues/16181
-    if (!prevProps.active && active && (!parentMenu || !parentMenu[`scrolled-${eventKey}`])) {
+    if (
+      !prevProps.active &&
+      active &&
+      (!parentMenu || !parentMenu[`scrolled-${eventKey}`])
+    ) {
       if (this.node) {
         scrollIntoView(this.node, ReactDOM.findDOMNode(parentMenu), {
           onlyScrollIfNeeded: true,
@@ -106,7 +110,14 @@ export class MenuItem extends React.Component {
   };
 
   onClick = e => {
-    const { eventKey, multiple, onClick, onSelect, onDeselect, isSelected } = this.props;
+    const {
+      eventKey,
+      multiple,
+      onClick,
+      onSelect,
+      onDeselect,
+      isSelected,
+    } = this.props;
     const info = {
       key: eventKey,
       keyPath: [eventKey],
@@ -200,7 +211,13 @@ export class MenuItem extends React.Component {
       icon = React.createElement(this.props.itemIcon, this.props);
     }
     return (
-      <li {...props} {...attrs} {...mouseEvent} style={style} ref={this.saveNode}>
+      <li
+        {...props}
+        {...attrs}
+        {...mouseEvent}
+        style={style}
+        ref={this.saveNode}
+      >
         {props.children}
         {icon}
       </li>
@@ -210,9 +227,11 @@ export class MenuItem extends React.Component {
 
 MenuItem.isMenuItem = true;
 
-const connected = connect(({ activeKey, selectedKeys }, { eventKey, subMenuKey }) => ({
-  active: activeKey[subMenuKey] === eventKey,
-  isSelected: selectedKeys.indexOf(eventKey) !== -1,
-}))(MenuItem);
+const connected = connect(
+  ({ activeKey, selectedKeys }, { eventKey, subMenuKey }) => ({
+    active: activeKey[subMenuKey] === eventKey,
+    isSelected: selectedKeys.indexOf(eventKey) !== -1,
+  }),
+)(MenuItem);
 
 export default connected;

src/MenuItemGroup.jsx

@@ -15,10 +15,10 @@ class MenuItemGroup extends React.Component {
     disabled: true,
   };
 
-  renderInnerMenuItem = (item) => {
+  renderInnerMenuItem = item => {
     const { renderMenuItem, index } = this.props;
     return renderMenuItem(item, index, this.props.subMenuKey);
-  }
+  };
 
   render() {
     const { ...props } = this.props;