% cache bubble do %>
<%= tag.div class: [ "bubble", drafted: bubble.drafted?, popped: bubble.popped? ],
style: "view-transition-name: bubble-#{bubble.id}; --bubble-color: #{bubble.color}; #{bubble_rotation(bubble)}",
role: "group", aria: { label: bubble.title },
data: {
bubble_size_target: "bubble",
activity_score: bubble.activity_score,
activity_score_at: bubble.activity_score_at.to_i,
controller: "animation upload-preview",
animation_play_class: "bubble--wobble",
animation_play_on_load_value: true,
action: "mouseover->animation#play" } do %>
<% if bubble.published? %>
<%= turbo_frame_tag bubble, :edit do %>
<%= link_to bubble_title(bubble), edit_bucket_bubble_path(bubble.bucket, bubble),
class: "txt-undecorated bubble__title-rendered",
role: "button", aria: { label: "Edit name: #{bubble.title}" } %>
<% end %>
<% else %>
<%= form_with model: bubble, url: bucket_bubble_path(bubble.bucket, bubble), id: "bubble_form", data: { controller: "auto-save" } do |form| %>
<%= form.text_area :title, placeholder: "Name it…", class: "input full-width borderless txt-align-start card__title-field", autofocus: bubble.title.blank?, data: { action: "auto-save#change blur->auto-save#submit keydown.enter->auto-save#submit:prevent keydown.ctrl+enter->auto-save#submit:prevent" } %>
<% end %>
<% end %>
<%= render "bubbles/tags", bubble: bubble %>
<%= link_to bucket_bubble_path(bubble.bucket, bubble), class: "bubble__link" do %>
<%= bubble.title %>
<% end %>
<%= render "bubbles/assignments", bubble: bubble %>
<%= render "bubbles/boosts", bubble: bubble %>
<%= render "bubbles/comments", bubble: bubble %>
<%= render "bubbles/date", bubble: bubble %>
<%= render "bubbles/image", bubble: bubble %>
<% end %>
<% end %>