Bug Bash

Astryx Quality Checklist

Reusable quality patterns distilled from the Feb 26, 2026 Bug Bash. Use when reviewing PRs or auditing components.

---

Storybook

• Every prop with finite values has a working control that actually updates the component
• Description is present, human-written, and explains what the component does
• Code examples at the top of the story render correctly (no parsing issues)
• All prop variants, status states, and loading states have at least one story
• Interactive behavior is demonstrated (scrolling, dragging, toggling)

Spacing & Sizing

• Padding, height, and border-radius values match design tokens exactly
• Size variants (sm/md/lg) have reasonable visual progression — no jarring jumps
• Clickable areas are consistent with sibling elements; nav items have uniform edge padding

Prop API

• Similar props use the same name across components (don't mix onChange / onValueChange / onChangeAction)
• Mutually exclusive booleans should be a single enum
• All form elements using Field expose the same field-level props (description, status, statusMessage)
• isLabelHidden hides all label-adjacent content, not just the label

Visual

• Component looks correct in both light and dark themes
• Hover/focus states have sufficient contrast (especially on primary/filled variants)
• Arrows/chevrons point the correct direction for expand/collapse state
• Icons use the correct variant (outline vs filled per design guidance)

Layout

• Components render correctly on both surface and wash backgrounds
• Scrolling content scrolls; drag interactions release cleanly
• Text and icons are vertically centered with siblings

Accessibility

• Keyboard navigation works for all interactive elements
• Any hover-triggered preview also works via keyboard focus
• Autocomplete is disabled on inputs where it doesn't make sense

Naming

• Names are clear and standard, not internal jargon
• Size/density variant names are neutral (sm/md/lg)

---

Severity Guide

Severity	Criteria
P0	Component doesn't render, crashes, or core feature is non-functional
P1	Significant visual or functional bug visible to most users
P2	Cosmetic issue, missing story, or confusing API
P3	Polish — naming, description cleanup, story organization

Priority Components

Highest-traffic for early adopters: Button, TextInput, Dialog, Table, Avatar, Card, Banner