The Widgetbook Figma Addon allows you to display a Figma preview on the right side of each UseCase in Widgetbook.
Install package:
flutter pub add widgetbook_figma_addon
Add FigmaAddon
to Widgetbook addons and set an unique figmaProjectName
:
Widgetbook.material(
directories: directories,
addons: [
FigmaAddon(
figmaProjectName: 'Your Project Name',
),
],
);
Add designLink
to your Use Cases where you want to show the figma preview
@UseCase(
name: 'Primary',
type: Button,
designLink: 'https://www.figma.com/design/...')
Widget primaryButton(BuildContext context) {
return Button(
text: 'Primary',
state: ButtonState.primary,
);
}