@syncfusion/ej2-dropdowns 27.2.4 → 28.1.33

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 (223) hide show
  1. package/README.md +2 -2
  2. package/dist/ej2-dropdowns.min.js +3 -3
  3. package/dist/ej2-dropdowns.umd.min.js +3 -3
  4. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  5. package/dist/es6/ej2-dropdowns.es2015.js +507 -39
  6. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es5.js +506 -37
  8. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  9. package/dist/global/ej2-dropdowns.min.js +3 -3
  10. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  11. package/dist/global/index.d.ts +2 -2
  12. package/package.json +13 -13
  13. package/src/auto-complete/auto-complete.js +5 -2
  14. package/src/combo-box/combo-box.js +1 -1
  15. package/src/common/incremental-search.d.ts +1 -1
  16. package/src/common/incremental-search.js +5 -1
  17. package/src/common/virtual-scroll.js +2 -1
  18. package/src/drop-down-base/drop-down-base.js +21 -3
  19. package/src/drop-down-list/drop-down-list-model.d.ts +31 -0
  20. package/src/drop-down-list/drop-down-list.d.ts +44 -1
  21. package/src/drop-down-list/drop-down-list.js +202 -13
  22. package/src/drop-down-tree/drop-down-tree.js +4 -1
  23. package/src/list-box/list-box.d.ts +4 -0
  24. package/src/list-box/list-box.js +9 -4
  25. package/src/mention/mention.js +6 -1
  26. package/src/multi-select/multi-select-model.d.ts +31 -0
  27. package/src/multi-select/multi-select.d.ts +45 -0
  28. package/src/multi-select/multi-select.js +251 -10
  29. package/styles/auto-complete/_tailwind3-definition.scss +2 -0
  30. package/styles/auto-complete/bds.css +75 -0
  31. package/styles/auto-complete/bds.scss +4 -0
  32. package/styles/auto-complete/highcontrast.css +1 -1
  33. package/styles/auto-complete/tailwind3.css +101 -0
  34. package/styles/auto-complete/tailwind3.scss +4 -0
  35. package/styles/bds-lite.css +3013 -0
  36. package/styles/bds-lite.scss +28 -0
  37. package/styles/bds.css +3855 -0
  38. package/styles/bds.scss +33 -0
  39. package/styles/bootstrap-dark-lite.css +41 -2
  40. package/styles/bootstrap-dark.css +41 -2
  41. package/styles/bootstrap-lite.css +30 -1
  42. package/styles/bootstrap.css +30 -1
  43. package/styles/bootstrap4-lite.css +30 -0
  44. package/styles/bootstrap4.css +30 -0
  45. package/styles/bootstrap5-dark-lite.css +30 -0
  46. package/styles/bootstrap5-dark.css +30 -0
  47. package/styles/bootstrap5-lite.css +30 -0
  48. package/styles/bootstrap5.3-lite.css +30 -3
  49. package/styles/bootstrap5.3.css +30 -3
  50. package/styles/bootstrap5.css +30 -0
  51. package/styles/combo-box/_tailwind3-definition.scss +2 -0
  52. package/styles/combo-box/bds.css +75 -0
  53. package/styles/combo-box/bds.scss +4 -0
  54. package/styles/combo-box/highcontrast.css +1 -1
  55. package/styles/combo-box/tailwind3.css +101 -0
  56. package/styles/combo-box/tailwind3.scss +4 -0
  57. package/styles/drop-down-base/_bigger.scss +3 -0
  58. package/styles/drop-down-base/_layout.scss +7 -0
  59. package/styles/drop-down-base/_tailwind3-definition.scss +98 -0
  60. package/styles/drop-down-base/bds.css +496 -0
  61. package/styles/drop-down-base/bds.scss +4 -0
  62. package/styles/drop-down-base/bootstrap-dark.css +4 -0
  63. package/styles/drop-down-base/bootstrap.css +4 -0
  64. package/styles/drop-down-base/bootstrap4.css +4 -0
  65. package/styles/drop-down-base/bootstrap5-dark.css +4 -0
  66. package/styles/drop-down-base/bootstrap5.3.css +4 -0
  67. package/styles/drop-down-base/bootstrap5.css +4 -0
  68. package/styles/drop-down-base/fabric-dark.css +4 -0
  69. package/styles/drop-down-base/fabric.css +4 -0
  70. package/styles/drop-down-base/fluent-dark.css +4 -0
  71. package/styles/drop-down-base/fluent.css +4 -0
  72. package/styles/drop-down-base/fluent2.css +9 -5
  73. package/styles/drop-down-base/highcontrast-light.css +4 -0
  74. package/styles/drop-down-base/highcontrast.css +4 -0
  75. package/styles/drop-down-base/material-dark.css +4 -0
  76. package/styles/drop-down-base/material.css +4 -0
  77. package/styles/drop-down-base/material3-dark.css +4 -0
  78. package/styles/drop-down-base/material3.css +4 -0
  79. package/styles/drop-down-base/tailwind-dark.css +4 -0
  80. package/styles/drop-down-base/tailwind.css +4 -0
  81. package/styles/drop-down-base/tailwind3.css +392 -0
  82. package/styles/drop-down-base/tailwind3.scss +4 -0
  83. package/styles/drop-down-list/_highcontrast-definition.scss +1 -1
  84. package/styles/drop-down-list/_layout.scss +18 -2
  85. package/styles/drop-down-list/_tailwind3-definition.scss +135 -0
  86. package/styles/drop-down-list/_theme.scss +3 -1
  87. package/styles/drop-down-list/bds.css +609 -0
  88. package/styles/drop-down-list/bds.scss +10 -0
  89. package/styles/drop-down-list/bootstrap-dark.css +18 -1
  90. package/styles/drop-down-list/bootstrap.css +13 -1
  91. package/styles/drop-down-list/bootstrap4.css +13 -0
  92. package/styles/drop-down-list/bootstrap5-dark.css +13 -0
  93. package/styles/drop-down-list/bootstrap5.3.css +13 -0
  94. package/styles/drop-down-list/bootstrap5.css +13 -0
  95. package/styles/drop-down-list/fabric-dark.css +18 -1
  96. package/styles/drop-down-list/fabric.css +13 -1
  97. package/styles/drop-down-list/fluent-dark.css +13 -1
  98. package/styles/drop-down-list/fluent.css +13 -1
  99. package/styles/drop-down-list/fluent2.css +13 -1
  100. package/styles/drop-down-list/highcontrast-light.css +9 -1
  101. package/styles/drop-down-list/highcontrast.css +19 -1
  102. package/styles/drop-down-list/icons/_bootstrap-dark.scss +4 -0
  103. package/styles/drop-down-list/icons/_bootstrap.scss +4 -0
  104. package/styles/drop-down-list/icons/_bootstrap4.scss +4 -0
  105. package/styles/drop-down-list/icons/_bootstrap5.3.scss +4 -0
  106. package/styles/drop-down-list/icons/_bootstrap5.scss +4 -0
  107. package/styles/drop-down-list/icons/_fabric-dark.scss +4 -0
  108. package/styles/drop-down-list/icons/_fabric.scss +4 -0
  109. package/styles/drop-down-list/icons/_fluent.scss +4 -0
  110. package/styles/drop-down-list/icons/_fluent2.scss +4 -0
  111. package/styles/drop-down-list/icons/_highcontrast.scss +4 -0
  112. package/styles/drop-down-list/icons/_material-dark.scss +4 -0
  113. package/styles/drop-down-list/icons/_material.scss +4 -0
  114. package/styles/drop-down-list/icons/_material3.scss +4 -0
  115. package/styles/drop-down-list/icons/_tailwind.scss +4 -0
  116. package/styles/drop-down-list/icons/_tailwind3.scss +14 -0
  117. package/styles/drop-down-list/material-dark.css +18 -1
  118. package/styles/drop-down-list/material.css +13 -1
  119. package/styles/drop-down-list/material3-dark.css +13 -1
  120. package/styles/drop-down-list/material3.css +13 -1
  121. package/styles/drop-down-list/tailwind-dark.css +13 -1
  122. package/styles/drop-down-list/tailwind.css +13 -1
  123. package/styles/drop-down-list/tailwind3.css +455 -0
  124. package/styles/drop-down-list/tailwind3.scss +10 -0
  125. package/styles/drop-down-tree/_bigger.scss +41 -7
  126. package/styles/drop-down-tree/_layout.scss +34 -10
  127. package/styles/drop-down-tree/_tailwind3-definition.scss +67 -0
  128. package/styles/drop-down-tree/_theme.scss +3 -3
  129. package/styles/drop-down-tree/bds.css +712 -0
  130. package/styles/drop-down-tree/bds.scss +10 -0
  131. package/styles/drop-down-tree/bootstrap5.3.css +0 -3
  132. package/styles/drop-down-tree/icons/_tailwind3.scss +11 -0
  133. package/styles/drop-down-tree/tailwind3.css +512 -0
  134. package/styles/drop-down-tree/tailwind3.scss +10 -0
  135. package/styles/fabric-dark-lite.css +40 -1
  136. package/styles/fabric-dark.css +40 -1
  137. package/styles/fabric-lite.css +30 -1
  138. package/styles/fabric.css +30 -1
  139. package/styles/fluent-dark-lite.css +30 -1
  140. package/styles/fluent-dark.css +30 -1
  141. package/styles/fluent-lite.css +30 -1
  142. package/styles/fluent.css +30 -1
  143. package/styles/fluent2-lite.css +45 -12
  144. package/styles/fluent2.css +45 -12
  145. package/styles/highcontrast-light-lite.css +22 -1
  146. package/styles/highcontrast-light.css +22 -1
  147. package/styles/highcontrast-lite.css +41 -1
  148. package/styles/highcontrast.css +41 -1
  149. package/styles/list-box/_bigger.scss +18 -1
  150. package/styles/list-box/_layout.scss +29 -3
  151. package/styles/list-box/_tailwind3-definition.scss +123 -0
  152. package/styles/list-box/_theme.scss +11 -0
  153. package/styles/list-box/bds.css +971 -0
  154. package/styles/list-box/bds.scss +6 -0
  155. package/styles/list-box/fluent2.css +1 -1
  156. package/styles/list-box/icons/_tailwind3.scss +25 -0
  157. package/styles/list-box/tailwind3.css +991 -0
  158. package/styles/list-box/tailwind3.scss +6 -0
  159. package/styles/material-dark-lite.css +40 -1
  160. package/styles/material-dark.css +40 -1
  161. package/styles/material-lite.css +30 -1
  162. package/styles/material.css +30 -1
  163. package/styles/material3-dark-lite.css +36 -9
  164. package/styles/material3-dark.css +36 -9
  165. package/styles/material3-lite.css +36 -9
  166. package/styles/material3.css +36 -9
  167. package/styles/mention/_tailwind3-definition.scss +1 -0
  168. package/styles/mention/bds.css +78 -0
  169. package/styles/mention/bds.scss +6 -0
  170. package/styles/mention/tailwind3.css +67 -0
  171. package/styles/mention/tailwind3.scss +6 -0
  172. package/styles/multi-select/_bigger.scss +2 -2
  173. package/styles/multi-select/_bootstrap-dark-definition.scss +1 -1
  174. package/styles/multi-select/_layout.scss +27 -2
  175. package/styles/multi-select/_material3-definition.scss +2 -2
  176. package/styles/multi-select/_tailwind3-definition.scss +227 -0
  177. package/styles/multi-select/_theme.scss +1 -1
  178. package/styles/multi-select/bds.css +1575 -0
  179. package/styles/multi-select/bds.scss +10 -0
  180. package/styles/multi-select/bootstrap-dark.css +19 -1
  181. package/styles/multi-select/bootstrap.css +13 -0
  182. package/styles/multi-select/bootstrap4.css +13 -0
  183. package/styles/multi-select/bootstrap5-dark.css +13 -0
  184. package/styles/multi-select/bootstrap5.3.css +13 -0
  185. package/styles/multi-select/bootstrap5.css +13 -0
  186. package/styles/multi-select/fabric-dark.css +18 -0
  187. package/styles/multi-select/fabric.css +13 -0
  188. package/styles/multi-select/fluent-dark.css +13 -0
  189. package/styles/multi-select/fluent.css +13 -0
  190. package/styles/multi-select/fluent2.css +22 -5
  191. package/styles/multi-select/highcontrast-light.css +9 -0
  192. package/styles/multi-select/highcontrast.css +18 -0
  193. package/styles/multi-select/icons/_bootstrap-dark.scss +4 -0
  194. package/styles/multi-select/icons/_bootstrap.scss +4 -0
  195. package/styles/multi-select/icons/_bootstrap4.scss +4 -0
  196. package/styles/multi-select/icons/_bootstrap5.3.scss +4 -0
  197. package/styles/multi-select/icons/_bootstrap5.scss +4 -0
  198. package/styles/multi-select/icons/_fabric-dark.scss +4 -0
  199. package/styles/multi-select/icons/_fabric.scss +4 -0
  200. package/styles/multi-select/icons/_fluent.scss +4 -0
  201. package/styles/multi-select/icons/_fluent2.scss +4 -0
  202. package/styles/multi-select/icons/_highcontrast.scss +4 -0
  203. package/styles/multi-select/icons/_material-dark.scss +4 -0
  204. package/styles/multi-select/icons/_material.scss +4 -0
  205. package/styles/multi-select/icons/_material3.scss +4 -0
  206. package/styles/multi-select/icons/_tailwind.scss +4 -0
  207. package/styles/multi-select/icons/_tailwind3.scss +26 -0
  208. package/styles/multi-select/material-dark.css +18 -0
  209. package/styles/multi-select/material.css +13 -0
  210. package/styles/multi-select/material3-dark.css +19 -8
  211. package/styles/multi-select/material3.css +19 -8
  212. package/styles/multi-select/tailwind-dark.css +13 -0
  213. package/styles/multi-select/tailwind.css +13 -0
  214. package/styles/multi-select/tailwind3.css +1398 -0
  215. package/styles/multi-select/tailwind3.scss +10 -0
  216. package/styles/tailwind-dark-lite.css +30 -1
  217. package/styles/tailwind-dark.css +30 -1
  218. package/styles/tailwind-lite.css +30 -1
  219. package/styles/tailwind.css +30 -1
  220. package/styles/tailwind3-lite.css +2889 -0
  221. package/styles/tailwind3-lite.scss +28 -0
  222. package/styles/tailwind3.css +3550 -0
  223. package/styles/tailwind3.scss +33 -0
@@ -0,0 +1,10 @@
1
+ @import 'ej2-base/styles/definition/bds.scss';
2
+ @import 'ej2-inputs/styles/input/bds-definition.scss';
3
+ @import 'ej2-popups/styles/popup/bds-definition.scss';
4
+ @import 'ej2-popups/styles/spinner/bds-definition.scss';
5
+ @import 'ej2-navigations/styles/treeview/bds-definition.scss';
6
+ @import '../drop-down-base/bds-definition.scss';
7
+ @import 'bds-definition.scss';
8
+ @import 'icons/bds.scss';
9
+ @import 'all.scss';
10
+ @import 'bigger.scss';
@@ -148,9 +148,6 @@
148
148
  .e-ddt.e-show-chip .e-chips-close::before {
149
149
  font-size: 10px;
150
150
  }
151
- .e-ddt.e-show-chip .e-chips-close::before {
152
- vertical-align: middle;
153
- }
154
151
  .e-ddt.e-show-chip .e-chips {
155
152
  -webkit-box-align: center;
156
153
  -ms-flex-align: center;
@@ -0,0 +1,11 @@
1
+ @include export-module('dropdowntree-tailwind3-icons') {
2
+ .e-ddt {
3
+ .e-ddt-icon::before {
4
+ content: '\e729';
5
+ }
6
+
7
+ .e-chips-close::before {
8
+ content: '\e7e7';
9
+ }
10
+ }
11
+ }
@@ -0,0 +1,512 @@
1
+
2
+
3
+
4
+
5
+ /* stylelint-disable property-no-vendor-prefix */
6
+ /* stylelint-disable */
7
+ .e-filled.e-float-input.e-error label.e-float-text,
8
+ .e-filled.e-float-input.e-control-wrapper.e-error label.e-float-text,
9
+ .e-filled.e-float-input.e-error input:focus ~ label.e-float-text,
10
+ .e-filled.e-float-input.e-control-wrapper.e-error input:focus ~ label.e-float-text,
11
+ .e-filled.e-float-input.e-error textarea:focus ~ label.e-float-text,
12
+ .e-filled.e-float-input.e-control-wrapper.e-error textarea:focus ~ label.e-float-text,
13
+ .e-filled.e-float-input.e-error.e-input-focus input ~ label.e-float-text,
14
+ .e-filled.e-float-input.e-control-wrapper.e-error.e-input-focus input ~ label.e-float-text {
15
+ color: var(--color-sf-danger) !important;
16
+ }
17
+
18
+ /* stylelint-disable-line no-empty-source */
19
+ /* stylelint-disable property-no-vendor-prefix */
20
+ @-webkit-keyframes material-spinner-rotate {
21
+ 0% {
22
+ -webkit-transform: rotate(0);
23
+ transform: rotate(0);
24
+ }
25
+ 100% {
26
+ -webkit-transform: rotate(360deg);
27
+ transform: rotate(360deg);
28
+ }
29
+ }
30
+ @keyframes material-spinner-rotate {
31
+ 0% {
32
+ -webkit-transform: rotate(0);
33
+ transform: rotate(0);
34
+ }
35
+ 100% {
36
+ -webkit-transform: rotate(360deg);
37
+ transform: rotate(360deg);
38
+ }
39
+ }
40
+ @-webkit-keyframes fabric-spinner-rotate {
41
+ 0% {
42
+ -webkit-transform: rotate(0);
43
+ transform: rotate(0);
44
+ }
45
+ 100% {
46
+ -webkit-transform: rotate(360deg);
47
+ transform: rotate(360deg);
48
+ }
49
+ }
50
+ @keyframes fabric-spinner-rotate {
51
+ 0% {
52
+ -webkit-transform: rotate(0);
53
+ transform: rotate(0);
54
+ }
55
+ 100% {
56
+ -webkit-transform: rotate(360deg);
57
+ transform: rotate(360deg);
58
+ }
59
+ }
60
+ /*! TreeView's bootstrap5 theme wise override definitions and variables */
61
+ /* stylelint-disable */
62
+ .e-dropdownbase .e-list-group-item,
63
+ .e-fixed-head {
64
+ font-size: 12px;
65
+ }
66
+
67
+ .e-small .e-dropdownbase .e-list-group-item,
68
+ .e-small .e-fixed-head,
69
+ .e-small.e-dropdownbase .e-list-group-item,
70
+ .e-small.e-fixed-head {
71
+ font-size: 10px;
72
+ }
73
+
74
+ .e-dropdownbase .e-list-item .e-list-icon {
75
+ padding: 0 8px 0 0;
76
+ }
77
+
78
+ .e-small .e-dropdownbase .e-list-item .e-list-icon {
79
+ padding: 0 6px 0 0;
80
+ }
81
+
82
+ /* stylelint-disable */
83
+ .e-ddt .e-ddt-icon::before {
84
+ content: "\e729";
85
+ }
86
+ .e-ddt .e-chips-close::before {
87
+ content: "\e7e7";
88
+ }
89
+
90
+ .e-ddt {
91
+ cursor: pointer;
92
+ outline: none;
93
+ }
94
+ .e-ddt .e-ddt-icon::before {
95
+ -webkit-transform: rotate(0deg);
96
+ transform: rotate(0deg);
97
+ -webkit-transition: -webkit-transform 300ms ease;
98
+ transition: -webkit-transform 300ms ease;
99
+ transition: transform 300ms ease;
100
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
101
+ }
102
+ .e-ddt.e-icon-anim .e-ddt-icon::before {
103
+ -webkit-transform: rotate(180deg);
104
+ transform: rotate(180deg);
105
+ -webkit-transition: -webkit-transform 300ms ease;
106
+ transition: -webkit-transform 300ms ease;
107
+ transition: transform 300ms ease;
108
+ transition: transform 300ms ease, -webkit-transform 300ms ease;
109
+ }
110
+ .e-ddt .e-ddt-hidden {
111
+ border: 0;
112
+ height: 0;
113
+ visibility: hidden;
114
+ width: 0;
115
+ }
116
+ .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper .e-clear-icon {
117
+ -webkit-box-sizing: content-box;
118
+ box-sizing: content-box;
119
+ }
120
+ .e-ddt.e-input-group.e-control-wrapper .e-input-group-icon.e-ddt-icon, .e-ddt.e-float-input.e-control-wrapper .e-input-group-icon.e-ddt-icon {
121
+ border: 0;
122
+ }
123
+ .e-ddt.e-input-group.e-control-wrapper .e-icon-hide, .e-ddt.e-float-input.e-control-wrapper .e-icon-hide {
124
+ display: none;
125
+ }
126
+ .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-input-group.e-control-wrapper.e-show-text .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-text .e-clear-icon {
127
+ bottom: 0;
128
+ position: absolute;
129
+ right: 0;
130
+ }
131
+ .e-ddt.e-input-group.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-ddt.e-input-group.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon {
132
+ right: 30px;
133
+ }
134
+ .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-input-group.e-control-wrapper.e-show-text .e-ddt-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-float-input.e-control-wrapper.e-show-text .e-ddt-icon {
135
+ bottom: 0;
136
+ position: absolute;
137
+ right: 0;
138
+ }
139
+ .e-ddt.e-input-group.e-control-wrapper.e-show-chip.e-input-focus input.e-dropdowntree.e-chip-input,
140
+ .e-ddt.e-input-group.e-control-wrapper.e-show-chip input.e-dropdowntree.e-chip-input, .e-ddt.e-input-group.e-control-wrapper.e-show-text.e-input-focus input.e-dropdowntree.e-chip-input,
141
+ .e-ddt.e-input-group.e-control-wrapper.e-show-text input.e-dropdowntree.e-chip-input, .e-ddt.e-float-input.e-control-wrapper.e-show-chip.e-input-focus input.e-dropdowntree.e-chip-input,
142
+ .e-ddt.e-float-input.e-control-wrapper.e-show-chip input.e-dropdowntree.e-chip-input, .e-ddt.e-float-input.e-control-wrapper.e-show-text.e-input-focus input.e-dropdowntree.e-chip-input,
143
+ .e-ddt.e-float-input.e-control-wrapper.e-show-text input.e-dropdowntree.e-chip-input {
144
+ padding-left: 0;
145
+ padding-right: 0;
146
+ }
147
+ .e-ddt.e-input-group.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon, .e-ddt.e-float-input.e-control-wrapper.e-valid-input:hover:not(.e-disabled) .e-clear-icon {
148
+ display: -webkit-box;
149
+ display: -ms-flexbox;
150
+ display: flex;
151
+ }
152
+ .e-ddt .e-chips-wrapper {
153
+ width: 100%;
154
+ margin: 2px 0 2px 6px;
155
+ }
156
+ .e-ddt.e-show-chip .e-chips-close {
157
+ min-height: 14px;
158
+ min-width: 14px;
159
+ line-height: 14px;
160
+ text-align: center;
161
+ }
162
+ .e-ddt.e-show-chip .e-chips-close::before {
163
+ font-size: 14px;
164
+ }
165
+ .e-ddt.e-show-chip .e-chips-close::before {
166
+ vertical-align: middle;
167
+ }
168
+ .e-ddt.e-show-chip .e-chips {
169
+ -webkit-box-align: center;
170
+ -ms-flex-align: center;
171
+ align-items: center;
172
+ border-radius: 6px;
173
+ -webkit-box-sizing: border-box;
174
+ box-sizing: border-box;
175
+ display: -webkit-inline-box;
176
+ display: -ms-inline-flexbox;
177
+ display: inline-flex;
178
+ float: left;
179
+ height: 24px;
180
+ margin: 2px;
181
+ max-width: calc(100% - 2px);
182
+ overflow: hidden;
183
+ padding: 0 8px 0 8px;
184
+ text-overflow: ellipsis;
185
+ white-space: nowrap;
186
+ border: 1px solid var(--color-sf-border-light);
187
+ }
188
+ .e-ddt.e-show-chip .e-chips > .e-chipcontent {
189
+ max-width: 100%;
190
+ overflow: hidden;
191
+ padding: 4px 5px 4px 0;
192
+ text-indent: 0;
193
+ text-overflow: ellipsis;
194
+ white-space: nowrap;
195
+ font-size: 12px;
196
+ line-height: 16px;
197
+ font-weight: 500;
198
+ }
199
+ .e-ddt .e-overflow {
200
+ white-space: nowrap;
201
+ }
202
+ .e-ddt .e-overflow.e-show-text {
203
+ padding: 5px 8px;
204
+ }
205
+ .e-ddt .e-overflow.e-total-count {
206
+ -webkit-box-sizing: border-box;
207
+ box-sizing: border-box;
208
+ display: inline-block;
209
+ overflow: hidden;
210
+ text-overflow: ellipsis;
211
+ }
212
+ .e-ddt .e-overflow.e-total-count .e-remain {
213
+ padding: 0 8px 0 0;
214
+ }
215
+ .e-ddt .e-overflow .e-remain {
216
+ cursor: pointer;
217
+ display: inline-block;
218
+ font-size: 14px;
219
+ padding: 0 0 0 8px;
220
+ }
221
+ .e-ddt .e-overflow .e-remain.e-wrap-count {
222
+ padding: 5px 4px;
223
+ }
224
+ .e-ddt.e-show-chip .e-overflow.e-total-count .e-remain {
225
+ padding: 5px 8px;
226
+ }
227
+ .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
228
+ margin-right: 30px;
229
+ max-width: calc(100% - 31px);
230
+ }
231
+ .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child {
232
+ margin-right: 20px;
233
+ max-width: calc(100% - 31px);
234
+ }
235
+ .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
236
+ margin-right: 48px;
237
+ max-width: calc(100% - 62px);
238
+ }
239
+ .e-ddt input[readonly],
240
+ .e-ddt .e-dropdowntree,
241
+ .e-ddt input[readonly].e-input {
242
+ pointer-events: none;
243
+ }
244
+ .e-ddt input[readonly].e-chip-input,
245
+ .e-ddt .e-dropdowntree.e-chip-input,
246
+ .e-ddt input[readonly].e-input.e-chip-input {
247
+ width: 0;
248
+ visibility: hidden;
249
+ }
250
+ .e-ddt.e-popup {
251
+ border: 1px solid var(--color-sf-flyout-border);
252
+ margin-top: 4px;
253
+ border-radius: 6px;
254
+ -webkit-box-shadow: none;
255
+ box-shadow: none;
256
+ position: absolute;
257
+ }
258
+ .e-ddt.e-popup .e-selectall-parent {
259
+ border-bottom: 1px solid;
260
+ cursor: pointer;
261
+ display: block;
262
+ line-height: 34px;
263
+ overflow: hidden;
264
+ position: relative;
265
+ text-indent: 36px;
266
+ white-space: nowrap;
267
+ width: 100%;
268
+ }
269
+ .e-ddt.e-popup .e-selectall-parent.e-hide-selectall {
270
+ display: none;
271
+ }
272
+ .e-ddt.e-popup .e-selectall-parent .e-checkbox-wrapper {
273
+ position: relative;
274
+ text-indent: 0;
275
+ bottom: 2px;
276
+ }
277
+ .e-ddt.e-popup .e-selectall-parent .e-all-text {
278
+ font-family: inherit;
279
+ font-size: 14px;
280
+ margin: 0 8px;
281
+ }
282
+ .e-ddt.e-popup .e-filter-wrap {
283
+ border-top-width: 0;
284
+ display: block;
285
+ padding: 6px 7px;
286
+ border: none;
287
+ }
288
+ .e-ddt.e-popup .e-filter-wrap .e-input-group {
289
+ margin-bottom: 0;
290
+ }
291
+ .e-ddt.e-popup .e-popup-content {
292
+ overflow: auto;
293
+ position: relative;
294
+ }
295
+ .e-ddt.e-popup .e-popup-content .e-ddt-nodata {
296
+ display: none;
297
+ }
298
+ .e-ddt.e-popup .e-popup-content.e-no-data {
299
+ cursor: default;
300
+ font-family: inherit;
301
+ font-size: 14px;
302
+ text-align: center;
303
+ padding: 14px 16px;
304
+ }
305
+ .e-ddt.e-popup .e-popup-content.e-no-data .e-treeview {
306
+ display: none;
307
+ }
308
+ .e-ddt.e-popup .e-popup-content.e-no-data .e-ddt-nodata {
309
+ display: block;
310
+ }
311
+ .e-ddt.e-popup .e-treeview {
312
+ display: inline-table;
313
+ width: 100%;
314
+ border: none;
315
+ }
316
+ .e-ddt.e-popup .e-treeview .e-list-item {
317
+ padding: 0;
318
+ }
319
+ .e-ddt.e-popup .e-treeview .e-list-item .e-ul {
320
+ margin: 0;
321
+ padding: 0 0 0 14px;
322
+ }
323
+ .e-ddt.e-popup .e-treeview > .e-ul {
324
+ overflow: hidden;
325
+ padding: 6px 8px;
326
+ }
327
+ .e-ddt.e-popup .e-ddt-footer,
328
+ .e-ddt.e-popup .e-ddt-header {
329
+ cursor: default;
330
+ }
331
+ .e-ddt.e-rtl.e-show-chip .e-chips {
332
+ float: right;
333
+ }
334
+ .e-ddt.e-rtl.e-show-chip .e-overflow .e-remain, .e-ddt.e-rtl.e-show-text .e-overflow .e-remain {
335
+ padding: 0 8px 0 0;
336
+ }
337
+ .e-ddt.e-rtl.e-show-chip .e-overflow .e-remain.e-wrap-count, .e-ddt.e-rtl.e-show-text .e-overflow .e-remain.e-wrap-count {
338
+ padding-top: 0;
339
+ }
340
+ .e-ddt.e-rtl.e-show-chip .e-overflow.e-wrap-count, .e-ddt.e-rtl.e-show-text .e-overflow.e-wrap-count {
341
+ position: absolute;
342
+ right: auto;
343
+ }
344
+ .e-ddt.e-rtl.e-show-text .e-overflow.e-total-count .e-remain {
345
+ padding: 0 0 0 8px;
346
+ }
347
+ .e-ddt.e-rtl.e-show-chip .e-overflow.e-total-count .e-remain {
348
+ padding: 5px 8px;
349
+ }
350
+ .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
351
+ margin-right: 1px;
352
+ margin-left: 30px;
353
+ }
354
+ .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
355
+ margin-right: 1px;
356
+ margin-left: 20px;
357
+ }
358
+ .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
359
+ margin-right: 1px;
360
+ margin-left: 48px;
361
+ }
362
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-clear-icon,
363
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-text .e-clear-icon,
364
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-text .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-clear-icon,
365
+ .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-text .e-clear-icon,
366
+ .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-text .e-ddt-icon {
367
+ left: 0;
368
+ right: auto;
369
+ }
370
+ .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-ddt.e-rtl.e-input-group.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-ddt.e-rtl.e-float-input.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon {
371
+ left: 30px;
372
+ }
373
+ .e-ddt.e-rtl.e-popup .e-treeview .e-list-item .e-ul {
374
+ padding: 0 14px 0 0;
375
+ }
376
+
377
+ .e-ddt-icon-hide {
378
+ display: none;
379
+ }
380
+
381
+ .e-ddt .e-chips {
382
+ background-color: var(--color-sf-secondary-bg-color);
383
+ }
384
+ .e-ddt .e-chips .e-chips-close::before {
385
+ color: var(--color-sf-icon-color);
386
+ }
387
+ .e-ddt .e-chips > .e-chipcontent {
388
+ color: var(--color-sf-content-text-color);
389
+ }
390
+ .e-ddt .e-overflow .e-remain {
391
+ color: var(--color-sf-content-text-color-alt1);
392
+ }
393
+ .e-ddt.e-input-group.e-control-wrapper .e-input[readonly], .e-ddt.e-float-input.e-control-wrapper input[readonly] {
394
+ background: transparent;
395
+ }
396
+ .e-ddt.e-popup {
397
+ background: var(--color-sf-flyout-bg-color);
398
+ border-color: var(--color-sf-flyout-border);
399
+ }
400
+ .e-ddt.e-popup .e-popup-content.e-no-data {
401
+ color: var(--color-sf-content-text-color);
402
+ }
403
+ .e-ddt.e-popup .e-selectall-parent {
404
+ border-bottom-color: var(--color-sf-border-light);
405
+ }
406
+ .e-ddt.e-popup .e-selectall-parent:focus {
407
+ background: var(--color-sf-content-bg-color-hover);
408
+ }
409
+ .e-ddt.e-popup .e-selectall-parent .e-all-text {
410
+ color: var(--color-sf-content-text-color);
411
+ }
412
+
413
+ .e-bigger .e-ddt .e-chips,
414
+ .e-ddt.e-bigger .e-chips {
415
+ height: 32px;
416
+ }
417
+ .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon,
418
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon,
419
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon,
420
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-chip.e-show-dd-icon .e-clear-icon,
421
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-text.e-show-dd-icon .e-clear-icon {
422
+ bottom: auto;
423
+ right: 36px;
424
+ bottom: 0;
425
+ right: 24px;
426
+ }
427
+ .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon, .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-text .e-ddt-icon, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-text .e-ddt-icon,
428
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-chip .e-ddt-icon,
429
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-text .e-ddt-icon,
430
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-chip .e-ddt-icon,
431
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-text .e-ddt-icon {
432
+ bottom: 0;
433
+ }
434
+ .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-chips > .e-chipcontent, .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-text .e-chips > .e-chipcontent, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-chips > .e-chipcontent, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-text .e-chips > .e-chipcontent,
435
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-chip .e-chips > .e-chipcontent,
436
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-text .e-chips > .e-chipcontent,
437
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-chip .e-chips > .e-chipcontent,
438
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-text .e-chips > .e-chipcontent {
439
+ height: 20px;
440
+ font-size: 14px;
441
+ line-height: 20px;
442
+ padding: 0 6px 0 4px;
443
+ }
444
+ .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-chip .e-chips-close, .e-bigger .e-ddt.e-input-group.e-control-wrapper.e-show-text .e-chips-close, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-chip .e-chips-close, .e-bigger .e-ddt.e-float-input.e-control-wrapper.e-show-text .e-chips-close,
445
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-chip .e-chips-close,
446
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper.e-show-text .e-chips-close,
447
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-chip .e-chips-close,
448
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper.e-show-text .e-chips-close {
449
+ margin: 0 6px 2px 0;
450
+ }
451
+ .e-bigger .e-ddt.e-input-group.e-control-wrapper .e-clear-icon, .e-bigger .e-ddt.e-float-input.e-control-wrapper .e-clear-icon,
452
+ .e-ddt.e-bigger.e-input-group.e-control-wrapper .e-clear-icon,
453
+ .e-ddt.e-bigger.e-float-input.e-control-wrapper .e-clear-icon {
454
+ min-height: 24px;
455
+ }
456
+ .e-bigger .e-ddt.e-show-chip .e-chips-close,
457
+ .e-ddt.e-bigger.e-show-chip .e-chips-close {
458
+ height: 16px;
459
+ width: 16px;
460
+ }
461
+ .e-bigger .e-ddt.e-show-chip .e-chips-close::before,
462
+ .e-ddt.e-bigger.e-show-chip .e-chips-close::before {
463
+ font-size: 16px;
464
+ }
465
+ .e-bigger .e-ddt .e-overflow.e-show-text,
466
+ .e-ddt.e-bigger .e-overflow.e-show-text {
467
+ padding: 6px 12px;
468
+ }
469
+ .e-bigger .e-ddt.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
470
+ .e-ddt.e-bigger.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
471
+ max-width: calc(100% - 37px);
472
+ }
473
+ .e-bigger .e-ddt.e-show-clear .e-chips-wrapper .e-chips:last-child,
474
+ .e-ddt.e-bigger.e-show-clear .e-chips-wrapper .e-chips:last-child {
475
+ max-width: calc(100% - 37px);
476
+ }
477
+ .e-bigger .e-ddt.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
478
+ .e-ddt.e-bigger.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
479
+ margin-right: 52px;
480
+ max-width: calc(100% - 73px);
481
+ }
482
+ .e-bigger .e-ddt.e-popup,
483
+ .e-ddt.e-bigger.e-popup {
484
+ border-radius: 8px;
485
+ margin-top: 8px;
486
+ }
487
+ .e-bigger .e-ddt.e-popup .e-selectall-parent,
488
+ .e-ddt.e-bigger.e-popup .e-selectall-parent {
489
+ text-indent: 50px;
490
+ }
491
+ .e-bigger .e-ddt.e-popup .e-filter-wrap,
492
+ .e-ddt.e-bigger.e-popup .e-filter-wrap {
493
+ padding: 8px 9px;
494
+ }
495
+ .e-bigger .e-ddt.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
496
+ .e-ddt.e-bigger.e-rtl.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
497
+ margin-right: 4px;
498
+ }
499
+ .e-bigger .e-ddt.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child,
500
+ .e-ddt.e-bigger.e-rtl.e-show-clear .e-chips-wrapper .e-chips:last-child {
501
+ margin-right: 4px;
502
+ }
503
+ .e-bigger .e-ddt.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child,
504
+ .e-ddt.e-bigger.e-rtl.e-show-clear.e-show-dd-icon .e-chips-wrapper .e-chips:last-child {
505
+ margin-right: 52px;
506
+ margin-left: 1px;
507
+ }
508
+ .e-bigger .e-ddt.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon, .e-bigger .e-ddt.e-rtl.e-show-text.e-input-group.e-show-dd-icon .e-clear-icon,
509
+ .e-ddt.e-bigger.e-rtl.e-show-chip.e-input-group.e-show-dd-icon .e-clear-icon,
510
+ .e-ddt.e-bigger.e-rtl.e-show-text.e-input-group.e-show-dd-icon .e-clear-icon {
511
+ right: auto;
512
+ }
@@ -0,0 +1,10 @@
1
+ @import 'ej2-base/styles/definition/tailwind3.scss';
2
+ @import 'ej2-inputs/styles/input/tailwind3-definition.scss';
3
+ @import 'ej2-popups/styles/popup/tailwind3-definition.scss';
4
+ @import 'ej2-popups/styles/spinner/tailwind3-definition.scss';
5
+ @import 'ej2-navigations/styles/treeview/tailwind3-definition.scss';
6
+ @import '../drop-down-base/tailwind3-definition.scss';
7
+ @import 'tailwind3-definition.scss';
8
+ @import 'icons/tailwind3.scss';
9
+ @import 'all.scss';
10
+ @import 'bigger.scss';
@@ -66,6 +66,10 @@
66
66
  position: absolute;
67
67
  }
68
68
 
69
+ .e-mention.e-popup .e-dropdownbase {
70
+ min-height: 36px;
71
+ }
72
+
69
73
  .e-mention .e-dropdownbase .e-list-item .e-highlight {
70
74
  display: inline;
71
75
  font-weight: bold;
@@ -388,6 +392,10 @@
388
392
  font-family: "e-icons";
389
393
  }
390
394
 
395
+ .e-ddl.e-popup.e-resize .e-icons.e-resizer-right::before {
396
+ content: "\eb06";
397
+ }
398
+
391
399
  .e-popup.e-wide-popup.e-ddl-device.e-popup-close {
392
400
  display: block;
393
401
  visibility: hidden;
@@ -586,6 +594,20 @@ ejs-dropdownlist {
586
594
  min-height: 33px;
587
595
  }
588
596
 
597
+ .e-ddl.e-popup.e-resize .e-resizer-right {
598
+ bottom: 0;
599
+ right: 0;
600
+ cursor: nwse-resize;
601
+ height: 15px;
602
+ position: absolute;
603
+ width: 15px;
604
+ }
605
+
606
+ .e-ddl.e-popup.e-resize .e-resizer-right {
607
+ background: transparent;
608
+ color: rgb(221, 218, 218);
609
+ }
610
+
589
611
  .e-popup {
590
612
  border-color: #414040;
591
613
  }
@@ -597,7 +619,6 @@ ejs-dropdownlist {
597
619
 
598
620
  .e-ddl.e-popup .e-filter-parent .e-input-group input.e-input-filter {
599
621
  border-color: transparent;
600
- background: none;
601
622
  }
602
623
 
603
624
  /* stylelint-disable */
@@ -990,6 +1011,10 @@ ejs-dropdownlist {
990
1011
  content: "";
991
1012
  }
992
1013
 
1014
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-icons.e-resizer-right::before {
1015
+ content: "\eb06";
1016
+ }
1017
+
993
1018
  .e-multi-select-wrapper {
994
1019
  -webkit-box-sizing: border-box;
995
1020
  box-sizing: border-box;
@@ -1746,6 +1771,20 @@ ejs-multiselect {
1746
1771
  cursor: pointer;
1747
1772
  }
1748
1773
 
1774
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1775
+ bottom: 0;
1776
+ right: 0;
1777
+ cursor: nwse-resize;
1778
+ height: 15px;
1779
+ position: absolute;
1780
+ width: 15px;
1781
+ }
1782
+
1783
+ .e-popup.e-multi-select-list-wrapper.e-resize .e-resizer-right {
1784
+ background: transparent;
1785
+ color: rgb(221, 218, 218);
1786
+ }
1787
+
1749
1788
  .e-multi-select-wrapper .e-chips.e-chip-selected .e-chips-close::before {
1750
1789
  color: #fff;
1751
1790
  }