Renders a simple button component.

Attributes

• :class - Additional CSS classes to apply to the button. Defaults to nil.
• :primary - A boolean indicating if the button should use the primary style. Defaults to false.
• :light - A boolean indicating if the button should use the light style. Defaults to false.
• :danger - A boolean indicating if the button should use the danger style. Defaults to false.
• :inline - A boolean indicating if the button should use the inline style. Defaults to false.
• :rest - A map of additional global attributes (e.g., disabled, form, name, value, type) to apply to the button.

Slots

• :inner_block (required) - The content to render inside the button.

Styles

The button supports multiple styles based on the attributes provided:

• :primary: A blue button with a hover effect.
• :light: A light gray button with a hover effect.
• :danger: A red button for destructive actions.
• :inline: A white button with a border and hover effects, suitable for inline usage.

Attributes

• class (:any) - Defaults to nil.
• primary (:boolean) - Defaults to false.
• light (:boolean) - Defaults to false.
• danger (:boolean) - Defaults to false.
• inline (:boolean) - Defaults to false.
• Global attributes are accepted. Supports all globals plus: ["type", "disabled", "form", "name", "value"].

Slots

• inner_block (required)

Renders a dropdown button with a customizable label and a list of actions.

Attributes

• :label (string, optional): The label displayed on the dropdown button.
• :id (string, required): A unique identifier for the dropdown component.

Slots

• :action: Defines the actions available in the dropdown menu. Each action can have the following attributes:
  • :label (string, optional): The label for the action.
  • :icon (string, optional): The name of the icon to display next to the action.
  • :event (string, optional): The event triggered when the action is clicked.
  • :target (any, optional): The target for the phx-click event.
  • :value (any, optional): The value passed with the phx-click event.

Attributes

• label (:string)
• id (:string) (required)

Slots

• action - Accepts attributes:
  • label (:string)
  • icon (:string)
  • event (:string)
  • target (:any)
  • value (:any)

Renders a toggle switch with icons on the left and right sides.

Attributes

• :left_icon (string, required): The name of the icon to display on the left side of the toggle switch.
• :right_icon (string, required): The name of the icon to display on the right side of the toggle switch.
• :event (string, required): The event name triggered when the toggle switch is clicked.
• :target (optional): The target for the phx-click event.
• :left (boolean, required): Determines if the toggle is in the "left" position.
• :right (boolean, required): Determines if the toggle is in the "right" position.

Attributes

• left_icon (:string) (required)
• right_icon (:string) (required)
• event (:string) (required)
• target (:any) - Defaults to nil.
• left (:boolean) (required)
• right (:boolean) (required)