Shadix.Components.RadioGroup (shadix v0.0.1)

Copy Markdown View Source

Radio group component translated from shadcn/ui (new-york-v4).

Two function-components:

  • radio_group/1 — a presentational container (role="radiogroup", data-slot="radio-group") that lays out the items in a grid. It is NOT field-aware; it just renders its inner_block.

  • radio_group_item/1 — a field-aware native <input type="radio">. Each item shares the field's name (so the browser groups them) but renders a unique id, and is checked when the field's current value matches the item's value. The selected dot is drawn with CSS only (a before: pseudo-element shown via the checked: variant), no JavaScript.

Radios are grouped, so an individual item does not render its own error message; surface validation alongside the group/label as appropriate. Each item still reflects the field's invalid state via aria-invalid so screen readers and the destructive styling pick it up.

Summary

Functions

radio_group(assigns)

Attributes

  • class (:string) - Defaults to nil.
  • Global attributes are accepted.

Slots

  • inner_block (required)

radio_group_item(assigns)

Attributes

  • field (Phoenix.HTML.FormField) (required)
  • value (:string) (required)
  • class (:string) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["disabled", "required"].