Link Search Menu Expand Document

Content areas

Note: The content_areas API is soft-deprecated, and will soon be deprecated in favor of Slots.

ViewComponents can declare additional content areas. For example:

app/components/modal_component.rb:

class ModalComponent < ViewComponent::Base
  with_content_areas :header, :body
end

app/components/modal_component.html.erb:

<div class="modal">
  <div class="header"><%= header %></div>
  <div class="body"><%= body %></div>
</div>

Rendered in a view as:

<%= render(ModalComponent.new) do |component| %>
  <% component.with(:header) do %>
    Hello Jane
  <% end %>
  <% component.with(:body) do %>
    <p>Have a great day.</p>
  <% end %>
<% end %>

Returning:

<div class="modal">
  <div class="header">Hello Jane</div>
  <div class="body"><p>Have a great day.</p></div>
</div>