feat(Accordion): add headingLevel prop so consumers can set the correct aria-level for item headings

[starboyvarun]

Summary

Every AccordionItem trigger renders inside a heading wrapper. The heading level was hardcoded to 3:

// AccordionButton.web.tsx (before)
<BaseBox
  // a11y guidelines suggest having an apt heading surround a button but heading level is hardcoded here
  {...makeAccessible({ role: 'heading', level: 3 })}
  width="100%"
>

This means every accordion — regardless of where it sits in the page — always announces as an <h3>. If an accordion lives inside an <h1> section, screen readers encounter heading levels that jump from 1 → 3 (skipping 2), which breaks document outline navigation. If it lives inside an <h4> section, the <h3> is actually higher in the hierarchy than its parent.

The comment in the code acknowledged this: // a11y guidelines suggest having an apt heading surround a button but heading level is hardcoded here.

Fix

Added headingLevel?: 1 | 2 | 3 | 4 | 5 | 6 to AccordionProps (defaults to 3). The value flows through AccordionContext to AccordionButton.web.tsx.

// Usage
<Accordion headingLevel={2}>
  <AccordionItem>...</AccordionItem>
</Accordion>

// AccordionButton.web.tsx (after)
<BaseBox
  {...makeAccessible({ role: 'heading', level: headingLevel })}
  width="100%"
>

The default value is 3, so existing consumers are completely unaffected.

Changes

• types.ts — add headingLevel?: 1 | 2 | 3 | 4 | 5 | 6 to AccordionProps with JSDoc
• AccordionContext.tsx — add headingLevel to AccordionContextState
• Accordion.tsx — destructure headingLevel = 3, include in context value and useMemo deps
• AccordionButton.web.tsx — read headingLevel from context, replace hardcoded 3, remove stale comment

Testing

• Default: accordion without headingLevel prop still renders aria-level="3" (unchanged)
• Custom: <Accordion headingLevel={2}> renders aria-level="2" on each item's heading wrapper
• Screen reader (NVDA/VoiceOver): document outline navigation follows the specified heading level correctly

[changeset-bot]

🦋 Changeset detected

Latest commit: 1a294d3

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@razorpay/blade	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

✅ PR title follows Conventional Commits specification.

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 1a294d3:

Sandbox	Source
razorpay/blade: basic	Configuration