search

SAP / ui5-webcomponents

UI5 Web Components - the enterprise-flavored sugar on top of native APIs! Build SAP Fiori user interfaces with the technology of your choice.
https://sap.github.io/ui5-webcomponents/
Apache License 2.0
1.56k stars 267 forks source link

[Refactoring]SegmentedButton: create dedicated child component #3191

Closed ilhan007 closed 3 years ago

ilhan007 commented 3 years ago

Is your feature request related to a problem? Please describe. To full-fill the accessibility spec of the SegmentedButton, we would need to perform a significant DOM refactoring. The ToggleButton component can't be used as a child of the SegmentedButton as certain aria attributes requires different DOM elements. And, we can't change the ToggleButton for the purpose of the SegmentedButton.

That's why we will need a new dedicated component - SegmentedButtonItem, that would like look and act the same as the ToggleButton, but will be rendered with different DOM elements and aria attributes.

Stakeholder SuccessFactors

Origin issue https://github.com/SAP/ui5-webcomponents/issues/2934

Reference https://openui5nightly.hana.ondemand.com/entity/sap.m.SegmentedButton/sample/sap.m.sample.SegmentedButton

Contact Person on accessibility questions @ghristanov

Usage

<ui5-segmentedbutton>
     <ui5-segmentedbutton-item>One</ui5-segmentedbutton-item>
      <ui5-segmentedbutton-item>Two</ui5-segmentedbutton-item>
       <ui5-segmentedbutton-item>Three</ui5-segmentedbutton-item>
</ui5-segmentedbutton>

Note The tag name can be discussed, this is an example, if you come up with better suggestion, please raise it.

Another solution Considered We also considered leaving the ToggleButton as it is now, and internally wrap the toggle buttons with new elements and provide the required aria attrs on that elements, but then we would also have to bring the focus to these new elements and the toggle buttons start looking obsolete and the DOM too complex. That's why we want to stick to the aforementioned solution

ilhan007 commented 3 years ago

Hello @SAP/ui5-webcomponents-topic-b

this request for refactoring origins from the following SegmentedButton a11y issue: #2934

After discussing it with @ghristanov and within the Web Components team, we decided to go for implementing a new child component, SegmentedButtonItem, in order to full-fill the a11y spec. You can find more details above.

As the refactoring will lead to API BREAKING CHANGES, please consider this is HIGH PRIORITY task.

Best, ilhan

BennyHuang commented 3 years ago

@ilhan007 is it possible to release this change to one SF patch version? Thanks

ilhan007 commented 3 years ago

Hello @BennyHuang we can, but as it's a breaking change, could you post a message in the SFSF channel to let everyone know and make sure that everyone is fine with downporting it.