fix: Layout.Header accessibility role

[khalibloo]

[中文版模板 / Chinese template]

🤔 This is a ...

• New feature
• Bug fix
• Site / documentation update
• Demo update
• Component style update
• TypeScript definition update
• Bundle size optimization
• Performance optimization
• Enhancement feature
• Internationalization
• Refactoring
• Code style optimization
• Test Case
• Branch merge
• Workflow
• Other (about what?)

🔗 Related issue link

Close #43718

💡 Background and solution

For html <header /> elements to be treated as landmark elements, they cannot be placed within a <section /> element. Layout outputs a <section /> which strips Layout.Header of its banner role. To fix this, Layout can simply output a <div /> instead.

📝 Changelog

Language	Changelog
🇺🇸 English	fixed Layout.Header accessibility role
🇨🇳 Chinese

☑️ Self-Check before Merge

⚠️ Please check all items below before requesting a reviewing. ⚠️

• Doc is updated/provided or not needed
• Demo is updated/provided or not needed
• TypeScript definition is updated/provided or not needed
• Changelog is provided or not needed

---

🚀 Summary

🤖 Generated by Copilot at 5e42e5a

Change Layout component to use div instead of section. This enhances the component's semantics and compatibility.

🔍 Walkthrough

🤖 Generated by Copilot at 5e42e5a

• Change the tagName property of the GeneratorProps and BasicPropsWithTagName interfaces from 'section' to 'div' to allow the Layout component to use a div element as the root node (link, link)
• Change the generic type parameter of the React.forwardRef function from HTMLElement to HTMLDivElement to match the type of the ref argument passed to the Basic component in components/layout/layout.tsx (link, link)
• Change the tagName property of the generator function call from 'section' to 'div' to match the change in the GeneratorProps interface and the BasicLayout component in components/layout/layout.tsx (link)

[stackblitz]

Run & review this pull request in StackBlitz Codeflow.

[github-actions]

• 🚨 Please fill changelog in the PR

  • Write with a developer-oriented perspective and narrative method, without describing the details of the repair
  • Describing the problem and the impact on the developer
  • describing the user-first site problem, not your solution
  • Refer: https://ant.design/changelog#501

• 🚨 请填写 PR 中的 changelog

  • 请用面向开发者的角度和叙述方式撰写，不描述修复细节
  • 描述问题和对开发者的影响
  • 描述用户第一现场的问题，而非你的解决方式
  • 参考：https://ant.design/changelog-cn#501

[github-actions]

[argos-ci]

The latest updates on your projects. Learn more about Argos notifications ↗︎

Build	Status	Details	Updated (UTC)
default (Inspect)	👍 Changes approved	3 changes	Jul 24, 2023, 7:13 AM

[codecov]

Codecov Report

Patch coverage: 100.00% and no project coverage change.

Comparison is base (ecb3684) 100.00% compared to head (90f32dd) 100.00%.

Additional details and impacted files

@@            Coverage Diff            @@
##           feature    #43749   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files          658       658           
  Lines        11089     11110   +21     
  Branches      3000      3006    +6     
=========================================
+ Hits         11089     11110   +21     

Impacted Files	Coverage Δ
components/back-top/index.tsx	100.00% <ø> (ø)
components/button/LoadingIcon.tsx	100.00% <ø> (ø)
components/checkbox/style/index.ts	100.00% <ø> (ø)
components/date-picker/style/index.ts	100.00% <ø> (ø)
components/dropdown/dropdown-button.tsx	100.00% <ø> (ø)
components/form/style/index.ts	100.00% <ø> (ø)
components/image/index.tsx	100.00% <ø> (ø)
components/input-number/style/index.ts	100.00% <ø> (ø)
components/menu/style/horizontal.tsx	100.00% <ø> (ø)
components/menu/style/theme.tsx	100.00% <ø> (ø)
... and 33 more

☔ View full report in Codecov by Sentry.
📢 Do you have feedback about the report comment? Let us know in this issue.