AshFormBuilder.Themes.Default (AshFormBuilder v0.3.0)

View Source

Default HTML theme for AshFormBuilder with production-ready Tailwind CSS styling.

Features

  • Zero Configuration - Works out of the box with sensible defaults
  • Tailwind CSS Classes - Modern, clean styling without extra dependencies
  • Accessible - Proper labels, ARIA attributes, and focus states
  • Responsive - Mobile-friendly form fields
  • Customizable - Override classes via theme_opts config

Configuration

config :ash_form_builder,
  theme: AshFormBuilder.Themes.Default,
  theme_opts: [
    wrapper_class: "space-y-6",
    field_wrapper_class: "mb-4",
    label_class: "block text-sm font-medium text-gray-700 mb-1",
    input_class: "w-full px-3 py-2 border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500",
    error_class: "text-sm text-red-600 mt-1",
    hint_class: "text-xs text-gray-500 mt-1"
  ]

Field Types Supported

  • :text_input, :textarea, :select, :checkbox, :number, :email, :password
  • :date, :datetime, :url, :tel, :hidden
  • :multiselect_combobox - Fallback to multi-select (use MishkaTheme for combobox)
  • :file_upload - Phoenix LiveView file upload with drag-and-drop styling

Custom Theme Example

defmodule MyAppWeb.CustomTheme do
  @behaviour AshFormBuilder.Theme
  use Phoenix.Component

  @impl AshFormBuilder.Theme
  def render_field(assigns, opts) do
    # Your custom implementation
  end
end

See guides/theme_customization_guide.md for detailed customization instructions.