Packages
moon
2.89.0
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/field/error.ex
defmodule Moon.Design.Form.Field.Error do
@moduledoc false
use Moon.StatelessComponent
alias Moon.Icon
@doc "Data-testid attribute for HTML tag"
prop(testid, :string)
@doc "Id attribute for HTML tag"
prop(id, :string)
@doc "Additional Tailwind classes"
prop(class, :css_class)
@doc "Form info, usually should be taken from context"
prop(form, :form, from_context: {Surface.Components.Form, :form})
@doc "Whether error icon is shown"
prop(has_error_icon, :boolean, default: false)
@doc "Whether label is on side of input field"
prop(is_horizontal, :boolean, default: false)
@doc "Default slot"
slot(default)
def render(assigns) do
~F"""
<div
data-testid={@testid}
{=@id}
class={merge([
[
"flex gap-1 items-center mt-2 text-moon-12 [&_svg]:text-moon-16 text-chichi",
"col-end-3": @is_horizontal
],
@class
])}
role="alert"
>
<#slot>
<Icon name="generic_info" :if={@has_error_icon} />
</#slot>
<Moon.Design.Form.Field.ErrorTag form={get_changeset(@form)} />
</div>
"""
end
defp get_changeset(%Phoenix.HTML.Form{source: source}), do: source
defp get_changeset(other), do: other
end