Packages
moon
2.73.3
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_multiselect.ex
defmodule Moon.Components.CheckboxMultiselect do
@moduledoc false
use Moon.StatelessComponent
alias Moon.Components.Checkbox
alias Moon.Components.ListItems.SingleLineItem
prop(options, :list, required: true)
prop(values, :list, required: true)
prop(on_select, :event)
prop(testid, :string)
def render(assigns) do
~F"""
{#for option <- @options}
<div
:on-click={@on_select}
phx-value-toggled_item_id={get_value(option)}
data-testid={"#{@testid}-value-#{get_value(option)}"}
>
<SingleLineItem size="large">
<:right_icon>
<Checkbox class="pointer-events-none" checked={is_checked(@values, option)} />
</:right_icon>
{get_label(option)}
</SingleLineItem>
</div>
{/for}
"""
end
def is_checked(values, option) do
Enum.member?(values, get_value(option)) || Enum.member?(values, "#{get_value(option)}")
end
def get_value(option) do
Map.get(option, :value) || Map.get(option, :id)
end
def get_label(option) do
Map.get(option, :label) || Map.get(option, :name)
end
def toggle_list_value(list, value) do
case Enum.member?(list, value) do
true ->
List.delete(list, value)
false ->
list ++ [value]
end
end
end