* In case a chip is selected and is solid colored, we need to make sure that the ripples have the proper color (similar to raised, flat and fab buttons)
If the consumer hasn't passed in a custom drag placeholder or preview, we clone the element that is being dragged. This can cause the DOM to have multiple elements with the same id.
Currently the only way to connect drop lists is via the `cdkDropListConnectedTo` input which works if the consumer knows the amount of drop lists that they're going to have. For dynamic lists they can pass a list of ids, however that can be a little boilerplate-y. These changes introduce the `cdkDropListGroup` directive which can be used to connect a dynamic list of drop containers automatically.
Fixes#13750.
With two commits (2adced10c8 and a22a9fa3d7), we recently tried to add a workaround for an Angular bug that causes Angular Material to not work w/ ES2015. The workaround technically worked but had to be partially reverted because Google Closure compiler was no longer able to remove unused classes (due to a function with side-effects that modified the actual component metadata). Since the workaround (in the state it is right now) is not helping at all and a fix will land with Angular `v7.1.0` (https://github.com/angular/angular/commit/95743e3a64b61a6223b7755d6c9931dcb245979f)
Closes#12760
Fixes the datepicker toggle not being focusable which prevents people from using the focus trap directives, and not forwarding focus to its underlying `button` element.
Currently if the user starts dragging from an element that has the native drag&drop (e.g. `img` tags have it by default), the CDK dragging won't work correctly. These changes add a `preventDefault` to work around it.
Seems to be a regression from #13957. Since the focus monitor still tracks focus, even though the element is disabled, the focus ripple will show up when clicking on a disabled toggle.
* Currently the Github robot is always pending on `master` because it looks like it couldn't load the artifacts from CircleCI. Based on the source code of the Robot, the artifact paths need to be in a specific path in order to be taken into account.
In c64503e0bf the logic that outputs the list of components was reworked to use `JSON.stringify`. As a result, the data that is generated has the `component` inside quotes, rather than a reference to the component class itself. This breaks the demo app. The following changes add some extra logic to remove the quotes around the `component`.
Currently when we announce a message, we leave the element in place, however this can cause the element to be read out again when the user continues navigating using the arrow keys. These changes add an API where the consumer can clear the element manually or after a duration. Doing this automatically is tricky, because we'd have to make a lot of assumptions that might not be correct in all cases or may break some screen readers. These are some alternatives that were considered:
* Removing the element from the a11y tree via `aria-hidden` after the screen reader has started announcing it. This works, but because of the politeness, we can't know exactly when the screen reader will announce the text, which could end up hiding it too early.
* Clearing the element on the next `keydown`/`click`/`focus`. This could be flaky and might end up interrupting the screen reader when it doesn't have to (e.g. clicking on a non-focusable element).
* Moving the element to a different place in the DOM (e.g. prepending it to the `body` instead of appending). This works, but we'd have to keep moving the element based on the focus direction.
Fixes#11991.
With https://github.com/angular/material2/commit/c3a8d0cab118cadf647954f610cb54df5cac6bf0, we already ensured that the text color is **inherited** in order to make sure that buttons without a background color are readable on various themed backgrounds (e.g. themed toolbars)
This is a follow-up that ensures that the ripple color for such transparent buttons is contrasting to the background color (e.g. in themed toolbars).
Fixes#13232
* Fixes that the checkbox does not have a focus indicator in high-contrast. Similarly to native checkboxes, the Material checkbox should have a dotted border/outline on keyboard focus.
Fixes#13227
The `CdkAriaLive` directive uses a `MutationObserver` to monitor for DOM content changes and to announce them through the `LiveAnnouncer`. Since the `MutationObserver` also fires for things like attribute changes, the same text can be announced more than once. This is visible on the calendar where the same text is announced twice when changing views.
* Skips handling arrow key events that have a modifier key. Previously we would prevent the default action which can get in the way of some of the native keyboard shortcuts (e.g. marking all of the text using shift + up arrow). This has come up before in #11987, however these changes expand it to the key manager.
* Adds an API that allows consumers to opt into having the key manager handle some modifier keys. This is an exception for some of our components where we have custom functionality for shift + arrow key.
* Fixes the `metaKey` always being set to true on our fake keyboard events.
Fixes#13496.
Prevents users from scrolling using the mouse wheel while an item is being dragged. This is a temporary measure until we have a solution to auto-scrolling while dragging, as well as to avoid having to measure the page for every pixel that the user has dragged.
Fixes#13508.
* Avoids timers overlapping in the `LiveAnnouncer`, which can happen if a new message is announced within 100ms of the previous one. This can be an issue if the screen reader started reading out the previous message and then gets interrupted by the new one.
* Avoids leftover timers if the service is destroyed.
* Fixes the reference to the `_liveElement` not being cleared after it's removed from the DOM, potentially leaving it in memory.
Since we only listen for events at the `document` level, the dragging sequence can get broken if the consumer stopped event propagation somewhere along the DOM tree. These changes switch to using event capturing in order to ensure that all the correct events fire.
In the form field guide, we instruct people to remove the `NG_VALUE_ACCESSOR` provider and replace it with injecting the `NgControl`, however it's not very explicit and is easy to miss. These changes expand the example a bit in an effort to make it harder to miss.
Fixes#8158.
Currently we normalize any values that aren't `ltr` or `rtl` to `ltr` in order to have a predictable value when using the directionality in components, however this ends up overwriting the consumer's value which might not necessarily be used by Angular (e.g. setting it to `auto`). These changes switch to preserving the attribute while normalizing the value for when it gets injected.
Fixes#13855.
Currently if the consumer sets the `cdkFocusInitial` group on a non-focusable element, nothing will happen. These changes add a warning if the app is running in dev mode.
Relates to #13953.
Adds the `dateClass` function which allows consumers to apply custom CSS classes to specific dates. This is useful for highlighting specific dates like a holiday.
Fixes#13943.
Fixes the button toggle host element not being able to receive focus which means that it can't be used with the focus trap directives. Also fixes that when it does receive focus, it won't forward it to the underlying `button` element.
Currently the `mat-slide-toggle` doesn't redirect focus to the underlying `input` element. This means that things like the focus trap's `cdkFocusInitial` won't work when they're set on the toggle host. These changes add a `tabindex` and set up a `focus` listener to forward focus to the input.
Relates to #13953.
Something I noticed while putting together an example for the `enterPredicate` a while ago. Currently we allow an item to be returned to its initial container, even if the initial container isn't connected to the new one, however we don't do the same for the `enterPredicate`. This means that the user can get into the situation where they drag an item out, but then they're not allowed to return it, which seems weird. These changes will ignore the `enterPredicate`, if an item is being returned to the initial container.
If the `ScrollDispatcher.register` method is called twice in a row, the consumer will end up with a subscription that can't be cleaned up. These changes add an extra check to prevent the same scrollable from being re-registered.
We initialize the `rootElement` in an `NgZone.onStable` callback, however if the zone doesn't stabilize before the `cdkDrag` is destroyed, we'll throw an error because there is no `rootElement`. These changes add an extra check to ensure that we don't throw.
Paul Gschwendtner