rsuite 4.8.5 → 4.8.9

package/es/Alert/styles/common.less

@@ -81,7 +81,7 @@
     cursor: pointer;
 
     &-x::before {
-      .icon-font;
+      .icon-font();
 
       content: @default-close-btn-content;
     }

package/es/AutoComplete/styles/common.less

@@ -4,14 +4,14 @@
 .@{ns}auto-complete {
   &-menu > {
     // Auto complete items style the same to Picker menu items
-    .picker-menu-items-reset;
+    .picker-menu-items-reset();
 
     margin-top: @border-radius-base;
   }
 
   // The same to Picker select menu item
   &-item {
-    .picker-select-item;
+    .picker-select-item();
 
     &,
     &:hover,
@@ -22,7 +22,7 @@
 
     &-focus,
     &:hover {
-      .picker-item-hover;
+      .picker-item-hover();
     }
   }
 

package/es/Avatar/styles/common.less

@@ -9,7 +9,7 @@
   align-items: center;
   border-radius: @avatar-border-radius;
   overflow: hidden;
-  .avatar-md;
+  .avatar-md();
 
   & > .@{ns}icon {
     vertical-align: middle;
@@ -29,7 +29,7 @@
     background: @avatar-background;
     text-align: center;
     padding: 0 2px;
-    .ellipsis-basic;
+    .ellipsis-basic();
   }
 
   &-circle {
@@ -37,14 +37,14 @@
   }
 
   &-lg {
-    .avatar-lg;
+    .avatar-lg();
   }
 
   &-sm {
-    .avatar-sm;
+    .avatar-sm();
   }
 
   &-xs {
-    .avatar-xs;
+    .avatar-xs();
   }
 }

package/es/Avatar/styles/mixin.less

@@ -4,7 +4,7 @@
   font-size: @font-size;
 
   & > .@{ns}icon {
-    @icon-font-size: (@side-length - @font-size)/2 + @font-size;
+    @icon-font-size: ((@side-length - @font-size)/2 + @font-size);
 
     font-size: @icon-font-size;
 

package/es/Button/styles/common.less

@@ -8,7 +8,7 @@
 // Base styles
 // --------------------------------------------------
 .@{ns}btn {
-  .btn;
+  .btn();
 
   a& {
     // Reset text-decoration when use in a
@@ -19,7 +19,7 @@
 .@{ns}btn-default,
 .@{ns}btn-primary,
 .@{ns}btn-subtle {
-  .button-ripple;
+  .button-ripple();
 }
 
 // Button Loading state
@@ -153,7 +153,7 @@
 
 // Subtle Button
 .@{ns}btn-subtle {
-  .btn-subtle;
+  .btn-subtle();
 }
 
 // Ghost Button
@@ -168,15 +168,15 @@
 // --------------------------------------------------
 
 .@{ns}btn-lg {
-  .btn-lg;
+  .btn-lg();
 }
 
 .@{ns}btn-sm {
-  .btn-sm;
+  .btn-sm();
 }
 
 .@{ns}btn-xs {
-  .btn-xs;
+  .btn-xs();
 }
 
 // Block button

package/es/Button/styles/mixin.less

@@ -12,7 +12,7 @@
   border: none;
   user-select: none;
 
-  .btn-md;
+  .btn-md();
 
   &:hover,
   &:focus {
@@ -57,7 +57,7 @@
 
 // Subtle  button style
 .btn-subtle() {
-  .btn-transition;
+  .btn-transition();
   .btn-subtle-variant(@btn-subtle-hover-bg);
   .btn-loading-reset(@btn-subtle-color);
 
@@ -155,8 +155,8 @@
 
 // Full button size
 .button-size(@padding-vertical; @padding-horizontal; @font-size; @line-height; @border-radius) {
-  @icon-side-length: @padding-vertical*2 + floor(@font-size* @line-height);
-  @ghost-icon-side-length: @icon-side-length - @btn-ghost-border-width*2;
+  @icon-side-length: ((@padding-vertical*2) + floor(@font-size* @line-height));
+  @ghost-icon-side-length: (@icon-side-length - @btn-ghost-border-width*2);
   @svg-icon-height: @font-size;
 
   .button-size(
@@ -171,23 +171,23 @@
 
   // Button icon
   &.@{ns}btn-icon {
-    padding-left: @icon-side-length - @padding-horizontal;
+    padding-left: (@icon-side-length - @padding-horizontal);
     height: @icon-side-length;
     position: relative;
 
     // Ghost button need minus border-width.
     .@{ns}btn-ghost& {
-      padding-left: @icon-side-length - @padding-horizontal - @btn-ghost-border-width*2;
+      padding-left: (@icon-side-length - @padding-horizontal - @btn-ghost-border-width * 2);
     }
 
     &.@{ns}btn-icon-with-text {
       &.@{ns}btn-icon-placement-left {
-        padding-left: @icon-side-length + @padding-vertical;
+        padding-left: (@icon-side-length + @padding-vertical);
       }
 
       &.@{ns}btn-icon-placement-right {
         padding-left: @padding-base-input-horizontal;
-        padding-right: @icon-side-length + @padding-vertical;
+        padding-right: (@icon-side-length + @padding-vertical);
 
         > .@{ns}icon {
           left: auto;
@@ -231,7 +231,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     base; @padding-small-vertical; @padding-small-horizontal; @font-size-base; @line-height-base;
-    @btn-border-radius-small
+      @btn-border-radius-small
   );
   /* stylelint-enable */
 }
@@ -240,7 +240,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     base; @padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base;
-    @btn-border-radius-base
+      @btn-border-radius-base
   );
   /* stylelint-enable */
 }
@@ -249,7 +249,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     base; @padding-extra-small-vertical; @padding-extra-small-horizontal; @font-size-small;
-    @line-height-small; @btn-border-radius-small
+      @line-height-small; @btn-border-radius-small
   );
   /* stylelint-enable */
 }
@@ -258,7 +258,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     base; @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large;
-    @btn-border-radius-large
+      @btn-border-radius-large
   );
   /* stylelint-enable */
 }
@@ -268,7 +268,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     @padding-small-vertical; @padding-small-horizontal; @font-size-base; @line-height-base;
-    @btn-border-radius-small
+      @btn-border-radius-small
   );
   /* stylelint-enable */
 }
@@ -277,7 +277,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     @padding-base-vertical; @padding-base-horizontal; @font-size-base; @line-height-base;
-    @btn-border-radius-base
+      @btn-border-radius-base
   );
   /* stylelint-enable */
 }
@@ -286,7 +286,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     @padding-extra-small-vertical; @padding-extra-small-horizontal; @font-size-small;
-    @line-height-small; @btn-border-radius-small
+      @line-height-small; @btn-border-radius-small
   );
   /* stylelint-enable */
 }
@@ -295,7 +295,7 @@
   /* stylelint-disable */ //Formatted by prettier
   .button-size(
     @padding-large-vertical; @padding-large-horizontal; @font-size-large; @line-height-large;
-    @btn-border-radius-large
+      @btn-border-radius-large
   );
   /* stylelint-enable */
 }
@@ -305,7 +305,7 @@
   overflow: hidden;
   position: relative;
 
-  .safari-border-radius-overflow-hidden;
+  .safari-border-radius-overflow-hidden();
 
   &:not(.@{prefix}disabled) {
     .@{ns}ripple {

package/es/ButtonGroup/styles/common.less

@@ -29,15 +29,15 @@
 // Force change the size of the button in the button group.
 .@{ns}btn {
   .@{ns}btn-group-lg & {
-    .btn-lg;
+    .btn-lg();
   }
 
   .@{ns}btn-group-sm & {
-    .btn-sm;
+    .btn-sm();
   }
 
   .@{ns}btn-group-xs & {
-    .btn-xs;
+    .btn-xs();
   }
 }
 
@@ -241,7 +241,7 @@
 
   // Clear floats so dropdown menus can be properly placed
   > .@{ns}btn-group {
-    .clearfix;
+    .clearfix();
 
     > .@{ns}btn {
       float: none;
@@ -267,7 +267,7 @@
   > .@{ns}btn,
   > .@{ns}btn-group {
     flex: 1 1 1%;
-    .ellipsis-basic;
+    .ellipsis-basic();
   }
 
   > .@{ns}btn-group .@{ns}btn {

package/es/Calendar/styles/common.less

@@ -30,7 +30,7 @@
   &-panel &-header {
     width: 100%;
     padding-bottom: 6px;
-    .clearfix;
+    .clearfix();
   }
 
   &-panel &-header &-btn-today {
@@ -40,7 +40,7 @@
   &-panel &-header-forward,
   &-panel &-header-title,
   &-panel &-header-backward {
-    .btn-md;
+    .btn-md();
   }
 
   &-panel &-header-forward,
@@ -167,7 +167,7 @@
   }
 
   .@{clpns}-header-title-date {
-    .picker-calendar-title-show;
+    .picker-calendar-title-show();
 
     &.@{clpns}-header-error {
       color: @error-color;
@@ -183,7 +183,7 @@
 // Show time dropdown
 .@{clpns}-show-time-dropdown {
   .@{clpns}-header-title-time {
-    .picker-calendar-title-show;
+    .picker-calendar-title-show();
 
     &.@{clpns}-header-error {
       color: @error-color;
@@ -230,7 +230,7 @@
   width: @calendar-header-width;
   padding-left: @calendar-picker-padding;
   padding-right: @calendar-picker-padding;
-  .clearfix;
+  .clearfix();
 
   // Month toolbar && Time toolbar
   &-month-toolbar,
@@ -252,7 +252,7 @@
   &-backward,
   &-forward {
     .btn(base);
-    .btn-subtle;
+    .btn-subtle();
     .btn-xs(base);
 
     padding: 2px 2px;
@@ -303,7 +303,7 @@
   &-backward,
   &-forward {
     font-size: 0;
-    width: @padding-extra-small-vertical * 2 + @font-size-small * @line-height-small;
+    width: (@padding-extra-small-vertical * 2 + @font-size-small * @line-height-small);
 
     &::before {
       font-family: @font-family-icon;
@@ -331,7 +331,7 @@
     display: block;
     text-align: center;
     width: 100%;
-    .clearfix;
+    .clearfix();
   }
 
   &-has-month:not(&-has-time) &-backward {
@@ -425,7 +425,7 @@
 
   &-disabled&-is-today&-selected &-content {
     &:hover {
-      .picker-calendar-cell-content-selected;
+      .picker-calendar-cell-content-selected();
     }
   }
 
@@ -436,7 +436,7 @@
 }
 
 .@{clpns}-table-cell-content {
-  .picker-calendar-cell-content;
+  .picker-calendar-cell-content();
 
   .@{clpns}-table-cell-is-today & {
     border: @calendar-table-cell-content-today-border-width solid
@@ -445,7 +445,7 @@
   }
 
   .@{clpns}-table-cell-selected & {
-    .picker-calendar-cell-content-selected;
+    .picker-calendar-cell-content-selected();
   }
 }
 
@@ -527,7 +527,7 @@
 
   &-list {
     display: block;
-    .clearfix;
+    .clearfix();
   }
 
   &-cell {
@@ -545,7 +545,7 @@
   }
 
   &-cell-content {
-    .picker-calendar-cell-content;
+    .picker-calendar-cell-content();
   }
 
   &-cell:not(&-cell-active).disabled &-cell-content {
@@ -561,7 +561,7 @@
   }
 
   &-cell-active &-cell-content {
-    .picker-calendar-cell-content-selected;
+    .picker-calendar-cell-content-selected();
   }
 }
 

package/es/Carousel/styles/common.less

@@ -104,7 +104,7 @@
   }
 
   &-shape-bar &-label {
-    border-radius: @carousel-bar-height / 2;
+    border-radius: (@carousel-bar-height / 2);
   }
 
   &-placement-top&-shape-bar &-label,

package/es/Cascader/Cascader.js

@@ -530,7 +530,8 @@ function (_React$Component) {
       onClean: createChainedFunction(this.handleClean, onClean),
       cleanable: cleanable && !disabled,
       hasValue: hasValue,
-      active: active
+      active: active,
+      "aria-disabled": disabled
     }), activeItemLabel || React.createElement(FormattedMessage, {
       id: "placeholder"
     })))));

package/es/Cascader/styles/common.less

@@ -9,7 +9,7 @@
 @cspns: ~'@{ns}@{cascader-picker-prefix}';
 
 .@{cspns}-menu-items > div {
-  .clearfix;
+  .clearfix();
 }
 
 // Search panel
@@ -99,14 +99,14 @@
   &:not(&-disabled):hover,
   &:not(&-disabled):focus,
   &.@{ns}picker-select-menu-item-focus {
-    .picker-item-hover;
+    .picker-item-hover();
 
     text-decoration: none;
   }
 
   &&-focus,
   &&-active {
-    .picker-item-active;
+    .picker-item-active();
 
     &,
     &:hover,
@@ -144,7 +144,7 @@
 }
 
 .@{cspns}-menu-caret {
-  .dropdown-toggle-caret-common;
+  .dropdown-toggle-caret-common();
 
   &::before {
     content: @drop-right-caret-content ~'/* rtl: "@{drop-left-caret-content}" */';

package/es/CheckPicker/CheckPicker.js

@@ -531,7 +531,8 @@ function (_React$Component) {
       componentClass: toggleComponentClass,
       cleanable: cleanable && !disabled,
       hasValue: hasValue,
-      active: this.state.active
+      active: this.state.active,
+      "aria-disabled": disabled
     }), selectedElement || React.createElement(FormattedMessage, {
       id: "placeholder"
     })))));

package/es/CheckPicker/styles/common.less

@@ -5,12 +5,12 @@
 
 // Menu Items
 .@{ckpns}-menu-items {
-  .picker-menu-items-reset;
+  .picker-menu-items-reset();
   .picker-menu-group-common(@check-picker-prefix);
   .picker-menu-group-title(@check-picker-prefix);
   .picker-menu-group-closed(@check-picker-prefix);
 
   .@{ns}check-item.@{ns}checkbox-checked .@{ns}checkbox-checker > label {
-    .picker-item-active;
+    .picker-item-active();
   }
 }

package/es/CheckTreePicker/CheckTreePicker.js

@@ -1337,7 +1337,8 @@ function (_React$Component) {
       componentClass: toggleComponentClass,
       cleanable: cleanable && !disabled,
       hasValue: hasValidValue,
-      active: this.state.active
+      active: this.state.active,
+      "aria-disabled": disabled
     }), selectedElement || locale.placeholder)));
   };
 

package/es/CheckTreePicker/styles/common.less

@@ -35,11 +35,11 @@
     }
 
     &:focus .@{ns}check-item .@{ns}checkbox-checker > label {
-      .picker-item-hover;
+      .picker-item-hover();
     }
 
     .@{ns}check-item.@{ns}checkbox-checked .@{ns}checkbox-checker > label {
-      .picker-item-active;
+      .picker-item-active();
     }
 
     .@{ns}check-item .@{ns}checkbox-checker > label {
@@ -54,7 +54,7 @@
       &::before {
         content: '';
         position: absolute;
-        width: @picker-tree-arrow-down-width+ @picker-tree-arrow-down-gap + 30px; // checkbox-spacing = 30
+        width: (@picker-tree-arrow-down-width+ @picker-tree-arrow-down-gap + 30px); // checkbox-spacing = 30
         height: 100%;
         background-color: @picker-tree-bg;
         top: 0;
@@ -136,7 +136,7 @@
   }
 
   > .@{ctpns}-node-custom-icon {
-    .node-item-prepend-icon;
+    .node-item-prepend-icon();
   }
 }
 
@@ -164,7 +164,7 @@
     padding: 0 @picker-menu-padding @picker-menu-padding 0;
 
     &-node > .@{ctpns}-node-label .@{ctpns}-node-text-wrapper {
-      .ellipsis;
+      .ellipsis();
 
       display: inline-block;
       vertical-align: top;

package/es/Checkbox/styles/common.less

@@ -2,14 +2,14 @@
 @import 'mixin';
 
 .@{ns}checkbox {
-  .radio-checkbox-common;
+  .radio-checkbox-common();
 }
 
 .@{ns}checkbox-checker {
   padding-top: 10px;
   padding-bottom: 10px;
-  padding-left: @checkbox-sense-width*2 + @checkbox-width-height;
-  min-height: @checkbox-sense-width*2 + @checkbox-width-height;
+  padding-left: (@checkbox-sense-width*2 + @checkbox-width-height);
+  min-height: (@checkbox-sense-width*2 + @checkbox-width-height);
   line-height: 1;
   position: relative;
 }

package/es/Checkbox/styles/mixin.less

@@ -21,7 +21,7 @@
   }
 
   label {
-    line-height: unit(@checkbox-width-height / @font-size-base);
+    line-height: unit((@checkbox-width-height / @font-size-base));
     margin-bottom: 0;
     font-weight: normal;
     cursor: pointer;

package/es/DatePicker/DatePicker.js

@@ -443,7 +443,8 @@ function (_React$Component) {
       onClean: createChainedFunction(this.handleClean, onClean),
       cleanable: cleanable && !disabled,
       hasValue: hasValue,
-      active: this.state.active
+      active: this.state.active,
+      "aria-disabled": disabled
     }), this.getDateString()))));
   };
 

package/es/DatePicker/styles/common.less

@@ -18,7 +18,7 @@
 
 // Toolbar
 .@{ns}picker-toolbar {
-  .clearfix;
+  .clearfix();
 
   padding: @calendar-picker-padding;
   border-top: 1px solid @calendar-toolbar-border-color;

package/es/DateRangePicker/DateRangePicker.js

@@ -548,7 +548,8 @@ function (_React$Component) {
       onClean: createChainedFunction(this.handleClean, onClean),
       cleanable: cleanable && !disabled,
       hasValue: hasValue,
-      active: this.state.active
+      active: this.state.active,
+      "aria-disabled": disabled
     }), this.getDateString()))));
   };
 

package/es/Drawer/styles/common.less

@@ -164,7 +164,7 @@
 // Drawer header
 // Top section of the modal title.
 .@{ns}drawer-header {
-  .clearfix;
+  .clearfix();
 
   padding-right: @line-height-computed;
   position: relative;
@@ -172,12 +172,12 @@
 
   .@{ns}drawer-title {
     font-size: @drawer-title-font-size;
-    line-height: unit(@line-height-computed / @drawer-title-font-size);
+    line-height: unit((@line-height-computed / @drawer-title-font-size));
     width: 100%;
     display: block;
     color: @drawer-title-color;
     margin: 0;
-    .ellipsis;
+    .ellipsis();
   }
 }
 
@@ -200,7 +200,7 @@
   border-style: none;
 
   &::before {
-    .icon-font;
+    .icon-font();
 
     content: @default-close-btn-content;
   }
@@ -220,7 +220,7 @@
 
 // Footer (for actions)
 .@{ns}drawer-footer {
-  .clearfix; // clear it in case folks use .pull-* classes on buttons
+  .clearfix(); // clear it in case folks use .pull-* classes on buttons
 
   text-align: right; // right align buttons
   border-top: none;