Skip to content

Commit

Permalink
STCOM-1392 Use h3 instead of h1 for menu. (#2405)
Browse files Browse the repository at this point in the history
We saw it coming. We did. Zak should've pressed me. We should have
changed the default `labelTag` back then, in
[STCOM-1191](https://folio-org.atlassian.net/browse/STCOM-1191). Despite
so much documentation around the internet regarding the `<section>` tag
and its contained heading supporting `h1-h6`, etc... there's a scarce
amount of connection to the safety-first best-and-long-practiced pattern
of ONE SINGLE H1 PER-PAGE! (regardless of visiblity status.) Regardless
of what apparent outcome of articles like this ([`h2` is the apparent
ceiling for `sections`,
period](https://www.webucator.com/article/html-heading-levels-and-sectioning-content/))
Having multiple `<H1>`'s show up to any validator and expecting
validators/audit tools of any kind to read the minds of browsers/browser
developers/spec writers/developers
everywhere... just set it to make sense if you view the mark-up. Since
dropdowns are commonly used within panes (which conventionally hold
`h2`'s as their header) defaulting to `h3` fits with the convention.
  • Loading branch information
JohnC-80 authored Dec 20, 2024
1 parent 4359e2b commit 84013d0
Show file tree
Hide file tree
Showing 2 changed files with 2 additions and 1 deletion.
1 change: 1 addition & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
* Wrap `<Card>`'s render output in `<StripesOverlayContext>` to facilitate ease with overlay components. Refs STCOM-1384.
* Clear filter value after an action chosen from `MultiSelection` menu. Refs STCOM-1385.
* ExportCSV - fix usage within `<Modal>`s by rendering the download link to the `div#OverlayContainer`. Refs STCOM-1387.
* `<MenuSection>` should default its heading/label tag to `H3` instead of `H1`. Refs STCOM-1392.

## [12.2.0](https://github.com/folio-org/stripes-components/tree/v12.2.0) (2024-10-11)
[Full Changelog](https://github.com/folio-org/stripes-components/compare/v12.1.0...v12.2.0)
Expand Down
2 changes: 1 addition & 1 deletion lib/MenuSection/MenuSection.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import uniqueId from 'lodash/uniqueId';
import css from './MenuSection.css';
import Headline from '../Headline';

const MenuSection = ({ className, children, id, label, labelTag = 'h1', ...rest }) => {
const MenuSection = ({ className, children, id, label, labelTag = 'h3', ...rest }) => {
const sectionId = id || uniqueId('menu-section-');
return (
<section
Expand Down

0 comments on commit 84013d0

Please sign in to comment.