Skip to content

feat: support custom accessible labels on step handlers via upAriaLabel and downAriaLabel - #759

Open
feritcemkahraman wants to merge 1 commit into
react-component:masterfrom
feritcemkahraman:feat/custom-stepper-aria-label
Open

feritcemkahraman wants to merge 1 commit into
react-component:masterfrom
feritcemkahraman:feat/custom-stepper-aria-label

Conversation

@feritcemkahraman

@feritcemkahraman feritcemkahraman commented Oct 21, 2026 •

Copy link
Copy Markdown

Summary

Fixes #757.

Currently, \StepHandler\ hardcodes the accessible button labels as English literals ('Increase Value'\ and 'Decrease Value') with no way for consumers or localization providers to customize them.

This PR adds optional \upAriaLabel\ and \downAriaLabel\ props to \InputNumberProps\ and forwards them to \StepHandler\ as \�ria-label, defaulting to the existing 'Increase Value'\ and 'Decrease Value'\ strings when omitted.

Summary by CodeRabbit

  • 新功能
    • InputNumber 支持为增加和减少按钮设置自定义无障碍标签。
    • 未设置自定义标签时,按钮继续使用默认的“增加值”和“减少值”标签。
  • 测试
    • 增加了对自定义无障碍标签及按钮可查询性的验证。

@vercel

vercel Bot commented Oct 21, 2026

Copy link
Copy Markdown

@feritcemkahraman is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

@coderabbitai

coderabbitai Bot commented Oct 21, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 7def97c8-9a2c-4515-8a87-e24b40801603
📥 Commits

Reviewing files that changed from the base of the PR and between 868bd31 and 70adeea.

📒 Files selected for processing: 3
  • src/InputNumber.tsx
  • src/StepHandler.tsx
  • tests/renderability.test.tsx

Included review availability: This review used your included allowance. Your plan provides up to 2 included reviews per hour; 1 remain after this review.

Walkthrough

InputNumber 新增 upAriaLabel 和 downAriaLabel 属性,并将其传递给对应的 StepHandler。StepHandler 使用自定义名称;未提供时,继续使用原有的英文默认名称。新增测试验证可按自定义名称查询两个按钮。

Changes

步进按钮可访问名称

Layer / File(s) Summary
名称属性与按钮渲染
src/InputNumber.tsx, src/StepHandler.tsx, tests/renderability.test.tsx
InputNumber 新增 upAriaLabel 和 downAriaLabel 属性,并传递给对应的 StepHandler。StepHandler 优先使用自定义 aria-label;未提供时,根据 action 使用 Increase Value 或 Decrease Value。测试验证两个按钮可分别通过自定义名称查询。

Priority: ➖ Normal

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Feature · Severity of issue fixed: Medium

Suggested reviewers: qdyanbing

Merge Risk: ⚪ Minimal · up to 70ade

No concrete merge-blocking risk remains; the requested accessibility customization is implemented with backward-compatible defaults.

Pre-merge checks: Passed 4 · Failed 1

Failed Failed checks: 1 warning

Check name Status Explanation Resolution
Docstring Coverage Warning Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 3 files. Write docstrings for the functions missing them to satisfy the coverage threshold.
Passed Passed checks: 4 passed
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed 标题准确概括了本次变更:为步进处理器支持通过 upAriaLabel 和 downAriaLabel 设置自定义可访问名称。
Linked Issues check Passed PR 满足 #757 的编码要求。InputNumberProps 新增可选的 upAriaLabel 和 downAriaLabel,并将它们传给对应的 StepHandler。StepHandler 在提供自定义值时使用该值;未提供时保留 Increase Value 和 Decrease Value 默认值。测试验证了两个自定义可访问名称可以通过按钮角色查询。
Out of Scope Changes check Passed 变更范围与 #757 一致。变更仅涉及公开属性、StepHandler 的 aria-label 处理,以及对应的渲染测试。默认行为测试也保持有效。未发现与自定义步进按钮可访问名称无关的变更。
✨ Finishing Touches: 💡 1
🛠️ Fix failing CI checks: 💡
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Warning

Some tools did not complete. Review the errors below.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

小兔带来新标签,
上下按钮各有名。
法语名称轻轻放,
默认英文仍分明。
屏幕朗读声中,
每个步进都可听清。

Comment @coderabbitai help to get the list of available commands.

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Stepper accessible name is a hardcoded English literal with no prop or locale to change it

1 participant