Skip to content

feat(ui5-avatar-group): new slot overflowButton #3037

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

Merged
merged 4 commits into from
Mar 30, 2021
Merged

feat(ui5-avatar-group): new slot overflowButton #3037

merged 4 commits into from
Mar 30, 2021

Conversation

nnaydenow
Copy link
Contributor

@nnaydenow nnaydenow commented Mar 29, 2021

Added new slot which allows to add custom overflow button and "overflow" event to let you know when avatars
hide/show in order to update the overflow button text. If not provided, the AvatarGroup will display the built-in overflow button. The slot is provided to allow you defining the text of the overflow button and let you set additional aria attributes, such as aria-label.

<ui5-avatar-group>
    <ui5-button slot="overflowButton"  aria-label="your text">+99</ui5-button>
</ui5-avatar-group>

Fixes: #2912

Copy link
Contributor

@vladitasev vladitasev left a comment

Choose a reason for hiding this comment

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

IMO looks great, almost ready to merge.

I would suggest 2 minor things:

  • You have 2 checks: _hasOverflowButton (which is this.overflowButton.length) and in many places in the code there is this.overflowButton[0]. Please merge these in a single getter: _customOverflowButton which returns null/undefined or this.overflowButton[0]. Then use this getter in place of both this.overflowButton.length and this.overflowButton[0]
  • in the html example, add arialabel to demonstrate the feature they wanted

Copy link
Member

@ilhan007 ilhan007 left a comment

Choose a reason for hiding this comment

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

Check if it is fine in IE, to test on IE you have to build the project with yarn start:es5

@nnaydenow nnaydenow requested a review from ilhan007 March 30, 2021 10:33
@ilhan007 ilhan007 merged commit 6d47d68 into SAP:master Mar 30, 2021
ilhan007 pushed a commit that referenced this pull request Mar 31, 2021
Added new slot which allows to add custom overflow button and "overflow" event to let you know when avatars
hide/show in order to update the overflow button text. If not provided, the AvatarGroup will display the built-in overflow button. The slot is provided to allow you defining the text of the overflow button and let you set additional aria attributes, such as aria-label.

Fixes: #2912
ilhan007 pushed a commit that referenced this pull request Mar 31, 2021
Added new slot which allows to add custom overflow button and "overflow" event to let you know when avatars
hide/show in order to update the overflow button text. If not provided, the AvatarGroup will display the built-in overflow button. The slot is provided to allow you defining the text of the overflow button and let you set additional aria attributes, such as aria-label.

Fixes: #2912
ilhan007 pushed a commit that referenced this pull request Mar 31, 2021
Added new slot which allows to add custom overflow button and "overflow" event to let you know when avatars
hide/show in order to update the overflow button text. If not provided, the AvatarGroup will display the built-in overflow button. The slot is provided to allow you defining the text of the overflow button and let you set additional aria attributes, such as aria-label.

Fixes: #2912
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

ui5-avatar-group: users can define the number of overflowButton
3 participants