Tags: viethien/components

Earlier this year, we changed the name of this repo to "angular/compo…

…nents" to emphasisze our goal

to provide more than only Material Design components. The 8.2.0 release includes one of the next new
features in that regard- a new package that wraps the
[YouTube Player API for iframe Embeds](https://developers.google.com/youtube/iframe_api_reference)
in an easy-to-use Angular component.

You can see the
[documentation on GitHub](https://github.com/angular/components/blob/master/src/youtube-player)
for the time being.

Big thanks to @YourDeveloperFriend for contributing this!

* **autocomplete:** unable to open panel via click inside shadow DOM ([angular#15616](angular#15616)) ([6e1fe2c](angular@6e1fe2c)), closes [angular#15606](angular#15606)
* **button:** fix typo in comment ([angular#17001](angular#17001)) ([5fb0d57](angular@5fb0d57))
* **card:** stroked buttons missing margin ([angular#16576](angular#16576)) ([399ed29](angular@399ed29)), closes [angular#16546](angular#16546)
* **chips:** allow null to be set as chip value ([angular#16950](angular#16950)) ([57998a2](angular@57998a2)), closes [angular#16844](angular#16844)
* **chips:** preselected chip not highlighted on init inside OnPush component ([angular#16868](angular#16868)) ([aad7ff7](angular@aad7ff7)), closes [angular#16841](angular#16841)
* **drag-drop:** connected drop zones not working inside shadow root ([angular#16899](angular#16899)) ([6009211](angular@6009211)), closes [angular#16898](angular#16898)
* **drag-drop:** drop list ref sorting disabled by default ([angular#16963](angular#16963)) ([306e07c](angular@306e07c)), closes [angular#16961](angular#16961)
* **drag-drop:** error if custom preview or placeholder node is not an element ([angular#16409](angular#16409)) ([8a4bed5](angular@8a4bed5))
* **drag-drop:** handle list and viewport auto scroll regions overlapping ([angular#16675](angular#16675)) ([792e886](angular@792e886)), closes [angular#16647](angular#16647)
* **drag-drop:** handle the element going out of the boundary after a viewport resize ([angular#16874](angular#16874)) ([44b8a47](angular@44b8a47)), closes [angular#16536](angular#16536)
* **drag-drop:** incorrectly constraining element position if size changes between drag sequences ([angular#16876](angular#16876)) ([cad0102](angular@cad0102)), closes [angular#15749](angular#15749)
* **drag-drop:** preview position relative to cursor thrown off if item has margin ([angular#16180](angular#16180)) ([46cf45f](angular@46cf45f)), closes [angular#16171](angular#16171)
* **drag-drop:** unable to drop into connected sibling that was scrolled into view ([angular#16681](angular#16681)) ([dd59044](angular@dd59044))
* **expansion:** show header focus state when expanded ([angular#16486](angular#16486)) ([7bf5e4e](angular@7bf5e4e))
* **icon:** not copying attributes from symbol nodes ([angular#16896](angular#16896)) ([425eb7e](angular@425eb7e)), closes [angular#16892](angular#16892)
* **icon:** use ErrorHandler to log MatIcon errors ([angular#16967](angular#16967)) ([dccddd9](angular@dccddd9))
* **icon:** use ErrorLogger to log http errors ([angular#16855](angular#16855)) ([75686e8](angular@75686e8))
* **menu:** keyboard controls not working if all items are disabled ([angular#16572](angular#16572)) ([d3f63a3](angular@d3f63a3)), closes [angular#16565](angular#16565)
* **menu:** restore focus immediately when menu is closed ([angular#16960](angular#16960)) ([bfa1853](angular@bfa1853)), closes [angular#16954](angular#16954)
* **paginator:** MatPaginatorIntl will now cause MatPaginator to display an 'EN DASH' (U+2013) rather than a 'HYPHEN-MINUS' (U+002D) by default
* **progress-spinner:** animation node inserted into wrong style root when using ngIf with ShadowDom encapsulation ([angular#16982](angular#16982)) ([dadb3e1](angular@dadb3e1))
* **radio:** clear aria attributes from host node ([angular#16938](angular#16938)) ([237e030](angular@237e030)), closes [angular#16913](angular#16913)
* **slider:** displayWith function never called with "null" ([angular#16707](angular#16707)) ([17c8983](angular@17c8983))
* **snack-bar:** don't stretch to fullscreen in landscape orientation ([angular#16940](angular#16940)) ([8d12902](angular@8d12902)), closes [angular#16911](angular#16911)
* **snack-bar:** too tall under some circumstances in Safari ([angular#16679](angular#16679)) ([e9baa09](angular@e9baa09)), closes [angular#16605](angular#16605)
* **tabs:** tab nav bar not highlighting active tab if rendered after init ([angular#16624](angular#16624)) ([93e9415](angular@93e9415)), closes [angular#16607](angular#16607)
* **tooltip:** avoid adding same aria description as trigger's aria-label ([angular#16870](angular#16870)) ([1006cc2](angular@1006cc2)), closes [angular#16719](angular#16719)

* **dialog:** allow for custom ComponentFactoryResolver to be passed in ([angular#16437](angular#16437)) ([565bd7d](angular@565bd7d)), closes [angular#16431](angular#16431)
* **dialog:** expose current dialog state ([angular#16691](angular#16691)) ([3f0268f](angular@3f0268f)), closes [angular#16636](angular#16636)
* **dialog:** don't override type attribute if set on mat-dialog-close ([angular#16927](angular#16927)) ([3ee3ecb](angular@3ee3ecb)), closes [angular#16909](angular#16909) [angular#16909](angular#16909)
* **form-field:** allow hideRequiredMarker default value to be configured through the `MAT_FORM_FIELD_DEFAULT_OPTIONS` ([angular#16244](angular#16244)) ([94c3fed](angular@94c3fed)), closes [angular#16243](angular#16243)
* **icon:** allow viewBox to be configured when registering icons ([angular#16320](angular#16320)) ([3638886](angular@3638886)), closes [angular#2981](angular#2981) [angular#16293](angular#16293)
* **moment-date-adapter:** implement strict mode ([angular#16462](angular#16462)) ([dd42956](angular@dd42956))
* **overlay:** allow width/height when using point as flexible origin ([angular#16739](angular#16739)) ([b98a3bd](angular@b98a3bd)), closes [angular#16160](angular#16160)
* **select:** allow for typeahead debounce interval to be customized ([angular#16579](angular#16579)) ([f23a56a](angular@f23a56a)), closes [angular#16472](angular#16472)
* **sort:** remove hammer dependency ([angular#16951](angular#16951)) ([7594ca1](angular@7594ca1))

* **button:** fix opacity is not added to ripple when using CSS varia…

…bles to define custom theme ([c62330b](angular@c62330b))

* **datepicker:** don't set aria-haspopup if no datepicker is set ([angular#15554](angular#15554)) ([f590dc6](angular@f590dc6))
* **dialog:** not applying margins to new button variants ([angular#11961](angular#11961)) ([0ad0d7a](angular@0ad0d7a))
* **expansion:** not adding margin for all button types ([angular#16806](angular#16806)) ([1d545a6](angular@1d545a6))
* **menu:** inconsistent behavior when clicking on a disabled item ([angular#16696](angular#16696)) ([e441a75](angular@e441a75)), closes [angular#16694](angular#16694)
* **menu:** mark lazy menu content as dirty before attach ([angular#16506](angular#16506)) ([1b54011](angular@1b54011))
* **overlay:** _updateElementSize should not fail if pane is disposed. ([angular#16600](angular#16600)) ([febcaff](angular@febcaff))
* **radio:** show ripple on programmatic focus ([angular#16512](angular#16512)) ([a243ef9](angular@a243ef9))
* **radio-button:** underlying input not respecting value binding ([e1760b6](angular@e1760b6))
* **schematics:** module imports not generated for schematics ([angular#16787](angular#16787)) ([2cfcd36](angular@2cfcd36))
* **schematics:** navigation schematic not respecting breakpoints on initial render ([angular#16788](angular#16788)) ([621ddf7](angular@621ddf7))
* **sidenav:** avoid CSS class name conflict ([angular#16798](angular#16798)) ([636cb9f](angular@636cb9f))
* **sidenav:** focus trap enabled state not updated if mode changes while open ([angular#16602](angular#16602)) ([666e9b3](angular@666e9b3)), closes [angular#16601](angular#16601)
* **slider:** inconsistent cursor behavior if user's pointer moves around while dragging ([d62b19e](angular@d62b19e)), closes [angular#14613](angular#14613)

* **cdk/virtual-scroll:** fix subpixel rounding errors on hdpi… ([ang…

…ular#16269](angular#16269)) ([5bbf9ba](angular@5bbf9ba))

* **cdk-experimental/popover-edit:** prevent default escape action ([angular#16747](angular#16747)) ([073b98c](angular@073b98c)), closes [angular#16202](angular#16202)

* **cdk-experimental/clipboard:** add cdk-experimental clipboard service + directive ([angular#16704](angular#16704)) ([6c51995](angular@6c51995))

* **bottom-sheet:** not moving focus to container if autoFocus is dis…

…abled and focus was moved while animating ([angular#16418](angular#16418)) ([0720a41](angular@0720a41)), closes [angular#16297](angular#16297) [angular#16221](angular#16221)

* **button-toggle:** error when check value is set via static attribute in Ivy ([angular#16587](angular#16587)) ([3c92c08](angular@3c92c08)), closes [angular#16471](angular#16471)
* **overlay:** clear duplicate overlay container coming in from the server ([angular#11940](angular#11940)) ([ba508a6](angular@ba508a6)), closes [angular#11817](angular#11817)
* **slide-toggle:** invalid required validator in template-driven forms ([angular#16547](angular#16547)) ([dc0c271](angular@dc0c271))
* **tabs:** only use aria-current on active links ([angular#16562](angular#16562)) ([b0937dc](angular@b0937dc)), closes [angular#16557](angular#16557)
* **tree:** unable to set zero as the padding of a tree node ([angular#16345](angular#16345)) ([bf66d81](angular@bf66d81)), closes [angular#16338](angular#16338)
* **typography:** use `calc` to allow css variables ([angular#16475](angular#16475)) ([6013036](angular@6013036))

* **form-field:** superfluous whitespace when compiled with bazel ([a…

…ngular#13911](angular#13911)) ([fdad49d](angular@fdad49d))

* **ng-update:** material update fails due to circular dependency ([angular#16538](angular#16538)) ([5d731d3](angular@5d731d3))

* The `MatNavTabBar` now support tab pagination, a long-requested fea…

…ture.

* `CdkDrag` now supports scrolling the viewport when an item is dragged near the edge.

* **card:** disable all animations when using NoopAnimationsModule ([angular#11538](angular#11538)) ([11a4ff0](angular@11a4ff0)), closes [angular#10590](angular#10590)
* **drag-drop:** fix drag start delay behavior to allow scrolling ([angular#16228](angular#16228)) ([738f10c](angular@738f10c)), closes [angular#16224](angular#16224)
* **drag-drop:** return up-to-date position if getFreeDragPosition is called while dragging ([angular#16464](angular#16464)) ([1540391](angular@1540391))
* **expansion:** incorrect margin for "before" indicator when expanded ([angular#16420](angular#16420)) ([98a231d](angular@98a231d))
* **menu:** keyboard controls not respecting DOM order when items are added at a later point ([angular#11720](angular#11720)) ([49e8c59](angular@49e8c59)), closes [angular#11652](angular#11652)
* **overlay:** incorrectly calculating position when page is scrolled horizontally and overlay is anchored to the right ([angular#16235](angular#16235)) ([f61730a](angular@f61730a)), closes [angular#16009](angular#16009)
* **overlay:** OverlayKeyboardDispatcher (used in dialog and overlay
    and available in the CDK) now listens on bubbling/propagation phase
    instead of capture phase. This means that overlay keydown handlers
    are now called after any applicable handlers inside of an overlay,
    and it respects any stopPropagation() calls from inside the overlay.

* **a11y:** allow for element to be used as message in AriaDescriber ([angular#16118](angular#16118)) ([8c4f25f](angular@8c4f25f)), closes [angular#16099](angular#16099)
* **common:** Add dev-mode sanity check for mismatched versions of cdk and material ([angular#15395](angular#15395)) ([ffad004](angular@ffad004))
* **drag-drop:** add support for automatic scrolling ([angular#16382](angular#16382)) ([207dba6](angular@207dba6)), closes [angular#13588](angular#13588)
* **expansion:** allow expansion toggle indicator positioning ([angular#16257](angular#16257)) ([c3eac17](angular@c3eac17))
* **radio:** add provider for default color input ([angular#15811](angular#15811)) ([5c51301](angular@5c51301))
* **schematics:** add font-display query ([angular#16363](angular#16363)) ([43a01e9](angular@43a01e9))
* **style:** allow palettes to specify a separate hue for colored text ([angular#15149](angular#15149)) ([15038e3](angular@15038e3)), closes [angular#15148](angular#15148)
* **tabs:** support pagination in nav bar ([angular#16055](angular#16055)) ([aa22368](angular@aa22368)), closes [angular#2177](angular#2177)

* **autocomplete:** alt + up arrow to close panel not working ([angul…

…ar#15364](angular#15364)) ([219ad33](angular@219ad33))

* **bottom-sheet:** DOM nodes not cleaned up if view container is destroyed mid-animation ([angular#16349](angular#16349)) ([f8d32fe](angular@f8d32fe)), closes [angular#16309](angular#16309)
* **breakpoint-observer:** fix the breakpoint observer emit count and accuracy ([angular#15964](angular#15964)) ([43b2df6](angular@43b2df6)), closes [angular#10925](angular#10925)
* **checkbox:** hover indication showing when disabled ([angular#16159](angular#16159)) ([bd52ce0](angular@bd52ce0)), closes [angular#16157](angular#16157)
* **chips:** disable all animations when using NoopAnimationsModule ([angular#11546](angular#11546)) ([7fc7da1](angular@7fc7da1)), closes [angular#10590](angular#10590)
* **datepicker:** align multi-year-view based on minDate and maxDate ([angular#16018](angular#16018)) ([400a95b](angular@400a95b)), closes [angular#10646](angular#10646)
* **dialog:** DOM nodes not cleaned up if view container is destroyed mid-animation ([angular#16309](angular#16309)) ([a9a266a](angular@a9a266a)), closes [angular#16284](angular#16284)
* **dialog:** don't move focus to dialog container if focus is already inside the dialog ([angular#16297](angular#16297)) ([62447be](angular@62447be))
* **dialog:** not moving focus to container if autoFocus is disabled and focus was moved from a different component ([angular#16221](angular#16221)) ([2669b90](angular@2669b90)), closes [angular#16215](angular#16215)
* **expansion-panel:** header animating on init when using non-default height ([angular#16122](angular#16122)) ([f58840c](angular@f58840c)), closes [angular#13088](angular#13088) [angular#16067](angular#16067)
* **list:** matching item not preselected if added after init ([angular#16080](angular#16080)) ([90b1d5d](angular@90b1d5d)), closes [angular#16062](angular#16062)
* **ng-update:** do not rely on node-glob for finding rule directories ([angular#16381](angular#16381)) ([6732be5](angular@6732be5)), closes [angular#16208](angular#16208)
* **overlay:** events not being unbound from destroyed backdrop ([angular#16268](angular#16268)) ([c0efe17](angular@c0efe17))
* **popover-edit:** remove fallthroughs in switch statement ([angular#16281](angular#16281)) ([14246de](angular@14246de))
* **tabs:** disable all animations when using NoopAnimationsModule ([angular#11395](angular#11395)) ([91326e9](angular@91326e9)), closes [angular#10590](angular#10590)

* **drag-drop:** use narrower check for touch events ([angular#16082](angular#16082)) ([b7aa763](angular@b7aa763))

* **drag-drop:** error if drag sequence is started while another one …

…is finishing ([angular#16081](angular#16081)) ([23df7aa](angular@23df7aa))

* **drag-n-drop:** ignore consecutive touchmove events on drag item on multitouch ([angular#15923](angular#15923)) ([208d43f](angular@208d43f))
* prevent default on escape key presses ([angular#16202](angular#16202)) ([0871d88](angular@0871d88))
* **ng-update:** fix table generator schematic ([angular#16204](angular#16204)) ([7386ea1](angular@7386ea1))
* **ng-update:** do not report form-field breaking change from v6 ([angular#16161](angular#16161)) ([7b78cb7](angular@7b78cb7)), closes [angular#16143](angular#16143)
* **ng-update:** parse cli workspace config as json5 ([angular#16218](angular#16218)) ([0fe2711](angular@0fe2711))
* **overlay:** stop using capture phase for overlay keyboard handling ([angular#16019](angular#16019)) ([67b3e5f](angular@67b3e5f)), closes [angular#9928](angular#9928)
* **popover-edit:** unable to change type of popover buttons ([angular#16058](angular#16058)) ([ba9fd14](angular@ba9fd14))
* **progress-spinner:** non-default diameter indeterminate animation not working inside Shadow DOM ([angular#16177](angular#16177)) ([e391869](angular@e391869))
* **scrolling:** virtual scroll throw off if directive injects ViewContainerRef ([angular#16137](angular#16137)) ([af56441](angular@af56441)), closes [angular#16130](angular#16130)
* **bottom-sheet:** allow for scroll strategy to be configured ([angular#15535](angular#15535)) ([4d0d080](angular@4d0d080)), closes [angular#15533](angular#15533)

* **popover-edit (experimental):** accessible row hover content ([angular#15917](angular#15917)) ([c979484](angular@c979484))
* **popover-edit (experimental):** Helper class to reduce form state preservation boilerplate ([angular#15939](angular#15939)) ([3bc6020](angular@3bc6020))

* **ng-update:** do not always use double quotes for generated import…

…s ([angular#16131](angular#16131)) ([a3856c7](angular@a3856c7)), closes [/github.com/microsoft/TypeScript/blob/6a559e37ee0d660fcc94f086a34370e79e94b17a/src/compiler/emitter.ts#L3796-L3797](https://github.com//github.com/microsoft/TypeScript/blob/6a559e37ee0d660fcc94f086a34370e79e94b17a/src/compiler/emitter.ts/issues/L3796-L3797) [angular#14532](angular#14532)

Importing directly from the root `@angular/material` entry-point is deprecated. You should instead
import from specific entry-points, e.g. `@angular/material/button`. This aligns with `@angular/cdk`,
makes clear where symbols originate, and helps safeguard against including unused code. The
deprecated style will be removed in Angular v9.

Angular CLI users can use `ng update @angular/material` to automatically migrate imports to the new
style.

* **tabs:** `_ngZone` and `_platform` parameters in `MatTabHeader` constructor are now required.
* **tabs:** `changeDetectorRef` parameter in `MatTabBody` constructor is now required.
* **expansion:** The `_document` and `_animationMode` parameters are now required.
* **list:** `_elementRef` parameter in `MatList` constructor is now required.
* **list:** `_changeDetectorRef` parameter in `MatListItem` constructor is now required. Also the order of constructor parameters has changed.
* **progress-spinner:** The `animationMode` mode parameter is now required in the `MatProgressSpinner` and `MatSpinner` constructors.
* **progress-spinner:** The `_elementRef` parameter has changed from `ElementRef<any>` to `ElementRef<HTMLElement>` in the `MatProgressSpinner` and `MatSpinner` constructors.
* **button:** `_platform` parameter has been removed from the `MatButton` constructor and the `_animationMode` is now required.
* **button:** `platform` parameter has been removed from the `MatAnchor` constructor and the `animationMode` is now required.
* **button**: The `disabled` hosting binding for `MatButton` has changed from a property to an attribute, which
affects any tests using `DebugElement.attributes`.
* **badge:** `_document` parameter has been removed and the `_renderer` parameter is now required in the `MatBadge` constructor.

* **badge:** throw proper error when set on a non-element node ([bdc6811

](angular@bdc6811))

* **button:** ripples not being clipped to border radius on safari ([angular#13645](angular#13645)) ([6643735](angular@6643735))
* **checkbox:** incorrect ripple color when unchecked ([angular#13569](angular#13569)) ([b4a9c62](angular@b4a9c62))
* **chips:** able to remove disabled chip via remove button ([angular#15732](angular#15732)) ([20a0930](angular@20a0930)), closes [angular#15708](angular#15708)
* **chips:** chip-list doesn't pick up wrapped chips with ivy ([7f12235](angular@7f12235))
* **datepicker:** use narrower value for aria-haspopup ([angular#15666](angular#15666)) ([0c62798](angular@0c62798))
* **ng-update:** type imports not migrated to secondary entry-points ([angular#16108](angular#16108)) ([dc51691](angular@dc51691))
* **popover-edit (experimental):** rework host listeners to account for changes in Ivy ([angular#16060](angular#16060)) ([558295b](angular@558295b))
* **popover-edit (experimental):** incorrect template root note retrieved in ivy ([5bf0487](angular@5bf0487))
* **schematics:** avoid lint warning in code generated by nav schematic ([angular#16088](angular#16088)) ([6c7fd30](angular@6c7fd30)), closes [angular#16085](angular#16085)
* **slide-toggle:** focus ripple not hiding after click/touch ([angular#13562](angular#13562)) ([917a52e](angular@917a52e)), closes [angular#13295](angular#13295)
* **table:** better error message if text column is missing a name ([254fb49](angular@254fb49))
* **table:** error in Ivy for coerced multiTemplateDataRows ([angular#16047](angular#16047)) ([5259f22](angular@5259f22)), closes [angular#16044](angular#16044)
* **table:** schematic generates code that throws an exception ([angular#15800](angular#15800)) ([301371a](angular@301371a)), closes [angular#15788](angular#15788)
* **table:** text-column throws if name input is set eagerly with ivy ([e774692](angular@e774692))