Packages
moon
2.78.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/design/form.ex
defmodule Moon.Design.Form do
@moduledoc false
use Moon.StatelessComponent
import Moon.Helpers.Form, only: [transfor: 1]
@doc "Id attribute for DOM element"
prop(id, :string)
@doc "Data-testid attribute for DOM element"
prop(testid, :string)
@doc "Atom or changeset to inform the form data"
prop(for, :any)
@doc "The server side parameter in which all parameters will be gathered."
prop(as, :atom)
@doc "Triggered when the form is changed"
prop(change, :event)
@doc "Triggered when the form is submitted"
prop(submit, :event)
@doc "Additional Tailwind classes"
prop(class, :string)
@doc "Whether autocomplete is enabled"
prop(autocomplete, :string, default: "on", values: ["on", "off"])
@doc "Target"
prop(target, :any)
@doc "Trigger a standard form submit on DOM patch to the URL specified in the form's standard action
attribute.
This is useful to perform pre-final validation of a LiveView form submit before posting to a
controller route for operations that require Plug session mutation."
prop(trigger_action, :any)
@doc "Whether label is on side of input field"
prop(is_horizontal, :boolean, default: false)
@doc "Whether error icon is shown"
prop(has_error_icon, :boolean, default: false)
@doc "Default slot"
slot(default)
def render(assigns) do
~F"""
<Surface.Components.Form
for={transfor(@for)}
{=@as}
{=@submit}
{=@change}
{=@class}
{=@trigger_action}
opts={autocomplete: @autocomplete, id: @id, "data-testid": @testid, "phx-target": @target}
>
<#slot context_put={is_horizontal: @is_horizontal, has_error_icon: @has_error_icon} />
</Surface.Components.Form>
"""
end
end