Packages
moon
2.80.2
2.90.5
retired
2.90.4
2.90.3
2.90.2
2.90.1
2.90.0
2.89.4
2.89.1
2.89.0
2.88.0
2.87.11
2.87.10
2.87.9
2.87.8
2.87.7
2.87.6
2.87.5
2.87.4
2.87.3
2.87.2
2.87.1
2.87.0
2.86.1
2.86.0
2.85.1
2.85.0
2.84.0
2.83.0
2.82.0
2.81.4
2.81.3
2.81.2
2.81.1
2.81.0
2.80.2
2.80.1
2.80.0
2.79.13
2.79.12
2.79.11
2.79.10
2.79.9
2.79.8
2.79.7
2.79.6
2.79.5
2.79.4
2.79.3
2.79.2
2.79.1
2.79.0
2.78.4
2.78.3
2.78.2
2.78.1
2.78.0
2.77.0
2.76.5
2.76.4
2.76.3
2.76.2
2.76.1
2.76.0
2.75.0
2.74.1
2.74.0
2.73.8
2.73.7
2.73.6
2.73.5
2.73.4
2.73.3
2.73.2
2.73.1
2.73.0
2.72.5
2.72.4
2.72.3
2.72.2
2.72.1
2.72.0
2.71.1
2.71.0
2.70.0
2.69.2
2.69.1
2.69.0
2.68.11
2.68.10
Components-based design system written in elixir
Current section
Files
Jump to
Current section
Files
lib/moon/components/checkbox.ex
defmodule Moon.Components.Checkbox do
@moduledoc false
use Moon.StatelessComponent
alias Moon.Components.FieldLabel
alias Moon.Components.Lego.Checkbox
prop(id, :string)
prop(field, :atom, from_context: {Surface.Components.Form.Field, :field})
prop(form, :form, from_context: {Surface.Components.Form, :form})
prop(click, :event)
prop(checked, :boolean)
prop(disabled, :boolean)
prop(readonly, :boolean, default: false)
prop(class, :string)
slot(default)
def render(assigns) do
~F"""
<div class={"relative inline-flex items-center select-none", @class, "opacity-disabled": @disabled}>
<Surface.Components.Form.Checkbox
field={@field}
click={!@readonly && @click}
class={
"z-10 absolute left-0 opacity-0 cursor-pointer",
"cursor-not-allowed select-none": @readonly
}
checked_value="true"
unchecked_value="false"
opts={disabled: @disabled, readonly: @readonly}
/>
<Checkbox is_selected={is_true(@checked) || is_true(Phoenix.HTML.Form.input_value(@form, @field))} />
<FieldLabel field={@field} class="bg-rochi pl-2"><#slot /></FieldLabel>
</div>
"""
end
def is_true(val) do
Enum.member?([true, "true"], val)
end
end