raystack / raystack/apsara

[Table] Normalize type signatures and fix sub-pixel border

Open
#642 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

component triage
Dominant language
TypeScript
Stars
70
Forks
13
Avg merge
2d 5h
Merged PRs (30d)
8

Description

Summary

Table is a custom semantic HTML table wrapper using CVA + CSS Modules. Missing displayName on all sub-components, accessibility attributes, and API completeness.

Improvements

6. Normalize type signatures across sub-components

TableHead and TableCell use CVA variants but TableBody and TableRow don't. Inconsistent API surface.

7. Handle text truncation accessibility

Cells use text-overflow: ellipsis which hides content with no tooltip or accessible overflow mechanism.

Moved to Cross-Cutting Issues

The following items have been moved to cross-cutting issues that address them across all components:

  • Replace hardcoded CSS values with design tokens (#672)
  • Accessibility baseline (#673)
  • Add displayName (#676)

Files

  • packages/raystack/raystack/components/table/

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start in packages/raystack/raystack/components/table/ and inspect the type signatures for TableHead, TableCell, TableBody, and TableRow, especially their CVA usage. Then trace how cells apply text-overflow: ellipsis and review the component’s current accessibility behavior. Done means the sub-components expose a consistent API and truncated cell content has an accessible overflow mechanism.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
accessibility, frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.