# `PhoenixStorybook.Stories.Attr`
[🔗](https://github.com/phenixdigital/phoenix_storybook/blob/v1.1.0/lib/phoenix_storybook/stories/attr.ex#L1)

An attr is one of your component attributes. Its structure mimics the LiveView 0.18.0 declarative
assigns.

Attributes declaration will populate the Playground tab of your storybook, for each of your
components.

# `t`

```elixir
@type t() :: %PhoenixStorybook.Stories.Attr{
  default: any(),
  doc: String.t() | nil,
  examples: [any()] | nil,
  id: atom(),
  required: boolean(),
  type:
    :any
    | :string
    | :atom
    | :boolean
    | :integer
    | :float
    | :map
    | :list
    | :global
    | module(),
  values: [any()] | nil
}
```

- `id`: the attribute id (required). Should match your component assign.
- `type`: the attribute type (required). Must be one of:
  * `:any` - any term
  * `:string` - any binary string
  * `:atom` - any atom
  * `:boolean` - any boolean
  * `:integer` - any integer
  * `:float` - any float
  * `:map` - any map
  * `:list` - a List of any arbitrary types
  * `:global`- any common HTML attributes,
  * Any struct module
- `required`: `true` if the attribute is mandatory.
- `default`: attribute default value.
- `examples` the list or range of examples suggested for the attribute
- `values` the list or range of all possible examples for the attribute. Unlike examples, this
   option enforces validation of the default value against the given list.
- `doc`: a text documentation for this attribute.

---

*Consult [api-reference.md](api-reference.md) for complete listing*