@covalent/core 3.1.2 → 4.0.0

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 (317) hide show
  1. package/bundles/covalent-core-user-profile.umd.js +1 -9
  2. package/bundles/covalent-core-user-profile.umd.js.map +1 -1
  3. package/bundles/covalent-core-user-profile.umd.min.js.map +1 -1
  4. package/esm2015/user-profile/user-profile.module.js +3 -11
  5. package/fesm2015/covalent-core-user-profile.js +1 -9
  6. package/fesm2015/covalent-core-user-profile.js.map +1 -1
  7. package/package.json +1 -1
  8. package/schematics/components.js +1 -14
  9. package/schematics/components.js.map +1 -1
  10. package/theming/_all-theme.scss +0 -14
  11. package/theming/prebuilt/blue-grey-deep-orange.css +0 -248
  12. package/theming/prebuilt/blue-grey-deep-orange.css.map +1 -1
  13. package/theming/prebuilt/blue-orange.css +0 -248
  14. package/theming/prebuilt/blue-orange.css.map +1 -1
  15. package/theming/prebuilt/indigo-pink.css +0 -248
  16. package/theming/prebuilt/indigo-pink.css.map +1 -1
  17. package/theming/prebuilt/orange-light-blue.css +0 -248
  18. package/theming/prebuilt/orange-light-blue.css.map +1 -1
  19. package/theming/prebuilt/teal-orange.css +0 -248
  20. package/theming/prebuilt/teal-orange.css.map +1 -1
  21. package/typography/_all-typography.scss +0 -10
  22. package/user-profile/covalent-core-user-profile.metadata.json +1 -1
  23. package/bundles/covalent-core-chips.umd.js +0 -1507
  24. package/bundles/covalent-core-chips.umd.js.map +0 -1
  25. package/bundles/covalent-core-chips.umd.min.js +0 -16
  26. package/bundles/covalent-core-chips.umd.min.js.map +0 -1
  27. package/bundles/covalent-core-data-table.umd.js +0 -2756
  28. package/bundles/covalent-core-data-table.umd.js.map +0 -1
  29. package/bundles/covalent-core-data-table.umd.min.js +0 -16
  30. package/bundles/covalent-core-data-table.umd.min.js.map +0 -1
  31. package/bundles/covalent-core-expansion-panel.umd.js +0 -853
  32. package/bundles/covalent-core-expansion-panel.umd.js.map +0 -1
  33. package/bundles/covalent-core-expansion-panel.umd.min.js +0 -16
  34. package/bundles/covalent-core-expansion-panel.umd.min.js.map +0 -1
  35. package/bundles/covalent-core-loading.umd.js +0 -1534
  36. package/bundles/covalent-core-loading.umd.js.map +0 -1
  37. package/bundles/covalent-core-loading.umd.min.js +0 -16
  38. package/bundles/covalent-core-loading.umd.min.js.map +0 -1
  39. package/bundles/covalent-core-media.umd.js +0 -749
  40. package/bundles/covalent-core-media.umd.js.map +0 -1
  41. package/bundles/covalent-core-media.umd.min.js +0 -16
  42. package/bundles/covalent-core-media.umd.min.js.map +0 -1
  43. package/bundles/covalent-core-nav-links.umd.js +0 -197
  44. package/bundles/covalent-core-nav-links.umd.js.map +0 -1
  45. package/bundles/covalent-core-nav-links.umd.min.js +0 -2
  46. package/bundles/covalent-core-nav-links.umd.min.js.map +0 -1
  47. package/bundles/covalent-core-notifications.umd.js +0 -275
  48. package/bundles/covalent-core-notifications.umd.js.map +0 -1
  49. package/bundles/covalent-core-notifications.umd.min.js +0 -2
  50. package/bundles/covalent-core-notifications.umd.min.js.map +0 -1
  51. package/bundles/covalent-core-paging.umd.js +0 -491
  52. package/bundles/covalent-core-paging.umd.js.map +0 -1
  53. package/bundles/covalent-core-paging.umd.min.js +0 -2
  54. package/bundles/covalent-core-paging.umd.min.js.map +0 -1
  55. package/bundles/covalent-core-sidesheet.umd.js +0 -145
  56. package/bundles/covalent-core-sidesheet.umd.js.map +0 -1
  57. package/bundles/covalent-core-sidesheet.umd.min.js +0 -2
  58. package/bundles/covalent-core-sidesheet.umd.min.js.map +0 -1
  59. package/bundles/covalent-core-steps.umd.js +0 -1756
  60. package/bundles/covalent-core-steps.umd.js.map +0 -1
  61. package/bundles/covalent-core-steps.umd.min.js +0 -16
  62. package/bundles/covalent-core-steps.umd.min.js.map +0 -1
  63. package/bundles/covalent-core-tab-select.umd.js +0 -732
  64. package/bundles/covalent-core-tab-select.umd.js.map +0 -1
  65. package/bundles/covalent-core-tab-select.umd.min.js +0 -16
  66. package/bundles/covalent-core-tab-select.umd.min.js.map +0 -1
  67. package/bundles/covalent-core-virtual-scroll.umd.js +0 -785
  68. package/bundles/covalent-core-virtual-scroll.umd.js.map +0 -1
  69. package/bundles/covalent-core-virtual-scroll.umd.min.js +0 -16
  70. package/bundles/covalent-core-virtual-scroll.umd.min.js.map +0 -1
  71. package/chips/README.md +0 -99
  72. package/chips/_chips-theme.scss +0 -87
  73. package/chips/chips.component.d.ts +0 -287
  74. package/chips/chips.component.scss +0 -147
  75. package/chips/chips.module.d.ts +0 -2
  76. package/chips/covalent-core-chips.d.ts +0 -4
  77. package/chips/covalent-core-chips.metadata.json +0 -1
  78. package/chips/index.d.ts +0 -1
  79. package/chips/package.json +0 -11
  80. package/chips/public-api.d.ts +0 -2
  81. package/data-table/README.md +0 -134
  82. package/data-table/_data-table-theme.scss +0 -115
  83. package/data-table/covalent-core-data-table.d.ts +0 -4
  84. package/data-table/covalent-core-data-table.metadata.json +0 -1
  85. package/data-table/data-table-cell/data-table-cell.component.d.ts +0 -22
  86. package/data-table/data-table-cell/data-table-cell.component.scss +0 -58
  87. package/data-table/data-table-column/data-table-column.component.d.ts +0 -63
  88. package/data-table/data-table-column/data-table-column.component.scss +0 -80
  89. package/data-table/data-table-row/data-table-row.component.d.ts +0 -20
  90. package/data-table/data-table-row/data-table-row.component.scss +0 -12
  91. package/data-table/data-table-table/data-table-table.component.d.ts +0 -6
  92. package/data-table/data-table-table/data-table-table.component.scss +0 -7
  93. package/data-table/data-table.component.d.ts +0 -356
  94. package/data-table/data-table.component.scss +0 -93
  95. package/data-table/data-table.module.d.ts +0 -2
  96. package/data-table/directives/data-table-template.directive.d.ts +0 -6
  97. package/data-table/index.d.ts +0 -1
  98. package/data-table/package.json +0 -11
  99. package/data-table/public-api.d.ts +0 -8
  100. package/data-table/services/data-table.service.d.ts +0 -31
  101. package/esm2015/chips/chips.component.js +0 -1115
  102. package/esm2015/chips/chips.module.js +0 -23
  103. package/esm2015/chips/covalent-core-chips.js +0 -10
  104. package/esm2015/chips/index.js +0 -7
  105. package/esm2015/chips/public-api.js +0 -8
  106. package/esm2015/data-table/covalent-core-data-table.js +0 -10
  107. package/esm2015/data-table/data-table-cell/data-table-cell.component.js +0 -88
  108. package/esm2015/data-table/data-table-column/data-table-column.component.js +0 -218
  109. package/esm2015/data-table/data-table-row/data-table-row.component.js +0 -132
  110. package/esm2015/data-table/data-table-table/data-table-table.component.js +0 -43
  111. package/esm2015/data-table/data-table.component.js +0 -1640
  112. package/esm2015/data-table/data-table.module.js +0 -39
  113. package/esm2015/data-table/directives/data-table-template.directive.js +0 -32
  114. package/esm2015/data-table/index.js +0 -7
  115. package/esm2015/data-table/public-api.js +0 -14
  116. package/esm2015/data-table/services/data-table.service.js +0 -116
  117. package/esm2015/expansion-panel/covalent-core-expansion-panel.js +0 -10
  118. package/esm2015/expansion-panel/expansion-panel-group.component.js +0 -212
  119. package/esm2015/expansion-panel/expansion-panel.component.js +0 -272
  120. package/esm2015/expansion-panel/expansion-panel.module.js +0 -31
  121. package/esm2015/expansion-panel/index.js +0 -7
  122. package/esm2015/expansion-panel/public-api.js +0 -9
  123. package/esm2015/loading/covalent-core-loading.js +0 -10
  124. package/esm2015/loading/directives/loading.directive.js +0 -231
  125. package/esm2015/loading/index.js +0 -7
  126. package/esm2015/loading/loading.component.js +0 -302
  127. package/esm2015/loading/loading.module.js +0 -30
  128. package/esm2015/loading/public-api.js +0 -11
  129. package/esm2015/loading/services/loading.factory.js +0 -297
  130. package/esm2015/loading/services/loading.service.js +0 -319
  131. package/esm2015/media/covalent-core-media.js +0 -10
  132. package/esm2015/media/directives/media-toggle.directive.js +0 -207
  133. package/esm2015/media/index.js +0 -7
  134. package/esm2015/media/media.module.js +0 -20
  135. package/esm2015/media/public-api.js +0 -9
  136. package/esm2015/media/services/media.service.js +0 -169
  137. package/esm2015/nav-links/covalent-core-nav-links.js +0 -10
  138. package/esm2015/nav-links/index.js +0 -7
  139. package/esm2015/nav-links/nav-links.component.js +0 -138
  140. package/esm2015/nav-links/nav-links.module.js +0 -37
  141. package/esm2015/nav-links/public-api.js +0 -8
  142. package/esm2015/notifications/covalent-core-notifications.js +0 -10
  143. package/esm2015/notifications/index.js +0 -7
  144. package/esm2015/notifications/notification-count.component.js +0 -191
  145. package/esm2015/notifications/notifications.module.js +0 -20
  146. package/esm2015/notifications/public-api.js +0 -8
  147. package/esm2015/paging/covalent-core-paging.js +0 -10
  148. package/esm2015/paging/index.js +0 -7
  149. package/esm2015/paging/paging-bar.component.js +0 -412
  150. package/esm2015/paging/paging.module.js +0 -20
  151. package/esm2015/paging/public-api.js +0 -8
  152. package/esm2015/sidesheet/covalent-core-sidesheet.js +0 -10
  153. package/esm2015/sidesheet/index.js +0 -7
  154. package/esm2015/sidesheet/public-api.js +0 -8
  155. package/esm2015/sidesheet/sidesheet.component.js +0 -72
  156. package/esm2015/sidesheet/sidesheet.module.js +0 -27
  157. package/esm2015/steps/covalent-core-steps.js +0 -10
  158. package/esm2015/steps/index.js +0 -7
  159. package/esm2015/steps/nav/nav-step-link/nav-step-link.component.js +0 -144
  160. package/esm2015/steps/nav/nav-steps-horizontal/nav-steps-horizontal.component.js +0 -371
  161. package/esm2015/steps/nav/nav-steps-vertical/nav-steps-vertical.component.js +0 -130
  162. package/esm2015/steps/public-api.js +0 -14
  163. package/esm2015/steps/step-body/step-body.component.js +0 -83
  164. package/esm2015/steps/step-header/step-header.component.js +0 -79
  165. package/esm2015/steps/step.component.js +0 -312
  166. package/esm2015/steps/steps.component.js +0 -234
  167. package/esm2015/steps/steps.module.js +0 -44
  168. package/esm2015/tab-select/covalent-core-tab-select.js +0 -10
  169. package/esm2015/tab-select/index.js +0 -7
  170. package/esm2015/tab-select/public-api.js +0 -9
  171. package/esm2015/tab-select/tab-option.component.js +0 -82
  172. package/esm2015/tab-select/tab-select.component.js +0 -291
  173. package/esm2015/tab-select/tab-select.module.js +0 -31
  174. package/esm2015/virtual-scroll/covalent-core-virtual-scroll.js +0 -10
  175. package/esm2015/virtual-scroll/index.js +0 -7
  176. package/esm2015/virtual-scroll/public-api.js +0 -9
  177. package/esm2015/virtual-scroll/virtual-scroll-container.component.js +0 -391
  178. package/esm2015/virtual-scroll/virtual-scroll-row.directive.js +0 -25
  179. package/esm2015/virtual-scroll/virtual-scroll.module.js +0 -21
  180. package/expansion-panel/README.md +0 -116
  181. package/expansion-panel/_expansion-panel-theme.scss +0 -80
  182. package/expansion-panel/covalent-core-expansion-panel.d.ts +0 -4
  183. package/expansion-panel/covalent-core-expansion-panel.metadata.json +0 -1
  184. package/expansion-panel/expansion-panel-group.component.d.ts +0 -31
  185. package/expansion-panel/expansion-panel-group.component.scss +0 -0
  186. package/expansion-panel/expansion-panel.component.d.ts +0 -82
  187. package/expansion-panel/expansion-panel.component.scss +0 -50
  188. package/expansion-panel/expansion-panel.module.d.ts +0 -2
  189. package/expansion-panel/index.d.ts +0 -1
  190. package/expansion-panel/package.json +0 -11
  191. package/expansion-panel/public-api.d.ts +0 -3
  192. package/fesm2015/covalent-core-chips.js +0 -1151
  193. package/fesm2015/covalent-core-chips.js.map +0 -1
  194. package/fesm2015/covalent-core-data-table.js +0 -2309
  195. package/fesm2015/covalent-core-data-table.js.map +0 -1
  196. package/fesm2015/covalent-core-expansion-panel.js +0 -528
  197. package/fesm2015/covalent-core-expansion-panel.js.map +0 -1
  198. package/fesm2015/covalent-core-loading.js +0 -1179
  199. package/fesm2015/covalent-core-loading.js.map +0 -1
  200. package/fesm2015/covalent-core-media.js +0 -411
  201. package/fesm2015/covalent-core-media.js.map +0 -1
  202. package/fesm2015/covalent-core-nav-links.js +0 -193
  203. package/fesm2015/covalent-core-nav-links.js.map +0 -1
  204. package/fesm2015/covalent-core-notifications.js +0 -228
  205. package/fesm2015/covalent-core-notifications.js.map +0 -1
  206. package/fesm2015/covalent-core-paging.js +0 -451
  207. package/fesm2015/covalent-core-paging.js.map +0 -1
  208. package/fesm2015/covalent-core-sidesheet.js +0 -118
  209. package/fesm2015/covalent-core-sidesheet.js.map +0 -1
  210. package/fesm2015/covalent-core-steps.js +0 -1384
  211. package/fesm2015/covalent-core-steps.js.map +0 -1
  212. package/fesm2015/covalent-core-tab-select.js +0 -416
  213. package/fesm2015/covalent-core-tab-select.js.map +0 -1
  214. package/fesm2015/covalent-core-virtual-scroll.js +0 -453
  215. package/fesm2015/covalent-core-virtual-scroll.js.map +0 -1
  216. package/loading/README.md +0 -180
  217. package/loading/_loading-theme.scss +0 -10
  218. package/loading/covalent-core-loading.d.ts +0 -4
  219. package/loading/covalent-core-loading.metadata.json +0 -1
  220. package/loading/directives/loading.directive.d.ts +0 -71
  221. package/loading/index.d.ts +0 -1
  222. package/loading/loading.component.d.ts +0 -87
  223. package/loading/loading.component.scss +0 -42
  224. package/loading/loading.module.d.ts +0 -2
  225. package/loading/package.json +0 -11
  226. package/loading/public-api.d.ts +0 -5
  227. package/loading/services/loading.factory.d.ts +0 -66
  228. package/loading/services/loading.service.d.ts +0 -118
  229. package/media/covalent-core-media.d.ts +0 -4
  230. package/media/covalent-core-media.metadata.json +0 -1
  231. package/media/directives/media-toggle.directive.d.ts +0 -42
  232. package/media/index.d.ts +0 -1
  233. package/media/media.module.d.ts +0 -2
  234. package/media/package.json +0 -11
  235. package/media/public-api.d.ts +0 -3
  236. package/media/services/media.service.d.ts +0 -31
  237. package/nav-links/README.md +0 -1
  238. package/nav-links/covalent-core-nav-links.d.ts +0 -4
  239. package/nav-links/covalent-core-nav-links.metadata.json +0 -1
  240. package/nav-links/index.d.ts +0 -1
  241. package/nav-links/nav-links.component.d.ts +0 -51
  242. package/nav-links/nav-links.component.scss +0 -15
  243. package/nav-links/nav-links.module.d.ts +0 -2
  244. package/nav-links/package.json +0 -11
  245. package/nav-links/public-api.d.ts +0 -2
  246. package/notifications/README.md +0 -69
  247. package/notifications/_notification-count-theme.scss +0 -27
  248. package/notifications/covalent-core-notifications.d.ts +0 -4
  249. package/notifications/covalent-core-notifications.metadata.json +0 -1
  250. package/notifications/index.d.ts +0 -1
  251. package/notifications/notification-count.component.d.ts +0 -74
  252. package/notifications/notification-count.component.scss +0 -90
  253. package/notifications/notifications.module.d.ts +0 -2
  254. package/notifications/package.json +0 -11
  255. package/notifications/public-api.d.ts +0 -2
  256. package/paging/README.md +0 -141
  257. package/paging/_paging-bar-theme.scss +0 -26
  258. package/paging/covalent-core-paging.d.ts +0 -4
  259. package/paging/covalent-core-paging.metadata.json +0 -1
  260. package/paging/index.d.ts +0 -1
  261. package/paging/package.json +0 -11
  262. package/paging/paging-bar.component.d.ts +0 -115
  263. package/paging/paging-bar.component.scss +0 -23
  264. package/paging/paging.module.d.ts +0 -2
  265. package/paging/public-api.d.ts +0 -2
  266. package/sidesheet/README.md +0 -68
  267. package/sidesheet/covalent-core-sidesheet.d.ts +0 -4
  268. package/sidesheet/covalent-core-sidesheet.metadata.json +0 -1
  269. package/sidesheet/index.d.ts +0 -1
  270. package/sidesheet/package.json +0 -11
  271. package/sidesheet/public-api.d.ts +0 -2
  272. package/sidesheet/sidesheet.component.d.ts +0 -13
  273. package/sidesheet/sidesheet.component.scss +0 -101
  274. package/sidesheet/sidesheet.module.d.ts +0 -2
  275. package/steps/README.md +0 -159
  276. package/steps/_steps-theme.scss +0 -108
  277. package/steps/covalent-core-steps.d.ts +0 -4
  278. package/steps/covalent-core-steps.metadata.json +0 -1
  279. package/steps/index.d.ts +0 -1
  280. package/steps/nav/README.md +0 -90
  281. package/steps/nav/nav-step-link/nav-step-link.component.d.ts +0 -42
  282. package/steps/nav/nav-step-link/nav-step-link.component.scss +0 -17
  283. package/steps/nav/nav-steps-horizontal/nav-steps-horizontal.component.d.ts +0 -79
  284. package/steps/nav/nav-steps-horizontal/nav-steps-horizontal.component.scss +0 -83
  285. package/steps/nav/nav-steps-vertical/nav-steps-vertical.component.d.ts +0 -18
  286. package/steps/nav/nav-steps-vertical/nav-steps-vertical.component.scss +0 -18
  287. package/steps/package.json +0 -11
  288. package/steps/public-api.d.ts +0 -8
  289. package/steps/step-body/step-body.component.d.ts +0 -25
  290. package/steps/step-body/step-body.component.scss +0 -29
  291. package/steps/step-header/step-header.component.d.ts +0 -35
  292. package/steps/step-header/step-header.component.scss +0 -90
  293. package/steps/step.component.d.ts +0 -97
  294. package/steps/steps.component.d.ts +0 -60
  295. package/steps/steps.component.scss +0 -55
  296. package/steps/steps.module.d.ts +0 -2
  297. package/tab-select/README.md +0 -93
  298. package/tab-select/covalent-core-tab-select.d.ts +0 -4
  299. package/tab-select/covalent-core-tab-select.metadata.json +0 -1
  300. package/tab-select/index.d.ts +0 -1
  301. package/tab-select/package.json +0 -11
  302. package/tab-select/public-api.d.ts +0 -3
  303. package/tab-select/tab-option.component.d.ts +0 -20
  304. package/tab-select/tab-option.component.scss +0 -0
  305. package/tab-select/tab-select.component.d.ts +0 -62
  306. package/tab-select/tab-select.component.scss +0 -3
  307. package/tab-select/tab-select.module.d.ts +0 -2
  308. package/virtual-scroll/README.md +0 -68
  309. package/virtual-scroll/covalent-core-virtual-scroll.d.ts +0 -4
  310. package/virtual-scroll/covalent-core-virtual-scroll.metadata.json +0 -1
  311. package/virtual-scroll/index.d.ts +0 -1
  312. package/virtual-scroll/package.json +0 -11
  313. package/virtual-scroll/public-api.d.ts +0 -3
  314. package/virtual-scroll/virtual-scroll-container.component.d.ts +0 -73
  315. package/virtual-scroll/virtual-scroll-container.component.scss +0 -7
  316. package/virtual-scroll/virtual-scroll-row.directive.d.ts +0 -5
  317. package/virtual-scroll/virtual-scroll.module.d.ts +0 -2
@@ -1,1151 +0,0 @@
1
- import { Directive, TemplateRef, ViewContainerRef, EventEmitter, Component, forwardRef, ChangeDetectionStrategy, ElementRef, Renderer2, Optional, Inject, ChangeDetectorRef, ViewChild, ViewChildren, ContentChild, Input, Output, HostBinding, HostListener, NgModule } from '@angular/core';
2
- import { FormControl, NG_VALUE_ACCESSOR, ReactiveFormsModule } from '@angular/forms';
3
- import { DOCUMENT, CommonModule } from '@angular/common';
4
- import { MatInput, MatInputModule } from '@angular/material/input';
5
- import { MatIconModule } from '@angular/material/icon';
6
- import { MatAutocompleteTrigger, MatAutocompleteModule } from '@angular/material/autocomplete';
7
- import { MatChip, MatChipsModule } from '@angular/material/chips';
8
- import { TemplatePortalDirective } from '@angular/cdk/portal';
9
- import { coerceBooleanProperty } from '@angular/cdk/coercion';
10
- import { ESCAPE, TAB, RIGHT_ARROW, BACKSPACE, DELETE, LEFT_ARROW, UP_ARROW, DOWN_ARROW } from '@angular/cdk/keycodes';
11
- import { MatOption } from '@angular/material/core';
12
- import { Subscription, timer, merge, fromEvent } from 'rxjs';
13
- import { debounceTime, filter } from 'rxjs/operators';
14
- import { mixinControlValueAccessor, mixinDisabled } from '@covalent/core/common';
15
-
16
- /**
17
- * @fileoverview added by tsickle
18
- * Generated from: chips.component.ts
19
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
20
- */
21
- class TdChipDirective extends TemplatePortalDirective {
22
- /**
23
- * @param {?} templateRef
24
- * @param {?} viewContainerRef
25
- */
26
- constructor(templateRef, viewContainerRef) {
27
- super(templateRef, viewContainerRef);
28
- }
29
- }
30
- TdChipDirective.decorators = [
31
- { type: Directive, args: [{
32
- selector: '[td-chip]ng-template',
33
- },] }
34
- ];
35
- /** @nocollapse */
36
- TdChipDirective.ctorParameters = () => [
37
- { type: TemplateRef },
38
- { type: ViewContainerRef }
39
- ];
40
- class TdAutocompleteOptionDirective extends TemplatePortalDirective {
41
- /**
42
- * @param {?} templateRef
43
- * @param {?} viewContainerRef
44
- */
45
- constructor(templateRef, viewContainerRef) {
46
- super(templateRef, viewContainerRef);
47
- }
48
- }
49
- TdAutocompleteOptionDirective.decorators = [
50
- { type: Directive, args: [{
51
- selector: '[td-autocomplete-option]ng-template',
52
- },] }
53
- ];
54
- /** @nocollapse */
55
- TdAutocompleteOptionDirective.ctorParameters = () => [
56
- { type: TemplateRef },
57
- { type: ViewContainerRef }
58
- ];
59
- class TdChipsBase {
60
- /**
61
- * @param {?} _changeDetectorRef
62
- */
63
- constructor(_changeDetectorRef) {
64
- this._changeDetectorRef = _changeDetectorRef;
65
- }
66
- }
67
- if (false) {
68
- /** @type {?} */
69
- TdChipsBase.prototype._changeDetectorRef;
70
- }
71
- /* tslint:disable-next-line */
72
- /** @type {?} */
73
- const _TdChipsMixinBase = mixinControlValueAccessor(mixinDisabled(TdChipsBase), []);
74
- class TdChipsComponent extends _TdChipsMixinBase {
75
- /**
76
- * @param {?} _elementRef
77
- * @param {?} _renderer
78
- * @param {?} _document
79
- * @param {?} _changeDetectorRef
80
- */
81
- constructor(_elementRef, _renderer, _document, _changeDetectorRef) {
82
- super(_changeDetectorRef);
83
- this._elementRef = _elementRef;
84
- this._renderer = _renderer;
85
- this._document = _document;
86
- this._outsideClickSubs = Subscription.EMPTY;
87
- this._inputValueChangesSubs = Subscription.EMPTY;
88
- this._isMousedown = false;
89
- this._length = 0;
90
- this._stacked = false;
91
- this._requireMatch = false;
92
- this._color = 'primary';
93
- this._inputPosition = 'after';
94
- this._chipAddition = true;
95
- this._chipRemoval = true;
96
- this._focused = false;
97
- this._required = false;
98
- this._tabIndex = 0;
99
- this._touchendDebounce = 100;
100
- this._internalClick = false;
101
- this._internalActivateOption = false;
102
- /**
103
- * FormControl for the matInput element.
104
- */
105
- this.inputControl = new FormControl();
106
- /**
107
- * debounce?: number
108
- * Debounce timeout between keypresses. Defaults to 200.
109
- */
110
- this.debounce = 200;
111
- /**
112
- * add?: function
113
- * Method to be executed when a chip is added.
114
- * Sends chip value as event.
115
- */
116
- this.add = new EventEmitter();
117
- /**
118
- * remove?: function
119
- * Method to be executed when a chip is removed.
120
- * Sends chip value as event.
121
- */
122
- this.remove = new EventEmitter();
123
- /**
124
- * inputChange?: function
125
- * Method to be executed when the value in the autocomplete input changes.
126
- * Sends string value as event.
127
- */
128
- this.inputChange = new EventEmitter();
129
- /**
130
- * chipFocus?: function
131
- * Method to be executed when a chip is focused.
132
- * Sends chip value as event.
133
- */
134
- this.chipFocus = new EventEmitter();
135
- /**
136
- * blur?: function
137
- * Method to be executed when a chip is blurred.
138
- * Sends chip value as event.
139
- */
140
- this.chipBlur = new EventEmitter();
141
- /**
142
- * compareWith? function
143
- * Function used to check whether a chip value already exists.
144
- * Defaults to strict equality comparison ===
145
- */
146
- this.compareWith = (/**
147
- * @param {?} o1
148
- * @param {?} o2
149
- * @return {?}
150
- */
151
- (o1, o2) => {
152
- return o1 === o2;
153
- });
154
- this._renderer.addClass(this._elementRef.nativeElement, 'mat-' + this._color);
155
- }
156
- /**
157
- * Flag that is true when autocomplete is focused.
158
- * @return {?}
159
- */
160
- get focused() {
161
- return this._focused;
162
- }
163
- /**
164
- * items?: any[]
165
- * Renders the `mat-autocomplete` with the provided list to display as options.
166
- * @param {?} items
167
- * @return {?}
168
- */
169
- set items(items) {
170
- this._items = items;
171
- this._setFirstOptionActive();
172
- this._changeDetectorRef.markForCheck();
173
- }
174
- /**
175
- * @return {?}
176
- */
177
- get items() {
178
- return this._items;
179
- }
180
- /**
181
- * stacked?: boolean
182
- * Set stacked or horizontal chips depending on value.
183
- * Defaults to false.
184
- * @param {?} stacked
185
- * @return {?}
186
- */
187
- set stacked(stacked) {
188
- this._stacked = coerceBooleanProperty(stacked);
189
- }
190
- /**
191
- * @return {?}
192
- */
193
- get stacked() {
194
- return this._stacked;
195
- }
196
- /**
197
- * inputPosition?: 'before' | 'after'
198
- * Set input position before or after the chips.
199
- * Defaults to 'after'.
200
- * @param {?} inputPosition
201
- * @return {?}
202
- */
203
- set inputPosition(inputPosition) {
204
- this._inputPosition = inputPosition;
205
- }
206
- /**
207
- * @return {?}
208
- */
209
- get inputPosition() {
210
- return this._inputPosition;
211
- }
212
- /**
213
- * requireMatch?: boolean
214
- * Blocks custom inputs and only allows selections from the autocomplete list.
215
- * @param {?} requireMatch
216
- * @return {?}
217
- */
218
- set requireMatch(requireMatch) {
219
- this._requireMatch = coerceBooleanProperty(requireMatch);
220
- }
221
- /**
222
- * @return {?}
223
- */
224
- get requireMatch() {
225
- return this._requireMatch;
226
- }
227
- /**
228
- * required?: boolean
229
- * Value is set to true if at least one chip is needed
230
- * Defaults to false
231
- * @param {?} required
232
- * @return {?}
233
- */
234
- set required(required) {
235
- this._required = coerceBooleanProperty(required);
236
- }
237
- /**
238
- * @return {?}
239
- */
240
- get required() {
241
- return this._required;
242
- }
243
- /**
244
- * chipAddition?: boolean
245
- * Disables the ability to add chips. When setting disabled as true, this will be overriden.
246
- * Defaults to true.
247
- * @param {?} chipAddition
248
- * @return {?}
249
- */
250
- set chipAddition(chipAddition) {
251
- this._chipAddition = chipAddition;
252
- this._toggleInput();
253
- }
254
- /**
255
- * @return {?}
256
- */
257
- get chipAddition() {
258
- return this._chipAddition;
259
- }
260
- /**
261
- * Checks if not in disabled state and if chipAddition is set to 'true'
262
- * States if a chip can be added and if the input is available
263
- * @return {?}
264
- */
265
- get canAddChip() {
266
- return this.chipAddition && !this.disabled;
267
- }
268
- /**
269
- * chipRemoval?: boolean
270
- * Disables the ability to remove chips. If it doesn't exist chip remmoval defaults to true.
271
- * When setting disabled as true, this will be overriden to false.
272
- * @param {?} chipRemoval
273
- * @return {?}
274
- */
275
- set chipRemoval(chipRemoval) {
276
- this._chipRemoval = chipRemoval;
277
- }
278
- /**
279
- * @return {?}
280
- */
281
- get chipRemoval() {
282
- return this._chipRemoval;
283
- }
284
- /**
285
- * Checks if not in disabled state and if chipRemoval is set to 'true'
286
- * States if a chip can be removed
287
- * @return {?}
288
- */
289
- get canRemoveChip() {
290
- return this.chipRemoval && !this.disabled;
291
- }
292
- /**
293
- * returns the display placeholder
294
- * @return {?}
295
- */
296
- get displayPlaceHolder() {
297
- if (!this.canAddChip) {
298
- return '';
299
- }
300
- return this._required ? `${this.placeholder} *` : this.placeholder;
301
- }
302
- /**
303
- * color?: 'primary' | 'accent' | 'warn'
304
- * Sets the color for the input and focus/selected state of the chips.
305
- * Defaults to 'primary'
306
- * @param {?} color
307
- * @return {?}
308
- */
309
- set color(color) {
310
- if (color) {
311
- this._renderer.removeClass(this._elementRef.nativeElement, 'mat-' + this._color);
312
- this._color = color;
313
- this._renderer.addClass(this._elementRef.nativeElement, 'mat-' + this._color);
314
- }
315
- }
316
- /**
317
- * @return {?}
318
- */
319
- get color() {
320
- return this._color;
321
- }
322
- /**
323
- * Hostbinding to set the a11y of the TdChipsComponent depending on its state
324
- * @return {?}
325
- */
326
- get tabIndex() {
327
- return this.disabled ? -1 : this._tabIndex;
328
- }
329
- /**
330
- * Listens to host focus event to act on it
331
- * @param {?} event
332
- * @return {?}
333
- */
334
- focusListener(event) {
335
- // should only focus if its not via mousedown to prevent clashing with autocomplete
336
- if (!this._isMousedown) {
337
- this.focus();
338
- }
339
- event.preventDefault();
340
- }
341
- /**
342
- * Listens to host mousedown event to act on it
343
- * @param {?} event
344
- * @return {?}
345
- */
346
- mousedownListener(event) {
347
- // sets a flag to know if there was a mousedown and then it returns it back to false
348
- this._isMousedown = true;
349
- timer()
350
- .toPromise()
351
- .then((/**
352
- * @return {?}
353
- */
354
- () => {
355
- this._isMousedown = false;
356
- }));
357
- }
358
- /**
359
- * If clicking on :host or `td-chips-wrapper`, then we stop the click propagation so the autocomplete
360
- * doesnt close automatically.
361
- * @param {?} event
362
- * @return {?}
363
- */
364
- clickListener(event) {
365
- /** @type {?} */
366
- const clickTarget = (/** @type {?} */ (event.target));
367
- if (clickTarget === this._elementRef.nativeElement || clickTarget.className.indexOf('td-chips-wrapper') > -1) {
368
- this.focus();
369
- event.preventDefault();
370
- event.stopPropagation();
371
- }
372
- }
373
- /**
374
- * Listens to host keydown event to act on it depending on the keypress
375
- * @param {?} event
376
- * @return {?}
377
- */
378
- keydownListener(event) {
379
- switch (event.keyCode) {
380
- case TAB:
381
- // if tabing out, then unfocus the component
382
- timer()
383
- .toPromise()
384
- .then((/**
385
- * @return {?}
386
- */
387
- () => {
388
- this.removeFocusedState();
389
- }));
390
- break;
391
- case ESCAPE:
392
- if (this._inputChild.focused) {
393
- this._nativeInput.nativeElement.blur();
394
- this.removeFocusedState();
395
- this._closeAutocomplete();
396
- }
397
- else {
398
- this.focus();
399
- }
400
- break;
401
- default:
402
- // default
403
- }
404
- }
405
- /**
406
- * @return {?}
407
- */
408
- ngOnInit() {
409
- this._inputValueChangesSubs = this.inputControl.valueChanges
410
- .pipe(debounceTime(this.debounce))
411
- .subscribe((/**
412
- * @param {?} value
413
- * @return {?}
414
- */
415
- (value) => {
416
- this.inputChange.emit(value ? value : '');
417
- }));
418
- this._changeDetectorRef.markForCheck();
419
- }
420
- /**
421
- * @return {?}
422
- */
423
- ngAfterViewInit() {
424
- this._watchOutsideClick();
425
- this._changeDetectorRef.markForCheck();
426
- }
427
- /**
428
- * @return {?}
429
- */
430
- ngDoCheck() {
431
- // Throw onChange event only if array changes size.
432
- if (this.value && this.value.length !== this._length) {
433
- this._length = this.value.length;
434
- this.onChange(this.value);
435
- }
436
- }
437
- /**
438
- * @return {?}
439
- */
440
- ngOnDestroy() {
441
- this._outsideClickSubs.unsubscribe();
442
- this._inputValueChangesSubs.unsubscribe();
443
- }
444
- /**
445
- * @return {?}
446
- */
447
- _setInternalClick() {
448
- this._internalClick = true;
449
- }
450
- /**
451
- * Method executed when the disabled value changes
452
- * @param {?} v
453
- * @return {?}
454
- */
455
- onDisabledChange(v) {
456
- this._toggleInput();
457
- }
458
- /**
459
- * Method that is executed when trying to create a new chip from the autocomplete.
460
- * It check if [requireMatch] is enabled, and tries to add the first active option
461
- * else if just adds the value thats on the input
462
- * returns 'true' if successful, 'false' if it fails.
463
- * @return {?}
464
- */
465
- _handleAddChip() {
466
- /** @type {?} */
467
- let value;
468
- if (this.requireMatch) {
469
- /** @type {?} */
470
- const selectedOptions = this._options.toArray().filter((/**
471
- * @param {?} option
472
- * @return {?}
473
- */
474
- (option) => {
475
- return option.active;
476
- }));
477
- if (selectedOptions.length > 0) {
478
- value = selectedOptions[0].value;
479
- selectedOptions[0].setInactiveStyles();
480
- }
481
- if (!value) {
482
- return false;
483
- }
484
- }
485
- else {
486
- // if there is a selection, then use that
487
- // else use the input value as chip
488
- if (this._autocompleteTrigger.activeOption) {
489
- value = this._autocompleteTrigger.activeOption.value;
490
- this._autocompleteTrigger.activeOption.setInactiveStyles();
491
- }
492
- else {
493
- value = this._inputChild.value;
494
- if (value.trim() === '') {
495
- return false;
496
- }
497
- }
498
- }
499
- return this.addChip(value);
500
- }
501
- /**
502
- * Method thats exectuted when trying to add a value as chip
503
- * returns 'true' if successful, 'false' if it fails.
504
- * @param {?} value
505
- * @return {?}
506
- */
507
- addChip(value) {
508
- /**
509
- * add a debounce ms delay when reopening the autocomplete to give it time
510
- * to rerender the next list and at the correct spot
511
- */
512
- this._closeAutocomplete();
513
- timer(this.debounce)
514
- .toPromise()
515
- .then((/**
516
- * @return {?}
517
- */
518
- () => {
519
- this.setFocusedState();
520
- this._setFirstOptionActive();
521
- this._openAutocomplete();
522
- }));
523
- this.inputControl.setValue('');
524
- // check if value is already part of the model
525
- if (this.value.findIndex((/**
526
- * @param {?} item
527
- * @return {?}
528
- */
529
- (item) => this.compareWith(item, value))) > -1) {
530
- return false;
531
- }
532
- this.value.push(value);
533
- this.add.emit(value);
534
- this.onChange(this.value);
535
- this._changeDetectorRef.markForCheck();
536
- return true;
537
- }
538
- /**
539
- * Method that is executed when trying to remove a chip.
540
- * returns 'true' if successful, 'false' if it fails.
541
- * @param {?} index
542
- * @return {?}
543
- */
544
- removeChip(index) {
545
- /** @type {?} */
546
- const removedValues = this.value.splice(index, 1);
547
- if (removedValues.length === 0) {
548
- return false;
549
- }
550
- /**
551
- * Checks if deleting last single chip, to focus input afterwards
552
- * Else check if its not the last chip of the list to focus the next one.
553
- */
554
- if (index === this._totalChips - 1 && index === 0) {
555
- this._inputChild.focus();
556
- }
557
- else if (index < this._totalChips - 1) {
558
- this._focusChip(index + 1);
559
- }
560
- else if (index > 0) {
561
- this._focusChip(index - 1);
562
- }
563
- this.remove.emit(removedValues[0]);
564
- this.onChange(this.value);
565
- this.inputControl.setValue('');
566
- this._changeDetectorRef.markForCheck();
567
- return true;
568
- }
569
- /**
570
- * Sets blur of chip and sends out event
571
- * @param {?} event
572
- * @param {?} value
573
- * @return {?}
574
- */
575
- _handleChipBlur(event, value) {
576
- this.chipBlur.emit(value);
577
- }
578
- /**
579
- * Sets focus of chip and sends out event
580
- * @param {?} event
581
- * @param {?} value
582
- * @return {?}
583
- */
584
- _handleChipFocus(event, value) {
585
- this.setFocusedState();
586
- this.chipFocus.emit(value);
587
- }
588
- /**
589
- * @return {?}
590
- */
591
- _handleFocus() {
592
- this.setFocusedState();
593
- this._setFirstOptionActive();
594
- return true;
595
- }
596
- /**
597
- * Sets focus state of the component
598
- * @return {?}
599
- */
600
- setFocusedState() {
601
- if (!this.disabled) {
602
- this._focused = true;
603
- this._tabIndex = -1;
604
- this._changeDetectorRef.markForCheck();
605
- }
606
- }
607
- /**
608
- * Removes focus state of the component
609
- * @return {?}
610
- */
611
- removeFocusedState() {
612
- this._focused = false;
613
- this._tabIndex = 0;
614
- this._changeDetectorRef.markForCheck();
615
- }
616
- /**
617
- * Programmatically focus the input or first chip. Since its the component entry point
618
- * depending if a user can add or remove chips
619
- * @return {?}
620
- */
621
- focus() {
622
- if (this.canAddChip) {
623
- this._inputChild.focus();
624
- }
625
- else if (!this.disabled) {
626
- this._focusFirstChip();
627
- }
628
- }
629
- /**
630
- * Passes relevant input key presses.
631
- * @param {?} event
632
- * @return {?}
633
- */
634
- _inputKeydown(event) {
635
- switch (event.keyCode) {
636
- case UP_ARROW:
637
- /**
638
- * Since the first item is highlighted on [requireMatch], we need to inactivate it
639
- * when pressing the up key
640
- */
641
- if (this.requireMatch) {
642
- /** @type {?} */
643
- const length = this._options.length;
644
- if (length > 1 && this._options.toArray()[0].active && this._internalActivateOption) {
645
- this._options.toArray()[0].setInactiveStyles();
646
- this._internalActivateOption = false;
647
- // prevent default window scrolling
648
- event.preventDefault();
649
- }
650
- }
651
- break;
652
- case LEFT_ARROW:
653
- case DELETE:
654
- case BACKSPACE:
655
- this._closeAutocomplete();
656
- /** Check to see if input is empty when pressing left arrow to move to the last chip */
657
- if (!this._inputChild.value) {
658
- this._focusLastChip();
659
- // prevent default window scrolling
660
- event.preventDefault();
661
- }
662
- break;
663
- case RIGHT_ARROW:
664
- this._closeAutocomplete();
665
- /** Check to see if input is empty when pressing right arrow to move to the first chip */
666
- if (!this._inputChild.value) {
667
- this._focusFirstChip();
668
- // prevent default window scrolling
669
- event.preventDefault();
670
- }
671
- break;
672
- default:
673
- // default
674
- }
675
- }
676
- /**
677
- * Passes relevant chip key presses.
678
- * @param {?} event
679
- * @param {?} index
680
- * @return {?}
681
- */
682
- _chipKeydown(event, index) {
683
- switch (event.keyCode) {
684
- case DELETE:
685
- case BACKSPACE:
686
- /** Check to see if we can delete a chip */
687
- if (this.canRemoveChip) {
688
- this.removeChip(index);
689
- }
690
- break;
691
- case UP_ARROW:
692
- case LEFT_ARROW:
693
- /**
694
- * Check to see if left/down arrow was pressed while focusing the first chip to focus input next
695
- * Also check if input should be focused
696
- */
697
- if (index === 0) {
698
- // only try to target input if pressing left
699
- if (this.canAddChip && event.keyCode === LEFT_ARROW) {
700
- this._inputChild.focus();
701
- }
702
- else {
703
- this._focusLastChip();
704
- }
705
- }
706
- else if (index > 0) {
707
- this._focusChip(index - 1);
708
- }
709
- // prevent default window scrolling
710
- event.preventDefault();
711
- break;
712
- case DOWN_ARROW:
713
- case RIGHT_ARROW:
714
- /**
715
- * Check to see if right/up arrow was pressed while focusing the last chip to focus input next
716
- * Also check if input should be focused
717
- */
718
- if (index === this._totalChips - 1) {
719
- // only try to target input if pressing right
720
- if (this.canAddChip && event.keyCode === RIGHT_ARROW) {
721
- this._inputChild.focus();
722
- }
723
- else {
724
- this._focusFirstChip();
725
- }
726
- }
727
- else if (index < this._totalChips - 1) {
728
- this._focusChip(index + 1);
729
- }
730
- // prevent default window scrolling
731
- event.preventDefault();
732
- break;
733
- default:
734
- // default
735
- }
736
- }
737
- /**
738
- * Method to remove from display the value added from the autocomplete since it goes directly as chip.
739
- * @return {?}
740
- */
741
- _removeInputDisplay() {
742
- return '';
743
- }
744
- /**
745
- * Method to open the autocomplete manually if its not already opened
746
- * @return {?}
747
- */
748
- _openAutocomplete() {
749
- if (!this._autocompleteTrigger.panelOpen) {
750
- this._autocompleteTrigger.openPanel();
751
- this._changeDetectorRef.markForCheck();
752
- }
753
- }
754
- /**
755
- * Method to close the autocomplete manually if its not already closed
756
- * @return {?}
757
- */
758
- _closeAutocomplete() {
759
- if (this._autocompleteTrigger.panelOpen) {
760
- this._autocompleteTrigger.closePanel();
761
- this._changeDetectorRef.markForCheck();
762
- }
763
- }
764
- /**
765
- * Get total of chips
766
- * @return {?}
767
- */
768
- get _totalChips() {
769
- /** @type {?} */
770
- const chips = this._chipsChildren.toArray();
771
- return chips.length;
772
- }
773
- /**
774
- * Method to focus a desired chip by index
775
- * @private
776
- * @param {?} index
777
- * @return {?}
778
- */
779
- _focusChip(index) {
780
- /** check to see if index exists in the array before focusing */
781
- if (index > -1 && this._totalChips > index) {
782
- this._chipsChildren.toArray()[index].focus();
783
- }
784
- }
785
- /**
786
- * Method to focus first chip
787
- * @private
788
- * @return {?}
789
- */
790
- _focusFirstChip() {
791
- this._focusChip(0);
792
- }
793
- /**
794
- * Method to focus last chip
795
- * @private
796
- * @return {?}
797
- */
798
- _focusLastChip() {
799
- this._focusChip(this._totalChips - 1);
800
- }
801
- /**
802
- * Method to toggle the disable state of input
803
- * Checks if not in disabled state and if chipAddition is set to 'true'
804
- * @private
805
- * @return {?}
806
- */
807
- _toggleInput() {
808
- if (this.canAddChip) {
809
- this.inputControl.enable();
810
- }
811
- else {
812
- this.inputControl.disable();
813
- }
814
- this._changeDetectorRef.markForCheck();
815
- }
816
- /**
817
- * Sets first option as active to let the user know which one will be added when pressing enter
818
- * Only if [requireMatch] has been set
819
- * @private
820
- * @return {?}
821
- */
822
- _setFirstOptionActive() {
823
- if (this.requireMatch) {
824
- // need to use a timer here to wait until the autocomplete has been opened (end of queue)
825
- timer()
826
- .toPromise()
827
- .then((/**
828
- * @return {?}
829
- */
830
- () => {
831
- if (this.focused && this._options && this._options.length > 0) {
832
- // clean up of previously active options
833
- this._options.toArray().forEach((/**
834
- * @param {?} option
835
- * @return {?}
836
- */
837
- (option) => {
838
- option.setInactiveStyles();
839
- }));
840
- // set the first one as active
841
- this._options.toArray()[0].setActiveStyles();
842
- this._internalActivateOption = true;
843
- this._changeDetectorRef.markForCheck();
844
- }
845
- }));
846
- }
847
- }
848
- /**
849
- * Watches clicks outside of the component to remove the focus
850
- * The autocomplete panel is considered inside the component so we
851
- * need to use a flag to find out when its clicked.
852
- * @private
853
- * @return {?}
854
- */
855
- _watchOutsideClick() {
856
- if (this._document) {
857
- this._outsideClickSubs = merge(fromEvent(this._document, 'click'), fromEvent(this._document, 'touchend'))
858
- .pipe(debounceTime(this._touchendDebounce), filter((/**
859
- * @param {?} event
860
- * @return {?}
861
- */
862
- (event) => {
863
- /** @type {?} */
864
- const clickTarget = (/** @type {?} */ (event.target));
865
- setTimeout((/**
866
- * @return {?}
867
- */
868
- () => {
869
- this._internalClick = false;
870
- }));
871
- return (this.focused &&
872
- clickTarget !== this._elementRef.nativeElement &&
873
- !this._elementRef.nativeElement.contains(clickTarget) &&
874
- !this._internalClick);
875
- })))
876
- .subscribe((/**
877
- * @return {?}
878
- */
879
- () => {
880
- if (this.focused) {
881
- this._autocompleteTrigger.closePanel();
882
- this.removeFocusedState();
883
- this.onTouched();
884
- this._changeDetectorRef.markForCheck();
885
- }
886
- }));
887
- }
888
- return undefined;
889
- }
890
- }
891
- TdChipsComponent.decorators = [
892
- { type: Component, args: [{
893
- providers: [
894
- {
895
- provide: NG_VALUE_ACCESSOR,
896
- useExisting: forwardRef((/**
897
- * @return {?}
898
- */
899
- () => TdChipsComponent)),
900
- multi: true,
901
- },
902
- ],
903
- selector: 'td-chips',
904
- inputs: ['disabled', 'value'],
905
- template: "<div\n class=\"td-chips-wrapper\"\n [class.td-chips-stacked]=\"stacked\"\n [class.td-chips-input-before-position]=\"inputPosition === 'before'\"\n>\n <ng-template let-chip let-first=\"first\" let-index=\"index\" ngFor [ngForOf]=\"value\">\n <mat-basic-chip\n [class.td-chip-disabled]=\"disabled\"\n [class.td-chip-after-pad]=\"!canRemoveChip\"\n [disableRipple]=\"true\"\n [color]=\"color\"\n (keydown)=\"_chipKeydown($event, index)\"\n (blur)=\"_handleChipBlur($event, chip)\"\n (focus)=\"_handleChipFocus($event, chip)\"\n >\n <div class=\"td-chip\" [class.td-chip-stacked]=\"stacked\">\n <span class=\"td-chip-content\">\n <span *ngIf=\"!_chipTemplate?.templateRef\">{{ chip }}</span>\n <ng-template\n *ngIf=\"_chipTemplate?.templateRef\"\n [ngTemplateOutlet]=\"_chipTemplate?.templateRef\"\n [ngTemplateOutletContext]=\"{ chip: chip }\"\n ></ng-template>\n </span>\n <mat-icon *ngIf=\"canRemoveChip\" class=\"td-chip-removal\" (click)=\"_internalClick = removeChip(index)\">\n cancel\n </mat-icon>\n </div>\n </mat-basic-chip>\n </ng-template>\n <mat-form-field\n floatLabel=\"never\"\n class=\"td-chips-form-field\"\n [style.width.px]=\"canAddChip ? null : 0\"\n [style.height.px]=\"canAddChip ? null : 0\"\n [color]=\"color\"\n >\n <input\n matInput\n #input\n [tabIndex]=\"-1\"\n [matAutocomplete]=\"autocomplete\"\n [formControl]=\"inputControl\"\n [placeholder]=\"displayPlaceHolder\"\n (keydown)=\"_inputKeydown($event)\"\n (keyup.enter)=\"_handleAddChip()\"\n (focus)=\"_handleFocus()\"\n />\n </mat-form-field>\n <mat-autocomplete\n #autocomplete=\"matAutocomplete\"\n [displayWith]=\"_removeInputDisplay\"\n (optionSelected)=\"addChip($event.option.value)\"\n >\n <ng-template let-item let-first=\"first\" ngFor [ngForOf]=\"items\">\n <mat-option (click)=\"_setInternalClick()\" [value]=\"item\">\n <span *ngIf=\"!_autocompleteOptionTemplate?.templateRef\">{{ item }}</span>\n <ng-template\n *ngIf=\"_autocompleteOptionTemplate?.templateRef\"\n [ngTemplateOutlet]=\"_autocompleteOptionTemplate?.templateRef\"\n [ngTemplateOutletContext]=\"{ option: item }\"\n ></ng-template>\n </mat-option>\n </ng-template>\n </mat-autocomplete>\n</div>\n<div *ngIf=\"chipAddition\" class=\"mat-form-field-underline\" [class.mat-disabled]=\"disabled\">\n <span class=\"mat-form-field-ripple\" [class.mat-focused]=\"focused\"></span>\n</div>\n<ng-content></ng-content>\n",
906
- changeDetection: ChangeDetectionStrategy.OnPush,
907
- styles: [":host{display:block;min-height:48px;padding:0 5px}:host .td-chips-wrapper{-ms-flex-align:start;-ms-flex-direction:row;-ms-flex-wrap:wrap;align-items:flex-start;display:-ms-flexbox;display:flex;flex-direction:row;flex-wrap:wrap;min-height:42px}:host .td-chips-wrapper.td-chips-stacked .mat-basic-chip,:host .td-chips-wrapper.td-chips-stacked .td-chips-form-field{width:100%}:host .td-chips-wrapper.td-chips-input-before-position .td-chips-form-field{-ms-flex-order:-1;order:-1}:host .td-chip,:host .td-chip>.td-chip-content{-ms-flex-align:center;-ms-flex-direction:row;-ms-flex-line-pack:center;-ms-flex-pack:start;align-content:center;align-items:center;box-sizing:border-box;display:-ms-flexbox;display:flex;flex-direction:row;justify-content:flex-start;max-width:100%;min-width:0}:host .td-chip.td-chip-stacked,:host .td-chip>.td-chip-content.td-chip-stacked{-ms-flex-pack:justify;justify-content:space-between}:host ::ng-deep .mat-form-field-wrapper{padding-bottom:2px}:host ::ng-deep .mat-basic-chip{border-radius:16px;box-sizing:border-box;cursor:default;display:inline-block;margin:8px 8px 0 0;max-width:100%;position:relative}html[dir=rtl] :host ::ng-deep .mat-basic-chip{margin:8px 0 0 8px;unicode-bidi:embed}body[dir=rtl] :host ::ng-deep .mat-basic-chip{margin:8px 0 0 8px;unicode-bidi:embed}[dir=rtl] :host ::ng-deep .mat-basic-chip{margin:8px 0 0 8px;unicode-bidi:embed}:host ::ng-deep .mat-basic-chip bdo[dir=rtl]{direction:rtl;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip bdo[dir=ltr]{direction:ltr;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip .td-chip{font-size:13px;line-height:32px;min-height:32px;padding:0 0 0 12px}html[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip{padding:0 12px 0 0;unicode-bidi:embed}body[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip{padding:0 12px 0 0;unicode-bidi:embed}[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip{padding:0 12px 0 0;unicode-bidi:embed}:host ::ng-deep .mat-basic-chip .td-chip bdo[dir=rtl]{direction:rtl;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip .td-chip bdo[dir=ltr]{direction:ltr;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar]{-ms-flex:0 0 auto;-ms-flex-align:center;-ms-flex-order:-20;-ms-flex-pack:center;align-items:center;border-radius:50%;box-sizing:border-box;display:inline-block;flex:0 0 auto;height:32px;justify-content:center;margin:0 8px 0 -12px;order:-20;text-align:center;width:32px}html[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar]{margin:0 -12px 0 8px;unicode-bidi:embed}body[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar]{margin:0 -12px 0 8px;unicode-bidi:embed}[dir=rtl] :host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar]{margin:0 -12px 0 8px;unicode-bidi:embed}:host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar] bdo[dir=rtl]{direction:rtl;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip .td-chip [td-chip-avatar] bdo[dir=ltr]{direction:ltr;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip.td-chip-after-pad{padding:0 12px 0 0}html[dir=rtl] :host ::ng-deep .mat-basic-chip.td-chip-after-pad{padding:0 0 0 12px;unicode-bidi:embed}body[dir=rtl] :host ::ng-deep .mat-basic-chip.td-chip-after-pad{padding:0 0 0 12px;unicode-bidi:embed}[dir=rtl] :host ::ng-deep .mat-basic-chip.td-chip-after-pad{padding:0 0 0 12px;unicode-bidi:embed}:host ::ng-deep .mat-basic-chip.td-chip-after-pad bdo[dir=rtl]{direction:rtl;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip.td-chip-after-pad bdo[dir=ltr]{direction:ltr;unicode-bidi:bidi-override}:host ::ng-deep .mat-basic-chip mat-icon.td-chip-removal{font-size:21px;line-height:22px;margin:0 4px}:host ::ng-deep .mat-basic-chip mat-icon.td-chip-removal:hover{cursor:pointer}:host ::ng-deep .td-chips-stacked .mat-basic-chip{margin:4px 0}:host ::ng-deep .td-chips-stacked .mat-basic-chip:first-of-type{margin:8px 0 4px}:host ::ng-deep .td-chips-stacked .mat-basic-chip:last-of-type{margin:4px 0 8px}:host .mat-form-field-underline{bottom:0;height:1px;position:relative;width:100%}:host .mat-form-field-underline.mat-disabled{background-color:rgba(0,0,0,0);background-position:0;bottom:-4px}:host .mat-form-field-underline .mat-form-field-ripple{-ms-transform:scaleX(.5);-ms-transform-origin:50%;height:2px;opacity:0;position:absolute;top:0;transform:scaleX(.5);transform-origin:50%;transition:background-color .3s cubic-bezier(.55,0,.55,.2);visibility:hidden;width:100%}:host .mat-form-field-underline .mat-form-field-ripple.mat-focused,:host.ng-invalid .mat-form-field-underline .mat-form-field-ripple{-ms-transform:scaleX(1);opacity:1;transform:scaleX(1);transition:transform .15s linear,background-color .3s cubic-bezier(.55,0,.55,.2);visibility:visible}:host ::ng-deep mat-form-field .mat-form-field-underline{display:none}"]
908
- }] }
909
- ];
910
- /** @nocollapse */
911
- TdChipsComponent.ctorParameters = () => [
912
- { type: ElementRef },
913
- { type: Renderer2 },
914
- { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [DOCUMENT,] }] },
915
- { type: ChangeDetectorRef }
916
- ];
917
- TdChipsComponent.propDecorators = {
918
- _nativeInput: [{ type: ViewChild, args: ['input', { static: true },] }],
919
- _inputChild: [{ type: ViewChild, args: [MatInput, { static: true },] }],
920
- _autocompleteTrigger: [{ type: ViewChild, args: [MatAutocompleteTrigger, { static: true },] }],
921
- _chipsChildren: [{ type: ViewChildren, args: [MatChip,] }],
922
- _chipTemplate: [{ type: ContentChild, args: [TdChipDirective,] }],
923
- _autocompleteOptionTemplate: [{ type: ContentChild, args: [TdAutocompleteOptionDirective,] }],
924
- _options: [{ type: ViewChildren, args: [MatOption,] }],
925
- items: [{ type: Input, args: ['items',] }],
926
- stacked: [{ type: Input, args: ['stacked',] }],
927
- inputPosition: [{ type: Input, args: ['inputPosition',] }],
928
- requireMatch: [{ type: Input, args: ['requireMatch',] }],
929
- required: [{ type: Input, args: ['required',] }],
930
- chipAddition: [{ type: Input, args: ['chipAddition',] }],
931
- chipRemoval: [{ type: Input, args: ['chipRemoval',] }],
932
- placeholder: [{ type: Input }],
933
- debounce: [{ type: Input }],
934
- color: [{ type: Input, args: ['color',] }],
935
- add: [{ type: Output }],
936
- remove: [{ type: Output }],
937
- inputChange: [{ type: Output }],
938
- chipFocus: [{ type: Output }],
939
- chipBlur: [{ type: Output }],
940
- tabIndex: [{ type: HostBinding, args: ['attr.tabindex',] }],
941
- compareWith: [{ type: Input }],
942
- focusListener: [{ type: HostListener, args: ['focus', ['$event'],] }],
943
- mousedownListener: [{ type: HostListener, args: ['mousedown', ['$event'],] }],
944
- clickListener: [{ type: HostListener, args: ['click', ['$event'],] }],
945
- keydownListener: [{ type: HostListener, args: ['keydown', ['$event'],] }]
946
- };
947
- if (false) {
948
- /**
949
- * @type {?}
950
- * @private
951
- */
952
- TdChipsComponent.prototype._outsideClickSubs;
953
- /**
954
- * @type {?}
955
- * @private
956
- */
957
- TdChipsComponent.prototype._inputValueChangesSubs;
958
- /**
959
- * @type {?}
960
- * @private
961
- */
962
- TdChipsComponent.prototype._isMousedown;
963
- /**
964
- * @type {?}
965
- * @private
966
- */
967
- TdChipsComponent.prototype._items;
968
- /**
969
- * @type {?}
970
- * @private
971
- */
972
- TdChipsComponent.prototype._length;
973
- /**
974
- * @type {?}
975
- * @private
976
- */
977
- TdChipsComponent.prototype._stacked;
978
- /**
979
- * @type {?}
980
- * @private
981
- */
982
- TdChipsComponent.prototype._requireMatch;
983
- /**
984
- * @type {?}
985
- * @private
986
- */
987
- TdChipsComponent.prototype._color;
988
- /**
989
- * @type {?}
990
- * @private
991
- */
992
- TdChipsComponent.prototype._inputPosition;
993
- /**
994
- * @type {?}
995
- * @private
996
- */
997
- TdChipsComponent.prototype._chipAddition;
998
- /**
999
- * @type {?}
1000
- * @private
1001
- */
1002
- TdChipsComponent.prototype._chipRemoval;
1003
- /**
1004
- * @type {?}
1005
- * @private
1006
- */
1007
- TdChipsComponent.prototype._focused;
1008
- /**
1009
- * @type {?}
1010
- * @private
1011
- */
1012
- TdChipsComponent.prototype._required;
1013
- /**
1014
- * @type {?}
1015
- * @private
1016
- */
1017
- TdChipsComponent.prototype._tabIndex;
1018
- /**
1019
- * @type {?}
1020
- * @private
1021
- */
1022
- TdChipsComponent.prototype._touchendDebounce;
1023
- /** @type {?} */
1024
- TdChipsComponent.prototype._internalClick;
1025
- /** @type {?} */
1026
- TdChipsComponent.prototype._internalActivateOption;
1027
- /** @type {?} */
1028
- TdChipsComponent.prototype._nativeInput;
1029
- /** @type {?} */
1030
- TdChipsComponent.prototype._inputChild;
1031
- /** @type {?} */
1032
- TdChipsComponent.prototype._autocompleteTrigger;
1033
- /** @type {?} */
1034
- TdChipsComponent.prototype._chipsChildren;
1035
- /** @type {?} */
1036
- TdChipsComponent.prototype._chipTemplate;
1037
- /** @type {?} */
1038
- TdChipsComponent.prototype._autocompleteOptionTemplate;
1039
- /** @type {?} */
1040
- TdChipsComponent.prototype._options;
1041
- /**
1042
- * FormControl for the matInput element.
1043
- * @type {?}
1044
- */
1045
- TdChipsComponent.prototype.inputControl;
1046
- /**
1047
- * placeholder?: string
1048
- * Placeholder for the autocomplete input.
1049
- * @type {?}
1050
- */
1051
- TdChipsComponent.prototype.placeholder;
1052
- /**
1053
- * debounce?: number
1054
- * Debounce timeout between keypresses. Defaults to 200.
1055
- * @type {?}
1056
- */
1057
- TdChipsComponent.prototype.debounce;
1058
- /**
1059
- * add?: function
1060
- * Method to be executed when a chip is added.
1061
- * Sends chip value as event.
1062
- * @type {?}
1063
- */
1064
- TdChipsComponent.prototype.add;
1065
- /**
1066
- * remove?: function
1067
- * Method to be executed when a chip is removed.
1068
- * Sends chip value as event.
1069
- * @type {?}
1070
- */
1071
- TdChipsComponent.prototype.remove;
1072
- /**
1073
- * inputChange?: function
1074
- * Method to be executed when the value in the autocomplete input changes.
1075
- * Sends string value as event.
1076
- * @type {?}
1077
- */
1078
- TdChipsComponent.prototype.inputChange;
1079
- /**
1080
- * chipFocus?: function
1081
- * Method to be executed when a chip is focused.
1082
- * Sends chip value as event.
1083
- * @type {?}
1084
- */
1085
- TdChipsComponent.prototype.chipFocus;
1086
- /**
1087
- * blur?: function
1088
- * Method to be executed when a chip is blurred.
1089
- * Sends chip value as event.
1090
- * @type {?}
1091
- */
1092
- TdChipsComponent.prototype.chipBlur;
1093
- /**
1094
- * compareWith? function
1095
- * Function used to check whether a chip value already exists.
1096
- * Defaults to strict equality comparison ===
1097
- * @type {?}
1098
- */
1099
- TdChipsComponent.prototype.compareWith;
1100
- /**
1101
- * @type {?}
1102
- * @private
1103
- */
1104
- TdChipsComponent.prototype._elementRef;
1105
- /**
1106
- * @type {?}
1107
- * @private
1108
- */
1109
- TdChipsComponent.prototype._renderer;
1110
- /**
1111
- * @type {?}
1112
- * @private
1113
- */
1114
- TdChipsComponent.prototype._document;
1115
- }
1116
-
1117
- /**
1118
- * @fileoverview added by tsickle
1119
- * Generated from: chips.module.ts
1120
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
1121
- */
1122
- class CovalentChipsModule {
1123
- }
1124
- CovalentChipsModule.decorators = [
1125
- { type: NgModule, args: [{
1126
- imports: [ReactiveFormsModule, CommonModule, MatInputModule, MatIconModule, MatChipsModule, MatAutocompleteModule],
1127
- declarations: [TdChipsComponent, TdChipDirective, TdAutocompleteOptionDirective],
1128
- exports: [TdChipsComponent, TdChipDirective, TdAutocompleteOptionDirective],
1129
- },] }
1130
- ];
1131
-
1132
- /**
1133
- * @fileoverview added by tsickle
1134
- * Generated from: public-api.ts
1135
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
1136
- */
1137
-
1138
- /**
1139
- * @fileoverview added by tsickle
1140
- * Generated from: index.ts
1141
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
1142
- */
1143
-
1144
- /**
1145
- * @fileoverview added by tsickle
1146
- * Generated from: covalent-core-chips.ts
1147
- * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
1148
- */
1149
-
1150
- export { CovalentChipsModule, TdAutocompleteOptionDirective, TdChipDirective, TdChipsBase, TdChipsComponent, _TdChipsMixinBase };
1151
- //# sourceMappingURL=covalent-core-chips.js.map