SigmaKit.Components.Buttons (sigma_kit v0.0.9)
Summary
Functions
Attributes
id
(:string
) (required)class
(:any
) - Defaults tonil
.
Slots
action
- overflow items presented as a dropdown menu. Accepts attributes:class
(:any
) - Additional classes to apply to the menu item.divider
(:boolean
) - This item will create a dividing line.label
(:string
) - The label for the menu item.event
(:string
) - The phx-click event for the menu item.value
(:string
) - The phx-value for the menu item.value_id
(:string
) - The phx-value-id for the menu item.target
(:string
) - The phx-target for the menu item.icon
(:string
) - The icon for the menu item.
Renders a simple button component.
Renders a dropdown button with a customizable label and a list of actions.
Attributes
label
(:string
) - The label displayed on the dropdown button. Defaults tonil
.id
(:string
) (required) - A unique identifier for the dropdown component.inline
(:boolean
) - Apply the inline style to the dropdown button. Defaults totrue
.plain
(:boolean
) - Applies no border or color to the button. Defaults tofalse
.icon
(:string
) - The name of the icon to display on the button. Defaults tonil
.options
(:list
) - A list of dropdown options in the form of a label/value tuples. Defaults to[]
.event
(:any
) - The event to fire when an item is selected. Defaults tonil
.value
(:any
) - The currently selected value. Defaults tonil
.target
(:any
) - The target for the selection event. Defaults tonil
.
Renders a toggle switch with icons on the left and right sides.
Functions
Attributes
id
(:string
) (required)class
(:any
) - Defaults tonil
.
Slots
action
- overflow items presented as a dropdown menu. Accepts attributes:class
(:any
) - Additional classes to apply to the menu item.divider
(:boolean
) - This item will create a dividing line.label
(:string
) - The label for the menu item.event
(:string
) - The phx-click event for the menu item.value
(:string
) - The phx-value for the menu item.value_id
(:string
) - The phx-value-id for the menu item.target
(:string
) - The phx-target for the menu item.icon
(:string
) - The icon for the menu item.
Renders a simple button component.
Attributes
class
(:any
) - Additional CSS classes to apply to the button. Defaults tonil
.primary
(:boolean
) - Apply the primary style to the button. Defaults tofalse
.dark
(:boolean
) - Apply a dark style to the button. Defaults tofalse
.light
(:boolean
) - Apply the light style to the button. Defaults tofalse
.danger
(:boolean
) - Apply the danger style to the button. Defaults tofalse
.inline
(:boolean
) - Apply the inline style to the button. Defaults tofalse
.plain
(:boolean
) - Apply no border or shadow to the button. Defaults tofalse
.- Global attributes are accepted. Additional attributes to apply to the button. Supports all globals plus:
["type", "disabled", "form", "name", "value"]
.
Slots
inner_block
(required) - The content to render inside the button.
Renders a dropdown button with a customizable label and a list of actions.
Attributes
label
(:string
) - The label displayed on the dropdown button.id
(:string
) (required) - A unique identifier for the dropdown component.inline
(:boolean
) - Apply the inline style to the dropdown button. Defaults totrue
.plain
(:boolean
) - Applies no border or color to the button. Defaults tofalse
.icon
(:string
) - The name of the icon to display on the button.
Slots
action
- A dropdwn menu item. Accepts attributes:divider
(:boolean
) - This item will create a dividing line.label
(:string
) - The label for the menu item.icon
(:string
) - The name of the icon to display.event
(:string
) - The event triggered when the menu item is clicked.target
(:any
) - The target for thephx-click
event.value
(:any
) - The value passed with thephx-click
event.
Attributes
label
(:string
) - The label displayed on the dropdown button. Defaults tonil
.id
(:string
) (required) - A unique identifier for the dropdown component.inline
(:boolean
) - Apply the inline style to the dropdown button. Defaults totrue
.plain
(:boolean
) - Applies no border or color to the button. Defaults tofalse
.icon
(:string
) - The name of the icon to display on the button. Defaults tonil
.options
(:list
) - A list of dropdown options in the form of a label/value tuples. Defaults to[]
.event
(:any
) - The event to fire when an item is selected. Defaults tonil
.value
(:any
) - The currently selected value. Defaults tonil
.target
(:any
) - The target for the selection event. Defaults tonil
.
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
(:any
) - The target for thephx-click
event. Defaults tonil
.left
(:boolean
) (required) - Determines if the toggle is in the 'left' position.right
(:boolean
) (required) - Determines if the toggle is in the 'right' position.