Flex-wrap container for tags, chips, and button groups.

Items wrap onto new lines automatically when they exceed the container width. Ideal for tag clouds, filter chips, and multi-select badge displays.

All layout attributes accept either a plain value (backward compatible) or a responsive map like %{base: 2, md: 4} for per-breakpoint control.

Examples

<%!-- Tag cloud --%>
<.wrap gap={2}>
  <%= for tag <- @tags do %>
    <.badge>{tag}</.badge>
  <% end %>
</.wrap>

<%!-- Responsive gap --%>
<.wrap gap={%{base: 1, md: 2, lg: 3}}>
  <.chip>Design</.chip>
  <.chip>Engineering</.chip>
</.wrap>

<%!-- Centered chips --%>
<.wrap justify={:center} gap={2}>
  <.chip>Design</.chip>
  <.chip>Engineering</.chip>
  <.chip>Product</.chip>
</.wrap>