amis 2.0.0-rc.15 → 2.0.0-rc.16

package/lib/themes/antd.css

@@ -6305,8 +6305,27 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-onDisabled-bgColor: #ccc;
   --Switch-onDisabled-circle-BackgroundColor: var(--white);
   --Switch-onDisabled-color: #fff;
+  --Switch-onHover-bgColor: var(--Switch-bgColor);
   --Switch-valueColor: var(--white);
   --Switch-width: 3.125rem;
+  --Switch-slider-margin: 0.0625rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: margin-left var(--animation-duration);
+  --Switch-text-marginRight: 0.5rem;
+  --Switch-text-marginLeft: 1.5625rem;
+  --Switch-width--sm: 1.75rem;
+  --Switch-height--sm: 1rem;
+  --Switch-slider-width--sm: calc(
+    var(--Switch-height--sm) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-text-marginRight--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginRight) / 2
+  );
+  --Switch-text-marginLeft--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginLeft) / 2
+  );
   --Table--unsaved-heading-bg: #e8f0fe;
   --Table--unsaved-heading-color: #4285f4;
   --Table-bg: var(--background);
@@ -22016,12 +22035,13 @@ input.antd-TextControl-input-password {
   opacity: 0.4;
 }
 .antd-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 var(--Switch-text-marginRight) 0 var(--Switch-text-marginLeft);
   color: var(--Switch-valueColor);
   text-indent: var(--gap-xs);
   text-transform: uppercase;
   font-size: var(--fontSizeSm);
   line-height: var(--Switch-height);
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all var(--animation-duration);
@@ -22035,24 +22055,27 @@ input.antd-TextControl-input-password {
   content: "";
   position: absolute;
   background: var(--white);
-  width: calc(var(--Switch-height) - 0.125rem);
-  top: 0.0625rem;
-  bottom: 0.0625rem;
-  left: 0.0625rem;
+  width: var(--Switch-slider-width);
+  top: var(--Switch-slider-margin);
+  bottom: var(--Switch-slider-margin);
+  left: var(--Switch-slider-margin);
   border-radius: 50%;
-  transition: margin-left var(--animation-duration);
+  transition: var(--Switch-slider-transition);
+}
+.antd-Switch:hover {
+  background: var(--Switch-onHover-bgColor);
 }
 .antd-Switch.is-checked {
   background: var(--Switch-onActive-bgColor);
 }
 .antd-Switch.is-checked .slider::before {
   left: auto;
-  right: 0.0625rem;
+  right: var(--Switch-slider-margin);
   border-width: 0;
 }
 .antd-Switch.is-checked .text {
   color: var(--white);
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 var(--Switch-text-marginLeft) 0 var(--Switch-text-marginRight);
 }
 .antd-Switch.is-checked.is-disabled .slider:before {
   color: var(--Switch-onDisabled-color);
@@ -22064,6 +22087,26 @@ input.antd-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.antd-Switch--sm {
+  height: var(--Switch-height--sm);
+  min-width: var(--Switch-width--sm);
+}
+.antd-Switch--sm .text {
+  line-height: var(--Switch-height--sm);
+  margin: 0 var(--Switch-text-marginRight--sm) 0 var(--Switch-text-marginLeft--sm);
+}
+.antd-Switch--sm .text > svg {
+  margin-top: calc((var(--Switch-height--sm) - var(--fontSizeSm)) / 2);
+}
+.antd-Switch--sm .slider::before {
+  width: var(--Switch-slider-width--sm);
+}
+.antd-Switch--sm.is-checked .slider::before {
+  right: var(--Switch-slider-margin);
+}
+.antd-Switch--sm.is-checked .text {
+  margin: 0 var(--Switch-text-marginLeft--sm) 0 var(--Switch-text-marginRight--sm);
+}
 .antd-Switch-option {
   vertical-align: middle;
   margin-left: var(--Switch-gap);

package/lib/themes/cxd-ie11.css

@@ -20541,12 +20541,13 @@ input.cxd-TextControl-input-password {
   opacity: 0.4;
 }
 .cxd-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 0.5rem 0 1.5625rem;
   color: #ffffff;
   text-indent: 0.25rem;
   text-transform: uppercase;
   font-size: 12px;
   line-height: 1.25rem;
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all 0.2s;
@@ -20560,24 +20561,29 @@ input.cxd-TextControl-input-password {
   content: "";
   position: absolute;
   background: #fff;
-  width: calc(1.25rem - 0.125rem);
-  top: 0.0625rem;
-  bottom: 0.0625rem;
-  left: 0.0625rem;
+  width: calc(
+    1.25rem - 0.125rem * 2
+  );
+  top: 0.125rem;
+  bottom: 0.125rem;
+  left: 0.125rem;
   border-radius: 50%;
-  transition: margin-left 0.2s;
+  transition: all 0.5s ease;
 }
-.cxd-Switch.is-checked {
+.cxd-Switch:hover {
   background: #b8babf;
 }
+.cxd-Switch.is-checked {
+  background: #2468f2;
+}
 .cxd-Switch.is-checked .slider::before {
   left: auto;
-  right: 0.0625rem;
+  right: 0.125rem;
   border-width: 0;
 }
 .cxd-Switch.is-checked .text {
   color: #fff;
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 1.5625rem 0 0.5rem;
 }
 .cxd-Switch.is-checked.is-disabled .slider:before {
   color: #ffffff;
@@ -20589,6 +20595,36 @@ input.cxd-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.cxd-Switch--sm {
+  height: 1rem;
+  min-width: 1.75rem;
+}
+.cxd-Switch--sm .text {
+  line-height: 1rem;
+  margin: 0 calc(
+    0.125rem * 2 + 0.5rem / 2
+  ) 0 calc(
+    0.125rem * 2 + 1.5625rem / 2
+  );
+}
+.cxd-Switch--sm .text > svg {
+  margin-top: calc((1rem - 12px) / 2);
+}
+.cxd-Switch--sm .slider::before {
+  width: calc(
+    1rem - 0.125rem * 2
+  );
+}
+.cxd-Switch--sm.is-checked .slider::before {
+  right: 0.125rem;
+}
+.cxd-Switch--sm.is-checked .text {
+  margin: 0 calc(
+    0.125rem * 2 + 1.5625rem / 2
+  ) 0 calc(
+    0.125rem * 2 + 0.5rem / 2
+  );
+}
 .cxd-Switch-option {
   vertical-align: middle;
   margin-left: 0.5rem;
@@ -27455,34 +27491,12 @@ td.rdtQuarter.rdtDisabled:hover {
 .AMISDebug-logLine {
   overflow-x: hidden;
 }
-.cxd-Switch .text {
-  margin: 0 0.5rem 0 1.5625rem;
-  vertical-align: super;
-}
-.cxd-Switch .slider:before {
-  width: calc(1.25rem - 0.25rem);
-  top: 0.125rem;
-  bottom: 0.125rem;
-  left: 0.125rem;
-  transition: all 0.5s ease;
-}
 .cxd-Switch:active .slider::before {
-  width: calc(1.25rem + 0.125rem);
+  width: calc(calc(
+    1.25rem - 0.125rem * 2
+  ) + 0.125rem * 2);
   border-radius: 10px;
 }
-.cxd-Switch:hover {
-  background: #b8babf;
-}
-.cxd-Switch.is-checked {
-  background: #2468f2;
-}
-.cxd-Switch.is-checked .slider::before {
-  right: auto;
-  left: calc( 100% - (1.25rem - 0.25rem) - 0.125rem );
-}
-.cxd-Switch.is-checked .text {
-  margin: 0 1.5625rem 0 0.5rem;
-}
 .cxd-Switch.is-checked:hover {
   background: #144bcc;
 }
@@ -27490,7 +27504,13 @@ td.rdtQuarter.rdtDisabled:hover {
   background: #144bcc;
 }
 .cxd-Switch.is-checked:active .slider::before {
-  left: calc( 100% - (1.25rem + 0.125rem) - 0.125rem );
+  right: calc(0.125rem * 2);
+}
+.cxd-Switch--sm:active .slider::before {
+  width: calc( calc(
+    1rem - 0.125rem * 2
+  ) + 0.125rem * 2 );
+  border-radius: 10px;
 }
 .cxd-TextControl-sugs {
   border-radius: 0.1875rem;

package/lib/themes/cxd.css

@@ -6302,8 +6302,27 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-onDisabled-bgColor: #ccc;
   --Switch-onDisabled-circle-BackgroundColor: var(--white);
   --Switch-onDisabled-color: #fff;
+  --Switch-onHover-bgColor: var(--Switch-bgColor);
   --Switch-valueColor: var(--white);
   --Switch-width: 3.125rem;
+  --Switch-slider-margin: 0.0625rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: margin-left var(--animation-duration);
+  --Switch-text-marginRight: 0.5rem;
+  --Switch-text-marginLeft: 1.5625rem;
+  --Switch-width--sm: 1.75rem;
+  --Switch-height--sm: 1rem;
+  --Switch-slider-width--sm: calc(
+    var(--Switch-height--sm) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-text-marginRight--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginRight) / 2
+  );
+  --Switch-text-marginLeft--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginLeft) / 2
+  );
   --Table--unsaved-heading-bg: #e8f0fe;
   --Table--unsaved-heading-color: #4285f4;
   --Table-bg: var(--background);
@@ -6833,13 +6852,18 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-width: 2.75rem;
   --Switch-valueColor: #ffffff;
   --Switch-bgColor: #d4d6d9;
-  --Switch-onActive-bgColor: #b8babf;
+  --Switch-onActive-bgColor: var(--primary);
   --Switch-onHover-bgColor: #b8babf;
-  --Switch-checked-bgColor: var(--primary);
   --Switch-checked-onHover-bgColor: #144bcc;
   --Switch-checked-onActive-bgColor: #144bcc;
   --Switch-onDisabled-bgColor: #d4e5ff;
   --Switch-onDisabled-color: #ffffff;
+  --Switch-slider-margin: 0.125rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: all 0.5s ease;
+  --Switch-text-margin: 0 px2rem(8px) 0 px2rem(25px);
   --Calendar-icon-bottom: -0.25rem;
   --Calendar-icon-width: 0.625rem;
   --Calendar-icon-height: 0.625rem;
@@ -22405,12 +22429,13 @@ input.cxd-TextControl-input-password {
   opacity: 0.4;
 }
 .cxd-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 var(--Switch-text-marginRight) 0 var(--Switch-text-marginLeft);
   color: var(--Switch-valueColor);
   text-indent: var(--gap-xs);
   text-transform: uppercase;
   font-size: var(--fontSizeSm);
   line-height: var(--Switch-height);
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all var(--animation-duration);
@@ -22424,24 +22449,27 @@ input.cxd-TextControl-input-password {
   content: "";
   position: absolute;
   background: var(--white);
-  width: calc(var(--Switch-height) - 0.125rem);
-  top: 0.0625rem;
-  bottom: 0.0625rem;
-  left: 0.0625rem;
+  width: var(--Switch-slider-width);
+  top: var(--Switch-slider-margin);
+  bottom: var(--Switch-slider-margin);
+  left: var(--Switch-slider-margin);
   border-radius: 50%;
-  transition: margin-left var(--animation-duration);
+  transition: var(--Switch-slider-transition);
+}
+.cxd-Switch:hover {
+  background: var(--Switch-onHover-bgColor);
 }
 .cxd-Switch.is-checked {
   background: var(--Switch-onActive-bgColor);
 }
 .cxd-Switch.is-checked .slider::before {
   left: auto;
-  right: 0.0625rem;
+  right: var(--Switch-slider-margin);
   border-width: 0;
 }
 .cxd-Switch.is-checked .text {
   color: var(--white);
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 var(--Switch-text-marginLeft) 0 var(--Switch-text-marginRight);
 }
 .cxd-Switch.is-checked.is-disabled .slider:before {
   color: var(--Switch-onDisabled-color);
@@ -22453,6 +22481,26 @@ input.cxd-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.cxd-Switch--sm {
+  height: var(--Switch-height--sm);
+  min-width: var(--Switch-width--sm);
+}
+.cxd-Switch--sm .text {
+  line-height: var(--Switch-height--sm);
+  margin: 0 var(--Switch-text-marginRight--sm) 0 var(--Switch-text-marginLeft--sm);
+}
+.cxd-Switch--sm .text > svg {
+  margin-top: calc((var(--Switch-height--sm) - var(--fontSizeSm)) / 2);
+}
+.cxd-Switch--sm .slider::before {
+  width: var(--Switch-slider-width--sm);
+}
+.cxd-Switch--sm.is-checked .slider::before {
+  right: var(--Switch-slider-margin);
+}
+.cxd-Switch--sm.is-checked .text {
+  margin: 0 var(--Switch-text-marginLeft--sm) 0 var(--Switch-text-marginRight--sm);
+}
 .cxd-Switch-option {
   vertical-align: middle;
   margin-left: var(--Switch-gap);
@@ -29173,34 +29221,10 @@ td.rdtQuarter.rdtDisabled:hover {
 .AMISDebug-logLine {
   overflow-x: hidden;
 }
-.cxd-Switch .text {
-  margin: 0 0.5rem 0 1.5625rem;
-  vertical-align: super;
-}
-.cxd-Switch .slider:before {
-  width: calc(var(--Switch-height) - 0.25rem);
-  top: 0.125rem;
-  bottom: 0.125rem;
-  left: 0.125rem;
-  transition: all 0.5s ease;
-}
 .cxd-Switch:active .slider::before {
-  width: calc(var(--Switch-height) + 0.125rem);
+  width: calc(var(--Switch-slider-width) + var(--Switch-slider-margin) * 2);
   border-radius: 10px;
 }
-.cxd-Switch:hover {
-  background: var(--Switch-onHover-bgColor);
-}
-.cxd-Switch.is-checked {
-  background: var(--Switch-checked-bgColor);
-}
-.cxd-Switch.is-checked .slider::before {
-  right: auto;
-  left: calc( 100% - (var(--Switch-height) - 0.25rem) - 0.125rem );
-}
-.cxd-Switch.is-checked .text {
-  margin: 0 1.5625rem 0 0.5rem;
-}
 .cxd-Switch.is-checked:hover {
   background: var(--Switch-checked-onHover-bgColor);
 }
@@ -29208,7 +29232,11 @@ td.rdtQuarter.rdtDisabled:hover {
   background: var(--Switch-checked-onActive-bgColor);
 }
 .cxd-Switch.is-checked:active .slider::before {
-  left: calc( 100% - (var(--Switch-height) + 0.125rem) - 0.125rem );
+  right: calc(var(--Switch-slider-margin) * 2);
+}
+.cxd-Switch--sm:active .slider::before {
+  width: calc( var(--Switch-slider-width--sm) + var(--Switch-slider-margin) * 2 );
+  border-radius: 10px;
 }
 .cxd-TextControl-sugs {
   border-radius: 0.1875rem;

package/lib/themes/dark-ie11.css

@@ -20565,12 +20565,13 @@ input.dark-TextControl-input-password {
   opacity: 0.4;
 }
 .dark-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 0.5rem 0 1.5625rem;
   color: #fff;
   text-indent: 0.25rem;
   text-transform: uppercase;
   font-size: 0.75rem;
   line-height: 1.375rem;
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all 0.2s;
@@ -20584,13 +20585,18 @@ input.dark-TextControl-input-password {
   content: "";
   position: absolute;
   background: #fff;
-  width: calc(1.375rem - 0.125rem);
+  width: calc(
+    1.375rem - 0.0625rem * 2
+  );
   top: 0.0625rem;
   bottom: 0.0625rem;
   left: 0.0625rem;
   border-radius: 50%;
   transition: margin-left 0.2s;
 }
+.dark-Switch:hover {
+  background: #4b5563;
+}
 .dark-Switch.is-checked {
   background: #2296f3;
 }
@@ -20601,7 +20607,7 @@ input.dark-TextControl-input-password {
 }
 .dark-Switch.is-checked .text {
   color: #fff;
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 1.5625rem 0 0.5rem;
 }
 .dark-Switch.is-checked.is-disabled .slider:before {
   color: #fff;
@@ -20613,6 +20619,36 @@ input.dark-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.dark-Switch--sm {
+  height: 1rem;
+  min-width: 1.75rem;
+}
+.dark-Switch--sm .text {
+  line-height: 1rem;
+  margin: 0 calc(
+    0.0625rem * 2 + 0.5rem / 2
+  ) 0 calc(
+    0.0625rem * 2 + 1.5625rem / 2
+  );
+}
+.dark-Switch--sm .text > svg {
+  margin-top: calc((1rem - 0.75rem) / 2);
+}
+.dark-Switch--sm .slider::before {
+  width: calc(
+    1rem - 0.0625rem * 2
+  );
+}
+.dark-Switch--sm.is-checked .slider::before {
+  right: 0.0625rem;
+}
+.dark-Switch--sm.is-checked .text {
+  margin: 0 calc(
+    0.0625rem * 2 + 1.5625rem / 2
+  ) 0 calc(
+    0.0625rem * 2 + 0.5rem / 2
+  );
+}
 .dark-Switch-option {
   vertical-align: middle;
   margin-left: 0.5rem;

package/lib/themes/dark.css

@@ -6302,8 +6302,27 @@ body.video-react-full-window .video-react-fullscreen {
   --Switch-onDisabled-bgColor: #ccc;
   --Switch-onDisabled-circle-BackgroundColor: var(--white);
   --Switch-onDisabled-color: #fff;
+  --Switch-onHover-bgColor: var(--Switch-bgColor);
   --Switch-valueColor: var(--white);
   --Switch-width: 3.125rem;
+  --Switch-slider-margin: 0.0625rem;
+  --Switch-slider-width: calc(
+    var(--Switch-height) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-slider-transition: margin-left var(--animation-duration);
+  --Switch-text-marginRight: 0.5rem;
+  --Switch-text-marginLeft: 1.5625rem;
+  --Switch-width--sm: 1.75rem;
+  --Switch-height--sm: 1rem;
+  --Switch-slider-width--sm: calc(
+    var(--Switch-height--sm) - var(--Switch-slider-margin) * 2
+  );
+  --Switch-text-marginRight--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginRight) / 2
+  );
+  --Switch-text-marginLeft--sm: calc(
+    var(--Switch-slider-margin) * 2 + var(--Switch-text-marginLeft) / 2
+  );
   --Table--unsaved-heading-bg: #e8f0fe;
   --Table--unsaved-heading-color: #4285f4;
   --Table-bg: var(--background);
@@ -21996,12 +22015,13 @@ input.dark-TextControl-input-password {
   opacity: 0.4;
 }
 .dark-Switch .text {
-  margin: 0 0.4375rem 0 1.5625rem;
+  margin: 0 var(--Switch-text-marginRight) 0 var(--Switch-text-marginLeft);
   color: var(--Switch-valueColor);
   text-indent: var(--gap-xs);
   text-transform: uppercase;
   font-size: var(--fontSizeSm);
   line-height: var(--Switch-height);
+  vertical-align: super;
   font-style: normal;
   font-weight: bold;
   transition: all var(--animation-duration);
@@ -22015,24 +22035,27 @@ input.dark-TextControl-input-password {
   content: "";
   position: absolute;
   background: var(--white);
-  width: calc(var(--Switch-height) - 0.125rem);
-  top: 0.0625rem;
-  bottom: 0.0625rem;
-  left: 0.0625rem;
+  width: var(--Switch-slider-width);
+  top: var(--Switch-slider-margin);
+  bottom: var(--Switch-slider-margin);
+  left: var(--Switch-slider-margin);
   border-radius: 50%;
-  transition: margin-left var(--animation-duration);
+  transition: var(--Switch-slider-transition);
+}
+.dark-Switch:hover {
+  background: var(--Switch-onHover-bgColor);
 }
 .dark-Switch.is-checked {
   background: var(--Switch-onActive-bgColor);
 }
 .dark-Switch.is-checked .slider::before {
   left: auto;
-  right: 0.0625rem;
+  right: var(--Switch-slider-margin);
   border-width: 0;
 }
 .dark-Switch.is-checked .text {
   color: var(--white);
-  margin: 0 1.5625rem 0 0.4375rem;
+  margin: 0 var(--Switch-text-marginLeft) 0 var(--Switch-text-marginRight);
 }
 .dark-Switch.is-checked.is-disabled .slider:before {
   color: var(--Switch-onDisabled-color);
@@ -22044,6 +22067,26 @@ input.dark-TextControl-input-password {
   position: absolute;
   opacity: 0;
 }
+.dark-Switch--sm {
+  height: var(--Switch-height--sm);
+  min-width: var(--Switch-width--sm);
+}
+.dark-Switch--sm .text {
+  line-height: var(--Switch-height--sm);
+  margin: 0 var(--Switch-text-marginRight--sm) 0 var(--Switch-text-marginLeft--sm);
+}
+.dark-Switch--sm .text > svg {
+  margin-top: calc((var(--Switch-height--sm) - var(--fontSizeSm)) / 2);
+}
+.dark-Switch--sm .slider::before {
+  width: var(--Switch-slider-width--sm);
+}
+.dark-Switch--sm.is-checked .slider::before {
+  right: var(--Switch-slider-margin);
+}
+.dark-Switch--sm.is-checked .text {
+  margin: 0 var(--Switch-text-marginLeft--sm) 0 var(--Switch-text-marginRight--sm);
+}
 .dark-Switch-option {
   vertical-align: middle;
   margin-left: var(--Switch-gap);