Basic <picture> component

index.html.erb

<%= render PictureComponent.new do |c| %>
  <% c.source(srcset: 'http://placehold.it/500', media: '(min-width: 800px)') %>
  <% c.img(srcset: 'http://placehold.it/300', alt: 'Placeholder image') %>
<% end %>

picture_component.html.erb

<picture>
  <% sources.each do |source| %>
    <%= source %>
  <% end %>
  <%= img %>
</picture>

picture_component.rb

# frozen_string_literal: true

class PictureComponent < ApplicationComponent
  renders_many :sources, ->(**params) { tag.source(**params) }
  renders_one :img, ->(**params) { tag.img(**params) }
end