rsuite 5.0.2 → 5.2.1

package/dist/rsuite-rtl.css

@@ -219,6 +219,7 @@
   --rs-navbar-inverse-text: #fff;
   --rs-navbar-inverse-selected-bg: #1675e0;
   --rs-navbar-inverse-hover-bg: #2589f5;
+  --rs-navbar-inverse-hover-text: #fff;
   --rs-navbar-subtle-bg: #fff;
   --rs-navbar-subtle-text: #8e8e93;
   --rs-navbar-subtle-selected-text: #1675e0;
@@ -259,6 +260,8 @@
   --rs-rate-symbol-checked: #ffb300;
   --rs-toggle-bg: #d9d9d9;
   --rs-toggle-thumb: #fff;
+  --rs-toggle-loader-ring: rgba(247, 247, 250, 0.3);
+  --rs-toggle-loader-rotor: #fff;
   --rs-toggle-hover-bg: #c5c6c7;
   --rs-toggle-disabled-bg: #f7f7fa;
   --rs-toggle-disabled-thumb: #fff;
@@ -534,6 +537,7 @@
   --rs-navbar-inverse-text: #fff;
   --rs-navbar-inverse-selected-bg: #59d0ff;
   --rs-navbar-inverse-hover-bg: #25b3f5;
+  --rs-navbar-inverse-hover-text: #fff;
   --rs-navbar-subtle-bg: transparent;
   --rs-navbar-subtle-text: #a4a9b3;
   --rs-navbar-subtle-selected-text: #34c3ff;
@@ -857,6 +861,7 @@
   --rs-navbar-inverse-selected-bg: transparent;
   --rs-navbar-inverse-selected-text: #ffff00;
   --rs-navbar-inverse-hover-bg: transparent;
+  --rs-navbar-inverse-hover-text: #ffff00;
   --rs-navbar-subtle-bg: #1a1d24;
   --rs-navbar-subtle-text: #e9ebf0;
   --rs-navbar-subtle-selected-text: #ffff00;
@@ -9215,6 +9220,21 @@ textarea.rs-picker-search-input {
 .rs-navbar-nav > .rs-dropdown .rs-dropdown-toggle {
   outline: 0;
 }
+.rs-navbar-brand,
+.rs-navbar-item,
+.rs-navbar-nav > .rs-dropdown-item,
+.rs-navbar-brand:hover,
+.rs-navbar-item:hover,
+.rs-navbar-nav > .rs-dropdown-item:hover,
+.rs-navbar-brand:focus,
+.rs-navbar-item:focus,
+.rs-navbar-nav > .rs-dropdown-item:focus,
+.rs-navbar-brand:active,
+.rs-navbar-item:active,
+.rs-navbar-nav > .rs-dropdown-item:active,
+.rs-navbar-nav > .rs-dropdown .rs-dropdown-toggle {
+  text-decoration: none;
+}
 .rs-navbar-brand:focus-visible,
 .rs-navbar-item:focus-visible,
 .rs-navbar-nav > .rs-dropdown-item:focus-visible {
@@ -9283,6 +9303,8 @@ textarea.rs-picker-search-input {
 .rs-navbar-inverse .rs-dropdown .rs-dropdown-toggle:focus {
   background-color: #2589f5;
   background-color: var(--rs-navbar-inverse-hover-bg);
+  color: #fff;
+  color: var(--rs-navbar-inverse-hover-text);
 }
 .rs-navbar-inverse .rs-navbar-item.rs-navbar-item-active,
 .rs-navbar-inverse .rs-dropdown .rs-dropdown-menu-active ~ .rs-dropdown-toggle {
@@ -10345,7 +10367,7 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn {
   padding-left: 32px;
 }
-.rs-picker-cleanable .rs-picker-toggle.rs-btn {
+.rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn {
   padding-left: 44px;
 }
 .rs-picker-toggle.rs-btn .rs-picker-toggle-caret,
@@ -10423,7 +10445,7 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-lg {
   padding-left: 36px;
 }
-.rs-picker-cleanable .rs-picker-toggle.rs-btn-lg {
+.rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-lg {
   padding-left: 50px;
 }
 .rs-picker-toggle.rs-btn-lg .rs-picker-toggle-caret,
@@ -10536,7 +10558,7 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-md {
   padding-left: 32px;
 }
-.rs-picker-cleanable .rs-picker-toggle.rs-btn-md {
+.rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-md {
   padding-left: 44px;
 }
 .rs-picker-toggle.rs-btn-md .rs-picker-toggle-caret,
@@ -10651,7 +10673,7 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-sm {
   padding-left: 30px;
 }
-.rs-picker-cleanable .rs-picker-toggle.rs-btn-sm {
+.rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-sm {
   padding-left: 42px;
 }
 .rs-picker-toggle.rs-btn-sm .rs-picker-toggle-caret,
@@ -10768,7 +10790,7 @@ textarea.rs-picker-search-input {
 .rs-picker-toggle-wrapper .rs-picker-toggle.rs-btn-xs {
   padding-left: 28px;
 }
-.rs-picker-cleanable .rs-picker-toggle.rs-btn-xs {
+.rs-picker-has-value.rs-picker-cleanable .rs-picker-toggle.rs-btn-xs {
   padding-left: 40px;
 }
 .rs-picker-toggle.rs-btn-xs .rs-picker-toggle-caret,
@@ -10907,11 +10929,11 @@ textarea.rs-picker-search-input {
   white-space: nowrap;
   width: 100%;
 }
-.rs-picker-cleanable .rs-picker-toggle {
+.rs-picker-cleanable.rs-picker-has-value .rs-picker-toggle {
   padding-left: 44px;
 }
-.rs-picker-date.rs-picker-cleanable .rs-picker-toggle,
-.rs-picker-daterange.rs-picker-cleanable .rs-picker-toggle {
+.rs-picker-date.rs-picker-cleanable.rs-picker-has-value .rs-picker-toggle,
+.rs-picker-daterange.rs-picker-cleanable.rs-picker-has-value .rs-picker-toggle {
   padding-left: 52px;
 }
 .rs-picker-toggle-clean {
@@ -12543,6 +12565,9 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   outline: 0;
   overflow: hidden;
 }
+.rs-sidenav-item:hover {
+  text-decoration: none;
+}
 .rs-sidenav-item:focus-visible,
 .rs-sidenav-item.rs-sidenav-item-focus {
   -webkit-box-shadow: inset var(--rs-state-focus-shadow-slim);
@@ -12886,6 +12911,26 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   background-color: #2589f5;
   background-color: var(--rs-sidenav-inverse-hover-bg);
 }
+.rs-sidenav-inverse .rs-dropdown-item,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle {
+  color: #fff;
+  color: var(--rs-sidenav-inverse-text);
+}
+.rs-sidenav-inverse .rs-dropdown-item:hover,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle:hover,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle:hover,
+.rs-sidenav-inverse .rs-dropdown-item:focus,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle:focus,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle:focus,
+.rs-sidenav-inverse .rs-dropdown-item.rs-dropdown-item-focus,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-menu-toggle.rs-dropdown-item-focus,
+.rs-sidenav-inverse .rs-dropdown-item > .rs-dropdown-item-toggle.rs-dropdown-item-focus {
+  background-color: #2589f5;
+  background-color: var(--rs-sidenav-inverse-hover-bg);
+  color: #fff;
+  color: var(--rs-sidenav-inverse-text);
+}
 .rs-theme-high-contrast .rs-sidenav-inverse .rs-sidenav-item.rs-sidenav-item-active,
 .rs-theme-high-contrast .rs-sidenav-inverse .rs-dropdown.rs-dropdown-selected-within .rs-dropdown-toggle {
   color: var(--rs-sidenav-inverse-selected-text);
@@ -12913,38 +12958,6 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   background-color: #1675e0;
   background-color: var(--rs-sidenav-inverse-selected-bg);
 }
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item:not(.rs-dropdown-item-submenu),
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item:not(.rs-dropdown-item-submenu),
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-menu-toggle,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-menu-toggle,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-item-toggle,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-item-toggle {
-  color: #fff;
-  color: var(--rs-sidenav-inverse-text);
-}
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item:not(.rs-dropdown-item-submenu):hover,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item:not(.rs-dropdown-item-submenu):hover,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-menu-toggle:hover,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-menu-toggle:hover,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-item-toggle:hover,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-item-toggle:hover,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item:not(.rs-dropdown-item-submenu):focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item:not(.rs-dropdown-item-submenu):focus,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-menu-toggle:focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-menu-toggle:focus,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-item-toggle:focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-item-toggle:focus,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item:not(.rs-dropdown-item-submenu).rs-dropdown-item-focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item:not(.rs-dropdown-item-submenu).rs-dropdown-item-focus,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-menu-toggle.rs-dropdown-item-focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-menu-toggle.rs-dropdown-item-focus,
-.rs-sidenav-inverse.rs-sidenav-collapse-in .rs-dropdown-item > .rs-dropdown-item-toggle.rs-dropdown-item-focus,
-.rs-sidenav-inverse.rs-sidenav-collapsing .rs-dropdown-item > .rs-dropdown-item-toggle.rs-dropdown-item-focus {
-  background-color: #2589f5;
-  background-color: var(--rs-sidenav-inverse-hover-bg);
-  color: #fff;
-  color: var(--rs-sidenav-inverse-text);
-}
 .rs-sidenav-subtle {
   background-color: transparent;
   color: #8e8e93;
@@ -13118,6 +13131,9 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   -webkit-transform: scale(1.2);
           transform: scale(1.2);
 }
+.rs-slider-vertical .rs-slider-handle {
+  top: unset;
+}
 .rs-slider-vertical .rs-slider-handle::before {
   right: 3px;
   margin-top: -6px;
@@ -13152,25 +13168,25 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 .rs-slider-graduator {
   width: 100%;
 }
-.rs-slider-graduator ul,
+.rs-slider-graduator ol,
 .rs-slider-graduator li {
   list-style: none;
 }
-.rs-slider-graduator > ul {
+.rs-slider-graduator > ol {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   padding-right: 0;
   width: 100%;
 }
-.rs-slider-graduator > ul > li {
+.rs-slider-graduator > ol > li {
   -webkit-box-flex: 1;
       -ms-flex: 1 1 1%;
           flex: 1 1 1%;
   position: relative;
 }
-.rs-slider-graduator > ul > li:last-child::after,
-.rs-slider-graduator > ul > li::before {
+.rs-slider-graduator > ol > li:last-child::after,
+.rs-slider-graduator > ol > li::before {
   content: '';
   display: block;
   position: absolute;
@@ -13186,43 +13202,44 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   margin-right: -4px;
   top: -1px;
 }
-.rs-slider-vertical .rs-slider-graduator > ul > li:last-child::after,
-.rs-slider-vertical .rs-slider-graduator > ul > li::before {
-  top: -4px;
+.rs-slider-vertical .rs-slider-graduator > ol > li:last-child::after,
+.rs-slider-vertical .rs-slider-graduator > ol > li::before {
+  top: unset;
+  bottom: -4px;
   margin-right: -1px;
 }
-.rs-slider-graduator > ul > li:last-child::after {
+.rs-slider-graduator > ol > li:last-child::after {
   left: -4px;
 }
-.rs-slider-vertical .rs-slider-graduator > ul > li:last-child::after {
+.rs-slider-vertical .rs-slider-graduator > ol > li:last-child::after {
   right: 0;
-  top: auto;
-  bottom: -4px;
+  bottom: unset;
+  top: -4px;
 }
-.rs-slider-graduator > ul > li.rs-slider-pass::before {
+.rs-slider-graduator > ol > li.rs-slider-pass::before {
   border-color: #3498ff;
   border-color: var(--rs-slider-progress);
 }
-.rs-slider-graduator > ul > li.rs-slider-active::before {
+.rs-slider-graduator > ol > li.rs-slider-active::before {
   visibility: hidden;
 }
 .rs-slider-vertical .rs-slider-graduator {
   display: block;
   height: 100%;
 }
-.rs-slider-vertical .rs-slider-graduator > ul {
+.rs-slider-vertical .rs-slider-graduator > ol {
   width: 6px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-orient: vertical;
-  -webkit-box-direction: normal;
-      -ms-flex-direction: column;
-          flex-direction: column;
+  -webkit-box-direction: reverse;
+      -ms-flex-direction: column-reverse;
+          flex-direction: column-reverse;
   height: 100%;
   padding: 0;
 }
-.rs-slider-vertical .rs-slider-graduator > ul > li {
+.rs-slider-vertical .rs-slider-graduator > ol > li {
   display: block;
   padding: 0;
 }
@@ -13235,21 +13252,22 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 }
 .rs-slider-vertical .rs-slider-progress-bar {
   width: 6px;
-  border-radius: 3px 3px 0 0;
+  border-radius: 0 0 3px 3px;
 }
 .rs-slider-vertical {
   height: 100%;
 }
 .rs-slider-vertical .rs-slider-mark {
-  top: -8px;
+  top: unset;
+  bottom: -8px;
   right: 15px;
 }
 .rs-slider-vertical .rs-slider-mark-content {
   margin-right: auto;
 }
 .rs-slider-vertical .rs-slider-mark-last {
-  top: auto;
-  bottom: -8px;
+  bottom: unset;
+  top: -8px;
 }
 .rs-steps {
   min-height: 30px;
@@ -14205,59 +14223,82 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
 .rs-timeline-align-alternate .rs-timeline-item:nth-child(2n) .rs-timeline-item-time {
   padding-right: 17px;
 }
-.rs-btn-toggle {
+.rs-toggle {
+  position: relative;
+}
+.rs-toggle .rs-toggle-loader {
+  width: 18px;
+  height: 18px;
+  right: 3px;
+  top: 3px;
+}
+.rs-toggle .rs-toggle-presentation {
   height: 24px;
   min-width: 44px;
   border-radius: 12px;
-  position: relative;
-  display: inline-block;
-  -webkit-box-sizing: border-box;
-          box-sizing: border-box;
-  vertical-align: middle;
-  background-color: #d9d9d9;
-  background-color: var(--rs-toggle-bg);
-  color: #fff;
-  color: var(--rs-toggle-thumb);
-  cursor: pointer;
-  -webkit-transition: background-color 0.2s ease-in-out, width 0.2s ease-in-out;
-  transition: background-color 0.2s ease-in-out, width 0.2s ease-in-out;
-  -webkit-user-select: none;
-     -moz-user-select: none;
-      -ms-user-select: none;
-          user-select: none;
 }
-.rs-btn-toggle::after {
+.rs-toggle .rs-toggle-presentation::after {
   width: 18px;
   height: 18px;
   right: 3px;
   top: 3px;
   border-radius: 9px;
 }
-.rs-btn-toggle:active::after {
+.rs-toggle .rs-toggle-presentation:active::after {
   width: 21.6px;
 }
-.rs-btn-toggle .rs-btn-toggle-inner {
+.rs-toggle .rs-toggle-inner {
   margin-right: 24px;
   margin-left: 8px;
   height: 24px;
   line-height: 2;
   font-size: 12px;
 }
-.rs-btn-toggle .rs-btn-toggle-inner .rs-icon {
+.rs-toggle .rs-toggle-inner .rs-icon {
   font-size: 12px;
 }
-.rs-btn-toggle.rs-btn-toggle-checked::after {
+.rs-toggle.rs-toggle-checked .rs-toggle-presentation::after {
   right: 100%;
   margin-right: -21px;
 }
-.rs-btn-toggle.rs-btn-toggle-checked:active::after {
+.rs-toggle.rs-toggle-checked .rs-toggle-presentation:active::after {
   margin-right: -24.6px;
 }
-.rs-btn-toggle.rs-btn-toggle-checked .rs-btn-toggle-inner {
+.rs-toggle.rs-toggle-checked .rs-toggle-presentation .rs-toggle-inner {
   margin-left: 24px;
   margin-right: 8px;
 }
-.rs-theme-high-contrast .rs-btn-toggle {
+.rs-toggle.rs-toggle-checked .rs-toggle-loader {
+  right: 100%;
+  margin-right: -21px;
+}
+.rs-toggle-input {
+  position: absolute;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  opacity: 0;
+}
+.rs-toggle-presentation {
+  position: relative;
+  display: inline-block;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  vertical-align: middle;
+  background-color: #d9d9d9;
+  background-color: var(--rs-toggle-bg);
+  color: #fff;
+  color: var(--rs-toggle-thumb);
+  cursor: pointer;
+  -webkit-transition: background-color 0.2s ease-in-out, width 0.2s ease-in-out;
+  transition: background-color 0.2s ease-in-out, width 0.2s ease-in-out;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+      -ms-user-select: none;
+          user-select: none;
+}
+.rs-theme-high-contrast .rs-toggle-presentation {
   -webkit-transition: none;
   transition: none;
   -webkit-box-shadow: inset 0 0 0 1px #fff;
@@ -14265,11 +14306,23 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
           box-shadow: inset 0 0 0 1px #fff;
           box-shadow: inset 0 0 0 1px var(--rs-toggle-thumb);
 }
-.rs-btn-toggle:hover {
+.rs-toggle-input:focus-visible + .rs-toggle-presentation {
+  -webkit-box-shadow: 0 0 0 3px rgba(52, 152, 255, 0.25);
+  -webkit-box-shadow: var(--rs-state-focus-shadow);
+          box-shadow: 0 0 0 3px rgba(52, 152, 255, 0.25);
+          box-shadow: var(--rs-state-focus-shadow);
+}
+.rs-theme-high-contrast .rs-toggle-input:focus-visible + .rs-toggle-presentation {
+  -webkit-box-shadow: inset 0 0 0 1px #fff, 0 0 0 3px rgba(52, 152, 255, 0.25);
+  -webkit-box-shadow: inset 0 0 0 1px var(--rs-toggle-thumb), var(--rs-state-focus-shadow);
+          box-shadow: inset 0 0 0 1px #fff, 0 0 0 3px rgba(52, 152, 255, 0.25);
+          box-shadow: inset 0 0 0 1px var(--rs-toggle-thumb), var(--rs-state-focus-shadow);
+}
+.rs-toggle-presentation:hover {
   background-color: #c5c6c7;
   background-color: var(--rs-toggle-hover-bg);
 }
-.rs-btn-toggle::after {
+.rs-toggle-presentation::after {
   content: '';
   cursor: pointer;
   position: absolute;
@@ -14277,11 +14330,11 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   -webkit-transition: right 0.2s ease-in-out, margin-right 0.2s ease-in-out, width 0.2s ease-in-out;
   transition: right 0.2s ease-in-out, margin-right 0.2s ease-in-out, width 0.2s ease-in-out;
 }
-.rs-theme-high-contrast .rs-btn-toggle::after {
+.rs-theme-high-contrast .rs-toggle-presentation::after {
   -webkit-transition: none;
   transition: none;
 }
-.rs-btn-toggle.rs-btn-toggle-disabled {
+.rs-toggle-disabled .rs-toggle-presentation {
   background-color: #f7f7fa;
   background-color: var(--rs-toggle-disabled-bg);
   color: #fff;
@@ -14292,7 +14345,7 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
           box-shadow: inset 0 0 0 1px var(--rs-toggle-disabled-thumb);
   cursor: not-allowed;
 }
-.rs-btn-toggle.rs-btn-toggle-checked {
+.rs-toggle-checked .rs-toggle-presentation {
   background-color: #3498ff;
   background-color: var(--rs-toggle-checked-bg);
   color: #fff;
@@ -14300,133 +14353,179 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   -webkit-box-shadow: none;
           box-shadow: none;
 }
-.rs-btn-toggle.rs-btn-toggle-checked:hover {
+.rs-toggle-checked .rs-toggle-presentation:hover {
   background-color: #2589f5;
   background-color: var(--rs-toggle-checked-hover-bg);
 }
-.rs-btn-toggle.rs-btn-toggle-disabled.rs-btn-toggle-checked {
+.rs-toggle-disabled.rs-toggle-checked .rs-toggle-presentation {
   background-color: #cce9ff;
   background-color: var(--rs-toggle-checked-disabled-bg);
   color: #fff;
   color: var(--rs-toggle-checked-disabled-thumb);
 }
-.rs-btn-toggle-inner {
+.rs-toggle-loading .rs-toggle-presentation::after {
+  display: none;
+}
+.rs-toggle-inner {
   display: block;
   -webkit-transition: margin 0.2s ease-in-out;
   transition: margin 0.2s ease-in-out;
 }
-.rs-theme-high-contrast .rs-btn-toggle-inner {
+.rs-theme-high-contrast .rs-toggle-inner {
   -webkit-transition: none;
   transition: none;
 }
-.rs-btn-toggle-sm {
+.rs-toggle-loader {
+  position: absolute;
+  -webkit-transition: right 0.2s ease-in-out, margin-right 0.2s ease-in-out, width 0.2s ease-in-out;
+  transition: right 0.2s ease-in-out, margin-right 0.2s ease-in-out, width 0.2s ease-in-out;
+}
+.rs-toggle-loader .rs-loader-spin::before {
+  border-color: rgba(247, 247, 250, 0.3);
+  border-color: var(--rs-toggle-loader-ring);
+}
+.rs-toggle-loader .rs-loader-spin::after {
+  border-top-color: #fff;
+  border-top-color: var(--rs-toggle-loader-rotor);
+}
+.rs-toggle-sm .rs-toggle-loader {
+  width: 10px;
+  height: 10px;
+  right: 2px;
+  top: 2px;
+}
+.rs-toggle-sm .rs-toggle-presentation {
   height: 14px;
   min-width: 26px;
   border-radius: 7px;
 }
-.rs-btn-toggle-sm::after {
+.rs-toggle-sm .rs-toggle-presentation::after {
   width: 10px;
   height: 10px;
   right: 2px;
   top: 2px;
   border-radius: 5px;
 }
-.rs-btn-toggle-sm:active::after {
+.rs-toggle-sm .rs-toggle-presentation:active::after {
   width: 12px;
 }
-.rs-btn-toggle-sm .rs-btn-toggle-inner {
+.rs-toggle-sm .rs-toggle-inner {
   margin-right: 14px;
   margin-left: 6px;
   height: 14px;
   line-height: 1.4;
   font-size: 10px;
 }
-.rs-btn-toggle-sm .rs-btn-toggle-inner .rs-icon {
+.rs-toggle-sm .rs-toggle-inner .rs-icon {
   font-size: 10px;
 }
-.rs-btn-toggle-sm.rs-btn-toggle-checked::after {
+.rs-toggle-sm.rs-toggle-checked .rs-toggle-presentation::after {
   right: 100%;
   margin-right: -12px;
 }
-.rs-btn-toggle-sm.rs-btn-toggle-checked:active::after {
+.rs-toggle-sm.rs-toggle-checked .rs-toggle-presentation:active::after {
   margin-right: -14px;
 }
-.rs-btn-toggle-sm.rs-btn-toggle-checked .rs-btn-toggle-inner {
+.rs-toggle-sm.rs-toggle-checked .rs-toggle-presentation .rs-toggle-inner {
   margin-left: 14px;
   margin-right: 6px;
 }
-.rs-btn-toggle-md {
+.rs-toggle-sm.rs-toggle-checked .rs-toggle-loader {
+  right: 100%;
+  margin-right: -12px;
+}
+.rs-toggle-md .rs-toggle-loader {
+  width: 18px;
+  height: 18px;
+  right: 3px;
+  top: 3px;
+}
+.rs-toggle-md .rs-toggle-presentation {
   height: 24px;
   min-width: 44px;
   border-radius: 12px;
 }
-.rs-btn-toggle-md::after {
+.rs-toggle-md .rs-toggle-presentation::after {
   width: 18px;
   height: 18px;
   right: 3px;
   top: 3px;
   border-radius: 9px;
 }
-.rs-btn-toggle-md:active::after {
+.rs-toggle-md .rs-toggle-presentation:active::after {
   width: 21.6px;
 }
-.rs-btn-toggle-md .rs-btn-toggle-inner {
+.rs-toggle-md .rs-toggle-inner {
   margin-right: 24px;
   margin-left: 8px;
   height: 24px;
   line-height: 2;
   font-size: 12px;
 }
-.rs-btn-toggle-md .rs-btn-toggle-inner .rs-icon {
+.rs-toggle-md .rs-toggle-inner .rs-icon {
   font-size: 12px;
 }
-.rs-btn-toggle-md.rs-btn-toggle-checked::after {
+.rs-toggle-md.rs-toggle-checked .rs-toggle-presentation::after {
   right: 100%;
   margin-right: -21px;
 }
-.rs-btn-toggle-md.rs-btn-toggle-checked:active::after {
+.rs-toggle-md.rs-toggle-checked .rs-toggle-presentation:active::after {
   margin-right: -24.6px;
 }
-.rs-btn-toggle-md.rs-btn-toggle-checked .rs-btn-toggle-inner {
+.rs-toggle-md.rs-toggle-checked .rs-toggle-presentation .rs-toggle-inner {
   margin-left: 24px;
   margin-right: 8px;
 }
-.rs-btn-toggle-lg {
+.rs-toggle-md.rs-toggle-checked .rs-toggle-loader {
+  right: 100%;
+  margin-right: -21px;
+}
+.rs-toggle-lg .rs-toggle-loader {
+  width: 22px;
+  height: 22px;
+  right: 4px;
+  top: 4px;
+}
+.rs-toggle-lg .rs-toggle-presentation {
   height: 30px;
   min-width: 55px;
   border-radius: 15px;
 }
-.rs-btn-toggle-lg::after {
+.rs-toggle-lg .rs-toggle-presentation::after {
   width: 22px;
   height: 22px;
   right: 4px;
   top: 4px;
   border-radius: 11px;
 }
-.rs-btn-toggle-lg:active::after {
+.rs-toggle-lg .rs-toggle-presentation:active::after {
   width: 26.4px;
 }
-.rs-btn-toggle-lg .rs-btn-toggle-inner {
+.rs-toggle-lg .rs-toggle-inner {
   margin-right: 30px;
   margin-left: 10px;
   height: 30px;
   line-height: 2.14285714;
   font-size: 14px;
 }
-.rs-btn-toggle-lg .rs-btn-toggle-inner .rs-icon {
+.rs-toggle-lg .rs-toggle-inner .rs-icon {
   font-size: 14px;
 }
-.rs-btn-toggle-lg.rs-btn-toggle-checked::after {
+.rs-toggle-lg.rs-toggle-checked .rs-toggle-presentation::after {
   right: 100%;
   margin-right: -26px;
 }
-.rs-btn-toggle-lg.rs-btn-toggle-checked:active::after {
+.rs-toggle-lg.rs-toggle-checked .rs-toggle-presentation:active::after {
   margin-right: -30.4px;
 }
-.rs-btn-toggle-lg.rs-btn-toggle-checked .rs-btn-toggle-inner {
+.rs-toggle-lg.rs-toggle-checked .rs-toggle-presentation .rs-toggle-inner {
   margin-left: 30px;
   margin-right: 10px;
 }
+.rs-toggle-lg.rs-toggle-checked .rs-toggle-loader {
+  right: 100%;
+  margin-right: -26px;
+}
 .rs-tooltip {
   position: absolute;
   z-index: 1070;
@@ -14930,9 +15029,6 @@ textarea.rs-picker-menu .rs-picker-search-bar .rs-picker-search-bar-input {
   position: absolute !important;
   clip: rect(1px 1px 1px 1px);
 }
-.rs-uploader-trigger-disabled {
-  opacity: 0.3;
-}
 .rs-uploader-trigger-disabled .rs-uploader-trigger-btn {
   cursor: not-allowed !important;
 }