# `PhiaUi.Components.Form`
[🔗](https://github.com/charlenopires/PhiaUI/blob/v0.1.17/lib/phia_ui/components/forms/form.ex#L1)

Form Integration Components for Phoenix LiveView.

Provides components that integrate with `Phoenix.HTML.Form` and Ecto changesets.
Handles error display, real-time validation via `phx-debounce`, and form accessibility.

## Components

| Function        | Purpose                                          |
|-----------------|--------------------------------------------------|
| `phia_input/1`  | All-in-one input: label + input + description + errors |
| `form_field/1`  | Composable wrapper: label + slot + description + errors |
| `form_label/1`  | Accessible `<label>` linked to input via `field.id` |
| `form_message/1`| Conditional error messages from changeset        |

## Error Translation

By default, errors are translated using a simple placeholder interpolator.
To use a custom translator (e.g., from `gettext`), configure:

    config :phia_ui, :error_translator_function, {MyApp.CoreComponents, :translate_error}

The custom function must accept `{message, opts}` and return a string.

## Example

    <.phia_input field={@form[:email]} type="email" label="Email" />

    <.phia_input
      field={@form[:password]}
      type="password"
      label="Password"
      description="At least 8 characters."
    />

# `form_field`

Composable form field wrapper.

Renders: label → slot (input) → description → error messages.
Use this when you need full control over the input element inside.

## Attributes

* `field` (`Phoenix.HTML.FormField`) (required) - A `Phoenix.HTML.FormField` from `@form[:field_name]`.
* `label` (`:string`) - Label text. Defaults to `nil`.
* `description` (`:string`) - Helper text below the input slot. Defaults to `nil`.
## Slots

* `inner_block` (required) - The input component (e.g. a native input or phia_input).

# `form_label`

Renders an accessible `<label>` linked to the input via `for={@field.id}`.

## Attributes

* `field` (`Phoenix.HTML.FormField`) (required) - FormField to link the label to.
* `class` (`:string`) - Additional CSS classes. Defaults to `nil`.
* Global attributes are accepted. HTML attributes forwarded to the label element.
## Slots

* `inner_block` (required) - Label text or content.

# `form_message`

Renders changeset error messages for a field. Renders nothing when there are no errors.

## Attributes

* `field` (`Phoenix.HTML.FormField`) (required) - FormField to read errors from.
* `class` (`:string`) - Additional CSS classes. Defaults to `nil`.

# `phia_input`

Renders a form input integrated with `Phoenix.HTML.FormField`.

Includes label, input, description, and changeset error messages in a single component.
Applies `phx-debounce="blur"` by default for real-time validation.

## Attributes

* `field` (`Phoenix.HTML.FormField`) (required) - A `Phoenix.HTML.FormField` from `@form[:field_name]`.
* `type` (`:string`) - HTML input type. Defaults to `"text"`.
* `label` (`:string`) - Label text rendered above the input. Defaults to `nil`.
* `description` (`:string`) - Helper text rendered below the input. Defaults to `nil`.
* `class` (`:string`) - Additional CSS classes for the input element. Defaults to `nil`.
* Global attributes are accepted. HTML attributes forwarded to the input element. Supports all globals plus: `["autocomplete", "placeholder", "readonly", "required", "disabled"]`.

# `translate_error`

Translates a `{message, opts}` error tuple from a changeset.

Uses the configured `:error_translator_function` when set, otherwise falls back
to interpolating `%{key}` placeholders with values from `opts`:

    Enum.reduce(opts, msg, fn {k, v}, acc -> String.replace(acc, "%{#{k}}", to_string(v)) end)

Configure a custom translator:

    config :phia_ui, :error_translator_function, {MyApp.CoreComponents, :translate_error}

---

*Consult [api-reference.md](api-reference.md) for complete listing*