feat: add menu item role `palette` and `header` by gerhardberger · Pull Request #45538 · electron/electron

gerhardberger · 2025-02-09T02:07:13Z

Description of Change

This PR adds two new macOS specific menu item roles:

palette: A menu presentation style where items to display align horizontally.
header: A menu item representing a section header for a logical grouping of menu commands.

const reactions = []

  for (let i = 1; i <= 4; ++i) {
    reactions.push({
      label: '',
      icon: nativeImage.createFromPath(path.resolve(__dirname, '..', `reaction-${i}@2x.png`)),
      click: () => console.log('Clicked reaction!')
    })
  }

  const paletteMenu = Menu.buildFromTemplate(reactions)

  const contextMenu = Menu.buildFromTemplate([
    {
      label: 'Reactions',
      role: 'header',
    },
    {
      type: 'submenu',
      label: 'Reactions',
      role: 'palette',
      submenu: paletteMenu,
    },
    {
      type: 'submenu',
      label: 'Reactions',
      submenu: paletteMenu,
    },
    { label: 'Tapback...' },
    { label: 'Reply...' },
    { label: 'Add Sticker...' },
  ])

Checklist

PR description included and stakeholders cc'd
npm test passes
tests are changed or added
relevant documentation, tutorials, templates and examples are changed or added
PR release notes describe the change in a way relevant to app developers, and are capitalized, punctuated, and past tense.

Release Notes

Notes: Add support for menu item role palette and header on macOS.

jkleinsc

API LGTM

samuelmaddock

API LGTM

erickzhao

API LGTM

codebytere · 2025-02-12T10:08:22Z

@gerhardberger could you please sign your commits?

itsananderson

Can you add the code sample to the PR details that you used to generate the screenshot with the palette? It's a little hard to tell how that role would be used based on the docs, so that would be helpful for reviewing the API.

docs/api/menu-item.md

shell/browser/ui/cocoa/electron_menu_controller.mm

samuelmaddock

API CHANGES REQUESTED

After further discussion we came to the conclusion that the role property might not be the best fit for these additions. We recommend using the type property instead, partially based on findings that the 'separator' type uses similar code.

bpasero · 2025-03-27T08:32:47Z

Is this going on?

gerhardberger · 2025-03-27T09:21:40Z

@bpasero yes I'm planning to wrap it up with the requested changes in the coming weeks.

gerhardberger · 2025-04-06T20:31:45Z

@samuelmaddock I looked into the requested change to implement it with the menu's type property and it would be a little convoluted because we cannot just extend the electron::ElectronMenuModel::ItemType with the new types, because that type is coming from Chromium's ui::MenuModel.
So IMO what we could do is implement it as an extra CustomType field next to ItemType, store them in ElectronMenuModel and handle them accordingly in electron_menu_controller.mm.
If this sounds good, I can go ahead with it.

samuelmaddock · 2025-04-10T17:08:10Z

@gerhardberger That approach seems reasonable 👍

itsananderson

I like the new approach! Just a couple comments about documenting the new types as macOS 14+ only.

docs/api/menu-item.md

samuelmaddock

refactor lgtm!

samuelmaddock

API LGTM

itsananderson

API LGTM

release-clerk · 2025-05-23T16:43:53Z

Release Notes Persisted

Add support for menu item role palette and header on macOS.

trop · 2025-05-23T16:44:13Z

I have automatically backported this PR to "37-x-y", please check out #47245

* feat: add menu item role `palette` and `header` * adds comments * refactors new role items to new item types * docs: custom type * docs: note types only available on mac 14+ --------- Co-authored-by: Samuel Maddock <smaddock@slack-corp.com>

electron-cation bot added the new-pr 🌱 PR opened recently label Feb 9, 2025

deepak1556 added the api-review/requested 🗳 label Feb 10, 2025

jkleinsc added the semver/minor backwards-compatible functionality label Feb 10, 2025

jkleinsc reviewed Feb 10, 2025

View reviewed changes

samuelmaddock approved these changes Feb 10, 2025

View reviewed changes

erickzhao approved these changes Feb 10, 2025

View reviewed changes

Magnate1234 mentioned this pull request Feb 11, 2025

[MAS Rejection]: vi #45565

Closed

2 tasks

gerhardberger force-pushed the feat-add-palette-header-menu branch 2 times, most recently from d9f897e to e4f8059 Compare February 12, 2025 10:31

itsananderson reviewed Feb 13, 2025

View reviewed changes

docs/api/menu-item.md Show resolved Hide resolved

shell/browser/ui/cocoa/electron_menu_controller.mm Show resolved Hide resolved

shell/browser/ui/cocoa/electron_menu_controller.mm Show resolved Hide resolved

electron-cation bot added api-review/approved ✅ and removed new-pr 🌱 PR opened recently api-review/requested 🗳 labels Feb 16, 2025

samuelmaddock requested changes Feb 20, 2025

View reviewed changes

electron-cation bot added api-review/requested 🗳 and removed api-review/approved ✅ labels Feb 20, 2025

samuelmaddock added the wip ⚒ label Apr 17, 2025

gerhardberger force-pushed the feat-add-palette-header-menu branch from cecf5f5 to 9642f49 Compare May 20, 2025 18:37

erickzhao requested a review from samuelmaddock May 20, 2025 18:53

erickzhao removed the wip ⚒ label May 20, 2025

itsananderson reviewed May 22, 2025

View reviewed changes

docs/api/menu-item.md Show resolved Hide resolved

docs/api/menu-item.md Outdated Show resolved Hide resolved

samuelmaddock approved these changes May 22, 2025

View reviewed changes

electron-cation bot added api-review/approved ✅ and removed api-review/requested 🗳 labels May 22, 2025

itsananderson approved these changes May 22, 2025

View reviewed changes

samuelmaddock added the target/37-x-y PR should also be added to the "37-x-y" branch. label May 23, 2025

gerhardberger and others added 5 commits May 23, 2025 09:50

feat: add menu item role palette and header

ebd00b7

adds comments

db8b046

refactors new role items to new item types

cafb5b9

docs: custom type

a6c3ea1

docs: note types only available on mac 14+

6495d82

samuelmaddock force-pushed the feat-add-palette-header-menu branch from b482dc6 to 6495d82 Compare May 23, 2025 13:50

jkleinsc approved these changes May 23, 2025

View reviewed changes

jkleinsc merged commit b9b96a9 into electron:main May 23, 2025
55 checks passed

trop bot mentioned this pull request May 23, 2025

feat: add menu item role palette and header #47245

Merged

trop bot added in-flight/37-x-y and removed target/37-x-y PR should also be added to the "37-x-y" branch. labels May 23, 2025

trop bot added merged/37-x-y PR was merged to the "37-x-y" branch. and removed in-flight/37-x-y labels Jun 23, 2025

Conversation

gerhardberger commented Feb 9, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description of Change

Checklist

Release Notes

Uh oh!

jkleinsc left a comment

Choose a reason for hiding this comment

Uh oh!

samuelmaddock left a comment

Choose a reason for hiding this comment

Uh oh!

erickzhao left a comment

Choose a reason for hiding this comment

Uh oh!

codebytere commented Feb 12, 2025

Uh oh!

itsananderson left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

Uh oh!

samuelmaddock left a comment

Choose a reason for hiding this comment

Uh oh!

bpasero commented Mar 27, 2025

Uh oh!

gerhardberger commented Mar 27, 2025

Uh oh!

gerhardberger commented Apr 6, 2025

Uh oh!

samuelmaddock commented Apr 10, 2025

Uh oh!

itsananderson left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

samuelmaddock left a comment

Choose a reason for hiding this comment

Uh oh!

samuelmaddock left a comment

Choose a reason for hiding this comment

Uh oh!

itsananderson left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

release-clerk bot commented May 23, 2025

Uh oh!

trop bot commented May 23, 2025

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

8 participants

gerhardberger commented Feb 9, 2025 •

edited

Loading