avo 2.7.1.pre.1 → 2.8.0

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

@@ -1,8 +1,10 @@
-<%= index_field_wrapper field: @field, flush: true do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: true do %>
   <% if @field.value.present? %>
-    <%= image_tag @field.value,
-      height: @field.height,
-      style: "border-radius: #{@field.radius}px; max-height: #{@field.height}#{@field.height.to_s&.ends_with?('px') ? '' : 'px'};"
+    <%= link_to_if @field.link_to_resource.present?,
+                   image_tag(@field.value,
+                             height: @field.height,
+                             style: "border-radius: #{@field.radius}px; max-height: #{@field.height}#{@field.height.to_s&.ends_with?('px') ? '' : 'px'};"),
+                   resource_path
     %>
   <% end %>
 <% end %>

data/app/components/avo/fields/external_image_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field do %>
+<%= show_field_wrapper field: @field, resource: @resource do %>
   <% if @field.value.present? %>
     <%= image_tag @field.value, style: 'max-width: 340px;' %>
   <% end %>

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

@@ -6,6 +6,11 @@
   <% end %>
 
   <% if @resource.authorization.authorize_action(:upload_attachments?, raise_exception: false) %>
-    <%= @form.file_field @field.id, disabled: @field.readonly, direct_upload: @field.direct_upload %>
+    <%= @form.file_field @field.id,
+      data: @field.get_html(:data, view: view, element: :input),
+      direct_upload: @field.direct_upload,
+      disabled: @field.readonly,
+      style: @field.get_html(:style, view: view, element: :input)
+    %>
   <% end %>
 <% end %>

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

@@ -1,4 +1,4 @@
-<%= index_field_wrapper field: @field, flush: flush? do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: flush? do %>
   <% if @field.value.present? %>
     <% if @field.value.attached? && @field.value.representable? && @field.is_image %>
       <%= link_to_if @field.link_to_resource, image_tag(helpers.main_app.url_for(@field.value), class: 'h-10'), resource_path, class: 'block' %>

data/app/components/avo/fields/file_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field do %>
+<%= show_field_wrapper field: @field, resource: @resource do %>
   <%= render Avo::Fields::Common::SingleFileViewerComponent.new resource: @resource, field: @field %>
 <% end %>

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

@@ -3,7 +3,13 @@
 
   <% if @resource.authorization.authorize_action(:upload_attachments?, raise_exception: false) %>
     <div class="mt-2">
-      <%= @form.file_field @field.id, disabled: @field.readonly, multiple: true, direct_upload: @field.direct_upload %>
+      <%= @form.file_field @field.id,
+        data: @field.get_html(:data, view: view, element: :input),
+        direct_upload: @field.direct_upload,
+        disabled: @field.readonly,
+        multiple: true,
+        style: @field.get_html(:style, view: view, element: :input)
+      %>
     </div>
   <% end %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <%= @field.value.attachments.length %> files
 <% end %>

data/app/components/avo/fields/files_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, full_width: true do %>
+<%= show_field_wrapper field: @field, resource: @resource, full_width: true do %>
   <%= render Avo::Fields::Common::FilesListViewerComponent.new(field: @field, resource: @resource) if @field.value.present? %>
 <% end %>

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

@@ -1,4 +1,4 @@
-<%= index_field_wrapper field: @field, flush: true do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: true do %>
   <%= render Avo::Fields::Common::GravatarViewerComponent.new(
     md5: @field.md5,
     default: @field.default,

data/app/components/avo/fields/gravatar_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= render Avo::Fields::Common::GravatarViewerComponent.new(
     md5: @field.md5,
     default: @field.default,

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <%= link_to @field.label, helpers.resource_path(model: @field.value, resource: @field.target_resource) %>
 <% end %>

data/app/components/avo/fields/hidden_field/edit_component.html.erb

@@ -1 +1,5 @@
-<%= @form.hidden_field @field.id %>
+<%= @form.hidden_field @field.id,
+  class: @field.get_html(:classes, view: view, element: :input),
+  data: @field.get_html(:data, view: view, element: :input),
+  style: @field.get_html(:style, view: view, element: :input)
+%>

data/app/components/avo/fields/id_field/edit_component.html.erb

@@ -1,3 +1,3 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
-  <%= field.value %>
+  <%= @field.value %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field, class: 'whitespace-no-wrap w-[1%]' do %>
+<%= index_field_wrapper field: @field, resource: @resource, class: 'whitespace-no-wrap w-[1%]' do %>
   <% link_to_if (@field.link_to_resource or Avo.configuration.id_links_to_resource), @field.value, resource_path, title: t('avo.view_item', item: @resource.name).humanize %>
 <% end %>

data/app/components/avo/fields/id_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= @field.value %>
 <% end %>

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

@@ -3,11 +3,14 @@
 class Avo::Fields::IndexComponent < ViewComponent::Base
   include Avo::ResourcesHelper
 
+  attr_reader :view
+
   def initialize(field: nil, resource: nil, index: 0, parent_model: nil)
     @field = field
     @resource = resource
     @index = index
     @parent_model = parent_model
+    @view = :index
   end
 
   def resource_path

data/app/components/avo/fields/key_value_field/edit_component.html.erb

@@ -1,3 +1,3 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal, full_width: true do %>
-  <%= render Avo::Fields::Common::KeyValueComponent.new field: @field, form: @form, view: :edit %>
+  <%= render Avo::Fields::Common::KeyValueComponent.new field: @field, form: @form, view: @resource.view %>
 <% end %>

data/app/components/avo/fields/key_value_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index, full_width: true do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index, full_width: true do %>
   <%= render Avo::Fields::Common::KeyValueComponent.new field: @field, view: :show %>
 <% end %>

data/app/components/avo/fields/markdown_field/edit_component.html.erb

@@ -1,12 +1,15 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal, full_width: true do %>
   <div data-controller="simple-mde">
     <%= @form.text_area @field.id,
-      class: helpers.input_classes('w-full js-has-simple-mde-editor', has_error: @field.model_errors.include?(@field.id)),
-      placeholder: @field.placeholder,
+      class: classes("w-full js-has-simple-mde-editor"),
+      data: {
+        view: @resource.view,
+        'simple-mde-target': 'element',
+        'component-options': @field.options.to_json,
+      },
       disabled: @field.readonly,
-      'data-simple-mde-target': 'element',
-      'data-component-options': @field.options.to_json,
-      'data-view': :edit
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input)
     %>
   </div>
 <% end %>

data/app/components/avo/fields/markdown_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index, full_width: true do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index, full_width: true do %>
   <div data-controller="simple-mde">
     <%= text_area_tag @field.id, @field.value,
       class: helpers.input_classes('w-full js-has-simple-mde-editor'),

data/app/components/avo/fields/number_field/edit_component.html.erb

@@ -1,9 +1,12 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.number_field @field.id,
-    class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-    placeholder: @field.placeholder,
+    class: classes("w-full"),
+    data: @field.get_html(:data, view: view, element: :input),
     disabled: @field.readonly,
-    min: @field.min,
     max: @field.max,
-    step: @field.step %>
+    min: @field.min,
+    placeholder: @field.placeholder,
+    step: @field.step,
+    style: @field.get_html(:style, view: view, element: :input)
+  %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <%= @field.value %>
 <% end %>

data/app/components/avo/fields/number_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= @field.value %>
 <% end %>

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

@@ -1,7 +1,9 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.password_field @field.id,
-    class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
+    class: classes("w-full"),
+    data: @field.get_html(:data, view: view, element: :input),
+    disabled: @field.readonly,
     placeholder: @field.placeholder,
-    disabled: @field.readonly
+    style: @field.get_html(:style, view: view, element: :input)
     %>
 <% end %>

data/app/components/avo/fields/progress_bar_field/edit_component.html.erb

@@ -5,12 +5,15 @@
     </div>
   <% end %>
   <%= @form.range_field @field.id,
-    min: 0,
+    class: "w-full #{@field.get_html(:classes, view: view, element: :input)}",
+    data: @field.get_html(:data, view: view, element: :input),
+    disabled: @field.readonly,
     max: @field.max,
-    step: @field.step,
-    class: 'w-full',
+    min: 0,
     placeholder: @field.placeholder,
-    disabled: @field.readonly %>
+    step: @field.step,
+    style: @field.get_html(:style, view: view, element: :input)
+  %>
 <% end %>
 
 

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

@@ -1,4 +1,4 @@
-<%= index_field_wrapper field: @field, flush: true do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: true do %>
   <% if @field.display_value %>
     <div class="text-center text-sm font-semibold w-full leading-none mb-1">
       <%= @field.value %><%= @field.value_suffix if @field.value_suffix.present? %>

data/app/components/avo/fields/progress_bar_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <% if @field.display_value %>
     <div class="text-center text-sm font-semibold w-full leading-none mb-1">
       <%= @field.value %><%= @field.value_suffix if @field.value_suffix.present? %>

data/app/components/avo/fields/select_field/edit_component.html.erb

@@ -1,6 +1,12 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.select @field.id, @field.options_for_select, { selected: @field.value, prompt: @field.placeholder }, {
-    class: helpers.input_classes(' w-full', has_error: @field.model_errors.include?(@field.id)),
-    disabled: @field.readonly,
-    value: @field.model.present? ? @field.model[@field.id] : @field.value } %>
+      aria: {
+        placeholder: @field.placeholder
+      },
+      class: classes("w-full"),
+      data: @field.get_html(:data, view: view, element: :input),
+      disabled: @field.readonly,
+      style: @field.get_html(:style, view: view, element: :input),
+      value: @field.model.present? ? @field.model[@field.id] : @field.value
+    } %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <%= @field.label %>
 <% end %>

data/app/components/avo/fields/select_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= @field.label %>
 <% end %>

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

@@ -3,9 +3,12 @@
 class Avo::Fields::ShowComponent < ViewComponent::Base
   include Avo::ResourcesHelper
 
+  attr_reader :view
+
   def initialize(field: nil, resource: nil, index: 0)
     @field = field
     @resource = resource
     @index = index
+    @view = :show
   end
 end

data/app/components/avo/fields/status_field/edit_component.html.erb

@@ -1,7 +1,10 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.text_field @field.id,
-    class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-    placeholder: @field.placeholder,
+    class: classes("w-full"),
+    data: @field.get_html(:data, view: view, element: :input),
     disabled: @field.readonly,
-    value: @resource.model.present? ? @resource.model[@field.id] : @field.value %>
+    placeholder: @field.placeholder,
+    style: @field.get_html(:style, view: view, element: :input),
+    value: @resource.model.present? ? @resource.model[@field.id] : @field.value
+  %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <%= render Avo::Fields::Common::StatusViewerComponent.new label: @field.value, status: @field.status %>
 <% end %>

data/app/components/avo/fields/status_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= render Avo::Fields::Common::StatusViewerComponent.new label: @field.value, status: @field.status %>
 <% end %>

data/app/components/avo/fields/tags_field/edit_component.html.erb

@@ -1,20 +1,23 @@
-<%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
+<%= edit_field_wrapper field: @field,
+  index: @index,
+  form: @form,
+  resource: @resource,
+  displayed_in_modal: @displayed_in_modal do %>
   <div data-controller="tags-field">
     <%# dummy field %>
     <%= text_field_tag "#{@field.id}-dummy", '',
-      class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-      placeholder: @field.placeholder,
-      disabled: @field.readonly,
-      value: '',
+      class: classes("w-full"),
       data: {
         'tags-field-target': 'fakeInput',
-      } %>
+      },
+      disabled: @field.readonly,
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input),
+      value: ''
+    %>
     <%# real field %>
     <%= @form.text_field @field.id,
-      class: helpers.input_classes('hidden w-full', has_error: @field.model_errors.include?(@field.id)),
-      placeholder: @field.placeholder,
-      disabled: @field.readonly,
-      value: @field.field_value.to_json,
+      class: classes("hidden w-full"),
       data: {
         'tags-field-target': 'input',
         'whitelist-items': @field.suggestions.to_json,
@@ -22,6 +25,11 @@
         'enforce-suggestions': @field.enforce_suggestions ? 1 : 0,
         'delimiters': @field.delimiters,
         'close-on-select': @field.close_on_select ? 1 : 0,
-      } %>
+      },
+      disabled: @field.readonly,
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input),
+      value: @field.field_value.to_json
+    %>
   </div>
 <% end %>

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

@@ -1,4 +1,4 @@
-<%= index_field_wrapper field: @field, flush: true do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: true do %>
   <div class="flex gap-1 items-center flex-nowrap">
     <% value.take(3).each do |item| %>
       <%= render Avo::Fields::TagsField::TagComponent.new(label: label_from_item(item)) %>

data/app/components/avo/fields/tags_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <div class="flex gap-1 items-center flex-wrap">
     <% @field.field_value.each do |item| %>
       <%= render Avo::Fields::TagsField::TagComponent.new(label: label_from_item(item)) %>

data/app/components/avo/fields/text_field/edit_component.html.erb

@@ -1,6 +1,9 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.text_field @field.id,
-    class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
+    class: classes("w-full"),
+    data: @field.get_html(:data, view: view, element: :input),
+    disabled: @field.readonly,
     placeholder: @field.placeholder,
-    disabled: @field.readonly %>
+    style: @field.get_html(:style, view: view, element: :input)
+  %>
 <% end %>

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

@@ -1,4 +1,4 @@
-<%= index_field_wrapper field: @field do %>
+<%= index_field_wrapper field: @field, resource: @resource do %>
   <% if @field.as_html %>
     <%== @field.value %>
   <% else %>

data/app/components/avo/fields/text_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <% if @field.as_html %>
     <%== @field.value %>
   <% else %>

data/app/components/avo/fields/textarea_field/edit_component.html.erb

@@ -1,7 +1,10 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal do %>
   <%= @form.text_area @field.id,
-    class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-    placeholder: @field.placeholder,
+    class: classes("w-full"),
+    data: @field.get_html(:data, view: view, element: :input),
     disabled: @field.readonly,
-    rows: @field.rows %>
+    placeholder: @field.placeholder,
+    rows: @field.rows,
+    style: @field.get_html(:style, view: view, element: :input)
+  %>
 <% end %>

data/app/components/avo/fields/textarea_field/show_component.html.erb

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%= @field.value %>
 <% end %>

data/app/components/avo/fields/trix_field/edit_component.html.erb

@@ -11,13 +11,22 @@
     data-hide-attachment-url="<%= @field.hide_attachment_url %>"
     class="relative block overflow-x-auto max-w-full"
   >
-    <% trix_id = "trix_#{@resource.name.underscore}_#{@field.id}" %>
-    <trix-editor data-trix-field-target="editor" input="<%= trix_id %>" placeholder="<%= @field.placeholder %>"><%== @field.value %></trix-editor>
+    <%= content_tag 'trix-editor',
+      data: {
+        "trix-field-target": "editor",
+        **@field.get_html(:data, view: view, element: :input)
+      },
+      input: trix_id,
+      placeholder: @field.placeholder do %>
+      <%== @field.value %>
+    <% end %>
     <%= @form.text_area @field.id,
+      class: classes("w-full hidden"),
+      data: @field.get_html(:data, view: view, element: :input),
+      disabled: @field.readonly,
       id: trix_id,
-      class: helpers.input_classes('w-full hidden', has_error: (@resource.model.present? and @resource.model.errors.include?(@field.id))),
       placeholder: @field.placeholder,
-      disabled: @field.readonly
+      style: @field.get_html(:style, view: view, element: :input)
     %>
   </div>
 <% end %>

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

@@ -1,4 +1,7 @@
 # frozen_string_literal: true
 
 class Avo::Fields::TrixField::EditComponent < Avo::Fields::EditComponent
+  def trix_id
+    "trix_#{@resource.name.underscore}_#{@field.id}"
+  end
 end

data/app/components/avo/fields/trix_field/show_component.html.erb

@@ -1,4 +1,4 @@
-<%= show_field_wrapper field: @field, index: @index do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index do %>
   <%
     content_classes = 'prose prose-sm'
     content_classes << ' hidden' unless @field.always_show

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

@@ -1,13 +1,20 @@
-<td class="min-h-[3rem] px-3 leading-tight whitespace-nowrap h-full text-slate-800 text-base <%= classes %>" data-field-id="<%= @field.id %>" data-field-type="<%= @field.type %>">
+<%= content_tag :td,
+  class: "min-h-[3rem] px-3 leading-tight whitespace-nowrap h-full text-slate-800 text-base #{classes}",
+  data: {
+    field_id: @field.id,
+    field_type: @field.type,
+    **stimulus_attributes
+  },
+  style: style do %>
   <% if @field.value.blank? && @dash_if_blank %>
     —
   <% else %>
     <% if @center_content %>
-    <div class="flex items-center justify-center">
-      <%= content %>
-    </div>
+      <div class="flex items-center justify-center">
+        <%= content %>
+      </div>
     <% else %>
       <%= content %>
     <% end %>
   <% end %>
-</td>
+<% end %>

data/app/components/avo/index/field_wrapper_component.rb

@@ -1,13 +1,17 @@
 # frozen_string_literal: true
 
 class Avo::Index::FieldWrapperComponent < ViewComponent::Base
-  def initialize(field: nil, dash_if_blank: true, center_content: false, flush: false, **args)
+  attr_reader :view
+
+  def initialize(field: nil, resource: nil, dash_if_blank: true, center_content: false, flush: false, **args)
     @field = field
+    @resource = resource
     @dash_if_blank = dash_if_blank
     @center_content = center_content
     @classes = args[:class].present? ? args[:class] : ""
     @args = args
     @flush = flush
+    @view = :index
   end
 
   def classes
@@ -18,18 +22,38 @@ class Avo::Index::FieldWrapperComponent < ViewComponent::Base
     end
 
     result += " #{text_align_classes}"
+    result += " #{@field.get_html(:classes, view: view, element: :wrapper)}"
 
     result
   end
 
+  def style
+    @field.get_html(:style, view: view, element: :wrapper)
+  end
+
+  def stimulus_attributes
+    attributes = {}
+
+    @resource.get_stimulus_controllers.split(" ").each do |controller|
+      attributes["#{controller}-target"] = "#{@field.id.to_s.underscore}_#{@field.type.to_s.underscore}_wrapper".camelize(:lower)
+    end
+
+    wrapper_data_attributes = @field.get_html :data, view: view, element: :wrapper
+    if wrapper_data_attributes.present?
+      attributes.merge! wrapper_data_attributes
+    end
+
+    attributes
+  end
+
   private
 
   def text_align_classes
     case @field.index_text_align.to_sym
     when :right
-      'text-right'
+      "text-right"
     when :center
-      'text-center'
+      "text-center"
     end
   end
 end

data/app/components/avo/panel_component.rb

@@ -25,9 +25,10 @@ class Avo::PanelComponent < ViewComponent::Base
   end
 
   def data_attributes
-    @data.merge({'panel-index': @index}).map do |key, value|
-      " data-#{key}=\"#{value}\""
-    end.join
+    @data.merge({"panel-index": @index})
+      .map do |key, value|
+        " data-#{key}=\"#{value}\""
+      end.join
   end
 
   def display_breadcrumbs?

data/app/components/avo/resource_component.rb

@@ -4,6 +4,7 @@ class Avo::ResourceComponent < Avo::BaseComponent
   attr_reader :has_many_panels
   attr_reader :has_as_belongs_to_many_panels
   attr_reader :resource_tools
+  attr_reader :view
 
   def can_create?
     return authorize_association_for(:create) if @reflection.present?

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

@@ -1,4 +1,4 @@
-<%= render Avo::CommonFieldWrapperComponent.new(field: @field, dash_if_blank: @dash_if_blank, full_width: @full_width) do %>
+<%= render Avo::CommonFieldWrapperComponent.new(field: @field, resource: @resource, dash_if_blank: @dash_if_blank, full_width: @full_width, view: :show) do %>
   <div class="self-center <% if @full_width %> w-full <% else %> w-full md:w-8/12 <% end %>" data-slot="value">
     <% if @field.value.blank? and @dash_if_blank %>
       —

data/app/components/avo/show/field_wrapper_component.rb

@@ -1,8 +1,9 @@
 # frozen_string_literal: true
 
 class Avo::Show::FieldWrapperComponent < ViewComponent::Base
-  def initialize(field: nil, dash_if_blank: true, full_width: false, **args)
+  def initialize(field: nil, resource: nil, dash_if_blank: true, full_width: false, **args)
     @field = field
+    @resource = resource
     @dash_if_blank = dash_if_blank
     @classes = args[:class].present? ? args[:class] : ""
     @args = args