# Flutter Storybook

[![Pub Version](https://img.shields.io/pub/v/storybook_flutter)](https://pub.dev/packages/storybook_flutter)

A cross-platform storybook for showcasing widgets. It should work in all platforms supported by Flutter.

* [Demo version](https://ookami-kb.github.io/storybook_flutter/)
* [Documentation](https://ookamikb.gitbook.io/flutter-storybook/)

![](https://github.com/ookami-kb/storybook_flutter/raw/master/meta/preview.png)

## Quick Start

See [Quick Start](https://app.gitbook.com/s/-MXU5AmlAg0rI2HXaXAN/quick-start.md) guide.

## Customization

By default, each story is wrapped into:

```dart
Container(
  color: story.background,
  padding: story.padding,
  child: Center(child: child),
)
```

You can override this behavior by providing either `wrapperBuilder` to the `Story` or `storyWrapperBuilder` to the `Storybook`. In the latest case this wrapper will be applied to each story (of course, you can still override this behavior by providing another `wrapperBuilder` to individual stories).

## CustomStorybook

If you need even more customization, you can use `CustomStorybook`. You have to provide `builder` parameter to it where you can define the custom layout. In this case you're responsible for rendering the story, contents and knobs panel.

You can use `CurrentStory`, `Contents` and `KnobPanel` widgets that will render the corresponding data automatically.

As an example of full customization, take a look at [storybook\_device\_preview](https://pub.dev/packages/storybook_device_preview) package that allows to embed storybook into [device\_preview](https://pub.dev/packages/device_preview) package with knobs and contents rendered as plugins.

## Features and bugs

Please file feature requests and bugs at the [issue tracker](https://github.com/ookami-kb/storybook_flutter/issues).


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://ookamikb.gitbook.io/flutter-storybook/master.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
