Merge branch 'main' into feature/click_to_copy

Gemfile.lock

@@ -107,7 +107,7 @@ GIT
 PATH
   remote: .
   specs:
-    avo (3.13.6)
+    avo (3.14.3)
       actionview (>= 6.1)
       active_link_to
       activerecord (>= 6.1)
@@ -508,7 +508,7 @@ GEM
       railties (>= 5.2)
     reverse_markdown (2.1.1)
       nokogiri
-    rexml (3.3.7)
+    rexml (3.3.9)
     ripper-tags (1.0.2)
     rspec-core (3.13.1)
       rspec-support (~> 3.13.0)

README.md

@@ -110,7 +110,7 @@ Please read the [RELEASE.MD](./RELEASE.MD)
 </tr>
 </table>
 
-[Become a sponsor ](https://github.com/sponsors/adrianthedev)
+[Become a sponsor](mailto:[email protected])
 
 
 ![Alt](https://repobeats.axiom.co/api/embed/1481a6a259064f02a7936470d12a50802a9c98a4.svg "Repobeats analytics image")
@@ -120,3 +120,10 @@ Please read the [RELEASE.MD](./RELEASE.MD)
 [Get a box of waffles and some of the best app monitoring from Appsignal](https://appsignal.com/r/93dbe69bfb) 🧇
 
 [Get $100 in credits from Digital Ocean](https://www.digitalocean.com/?refcode=efc1fe881d74&utm_campaign=Referral_Invite&utm_medium=Referral_Program&utm_source=badge) 💸
+
+## Other Open Source Work
+
+ - [`active_storage-blurhash`](https://github.com/avo-hq/active_storage-blurhash) - A plug-n-play [blurhash](https://blurha.sh/) integration for images stored in ActiveStorage
+ - [`class_variants`](https://github.com/avo-hq/class_variants) - Easily configure styles and apply them as classes. Very useful when you're implementing Tailwind CSS components and call them with different states.
+ - [`prop_initializer`](https://github.com/avo-hq/prop_initializer) - A flexible tool for defining properties on Ruby classes.
+ - [`stimulus-confetti`](https://github.com/avo-hq/stimulus-confetti) - The easiest way to add confetti to your StimulusJS app

app/assets/stylesheets/css/fields/trix.css

@@ -1,5 +1,14 @@
 @import './../../../../../node_modules/trix/dist/trix.css';
 
+.trix-content.hidden {
+  display: block !important;
+  clip-path: inset(0 0 calc(100% - 50px) 0);
+  -webkit-mask-image: linear-gradient(to bottom, black 30px, transparent 50px);
+  mask-image: linear-gradient(to bottom, black 30px, transparent 50px);
+  max-height: 50px;
+  min-height: 0px;
+}
+
 .trix-content h1 {
   @apply text-xl font-bold mb-2;
 }

app/components/avo/actions_component.rb

@@ -34,6 +34,13 @@ class Avo::ActionsComponent < Avo::BaseComponent
 
   def after_initialize
     filter_actions unless @custom_list
+
+    # Hydrate each action action with the record when rendering a list on row controls
+    if @as_row_control
+      @actions.each do |action|
+        action.hydrate(resource: @resource, record: @resource.record) if action.respond_to?(:hydrate)
+      end
+    end
   end
 
   def render?
@@ -52,31 +59,16 @@ def filter_actions
     end
   end
 
-  # How should the action be displayed by default
-  def is_disabled?(action)
-    return false if action.standalone || @as_row_control
-
-    on_index_page?
-  end
-
   private
 
-  def on_record_page?
-    @view.in?(["show", "edit", "new"])
-  end
-
-  def on_index_page?
-    !on_record_page?
-  end
-
   def icon(icon)
     svg icon, class: "h-5 shrink-0 mr-1 inline pointer-events-none"
   end
 
   def render_item(action)
     case action
     when Avo::Divider
-      render_divider(action)
+      render Avo::DividerComponent.new(action.label)
     when Avo::BaseAction
       render_action_link(action)
     when defined?(Avo::Advanced::Resources::Controls::Action) && Avo::Advanced::Resources::Controls::Action
@@ -92,11 +84,6 @@ def render_item(action)
 
   private
 
-  def render_divider(action)
-    label = action.label.is_a?(Hash) ? action.label[:label] : nil
-    render Avo::DividerComponent.new(label)
-  end
-
   def render_action_link(action, icon: nil)
     link_to action.link_arguments(resource: @resource, arguments: action.arguments).first,
       data: action_data_attributes(action),
@@ -112,15 +99,17 @@ def action_data_attributes(action)
       "turbo-frame": Avo::MODAL_FRAME_ID,
       action: "click->actions-picker#visitAction",
       "actions-picker-target": action.standalone ? "standaloneAction" : "resourceAction",
-      disabled: is_disabled?(action),
+      disabled: action.disabled?,
       turbo_prefetch: false,
+      enabled_classes: "text-black",
+      disabled_classes: "text-gray-500"
     }
   end
 
   def action_css_class(action)
     helpers.class_names("flex items-center px-4 py-3 w-full font-semibold text-sm hover:bg-primary-100", {
-      "text-gray-500": is_disabled?(action),
-      "text-black": !is_disabled?(action),
+      "text-gray-500": action.disabled?,
+      "text-black": action.enabled?,
     })
   end
 end

app/components/avo/button_component.rb

@@ -57,11 +57,9 @@ def is_not_icon?
 
   def full_content
     result = ""
-    icon_classes = @icon_class
     # space out the icon from the text if text is present
-    icon_classes += " mr-1" if content.present? && is_not_icon?
     # add the icon height
-    icon_classes += icon_size_classes
+    icon_classes = class_names(@icon_class, "pointer-events-none", icon_size_classes, "mr-1": content.present? && is_not_icon?)
 
     # Add the icon
     result += helpers.svg(@icon, class: icon_classes) if @icon.present?

app/components/avo/fields/belongs_to_field/edit_component.html.erb

@@ -49,10 +49,9 @@
             <% else %>
               <%= @form.select @field.id_input_foreign_key,
               options_for_select(
-                # Options
                 @field.values_for_type(type),
-                # Selected
-                @field.value.is_a?(type) ? @field.value.to_param : nil
+                selected: @field.value.is_a?(type) ? @field.value.to_param : nil,
+                disabled: t("avo.more_records_available")
               ),
               {
                 include_blank: @field.placeholder,
@@ -103,7 +102,7 @@
       %>
     <% else %>
       <%= @form.select @field.id_input_foreign_key,
-        options_for_select(@field.options, @field.value.to_param),
+        options_for_select(@field.options, selected: @field.value.to_param, disabled: t("avo.more_records_available")),
         {
           include_blank: @field.placeholder,
         },

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

@@ -1 +1 @@
-<%= helpers.svg "#{@icon}.svg", class: @classes %>
+<%= helpers.svg "#{@icon}.svg", class: classes %>

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

@@ -2,10 +2,17 @@
 
 class Avo::Fields::Common::BooleanCheckComponent < Avo::BaseComponent
   prop :checked, default: false
+  prop :size, default: :md
   prop :icon do |value|
     @checked ? "heroicons/outline/check-circle" : "heroicons/outline/x-circle"
   end
-  prop :classes do |value|
-    "h-6 #{@checked ? "text-green-600" : "text-red-500"}"
+
+  def classes
+    helpers.class_names({
+      "h-5": @size == :sm,
+      "h-6": @size == :md,
+      "text-green-600": @checked,
+      "text-red-600": !@checked,
+    })
   end
 end

app/components/avo/fields/common/boolean_group_component.html.erb

@@ -1,11 +1,11 @@
 <div data-controller="tippy">
   <%= link_to t("avo.view").humanize, "javascript:void(0);", data: {"tippy-target": :source} %>
   <div class="hidden" data-tippy-target="content">
-    <div class="p-2 space-y-2">
+    <div class="p-1 space-y-1">
       <% @options.each do |id, label| %>
-        <div class="flex flex-nowrap">
-          <%= render Avo::Fields::Common::BooleanCheckComponent.new checked: @value.present? && @value&.with_indifferent_access[id].present? %>
-          <div class="ml-px text-left py-px"><%= label %></div>
+        <div class="flex items-center flex-nowrap space-x-1">
+          <%= render Avo::Fields::Common::BooleanCheckComponent.new checked: checked(id), size: :sm %>
+          <div class="flex itdems-center text-left text-sm py-px"><%= label %></div>
         </div>
       <% end %>
     </div>

app/components/avo/fields/common/boolean_group_component.rb

@@ -3,4 +3,8 @@
 class Avo::Fields::Common::BooleanGroupComponent < Avo::BaseComponent
   prop :options, default: {}.freeze
   prop :value
+
+  def checked(id)
+    @value.present? && @value.with_indifferent_access[id].present?
+  end
 end

app/components/avo/fields/common/key_value_component.html.erb

@@ -15,7 +15,7 @@
           <%= @field.value_label %>
         </div>
         <% if @view.form? %>
-          <div class="flex items-center justify-center p-2 px-3 border-l border-gray-600">
+          <div class="flex items-center justify-center p-2 px-[48px] border-l border-gray-600">
             <a href="javascript:void(0);"
               title="<%= @field.action_text %>"
               data-tippy="tooltip"

app/components/avo/fields/file_field/edit_component.html.erb

@@ -6,15 +6,34 @@
   <% end %>
 
   <% if can_upload_file? %>
-    <%= @form.file_field @field.id,
-      accept: @field.accept,
-      data: @field.get_html(:data, view: view, element: :input),
-      direct_upload: @field.direct_upload,
-      disabled: disabled?,
-      style: @field.get_html(:style, view: view, element: :input),
-      autofocus: @autofocus,
-      class: "w-full"
-    %>
+    <div data-controller="clear-input">
+      <div class="mt-2 flex items-center">
+        <%= @form.file_field @field.id,
+          accept: @field.accept,
+          data: @field.get_html(:data, view: view, element: :input)
+            .merge(
+              action: "change->clear-input#showClearButton",
+              clear_input_target: "input"
+            ),
+          direct_upload: @field.direct_upload,
+          disabled: disabled?,
+          style: @field.get_html(:style, view: view, element: :input),
+          autofocus: @autofocus,
+          class: "w-full"
+        %>
+      </div>
+      <%= content_tag :button,
+          class: "self-center hidden font-semibold text-xs text-red-600 p-1",
+          id: :reset,
+          type: :button,
+          data: {
+            clear_input_target: "clearButton",
+            action: "click->clear-input#clearInput",
+            tippy: :tooltip
+          } do %>
+        <% t("avo.clear_value") %>
+      <% end %>
+    </div>
   <% else %>
     —
   <% end %>

app/components/avo/fields/files_field/edit_component.html.erb

@@ -2,17 +2,33 @@
   <%= render Avo::Fields::Common::Files::ListViewerComponent.new(field: @field, resource: @resource) if @field.value.present? %>
 
   <% if can_upload_file? %>
-    <div class="mt-2">
-      <%= @form.file_field @field.id,
-        accept: @field.accept,
-        data: @field.get_html(:data, view: view, element: :input),
-        direct_upload: @field.direct_upload,
-        disabled: disabled?,
-        multiple: true,
-        style: @field.get_html(:style, view: view, element: :input),
-        class: "w-full",
-        autofocus: @autofocus
-      %>
+    <div data-controller="clear-input">
+      <div class="mt-2 flex items-center">
+        <%= @form.file_field @field.id,
+          accept: @field.accept,
+          data: @field.get_html(:data, view: view, element: :input)
+            .merge(
+              action: "change->clear-input#showClearButton",
+              clear_input_target: "input"
+            ),
+          direct_upload: @field.direct_upload,
+          disabled: disabled?,
+          multiple: true,
+          style: @field.get_html(:style, view: view, element: :input),
+          autofocus: @autofocus
+        %>
+      </div>
+      <%= content_tag :button,
+          class: "self-center hidden font-semibold text-xs text-red-600 p-1",
+          id: :reset,
+          type: :button,
+          data: {
+            clear_input_target: "clearButton",
+            action: "click->clear-input#clearInput",
+            tippy: :tooltip
+          } do %>
+        <% t("avo.clear_value") %>
+      <% end %>
     </div>
   <% else %>
     —

app/components/avo/fields/password_field/edit_component.html.erb

@@ -1,12 +1,24 @@
 <%= field_wrapper **field_wrapper_args do %>
-  <%= @form.password_field @field.id,
-    value: @field.value,
-    class: classes("w-full"),
-    data: @field.get_html(:data, view: view, element: :input),
-    disabled: disabled?,
-    placeholder: @field.placeholder,
-    style: @field.get_html(:style, view: view, element: :input),
-    autocomplete: @field.autocomplete,
-    autofocus: @autofocus
+  <div class="relative" data-controller="<%= @field.revealable ? 'password-visibility' : nil %>">
+    <%= @form.password_field @field.id,
+      value: @field.value,
+      class: classes("w-full"),
+      data: @field.get_html(:data, view: view, element: :input).merge(password_visibility_target: "input"),
+      disabled: disabled?,
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input),
+      autocomplete: @field.autocomplete,
+      autofocus: @autofocus
     %>
+
+    <% if @field.revealable %>
+      <button data-action="password-visibility#toggle" type="button" class="text-gray-500 absolute inset-y-0 right-0 pr-3 flex items-center cursor-pointer">
+        <!-- Heroicon name: outline/eye -->
+        <%= helpers.svg('heroicons/outline/eye', class: "size-6", data: { 'password-visibility-target': 'icon' }) %>
+
+        <!-- Heroicon name: outline/eye-off -->
+        <%= helpers.svg('heroicons/outline/eye-off', class: "size-6 hidden", data: { 'password-visibility-target': 'icon' }) %>
+      </button>
+    <% end %>
+  </div>
 <% end %>

app/components/avo/fields/radio_field/edit_component.html.erb

@@ -0,0 +1,10 @@
+<%= field_wrapper **field_wrapper_args do %>
+  <div class="flex flex-col gap-2">
+    <% @field.options.each do |key, value| %>
+      <div>
+        <%= form.radio_button @field.id, key %>
+        <%= form.label @field.id, value: value %>
+      </div>
+    <% end %>
+  </div>
+<% end %>

app/components/avo/fields/radio_field/edit_component.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+class Avo::Fields::RadioField::EditComponent < Avo::Fields::EditComponent
+end

app/components/avo/fields/radio_field/index_component.html.erb

@@ -0,0 +1,3 @@
+<%= index_field_wrapper **field_wrapper_args do %>
+  <%== @field.value %>
+<% end %>

app/components/avo/fields/radio_field/index_component.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+class Avo::Fields::RadioField::IndexComponent < Avo::Fields::IndexComponent
+end

app/components/avo/fields/radio_field/show_component.html.erb

@@ -0,0 +1,3 @@
+<%= field_wrapper **field_wrapper_args do %>
+  <%== @field.value %>
+<% end %>

app/components/avo/fields/radio_field/show_component.rb

@@ -0,0 +1,4 @@
+# frozen_string_literal: true
+
+class Avo::Fields::RadioField::ShowComponent < Avo::Fields::ShowComponent
+end

app/components/avo/fields/trix_field/edit_component.rb

@@ -29,6 +29,9 @@ def data_values
       hide_attachment_filesize: @field.hide_attachment_filesize,
       hide_attachment_url: @field.hide_attachment_url,
       is_action_text: @field.is_action_text?,
+      upload_warning: t("avo.you_cant_upload_new_resource"),
+      attachment_disable_warning: t("avo.this_field_has_attachments_disabled"),
+      attachment_key_warning: t("avo.you_havent_set_attachment_key")
     }.transform_keys { |key| "trix_field_#{key}_value" }
   end
 end