RubyGems - avo - Versions diffs - 4.0.0.beta.22 → 4.0.0.beta.23 - Mend

avo 4.0.0.beta.22 → 4.0.0.beta.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

checksums.yaml +4 -4
data/Gemfile.lock +1 -1
data/app/assets/builds/avo/application.css +10 -4
data/app/assets/stylesheets/css/components/ui/popover_menu.css +12 -1
data/app/views/avo/partials/_table_header.html.erb +27 -28
data/app/views/avo/partials/distribution_chart.html.erb +19 -17
data/lib/avo/engine.rb +1 -0
data/lib/avo/version.rb +1 -1
metadata +1 -1

checksums.yaml CHANGED Viewed

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 31c28db16cfc485179da2019f6b605cc36e88d1d63fdf2773a1633553bcf664f
-  data.tar.gz: abcb3b8b5327c4c715a6302f0276fe279a15dd46170820870773ed07b90e9975
+  metadata.gz: 7ad13349d5d3575f4e1ae465316afb7fa6c4aa7b1beae7f220a6ed6177b454e6
+  data.tar.gz: 17a139db5d23f75ef5cb879f2dda7f02f61af1265cedaeddc61478f8e6d20373
 SHA512:
-  metadata.gz: c2b9423611e6f1037ca706f1c6e8d0652abb85f4c28a46a58ba0961f9474db800892c59f5ec11ea868e6dfc2b9ca7399e2b30e7e1d3b1bb14c88824d452101c7
-  data.tar.gz: 2ed8e07ba8eb75a04d221df32aa47d7467ab17e0fd7d676dec7df4be5853609916ce065812f246217ede2b580168741ef4cc2e170a9b9a0c1d55d53cabe4a3a5
+  metadata.gz: 11c6a04aba745c9bc0ace5dc504a149f7affb272aa45016c7bff180cb94f400b3a8592715a6b3ba008dd88ef3a96a8a90d8455b223b1ec15e72e244600d547e8
+  data.tar.gz: 13ae6a96bbb589cf620bcc5778baa2ebe893314027fda0a18074f095c65a5779d4b37c7364dc467a496c4061ffbe3c8b983eb013887e232ea95f4dc1141fe763

data/Gemfile.lock CHANGED Viewed

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    avo (4.0.0.beta.22)
+    avo (4.0.0.beta.23)
       actionview (>= 6.1)
       active_link_to
       activerecord (>= 6.1)

data/app/assets/builds/avo/application.css CHANGED Viewed

@@ -632,9 +632,6 @@
   .z-30 {
     z-index: 30;
   }
-  .z-40 {
-    z-index: 40;
-  }
   .z-50 {
     z-index: 50;
   }
@@ -7524,10 +7521,19 @@
     background-color: var(--color-primary);
     padding: calc(var(--spacing) * 0);
     position-anchor: auto;
-    position-area: bottom span-right;
+    position-area: bottom span-left;
     position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;
     box-shadow: var(--box-shadow-card);
   }
+  .popover-menu__panel--summary {
+    margin-block-end: 1rem;
+    position-area: bottom center;
+  }
+  .popover-menu__panel--summary > .dropdown-menu {
+    max-height: 70dvh;
+    overflow-y: auto;
+    overscroll-behavior: contain;
+  }
   .popover-menu__panel::backdrop {
     background-color: transparent;
   }

data/app/assets/stylesheets/css/components/ui/popover_menu.css CHANGED Viewed

@@ -8,11 +8,22 @@
 .popover-menu__panel {
   @apply m-0 p-0 border-0 rounded-lg bg-primary mt-1;
   position-anchor: auto;
-  position-area: bottom span-right;
+  position-area: bottom span-left;
   position-try-fallbacks: flip-block, flip-inline, flip-block flip-inline;
   box-shadow: var(--box-shadow-card);
 }
+.popover-menu__panel--summary {
+  margin-block-end: 1rem;
+  position-area: bottom center;
+}
+.popover-menu__panel--summary > .dropdown-menu {
+  max-height: 70dvh;
+  overflow-y: auto;
+  overscroll-behavior: contain;
+}
 .popover-menu__panel::backdrop {
   @apply bg-transparent;
 }

data/app/views/avo/partials/_table_header.html.erb CHANGED Viewed

@@ -58,7 +58,6 @@
       class: class_names("relative text-start px-2 py-2 whitespace-nowrap rounded-s", field.table_header_class),
       data: {
         control: "resource-field-th",
-        controller: "toggle",
         table_header_field_id: field.id,
         table_header_field_type: field.type,
       } do %>
@@ -82,34 +81,34 @@
         <% end %>
         <% if field.summarizable %>
-          <div
-            id="summary-header-<%= field.id %>"
-            class="cursor-pointer <%= text_classes %>"
-            data-action="click->toggle#togglePanel"
-          >
-            <%= svg 'tabler/filled/chart-pie-4', class: 'h-3 ms-1' %>
+          <% summary_popover_id = "summary-popover-#{field.id}" %>
+          <div class="popover-menu">
+            <button
+              type="button"
+              class="cursor-pointer <%= text_classes %>"
+              popovertarget="<%= summary_popover_id %>"
+            >
+              <%= svg 'tabler/filled/chart-pie-4', class: 'h-3 ms-1' %>
+            </button>
+            <turbo-frame
+              id="<%= summary_popover_id %>"
+              popover="auto"
+              loading="lazy"
+              src="<%= distribution_chart_path(
+                {
+                  resource_name: field.resource.model_class,
+                  field_id: field.id,
+                  via_record_id: @parent_record&.to_param,
+                  via_resource_class: @parent_resource&.class&.to_s,
+                  association_name: @field&.attribute_id
+                }.compact
+              ) %>"
+              class="popover-menu__panel popover-menu__panel--summary"
+              data-controller="popover-menu"
+            >
+              <%= render Avo::LoadingComponent.new %>
+            </turbo-frame>
           </div>
-          <turbo-frame
-            id="summary-frame-<%= field.id %>"
-            loading="lazy"
-            src="<%= distribution_chart_path(
-              {
-                resource_name: field.resource.model_class,
-                field_id: field.id,
-                via_record_id: @parent_record&.to_param,
-                via_resource_class: @parent_resource&.class&.to_s,
-                association_name: @field&.attribute_id
-              }.compact
-            ) %>"
-            class="
-              absolute inset-auto top-0 z-40 mt-6 w-full overflow-hidden rounded-sm border border-tertiary
-              bg-primary p-4 shadow-modal sm:w-[400px]
-            "
-            data-toggle-target="panel"
-            hidden
-          >
-            <%= render Avo::LoadingComponent.new %>
-          </turbo-frame>
         <% end %>
       <% end %>
     <% end %>

data/app/views/avo/partials/distribution_chart.html.erb CHANGED Viewed

@@ -1,22 +1,24 @@
-<turbo-frame id="summary-frame-<%= @field_id %>">
-  <div class="grid grid-cols-12 items-center">
-    <ul class="col-span-5" id="<%= @field_id %>-summary">
-      <% @values_summary.each_with_index do |(key, value), index| %>
-        <li class="grid grid-cols-6 items-center gap-3 text-sm font-semibold text-(--color-content-secondary) uppercase">
-          <div class="col-span-5 flex items-center space-x-1 truncate rtl:space-x-reverse">
-            <%= tag.div class: class_names("inline-block size-3 rounded-full", "bg-[#{chart_color(index)}]") %>
-            <span><%= key %></span>
-          </div>
+<turbo-frame id="summary-popover-<%= @field_id %>">
+  <div class="dropdown-menu p-4 sm:w-[400px]">
+    <div class="grid grid-cols-12 items-center">
+      <ul class="col-span-5" id="<%= @field_id %>-summary">
+        <% @values_summary.each_with_index do |(key, value), index| %>
+          <li class="grid grid-cols-6 items-center gap-3 text-sm font-semibold text-(--color-content-secondary) uppercase">
+            <div class="col-span-5 flex items-center space-x-1 truncate rtl:space-x-reverse">
+              <%= tag.div class: class_names("inline-block size-3 rounded-full", "bg-[#{chart_color(index)}]") %>
+              <span><%= key %></span>
+            </div>
-          <div class="col-span-1 text-end">
-            <%= value %>
-          </div>
-        </li>
-      <% end %>
-    </ul>
+            <div class="col-span-1 text-end">
+              <%= value %>
+            </div>
+          </li>
+        <% end %>
+      </ul>
-    <div class="col-span-6 col-start-7">
-      <%= pie_chart @values_summary, id: "chart-#{@field_id}", legend: false, height: "200px", colors: Avo.configuration.branding.chart_colors %>
+      <div class="col-span-6 col-start-7">
+        <%= pie_chart @values_summary, id: "chart-#{@field_id}", legend: false, height: "200px", colors: Avo.configuration.branding.chart_colors %>
+      </div>
     </div>
   </div>
 </turbo-frame>

data/lib/avo/engine.rb CHANGED Viewed

@@ -44,6 +44,7 @@ module Avo
     initializer "avo.tailwindcss", after: :load_config_initializers do
       next unless Rails.env.development?
+      next if defined?(Rails::Console)
       Rails.application.config.after_initialize do
         next unless Avo::TailwindBuilder.enabled?

data/lib/avo/version.rb CHANGED Viewed

@@ -1,3 +1,3 @@
 module Avo
-  VERSION = "4.0.0.beta.22" unless const_defined?(:VERSION)
+  VERSION = "4.0.0.beta.23" unless const_defined?(:VERSION)
 end

metadata CHANGED Viewed

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: avo
 version: !ruby/object:Gem::Version
-  version: 4.0.0.beta.22
+  version: 4.0.0.beta.23
 platform: ruby
 authors:
 - Adrian Marin