Startboard project

Startboard / Design system

Documentation v1.0.0 · Public product

Design system contents

Components

Board management list

Settings lists ordered collections with a protected home board and editable rows.

On this page

Purpose and placement

Settings lists ordered collections with a protected home board and editable rows.

Anatomy

  • Locked home icon
  • Drag handle on unlocked boards
  • Board title action
  • Hover/touch delete action

Contract

Contract
Input or boundaryBehavior
boardsOrdered BoardResponse list
isLockedDisables sorting/edit/delete controls
OrderPATCH order array
RemovalConfirm; DELETE board and contained links

States and feedback

  • Default list
  • Hovered unlocked row
  • Edit overlay
  • Dragging overlay
  • Deleted row after success

Interaction and composition

Move unlocked rows vertically. dnd-kit DragOverlay retains row anatomy while moving. The home board is disabled as a drag source and rejected as a drop target. Delete explicitly warns that contained links are also removed.

Responsive behavior

Rows use fixed horizontal padding and 40px handle areas. Touch media rules make remove controls visible rather than waiting for hover.

Accessibility contract

Board title and delete are native buttons. Drag attributes are present, but only pointer/touch sensors are configured. Locked home title remains a button that does nothing.

Known implementation gaps

Ordering changes optimistically without error recovery. Hover-hidden delete controls need keyboard-focus styling and discoverability review.

Source references

Source references
Repository fileResponsibility
app/settings/boards/BoardsList.tsxSortableBoardRow and list
app/api/boards/route.tsOrder and removal API

Examples from the app

Actual Startboard source UI with isolated fictional records; both native themes at 2× resolution or higher. No live integrations or account writes. Captured at 2× resolution or higher. Select an image to inspect it full size.

Settings Boards Default Desktop Light · Screen · Light · Desktop · 2880 × 2176 px

Source audit: 2026-10-08 · Revision 08fa2595a668 · Documentation v1.0.0