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] StepIndicator should handle custom heading levels to allow semantic html #1751

Closed
haworku opened this issue Nov 12, 2021 · 0 comments · Fixed by #1865
Closed

[fix] StepIndicator should handle custom heading levels to allow semantic html #1751

haworku opened this issue Nov 12, 2021 · 0 comments · Fixed by #1865
Assignees
@rswerve
Labels
a11y Relates to accessibility standards and practices good first issue Good for newcomers status: wip Work in progress - not ready for code review type: bug Something isn't working like it's supposed to

Comments

@haworku
Copy link
Contributor

haworku commented Nov 12, 2021

ReactUSWDS Version & USWDS Version:

@trussworks/react-uswds 2.4.1
uswds 2.11.2

Describe the bug

To Reproduce
Steps to reproduce the behavior:

  1. Add <StepIndicator>
  2. Inspect HTML
  3. See that heading always uses <h4> tags and there are no props on the component to adjust this. This is an accessibility issue.

Expected behavior

Consumer can adjust the heading level to allow semantic HTML. his could be a type prop on the component similar to the proposed IconList interface.

FYI this type of functionality is also mentioned in the USWDS docs for Step indicator

Use semantic heading levels. Though our default code uses an <h4>, use the correct heading level in your own implementation.
@haworku haworku added type: bug Something isn't working like it's supposed to a11y Relates to accessibility standards and practices good first issue Good for newcomers labels Nov 12, 2021
@rswerve rswerve self-assigned this Jan 7, 2022
@rswerve rswerve added the status: wip Work in progress - not ready for code review label Jan 7, 2022
rswerve added a commit that referenced this issue Jan 7, 2022
@rswerve
feat: accept prop for heading level(#1751)
5037cad
@rswerve rswerve mentioned this issue Jan 7, 2022
Merged
rswerve added a commit that referenced this issue Jan 7, 2022
@rswerve @haworku
feat: accept prop for heading level (#1751) (#1865)
464756f 
* feat: accept prop for heading level(#1751)

Co-authored-by: haworku <[email protected]>
@rswerve rswerve mentioned this issue Jan 7, 2022
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@rswerve rswerve

Labels
a11y Relates to accessibility standards and practices good first issue Good for newcomers status: wip Work in progress - not ready for code review type: bug Something isn't working like it's supposed to
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat: accept prop for heading level (#1751) trussworks/react-uswds
2 participants
@rswerve @haworku