Tags Reference

See the preview tag annotations overview for more details.

Sets the label displayed in the nav.

@label <text>

<text>

Text to use for the label

Type: String

# @label Primary Button
def main_but

@hidden <value?>

<value?>

Whether to hide the entity or not

Type: String

# @label hidden
def not_ready

Groups examples together for rendering in a single preview.

@!group <name?> ... @!endgroup

<name?>

Optional group name. Will default to the name of the first example in the group if not provided.

Type: String

# @!group
def example_one
end
def example_two
end
# @!endgroup

Specifies a dynamic preview parameter that will be editiable in the UI via a form input. Not valid for preview classes. Example methods only.

@param <name> [<type?>] <input_type?> <opts?>

<name>	Name of the example method parameter that this should be used for Type: String
<type?>	Optional data type to cast the value to before passing to the example as a parameter. Must be wrapped in square brackets. Type: String
<input_type?>	The type of form input to render. Will be guessed if not provided Type: String
<opts?>	YAML-encoded field options (or path to a JSON file of options), used for some field types Type: Array (YAML formatted) \| String

# @param theme [Symbol] select [primary, secondary, danger]
def example(theme: :primary)

Sets the value of a display variable for use in preview layouts.

@display <key> <value>

# @display bg_color "#000" 
def light_on_dark

Identifies the component being rendered in the preview. Only necessary when it is not possible to guess it from the preview class name.

Can be applied multiple times if there is more than one component being rendered,

@component <class_name>

# @component Elements::ButtonComponent
# @component Elements::ToggleComponent
class InteractiveComponentsPreview < ViewComponent::Preview