@angular/material-experimental 13.1.0 → 13.2.0-next.1

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 (318) hide show
  1. package/LICENSE +1 -1
  2. package/_index.scss +2 -1
  3. package/esm2020/column-resize/column-resize-directives/column-resize-flex.mjs +4 -4
  4. package/esm2020/column-resize/column-resize-directives/column-resize.mjs +4 -4
  5. package/esm2020/column-resize/column-resize-directives/default-enabled-column-resize-flex.mjs +4 -4
  6. package/esm2020/column-resize/column-resize-directives/default-enabled-column-resize.mjs +4 -4
  7. package/esm2020/column-resize/column-resize-module.mjs +13 -13
  8. package/esm2020/column-resize/overlay-handle.mjs +4 -4
  9. package/esm2020/column-resize/resizable-directives/default-enabled-resizable.mjs +4 -4
  10. package/esm2020/column-resize/resizable-directives/resizable.mjs +4 -4
  11. package/esm2020/column-resize/resize-strategy.mjs +4 -4
  12. package/esm2020/mdc-autocomplete/autocomplete-origin.mjs +4 -4
  13. package/esm2020/mdc-autocomplete/autocomplete-trigger.mjs +4 -4
  14. package/esm2020/mdc-autocomplete/autocomplete.mjs +4 -4
  15. package/esm2020/mdc-autocomplete/module.mjs +5 -5
  16. package/esm2020/mdc-button/button-base.mjs +14 -7
  17. package/esm2020/mdc-button/button.mjs +9 -9
  18. package/esm2020/mdc-button/fab.mjs +18 -18
  19. package/esm2020/mdc-button/icon-button.mjs +7 -7
  20. package/esm2020/mdc-button/module.mjs +5 -5
  21. package/esm2020/mdc-card/card.mjs +44 -44
  22. package/esm2020/mdc-card/module.mjs +5 -5
  23. package/esm2020/mdc-checkbox/checkbox.mjs +5 -5
  24. package/esm2020/mdc-checkbox/module.mjs +5 -5
  25. package/esm2020/mdc-chips/chip-action.mjs +123 -0
  26. package/esm2020/mdc-chips/chip-edit-input.mjs +5 -5
  27. package/esm2020/mdc-chips/chip-grid.mjs +46 -96
  28. package/esm2020/mdc-chips/chip-icons.mjs +46 -101
  29. package/esm2020/mdc-chips/chip-input.mjs +6 -13
  30. package/esm2020/mdc-chips/chip-listbox.mjs +51 -156
  31. package/esm2020/mdc-chips/chip-option.mjs +84 -95
  32. package/esm2020/mdc-chips/chip-row.mjs +82 -90
  33. package/esm2020/mdc-chips/chip-set.mjs +119 -120
  34. package/esm2020/mdc-chips/chip.mjs +189 -181
  35. package/esm2020/mdc-chips/emit-event.mjs +27 -0
  36. package/esm2020/mdc-chips/module.mjs +8 -10
  37. package/esm2020/mdc-chips/testing/chip-harness.mjs +5 -1
  38. package/esm2020/mdc-chips/testing/chip-option-harness.mjs +2 -2
  39. package/esm2020/mdc-chips/testing/chip-row-harness.mjs +10 -1
  40. package/esm2020/mdc-core/option/index.mjs +5 -5
  41. package/esm2020/mdc-core/option/optgroup.mjs +4 -4
  42. package/esm2020/mdc-core/option/option.mjs +4 -4
  43. package/esm2020/mdc-core/public-api.mjs +2 -2
  44. package/esm2020/mdc-dialog/dialog-container.mjs +5 -5
  45. package/esm2020/mdc-dialog/dialog-content-directives.mjs +13 -13
  46. package/esm2020/mdc-dialog/dialog.mjs +4 -4
  47. package/esm2020/mdc-dialog/module.mjs +5 -5
  48. package/esm2020/mdc-form-field/directives/error.mjs +4 -4
  49. package/esm2020/mdc-form-field/directives/floating-label.mjs +4 -4
  50. package/esm2020/mdc-form-field/directives/hint.mjs +4 -4
  51. package/esm2020/mdc-form-field/directives/label.mjs +4 -4
  52. package/esm2020/mdc-form-field/directives/line-ripple.mjs +4 -4
  53. package/esm2020/mdc-form-field/directives/notched-outline.mjs +4 -4
  54. package/esm2020/mdc-form-field/directives/prefix.mjs +4 -4
  55. package/esm2020/mdc-form-field/directives/suffix.mjs +4 -4
  56. package/esm2020/mdc-form-field/form-field.mjs +4 -4
  57. package/esm2020/mdc-form-field/module.mjs +5 -5
  58. package/esm2020/mdc-input/input.mjs +4 -4
  59. package/esm2020/mdc-input/module.mjs +5 -5
  60. package/esm2020/mdc-list/action-list.mjs +5 -5
  61. package/esm2020/mdc-list/interactive-list-base.mjs +12 -10
  62. package/esm2020/mdc-list/list-base.mjs +138 -41
  63. package/esm2020/mdc-list/list-item-sections.mjs +138 -0
  64. package/esm2020/mdc-list/list-option.mjs +25 -17
  65. package/esm2020/mdc-list/list.mjs +24 -18
  66. package/esm2020/mdc-list/module.mjs +46 -23
  67. package/esm2020/mdc-list/nav-list.mjs +5 -5
  68. package/esm2020/mdc-list/public-api.mjs +3 -2
  69. package/esm2020/mdc-list/selection-list.mjs +8 -8
  70. package/esm2020/mdc-list/subheader.mjs +27 -0
  71. package/esm2020/mdc-list/testing/list-harness-filters.mjs +1 -1
  72. package/esm2020/mdc-list/testing/list-item-harness-base.mjs +96 -12
  73. package/esm2020/mdc-list/testing/public-api.mjs +2 -1
  74. package/esm2020/mdc-menu/directives.mjs +7 -7
  75. package/esm2020/mdc-menu/menu-item.mjs +4 -4
  76. package/esm2020/mdc-menu/menu.mjs +4 -4
  77. package/esm2020/mdc-menu/module.mjs +5 -5
  78. package/esm2020/mdc-paginator/module.mjs +5 -5
  79. package/esm2020/mdc-paginator/paginator.mjs +4 -4
  80. package/esm2020/mdc-progress-bar/module.mjs +5 -5
  81. package/esm2020/mdc-progress-bar/progress-bar.mjs +5 -5
  82. package/esm2020/mdc-progress-spinner/module.mjs +5 -5
  83. package/esm2020/mdc-progress-spinner/progress-spinner.mjs +4 -4
  84. package/esm2020/mdc-radio/module.mjs +5 -5
  85. package/esm2020/mdc-radio/radio.mjs +8 -8
  86. package/esm2020/mdc-select/module.mjs +5 -5
  87. package/esm2020/mdc-select/select.mjs +9 -9
  88. package/esm2020/mdc-sidenav/module.mjs +5 -5
  89. package/esm2020/mdc-slide-toggle/module.mjs +5 -5
  90. package/esm2020/mdc-slide-toggle/slide-toggle.mjs +5 -5
  91. package/esm2020/mdc-slider/global-change-and-input-listener.mjs +4 -4
  92. package/esm2020/mdc-slider/module.mjs +5 -5
  93. package/esm2020/mdc-slider/slider.mjs +33 -12
  94. package/esm2020/mdc-snack-bar/module.mjs +5 -5
  95. package/esm2020/mdc-snack-bar/simple-snack-bar.mjs +4 -4
  96. package/esm2020/mdc-snack-bar/snack-bar-container.mjs +5 -5
  97. package/esm2020/mdc-snack-bar/snack-bar-content.mjs +10 -10
  98. package/esm2020/mdc-snack-bar/snack-bar.mjs +4 -4
  99. package/esm2020/mdc-table/cell.mjs +22 -22
  100. package/esm2020/mdc-table/module.mjs +5 -5
  101. package/esm2020/mdc-table/row.mjs +22 -22
  102. package/esm2020/mdc-table/table.mjs +9 -9
  103. package/esm2020/mdc-table/text-column.mjs +4 -4
  104. package/esm2020/mdc-tabs/module.mjs +10 -6
  105. package/esm2020/mdc-tabs/public-api.mjs +2 -2
  106. package/esm2020/mdc-tabs/tab-body.mjs +7 -7
  107. package/esm2020/mdc-tabs/tab-content.mjs +4 -4
  108. package/esm2020/mdc-tabs/tab-group.mjs +6 -6
  109. package/esm2020/mdc-tabs/tab-header.mjs +12 -5
  110. package/esm2020/mdc-tabs/tab-label-wrapper.mjs +4 -4
  111. package/esm2020/mdc-tabs/tab-label.mjs +4 -4
  112. package/esm2020/mdc-tabs/tab-nav-bar/tab-nav-bar.mjs +47 -10
  113. package/esm2020/mdc-tabs/tab.mjs +4 -4
  114. package/esm2020/mdc-tabs/testing/tab-harness-filters.mjs +1 -1
  115. package/esm2020/mdc-tabs/testing/tab-nav-bar-harness.mjs +13 -1
  116. package/esm2020/mdc-tabs/testing/tab-nav-panel-harness.mjs +27 -0
  117. package/esm2020/mdc-tooltip/module.mjs +5 -5
  118. package/esm2020/mdc-tooltip/tooltip.mjs +8 -8
  119. package/esm2020/menubar/menubar-item.mjs +4 -4
  120. package/esm2020/menubar/menubar-module.mjs +5 -5
  121. package/esm2020/menubar/menubar.mjs +4 -4
  122. package/esm2020/popover-edit/lens-directives.mjs +10 -10
  123. package/esm2020/popover-edit/popover-edit-module.mjs +5 -5
  124. package/esm2020/popover-edit/table-directives.mjs +13 -13
  125. package/esm2020/selection/row-selection.mjs +4 -4
  126. package/esm2020/selection/select-all.mjs +4 -4
  127. package/esm2020/selection/selection-column.mjs +4 -4
  128. package/esm2020/selection/selection-module.mjs +5 -5
  129. package/esm2020/selection/selection-toggle.mjs +4 -4
  130. package/esm2020/selection/selection.mjs +4 -4
  131. package/esm2020/version.mjs +1 -1
  132. package/fesm2015/column-resize.mjs +36 -36
  133. package/fesm2015/column-resize.mjs.map +1 -1
  134. package/fesm2015/material-experimental.mjs +1 -1
  135. package/fesm2015/material-experimental.mjs.map +1 -1
  136. package/fesm2015/mdc-autocomplete.mjs +13 -13
  137. package/fesm2015/mdc-autocomplete.mjs.map +1 -1
  138. package/fesm2015/mdc-button.mjs +40 -40
  139. package/fesm2015/mdc-button.mjs.map +1 -1
  140. package/fesm2015/mdc-card.mjs +47 -47
  141. package/fesm2015/mdc-card.mjs.map +1 -1
  142. package/fesm2015/mdc-checkbox.mjs +8 -8
  143. package/fesm2015/mdc-checkbox.mjs.map +1 -1
  144. package/fesm2015/mdc-chips/testing.mjs +18 -8
  145. package/fesm2015/mdc-chips/testing.mjs.map +1 -1
  146. package/fesm2015/mdc-chips.mjs +758 -1061
  147. package/fesm2015/mdc-chips.mjs.map +1 -1
  148. package/fesm2015/mdc-core.mjs +11 -11
  149. package/fesm2015/mdc-core.mjs.map +1 -1
  150. package/fesm2015/mdc-dialog.mjs +23 -23
  151. package/fesm2015/mdc-dialog.mjs.map +1 -1
  152. package/fesm2015/mdc-form-field.mjs +31 -31
  153. package/fesm2015/mdc-form-field.mjs.map +1 -1
  154. package/fesm2015/mdc-input.mjs +7 -7
  155. package/fesm2015/mdc-input.mjs.map +1 -1
  156. package/fesm2015/mdc-list/testing.mjs +104 -12
  157. package/fesm2015/mdc-list/testing.mjs.map +1 -1
  158. package/fesm2015/mdc-list.mjs +361 -154
  159. package/fesm2015/mdc-list.mjs.map +1 -1
  160. package/fesm2015/mdc-menu.mjs +16 -16
  161. package/fesm2015/mdc-menu.mjs.map +1 -1
  162. package/fesm2015/mdc-paginator.mjs +7 -7
  163. package/fesm2015/mdc-paginator.mjs.map +1 -1
  164. package/fesm2015/mdc-progress-bar.mjs +8 -8
  165. package/fesm2015/mdc-progress-bar.mjs.map +1 -1
  166. package/fesm2015/mdc-progress-spinner.mjs +7 -7
  167. package/fesm2015/mdc-progress-spinner.mjs.map +1 -1
  168. package/fesm2015/mdc-radio.mjs +11 -11
  169. package/fesm2015/mdc-radio.mjs.map +1 -1
  170. package/fesm2015/mdc-select.mjs +12 -12
  171. package/fesm2015/mdc-select.mjs.map +1 -1
  172. package/fesm2015/mdc-sidenav.mjs +4 -4
  173. package/fesm2015/mdc-sidenav.mjs.map +1 -1
  174. package/fesm2015/mdc-slide-toggle.mjs +8 -8
  175. package/fesm2015/mdc-slide-toggle.mjs.map +1 -1
  176. package/fesm2015/mdc-slider.mjs +39 -18
  177. package/fesm2015/mdc-slider.mjs.map +1 -1
  178. package/fesm2015/mdc-snack-bar.mjs +23 -23
  179. package/fesm2015/mdc-snack-bar.mjs.map +1 -1
  180. package/fesm2015/mdc-table.mjs +57 -57
  181. package/fesm2015/mdc-table.mjs.map +1 -1
  182. package/fesm2015/mdc-tabs/testing.mjs +34 -0
  183. package/fesm2015/mdc-tabs/testing.mjs.map +1 -1
  184. package/fesm2015/mdc-tabs.mjs +89 -41
  185. package/fesm2015/mdc-tabs.mjs.map +1 -1
  186. package/fesm2015/mdc-tooltip.mjs +11 -11
  187. package/fesm2015/mdc-tooltip.mjs.map +1 -1
  188. package/fesm2015/menubar.mjs +10 -10
  189. package/fesm2015/menubar.mjs.map +1 -1
  190. package/fesm2015/popover-edit.mjs +25 -25
  191. package/fesm2015/popover-edit.mjs.map +1 -1
  192. package/fesm2015/selection.mjs +19 -19
  193. package/fesm2015/selection.mjs.map +1 -1
  194. package/fesm2020/column-resize.mjs +36 -36
  195. package/fesm2020/column-resize.mjs.map +1 -1
  196. package/fesm2020/material-experimental.mjs +1 -1
  197. package/fesm2020/material-experimental.mjs.map +1 -1
  198. package/fesm2020/mdc-autocomplete.mjs +13 -13
  199. package/fesm2020/mdc-autocomplete.mjs.map +1 -1
  200. package/fesm2020/mdc-button.mjs +48 -41
  201. package/fesm2020/mdc-button.mjs.map +1 -1
  202. package/fesm2020/mdc-card.mjs +47 -47
  203. package/fesm2020/mdc-card.mjs.map +1 -1
  204. package/fesm2020/mdc-checkbox.mjs +8 -8
  205. package/fesm2020/mdc-checkbox.mjs.map +1 -1
  206. package/fesm2020/mdc-chips/testing.mjs +14 -1
  207. package/fesm2020/mdc-chips/testing.mjs.map +1 -1
  208. package/fesm2020/mdc-chips.mjs +738 -1066
  209. package/fesm2020/mdc-chips.mjs.map +1 -1
  210. package/fesm2020/mdc-core.mjs +11 -11
  211. package/fesm2020/mdc-core.mjs.map +1 -1
  212. package/fesm2020/mdc-dialog.mjs +23 -23
  213. package/fesm2020/mdc-dialog.mjs.map +1 -1
  214. package/fesm2020/mdc-form-field.mjs +31 -31
  215. package/fesm2020/mdc-form-field.mjs.map +1 -1
  216. package/fesm2020/mdc-input.mjs +7 -7
  217. package/fesm2020/mdc-input.mjs.map +1 -1
  218. package/fesm2020/mdc-list/testing.mjs +96 -12
  219. package/fesm2020/mdc-list/testing.mjs.map +1 -1
  220. package/fesm2020/mdc-list.mjs +359 -154
  221. package/fesm2020/mdc-list.mjs.map +1 -1
  222. package/fesm2020/mdc-menu.mjs +16 -16
  223. package/fesm2020/mdc-menu.mjs.map +1 -1
  224. package/fesm2020/mdc-paginator.mjs +7 -7
  225. package/fesm2020/mdc-paginator.mjs.map +1 -1
  226. package/fesm2020/mdc-progress-bar.mjs +8 -8
  227. package/fesm2020/mdc-progress-bar.mjs.map +1 -1
  228. package/fesm2020/mdc-progress-spinner.mjs +7 -7
  229. package/fesm2020/mdc-progress-spinner.mjs.map +1 -1
  230. package/fesm2020/mdc-radio.mjs +11 -11
  231. package/fesm2020/mdc-radio.mjs.map +1 -1
  232. package/fesm2020/mdc-select.mjs +12 -12
  233. package/fesm2020/mdc-select.mjs.map +1 -1
  234. package/fesm2020/mdc-sidenav.mjs +4 -4
  235. package/fesm2020/mdc-sidenav.mjs.map +1 -1
  236. package/fesm2020/mdc-slide-toggle.mjs +8 -8
  237. package/fesm2020/mdc-slide-toggle.mjs.map +1 -1
  238. package/fesm2020/mdc-slider.mjs +39 -18
  239. package/fesm2020/mdc-slider.mjs.map +1 -1
  240. package/fesm2020/mdc-snack-bar.mjs +23 -23
  241. package/fesm2020/mdc-snack-bar.mjs.map +1 -1
  242. package/fesm2020/mdc-table.mjs +57 -57
  243. package/fesm2020/mdc-table.mjs.map +1 -1
  244. package/fesm2020/mdc-tabs/testing.mjs +37 -0
  245. package/fesm2020/mdc-tabs/testing.mjs.map +1 -1
  246. package/fesm2020/mdc-tabs.mjs +89 -41
  247. package/fesm2020/mdc-tabs.mjs.map +1 -1
  248. package/fesm2020/mdc-tooltip.mjs +11 -11
  249. package/fesm2020/mdc-tooltip.mjs.map +1 -1
  250. package/fesm2020/menubar.mjs +10 -10
  251. package/fesm2020/menubar.mjs.map +1 -1
  252. package/fesm2020/popover-edit.mjs +25 -25
  253. package/fesm2020/popover-edit.mjs.map +1 -1
  254. package/fesm2020/selection.mjs +19 -19
  255. package/fesm2020/selection.mjs.map +1 -1
  256. package/mdc-button/button-base.d.ts +0 -3
  257. package/mdc-button/fab.d.ts +5 -7
  258. package/mdc-checkbox/_checkbox-theme.scss +32 -30
  259. package/mdc-checkbox/checkbox.d.ts +4 -9
  260. package/mdc-chips/_chips-theme.scss +53 -53
  261. package/mdc-chips/chip-action.d.ts +40 -0
  262. package/mdc-chips/chip-grid.d.ts +8 -26
  263. package/mdc-chips/chip-icons.d.ts +14 -40
  264. package/mdc-chips/chip-input.d.ts +2 -4
  265. package/mdc-chips/chip-listbox.d.ts +7 -46
  266. package/mdc-chips/chip-option.d.ts +17 -15
  267. package/mdc-chips/chip-row.d.ts +13 -30
  268. package/mdc-chips/chip-set.d.ts +27 -46
  269. package/mdc-chips/chip.d.ts +41 -45
  270. package/mdc-chips/emit-event.d.ts +16 -0
  271. package/mdc-chips/module.d.ts +13 -12
  272. package/mdc-chips/testing/chip-harness.d.ts +1 -0
  273. package/mdc-chips/testing/chip-row-harness.d.ts +4 -0
  274. package/mdc-core/_core-theme.scss +47 -14
  275. package/mdc-core/public-api.d.ts +1 -1
  276. package/mdc-form-field/form-field.d.ts +1 -2
  277. package/mdc-helpers/_focus-indicators.scss +15 -3
  278. package/mdc-list/_interactive-list-theme.scss +17 -11
  279. package/mdc-list/_list-option-theme.scss +2 -2
  280. package/mdc-list/_list-theme.scss +7 -3
  281. package/mdc-list/list-base.d.ts +59 -18
  282. package/mdc-list/list-item-sections.d.ts +77 -0
  283. package/mdc-list/list-option.d.ts +12 -10
  284. package/mdc-list/list.d.ts +6 -2
  285. package/mdc-list/module.d.ts +7 -5
  286. package/mdc-list/public-api.d.ts +2 -1
  287. package/mdc-list/selection-list.d.ts +1 -2
  288. package/mdc-list/subheader.d.ts +9 -0
  289. package/mdc-list/testing/list-harness-filters.d.ts +8 -0
  290. package/mdc-list/testing/list-item-harness-base.d.ts +34 -3
  291. package/mdc-list/testing/public-api.d.ts +1 -1
  292. package/mdc-progress-spinner/progress-spinner.d.ts +3 -6
  293. package/mdc-select/_select-theme.scss +6 -27
  294. package/mdc-slide-toggle/slide-toggle.d.ts +5 -10
  295. package/mdc-slider/slider.d.ts +20 -16
  296. package/mdc-table/_table-theme.scss +1 -1
  297. package/mdc-tabs/_tabs-common.scss +0 -1
  298. package/mdc-tabs/module.d.ts +1 -1
  299. package/mdc-tabs/public-api.d.ts +1 -1
  300. package/mdc-tabs/tab-group.d.ts +1 -2
  301. package/mdc-tabs/tab-header.d.ts +0 -2
  302. package/mdc-tabs/tab-label-wrapper.d.ts +1 -2
  303. package/mdc-tabs/tab-nav-bar/tab-nav-bar.d.ts +12 -3
  304. package/mdc-tabs/testing/tab-harness-filters.d.ts +3 -0
  305. package/mdc-tabs/testing/tab-nav-bar-harness.d.ts +3 -0
  306. package/mdc-tabs/testing/tab-nav-panel-harness.d.ts +23 -0
  307. package/mdc-theming/prebuilt/deeppurple-amber.css +1 -0
  308. package/mdc-theming/prebuilt/indigo-pink.css +1 -1
  309. package/mdc-theming/prebuilt/pink-bluegrey.css +1 -0
  310. package/mdc-theming/prebuilt/purple-green.css +1 -0
  311. package/mdc-tooltip/_tooltip-theme.scss +1 -1
  312. package/package.json +17 -3
  313. package/esm2020/mdc-chips/grid-focus-key-manager.mjs +0 -21
  314. package/esm2020/mdc-chips/grid-key-manager.mjs +0 -218
  315. package/esm2020/mdc-list/list-styling.mjs +0 -92
  316. package/mdc-chips/grid-focus-key-manager.d.ts +0 -28
  317. package/mdc-chips/grid-key-manager.d.ts +0 -116
  318. package/mdc-list/list-styling.d.ts +0 -40
@@ -1,22 +1,175 @@
1
1
  import { coerceBooleanProperty } from '@angular/cdk/coercion';
2
2
  import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
3
3
  import * as i0 from '@angular/core';
4
- import { InjectionToken, Directive, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Optional, Inject, Input, Output, ContentChild, ViewChild, ContentChildren, forwardRef, QueryList, Self, NgModule } from '@angular/core';
4
+ import { Directive, Inject, Input, InjectionToken, EventEmitter, Component, ViewEncapsulation, ChangeDetectionStrategy, Optional, Attribute, Output, ContentChild, ViewChild, ContentChildren, forwardRef, Self, NgModule } from '@angular/core';
5
+ import * as i3$1 from '@angular/common';
6
+ import { DOCUMENT, CommonModule } from '@angular/common';
5
7
  import * as i3 from '@angular/material-experimental/mdc-core';
6
8
  import { mixinTabIndex, mixinDisabled, mixinColor, mixinDisableRipple, MAT_RIPPLE_GLOBAL_OPTIONS, MatRipple, mixinErrorState, MatCommonModule, MatRippleModule, ErrorStateMatcher } from '@angular/material-experimental/mdc-core';
7
- import { deprecated } from '@material/chips';
8
- import { SPACE, ENTER, hasModifierKey, BACKSPACE, DELETE, DOWN_ARROW, UP_ARROW, RIGHT_ARROW, LEFT_ARROW, END, HOME, TAB } from '@angular/cdk/keycodes';
9
+ import { MDCChipPrimaryActionFoundation, MDCChipActionType, MDCChipTrailingActionFoundation, MDCChipFoundation, MDCChipActionEvents, MDCChipActionInteractionTrigger, MDCChipCssClasses, MDCChipSetFoundation, MDCChipEvents } from '@material/chips';
9
10
  import { Subject, merge } from 'rxjs';
10
- import { takeUntil, take, startWith } from 'rxjs/operators';
11
- import * as i1 from '@angular/cdk/bidi';
12
- import * as i2 from '@angular/common';
13
- import { DOCUMENT, CommonModule } from '@angular/common';
14
- import { FocusKeyManager } from '@angular/cdk/a11y';
11
+ import * as i1 from '@angular/cdk/a11y';
12
+ import * as i2 from '@angular/cdk/bidi';
13
+ import { take, startWith, takeUntil, switchMap } from 'rxjs/operators';
14
+ import { BACKSPACE, DELETE, ENTER, TAB, hasModifierKey } from '@angular/cdk/keycodes';
15
15
  import * as i2$1 from '@angular/forms';
16
16
  import { NG_VALUE_ACCESSOR, Validators } from '@angular/forms';
17
17
  import * as i1$1 from '@angular/material-experimental/mdc-form-field';
18
18
  import { MatFormFieldControl, MAT_FORM_FIELD } from '@angular/material-experimental/mdc-form-field';
19
19
 
20
+ /**
21
+ * @license
22
+ * Copyright Google LLC All Rights Reserved.
23
+ *
24
+ * Use of this source code is governed by an MIT-style license that can be
25
+ * found in the LICENSE file at https://angular.io/license
26
+ */
27
+ /**
28
+ * Emits a custom event from an element.
29
+ * @param element Element from which to emit the event.
30
+ * @param _document Document that the element is placed in.
31
+ * @param eventName Name of the event.
32
+ * @param data Data attached to the event.
33
+ * @param shouldBubble Whether the event should bubble.
34
+ */
35
+ function emitCustomEvent(element, _document, eventName, data, shouldBubble) {
36
+ let event;
37
+ if (typeof CustomEvent === 'function') {
38
+ event = new CustomEvent(eventName, { bubbles: shouldBubble, detail: data });
39
+ }
40
+ else {
41
+ event = _document.createEvent('CustomEvent');
42
+ event.initCustomEvent(eventName, shouldBubble, false, data);
43
+ }
44
+ element.dispatchEvent(event);
45
+ }
46
+
47
+ /**
48
+ * @license
49
+ * Copyright Google LLC All Rights Reserved.
50
+ *
51
+ * Use of this source code is governed by an MIT-style license that can be
52
+ * found in the LICENSE file at https://angular.io/license
53
+ */
54
+ const _MatChipActionMixinBase = mixinTabIndex(mixinDisabled(class {
55
+ }), -1);
56
+ /**
57
+ * Interactive element within a chip.
58
+ * @docs-private
59
+ */
60
+ class MatChipAction extends _MatChipActionMixinBase {
61
+ constructor(_elementRef, _document, _changeDetectorRef) {
62
+ super();
63
+ this._elementRef = _elementRef;
64
+ this._changeDetectorRef = _changeDetectorRef;
65
+ this._adapter = {
66
+ focus: () => this.focus(),
67
+ getAttribute: (name) => this._elementRef.nativeElement.getAttribute(name),
68
+ setAttribute: (name, value) => {
69
+ // MDC tries to update the tabindex directly in the DOM when navigating using the keyboard
70
+ // which overrides our own handling. If we detect such a case, assign it to the same property
71
+ // as the Angular binding in order to maintain consistency.
72
+ if (name === 'tabindex') {
73
+ this._updateTabindex(parseInt(value));
74
+ }
75
+ else {
76
+ this._elementRef.nativeElement.setAttribute(name, value);
77
+ }
78
+ },
79
+ removeAttribute: (name) => {
80
+ if (name !== 'tabindex') {
81
+ this._elementRef.nativeElement.removeAttribute(name);
82
+ }
83
+ },
84
+ getElementID: () => this._elementRef.nativeElement.id,
85
+ emitEvent: (eventName, data) => {
86
+ emitCustomEvent(this._elementRef.nativeElement, this._document, eventName, data, true);
87
+ },
88
+ };
89
+ /** Whether the action is interactive. */
90
+ this.isInteractive = true;
91
+ this._foundation = this._createFoundation(this._adapter);
92
+ if (_elementRef.nativeElement.nodeName === 'BUTTON') {
93
+ _elementRef.nativeElement.setAttribute('type', 'button');
94
+ }
95
+ }
96
+ _handleClick(_event) {
97
+ // Usually these events can't happen while the chip is disabled since the browser won't
98
+ // allow them which is what MDC seems to rely on, however the event can be faked in tests.
99
+ if (!this.disabled && this.isInteractive) {
100
+ this._foundation.handleClick();
101
+ }
102
+ }
103
+ _handleKeydown(event) {
104
+ // Usually these events can't happen while the chip is disabled since the browser won't
105
+ // allow them which is what MDC seems to rely on, however the event can be faked in tests.
106
+ if (!this.disabled && this.isInteractive) {
107
+ this._foundation.handleKeydown(event);
108
+ }
109
+ }
110
+ _createFoundation(adapter) {
111
+ return new MDCChipPrimaryActionFoundation(adapter);
112
+ }
113
+ ngAfterViewInit() {
114
+ this._foundation.init();
115
+ this._foundation.setDisabled(this.disabled);
116
+ }
117
+ ngOnChanges(changes) {
118
+ if (changes['disabled']) {
119
+ this._foundation.setDisabled(this.disabled);
120
+ }
121
+ }
122
+ ngOnDestroy() {
123
+ this._foundation.destroy();
124
+ }
125
+ focus() {
126
+ this._elementRef.nativeElement.focus();
127
+ }
128
+ _getFoundation() {
129
+ return this._foundation;
130
+ }
131
+ _updateTabindex(value) {
132
+ this.tabIndex = value;
133
+ this._changeDetectorRef.markForCheck();
134
+ }
135
+ }
136
+ MatChipAction.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipAction, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive });
137
+ MatChipAction.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipAction, selector: "[matChipAction]", inputs: { disabled: "disabled", tabIndex: "tabIndex", isInteractive: "isInteractive" }, host: { listeners: { "click": "_handleClick($event)", "keydown": "_handleKeydown($event)" }, properties: { "class.mdc-evolution-chip__action--primary": "_getFoundation().actionType() === 1", "class.mdc-evolution-chip__action--presentational": "_getFoundation().actionType() === 1", "class.mdc-evolution-chip__action--trailing": "_getFoundation().actionType() === 2", "attr.tabindex": "(disabled || !isInteractive) ? null : tabIndex", "attr.disabled": "disabled ? '' : null", "attr.aria-disabled": "disabled" }, classAttribute: "mdc-evolution-chip__action mat-mdc-chip-action" }, usesInheritance: true, usesOnChanges: true, ngImport: i0 });
138
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipAction, decorators: [{
139
+ type: Directive,
140
+ args: [{
141
+ selector: '[matChipAction]',
142
+ inputs: ['disabled', 'tabIndex'],
143
+ host: {
144
+ 'class': 'mdc-evolution-chip__action mat-mdc-chip-action',
145
+ '[class.mdc-evolution-chip__action--primary]': `_getFoundation().actionType() === ${MDCChipActionType.PRIMARY}`,
146
+ // Note that while our actions are interactive, we have to add the `--presentational` class,
147
+ // in order to avoid some super-specific `:hover` styles from MDC.
148
+ '[class.mdc-evolution-chip__action--presentational]': `_getFoundation().actionType() === ${MDCChipActionType.PRIMARY}`,
149
+ '[class.mdc-evolution-chip__action--trailing]': `_getFoundation().actionType() === ${MDCChipActionType.TRAILING}`,
150
+ '[attr.tabindex]': '(disabled || !isInteractive) ? null : tabIndex',
151
+ '[attr.disabled]': "disabled ? '' : null",
152
+ '[attr.aria-disabled]': 'disabled',
153
+ '(click)': '_handleClick($event)',
154
+ '(keydown)': '_handleKeydown($event)',
155
+ },
156
+ }]
157
+ }], ctorParameters: function () {
158
+ return [{ type: i0.ElementRef }, { type: undefined, decorators: [{
159
+ type: Inject,
160
+ args: [DOCUMENT]
161
+ }] }, { type: i0.ChangeDetectorRef }];
162
+ }, propDecorators: { isInteractive: [{
163
+ type: Input
164
+ }] } });
165
+
166
+ /**
167
+ * @license
168
+ * Copyright Google LLC All Rights Reserved.
169
+ *
170
+ * Use of this source code is governed by an MIT-style license that can be
171
+ * found in the LICENSE file at https://angular.io/license
172
+ */
20
173
  /**
21
174
  * Injection token that can be used to reference instances of `MatChipAvatar`. It serves as
22
175
  * alternative token to the actual `MatChipAvatar` class which could cause unnecessary
@@ -28,29 +181,20 @@ const MAT_CHIP_AVATAR = new InjectionToken('MatChipAvatar');
28
181
  * @docs-private
29
182
  */
30
183
  class MatChipAvatar {
31
- constructor(_changeDetectorRef, _elementRef) {
32
- this._changeDetectorRef = _changeDetectorRef;
33
- this._elementRef = _elementRef;
34
- }
35
- /** Sets whether the given CSS class should be applied to the leading icon. */
36
- setClass(cssClass, active) {
37
- this._elementRef.nativeElement.classList.toggle(cssClass, active);
38
- this._changeDetectorRef.markForCheck();
39
- }
40
184
  }
41
- MatChipAvatar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipAvatar, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
42
- MatChipAvatar.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]", host: { attributes: { "role": "img" }, classAttribute: "mat-mdc-chip-avatar mdc-chip__icon mdc-chip__icon--leading" }, providers: [{ provide: MAT_CHIP_AVATAR, useExisting: MatChipAvatar }], ngImport: i0 });
43
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipAvatar, decorators: [{
185
+ MatChipAvatar.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipAvatar, deps: [], target: i0.ɵɵFactoryTarget.Directive });
186
+ MatChipAvatar.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipAvatar, selector: "mat-chip-avatar, [matChipAvatar]", host: { attributes: { "role": "img" }, classAttribute: "mat-mdc-chip-avatar mdc-evolution-chip__icon mdc-evolution-chip__icon--primary" }, providers: [{ provide: MAT_CHIP_AVATAR, useExisting: MatChipAvatar }], ngImport: i0 });
187
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipAvatar, decorators: [{
44
188
  type: Directive,
45
189
  args: [{
46
190
  selector: 'mat-chip-avatar, [matChipAvatar]',
47
191
  host: {
48
- 'class': 'mat-mdc-chip-avatar mdc-chip__icon mdc-chip__icon--leading',
192
+ 'class': 'mat-mdc-chip-avatar mdc-evolution-chip__icon mdc-evolution-chip__icon--primary',
49
193
  'role': 'img',
50
194
  },
51
195
  providers: [{ provide: MAT_CHIP_AVATAR, useExisting: MatChipAvatar }],
52
196
  }]
53
- }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }]; } });
197
+ }] });
54
198
  /**
55
199
  * Injection token that can be used to reference instances of `MatChipTrailingIcon`. It serves as
56
200
  * alternative token to the actual `MatChipTrailingIcon` class which could cause unnecessary
@@ -61,79 +205,38 @@ const MAT_CHIP_TRAILING_ICON = new InjectionToken('MatChipTrailingIcon');
61
205
  * Directive to add CSS classes to and configure attributes for chip trailing icon.
62
206
  * @docs-private
63
207
  */
64
- class MatChipTrailingIcon {
65
- constructor(
66
- // TODO(crisbeto): currently the chip needs a reference to the trailing
67
- // icon for the deprecated `setTrailingActionAttr` method. Until the
68
- // method is removed, we can't use the chip here, because it causes a
69
- // circular import. private _chip: MatChip
70
- _elementRef) {
71
- this._elementRef = _elementRef;
72
- this._adapter = {
73
- focus: () => this._elementRef.nativeElement.focus(),
74
- getAttribute: (name) => this._elementRef.nativeElement.getAttribute(name),
75
- setAttribute: (name, value) => {
76
- this._elementRef.nativeElement.setAttribute(name, value);
77
- },
78
- // TODO(crisbeto): there's also a `trigger` parameter that the chip isn't
79
- // handling yet. Consider passing it along once MDC start using it.
80
- notifyInteraction: () => {
81
- // TODO(crisbeto): uncomment this code once we've inverted the
82
- // dependency on `MatChip`. this._chip._notifyInteraction();
83
- },
84
- // TODO(crisbeto): there's also a `key` parameter that the chip isn't
85
- // handling yet. Consider passing it along once MDC start using it.
86
- notifyNavigation: () => {
87
- // TODO(crisbeto): uncomment this code once we've inverted the
88
- // dependency on `MatChip`. this._chip._notifyNavigation();
89
- },
90
- };
91
- this._foundation = new deprecated.MDCChipTrailingActionFoundation(this._adapter);
92
- }
93
- ngOnDestroy() {
94
- this._foundation.destroy();
95
- }
96
- focus() {
97
- this._elementRef.nativeElement.focus();
98
- }
99
- /** Sets an attribute on the icon. */
100
- setAttribute(name, value) {
101
- this._elementRef.nativeElement.setAttribute(name, value);
208
+ class MatChipTrailingIcon extends MatChipAction {
209
+ constructor() {
210
+ super(...arguments);
211
+ /**
212
+ * MDC considers all trailing actions as a remove icon,
213
+ * but we support non-interactive trailing icons.
214
+ */
215
+ this.isInteractive = false;
102
216
  }
103
- isNavigable() {
104
- return this._foundation.isNavigable();
217
+ _createFoundation(adapter) {
218
+ return new MDCChipTrailingActionFoundation(adapter);
105
219
  }
106
220
  }
107
- MatChipTrailingIcon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipTrailingIcon, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
108
- MatChipTrailingIcon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]", host: { attributes: { "tabindex": "-1", "aria-hidden": "true" }, classAttribute: "mat-mdc-chip-trailing-icon mdc-chip__icon mdc-chip__icon--trailing" }, providers: [{ provide: MAT_CHIP_TRAILING_ICON, useExisting: MatChipTrailingIcon }], ngImport: i0 });
109
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipTrailingIcon, decorators: [{
221
+ MatChipTrailingIcon.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipTrailingIcon, deps: null, target: i0.ɵɵFactoryTarget.Directive });
222
+ MatChipTrailingIcon.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipTrailingIcon, selector: "mat-chip-trailing-icon, [matChipTrailingIcon]", host: { attributes: { "aria-hidden": "true" }, classAttribute: "mat-mdc-chip-trailing-icon mdc-evolution-chip__icon mdc-evolution-chip__icon--trailing" }, providers: [{ provide: MAT_CHIP_TRAILING_ICON, useExisting: MatChipTrailingIcon }], usesInheritance: true, ngImport: i0 });
223
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipTrailingIcon, decorators: [{
110
224
  type: Directive,
111
225
  args: [{
112
226
  selector: 'mat-chip-trailing-icon, [matChipTrailingIcon]',
113
227
  host: {
114
- 'class': 'mat-mdc-chip-trailing-icon mdc-chip__icon mdc-chip__icon--trailing',
115
- 'tabindex': '-1',
228
+ 'class': 'mat-mdc-chip-trailing-icon mdc-evolution-chip__icon mdc-evolution-chip__icon--trailing',
116
229
  'aria-hidden': 'true',
117
230
  },
118
231
  providers: [{ provide: MAT_CHIP_TRAILING_ICON, useExisting: MatChipTrailingIcon }],
119
232
  }]
120
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
233
+ }] });
121
234
  /**
122
235
  * Injection token that can be used to reference instances of `MatChipRemove`. It serves as
123
236
  * alternative token to the actual `MatChipRemove` class which could cause unnecessary
124
237
  * retention of the class and its directive metadata.
125
238
  */
126
239
  const MAT_CHIP_REMOVE = new InjectionToken('MatChipRemove');
127
- /**
128
- * Boilerplate for applying mixins to MatChipRemove.
129
- * @docs-private
130
- */
131
- class MatChipRemoveBase extends MatChipTrailingIcon {
132
- constructor(elementRef) {
133
- super(elementRef);
134
- }
135
- }
136
- const _MatChipRemoveMixinBase = mixinTabIndex(mixinDisabled(MatChipRemoveBase), 0);
137
240
  /**
138
241
  * Directive to remove the parent chip when the trailing icon is clicked or
139
242
  * when the ENTER key is pressed on it.
@@ -149,65 +252,38 @@ const _MatChipRemoveMixinBase = mixinTabIndex(mixinDisabled(MatChipRemoveBase),
149
252
  * </mat-chip>
150
253
  * ```
151
254
  */
152
- class MatChipRemove extends _MatChipRemoveMixinBase {
153
- constructor(elementRef) {
154
- super(elementRef);
155
- /**
156
- * Emits when the user interacts with the icon.
157
- * @docs-private
158
- */
159
- this.interaction = new Subject();
160
- if (elementRef.nativeElement.nodeName === 'BUTTON') {
161
- elementRef.nativeElement.setAttribute('type', 'button');
162
- }
255
+ class MatChipRemove extends MatChipAction {
256
+ _createFoundation(adapter) {
257
+ return new MDCChipTrailingActionFoundation(adapter);
163
258
  }
164
- /** Emits a MouseEvent when the user clicks on the remove icon. */
165
259
  _handleClick(event) {
166
- this.interaction.next(event);
260
+ // Some consumers bind `click` events directly on the chip
261
+ // which will also pick up clicks on the remove button.
167
262
  event.stopPropagation();
263
+ super._handleClick(event);
168
264
  }
169
- focus() {
170
- this._elementRef.nativeElement.focus();
265
+ _handleKeydown(event) {
266
+ event.stopPropagation();
267
+ super._handleKeydown(event);
171
268
  }
172
269
  }
173
- MatChipRemove.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipRemove, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
174
- MatChipRemove.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipRemove, selector: "[matChipRemove]", inputs: { disabled: "disabled", tabIndex: "tabIndex" }, host: { attributes: { "role": "button" }, listeners: { "click": "_handleClick($event)", "keydown": "interaction.next($event)" }, properties: { "tabIndex": "tabIndex", "attr.aria-hidden": "null" }, classAttribute: "mat-mdc-chip-remove mat-mdc-chip-trailing-icon mat-mdc-focus-indicator\n mdc-chip__icon mdc-chip__icon--trailing" }, providers: [{ provide: MAT_CHIP_REMOVE, useExisting: MatChipRemove }], usesInheritance: true, ngImport: i0 });
175
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipRemove, decorators: [{
270
+ MatChipRemove.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipRemove, deps: null, target: i0.ɵɵFactoryTarget.Directive });
271
+ MatChipRemove.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipRemove, selector: "[matChipRemove]", host: { attributes: { "role": "button" }, properties: { "attr.aria-hidden": "null" }, classAttribute: "mat-mdc-chip-remove mat-mdc-chip-trailing-icon mat-mdc-focus-indicator mdc-evolution-chip__icon mdc-evolution-chip__icon--trailing" }, providers: [{ provide: MAT_CHIP_REMOVE, useExisting: MatChipRemove }], usesInheritance: true, ngImport: i0 });
272
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipRemove, decorators: [{
176
273
  type: Directive,
177
274
  args: [{
178
275
  selector: '[matChipRemove]',
179
- inputs: ['disabled', 'tabIndex'],
180
276
  host: {
181
- 'class': `mat-mdc-chip-remove mat-mdc-chip-trailing-icon mat-mdc-focus-indicator
182
- mdc-chip__icon mdc-chip__icon--trailing`,
183
- '[tabIndex]': 'tabIndex',
277
+ 'class': 'mat-mdc-chip-remove mat-mdc-chip-trailing-icon mat-mdc-focus-indicator ' +
278
+ 'mdc-evolution-chip__icon mdc-evolution-chip__icon--trailing',
184
279
  'role': 'button',
185
- '(click)': '_handleClick($event)',
186
- '(keydown)': 'interaction.next($event)',
187
- // We need to remove this explicitly, because it gets inherited from MatChipTrailingIcon.
188
280
  '[attr.aria-hidden]': 'null',
189
281
  },
190
282
  providers: [{ provide: MAT_CHIP_REMOVE, useExisting: MatChipRemove }],
191
283
  }]
192
- }], ctorParameters: function () { return [{ type: i0.ElementRef }]; } });
193
-
194
- let uid$1 = 0;
195
- /**
196
- * Directive to add MDC CSS to non-basic chips.
197
- * @docs-private
198
- */
199
- class MatChipCssInternalOnly {
200
- }
201
- MatChipCssInternalOnly.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipCssInternalOnly, deps: [], target: i0.ɵɵFactoryTarget.Directive });
202
- MatChipCssInternalOnly.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipCssInternalOnly, selector: "mat-chip, mat-chip-option, mat-chip-row, [mat-chip], [mat-chip-option],\n [mat-chip-row]", host: { classAttribute: "mat-mdc-chip mdc-chip" }, ngImport: i0 });
203
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipCssInternalOnly, decorators: [{
204
- type: Directive,
205
- args: [{
206
- selector: `mat-chip, mat-chip-option, mat-chip-row, [mat-chip], [mat-chip-option],
207
- [mat-chip-row]`,
208
- host: { 'class': 'mat-mdc-chip mdc-chip' },
209
- }]
210
284
  }] });
285
+
286
+ let uid = 0;
211
287
  /**
212
288
  * Boilerplate for applying mixins to MatChip.
213
289
  * @docs-private
@@ -224,10 +300,12 @@ const _MatChipMixinBase = mixinTabIndex(mixinColor(mixinDisableRipple(MatChipBas
224
300
  * Extended by MatChipOption and MatChipRow for different interaction patterns.
225
301
  */
226
302
  class MatChip extends _MatChipMixinBase {
227
- constructor(_changeDetectorRef, elementRef, _ngZone, _dir, animationMode, _globalRippleOptions) {
303
+ constructor(_changeDetectorRef, elementRef, _ngZone, _focusMonitor, _document, _dir, animationMode, _globalRippleOptions, tabIndex) {
304
+ var _a;
228
305
  super(elementRef);
229
306
  this._changeDetectorRef = _changeDetectorRef;
230
307
  this._ngZone = _ngZone;
308
+ this._focusMonitor = _focusMonitor;
231
309
  this._dir = _dir;
232
310
  this._globalRippleOptions = _globalRippleOptions;
233
311
  /** Whether the ripple is centered on the chip. */
@@ -236,22 +314,21 @@ class MatChip extends _MatChipMixinBase {
236
314
  this._onFocus = new Subject();
237
315
  /** Emits when the chip is blurred. */
238
316
  this._onBlur = new Subject();
239
- this.REMOVE_ICON_HANDLED_KEYS = new Set([SPACE, ENTER]);
317
+ /** Role for the root of the chip. */
318
+ this.role = null;
240
319
  /** Whether the chip has focus. */
241
320
  this._hasFocusInternal = false;
242
- /** Default unique id for the chip. */
243
- this._uniqueId = `mat-mdc-chip-${uid$1++}`;
244
321
  /** A unique id for the chip. If none is supplied, it will be auto-generated. */
245
- this.id = this._uniqueId;
322
+ this.id = `mat-mdc-chip-${uid++}`;
323
+ /** ARIA label for the content of the chip. */
324
+ this.ariaLabel = null;
246
325
  this._disabled = false;
247
326
  this._removable = true;
248
327
  this._highlighted = false;
249
- /** Emitted when the user interacts with the chip. */
250
- this.interaction = new EventEmitter();
251
- /** Emitted when the chip is destroyed. */
252
- this.destroyed = new EventEmitter();
253
328
  /** Emitted when a chip is to be removed. */
254
329
  this.removed = new EventEmitter();
330
+ /** Emitted when the chip is destroyed. */
331
+ this.destroyed = new EventEmitter();
255
332
  /** The unstyled chip selector for this component. */
256
333
  this.basicChipAttrName = 'mat-basic-chip';
257
334
  /**
@@ -262,86 +339,88 @@ class MatChip extends _MatChipMixinBase {
262
339
  addClass: className => this._setMdcClass(className, true),
263
340
  removeClass: className => this._setMdcClass(className, false),
264
341
  hasClass: className => this._elementRef.nativeElement.classList.contains(className),
265
- addClassToLeadingIcon: className => this.leadingIcon.setClass(className, true),
266
- removeClassFromLeadingIcon: className => this.leadingIcon.setClass(className, false),
267
- eventTargetHasClass: (target, className) => {
268
- // We need to null check the `classList`, because IE and Edge don't
269
- // support it on SVG elements and Edge seems to throw for ripple
270
- // elements, because they're outside the DOM.
271
- return target && target.classList
272
- ? target.classList.contains(className)
273
- : false;
342
+ emitEvent: (eventName, data) => {
343
+ emitCustomEvent(this._elementRef.nativeElement, this._document, eventName, data, true);
274
344
  },
275
- notifyInteraction: () => this._notifyInteraction(),
276
- notifySelection: () => {
277
- // No-op. We call dispatchSelectionEvent ourselves in MatChipOption,
278
- // because we want to specify whether selection occurred via user
279
- // input.
345
+ setStyleProperty: (propertyName, value) => {
346
+ this._elementRef.nativeElement.style.setProperty(propertyName, value);
280
347
  },
281
- notifyNavigation: () => this._notifyNavigation(),
282
- notifyTrailingIconInteraction: () => { },
283
- notifyRemoval: () => this.remove(),
284
- notifyEditStart: () => {
285
- this._onEditStart();
286
- this._changeDetectorRef.markForCheck();
348
+ isRTL: () => { var _a; return ((_a = this._dir) === null || _a === void 0 ? void 0 : _a.value) === 'rtl'; },
349
+ getAttribute: attributeName => this._elementRef.nativeElement.getAttribute(attributeName),
350
+ getElementID: () => this._elementRef.nativeElement.id,
351
+ getOffsetWidth: () => this._elementRef.nativeElement.offsetWidth,
352
+ getActions: () => {
353
+ const result = [];
354
+ if (this._getAction(MDCChipActionType.PRIMARY)) {
355
+ result.push(MDCChipActionType.PRIMARY);
356
+ }
357
+ if (this._getAction(MDCChipActionType.TRAILING)) {
358
+ result.push(MDCChipActionType.TRAILING);
359
+ }
360
+ return result;
287
361
  },
288
- notifyEditFinish: () => {
289
- this._onEditFinish();
290
- this._changeDetectorRef.markForCheck();
362
+ isActionSelectable: (action) => {
363
+ var _a;
364
+ return ((_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.isSelectable()) || false;
291
365
  },
292
- getComputedStyleValue: propertyName => {
293
- // This function is run when a chip is removed so it might be
294
- // invoked during server-side rendering. Add some extra checks just in
295
- // case.
296
- if (typeof window !== 'undefined' && window) {
297
- const getComputedStyle = window.getComputedStyle(this._elementRef.nativeElement);
298
- return getComputedStyle.getPropertyValue(propertyName);
299
- }
300
- return '';
366
+ isActionSelected: (action) => {
367
+ var _a;
368
+ return ((_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.isSelected()) || false;
301
369
  },
302
- setStyleProperty: (propertyName, value) => {
303
- this._elementRef.nativeElement.style.setProperty(propertyName, value);
370
+ isActionDisabled: (action) => {
371
+ var _a;
372
+ return ((_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.isDisabled()) || false;
304
373
  },
305
- hasLeadingIcon: () => !!this.leadingIcon,
306
- isTrailingActionNavigable: () => {
307
- if (this.trailingIcon) {
308
- return this.trailingIcon.isNavigable();
309
- }
310
- return false;
374
+ isActionFocusable: (action) => {
375
+ var _a;
376
+ return ((_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.isFocusable()) || false;
311
377
  },
312
- isRTL: () => !!this._dir && this._dir.value === 'rtl',
313
- focusPrimaryAction: () => {
314
- // Angular Material MDC chips fully manage focus. TODO: Managing focus
315
- // and handling keyboard events was added by MDC after our
316
- // implementation; consider consolidating.
378
+ setActionSelected: (action, isSelected) => {
379
+ var _a;
380
+ (_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.setSelected(isSelected);
317
381
  },
318
- focusTrailingAction: () => { },
319
- removeTrailingActionFocus: () => { },
320
- setPrimaryActionAttr: (name, value) => {
321
- // MDC is currently using this method to set aria-checked on choice
322
- // and filter chips, which in the MDC templates have role="checkbox"
323
- // and role="radio" respectively. We have role="option" on those chips
324
- // instead, so we do not want aria-checked. Since we also manage the
325
- // tabindex ourselves, we don't allow MDC to set it.
326
- if (name === 'aria-checked' || name === 'tabindex') {
327
- return;
328
- }
329
- this._elementRef.nativeElement.setAttribute(name, value);
382
+ setActionDisabled: (action, isDisabled) => {
383
+ var _a;
384
+ (_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.setDisabled(isDisabled);
385
+ },
386
+ setActionFocus: (action, behavior) => {
387
+ var _a;
388
+ (_a = this._getAction(action)) === null || _a === void 0 ? void 0 : _a.setFocus(behavior);
330
389
  },
331
- // The 2 functions below are used by the MDC ripple, which we aren't using,
332
- // so they will never be called
333
- getRootBoundingClientRect: () => this._elementRef.nativeElement.getBoundingClientRect(),
334
- getCheckmarkBoundingClientRect: () => null,
335
- getAttribute: attr => this._elementRef.nativeElement.getAttribute(attr),
336
390
  };
337
- this._chipFoundation = new deprecated.MDCChipFoundation(this._chipAdapter);
391
+ this._handleActionInteraction = (event) => {
392
+ this._onChipInteraction(event);
393
+ };
394
+ this._handleActionNavigation = (event) => {
395
+ this._chipFoundation.handleActionNavigation(event);
396
+ };
397
+ this._handleTransitionend = (event) => {
398
+ if (event.target === this._elementRef.nativeElement) {
399
+ this._ngZone.run(() => this._chipFoundation.handleTransitionEnd());
400
+ }
401
+ };
402
+ this._handleAnimationend = (event) => {
403
+ if (event.target === this._elementRef.nativeElement) {
404
+ this._ngZone.run(() => this._chipFoundation.handleAnimationEnd(event));
405
+ }
406
+ };
407
+ const element = elementRef.nativeElement;
408
+ this._document = _document;
409
+ this._chipFoundation = new MDCChipFoundation(this._chipAdapter);
338
410
  this._animationsDisabled = animationMode === 'NoopAnimations';
339
411
  this._isBasicChip =
340
- elementRef.nativeElement.hasAttribute(this.basicChipAttrName) ||
341
- elementRef.nativeElement.tagName.toLowerCase() === this.basicChipAttrName;
342
- }
343
- _handleTransitionEnd(event) {
344
- this._chipFoundation.handleTransitionEnd(event);
412
+ element.hasAttribute(this.basicChipAttrName) ||
413
+ element.tagName.toLowerCase() === this.basicChipAttrName;
414
+ element.addEventListener(MDCChipActionEvents.INTERACTION, this._handleActionInteraction);
415
+ element.addEventListener(MDCChipActionEvents.NAVIGATION, this._handleActionNavigation);
416
+ _focusMonitor.monitor(elementRef, true);
417
+ _ngZone.runOutsideAngular(() => {
418
+ element.addEventListener('transitionend', this._handleTransitionend);
419
+ element.addEventListener('animationend', this._handleAnimationend);
420
+ });
421
+ if (tabIndex != null) {
422
+ this.tabIndex = (_a = parseInt(tabIndex)) !== null && _a !== void 0 ? _a : this.defaultTabIndex;
423
+ }
345
424
  }
346
425
  _hasFocus() {
347
426
  return this._hasFocusInternal;
@@ -352,10 +431,14 @@ class MatChip extends _MatChipMixinBase {
352
431
  set disabled(value) {
353
432
  this._disabled = coerceBooleanProperty(value);
354
433
  if (this.removeIcon) {
355
- this.removeIcon.disabled = value;
434
+ this.removeIcon.disabled = this._disabled;
356
435
  }
436
+ this._chipFoundation.setDisabled(this._disabled);
357
437
  }
358
- /** The value of the chip. Defaults to the content inside the mdc-chip__text element. */
438
+ /**
439
+ * The value of the chip. Defaults to the content inside
440
+ * the `mat-mdc-chip-action-label` element.
441
+ */
359
442
  get value() {
360
443
  return this._value !== undefined ? this._value : this._textElement.textContent.trim();
361
444
  }
@@ -380,42 +463,24 @@ class MatChip extends _MatChipMixinBase {
380
463
  set highlighted(value) {
381
464
  this._highlighted = coerceBooleanProperty(value);
382
465
  }
383
- ngAfterContentInit() {
384
- this._initRemoveIcon();
385
- }
386
466
  ngAfterViewInit() {
387
467
  this._chipFoundation.init();
388
- this._textElement = this._elementRef.nativeElement.querySelector('.mdc-chip__text');
468
+ this._chipFoundation.setDisabled(this.disabled);
469
+ this._textElement = this._elementRef.nativeElement.querySelector('.mat-mdc-chip-action-label');
470
+ if (this._pendingFocus) {
471
+ this._pendingFocus = false;
472
+ this.focus();
473
+ }
389
474
  }
390
475
  ngOnDestroy() {
391
- this.destroyed.emit({ chip: this });
476
+ const element = this._elementRef.nativeElement;
477
+ element.removeEventListener(MDCChipActionEvents.INTERACTION, this._handleActionInteraction);
478
+ element.removeEventListener(MDCChipActionEvents.NAVIGATION, this._handleActionNavigation);
479
+ element.removeEventListener('transitionend', this._handleTransitionend);
480
+ element.removeEventListener('animationend', this._handleAnimationend);
392
481
  this._chipFoundation.destroy();
393
- }
394
- /** Sets up the remove icon chip foundation, and subscribes to remove icon events. */
395
- _initRemoveIcon() {
396
- if (this.removeIcon) {
397
- this._chipFoundation.setShouldRemoveOnTrailingIconClick(true);
398
- this.removeIcon.disabled = this.disabled;
399
- this.removeIcon.interaction.pipe(takeUntil(this.destroyed)).subscribe(event => {
400
- // The MDC chip foundation calls stopPropagation() for any trailing icon interaction
401
- // event, even ones it doesn't handle, so we want to avoid passing it keyboard events
402
- // for which we have a custom handler. Note that we assert the type of the event using
403
- // the `type`, because `instanceof KeyboardEvent` can throw during server-side rendering.
404
- const isKeyboardEvent = event.type.startsWith('key');
405
- if (this.disabled ||
406
- (isKeyboardEvent && !this.REMOVE_ICON_HANDLED_KEYS.has(event.keyCode))) {
407
- return;
408
- }
409
- this.remove();
410
- if (isKeyboardEvent && !hasModifierKey(event)) {
411
- const keyCode = event.keyCode;
412
- // Prevent default space and enter presses so we don't scroll the page or submit forms.
413
- if (keyCode === SPACE || keyCode === ENTER) {
414
- event.preventDefault();
415
- }
416
- }
417
- });
418
- }
482
+ this._focusMonitor.stopMonitoring(this._elementRef);
483
+ this.destroyed.emit({ chip: this });
419
484
  }
420
485
  /**
421
486
  * Allows for programmatic removal of the chip.
@@ -433,29 +498,6 @@ class MatChip extends _MatChipMixinBase {
433
498
  active ? classes.add(cssClass) : classes.remove(cssClass);
434
499
  this._changeDetectorRef.markForCheck();
435
500
  }
436
- /** Forwards interaction events to the MDC chip foundation. */
437
- _handleInteraction(event) {
438
- if (this.disabled) {
439
- return;
440
- }
441
- if (event.type === 'click') {
442
- this._chipFoundation.handleClick();
443
- return;
444
- }
445
- if (event.type === 'dblclick') {
446
- this._chipFoundation.handleDoubleClick();
447
- }
448
- if (event.type === 'keydown') {
449
- this._chipFoundation.handleKeydown(event);
450
- return;
451
- }
452
- if (event.type === 'focusout') {
453
- this._chipFoundation.handleFocusOut(event);
454
- }
455
- if (event.type === 'focusin') {
456
- this._chipFoundation.handleFocusIn(event);
457
- }
458
- }
459
501
  /** Whether or not the ripple should be disabled. */
460
502
  _isRippleDisabled() {
461
503
  var _a;
@@ -465,37 +507,91 @@ class MatChip extends _MatChipMixinBase {
465
507
  this._isBasicChip ||
466
508
  !!((_a = this._globalRippleOptions) === null || _a === void 0 ? void 0 : _a.disabled));
467
509
  }
468
- _notifyInteraction() {
469
- this.interaction.emit(this.id);
510
+ _getAction(type) {
511
+ var _a, _b;
512
+ switch (type) {
513
+ case MDCChipActionType.PRIMARY:
514
+ return (_a = this.primaryAction) === null || _a === void 0 ? void 0 : _a._getFoundation();
515
+ case MDCChipActionType.TRAILING:
516
+ return (_b = (this.removeIcon || this.trailingIcon)) === null || _b === void 0 ? void 0 : _b._getFoundation();
517
+ }
518
+ return undefined;
519
+ }
520
+ _getFoundation() {
521
+ return this._chipFoundation;
522
+ }
523
+ _hasTrailingIcon() {
524
+ return !!(this.trailingIcon || this.removeIcon);
525
+ }
526
+ /** Allows for programmatic focusing of the chip. */
527
+ focus() {
528
+ if (this.disabled) {
529
+ return;
530
+ }
531
+ // If `focus` is called before `ngAfterViewInit`, we won't have access to the primary action.
532
+ // This can happen if the consumer tries to focus a chip immediately after it is added.
533
+ // Queue the method to be called again on init.
534
+ if (!this.primaryAction) {
535
+ this._pendingFocus = true;
536
+ return;
537
+ }
538
+ if (!this._hasFocus()) {
539
+ this._onFocus.next({ chip: this });
540
+ this._hasFocusInternal = true;
541
+ }
542
+ this.primaryAction.focus();
470
543
  }
471
- _notifyNavigation() {
472
- // TODO: This is a new feature added by MDC. Consider exposing it to users
473
- // in the future.
544
+ /** Overridden by MatChipOption. */
545
+ _onChipInteraction(event) {
546
+ var _a;
547
+ const removeElement = (_a = this.removeIcon) === null || _a === void 0 ? void 0 : _a._elementRef.nativeElement;
548
+ const trigger = event.detail.trigger;
549
+ // MDC's removal process requires an `animationend` event followed by a `transitionend`
550
+ // event coming from the chip, which in turn will call `remove`. While we can stub
551
+ // out these events in our own tests, they can be difficult to fake for consumers that are
552
+ // testing our components or are wrapping them. We skip the entire sequence and trigger the
553
+ // removal directly in order to make the component easier to deal with.
554
+ if (removeElement &&
555
+ (trigger === MDCChipActionInteractionTrigger.CLICK ||
556
+ trigger === MDCChipActionInteractionTrigger.ENTER_KEY ||
557
+ trigger === MDCChipActionInteractionTrigger.SPACEBAR_KEY) &&
558
+ (event.target === removeElement || removeElement.contains(event.target))) {
559
+ this.remove();
560
+ }
561
+ else {
562
+ this._chipFoundation.handleActionInteraction(event);
563
+ }
474
564
  }
475
- /** Overridden by MatChipRow. */
476
- _onEditStart() { }
477
- /** Overridden by MatChipRow. */
478
- _onEditFinish() { }
479
565
  }
480
- MatChip.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChip, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.Directionality, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
481
- MatChip.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChip, selector: "mat-basic-chip, mat-chip", inputs: { color: "color", disableRipple: "disableRipple", id: "id", disabled: "disabled", value: "value", removable: "removable", highlighted: "highlighted" }, outputs: { interaction: "interaction", destroyed: "destroyed", removed: "removed" }, host: { listeners: { "transitionend": "_handleTransitionEnd($event)" }, properties: { "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mat-mdc-chip-with-trailing-icon": "trailingIcon || removeIcon", "class.mat-mdc-basic-chip": "_isBasicChip", "class.mat-mdc-standard-chip": "!_isBasicChip", "class._mat-animation-noopable": "_animationsDisabled", "id": "id", "attr.disabled": "disabled || null", "attr.aria-disabled": "disabled.toString()" } }, queries: [{ propertyName: "leadingIcon", first: true, predicate: MAT_CHIP_AVATAR, descendants: true }, { propertyName: "trailingIcon", first: true, predicate: MAT_CHIP_TRAILING_ICON, descendants: true }, { propertyName: "removeIcon", first: true, predicate: MAT_CHIP_REMOVE, descendants: true }], viewQueries: [{ propertyName: "ripple", first: true, predicate: MatRipple, descendants: true }], exportAs: ["matChip"], usesInheritance: true, ngImport: i0, template: "<span class=\"mdc-chip__ripple\"></span>\n\n<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n\n<ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n<div class=\"mdc-chip__primary-action\">\n <div class=\"mdc-chip__text\"><ng-content></ng-content></div>\n</div>\n<ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], directives: [{ type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
482
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChip, decorators: [{
566
+ MatChip.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChip, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: DOCUMENT }, { token: i2.Directionality, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
567
+ MatChip.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChip, selector: "mat-basic-chip, mat-chip", inputs: { color: "color", disableRipple: "disableRipple", tabIndex: "tabIndex", role: "role", id: "id", ariaLabel: ["aria-label", "ariaLabel"], disabled: "disabled", value: "value", removable: "removable", highlighted: "highlighted" }, outputs: { removed: "removed", destroyed: "destroyed" }, host: { properties: { "class.mdc-evolution-chip": "!_isBasicChip", "class.mdc-evolution-chip--disabled": "disabled", "class.mdc-evolution-chip--with-trailing-action": "_hasTrailingIcon()", "class.mdc-evolution-chip--with-primary-graphic": "leadingIcon", "class.mdc-evolution-chip--with-primary-icon": "leadingIcon", "class.mdc-evolution-chip--with-avatar": "leadingIcon", "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-basic-chip": "_isBasicChip", "class.mat-mdc-standard-chip": "!_isBasicChip", "class.mat-mdc-chip-with-trailing-icon": "_hasTrailingIcon()", "class._mat-animation-noopable": "_animationsDisabled", "id": "id", "attr.role": "role", "attr.tabindex": "role ? tabIndex : null", "attr.aria-label": "ariaLabel" }, classAttribute: "mat-mdc-chip" }, queries: [{ propertyName: "leadingIcon", first: true, predicate: MAT_CHIP_AVATAR, descendants: true }, { propertyName: "trailingIcon", first: true, predicate: MAT_CHIP_TRAILING_ICON, descendants: true }, { propertyName: "removeIcon", first: true, predicate: MAT_CHIP_REMOVE, descendants: true }], viewQueries: [{ propertyName: "ripple", first: true, predicate: MatRipple, descendants: true }, { propertyName: "primaryAction", first: true, predicate: MatChipAction, descendants: true }], exportAs: ["matChip"], usesInheritance: true, ngImport: i0, template: "<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n<span class=\"mat-mdc-chip-focus-overlay\"></span>\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\">\n <div matChipAction [isInteractive]=\"false\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"leadingIcon\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\">\n <ng-content></ng-content>\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </div>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"], directives: [{ type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: MatChipAction, selector: "[matChipAction]", inputs: ["disabled", "tabIndex", "isInteractive"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
568
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChip, decorators: [{
483
569
  type: Component,
484
- args: [{ selector: 'mat-basic-chip, mat-chip', inputs: ['color', 'disableRipple'], exportAs: 'matChip', host: {
485
- '[class.mat-mdc-chip-disabled]': 'disabled',
486
- '[class.mat-mdc-chip-highlighted]': 'highlighted',
570
+ args: [{ selector: 'mat-basic-chip, mat-chip', inputs: ['color', 'disableRipple', 'tabIndex'], exportAs: 'matChip', host: {
571
+ 'class': 'mat-mdc-chip',
572
+ '[class.mdc-evolution-chip]': '!_isBasicChip',
573
+ '[class.mdc-evolution-chip--disabled]': 'disabled',
574
+ '[class.mdc-evolution-chip--with-trailing-action]': '_hasTrailingIcon()',
575
+ '[class.mdc-evolution-chip--with-primary-graphic]': 'leadingIcon',
576
+ '[class.mdc-evolution-chip--with-primary-icon]': 'leadingIcon',
577
+ '[class.mdc-evolution-chip--with-avatar]': 'leadingIcon',
487
578
  '[class.mat-mdc-chip-with-avatar]': 'leadingIcon',
488
- '[class.mat-mdc-chip-with-trailing-icon]': 'trailingIcon || removeIcon',
579
+ '[class.mat-mdc-chip-highlighted]': 'highlighted',
580
+ '[class.mat-mdc-chip-disabled]': 'disabled',
489
581
  '[class.mat-mdc-basic-chip]': '_isBasicChip',
490
582
  '[class.mat-mdc-standard-chip]': '!_isBasicChip',
583
+ '[class.mat-mdc-chip-with-trailing-icon]': '_hasTrailingIcon()',
491
584
  '[class._mat-animation-noopable]': '_animationsDisabled',
492
585
  '[id]': 'id',
493
- '[attr.disabled]': 'disabled || null',
494
- '[attr.aria-disabled]': 'disabled.toString()',
495
- '(transitionend)': '_handleTransitionEnd($event)',
496
- }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"mdc-chip__ripple\"></span>\n\n<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n\n<ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n<div class=\"mdc-chip__primary-action\">\n <div class=\"mdc-chip__text\"><ng-content></ng-content></div>\n</div>\n<ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
586
+ '[attr.role]': 'role',
587
+ '[attr.tabindex]': 'role ? tabIndex : null',
588
+ '[attr.aria-label]': 'ariaLabel',
589
+ }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n<span class=\"mat-mdc-chip-focus-overlay\"></span>\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\">\n <div matChipAction [isInteractive]=\"false\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"leadingIcon\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\">\n <ng-content></ng-content>\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </div>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"] }]
497
590
  }], ctorParameters: function () {
498
- return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i1.Directionality, decorators: [{
591
+ return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
592
+ type: Inject,
593
+ args: [DOCUMENT]
594
+ }] }, { type: i2.Directionality, decorators: [{
499
595
  type: Optional
500
596
  }] }, { type: undefined, decorators: [{
501
597
  type: Optional
@@ -507,9 +603,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
507
603
  }, {
508
604
  type: Inject,
509
605
  args: [MAT_RIPPLE_GLOBAL_OPTIONS]
606
+ }] }, { type: undefined, decorators: [{
607
+ type: Attribute,
608
+ args: ['tabindex']
510
609
  }] }];
511
- }, propDecorators: { id: [{
610
+ }, propDecorators: { role: [{
512
611
  type: Input
612
+ }], id: [{
613
+ type: Input
614
+ }], ariaLabel: [{
615
+ type: Input,
616
+ args: ['aria-label']
513
617
  }], disabled: [{
514
618
  type: Input
515
619
  }], value: [{
@@ -518,12 +622,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
518
622
  type: Input
519
623
  }], highlighted: [{
520
624
  type: Input
521
- }], interaction: [{
625
+ }], removed: [{
522
626
  type: Output
523
627
  }], destroyed: [{
524
628
  type: Output
525
- }], removed: [{
526
- type: Output
527
629
  }], leadingIcon: [{
528
630
  type: ContentChild,
529
631
  args: [MAT_CHIP_AVATAR]
@@ -536,6 +638,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
536
638
  }], ripple: [{
537
639
  type: ViewChild,
538
640
  args: [MatRipple]
641
+ }], primaryAction: [{
642
+ type: ViewChild,
643
+ args: [MatChipAction]
539
644
  }] } });
540
645
 
541
646
  /**
@@ -591,16 +696,18 @@ class MatChipOption extends MatChip {
591
696
  }
592
697
  /** Whether the chip is selected. */
593
698
  get selected() {
594
- return this._chipFoundation.isSelected();
699
+ var _a;
700
+ return ((_a = this._pendingSelectedState) !== null && _a !== void 0 ? _a : this._chipFoundation.isActionSelected(MDCChipActionType.PRIMARY));
595
701
  }
596
702
  set selected(value) {
597
- if (!this.selectable) {
598
- return;
599
- }
600
- const coercedValue = coerceBooleanProperty(value);
601
- if (coercedValue != this._chipFoundation.isSelected()) {
602
- this._chipFoundation.setSelected(coerceBooleanProperty(value));
603
- this._dispatchSelectionChange();
703
+ if (this.selectable) {
704
+ const coercedValue = coerceBooleanProperty(value);
705
+ if (this._isInitialized) {
706
+ this._setSelectedState(coercedValue, false);
707
+ }
708
+ else {
709
+ this._pendingSelectedState = coercedValue;
710
+ }
604
711
  }
605
712
  }
606
713
  /** The ARIA selected applied to the chip. */
@@ -611,70 +718,45 @@ class MatChipOption extends MatChip {
611
718
  ? this.selected.toString()
612
719
  : null;
613
720
  }
614
- ngAfterContentInit() {
615
- super.ngAfterContentInit();
616
- if (this.selected && this.leadingIcon) {
617
- this.leadingIcon.setClass(deprecated.chipCssClasses.HIDDEN_LEADING_ICON, true);
721
+ ngOnInit() {
722
+ this.role = 'presentation';
723
+ }
724
+ ngAfterViewInit() {
725
+ super.ngAfterViewInit();
726
+ this._isInitialized = true;
727
+ if (this._pendingSelectedState != null) {
728
+ // Note that we want to clear the pending state before calling `_setSelectedState`, because
729
+ // we want it to read the actual selected state instead falling back to the pending one.
730
+ const selectedState = this._pendingSelectedState;
731
+ this._pendingSelectedState = undefined;
732
+ this._setSelectedState(selectedState, false);
618
733
  }
619
734
  }
620
735
  /** Selects the chip. */
621
736
  select() {
622
- if (!this.selectable) {
623
- return;
624
- }
625
- else if (!this.selected) {
626
- this._chipFoundation.setSelected(true);
627
- this._dispatchSelectionChange();
737
+ if (this.selectable) {
738
+ this._setSelectedState(true, false);
628
739
  }
629
740
  }
630
741
  /** Deselects the chip. */
631
742
  deselect() {
632
- if (!this.selectable) {
633
- return;
634
- }
635
- else if (this.selected) {
636
- this._chipFoundation.setSelected(false);
637
- this._dispatchSelectionChange();
743
+ if (this.selectable) {
744
+ this._setSelectedState(false, false);
638
745
  }
639
746
  }
640
747
  /** Selects this chip and emits userInputSelection event */
641
748
  selectViaInteraction() {
642
- if (!this.selectable) {
643
- return;
644
- }
645
- else if (!this.selected) {
646
- this._chipFoundation.setSelected(true);
647
- this._dispatchSelectionChange(true);
749
+ if (this.selectable) {
750
+ this._setSelectedState(true, true);
648
751
  }
649
752
  }
650
753
  /** Toggles the current selected state of this chip. */
651
754
  toggleSelected(isUserInput = false) {
652
- if (!this.selectable) {
653
- return this.selected;
755
+ if (this.selectable) {
756
+ this._setSelectedState(!this.selected, isUserInput);
654
757
  }
655
- this._chipFoundation.setSelected(!this.selected);
656
- this._dispatchSelectionChange(isUserInput);
657
758
  return this.selected;
658
759
  }
659
- /** Emits a selection change event. */
660
- _dispatchSelectionChange(isUserInput = false) {
661
- this.selectionChange.emit({
662
- source: this,
663
- isUserInput,
664
- selected: this.selected,
665
- });
666
- }
667
- /** Allows for programmatic focusing of the chip. */
668
- focus() {
669
- if (this.disabled) {
670
- return;
671
- }
672
- if (!this._hasFocus()) {
673
- this._elementRef.nativeElement.focus();
674
- this._onFocus.next({ chip: this });
675
- }
676
- this._hasFocusInternal = true;
677
- }
678
760
  /** Resets the state of the chip when it loses focus. */
679
761
  _blur() {
680
762
  // When animations are enabled, Angular may end up removing the chip from the DOM a little
@@ -688,55 +770,68 @@ class MatChipOption extends MatChip {
688
770
  });
689
771
  });
690
772
  }
691
- /** Handles click events on the chip. */
692
- _click(event) {
693
- if (this.disabled) {
694
- event.preventDefault();
695
- }
696
- else {
697
- this._handleInteraction(event);
698
- event.stopPropagation();
773
+ _onChipInteraction(event) {
774
+ const { trigger, source } = event.detail;
775
+ // Non-selection interactions should work the same as other chips.
776
+ if (source !== MDCChipActionType.PRIMARY ||
777
+ (trigger !== MDCChipActionInteractionTrigger.CLICK &&
778
+ trigger !== MDCChipActionInteractionTrigger.ENTER_KEY &&
779
+ trigger !== MDCChipActionInteractionTrigger.SPACEBAR_KEY)) {
780
+ super._onChipInteraction(event);
781
+ }
782
+ else if (this.selectable && !this.disabled) {
783
+ // Otherwise only let the event through if the chip is enabled and selectable.
784
+ this._chipFoundation.handleActionInteraction(event);
785
+ this.selectionChange.emit({
786
+ source: this,
787
+ isUserInput: true,
788
+ selected: this.selected,
789
+ });
699
790
  }
700
791
  }
701
- /** Handles custom key presses. */
702
- _keydown(event) {
703
- if (this.disabled) {
704
- return;
792
+ _hasLeadingGraphic() {
793
+ // The checkmark graphic is built in for multi-select chip lists.
794
+ return this.leadingIcon || (this._chipListMultiple && this.selectable);
795
+ }
796
+ _setSelectedState(isSelected, isUserInput) {
797
+ if (isSelected !== this.selected) {
798
+ this._chipFoundation.setActionSelected(MDCChipActionType.PRIMARY, isSelected);
799
+ this.selectionChange.emit({
800
+ source: this,
801
+ isUserInput,
802
+ selected: this.selected,
803
+ });
705
804
  }
706
- switch (event.keyCode) {
707
- case SPACE:
708
- this.toggleSelected(true);
709
- // Always prevent space from scrolling the page since the list has focus
710
- event.preventDefault();
711
- break;
712
- default:
713
- this._handleInteraction(event);
805
+ // MDC won't assign the selected class until the animation finishes, but that may not
806
+ // happen if animations are disabled. If we detect such a case, assign the class manually.
807
+ if (this._animationsDisabled) {
808
+ this._elementRef.nativeElement.classList.toggle(MDCChipCssClasses.SELECTED, isSelected);
714
809
  }
715
810
  }
716
811
  }
717
- MatChipOption.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipOption, deps: null, target: i0.ɵɵFactoryTarget.Component });
718
- MatChipOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipOption, selector: "mat-basic-chip-option, mat-chip-option", inputs: { color: "color", disableRipple: "disableRipple", tabIndex: "tabIndex", selectable: "selectable", selected: "selected" }, outputs: { selectionChange: "selectionChange" }, host: { attributes: { "role": "option" }, listeners: { "click": "_click($event)", "keydown": "_keydown($event)", "focus": "focus()", "blur": "_blur()" }, properties: { "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mat-mdc-chip-with-trailing-icon": "trailingIcon || removeIcon", "class.mat-mdc-chip-selected": "selected", "class.mat-mdc-chip-multiple": "_chipListMultiple", "id": "id", "tabIndex": "tabIndex", "attr.disabled": "disabled || null", "attr.aria-disabled": "disabled.toString()", "attr.aria-selected": "ariaSelected" }, classAttribute: "mat-mdc-focus-indicator mat-mdc-chip-option" }, providers: [{ provide: MatChip, useExisting: MatChipOption }], usesInheritance: true, ngImport: i0, template: "<span class=\"mdc-chip__ripple\"></span>\n\n<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n\n<ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n<div class=\"mdc-chip__checkmark\" *ngIf=\"_chipListMultiple\">\n <svg class=\"mdc-chip__checkmark-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n <path class=\"mdc-chip__checkmark-path\" fill=\"none\" stroke=\"black\"\n d=\"M1.73,12.91 8.1,19.28 22.79,4.59\"/>\n </svg>\n</div>\n<div class=\"mdc-chip__text\"><ng-content></ng-content></div>\n<ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], directives: [{ type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
719
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipOption, decorators: [{
812
+ MatChipOption.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipOption, deps: null, target: i0.ɵɵFactoryTarget.Component });
813
+ MatChipOption.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChipOption, selector: "mat-basic-chip-option, mat-chip-option", inputs: { color: "color", disableRipple: "disableRipple", tabIndex: "tabIndex", selectable: "selectable", selected: "selected" }, outputs: { selectionChange: "selectionChange" }, host: { properties: { "class.mat-mdc-chip-selected": "selected", "class.mat-mdc-chip-multiple": "_chipListMultiple", "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mdc-evolution-chip--selectable": "selectable", "class.mdc-evolution-chip--disabled": "disabled", "class.mdc-evolution-chip--with-trailing-action": "_hasTrailingIcon()", "class.mdc-evolution-chip--with-primary-graphic": "_hasLeadingGraphic()", "class.mdc-evolution-chip--with-primary-icon": "leadingIcon", "class.mdc-evolution-chip--with-avatar": "leadingIcon", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-with-trailing-icon": "_hasTrailingIcon()", "attr.tabindex": "null", "attr.aria-label": "null", "attr.role": "role", "id": "id" }, classAttribute: "mat-mdc-chip mat-mdc-chip-option mdc-evolution-chip mdc-evolution-chip--filter" }, providers: [{ provide: MatChip, useExisting: MatChipOption }], usesInheritance: true, ngImport: i0, template: "<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n<span class=\"mat-mdc-chip-focus-overlay\"></span>\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\">\n <button\n matChipAction\n [tabIndex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [attr.aria-selected]=\"ariaSelected\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"option\"\n (blur)=\"_blur()\"\n (focus)=\"focus()\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"_hasLeadingGraphic()\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n <span class=\"mdc-evolution-chip__checkmark\">\n <svg class=\"mdc-evolution-chip__checkmark-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n <path class=\"mdc-evolution-chip__checkmark-path\"\n fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n </svg>\n </span>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\">\n <ng-content></ng-content>\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </button>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"], directives: [{ type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: MatChipAction, selector: "[matChipAction]", inputs: ["disabled", "tabIndex", "isInteractive"] }, { type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
814
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipOption, decorators: [{
720
815
  type: Component,
721
816
  args: [{ selector: 'mat-basic-chip-option, mat-chip-option', inputs: ['color', 'disableRipple', 'tabIndex'], host: {
722
- 'role': 'option',
723
- 'class': 'mat-mdc-focus-indicator mat-mdc-chip-option',
724
- '[class.mat-mdc-chip-disabled]': 'disabled',
725
- '[class.mat-mdc-chip-highlighted]': 'highlighted',
726
- '[class.mat-mdc-chip-with-avatar]': 'leadingIcon',
727
- '[class.mat-mdc-chip-with-trailing-icon]': 'trailingIcon || removeIcon',
817
+ 'class': 'mat-mdc-chip mat-mdc-chip-option mdc-evolution-chip mdc-evolution-chip--filter',
728
818
  '[class.mat-mdc-chip-selected]': 'selected',
729
819
  '[class.mat-mdc-chip-multiple]': '_chipListMultiple',
820
+ '[class.mat-mdc-chip-disabled]': 'disabled',
821
+ '[class.mat-mdc-chip-with-avatar]': 'leadingIcon',
822
+ '[class.mdc-evolution-chip--selectable]': 'selectable',
823
+ '[class.mdc-evolution-chip--disabled]': 'disabled',
824
+ '[class.mdc-evolution-chip--with-trailing-action]': '_hasTrailingIcon()',
825
+ '[class.mdc-evolution-chip--with-primary-graphic]': '_hasLeadingGraphic()',
826
+ '[class.mdc-evolution-chip--with-primary-icon]': 'leadingIcon',
827
+ '[class.mdc-evolution-chip--with-avatar]': 'leadingIcon',
828
+ '[class.mat-mdc-chip-highlighted]': 'highlighted',
829
+ '[class.mat-mdc-chip-with-trailing-icon]': '_hasTrailingIcon()',
830
+ '[attr.tabindex]': 'null',
831
+ '[attr.aria-label]': 'null',
832
+ '[attr.role]': 'role',
730
833
  '[id]': 'id',
731
- '[tabIndex]': 'tabIndex',
732
- '[attr.disabled]': 'disabled || null',
733
- '[attr.aria-disabled]': 'disabled.toString()',
734
- '[attr.aria-selected]': 'ariaSelected',
735
- '(click)': '_click($event)',
736
- '(keydown)': '_keydown($event)',
737
- '(focus)': 'focus()',
738
- '(blur)': '_blur()',
739
- }, providers: [{ provide: MatChip, useExisting: MatChipOption }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span class=\"mdc-chip__ripple\"></span>\n\n<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n\n<ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n<div class=\"mdc-chip__checkmark\" *ngIf=\"_chipListMultiple\">\n <svg class=\"mdc-chip__checkmark-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n <path class=\"mdc-chip__checkmark-path\" fill=\"none\" stroke=\"black\"\n d=\"M1.73,12.91 8.1,19.28 22.79,4.59\"/>\n </svg>\n</div>\n<div class=\"mdc-chip__text\"><ng-content></ng-content></div>\n<ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
834
+ }, providers: [{ provide: MatChip, useExisting: MatChipOption }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n<span class=\"mat-mdc-chip-focus-overlay\"></span>\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\">\n <button\n matChipAction\n [tabIndex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [attr.aria-selected]=\"ariaSelected\"\n [attr.aria-label]=\"ariaLabel\"\n role=\"option\"\n (blur)=\"_blur()\"\n (focus)=\"focus()\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"_hasLeadingGraphic()\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n <span class=\"mdc-evolution-chip__checkmark\">\n <svg class=\"mdc-evolution-chip__checkmark-svg\" viewBox=\"-2 -3 30 30\" focusable=\"false\">\n <path class=\"mdc-evolution-chip__checkmark-path\"\n fill=\"none\" stroke=\"currentColor\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\n </svg>\n </span>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\">\n <ng-content></ng-content>\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </button>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"] }]
740
835
  }], propDecorators: { selectable: [{
741
836
  type: Input
742
837
  }], selected: [{
@@ -784,14 +879,14 @@ class MatChipEditInput {
784
879
  sel.addRange(range);
785
880
  }
786
881
  }
787
- MatChipEditInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipEditInput, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
788
- MatChipEditInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipEditInput, selector: "span[matChipEditInput]", host: { attributes: { "role": "textbox", "tabindex": "-1", "contenteditable": "true" }, classAttribute: "mdc-chip__primary-action mat-chip-edit-input" }, ngImport: i0 });
789
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipEditInput, decorators: [{
882
+ MatChipEditInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipEditInput, deps: [{ token: i0.ElementRef }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
883
+ MatChipEditInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipEditInput, selector: "span[matChipEditInput]", host: { attributes: { "role": "textbox", "tabindex": "-1", "contenteditable": "true" }, classAttribute: "mat-chip-edit-input" }, ngImport: i0 });
884
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipEditInput, decorators: [{
790
885
  type: Directive,
791
886
  args: [{
792
887
  selector: 'span[matChipEditInput]',
793
888
  host: {
794
- 'class': 'mdc-chip__primary-action mat-chip-edit-input',
889
+ 'class': 'mat-chip-edit-input',
795
890
  'role': 'textbox',
796
891
  'tabindex': '-1',
797
892
  'contenteditable': 'true',
@@ -809,121 +904,105 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
809
904
  * the matChipInputFor directive.
810
905
  */
811
906
  class MatChipRow extends MatChip {
812
- constructor(_document, changeDetectorRef, elementRef, ngZone, dir, animationMode, globalRippleOptions) {
813
- super(changeDetectorRef, elementRef, ngZone, dir, animationMode, globalRippleOptions);
814
- this._document = _document;
907
+ constructor(changeDetectorRef, elementRef, ngZone, focusMonitor, _document, dir, animationMode, globalRippleOptions, tabIndex) {
908
+ super(changeDetectorRef, elementRef, ngZone, focusMonitor, _document, dir, animationMode, globalRippleOptions, tabIndex);
815
909
  this.basicChipAttrName = 'mat-basic-chip-row';
816
910
  this.editable = false;
817
911
  /** Emitted when the chip is edited. */
818
912
  this.edited = new EventEmitter();
913
+ this._isEditing = false;
914
+ this.role = 'row';
819
915
  }
820
- ngAfterContentInit() {
821
- super.ngAfterContentInit();
822
- if (this.removeIcon) {
823
- // Defer setting the value in order to avoid the "Expression
824
- // has changed after it was checked" errors from Angular.
825
- setTimeout(() => {
826
- // removeIcon has tabIndex 0 for regular chips, but should only be focusable by
827
- // the GridFocusKeyManager for row chips.
828
- this.removeIcon.tabIndex = -1;
829
- });
830
- }
831
- }
832
- ngAfterViewInit() {
833
- super.ngAfterViewInit();
834
- this.cells = this.removeIcon
835
- ? [this.chipContent.nativeElement, this.removeIcon._elementRef.nativeElement]
836
- : [this.chipContent.nativeElement];
837
- }
838
- /**
839
- * Allows for programmatic focusing of the chip.
840
- * Sends focus to the first grid cell. The row chip element itself
841
- * is never focused.
842
- */
843
- focus() {
844
- if (this.disabled) {
845
- return;
846
- }
847
- if (!this._hasFocusInternal) {
848
- this._onFocus.next({ chip: this });
849
- }
850
- this.chipContent.nativeElement.focus();
916
+ _hasTrailingIcon() {
917
+ // The trailing icon is hidden while editing.
918
+ return !this._isEditing && super._hasTrailingIcon();
851
919
  }
852
920
  /**
853
921
  * Emits a blur event when one of the gridcells loses focus, unless focus moved
854
922
  * to the other gridcell.
855
923
  */
856
- _focusout(event) {
924
+ _focusout() {
857
925
  if (this._focusoutTimeout) {
858
926
  clearTimeout(this._focusoutTimeout);
859
927
  }
860
928
  // Wait to see if focus moves to the other gridcell
861
- this._focusoutTimeout = setTimeout(() => {
929
+ this._focusoutTimeout = window.setTimeout(() => {
930
+ if (this._isEditing) {
931
+ this._onEditFinish();
932
+ }
862
933
  this._hasFocusInternal = false;
863
934
  this._onBlur.next({ chip: this });
864
- this._handleInteraction(event);
865
935
  });
866
936
  }
867
937
  /** Records that the chip has focus when one of the gridcells is focused. */
868
- _focusin(event) {
938
+ _focusin() {
869
939
  if (this._focusoutTimeout) {
870
940
  clearTimeout(this._focusoutTimeout);
871
941
  this._focusoutTimeout = null;
872
942
  }
873
943
  this._hasFocusInternal = true;
874
- this._handleInteraction(event);
875
944
  }
876
945
  /** Sends focus to the first gridcell when the user clicks anywhere inside the chip. */
877
946
  _mousedown(event) {
878
- if (this._isEditing()) {
879
- return;
880
- }
881
- if (!this.disabled) {
882
- this.focus();
947
+ if (!this._isEditing) {
948
+ if (!this.disabled) {
949
+ this.focus();
950
+ }
951
+ event.preventDefault();
883
952
  }
884
- event.preventDefault();
885
- }
886
- _dblclick(event) {
887
- this._handleInteraction(event);
888
953
  }
889
954
  /** Handles custom key presses. */
890
955
  _keydown(event) {
891
956
  if (this.disabled) {
892
957
  return;
893
958
  }
894
- if (this._isEditing()) {
895
- this._handleInteraction(event);
896
- return;
897
- }
898
959
  switch (event.keyCode) {
960
+ case ENTER:
961
+ if (this._isEditing) {
962
+ event.preventDefault();
963
+ // Wrap in a timeout so the timing is consistent as when it is emitted in `focusout`.
964
+ setTimeout(() => this._onEditFinish());
965
+ }
966
+ else if (this.editable) {
967
+ this._startEditing();
968
+ }
969
+ break;
899
970
  case DELETE:
900
971
  case BACKSPACE:
901
- // Remove the focused chip
902
- this.remove();
903
- // Always prevent so page navigation does not occur
904
- event.preventDefault();
972
+ if (!this._isEditing) {
973
+ // Remove the focused chip
974
+ this.remove();
975
+ // Always prevent so page navigation does not occur
976
+ event.preventDefault();
977
+ }
905
978
  break;
906
- default:
907
- this._handleInteraction(event);
908
979
  }
909
980
  }
910
- _isEditing() {
911
- return this._chipFoundation.isEditing();
981
+ _doubleclick() {
982
+ if (!this.disabled && this.editable) {
983
+ this._startEditing();
984
+ }
912
985
  }
913
- _onEditStart() {
986
+ _startEditing() {
987
+ // The value depends on the DOM so we need to extract it before we flip the flag.
988
+ const value = this.value;
989
+ // Make the primary action non-interactive so that it doesn't
990
+ // navigate when the user presses the arrow keys while editing.
991
+ this.primaryAction.isInteractive = false;
992
+ this._isEditing = true;
914
993
  // Defer initializing the input so it has time to be added to the DOM.
915
- setTimeout(() => {
916
- this._getEditInput().initialize(this.value);
917
- });
994
+ setTimeout(() => this._getEditInput().initialize(value));
918
995
  }
919
996
  _onEditFinish() {
920
997
  // If the edit input is still focused or focus was returned to the body after it was destroyed,
921
998
  // return focus to the chip contents.
922
999
  if (this._document.activeElement === this._getEditInput().getNativeElement() ||
923
1000
  this._document.activeElement === this._document.body) {
924
- this.chipContent.nativeElement.focus();
1001
+ this.primaryAction.focus();
925
1002
  }
926
1003
  this.edited.emit({ chip: this, value: this._getEditInput().getValue() });
1004
+ this.primaryAction.isInteractive = true;
1005
+ this._isEditing = false;
927
1006
  }
928
1007
  /**
929
1008
  * Gets the projected chip edit input, or the default input if none is projected in. One of these
@@ -933,33 +1012,38 @@ class MatChipRow extends MatChip {
933
1012
  return this.contentEditInput || this.defaultEditInput;
934
1013
  }
935
1014
  }
936
- MatChipRow.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipRow, deps: [{ token: DOCUMENT }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.Directionality, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }], target: i0.ɵɵFactoryTarget.Component });
937
- MatChipRow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipRow, selector: "mat-chip-row, mat-basic-chip-row", inputs: { color: "color", disableRipple: "disableRipple", tabIndex: "tabIndex", editable: "editable" }, outputs: { edited: "edited" }, host: { attributes: { "role": "row" }, listeners: { "mousedown": "_mousedown($event)", "dblclick": "_dblclick($event)", "keydown": "_keydown($event)", "focusin": "_focusin($event)", "focusout": "_focusout($event)" }, properties: { "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mat-mdc-chip-with-trailing-icon": "trailingIcon || removeIcon", "class.mdc-chip--editable": "editable", "id": "id", "attr.disabled": "disabled || null", "attr.aria-disabled": "disabled.toString()", "tabIndex": "tabIndex" }, classAttribute: "mat-mdc-chip-row" }, providers: [{ provide: MatChip, useExisting: MatChipRow }], queries: [{ propertyName: "contentEditInput", first: true, predicate: MatChipEditInput, descendants: true }], viewQueries: [{ propertyName: "chipContent", first: true, predicate: ["chipContent"], descendants: true }, { propertyName: "defaultEditInput", first: true, predicate: MatChipEditInput, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!_isEditing()\">\n <span class=\"mdc-chip__ripple\"></span>\n\n <span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n</ng-container>\n\n<div class=\"mat-mdc-chip-content\">\n <div role=\"gridcell\">\n <div #chipContent tabindex=\"-1\"\n class=\"mat-mdc-chip-row-focusable-text-content mat-mdc-focus-indicator mdc-chip__primary-action\"\n [attr.role]=\"editable ? 'button' : null\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n <span class=\"mdc-chip__text\"><ng-content></ng-content></span>\n <ng-content select=\"mat-chip-trailing-icon,[matChipTrailingIcon]\"></ng-content>\n </div>\n </div>\n <div role=\"gridcell\" *ngIf=\"removeIcon\" class=\"mat-mdc-chip-remove-icon\">\n <ng-content select=\"[matChipRemove]\"></ng-content>\n </div>\n</div>\n\n<div *ngIf=\"_isEditing()\" role=\"gridcell\" class=\"mat-mdc-chip-edit-input-container\">\n <ng-content *ngIf=\"contentEditInput; else defaultMatChipEditInput\"\n select=\"[matChipEditInput]\"></ng-content>\n <ng-template #defaultMatChipEditInput>\n <span matChipEditInput></span>\n </ng-template>\n</div>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: MatChipEditInput, selector: "span[matChipEditInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
938
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipRow, decorators: [{
1015
+ MatChipRow.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipRow, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: i0.NgZone }, { token: i1.FocusMonitor }, { token: DOCUMENT }, { token: i2.Directionality, optional: true }, { token: ANIMATION_MODULE_TYPE, optional: true }, { token: MAT_RIPPLE_GLOBAL_OPTIONS, optional: true }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
1016
+ MatChipRow.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChipRow, selector: "mat-chip-row, mat-basic-chip-row", inputs: { color: "color", disableRipple: "disableRipple", tabIndex: "tabIndex", editable: "editable" }, outputs: { edited: "edited" }, host: { listeners: { "mousedown": "_mousedown($event)", "keydown": "_keydown($event)", "dblclick": "_doubleclick()", "focusin": "_focusin($event)", "focusout": "_focusout($event)" }, properties: { "class.mat-mdc-chip-with-avatar": "leadingIcon", "class.mat-mdc-chip-disabled": "disabled", "class.mat-mdc-chip-editing": "_isEditing", "class.mat-mdc-chip-editable": "editable", "class.mdc-evolution-chip--disabled": "disabled", "class.mdc-evolution-chip--with-trailing-action": "_hasTrailingIcon()", "class.mdc-evolution-chip--with-primary-graphic": "leadingIcon", "class.mdc-evolution-chip--with-primary-icon": "leadingIcon", "class.mdc-evolution-chip--with-avatar": "leadingIcon", "class.mat-mdc-chip-highlighted": "highlighted", "class.mat-mdc-chip-with-trailing-icon": "_hasTrailingIcon()", "id": "id", "attr.tabindex": "null", "attr.aria-label": "null", "attr.role": "role" }, classAttribute: "mat-mdc-chip mat-mdc-chip-row mdc-evolution-chip" }, providers: [{ provide: MatChip, useExisting: MatChipRow }], queries: [{ propertyName: "contentEditInput", first: true, predicate: MatChipEditInput, descendants: true }], viewQueries: [{ propertyName: "defaultEditInput", first: true, predicate: MatChipEditInput, descendants: true }], usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"!_isEditing\">\n <span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n <span class=\"mat-mdc-chip-focus-overlay\"></span>\n</ng-container>\n\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\" role=\"gridcell\">\n <button\n matChipAction\n [tabIndex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"leadingIcon\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\" [ngSwitch]=\"_isEditing\">\n <ng-container *ngSwitchCase=\"false\"><ng-content></ng-content></ng-container>\n\n <ng-container *ngSwitchCase=\"true\">\n <ng-content *ngIf=\"contentEditInput; else defaultMatChipEditInput\"\n select=\"[matChipEditInput]\"></ng-content>\n <ng-template #defaultMatChipEditInput><span matChipEditInput></span></ng-template>\n </ng-container>\n\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </button>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"], directives: [{ type: i3$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { type: MatChipAction, selector: "[matChipAction]", inputs: ["disabled", "tabIndex", "isInteractive"] }, { type: i3$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: MatChipEditInput, selector: "span[matChipEditInput]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1017
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipRow, decorators: [{
939
1018
  type: Component,
940
1019
  args: [{ selector: 'mat-chip-row, mat-basic-chip-row', inputs: ['color', 'disableRipple', 'tabIndex'], host: {
941
- 'role': 'row',
942
- 'class': 'mat-mdc-chip-row',
1020
+ 'class': 'mat-mdc-chip mat-mdc-chip-row mdc-evolution-chip',
1021
+ '[class.mat-mdc-chip-with-avatar]': 'leadingIcon',
943
1022
  '[class.mat-mdc-chip-disabled]': 'disabled',
1023
+ '[class.mat-mdc-chip-editing]': '_isEditing',
1024
+ '[class.mat-mdc-chip-editable]': 'editable',
1025
+ '[class.mdc-evolution-chip--disabled]': 'disabled',
1026
+ '[class.mdc-evolution-chip--with-trailing-action]': '_hasTrailingIcon()',
1027
+ '[class.mdc-evolution-chip--with-primary-graphic]': 'leadingIcon',
1028
+ '[class.mdc-evolution-chip--with-primary-icon]': 'leadingIcon',
1029
+ '[class.mdc-evolution-chip--with-avatar]': 'leadingIcon',
944
1030
  '[class.mat-mdc-chip-highlighted]': 'highlighted',
945
- '[class.mat-mdc-chip-with-avatar]': 'leadingIcon',
946
- '[class.mat-mdc-chip-with-trailing-icon]': 'trailingIcon || removeIcon',
947
- '[class.mdc-chip--editable]': 'editable',
1031
+ '[class.mat-mdc-chip-with-trailing-icon]': '_hasTrailingIcon()',
948
1032
  '[id]': 'id',
949
- '[attr.disabled]': 'disabled || null',
950
- '[attr.aria-disabled]': 'disabled.toString()',
951
- '[tabIndex]': 'tabIndex',
1033
+ '[attr.tabindex]': 'null',
1034
+ '[attr.aria-label]': 'null',
1035
+ '[attr.role]': 'role',
952
1036
  '(mousedown)': '_mousedown($event)',
953
- '(dblclick)': '_dblclick($event)',
954
1037
  '(keydown)': '_keydown($event)',
1038
+ '(dblclick)': '_doubleclick()',
955
1039
  '(focusin)': '_focusin($event)',
956
1040
  '(focusout)': '_focusout($event)',
957
- }, providers: [{ provide: MatChip, useExisting: MatChipRow }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!_isEditing()\">\n <span class=\"mdc-chip__ripple\"></span>\n\n <span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n</ng-container>\n\n<div class=\"mat-mdc-chip-content\">\n <div role=\"gridcell\">\n <div #chipContent tabindex=\"-1\"\n class=\"mat-mdc-chip-row-focusable-text-content mat-mdc-focus-indicator mdc-chip__primary-action\"\n [attr.role]=\"editable ? 'button' : null\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n <span class=\"mdc-chip__text\"><ng-content></ng-content></span>\n <ng-content select=\"mat-chip-trailing-icon,[matChipTrailingIcon]\"></ng-content>\n </div>\n </div>\n <div role=\"gridcell\" *ngIf=\"removeIcon\" class=\"mat-mdc-chip-remove-icon\">\n <ng-content select=\"[matChipRemove]\"></ng-content>\n </div>\n</div>\n\n<div *ngIf=\"_isEditing()\" role=\"gridcell\" class=\"mat-mdc-chip-edit-input-container\">\n <ng-content *ngIf=\"contentEditInput; else defaultMatChipEditInput\"\n select=\"[matChipEditInput]\"></ng-content>\n <ng-template #defaultMatChipEditInput>\n <span matChipEditInput></span>\n </ng-template>\n</div>\n", styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
1041
+ }, providers: [{ provide: MatChip, useExisting: MatChipRow }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-container *ngIf=\"!_isEditing\">\n <span matRipple class=\"mat-mdc-chip-ripple\"\n [matRippleDisabled]=\"_isRippleDisabled()\"\n [matRippleCentered]=\"_isRippleCentered\"\n [matRippleTrigger]=\"_elementRef.nativeElement\"></span>\n <span class=\"mat-mdc-chip-focus-overlay\"></span>\n</ng-container>\n\n\n<span class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--primary\" role=\"gridcell\">\n <button\n matChipAction\n [tabIndex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [attr.aria-label]=\"ariaLabel\">\n <span class=\"mdc-evolution-chip__graphic mat-mdc-chip-graphic\" *ngIf=\"leadingIcon\">\n <ng-content select=\"mat-chip-avatar, [matChipAvatar]\"></ng-content>\n </span>\n <span class=\"mdc-evolution-chip__text-label mat-mdc-chip-action-label\" [ngSwitch]=\"_isEditing\">\n <ng-container *ngSwitchCase=\"false\"><ng-content></ng-content></ng-container>\n\n <ng-container *ngSwitchCase=\"true\">\n <ng-content *ngIf=\"contentEditInput; else defaultMatChipEditInput\"\n select=\"[matChipEditInput]\"></ng-content>\n <ng-template #defaultMatChipEditInput><span matChipEditInput></span></ng-template>\n </ng-container>\n\n <span class=\"mat-mdc-chip-primary-focus-indicator mat-mdc-focus-indicator\"></span>\n </span>\n </button>\n</span>\n\n<span\n class=\"mdc-evolution-chip__cell mdc-evolution-chip__cell--trailing\"\n *ngIf=\"_hasTrailingIcon()\">\n <ng-content select=\"mat-chip-trailing-icon,[matChipRemove],[matChipTrailingIcon]\"></ng-content>\n</span>\n", styles: [".mdc-evolution-chip,.mdc-evolution-chip__cell,.mdc-evolution-chip__action{display:inline-flex;align-items:center}.mdc-evolution-chip{position:relative;max-width:100%}.mdc-evolution-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-evolution-chip__cell,.mdc-evolution-chip__action{height:100%}.mdc-evolution-chip__cell--primary{overflow-x:hidden}.mdc-evolution-chip__cell--trailing{flex:1 0 auto}.mdc-evolution-chip__action{align-items:center;background:none;border:none;box-sizing:content-box;cursor:pointer;display:inline-flex;justify-content:center;outline:none;padding:0;text-decoration:none}.mdc-evolution-chip__action--presentational{cursor:auto}.mdc-evolution-chip--disabled,.mdc-evolution-chip__action:disabled{pointer-events:none}.mdc-evolution-chip__action--primary{overflow-x:hidden}.mdc-evolution-chip__action--trailing{position:relative;overflow:visible}.mdc-evolution-chip__action--primary:before{box-sizing:border-box;content:\"\";height:100%;left:0;position:absolute;pointer-events:none;top:0;width:100%;z-index:1}.mdc-evolution-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-evolution-chip__action-touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-evolution-chip__text-label{white-space:nowrap;user-select:none;text-overflow:ellipsis;overflow:hidden}.mdc-evolution-chip__graphic{align-items:center;display:inline-flex;justify-content:center;overflow:hidden;pointer-events:none;position:relative;flex:1 0 auto}.mdc-evolution-chip__checkmark{position:absolute;opacity:0;top:50%;left:50%}.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--selected):not(.mdc-evolution-chip--with-primary-icon) .mdc-evolution-chip__graphic{width:0}.mdc-evolution-chip__checkmark-background{opacity:0}.mdc-evolution-chip__checkmark-svg{display:block}.mdc-evolution-chip__checkmark-path{stroke-width:2px;stroke-dasharray:29.7833385;stroke-dashoffset:29.7833385}.mdc-evolution-chip--selecting .mdc-evolution-chip__graphic{transition:width 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark{transition:transform 150ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--selecting .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 45ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__graphic{transition:width 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark{transition:opacity 50ms 0ms linear,transform 100ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-75%, -50%)}.mdc-evolution-chip--deselecting .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--selecting-with-primary-icon .mdc-evolution-chip__checkmark-path{transition:stroke-dashoffset 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__icon--primary{transition:opacity 150ms 75ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark{transition:opacity 75ms 0ms cubic-bezier(0.4, 0, 0.2, 1);transform:translate(-50%, -50%)}.mdc-evolution-chip--deselecting-with-primary-icon .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}.mdc-evolution-chip--selected .mdc-evolution-chip__icon--primary{opacity:0}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark{transform:translate(-50%, -50%);opacity:1}.mdc-evolution-chip--selected .mdc-evolution-chip__checkmark-path{stroke-dashoffset:0}@keyframes mdc-evolution-chip-enter{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-evolution-chip--enter{animation:mdc-evolution-chip-enter 100ms 0ms cubic-bezier(0, 0, 0.2, 1)}@keyframes mdc-evolution-chip-exit{from{opacity:1}to{opacity:0}}.mdc-evolution-chip--exit{animation:mdc-evolution-chip-exit 75ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip--hidden{opacity:0;pointer-events:none;transition:width 150ms 0ms cubic-bezier(0.4, 0, 1, 1)}.mdc-evolution-chip{height:32px;border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__ripple{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary:before{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{border-radius:16px}.mdc-evolution-chip .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:12px}[dir=rtl] .mdc-evolution-chip .mdc-evolution-chip__action--primary,.mdc-evolution-chip .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:12px;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:12px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:6px;padding-right:6px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:6px;padding-right:6px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:20px}.mdc-evolution-chip .mdc-evolution-chip__graphic{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--primary{height:20px;width:20px;font-size:20px}.mdc-evolution-chip .mdc-evolution-chip__checkmark{height:20px;width:20px}.mdc-evolution-chip .mdc-evolution-chip__icon--trailing{height:18px;width:18px;font-size:18px}.mdc-evolution-chip .mdc-evolution-chip__focus-ring{display:none}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + 4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--primary:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{z-index:1;display:block;pointer-events:none;border:2px solid transparent;border-radius:6px;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(\n 100% + 4px\n );width:calc(\n 100% + -4px\n )}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring{border-color:CanvasText}}.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{content:\"\";border:2px solid transparent;border-radius:8px;display:block;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);height:calc(100% + 4px);width:calc(100% + 4px)}@media screen and (forced-colors: active){.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational).mdc-ripple-upgraded--background-focused .mdc-evolution-chip__focus-ring::after,.mdc-evolution-chip .mdc-evolution-chip__action--trailing:not(.mdc-evolution-chip__action--presentational):not(.mdc-ripple-upgraded):focus .mdc-evolution-chip__focus-ring::after{border-color:CanvasText}}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary{padding-left:0;padding-right:12px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:12px;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic{padding-left:4px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__graphic[dir=rtl]{padding-left:8px;padding-right:4px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing{padding-left:8px;padding-right:8px}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--trailing[dir=rtl]{padding-left:8px;padding-right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing{left:8px;right:initial}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__ripple--trailing[dir=rtl]{left:initial;right:8px}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary{padding-left:0;padding-right:0}[dir=rtl] .mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary,.mdc-evolution-chip--with-avatar.mdc-evolution-chip--with-primary-graphic.mdc-evolution-chip--with-trailing-action .mdc-evolution-chip__action--primary[dir=rtl]{padding-left:0;padding-right:0}.mdc-evolution-chip--with-avatar.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__graphic{height:24px;width:24px;font-size:24px}.mdc-evolution-chip--with-avatar .mdc-evolution-chip__icon--primary{height:24px;width:24px;font-size:24px}.mat-mdc-standard-chip{border-radius:16px 16px 16px 16px;height:32px}.mat-mdc-standard-chip .mdc-evolution-chip__ripple{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-radius:16px 16px 16px 16px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{border-radius:14px 14px 14px 14px}.mat-mdc-standard-chip.mdc-evolution-chip--selectable:not(.mdc-evolution-chip--with-primary-icon){--mdc-chip-graphic-selected-width:28px}.mat-mdc-standard-chip .mdc-evolution-chip__graphic{height:28px;width:28px;font-size:28px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip.mdc-evolution-chip--selected .mdc-evolution-chip__action--primary:before{border-width:0}.mat-mdc-standard-chip:not(.mdc-evolution-chip--selected) .mdc-evolution-chip__action--primary:before{border-width:1px}.mat-mdc-standard-chip .mdc-evolution-chip__icon--primary{height:18px;width:18px;font-size:18px}.cdk-high-contrast-active .mat-mdc-standard-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-standard-chip.cdk-focused{outline:dotted 2px}.cdk-high-contrast-active .mat-mdc-standard-chip .mdc-evolution-chip__checkmark-path{stroke:#000 !important}.mat-mdc-standard-chip.mdc-evolution-chip--disabled{opacity:.4}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary,.mat-mdc-standard-chip .mdc-evolution-chip__action--primary,.mat-mdc-standard-chip .mat-mdc-chip-action-label{overflow:visible}.mat-mdc-standard-chip .mdc-evolution-chip__cell--primary{width:100%}.mat-mdc-standard-chip .mat-mdc-chip-graphic,.mat-mdc-standard-chip .mat-mdc-chip-trailing-icon{box-sizing:content-box}.mat-mdc-standard-chip._mat-animation-noopable,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__graphic,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark,.mat-mdc-standard-chip._mat-animation-noopable .mdc-evolution-chip__checkmark-path{transition-duration:1ms;animation-duration:1ms}.mat-mdc-chip-focus-overlay{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;opacity:0;border-radius:inherit;transition:opacity 150ms linear}._mat-animation-noopable .mat-mdc-chip-focus-overlay{transition:none}.mat-mdc-basic-chip .mat-mdc-chip-focus-overlay{display:none}.mat-mdc-chip:hover .mat-mdc-chip-focus-overlay{opacity:.04}.mat-mdc-chip.cdk-focused .mat-mdc-chip-focus-overlay{opacity:.12}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mat-mdc-chip-avatar{text-align:center;line-height:1}.mat-mdc-chip{position:relative}.mat-mdc-chip-action-label{text-align:left}[dir=rtl] .mat-mdc-chip-action-label{text-align:right}.mat-mdc-chip.mdc-evolution-chip--with-trailing-action .mat-mdc-chip-action-label{position:relative}.mat-mdc-chip-action-label .mat-mdc-chip-primary-focus-indicator{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit;box-sizing:content-box}.mat-mdc-chip-remove{opacity:.54}.mat-mdc-chip-remove:focus{opacity:1}.mat-chip-edit-input{cursor:text;display:inline-block;color:inherit;outline:0}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}\n"] }]
958
1042
  }], ctorParameters: function () {
959
- return [{ type: undefined, decorators: [{
1043
+ return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i1.FocusMonitor }, { type: undefined, decorators: [{
960
1044
  type: Inject,
961
1045
  args: [DOCUMENT]
962
- }] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: i0.NgZone }, { type: i1.Directionality, decorators: [{
1046
+ }] }, { type: i2.Directionality, decorators: [{
963
1047
  type: Optional
964
1048
  }] }, { type: undefined, decorators: [{
965
1049
  type: Optional
@@ -971,14 +1055,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
971
1055
  }, {
972
1056
  type: Inject,
973
1057
  args: [MAT_RIPPLE_GLOBAL_OPTIONS]
1058
+ }] }, { type: undefined, decorators: [{
1059
+ type: Attribute,
1060
+ args: ['tabindex']
974
1061
  }] }];
975
1062
  }, propDecorators: { editable: [{
976
1063
  type: Input
977
1064
  }], edited: [{
978
1065
  type: Output
979
- }], chipContent: [{
980
- type: ViewChild,
981
- args: ['chipContent']
982
1066
  }], defaultEditInput: [{
983
1067
  type: ViewChild,
984
1068
  args: [MatChipEditInput]
@@ -987,7 +1071,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
987
1071
  args: [MatChipEditInput]
988
1072
  }] } });
989
1073
 
990
- let uid = 0;
991
1074
  /**
992
1075
  * Boilerplate for applying mixins to MatChipSet.
993
1076
  * @docs-private
@@ -1002,11 +1085,12 @@ const _MatChipSetMixinBase = mixinTabIndex(MatChipSetBase);
1002
1085
  * Extended by MatChipListbox and MatChipGrid for different interaction patterns.
1003
1086
  */
1004
1087
  class MatChipSet extends _MatChipSetMixinBase {
1005
- constructor(_elementRef, _changeDetectorRef, _dir) {
1088
+ constructor(_liveAnnouncer, _document, _elementRef, _changeDetectorRef) {
1006
1089
  super(_elementRef);
1090
+ this._liveAnnouncer = _liveAnnouncer;
1091
+ this._document = _document;
1007
1092
  this._elementRef = _elementRef;
1008
1093
  this._changeDetectorRef = _changeDetectorRef;
1009
- this._dir = _dir;
1010
1094
  /**
1011
1095
  * When a chip is destroyed, we store the index of the destroyed chip until the chips
1012
1096
  * query list notifies about the update. This is necessary because we cannot determine an
@@ -1020,23 +1104,48 @@ class MatChipSet extends _MatChipSetMixinBase {
1020
1104
  * These methods are called by the chip set foundation.
1021
1105
  */
1022
1106
  this._chipSetAdapter = {
1023
- hasClass: className => this._hasMdcClass(className),
1024
- // No-op. We keep track of chips via ContentChildren, which will be updated when a chip is
1025
- // removed.
1026
- removeChipAtIndex: () => { },
1027
- // No-op for base chip set. MatChipListbox overrides the adapter to provide this method.
1028
- selectChipAtIndex: () => { },
1029
- getIndexOfChipById: (id) => this._chips.toArray().findIndex(chip => chip.id === id),
1030
- focusChipPrimaryActionAtIndex: () => { },
1031
- focusChipTrailingActionAtIndex: () => { },
1032
- removeFocusFromChipAtIndex: () => { },
1033
- isRTL: () => !!this._dir && this._dir.value === 'rtl',
1034
- getChipListCount: () => this._chips.length,
1035
- // TODO(mmalerba): Implement using LiveAnnouncer.
1036
- announceMessage: () => { },
1107
+ announceMessage: message => this._liveAnnouncer.announce(message),
1108
+ emitEvent: (eventName, eventDetail) => {
1109
+ emitCustomEvent(this._elementRef.nativeElement, this._document, eventName, eventDetail, true);
1110
+ },
1111
+ getAttribute: name => this._elementRef.nativeElement.getAttribute(name),
1112
+ getChipActionsAtIndex: index => { var _a; return ((_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.getActions()) || []; },
1113
+ getChipCount: () => this._chips.length,
1114
+ getChipIdAtIndex: index => { var _a; return ((_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.getElementID()) || ''; },
1115
+ getChipIndexById: id => {
1116
+ return this._chips.toArray().findIndex(chip => chip._getFoundation().getElementID() === id);
1117
+ },
1118
+ isChipFocusableAtIndex: (index, actionType) => {
1119
+ var _a;
1120
+ return ((_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.isActionFocusable(actionType)) || false;
1121
+ },
1122
+ isChipSelectableAtIndex: (index, actionType) => {
1123
+ var _a;
1124
+ return ((_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.isActionSelectable(actionType)) || false;
1125
+ },
1126
+ isChipSelectedAtIndex: (index, actionType) => {
1127
+ var _a;
1128
+ return ((_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.isActionSelected(actionType)) || false;
1129
+ },
1130
+ removeChipAtIndex: index => { var _a; return (_a = this._chips.toArray()[index]) === null || _a === void 0 ? void 0 : _a.remove(); },
1131
+ setChipFocusAtIndex: (index, action, behavior) => {
1132
+ var _a;
1133
+ (_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.setActionFocus(action, behavior);
1134
+ },
1135
+ setChipSelectedAtIndex: (index, actionType, isSelected) => {
1136
+ var _a;
1137
+ // Setting the trailing action as deselected ends up deselecting the entire chip.
1138
+ // This is working as expected, but it's not something we want so we only apply the
1139
+ // selected state to the primary chip.
1140
+ if (actionType === MDCChipActionType.PRIMARY) {
1141
+ (_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.setActionSelected(actionType, isSelected);
1142
+ }
1143
+ },
1144
+ startChipAnimationAtIndex: (index, animation) => {
1145
+ var _a;
1146
+ (_a = this._chipFoundation(index)) === null || _a === void 0 ? void 0 : _a.startAnimation(animation);
1147
+ },
1037
1148
  };
1038
- /** Uid of the chip set */
1039
- this._uid = `mat-mdc-chip-set-${uid++}`;
1040
1149
  /**
1041
1150
  * Map from class to whether the class is enabled.
1042
1151
  * Enabled classes are set on the MDC chip-set div.
@@ -1044,7 +1153,24 @@ class MatChipSet extends _MatChipSetMixinBase {
1044
1153
  this._mdcClasses = {};
1045
1154
  this._disabled = false;
1046
1155
  this._role = null;
1047
- this._chipSetFoundation = new deprecated.MDCChipSetFoundation(this._chipSetAdapter);
1156
+ this._handleChipAnimation = (event) => {
1157
+ this._chipSetFoundation.handleChipAnimation(event);
1158
+ };
1159
+ this._handleChipInteraction = (event) => {
1160
+ this._chipSetFoundation.handleChipInteraction(event);
1161
+ };
1162
+ this._handleChipNavigation = (event) => {
1163
+ this._chipSetFoundation.handleChipNavigation(event);
1164
+ };
1165
+ const element = _elementRef.nativeElement;
1166
+ this._chipSetFoundation = new MDCChipSetFoundation(this._chipSetAdapter);
1167
+ element.addEventListener(MDCChipEvents.ANIMATION, this._handleChipAnimation);
1168
+ element.addEventListener(MDCChipEvents.INTERACTION, this._handleChipInteraction);
1169
+ element.addEventListener(MDCChipEvents.NAVIGATION, this._handleChipNavigation);
1170
+ }
1171
+ /** Combined stream of all of the child chips' remove events. */
1172
+ get chipDestroyedChanges() {
1173
+ return this._getChipStream(chip => chip.destroyed);
1048
1174
  }
1049
1175
  /** Whether the chip set is disabled. */
1050
1176
  get disabled() {
@@ -1074,18 +1200,6 @@ class MatChipSet extends _MatChipSetMixinBase {
1074
1200
  get focused() {
1075
1201
  return this._hasFocusedChip();
1076
1202
  }
1077
- /** Combined stream of all of the child chips' remove events. */
1078
- get chipRemoveChanges() {
1079
- return merge(...this._chips.map(chip => chip.removed));
1080
- }
1081
- /** Combined stream of all of the child chips' remove events. */
1082
- get chipDestroyedChanges() {
1083
- return merge(...this._chips.map(chip => chip.destroyed));
1084
- }
1085
- /** Combined stream of all of the child chips' interaction events. */
1086
- get chipInteractionChanges() {
1087
- return merge(...this._chips.map(chip => chip.interaction));
1088
- }
1089
1203
  ngAfterViewInit() {
1090
1204
  this._chipSetFoundation.init();
1091
1205
  }
@@ -1098,11 +1212,23 @@ class MatChipSet extends _MatChipSetMixinBase {
1098
1212
  this._syncChipsState();
1099
1213
  });
1100
1214
  }
1101
- this._resetChips();
1215
+ });
1216
+ this.chipDestroyedChanges.pipe(takeUntil(this._destroyed)).subscribe((event) => {
1217
+ const chip = event.chip;
1218
+ const chipIndex = this._chips.toArray().indexOf(event.chip);
1219
+ // In case the chip that will be removed is currently focused, we temporarily store
1220
+ // the index in order to be able to determine an appropriate sibling chip that will
1221
+ // receive focus.
1222
+ if (this._isValidIndex(chipIndex) && chip._hasFocus()) {
1223
+ this._lastDestroyedChipIndex = chipIndex;
1224
+ }
1102
1225
  });
1103
1226
  }
1104
1227
  ngOnDestroy() {
1105
- this._dropSubscriptions();
1228
+ const element = this._elementRef.nativeElement;
1229
+ element.removeEventListener(MDCChipEvents.ANIMATION, this._handleChipAnimation);
1230
+ element.removeEventListener(MDCChipEvents.INTERACTION, this._handleChipInteraction);
1231
+ element.removeEventListener(MDCChipEvents.NAVIGATION, this._handleChipNavigation);
1106
1232
  this._destroyed.next();
1107
1233
  this._destroyed.complete();
1108
1234
  this._chipSetFoundation.destroy();
@@ -1120,71 +1246,6 @@ class MatChipSet extends _MatChipSetMixinBase {
1120
1246
  });
1121
1247
  }
1122
1248
  }
1123
- /** Sets whether the given CSS class should be applied to the MDC chip. */
1124
- _setMdcClass(cssClass, active) {
1125
- const classes = this._elementRef.nativeElement.classList;
1126
- active ? classes.add(cssClass) : classes.remove(cssClass);
1127
- this._changeDetectorRef.markForCheck();
1128
- }
1129
- /** Adapter method that returns true if the chip set has the given MDC class. */
1130
- _hasMdcClass(className) {
1131
- return this._elementRef.nativeElement.classList.contains(className);
1132
- }
1133
- /** Updates subscriptions to chip events. */
1134
- _resetChips() {
1135
- this._dropSubscriptions();
1136
- this._subscribeToChipEvents();
1137
- }
1138
- /** Subscribes to events on the child chips. */
1139
- _subscribeToChipEvents() {
1140
- this._listenToChipsRemove();
1141
- this._listenToChipsDestroyed();
1142
- this._listenToChipsInteraction();
1143
- }
1144
- /** Subscribes to chip removal events. */
1145
- _listenToChipsRemove() {
1146
- this._chipRemoveSubscription = this.chipRemoveChanges.subscribe((event) => {
1147
- this._chipSetFoundation.handleChipRemoval({
1148
- chipId: event.chip.id,
1149
- // TODO(mmalerba): Add removal message.
1150
- removedAnnouncement: null,
1151
- });
1152
- });
1153
- }
1154
- /** Subscribes to chip destroyed events. */
1155
- _listenToChipsDestroyed() {
1156
- this._chipDestroyedSubscription = this.chipDestroyedChanges.subscribe((event) => {
1157
- const chip = event.chip;
1158
- const chipIndex = this._chips.toArray().indexOf(event.chip);
1159
- // In case the chip that will be removed is currently focused, we temporarily store
1160
- // the index in order to be able to determine an appropriate sibling chip that will
1161
- // receive focus.
1162
- if (this._isValidIndex(chipIndex) && chip._hasFocus()) {
1163
- this._lastDestroyedChipIndex = chipIndex;
1164
- }
1165
- });
1166
- }
1167
- /** Subscribes to chip interaction events. */
1168
- _listenToChipsInteraction() {
1169
- this._chipInteractionSubscription = this.chipInteractionChanges.subscribe((id) => {
1170
- this._chipSetFoundation.handleChipInteraction({ chipId: id });
1171
- });
1172
- }
1173
- /** Unsubscribes from all chip events. */
1174
- _dropSubscriptions() {
1175
- if (this._chipRemoveSubscription) {
1176
- this._chipRemoveSubscription.unsubscribe();
1177
- this._chipRemoveSubscription = null;
1178
- }
1179
- if (this._chipInteractionSubscription) {
1180
- this._chipInteractionSubscription.unsubscribe();
1181
- this._chipInteractionSubscription = null;
1182
- }
1183
- if (this._chipDestroyedSubscription) {
1184
- this._chipDestroyedSubscription.unsubscribe();
1185
- this._chipDestroyedSubscription = null;
1186
- }
1187
- }
1188
1249
  /** Dummy method for subclasses to override. Base chip set cannot be focused. */
1189
1250
  focus() { }
1190
1251
  /**
@@ -1198,14 +1259,29 @@ class MatChipSet extends _MatChipSetMixinBase {
1198
1259
  }
1199
1260
  /** Checks whether an event comes from inside a chip element. */
1200
1261
  _originatesFromChip(event) {
1201
- return this._checkForClassInHierarchy(event, 'mdc-chip');
1262
+ return this._checkForClassInHierarchy(event, 'mdc-evolution-chip');
1263
+ }
1264
+ /**
1265
+ * Removes the `tabindex` from the chip grid and resets it back afterwards, allowing the
1266
+ * user to tab out of it. This prevents the grid from capturing focus and redirecting
1267
+ * it back to the first chip, creating a focus trap, if it user tries to tab away.
1268
+ */
1269
+ _allowFocusEscape() {
1270
+ const previousTabIndex = this.tabIndex;
1271
+ if (this.tabIndex !== -1) {
1272
+ this.tabIndex = -1;
1273
+ setTimeout(() => {
1274
+ this.tabIndex = previousTabIndex;
1275
+ this._changeDetectorRef.markForCheck();
1276
+ });
1277
+ }
1202
1278
  }
1203
1279
  /**
1204
- * Checks whether an event comes from inside a chip element in the editing
1205
- * state.
1280
+ * Gets a stream of events from all the chips within the set.
1281
+ * The stream will automatically incorporate any newly-added chips.
1206
1282
  */
1207
- _originatesFromEditingChip(event) {
1208
- return this._checkForClassInHierarchy(event, 'mdc-chip--editing');
1283
+ _getChipStream(mappingFunction) {
1284
+ return this._chips.changes.pipe(startWith(null), switchMap(() => merge(...this._chips.map(mappingFunction))));
1209
1285
  }
1210
1286
  _checkForClassInHierarchy(event, className) {
1211
1287
  let currentElement = event.target;
@@ -1218,22 +1294,34 @@ class MatChipSet extends _MatChipSetMixinBase {
1218
1294
  }
1219
1295
  return false;
1220
1296
  }
1297
+ _chipFoundation(index) {
1298
+ var _a;
1299
+ return (_a = this._chips.toArray()[index]) === null || _a === void 0 ? void 0 : _a._getFoundation();
1300
+ }
1221
1301
  }
1222
- MatChipSet.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipSet, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1223
- MatChipSet.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipSet, selector: "mat-chip-set", inputs: { disabled: "disabled", role: "role" }, host: { properties: { "attr.role": "role", "attr.aria-describedby": "_ariaDescribedby || null", "id": "_uid" }, classAttribute: "mat-mdc-chip-set mdc-chip-set" }, queries: [{ propertyName: "_chips", predicate: MatChip, descendants: true }], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1224
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipSet, decorators: [{
1302
+ MatChipSet.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipSet, deps: [{ token: i1.LiveAnnouncer }, { token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
1303
+ MatChipSet.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChipSet, selector: "mat-chip-set", inputs: { disabled: "disabled", role: "role" }, host: { properties: { "attr.role": "role", "attr.aria-describedby": "_ariaDescribedby || null" }, classAttribute: "mat-mdc-chip-set mdc-evolution-chip-set" }, queries: [{ propertyName: "_chips", predicate: MatChip, descendants: true }], usesInheritance: true, ngImport: i0, template: `
1304
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
1305
+ <ng-content></ng-content>
1306
+ </span>
1307
+ `, isInline: true, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1308
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipSet, decorators: [{
1225
1309
  type: Component,
1226
- args: [{ selector: 'mat-chip-set', template: '<ng-content></ng-content>', host: {
1227
- 'class': 'mat-mdc-chip-set mdc-chip-set',
1310
+ args: [{ selector: 'mat-chip-set', template: `
1311
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
1312
+ <ng-content></ng-content>
1313
+ </span>
1314
+ `, host: {
1315
+ 'class': 'mat-mdc-chip-set mdc-evolution-chip-set',
1228
1316
  '[attr.role]': 'role',
1229
1317
  // TODO: replace this binding with use of AriaDescriber
1230
1318
  '[attr.aria-describedby]': '_ariaDescribedby || null',
1231
- '[id]': '_uid',
1232
- }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
1319
+ }, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"] }]
1233
1320
  }], ctorParameters: function () {
1234
- return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.Directionality, decorators: [{
1235
- type: Optional
1236
- }] }];
1321
+ return [{ type: i1.LiveAnnouncer }, { type: undefined, decorators: [{
1322
+ type: Inject,
1323
+ args: [DOCUMENT]
1324
+ }] }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }];
1237
1325
  }, propDecorators: { disabled: [{
1238
1326
  type: Input
1239
1327
  }], role: [{
@@ -1280,8 +1368,8 @@ const MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR = {
1280
1368
  * Used with MatChipOption chips.
1281
1369
  */
1282
1370
  class MatChipListbox extends MatChipSet {
1283
- constructor(elementRef, changeDetectorRef, _dir) {
1284
- super(elementRef, changeDetectorRef, _dir);
1371
+ constructor() {
1372
+ super(...arguments);
1285
1373
  /**
1286
1374
  * Function when touched. Set as part of ControlValueAccessor implementation.
1287
1375
  * @docs-private
@@ -1300,14 +1388,9 @@ class MatChipListbox extends MatChipSet {
1300
1388
  this._required = false;
1301
1389
  /** Event emitted when the selected chip listbox value has been changed by the user. */
1302
1390
  this.change = new EventEmitter();
1303
- this._chipSetAdapter.selectChipAtIndex = (index, selected) => {
1304
- this._setSelected(index, selected);
1305
- };
1306
- // Reinitialize the foundation with our overridden adapter
1307
- this._chipSetFoundation = new deprecated.MDCChipSetFoundation(this._chipSetAdapter);
1308
- this._updateMdcSelectionClasses();
1309
1391
  }
1310
1392
  /** The ARIA role applied to the chip listbox. */
1393
+ // TODO: MDC uses `grid` here
1311
1394
  get role() {
1312
1395
  return this.empty ? null : 'listbox';
1313
1396
  }
@@ -1317,7 +1400,6 @@ class MatChipListbox extends MatChipSet {
1317
1400
  }
1318
1401
  set multiple(value) {
1319
1402
  this._multiple = coerceBooleanProperty(value);
1320
- this._updateMdcSelectionClasses();
1321
1403
  this._syncListboxProperties();
1322
1404
  }
1323
1405
  /** The array of selected chips inside the chip listbox. */
@@ -1336,7 +1418,6 @@ class MatChipListbox extends MatChipSet {
1336
1418
  }
1337
1419
  set selectable(value) {
1338
1420
  this._selectable = coerceBooleanProperty(value);
1339
- this._updateMdcSelectionClasses();
1340
1421
  this._syncListboxProperties();
1341
1422
  }
1342
1423
  /**
@@ -1360,15 +1441,15 @@ class MatChipListbox extends MatChipSet {
1360
1441
  }
1361
1442
  /** Combined stream of all of the child chips' selection change events. */
1362
1443
  get chipSelectionChanges() {
1363
- return merge(...this._chips.map(chip => chip.selectionChange));
1444
+ return this._getChipStream(chip => chip.selectionChange);
1364
1445
  }
1365
1446
  /** Combined stream of all of the child chips' focus events. */
1366
1447
  get chipFocusChanges() {
1367
- return merge(...this._chips.map(chip => chip._onFocus));
1448
+ return this._getChipStream(chip => chip._onFocus);
1368
1449
  }
1369
1450
  /** Combined stream of all of the child chips' blur events. */
1370
1451
  get chipBlurChanges() {
1371
- return merge(...this._chips.map(chip => chip._onBlur));
1452
+ return this._getChipStream(chip => chip._onBlur);
1372
1453
  }
1373
1454
  /** The value of the listbox, which is the combined value of the selected chips. */
1374
1455
  get value() {
@@ -1380,7 +1461,6 @@ class MatChipListbox extends MatChipSet {
1380
1461
  }
1381
1462
  ngAfterContentInit() {
1382
1463
  super.ngAfterContentInit();
1383
- this._initKeyManager();
1384
1464
  this._chips.changes.pipe(startWith(null), takeUntil(this._destroyed)).subscribe(() => {
1385
1465
  // Update listbox selectable/multiple properties on chips
1386
1466
  this._syncListboxProperties();
@@ -1389,6 +1469,12 @@ class MatChipListbox extends MatChipSet {
1389
1469
  // Check to see if we have a destroyed chip and need to refocus
1390
1470
  this._updateFocusForDestroyedChips();
1391
1471
  });
1472
+ this.chipBlurChanges.pipe(takeUntil(this._destroyed)).subscribe(() => this._blur());
1473
+ this.chipSelectionChanges.pipe(takeUntil(this._destroyed)).subscribe(event => {
1474
+ if (event.isUserInput) {
1475
+ this._propagateChanges();
1476
+ }
1477
+ });
1392
1478
  }
1393
1479
  /**
1394
1480
  * Focuses the first selected chip in this chip listbox, or the first non-disabled chip when there
@@ -1400,11 +1486,14 @@ class MatChipListbox extends MatChipSet {
1400
1486
  }
1401
1487
  const firstSelectedChip = this._getFirstSelectedChip();
1402
1488
  if (firstSelectedChip) {
1403
- const firstSelectedChipIndex = this._chips.toArray().indexOf(firstSelectedChip);
1404
- this._keyManager.setActiveItem(firstSelectedChipIndex);
1489
+ firstSelectedChip.focus();
1405
1490
  }
1406
1491
  else if (this._chips.length > 0) {
1407
- this._keyManager.setFirstItemActive();
1492
+ // MDC sets the tabindex directly on the DOM node when the user is navigating which means
1493
+ // that we may end up with a `0` value from a previous interaction. We reset it manually
1494
+ // here to ensure that the state is correct.
1495
+ this._chips.forEach(chip => chip.primaryAction._updateTabindex(-1));
1496
+ this._chips.first.primaryAction.focus();
1408
1497
  }
1409
1498
  }
1410
1499
  /**
@@ -1444,60 +1533,24 @@ class MatChipListbox extends MatChipSet {
1444
1533
  value.forEach(currentValue => this._selectValue(currentValue, isUserInput));
1445
1534
  }
1446
1535
  else {
1447
- const correspondingChip = this._selectValue(value, isUserInput);
1448
- // Shift focus to the active item. Note that we shouldn't do this in multiple
1449
- // mode, because we don't know what chip the user interacted with last.
1450
- if (correspondingChip) {
1451
- if (isUserInput) {
1452
- this._keyManager.setActiveItem(correspondingChip);
1453
- }
1454
- }
1455
- }
1456
- }
1457
- /** Selects or deselects a chip by id. */
1458
- _setSelected(index, selected) {
1459
- const chip = this._chips.toArray()[index];
1460
- if (chip && chip.selected != selected) {
1461
- chip.toggleSelected(true);
1536
+ this._selectValue(value, isUserInput);
1462
1537
  }
1463
1538
  }
1464
1539
  /** When blurred, marks the field as touched when focus moved outside the chip listbox. */
1465
1540
  _blur() {
1466
- if (this.disabled) {
1467
- return;
1468
- }
1469
- if (!this.focused) {
1470
- this._keyManager.setActiveItem(-1);
1471
- }
1472
- // Wait to see if focus moves to an indivdual chip.
1473
- setTimeout(() => {
1474
- if (!this.focused) {
1475
- this._propagateChanges();
1476
- this._markAsTouched();
1477
- }
1478
- });
1479
- }
1480
- /**
1481
- * Removes the `tabindex` from the chip listbox and resets it back afterwards, allowing the
1482
- * user to tab out of it. This prevents the listbox from capturing focus and redirecting
1483
- * it back to the first chip, creating a focus trap, if it user tries to tab away.
1484
- */
1485
- _allowFocusEscape() {
1486
- const previousTabIndex = this.tabIndex;
1487
- if (this.tabIndex !== -1) {
1488
- this.tabIndex = -1;
1541
+ if (!this.disabled) {
1542
+ // Wait to see if focus moves to an individual chip.
1489
1543
  setTimeout(() => {
1490
- this.tabIndex = previousTabIndex;
1491
- this._changeDetectorRef.markForCheck();
1544
+ if (!this.focused) {
1545
+ this._propagateChanges();
1546
+ this._markAsTouched();
1547
+ }
1492
1548
  });
1493
1549
  }
1494
1550
  }
1495
- /**
1496
- * Handles custom keyboard shortcuts, and passes other keyboard events to the keyboard manager.
1497
- */
1498
1551
  _keydown(event) {
1499
- if (this._originatesFromChip(event)) {
1500
- this._keyManager.onKeydown(event);
1552
+ if (event.keyCode === TAB) {
1553
+ super._allowFocusEscape();
1501
1554
  }
1502
1555
  }
1503
1556
  /** Marks the field as touched */
@@ -1506,13 +1559,13 @@ class MatChipListbox extends MatChipSet {
1506
1559
  this._changeDetectorRef.markForCheck();
1507
1560
  }
1508
1561
  /** Emits change event to set the model value. */
1509
- _propagateChanges(fallbackValue) {
1562
+ _propagateChanges() {
1510
1563
  let valueToEmit = null;
1511
1564
  if (Array.isArray(this.selected)) {
1512
1565
  valueToEmit = this.selected.map(chip => chip.value);
1513
1566
  }
1514
1567
  else {
1515
- valueToEmit = this.selected ? this.selected.value : fallbackValue;
1568
+ valueToEmit = this.selected ? this.selected.value : undefined;
1516
1569
  }
1517
1570
  this._value = valueToEmit;
1518
1571
  this.change.emit(new MatChipListboxChange(this, valueToEmit));
@@ -1526,9 +1579,9 @@ class MatChipListbox extends MatChipSet {
1526
1579
  setTimeout(() => {
1527
1580
  // Defer setting the value in order to avoid the "Expression
1528
1581
  // has changed after it was checked" errors from Angular.
1529
- this._chips.forEach(chip => {
1582
+ this._chips.forEach((chip, index) => {
1530
1583
  if (chip.selected) {
1531
- this._chipSetFoundation.select(chip.id);
1584
+ this._chipSetFoundation.setChipSelected(index, MDCChipActionType.PRIMARY, true);
1532
1585
  }
1533
1586
  });
1534
1587
  });
@@ -1571,27 +1624,6 @@ class MatChipListbox extends MatChipSet {
1571
1624
  });
1572
1625
  }
1573
1626
  }
1574
- /** Sets the mdc classes for single vs multi selection. */
1575
- _updateMdcSelectionClasses() {
1576
- this._setMdcClass('mdc-chip-set--filter', this.selectable && this.multiple);
1577
- this._setMdcClass('mdc-chip-set--choice', this.selectable && !this.multiple);
1578
- }
1579
- /** Initializes the key manager to manage focus. */
1580
- _initKeyManager() {
1581
- this._keyManager = new FocusKeyManager(this._chips)
1582
- .withWrap()
1583
- .withVerticalOrientation()
1584
- .withHomeAndEnd()
1585
- .withHorizontalOrientation(this._dir ? this._dir.value : 'ltr');
1586
- if (this._dir) {
1587
- this._dir.change
1588
- .pipe(takeUntil(this._destroyed))
1589
- .subscribe(dir => this._keyManager.withHorizontalOrientation(dir));
1590
- }
1591
- this._keyManager.tabOut.pipe(takeUntil(this._destroyed)).subscribe(() => {
1592
- this._allowFocusEscape();
1593
- });
1594
- }
1595
1627
  /** Returns the first selected chip in this listbox, or undefined if no chips are selected. */
1596
1628
  _getFirstSelectedChip() {
1597
1629
  if (Array.isArray(this.selected)) {
@@ -1601,57 +1633,6 @@ class MatChipListbox extends MatChipSet {
1601
1633
  return this.selected;
1602
1634
  }
1603
1635
  }
1604
- /** Unsubscribes from all chip events. */
1605
- _dropSubscriptions() {
1606
- super._dropSubscriptions();
1607
- if (this._chipSelectionSubscription) {
1608
- this._chipSelectionSubscription.unsubscribe();
1609
- this._chipSelectionSubscription = null;
1610
- }
1611
- if (this._chipBlurSubscription) {
1612
- this._chipBlurSubscription.unsubscribe();
1613
- this._chipBlurSubscription = null;
1614
- }
1615
- if (this._chipFocusSubscription) {
1616
- this._chipFocusSubscription.unsubscribe();
1617
- this._chipFocusSubscription = null;
1618
- }
1619
- }
1620
- /** Subscribes to events on the child chips. */
1621
- _subscribeToChipEvents() {
1622
- super._subscribeToChipEvents();
1623
- this._listenToChipsSelection();
1624
- this._listenToChipsFocus();
1625
- this._listenToChipsBlur();
1626
- }
1627
- /** Subscribes to chip focus events. */
1628
- _listenToChipsFocus() {
1629
- this._chipFocusSubscription = this.chipFocusChanges.subscribe((event) => {
1630
- let chipIndex = this._chips.toArray().indexOf(event.chip);
1631
- if (this._isValidIndex(chipIndex)) {
1632
- this._keyManager.updateActiveItem(chipIndex);
1633
- }
1634
- });
1635
- }
1636
- /** Subscribes to chip blur events. */
1637
- _listenToChipsBlur() {
1638
- this._chipBlurSubscription = this.chipBlurChanges.subscribe(() => {
1639
- this._blur();
1640
- });
1641
- }
1642
- /** Subscribes to selection changes in the option chips. */
1643
- _listenToChipsSelection() {
1644
- this._chipSelectionSubscription = this.chipSelectionChanges.subscribe((chipSelectionChange) => {
1645
- this._chipSetFoundation.handleChipSelection({
1646
- chipId: chipSelectionChange.source.id,
1647
- selected: chipSelectionChange.selected,
1648
- shouldIgnore: false,
1649
- });
1650
- if (chipSelectionChange.isUserInput) {
1651
- this._propagateChanges();
1652
- }
1653
- });
1654
- }
1655
1636
  /**
1656
1637
  * If the amount of chips changed, we need to update the
1657
1638
  * key manager state and focus the next closest chip.
@@ -1661,7 +1642,7 @@ class MatChipListbox extends MatChipSet {
1661
1642
  if (this._lastDestroyedChipIndex != null) {
1662
1643
  if (this._chips.length) {
1663
1644
  const newChipIndex = Math.min(this._lastDestroyedChipIndex, this._chips.length - 1);
1664
- this._keyManager.setActiveItem(newChipIndex);
1645
+ this._chips.toArray()[newChipIndex].focus();
1665
1646
  }
1666
1647
  else {
1667
1648
  this.focus();
@@ -1670,12 +1651,20 @@ class MatChipListbox extends MatChipSet {
1670
1651
  this._lastDestroyedChipIndex = null;
1671
1652
  }
1672
1653
  }
1673
- MatChipListbox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipListbox, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.Directionality, optional: true }], target: i0.ɵɵFactoryTarget.Component });
1674
- MatChipListbox.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipListbox, selector: "mat-chip-listbox", inputs: { tabIndex: "tabIndex", multiple: "multiple", ariaOrientation: ["aria-orientation", "ariaOrientation"], selectable: "selectable", compareWith: "compareWith", required: "required", value: "value" }, outputs: { change: "change" }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "attr.role": "role", "tabIndex": "empty ? -1 : tabIndex", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-required": "role ? required : null", "attr.aria-disabled": "disabled.toString()", "attr.aria-multiselectable": "multiple", "attr.aria-orientation": "ariaOrientation", "class.mat-mdc-chip-list-disabled": "disabled", "class.mat-mdc-chip-list-required": "required", "id": "_uid" }, classAttribute: "mat-mdc-chip-set mat-mdc-chip-listbox mdc-chip-set" }, providers: [MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR], queries: [{ propertyName: "_chips", predicate: MatChipOption, descendants: true }], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1675
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipListbox, decorators: [{
1654
+ MatChipListbox.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipListbox, deps: null, target: i0.ɵɵFactoryTarget.Component });
1655
+ MatChipListbox.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChipListbox, selector: "mat-chip-listbox", inputs: { tabIndex: "tabIndex", multiple: "multiple", ariaOrientation: ["aria-orientation", "ariaOrientation"], selectable: "selectable", compareWith: "compareWith", required: "required", value: "value" }, outputs: { change: "change" }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "attr.role": "role", "tabIndex": "empty ? -1 : tabIndex", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-required": "role ? required : null", "attr.aria-disabled": "disabled.toString()", "attr.aria-multiselectable": "multiple", "attr.aria-orientation": "ariaOrientation", "class.mat-mdc-chip-list-disabled": "disabled", "class.mat-mdc-chip-list-required": "required" }, classAttribute: "mdc-evolution-chip-set mat-mdc-chip-listbox" }, providers: [MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR], queries: [{ propertyName: "_chips", predicate: MatChipOption, descendants: true }], usesInheritance: true, ngImport: i0, template: `
1656
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
1657
+ <ng-content></ng-content>
1658
+ </span>
1659
+ `, isInline: true, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1660
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipListbox, decorators: [{
1676
1661
  type: Component,
1677
- args: [{ selector: 'mat-chip-listbox', template: '<ng-content></ng-content>', inputs: ['tabIndex'], host: {
1678
- 'class': 'mat-mdc-chip-set mat-mdc-chip-listbox mdc-chip-set',
1662
+ args: [{ selector: 'mat-chip-listbox', template: `
1663
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
1664
+ <ng-content></ng-content>
1665
+ </span>
1666
+ `, inputs: ['tabIndex'], host: {
1667
+ 'class': 'mdc-evolution-chip-set mat-mdc-chip-listbox',
1679
1668
  '[attr.role]': 'role',
1680
1669
  '[tabIndex]': 'empty ? -1 : tabIndex',
1681
1670
  // TODO: replace this binding with use of AriaDescriber
@@ -1689,13 +1678,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
1689
1678
  '(focus)': 'focus()',
1690
1679
  '(blur)': '_blur()',
1691
1680
  '(keydown)': '_keydown($event)',
1692
- '[id]': '_uid',
1693
- }, providers: [MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
1694
- }], ctorParameters: function () {
1695
- return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.Directionality, decorators: [{
1696
- type: Optional
1697
- }] }];
1698
- }, propDecorators: { multiple: [{
1681
+ }, providers: [MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"] }]
1682
+ }], propDecorators: { multiple: [{
1699
1683
  type: Input
1700
1684
  }], ariaOrientation: [{
1701
1685
  type: Input,
@@ -1726,234 +1710,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
1726
1710
  * Use of this source code is governed by an MIT-style license that can be
1727
1711
  * found in the LICENSE file at https://angular.io/license
1728
1712
  */
1729
- /** The keys handled by the GridKeyManager keydown method. */
1730
- const NAVIGATION_KEYS = [DOWN_ARROW, UP_ARROW, RIGHT_ARROW, LEFT_ARROW];
1731
- /**
1732
- * This class manages keyboard events for grids. If you pass it a query list
1733
- * of GridKeyManagerRow, it will set the active cell correctly when arrow events occur.
1734
- *
1735
- * GridKeyManager expects that rows may change dynamically, but the cells for a given row are
1736
- * static. It also expects that all rows have the same number of cells.
1737
- */
1738
- class GridKeyManager {
1739
- constructor(_rows) {
1740
- this._rows = _rows;
1741
- this._activeRowIndex = -1;
1742
- this._activeColumnIndex = -1;
1743
- this._activeRow = null;
1744
- this._activeCell = null;
1745
- this._dir = 'ltr';
1746
- this._homeAndEnd = false;
1747
- /** Stream that emits whenever the active cell of the grid manager changes. */
1748
- this.change = new Subject();
1749
- // We allow for the rows to be an array because, in some cases, the consumer may
1750
- // not have access to a QueryList of the rows they want to manage (e.g. when the
1751
- // rows aren't being collected via `ViewChildren` or `ContentChildren`).
1752
- if (_rows instanceof QueryList) {
1753
- _rows.changes.subscribe((newRows) => {
1754
- if (this._activeRow) {
1755
- const newIndex = newRows.toArray().indexOf(this._activeRow);
1756
- if (newIndex > -1 && newIndex !== this._activeRowIndex) {
1757
- this._activeRowIndex = newIndex;
1758
- }
1759
- }
1760
- });
1761
- }
1762
- }
1763
- /**
1764
- * Configures the directionality of the key manager's horizontal movement.
1765
- * @param direction Direction which is considered forward movement across a row.
1766
- *
1767
- * If withDirectionality is not set, the default is 'ltr'.
1768
- */
1769
- withDirectionality(direction) {
1770
- this._dir = direction;
1771
- return this;
1772
- }
1773
- setActiveCell(cell) {
1774
- const previousRowIndex = this._activeRowIndex;
1775
- const previousColumnIndex = this._activeColumnIndex;
1776
- this.updateActiveCell(cell);
1777
- if (this._activeRowIndex !== previousRowIndex ||
1778
- this._activeColumnIndex !== previousColumnIndex) {
1779
- this.change.next({ row: this._activeRowIndex, column: this._activeColumnIndex });
1780
- }
1781
- }
1782
- /**
1783
- * Configures the key manager to activate the first and last items
1784
- * respectively when the Home or End key is pressed.
1785
- * @param enabled Whether pressing the Home or End key activates the first/last item.
1786
- */
1787
- withHomeAndEnd(enabled = true) {
1788
- this._homeAndEnd = enabled;
1789
- return this;
1790
- }
1791
- /**
1792
- * Sets the active cell depending on the key event passed in.
1793
- * @param event Keyboard event to be used for determining which element should be active.
1794
- */
1795
- onKeydown(event) {
1796
- const keyCode = event.keyCode;
1797
- switch (keyCode) {
1798
- case DOWN_ARROW:
1799
- this.setNextRowActive();
1800
- break;
1801
- case UP_ARROW:
1802
- this.setPreviousRowActive();
1803
- break;
1804
- case RIGHT_ARROW:
1805
- this._dir === 'rtl' ? this.setPreviousColumnActive() : this.setNextColumnActive();
1806
- break;
1807
- case LEFT_ARROW:
1808
- this._dir === 'rtl' ? this.setNextColumnActive() : this.setPreviousColumnActive();
1809
- break;
1810
- case HOME:
1811
- if (this._homeAndEnd) {
1812
- this.setFirstCellActive();
1813
- break;
1814
- }
1815
- else {
1816
- return;
1817
- }
1818
- case END:
1819
- if (this._homeAndEnd) {
1820
- this.setLastCellActive();
1821
- break;
1822
- }
1823
- else {
1824
- return;
1825
- }
1826
- default:
1827
- // Note that we return here, in order to avoid preventing
1828
- // the default action of non-navigational keys.
1829
- return;
1830
- }
1831
- event.preventDefault();
1832
- }
1833
- /** Index of the currently active row. */
1834
- get activeRowIndex() {
1835
- return this._activeRowIndex;
1836
- }
1837
- /** Index of the currently active column. */
1838
- get activeColumnIndex() {
1839
- return this._activeColumnIndex;
1840
- }
1841
- /** The active cell. */
1842
- get activeCell() {
1843
- return this._activeCell;
1844
- }
1845
- /** Sets the active cell to the first cell in the grid. */
1846
- setFirstCellActive() {
1847
- this._setActiveCellByIndex(0, 0);
1848
- }
1849
- /** Sets the active cell to the last cell in the grid. */
1850
- setLastCellActive() {
1851
- const lastRowIndex = this._rows.length - 1;
1852
- const lastRow = this._getRowsArray()[lastRowIndex];
1853
- this._setActiveCellByIndex(lastRowIndex, lastRow.cells.length - 1);
1854
- }
1855
- /** Sets the active row to the next row in the grid. Active column is unchanged. */
1856
- setNextRowActive() {
1857
- this._activeRowIndex < 0 ? this.setFirstCellActive() : this._setActiveCellByDelta(1, 0);
1858
- }
1859
- /** Sets the active row to the previous row in the grid. Active column is unchanged. */
1860
- setPreviousRowActive() {
1861
- this._setActiveCellByDelta(-1, 0);
1862
- }
1863
- /**
1864
- * Sets the active column to the next column in the grid.
1865
- * Active row is unchanged, unless we reach the end of a row.
1866
- */
1867
- setNextColumnActive() {
1868
- this._activeRowIndex < 0 ? this.setFirstCellActive() : this._setActiveCellByDelta(0, 1);
1869
- }
1870
- /**
1871
- * Sets the active column to the previous column in the grid.
1872
- * Active row is unchanged, unless we reach the end of a row.
1873
- */
1874
- setPreviousColumnActive() {
1875
- this._setActiveCellByDelta(0, -1);
1876
- }
1877
- updateActiveCell(cell) {
1878
- const rowArray = this._getRowsArray();
1879
- if (typeof cell === 'object' &&
1880
- typeof cell.row === 'number' &&
1881
- typeof cell.column === 'number') {
1882
- this._activeRowIndex = cell.row;
1883
- this._activeColumnIndex = cell.column;
1884
- this._activeRow = rowArray[cell.row] || null;
1885
- this._activeCell = this._activeRow ? this._activeRow.cells[cell.column] || null : null;
1886
- }
1887
- else {
1888
- rowArray.forEach((row, rowIndex) => {
1889
- const columnIndex = row.cells.indexOf(cell);
1890
- if (columnIndex !== -1) {
1891
- this._activeRowIndex = rowIndex;
1892
- this._activeColumnIndex = columnIndex;
1893
- this._activeRow = row;
1894
- this._activeCell = row.cells[columnIndex];
1895
- }
1896
- });
1897
- }
1898
- }
1899
- /**
1900
- * This method sets the active cell, given the row and columns deltas
1901
- * between the currently active cell and the new active cell.
1902
- */
1903
- _setActiveCellByDelta(rowDelta, columnDelta) {
1904
- // If delta puts us past the last cell in a row, move to the first cell of the next row.
1905
- if (this._activeRow && this._activeColumnIndex + columnDelta >= this._activeRow.cells.length) {
1906
- this._setActiveCellByIndex(this._activeRowIndex + 1, 0);
1907
- // If delta puts us prior to the first cell in a row, move to the last cell of the previous row.
1908
- }
1909
- else if (this._activeColumnIndex + columnDelta < 0) {
1910
- const previousRowIndex = this._activeRowIndex - 1;
1911
- const previousRow = this._getRowsArray()[previousRowIndex];
1912
- if (previousRow) {
1913
- this._setActiveCellByIndex(previousRowIndex, previousRow.cells.length - 1);
1914
- }
1915
- }
1916
- else {
1917
- this._setActiveCellByIndex(this._activeRowIndex + rowDelta, this._activeColumnIndex + columnDelta);
1918
- }
1919
- }
1920
- /**
1921
- * Sets the active cell to the cell at the indices specified, if they are valid.
1922
- */
1923
- _setActiveCellByIndex(rowIndex, columnIndex) {
1924
- const rows = this._getRowsArray();
1925
- const targetRow = rows[rowIndex];
1926
- if (!targetRow || !targetRow.cells[columnIndex]) {
1927
- return;
1928
- }
1929
- this.setActiveCell({ row: rowIndex, column: columnIndex });
1930
- }
1931
- /** Returns the rows as an array. */
1932
- _getRowsArray() {
1933
- return this._rows instanceof QueryList ? this._rows.toArray() : this._rows;
1934
- }
1935
- }
1936
-
1937
- /**
1938
- * @license
1939
- * Copyright Google LLC All Rights Reserved.
1940
- *
1941
- * Use of this source code is governed by an MIT-style license that can be
1942
- * found in the LICENSE file at https://angular.io/license
1943
- */
1944
- /**
1945
- * A version of GridKeyManager where the cells are HTMLElements, and focus()
1946
- * is called on a cell when it becomes active.
1947
- */
1948
- class GridFocusKeyManager extends GridKeyManager {
1949
- setActiveCell(cell) {
1950
- super.setActiveCell(cell);
1951
- if (this.activeCell) {
1952
- this.activeCell.focus();
1953
- }
1954
- }
1955
- }
1956
-
1957
1713
  /** Change event object that is emitted when the chip grid value has changed. */
1958
1714
  class MatChipGridChange {
1959
1715
  constructor(
@@ -1970,10 +1726,10 @@ class MatChipGridChange {
1970
1726
  * @docs-private
1971
1727
  */
1972
1728
  class MatChipGridBase extends MatChipSet {
1973
- constructor(_elementRef, _changeDetectorRef, _dir, _defaultErrorStateMatcher, _parentForm, _parentFormGroup,
1729
+ constructor(liveAnnouncer, document, elementRef, changeDetectorRef, _defaultErrorStateMatcher, _parentForm, _parentFormGroup,
1974
1730
  /** @docs-private */
1975
1731
  ngControl) {
1976
- super(_elementRef, _changeDetectorRef, _dir);
1732
+ super(liveAnnouncer, document, elementRef, changeDetectorRef);
1977
1733
  this._defaultErrorStateMatcher = _defaultErrorStateMatcher;
1978
1734
  this._parentForm = _parentForm;
1979
1735
  this._parentFormGroup = _parentFormGroup;
@@ -1986,8 +1742,8 @@ const _MatChipGridMixinBase = mixinErrorState(MatChipGridBase);
1986
1742
  * the matChipInputFor directive.
1987
1743
  */
1988
1744
  class MatChipGrid extends _MatChipGridMixinBase {
1989
- constructor(_elementRef, _changeDetectorRef, _dir, _parentForm, _parentFormGroup, _defaultErrorStateMatcher, ngControl) {
1990
- super(_elementRef, _changeDetectorRef, _dir, _defaultErrorStateMatcher, _parentForm, _parentFormGroup, ngControl);
1745
+ constructor(liveAnnouncer, document, elementRef, changeDetectorRef, parentForm, parentFormGroup, defaultErrorStateMatcher, ngControl) {
1746
+ super(liveAnnouncer, document, elementRef, changeDetectorRef, defaultErrorStateMatcher, parentForm, parentFormGroup, ngControl);
1991
1747
  /**
1992
1748
  * Implemented as part of MatFormFieldControl.
1993
1749
  * @docs-private
@@ -2091,20 +1847,23 @@ class MatChipGrid extends _MatChipGridMixinBase {
2091
1847
  }
2092
1848
  /** Combined stream of all of the child chips' blur events. */
2093
1849
  get chipBlurChanges() {
2094
- return merge(...this._chips.map(chip => chip._onBlur));
1850
+ return this._getChipStream(chip => chip._onBlur);
2095
1851
  }
2096
1852
  /** Combined stream of all of the child chips' focus events. */
2097
1853
  get chipFocusChanges() {
2098
- return merge(...this._chips.map(chip => chip._onFocus));
1854
+ return this._getChipStream(chip => chip._onFocus);
2099
1855
  }
2100
1856
  ngAfterContentInit() {
2101
1857
  super.ngAfterContentInit();
2102
- this._initKeyManager();
2103
1858
  this._chips.changes.pipe(startWith(null), takeUntil(this._destroyed)).subscribe(() => {
2104
1859
  // Check to see if we have a destroyed chip and need to refocus
2105
1860
  this._updateFocusForDestroyedChips();
2106
1861
  this.stateChanges.next();
2107
1862
  });
1863
+ this.chipBlurChanges.pipe(takeUntil(this._destroyed)).subscribe(() => {
1864
+ this._blur();
1865
+ this.stateChanges.next();
1866
+ });
2108
1867
  }
2109
1868
  ngAfterViewInit() {
2110
1869
  super.ngAfterViewInit();
@@ -2127,14 +1886,13 @@ class MatChipGrid extends _MatChipGridMixinBase {
2127
1886
  /** Associates an HTML input element with this chip grid. */
2128
1887
  registerInput(inputElement) {
2129
1888
  this._chipInput = inputElement;
2130
- this._setMdcClass('mdc-chip-set--input', true);
2131
1889
  }
2132
1890
  /**
2133
1891
  * Implemented as part of MatFormFieldControl.
2134
1892
  * @docs-private
2135
1893
  */
2136
1894
  onContainerClick(event) {
2137
- if (!this._originatesFromChip(event) && !this.disabled) {
1895
+ if (!this.disabled && !this._originatesFromChip(event)) {
2138
1896
  this.focus();
2139
1897
  }
2140
1898
  }
@@ -2147,7 +1905,11 @@ class MatChipGrid extends _MatChipGridMixinBase {
2147
1905
  return;
2148
1906
  }
2149
1907
  if (this._chips.length > 0) {
2150
- this._keyManager.setFirstCellActive();
1908
+ // MDC sets the tabindex directly on the DOM node when the user is navigating which means
1909
+ // that we may end up with a `0` value from a previous interaction. We reset it manually
1910
+ // here to ensure that the state is correct.
1911
+ this._chips.forEach(chip => chip.primaryAction._updateTabindex(-1));
1912
+ this._chips.first.focus();
2151
1913
  }
2152
1914
  else {
2153
1915
  this._focusInput();
@@ -2202,7 +1964,6 @@ class MatChipGrid extends _MatChipGridMixinBase {
2202
1964
  // Timeout is needed to wait for the focus() event trigger on chip input.
2203
1965
  setTimeout(() => {
2204
1966
  if (!this.focused) {
2205
- this._keyManager.setActiveCell({ row: -1, column: -1 });
2206
1967
  this._propagateChanges();
2207
1968
  this._markAsTouched();
2208
1969
  }
@@ -2214,78 +1975,21 @@ class MatChipGrid extends _MatChipGridMixinBase {
2214
1975
  * it back to the first chip, creating a focus trap, if it user tries to tab away.
2215
1976
  */
2216
1977
  _allowFocusEscape() {
2217
- if (this._chipInput.focused) {
2218
- return;
2219
- }
2220
- const previousTabIndex = this.tabIndex;
2221
- if (this.tabIndex !== -1) {
2222
- this.tabIndex = -1;
2223
- setTimeout(() => {
2224
- this.tabIndex = previousTabIndex;
2225
- this._changeDetectorRef.markForCheck();
2226
- });
1978
+ if (!this._chipInput.focused) {
1979
+ super._allowFocusEscape();
2227
1980
  }
2228
1981
  }
2229
1982
  /** Handles custom keyboard events. */
2230
1983
  _keydown(event) {
2231
- const target = event.target;
2232
- const keyCode = event.keyCode;
2233
- const manager = this._keyManager;
2234
- if (keyCode === TAB && target.id !== this._chipInput.id) {
1984
+ if (event.keyCode === TAB && event.target.id !== this._chipInput.id) {
2235
1985
  this._allowFocusEscape();
2236
1986
  }
2237
- else if (this._originatesFromEditingChip(event)) {
2238
- // No-op, let the editing chip handle all keyboard events except for Tab.
2239
- }
2240
- else if (this._originatesFromChip(event)) {
2241
- manager.onKeydown(event);
2242
- }
2243
1987
  this.stateChanges.next();
2244
1988
  }
2245
- /** Unsubscribes from all chip events. */
2246
- _dropSubscriptions() {
2247
- super._dropSubscriptions();
2248
- if (this._chipBlurSubscription) {
2249
- this._chipBlurSubscription.unsubscribe();
2250
- this._chipBlurSubscription = null;
2251
- }
2252
- if (this._chipFocusSubscription) {
2253
- this._chipFocusSubscription.unsubscribe();
2254
- this._chipFocusSubscription = null;
2255
- }
2256
- }
2257
- /** Subscribes to events on the child chips. */
2258
- _subscribeToChipEvents() {
2259
- super._subscribeToChipEvents();
2260
- this._listenToChipsFocus();
2261
- this._listenToChipsBlur();
2262
- }
2263
- /** Initializes the key manager to manage focus. */
2264
- _initKeyManager() {
2265
- this._keyManager = new GridFocusKeyManager(this._chips)
2266
- .withHomeAndEnd()
2267
- .withDirectionality(this._dir ? this._dir.value : 'ltr');
2268
- if (this._dir) {
2269
- this._dir.change
2270
- .pipe(takeUntil(this._destroyed))
2271
- .subscribe(dir => this._keyManager.withDirectionality(dir));
2272
- }
2273
- }
2274
- /** Subscribes to chip focus events. */
2275
- _listenToChipsFocus() {
2276
- this._chipFocusSubscription = this.chipFocusChanges.subscribe((event) => {
2277
- let chipIndex = this._chips.toArray().indexOf(event.chip);
2278
- if (this._isValidIndex(chipIndex)) {
2279
- this._keyManager.updateActiveCell({ row: chipIndex, column: 0 });
2280
- }
2281
- });
2282
- }
2283
- /** Subscribes to chip blur events. */
2284
- _listenToChipsBlur() {
2285
- this._chipBlurSubscription = this.chipBlurChanges.subscribe(() => {
2286
- this._blur();
2287
- this.stateChanges.next();
2288
- });
1989
+ _focusLastChip() {
1990
+ if (this._chips.length) {
1991
+ this._chips.last.primaryAction.focus();
1992
+ }
2289
1993
  }
2290
1994
  /** Emits change event to set the model value. */
2291
1995
  _propagateChanges() {
@@ -2310,10 +2014,7 @@ class MatChipGrid extends _MatChipGridMixinBase {
2310
2014
  if (this._lastDestroyedChipIndex != null) {
2311
2015
  if (this._chips.length) {
2312
2016
  const newChipIndex = Math.min(this._lastDestroyedChipIndex, this._chips.length - 1);
2313
- this._keyManager.setActiveCell({
2314
- row: newChipIndex,
2315
- column: Math.max(this._keyManager.activeColumnIndex, 0),
2316
- });
2017
+ this._chips.toArray()[newChipIndex].focus();
2317
2018
  }
2318
2019
  else {
2319
2020
  this.focus();
@@ -2326,12 +2027,20 @@ class MatChipGrid extends _MatChipGridMixinBase {
2326
2027
  this._chipInput.focus();
2327
2028
  }
2328
2029
  }
2329
- MatChipGrid.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipGrid, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.Directionality, optional: true }, { token: i2$1.NgForm, optional: true }, { token: i2$1.FormGroupDirective, optional: true }, { token: i3.ErrorStateMatcher }, { token: i2$1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
2330
- MatChipGrid.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipGrid, selector: "mat-chip-grid", inputs: { tabIndex: "tabIndex", disabled: "disabled", placeholder: "placeholder", required: "required", value: "value", errorStateMatcher: "errorStateMatcher" }, outputs: { change: "change", valueChange: "valueChange" }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "attr.role": "role", "tabIndex": "_chips && _chips.length === 0 ? -1 : tabIndex", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "class.mat-mdc-chip-list-disabled": "disabled", "class.mat-mdc-chip-list-invalid": "errorState", "class.mat-mdc-chip-list-required": "required", "id": "_uid" }, classAttribute: "mat-mdc-chip-set mat-mdc-chip-grid mdc-chip-set" }, providers: [{ provide: MatFormFieldControl, useExisting: MatChipGrid }], queries: [{ propertyName: "_chips", predicate: MatChipRow, descendants: true }], usesInheritance: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2331
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipGrid, decorators: [{
2030
+ MatChipGrid.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipGrid, deps: [{ token: i1.LiveAnnouncer }, { token: DOCUMENT }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i2$1.NgForm, optional: true }, { token: i2$1.FormGroupDirective, optional: true }, { token: i3.ErrorStateMatcher }, { token: i2$1.NgControl, optional: true, self: true }], target: i0.ɵɵFactoryTarget.Component });
2031
+ MatChipGrid.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.1.0", type: MatChipGrid, selector: "mat-chip-grid", inputs: { tabIndex: "tabIndex", disabled: "disabled", placeholder: "placeholder", required: "required", value: "value", errorStateMatcher: "errorStateMatcher" }, outputs: { change: "change", valueChange: "valueChange" }, host: { listeners: { "focus": "focus()", "blur": "_blur()", "keydown": "_keydown($event)" }, properties: { "attr.role": "role", "tabIndex": "_chips && _chips.length === 0 ? -1 : tabIndex", "attr.aria-describedby": "_ariaDescribedby || null", "attr.aria-disabled": "disabled.toString()", "attr.aria-invalid": "errorState", "class.mat-mdc-chip-list-disabled": "disabled", "class.mat-mdc-chip-list-invalid": "errorState", "class.mat-mdc-chip-list-required": "required" }, classAttribute: "mat-mdc-chip-set mat-mdc-chip-grid mdc-evolution-chip-set" }, providers: [{ provide: MatFormFieldControl, useExisting: MatChipGrid }], queries: [{ propertyName: "_chips", predicate: MatChipRow, descendants: true }], usesInheritance: true, ngImport: i0, template: `
2032
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
2033
+ <ng-content></ng-content>
2034
+ </span>
2035
+ `, isInline: true, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
2036
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipGrid, decorators: [{
2332
2037
  type: Component,
2333
- args: [{ selector: 'mat-chip-grid', template: '<ng-content></ng-content>', inputs: ['tabIndex'], host: {
2334
- 'class': 'mat-mdc-chip-set mat-mdc-chip-grid mdc-chip-set',
2038
+ args: [{ selector: 'mat-chip-grid', template: `
2039
+ <span class="mdc-evolution-chip-set__chips" role="presentation">
2040
+ <ng-content></ng-content>
2041
+ </span>
2042
+ `, inputs: ['tabIndex'], host: {
2043
+ 'class': 'mat-mdc-chip-set mat-mdc-chip-grid mdc-evolution-chip-set',
2335
2044
  '[attr.role]': 'role',
2336
2045
  '[tabIndex]': '_chips && _chips.length === 0 ? -1 : tabIndex',
2337
2046
  // TODO: replace this binding with use of AriaDescriber
@@ -2344,12 +2053,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
2344
2053
  '(focus)': 'focus()',
2345
2054
  '(blur)': '_blur()',
2346
2055
  '(keydown)': '_keydown($event)',
2347
- '[id]': '_uid',
2348
- }, providers: [{ provide: MatFormFieldControl, useExisting: MatChipGrid }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-chip__icon.mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){width:20px;height:20px;font-size:20px}.mdc-deprecated-chip-trailing-action__icon{height:18px;width:18px;font-size:18px}.mdc-chip__icon.mdc-chip__icon--trailing{width:18px;height:18px;font-size:18px}.mdc-deprecated-chip-trailing-action{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-deprecated-chip-trailing-action,.mdc-deprecated-chip-trailing-action[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-chip__icon--trailing{margin-left:4px;margin-right:-4px}[dir=rtl] .mdc-chip__icon--trailing,.mdc-chip__icon--trailing[dir=rtl]{margin-left:-4px;margin-right:4px}.mdc-touch-target-wrapper{display:inline}.mdc-elevation-overlay{position:absolute;border-radius:inherit;pointer-events:none;opacity:0;opacity:var(--mdc-elevation-overlay-opacity, 0);transition:opacity 280ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip{border-radius:16px;height:32px;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0 12px;border-width:0;outline:none;cursor:pointer;-webkit-appearance:none}.mdc-chip .mdc-chip__ripple{border-radius:16px}.mdc-chip.mdc-chip--selected .mdc-chip__checkmark,.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden){margin-left:-4px;margin-right:4px}[dir=rtl] .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,[dir=rtl] .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden),.mdc-chip.mdc-chip--selected .mdc-chip__checkmark[dir=rtl],.mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden)[dir=rtl]{margin-left:4px;margin-right:-4px}.mdc-chip .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-chip::-moz-focus-inner{padding:0;border:0}.mdc-chip .mdc-chip__touch{position:absolute;top:50%;height:48px;left:0;right:0;transform:translateY(-50%)}.mdc-chip--exit{opacity:0}.mdc-chip__overflow{text-overflow:ellipsis;overflow:hidden}.mdc-chip__text{white-space:nowrap}.mdc-chip__icon{border-radius:50%;outline:none;vertical-align:middle}.mdc-chip__checkmark{height:20px}.mdc-chip__checkmark-path{transition:stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1);stroke-width:2px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-chip__primary-action:focus{outline:none}.mdc-chip--selected .mdc-chip__checkmark-path{stroke-dashoffset:0}.mdc-chip__icon--leading,.mdc-chip__icon--trailing{position:relative}.mdc-chip__checkmark-svg{width:0;height:20px;transition:width 150ms cubic-bezier(0.4, 0, 0.2, 1)}.mdc-chip--selected .mdc-chip__checkmark-svg{width:20px}.mdc-chip-set--filter .mdc-chip__icon--leading{transition:opacity 75ms linear;transition-delay:-50ms;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark{transition:opacity 75ms linear;transition-delay:80ms;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading+.mdc-chip__checkmark .mdc-chip__checkmark-svg{transition:width 0ms}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading{opacity:0}.mdc-chip-set--filter .mdc-chip--selected .mdc-chip__icon--leading+.mdc-chip__checkmark{width:0;opacity:1}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading{width:0;opacity:0}.mdc-chip-set--filter .mdc-chip__icon--leading-hidden.mdc-chip__icon--leading+.mdc-chip__checkmark{width:20px}@keyframes mdc-chip-entry{from{transform:scale(0.8);opacity:.4}to{transform:scale(1);opacity:1}}.mdc-chip-set{padding:4px;display:flex;flex-wrap:wrap;box-sizing:border-box}.mdc-chip-set .mdc-chip{margin:4px}.mdc-chip-set .mdc-chip--touch{margin-top:8px;margin-bottom:8px}.mdc-chip-set--input .mdc-chip{animation:mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1)}.mat-mdc-chip{cursor:default}.mat-mdc-chip._mat-animation-noopable{animation:none;transition:none}.mat-mdc-chip._mat-animation-noopable .mdc-chip__checkmark-svg{transition:none}.cdk-high-contrast-active .mat-mdc-chip{outline:solid 1px}.cdk-high-contrast-active .mat-mdc-chip:focus{outline:dotted 2px}.mat-mdc-chip-ripple{top:0;left:0;right:0;bottom:0;position:absolute;pointer-events:none;border-radius:inherit}.mdc-chip__ripple{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.mdc-chip__ripple::after,.mdc-chip__ripple::before{top:0;left:0;right:0;bottom:0;position:absolute;content:\"\";pointer-events:none;opacity:0;border-radius:inherit}._mat-animation-noopable .mdc-chip__ripple::after,._mat-animation-noopable .mdc-chip__ripple::before{transition:none}.mat-mdc-chip-disabled.mat-mdc-chip{opacity:.4}.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-trailing-icon,.mat-mdc-chip-disabled.mat-mdc-chip .mat-mdc-chip-row-focusable-text-content{pointer-events:none}.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::after,.mat-mdc-chip-disabled.mat-mdc-chip .mdc-chip__ripple::before{display:none}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px}.mat-mdc-chip-grid{margin:-4px}.mat-mdc-chip-grid input.mat-mdc-chip-input{margin:4px}._mat-animation-noopable .mdc-chip__checkmark-path{transition:none}.cdk-high-contrast-black-on-white .mdc-chip__checkmark-path{stroke:#000 !important}.mat-mdc-chip-row-focusable-text-content{position:relative}.mat-mdc-chip-remove{border:none;-webkit-appearance:none;-moz-appearance:none;padding:0;background:none}.mat-mdc-chip-remove .mat-icon{width:inherit;height:inherit;font-size:inherit}.cdk-high-contrast-active .mat-mdc-chip-selected:not(.mat-mdc-chip-multiple){outline-width:3px}.mat-mdc-chip-row-focusable-text-content,.mat-mdc-chip-remove-icon{display:flex;align-items:center}.mat-mdc-chip-content{display:inline-flex}.mdc-chip--editing{background-color:transparent;display:flex;flex-direction:column}.mdc-chip--editing .mat-mdc-chip-content{pointer-events:none;height:0;overflow:hidden}.mat-chip-edit-input{cursor:text;display:inline-block}.mat-mdc-chip-edit-input-container{width:100%;height:100%;display:flex;align-items:center}\n"] }]
2056
+ }, providers: [{ provide: MatFormFieldControl, useExisting: MatChipGrid }], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, styles: [".mdc-evolution-chip-set{display:flex}.mdc-evolution-chip-set:focus{outline:none}.mdc-evolution-chip-set__chips{display:flex;flex-flow:wrap;min-width:0}.mdc-evolution-chip-set--overflow .mdc-evolution-chip-set__chips{flex-flow:nowrap}.mdc-evolution-chip-set .mdc-evolution-chip-set__chips{margin-left:-8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip-set__chips,.mdc-evolution-chip-set .mdc-evolution-chip-set__chips[dir=rtl]{margin-left:0;margin-right:-8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-left:8px;margin-right:0}[dir=rtl] .mdc-evolution-chip-set .mdc-evolution-chip,.mdc-evolution-chip-set .mdc-evolution-chip[dir=rtl]{margin-left:0;margin-right:8px}.mdc-evolution-chip-set .mdc-evolution-chip{margin-top:4px;margin-bottom:4px}.mat-mdc-chip-set .mdc-evolution-chip-set__chips{min-width:100%}.mat-mdc-chip-set-stacked{flex-direction:column;align-items:flex-start}.mat-mdc-chip-set-stacked .mat-mdc-chip{width:100%}input.mat-mdc-chip-input{flex:1 0 150px;margin-left:8px}[dir=rtl] input.mat-mdc-chip-input{margin-left:0;margin-right:8px}\n"] }]
2349
2057
  }], ctorParameters: function () {
2350
- return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i1.Directionality, decorators: [{
2351
- type: Optional
2352
- }] }, { type: i2$1.NgForm, decorators: [{
2058
+ return [{ type: i1.LiveAnnouncer }, { type: undefined, decorators: [{
2059
+ type: Inject,
2060
+ args: [DOCUMENT]
2061
+ }] }, { type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: i2$1.NgForm, decorators: [{
2353
2062
  type: Optional
2354
2063
  }] }, { type: i2$1.FormGroupDirective, decorators: [{
2355
2064
  type: Optional
@@ -2362,8 +2071,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
2362
2071
  type: Input
2363
2072
  }], placeholder: [{
2364
2073
  type: Input
2365
- }, {
2366
- type: Input
2367
2074
  }], required: [{
2368
2075
  type: Input
2369
2076
  }], value: [{
@@ -2470,18 +2177,11 @@ class MatChipInput {
2470
2177
  /** Utility method to make host definition/tests more clear. */
2471
2178
  _keydown(event) {
2472
2179
  if (event) {
2473
- // Allow the user's focus to escape when they're tabbing forward. Note that we don't
2474
- // want to do this when going backwards, because focus should go back to the first chip.
2475
- if (event.keyCode === TAB && !hasModifierKey(event, 'shiftKey')) {
2476
- this._chipGrid._allowFocusEscape();
2477
- }
2478
2180
  // To prevent the user from accidentally deleting chips when pressing BACKSPACE continuously,
2479
2181
  // We focus the last chip on backspace only after the user has released the backspace button,
2480
2182
  // And the input is empty (see behaviour in _keyup)
2481
2183
  if (event.keyCode === BACKSPACE && this._focusLastChipOnBackspace) {
2482
- if (this._chipGrid._chips.length) {
2483
- this._chipGrid._keyManager.setLastCellActive();
2484
- }
2184
+ this._chipGrid._focusLastChip();
2485
2185
  event.preventDefault();
2486
2186
  return;
2487
2187
  }
@@ -2550,9 +2250,9 @@ class MatChipInput {
2550
2250
  return !hasModifierKey(event) && new Set(this.separatorKeyCodes).has(event.keyCode);
2551
2251
  }
2552
2252
  }
2553
- MatChipInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipInput, deps: [{ token: i0.ElementRef }, { token: MAT_CHIPS_DEFAULT_OPTIONS }, { token: MAT_FORM_FIELD, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
2554
- MatChipInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0-next.3", type: MatChipInput, selector: "input[matChipInputFor]", inputs: { chipGrid: ["matChipInputFor", "chipGrid"], addOnBlur: ["matChipInputAddOnBlur", "addOnBlur"], separatorKeyCodes: ["matChipInputSeparatorKeyCodes", "separatorKeyCodes"], placeholder: "placeholder", id: "id", disabled: "disabled" }, outputs: { chipEnd: "matChipInputTokenEnd" }, host: { listeners: { "keydown": "_keydown($event)", "keyup": "_keyup($event)", "blur": "_blur()", "focus": "_focus()", "input": "_onInput()" }, properties: { "id": "id", "attr.disabled": "disabled || null", "attr.placeholder": "placeholder || null", "attr.aria-invalid": "_chipGrid && _chipGrid.ngControl ? _chipGrid.ngControl.invalid : null", "attr.aria-required": "_chipGrid && _chipGrid.required || null", "attr.required": "_chipGrid && _chipGrid.required || null" }, classAttribute: "mat-mdc-chip-input mat-mdc-input-element mdc-text-field__input mat-input-element" }, exportAs: ["matChipInput", "matChipInputFor"], usesOnChanges: true, ngImport: i0 });
2555
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipInput, decorators: [{
2253
+ MatChipInput.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipInput, deps: [{ token: i0.ElementRef }, { token: MAT_CHIPS_DEFAULT_OPTIONS }, { token: MAT_FORM_FIELD, optional: true }], target: i0.ɵɵFactoryTarget.Directive });
2254
+ MatChipInput.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.1.0", type: MatChipInput, selector: "input[matChipInputFor]", inputs: { chipGrid: ["matChipInputFor", "chipGrid"], addOnBlur: ["matChipInputAddOnBlur", "addOnBlur"], separatorKeyCodes: ["matChipInputSeparatorKeyCodes", "separatorKeyCodes"], placeholder: "placeholder", id: "id", disabled: "disabled" }, outputs: { chipEnd: "matChipInputTokenEnd" }, host: { listeners: { "keydown": "_keydown($event)", "keyup": "_keyup($event)", "blur": "_blur()", "focus": "_focus()", "input": "_onInput()" }, properties: { "id": "id", "attr.disabled": "disabled || null", "attr.placeholder": "placeholder || null", "attr.aria-invalid": "_chipGrid && _chipGrid.ngControl ? _chipGrid.ngControl.invalid : null", "attr.aria-required": "_chipGrid && _chipGrid.required || null", "attr.required": "_chipGrid && _chipGrid.required || null" }, classAttribute: "mat-mdc-chip-input mat-mdc-input-element mdc-text-field__input mat-input-element" }, exportAs: ["matChipInput", "matChipInputFor"], usesOnChanges: true, ngImport: i0 });
2255
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipInput, decorators: [{
2556
2256
  type: Directive,
2557
2257
  args: [{
2558
2258
  selector: 'input[matChipInputFor]',
@@ -2615,7 +2315,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
2615
2315
  const CHIP_DECLARATIONS = [
2616
2316
  MatChip,
2617
2317
  MatChipAvatar,
2618
- MatChipCssInternalOnly,
2619
2318
  MatChipEditInput,
2620
2319
  MatChipGrid,
2621
2320
  MatChipInput,
@@ -2628,10 +2327,9 @@ const CHIP_DECLARATIONS = [
2628
2327
  ];
2629
2328
  class MatChipsModule {
2630
2329
  }
2631
- MatChipsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2632
- MatChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipsModule, declarations: [MatChip,
2330
+ MatChipsModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipsModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
2331
+ MatChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipsModule, declarations: [MatChipAction, MatChip,
2633
2332
  MatChipAvatar,
2634
- MatChipCssInternalOnly,
2635
2333
  MatChipEditInput,
2636
2334
  MatChipGrid,
2637
2335
  MatChipInput,
@@ -2642,7 +2340,6 @@ MatChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
2642
2340
  MatChipSet,
2643
2341
  MatChipTrailingIcon], imports: [MatCommonModule, CommonModule, MatRippleModule], exports: [MatCommonModule, MatChip,
2644
2342
  MatChipAvatar,
2645
- MatChipCssInternalOnly,
2646
2343
  MatChipEditInput,
2647
2344
  MatChipGrid,
2648
2345
  MatChipInput,
@@ -2652,7 +2349,7 @@ MatChipsModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version:
2652
2349
  MatChipRow,
2653
2350
  MatChipSet,
2654
2351
  MatChipTrailingIcon] });
2655
- MatChipsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipsModule, providers: [
2352
+ MatChipsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipsModule, providers: [
2656
2353
  ErrorStateMatcher,
2657
2354
  {
2658
2355
  provide: MAT_CHIPS_DEFAULT_OPTIONS,
@@ -2661,12 +2358,12 @@ MatChipsModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version:
2661
2358
  },
2662
2359
  },
2663
2360
  ], imports: [[MatCommonModule, CommonModule, MatRippleModule], MatCommonModule] });
2664
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3", ngImport: i0, type: MatChipsModule, decorators: [{
2361
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0", ngImport: i0, type: MatChipsModule, decorators: [{
2665
2362
  type: NgModule,
2666
2363
  args: [{
2667
2364
  imports: [MatCommonModule, CommonModule, MatRippleModule],
2668
2365
  exports: [MatCommonModule, CHIP_DECLARATIONS],
2669
- declarations: CHIP_DECLARATIONS,
2366
+ declarations: [MatChipAction, CHIP_DECLARATIONS],
2670
2367
  providers: [
2671
2368
  ErrorStateMatcher,
2672
2369
  {
@@ -2699,5 +2396,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.1.0-next.3",
2699
2396
  * Generated bundle index. Do not edit.
2700
2397
  */
2701
2398
 
2702
- export { MAT_CHIPS_DEFAULT_OPTIONS, MAT_CHIP_AVATAR, MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR, MAT_CHIP_REMOVE, MAT_CHIP_TRAILING_ICON, MatChip, MatChipAvatar, MatChipCssInternalOnly, MatChipEditInput, MatChipGrid, MatChipGridChange, MatChipInput, MatChipListbox, MatChipListboxChange, MatChipOption, MatChipRemove, MatChipRow, MatChipSelectionChange, MatChipSet, MatChipTrailingIcon, MatChipsModule };
2399
+ export { MAT_CHIPS_DEFAULT_OPTIONS, MAT_CHIP_AVATAR, MAT_CHIP_LISTBOX_CONTROL_VALUE_ACCESSOR, MAT_CHIP_REMOVE, MAT_CHIP_TRAILING_ICON, MatChip, MatChipAvatar, MatChipEditInput, MatChipGrid, MatChipGridChange, MatChipInput, MatChipListbox, MatChipListboxChange, MatChipOption, MatChipRemove, MatChipRow, MatChipSelectionChange, MatChipSet, MatChipTrailingIcon, MatChipsModule };
2703
2400
  //# sourceMappingURL=mdc-chips.mjs.map