Upgrade dev deps and fix lints (#8358)

* upgrade devDeps and fix lint

* Fix stylelint problems

.stylelintrc

@@ -16,6 +16,8 @@
     "selector-list-comma-newline-after": null,
     "selector-pseudo-element-colon-notation": null,
     "unit-no-unknown": null,
-    "value-list-max-empty-lines": null
+    "value-list-max-empty-lines": null,
+    "font-family-no-missing-generic-family-keyword": null,
+    "no-descending-specificity": null
   }
 }

components/form/style/index.less

@@ -408,23 +408,6 @@ form {
 .has-success {
   &.has-feedback:after {
     animation-name: diffZoomIn1 !important;
-  }
-}
-
-.has-error {
-  &.has-feedback:after {
-    animation-name: diffZoomIn2 !important;
-  }
-}
-
-.has-warning {
-  &.has-feedback:after {
-    animation-name: diffZoomIn3 !important;
-  }
-}
-
-.has-success {
-  &.has-feedback:after {
     content: '\e630';
     color: @success-color;
   }
@@ -436,6 +419,7 @@ form {
   &.has-feedback:after {
     content: '\e62c';
     color: @warning-color;
+    animation-name: diffZoomIn3 !important;
   }
 
   //select
@@ -482,6 +466,7 @@ form {
   &.has-feedback:after {
     content: '\e62e';
     color: @error-color;
+    animation-name: diffZoomIn2 !important;
   }
 
   //select

components/input-number/style/index.less

@@ -58,6 +58,13 @@
 
   &-disabled {
     .disabled();
+    .@{input-number-prefix-cls}-input {
+      cursor: not-allowed;
+      background-color: @disabled-bg;
+    }
+    .@{input-number-prefix-cls}-handler-wrap {
+      display: none;
+    }
   }
 
   &-input {
@@ -150,14 +157,4 @@
       height: 60% !important;
     }
   }
-
-  &-disabled {
-    .@{input-number-prefix-cls}-input {
-      cursor: not-allowed;
-      background-color: @disabled-bg;
-    }
-    .@{input-number-prefix-cls}-handler-wrap {
-      display: none;
-    }
-  }
 }

components/menu/style/index.less

@@ -29,11 +29,6 @@
     display: none;
   }
 
-  &-item-group-list {
-    margin: 0;
-    padding: 0;
-  }
-
   &-item-group-title {
     color: @text-color-secondary;
     font-size: @font-size-base;
@@ -42,17 +37,10 @@
     transition: all .3s;
   }
 
-  &-item,
   &-submenu,
-  &-submenu-title {
-    cursor: pointer;
-  }
-  &-submenu, &-submenu-inline {
+  &-submenu-inline {
     transition: border-color .3s @ease-in-out, background .3s @ease-in-out, padding .15s @ease-in-out;
   }
-  &-item, &-submenu-title {
-    transition: color .3s @ease-in-out, border-color .3s @ease-in-out, background .3s @ease-in-out, padding .15s @ease-in-out;
-  }
 
   &-item:active,
   &-submenu-title:active {
@@ -124,26 +112,6 @@
     background-color: @item-active-bg;
   }
 
-  &-inline,
-  &-vertical,
-  &-vertical-left,
-  &-vertical-right {
-    .@{menu-prefix-cls}-item {
-      position: relative;
-      &:after {
-        content: "";
-        position: absolute;
-        right: 0;
-        top: 0;
-        bottom: 0;
-        border-right: 3px solid @primary-color;
-        transform: scaleY(.0001);
-        opacity: 0;
-        transition: transform .15s @ease-out, opacity .15s @ease-out;
-      }
-    }
-  }
-
   &-inline,
   &-vertical,
   &-vertical-left {
@@ -157,6 +125,8 @@
   &-vertical-left&-sub,
   &-vertical-right&-sub {
     border-right: 0;
+    padding: 0;
+    transform-origin: 0 0;
     .@{menu-prefix-cls}-item {
       border-right: 0;
       margin-left: 0;
@@ -165,6 +135,10 @@
         border-right: 0;
       }
     }
+    > .@{menu-prefix-cls}-item,
+    > .@{menu-prefix-cls}-submenu {
+      transform-origin: 0 0;
+    }
   }
 
   &-horizontal&-sub,
@@ -176,11 +150,13 @@
 
   &-item,
   &-submenu-title {
+    cursor: pointer;
     margin: 0;
     padding: 0 20px;
     position: relative;
     display: block;
     white-space: nowrap;
+    transition: color .3s @ease-in-out, border-color .3s @ease-in-out, background .3s @ease-in-out, padding .15s @ease-in-out;
     .@{iconfont-css-prefix} {
       min-width: 14px;
       margin-right: 10px;
@@ -226,9 +202,8 @@
         top: 50%;
         right: 16px;
         width: 10px;
-
-        &:after,
-        &:before {
+        &:before,
+        &:after {
           content: '';
           position: absolute;
           vertical-align: baseline;
@@ -239,40 +214,27 @@
           border-radius: 2px;
           transition: background .3s @ease-in-out, transform .3s @ease-in-out, top .3s @ease-in-out;
         }
+        &:before {
+          transform: rotate(45deg) translateY(-2px);
         }
-    }
-
-    &-vertical,
-    &-vertical-left,
-    &-vertical-right {
-      > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow:before {
+        &:after {
           transform: rotate(-45deg) translateY(2px);
         }
       }
-    &-vertical,
-    &-vertical-left,
-    &-vertical-right {
-      > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow:after {
-        transform: rotate(45deg) translateY(-2px);
-      }
+      > .@{menu-prefix-cls}-submenu-title:hover .@{menu-prefix-cls}-submenu-arrow {
+        &:after,
+        &:before {
+          background: linear-gradient(to right, @primary-color, @primary-color);
         }
-
-    &-inline > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow:after {
-      transform: rotate(45deg) translateX(-2px);
       }
-    &-inline > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow:before {
-      transform: rotate(-45deg) translateX(2px);
     }
 
-    &-vertical,
-    &-vertical-left,
-    &-vertical-right,
-    &-inline {
-       > .@{menu-prefix-cls}-submenu-title:hover .@{menu-prefix-cls}-submenu-arrow {
-        &:after,
+    &-inline > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow {
       &:before {
-          background: linear-gradient(to right, @primary-color, @primary-color);
+        transform: rotate(-45deg) translateX(2px);
       }
+      &:after {
+        transform: rotate(45deg) translateX(-2px);
       }
     }
 
@@ -340,6 +302,21 @@
   &-vertical-left,
   &-vertical-right,
   &-inline {
+    .@{menu-prefix-cls}-item {
+      position: relative;
+      &:after {
+        content: "";
+        position: absolute;
+        right: 0;
+        top: 0;
+        bottom: 0;
+        border-right: 3px solid @primary-color;
+        transform: scaleY(.0001);
+        opacity: 0;
+        transition: transform .15s @ease-out, opacity .15s @ease-out;
+      }
+    }
+
     .@{menu-prefix-cls}-item,
     .@{menu-prefix-cls}-submenu-title {
       padding: 0 16px;
@@ -387,7 +364,6 @@
 
   &-inline-collapsed {
     width: @menu-collapsed-width;
-
     > .@{menu-prefix-cls}-item,
     > .@{menu-prefix-cls}-item-group > .@{menu-prefix-cls}-item-group-list > .@{menu-prefix-cls}-item,
     > .@{menu-prefix-cls}-submenu > .@{menu-prefix-cls}-submenu-title {
@@ -428,23 +404,14 @@
   }
 
   &-item-group-list {
+    margin: 0;
+    padding: 0;
     .@{menu-prefix-cls}-item,
     .@{menu-prefix-cls}-submenu-title {
       padding: 0 16px 0 28px;
     }
   }
 
-  &-vertical&-sub,
-  &-vertical-left&-sub,
-  &-vertical-right&-sub {
-    padding: 0;
-    transform-origin: 0 0;
-    & > .@{menu-prefix-cls}-item,
-    & > .@{menu-prefix-cls}-submenu {
-      transform-origin: 0 0;
-    }
-  }
-
   &-root&-vertical,
   &-root&-vertical-left,
   &-root&-vertical-right,
@@ -486,10 +453,8 @@
       cursor: not-allowed;
     }
   }
-}
 
-// dark theme
-.@{menu-prefix-cls} {
+  // dark theme
   &-dark,
   &-dark &-sub {
     color: @text-color-secondary-dark;

components/notification/demo/with-btn.md

@@ -22,12 +22,8 @@ const close = () => {
 
 const openNotification = () => {
   const key = `open${Date.now()}`;
-  const btnClick = function () {
-    // to hide notification box
-    notification.close(key);
-  };
   const btn = (
-    <Button type="primary" size="small" onClick={btnClick}>
+    <Button type="primary" size="small" onClick={() => notification.close(key)}>
       Confirm
     </Button>
   );
@@ -41,6 +37,8 @@ const openNotification = () => {
 };
 
 ReactDOM.render(
-  <Button type="primary" onClick={openNotification}>Open the notification box</Button>
+  <Button type="primary" onClick={openNotification}>
+    Open the notification box
+  </Button>
 , mountNode);
 ````

components/pagination/style/index.less

@@ -276,9 +276,7 @@
       }
     }
   }
-}
 
-.@{pagination-prefix-cls} {
   &.mini &-total-text,
   &.mini &-simple-pager {
     height: @pagination-item-size-sm;

components/popover/style/index.less

@@ -98,6 +98,10 @@
   // .popover-arrow is outer, .popover-arrow:after is inner
 
   &-arrow {
+    background: @popover-bg;
+    width: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
+    height: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
+    transform: rotate(45deg);
     &,
     &:after {
       position: absolute;
@@ -109,13 +113,6 @@
     }
   }
 
-  &-arrow {
-    background: @popover-bg;
-    width: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
-    height: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
-    transform: rotate(45deg);
-  }
-
   &-placement-top > &-content > &-arrow,
   &-placement-topLeft > &-content >  &-arrow,
   &-placement-topRight > &-content >  &-arrow {

components/select/style/index.less

@@ -259,11 +259,6 @@
     height: 100%;
     width: 100%;
 
-    .@{select-prefix-cls}-selection--multiple & {
-      float: left;
-      position: static;
-    }
-
     .@{select-prefix-cls}-search__field__wrap {
       width: 100%;
       height: 100%;
@@ -292,6 +287,8 @@
     .clearfix;
 
     .@{select-prefix-cls}-search--inline {
+      float: left;
+      position: static;
       width: auto;
       padding: 0;
       max-width: 100%;

components/spin/style/index.less

@@ -22,9 +22,6 @@
 
   &-nested-loading {
     position: relative;
-  }
-
-  &-nested-loading {
     > div > .@{spin-prefix-cls} {
       position: absolute;
       height: 100%;

components/style/color/bezierEasing.less

@@ -1,4 +1,4 @@
-/* stylelint-disable declaration-bang-space-before */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors */
 .bezierEasingMixin() {
 @functions: ~`(function() {
   var NEWTON_ITERATIONS = 4;

components/style/color/colorPalette.less

@@ -1,3 +1,4 @@
+/* stylelint-disable no-duplicate-selectors */
 @import "bezierEasing";
 @import "tinyColor";
 

components/style/color/tinyColor.less

@@ -1,4 +1,4 @@
-/* stylelint-disable declaration-bang-space-before */
+/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors */
 .tinyColorMixin() {
 @functions: ~`(function() {
 // TinyColor v1.4.1

components/style/core/base.less

@@ -340,11 +340,6 @@ textarea {
   color: inherit;
 }
 
-input[type="text"],
-textarea {
-  -webkit-appearance: none;
-}
-
 button,
 input {
   overflow: visible; // Show the overflow in Edge

components/style/core/iconfont.less

@@ -95,7 +95,6 @@
 .@{iconfont-css-prefix}-credit-card:before { content: "\e635"; }
 .@{iconfont-css-prefix}-code-o:before { content: "\e636"; }
 .@{iconfont-css-prefix}-book:before { content: "\e637"; }
-.@{iconfont-css-prefix}-bar-chart:before { content: "\e638"; }
 .@{iconfont-css-prefix}-bars:before { content: "\e639"; }
 .@{iconfont-css-prefix}-question:before { content: "\e63a"; }
 .@{iconfont-css-prefix}-question-circle:before { content: "\e63b"; }

components/table/style/index.less

@@ -258,6 +258,13 @@
     .@{table-prefix-cls}-thead > tr > th {
       background: @component-background;
       border-bottom: @border-width-base @border-style-base @border-color-split;
+      .@{iconfont-css-prefix}-filter,
+      .@{table-prefix-cls}-filter-icon {
+        &:after {
+          height: 39px;
+          top: -14px;
+        }
+      }
     }
 
     .@{table-prefix-cls}-tbody > tr > td {
@@ -293,16 +300,6 @@
       bottom: -11px;
       height: 13px;
     }
-
-    .@{table-prefix-cls}-thead > tr > th {
-      .@{iconfont-css-prefix}-filter,
-      .@{table-prefix-cls}-filter-icon {
-        &:after {
-          height: 39px;
-          top: -14px;
-        }
-      }
-    }
   }
 
   &-column-sorter {

components/tabs/style/card-style.less

@@ -16,11 +16,8 @@
     border: @border-width-base @border-style-base @border-color-split;
     border-bottom: 0;
     border-radius: @border-radius-base @border-radius-base 0 0;
-    transition: all 0.3s @ease-in-out;
     background: @tabs-card-head-background;
     margin-right: 2px;
-  }
-  &&-card > &-bar &-tab {
     padding: 0 16px;
     transition: all 0.3s @ease-in-out;
     line-height: @tabs-card-height - 2px;

components/tabs/style/index.less

@@ -293,15 +293,7 @@
         height: auto;
         top: 0;
       }
-    }
-
-    > .@{tab-prefix-cls}-content {
-      overflow: hidden;
-      width: auto;
-      margin-top: 0 !important;
-    }
 
-    > .@{tab-prefix-cls}-bar {
       .@{tab-prefix-cls}-tab-next {
         width: 100%;
         bottom: 0;
@@ -320,6 +312,12 @@
         }
       }
     }
+
+    > .@{tab-prefix-cls}-content {
+      overflow: hidden;
+      width: auto;
+      margin-top: 0 !important;
+    }
   }
 
   &-vertical&-left {

components/tooltip/style/index.less

@@ -35,10 +35,9 @@
   &-placement-leftBottom {
     padding-right: @tooltip-distance;
   }
-}
 
-// Wrapper for the tooltip content
-.@{tooltip-prefix-cls}-inner {
+  // Wrapper for the tooltip content
+  &-inner {
     max-width: @tooltip-max-width;
     padding: 6px 8px;
     color: @tooltip-color;
@@ -48,18 +47,17 @@
     border-radius: @border-radius-base;
     box-shadow: @box-shadow-base;
     min-height: 32px;
-}
+  }
 
-// Arrows
-.@{tooltip-prefix-cls}-arrow {
+  // Arrows
+  &-arrow {
     position: absolute;
     width: 0;
     height: 0;
     border-color: transparent;
     border-style: solid;
-}
+  }
 
-.@{tooltip-prefix-cls} {
   &-placement-top &-arrow,
   &-placement-topLeft &-arrow,
   &-placement-topRight &-arrow {

package.json

@@ -116,14 +116,14 @@
     "eslint-plugin-import": "^2.2.0",
     "eslint-plugin-jsx-a11y": "^6.0.2",
     "eslint-plugin-markdown": "~1.0.0-beta.4",
-    "eslint-plugin-react": "7.4.0",
+    "eslint-plugin-react": "7.5.1",
     "eslint-tinker": "^0.4.0",
     "fetch-jsonp": "^1.0.3",
     "glob": "^7.1.1",
     "immutability-helper": "^2.5.0",
     "jest": "^21.1.0",
     "jsonml.js": "^0.1.0",
-    "lint-staged": "^4.0.2",
+    "lint-staged": "^5.0.0",
     "majo": "^0.4.1",
     "mockdate": "^2.0.1",
     "moment-timezone": "^0.5.5",
@@ -154,7 +154,7 @@
     "reqwest": "^2.0.5",
     "rimraf": "^2.5.4",
     "stylelint": "^8.0.0",
-    "stylelint-config-standard": "^17.0.0",
+    "stylelint-config-standard": "^18.0.0",
     "typescript": "~2.6.1",
     "unified": "^6.1.5",
     "values.js": "^1.0.3",

site/theme/static/colors.less

@@ -1,3 +1,4 @@
+/* stylelint-disable no-duplicate-selectors */
 .color-palettes {
   margin: 0 1%;
 }

site/theme/static/header.less

@@ -92,9 +92,6 @@
   float: right;
   font-size: 14px;
   font-family: Lato, @font-family;
-}
-
-#nav {
   &.ant-menu-horizontal {
     border-bottom: none;
 

site/theme/static/markdown.less

@@ -23,12 +23,19 @@
   margin-bottom: 20px;
   margin-top: 8px;
   font-family: Lato, @font-family;
+  font-size: 30px;
+  line-height: 38px;
 
   .subtitle {
     margin-left: 12px;
   }
 }
 
+.markdown h2 {
+  font-size: 24px;
+  line-height: 32px;
+}
+
 .markdown h2,
 .markdown h3,
 .markdown h4,
@@ -41,15 +48,6 @@
   clear: both;
 }
 
-.markdown h1 {
-  font-size: 30px;
-  line-height: 38px;
-}
-.markdown h2 {
-  font-size: 24px;
-  line-height: 32px;
-}
-
 .markdown h3 { font-size: 18px; }
 .markdown h4 { font-size: 16px; }
 .markdown h5 { font-size: 14px; }
@@ -131,6 +129,7 @@
   white-space: nowrap;
   color: #5c6b77;
   font-weight: 500;
+  background: rgba(0, 0, 0, 0.02);
 }
 
 .markdown > table th,
@@ -140,10 +139,6 @@
   text-align: left;
 }
 
-.markdown > table th {
-  background: rgba(0, 0, 0, 0.02);
-}
-
 .markdown blockquote {
   font-size: 90%;
   color: @site-text-color-secondary;
@@ -304,10 +299,8 @@
     height: 80px;
     line-height: 80px;
   }
-}
 
-// For Changelog
-.markdown {
+  // For Changelog
   ul.ant-timeline {
     li.ant-timeline-item {
       list-style: none;