@syncfusion/ej2-angular-splitbuttons 20.1.55 → 20.2.36

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

@@ -0,0 +1,57 @@
+@include export-module('drop-down-button-theme') {
+  /*! drop-down button theme */
+  .e-dropdown-popup {
+    background-color: $drop-down-btn-ul-bgcolor;
+    color: $drop-down-btn-color;
+
+    & ul {
+      & .e-item  {
+        & .e-menu-url {
+          color: $drop-down-btn-color;
+        }
+
+        & .e-menu-icon {
+          color: $drop-down-btn-menu-icon-color;
+        }
+
+        &.e-focused {
+          background-color: $drop-down-btn-li-focus-bgcolor;
+          box-shadow: $drop-down-btn-li-box-shadow;
+        }
+
+        &:hover {
+          @if $skin-name == 'bootstrap5' {
+            background-color: $drop-down-btn-li-hover-bgcolor;
+          }
+          @else {
+            background-color: $drop-down-btn-li-bgcolor;
+          }
+          color: $drop-down-btn-li-selection-font-color;
+        }
+
+        &:active,
+        &.e-selected {
+          background-color: $drop-down-btn-li-selection-bgcolor;
+          color: $drop-down-btn-selected-color;
+
+          & .e-menu-url {
+            color: $drop-down-btn-selected-color;
+          }
+
+          & .e-menu-icon {
+            @if $skin-name == 'FluentUI' or $theme-name == 'FluentUI' {
+              color: $drop-down-btn-menu-icon-color;
+            }
+            @else {
+              color: $drop-down-btn-selected-color;
+            }
+          }
+        }
+      }
+
+      & .e-separator {
+        border-bottom-color: $drop-down-btn-li-border-color;
+      }
+    }
+  }
+}

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/bootstrap-dark.scss';
+@import 'ej2-base/styles/bootstrap-dark-definition.scss';
+@import 'ej2-buttons/styles/button/bootstrap-dark-definition.scss';
+@import 'ej2-popups/styles/popup/bootstrap-dark-definition.scss';
+@import 'bootstrap-dark-definition.scss';
+@import 'icons/bootstrap-dark.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/bootstrap.scss';
+@import 'ej2-base/styles/bootstrap-definition.scss';
+@import 'ej2-buttons/styles/button/bootstrap-definition.scss';
+@import 'ej2-popups/styles/popup/bootstrap-definition.scss';
+@import 'bootstrap-definition.scss';
+@import 'icons/bootstrap.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/bootstrap4.scss';
+@import 'ej2-base/styles/bootstrap4-definition.scss';
+@import 'ej2-buttons/styles/button/bootstrap4-definition.scss';
+@import 'ej2-popups/styles/popup/bootstrap4-definition.scss';
+@import 'bootstrap4-definition.scss';
+@import 'icons/bootstrap4.scss';
+@import 'all.scss';

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

@@ -69,6 +69,7 @@
 
 .e-dropdown-popup {
   position: absolute;
+  border-radius: 4px;
   margin-top: 2px;
 }
 .e-dropdown-popup ul {
@@ -148,6 +149,7 @@
 
 *.e-bigger .e-dropdown-popup {
   background-color: transparent;
+  border-radius: 4px;
 }
 
 *.e-bigger .e-dropdown-popup ul,

package/styles/drop-down-button/bootstrap5-dark.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/bootstrap5-dark.scss';
+@import 'ej2-base/styles/bootstrap5-dark-definition.scss';
+@import 'ej2-buttons/styles/button/bootstrap5-dark-definition.scss';
+@import 'ej2-popups/styles/popup/bootstrap5-dark-definition.scss';
+@import 'bootstrap5-dark-definition.scss';
+@import 'icons/bootstrap5-dark.scss';
+@import 'all.scss';

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

@@ -69,6 +69,7 @@
 
 .e-dropdown-popup {
   position: absolute;
+  border-radius: 4px;
   margin-top: 2px;
 }
 .e-dropdown-popup ul {
@@ -148,6 +149,7 @@
 
 *.e-bigger .e-dropdown-popup {
   background-color: transparent;
+  border-radius: 4px;
 }
 
 *.e-bigger .e-dropdown-popup ul,

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/bootstrap5.scss';
+@import 'ej2-base/styles/bootstrap5-definition.scss';
+@import 'ej2-buttons/styles/button/bootstrap5-definition.scss';
+@import 'ej2-popups/styles/popup/bootstrap5-definition.scss';
+@import 'bootstrap5-definition.scss';
+@import 'icons/bootstrap5.scss';
+@import 'all.scss';

package/styles/drop-down-button/fabric-dark.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/fabric-dark.scss';
+@import 'ej2-base/styles/fabric-dark-definition.scss';
+@import 'ej2-buttons/styles/button/fabric-dark-definition.scss';
+@import 'ej2-popups/styles/popup/fabric-dark-definition.scss';
+@import 'fabric-dark-definition.scss';
+@import 'icons/fabric-dark.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/fabric.scss';
+@import 'ej2-base/styles/fabric-definition.scss';
+@import 'ej2-buttons/styles/button/fabric-definition.scss';
+@import 'ej2-popups/styles/popup/fabric-definition.scss';
+@import 'fabric-definition.scss';
+@import 'icons/fabric.scss';
+@import 'all.scss';

package/styles/drop-down-button/fluent-dark.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/fluent-dark.scss';
+@import 'ej2-base/styles/fluent-dark-definition.scss';
+@import 'ej2-buttons/styles/button/fluent-dark-definition.scss';
+@import 'ej2-popups/styles/popup/fluent-dark-definition.scss';
+@import 'fluent-dark-definition.scss';
+@import 'icons/fluent-dark.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/fluent.scss';
+@import 'ej2-base/styles/fluent-definition.scss';
+@import 'ej2-buttons/styles/button/fluent-definition.scss';
+@import 'ej2-popups/styles/popup/fluent-definition.scss';
+@import 'fluent-definition.scss';
+@import 'icons/fluent.scss';
+@import 'all.scss';

package/styles/drop-down-button/highcontrast-light.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/highcontrast-light.scss';
+@import 'ej2-base/styles/highcontrast-light-definition.scss';
+@import 'ej2-buttons/styles/button/highcontrast-light-definition.scss';
+@import 'ej2-popups/styles/popup/highcontrast-light-definition.scss';
+@import 'highcontrast-light-definition.scss';
+@import 'icons/highcontrast-light.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/highcontrast.scss';
+@import 'ej2-base/styles/highcontrast-definition.scss';
+@import 'ej2-buttons/styles/button/highcontrast-definition.scss';
+@import 'ej2-popups/styles/popup/highcontrast-definition.scss';
+@import 'highcontrast-definition.scss';
+@import 'icons/highcontrast.scss';
+@import 'all.scss';

package/styles/drop-down-button/icons/_bootstrap-dark.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-bootstrap-dark-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e969';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_bootstrap.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-bootstrap-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e969';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_bootstrap4.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-bootstrap4-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e744';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_bootstrap5-dark.scss

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

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

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-bootstrap5-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e70d';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_fabric-dark.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-fabric-dark-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e36a';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_fabric.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-fabric-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e36a';
+      }
+    }
+  }
+}

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

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

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

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-fluent-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e729';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_fusionnew.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-fusionnew-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e70d';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_highcontrast-light.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-highcontrast-light-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e966';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_highcontrast.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-highcontrast-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e966';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_material-dark.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-material-dark-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e969';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_material.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-material-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e969';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_material3.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-material3-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e70d';
+      }
+    }
+  }
+}

package/styles/drop-down-button/icons/_tailwind-dark.scss

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-tailwind-dark-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e70d';
+      }
+    }
+  }
+}

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

@@ -0,0 +1,10 @@
+@include export-module('drop-down-button-tailwind-icons') {
+  .e-dropdown-btn,
+  .e-dropdown-btn.e-btn {
+    .e-caret {
+      &::before {
+        content: '\e729';
+      }
+    }
+  }
+}

package/styles/drop-down-button/material-dark.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/material-dark.scss';
+@import 'ej2-base/styles/material-dark-definition.scss';
+@import 'ej2-buttons/styles/button/material-dark-definition.scss';
+@import 'ej2-popups/styles/popup/material-dark-definition.scss';
+@import 'material-dark-definition.scss';
+@import 'icons/material-dark.scss';
+@import 'all.scss';

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/material.scss';
+@import 'ej2-base/styles/material-definition.scss';
+@import 'ej2-buttons/styles/button/material-definition.scss';
+@import 'ej2-popups/styles/popup/material-definition.scss';
+@import 'material-definition.scss';
+@import 'icons/material.scss';
+@import 'all.scss';

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

@@ -75,6 +75,7 @@
 
 .e-dropdown-popup {
   position: absolute;
+  border-radius: 4px;
   margin-top: 4px;
 }
 .e-dropdown-popup ul {
@@ -154,6 +155,7 @@
 
 *.e-bigger .e-dropdown-popup {
   background-color: transparent;
+  border-radius: 4px;
 }
 
 *.e-bigger .e-dropdown-popup ul,

package/styles/drop-down-button/tailwind-dark.scss

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/tailwind-dark.scss';
+@import 'ej2-base/styles/tailwind-dark-definition.scss';
+@import 'ej2-buttons/styles/button/tailwind-dark-definition.scss';
+@import 'ej2-popups/styles/popup/tailwind-dark-definition.scss';
+@import 'tailwind-dark-definition.scss';
+@import 'icons/tailwind-dark.scss';
+@import 'all.scss';

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

@@ -75,6 +75,7 @@
 
 .e-dropdown-popup {
   position: absolute;
+  border-radius: 4px;
   margin-top: 4px;
 }
 .e-dropdown-popup ul {
@@ -154,6 +155,7 @@
 
 *.e-bigger .e-dropdown-popup {
   background-color: transparent;
+  border-radius: 4px;
 }
 
 *.e-bigger .e-dropdown-popup ul,

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

@@ -1 +1,6 @@
-@import 'ej2-splitbuttons/styles/drop-down-button/tailwind.scss';
+@import 'ej2-base/styles/tailwind-definition.scss';
+@import 'ej2-buttons/styles/button/tailwind-definition.scss';
+@import 'ej2-popups/styles/popup/tailwind-definition.scss';
+@import 'tailwind-definition.scss';
+@import 'icons/tailwind.scss';
+@import 'all.scss';

package/styles/fabric-dark.css

@@ -531,14 +531,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/fabric.css

@@ -528,14 +528,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/fluent-dark.css

@@ -519,14 +519,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;
@@ -1755,7 +1747,7 @@
 }
 
 .e-progress {
-  background-color: rgba(161, 159, 157, 0.2);
+  background-color: rgba(161, 159, 157, 0.5);
 }
 
 *.e-primary .e-progress,

package/styles/fluent.css

@@ -519,14 +519,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;
@@ -1755,7 +1747,7 @@
 }
 
 .e-progress {
-  background-color: rgba(96, 94, 92, 0.2);
+  background-color: rgba(96, 94, 92, 0.5);
 }
 
 *.e-primary .e-progress,

package/styles/highcontrast-light.css

@@ -531,14 +531,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/highcontrast.css

@@ -531,14 +531,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/material-dark.css

@@ -532,14 +532,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/material.css

@@ -529,14 +529,6 @@
       flex-direction: row;
   position: relative;
 }
-*.e-btn-group input:focus + label.e-btn,
-*.e-btn-group .e-btn:focus,
-*.e-btn-group .e-btn:hover,
-*.e-css.e-btn-group input:focus + label.e-btn,
-*.e-css.e-btn-group .e-btn:focus,
-*.e-css.e-btn-group .e-btn:hover {
-  z-index: 2;
-}
 *.e-btn-group input + label.e-btn,
 *.e-css.e-btn-group input + label.e-btn {
   margin-bottom: 0;

package/styles/progress-button/_all.scss

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

package/styles/progress-button/_bootstrap-dark-definition.scss

@@ -0,0 +1,26 @@
+//default
+$progress-btn-color: $grey-light-font !default;
+$progress-btn-bgcolor: rgba($grey-light-font, .3) !default;
+$progress-btn-bgcolor-normal: rgba($grey-light-font, .2) !default;
+$progress-btn-warning-progress-color: $progress-btn-bgcolor !default;
+$progress-btn-circle-opacity: 1 !default;
+
+$progress-btn-transition: all .3s linear !default;
+
+$progress-btn-spin-btn-padding: 16px !default;
+$progress-btn-small-spin-btn-padding: 14px !default;
+$progress-btn-bigger-spin-btn-padding: 20px !default;
+$progress-btn-bigger-small-spin-btn-padding: 16px !default;
+
+$progress-btn-spinner-padding: 12px !default;
+$progress-btn-spinner-padding-small: 10px !default;
+$progress-btn-spinner-padding-bigger: 14px !default;
+$progress-btn-spinner-padding-bigger-small: 12px !default;
+
+$progress-btn-flat-primary-progress-color: #ff4081 !default;
+$progress-btn-flat-success-progress-color: #4d841d !default;
+$progress-btn-flat-info-progress-color: #0378d5 !default;
+$progress-btn-flat-warning-progress-color: #c15700 !default;
+$progress-btn-flat-danger-progress-color: #d64113 !default;
+$btn-flat-primary-path-arc: none;
+//enddefault

package/styles/progress-button/_bootstrap-definition.scss

@@ -0,0 +1,24 @@
+$progress-btn-color: $grey-light-font !default;
+$progress-btn-bgcolor: rgba($grey-white, .3) !default;
+$progress-btn-bgcolor-normal: rgba($grey-base, .2) !default;
+$progress-btn-warning-progress-color: $progress-btn-bgcolor !default;
+$progress-btn-circle-opacity: 1 !default;
+
+$progress-btn-transition: all .3s linear !default;
+
+$progress-btn-spinner-padding: 12px !default;
+$progress-btn-spinner-padding-small: 10px !default;
+$progress-btn-spinner-padding-bigger: 14px !default;
+$progress-btn-spinner-padding-bigger-small: 12px !default;
+
+$progress-btn-spin-btn-padding: 16px !default;
+$progress-btn-small-spin-btn-padding: 14px !default;
+$progress-btn-bigger-spin-btn-padding: 20px !default;
+$progress-btn-bigger-small-spin-btn-padding: 16px !default;
+
+$progress-btn-flat-primary-progress-color: $brand-primary-font !default;
+$progress-btn-flat-success-progress-color: #fff !default;
+$progress-btn-flat-info-progress-color: #fff !default;
+$progress-btn-flat-warning-progress-color: #fff !default;
+$progress-btn-flat-danger-progress-color: #fff !default;
+$btn-flat-primary-path-arc: none;