Packages
moon
2.72.1
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_web/examples/parts/header_example/default.ex
defmodule MoonWeb.Examples.Parts.HeaderExample.Default do
@moduledoc false
use Moon.StatefulComponent
use MoonWeb, :example
alias Moon.Design.Breadcrumb.Crumb
alias Moon.Parts.Header
data(breadcrumb_items, :list,
default: [
%Crumb{
link: "#",
icon: "generic_home"
},
%Crumb{
name: "Sub page",
link: "#"
},
%Crumb{
name: "Target page",
link: "#"
}
]
)
def render(assigns) do
~F"""
<Header>
<Header.Title>Chat history</Header.Title>
<Header.Description>Manage your team members and their account permissions here.</Header.Description>
<Header.Breadcrumbs id="header-breadcrumbs" breadcrumbs={@breadcrumb_items} />
<Header.ButtonGroup>
<Header.ButtonGroupLink route="#" icon="generic_search" tooltip_text="Tooltip text" />
<Header.ButtonGroupLink route="#" icon="mail_filter" tooltip_text="Filters (⌘ + F)" />
<Header.ButtonGroupLink route="#" icon="arrows_sorting" tooltip_text="Tooltip text" />
<Header.ButtonGroupLink route="#" icon="controls_eye" tooltip_text="Tooltip text" />
</Header.ButtonGroup>
<Header.LeftButton />
<Header.RightButton />
</Header>
"""
end
end