@syncfusion/ej2-splitbuttons 24.1.45 → 24.2.3

package/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 ## [Unreleased]
 
+## 24.1.46 (2024-01-17)
+
+### DropDownButton
+
+#### Bug Fixes
+
+- `#I863317` -  Issue in "DropDownButton list items do not meet WCAG AA standards for focus indicators" has been resolved.
+
+### ButtonGroup
+
+#### Bug Fixes
+
+- `#I534148` -  Issue in "Focus Css style not removed after clicking outside from button group button in bootstrap4 theme" has been resolved.
+
+## 24.1.45 (2024-01-09)
+
 ### DropDownButton
 
 #### Bug Fixes
@@ -306,4 +322,4 @@ SplitButton component has primary and secondary button. Primary button is used t
 
 - **Separator** - Supports Popup items grouping by using the Separator.
 
-- **Accessibility** - Provided with built-in accessibility support that helps to access all the SplitButton component features through the keyboard, screen readers, or other assistive technology devices.
+- **Accessibility** - Provided with built-in accessibility support that helps to access all the SplitButton component features through the keyboard, screen readers, or other assistive technology devices.

package/dist/ej2-splitbuttons.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-splitbuttons.min.js
-*  version : 24.1.45
+*  version : 24.2.3
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/ej2-splitbuttons.umd.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-splitbuttons.umd.min.js
-*  version : 24.1.45
+*  version : 24.2.3
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/global/ej2-splitbuttons.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-splitbuttons.min.js
-*  version : 24.1.45
+*  version : 24.2.3
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/global/index.d.ts

@@ -1,6 +1,6 @@
 /*!
 *  filename: index.d.ts
-*  version : 24.1.45
+*  version : 24.2.3
 *  Copyright Syncfusion Inc. 2001 - 2023. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-splitbuttons@*",
-  "_id": "@syncfusion/ej2-splitbuttons@24.1.44",
+  "_id": "@syncfusion/ej2-splitbuttons@24.1.46",
   "_inBundle": false,
-  "_integrity": "sha512-SKKpNooboDsFPmWGU/g+uyT+0VELBwp03B5+9xuRlItyQxWa/nLCrvQbCnKF8wKfaccdgIsekjvmQe3Za5kwtQ==",
+  "_integrity": "sha512-DU8BVPV71gpYFmU0q3+V9UFjYiGaaUr06Fx1lFAdoDyKCTZPTizI6K2LRj0zM8gJawOw18Vtbyx3/pjl6c8+Iw==",
   "_location": "/@syncfusion/ej2-splitbuttons",
   "_phantomChildren": {},
   "_requested": {
@@ -33,8 +33,8 @@
     "/@syncfusion/ej2-richtexteditor",
     "/@syncfusion/ej2-vue-splitbuttons"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-splitbuttons/-/ej2-splitbuttons-24.1.44.tgz",
-  "_shasum": "2905a41c62ab7bf1066e2321e1b2e4dd58555d82",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-splitbuttons/-/ej2-splitbuttons-24.1.46.tgz",
+  "_shasum": "f20683f086babbd4f5e1d1d42f1de39b64242ef7",
   "_spec": "@syncfusion/ej2-splitbuttons@*",
   "_where": "/jenkins/workspace/elease-automation_release_24.1.1/packages/included",
   "author": {
@@ -45,8 +45,8 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~24.1.42",
-    "@syncfusion/ej2-popups": "~24.1.44"
+    "@syncfusion/ej2-base": "~24.2.3",
+    "@syncfusion/ej2-popups": "~24.2.3"
   },
   "deprecated": false,
   "description": "A package of feature-rich Essential JS 2 components such as DropDownButton, SplitButton, ProgressButton and ButtonGroup.",
@@ -89,6 +89,6 @@
     "url": "git+https://github.com/syncfusion/ej2-javascript-ui-controls.git"
   },
   "typings": "index.d.ts",
-  "version": "24.1.45",
+  "version": "24.2.3",
   "sideEffects": false
 }

package/styles/bootstrap-dark.css

@@ -181,7 +181,7 @@
 
 /*! drop-down button theme */
 .e-dropdown-popup {
-  background-color: #2a2a2a;
+  background: #2a2a2a;
   color: #f0f0f0;
 }
 .e-dropdown-popup ul .e-item .e-menu-url {
@@ -191,15 +191,15 @@
   color: #f0f0f0;
 }
 .e-dropdown-popup ul .e-item.e-focused {
-  background-color: transparent;
+  background: transparent;
   box-shadow: inset 0 0 0 1px #585858;
 }
 .e-dropdown-popup ul .e-item:hover {
-  background-color: #414141;
+  background: #414141;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
-  background-color: #0070f0;
+  background: #0070f0;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
@@ -224,7 +224,7 @@
 .e-dropdown-btn.e-btn.e-inherit:focus,
 .e-dropdown-btn.e-btn.e-inherit:active,
 .e-dropdown-btn.e-btn.e-inherit.e-active {
-  background-color: rgba(0, 0, 0, 0.056);
+  background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
   box-shadow: none;
   color: inherit;
@@ -936,7 +936,6 @@
   color: #fff;
   outline: #393939 0 solid;
   outline-offset: 0;
-  box-shadow: inset 0 4px 5px rgba(26, 26, 26, 0.4);
 }
 .e-btn-group .e-btn:active.e-primary,
 .e-btn-group input:active + label.e-btn.e-primary,

package/styles/bootstrap.css

@@ -181,7 +181,7 @@
 
 /*! drop-down button theme */
 .e-dropdown-popup {
-  background-color: #fff;
+  background: #fff;
   color: #333;
 }
 .e-dropdown-popup ul .e-item .e-menu-url {
@@ -191,15 +191,15 @@
   color: #333;
 }
 .e-dropdown-popup ul .e-item.e-focused {
-  background-color: transparent;
+  background: transparent;
   box-shadow: 0 0 0 1px #8c8c8c inset;
 }
 .e-dropdown-popup ul .e-item:hover {
-  background-color: #e6e6e6;
+  background: #e6e6e6;
   color: #333;
 }
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
-  background-color: #e6e6e6;
+  background: #e6e6e6;
   color: #333;
 }
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
@@ -224,7 +224,7 @@
 .e-dropdown-btn.e-btn.e-inherit:focus,
 .e-dropdown-btn.e-btn.e-inherit:active,
 .e-dropdown-btn.e-btn.e-inherit.e-active {
-  background-color: rgba(0, 0, 0, 0.056);
+  background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
   box-shadow: none;
   color: inherit;
@@ -936,7 +936,6 @@
   color: #333;
   outline: #fff 0 solid;
   outline-offset: 0;
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
 }
 .e-btn-group .e-btn:active.e-primary,
 .e-btn-group input:active + label.e-btn.e-primary,

package/styles/bootstrap4.css

@@ -176,7 +176,7 @@
 
 /*! drop-down button theme */
 .e-dropdown-popup {
-  background-color: #fff;
+  background: #fff;
   color: #212529;
 }
 .e-dropdown-popup ul .e-item .e-menu-url {
@@ -186,15 +186,15 @@
   color: #212529;
 }
 .e-dropdown-popup ul .e-item.e-focused {
-  background-color: #f2f4f6;
+  background: #f2f4f6;
   box-shadow: none;
 }
 .e-dropdown-popup ul .e-item:hover {
-  background-color: #f2f4f6;
+  background: #f2f4f6;
   color: #212529;
 }
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
-  background-color: #007bff;
+  background: #007bff;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
@@ -219,7 +219,7 @@
 .e-dropdown-btn.e-btn.e-inherit:focus,
 .e-dropdown-btn.e-btn.e-inherit:active,
 .e-dropdown-btn.e-btn.e-inherit.e-active {
-  background-color: rgba(0, 0, 0, 0.056);
+  background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
   box-shadow: none;
   color: inherit;
@@ -562,6 +562,14 @@
       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;
@@ -794,10 +802,6 @@
 .e-css.e-btn-group:not(.e-outline) {
   box-shadow: none;
 }
-.e-btn-group .e-btn,
-.e-css.e-btn-group .e-btn {
-  box-shadow: none;
-}
 .e-btn-group .e-btn:hover,
 .e-css.e-btn-group .e-btn:hover {
   box-shadow: none;
@@ -806,69 +810,63 @@
 .e-btn-group input:focus + label.e-btn,
 .e-css.e-btn-group .e-btn:focus,
 .e-css.e-btn-group input:focus + label.e-btn {
-  background: #6c757d;
-  border-color: #6c757d;
+  background: #5b636a;
+  border-color: #60686f;
   color: #fff;
   outline: #6c757d 0 solid;
   outline-offset: 0;
-  box-shadow: 0 0 0 0.25em rgba(128, 136, 143, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(115, 122, 129, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-primary,
 .e-btn-group input:focus + label.e-btn.e-primary,
 .e-css.e-btn-group .e-btn:focus.e-primary,
 .e-css.e-btn-group input:focus + label.e-btn.e-primary {
-  background: #007bff;
-  border-color: #007bff;
+  background: #006adb;
+  border-color: #006fe6;
   color: #fff;
   outline: #6c757d 0 solid;
-  box-shadow: 0 0 0 0.25em rgba(38, 143, 255, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(33, 130, 234, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-success,
 .e-btn-group input:focus + label.e-btn.e-success,
 .e-css.e-btn-group .e-btn:focus.e-success,
 .e-css.e-btn-group input:focus + label.e-btn.e-success {
-  background: #28a745;
-  border-color: #28a745;
+  background: #218a39;
+  border-color: #23923d;
   color: #fff;
-  box-shadow: 0 0 0 0.25em rgba(66, 179, 92, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(58, 160, 82, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-info,
 .e-btn-group input:focus + label.e-btn.e-info,
 .e-css.e-btn-group .e-btn:focus.e-info,
 .e-css.e-btn-group input:focus + label.e-btn.e-info {
-  background: #17a2b8;
-  border-color: #17a2b8;
+  background: #138698;
+  border-color: #148ea1;
   color: #fff;
-  box-shadow: 0 0 0 0.25em rgba(51, 174, 194, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(44, 156, 174, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-warning,
 .e-btn-group input:focus + label.e-btn.e-warning,
 .e-css.e-btn-group .e-btn:focus.e-warning,
 .e-css.e-btn-group input:focus + label.e-btn.e-warning {
-  background: #ffc107;
-  border-color: #ffc107;
+  background: #e2aa00;
+  border-color: #edb100;
   color: #212529;
-  box-shadow: 0 0 0 0.25em rgba(255, 202, 44, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(240, 188, 34, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-danger,
 .e-btn-group input:focus + label.e-btn.e-danger,
 .e-css.e-btn-group .e-btn:focus.e-danger,
 .e-css.e-btn-group input:focus + label.e-btn.e-danger {
-  background: #dc3545;
-  border-color: #dc3545;
+  background: #ca2333;
+  border-color: #d32535;
   color: #fff;
-  box-shadow: 0 0 0 0.25em rgba(225, 83, 97, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(217, 67, 81, 0.5);
   outline-color: inherit;
 }
 .e-btn-group .e-btn:focus.e-link,
@@ -897,36 +895,31 @@
 .e-btn-group input:focus + label.e-btn.e-outline.e-primary,
 .e-css.e-btn-group .e-btn:focus.e-outline.e-primary,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-primary {
-  box-shadow: 0 0 0 0.25em rgba(38, 143, 255, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(38, 133, 234, 0.5);
 }
 .e-btn-group .e-btn:focus.e-outline.e-success,
 .e-btn-group input:focus + label.e-btn.e-outline.e-success,
 .e-css.e-btn-group .e-btn:focus.e-outline.e-success,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-success {
-  box-shadow: 0 0 0 0.25em rgba(66, 179, 92, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(58, 160, 82, 0.5);
 }
 .e-btn-group .e-btn:focus.e-outline.e-info,
 .e-btn-group input:focus + label.e-btn.e-outline.e-info,
 .e-css.e-btn-group .e-btn:focus.e-outline.e-info,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-info {
-  box-shadow: 0 0 0 0.25em rgba(46, 173, 193, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(44, 156, 174, 0.5);
 }
 .e-btn-group .e-btn:focus.e-outline.e-warning,
 .e-btn-group input:focus + label.e-btn.e-outline.e-warning,
 .e-css.e-btn-group .e-btn:focus.e-outline.e-warning,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-warning {
-  box-shadow: 0 0 0 0.25em rgba(255, 201, 40, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(240, 188, 34, 0.5);
 }
 .e-btn-group .e-btn:focus.e-outline.e-danger,
 .e-btn-group input:focus + label.e-btn.e-outline.e-danger,
 .e-css.e-btn-group .e-btn:focus.e-outline.e-danger,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline.e-danger {
-  box-shadow: 0 0 0 0.25em rgba(225, 81, 95, 0.5);
-  box-shadow: none;
+  box-shadow: 0 0 0 0.25em rgba(217, 67, 81, 0.5);
 }
 .e-btn-group .e-btn:active,
 .e-btn-group input:active + label.e-btn,
@@ -939,7 +932,6 @@
   color: #fff;
   outline: #6c757d 0 solid;
   outline-offset: 0;
-  box-shadow: 0 0 0 0.25em rgba(99, 105, 111, 0.5);
 }
 .e-btn-group .e-btn:active.e-primary,
 .e-btn-group input:active + label.e-btn.e-primary,
@@ -951,7 +943,6 @@
   border-color: #005cbf;
   color: #fff;
   outline: #6c757d 0 solid;
-  box-shadow: 0 0 0 0.25em rgba(31, 113, 201, 0.5);
 }
 .e-btn-group .e-btn:active.e-success,
 .e-btn-group input:active + label.e-btn.e-success,
@@ -962,7 +953,6 @@
   background: #1e7e34;
   border-color: #1c7430;
   color: #fff;
-  box-shadow: 0 0 0 0.25em rgba(50, 134, 69, 0.5);
 }
 .e-btn-group .e-btn:active.e-info,
 .e-btn-group input:active + label.e-btn.e-info,
@@ -973,7 +963,6 @@
   background: #117a8b;
   color: #fff;
   border-color: #10707f;
-  box-shadow: 0 0 0 0.25em rgba(39, 130, 145, 0.5);
 }
 .e-btn-group .e-btn:active.e-warning,
 .e-btn-group input:active + label.e-btn.e-warning,
@@ -984,7 +973,6 @@
   background: #d39e00;
   border-color: #c69500;
   color: #212529;
-  box-shadow: 0 0 0 0.25em rgba(207, 163, 32, 0.5);
 }
 .e-btn-group .e-btn:active.e-danger,
 .e-btn-group input:active + label.e-btn.e-danger,
@@ -995,7 +983,6 @@
   background: #bd2130;
   border-color: #b21f2d;
   color: #fff;
-  box-shadow: 0 0 0 0.25em rgba(189, 60, 73, 0.5);
 }
 .e-btn-group .e-btn:active.e-outline,
 .e-btn-group input:active + label.e-btn.e-outline,
@@ -1005,7 +992,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline {
   background: #6c757d;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(99, 105, 111, 0.5);
   color: #fff;
 }
 .e-btn-group .e-btn:active.e-outline.e-primary,
@@ -1016,7 +1002,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-primary {
   background: #007bff;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(31, 139, 255, 0.5);
   color: #fff;
 }
 .e-btn-group .e-btn:active.e-outline.e-success,
@@ -1027,7 +1012,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-success {
   background: #28a745;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(50, 134, 69, 0.5);
   color: #fff;
 }
 .e-btn-group .e-btn:active.e-outline.e-info,
@@ -1038,7 +1022,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-info {
   background: #17a2b8;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(39, 130, 145, 0.5);
   color: #fff;
 }
 .e-btn-group .e-btn:active.e-outline.e-warning,
@@ -1049,7 +1032,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-warning {
   background: #ffc107;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(207, 163, 32, 0.5);
   color: #212529;
 }
 .e-btn-group .e-btn:active.e-outline.e-danger,
@@ -1060,7 +1042,6 @@
 .e-css.e-btn-group input:checked + label.e-btn.e-outline.e-danger {
   background: #dc3545;
   border-color: transparent;
-  box-shadow: 0 0 0 0.25em rgba(189, 60, 73, 0.5);
   color: #fff;
 }
 .e-btn-group .e-btn:disabled,
@@ -1216,28 +1197,28 @@
 .e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-success,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-success,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-success {
-  border-color: #28a745;
+  border-color: #23923d;
   outline-color: inherit;
 }
 .e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-info,
 .e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-info,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-info,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-info {
-  border-color: #17a2b8;
+  border-color: #148ea1;
   outline-color: inherit;
 }
 .e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-warning,
 .e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-warning,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-warning,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-warning {
-  border-color: #ffc107;
+  border-color: #edb100;
   outline-color: inherit;
 }
 .e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-danger,
 .e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-danger,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) .e-btn:focus.e-outline.e-danger,
 .e-css.e-btn-group:not(.e-vertical):not(.e-rtl) input:focus + label.e-btn.e-outline.e-danger {
-  border-color: #dc3545;
+  border-color: #d32535;
   outline-color: inherit;
 }
 .e-btn-group.e-vertical:not(.e-rtl) .e-outline:not(:first-of-type):not(:last-of-type),
@@ -1271,28 +1252,28 @@
 .e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-success,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-success,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-success {
-  border-color: #28a745;
+  border-color: #23923d;
   outline-color: inherit;
 }
 .e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-info,
 .e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-info,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-info,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-info {
-  border-color: #17a2b8;
+  border-color: #148ea1;
   outline-color: inherit;
 }
 .e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-warning,
 .e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-warning,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-warning,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-warning {
-  border-color: #ffc107;
+  border-color: #edb100;
   outline-color: inherit;
 }
 .e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-danger,
 .e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-danger,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) .e-btn:focus.e-outline.e-danger,
 .e-css.e-btn-group.e-vertical:not(.e-rtl) input:focus + label.e-btn.e-outline.e-danger {
-  border-color: #dc3545;
+  border-color: #d32535;
   outline-color: inherit;
 }
 .e-btn-group.e-rtl .e-btn:not(:first-of-type):not(:last-of-type),

package/styles/bootstrap5-dark.css

@@ -186,7 +186,7 @@
 
 /*! drop-down button theme */
 .e-dropdown-popup {
-  background-color: #343a40;
+  background: #343a40;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item .e-menu-url {
@@ -196,15 +196,15 @@
   color: #adb5bd;
 }
 .e-dropdown-popup ul .e-item.e-focused {
-  background-color: #31373d;
+  background: #31373d;
   box-shadow: none;
 }
 .e-dropdown-popup ul .e-item:hover {
-  background-color: #444c54;
+  background: #444c54;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
-  background-color: #0d6efd;
+  background: #0d6efd;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
@@ -229,7 +229,7 @@
 .e-dropdown-btn.e-btn.e-inherit:focus,
 .e-dropdown-btn.e-btn.e-inherit:active,
 .e-dropdown-btn.e-btn.e-inherit.e-active {
-  background-color: rgba(0, 0, 0, 0.056);
+  background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
   box-shadow: none;
   color: inherit;
@@ -899,6 +899,7 @@
 .e-css.e-btn-group .e-btn:focus.e-outline,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline {
   box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
+  box-shadow: none;
   border-color: #5c636a;
 }
 .e-btn-group .e-btn:focus.e-outline.e-primary,

package/styles/bootstrap5.css

@@ -186,7 +186,7 @@
 
 /*! drop-down button theme */
 .e-dropdown-popup {
-  background-color: #fff;
+  background: #fff;
   color: #212529;
 }
 .e-dropdown-popup ul .e-item .e-menu-url {
@@ -196,15 +196,15 @@
   color: #6c757d;
 }
 .e-dropdown-popup ul .e-item.e-focused {
-  background-color: #e9ecef;
+  background: #e9ecef;
   box-shadow: none;
 }
 .e-dropdown-popup ul .e-item:hover {
-  background-color: #e9ecef;
+  background: #e9ecef;
   color: #212529;
 }
 .e-dropdown-popup ul .e-item:active, .e-dropdown-popup ul .e-item.e-selected {
-  background-color: #0d6efd;
+  background: #0d6efd;
   color: #fff;
 }
 .e-dropdown-popup ul .e-item:active .e-menu-url, .e-dropdown-popup ul .e-item.e-selected .e-menu-url {
@@ -229,7 +229,7 @@
 .e-dropdown-btn.e-btn.e-inherit:focus,
 .e-dropdown-btn.e-btn.e-inherit:active,
 .e-dropdown-btn.e-btn.e-inherit.e-active {
-  background-color: rgba(0, 0, 0, 0.056);
+  background: rgba(0, 0, 0, 0.056);
   border-color: transparent;
   box-shadow: none;
   color: inherit;
@@ -899,6 +899,7 @@
 .e-css.e-btn-group .e-btn:focus.e-outline,
 .e-css.e-btn-group input:focus + label.e-btn.e-outline {
   box-shadow: 0 0 0 4px rgba(130, 138, 145, 0.5);
+  box-shadow: none;
   border-color: #5c636a;
 }
 .e-btn-group .e-btn:focus.e-outline.e-primary,

package/styles/button-group/_layout.scss

@@ -16,7 +16,7 @@
     input:focus+label.e-btn,
     .e-btn:focus,
     .e-btn:hover {
-      @if $skin-name == 'tailwind' or $skin-name == 'bootstrap5' {
+      @if $skin-name == 'tailwind' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap4' {
         z-index: 2;
       }
     }