UI
← Home

File List

A virtualized, multi-selectable data grid — a file-manager details view. It renders only a window of its 100 rows while exposing the full count (aria-rowcount), and rows are selectable with the file-manager model (plain / Cmd-Ctrl / Shift click, Arrow / Shift+Arrow, Ctrl/Cmd+A) — selection that survives rows being recycled as you scroll. Delete removes the selected rows and Ctrl/Cmd+Z puts them back, both announced.

  • Axe
  • Name
  • Roving
  • Focus
  • Select
  • Undo
  • Copy
  • Rename
  • Remove
  • Open

Preview

Name
Size
Kind
File 1
1 KB
Text
File 2
2 KB
Text
File 3
3 KB
Text
File 4
4 KB
Text
File 5
5 KB
Text
File 6
6 KB
Text
File 7
7 KB
Text
File 8
8 KB
Text
File 9
9 KB
Text
File 10
10 KB
Text
File 11
11 KB
Text
File 12
12 KB
Text
File 13
13 KB
Text
File 14
14 KB
Text
File 15
15 KB
Text
File 16
16 KB
Text

Installation

npx shadcn@latest add https://ui.publictheta.com/r/file-list.json

Conformance

Verified against the @publictheta/ui-spec file-list specification on both the React and vanilla reference implementations, across Chromium, Firefox, and WebKit.

  • Axe — No WCAG 2 A/AA axe-core violations
  • Name — The widget container exposes an accessible name
  • Roving — Exactly one tab stop; Arrow keys move within the widget
  • Focus — A visible focus indicator appears on keyboard focus (WCAG 2.4.7)
  • Select — The file-manager selection model: Cmd/Ctrl-click toggles, Shift-click extends from the anchor, Cmd/Ctrl+A selects all and again clears, Escape clears, and the count is announced
  • Undo — What it destroys or moves comes back: Cmd/Ctrl+Z takes the last change back and announces it, Cmd/Ctrl+Shift+Z does it again, and a run of like changes is one step
  • Copy — Cmd/Ctrl+C puts what is selected on the clipboard in every flavour the widget promises — and a touch device, which has no command key, can do the same thing with a control
  • Rename — F2 opens an editor over the value with its text selected; Enter or a blur commits, Escape puts the old name back, Ctrl/Cmd+Z takes the rename back — announced, and reachable by a control as well as by the key
  • Remove — Delete takes it away and Ctrl/Cmd+Z puts it back where it was, announced — and focus lands on what takes its place rather than on the page body, where the undo could no longer be pressed
  • Open — Enter, or a double click, opens the item and says which — and a plain click only selects it, which is the other half of the guarantee

See the full conformance matrix across all components.