Skip to content

fix: [command, data-view] close keyboard and screen reader gaps - #929

Merged
rohanchkrabrty merged 4 commits into
mainfrom
fix/a11y-custom-components
Oct 5, 2026
Merged

rohanchkrabrty merged 4 commits into
mainfrom
fix/a11y-custom-components

Conversation

@rohanchkrabrty

@rohanchkrabrty rohanchkrabrty commented Sep 29, 2026 •

Copy link
Copy Markdown
Contributor

Summary

  • Command.Item passes disabled to the Base UI item instead of rendering a raw div. Arrow keys reach disabled items, and Enter does not activate them.
  • The DataView "hidden by filters" footer has a visually hidden role="status" span (data-view-filter-summary-status). List, Timeline and DataView.ClearFilters (empty state) render it. It announces the footer text, for example "3 items hidden by filters", once the search and filters stop changing for 500ms. The span stays rendered when the footer is hidden, so later changes are announced.
  • The DataView add-filter and sort direction icon buttons have accessible names: "Add filter", and "Sort direction: ascending" or "Sort direction: descending".
  • The Menu and ContextMenu synthetic key events stay, because Base UI does not handle composition correctly.
  • Dialog and Tooltip get no :focus-visible rules: neither styles a keyboard-focusable element, and the Dialog close button gets its ring from IconButton.

Closes #878

Command.Item passes disabled to the Base UI item, so arrow keys reach
disabled items and Enter does not activate them.

DataView.Toolbar announces the result count in a role="status" region
while a search or filter is active. The add-filter and sort direction
icon buttons have accessible names.
@vercel

vercel Bot commented Sep 29, 2026 •

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated
apsara Ready Ready Preview Oct 4, 2026 8:47pm UTC

@coderabbitai

coderabbitai Bot commented Sep 29, 2026 •

Copy link
Copy Markdown
Contributor

Warning

Review limit reached

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Next included review available in 13 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: abc3dbd4-bea3-42ec-b24e-f006542c3e9d
📥 Commits

Reviewing files that changed from the base of the PR and between d088032 and a9cbb82.

📒 Files selected for processing (10)
  • apps/www/src/content/docs/components/command/index.mdx
  • apps/www/src/content/docs/dataview/index.mdx
  • packages/raystack/components/command/__tests__/command.test.tsx
  • packages/raystack/components/command/command-item.tsx
  • packages/raystack/components/data-view/__tests__/data-slots.test.tsx
  • packages/raystack/components/data-view/__tests__/data-view.test.tsx
  • packages/raystack/components/data-view/components/clear-filters.tsx
  • packages/raystack/components/data-view/components/filters.tsx
  • packages/raystack/components/data-view/components/ordering.tsx
  • packages/raystack/components/data-view/data-view.module.css
  • Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

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.

@pkg-pr-new

pkg-pr-new Bot commented Sep 29, 2026 •

Copy link
Copy Markdown

Open in StackBlitz

pnpm add https://pkg.pr.new/@raystack/apsara@929

commit: a9cbb82

Comment thread packages/raystack/components/data-view/components/ordering.tsx
Comment thread packages/raystack/components/data-view/components/toolbar.tsx Outdated
Server mode has no count of matching results, and a count that changes on every keystroke makes screen readers announce once per key. The toolbar status now reads the footer text, debounced by 500ms.
The status region is a span inside FilterSummary, so List and Timeline announce the footer text. The span stays rendered when the footer is hidden, because a live region announces only text that changes after it mounts.
"Sort ascending" read as an action, but pressing it sorts descending.
@rohanchkrabrty
rohanchkrabrty merged commit f1d2fd2 into main Oct 5, 2026
9 checks passed
@rohanchkrabrty
rohanchkrabrty deleted the fix/a11y-custom-components branch October 5, 2026 07:46

This branch was successfully deployed

1 active deployment
Preview — a9cbb82f Deployed Oct 4, 2026 by vercel[bot]
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.

Accessibility rough edges in custom (non-Base-UI) components

2 participants