Skip to main content Link Search Menu Expand Document (external link)

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
<%# app/components/modal_component.html.erb %>
<div class="modal">
  <div class="header"><%= header %></div>
  <div class="body"><%= body %></div>

Rendered in a view as:

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


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