Packages
moon
2.84.0
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/section.ex
defmodule Moon.Parts.Sidebar.Section do
@moduledoc false
use Moon.StatelessComponent
alias Moon.Parts.Sidebar
alias Moon.Icon
defstruct title: "", links: []
@doc "Id attribute for DOM element"
prop(id, :string)
@doc "Data-testid attribute for DOM element"
prop(testid, :string)
@doc "Additional Tailwind classes"
prop(class, :css_class)
@doc "List of links to be rendered when no default slot is given"
prop(links, :list, default: [])
@doc "Section title to be rendered when no default slot is given"
prop(title, :string)
@doc "Default slot"
slot(default)
def render(assigns) do
~F"""
<div class={merge(["flex flex-col gap-2 h-full", @class])} {=@id} data-testid={@testid}>
<#slot>
<Sidebar.SectionTitle :if={@title}>{@title}</Sidebar.SectionTitle>
{#for link <- @links}
{#if link[:children] && link[:children] != []}
<Sidebar.Accordion
id={"sidebar-#{link[:key]}"}
accordion_header={link[:key]}
accordion_header_icon={link[:icon]}
>
{#for child_menu_item <- link[:children]}
<Sidebar.MenuLink route={child_menu_item[:page]}>
<Icon
class="w-6 h-6"
name={child_menu_item[:icon]}
:if={child_menu_item[:icon] && child_menu_item[:icon] != ""}
/>
{child_menu_item[:key]}
</Sidebar.MenuLink>
{/for}
</Sidebar.Accordion>
{#else}
<Sidebar.MenuLink route={link[:page]}>
<Icon class="w-6 h-6" name={link[:icon]} :if={link[:icon] && link[:icon] != ""} />
{link[:key]}
</Sidebar.MenuLink>
{/if}
{/for}
</#slot>
</div>
"""
end
end