[Skill idea] flutter-create-bottom-sheet-flow — scaffold a typed-result bottom sheet

[cdmunoz]

Environment

• Language model: Claude Opus 4.7
• Agent harness: Claude Code
• Project type: Production Flutter app

Problem

Bottom sheets are one of the most common UX patterns in production Flutter apps, and one of the most frequently misimplemented:

• Wrong route type (MaterialPageRoute instead of a transparent route)
• Missing typed result on close (forcing callers to dynamic-cast)
• Height management mistakes (fitToContent vs heightFactor, max-height clamping)
• isDismissible / enableDrag / useSafeArea defaults inconsistent across the app

The current Navigation/Routing roadmap has flutter-implement-imperative-navigation (P1) and flutter-setup-declarative-routing (published), but no skill addresses the bottom-sheet flow specifically.

Proposed skill

Name: flutter-create-bottom-sheet-flow

Description (draft):

Scaffold a bottom sheet route with typed pop result, height management (fitToContent vs fractional height), and dismissible/drag configuration. Use when adding a modal flow that returns data to its caller, such as a confirmation, picker, or detail panel.

Decisions the skill captures:

• Typed Result class vs nullable return
• fitToContent (max 70% height recommended) vs fixed heightFactor
• isDismissible + enableDrag policy
• Caller-side wiring (how the parent ViewModel triggers and consumes the result)

Why a dedicated skill

Bottom sheets sit at the intersection of routing + UI + state contract. A general "navigation" skill won't cover the result-typing and height-management decisions specific to sheets. Doing it as a separate skill keeps both skills small and focused.

Real-world reference

We maintain this as an internal skill and it eliminated a recurring class of "sheet pops dynamic, caller crashes" bugs. Happy to share the template structure.

Roadmap fit

Sits in the Navigation and Routing category alongside flutter-implement-imperative-navigation.