Components / Form

Form

Stable

Rails form_with wrappers

Usage example #

Copy this ERB into a Rails view after installing the component. The snippet below is the same code used by the live preview above.

app/views/.../form_example.html.erb

<div class="w-full max-w-md text-left">
  <%= render Senren::FormComponent.new(model: false, url: "#", method: :post) do %>
    <div class="space-y-1.5">
      <%= render(Senren::LabelComponent.new(for_field: "demo_form_email", variant: :required)) { "Email" } %>
      <%= render Senren::InputComponent.new(name: "email", id: "demo_form_email", placeholder: "you@company.com") %>
    </div>
    <div class="space-y-1.5">
      <%= render(Senren::LabelComponent.new(for_field: "demo_form_msg")) { "Message" } %>
      <%= render Senren::TextareaComponent.new(name: "message", id: "demo_form_msg", rows: 3) %>
    </div>
  <% end %>
</div>

Install this component #

Copy the official component into your app

Use this when you want the Senren-maintained implementation copied into app/components/senren.

Terminal

bin/rails senren:add form

Create a custom component with the same conventions

Use this when you need an app-specific static component that follows Senren's ViewComponent structure.

Terminal

bin/rails generate senren:component form --no-client

Dependencies are resolved by senren:add: button.

At a glance #

Category Forms

Class name Senren::FormComponent

Stimulus —

Variants default

Depends on button

Pairs with input, textarea, native_select, label, alert

Source #

app/components/senren/form_component.html.erb

<%= form_with(model: model, url: url, method: method, multipart: multipart, **root_attrs("space-y-4")) do |f| %>
  <%= content || capture(f, &Proc.new) %>
<% end %>

app/components/senren/form_component.rb

# frozen_string_literal: true

module Senren
  class FormComponent < BaseComponent
    VARIANTS = { default: '' }.freeze
    SIZES    = { md: '' }.freeze

    def initialize(model: nil, url: nil, method: :post, multipart: false, class_name: nil, **html)
      super(variant: :default, size: :md, class_name: class_name, **html)
      @model = model
      @url   = url
      @method = method
      @multipart = multipart
    end

    attr_reader :model, :url, :method, :multipart
  end
end

AI agent rules #

Use for

+Rails form_with wrappers

Avoid

-bypassing CSRF or Rails form helpers

Accessibility #

Group related fields with fieldset/legend; show errors next to fields.

Label

Input