Packages
moon
2.81.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/light/form/field.ex
defmodule Elixir.Moon.Light.Form.Field do
@moduledoc false
use Moon.Light.Component
import Moon.Light
attr(:id, :string, doc: "Id attribute for HTML tag", default: nil)
attr(:testid, :string, doc: "Data-testid attribute for HTML tag", default: nil)
attr(:class, :any, doc: "Additional Tailwind classes", default: nil)
attr(:attrs, :map, default: %{}, doc: "Additional attributes")
attr(:field, Phoenix.HTML.FormField, default: nil)
attr(:for, :string, doc: "Atom or changeset to inform the form data", default: nil)
attr(:size, :string, values: ~w(sm md lg xl), default: "md", doc: "Common moon size property")
attr(:title, :string, doc: "Label for input field", default: nil)
attr(:disabled, :boolean, default: false, doc: "Whether label has disabled state")
attr(:is_horizontal, :boolean, doc: "Whether label is on side of input field", default: nil)
attr(:on_click, Event, doc: "On click event for the label", default: nil)
attr(:value, :string, doc: "Value of the input", default: nil)
slot(:inner_block, doc: "Default slot")
def label(assigns) do
~H"""
<label
for={@for || (@field && @field.id)}
id={@id}
data-testid={@testid}
phx-click={Event.from(@on_click).name}
phx-target={Event.from(@on_click).target}
phx-value-value={@value}
class={
merge([
[
"flex gap-2 cursor-pointer whitespace-nowrap pb-2 items-center leading-normal",
(@size == "sm" && "text-moon-14") || "text-moon-16",
"text-bulma opacity-60 cursor-not-allowed": @disabled,
"font-medium pb-0 align-center": @is_horizontal
],
@class
])
}
{@attrs}
>
<%= render_slot(@inner_block) || @title %>
</label>
"""
end
attr(:testid, :string, doc: "Data-testid attribute for HTML tag", default: nil)
attr(:id, :string, doc: "Id attribute for HTML tag", default: nil)
attr(:class, :any, doc: "Additional Tailwind classes", default: nil)
attr(:has_error_icon, :boolean, default: false, doc: "Whether error icon is shown")
attr(:is_horizontal, :boolean, default: false, doc: "Whether label is on side of input field")
attr(:title, :string, doc: "Hint text when default slot is not given", default: nil)
slot(:inner_block, doc: "Default slot")
def hint(assigns) do
~H"""
<div
data-testid={@testid}
id={@id}
class={
merge([
[
"flex gap-1 items-center mt-2 text-moon-12 [&_svg]:text-moon-16",
"col-end-3": @is_horizontal
],
@class
])
}
>
<%= if has_slot?(@inner_block) do %>
<%= render_slot(@inner_block) %>
<% else %>
<p><%= @title %></p>
<% end %>
</div>
"""
end
attr(:testid, :string, doc: "Data-testid attribute for HTML tag", default: nil)
attr(:id, :string, doc: "Id attribute for HTML tag", default: nil)
attr(:class, :any, doc: "Additional Tailwind classes", default: nil)
attr(:has_error_icon, :boolean, default: false, doc: "Whether error icon is shown")
attr(:is_horizontal, :boolean, default: false, doc: "Whether label is on side of input field")
attr(:field, Phoenix.HTML.FormField, required: true)
slot(:inner_block, doc: "Default slot")
def error(assigns) do
~H"""
<div
data-testid={@testid}
id={@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"
>
<%= if has_slot?(@inner_block) do %>
<%= render_slot(@inner_block) %>
<% else %>
<.icon :if={@has_error_icon} name="generic_info" />
<% end %>
<span :for={error <- @field.errors}>
<%= translate_error().(error) %>
</span>
</div>
"""
end
defp translate_error() do
&Surface.Components.Form.ErrorTag.translate_error/1
# TODO: fix for partners and get rid of surface
# case get_config(Surface.Components.Form.ErrorTag, :default_translator) do
# {module, function} -> &apply(module, function, [&1])
# nil -> &Surface.Components.Form.ErrorTag.translate_error/1
# end
end
end