<%= render_component_header title: "Popover",
      description: "Displays rich content in a portal, triggered by a button." %>

<% content_for :preview, flush: true do %>
<div class="w-full flex justify-center">
  <%= render_code_preview('popover') %>
</div>
<% end %>

<% content_for :code, flush: true do %>
<div class="w-full flex justify-center">
  <%= code_partial("popover/preview", :erb) %>
</div>
<% end %>

<%= render_preview %>

<h2 class="font-heading scroll-m-20 border-b pb-2 text-2xl font-semibold tracking-tight first:mt-0" id="installation">Installation</h2>
<%= code_sample(language: "sh") do %>
  rails generate shadcn-ui popover
<% end %>

<h2 class="font-heading mt-12 scroll-m-20 border-b pb-2 mb-2 text-2xl font-semibold tracking-tight first:mt-0" id="usage">Usage</h2>
<%= code_partial("popover/usage", :erb) %>

<%= render_usage("popover") %>

<% content_for :examples, flush: true do %>
  <div class="w-full flex justify-center">
    <%= render "examples/components/popover/code/form" %>
  </div>
<% end %>

<% content_for :code, flush: true do %>
  <%= code_partial("popover/form", :erb) %>
<% end %>

<%= render_example %>