@syncfusion/ej2-inputs 28.2.11 → 29.1.34

package/styles/slider/_bootstrap4-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 $slider-bg-color: $gray-800 !default;
 $slider-disabled-bg-color: $gray-500 !default;
 $slider-active-bg-color: $gray-500 !default;
@@ -127,8 +129,8 @@ $slider-tab-background: $primary !default;
 $slider-tab-border-color: $primary !default;
 $slider-tab-active-box-shadow: 0 0 0 1px $white, 0 0 0 3px rgba($primary, .25) !default;
 
-$slider-handle-active-bg-color: lighten($primary, 35%) !default;
-$slider-handle-active-border-color: lighten($primary, 35%) !default;
+$slider-handle-active-bg-color: color.adjust($primary, $lightness: 35%) !default;
+$slider-handle-active-border-color: color.adjust($primary, $lightness: 35%) !default;
 $slider-handle-active-box-shadow: 0 0 0 1px $white, 0 0 0 3px rgba($primary, .25) !default;
 
 $slider-button-hleft-bg-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAMAAABg3Am1AAAAolBMVEUAAAD////////////////////////+/v7////+/v7////+/v7////+/v7////////+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7////+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7+/v7///+y6E2hAAAANXRSTlMABAgMEBQYHCAkKCwwNEBESExUWFxkaGx0fICDh4ubn6Orr7O3u7/Hy8/T19vf4+fr7/P3+0e6nekAAAEFSURBVHjalZXJVgJBEASjnXHAEUQURZBFFAfZt+H/f82jedCXVpyjD1mvs4q/aR4uP1QJR7YUf1tgmYl/amEZXIRHLF31X7GUJ/E/fOB8I/46w5Hm4h9LLGPx63ssPQ08wNI+i/+GpdiLv/xH4IX4+waWqQa+w9LXwE9YOrX4ExzxCqzE3xVY3oMVGGrgHpYH9UdYWlqBuQ9cbLUCOY5UaeCS4INbPMVO19A1wdBVIli0CXhG+uIZYsui7uDJ1/Li0MRTHuXFKouOakZ0VMPwqLqBUckfiWzuTU7wNnwmgtdnDPFyxy7ouQ3hBeW50RW4SMSXrOdFg/chfCg8V1/RcjR+PXbfOBx/sErjBl8AAAAASUVORK5CYII=');

package/styles/slider/_fluent2-definition.scss

@@ -65,9 +65,9 @@ $tick-before-mobile-left: 2px !default;
 $tick-after-mobile-left: 18px !default;
 $largetick-before-mobile-height: 12px !default;
 $tick-before-mobile-top: -12px !default;
-$largetick-after-mobile-top: 8px !default;
+$largetick-after-mobile-top: 14px !default;
 $largetick-before-mobile-left: -2px !default;
-$tick-after-mobile-top: 4px !default;
+$tick-after-mobile-top: 14px !default;
 $slider-mobile-scale-font-size: $text-sm !default;
 $slider-button-horizon-mobile-padding: 0 36px !default;
 $slider-button-vertical-mobile-padding: 36px 0 !default;

package/styles/slider/_fusionnew-definition.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 // layout variables
 $slider-height: 4px !default;
 $slider-handle-height: 12px !default;
@@ -88,3 +90,4 @@ $slider-limit-bar-color: $overlay-bg-color !default;
 $slider-tick-font-color: $content-text-color-alt1 !default;
 $slider-hover-handle-color: $primary-bg-color-hover !default;
 $slider-hover-handle-border-color: $primary-border-color-hover !default;
+$slider-button-size: 20px !default;

package/styles/slider/_layout.scss

@@ -1,3 +1,5 @@
+@use 'sass:color';
+
 @mixin position($position, $top, $left) {
   position: $position;
   top: $top;
@@ -425,11 +427,11 @@
       &:not(.e-disabled) {
         .e-slider-button {
           &:hover {
-            @include bg-border(darken($gray-600, 7.5%), darken($gray-600, 10%));
+            @include bg-border(color.adjust($gray-600, $lightness: -7.5%), color.adjust($gray-600, $lightness: -10%));
           }
 
           &:active {
-            @include bg-border(darken($gray-600, 10%), darken($gray-600, 12%));
+            @include bg-border(color.adjust($gray-600, $lightness: -10%), color.adjust($gray-600, $lightness: -12%));
           }
         }
       }

package/styles/slider/bootstrap4.css

@@ -58,8 +58,8 @@
           transform: scale(1.5);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-handle-active {
-  background-color: #b3d7ff;
-  border-color: #b3d7ff;
+  background-color: rgb(178.5, 215.4, 255);
+  border-color: rgb(178.5, 215.4, 255);
   -webkit-box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(0, 123, 255, 0.25);
           box-shadow: 0 0 0 1px #fff, 0 0 0 3px rgba(0, 123, 255, 0.25);
 }
@@ -113,12 +113,12 @@
   border-color: #fff;
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled) .e-slider-button:hover {
-  background-color: #5a6268;
-  border-color: #545b62;
+  background-color: rgb(90.2703862661, 97.7929184549, 104.4796137339);
+  border-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled) .e-slider-button:active {
-  background-color: #545b62;
-  border-color: #50565c;
+  background-color: rgb(84.3605150215, 91.3905579399, 97.6394849785);
+  border-color: rgb(79.6326180258, 86.2686695279, 92.1673819742);
 }
 .e-control-wrapper.e-slider-container.e-horizontal {
   height: 48px;

package/styles/slider/bootstrap5-dark.css

@@ -59,7 +59,7 @@
           transform: scale(1.5);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
-  background-color: #0b5ed7;
+  background-color: rgb(11.05, 93.5, 215.05);
   border: 1px solid #212529;
   -webkit-box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.25);
           box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.25);
@@ -460,12 +460,12 @@
   border-color: transparent;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle:hover {
-  background-color: #0b5ed7;
-  border-color: #0a58ca;
+  background-color: rgb(11.05, 93.5, 215.05);
+  border-color: rgb(10.4, 88, 202.4);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle:active {
-  background-color: #0b5ed7;
-  border-color: #0a58ca;
+  background-color: rgb(11.05, 93.5, 215.05);
+  border-color: rgb(10.4, 88, 202.4);
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-slider-track {
   background-color: #343a40;

package/styles/slider/bootstrap5.css

@@ -59,7 +59,7 @@
           transform: scale(1.5);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
-  background-color: #0b5ed7;
+  background-color: rgb(11.05, 93.5, 215.05);
   border: 1px solid #fff;
   -webkit-box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.25);
           box-shadow: 0 0 0 4px rgba(13, 110, 253, 0.25);
@@ -460,12 +460,12 @@
   border-color: transparent;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle:hover {
-  background-color: #0b5ed7;
-  border-color: #0a58ca;
+  background-color: rgb(11.05, 93.5, 215.05);
+  border-color: rgb(10.4, 88, 202.4);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle:active {
-  background-color: #0b5ed7;
-  border-color: #0a58ca;
+  background-color: rgb(11.05, 93.5, 215.05);
+  border-color: rgb(10.4, 88, 202.4);
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-slider-track {
   background-color: #e9ecef;

package/styles/slider/fabric-dark.css

@@ -61,7 +61,7 @@
   border-color: #0074cc;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-tab-track {
-  background-color: rgba(173, 220, 255, 0.4);
+  background-color: hsla(205.8823529412, 100%, -4%, 0.4);
 }
 .e-control-wrapper.e-slider-container.e-rtl.e-horizontal .e-slider .e-handle {
   margin: 0 -8px 0 0;
@@ -450,7 +450,7 @@
   background-color: #9a9a9a;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-range.e-tab-range {
-  background-color: #006bbd;
+  background-color: rgb(0, 107.3, 188.7);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle {
   background-color: #c8c8c8;
@@ -462,7 +462,7 @@
   border-color: transparent;
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-slider-track {
-  background-color: rgba(173, 220, 255, 0.4);
+  background-color: hsla(205.8823529412, 100%, -4%, 0.4);
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-range {
   background-color: #0074cc;
@@ -474,10 +474,10 @@
   border-color: #0074cc;
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-range {
-  background-color: #006bbd;
+  background-color: rgb(0, 107.3, 188.7);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-slider-track {
-  background-color: rgba(173, 220, 255, 0.4);
+  background-color: hsla(205.8823529412, 100%, -4%, 0.4);
 }
 
 .e-bigger .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content {

package/styles/slider/fabric.css

@@ -61,7 +61,7 @@
   border-color: #0078d6;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-tab-track {
-  background-color: #b7e0ff;
+  background-color: rgb(183.4, 223.5495327103, 255);
 }
 .e-control-wrapper.e-slider-container.e-rtl.e-horizontal .e-slider .e-handle {
   margin: 0 -8px 0 0;
@@ -450,7 +450,7 @@
   background-color: #666;
 }
 .e-control-wrapper.e-slider-container .e-slider .e-range.e-tab-range {
-  background-color: #006fc7;
+  background-color: rgb(0, 111.4205607477, 198.7);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle {
   background-color: #fff;
@@ -462,10 +462,10 @@
   border-color: transparent;
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-slider-track {
-  background-color: #b7e0ff;
+  background-color: rgb(183.4, 223.5495327103, 255);
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-range {
-  background-color: #006fc7;
+  background-color: rgb(0, 111.4205607477, 198.7);
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-handle {
   border-color: #0078d6;
@@ -474,10 +474,10 @@
   border-color: #0078d6;
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-range {
-  background-color: #006fc7;
+  background-color: rgb(0, 111.4205607477, 198.7);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-slider-track {
-  background-color: #b7e0ff;
+  background-color: rgb(183.4, 223.5495327103, 255);
 }
 
 .e-bigger .e-slider-tooltip.e-tooltip-wrap.e-popup .e-tip-content {

package/styles/slider/fluent-dark.css

@@ -59,7 +59,7 @@
           transform: scale(1.5);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-tab-track {
   background-color: #005a9e;
@@ -479,10 +479,10 @@
   background-color: #0078d4;
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-range {
   background-color: #0078d4;

package/styles/slider/fluent.css

@@ -59,7 +59,7 @@
           transform: scale(1.5);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-handle.e-tab-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container .e-slider .e-tab-track {
   background-color: #c7e0f4;
@@ -479,10 +479,10 @@
   background-color: #0078d4;
 }
 .e-control-wrapper.e-slider-container.e-slider-hover .e-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-handle {
-  border-color: #006cbf;
+  border-color: rgb(0, 108, 190.8);
 }
 .e-control-wrapper.e-slider-container:not(.e-disabled):not(.e-read-only):active .e-range {
   background-color: #0078d4;

package/styles/slider/fluent2.css

@@ -576,12 +576,12 @@
 .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-after.e-scale.e-h-scale .e-tick,
 .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-after.e-scale.e-h-scale .e-tick {
   height: 8px;
-  top: 4px;
+  top: 14px;
 }
 .e-bigger .e-control-wrapper.e-slider-container.e-horizontal .e-tick-after.e-scale.e-h-scale .e-large,
 .e-control-wrapper.e-slider-container.e-bigger.e-horizontal .e-tick-after.e-scale.e-h-scale .e-large {
   height: 12px;
-  top: 8px;
+  top: 14px;
 }
 .e-bigger .e-control-wrapper.e-slider-container.e-vertical .e-tick-both.e-scale .e-tick,
 .e-control-wrapper.e-slider-container.e-bigger.e-vertical .e-tick-both.e-scale .e-tick {

package/styles/smart-textarea/tailwind-dark.css

@@ -42,7 +42,7 @@
   }
 }
 .smart-textarea-suggestion-overlay {
-  background-color: #232e3e;
+  background-color: rgb(27.323255814, 36.1372093023, 48.476744186);
   color: #fff;
   -webkit-box-shadow: 0 1.25px 4px 0 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
           box-shadow: 0 1.25px 4px 0 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

package/styles/speech-to-text/_all.scss

@@ -0,0 +1,2 @@
+@import 'layout.scss';
+@import 'theme.scss';

package/styles/speech-to-text/_bds-definition.scss

@@ -0,0 +1,25 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-focus-box-shadow: $stt-box-shadow, $shadow-focus-ring2 !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 16px !default;
+$stt-line-height: 24px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 13px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 40px !default;
+$stt-bigger-round-height: 40px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 18px !default;

package/styles/speech-to-text/_bigger.scss

@@ -0,0 +1,45 @@
+@include export-module('speechtotext-bigger') {
+  // Speechtotext component styles
+
+  .e-bigger .e-speech-to-text.e-btn,
+  .e-bigger.e-speech-to-text.e-btn {
+    align-items: center;
+    border-radius: $stt-bigger-border-radius;
+    display: inline-flex;
+    font-size: $stt-bigger-font-size;
+    min-width: $stt-bigger-min-width;
+    min-height: $stt-bigger-min-height;
+    padding: $stt-bigger-padding;
+    &.e-round {
+      width: $stt-bigger-round-width;
+      height: $stt-bigger-round-height;
+      padding: 0;
+    }
+    .e-btn-icon {
+      font-size: $stt-bigger-font-size;
+      @if ($skin-name == 'material' or $skin-name == 'material-dark' or $skin-name == 'material3') {
+        line-height: 1px;
+        width: 2em;
+      }
+      @if ($skin-name == 'bootstrap5.3' or $skin-name == 'fabric') {
+        margin-top: 1px;
+      }
+      @if ($skin-name == 'bootstrap5') {
+        margin-top: 0;
+      }
+      @if ($skin-name == 'FluentUI' or $skin-name == 'fabric-dark') {
+        margin-top: -1px;
+      }
+      @if ($skin-name == 'fluent2') {
+        margin-top: 2px;
+      }
+    }
+  }
+
+  .e-bigger .e-speech-to-text.e-round,
+  .e-bigger.e-speech-to-text.e-round {
+    .e-btn-icon {
+      font-size: $stt-bigger-btn-font-size;
+    }
+  }
+}

package/styles/speech-to-text/_bootstrap-dark-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 500 !default;
+$stt-font-size: 12px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 14px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 500 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;

package/styles/speech-to-text/_bootstrap-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 500 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 22px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 14px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 500 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 16px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;

package/styles/speech-to-text/_bootstrap4-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 400 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 22px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 500 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 24px !default;

package/styles/speech-to-text/_bootstrap5-dark-definition.scss

@@ -0,0 +1 @@
+@import './bootstrap5-definition.scss';

package/styles/speech-to-text/_bootstrap5-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 400 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 400 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 22px !default;

package/styles/speech-to-text/_bootstrap5.3-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 22px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 22px !default;

package/styles/speech-to-text/_fabric-dark-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 12px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 14px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;

package/styles/speech-to-text/_fabric-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;

package/styles/speech-to-text/_fluent-dark-definition.scss

@@ -0,0 +1 @@
+@import './fluent-definition.scss';

package/styles/speech-to-text/_fluent-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 12px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 14px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 22px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 18px !default;

package/styles/speech-to-text/_fluent2-definition.scss

@@ -0,0 +1,25 @@
+// Speechtotext component styles
+
+$stt-box-shadow: $shadow-xl !default;
+$stt-focus-box-shadow: $keyboard-focus !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 20px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 20px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 22px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;

package/styles/speech-to-text/_fusionnew-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, .2), 0 -2px 15px -3px rgba(0, 0, 0, .1), 0 6px 10px rgba(0, 0, 0, .14) !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 600 !default;
+$stt-font-size: 16px !default;
+$stt-line-height: 24px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 15px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 600 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 16px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 21px !default;

package/styles/speech-to-text/_highcontrast-definition.scss

@@ -0,0 +1,24 @@
+// Speechtotext component styles
+
+$stt-box-shadow: unset !default;
+$stt-border-radius: 9999px !default;
+$stt-font-weight: 400 !default;
+$stt-font-size: 14px !default;
+$stt-line-height: 18px !default;
+$stt-round-width: 40px !default;
+$stt-round-height: 40px !default;
+$stt-btn-font-size: 16px !default;
+$stt-min-height: 40px !default;
+$stt-min-width: 40px !default;
+$stt-padding: 0 16px !default;
+
+$stt-bigger-border-radius: $stt-border-radius !default;
+$stt-bigger-font-weight: 500 !default;
+$stt-bigger-font-size: 16px !default;
+$stt-bigger-line-height: 24px !default;
+$stt-bigger-round-width: 52px !default;
+$stt-bigger-round-height: 52px !default;
+$stt-bigger-btn-font-size: 20px !default;
+$stt-bigger-min-height: 52px !default;
+$stt-bigger-min-width: 52px !default;
+$stt-bigger-padding: 0 20px !default;