27 Commits

Author SHA1 Message Date
Elizabeth Mitchell
c390291687 chore: format files with prettier
PiperOrigin-RevId: 576601342
2023-10-25 11:59:00 -07:00
Elliott Marquez
a5a6974dec fix(select): form failure no longer throws non-focusable error
fixes #5078

PiperOrigin-RevId: 575361459
2023-10-20 18:10:02 -07:00
Elizabeth Mitchell
83aaf6c848 chore(select): update demo a11y
PiperOrigin-RevId: 568335268
2023-09-25 15:08:50 -07:00
Elliott Marquez
aeb5103e1c fix(menu,select): fix final aria issues
PiperOrigin-RevId: 568326002
2023-09-25 14:31:52 -07:00
Elliott Marquez
6d0c7e8538 refactor(list)!: refactor list to reuse ListController
fixes #4967

also fixes list-root focus ring and focusout

BREAKING CHANGE: the new ListController behavior no longer waits for event.preventDefault asynchronously because it was causing keyboard navigations to scroll the page.

PiperOrigin-RevId: 568300155
2023-09-25 12:54:12 -07:00
Elliott Marquez
5e4434bfed fix(select): update select docs and fix initial selection
PiperOrigin-RevId: 567884899
2023-09-23 11:14:56 -07:00
Elliott Marquez
f81ce1131b refactor(select): refactor select so that it doesn't rely on menuitem & use logic controller
PiperOrigin-RevId: 567735675
2023-09-22 15:45:50 -07:00
Elliott Marquez
1217b62ef2 refactor(menu)!: pull logic out of menuitem into a controller & change enum vals
BREAKING CHANGE: Several enums in menu had their values changed from SCREAM_CASE to kebab-case to follow style guide. They are NAVIGABLE_KEYS -> NavigableKey, SELECTION_KEY -> SelectionKey, CLOSE_REASON -> CloseReason, KEYDOWN_CLOSE_KEY -> KeydownCloseKey

PiperOrigin-RevId: 567727434
2023-09-22 15:09:41 -07:00
Elliott Marquez
63b01425e7 refactor(menu,select)!: rename fixed to positioning
This will enable forwards compatibility for `positioning="top-layer"` with popover.

BREAKING CHANGE: refactor `fixed` property to `positioning="fixed"` in Menu and `menuFixed` to `menuPositioning="fixed"`

PiperOrigin-RevId: 567723646
2023-09-22 14:54:57 -07:00
Elliott Marquez
2a1d8776a7 refactor(menu)!: refactor menu-item to use md-item and not rely on md-list-item
BREAKING CHANGE: This change refactors menu-item to no longer subclass or import from list-item. It also refactors it to use md-item directly which means that the API of menu item has moved from properties to slots. `start-*` and `end-*` slots are now just `start` and `end`, many tokens are now gone in favor of slotting. `headline` property is now a `slot="headline"` slot. Typeahead search text can now be set via `typeaheadText` which defaults to the slotted headline `textContent`. `select-option` now has the `displayText` which is used to display text in the `md-select` when the option is selected; defaults to the slotted headline `textContent`.

PiperOrigin-RevId: 567719483
2023-09-22 14:35:46 -07:00
Elliott Marquez
0384507447 refactor(menu)!: update menu to use host-aria
BREAKING CHANGE: Menu no longer uses md-list internally which means the list-related properties such as `list-tabindex` and `type` should now be on the host of md-menu. The new attributes should be `tabindex` and `role` respectively.

PiperOrigin-RevId: 567702229
2023-09-22 13:24:21 -07:00
Elliott Marquez
6e54048f1e refactor(menu)!: rename corner and focus state values lowercase with dashes
BREAKING: for style guide enum consistency, we have renamed the corner values START_START etc. to be lowercase with dashes. e.g. start-start. The same has been done with MdMenu.defaultFocus' values.
PiperOrigin-RevId: 566454879
2023-09-18 17:09:17 -07:00
Elliott Marquez
d4463154cc refactor(list,menu,select)!: remove active concept and now parent controls tabIndex and focus
Note: tests have changed significantly because there is no longer a concept of "nothing activated" in the list.

BREAKING CHANGE: removed `active` from list-item, menu-item, and select-option. Instead, List uses tabindex to track whether something is focusable.

PiperOrigin-RevId: 565531998
2023-09-14 18:14:59 -07:00
Elizabeth Mitchell
4ad2336b87 feat(select): add required and form association
Fixes #4903

PiperOrigin-RevId: 565260839
2023-09-13 22:45:10 -07:00
Elliott Marquez
2927245114 fix(menu): menu's default focus behavior follows google accessibility practices
default focus is now FIRST_ITEM and instead of LIST_ROOT and the menu / list itself has tabindex -1 by default as our a11y model recommends

PiperOrigin-RevId: 565244488
2023-09-13 21:02:33 -07:00
Elizabeth Mitchell
4b40e67b82 chore(select): re-organize public/protected/private members
PiperOrigin-RevId: 565187172
2023-09-13 16:01:06 -07:00
Material Web Team
556e6f95e4 chore: fix closure compiler issues
PiperOrigin-RevId: 564867173
2023-09-12 16:30:19 -07:00
Elliott Marquez
78e7c1742f fix(select): select can reopen when animation interrupted
PiperOrigin-RevId: 564826332
2023-09-12 14:01:39 -07:00
Andrew Jakubowicz
059dad5d44 fix(select): change slot names to kebab-case
BREAKING CHANGE: replace `leadingicon` and `trailingicon` slot names with `leading-icon` and `trailing-icon`

PiperOrigin-RevId: 563583658
2023-09-07 16:54:42 -07:00
Elliott Marquez
2c892c4114 fix(select): announce typeahead selection when select is closed
PiperOrigin-RevId: 561675276
2023-08-31 09:23:19 -07:00
Elliott Marquez
8d4917173a refactor(select): remove the select-* prefix from select events
PiperOrigin-RevId: 561435986
2023-08-30 13:38:50 -07:00
Elliott Marquez
5ba348dfd0 feat(menu)!: allow anchoring with idref string and set element ref on anchorElement
BREAKING: `MdMenu.prototype.anchor` now only accepts a string which will querySelector the rootNode of the menu. The method now to anchor to an element reference is to set `MdMenu.prototype.anchorElement`. This matches the `popover` anchoring proposal more closely, but that proposal may not pass in favor of a CSS approach.
PiperOrigin-RevId: 560955779
2023-08-29 01:40:36 -07:00
Elliott Marquez
1a1fb93be7 feat(select): dispatch select-(open|close)(ing|ed) events
This will allow for the case of data fetching select options only when the select menu has opened.

We prepend the menu events with `select-*` and do not bubble because we have historically had the issue where a select inside a dialog or another menu has had event name clashes causing user runtime issues. I can probably keep them the same names but still not have them bubble if y'all think that's better.

See more discussion in linked github issue

fixes #4798

PiperOrigin-RevId: 560849772
2023-08-28 16:27:22 -07:00
Elliott Marquez
4ab2e393d4 fix(select)!: add trailing icon indicator and fix icon token application
BREAKING CHANGE: select will now show an arrow indicator and will apply default styles to slotted icons

PiperOrigin-RevId: 553597960
2023-08-03 14:53:36 -07:00
Elliott Marquez
98daf6688a refactor(select): make selects events use Event rather than subclassing it
PiperOrigin-RevId: 553583222
2023-08-03 14:03:09 -07:00
Elliott Marquez
043d548270 refactor(menu)!: events no longer subclass Event but rather use CustomEvent
Fixes issues running in ES5

BREAKING CHANGE: subclassing events is not supported in ES5 so all menu-related events now use CustomEvent rather than subclassing Event

PiperOrigin-RevId: 553304128
2023-08-02 17:23:36 -07:00
Andrew Jakubowicz
6ec3f06429 fix!: rename "lib" directory to "internal"
BREAKING CHANGE: Rename `@material/web/<component>/lib` to `@material/web/<component>/internal`. Prefer not using internal files.

PiperOrigin-RevId: 550633216
2023-07-24 12:02:59 -07:00