Packages
ash_admin
0.5.2
1.1.0
1.0.0-rc.0
0.14.0
0.13.26
0.13.25
0.13.24
0.13.23
0.13.22
0.13.21
0.13.20
0.13.19
0.13.18
0.13.17
0.13.16
0.13.15
0.13.14
0.13.13
0.13.12
0.13.11
0.13.10
0.13.9
0.13.8
0.13.7
0.13.6
0.13.5
0.13.4
0.13.3
0.13.2
0.13.1
0.13.0
0.12.6
0.12.5
0.12.4
0.12.3
0.12.2
0.12.1
0.12.0
0.11.11
0.11.10
0.11.9
0.11.8
0.11.7
0.11.6
0.11.5
0.11.4
0.11.3
0.11.2
0.11.1
0.11.0
0.10.12
0.10.11
0.10.10
retired
0.10.10-rc.1
0.10.10-rc.0
0.10.9
0.10.8
0.10.7
0.10.6
0.10.5
0.10.4
0.10.3
0.10.2
0.10.1
0.10.0
0.9.8
0.9.7
0.9.6
0.9.5
0.9.4
0.9.3
0.9.2
0.9.1
0.9.0
0.8.1
0.8.0
0.7.1
0.7.0
0.6.2
0.6.1
0.6.0-rc.2
0.6.0-rc.1
0.6.0-rc.0
0.5.2
0.5.1-rc.0
0.5.0
0.4.5-rc.0
0.4.4
0.4.2
0.4.0
0.3.0-rc.0
0.2.22
0.2.21
0.2.20
0.2.19
0.2.18
0.2.17
0.2.16-rc.1
0.2.16-rc.0
0.2.15
0.2.14
0.2.13
0.2.12
0.2.11
0.2.10
0.2.9
0.2.8
0.2.7
0.2.6
0.2.5
0.2.4
0.2.3
0.2.1
0.1.6
0.1.5
0.1.3
0.1.2
0.1.0
A super-admin UI for Ash Framework, built with Phoenix LiveView.
Current section
Files
Jump to
Current section
Files
lib/ash_admin/components/top_nav/dropdown.ex
defmodule AshAdmin.Components.TopNav.Dropdown do
@moduledoc false
use Surface.LiveComponent
alias Surface.Components.LiveRedirect
prop(name, :string, required: true)
prop(groups, :list, required: true)
prop(group_labels, :keyword, required: false)
prop(active, :boolean, required: true)
prop(class, :css_class)
data(open, :boolean, default: false)
def render(assigns) do
~F"""
<div class={"relative", @class} phx-target={@myself}>
<div phx-click-away="close" phx-target={@myself}>
<button
type="button"
class={
"inline-flex justify-center w-full rounded-md border border-gray-300 shadow-sm px-4 py-2 text-sm font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-100 focus:ring-indigo-500",
"bg-gray-800 hover:bg-gray-900 text-white": @active,
"bg-white text-gray-700 hover:bg-gray-300": !@active
}
phx-click="toggle"
phx-target={@myself}
id={"#{@id}_dropdown_button"}
aria-haspopup="true"
aria-expanded="true"
>
{@name}
<svg
class="-mr-1 ml-2 h-5 w-5"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 20 20"
fill="currentColor"
aria-hidden="true"
>
<path
fill-rule="evenodd"
d="M5.293 7.293a1 1 0 011.414 0L10 10.586l3.293-3.293a1 1 0 111.414 1.414l-4 4a1 1 0 01-1.414 0l-4-4a1 1 0 010-1.414z"
clip-rule="evenodd"
/>
</svg>
</button>
{#if @open}
<div
class={
"origin-top-right absolute left-0 mt-2 w-56 rounded-md shadow-lg bg-white ring-1 ring-black ring-opacity-5 divide-y divide-gray-100 z-10",
"bg-gray-600 hover:bg-gray-700": single_active_group?(@groups)
}
role="menu"
aria-orientation="vertical"
phx-target={@myself}
id={"#{@id}_dropown"}
>
{#for group <- @groups}
<div
class="py-1"
role="menu"
aria-orientation="vertical"
aria-labelledby={"#{@id}_dropown"}
>
<.group_label item={hd(group)} group_labels={@group_labels} />
{#for link <- group}
<LiveRedirect
to={link.to}
class={
"block px-4 py-2 text-sm ",
"bg-gray-600 text-white hover:bg-gray-700": Map.get(link, :active),
"text-gray-700 hover:bg-gray-100 hover:text-gray-900": !Map.get(link, :active)
}
opts={role: "menuitem"}
>
{link.text}
</LiveRedirect>
{/for}
</div>
{/for}
</div>
{/if}
</div>
</div>
"""
end
defp group_label(assigns) do
assigns = Map.put(assigns, :label_text, group_label_text(assigns))
~F"""
{#if @label_text}
<span class="block px-4 py-2 text-xs text-gray-400 font-semibold italic">{@label_text}</span>
{/if}
"""
end
# No labels specified for the whole dropdown
defp group_label_text(assigns) when not is_map_key(assigns, :group_labels), do: nil
defp group_label_text(%{group_labels: []}), do: nil
# No label specified for this dropdown group
defp group_label_text(%{item: item}) when not is_map_key(item, :group), do: nil
# Maybe a label to display!
defp group_label_text(assigns), do: Keyword.get(assigns.group_labels, assigns.item.group)
def handle_event("close", _, socket) do
{:noreply, assign(socket, :open, false)}
end
def handle_event("toggle", _, socket) do
{:noreply, assign(socket, :open, !socket.assigns.open)}
end
defp single_active_group?([[%{active: true}]]), do: true
defp single_active_group?(_), do: false
end