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.

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

feat(ui5-menu): selectable menu items #10028

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

Conversation

NHristov-sap
Copy link
Contributor

@NHristov-sap NHristov-sap commented Oct 15, 2024

This PR introduces MenuItemGroup component that can hold regular MenuItem components. The MenuItemGroup has a property named itemSelectionMode which can have values among None (default), SingleSelect and MultiSelect. MenuItemGroup can be slotted in a Menu or MenuItem default slot as any other regular MenuItem. Nesting of MenuItemGroups is not allowed, but any Menu or MenuItem can contain more than one MenuItemGroup components with different itemSelectionMode settings.

When itemSelectionMode is:

  • None, the Menu acts exactly like until now.
  • SingleSelect means that zero or one MenuItems can be selected at a time.
  • MultiSelect means that zero or many MenuItems can be selected at a time.

There is also new property isSelected introduced in MenuItem. By setting it the item is marked as selected and this is visualized as checkmark at the end of the item. This property is taken into account only when the corresponding item is a member of MenuItemGroup with SingleSelect or MultiSelect value of itemSelectionMode.

image

It is recommended to place separators before and after each MenuItemGroup, but this is not mandatory and depends on the application developers.

* @public
*/
@customElement({
tag: "ui5-menu-item-group",
Copy link
Contributor

Choose a reason for hiding this comment

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

Let's rename it to ui5-menu-group-item, so we could be consistent with the ui5-timeline-group-item

Copy link
Contributor Author

@NHristov-sap NHristov-sap Oct 18, 2024

Choose a reason for hiding this comment

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

In UI5 it is named exactly as here, so we should discuss/decide whether to make it consistent with the same control in UI5 or with timeline group item...

packages/main/src/MenuItemGroup.hbs Show resolved Hide resolved
packages/main/src/MenuItemGroup.ts Outdated Show resolved Hide resolved
packages/main/src/MenuItem.ts Show resolved Hide resolved
packages/main/src/MenuItemGroup.ts Outdated Show resolved Hide resolved
packages/main/src/Menu.ts Outdated Show resolved Hide resolved
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants