avo 3.0.1.beta8 → 3.0.1.beta9

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: ba8ff92bd87d9e0b8cfa4eb41412cfa4e919deb61bbd81612082ba0d439b329d
-  data.tar.gz: 9fb43629cf378585beb2d624f9fb9d83d1fdb60bc11053e3ea7f1fdfe9c868ec
+  metadata.gz: f3264b3be846ad999824eb23e3a1c78333fb4c7c8a50bfbccc159b314667e58c
+  data.tar.gz: 9c641eedc4086095fbc2483eda156f52befb4b4eba24141d8128b89ea0954b7d
 SHA512:
-  metadata.gz: e95a674b3c497843b0924d55021dee3480bfa86d7495d99c3aa7536340fc3dfcad258bd6aba6a5575f39bb6a4a714354a99bc3adf739dd8ab305f9f3a1d9fa1c
-  data.tar.gz: eaf7a6e8a66b13160777724fe9ff8e1e9052f0376023c5ddeabb0a14033d28ab5b6d46f82e72d7f9a90fbec341a535a8a8d4dd2f925b1c6d46e31a887ebe8314
+  metadata.gz: 880ee4788ba5f6b70f239b7564dfb3e8c0c6f4eefdc4307d2f2986d22889220db4b765463239471176538e2817eeec437b0083fcb9d5cf12c6d95fa6adad6012
+  data.tar.gz: d8fdc737465eed6a6f90e003041c585219037a2301b3b073ed726f6c6c249da6adf309950398fc6df0110da7e690ed7b1249e675a93744ee394cab787e295fb9

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    avo (3.0.1.beta8)
+    avo (3.0.1.beta9)
       actionview (>= 6.1)
       active_link_to
       activerecord (>= 6.1)

data/app/assets/builds/avo.base.css

@@ -6432,18 +6432,6 @@ tag.tagify__tag{
   }
 }
 
-.sr-only{
-  position:absolute;
-  width:1px;
-  height:1px;
-  padding:0;
-  margin:-1px;
-  overflow:hidden;
-  clip:rect(0, 0, 0, 0);
-  white-space:nowrap;
-  border-width:0
-}
-
 .pointer-events-none{
   pointer-events:none
 }
@@ -6497,14 +6485,6 @@ tag.tagify__tag{
   right:0px
 }
 
-.-bottom-1{
-  bottom:-0.25rem
-}
-
-.-bottom-1\.5{
-  bottom:-0.375rem
-}
-
 .-top-\[0\.1rem\]{
   top:-0.1rem
 }
@@ -6541,18 +6521,10 @@ tag.tagify__tag{
   left:1.25rem
 }
 
-.left-auto{
-  left:auto
-}
-
 .right-0{
   right:0px
 }
 
-.right-3{
-  right:0.75rem
-}
-
 .start-1{
   inset-inline-start:0.25rem
 }
@@ -6565,10 +6537,6 @@ tag.tagify__tag{
   top:50%
 }
 
-.top-2{
-  top:0.5rem
-}
-
 .top-3{
   top:0.75rem
 }
@@ -6581,10 +6549,6 @@ tag.tagify__tag{
   top:-1px
 }
 
-.top-auto{
-  top:auto
-}
-
 .top-full{
   top:100%
 }
@@ -6633,42 +6597,10 @@ tag.tagify__tag{
   grid-column:span 4 / span 4
 }
 
-.col-span-full{
-  grid-column:1 / -1
-}
-
-.row-span-1{
-  grid-row:span 1 / span 1
-}
-
-.row-span-2{
-  grid-row:span 2 / span 2
-}
-
-.row-span-3{
-  grid-row:span 3 / span 3
-}
-
-.row-span-4{
-  grid-row:span 4 / span 4
-}
-
-.row-span-5{
-  grid-row:span 5 / span 5
-}
-
-.row-span-6{
-  grid-row:span 6 / span 6
-}
-
 .float-right{
   float:right
 }
 
-.float-left{
-  float:left
-}
-
 .m-0{
   margin:0px
 }
@@ -6677,16 +6609,6 @@ tag.tagify__tag{
   margin:0.25rem
 }
 
-.-mx-1{
-  margin-left:-0.25rem;
-  margin-right:-0.25rem
-}
-
-.-mx-1\.5{
-  margin-left:-0.375rem;
-  margin-right:-0.375rem
-}
-
 .-mx-2{
   margin-left:-0.5rem;
   margin-right:-0.5rem
@@ -6758,10 +6680,6 @@ tag.tagify__tag{
   margin-top:-3rem
 }
 
-.-mt-2{
-  margin-top:-0.5rem
-}
-
 .-mt-9{
   margin-top:-2.25rem
 }
@@ -6794,10 +6712,6 @@ tag.tagify__tag{
   margin-left:8.333333%
 }
 
-.ml-1\/2{
-  margin-left:50%
-}
-
 .ml-10{
   margin-left:2.5rem
 }
@@ -6814,10 +6728,6 @@ tag.tagify__tag{
   margin-left:1rem
 }
 
-.ml-6{
-  margin-left:1.5rem
-}
-
 .ml-auto{
   margin-left:auto
 }
@@ -6846,10 +6756,6 @@ tag.tagify__tag{
   margin-right:1rem
 }
 
-.mr-px{
-  margin-right:1px
-}
-
 .mt-0{
   margin-top:0px
 }
@@ -7050,34 +6956,10 @@ tag.tagify__tag{
   min-height:6rem
 }
 
-.min-h-\[16rem\]{
-  min-height:16rem
-}
-
-.min-h-\[24rem\]{
-  min-height:24rem
-}
-
-.min-h-\[32rem\]{
-  min-height:32rem
-}
-
 .min-h-\[3rem\]{
   min-height:3rem
 }
 
-.min-h-\[40rem\]{
-  min-height:40rem
-}
-
-.min-h-\[48rem\]{
-  min-height:48rem
-}
-
-.min-h-\[8rem\]{
-  min-height:8rem
-}
-
 .min-h-full{
   min-height:100%
 }
@@ -7126,10 +7008,6 @@ tag.tagify__tag{
   width:1.25rem
 }
 
-.w-52{
-  width:13rem
-}
-
 .w-64{
   width:16rem
 }
@@ -7142,10 +7020,6 @@ tag.tagify__tag{
   width:1%
 }
 
-.w-\[calc\(100\%\+1rem\)\]{
-  width:calc(100% + 1rem)
-}
-
 .w-auto{
   width:auto
 }
@@ -7198,18 +7072,10 @@ tag.tagify__tag{
   max-width:32rem
 }
 
-.max-w-xs{
-  max-width:20rem
-}
-
 .flex-1{
   flex:1 1 0%
 }
 
-.flex-auto{
-  flex:1 1 auto
-}
-
 .flex-shrink{
   flex-shrink:1
 }
@@ -7391,10 +7257,6 @@ tag.tagify__tag{
   justify-content:space-evenly
 }
 
-.gap-0{
-  gap:0px
-}
-
 .gap-1{
   gap:0.25rem
 }
@@ -7672,11 +7534,6 @@ tag.tagify__tag{
   border-color:rgb(172 177 185 / var(--tw-border-opacity))
 }
 
-.border-gray-50{
-  --tw-border-opacity:1;
-  border-color:rgb(241 242 243 / var(--tw-border-opacity))
-}
-
 .border-gray-500{
   --tw-border-opacity:1;
   border-color:rgb(117 125 138 / var(--tw-border-opacity))
@@ -7795,6 +7652,11 @@ tag.tagify__tag{
   border-color:rgb(113 113 122 / var(--tw-border-opacity))
 }
 
+.bg-\[\#59b739\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(89 183 57 / var(--tw-bg-opacity))
+}
+
 .bg-amber-500{
   --tw-bg-opacity:1;
   background-color:rgb(245 158 11 / var(--tw-bg-opacity))
@@ -7809,11 +7671,6 @@ tag.tagify__tag{
   background-color:rgb(57 158 229 / var(--tw-bg-opacity))
 }
 
-.bg-blue-50{
-  --tw-bg-opacity:1;
-  background-color:rgb(230 243 252 / var(--tw-bg-opacity))
-}
-
 .bg-blue-500{
   --tw-bg-opacity:1;
   background-color:rgb(8 134 222 / var(--tw-bg-opacity))
@@ -7997,6 +7854,36 @@ tag.tagify__tag{
   background-color:rgb(113 113 122 / var(--tw-bg-opacity))
 }
 
+.bg-\[\#f154b2\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(241 84 178 / var(--tw-bg-opacity))
+}
+
+.bg-\[\#f154b3\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(241 84 179 / var(--tw-bg-opacity))
+}
+
+.bg-\[\#e3f337\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(227 243 55 / var(--tw-bg-opacity))
+}
+
+.bg-\[\#975343\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(151 83 67 / var(--tw-bg-opacity))
+}
+
+.bg-\[\#37e7a7\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(55 231 167 / var(--tw-bg-opacity))
+}
+
+.bg-\[\#121313\]{
+  --tw-bg-opacity:1;
+  background-color:rgb(18 19 19 / var(--tw-bg-opacity))
+}
+
 .bg-opacity-25{
   --tw-bg-opacity:0.25
 }
@@ -8033,10 +7920,6 @@ tag.tagify__tag{
   padding:0.5rem
 }
 
-.p-3{
-  padding:0.75rem
-}
-
 .p-4{
   padding:1rem
 }
@@ -8045,10 +7928,6 @@ tag.tagify__tag{
   padding:1.5rem
 }
 
-.p-px{
-  padding:1px
-}
-
 .px-0{
   padding-left:0px;
   padding-right:0px
@@ -8059,11 +7938,6 @@ tag.tagify__tag{
   padding-right:0.25rem
 }
 
-.px-1\.5{
-  padding-left:0.375rem;
-  padding-right:0.375rem
-}
-
 .px-10{
   padding-left:2.5rem;
   padding-right:2.5rem
@@ -8099,11 +7973,6 @@ tag.tagify__tag{
   padding-bottom:0px
 }
 
-.py-0\.5{
-  padding-top:0.125rem;
-  padding-bottom:0.125rem
-}
-
 .py-1{
   padding-top:0.25rem;
   padding-bottom:0.25rem
@@ -8177,10 +8046,6 @@ tag.tagify__tag{
   padding-bottom:1.5rem
 }
 
-.pl-1{
-  padding-left:0.25rem
-}
-
 .pr-0{
   padding-right:0px
 }
@@ -8237,25 +8102,11 @@ tag.tagify__tag{
   text-align:justify
 }
 
-.font-sans{
-  font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",  "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
-}
-
 .text-2xl{
   font-size:1.5rem;
   line-height:2rem
 }
 
-.text-3xl{
-  font-size:1.875rem;
-  line-height:2.25rem
-}
-
-.text-5xl{
-  font-size:3rem;
-  line-height:1
-}
-
 .text-base{
   font-size:1rem;
   line-height:1.5rem
@@ -8289,10 +8140,6 @@ tag.tagify__tag{
   font-weight:500
 }
 
-.font-normal{
-  font-weight:400
-}
-
 .font-semibold{
   font-weight:600
 }
@@ -8457,10 +8304,6 @@ tag.tagify__tag{
   color:rgb(236 72 153 / var(--tw-text-opacity))
 }
 
-.text-primary-400{
-  color:rgb(var(--color-primary-400))
-}
-
 .text-primary-500{
   color:rgb(var(--color-primary-500))
 }
@@ -8552,10 +8395,6 @@ tag.tagify__tag{
   text-decoration-line:line-through
 }
 
-.no-underline{
-  text-decoration-line:none
-}
-
 .antialiased{
   -webkit-font-smoothing:antialiased;
   -moz-osx-font-smoothing:grayscale
@@ -8670,12 +8509,6 @@ tag.tagify__tag{
   transition-duration:150ms
 }
 
-.transition-all{
-  transition-property:all;
-  transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration:150ms
-}
-
 .transition-opacity{
   transition-property:opacity;
   transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
@@ -8847,10 +8680,6 @@ trix-editor {
   background-color:rgb(var(--color-primary-400))
 }
 
-.focus-within\:border-primary-500:focus-within{
-  border-color:rgb(var(--color-primary-500))
-}
-
 .hover\:z-\[21\]:hover{
   z-index:21
 }
@@ -9024,11 +8853,6 @@ trix-editor {
   background-color:rgb(227 229 232 / var(--tw-bg-opacity))
 }
 
-.hover\:bg-gray-25:hover{
-  --tw-bg-opacity:1;
-  background-color:rgb(246 246 247 / var(--tw-bg-opacity))
-}
-
 .hover\:bg-gray-50:hover{
   --tw-bg-opacity:1;
   background-color:rgb(241 242 243 / var(--tw-bg-opacity))
@@ -9221,16 +9045,6 @@ trix-editor {
   color:rgb(94 100 110 / var(--tw-text-opacity))
 }
 
-.hover\:text-gray-700:hover{
-  --tw-text-opacity:1;
-  color:rgb(70 75 83 / var(--tw-text-opacity))
-}
-
-.hover\:text-gray-900:hover{
-  --tw-text-opacity:1;
-  color:rgb(23 25 28 / var(--tw-text-opacity))
-}
-
 .hover\:text-white:hover{
   --tw-text-opacity:1;
   color:rgb(255 255 255 / var(--tw-text-opacity))
@@ -10005,23 +9819,10 @@ trix-editor {
   display:block
 }
 
-.group:hover .group-hover\:bg-gray-200{
-  --tw-bg-opacity:1;
-  background-color:rgb(200 203 208 / var(--tw-bg-opacity))
-}
-
-.group:hover .group-hover\:bg-primary-500{
-  background-color:rgb(var(--color-primary-500))
-}
-
 .group:hover .group-hover\:pt-4{
   padding-top:1rem
 }
 
-.group:active .group-active\:bg-primary-400{
-  background-color:rgb(var(--color-primary-400))
-}
-
 @media print{
   .print\:hidden{
     display:none
@@ -10061,26 +9862,6 @@ trix-editor {
     right:0px
   }
 
-  .sm\:col-span-1{
-    grid-column:span 1 / span 1
-  }
-
-  .sm\:col-span-2{
-    grid-column:span 2 / span 2
-  }
-
-  .sm\:col-span-3{
-    grid-column:span 3 / span 3
-  }
-
-  .sm\:col-span-4{
-    grid-column:span 4 / span 4
-  }
-
-  .sm\:col-span-5{
-    grid-column:span 5 / span 5
-  }
-
   .sm\:col-span-6{
     grid-column:span 6 / span 6
   }
@@ -10113,10 +9894,6 @@ trix-editor {
     width:auto
   }
 
-  .sm\:min-w-\[16rem\]{
-    min-width:16rem
-  }
-
   .sm\:min-w-\[300px\]{
     min-width:300px
   }
@@ -10133,22 +9910,6 @@ trix-editor {
     grid-template-columns:repeat(2, minmax(0, 1fr))
   }
 
-  .sm\:grid-cols-3{
-    grid-template-columns:repeat(3, minmax(0, 1fr))
-  }
-
-  .sm\:grid-cols-4{
-    grid-template-columns:repeat(4, minmax(0, 1fr))
-  }
-
-  .sm\:grid-cols-5{
-    grid-template-columns:repeat(5, minmax(0, 1fr))
-  }
-
-  .sm\:grid-cols-6{
-    grid-template-columns:repeat(6, minmax(0, 1fr))
-  }
-
   .sm\:flex-row{
     flex-direction:row
   }
@@ -10226,6 +9987,10 @@ trix-editor {
     width:66.666667%
   }
 
+  .md\:w-full{
+    width:100%
+  }
+
   .md\:grid-cols-3{
     grid-template-columns:repeat(3, minmax(0, 1fr))
   }

data/app/components/avo/field_wrapper_component.html.erb

@@ -2,7 +2,7 @@
   class: classes,
   style: style,
   data: data do %>
-  <div class="h-full <% if stacked? %> md:pt-4 <% else %> md:pt-0 <% if short? %> md:h-10 <% else %> md:h-14 <% end %> <% end %> pt-4 flex self-start items-center flex-shrink-0 <%= @field.get_html(:classes, view: view, element: :label) %> w-48 <% if compact? %> md:w-48 xl:w-64 <% else %> md:w-64 <% end %> px-6 uppercase font-semibold text-gray-500 text-sm" data-slot="label">
+  <div class="h-full <% if stacked? %> md:pt-4 md:w-full <% else %> md:pt-0 <% if short? %> md:h-10 <% else %> md:h-14 <% end %> <% end %> pt-4 flex self-start items-center flex-shrink-0 <%= @field.get_html(:classes, view: view, element: :label) %> w-48 <% if compact? %> md:w-48 xl:w-64 <% else %> md:w-64 <% end %> px-6 uppercase font-semibold text-gray-500 text-sm" data-slot="label">
     <% if form.present? %>
       <%= form.label field.id, label %>
     <% else %>

data/app/components/avo/fields/boolean_field/index_component.html.erb

@@ -1,3 +1,3 @@
-<%= index_field_wrapper **field_wrapper_args, dash_if_blank: false, center_content: true, flush: true do %>
+<%= index_field_wrapper **field_wrapper_args, dash_if_blank: false, flush: true do %>
   <%= render Avo::Fields::Common::BooleanCheckComponent.new checked: @field.value %>
 <% end %>

data/app/components/avo/fields/common/badge_viewer_component.html.erb

@@ -1,25 +1 @@
-<%
-  backgrounds = {
-    info: 'bg-blue-500',
-    success: 'bg-green-500',
-    danger: 'bg-red-500',
-    warning: 'bg-yellow-500',
-    secondary: 'bg-gray-500',
-  }
-
-  label = @value
-  background = :info
-
-  @options.invert.each do |values, type|
-    if [values].flatten.map { |value| value }.include? @value
-      label = @value
-      background = type.to_sym
-      next
-    end
-  end
-
-  classes = 'whitespace-nowrap rounded-md uppercase px-2 py-1 text-xs font-bold block text-center truncate '
-
-  classes += "#{backgrounds[background]} text-white" if backgrounds[background].present?
-%>
-<span class="<%= classes %>" style="max-width: 120px;"><%= label %></span>
+<span class="<%= classes %>" style="max-width: 120px;"><%= @value %></span>

data/app/components/avo/fields/common/badge_viewer_component.rb

@@ -4,5 +4,29 @@ class Avo::Fields::Common::BadgeViewerComponent < ViewComponent::Base
   def initialize(value:, options:)
     @value = value
     @options = options
+    @backgrounds = {
+      info: "bg-blue-500",
+      success: "bg-green-500",
+      danger: "bg-red-500",
+      warning: "bg-yellow-500",
+      neutral: "bg-gray-500"
+    }
+  end
+
+  def classes
+    background = :info
+
+    @options.invert.each do |values, type|
+      if [values].flatten.map { |value| value }.include? @value
+        background = type.to_sym
+        next
+      end
+    end
+
+    classes = "whitespace-nowrap rounded-md uppercase px-2 py-1 text-xs font-bold block text-center truncate "
+
+    classes += "#{@backgrounds[background]} text-white" if @backgrounds[background].present?
+
+    classes
   end
 end

data/app/components/avo/fields/common/boolean_check_component.html.erb

@@ -1,12 +1 @@
-<%
-  classes = 'h-6 float-left mr-1'
-
-  if @checked
-    classes += ' text-green-600'
-    icon = 'heroicons/outline/check-circle'
-  else
-    classes += ' text-red-500'
-    icon = 'heroicons/outline/x-circle'
-  end
-%>
-<%= helpers.svg "#{icon}.svg", class: classes %>
+<%= helpers.svg "#{@icon}.svg", class: @classes %>

data/app/components/avo/fields/common/boolean_check_component.rb

@@ -2,6 +2,7 @@
 
 class Avo::Fields::Common::BooleanCheckComponent < ViewComponent::Base
   def initialize(checked: false)
-    @checked = checked
+    @icon = checked ? "heroicons/outline/check-circle" : "heroicons/outline/x-circle"
+    @classes = "h-6 #{checked ? "text-green-600" : "text-red-500"}"
   end
 end

data/app/components/avo/fields/common/gravatar_viewer_component.html.erb

@@ -9,4 +9,4 @@
   url = URI::HTTPS.build(host: "www.gravatar.com", path: "/avatar/#{@md5}", query: query)
   classes = @rounded ? 'rounded-full' : ''
 %>
-<%= link_to_if @link_to_resource.present?, image_tag(url.to_s, class: classes, width: options[:size], height: options[:size]), @link, title: @title %>
+<%= link_to_if @link_to_record.present?, image_tag(url.to_s, class: classes, width: options[:size], height: options[:size]), @link, title: @title %>