Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(material/menu): clicks on disabled item closing the menu #19183

Merged
merged 1 commit into from
Mar 28, 2022
Merged

fix(material/menu): clicks on disabled item closing the menu #19183

merged 1 commit into from
Mar 28, 2022

Conversation

crisbeto
Copy link
Member

@crisbeto crisbeto commented Apr 27, 2020 •
edited
Loading

Adds an overlay on top of the content of a disabled menu item in order to capture clicks and prevent the menu from closing when clicking on it.

Fixes #19173.

@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release labels Apr 27, 2020
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Apr 27, 2020
@crisbeto crisbeto marked this pull request as draft April 27, 2020 15:05
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from d7ebb51 to 41ff5ad Compare April 27, 2020 15:13
@crisbeto crisbeto marked this pull request as ready for review April 27, 2020 15:13
jelbourn
jelbourn reviewed Apr 28, 2020
View reviewed changes
src/material-experimental/mdc-menu/menu.scss Outdated
.mat-mdc-menu-item-content {
display: flex;
align-items: center;
}
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would this make the menu item content unexpectedly flex items?

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It would, but the MDC menu was using flex already: https://material-components.github.io/material-components-web-catalog/#/component/menu

jelbourn
jelbourn approved these changes May 6, 2020
View reviewed changes
Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@jelbourn jelbourn added lgtm action: merge The PR is ready for merge by the caretaker labels May 6, 2020
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 41ff5ad to db4d1eb Compare June 27, 2020 13:28
@mmalerba mmalerba removed the lgtm label Jul 31, 2020
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from db4d1eb to c4347f8 Compare November 3, 2020 20:57
@crisbeto crisbeto changed the title fix(menu): clicks on disabled item closing the menu fix(material/menu): clicks on disabled item closing the menu Nov 3, 2020
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch 2 times, most recently from 18776bc to 9f5ed9a Compare November 3, 2020 21:02
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 9f5ed9a to cd43314 Compare April 1, 2021 14:54
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from cd43314 to 828fe76 Compare April 24, 2021 11:57
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 828fe76 to 7cc3eb4 Compare May 29, 2021 11:57
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 7cc3eb4 to 08704bd Compare July 3, 2021 11:15
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 08704bd to 0cd22d0 Compare August 1, 2021 18:25
@crisbeto crisbeto requested a review from a team as a code owner August 1, 2021 18:25
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 0cd22d0 to 2a62ba4 Compare August 1, 2021 18:30
@josephperrott josephperrott removed the request for review from a team August 10, 2021 18:38
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 2a62ba4 to 10fd469 Compare September 3, 2021 18:08
@andrewseguin andrewseguin added needs rebase and removed cla: yes PR author has agreed to Google's Contributor License Agreement labels Dec 28, 2021
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from 10fd469 to b361c97 Compare January 3, 2022 10:00
@RadhikaGunisetty
Copy link

@crisbeto This PR needs a rebase.

@crisbeto
Copy link
Member Author

crisbeto commented Mar 2, 2022

I looked into rebasing this one the other day, but it looked like the previous presubmit revealed a bunch of issues so I decided to leave it for later.

@crisbeto
fix(material/menu): clicks on disabled item closing the menu
ef1ca5a 
Adds an overlay on top of the content of a disabled menu item in order to capture clicks and prevent the menu from closing when clicking on it.

Fixes angular#19173.
@crisbeto crisbeto force-pushed the 19173/menu-disabled-click branch from b361c97 to ef1ca5a Compare March 28, 2022 08:31
@crisbeto
Copy link
Member Author

crisbeto commented Mar 28, 2022 •
edited
Loading

I've changed the approach to make this easier to land in g3. Will run the presubmit myself.

@crisbeto crisbeto merged commit a76f301 into angular:master Mar 28, 2022
crisbeto added a commit that referenced this pull request Mar 28, 2022
@crisbeto
fix(material/menu): clicks on disabled item closing the menu (#19183)
b07ae4c 
Adds an overlay on top of the content of a disabled menu item in order to capture clicks and prevent the menu from closing when clicking on it.

Fixes #19173.

(cherry picked from commit a76f301)
@sync-by-unito sync-by-unito bot mentioned this pull request Mar 31, 2022
Closed
crapStone pushed a commit to Calciumdibromid/CaBr2 that referenced this pull request Mar 31, 2022
Update angularmaterial monorepo to v13.3.2 (#1275)
fb678ba 
This PR contains the following updates:

| Package | Type | Update | Change |
|---|---|---|---|
| [@angular/cdk](https://github.com/angular/components) | dependencies | patch | [`13.3.1` -> `13.3.2`](https://renovatebot.com/diffs/npm/@angular%2fcdk/13.3.1/13.3.2) |
| [@angular/material](https://github.com/angular/components) | dependencies | patch | [`13.3.1` -> `13.3.2`](https://renovatebot.com/diffs/npm/@angular%2fmaterial/13.3.1/13.3.2) |

---

### Release Notes

<details>
<summary>angular/components</summary>

### [`v13.3.2`](https://github.com/angular/components/blob/HEAD/CHANGELOG.md#&#8203;1332-flannel-flamingo-2022-03-30)

[Compare Source](angular/components@13.3.1...13.3.2)

##### cdk

| Commit | Type | Description |
| -- | -- | -- |
| [48968719fc](angular/components@4896871) | fix | **a11y:** live announcer promise never resolved if new announcement comes in ([#&#8203;24700](angular/components#24700)) |
| [e9734a9c66](angular/components@e9734a9) | fix | **testing:** entering negative number values not working with reactive forms ([#&#8203;24656](angular/components#24656)) |

##### material

| Commit | Type | Description |
| -- | -- | -- |
| [c677f11ed8](angular/components@c677f11) | fix | **button-toggle:** ripples not clipping correctly in safari ([#&#8203;12311](angular/components#12311)) |
| [20af3e7c9d](angular/components@20af3e7) | fix | **chips:** ripple not clipped on safari ([#&#8203;21495](angular/components#21495)) |
| [d04e7c9b69](angular/components@d04e7c9) | fix | **core:** unable to override tag selectors inside .mat-typography ([#&#8203;14617](angular/components#14617)) |
| [9490a31641](angular/components@9490a31) | fix | **list:** not working correctly when list item is used as a button ([#&#8203;13617](angular/components#13617)) |
| [b07ae4ccc4](angular/components@b07ae4c) | fix | **menu:** clicks on disabled item closing the menu ([#&#8203;19183](angular/components#19183)) |
| [e85777712a](angular/components@e857777) | fix | **radio:** set tabindex based on selected state ([#&#8203;18081](angular/components#18081)) |
| [7f274dc96f](angular/components@7f274dc) | fix | **snack-bar:** ensure that the snack bar always runs inside the NgZone ([#&#8203;24611](angular/components#24611)) |
| [a5aa87502b](angular/components@a5aa875) | fix | **tabs:** focus wrapping back to selected label when using shift + tab ([#&#8203;14194](angular/components#14194)) |
| [04f4937b75](angular/components@04f4937) | fix | **tabs:** update tab state when active tab is swapped out ([#&#8203;24164](angular/components#24164)) |

##### material-experimental

| Commit | Type | Description |
| -- | -- | -- |
| [a704913d2b](angular/components@a704913) | fix | **mdc-button:** extended fab touch target not covering entire button ([#&#8203;24322](angular/components#24322)) |
| [23e7b8e6c1](angular/components@23e7b8e) | fix | **mdc-chips:** make it easier to customize chip typography ([#&#8203;24632](angular/components#24632)) |
| [518022288b](angular/components@5180222) | fix | **mdc-chips:** Mirror aria-describedby to matChipInput ([#&#8203;24551](angular/components#24551)) |
| [9497b02f8b](angular/components@9497b02) | fix | **mdc-slider:** update layout when container resizes ([#&#8203;24648](angular/components#24648)) |
| [e5c025dff4](angular/components@e5c025d) | fix | **mdc-slider:** use passive event listeners ([#&#8203;24675](angular/components#24675)) |

#### Special Thanks

Artur Androsovych, ByzantineFailure, David Gonzalez, Dilyorbek, Kristiyan Kostadinov, Naveen, Paul Gschwendtner, Raí Siqueira, Shivam Sethi, Wagner Maciel and Zach Arend

<!-- CHANGELOG SPLIT MARKER -->

</details>

---

### Configuration

📅 **Schedule**: At any time (no schedule defined).

🚦 **Automerge**: Disabled by config. Please merge this manually once you are satisfied.

♻ **Rebasing**: Whenever PR becomes conflicted, or you tick the rebase/retry checkbox.

🔕 **Ignore**: Close this PR and you won't be reminded about these updates again.

---

 - [ ] <!-- rebase-check -->If you want to rebase/retry this PR, click this checkbox.

---

This PR has been generated by [Renovate Bot](https://github.com/renovatebot/renovate).

Co-authored-by: cabr2-bot <cabr2.help@gmail.com>
Reviewed-on: https://codeberg.org/Calciumdibromid/CaBr2/pulls/1275
Reviewed-by: 6543 <6543@noreply.codeberg.org>
Co-authored-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>
Co-committed-by: Calciumdibromid Bot <cabr2_bot@noreply.codeberg.org>
forsti0506 pushed a commit to forsti0506/components that referenced this pull request Apr 3, 2022
@crisbeto @forsti0506
fix(material/menu): clicks on disabled item closing the menu (angular…
68b2c44 
…#19183)

Adds an overlay on top of the content of a disabled menu item in order to capture clicks and prevent the menu from closing when clicking on it.

Fixes angular#19173.
@sync-by-unito sync-by-unito bot mentioned this pull request Apr 22, 2022
Closed
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Apr 28, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Reviewers

@jelbourn jelbourn jelbourn approved these changes

Assignees

@jelbourn jelbourn

Labels
action: merge The PR is ready for merge by the caretaker P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

[menu-item]: Clicking on disabled menu-item closes the menu
6 participants
@crisbeto @RadhikaGunisetty @jelbourn @googlebot @mmalerba @andrewseguin