Extend components with inheritance

Useful for shipping component libraries, prototyping new features, or for page layouts.

Tailwind component

class TailwindNav < Nav
  def view_template(&content)
    nav(class: "flex flex-row gap-4", &content)
  end

  def item(url, &content)
    a(href: url, class: "text-underline", &content)
  end
end

Calling the navigation component

render TailwindNav.new do |it|
  it.item("/") { "Home" }
  it.item("/about") { "About" }
  it.item("/contact") { "Contact" }
end

Rendered output

<nav class="flex flex-row gap-4">
  <a href="/" class="text-underline">Home</a>
  <a href="/about" class="text-underline">About</a>
  <a href="/contact" class="text-underline">Contact</a>
</nav>