Corex · Elixir Phoenix Framework UI Library

Minimal

Option

    <.checkbox class="checkbox">
  <:label>Option</:label>
  <:indicator>
    <.heroicon name="hero-check" />
  </:indicator>
</.checkbox>

Label and indicator

Accept the terms

    <.checkbox class="checkbox">
  <:label>Accept the terms</:label>
  <:indicator>
    <.heroicon name="hero-check" />
  </:indicator>
</.checkbox>

Invalid

Subscribe

Required

    <.checkbox
  class="checkbox ui-accent"
  invalid
  checked
  errors={["Required"]}
>
  <:label>Subscribe</:label>
  <:indicator>
    <.heroicon name="hero-check" />
  </:indicator>
  <:error :let={msg}>
    <.heroicon name="hero-exclamation-circle" class="icon" />
    {msg}
  </:error>
</.checkbox>

Indeterminate

Select some rows

    <.checkbox class="checkbox" checked={:indeterminate}>
  <:label>Select some rows</:label>
  <:indicator>
    <.heroicon name="hero-check" />
  </:indicator>
  <:indeterminate>
    <.heroicon name="hero-minus" />
  </:indeterminate>
</.checkbox>