project-widget

Generate Flutter widget packages with Mason templates and barrel exports.

2|Updated Jul 3, 2025

Search Tags:#widget #flutter #ui component #reusable #mason #platform adaptive

Ready to run

npx skills add https://github.com/gsmlg-app/flutter-app-template --skill project-widget

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: project-widget
Source: https://github.com/gsmlg-app/flutter-app-template/tree/main/.claude/skills/project-widget
Command: npx skills add https://github.com/gsmlg-app/flutter-app-template --skill project-widget

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) components.

What problem does it solve?

This Skill streamlines the creation of reusable, platform-adaptive UI components within the Flutter project's established monorepo structure, ensuring consistency and efficiency in UI development.

Core Features & Use Cases

Guided Widget Creation: Utilizes Mason templates for scaffolding new widget packages.
Platform Adaptability: Supports building widgets that work seamlessly on both Material and Cupertino platforms.
Project Conventions: Enforces the project's app_widget/ directory structure and barrel export pattern.
Use Case: When you need to create a new button component that should look and behave correctly on both iOS and Android, use this skill to generate the necessary package structure and initial code.

Quick Start

Use the project-widget skill to create a new stateless button widget named 'PrimaryButton' in the 'buttons' subfolder.

Frequently Asked Questions about project-widget

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create reusable Flutter widgets for both Material and Cupertino platforms?▼

To create reusable Flutter widgets, use Mason templates to scaffold new packages with optional platform-specific implementations for Material and Cupertino designs. This enforces project conventions and generates both stateless and stateful components.

What is the best way to structure a Flutter monorepo for reusable UI components?▼

Structuring a Flutter monorepo for reusable UI components involves using an `app_widget/` directory structure with barrel export conventions. This Skill guides package creation to maintain consistency and enforce project-specific directory layouts.

Can I generate both stateless and stateful widgets using Mason templates?▼

Yes, you can generate both stateless and stateful widgets using Mason templates. The Skill guides the creation of new widget packages, supporting optional platform-specific implementations for both Material and Cupertino designs.

Do I need a specific directory structure to build platform-adaptive UI components in Flutter?▼

Yes, building platform-adaptive UI components requires a specific `app_widget/` directory structure and barrel export pattern. The Skill enforces these project conventions to ensure consistent UI development within your Flutter monorepo.

How does scaffolding a new button component work with Mason in a Flutter monorepo?▼

Scaffolding a new button component with Mason generates the necessary package structure and initial code within your Flutter monorepo. It ensures the widget adheres to barrel export conventions and supports both iOS and Android platforms.

Why should I use a template generator for Flutter UI component development?▼

Using a template generator streamlines the creation of reusable, platform-adaptive UI components within a Flutter monorepo. It enforces consistent directory structures and barrel export patterns, ensuring efficiency and consistency across new widget packages.