القائمة
Creates and runs previews with Flutter's official Widget Previewer using `@Preview` from `package:flutter/widget_previews.dart`. Use when the user asks to preview, showcase, inspect, or smoke-test a Flutter widget in the Widget Previewer.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Behavioral guidelines for Flutter base tasks: clarify ambiguity, keep changes simple and surgical, and define verifiable success criteria before coding.
Scaffolds a new feature module under apps/main/lib/presentation/modules using the bundled module generator
Reviews UI-layer changes — screens, blocs, widgets, routes — against the template's StateBase + CoreBlocBase + fl_theme conventions
Awareness index of every reusable widget in fl_ui, fl_theme, fl_media, and core's common_widget — name, one-line purpose, when to reach for it instead of writing a new one
Builds the data layer with Freezed DTOs, Retrofit clients, the storage-seam local data manager, and repositories wired through injectable
Teaches and applies Flutter/Dart dependency injection with Injectable + GetIt, grounded in this repo's Clean Architecture and code generation conventions. Use when changing DI wiring, adding BLoCs/use cases/repositories/modules, using @Named/@preResolve/@factoryParam/env registrations, reviewing DI best practices, or setting up DI tests.
| name | fl-widget-preview |
| description | Creates and runs previews with Flutter's official Widget Previewer using `@Preview` from `package:flutter/widget_previews.dart`. Use when the user asks to preview, showcase, inspect, or smoke-test a Flutter widget in the Widget Previewer. |
| license | MIT |
| metadata | {"audience":"flutter-developers","framework":"flutter","pattern":"widget-preview"} |
@Preview coverage for reusable UI, theme, or core widgets.Flutter Widget Previewer renders widgets in Chrome, separate from the app. It requires Flutter 3.35+; IDE support requires Flutter 3.38+. The API is experimental, so verify https://docs.flutter.dev/tools/widget-previewer before broad preview infrastructure changes.
Do not introduce Widgetbook, Storybook, or custom preview apps unless the user explicitly asks.
Import the preview API in the package that owns the widget:
import 'package:flutter/material.dart';
import 'package:flutter/widget_previews.dart';
@Preview(name: 'Feature card')
Widget featureCardPreview() => const FeatureCard();
@Preview can annotate top-level functions, static methods, and public Widget constructors/factories with no required arguments. Functions and methods must return Widget or WidgetBuilder.
Use deterministic, non-secret preview data. Keep preview-only state outside production config and generated files.
Use @Preview parameters instead of new infrastructure:
name and group for discoverability.size for realistic constraints, especially mobile widths and unconstrained widgets.textScaleFactor for accessibility checks.brightness for light/dark variants.wrapper for required ancestors such as MaterialApp, localization, providers, or inherited state.theme and localizations for Material/Cupertino theme and locale configuration.Apply multiple @Preview annotations to one function for state variants. Use custom Preview or MultiPreview annotations only when repeated configuration is already noisy.
Match enough production context for the widget to render honestly:
MaterialApp/Scaffold for Material widgets.context.themeColor, context.textTheme, or ScreenForm.All callback values passed to preview annotations must be public and constant so previewer code generation can read them.
From the Flutter package root that contains the previews:
fvm flutter widget-preview start
Check .fvm_cache; if USING_FVM=1, use fvm flutter, otherwise use flutter. IDEs expose a "Flutter Widget Preview" tab when supported.
Run the previewer yourself when the local Flutter toolchain is available. Ask the user only for setup you cannot perform.
dart:io / dart:ffi APIs are unsupported because the previewer uses Flutter Web.dart:ui fromAsset APIs must use package-based paths such as packages/my_package/assets/foo.png.size when constraints matter; default unconstrained behavior is not stable.fl-testing skill and flutter_skill guidance separately.