v20.1.48 is released

Author: pipeline

controls/barcodegenerator/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@syncfusion/ej2-barcode-generator",
-	"version": "19.3.0",
+	"version": "20.1.47",
 	"description": "Barcode generator component is a pure JavaScript library which will convert a string to Barcode and show it to the user. This supports major 1D and 2D barcodes including coda bar, code 128, QR Code.",
 	"author": "Syncfusion Inc.",
 	"license": "SEE LICENSE IN license",

controls/barcodegenerator/themestudio/README.md

@@ -175,4 +175,4 @@ We are maintaining the all the control samples separated as individual control w
 </html>
 ```
 
-![html file](images/index-html.png)
+![html file](images/index-html.png)

controls/barcodegenerator/themestudio/styles/base/common/_core.scss

@@ -9,40 +9,8 @@
 
   $white: #fff;
   $background: #e82824;
-
-  .sf-license-warning {
-    background: $background;
-    color: $white;
-    font-family: 'Segoe UI';
-    font-size: medium;
-    left: 0;
-    line-height: 45px;
-    opacity: .75;
-    position: fixed;
-    right: 0;
-    text-align: center;
-    top: 0;
-    z-index: 999999999;
-  }
-
-  .sf-license-close-btn {
-    background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgaGVpZ2h0PSIyMCIgd2lkdGg9IjIwIiB2aWV3Qm94PSIwIDAgMjU2IDI1NiI+ICA8Zz4gICAgPHBhdGggaWQ9InBhdGgxIiB0cmFuc2Zvcm09InJvdGF0ZSgxLDEyOCwxMjgpIHRyYW5zbGF0ZSg1OS4wMTA3Nzk0NDEwNDU1LDU5KSBzY2FsZSg0LjMxMjUwMDI1NzA0NTA1LDQuMzEyNTAwMjU3MDQ1MDUpIiBmaWxsPSIjZmZmZmZmIiBkPSJNMjkuNTkwODE4LDBDMzAuMjA2OTYzLDAgMzAuODIzMjI3LDAuMjM0NDk5OTMgMzEuMjkyMjI5LDAuNzAzNDk5NzkgMzIuMjI5MjU2LDEuNjQwNTAwMSAzMi4yMjkyNTYsMy4xNjA1MDA1IDMxLjI5MjIyOSw0LjEwMDQ5OTJMMTkuMzk4MDAzLDE1Ljk5ODQ5OCAzMS4yOTIyMjksMjcuODkyNDk1QzMyLjIyOTI1NiwyOC44Mjk0OTkgMzIuMjI5MjU2LDMwLjM0OTQ5NiAzMS4yOTIyMjksMzEuMjk0NDk2IDMwLjM1NDIyNywzMi4yMzE1IDI4LjgyNzE2NCwzMi4yMzE1IDI3Ljg5MDEzOSwzMS4yOTQ0OTZMMTUuOTk3OTg4LDE5LjM5OTQ5OSA0LjEwNDc5OTIsMzEuMjk2NTAyQzMuMTY3NzczNCwzMi4yMzQ0OTggMS42Mzk3MzQ3LDMyLjIzNDQ5OCAwLjcwMjc2OTY5LDMxLjI5NjUwMiAtMC4yMzQyNTY1NiwzMC4zNTI1MDIgLTAuMjM0MjU2NTYsMjguODMyNDk4IDAuNzAyNzY5NjksMjcuODk0NTAyTDEyLjU5NjkzNCwxNS45OTg0OTggMC43MDI3Njk2OSw0LjEwMjQ5ODFDLTAuMjM0MjU2NTYsMy4xNjU0OTc4IC0wLjIzNDI1NjU2LDEuNjQ1NDk3MyAwLjcwMjc2OTY5LDAuNzA1NDk4NyAxLjYzOTczNDcsLTAuMjMxNTAxNTggMy4xNjc3NzM0LC0wLjIzMTUwMTU4IDQuMTA0Nzk5MiwwLjcwNTQ5ODdMMTUuOTk2OTUsMTIuNTk3NDk3IDI3Ljg5MDEzOSwwLjcwMzQ5OTc5QzI4LjM1ODY1LDAuMjM0NDk5OTMsMjguOTc0Njc0LDAsMjkuNTkwODE4LDB6IiAvPiAgPC9nPjwvc3ZnPg==');
-    cursor: pointer;
-    height: 20px;
-    margin-top: 14px;
-    padding-top: 10px;
-    position: absolute;
-    right: 20px;
-    width: 20px;
-  }
-
   $warning: #ffd800;
 
-  .sf-license-warning a,
-  .sf-license-warning a:hover {
-    color: $warning;
-  }
-
   .e-error {
     color: $error-font-color;
     font-family: $font-family;

controls/barcodegenerator/themestudio/styles/buttons/button/_mixin.scss

@@ -20,8 +20,10 @@
   background-color: $btn-active-bgcolor;
   border-color: $btn-active-border-color;
   color: $btn-active-color;
-  outline: $btn-active-outline;
-  outline-offset: $btn-active-outline-offset;
+  @if $skin-name != 'FluentUI' {
+    outline: $btn-active-outline;
+    outline-offset: $btn-active-outline-offset;
+  }
   @if $skin-name == 'bootstrap4' {
     $color-rgba: rgba(mix(lighten($btn-active-bgcolor, 50%), $btn-active-border-color, .15), .5);
     box-shadow: 0 0 0 .25em $color-rgba;
@@ -55,7 +57,9 @@
   background-color: $btn-primary-active-bgcolor;
   border-color: $btn-primary-active-border-color;
   color: $btn-primary-active-color;
-  outline: $btn-active-outline;
+  @if $skin-name != 'FluentUI' {
+    outline: $btn-active-outline;
+  }
   @if $skin-name == 'bootstrap4' {
     $color-rgba: rgba(mix(lighten($btn-primary-active-bgcolor, 50%), $btn-primary-active-border-color, .15), .5);
     box-shadow: 0 0 0 .25em $color-rgba;

controls/barcodegenerator/themestudio/styles/buttons/check-box/_fluent-definition.scss

@@ -2,14 +2,14 @@
 $cbox-bigger-check-fontsize: 18px !default;
 $cbox-bigger-font-size: 18px !default;
 $cbox-bigger-height: 24px !default;
-$cbox-bigger-indeterminate-fontsize: 16px !default;
+$cbox-bigger-indeterminate-fontsize: 18px !default;
 $cbox-bigger-indeterminate-lineheight: 23px !default;
 $cbox-bigger-lineheight: 23px !default;
 $cbox-bigger-margin: 12px !default;
 $cbox-bigger-small-check-fontsize: 16px !default;
 $cbox-bigger-small-font-size: 16px !default;
 $cbox-bigger-small-height: 22px !default;
-$cbox-bigger-small-indeterminate-fontsize: 10px !default;
+$cbox-bigger-small-indeterminate-fontsize: 16px !default;
 $cbox-bigger-small-indeterminate-lineheight: 21px !default;
 $cbox-bigger-small-lineheight: 21px !default;
 $cbox-bigger-small-width: 22px !default;
@@ -19,7 +19,7 @@ $cbox-font-size: 16px !default;
 $cbox-height: 20px !default;
 $cbox-border-radius: $inputs-radius !default;
 $cbox-check-fontsize: 16px !default;
-$cbox-indeterminate-fontsize: 14px !default;
+$cbox-indeterminate-fontsize: 16px !default;
 $cbox-indeterminate-lineheight: 18px !default;
 $cbox-lineheight: 18px !default;
 $cbox-margin: 8px !default;
@@ -39,9 +39,9 @@ $cbox-ripple-bigger-small-width: 38px !default;
 $cbox-small-check-fontsize: 10px !default;
 $cbox-small-font-size: 12px !default;
 $cbox-small-height: 16px !default;
-$cbox-small-indeterminate-fontsize: 8px !default;
+$cbox-small-indeterminate-fontsize: 10px !default;
 $cbox-small-indeterminate-lineheight: 16px !default;
-$cbox-small-lineheight: 16px !default;
+$cbox-small-lineheight: 14px !default;
 $cbox-small-width: 16px !default;
 $cbox-width: 20px !default;
 $cbox-focus-outline-offset: 0 !default;
@@ -86,3 +86,4 @@ $cbox-border-style: solid !default;
 //enddefault
 // fluent theme
 $cbox-check-content: '\e774' !default;
+$cbox-icon-color: $icon-color !default;

controls/barcodegenerator/themestudio/styles/buttons/check-box/_layout.scss

@@ -247,8 +247,10 @@
       width: $cbox-bigger-small-width;
 
       &:hover {
-        background-color: $cbox-hover-bgcolor;
-        border-color: $cbox-hover-border-color;
+        @if $skin-name != 'FluentUI' {
+          background-color: $cbox-hover-bgcolor;
+          border-color: $cbox-hover-border-color;
+        }
         @if $skin-name == 'FluentUI' {
           &:not(.e-check),
           &:not(.e-stop)::before {

controls/barcodegenerator/themestudio/styles/buttons/check-box/_theme.scss

@@ -97,6 +97,12 @@
           background-color: $cbox-hover-bgcolor;
           border-color: $cbox-hover-border-color;
           @if $skin-name == 'FluentUI' {
+            font-size: $cbox-check-fontsize;
+
+            &:not(.e-check):not(.e-stop) {
+              color: $cbox-icon-color;
+            }
+
             &:not(.e-check),
             &:not(.e-stop)::before {
               content: $cbox-check-content;
@@ -181,6 +187,57 @@
           }
         }
       }
+
+      .e-bigger .e-checkbox-wrapper,
+      .e-bigger.e-checkbox-wrapper,
+      .e-bigger .e-css.e-checkbox-wrapper,
+      .e-bigger.e-css.e-checkbox-wrapper {
+        &:hover {
+          & .e-frame {
+            @if $skin-name == 'FluentUI' {
+              font-size: $cbox-bigger-check-fontsize;
+
+              &:not(.e-check):not(.e-stop) {
+                color: $cbox-icon-color;
+              }
+            }
+          }
+        }
+      }
+
+      .e-small .e-checkbox-wrapper,
+      .e-small.e-checkbox-wrapper,
+      .e-small .e-css.e-checkbox-wrapper,
+      .e-small.e-css.e-checkbox-wrapper {
+        &:hover {
+          & .e-frame {
+            @if $skin-name == 'FluentUI' {
+              font-size: $cbox-small-check-fontsize;
+
+              &:not(.e-check):not(.e-stop) {
+                color: $cbox-icon-color;
+              }
+            }
+          }
+        }
+      }
+
+      .e-bigger.e-small .e-checkbox-wrapper,
+      .e-bigger.e-small.e-checkbox-wrapper,
+      .e-bigger.e-small .e-css.e-checkbox-wrapper,
+      .e-bigger.e-small.e-css.e-checkbox-wrapper {
+        &:hover {
+          & .e-frame {
+            @if $skin-name == 'FluentUI' {
+              font-size: $cbox-bigger-small-check-fontsize;
+
+              &:not(.e-check):not(.e-stop) {
+                color: $cbox-icon-color;
+              }
+            }
+          }
+        }
+      }
     }
   }
 }

controls/barcodegenerator/themestudio/styles/buttons/chips/_fluent-definition.scss

@@ -7,19 +7,19 @@ $chip-avatar-wrapper-border-radius: 0 !default;
 $chip-avatar-border-radius: 8px !default;
 $chip-leading-icon-border-radius: 50% !default;
 $chip-delete-icon-border-radius: 50% !default;
-$chip-padding: 0 8px !default;
+$chip-padding: 0 4px !default;
 $chip-margin: 4px !default;
 $chip-overflow: hidden !default;
 $chip-border-size: 1px !default;
 $chip-font-size: $text-sm !default;
 $chip-line-height: 22px !default;
 $chip-font-weight: 400 !default;
 $chip-avatar-size: 16px !default;
-$chip-avatar-margin: 0 3px 0 -8px !default;
+$chip-avatar-margin: 0 8px 0 0 !default;
 $chip-avatar-content-font-size: $text-xs !default;
 $chip-leading-icon-font-size: 12px !default;
 $chip-leading-icon-size: 16px !default;
-$chip-leading-icon-margin: 0 8px 0 -4px !default;
+$chip-leading-icon-margin: 0 8px 0 0 !default;
 $chip-multi-selection-icon-margin: 0 4px 0 -4px !default;
 $chip-multi-selection-icon-margin-top: 0 !default;
 $chip-delete-icon-font-size: 10px !default;
@@ -28,8 +28,8 @@ $chip-delete-icon-margin: 2px -4px 0 4px !default;
 
 //RTL
 $chip-rtl-avatar-wrapper-border-radius: 0 !default;
-$chip-rtl-avatar-margin: 0 -7px 0 3px !default;
-$chip-rtl-leading-icon-margin: 0 -4px 0 8px !default;
+$chip-rtl-avatar-margin: 0 0 0 8px !default;
+$chip-rtl-leading-icon-margin: 0 0 0 8px !default;
 $chip-rtl-delete-icon-margin: 0 4px 0 -4px !default;
 //Touch
 $chip-touch-border-radius: 0 !default;
@@ -40,20 +40,20 @@ $chip-touch-text-line-height: 27px !default;
 $chip-touch-text-height: 19px !default;
 $chip-touch-padding: 4px 12px !default;
 $chip-touch-avatar-size: 30px !default;
-$chip-touch-avatar-margin: 6px 4px 6px 4px !default;
+$chip-touch-avatar-margin: 0 8px 0 -4px !default;
 $chip-touch-avatar-content-font-size: $text-base !default;
 $chip-touch-leading-icon-font-size: 16px !default;
 $chip-touch-leading-icon-size: 20px !default;
-$chip-touch-leading-icon-margin: 0 8px 0 -4px !default;
+$chip-touch-leading-icon-margin: 0 8px 0  -4px !default;
 $chip-touch-multi-selection-icon-margin: 0 4px 0 -4px !default;
 $chip-touch-delete-icon-font-size: 12px !default;
 $chip-touch-delete-icon-size: 32px !default;
-$chip-touch-delete-icon-margin: 0 -4px 0 8px !default;
+$chip-touch-delete-icon-margin: 0 -4px 0 4px !default;
 //Touch-RTL
 $chip-touch-rtl-avatar-wrapper-border-radius: 0 !default;
-$chip-touch-rtl-avatar-margin: 0 -12px 0 8px !default;
+$chip-touch-rtl-avatar-margin: 0 -4px 0 8px !default;
 $chip-touch-rtl-leading-icon-margin: 0 -4px 0 8px !default;
-$chip-touch-rtl-delete-icon-margin: 0 8px 0 -4px !default;
+$chip-touch-rtl-delete-icon-margin: 0 0 0 -14px !default;
 
 $chip-text-height: 26px !default;
 

controls/barcodegenerator/themestudio/styles/buttons/radio-button/_fluent-definition.scss

@@ -56,8 +56,8 @@ $radio-btn-checked-ripple-bgcolor: transparent !default;
 $radio-btn-check-transition: none !default;
 $radio-btn-disabled-border-color: $border-dark !default;
 $radio-btn-disabled-checked-border-color: $border-dark !default;
-$radio-btn-disabled-background-color: $border-dark !default;
-$radio-btn-disabled-color: $content-bg-color !default;
+$radio-btn-disabled-background-color: transparent !default;
+$radio-btn-disabled-color: $content-text-color-disabled !default;
 $radio-btn-disabled-checked-color: $content-bg-color-alt6 !default;
 $radio-btn-font-color: $content-text-color !default;
 $radio-btn-focus-ripple-bgcolor: $black !default;

controls/barcodegenerator/themestudio/styles/buttons/radio-button/_highcontrast-definition.scss

@@ -16,7 +16,7 @@ $radio-btn-checked-color: $selection-bg !default;
 $radio-btn-checked-background-color: $radio-btn-background-color !default;
 $radio-btn-check-transition: none !default;
 $radio-btn-disabled-border-color: $disable !default;
-$radio-btn-disabled-color: $bg-base-0 !default;
+$radio-btn-disabled-color: $disable  !default;
 $radio-btn-disabled-checked-color: $disable !default;
 $radio-btn-disabled-checked-border-color: $radio-btn-disabled-border-color !default;
 $radio-btn-disabled-background-color: transparent !default;

controls/barcodegenerator/themestudio/styles/buttons/radio-button/_layout.scss

@@ -15,7 +15,7 @@
     position: absolute;
     width: 1px;
 
-    &:not(:checked):hover {
+    &:not(:checked):not(:disabled):hover {
       +label,
       +label.e-rtl,
       +label.e-right {
@@ -228,6 +228,16 @@
       }
     }
 
+    &:focus,
+    .e-focus {
+      +label,
+      & .e-label {
+        @if $skin-name == 'FluentUI' {
+          border: 1px solid $radio-btn-border-color;
+        }
+      }
+    }
+
     &:checked {
       +label {
         &::after {

controls/barcodegenerator/themestudio/styles/buttons/switch/_fluent-definition.scss

@@ -16,9 +16,9 @@ $switch-active-on-opacity: 1 !default;
 $switch-off-opacity: 1 !default;
 $switch-handle-height: 12px !default;
 $switch-handle-width: 12px !default;
-$switch-transition: all .2s ease-in-out .1s !default;
-$switch-inner-transition: all .2s ease-in-out !default;
-$switch-handle-transition: all .2s linear !default;
+$switch-transition: all .1s ease 0s !default;
+$switch-inner-transition: all .1s ease !default;
+$switch-handle-transition: all .1s linear !default;
 $switch-active-on-position-left: 0 !default;
 $switch-off-active-left: 100% !default;
 $switch-on-position-left: -100% !default;
@@ -99,9 +99,9 @@ $switch-on-off-disabled-bg-color-opacity: 1 !default;
 $switch-active-handle-bg: $primary-text-color !default;
 $switch-inner-border-style: 1px solid $border !default;
 $switch-inner-active: $primary !default;
-$switch-inner-active-bg: $primary-dark !default;
+$switch-inner-active-bg: $primary !default;
 $switch-focus-inner-box-shadow: $shadow-none !default;
-$switch-inner-active-border-color: $primary-dark !default;
+$switch-inner-active-border-color: $primary !default;
 $switch-active-background: transparent !default;
 $switch-handle-shadow: $shadow-none !default;
 $switch-handle-shadow-disabled: none !default;

controls/barcodegenerator/themestudio/styles/calendars/calendar/_bootstrap5-definition.scss

@@ -176,7 +176,7 @@ $calendar-active-bg-color: $primary-bg-color !default;
 $calendar-active-bg-box-shadow: inset 1px 0 $primary-bg-color, inset 0 1px $primary-bg-color, inset -1px 0 $primary-bg-color, inset 0 -1px $primary-bg-color !default;
 $calendar-active-bg-border-color: none !default;
 $calendar-active-hover-bg-color: darken($primary-bg-color, 10%) !default;
-$calendar-hover-color:  $content-bg-color-hover !default;
+$calendar-hover-color: $flyout-bg-color-hover !default;
 $calendar-text-color: $content-text-color !default;
 $calendar-hover-text: $calendar-text-color !default;
 $calendar-focus-bg-color: $content-bg-color-hover !default;

controls/barcodegenerator/themestudio/styles/calendars/calendar/_fluent-definition.scss

@@ -35,14 +35,14 @@ $calendar-icon-padding-top: 0 !default;
 $calendar-zero-value: 0 !default;
 $calendar-disable-opacity: 1 !default;
 //popup styles
-$calendar-normal-max-width: 220px !default;
-$calendar-normal-min-width: 222px !default;
+$calendar-normal-max-width: 229px !default;
+$calendar-normal-min-width: 229px !default;
 $calendar-small-max-width: 198px !default;
 $calendar-small-min-width: 198px !default;
-$calendar-bigger-max-width: 254px !default;
-$calendar-bigger-min-width: 256px !default;
-$calendar-weeknumber-min-width: 288px !default;
-$calendar-weeknumber-bigger-width: 325px !default;
+$calendar-bigger-max-width: 268px !default;
+$calendar-bigger-min-width: 268px !default;
+$calendar-weeknumber-min-width: 298px !default;
+$calendar-weeknumber-bigger-width: 335px !default;
 $calendar-popup-padding: 0 !default;
 $calendar-popup-bigger-padding: 0 !default;
 // today button
@@ -186,7 +186,7 @@ $calendar-hover-border-color: none !default;
 $calendar-disable-font-color: $flyout-text-color-disabled !default;
 $calendar-focused-date-bg-style: $content-bg-color-hover !default;
 $calendar-small-title-font-color: $content-text-color !default;
-$calendar-focused-state-box-shadow: 0 0 0 2px $border-alt !default;
+$calendar-focused-state-box-shadow: 0 0 0 1px $border-alt !default;
 $calendar-focused-state-border-radius: 4px !default;
 $calendar-focused-state-month-box-shadow: 0 0 0 1px $border-alt !default;
 // end td styles 

controls/barcodegenerator/themestudio/styles/calendars/calendar/_layout.scss

@@ -263,14 +263,10 @@
       height: $calendar-normal-year-decade-height;
       line-height: $calendar-normal-year-decade-height;
       width: $calendar-normal-year-decade-width;
-}#{if(&, '&', '*')} .e-content.e-year td.e-focused-date > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-decade td.e-focused-date > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-year td.e-selected > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-decade td.e-selected > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-year td.e-selected:hover > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-decade td.e-selected:hover > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-year td.e-focused-date:hover > span.e-day,
-    #{if(&, '&', '*')} .e-content.e-decade td.e-focused-date:hover > span.e-day {
+}#{if(&, '&', '*')} .e-content.e-year td.e-selected:not(.e-focused-date) > span.e-day,
+    #{if(&, '&', '*')} .e-content.e-decade td.e-selected:not(.e-focused-date) > span.e-day,
+    #{if(&, '&', '*')} .e-content.e-year td.e-selected:not(.e-focused-date):hover > span.e-day,
+    #{if(&, '&', '*')} .e-content.e-decade td.e-selected:not(.e-focused-date):hover > span.e-day {
       @if ($skin-name == 'FluentUI') {
         box-shadow: $calendar-none-style;
       }