chore(deps): update dependency prettier to v2 (#5058)

* chore(deps): update dependency prettier to v2

* format
Co-authored-by: Renovate Bot <bot@renovateapp.com>
Co-authored-by: Jimmy Jia <tesrin@gmail.com>

karma.conf.js

 const { DefinePlugin } = require('webpack');
 
-module.exports = config => {
+module.exports = (config) => {
   const { env } = process;
 
   config.set({

package.json

@@ -121,7 +121,7 @@
     "lint-staged": "^10.0.8",
     "lodash": "^4.17.15",
     "mocha": "^7.1.0",
-    "prettier": "^1.19.1",
+    "prettier": "^2.0.1",
     "react": "^16.13.0",
     "react-dom": "^16.13.0",
     "react-test-renderer": "^16.13.0",

src/AbstractNav.js

@@ -60,7 +60,7 @@ const AbstractNav = React.forwardRef(
 
     const listNode = useRef(null);
 
-    const getNextActiveChild = offset => {
+    const getNextActiveChild = (offset) => {
       if (!listNode.current) return null;
 
       let items = qsa(listNode.current, '[data-rb-event-key]:not(.disabled)');
@@ -81,7 +81,7 @@ const AbstractNav = React.forwardRef(
       if (parentOnSelect) parentOnSelect(key, event);
     };
 
-    const handleKeyDown = event => {
+    const handleKeyDown = (event) => {
       if (onKeyDown) onKeyDown(event);
 
       let nextActiveChild;

src/AbstractNavItem.js

@@ -61,7 +61,7 @@ const AbstractNavItem = React.forwardRef(
       props['aria-selected'] = isActive;
     }
 
-    const handleOnclick = useEventCallback(e => {
+    const handleOnclick = useEventCallback((e) => {
       if (onClick) onClick(e);
       if (navKey == null) return;
       if (onSelect) onSelect(navKey, e);

src/AccordionToggle.js

@@ -24,7 +24,7 @@ export function useAccordionToggle(eventKey, onClick) {
   const contextEventKey = useContext(AccordionContext);
   const onSelect = useContext(SelectableContext);
 
-  return e => {
+  return (e) => {
     /* 
       Compare the event key in context with the given event key.
       If they are the same, then collapse the component.

src/Alert.js

@@ -79,7 +79,7 @@ const Alert = React.forwardRef((uncontrolledProps, ref) => {
   } = useUncontrolled(uncontrolledProps, controllables);
 
   const prefix = useBootstrapPrefix(bsPrefix, 'alert');
-  const handleClose = useEventCallback(e => {
+  const handleClose = useEventCallback((e) => {
     onClose(false, e);
   });
 

src/BootstrapModalManager.js

@@ -32,13 +32,13 @@ export default class BootstrapModalManager extends ModalManager {
     if (!containerState.overflowing) return;
     const size = getScrollbarSize();
 
-    qsa(container, Selector.FIXED_CONTENT).forEach(el =>
+    qsa(container, Selector.FIXED_CONTENT).forEach((el) =>
       this.adjustAndStore('paddingRight', el, size),
     );
-    qsa(container, Selector.STICKY_CONTENT).forEach(el =>
+    qsa(container, Selector.STICKY_CONTENT).forEach((el) =>
       this.adjustAndStore('margingRight', el, -size),
     );
-    qsa(container, Selector.NAVBAR_TOGGLER).forEach(el =>
+    qsa(container, Selector.NAVBAR_TOGGLER).forEach((el) =>
       this.adjustAndStore('margingRight', el, size),
     );
   }
@@ -46,13 +46,13 @@ export default class BootstrapModalManager extends ModalManager {
   removeContainerStyle(containerState, container) {
     super.removeContainerStyle(containerState, container);
 
-    qsa(container, Selector.FIXED_CONTENT).forEach(el =>
+    qsa(container, Selector.FIXED_CONTENT).forEach((el) =>
       this.restore('paddingRight', el),
     );
-    qsa(container, Selector.STICKY_CONTENT).forEach(el =>
+    qsa(container, Selector.STICKY_CONTENT).forEach((el) =>
       this.restore('margingRight', el),
     );
-    qsa(container, Selector.NAVBAR_TOGGLER).forEach(el =>
+    qsa(container, Selector.NAVBAR_TOGGLER).forEach((el) =>
       this.restore('margingRight', el),
     );
   }

src/Carousel.js

@@ -228,7 +228,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   ).length;
 
   const prev = useCallback(
-    event => {
+    (event) => {
       if (isSliding) {
         return;
       }
@@ -250,7 +250,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   );
 
   // This is used in the setInterval, so it should not invalidate.
-  const next = useEventCallback(event => {
+  const next = useEventCallback((event) => {
     if (isSliding) {
       return;
     }
@@ -300,7 +300,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   const directionalClassName = `${prefix}-item-${slideDirection}`;
 
   const handleEnter = useCallback(
-    node => {
+    (node) => {
       triggerBrowserReflow(node);
 
       if (onSlide) {
@@ -319,7 +319,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   }, [onSlid, renderedActiveIndex, slideDirection]);
 
   const handleKeyDown = useCallback(
-    event => {
+    (event) => {
       if (keyboard && !/input|textarea/i.test(event.target.tagName)) {
         switch (event.key) {
           case 'ArrowLeft':
@@ -344,7 +344,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   const [pausedOnHover, setPausedOnHover] = useState(false);
 
   const handleMouseOver = useCallback(
-    event => {
+    (event) => {
       if (pause === 'hover') {
         setPausedOnHover(true);
       }
@@ -357,7 +357,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   );
 
   const handleMouseOut = useCallback(
-    event => {
+    (event) => {
       setPausedOnHover(false);
 
       if (onMouseOut) {
@@ -373,7 +373,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   const touchUnpauseTimeout = useTimeout();
 
   const handleTouchStart = useCallback(
-    event => {
+    (event) => {
       touchStartXRef.current = event.touches[0].clientX;
       touchDeltaXRef.current = 0;
 
@@ -389,7 +389,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   );
 
   const handleTouchMove = useCallback(
-    event => {
+    (event) => {
       if (event.touches && event.touches.length > 1) {
         touchDeltaXRef.current = 0;
       } else {
@@ -405,7 +405,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   );
 
   const handleTouchEnd = useCallback(
-    event => {
+    (event) => {
       if (touch) {
         const touchDeltaX = touchDeltaXRef.current;
 
@@ -454,7 +454,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
   const indicatorOnClicks = useMemo(
     () =>
       indicators &&
-      Array.from({ length: numChildren }, (_, index) => event => {
+      Array.from({ length: numChildren }, (_, index) => (event) => {
         onSelect(index, event);
       }),
     [indicators, numChildren, onSelect],
@@ -500,7 +500,7 @@ const Carousel = React.forwardRef((uncontrolledProps, ref) => {
               onEntered={isActive ? handleEntered : null}
               addEndListener={transitionEnd}
             >
-              {status =>
+              {(status) =>
                 React.cloneElement(child, {
                   className: classNames(
                     child.props.className,

src/Col.js

@@ -77,7 +77,7 @@ const Col = React.forwardRef(
     const spans = [];
     const classes = [];
 
-    DEVICE_SIZES.forEach(brkPoint => {
+    DEVICE_SIZES.forEach((brkPoint) => {
       let propValue = props[brkPoint];
       delete props[brkPoint];
 

src/Collapse.js

@@ -138,21 +138,21 @@ class Collapse extends React.Component {
   }
 
   /* -- Expanding -- */
-  handleEnter = elem => {
+  handleEnter = (elem) => {
     elem.style[this.getDimension()] = '0';
   };
 
-  handleEntering = elem => {
+  handleEntering = (elem) => {
     const dimension = this.getDimension();
     elem.style[dimension] = this._getScrollDimensionValue(elem, dimension);
   };
 
-  handleEntered = elem => {
+  handleEntered = (elem) => {
     elem.style[this.getDimension()] = null;
   };
 
   /* -- Collapsing -- */
-  handleExit = elem => {
+  handleExit = (elem) => {
     const dimension = this.getDimension();
     elem.style[dimension] = `${this.props.getDimensionValue(
       dimension,
@@ -161,7 +161,7 @@ class Collapse extends React.Component {
     triggerBrowserReflow(elem);
   };
 
-  handleExiting = elem => {
+  handleExiting = (elem) => {
     elem.style[this.getDimension()] = null;
   };
 

src/DropdownItem.js

@@ -83,7 +83,7 @@ const DropdownItem = React.forwardRef(
         ? makeEventKey(activeKey) === key
         : propActive;
 
-    const handleClick = useEventCallback(event => {
+    const handleClick = useEventCallback((event) => {
       // SafeAnchor handles the disabled case, but we handle it here
       // for other components
       if (disabled) return;

src/ElementChildren.js

@@ -11,7 +11,7 @@ import React from 'react';
 function map(children, func) {
   let index = 0;
 
-  return React.Children.map(children, child =>
+  return React.Children.map(children, (child) =>
     React.isValidElement(child) ? func(child, index++) : child,
   );
 }
@@ -24,7 +24,7 @@ function map(children, func) {
  */
 function forEach(children, func) {
   let index = 0;
-  React.Children.forEach(children, child => {
+  React.Children.forEach(children, (child) => {
     if (React.isValidElement(child)) func(child, index++);
   });
 }

src/Fade.js

@@ -78,7 +78,7 @@ const fadeStyles = {
 
 const Fade = React.forwardRef(({ className, children, ...props }, ref) => {
   const handleEnter = useCallback(
-    node => {
+    (node) => {
       triggerBrowserReflow(node);
       if (props.onEnter) props.onEnter(node);
     },

src/InputGroup.js

@@ -64,13 +64,13 @@ const InputGroupText = createWithBsPrefix('input-group-text', {
   Component: 'span',
 });
 
-const InputGroupCheckbox = props => (
+const InputGroupCheckbox = (props) => (
   <InputGroupText>
     <input type="checkbox" {...props} />
   </InputGroupText>
 );
 
-const InputGroupRadio = props => (
+const InputGroupRadio = (props) => (
   <InputGroupText>
     <input type="radio" {...props} />
   </InputGroupText>

src/ListGroupItem.js

@@ -72,7 +72,7 @@ const ListGroupItem = React.forwardRef(
     bsPrefix = useBootstrapPrefix(bsPrefix, 'list-group-item');
 
     const handleClick = useCallback(
-      event => {
+      (event) => {
         if (disabled) {
           event.preventDefault();
           event.stopPropagation();

src/Modal.js

@@ -203,7 +203,7 @@ class Modal extends React.Component {
     removeEventListener(window, 'resize', this.handleWindowResize);
   }
 
-  setModalRef = ref => {
+  setModalRef = (ref) => {
     this._modal = ref;
   };
 
@@ -214,14 +214,14 @@ class Modal extends React.Component {
     this._waitingForMouseUp = true;
   };
 
-  handleMouseUp = e => {
+  handleMouseUp = (e) => {
     if (this._waitingForMouseUp && e.target === this._modal.dialog) {
       this._ignoreBackdropClick = true;
     }
     this._waitingForMouseUp = false;
   };
 
-  handleClick = e => {
+  handleClick = (e) => {
     if (this._ignoreBackdropClick || e.target !== e.currentTarget) {
       this._ignoreBackdropClick = false;
       return;
@@ -294,7 +294,7 @@ class Modal extends React.Component {
     });
   }
 
-  renderBackdrop = props => {
+  renderBackdrop = (props) => {
     const { bsPrefix, backdropClassName, animation } = this.props;
 
     return (

src/NavbarCollapse.js

@@ -15,7 +15,7 @@ const NavbarCollapse = React.forwardRef(
     bsPrefix = useBootstrapPrefix(bsPrefix, 'navbar-collapse');
     return (
       <NavbarContext.Consumer>
-        {context => (
+        {(context) => (
           <Collapse in={!!(context && context.expanded)} {...props}>
             <div ref={ref} className={bsPrefix}>
               {children}

src/NavbarToggle.js

@@ -46,7 +46,7 @@ const NavbarToggle = React.forwardRef(
 
     const { onToggle, expanded } = useContext(NavbarContext) || {};
 
-    const handleClick = useEventCallback(e => {
+    const handleClick = useEventCallback((e) => {
       if (onClick) onClick(e);
       if (onToggle) onToggle();
     });

src/Overlay.js

@@ -115,9 +115,9 @@ function wrapRefs(props, arrowProps) {
   const { ref } = props;
   const { ref: aRef } = arrowProps;
 
-  props.ref = ref.__wrapped || (ref.__wrapped = r => ref(findDOMNode(r)));
+  props.ref = ref.__wrapped || (ref.__wrapped = (r) => ref(findDOMNode(r)));
   arrowProps.ref =
-    aRef.__wrapped || (aRef.__wrapped = r => aRef(findDOMNode(r)));
+    aRef.__wrapped || (aRef.__wrapped = (r) => aRef(findDOMNode(r)));
 }
 
 function Overlay({ children: overlay, transition, ...outerProps }) {

src/OverlayTrigger.js

@@ -152,7 +152,7 @@ function OverlayTrigger({
   }, [delay.hide, timeout]);
 
   const handleFocus = useCallback(
-    e => {
+    (e) => {
       handleShow(e);
       if (onFocus) onFocus(e);
     },
@@ -160,7 +160,7 @@ function OverlayTrigger({
   );
 
   const handleBlur = useCallback(
-    e => {
+    (e) => {
       handleHide(e);
       if (onBlur) onBlur(e);
     },
@@ -168,22 +168,22 @@ function OverlayTrigger({
   );
 
   const handleClick = useCallback(
-    e => {
-      setShow(prevShow => !prevShow);
+    (e) => {
+      setShow((prevShow) => !prevShow);
       if (onClick) onClick(e);
     },
     [onClick],
   );
 
   const handleMouseOver = useCallback(
-    e => {
+    (e) => {
       handleMouseOverOut(handleShow, e, 'fromElement');
     },
     [handleShow],
   );
 
   const handleMouseOut = useCallback(
-    e => {
+    (e) => {
       handleMouseOverOut(handleHide, e, 'toElement');
     },
     [handleHide],