Packages
moon
2.79.6
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/parts/sidebar/accordion.ex
defmodule Moon.Parts.Sidebar.Accordion do
@moduledoc false
use Moon.StatelessComponent
alias Moon.Design.Accordion
alias Moon.Icon
@doc "Id attribute for DOM element"
prop(id, :string)
@doc "Data-testid attribute for DOM element"
prop(testid, :string)
@doc "Accordion header"
prop(accordion_header, :any)
@doc "Value (List of values) items to be open"
prop(value, :any, default: [])
@doc "Additional Tailwind classes"
prop(class, :css_class)
@doc "Additional Tailwind classes"
prop(header_class, :css_class)
@doc "Additional Tailwind classes"
prop(content_class, :css_class)
@doc "Accordion header icon"
prop(accordion_header_icon, :string)
@doc "Default slot"
slot(default)
def render(assigns) do
~F"""
<Accordion {=@id} {=@testid} {=@value} {=@class}>
<Accordion.Item has_content_outside>
<Accordion.Header class={merge(["font-normal hover:bg-gohan rounded-full p-3 gap-3 h-12", @header_class])}>
<Icon
class="w-6 h-6"
name={@accordion_header_icon}
:if={@accordion_header_icon && @accordion_header_icon != nil}
/>
{@accordion_header}
</Accordion.Header>
<Accordion.Content>
<div class={merge(["flex-grow flex flex-col gap-1 ps-9", @content_class])}>
<#slot />
</div>
</Accordion.Content>
</Accordion.Item>
</Accordion>
"""
end
end