panel_component.html.erb in avo-3.0.0.beta1

- old
+ new

@@ -1,8 +1,8 @@
 <%= content_tag :div, data: data_attributes, class: classes do %>
   <% if render_header? %>
-    <div class="flex-1 flex flex-col xl:flex-row justify-between mb-4">
+    <div data-target="panel-header" class="flex-1 flex flex-col xl:flex-row justify-between mb-4">
       <div class="overflow-hidden flex flex-col">
         <% if display_breadcrumbs? %>
           <div class="breadcrumbs truncate mb-2">
             <%= helpers.render_avo_breadcrumbs(separator: helpers.svg('chevron-right', class: 'inline-block h-3 stroke-current relative top-[-1px] ml-1' )) if Avo.configuration.display_breadcrumbs %>
           </div>
@@ -22,35 +22,37 @@
         </div>
       <% end %>
     </div>
   <% end %>
   <% if body? %>
-    <div class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:gap-4 w-full">
+    <div data-target="panel-body" class="flex flex-col sm:flex-row space-y-4 sm:space-y-0 sm:gap-4 w-full">
       <div class="relative flex-1 w-full <% if sidebar? %> sm:w-2/3 <% end %>">
         <% # The body is wrapped inside another div in order to avoid long & tall panels next to sidebars when the sidebar taller. %>
         <div class="relative <%= white_panel_classes %> <%= @body_classes %>">
           <%= body %>
         </div>
       </div>
       <% if sidebar? %>
-        <div class="max-w-full sm:w-1/3 flex-shrink-0 h-full <%= white_panel_classes %>">
+        <div class="w-full sm:w-1/3 flex-shrink-0 h-full <%= white_panel_classes %>">
           <%= sidebar %>
         </div>
       <% end %>
       <% if bare_sidebar? %>
-        <div class="max-w-full sm:w-1/3 flex-shrink-0 h-full">
+        <div class="w-full sm:w-1/3 flex-shrink-0 h-full">
           <%= bare_sidebar %>
         </div>
       <% end %>
     </div>
   <% end %>
   <% if bare_content? %>
-    <div class="relative">
+    <div data-target="panel-bare-content" class="relative">
       <%= bare_content %>
     </div>
   <% end %>
   <% if footer_tools? %>
-    <div class="flex-1 w-full flex flex-col sm:flex-row xl:justify-end sm:items-end space-y-2 sm:space-y-0 sm:space-x-2 mt-4 xl:mt-0">
+    <div
+      data-target="panel-footer-tools"
+      class="flex-1 w-full flex flex-col sm:flex-row xl:justify-end sm:items-end space-y-2 sm:space-y-0 sm:space-x-2 mt-4 xl:mt-0">
       <%= footer_tools %>
     </div>
   <% end %>
   <% if footer? %>
     <div class="flex justify-end w-full">