Create/Update Pull Request for Overdrive

Create or update a pull request following AutoGuru Overdrive development practices.

Overdrive Development Practices

Code Quality Standards

✅ NO new dependencies - use existing dependencies only
✅ Design tokens only - no hardcoded values, use tokens from themes/
✅ Compose from primitives - build from Box, Text, Icon, Stack, etc.
✅ Fix all linting/TypeScript errors in modified files before PR
✅ Set displayName on all components
✅ Use React Aria for interactive components (accessibility)
✅ State via data attributes managed by dataAttrs helper
✅ Vanilla Extract styling - all styles use CSS-in-TypeScript
✅ Sprinkles utility system for responsive design and consistency
✅ Component styles wrapped in cssLayerComponent CSS layer

Architecture Requirements

📁 Component structure: ComponentName.tsx, ComponentName.css.ts, ComponentName.stories.tsx, ComponentName.spec.tsx (if needed), index.ts
🎨 Styling approach: Vanilla Extract + Sprinkles for responsive, token-driven styles
📖 Storybook stories required for all components (1 or more stories: Standard, Variants, Interactivity test)
🧪 Testing strategy: Focus on Storybook stories over unit tests; use composeStories pattern
👆 Interaction testing: For components with interactive states ensure a Storybook play function exists with interactiona assertions
♿ Accessibility: Keyboard navigation, screen readers, focus management, semantic queries in tests

Quality Checklist

🚫 No ESLint errors
🚫 No TypeScript errors
🚫 No unused imports
🚫 No console statements
🚫 No inline styles
🚫 No magic numbers (use design tokens)
🚫 No any types (use unknown or proper types)
✅ JSDoc comments on props
✅ Consistent naming conventions

PR Creation Process

!git status !git diff --cached !git log --oneline -10

Branch: $ARGUMENTS

Pre-PR Checks

Run quality checks: yarn lint && yarn test run
If any component has been changed/added/removed generate a changeset: yarn changeset and populate one comment like per component
Check for existing PR on this branch
Ensure changes follow Code Quality Standards, Architecture Requirements and Quality Checklist above

PR Management Strategy

If PR exists: Update the existing PR with new commits and enhanced description
If no PR exists: Create new PR in DRAFT MODE with comprehensive summary following the practices above

Please analyze the current branch changes and either:

Update existing PR (if PR #1247 exists for current branch) with additional commits and enhanced description
Create new PR in DRAFT MODE with detailed summary covering:
- Component changes and styling improvements
- Architecture adherence (Vanilla Extract + Sprinkles)
- Testing coverage (Storybook stories + accessibility)
- Quality compliance (linting, TypeScript, best practices)

PR Description Template

## Summary
- Detailed explantation of larger changes, short summary of any smaller changes
- Emphasise changes to architecture, patterns or developer impact

## Breaking Changes [only output if any present]
- [describe any breaking changes]

/pr Command