View Source PhoenixStorybook.Stories.Variation (phoenix_storybook v0.7.2)

A variation captures the rendered state of a UI component. Developers write multiple variations per component that describe all the “interesting” states a component can support.

Each variation will be displayed in the storybook as a code snippet alongside with the component preview.

Variations attributes type are checked against their matching attribute (if any) and will raise a compilation an error in case of mismatch.

Advanced component & variation documentation is available in the components guide.

Usage 

  def variations do
    [
      %Variation{
        id: :default,
        description: "Default dropdown",
        attributes: %{
          label: "A dropdown",
        },
        slots: [
          ~s|<:entry path="#" label="Account settings"/>|,
          ~s|<:entry path="#" label="Support"/>|,
          ~s|<:entry path="#" label="License"/>|
        ]
      }
    ]
  end

Summary

Types

t()

Types

t()

@type t() :: %PhoenixStorybook.Stories.Variation{
  attributes: map(),
  description: String.t() | nil,
  id: atom(),
  let: atom() | nil,
  slots: [String.t()],
  template: :unset | String.t() | nil | false
}