ui-package

Featured

Best practices for building a Flutter UI package on top of Material, covering custom components, ThemeExtension-based theming, consistent APIs, widget tests, and scaffolding from the app_ui_package template. Use when creating a UI package and whenever working inside one: adding or reviewing a widget, wiring design tokens, exporting through the barrel file, or writing tests for a widget that lives in a UI package. Triggers on "create a ui package", "add a widget to our ui package", "add a design token", "export it from the barrel", "write tests for this widget in my ui package", and on any request naming a package whose job is shared widgets and design tokens.

Web & Frontend 161 stars 22 forks Updated yesterday MIT

Install

View on GitHub

Quality Score: 87/100

Stars 20%
74
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# UI Package Best practices for creating a Flutter UI package — a reusable widget library that builds on top of `package:flutter/material.dart`, extending it with app-specific components, custom design tokens via `ThemeExtension`, and a consistent API surface. > **Theming foundation:** This skill focuses on UI package structure, widget APIs, and testing. For foundational Material 3 theming (`ColorScheme`, `TextTheme`, component themes, spacing constants, light/dark mode), see the **Material Theming** skill (`/material-theming`). The two skills are complementary — Material Theming covers how to set up and use `ThemeData`; this skill covers how to extend it with `ThemeExtension` tokens and package reusable widgets around it. ## Core Standards Apply these standards to ALL UI package work: - **Scaffold from the `app_ui_package` template** — create the package with the Very Good CLI MCP tool, `subcommand: 'app_ui_package'`. Never `flutter_package`, never `dart_package`, never `flutter create --template=package`; those produce a bare package with none of the theme, barrel, test-helper, or Widgetbook scaffolding below - **Build on Material** — depend on `flutter/material.dart` and compose Material widgets; do not rebuild primitives that Material already provides - **One widget per file** — each public widget lives in its own file named after the widget in snake_case (e.g., `app_button.dart`) - **Barrel file for public API** — expose all public widgets and theme classes through ...

Details

Author
VeryGoodOpenSource
Repository
VeryGoodOpenSource/vgv-ai-flutter-plugin
Created
6 months ago
Last Updated
yesterday
Language
Shell
License
MIT

Integrates with

Bundled in these plugins

Similar Skills

Semantically similar based on skill content — not just same category