Packages
moon
2.79.2
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/design/modal/panel.ex
defmodule Moon.Design.Modal.Panel do
@moduledoc false
use Moon.StatelessComponent, slot: "panel"
prop(class, :css_class)
slot(default)
prop(id, :string)
prop(testid, :string)
# Internal API
prop(on_close, :event, from_context: :on_close)
def render(assigns) do
~F"""
<div
{=@id}
data-animate_enter_class="animate-modal_enter"
data-animate_leave_class="animate-modal_leave"
class={merge([
"w-full max-w-sm inline-block transform rounded-xl bg-goku align-middle shadow-moon-lg transition-all",
"moon-panel",
@class
])}
:on-click-away={@on_close}
data-testid={@testid}
>
<#slot />
</div>
"""
end
end