@syncfusion/ej2-splitbuttons 26.2.5 → 27.1.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (257) hide show
  1. package/README.md +6 -6
  2. package/dist/ej2-splitbuttons.min.js +2 -2
  3. package/dist/ej2-splitbuttons.umd.min.js +2 -2
  4. package/dist/ej2-splitbuttons.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-splitbuttons.es2015.js +22 -29
  6. package/dist/es6/ej2-splitbuttons.es2015.js.map +1 -1
  7. package/dist/es6/ej2-splitbuttons.es5.js +22 -29
  8. package/dist/es6/ej2-splitbuttons.es5.js.map +1 -1
  9. package/dist/global/ej2-splitbuttons.min.js +2 -2
  10. package/dist/global/ej2-splitbuttons.min.js.map +1 -1
  11. package/dist/global/index.d.ts +1 -1
  12. package/package.json +9 -8
  13. package/src/common/common.js +1 -0
  14. package/src/drop-down-button/drop-down-button.d.ts +1 -0
  15. package/src/drop-down-button/drop-down-button.js +17 -4
  16. package/src/progress-button/progress-button.d.ts +0 -1
  17. package/src/progress-button/progress-button.js +4 -25
  18. package/styles/bootstrap-dark-lite.css +1762 -0
  19. package/styles/bootstrap-dark-lite.scss +13 -0
  20. package/styles/bootstrap-dark.css +203 -204
  21. package/styles/bootstrap-dark.scss +5 -2
  22. package/styles/bootstrap-lite.css +1812 -0
  23. package/styles/bootstrap-lite.scss +13 -0
  24. package/styles/bootstrap.css +203 -204
  25. package/styles/bootstrap.scss +5 -2
  26. package/styles/bootstrap4-lite.css +1801 -0
  27. package/styles/bootstrap4-lite.scss +13 -0
  28. package/styles/bootstrap4.css +203 -203
  29. package/styles/bootstrap4.scss +5 -2
  30. package/styles/bootstrap5-dark-lite.css +1735 -0
  31. package/styles/bootstrap5-dark-lite.scss +13 -0
  32. package/styles/bootstrap5-dark.css +210 -210
  33. package/styles/bootstrap5-dark.scss +5 -2
  34. package/styles/bootstrap5-lite.css +1735 -0
  35. package/styles/bootstrap5-lite.scss +13 -0
  36. package/styles/bootstrap5.3-lite.css +1743 -0
  37. package/styles/bootstrap5.3-lite.scss +13 -0
  38. package/styles/bootstrap5.3.css +1953 -0
  39. package/styles/bootstrap5.3.scss +17 -0
  40. package/styles/bootstrap5.css +210 -210
  41. package/styles/bootstrap5.scss +5 -2
  42. package/styles/button-group/_bigger.scss +10 -0
  43. package/styles/button-group/_layout.scss +1 -10
  44. package/styles/button-group/_theme.scss +19 -13
  45. package/styles/button-group/bootstrap-dark.css +7 -8
  46. package/styles/button-group/bootstrap-dark.scss +1 -0
  47. package/styles/button-group/bootstrap.css +6 -8
  48. package/styles/button-group/bootstrap.scss +1 -0
  49. package/styles/button-group/bootstrap4.css +7 -7
  50. package/styles/button-group/bootstrap4.scss +1 -0
  51. package/styles/button-group/bootstrap5-dark.css +7 -7
  52. package/styles/button-group/bootstrap5-dark.scss +1 -0
  53. package/styles/button-group/bootstrap5.3.css +809 -0
  54. package/styles/button-group/bootstrap5.3.scss +5 -0
  55. package/styles/button-group/bootstrap5.css +7 -7
  56. package/styles/button-group/bootstrap5.scss +1 -0
  57. package/styles/button-group/fabric-dark.css +7 -8
  58. package/styles/button-group/fabric-dark.scss +1 -0
  59. package/styles/button-group/fabric.css +7 -8
  60. package/styles/button-group/fabric.scss +1 -0
  61. package/styles/button-group/fluent-dark.css +7 -9
  62. package/styles/button-group/fluent-dark.scss +1 -0
  63. package/styles/button-group/fluent.css +7 -9
  64. package/styles/button-group/fluent.scss +1 -0
  65. package/styles/button-group/fluent2.css +29 -1049
  66. package/styles/button-group/fluent2.scss +1 -0
  67. package/styles/button-group/highcontrast-light.css +7 -8
  68. package/styles/button-group/highcontrast-light.scss +1 -0
  69. package/styles/button-group/highcontrast.css +7 -8
  70. package/styles/button-group/highcontrast.scss +1 -0
  71. package/styles/button-group/material-dark.css +7 -9
  72. package/styles/button-group/material-dark.scss +1 -0
  73. package/styles/button-group/material.css +7 -9
  74. package/styles/button-group/material.scss +1 -0
  75. package/styles/button-group/material3-dark.css +8 -61
  76. package/styles/button-group/material3-dark.scss +1 -0
  77. package/styles/button-group/material3.css +9 -116
  78. package/styles/button-group/material3.scss +1 -0
  79. package/styles/button-group/tailwind-dark.css +6 -7
  80. package/styles/button-group/tailwind-dark.scss +1 -0
  81. package/styles/button-group/tailwind.css +6 -7
  82. package/styles/button-group/tailwind.scss +1 -0
  83. package/styles/drop-down-button/_bigger.scss +79 -0
  84. package/styles/drop-down-button/_bootstrap5.3-definition.scss +1 -1
  85. package/styles/drop-down-button/_layout.scss +4 -82
  86. package/styles/drop-down-button/_theme.scss +12 -1
  87. package/styles/drop-down-button/bootstrap-dark.css +49 -49
  88. package/styles/drop-down-button/bootstrap-dark.scss +1 -0
  89. package/styles/drop-down-button/bootstrap.css +49 -49
  90. package/styles/drop-down-button/bootstrap.scss +1 -0
  91. package/styles/drop-down-button/bootstrap4.css +49 -49
  92. package/styles/drop-down-button/bootstrap4.scss +1 -0
  93. package/styles/drop-down-button/bootstrap5-dark.css +56 -56
  94. package/styles/drop-down-button/bootstrap5-dark.scss +1 -0
  95. package/styles/drop-down-button/bootstrap5.3.css +251 -0
  96. package/styles/drop-down-button/bootstrap5.3.scss +7 -0
  97. package/styles/drop-down-button/bootstrap5.css +56 -56
  98. package/styles/drop-down-button/bootstrap5.scss +1 -0
  99. package/styles/drop-down-button/fabric-dark.css +49 -49
  100. package/styles/drop-down-button/fabric-dark.scss +1 -0
  101. package/styles/drop-down-button/fabric.css +49 -49
  102. package/styles/drop-down-button/fabric.scss +1 -0
  103. package/styles/drop-down-button/fluent-dark.css +49 -49
  104. package/styles/drop-down-button/fluent-dark.scss +1 -0
  105. package/styles/drop-down-button/fluent.css +49 -49
  106. package/styles/drop-down-button/fluent.scss +1 -0
  107. package/styles/drop-down-button/fluent2.css +65 -1086
  108. package/styles/drop-down-button/fluent2.scss +1 -0
  109. package/styles/drop-down-button/highcontrast-light.css +49 -49
  110. package/styles/drop-down-button/highcontrast-light.scss +1 -0
  111. package/styles/drop-down-button/highcontrast.css +49 -49
  112. package/styles/drop-down-button/highcontrast.scss +1 -0
  113. package/styles/drop-down-button/material-dark.css +49 -49
  114. package/styles/drop-down-button/material-dark.scss +1 -0
  115. package/styles/drop-down-button/material.css +49 -49
  116. package/styles/drop-down-button/material.scss +1 -0
  117. package/styles/drop-down-button/material3-dark.css +50 -103
  118. package/styles/drop-down-button/material3-dark.scss +1 -0
  119. package/styles/drop-down-button/material3.css +51 -158
  120. package/styles/drop-down-button/material3.scss +1 -0
  121. package/styles/drop-down-button/tailwind-dark.css +56 -56
  122. package/styles/drop-down-button/tailwind-dark.scss +1 -0
  123. package/styles/drop-down-button/tailwind.css +56 -56
  124. package/styles/drop-down-button/tailwind.scss +1 -0
  125. package/styles/fabric-dark-lite.css +1762 -0
  126. package/styles/fabric-dark-lite.scss +13 -0
  127. package/styles/fabric-dark.css +203 -204
  128. package/styles/fabric-dark.scss +5 -2
  129. package/styles/fabric-lite.css +1842 -0
  130. package/styles/fabric-lite.scss +13 -0
  131. package/styles/fabric.css +203 -204
  132. package/styles/fabric.scss +5 -2
  133. package/styles/fluent-dark-lite.css +1855 -0
  134. package/styles/fluent-dark-lite.scss +13 -0
  135. package/styles/fluent-dark.css +203 -205
  136. package/styles/fluent-dark.scss +5 -2
  137. package/styles/fluent-lite.css +1855 -0
  138. package/styles/fluent-lite.scss +13 -0
  139. package/styles/fluent.css +203 -205
  140. package/styles/fluent.scss +5 -2
  141. package/styles/fluent2-lite.css +1850 -0
  142. package/styles/fluent2-lite.scss +13 -0
  143. package/styles/fluent2.css +242 -1251
  144. package/styles/fluent2.scss +5 -2
  145. package/styles/highcontrast-light-lite.css +1762 -0
  146. package/styles/highcontrast-light-lite.scss +13 -0
  147. package/styles/highcontrast-light.css +203 -204
  148. package/styles/highcontrast-light.scss +5 -2
  149. package/styles/highcontrast-lite.css +1814 -0
  150. package/styles/highcontrast-lite.scss +13 -0
  151. package/styles/highcontrast.css +203 -204
  152. package/styles/highcontrast.scss +5 -2
  153. package/styles/material-dark-lite.css +1768 -0
  154. package/styles/material-dark-lite.scss +13 -0
  155. package/styles/material-dark.css +203 -205
  156. package/styles/material-dark.scss +5 -2
  157. package/styles/material-lite.css +1847 -0
  158. package/styles/material-lite.scss +13 -0
  159. package/styles/material.css +203 -205
  160. package/styles/material.scss +5 -2
  161. package/styles/material3-dark-lite.css +1994 -0
  162. package/styles/material3-dark-lite.scss +13 -0
  163. package/styles/material3-dark.css +215 -268
  164. package/styles/material3-dark.scss +5 -2
  165. package/styles/material3-lite.css +1988 -0
  166. package/styles/material3-lite.scss +13 -0
  167. package/styles/material3.css +216 -323
  168. package/styles/material3.scss +5 -2
  169. package/styles/progress-button/_bigger.scss +96 -0
  170. package/styles/progress-button/_layout.scss +0 -95
  171. package/styles/progress-button/_theme.scss +6 -2
  172. package/styles/progress-button/bootstrap-dark.css +73 -73
  173. package/styles/progress-button/bootstrap-dark.scss +1 -0
  174. package/styles/progress-button/bootstrap.css +73 -73
  175. package/styles/progress-button/bootstrap.scss +1 -0
  176. package/styles/progress-button/bootstrap4.css +73 -73
  177. package/styles/progress-button/bootstrap4.scss +1 -0
  178. package/styles/progress-button/bootstrap5-dark.css +73 -73
  179. package/styles/progress-button/bootstrap5-dark.scss +1 -0
  180. package/styles/progress-button/bootstrap5.3.css +568 -0
  181. package/styles/progress-button/bootstrap5.3.scss +6 -0
  182. package/styles/progress-button/bootstrap5.css +73 -73
  183. package/styles/progress-button/bootstrap5.scss +1 -0
  184. package/styles/progress-button/fabric-dark.css +73 -73
  185. package/styles/progress-button/fabric-dark.scss +1 -0
  186. package/styles/progress-button/fabric.css +73 -73
  187. package/styles/progress-button/fabric.scss +1 -0
  188. package/styles/progress-button/fluent-dark.css +73 -73
  189. package/styles/progress-button/fluent-dark.scss +1 -0
  190. package/styles/progress-button/fluent.css +73 -73
  191. package/styles/progress-button/fluent.scss +1 -0
  192. package/styles/progress-button/fluent2.css +80 -1104
  193. package/styles/progress-button/fluent2.scss +1 -0
  194. package/styles/progress-button/highcontrast-light.css +73 -73
  195. package/styles/progress-button/highcontrast-light.scss +1 -0
  196. package/styles/progress-button/highcontrast.css +73 -73
  197. package/styles/progress-button/highcontrast.scss +1 -0
  198. package/styles/progress-button/material-dark.css +73 -73
  199. package/styles/progress-button/material-dark.scss +1 -0
  200. package/styles/progress-button/material.css +73 -73
  201. package/styles/progress-button/material.scss +1 -0
  202. package/styles/progress-button/material3-dark.css +74 -127
  203. package/styles/progress-button/material3-dark.scss +1 -0
  204. package/styles/progress-button/material3.css +75 -182
  205. package/styles/progress-button/material3.scss +1 -0
  206. package/styles/progress-button/tailwind-dark.css +73 -73
  207. package/styles/progress-button/tailwind-dark.scss +1 -0
  208. package/styles/progress-button/tailwind.css +73 -73
  209. package/styles/progress-button/tailwind.scss +1 -0
  210. package/styles/split-button/_bigger.scss +149 -0
  211. package/styles/split-button/_layout.scss +8 -156
  212. package/styles/split-button/bootstrap-dark.css +74 -74
  213. package/styles/split-button/bootstrap-dark.scss +1 -0
  214. package/styles/split-button/bootstrap.css +74 -74
  215. package/styles/split-button/bootstrap.scss +1 -0
  216. package/styles/split-button/bootstrap4.css +74 -74
  217. package/styles/split-button/bootstrap4.scss +1 -0
  218. package/styles/split-button/bootstrap5-dark.css +74 -74
  219. package/styles/split-button/bootstrap5-dark.scss +1 -0
  220. package/styles/split-button/bootstrap5.3.css +335 -0
  221. package/styles/split-button/bootstrap5.3.scss +7 -0
  222. package/styles/split-button/bootstrap5.css +74 -74
  223. package/styles/split-button/bootstrap5.scss +1 -0
  224. package/styles/split-button/fabric-dark.css +74 -74
  225. package/styles/split-button/fabric-dark.scss +1 -0
  226. package/styles/split-button/fabric.css +74 -74
  227. package/styles/split-button/fabric.scss +1 -0
  228. package/styles/split-button/fluent-dark.css +74 -74
  229. package/styles/split-button/fluent-dark.scss +1 -0
  230. package/styles/split-button/fluent.css +74 -74
  231. package/styles/split-button/fluent.scss +1 -0
  232. package/styles/split-button/fluent2.css +77 -1105
  233. package/styles/split-button/fluent2.scss +1 -0
  234. package/styles/split-button/highcontrast-light.css +74 -74
  235. package/styles/split-button/highcontrast-light.scss +1 -0
  236. package/styles/split-button/highcontrast.css +74 -74
  237. package/styles/split-button/highcontrast.scss +1 -0
  238. package/styles/split-button/material-dark.css +74 -74
  239. package/styles/split-button/material-dark.scss +1 -0
  240. package/styles/split-button/material.css +74 -74
  241. package/styles/split-button/material.scss +1 -0
  242. package/styles/split-button/material3-dark.css +86 -139
  243. package/styles/split-button/material3-dark.scss +1 -0
  244. package/styles/split-button/material3.css +87 -194
  245. package/styles/split-button/material3.scss +1 -0
  246. package/styles/split-button/tailwind-dark.css +76 -76
  247. package/styles/split-button/tailwind-dark.scss +1 -0
  248. package/styles/split-button/tailwind.css +76 -76
  249. package/styles/split-button/tailwind.scss +1 -0
  250. package/styles/tailwind-dark-lite.css +1859 -0
  251. package/styles/tailwind-dark-lite.scss +13 -0
  252. package/styles/tailwind-dark.css +212 -212
  253. package/styles/tailwind-dark.scss +5 -2
  254. package/styles/tailwind-lite.css +1859 -0
  255. package/styles/tailwind-lite.scss +13 -0
  256. package/styles/tailwind.css +212 -212
  257. package/styles/tailwind.scss +5 -2
@@ -92,6 +92,7 @@ function isValidLI(ul, li, index, keyCode, count = 0) {
92
92
  }
93
93
  return index;
94
94
  }
95
+ // eslint-disable-next-line jsdoc/require-param, valid-jsdoc
95
96
  /** @hidden
96
97
  * @param {HTMLElement} popup - Specifies the popup element.
97
98
  * @returns {void}
@@ -625,6 +626,9 @@ let DropDownButton = class DropDownButton extends Component {
625
626
  break;
626
627
  }
627
628
  }
629
+ isSafari() {
630
+ return /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
631
+ }
628
632
  upDownKeyHandler(e) {
629
633
  if (this.target && (e.keyCode === 38 || e.keyCode === 40)) {
630
634
  return;
@@ -668,7 +672,7 @@ let DropDownButton = class DropDownButton extends Component {
668
672
  }
669
673
  focusoutHandler(e) {
670
674
  if (this.isPopupCreated && !this.canOpen()) {
671
- const liTarget = e.relatedTarget;
675
+ const liTarget = (e.relatedTarget || e.target);
672
676
  if (liTarget && liTarget.className.indexOf('e-item') > -1) {
673
677
  const li = this.getLI(liTarget);
674
678
  if (li) {
@@ -737,7 +741,10 @@ let DropDownButton = class DropDownButton extends Component {
737
741
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
738
742
  if (splitButton.isReact && popupElem.childNodes.length < 1) {
739
743
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
740
- splitButton.appendReactElement(this.getTargetElement(), this.getPopUpElement());
744
+ if (splitButton.appendReactElement) {
745
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
746
+ splitButton.appendReactElement(this.getTargetElement(), this.getPopUpElement());
747
+ }
741
748
  this.renderReactTemplates();
742
749
  }
743
750
  }
@@ -745,7 +752,10 @@ let DropDownButton = class DropDownButton extends Component {
745
752
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
746
753
  if (this.isReact && popupElem.childNodes.length < 1) {
747
754
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
748
- this.appendReactElement(this.getTargetElement(), this.getPopUpElement());
755
+ if (this.appendReactElement) {
756
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
757
+ this.appendReactElement(this.getTargetElement(), this.getPopUpElement());
758
+ }
749
759
  this.renderReactTemplates();
750
760
  }
751
761
  }
@@ -760,7 +770,7 @@ let DropDownButton = class DropDownButton extends Component {
760
770
  addClass([this.element], 'e-active');
761
771
  this.element.setAttribute('aria-expanded', 'true');
762
772
  this.element.setAttribute('aria-owns', this.getPopUpElement().id);
763
- if (ul) {
773
+ if (ul && !this.isSafari()) {
764
774
  ul.focus();
765
775
  }
766
776
  if (this.enableRtl && ul.parentElement.style.left !== '0px') {
@@ -780,6 +790,9 @@ let DropDownButton = class DropDownButton extends Component {
780
790
  }
781
791
  const openArgs = { element: ul, items: this.items };
782
792
  this.trigger('open', openArgs);
793
+ if (ul && this.isSafari()) {
794
+ ul.focus();
795
+ }
783
796
  }
784
797
  });
785
798
  }
@@ -874,6 +887,7 @@ let DropDownButton = class DropDownButton extends Component {
874
887
  }
875
888
  break;
876
889
  case 'cssClass':
890
+ oldProp.cssClass = isNullOrUndefined(oldProp.cssClass) ? '' : oldProp.cssClass;
877
891
  if (newProp.cssClass.indexOf(classNames.VERTICAL) > -1 || oldProp.cssClass.indexOf(classNames.VERTICAL) > -1) {
878
892
  if (!this.element.querySelector('span.e-caret')) {
879
893
  this.appendArrowSpan();
@@ -1596,8 +1610,10 @@ let ProgressButton = class ProgressButton extends Button {
1596
1610
  * @returns {void}
1597
1611
  */
1598
1612
  destroy() {
1599
- let classList = [HIDESPINNER, PROGRESSACTIVE, 'e-round-corner', 'e-' + super.getModuleName(),
1600
- 'e-spin-' + this.spinSettings.position.toLowerCase()];
1613
+ let classList = [HIDESPINNER, PROGRESSACTIVE, 'e-round-corner', 'e-' + super.getModuleName()];
1614
+ if (this.spinSettings.position) {
1615
+ classList.push('e-spin-' + this.spinSettings.position.toLowerCase());
1616
+ }
1601
1617
  super.destroy();
1602
1618
  this.unWireEvents();
1603
1619
  this.element.innerHTML = '';
@@ -1657,29 +1673,6 @@ let ProgressButton = class ProgressButton extends Button {
1657
1673
  this.element.innerHTML = '';
1658
1674
  this.element.appendChild(this.createElement('span', { className: CONTENTCLS, innerHTML: cont }));
1659
1675
  }
1660
- setContentIcon(content) {
1661
- const contElem = this.createElement('span', { className: CONTENTCLS, innerHTML: content });
1662
- if (this.iconCss) {
1663
- const span = this.createElement('span', { className: 'e-btn-icon ' + this.iconCss });
1664
- if (!this.element.textContent.trim()) {
1665
- this.element.classList.add('e-icon-btn');
1666
- }
1667
- else {
1668
- span.classList.add('e-icon-' + this.iconPosition.toLowerCase());
1669
- if (this.iconPosition === 'Top' || this.iconPosition === 'Bottom') {
1670
- this.element.classList.add('e-' + this.iconPosition.toLowerCase() + '-icon-btn');
1671
- }
1672
- }
1673
- const node = contElem.childNodes[0];
1674
- if (node && (this.iconPosition === 'Left' || this.iconPosition === 'Top')) {
1675
- contElem.insertBefore(span, node);
1676
- }
1677
- else {
1678
- contElem.appendChild(span);
1679
- }
1680
- }
1681
- this.element.appendChild(contElem);
1682
- }
1683
1676
  clickHandler() {
1684
1677
  if (this.element.classList.contains(PROGRESSACTIVE)) {
1685
1678
  return;