LineaUI.Components.Checkbox (linea_ui v0.1.1)

Copy Markdown View Source

LineOne's checkboxes: basic (filled when checked) or outline (a colored check on a clear box), on a plain or a filled box, square or circle, in every theme color.

<.checkbox name="terms" label="I agree" />
<.checkbox field={@form[:remember]} label="Remember me" color="primary" />
<.checkbox name="news" color="success" variant="outline" shape="circle" filled />
<.checkbox name="pro" label="Pro plan" description="Billed yearly" color="primary" checked />

checkbox_group renders one checkbox per option for a list field:

<.checkbox_group field={@form[:roles]} label="Roles" options={[{"Admin", "admin"}, {"Editor", "editor"}]} />

Summary

Functions

Renders a checkbox with its label. Inside a form it sends unchecked_value when unchecked, through a hidden input, so the field is always present in the params.

Renders one checkbox per option, for a field that holds a list. Options are {label, value} tuples, plain values, or :checkbox slots (which may set their own color).

Functions

checkbox(assigns)

Renders a checkbox with its label. Inside a form it sends unchecked_value when unchecked, through a hidden input, so the field is always present in the params.

Attributes

  • field (Phoenix.HTML.FormField) - Defaults to nil.
  • id (:string) - Defaults to the field's id.
  • name (:string) - Defaults to the field's name.
  • value (:any)
  • checked (:boolean) - Defaults to whether value (or the field's value) is true.
  • checked_value (:string) - Defaults to "true".
  • unchecked_value (:string) - Defaults to "false".
  • hidden_input (:boolean) - Renders the hidden unchecked input. Defaults to true.
  • color (:string) - Defaults to "neutral". Must be one of "neutral", "primary", "secondary", "info", "success", "warning", or "error".
  • variant (:string) - Defaults to "basic". Must be one of "basic", or "outline".
  • filled (:boolean) - A tinted box while unchecked. Defaults to false.
  • shape (:string) - Defaults to "square". Must be one of "square", or "circle".
  • size (:string) - Defaults to "md". Must be one of "xs", "sm", "md", or "lg".
  • label (:string) - The caption. Defaults to nil.
  • label_class (:any) - Classes of the caption text. Defaults to nil.
  • description (:string) - A smaller grey line under the label. Defaults to nil.
  • errors (:list) - Messages to show; field adds its own once the input was used. Defaults to [].
  • disabled (:boolean) - Defaults to false.
  • wrapper_class (:any) - Classes of the outer block (grid placement, spacing). Defaults to nil.
  • class (:any) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["form", "required"].

Slots

  • inner_block - Label content, instead of label.

checkbox_group(assigns)

Renders one checkbox per option, for a field that holds a list. Options are {label, value} tuples, plain values, or :checkbox slots (which may set their own color).

<.checkbox_group name="days[]" value={["mon"]} options={[{"Monday", "mon"}, {"Tuesday", "tue"}]} />

<.checkbox_group field={@form[:roles]} label="Roles" class="flex flex-col space-y-2">
  <:checkbox value="admin" color="primary">Admin</:checkbox>
  <:checkbox value="editor" color="success">Editor</:checkbox>
</.checkbox_group>

Attributes

  • field (Phoenix.HTML.FormField) - Defaults to nil.
  • id (:string) - Defaults to the field's id.
  • name (:string) - Defaults to the field's name.
  • value (:any)
  • options (:list) - Defaults to [].
  • color (:string) - Defaults to "neutral". Must be one of "neutral", "primary", "secondary", "info", "success", "warning", or "error".
  • variant (:string) - Defaults to "basic". Must be one of "basic", or "outline".
  • filled (:boolean) - Defaults to false.
  • shape (:string) - Defaults to "square". Must be one of "square", or "circle".
  • size (:string) - Defaults to "md". Must be one of "xs", "sm", "md", or "lg".
  • label (:string) - The caption. Defaults to nil.
  • label_class (:any) - Classes of the caption text. Defaults to nil.
  • help (:string) - The small line under the control. Defaults to nil.
  • errors (:list) - Messages to show; field adds its own once the input was used. Defaults to [].
  • disabled (:boolean) - Defaults to false.
  • wrapper_class (:any) - Classes of the outer block (grid placement, spacing). Defaults to nil.
  • class (:any) - Classes of the container that lays the options out. Defaults to nil.
  • Global attributes are accepted.

Slots

  • checkbox - Accepts attributes:
    • value (:any) (required)
    • label (:string)
    • color (:string)
    • disabled (:boolean)
    • description (:string)