BREAKING CHANGE: `querySelector` for `[role]` and `[aria-*]` attributes may no longer work. See `@material/web/migrations/v2/README.md` and `@material/web/migrations/v2/query-selector-aria.ts`.
Browser/SR test results (go/mwc-double-aria-test-results)
- ✅ VoiceOver on Chrome
- ✅ VoiceOver on iOS Safari
- ✅ TalkBack on Chrome
- ✅ ChromeVox on Chrome
- ✅ NVDA on Chrome
- ✅ NVDA on Firefox
- ✅ JAWS on Chrome
- ✅ JAWS on Firefox
(Optional)
- ❓ VoiceOver on Safari
- ❓ VoiceOver on Firefox
PiperOrigin-RevId: 648859827
Fixes#5524
This fixes the new md-typescale file not being published. Our build assumes CSS-to-JS files end in "-styles".
This isn't a breaking change since the typescale classes haven't been published yet.
PiperOrigin-RevId: 617613456
We are changing the names of these files to reduce similarity with CSS modules and avoid clashing with tooling built around that. If you're importing `*/internal/styles.css.js`, swap to `*/internal/styles.js`.
PiperOrigin-RevId: 611265000
Fix for #5398 , when hydrating tabIndex on radios and tabs, it causes a DOMException. The proposed solution suggests moving the hasConstructed property and calling the updateTabIndex method in the connectedCallback to be able to modify the tabIndex as soon as the element is connected to the DOM
Adds `@material/web/tokens/internal/shape` to take a shape token and create 4 logical tokens from its value.
All components' logical shape tokens are now generated by the token files themselves, rather than added in each component's styles.
PiperOrigin-RevId: 601783846
Previously all text fields would focus themselves when the form reports validity, meaning the last one got focus. In reality, reportValidity is supposed to focus the first invalid control.
I added a "call" method wrapper around the `onReportValidity` callback that handles focusing logic.
PiperOrigin-RevId: 597904790
The bug: given a form with two required text fields,
1. Try to submit the form, both fields show error.
2. Add a value to the first field.
3. Try to submit the form, the first field does not remove its error.
This is fixed by listening to form submits and clearing the error state if the control is valid.
I refactored `injectFormReportValidityHooks()` into `addFormReportValidListener()` to keep the `OnReportValidity` class cleaner and better identify the problem we're trying to solve.
PiperOrigin-RevId: 597664564
Fixes#4998
This also fixes an error being thrown in text field's validator when minlength/maxlength change to out of bounds if they're not set in the correct order.
PiperOrigin-RevId: 594013553
There is out-of-sync state when lit's built-in accessor tries to reflect attributes alongside the getter and setter. Instead, the properties just read from attributes and requestUpdate is called when those attributes change.
PiperOrigin-RevId: 590710159
Cards often have content that extends to the bounds of the card. Instead of adding default padding that must be removed, cards' content should add their own padding as needed.
This makes adding full-width media and dividers easier.
Also moved background z-indices to -1 since the slot doesn't have a display and the z-index wasn't doing anything.
PiperOrigin-RevId: 587883362
On construction, setting `tabIndex = 0` should hydrate a tabindex attribute. This behavior was lost since we overrode `Element.prototype.tabIndex`. This change keeps the platform getter/setter behavior and calls requestUpdate another way.
PiperOrigin-RevId: 586738747
This is needed specifically for text fields. There appears to be an odd Chrome/Safari issue where an element that `delegatesFocus: true` to an inner `<input>` MUST provide that input as the validity anchor. Otherwise, when a form submits or calls `form.reportValidity()`, an error will be thrown.
See https://lit.dev/playground/#gist=6c26e418e0010f7a5aac15005cde8bde for a reproduction.
Unfortunately I couldn't programmatically trigger this behavior in a jasmine test.
PiperOrigin-RevId: 586723140
This reduces the copy/paste of validation code. Constraint validation must be synchronous, so a `Validator` helps compute the validity and cache it since the validity must be checked when properties change.
Implemented in checkbox-like controls.
PiperOrigin-RevId: 584380464
Part of adding constraint validation mixins. Each component that participates in constraint validation has different rules and error messages for validating. The `Validator` gives `mixinConstraintValidation()` a way to compute and cache validation.
Other validators will be added later, such as `SelectValidator` and `RadioValidator`
PiperOrigin-RevId: 583508468
