@syncfusion/ej2-dropdowns 23.1.43 → 23.2.4-13895

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 (288) hide show
  1. package/CHANGELOG.md +2114 -2084
  2. package/{README.md → ReadMe.md} +217 -217
  3. package/dist/ej2-dropdowns.min.js +1 -10
  4. package/dist/ej2-dropdowns.umd.min.js +1 -10
  5. package/dist/ej2-dropdowns.umd.min.js.map +1 -1
  6. package/dist/es6/ej2-dropdowns.es2015.js +83 -71
  7. package/dist/es6/ej2-dropdowns.es2015.js.map +1 -1
  8. package/dist/es6/ej2-dropdowns.es5.js +225 -212
  9. package/dist/es6/ej2-dropdowns.es5.js.map +1 -1
  10. package/dist/global/ej2-dropdowns.min.js +1 -10
  11. package/dist/global/ej2-dropdowns.min.js.map +1 -1
  12. package/dist/global/index.d.ts +0 -9
  13. package/dist/ts/auto-complete/auto-complete.ts +615 -0
  14. package/dist/ts/combo-box/combo-box.ts +1028 -0
  15. package/dist/ts/common/highlight-search.ts +57 -0
  16. package/dist/ts/common/incremental-search.ts +131 -0
  17. package/dist/ts/common/interface.ts +72 -0
  18. package/dist/ts/common/virtual-scroll.ts +354 -0
  19. package/dist/ts/drop-down-base/drop-down-base.ts +1864 -0
  20. package/dist/ts/drop-down-list/drop-down-list.ts +3954 -0
  21. package/dist/ts/drop-down-tree/drop-down-tree.ts +3741 -0
  22. package/dist/ts/list-box/list-box.ts +2753 -0
  23. package/dist/ts/mention/mention.ts +1857 -0
  24. package/dist/ts/multi-select/checkbox-selection.ts +547 -0
  25. package/dist/ts/multi-select/float-label.ts +176 -0
  26. package/dist/ts/multi-select/interface.ts +70 -0
  27. package/dist/ts/multi-select/multi-select.ts +4880 -0
  28. package/helpers/e2e/autocomplete.js +13 -13
  29. package/helpers/e2e/combobox.js +13 -13
  30. package/helpers/e2e/dropdownlist.js +13 -13
  31. package/helpers/e2e/index.js +3 -3
  32. package/helpers/e2e/listboxHelper.js +13 -13
  33. package/helpers/e2e/multiselect.js +13 -13
  34. package/license +2 -2
  35. package/package.json +80 -80
  36. package/src/auto-complete/auto-complete-model.d.ts +188 -188
  37. package/src/auto-complete/auto-complete.d.ts +12 -12
  38. package/src/auto-complete/auto-complete.js +21 -21
  39. package/src/combo-box/combo-box-model.d.ts +224 -224
  40. package/src/combo-box/combo-box.d.ts +27 -27
  41. package/src/combo-box/combo-box.js +29 -29
  42. package/src/common/virtual-scroll.js +46 -46
  43. package/src/drop-down-base/drop-down-base-model.d.ts +200 -200
  44. package/src/drop-down-base/drop-down-base.d.ts +15 -15
  45. package/src/drop-down-base/drop-down-base.js +23 -21
  46. package/src/drop-down-list/drop-down-list-model.d.ts +202 -202
  47. package/src/drop-down-list/drop-down-list.d.ts +4 -4
  48. package/src/drop-down-list/drop-down-list.js +24 -21
  49. package/src/drop-down-tree/drop-down-tree-model.d.ts +468 -468
  50. package/src/drop-down-tree/drop-down-tree.d.ts +0 -1
  51. package/src/drop-down-tree/drop-down-tree.js +19 -27
  52. package/src/list-box/list-box-model.d.ts +193 -193
  53. package/src/list-box/list-box.d.ts +5 -2
  54. package/src/list-box/list-box.js +38 -21
  55. package/src/mention/mention-model.d.ts +261 -261
  56. package/src/mention/mention.js +20 -21
  57. package/src/multi-select/multi-select-model.d.ts +512 -512
  58. package/src/multi-select/multi-select.js +19 -19
  59. package/styles/auto-complete/_all.scss +1 -1
  60. package/styles/auto-complete/_bootstrap-dark-definition.scss +3 -3
  61. package/styles/auto-complete/_bootstrap-definition.scss +2 -2
  62. package/styles/auto-complete/_bootstrap4-definition.scss +11 -11
  63. package/styles/auto-complete/_bootstrap5-definition.scss +2 -2
  64. package/styles/auto-complete/_fabric-dark-definition.scss +2 -2
  65. package/styles/auto-complete/_fabric-definition.scss +2 -2
  66. package/styles/auto-complete/_fluent-definition.scss +2 -2
  67. package/styles/auto-complete/_fusionnew-definition.scss +2 -2
  68. package/styles/auto-complete/_highcontrast-definition.scss +2 -2
  69. package/styles/auto-complete/_highcontrast-light-definition.scss +2 -2
  70. package/styles/auto-complete/_material-dark-definition.scss +2 -2
  71. package/styles/auto-complete/_material-definition.scss +2 -2
  72. package/styles/auto-complete/_material3-definition.scss +2 -2
  73. package/styles/auto-complete/_tailwind-definition.scss +2 -2
  74. package/styles/auto-complete/material3-dark.scss +1 -1
  75. package/styles/auto-complete/material3.scss +1 -1
  76. package/styles/bootstrap-dark.css +5 -0
  77. package/styles/bootstrap5-dark.css +2 -1
  78. package/styles/bootstrap5.css +2 -1
  79. package/styles/combo-box/_all.scss +1 -1
  80. package/styles/combo-box/_bootstrap-dark-definition.scss +2 -2
  81. package/styles/combo-box/_bootstrap-definition.scss +2 -2
  82. package/styles/combo-box/_bootstrap4-definition.scss +11 -11
  83. package/styles/combo-box/_bootstrap5-definition.scss +2 -2
  84. package/styles/combo-box/_fabric-dark-definition.scss +2 -2
  85. package/styles/combo-box/_fabric-definition.scss +2 -2
  86. package/styles/combo-box/_fluent-definition.scss +2 -2
  87. package/styles/combo-box/_fusionnew-definition.scss +2 -2
  88. package/styles/combo-box/_highcontrast-definition.scss +2 -2
  89. package/styles/combo-box/_highcontrast-light-definition.scss +3 -3
  90. package/styles/combo-box/_material-dark-definition.scss +2 -2
  91. package/styles/combo-box/_material-definition.scss +2 -2
  92. package/styles/combo-box/_material3-definition.scss +2 -2
  93. package/styles/combo-box/_tailwind-definition.scss +2 -2
  94. package/styles/combo-box/material3-dark.scss +1 -1
  95. package/styles/combo-box/material3.scss +1 -1
  96. package/styles/drop-down-base/_all.scss +2 -2
  97. package/styles/drop-down-base/_bootstrap-dark-definition.scss +83 -83
  98. package/styles/drop-down-base/_bootstrap-definition.scss +83 -83
  99. package/styles/drop-down-base/_bootstrap4-definition.scss +90 -90
  100. package/styles/drop-down-base/_bootstrap5-definition.scss +117 -117
  101. package/styles/drop-down-base/_definition.scss +23 -23
  102. package/styles/drop-down-base/_fabric-dark-definition.scss +86 -86
  103. package/styles/drop-down-base/_fabric-definition.scss +84 -84
  104. package/styles/drop-down-base/_fluent-definition.scss +121 -121
  105. package/styles/drop-down-base/_fusionnew-definition.scss +117 -117
  106. package/styles/drop-down-base/_highcontrast-definition.scss +105 -105
  107. package/styles/drop-down-base/_highcontrast-light-definition.scss +105 -105
  108. package/styles/drop-down-base/_layout.scss +195 -195
  109. package/styles/drop-down-base/_material-dark-definition.scss +86 -86
  110. package/styles/drop-down-base/_material-definition.scss +85 -85
  111. package/styles/drop-down-base/_material3-definition.scss +87 -87
  112. package/styles/drop-down-base/_tailwind-definition.scss +129 -129
  113. package/styles/drop-down-base/_theme.scss +391 -391
  114. package/styles/drop-down-base/material3-dark.scss +1 -1
  115. package/styles/drop-down-base/material3.scss +1 -1
  116. package/styles/drop-down-list/_all.scss +3 -3
  117. package/styles/drop-down-list/_bootstrap-dark-definition.scss +157 -157
  118. package/styles/drop-down-list/_bootstrap-definition.scss +156 -156
  119. package/styles/drop-down-list/_bootstrap4-definition.scss +202 -202
  120. package/styles/drop-down-list/_bootstrap5-definition.scss +201 -201
  121. package/styles/drop-down-list/_fabric-dark-definition.scss +128 -128
  122. package/styles/drop-down-list/_fabric-definition.scss +124 -124
  123. package/styles/drop-down-list/_fluent-definition.scss +185 -185
  124. package/styles/drop-down-list/_fusionnew-definition.scss +201 -201
  125. package/styles/drop-down-list/_highcontrast-definition.scss +142 -142
  126. package/styles/drop-down-list/_highcontrast-light-definition.scss +144 -144
  127. package/styles/drop-down-list/_layout.scss +310 -310
  128. package/styles/drop-down-list/_material-dark-definition.scss +143 -143
  129. package/styles/drop-down-list/_material-definition.scss +167 -167
  130. package/styles/drop-down-list/_material3-definition.scss +180 -180
  131. package/styles/drop-down-list/_tailwind-definition.scss +134 -134
  132. package/styles/drop-down-list/_theme.scss +10 -10
  133. package/styles/drop-down-list/icons/_bootstrap-dark.scss +14 -14
  134. package/styles/drop-down-list/icons/_bootstrap.scss +14 -14
  135. package/styles/drop-down-list/icons/_bootstrap4.scss +14 -14
  136. package/styles/drop-down-list/icons/_bootstrap5.scss +14 -14
  137. package/styles/drop-down-list/icons/_fabric-dark.scss +14 -14
  138. package/styles/drop-down-list/icons/_fabric.scss +14 -14
  139. package/styles/drop-down-list/icons/_fluent.scss +14 -14
  140. package/styles/drop-down-list/icons/_fusionnew.scss +14 -14
  141. package/styles/drop-down-list/icons/_highcontrast-light.scss +14 -14
  142. package/styles/drop-down-list/icons/_highcontrast.scss +14 -14
  143. package/styles/drop-down-list/icons/_material-dark.scss +14 -14
  144. package/styles/drop-down-list/icons/_material.scss +14 -14
  145. package/styles/drop-down-list/icons/_material3.scss +14 -14
  146. package/styles/drop-down-list/icons/_tailwind.scss +14 -14
  147. package/styles/drop-down-list/material3-dark.scss +1 -1
  148. package/styles/drop-down-list/material3.scss +1 -1
  149. package/styles/drop-down-tree/_all.scss +2 -2
  150. package/styles/drop-down-tree/_bootstrap-dark-definition.scss +71 -71
  151. package/styles/drop-down-tree/_bootstrap-definition.scss +70 -70
  152. package/styles/drop-down-tree/_bootstrap4-definition.scss +71 -71
  153. package/styles/drop-down-tree/_bootstrap5-definition.scss +59 -59
  154. package/styles/drop-down-tree/_fabric-dark-definition.scss +71 -71
  155. package/styles/drop-down-tree/_fabric-definition.scss +71 -71
  156. package/styles/drop-down-tree/_fluent-definition.scss +65 -65
  157. package/styles/drop-down-tree/_fusionnew-definition.scss +59 -59
  158. package/styles/drop-down-tree/_highcontrast-definition.scss +71 -71
  159. package/styles/drop-down-tree/_highcontrast-light-definition.scss +71 -71
  160. package/styles/drop-down-tree/_layout.scss +1418 -1412
  161. package/styles/drop-down-tree/_material-dark-definition.scss +72 -72
  162. package/styles/drop-down-tree/_material-definition.scss +72 -72
  163. package/styles/drop-down-tree/_material3-definition.scss +76 -76
  164. package/styles/drop-down-tree/_tailwind-definition.scss +61 -61
  165. package/styles/drop-down-tree/_theme.scss +132 -132
  166. package/styles/drop-down-tree/fluent-dark.css +2 -0
  167. package/styles/drop-down-tree/fluent.css +2 -0
  168. package/styles/drop-down-tree/icons/_bootstrap-dark.scss +11 -11
  169. package/styles/drop-down-tree/icons/_bootstrap.scss +11 -11
  170. package/styles/drop-down-tree/icons/_bootstrap4.scss +11 -11
  171. package/styles/drop-down-tree/icons/_bootstrap5.scss +11 -11
  172. package/styles/drop-down-tree/icons/_fabric-dark.scss +11 -11
  173. package/styles/drop-down-tree/icons/_fabric.scss +11 -11
  174. package/styles/drop-down-tree/icons/_fluent.scss +11 -11
  175. package/styles/drop-down-tree/icons/_fusionnew.scss +11 -11
  176. package/styles/drop-down-tree/icons/_highcontrast-light.scss +11 -11
  177. package/styles/drop-down-tree/icons/_highcontrast.scss +11 -11
  178. package/styles/drop-down-tree/icons/_material-dark.scss +11 -11
  179. package/styles/drop-down-tree/icons/_material.scss +11 -11
  180. package/styles/drop-down-tree/icons/_material3.scss +11 -11
  181. package/styles/drop-down-tree/icons/_tailwind-dark.scss +11 -11
  182. package/styles/drop-down-tree/icons/_tailwind.scss +11 -11
  183. package/styles/drop-down-tree/material3-dark.scss +1 -1
  184. package/styles/drop-down-tree/material3.scss +1 -1
  185. package/styles/fabric-dark.css +5 -0
  186. package/styles/fluent-dark.css +4 -1
  187. package/styles/fluent.css +4 -1
  188. package/styles/highcontrast.css +5 -0
  189. package/styles/list-box/_all.scss +2 -2
  190. package/styles/list-box/_bootstrap-dark-definition.scss +126 -126
  191. package/styles/list-box/_bootstrap-definition.scss +119 -119
  192. package/styles/list-box/_bootstrap4-definition.scss +124 -124
  193. package/styles/list-box/_bootstrap5-definition.scss +120 -120
  194. package/styles/list-box/_fabric-dark-definition.scss +126 -126
  195. package/styles/list-box/_fabric-definition.scss +119 -119
  196. package/styles/list-box/_fluent-definition.scss +120 -120
  197. package/styles/list-box/_fusionnew-definition.scss +111 -111
  198. package/styles/list-box/_highcontrast-definition.scss +119 -119
  199. package/styles/list-box/_highcontrast-light-definition.scss +126 -126
  200. package/styles/list-box/_layout.scss +542 -542
  201. package/styles/list-box/_material-dark-definition.scss +126 -126
  202. package/styles/list-box/_material-definition.scss +119 -119
  203. package/styles/list-box/_material3-definition.scss +119 -119
  204. package/styles/list-box/_tailwind-definition.scss +119 -119
  205. package/styles/list-box/_theme.scss +382 -382
  206. package/styles/list-box/icons/_bootstrap-dark.scss +25 -25
  207. package/styles/list-box/icons/_bootstrap.scss +25 -25
  208. package/styles/list-box/icons/_bootstrap4.scss +25 -25
  209. package/styles/list-box/icons/_bootstrap5.scss +25 -25
  210. package/styles/list-box/icons/_fabric-dark.scss +25 -25
  211. package/styles/list-box/icons/_fabric.scss +25 -25
  212. package/styles/list-box/icons/_fluent.scss +25 -25
  213. package/styles/list-box/icons/_fusionnew.scss +25 -25
  214. package/styles/list-box/icons/_highcontrast-light.scss +25 -25
  215. package/styles/list-box/icons/_highcontrast.scss +25 -25
  216. package/styles/list-box/icons/_material-dark.scss +25 -25
  217. package/styles/list-box/icons/_material.scss +25 -25
  218. package/styles/list-box/icons/_material3.scss +25 -25
  219. package/styles/list-box/icons/_tailwind-dark.scss +25 -25
  220. package/styles/list-box/icons/_tailwind.scss +25 -25
  221. package/styles/list-box/material3-dark.scss +1 -1
  222. package/styles/list-box/material3.scss +1 -1
  223. package/styles/material3-dark.scss +1 -1
  224. package/styles/material3.scss +1 -1
  225. package/styles/mention/_all.scss +1 -1
  226. package/styles/mention/_bootstrap-dark-definition.scss +3 -3
  227. package/styles/mention/_bootstrap-definition.scss +3 -3
  228. package/styles/mention/_bootstrap4-definition.scss +3 -3
  229. package/styles/mention/_bootstrap5-definition.scss +1 -1
  230. package/styles/mention/_fabric-dark-definition.scss +2 -2
  231. package/styles/mention/_fabric-definition.scss +3 -3
  232. package/styles/mention/_fluent-definition.scss +1 -1
  233. package/styles/mention/_fusionnew-definition.scss +1 -1
  234. package/styles/mention/_highcontrast-definition.scss +3 -3
  235. package/styles/mention/_highcontrast-light-definition.scss +3 -3
  236. package/styles/mention/_layout.scss +6 -6
  237. package/styles/mention/_material-dark-definition.scss +3 -3
  238. package/styles/mention/_material-definition.scss +3 -3
  239. package/styles/mention/_material3-definition.scss +1 -1
  240. package/styles/mention/_tailwind-definition.scss +1 -1
  241. package/styles/mention/material3-dark.scss +1 -1
  242. package/styles/mention/material3.scss +1 -1
  243. package/styles/multi-select/_all.scss +2 -2
  244. package/styles/multi-select/_bootstrap-dark-definition.scss +203 -198
  245. package/styles/multi-select/_bootstrap-definition.scss +192 -192
  246. package/styles/multi-select/_bootstrap4-definition.scss +278 -278
  247. package/styles/multi-select/_bootstrap5-definition.scss +230 -229
  248. package/styles/multi-select/_fabric-dark-definition.scss +192 -187
  249. package/styles/multi-select/_fabric-definition.scss +183 -183
  250. package/styles/multi-select/_fluent-definition.scss +241 -240
  251. package/styles/multi-select/_fusionnew-definition.scss +227 -227
  252. package/styles/multi-select/_highcontrast-definition.scss +303 -298
  253. package/styles/multi-select/_highcontrast-light-definition.scss +297 -297
  254. package/styles/multi-select/_layout.scss +2199 -2199
  255. package/styles/multi-select/_material-dark-definition.scss +230 -230
  256. package/styles/multi-select/_material-definition.scss +223 -223
  257. package/styles/multi-select/_material3-definition.scss +246 -246
  258. package/styles/multi-select/_tailwind-definition.scss +235 -234
  259. package/styles/multi-select/_theme.scss +586 -586
  260. package/styles/multi-select/bootstrap-dark.css +5 -0
  261. package/styles/multi-select/bootstrap5-dark.css +2 -1
  262. package/styles/multi-select/bootstrap5.css +2 -1
  263. package/styles/multi-select/fabric-dark.css +5 -0
  264. package/styles/multi-select/fluent-dark.css +2 -1
  265. package/styles/multi-select/fluent.css +2 -1
  266. package/styles/multi-select/highcontrast.css +5 -0
  267. package/styles/multi-select/icons/_bootstrap-dark.scss +26 -26
  268. package/styles/multi-select/icons/_bootstrap.scss +26 -26
  269. package/styles/multi-select/icons/_bootstrap4.scss +37 -37
  270. package/styles/multi-select/icons/_bootstrap5.scss +26 -26
  271. package/styles/multi-select/icons/_fabric-dark.scss +26 -26
  272. package/styles/multi-select/icons/_fabric.scss +26 -26
  273. package/styles/multi-select/icons/_fluent.scss +55 -55
  274. package/styles/multi-select/icons/_fusionnew.scss +26 -26
  275. package/styles/multi-select/icons/_highcontrast-light.scss +26 -26
  276. package/styles/multi-select/icons/_highcontrast.scss +26 -26
  277. package/styles/multi-select/icons/_material-dark.scss +693 -693
  278. package/styles/multi-select/icons/_material.scss +693 -693
  279. package/styles/multi-select/icons/_material3.scss +692 -692
  280. package/styles/multi-select/icons/_tailwind.scss +26 -26
  281. package/styles/multi-select/material3-dark.scss +1 -1
  282. package/styles/multi-select/material3.scss +1 -1
  283. package/styles/multi-select/tailwind-dark.css +2 -1
  284. package/styles/multi-select/tailwind.css +2 -1
  285. package/styles/tailwind-dark.css +2 -1
  286. package/styles/tailwind.css +2 -1
  287. package/.eslintrc.json +0 -260
  288. package/tslint.json +0 -111
@@ -1,4 +1,4 @@
1
- import { Component, EventHandler, addClass, append, Property, Event, KeyboardEvents, EmitType, L10n, compile, KeyboardEventArgs } from '@syncfusion/ej2-base';import { setStyleAttribute, extend, removeClass, prepend, isNullOrUndefined, detach, getValue, AnimationModel } from '@syncfusion/ej2-base';import { NotifyPropertyChanges, INotifyPropertyChanged, rippleEffect, RippleOptions, ChildProperty, Complex } from '@syncfusion/ej2-base';import { DataManager, Query, DataOptions, DataUtil } from '@syncfusion/ej2-data';import { ListBase, SortOrder } from '@syncfusion/ej2-lists';import { Popup } from '@syncfusion/ej2-popups';import { remove, select, selectAll } from '@syncfusion/ej2-base';
1
+ import { Component, EventHandler, addClass, append, Property, Event, KeyboardEvents, EmitType, L10n, compile, KeyboardEventArgs } from '@syncfusion/ej2-base';
2
2
  import {FilterType,SelectEventArgs} from "./drop-down-base";
3
3
  import {ComponentModel} from '@syncfusion/ej2-base';
4
4
 
@@ -8,40 +8,40 @@ import {ComponentModel} from '@syncfusion/ej2-base';
8
8
  export interface FieldSettingsModel {
9
9
 
10
10
  /**
11
- * Maps the text column from data table for each list item
12
- *
13
- * @default null
14
- */
15
- text?: string;
11
+ * Maps the text column from data table for each list item
12
+ *
13
+ * @default null
14
+ */
15
+ text?: string;
16
16
 
17
17
  /**
18
- * Maps the value column from data table for each list item
19
- *
20
- * @default null
21
- */
22
- value?: string;
18
+ * Maps the value column from data table for each list item
19
+ *
20
+ * @default null
21
+ */
22
+ value?: string;
23
23
 
24
24
  /**
25
- * Maps the icon class column from data table for each list item.
26
- *
27
- * @default null
28
- */
29
- iconCss?: string;
25
+ * Maps the icon class column from data table for each list item.
26
+ *
27
+ * @default null
28
+ */
29
+ iconCss?: string;
30
30
 
31
31
  /**
32
- * Group the list items with it's related items by mapping groupBy field.
33
- *
34
- * @default null
35
- */
36
- groupBy?: string;
32
+ * Group the list items with it's related items by mapping groupBy field.
33
+ *
34
+ * @default null
35
+ */
36
+ groupBy?: string;
37
37
 
38
38
  /**
39
- * Allows additional attributes such as title, disabled, etc., to configure the elements
40
- * in various ways to meet the criteria.
41
- *
42
- * @default null
43
- */
44
- htmlAttributes?: string;
39
+ * Allows additional attributes such as title, disabled, etc., to configure the elements
40
+ * in various ways to meet the criteria.
41
+ *
42
+ * @default null
43
+ */
44
+ htmlAttributes?: string;
45
45
 
46
46
  }
47
47
 
@@ -51,216 +51,216 @@ export interface FieldSettingsModel {
51
51
  export interface DropDownBaseModel extends ComponentModel{
52
52
 
53
53
  /**
54
- * The `fields` property maps the columns of the data table and binds the data to the component.
55
- * * text - Maps the text column from data table for each list item.
56
- * * value - Maps the value column from data table for each list item.
57
- * * iconCss - Maps the icon class column from data table for each list item.
58
- * * groupBy - Group the list items with it's related items by mapping groupBy field.
59
- * ```html
60
- * <input type="text" tabindex="1" id="list"> </input>
61
- * ```
62
- * ```typescript
63
- * let customers: DropDownList = new DropDownList({
64
- * dataSource:new DataManager({ url:'http://js.syncfusion.com/demos/ejServices/Wcf/Northwind.svc/' }),
65
- * query: new Query().from('Customers').select(['ContactName', 'CustomerID']).take(5),
66
- * fields: { text: 'ContactName', value: 'CustomerID' },
67
- * placeholder: 'Select a customer'
68
- * });
69
- * customers.appendTo("#list");
70
- * ```
71
- *
72
- * @default {text: null, value: null, iconCss: null, groupBy: null}
73
-
74
- */
75
- fields?: FieldSettingsModel;
54
+ * The `fields` property maps the columns of the data table and binds the data to the component.
55
+ * * text - Maps the text column from data table for each list item.
56
+ * * value - Maps the value column from data table for each list item.
57
+ * * iconCss - Maps the icon class column from data table for each list item.
58
+ * * groupBy - Group the list items with it's related items by mapping groupBy field.
59
+ * ```html
60
+ * <input type="text" tabindex="1" id="list"> </input>
61
+ * ```
62
+ * ```typescript
63
+ * let customers: DropDownList = new DropDownList({
64
+ * dataSource:new DataManager({ url:'http://js.syncfusion.com/demos/ejServices/Wcf/Northwind.svc/' }),
65
+ * query: new Query().from('Customers').select(['ContactName', 'CustomerID']).take(5),
66
+ * fields: { text: 'ContactName', value: 'CustomerID' },
67
+ * placeholder: 'Select a customer'
68
+ * });
69
+ * customers.appendTo("#list");
70
+ * ```
71
+ *
72
+ * @default {text: null, value: null, iconCss: null, groupBy: null}
73
+ * @deprecated
74
+ */
75
+ fields?: FieldSettingsModel;
76
76
 
77
77
  /**
78
- * Accepts the template design and assigns it to each list item present in the popup.
79
- * We have built-in `template engine`
80
- *
81
- * which provides options to compile template string into a executable function.
82
- * For EX: We have expression evolution as like ES6 expression string literals.
83
- *
84
- * @default null
85
- * @aspType string
86
-
87
- */
88
- itemTemplate?: string | Function;
78
+ * Accepts the template design and assigns it to each list item present in the popup.
79
+ * We have built-in `template engine`
80
+ *
81
+ * which provides options to compile template string into a executable function.
82
+ * For EX: We have expression evolution as like ES6 expression string literals.
83
+ *
84
+ * @default null
85
+ * @aspType string
86
+ * @deprecated
87
+ */
88
+ itemTemplate?: string | Function;
89
89
 
90
90
  /**
91
- * Accepts the template design and assigns it to the group headers present in the popup list.
92
- *
93
- * @default null
94
- * @aspType string
95
-
96
- */
97
- groupTemplate?: string | Function;
91
+ * Accepts the template design and assigns it to the group headers present in the popup list.
92
+ *
93
+ * @default null
94
+ * @aspType string
95
+ * @deprecated
96
+ */
97
+ groupTemplate?: string | Function;
98
98
 
99
99
  /**
100
- * Accepts the template design and assigns it to popup list of component
101
- * when no data is available on the component.
102
- *
103
- * @default 'No records found'
104
- * @aspType string
105
-
106
- */
107
- noRecordsTemplate?: string | Function;
100
+ * Accepts the template design and assigns it to popup list of component
101
+ * when no data is available on the component.
102
+ *
103
+ * @default 'No records found'
104
+ * @aspType string
105
+ * @deprecated
106
+ */
107
+ noRecordsTemplate?: string | Function;
108
108
 
109
109
  /**
110
- * Accepts the template and assigns it to the popup list content of the component
111
- * when the data fetch request from the remote server fails.
112
- *
113
- * @default 'Request failed'
114
- * @aspType string
115
-
116
- */
117
- actionFailureTemplate?: string | Function;
110
+ * Accepts the template and assigns it to the popup list content of the component
111
+ * when the data fetch request from the remote server fails.
112
+ *
113
+ * @default 'Request failed'
114
+ * @aspType string
115
+ * @deprecated
116
+ */
117
+ actionFailureTemplate?: string | Function;
118
118
 
119
119
  /**
120
- * Specifies the `sortOrder` to sort the data source. The available type of sort orders are
121
- * * `None` - The data source is not sorting.
122
- * * `Ascending` - The data source is sorting with ascending order.
123
- * * `Descending` - The data source is sorting with descending order.
124
- *
125
- * @default null
126
- * @asptype object
127
- * @aspjsonconverterignore
128
-
129
- */
130
- sortOrder?: SortOrder;
120
+ * Specifies the `sortOrder` to sort the data source. The available type of sort orders are
121
+ * * `None` - The data source is not sorting.
122
+ * * `Ascending` - The data source is sorting with ascending order.
123
+ * * `Descending` - The data source is sorting with descending order.
124
+ *
125
+ * @default null
126
+ * @asptype object
127
+ * @aspjsonconverterignore
128
+ * @deprecated
129
+ */
130
+ sortOrder?: SortOrder;
131
131
 
132
132
  /**
133
- * Accepts the list items either through local or remote service and binds it to the component.
134
- * It can be an array of JSON Objects or an instance of
135
- * `DataManager`.
136
- *
137
- * @default []
138
-
139
- */
140
- dataSource?: { [key: string]: Object }[] | DataManager | string[] | number[] | boolean[];
133
+ * Accepts the list items either through local or remote service and binds it to the component.
134
+ * It can be an array of JSON Objects or an instance of
135
+ * `DataManager`.
136
+ *
137
+ * @default []
138
+ * @deprecated
139
+ */
140
+ dataSource?: { [key: string]: Object }[] | DataManager | string[] | number[] | boolean[];
141
141
 
142
142
  /**
143
- * Accepts the external `Query`
144
- * which will execute along with the data processing.
145
- *
146
- * @default null
147
-
148
- */
149
- query?: Query;
143
+ * Accepts the external `Query`
144
+ * which will execute along with the data processing.
145
+ *
146
+ * @default null
147
+ * @deprecated
148
+ */
149
+ query?: Query;
150
150
 
151
151
  /**
152
- * Determines on which filter type, the component needs to be considered on search action.
153
- * The `FilterType` and its supported data types are
154
- *
155
- * <table>
156
- * <tr>
157
- * <td colSpan=1 rowSpan=1>
158
- * FilterType<br/></td><td colSpan=1 rowSpan=1>
159
- * Description<br/></td><td colSpan=1 rowSpan=1>
160
- * Supported Types<br/></td></tr>
161
- * <tr>
162
- * <td colSpan=1 rowSpan=1>
163
- * StartsWith<br/></td><td colSpan=1 rowSpan=1>
164
- * Checks whether a value begins with the specified value.<br/></td><td colSpan=1 rowSpan=1>
165
- * String<br/></td></tr>
166
- * <tr>
167
- * <td colSpan=1 rowSpan=1>
168
- * EndsWith<br/></td><td colSpan=1 rowSpan=1>
169
- * Checks whether a value ends with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
170
- * <br/>String<br/></td></tr>
171
- * <tr>
172
- * <td colSpan=1 rowSpan=1>
173
- * Contains<br/></td><td colSpan=1 rowSpan=1>
174
- * Checks whether a value contains with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
175
- * <br/>String<br/></td></tr>
176
- * </table>
177
- *
178
- * The default value set to `StartsWith`, all the suggestion items which contain typed characters to listed in the suggestion popup.
179
- *
180
- * @default 'StartsWith'
181
-
182
- */
183
- filterType?: FilterType;
152
+ * Determines on which filter type, the component needs to be considered on search action.
153
+ * The `FilterType` and its supported data types are
154
+ *
155
+ * <table>
156
+ * <tr>
157
+ * <td colSpan=1 rowSpan=1>
158
+ * FilterType<br/></td><td colSpan=1 rowSpan=1>
159
+ * Description<br/></td><td colSpan=1 rowSpan=1>
160
+ * Supported Types<br/></td></tr>
161
+ * <tr>
162
+ * <td colSpan=1 rowSpan=1>
163
+ * StartsWith<br/></td><td colSpan=1 rowSpan=1>
164
+ * Checks whether a value begins with the specified value.<br/></td><td colSpan=1 rowSpan=1>
165
+ * String<br/></td></tr>
166
+ * <tr>
167
+ * <td colSpan=1 rowSpan=1>
168
+ * EndsWith<br/></td><td colSpan=1 rowSpan=1>
169
+ * Checks whether a value ends with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
170
+ * <br/>String<br/></td></tr>
171
+ * <tr>
172
+ * <td colSpan=1 rowSpan=1>
173
+ * Contains<br/></td><td colSpan=1 rowSpan=1>
174
+ * Checks whether a value contains with specified value.<br/><br/></td><td colSpan=1 rowSpan=1>
175
+ * <br/>String<br/></td></tr>
176
+ * </table>
177
+ *
178
+ * The default value set to `StartsWith`, all the suggestion items which contain typed characters to listed in the suggestion popup.
179
+ *
180
+ * @default 'StartsWith'
181
+ * @deprecated
182
+ */
183
+ filterType?: FilterType;
184
184
 
185
185
  /**
186
- * When set to ‘false’, consider the `case-sensitive` on performing the search to find suggestions.
187
- * By default consider the casing.
188
- *
189
- * @default true
190
-
191
- */
192
- ignoreCase?: boolean;
186
+ * When set to ‘false’, consider the `case-sensitive` on performing the search to find suggestions.
187
+ * By default consider the casing.
188
+ *
189
+ * @default true
190
+ * @deprecated
191
+ */
192
+ ignoreCase?: boolean;
193
193
 
194
194
  /**
195
- * specifies the z-index value of the component popup element.
196
- *
197
- * @default 1000
198
-
199
- */
200
- zIndex?: number;
195
+ * specifies the z-index value of the component popup element.
196
+ *
197
+ * @default 1000
198
+ * @deprecated
199
+ */
200
+ zIndex?: number;
201
201
 
202
202
  /**
203
- * ignoreAccent set to true, then ignores the diacritic characters or accents when filtering.
204
- *
205
-
206
- */
207
- ignoreAccent?: boolean;
203
+ * ignoreAccent set to true, then ignores the diacritic characters or accents when filtering.
204
+ *
205
+ * @deprecated
206
+ */
207
+ ignoreAccent?: boolean;
208
208
 
209
209
  /**
210
- * Overrides the global culture and localization value for this component. Default global culture is 'en-US'.
211
- *
212
- * @default 'en-US'
213
-
214
- */
215
- locale?: string;
210
+ * Overrides the global culture and localization value for this component. Default global culture is 'en-US'.
211
+ *
212
+ * @default 'en-US'
213
+ * @deprecated
214
+ */
215
+ locale?: string;
216
216
 
217
217
  /**
218
- * Triggers before fetching data from the remote server.
219
- *
220
- * @event actionBegin
221
- */
222
- actionBegin?: EmitType<Object>;
218
+ * Triggers before fetching data from the remote server.
219
+ *
220
+ * @event actionBegin
221
+ */
222
+ actionBegin?: EmitType<Object>;
223
223
 
224
224
  /**
225
- * Triggers after data is fetched successfully from the remote server.
226
- *
227
- * @event actionComplete
228
- */
229
- actionComplete?: EmitType<Object>;
225
+ * Triggers after data is fetched successfully from the remote server.
226
+ *
227
+ * @event actionComplete
228
+ */
229
+ actionComplete?: EmitType<Object>;
230
230
 
231
231
  /**
232
- * Triggers when the data fetch request from the remote server fails.
233
- *
234
- * @event actionFailure
235
- */
236
- actionFailure?: EmitType<Object>;
232
+ * Triggers when the data fetch request from the remote server fails.
233
+ *
234
+ * @event actionFailure
235
+ */
236
+ actionFailure?: EmitType<Object>;
237
237
 
238
238
  /**
239
- * Triggers when an item in the popup is selected by the user either with mouse/tap or with keyboard navigation.
240
- *
241
- * @event select
242
- */
243
- select?: EmitType<SelectEventArgs>;
239
+ * Triggers when an item in the popup is selected by the user either with mouse/tap or with keyboard navigation.
240
+ *
241
+ * @event select
242
+ */
243
+ select?: EmitType<SelectEventArgs>;
244
244
 
245
245
  /**
246
- * Triggers when data source is populated in the popup list..
247
- *
248
- * @event dataBound
249
- */
250
- dataBound?: EmitType<Object>;
246
+ * Triggers when data source is populated in the popup list..
247
+ *
248
+ * @event dataBound
249
+ */
250
+ dataBound?: EmitType<Object>;
251
251
 
252
252
  /**
253
- * Triggers when the component is created.
254
- *
255
- * @event created
256
- */
257
- created?: EmitType<Object>;
253
+ * Triggers when the component is created.
254
+ *
255
+ * @event created
256
+ */
257
+ created?: EmitType<Object>;
258
258
 
259
259
  /**
260
-      * Triggers when the component is destroyed.
261
- *
262
-      * @event destroyed
263
-      */
264
- destroyed?: EmitType<Object>;
260
+      * Triggers when the component is destroyed.
261
+ *
262
+      * @event destroyed
263
+      */
264
+ destroyed?: EmitType<Object>;
265
265
 
266
266
  }
@@ -243,7 +243,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
243
243
  * ```
244
244
  *
245
245
  * @default {text: null, value: null, iconCss: null, groupBy: null}
246
-
246
+ * @deprecated
247
247
  */
248
248
  fields: FieldSettingsModel;
249
249
  /**
@@ -255,7 +255,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
255
255
  *
256
256
  * @default null
257
257
  * @aspType string
258
-
258
+ * @deprecated
259
259
  */
260
260
  itemTemplate: string | Function;
261
261
  /**
@@ -263,7 +263,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
263
263
  *
264
264
  * @default null
265
265
  * @aspType string
266
-
266
+ * @deprecated
267
267
  */
268
268
  groupTemplate: string | Function;
269
269
  /**
@@ -272,7 +272,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
272
272
  *
273
273
  * @default 'No records found'
274
274
  * @aspType string
275
-
275
+ * @deprecated
276
276
  */
277
277
  noRecordsTemplate: string | Function;
278
278
  /**
@@ -281,7 +281,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
281
281
  *
282
282
  * @default 'Request failed'
283
283
  * @aspType string
284
-
284
+ * @deprecated
285
285
  */
286
286
  actionFailureTemplate: string | Function;
287
287
  /**
@@ -293,7 +293,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
293
293
  * @default null
294
294
  * @asptype object
295
295
  * @aspjsonconverterignore
296
-
296
+ * @deprecated
297
297
  */
298
298
  sortOrder: SortOrder;
299
299
  /**
@@ -302,7 +302,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
302
302
  * `DataManager`.
303
303
  *
304
304
  * @default []
305
-
305
+ * @deprecated
306
306
  */
307
307
  dataSource: {
308
308
  [key: string]: Object;
@@ -312,7 +312,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
312
312
  * which will execute along with the data processing.
313
313
  *
314
314
  * @default null
315
-
315
+ * @deprecated
316
316
  */
317
317
  query: Query;
318
318
  /**
@@ -345,7 +345,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
345
345
  * The default value set to `StartsWith`, all the suggestion items which contain typed characters to listed in the suggestion popup.
346
346
  *
347
347
  * @default 'StartsWith'
348
-
348
+ * @deprecated
349
349
  */
350
350
  filterType: FilterType;
351
351
  /**
@@ -353,27 +353,27 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
353
353
  * By default consider the casing.
354
354
  *
355
355
  * @default true
356
-
356
+ * @deprecated
357
357
  */
358
358
  ignoreCase: boolean;
359
359
  /**
360
360
  * specifies the z-index value of the component popup element.
361
361
  *
362
362
  * @default 1000
363
-
363
+ * @deprecated
364
364
  */
365
365
  zIndex: number;
366
366
  /**
367
367
  * ignoreAccent set to true, then ignores the diacritic characters or accents when filtering.
368
368
  *
369
-
369
+ * @deprecated
370
370
  */
371
371
  ignoreAccent: boolean;
372
372
  /**
373
373
  * Overrides the global culture and localization value for this component. Default global culture is 'en-US'.
374
374
  *
375
375
  * @default 'en-US'
376
-
376
+ * @deprecated
377
377
  */
378
378
  locale: string;
379
379
  /**
@@ -638,7 +638,7 @@ export declare class DropDownBase extends Component<HTMLElement> implements INot
638
638
  * @param { Object[] } items - Specifies an array of JSON data or a JSON data.
639
639
  * @param { number } itemIndex - Specifies the index to place the newly added item in the popup list.
640
640
  * @returns {void}
641
-
641
+ * @deprecated
642
642
  */
643
643
  addItem(items: {
644
644
  [key: string]: Object;
@@ -710,7 +710,7 @@ export interface PopupEventArgs {
710
710
  /**
711
711
  * Specifies the popup Object.
712
712
  *
713
-
713
+ * @deprecated
714
714
  */
715
715
  popup: Popup;
716
716
  /**
@@ -1,22 +1,22 @@
1
- var __extends = (this && this.__extends) || (function () {
2
- var extendStatics = function (d, b) {
3
- extendStatics = Object.setPrototypeOf ||
4
- ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
- function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
6
- return extendStatics(d, b);
7
- };
8
- return function (d, b) {
9
- extendStatics(d, b);
10
- function __() { this.constructor = d; }
11
- d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
12
- };
13
- })();
14
- var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
15
- var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
16
- if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
17
- else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
18
- return c > 3 && r && Object.defineProperty(target, key, r), r;
19
- };
1
+ var __extends = (this && this.__extends) || (function () {
2
+ var extendStatics = function (d, b) {
3
+ extendStatics = Object.setPrototypeOf ||
4
+ ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
5
+ function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
6
+ return extendStatics(d, b);
7
+ };
8
+ return function (d, b) {
9
+ extendStatics(d, b);
10
+ function __() { this.constructor = d; }
11
+ d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
12
+ };
13
+ })();
14
+ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
15
+ var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
16
+ if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
17
+ else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
18
+ return c > 3 && r && Object.defineProperty(target, key, r), r;
19
+ };
20
20
  import { Component, EventHandler, addClass, append, Property, Event, L10n, compile } from '@syncfusion/ej2-base';
21
21
  import { setStyleAttribute, extend, removeClass, prepend, isNullOrUndefined, detach, getValue } from '@syncfusion/ej2-base';
22
22
  import { NotifyPropertyChanges, rippleEffect, ChildProperty, Complex } from '@syncfusion/ej2-base';
@@ -275,7 +275,9 @@ var DropDownBase = /** @class */ (function (_super) {
275
275
  }
276
276
  }
277
277
  else {
278
- ele.appendChild(noDataElement[i]);
278
+ if (noDataElement[i] instanceof HTMLElement) {
279
+ ele.appendChild(noDataElement[i]);
280
+ }
279
281
  }
280
282
  }
281
283
  }
@@ -1175,7 +1177,7 @@ var DropDownBase = /** @class */ (function (_super) {
1175
1177
  * @param { Object[] } items - Specifies an array of JSON data or a JSON data.
1176
1178
  * @param { number } itemIndex - Specifies the index to place the newly added item in the popup list.
1177
1179
  * @returns {void}
1178
-
1180
+ * @deprecated
1179
1181
  */
1180
1182
  DropDownBase.prototype.addItem = function (items, itemIndex) {
1181
1183
  if (!this.list || (this.list.textContent === this.noRecordsTemplate && this.getModuleName() !== 'listbox')) {