@syncfusion/ej2-dropdowns 21.2.8 → 22.1.34

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 (162) hide show
  1. package/.eslintrc.json +1 -0
  2. package/CHANGELOG.md +35 -6
  3. package/README.md +201 -103
  4. package/dist/ej2-dropdowns.min.js +2 -2
  5. package/dist/ej2-dropdowns.umd.min.js +2 -2
  6. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  7. package/dist/es6/ej2-dropdowns.es2015.js +158 -41
  8. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  9. package/dist/es6/ej2-dropdowns.es5.js +158 -41
  10. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  11. package/dist/global/ej2-dropdowns.min.js +2 -2
  12. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  13. package/dist/global/index.d.ts +1 -1
  14. package/package.json +11 -11
  15. package/src/auto-complete/auto-complete-model.d.ts +2 -1
  16. package/src/auto-complete/auto-complete.d.ts +2 -1
  17. package/src/auto-complete/auto-complete.js +1 -1
  18. package/src/combo-box/combo-box-model.d.ts +6 -3
  19. package/src/combo-box/combo-box.d.ts +6 -3
  20. package/src/drop-down-base/drop-down-base-model.d.ts +8 -4
  21. package/src/drop-down-base/drop-down-base.d.ts +8 -4
  22. package/src/drop-down-base/drop-down-base.js +21 -7
  23. package/src/drop-down-list/drop-down-list-model.d.ts +6 -3
  24. package/src/drop-down-list/drop-down-list.d.ts +6 -3
  25. package/src/drop-down-list/drop-down-list.js +23 -14
  26. package/src/drop-down-tree/drop-down-tree-model.d.ts +21 -6
  27. package/src/drop-down-tree/drop-down-tree.d.ts +55 -62
  28. package/src/drop-down-tree/drop-down-tree.js +1 -1
  29. package/src/list-box/list-box.d.ts +15 -0
  30. package/src/list-box/list-box.js +53 -3
  31. package/src/mention/mention-model.d.ts +4 -2
  32. package/src/mention/mention.d.ts +4 -2
  33. package/src/multi-select/multi-select-model.d.ts +15 -8
  34. package/src/multi-select/multi-select.d.ts +15 -7
  35. package/src/multi-select/multi-select.js +59 -15
  36. package/styles/auto-complete/_material3-dark-definition.scss +1 -0
  37. package/styles/auto-complete/_material3-definition.scss +2 -0
  38. package/styles/auto-complete/material3-dark.css +198 -0
  39. package/styles/auto-complete/material3-dark.scss +5 -0
  40. package/styles/auto-complete/material3.css +254 -0
  41. package/styles/auto-complete/material3.scss +5 -0
  42. package/styles/bootstrap-dark.css +212 -100
  43. package/styles/bootstrap.css +214 -101
  44. package/styles/bootstrap4.css +214 -101
  45. package/styles/bootstrap5-dark.css +212 -100
  46. package/styles/bootstrap5.css +212 -100
  47. package/styles/combo-box/_material3-dark-definition.scss +1 -0
  48. package/styles/combo-box/_material3-definition.scss +2 -0
  49. package/styles/combo-box/material3-dark.css +198 -0
  50. package/styles/combo-box/material3-dark.scss +5 -0
  51. package/styles/combo-box/material3.css +254 -0
  52. package/styles/combo-box/material3.scss +5 -0
  53. package/styles/drop-down-base/_layout.scss +3 -1
  54. package/styles/drop-down-base/_material3-dark-definition.scss +1 -0
  55. package/styles/drop-down-base/_material3-definition.scss +87 -0
  56. package/styles/drop-down-base/_theme.scss +10 -0
  57. package/styles/drop-down-base/bootstrap-dark.css +4 -0
  58. package/styles/drop-down-base/bootstrap.css +4 -0
  59. package/styles/drop-down-base/bootstrap4.css +4 -0
  60. package/styles/drop-down-base/bootstrap5-dark.css +4 -0
  61. package/styles/drop-down-base/bootstrap5.css +4 -0
  62. package/styles/drop-down-base/fabric-dark.css +4 -0
  63. package/styles/drop-down-base/fabric.css +4 -0
  64. package/styles/drop-down-base/fluent-dark.css +4 -0
  65. package/styles/drop-down-base/fluent.css +4 -0
  66. package/styles/drop-down-base/highcontrast-light.css +4 -0
  67. package/styles/drop-down-base/highcontrast.css +4 -0
  68. package/styles/drop-down-base/material-dark.css +4 -0
  69. package/styles/drop-down-base/material.css +4 -0
  70. package/styles/drop-down-base/material3-dark.css +439 -0
  71. package/styles/drop-down-base/material3-dark.scss +4 -0
  72. package/styles/drop-down-base/material3.css +495 -0
  73. package/styles/drop-down-base/material3.scss +4 -0
  74. package/styles/drop-down-base/tailwind-dark.css +4 -0
  75. package/styles/drop-down-base/tailwind.css +4 -0
  76. package/styles/drop-down-list/_layout.scss +15 -1
  77. package/styles/drop-down-list/_material3-dark-definition.scss +1 -0
  78. package/styles/drop-down-list/_material3-definition.scss +180 -0
  79. package/styles/drop-down-list/icons/_material3-dark.scss +1 -0
  80. package/styles/drop-down-list/material3-dark.css +503 -0
  81. package/styles/drop-down-list/material3-dark.scss +9 -0
  82. package/styles/drop-down-list/material3.css +559 -0
  83. package/styles/drop-down-list/material3.scss +9 -0
  84. package/styles/drop-down-tree/_layout.scss +13 -7
  85. package/styles/drop-down-tree/_material3-dark-definition.scss +1 -0
  86. package/styles/drop-down-tree/_material3-definition.scss +76 -0
  87. package/styles/drop-down-tree/_theme.scss +14 -2
  88. package/styles/drop-down-tree/icons/_material3-dark.scss +1 -0
  89. package/styles/drop-down-tree/icons/_material3.scss +1 -1
  90. package/styles/drop-down-tree/material3-dark.css +466 -0
  91. package/styles/drop-down-tree/material3-dark.scss +10 -0
  92. package/styles/drop-down-tree/material3.css +522 -0
  93. package/styles/drop-down-tree/material3.scss +10 -0
  94. package/styles/fabric-dark.css +212 -100
  95. package/styles/fabric.css +214 -101
  96. package/styles/fluent-dark.css +214 -101
  97. package/styles/fluent.css +214 -101
  98. package/styles/highcontrast-light.css +212 -100
  99. package/styles/highcontrast.css +214 -101
  100. package/styles/list-box/_layout.scss +17 -3
  101. package/styles/list-box/_material3-dark-definition.scss +1 -0
  102. package/styles/list-box/_material3-definition.scss +117 -0
  103. package/styles/list-box/_theme.scss +2 -1
  104. package/styles/list-box/bootstrap-dark.css +207 -99
  105. package/styles/list-box/bootstrap.css +209 -100
  106. package/styles/list-box/bootstrap4.css +209 -100
  107. package/styles/list-box/bootstrap5-dark.css +207 -99
  108. package/styles/list-box/bootstrap5.css +207 -99
  109. package/styles/list-box/fabric-dark.css +207 -99
  110. package/styles/list-box/fabric.css +209 -100
  111. package/styles/list-box/fluent-dark.css +209 -100
  112. package/styles/list-box/fluent.css +209 -100
  113. package/styles/list-box/highcontrast-light.css +207 -99
  114. package/styles/list-box/highcontrast.css +209 -100
  115. package/styles/list-box/icons/_material3-dark.scss +1 -0
  116. package/styles/list-box/material-dark.css +207 -99
  117. package/styles/list-box/material.css +209 -100
  118. package/styles/list-box/material3-dark.css +956 -0
  119. package/styles/list-box/material3-dark.scss +6 -0
  120. package/styles/list-box/material3.css +1012 -0
  121. package/styles/list-box/material3.scss +6 -0
  122. package/styles/list-box/tailwind-dark.css +209 -100
  123. package/styles/list-box/tailwind.css +209 -100
  124. package/styles/material-dark.css +212 -100
  125. package/styles/material.css +214 -101
  126. package/styles/material3-dark.css +4664 -0
  127. package/styles/material3-dark.scss +10 -0
  128. package/styles/material3.css +4720 -0
  129. package/styles/material3.scss +10 -0
  130. package/styles/mention/_material3-dark-definition.scss +1 -0
  131. package/styles/mention/_material3-definition.scss +1 -0
  132. package/styles/mention/material3-dark.css +87 -0
  133. package/styles/mention/material3-dark.scss +7 -0
  134. package/styles/mention/material3.css +143 -0
  135. package/styles/mention/material3.scss +7 -0
  136. package/styles/multi-select/_layout.scss +160 -7
  137. package/styles/multi-select/_material3-dark-definition.scss +1 -0
  138. package/styles/multi-select/_material3-definition.scss +246 -0
  139. package/styles/multi-select/_theme.scss +6 -0
  140. package/styles/multi-select/bootstrap-dark.css +1 -1
  141. package/styles/multi-select/bootstrap.css +1 -1
  142. package/styles/multi-select/bootstrap4.css +1 -1
  143. package/styles/multi-select/bootstrap5-dark.css +1 -1
  144. package/styles/multi-select/bootstrap5.css +1 -1
  145. package/styles/multi-select/fabric-dark.css +1 -1
  146. package/styles/multi-select/fabric.css +1 -1
  147. package/styles/multi-select/fluent-dark.css +1 -1
  148. package/styles/multi-select/fluent.css +1 -1
  149. package/styles/multi-select/highcontrast-light.css +1 -1
  150. package/styles/multi-select/highcontrast.css +1 -1
  151. package/styles/multi-select/icons/_material3-dark.scss +1 -0
  152. package/styles/multi-select/icons/_material3.scss +3 -4
  153. package/styles/multi-select/material-dark.css +1 -1
  154. package/styles/multi-select/material.css +1 -1
  155. package/styles/multi-select/material3-dark.css +2547 -0
  156. package/styles/multi-select/material3-dark.scss +10 -0
  157. package/styles/multi-select/material3.css +2603 -0
  158. package/styles/multi-select/material3.scss +10 -0
  159. package/styles/multi-select/tailwind-dark.css +1 -1
  160. package/styles/multi-select/tailwind.css +1 -1
  161. package/styles/tailwind-dark.css +214 -101
  162. package/styles/tailwind.css +214 -101
@@ -0,0 +1,956 @@
1
+ @import url("https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,900&display=swap");
2
+ :root {
3
+ --color-sf-black: 0, 0, 0;
4
+ --color-sf-white: 255, 255, 255;
5
+ --color-sf-primary: 208, 188, 255;
6
+ --color-sf-primary-container: 79, 55, 139;
7
+ --color-sf-secondary: 204, 194, 220;
8
+ --color-sf-secondary-container: 74, 68, 88;
9
+ --color-sf-tertiary: 239, 184, 200;
10
+ --color-sf-tertiary-container: 99, 59, 72;
11
+ --color-sf-surface: 28, 27, 31;
12
+ --color-sf-surface-variant: 73, 69, 79;
13
+ --color-sf-background: var(--color-sf-surface);
14
+ --color-sf-on-primary: 55, 30, 115;
15
+ --color-sf-on-primary-container: 234, 221, 255;
16
+ --color-sf-on-secondary: 51, 45, 65;
17
+ --color-sf-on-secondary-container: 232, 222, 248;
18
+ --color-sf-on-tertiary: 73, 37, 50;
19
+ --color-sf-on-tertiary-containe: 255, 216, 228;
20
+ --color-sf-on-surface: 230, 225, 229;
21
+ --color-sf-on-surface-variant: 202, 196, 208;
22
+ --color-sf-on-background: 230, 225, 229;
23
+ --color-sf-outline: 147, 143, 153;
24
+ --color-sf-outline-variant: 68, 71, 70;
25
+ --color-sf-shadow: 0, 0, 0;
26
+ --color-sf-surface-tint-color: 208, 188, 255;
27
+ --color-sf-inverse-surface: 230, 225, 229;
28
+ --color-sf-inverse-on-surface: 49, 48, 51;
29
+ --color-sf-inverse-primary: 103, 80, 164;
30
+ --color-sf-scrim: 0, 0, 0;
31
+ --color-sf-error: 242, 184, 181;
32
+ --color-sf-error-container: 140, 29, 24;
33
+ --color-sf-on-error: 96, 20, 16;
34
+ --color-sf-on-error-container: 249, 222, 220;
35
+ --color-sf-success: 83, 202, 23;
36
+ --color-sf-success-container: 22, 62, 2;
37
+ --color-sf-on-success: 13, 39, 0;
38
+ --color-sf-on-success-container: 183, 250, 150;
39
+ --color-sf-info: 71, 172, 251;
40
+ --color-sf-info-container: 0, 67, 120;
41
+ --color-sf-on-info: 0, 51, 91;
42
+ --color-sf-on-info-container: 173, 219, 255;
43
+ --color-sf-warning: 245, 180, 130;
44
+ --color-sf-warning-container: 123, 65, 0;
45
+ --color-sf-on-warning: 99, 52, 0;
46
+ --color-sf-on-warning-container: 255, 220, 193;
47
+ --color-sf-spreadsheet-gridline: 231, 224, 236;
48
+ --color-sf-shadow-focus-ring1: 0 0 0 1px #000000, 0 0 0 3px #ffffff;
49
+ --color-sf-success-text: 0, 0, 0;
50
+ --color-sf-warning-text: 0, 0, 0;
51
+ --color-sf-info-text: 0, 0, 0;
52
+ --color-sf-danger-text: 0, 0, 0;
53
+ --color-sf-diagram-palette-background: var(--color-sf-inverse-surface);
54
+ --color-sf-content-text-color-alt2: var(--color-sf-on-secondary);
55
+ }
56
+
57
+ .e-dropdownbase .e-list-item .e-list-icon {
58
+ padding: 0 16px 0 0;
59
+ }
60
+
61
+ .e-small .e-dropdownbase .e-list-item .e-list-icon {
62
+ padding: 0 12px 0 0;
63
+ }
64
+
65
+ .e-bigger.e-small .e-dropdownbase .e-list-item .e-list-icon {
66
+ padding: 0 16px 0 0;
67
+ }
68
+
69
+ .e-listbox-tool .e-moveup::before {
70
+ content: "\e776";
71
+ }
72
+
73
+ .e-listbox-tool .e-movedown::before {
74
+ content: "\e729";
75
+ }
76
+
77
+ .e-listbox-tool .e-moveto::before {
78
+ content: "\e748";
79
+ }
80
+
81
+ .e-listbox-tool .e-movefrom::before {
82
+ content: "\e765";
83
+ }
84
+
85
+ .e-listbox-tool .e-moveallto::before {
86
+ content: "\e7a9";
87
+ }
88
+
89
+ .e-listbox-tool .e-moveallfrom::before {
90
+ content: "\e744";
91
+ }
92
+
93
+ /* stylelint-disable property-no-vendor-prefix */
94
+ .e-listbox-wrapper,
95
+ .e-listbox-container,
96
+ .e-listboxtool-wrapper {
97
+ -webkit-overflow-scrolling: touch;
98
+ box-sizing: border-box;
99
+ cursor: pointer;
100
+ display: block;
101
+ position: relative;
102
+ -webkit-user-select: none;
103
+ -ms-user-select: none;
104
+ user-select: none;
105
+ width: 100%;
106
+ }
107
+ .e-listbox-wrapper *,
108
+ .e-listbox-container *,
109
+ .e-listboxtool-wrapper * {
110
+ box-sizing: border-box;
111
+ }
112
+ .e-listbox-wrapper:focus,
113
+ .e-listbox-container:focus,
114
+ .e-listboxtool-wrapper:focus {
115
+ outline: none;
116
+ }
117
+ .e-listbox-wrapper.e-disabled,
118
+ .e-listbox-container.e-disabled,
119
+ .e-listboxtool-wrapper.e-disabled {
120
+ cursor: default;
121
+ pointer-events: none;
122
+ }
123
+ .e-listbox-wrapper:not(.e-list-template) .e-list-nrt,
124
+ .e-listbox-container:not(.e-list-template) .e-list-nrt,
125
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-nrt {
126
+ text-align: center;
127
+ }
128
+ .e-listbox-wrapper:not(.e-list-template) .e-list-item,
129
+ .e-listbox-wrapper .e-list-nrt,
130
+ .e-listbox-wrapper .e-selectall-parent,
131
+ .e-listbox-container:not(.e-list-template) .e-list-item,
132
+ .e-listbox-container .e-list-nrt,
133
+ .e-listbox-container .e-selectall-parent,
134
+ .e-listboxtool-wrapper:not(.e-list-template) .e-list-item,
135
+ .e-listboxtool-wrapper .e-list-nrt,
136
+ .e-listboxtool-wrapper .e-selectall-parent {
137
+ height: 40px;
138
+ line-height: 1.35;
139
+ padding: 10px 16px;
140
+ position: relative;
141
+ }
142
+ .e-listbox-wrapper.e-filter-list,
143
+ .e-listbox-container.e-filter-list,
144
+ .e-listboxtool-wrapper.e-filter-list {
145
+ overflow: inherit;
146
+ }
147
+ .e-listbox-wrapper .e-list-parent,
148
+ .e-listbox-container .e-list-parent,
149
+ .e-listboxtool-wrapper .e-list-parent {
150
+ height: 100%;
151
+ min-height: 40px;
152
+ }
153
+ .e-listbox-wrapper .e-list-item,
154
+ .e-listbox-container .e-list-item,
155
+ .e-listboxtool-wrapper .e-list-item {
156
+ border-bottom: 0 solid;
157
+ outline: none;
158
+ }
159
+ .e-listbox-wrapper .e-list-item.e-disabled,
160
+ .e-listbox-container .e-list-item.e-disabled,
161
+ .e-listboxtool-wrapper .e-list-item.e-disabled {
162
+ pointer-events: none;
163
+ }
164
+ .e-listbox-wrapper .e-disable,
165
+ .e-listbox-container .e-disable,
166
+ .e-listboxtool-wrapper .e-disable {
167
+ opacity: 0.7;
168
+ }
169
+ .e-listbox-wrapper .e-list-parent,
170
+ .e-listbox-container .e-list-parent,
171
+ .e-listboxtool-wrapper .e-list-parent {
172
+ margin: 0;
173
+ padding: 0;
174
+ }
175
+ .e-listbox-wrapper .e-list-header .e-text.header,
176
+ .e-listbox-container .e-list-header .e-text.header,
177
+ .e-listboxtool-wrapper .e-list-header .e-text.header {
178
+ display: none;
179
+ }
180
+ .e-listbox-wrapper .e-icon-back,
181
+ .e-listbox-container .e-icon-back,
182
+ .e-listboxtool-wrapper .e-icon-back {
183
+ margin-top: 2px;
184
+ }
185
+ .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
186
+ .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
187
+ .e-listboxtool-wrapper .e-list-header .e-headertemplate-text.nested-header {
188
+ display: none;
189
+ }
190
+ .e-listbox-wrapper .e-list-header,
191
+ .e-listbox-container .e-list-header,
192
+ .e-listboxtool-wrapper .e-list-header {
193
+ -ms-flex-align: center;
194
+ align-items: center;
195
+ border-bottom: 1px solid;
196
+ display: -ms-flexbox;
197
+ display: flex;
198
+ font-weight: 500;
199
+ height: 18px;
200
+ padding: 0 12px;
201
+ }
202
+ .e-listbox-wrapper .e-has-header > .e-view,
203
+ .e-listbox-container .e-has-header > .e-view,
204
+ .e-listboxtool-wrapper .e-has-header > .e-view {
205
+ top: 45px;
206
+ }
207
+ .e-listbox-wrapper .e-but-back,
208
+ .e-listbox-container .e-but-back,
209
+ .e-listboxtool-wrapper .e-but-back {
210
+ cursor: pointer;
211
+ padding-right: 8px;
212
+ }
213
+ .e-listbox-wrapper .e-list-group-item:first-child,
214
+ .e-listbox-container .e-list-group-item:first-child,
215
+ .e-listboxtool-wrapper .e-list-group-item:first-child {
216
+ border: 0;
217
+ border-bottom: 0 solid transparent;
218
+ }
219
+ .e-listbox-wrapper .e-list-group-item,
220
+ .e-listbox-container .e-list-group-item,
221
+ .e-listboxtool-wrapper .e-list-group-item {
222
+ border-bottom: 0 solid transparent;
223
+ border-top: 1px solid;
224
+ font-weight: 500;
225
+ height: 30px;
226
+ line-height: 10px;
227
+ padding: 10px 16px;
228
+ }
229
+ .e-listbox-wrapper .e-icon-collapsible,
230
+ .e-listbox-container .e-icon-collapsible,
231
+ .e-listboxtool-wrapper .e-icon-collapsible {
232
+ cursor: pointer;
233
+ font-size: 12px;
234
+ position: absolute;
235
+ right: 0%;
236
+ top: 50%;
237
+ transform: translateY(-50%);
238
+ }
239
+ .e-listbox-wrapper .e-text-content,
240
+ .e-listbox-container .e-text-content,
241
+ .e-listboxtool-wrapper .e-text-content {
242
+ height: 100%;
243
+ position: relative;
244
+ vertical-align: middle;
245
+ }
246
+ .e-listbox-wrapper .e-text-content *,
247
+ .e-listbox-container .e-text-content *,
248
+ .e-listboxtool-wrapper .e-text-content * {
249
+ display: inline-block;
250
+ vertical-align: middle;
251
+ }
252
+ .e-listbox-wrapper .e-text-content.e-checkbox .e-list-text,
253
+ .e-listbox-container .e-text-content.e-checkbox .e-list-text,
254
+ .e-listboxtool-wrapper .e-text-content.e-checkbox .e-list-text {
255
+ width: calc(100% - 40px);
256
+ }
257
+ .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
258
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text,
259
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-left .e-list-icon + .e-list-text {
260
+ width: calc(100% - 90px);
261
+ }
262
+ .e-listbox-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
263
+ .e-listbox-container .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
264
+ .e-listboxtool-wrapper .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
265
+ width: calc(100% - 80px);
266
+ }
267
+ .e-listbox-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
268
+ .e-listbox-container .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text,
269
+ .e-listboxtool-wrapper .e-list-item.e-checklist.e-has-child .e-text-content.e-checkbox.e-checkbox-right .e-list-icon + .e-list-text {
270
+ width: calc(100% - 92px);
271
+ }
272
+ .e-listbox-wrapper .e-checkbox .e-checkbox-left,
273
+ .e-listbox-container .e-checkbox .e-checkbox-left,
274
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-left {
275
+ margin: -2px 8px 0 0;
276
+ }
277
+ .e-listbox-wrapper .e-checkbox .e-checkbox-right,
278
+ .e-listbox-container .e-checkbox .e-checkbox-right,
279
+ .e-listboxtool-wrapper .e-checkbox .e-checkbox-right {
280
+ margin: -2px 0 0 8px;
281
+ }
282
+ .e-listbox-wrapper .e-list-text,
283
+ .e-listbox-container .e-list-text,
284
+ .e-listboxtool-wrapper .e-list-text {
285
+ cursor: pointer;
286
+ display: inline-block;
287
+ overflow: hidden;
288
+ text-overflow: ellipsis;
289
+ vertical-align: top;
290
+ white-space: nowrap;
291
+ width: 100%;
292
+ }
293
+ .e-listbox-wrapper .e-list-icon + .e-list-text,
294
+ .e-listbox-container .e-list-icon + .e-list-text,
295
+ .e-listboxtool-wrapper .e-list-icon + .e-list-text {
296
+ width: calc(100% - 60px);
297
+ }
298
+ .e-listbox-wrapper .e-icon-wrapper .e-list-text,
299
+ .e-listbox-container .e-icon-wrapper .e-list-text,
300
+ .e-listboxtool-wrapper .e-icon-wrapper .e-list-text {
301
+ width: calc(100% - 60px);
302
+ }
303
+ .e-listbox-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
304
+ .e-listbox-container .e-icon-wrapper.e-text-content.e-checkbox .e-list-text,
305
+ .e-listboxtool-wrapper .e-icon-wrapper.e-text-content.e-checkbox .e-list-text {
306
+ width: calc(100% - 60px);
307
+ }
308
+ .e-listbox-wrapper .e-list-icon,
309
+ .e-listbox-container .e-list-icon,
310
+ .e-listboxtool-wrapper .e-list-icon {
311
+ height: 30px;
312
+ margin-right: 16px;
313
+ width: 30px;
314
+ }
315
+ .e-listbox-wrapper .e-content,
316
+ .e-listbox-container .e-content,
317
+ .e-listboxtool-wrapper .e-content {
318
+ overflow: hidden;
319
+ position: relative;
320
+ }
321
+ .e-listbox-wrapper .e-list-header .e-text,
322
+ .e-listbox-container .e-list-header .e-text,
323
+ .e-listboxtool-wrapper .e-list-header .e-text {
324
+ cursor: pointer;
325
+ text-indent: 0;
326
+ }
327
+ .e-listbox-wrapper .e-text .e-headertext,
328
+ .e-listbox-container .e-text .e-headertext,
329
+ .e-listboxtool-wrapper .e-text .e-headertext {
330
+ display: inline-block;
331
+ line-height: 18px;
332
+ }
333
+ .e-listbox-wrapper.e-rtl,
334
+ .e-listbox-container.e-rtl,
335
+ .e-listboxtool-wrapper.e-rtl {
336
+ direction: rtl;
337
+ }
338
+ .e-listbox-wrapper.e-rtl .e-list-icon,
339
+ .e-listbox-container.e-rtl .e-list-icon,
340
+ .e-listboxtool-wrapper.e-rtl .e-list-icon {
341
+ margin-left: 16px;
342
+ margin-right: 0;
343
+ }
344
+ .e-listbox-wrapper.e-rtl .e-icon-collapsible,
345
+ .e-listbox-container.e-rtl .e-icon-collapsible,
346
+ .e-listboxtool-wrapper.e-rtl .e-icon-collapsible {
347
+ left: 0%;
348
+ right: initial;
349
+ top: 50%;
350
+ transform: translateY(-50%) rotate(180deg);
351
+ }
352
+ .e-listbox-wrapper.e-rtl .e-list-header .e-text,
353
+ .e-listbox-container.e-rtl .e-list-header .e-text,
354
+ .e-listboxtool-wrapper.e-rtl .e-list-header .e-text {
355
+ cursor: pointer;
356
+ }
357
+ .e-listbox-wrapper.e-rtl .e-but-back,
358
+ .e-listbox-container.e-rtl .e-but-back,
359
+ .e-listboxtool-wrapper.e-rtl .e-but-back {
360
+ transform: rotate(180deg);
361
+ }
362
+ .e-listbox-wrapper.e-rtl .e-icon-back,
363
+ .e-listbox-container.e-rtl .e-icon-back,
364
+ .e-listboxtool-wrapper.e-rtl .e-icon-back {
365
+ margin-top: -2px;
366
+ }
367
+ .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-left,
368
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-left,
369
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-left {
370
+ margin: -2px 0 0 8px;
371
+ }
372
+ .e-listbox-wrapper.e-rtl .e-checkbox .e-checkbox-right,
373
+ .e-listbox-container.e-rtl .e-checkbox .e-checkbox-right,
374
+ .e-listboxtool-wrapper.e-rtl .e-checkbox .e-checkbox-right {
375
+ margin: -2px 8px 0 0;
376
+ }
377
+ .e-listbox-wrapper.e-rtl .e-checkbox-wrapper,
378
+ .e-listbox-container.e-rtl .e-checkbox-wrapper,
379
+ .e-listboxtool-wrapper.e-rtl .e-checkbox-wrapper {
380
+ margin: -2px 0 0 8px;
381
+ }
382
+ .e-listbox-wrapper .e-checkbox-wrapper,
383
+ .e-listbox-container .e-checkbox-wrapper,
384
+ .e-listboxtool-wrapper .e-checkbox-wrapper {
385
+ margin: -2px 8px 0 0;
386
+ text-indent: 0;
387
+ vertical-align: middle;
388
+ position: relative;
389
+ }
390
+ .e-listbox-wrapper.e-checkbox-right .e-checkbox-wrapper,
391
+ .e-listbox-container.e-checkbox-right .e-checkbox-wrapper,
392
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper {
393
+ position: absolute;
394
+ right: 0;
395
+ top: 30%;
396
+ }
397
+ .e-listbox-wrapper .e-input-group,
398
+ .e-listbox-container .e-input-group,
399
+ .e-listboxtool-wrapper .e-input-group {
400
+ padding: 4px 8px;
401
+ }
402
+ .e-listbox-wrapper .e-input-focus,
403
+ .e-listbox-container .e-input-focus,
404
+ .e-listboxtool-wrapper .e-input-focus {
405
+ padding: 4px 4px 4px 8px;
406
+ }
407
+ .e-listbox-wrapper .e-hidden-select,
408
+ .e-listbox-container .e-hidden-select,
409
+ .e-listboxtool-wrapper .e-hidden-select {
410
+ height: 1px;
411
+ opacity: 0;
412
+ position: absolute;
413
+ width: 100%;
414
+ }
415
+ .e-listbox-wrapper .e-placeholder,
416
+ .e-listbox-container .e-placeholder,
417
+ .e-listboxtool-wrapper .e-placeholder {
418
+ background-color: rgba(var(--color-sf-primary));
419
+ display: block;
420
+ height: 1px;
421
+ }
422
+
423
+ ejs-listbox {
424
+ display: block;
425
+ }
426
+
427
+ .e-listbox-wrapper:not(.e-listbox-container) {
428
+ overflow: auto;
429
+ }
430
+
431
+ .e-listbox-wrapper.e-filter-list {
432
+ overflow: inherit;
433
+ }
434
+ .e-listbox-wrapper.e-filter-list .e-list-parent {
435
+ overflow: auto;
436
+ }
437
+
438
+ .e-listbox-wrapper.e-sortableclone,
439
+ .e-listbox-container.e-sortableclone,
440
+ .e-listboxtool-wrapper.e-sortableclone {
441
+ border-width: 0;
442
+ overflow: visible;
443
+ }
444
+ .e-listbox-wrapper.e-sortableclone .e-list-item,
445
+ .e-listbox-container.e-sortableclone .e-list-item,
446
+ .e-listboxtool-wrapper.e-sortableclone .e-list-item {
447
+ list-style-type: none;
448
+ }
449
+ .e-listbox-wrapper.e-sortableclone .e-ripple,
450
+ .e-listbox-container.e-sortableclone .e-ripple,
451
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple {
452
+ overflow: visible;
453
+ }
454
+ .e-listbox-wrapper.e-sortableclone .e-ripple .e-ripple-element,
455
+ .e-listbox-container.e-sortableclone .e-ripple .e-ripple-element,
456
+ .e-listboxtool-wrapper.e-sortableclone .e-ripple .e-ripple-element {
457
+ display: none;
458
+ }
459
+ .e-listbox-wrapper.e-sortableclone .e-list-badge,
460
+ .e-listbox-container.e-sortableclone .e-list-badge,
461
+ .e-listboxtool-wrapper.e-sortableclone .e-list-badge {
462
+ -ms-flex-align: center;
463
+ align-items: center;
464
+ background-color: rgba(var(--color-sf-primary));
465
+ border: 1px solid rgba(var(--color-sf-on-primary));
466
+ border-radius: 50%;
467
+ color: rgba(var(--color-sf-on-primary));
468
+ display: -ms-flexbox;
469
+ display: flex;
470
+ font-size: 12px;
471
+ height: 22px;
472
+ -ms-flex-pack: center;
473
+ justify-content: center;
474
+ position: absolute;
475
+ right: -10px;
476
+ top: -10px;
477
+ width: 22px;
478
+ }
479
+
480
+ .e-listboxtool-wrapper.e-sortableclone {
481
+ display: block;
482
+ }
483
+
484
+ .e-listboxtool-wrapper,
485
+ .e-listboxtool-container {
486
+ cursor: pointer;
487
+ display: -ms-flexbox;
488
+ display: flex;
489
+ }
490
+ .e-listboxtool-wrapper *,
491
+ .e-listboxtool-container * {
492
+ box-sizing: border-box;
493
+ }
494
+ .e-listboxtool-wrapper.e-disabled,
495
+ .e-listboxtool-container.e-disabled {
496
+ cursor: default;
497
+ pointer-events: none;
498
+ }
499
+ .e-listboxtool-wrapper .e-listbox-wrapper,
500
+ .e-listboxtool-container .e-listbox-wrapper {
501
+ -ms-flex: 1;
502
+ flex: 1;
503
+ }
504
+ .e-listboxtool-wrapper.e-right .e-listbox-tool,
505
+ .e-listboxtool-container.e-right .e-listbox-tool {
506
+ margin-left: 15px;
507
+ }
508
+ .e-listboxtool-wrapper.e-left .e-listbox-tool,
509
+ .e-listboxtool-container.e-left .e-listbox-tool {
510
+ margin-right: 15px;
511
+ }
512
+ .e-listboxtool-wrapper .e-listbox-tool,
513
+ .e-listboxtool-container .e-listbox-tool {
514
+ border: 1px solid rgba(var(--color-sf-outline-variant));
515
+ overflow: auto;
516
+ padding: 8px;
517
+ }
518
+ .e-listboxtool-wrapper .e-listbox-tool .e-btn,
519
+ .e-listboxtool-container .e-listbox-tool .e-btn {
520
+ display: list-item;
521
+ list-style-type: none;
522
+ margin-bottom: 10px;
523
+ }
524
+ .e-listboxtool-wrapper.e-checkbox-right .e-checkbox-wrapper,
525
+ .e-listboxtool-container.e-checkbox-right .e-checkbox-wrapper {
526
+ position: absolute;
527
+ right: 0;
528
+ top: 30%;
529
+ }
530
+
531
+ .e-rtl.e-listboxtool-wrapper.e-right .e-listbox-tool,
532
+ .e-rtl.e-listboxtool-container.e-right .e-listbox-tool {
533
+ margin-right: 15px;
534
+ }
535
+ .e-rtl.e-listboxtool-wrapper.e-left .e-listbox-tool,
536
+ .e-rtl.e-listboxtool-container.e-left .e-listbox-tool {
537
+ margin-left: 15px;
538
+ }
539
+
540
+ .e-bigger .e-listbox-wrapper .e-list-item,
541
+ .e-listbox-wrapper.e-bigger .e-list-item,
542
+ .e-bigger .e-listbox-container .e-list-item,
543
+ .e-listbox-container.e-bigger .e-list-item {
544
+ border-bottom: 0 solid transparent;
545
+ border-left: 0 solid transparent;
546
+ border-right: 0 solid transparent;
547
+ border-top: 0 solid transparent;
548
+ }
549
+ .e-bigger .e-listbox-wrapper:not(.e-list-template) .e-list-item,
550
+ .e-bigger .e-listbox-wrapper .e-selectall-parent,
551
+ .e-bigger .e-listbox-wrapper .e-list-group-item,
552
+ .e-bigger .e-listbox-wrapper .e-list-header,
553
+ .e-listbox-wrapper.e-bigger:not(.e-list-template) .e-list-item,
554
+ .e-listbox-wrapper.e-bigger .e-selectall-parent,
555
+ .e-listbox-wrapper.e-bigger .e-list-group-item,
556
+ .e-listbox-wrapper.e-bigger .e-list-header,
557
+ .e-bigger .e-listbox-container:not(.e-list-template) .e-list-item,
558
+ .e-bigger .e-listbox-container .e-selectall-parent,
559
+ .e-bigger .e-listbox-container .e-list-group-item,
560
+ .e-bigger .e-listbox-container .e-list-header,
561
+ .e-listbox-container.e-bigger:not(.e-list-template) .e-list-item,
562
+ .e-listbox-container.e-bigger .e-selectall-parent,
563
+ .e-listbox-container.e-bigger .e-list-group-item,
564
+ .e-listbox-container.e-bigger .e-list-header {
565
+ padding: 12px 16px;
566
+ }
567
+ .e-bigger .e-listbox-wrapper:not(.e-list-template) .e-list-item,
568
+ .e-bigger .e-listbox-wrapper .e-selectall-parent,
569
+ .e-listbox-wrapper.e-bigger:not(.e-list-template) .e-list-item,
570
+ .e-listbox-wrapper.e-bigger .e-selectall-parent,
571
+ .e-bigger .e-listbox-container:not(.e-list-template) .e-list-item,
572
+ .e-bigger .e-listbox-container .e-selectall-parent,
573
+ .e-listbox-container.e-bigger:not(.e-list-template) .e-list-item,
574
+ .e-listbox-container.e-bigger .e-selectall-parent {
575
+ height: 48px;
576
+ line-height: 1.6;
577
+ position: relative;
578
+ }
579
+ .e-bigger .e-listbox-wrapper .e-list-parent,
580
+ .e-listbox-wrapper.e-bigger .e-list-parent,
581
+ .e-bigger .e-listbox-container .e-list-parent,
582
+ .e-listbox-container.e-bigger .e-list-parent {
583
+ min-height: 48px;
584
+ }
585
+ .e-bigger .e-listbox-wrapper .e-text-content,
586
+ .e-listbox-wrapper.e-bigger .e-text-content,
587
+ .e-bigger .e-listbox-container .e-text-content,
588
+ .e-listbox-container.e-bigger .e-text-content {
589
+ font-size: 16px;
590
+ }
591
+ .e-bigger .e-listbox-wrapper .e-list-group-item,
592
+ .e-listbox-wrapper.e-bigger .e-list-group-item,
593
+ .e-bigger .e-listbox-container .e-list-group-item,
594
+ .e-listbox-container.e-bigger .e-list-group-item {
595
+ height: 40px;
596
+ line-height: 25px;
597
+ }
598
+ .e-bigger .e-listbox-wrapper .e-list-header,
599
+ .e-listbox-wrapper.e-bigger .e-list-header,
600
+ .e-bigger .e-listbox-container .e-list-header,
601
+ .e-listbox-container.e-bigger .e-list-header {
602
+ -ms-flex-align: center;
603
+ align-items: center;
604
+ display: -ms-flexbox;
605
+ display: flex;
606
+ font-weight: 600;
607
+ height: 22px;
608
+ }
609
+ .e-bigger .e-listbox-wrapper .e-list-header .e-text.header,
610
+ .e-listbox-wrapper.e-bigger .e-list-header .e-text.header,
611
+ .e-bigger .e-listbox-container .e-list-header .e-text.header,
612
+ .e-listbox-container.e-bigger .e-list-header .e-text.header {
613
+ display: none;
614
+ }
615
+ .e-bigger .e-listbox-wrapper .e-list-header .e-headertemplate-text.nested-header,
616
+ .e-listbox-wrapper.e-bigger .e-list-header .e-headertemplate-text.nested-header,
617
+ .e-bigger .e-listbox-container .e-list-header .e-headertemplate-text.nested-header,
618
+ .e-listbox-container.e-bigger .e-list-header .e-headertemplate-text.nested-header {
619
+ display: none;
620
+ }
621
+ .e-bigger .e-listbox-wrapper .e-list-header .e-text,
622
+ .e-listbox-wrapper.e-bigger .e-list-header .e-text,
623
+ .e-bigger .e-listbox-container .e-list-header .e-text,
624
+ .e-listbox-container.e-bigger .e-list-header .e-text {
625
+ font-size: 14px;
626
+ }
627
+ .e-small .e-listbox-wrapper.e-filter-list .e-list-parent,
628
+ .e-small .e-listbox-container.e-filter-list .e-list-parent {
629
+ height: calc(100% - 45px);
630
+ }
631
+
632
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
633
+ .e-bigger .e-listbox-container.e-filter-list .e-list-parent {
634
+ height: calc(100% - 55px);
635
+ }
636
+
637
+ .e-bigger .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
638
+ .e-bigger .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent {
639
+ height: calc(100% - 98px);
640
+ }
641
+
642
+ .e-bigger .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
643
+ .e-bigger .e-listbox-container .e-selectall-parent + .e-list-parent {
644
+ height: calc(100% - 48px);
645
+ }
646
+
647
+ .e-small.e-bigger .e-listbox-wrapper.e-filter-list .e-list-parent,
648
+ .e-small.e-bigger .e-listbox-container.e-filter-list .e-list-parent {
649
+ height: calc(100% - 45px);
650
+ }
651
+
652
+ .e-listbox-wrapper,
653
+ .e-listbox-container:not(.e-listboxtool-container):not(.e-sortableclone),
654
+ .e-listboxtool-container.e-listbox-container .e-ul {
655
+ border: 1px solid rgba(var(--color-sf-outline-variant));
656
+ }
657
+
658
+ .e-listbox-wrapper,
659
+ .e-listbox-container,
660
+ .e-listboxtool-wrapper {
661
+ font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", sans-serif;
662
+ font-size: 14px;
663
+ }
664
+ .e-listbox-wrapper .e-list-header,
665
+ .e-listbox-container .e-list-header,
666
+ .e-listboxtool-wrapper .e-list-header {
667
+ background-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.08), rgba(var(--color-sf-primary), 0.08)), rgba(var(--color-sf-surface));
668
+ border-color: rgba(var(--color-sf-outline-variant));
669
+ color: rgba(var(--color-sf-on-surface-variant));
670
+ font-size: 12px;
671
+ }
672
+
673
+ .e-listbox-wrapper.e-filter-list .e-list-parent,
674
+ .e-listbox-container.e-filter-list .e-list-parent,
675
+ .e-listboxtool-wrapper.e-filter-list .e-list-parent {
676
+ height: calc(100% - 47px);
677
+ }
678
+
679
+ .e-listbox-wrapper.e-filter-list .e-selectall-parent + .e-list-parent,
680
+ .e-listbox-container.e-filter-list .e-selectall-parent + .e-list-parent,
681
+ .e-listboxtool-wrapper.e-filter-list .e-selectall-parent + .e-list-parent {
682
+ height: calc(100% - 79px);
683
+ }
684
+
685
+ .e-listbox-wrapper .e-selectall-parent + .e-list-parent,
686
+ .e-listbox-container .e-selectall-parent + .e-list-parent,
687
+ .e-listboxtool-wrapper .e-selectall-parent + .e-list-parent {
688
+ height: calc(100% - 36px);
689
+ }
690
+
691
+ .e-listbox-wrapper .e-icons,
692
+ .e-listbox-container .e-icons,
693
+ .e-listboxtool-wrapper .e-icons {
694
+ color: rgba(var(--color-sf-on-surface-variant));
695
+ }
696
+
697
+ .e-listbox-wrapper .e-list-item,
698
+ .e-listbox-container .e-list-item,
699
+ .e-listboxtool-wrapper .e-list-item {
700
+ background-color: transparent;
701
+ border-bottom: 0 solid transparent;
702
+ border-left: 0 solid transparent;
703
+ border-right: 0 solid transparent;
704
+ border-top: 0 solid transparent;
705
+ color: rgba(var(--color-sf-on-surface));
706
+ }
707
+
708
+ .e-listbox-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled), .e-listbox-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
709
+ .e-listbox-container .e-list-item:hover:not(.e-selected):not(.e-disabled),
710
+ .e-listbox-container .e-list-item:hover.e-selected.e-checklist:not(.e-disabled),
711
+ .e-listboxtool-wrapper .e-list-item:hover:not(.e-selected):not(.e-disabled),
712
+ .e-listboxtool-wrapper .e-list-item:hover.e-selected.e-checklist:not(.e-disabled) {
713
+ background-color: rgba(var(--color-sf-on-surface), 0.05);
714
+ border-color: transparent;
715
+ color: rgba(var(--color-sf-on-surface));
716
+ }
717
+
718
+ .e-listbox-wrapper .e-list-item.e-selected,
719
+ .e-listbox-container .e-list-item.e-selected,
720
+ .e-listboxtool-wrapper .e-list-item.e-selected {
721
+ background-color: rgba(var(--color-sf-primary-container));
722
+ color: rgba(var(--color-sf-on-surface));
723
+ }
724
+
725
+ .e-listbox-wrapper .e-list-item.e-selected.e-checklist,
726
+ .e-listbox-container .e-list-item.e-selected.e-checklist,
727
+ .e-listboxtool-wrapper .e-list-item.e-selected.e-checklist {
728
+ background-color: transparent;
729
+ color: rgba(var(--color-sf-on-surface));
730
+ }
731
+
732
+ .e-listbox-wrapper .e-list-item.e-focused, .e-listbox-wrapper .e-list-item.e-focused.e-selected.e-checklist,
733
+ .e-listbox-container .e-list-item.e-focused,
734
+ .e-listbox-container .e-list-item.e-focused.e-selected.e-checklist,
735
+ .e-listboxtool-wrapper .e-list-item.e-focused,
736
+ .e-listboxtool-wrapper .e-list-item.e-focused.e-selected.e-checklist {
737
+ background-color: rgba(var(--color-sf-primary-container));
738
+ color: rgba(var(--color-sf-on-surface));
739
+ }
740
+
741
+ .e-listbox-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check, .e-listbox-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
742
+ .e-listbox-container .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
743
+ .e-listbox-container .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check,
744
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-checkbox-wrapper .e-frame.e-check,
745
+ .e-listboxtool-wrapper .e-list-item.e-focused .e-css.e-checkbox-wrapper .e-frame.e-check {
746
+ background-color: rgba(var(--color-sf-primary));
747
+ border-color: transparent;
748
+ color: rgba(var(--color-sf-on-primary));
749
+ }
750
+
751
+ .e-listbox-wrapper .e-list-group-item,
752
+ .e-listbox-container .e-list-group-item,
753
+ .e-listboxtool-wrapper .e-list-group-item {
754
+ background-color: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.08), rgba(var(--color-sf-primary), 0.08)), rgba(var(--color-sf-surface));
755
+ border-color: rgba(var(--color-sf-outline-variant));
756
+ color: rgba(var(--color-sf-on-surface-variant));
757
+ font-size: 12px;
758
+ }
759
+
760
+ .e-listbox-wrapper .e-selectall-parent,
761
+ .e-listbox-container .e-selectall-parent,
762
+ .e-listboxtool-wrapper .e-selectall-parent {
763
+ background-color: transparent;
764
+ border-bottom: 1px solid rgba(var(--color-sf-outline-variant));
765
+ color: rgba(var(--color-sf-on-surface));
766
+ }
767
+
768
+ .e-listbox-wrapper .e-sortableclone.e-ripple .e-ripple-element,
769
+ .e-listbox-container .e-sortableclone.e-ripple .e-ripple-element,
770
+ .e-listboxtool-wrapper .e-sortableclone.e-ripple .e-ripple-element {
771
+ background-color: transparent;
772
+ }
773
+
774
+ .e-listbox-wrapper.e-list-template .e-list-wrapper,
775
+ .e-listbox-container.e-list-template .e-list-wrapper,
776
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper {
777
+ height: inherit;
778
+ position: relative;
779
+ }
780
+ .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line),
781
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line),
782
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) {
783
+ padding: 8px 16px;
784
+ }
785
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line,
786
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line,
787
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line {
788
+ padding: 4px;
789
+ }
790
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
791
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header,
792
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-item-header {
793
+ color: rgba(var(--color-sf-on-surface));
794
+ display: block;
795
+ font-size: 14px;
796
+ font-weight: 500;
797
+ margin: 0;
798
+ overflow: hidden;
799
+ padding: 0;
800
+ text-overflow: ellipsis;
801
+ white-space: nowrap;
802
+ }
803
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
804
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content,
805
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content {
806
+ color: rgba(var(--color-sf-on-surface-variant));
807
+ display: block;
808
+ font-size: 14px;
809
+ margin: 0;
810
+ padding: 2px 0 0 0;
811
+ word-wrap: break-word;
812
+ }
813
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
814
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow),
815
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line .e-list-content:not(.e-text-overflow) {
816
+ overflow: hidden;
817
+ text-overflow: ellipsis;
818
+ white-space: nowrap;
819
+ }
820
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
821
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
822
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
823
+ height: 40px;
824
+ left: 0;
825
+ position: absolute;
826
+ top: 0;
827
+ width: 40px;
828
+ }
829
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
830
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
831
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
832
+ padding-left: 68px;
833
+ padding-right: 16px;
834
+ }
835
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
836
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
837
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
838
+ padding-left: 16px;
839
+ padding-right: 68px;
840
+ }
841
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
842
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
843
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
844
+ height: 40px;
845
+ position: absolute;
846
+ right: 0;
847
+ top: 0;
848
+ width: 40px;
849
+ }
850
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
851
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar,
852
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar .e-avatar {
853
+ top: 0;
854
+ }
855
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
856
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar,
857
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-multi-line.e-list-avatar-right:not(.e-list-badge) .e-avatar {
858
+ top: 0;
859
+ }
860
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge,
861
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge .e-badge,
862
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge .e-badge {
863
+ font-size: 10px;
864
+ height: 18px;
865
+ line-height: 16px;
866
+ padding: 0;
867
+ position: absolute;
868
+ right: 12px;
869
+ top: 50%;
870
+ transform: translateY(-50%);
871
+ width: 32px;
872
+ }
873
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
874
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
875
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
876
+ padding-left: 68px;
877
+ padding-right: 10px;
878
+ }
879
+ .e-listbox-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
880
+ .e-listbox-container.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
881
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
882
+ padding-left: 16px;
883
+ padding-right: 10px;
884
+ }
885
+ .e-listbox-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
886
+ .e-listbox-container.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content,
887
+ .e-listboxtool-wrapper.e-list-template .e-list-wrapper:not(.e-list-multi-line) .e-list-content {
888
+ display: block;
889
+ margin: 0;
890
+ overflow: hidden;
891
+ padding: 8px 0;
892
+ text-overflow: ellipsis;
893
+ white-space: nowrap;
894
+ }
895
+ .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
896
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-item-header,
897
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-item-header {
898
+ color: rgba(var(--color-sf-on-surface));
899
+ }
900
+ .e-listbox-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content,
901
+ .e-listbox-container.e-list-template .e-list-item.e-list-item:hover .e-list-content,
902
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-list-item:hover .e-list-content {
903
+ color: rgba(var(--color-sf-on-surface));
904
+ }
905
+ .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header,
906
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-item-header,
907
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-item-header {
908
+ color: rgba(var(--color-sf-on-surface));
909
+ }
910
+ .e-listbox-wrapper.e-list-template .e-list-item.e-selected .e-list-content,
911
+ .e-listbox-container.e-list-template .e-list-item.e-selected .e-list-content,
912
+ .e-listboxtool-wrapper.e-list-template .e-list-item.e-selected .e-list-content {
913
+ color: rgba(var(--color-sf-on-surface));
914
+ }
915
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
916
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar,
917
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar .e-avatar {
918
+ left: inherit;
919
+ right: 0;
920
+ }
921
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
922
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge),
923
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar:not(.e-list-badge) {
924
+ padding-left: 16px;
925
+ padding-right: 68px;
926
+ }
927
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
928
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge),
929
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) {
930
+ padding-left: 68px;
931
+ padding-right: 16px;
932
+ }
933
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
934
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar,
935
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-avatar-right:not(.e-list-badge) .e-avatar {
936
+ left: 0;
937
+ right: inherit;
938
+ }
939
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
940
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge,
941
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge .e-badge {
942
+ left: 12px;
943
+ right: inherit;
944
+ }
945
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
946
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar,
947
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge.e-list-avatar {
948
+ padding-left: 10px;
949
+ padding-right: 68px;
950
+ }
951
+ .e-listbox-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
952
+ .e-listbox-container.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar),
953
+ .e-listboxtool-wrapper.e-rtl.e-list-template .e-list-wrapper.e-list-badge:not(.e-list-avatar) {
954
+ padding-left: 10px;
955
+ padding-right: 16px;
956
+ }