Packages
petal_components
4.6.1
4.6.2
4.6.1
4.6.0
4.5.0
4.4.0
4.3.0
4.2.1
4.2.0
4.1.2
4.1.1
4.1.0
4.0.12
4.0.11
4.0.10
4.0.6
4.0.5
4.0.4
4.0.3
4.0.1
3.2.2
3.2.1
3.2.0
3.1.0
3.0.2
3.0.1
3.0.0
2.9.3
2.9.2
retired
2.9.1
retired
2.9.0
retired
2.8.4
2.8.3
2.8.2
2.8.1
2.8.0
2.7.4
2.7.3
2.7.2
2.7.1
2.7.0
2.6.1
2.6.0
2.5.2
2.5.1
2.5.0
2.4.3
2.4.2
2.4.1
2.4.0
2.3.0
2.2.1
2.2.0
2.1.2
2.1.1
2.1.0
2.0.6
2.0.5
2.0.4
2.0.3
2.0.2
2.0.1
2.0.0
1.9.3
1.9.2
1.9.1
1.9.0
1.8.0
1.7.1
1.7.0
1.6.2
1.6.1
1.6.0
1.5.5
1.5.4
1.5.3
1.5.2
1.5.1
1.5.0
1.4.9
1.4.8
1.4.7
1.4.6
1.4.5
1.4.4
1.4.3
1.4.2
1.4.1
1.4.0
1.3.0
1.2.14
1.2.13
1.2.12
1.2.11
1.2.10
1.2.9
1.2.8
1.2.7
1.2.6
1.2.5
1.2.4
1.2.3
1.2.2
1.2.1
1.2.0
1.1.6
1.1.5
1.1.4
1.1.3
1.1.2
1.1.1
1.1.0
1.0.8
1.0.7
1.0.6
1.0.5
1.0.4
1.0.3
1.0.2
1.0.1
1.0.0
0.19.10
0.19.9
0.19.8
0.19.7
0.19.6
0.19.5
0.19.4
0.19.3
0.19.2
0.19.1
0.19.0
0.18.5
0.18.4
0.18.3
0.18.2
0.18.1
0.18.0
0.17.7
0.17.6
0.17.5
0.17.4
0.17.3
0.17.2
0.17.1
0.17.0
0.16.0
0.15.0
0.14.1
0.14.0
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.0
0.11.4
0.11.3
0.11.2
0.11.1
0.11.0
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.3
0.9.2
0.9.1
0.9.0
0.8.0
0.7.0
0.6.1
0.6.0
0.5.1
0.5.0
0.4.0
0.3.2
0.3.1
0.3.0
0.2.2
0.2.1
0.2.0
0.1.0
Shadcn-style Phoenix LiveView components that AI assistants can actually use. Pair with the MCP server so AI coding tools can inspect the real component API.
Current section
Files
Jump to
Current section
Files
lib/petal_components/user_dropdown_menu.ex
defmodule PetalComponents.UserDropdownMenu do
use Phoenix.Component
import PetalComponents.Avatar
import PetalComponents.Dropdown
import PetalComponents.Icon
attr :user_menu_items, :list,
doc: "list of maps with keys :path, :icon (atom), :label, :method (atom - optional)"
attr :current_user_name, :string, doc: "the current signed in user's name"
attr :avatar_src, :string, default: nil, doc: "the current signed in user's avatar image src"
def user_dropdown_menu(assigns) do
~H"""
<.dropdown :if={@user_menu_items != []}>
<:trigger_element>
<div class="inline-flex items-center justify-center w-full align-middle focus:outline-hidden">
<%= if assigns[:current_user_name] || assigns[:avatar_src] do %>
<.avatar name={@current_user_name} src={@avatar_src} size="sm" random_color />
<% else %>
<.avatar size="sm" />
<% end %>
<.icon
name="hero-chevron-down-mini"
class="w-4 h-4 ml-1 -mr-1 text-gray-400 dark:text-gray-100"
/>
</div>
</:trigger_element>
<%= for menu_item <- @user_menu_items do %>
<.dropdown_menu_item
link_type={if menu_item[:method], do: "a", else: "live_redirect"}
method={if menu_item[:method], do: menu_item[:method], else: nil}
to={menu_item.path}
>
<%= cond do %>
<% is_function(menu_item.icon) -> %>
{Phoenix.LiveView.TagEngine.component(
menu_item.icon,
[class: "w-5 h-5 text-gray-500 dark:text-gray-400"],
{__ENV__.module, __ENV__.function, __ENV__.file, __ENV__.line}
)}
<% is_binary(menu_item.icon) && String.match?(menu_item.icon, ~r/svg|img/) -> %>
{Phoenix.HTML.raw(menu_item.icon)}
<% true -> %>
<.icon name={menu_item.icon} class="w-5 h-5 text-gray-500 dark:text-gray-400" />
<% end %>
{menu_item.label}
</.dropdown_menu_item>
<% end %>
</.dropdown>
"""
end
end