Packages
moon
2.79.9
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/design/dropdown/custom_option.ex
defmodule Moon.Design.Dropdown.CustomOption do
@moduledoc "Single oprion for the dropdown component. Renders as a button"
use Moon.StatelessComponent, slot: "option"
alias Moon.Design.Dropdown.Option
@doc "Data-testid attribute for button"
prop(testid, :string)
@doc "Id attribute for buttons"
prop(id, :string)
@doc "Title to be shown when no default slot is given"
prop(title, :string)
@doc "Additional CSS classes for the button tag"
prop(class, :css_class)
@doc "If the button is disabled"
prop(disabled, :boolean)
@doc "On click event, in most cases got from context"
prop(on_click, :event, from_context: :on_click)
@doc "Value of the option, in most cases got from context"
prop(value, :any, from_context: :value)
@doc "If the option is selected, in most cases got from context"
prop(is_selected, :boolean, from_context: :is_selected)
@doc "Adds section divider after the option"
prop(has_bottom_divider, :boolean, default: false)
@doc "Additional values to be passed"
prop(values, :map, from_context: :values)
@doc "Inner content of the option"
slot(default)
def render(assigns) do
~F"""
<Option
{=@id}
{=@on_click}
{=@value}
{=@disabled}
{=@is_selected}
values={@values}
size="lg"
class={merge([
[
"px-4 gap-3 rounded-none",
"border-b border-beerus": @has_bottom_divider
],
@class
])}
{=@testid}
>
<#slot>{@title}</#slot>
</Option>
"""
end
end