@syncfusion/ej2-splitbuttons 19.4.48 → 20.1.55

package/styles/drop-down-button/_bootstrap5-definition.scss

@@ -3,14 +3,14 @@ $drop-down-btn-arrow-content: '\e70d' !default;
 $drop-down-btn-vertical-btn-padding: 6px 12px !default;
 $drop-down-btn-vertical-bigger-padding: 8px 16px !default;
 $drop-down-btn-bigger-font-size: $text-base !default;
-$drop-down-btn-bigger-li-height: 36px !default;
+$drop-down-btn-bigger-li-height: 32px !default;
 $drop-down-btn-bigger-max-width: 202px !default;
 $drop-down-btn-bigger-min-width: 112px !default;
 $drop-down-btn-icon-font-size: 14px !default;
 $drop-down-btn-icon-margin-right: 11px !default;
 $drop-down-btn-bigger-icon-margin-right: 12px !default;
 $drop-down-btn-li-border-width: 1px !default;
-$drop-down-btn-li-height: 26px !default;
+$drop-down-btn-li-height: 30px !default;
 $drop-down-btn-li-padding: 0 12px !default;
 $drop-down-btn-bigger-li-padding: 0 16px !default;
 $drop-down-btn-small-li-padding: 0 8px !default;
@@ -21,14 +21,14 @@ $drop-down-btn-min-width: 120px !default;
 $drop-down-btn-seperator-padding: 3px 0 !default;
 $drop-down-btn-sub-ul-box-shadow: none !default;
 $drop-down-btn-ul-border-radius: 4px !default;
-$drop-down-btn-ul-padding: 6px 0 !default;
+$drop-down-btn-ul-padding: 4px 0 !default;
 $drop-down-btn-ul-bigger-padding: 8px 0 !default;
 $drop-down-btn-ul-small-padding: 4px 0 !default;
 $drop-down-btn-caret-icon-font-size: 10px !default;
 $drop-down-btn-icon-font-size-bigger: 16px !default;
 $drop-down-btn-caret-icon-font-size-bigger: 12px !default;
 $drop-down-btn-box-shadow: $secondary-shadow-focus !default;
-$drop-down-btn-popup-margin-top: 4px !default;
+$drop-down-btn-popup-margin-top: 2px !default;
 $drop-down-btn-bigger-popup-margin-top: 4px !default;
 $drop-down-btn-ul-border: 1px solid $border-light !default;
 $drop-down-btn-li-box-shadow: none !default;

package/styles/drop-down-button/_fluent-dark-definition.scss

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

package/styles/drop-down-button/_fluent-definition.scss

@@ -21,9 +21,9 @@ $drop-down-btn-min-width: 120px !default;
 $drop-down-btn-seperator-padding: 3px 0 !default;
 $drop-down-btn-sub-ul-box-shadow: none !default;
 $drop-down-btn-ul-border-radius: 2px !default;
-$drop-down-btn-ul-padding: 6px 0 !default;
-$drop-down-btn-ul-bigger-padding: 8px 0 !default;
-$drop-down-btn-ul-small-padding: 4px 0 !default;
+$drop-down-btn-ul-padding: 0 0 !default;
+$drop-down-btn-ul-bigger-padding: 0 0 !default;
+$drop-down-btn-ul-small-padding: 0 0 !default;
 $drop-down-btn-caret-icon-font-size: 16px !default;
 $drop-down-btn-icon-font-size-bigger: 16px !default;
 $drop-down-btn-caret-icon-font-size-bigger: 20px !default;
@@ -46,7 +46,7 @@ $drop-down-btn-parent-ul-box-shadow: $shadow-md !default;
 $drop-down-btn-li-focus-bgcolor: $flyout-bg-color-focus !default;
 $drop-down-btn-li-selection-bgcolor: $flyout-bg-color-selected !default;
 $drop-down-btn-li-selection-font-color: $flyout-text-color-selected !default;
-$drop-down-btn-menu-icon-color: $primary-outline !default;
-$drop-down-btn-menu-icon-disabled-color: $primary-outline !default;
+$drop-down-btn-menu-icon-color: $icon-color !default;
+$drop-down-btn-menu-icon-disabled-color: $icon-color !default;
 $drop-down-btn-li-hover-bgcolor: $flyout-bg-color-hover !default;
 

package/styles/drop-down-button/_layout.scss

@@ -15,7 +15,7 @@
   }
 
     &:focus {
-      @if $skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark' {
+      @if $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
         box-shadow: $drop-down-btn-box-shadow;
       }
       @else {

package/styles/drop-down-button/_tailwind-definition.scss

@@ -7,10 +7,10 @@ $drop-down-btn-bigger-li-height: 36px !default;
 $drop-down-btn-bigger-max-width: 202px !default;
 $drop-down-btn-bigger-min-width: 112px !default;
 $drop-down-btn-icon-font-size: 14px !default;
-$drop-down-btn-icon-margin-right: 11px !default;
+$drop-down-btn-icon-margin-right: 12px !default;
 $drop-down-btn-bigger-icon-margin-right: 12px !default;
 $drop-down-btn-li-border-width: 1px !default;
-$drop-down-btn-li-height: 28px !default;
+$drop-down-btn-li-height: 30px !default;
 $drop-down-btn-li-padding: 0 12px !default;
 $drop-down-btn-bigger-li-padding: 0 16px !default;
 $drop-down-btn-small-li-padding: 0 8px !default;
@@ -21,8 +21,8 @@ $drop-down-btn-min-width: 120px !default;
 $drop-down-btn-seperator-padding: 3px 0 !default;
 $drop-down-btn-sub-ul-box-shadow: none !default;
 $drop-down-btn-ul-border-radius: 4px !default;
-$drop-down-btn-ul-padding: 6px 0 !default;
-$drop-down-btn-ul-bigger-padding: 8px 0 !default;
+$drop-down-btn-ul-padding: 4px 0 !default;
+$drop-down-btn-ul-bigger-padding: 4px 0 !default;
 $drop-down-btn-ul-small-padding: 4px 0 !default;
 $drop-down-btn-caret-icon-font-size: 18px !default;
 $drop-down-btn-icon-font-size-bigger: 16px !default;

package/styles/drop-down-button/bootstrap-dark.css

@@ -1,6 +1,6 @@
 .e-dropdown-btn .e-caret::before,
 .e-dropdown-btn.e-btn .e-caret::before {
-  content: '\e969';
+  content: "\e969";
 }
 
 /*! drop-down button layout */
@@ -10,53 +10,43 @@
   text-transform: none;
   white-space: normal;
 }
-
 .e-dropdown-btn:hover,
 .e-dropdown-btn.e-btn:hover {
   box-shadow: none;
 }
-
 .e-dropdown-btn:focus,
 .e-dropdown-btn.e-btn:focus {
   box-shadow: none;
 }
-
 .e-dropdown-btn:active,
 .e-dropdown-btn.e-btn:active {
   box-shadow: inset 0 4px 5px rgba(26, 26, 26, 0.4);
 }
-
 .e-dropdown-btn .e-btn-icon,
 .e-dropdown-btn.e-btn .e-btn-icon {
   font-size: 14px;
 }
-
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 8px;
 }
-
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {
   line-height: 1;
   padding: 6px 12px;
 }
-
 .e-dropdown-btn.e-caret-hide .e-caret,
 .e-dropdown-btn.e-btn.e-caret-hide .e-caret {
   display: none;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul {
   padding: 5px 0;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul .e-item,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul .e-item {
   padding: 0 14px;
 }
-
 .e-dropdown-btn.e-small.e-vertical,
 .e-dropdown-btn.e-btn.e-small.e-vertical {
   line-height: 1;
@@ -67,18 +57,15 @@
 .e-bigger.e-dropdown-btn .e-btn-icon {
   font-size: 16px;
 }
-
 .e-bigger .e-dropdown-btn .e-caret,
 .e-bigger.e-dropdown-btn .e-caret {
   font-size: 10px;
 }
-
 .e-bigger .e-dropdown-btn.e-vertical,
 .e-bigger.e-dropdown-btn.e-vertical {
   line-height: 1;
   padding: 8px 16px;
 }
-
 .e-bigger .e-dropdown-btn.e-small.e-vertical,
 .e-bigger.e-dropdown-btn.e-small.e-vertical {
   line-height: 1;
@@ -88,7 +75,6 @@
 .e-dropdown-popup {
   position: absolute;
 }
-
 .e-dropdown-popup ul {
   border: 1px solid #414141;
   border-radius: 4px;
@@ -108,7 +94,6 @@
           user-select: none;
   white-space: nowrap;
 }
-
 .e-dropdown-popup ul .e-item {
   cursor: pointer;
   display: -ms-flexbox;
@@ -117,18 +102,15 @@
   line-height: 26px;
   padding: 0 14px;
 }
-
 .e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   display: block;
   padding: 0 14px;
   text-decoration: none;
   width: 100%;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   float: left;
   font-size: 16px;
@@ -137,12 +119,10 @@
   vertical-align: middle;
   width: 1em;
 }
-
 .e-dropdown-popup ul .e-item.e-disabled {
   cursor: auto;
   pointer-events: none;
 }
-
 .e-dropdown-popup ul .e-item.e-separator {
   border-bottom-style: solid;
   border-bottom-width: 1px;
@@ -152,12 +132,10 @@
   margin: 3px 0;
   pointer-events: none;
 }
-
 .e-dropdown-popup.e-transparent {
   background: transparent;
   box-shadow: none;
 }
-
 .e-dropdown-popup.e-transparent .e-dropdown-menu {
   border: 0;
   height: 1px;
@@ -180,25 +158,21 @@
   min-width: 112px;
   padding: 5px 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item,
 *.e-bigger.e-dropdown-popup ul .e-item {
   height: 40px;
   line-height: 40px;
   padding: 0 14px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-url,
 *.e-bigger.e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item .e-menu-icon,
 *.e-bigger.e-dropdown-popup ul .e-item .e-menu-icon {
   font-size: 16px;
   line-height: 40px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-separator,
 *.e-bigger.e-dropdown-popup ul .e-item.e-separator {
   height: auto;
@@ -210,38 +184,30 @@
   background-color: #2a2a2a;
   color: #f0f0f0;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   color: #f0f0f0;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   color: #f0f0f0;
 }
-
 .e-dropdown-popup ul .e-item.e-focused {
   background-color: transparent;
   box-shadow: inset 0 0 0 1px #585858;
 }
-
 .e-dropdown-popup ul .e-item:hover {
   background-color: #414141;
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
   background-color: #0070f0;
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-icon, .e-dropdown-popup ul .e-item.e-selected .e-menu-icon {
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-separator {
   border-bottom-color: #414141;
-}
+}

package/styles/drop-down-button/bootstrap.css

@@ -1,6 +1,6 @@
 .e-dropdown-btn .e-caret::before,
 .e-dropdown-btn.e-btn .e-caret::before {
-  content: '\e969';
+  content: "\e969";
 }
 
 /*! drop-down button layout */
@@ -10,53 +10,43 @@
   text-transform: none;
   white-space: normal;
 }
-
 .e-dropdown-btn:hover,
 .e-dropdown-btn.e-btn:hover {
   box-shadow: none;
 }
-
 .e-dropdown-btn:focus,
 .e-dropdown-btn.e-btn:focus {
   box-shadow: none;
 }
-
 .e-dropdown-btn:active,
 .e-dropdown-btn.e-btn:active {
   box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
 }
-
 .e-dropdown-btn .e-btn-icon,
 .e-dropdown-btn.e-btn .e-btn-icon {
   font-size: 14px;
 }
-
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 8px;
 }
-
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {
   line-height: 1;
   padding: 6px 12px;
 }
-
 .e-dropdown-btn.e-caret-hide .e-caret,
 .e-dropdown-btn.e-btn.e-caret-hide .e-caret {
   display: none;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul {
   padding: 5px 0;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul .e-item,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul .e-item {
   padding: 0 14px;
 }
-
 .e-dropdown-btn.e-small.e-vertical,
 .e-dropdown-btn.e-btn.e-small.e-vertical {
   line-height: 1;
@@ -67,18 +57,15 @@
 .e-bigger.e-dropdown-btn .e-btn-icon {
   font-size: 16px;
 }
-
 .e-bigger .e-dropdown-btn .e-caret,
 .e-bigger.e-dropdown-btn .e-caret {
   font-size: 10px;
 }
-
 .e-bigger .e-dropdown-btn.e-vertical,
 .e-bigger.e-dropdown-btn.e-vertical {
   line-height: 1;
   padding: 8px 16px;
 }
-
 .e-bigger .e-dropdown-btn.e-small.e-vertical,
 .e-bigger.e-dropdown-btn.e-small.e-vertical {
   line-height: 1;
@@ -88,7 +75,6 @@
 .e-dropdown-popup {
   position: absolute;
 }
-
 .e-dropdown-popup ul {
   border: 1px solid #ccc;
   border-radius: 4px;
@@ -108,7 +94,6 @@
           user-select: none;
   white-space: nowrap;
 }
-
 .e-dropdown-popup ul .e-item {
   cursor: pointer;
   display: -ms-flexbox;
@@ -117,18 +102,15 @@
   line-height: 26px;
   padding: 0 14px;
 }
-
 .e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   display: block;
   padding: 0 14px;
   text-decoration: none;
   width: 100%;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   float: left;
   font-size: 16px;
@@ -137,12 +119,10 @@
   vertical-align: middle;
   width: 1em;
 }
-
 .e-dropdown-popup ul .e-item.e-disabled {
   cursor: auto;
   pointer-events: none;
 }
-
 .e-dropdown-popup ul .e-item.e-separator {
   border-bottom-style: solid;
   border-bottom-width: 1px;
@@ -152,12 +132,10 @@
   margin: 3px 0;
   pointer-events: none;
 }
-
 .e-dropdown-popup.e-transparent {
   background: transparent;
   box-shadow: none;
 }
-
 .e-dropdown-popup.e-transparent .e-dropdown-menu {
   border: 0;
   height: 1px;
@@ -180,25 +158,21 @@
   min-width: 112px;
   padding: 5px 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item,
 *.e-bigger.e-dropdown-popup ul .e-item {
   height: 40px;
   line-height: 40px;
   padding: 0 14px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-url,
 *.e-bigger.e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item .e-menu-icon,
 *.e-bigger.e-dropdown-popup ul .e-item .e-menu-icon {
   font-size: 16px;
   line-height: 40px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-separator,
 *.e-bigger.e-dropdown-popup ul .e-item.e-separator {
   height: auto;
@@ -210,38 +184,30 @@
   background-color: #fff;
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item.e-focused {
   background-color: transparent;
   box-shadow: 0 0 0 1px #8c8c8c inset;
 }
-
 .e-dropdown-popup ul .e-item:hover {
   background-color: #e6e6e6;
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
   background-color: #e6e6e6;
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
   color: #333;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-icon, .e-dropdown-popup ul .e-item.e-selected .e-menu-icon {
   color: #333;
 }
-
 .e-dropdown-popup ul .e-separator {
   border-bottom-color: #e6e6e6;
-}
+}

package/styles/drop-down-button/bootstrap4.css

@@ -1,6 +1,6 @@
 .e-dropdown-btn .e-caret::before,
 .e-dropdown-btn.e-btn .e-caret::before {
-  content: '\e744';
+  content: "\e744";
 }
 
 /*! drop-down button layout */
@@ -9,48 +9,39 @@
   text-transform: none;
   white-space: normal;
 }
-
 .e-dropdown-btn:focus,
 .e-dropdown-btn.e-btn:focus {
   box-shadow: none;
 }
-
 .e-dropdown-btn:active,
 .e-dropdown-btn.e-btn:active {
-  box-shadow: 0 0 0 0.2rem rgba(79, 85, 91, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(78, 85, 91, 0.5);
 }
-
 .e-dropdown-btn .e-btn-icon,
 .e-dropdown-btn.e-btn .e-btn-icon {
   font-size: 14px;
 }
-
 .e-dropdown-btn .e-caret,
 .e-dropdown-btn.e-btn .e-caret {
   font-size: 8px;
 }
-
 .e-dropdown-btn.e-vertical,
 .e-dropdown-btn.e-btn.e-vertical {
   line-height: 1;
   padding: 6px 12px;
 }
-
 .e-dropdown-btn.e-caret-hide .e-caret,
 .e-dropdown-btn.e-btn.e-caret-hide .e-caret {
   display: none;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul {
   padding: 4px 0;
 }
-
 .e-dropdown-btn.e-small .e-dropdown-popup ul .e-item,
 .e-dropdown-btn.e-btn.e-small .e-dropdown-popup ul .e-item {
   padding: 0 16px;
 }
-
 .e-dropdown-btn.e-small.e-vertical,
 .e-dropdown-btn.e-btn.e-small.e-vertical {
   line-height: 1;
@@ -61,18 +52,15 @@
 .e-bigger.e-dropdown-btn .e-btn-icon {
   font-size: 16px;
 }
-
 .e-bigger .e-dropdown-btn .e-caret,
 .e-bigger.e-dropdown-btn .e-caret {
   font-size: 10px;
 }
-
 .e-bigger .e-dropdown-btn.e-vertical,
 .e-bigger.e-dropdown-btn.e-vertical {
   line-height: 1;
   padding: 8px 16px;
 }
-
 .e-bigger .e-dropdown-btn.e-small.e-vertical,
 .e-bigger.e-dropdown-btn.e-small.e-vertical {
   line-height: 1;
@@ -82,7 +70,6 @@
 .e-dropdown-popup {
   position: absolute;
 }
-
 .e-dropdown-popup ul {
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 4px;
@@ -102,7 +89,6 @@
           user-select: none;
   white-space: nowrap;
 }
-
 .e-dropdown-popup ul .e-item {
   cursor: pointer;
   display: -ms-flexbox;
@@ -111,18 +97,15 @@
   line-height: 26px;
   padding: 0 20px;
 }
-
 .e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   display: block;
   padding: 0 20px;
   text-decoration: none;
   width: 100%;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   float: left;
   font-size: 16px;
@@ -131,12 +114,10 @@
   vertical-align: middle;
   width: 1em;
 }
-
 .e-dropdown-popup ul .e-item.e-disabled {
   cursor: auto;
   pointer-events: none;
 }
-
 .e-dropdown-popup ul .e-item.e-separator {
   border-bottom-style: solid;
   border-bottom-width: 1px;
@@ -146,12 +127,10 @@
   margin: 3px 0;
   pointer-events: none;
 }
-
 .e-dropdown-popup.e-transparent {
   background: transparent;
   box-shadow: none;
 }
-
 .e-dropdown-popup.e-transparent .e-dropdown-menu {
   border: 0;
   height: 1px;
@@ -174,25 +153,21 @@
   min-width: 112px;
   padding: 8px 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item,
 *.e-bigger.e-dropdown-popup ul .e-item {
   height: 32px;
   line-height: 32px;
   padding: 0 24px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-url,
 *.e-bigger.e-dropdown-popup ul .e-item.e-url {
   padding: 0;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item .e-menu-icon,
 *.e-bigger.e-dropdown-popup ul .e-item .e-menu-icon {
   font-size: 16px;
   line-height: 32px;
 }
-
 *.e-bigger .e-dropdown-popup ul .e-item.e-separator,
 *.e-bigger.e-dropdown-popup ul .e-item.e-separator {
   height: auto;
@@ -204,38 +179,30 @@
   background-color: #fff;
   color: #212529;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-url {
   color: #212529;
 }
-
 .e-dropdown-popup ul .e-item .e-menu-icon {
   color: #212529;
 }
-
 .e-dropdown-popup ul .e-item.e-focused {
   background-color: #f2f4f6;
   box-shadow: none;
 }
-
 .e-dropdown-popup ul .e-item:hover {
   background-color: #f2f4f6;
   color: #212529;
 }
-
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
   background-color: #007bff;
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-item:active .e-menu-icon, .e-dropdown-popup ul .e-item.e-selected .e-menu-icon {
   color: #fff;
 }
-
 .e-dropdown-popup ul .e-separator {
   border-bottom-color: #6c757d;
-}
+}