avo 2.7.0 → 2.9.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c49705a72c31381fe9a133a58b1953d56513fda407157b4c92a17f933424b3e5
-  data.tar.gz: 6680ac6be68f89e9ecdbce81f3ee2ecd18915369509c27914835f824f8da550e
+  metadata.gz: 7a1d99b5007b69c25b8eb7b426fd8881d9baacc700d4f14c0ed8dfeac81c7004
+  data.tar.gz: bb18e3d2d52f500c3d73ae8f29bf0165ea560905c848388bfeef127850cc5e79
 SHA512:
-  metadata.gz: b34915f9540a2e057df9cde8c228077eec22bafee204cb076399a1eb2b3ee36834aff7fb50b9fb57060c3271cb31387d7fcbd27642fca8222a245db04cc70182
-  data.tar.gz: 0a3ce0cad78f3fd6b3cde3534d879e9729569e3e3ac8ea595fd4266c77b6025227bad0154a2f69263c1e8858337906c788d63f635976e2678a94f95d5419d72b
+  metadata.gz: 516b6413536158cd998e3addbb3b327f3fbdbdec504a9f1502aaadc5f52925490966c22a5d67f161933e08e5c5c0f4c0a0bf1e3a207216297dd65e50966569b9
+  data.tar.gz: 5474fa61b0268b691865abc602271828c49500612bbe22617a2bf117fc1c2cc05ab0568ba78ea917ff021bf63bfd63ad9d728868d723e9684dc9c7c38e636615

data/Gemfile

@@ -152,3 +152,5 @@ gem 'acts_as_list'
 gem 'acts-as-taggable-on', '~> 9.0'
 
 gem "bundler-integrity", "~> 1.0"
+
+gem 'erb-formatter'

data/Gemfile.lock

@@ -1,7 +1,7 @@
 PATH
   remote: .
   specs:
-    avo (2.7.0)
+    avo (2.9.0)
       active_link_to
       addressable
       breadcrumbs_on_rails
@@ -136,7 +136,7 @@ GEM
       rack-test (>= 0.6.3)
       regexp_parser (>= 1.5, < 3.0)
       xpath (~> 3.2)
-    chartkick (4.1.3)
+    chartkick (4.2.0)
     childprocess (4.1.0)
     concurrent-ruby (1.1.9)
     countries (4.2.1)
@@ -167,6 +167,7 @@ GEM
       dotenv (= 2.7.6)
       railties (>= 3.2)
     dry-initializer (3.1.1)
+    erb-formatter (0.3.0)
     erubi (1.10.0)
     factory_bot (6.2.0)
       activesupport (>= 5.0.0)
@@ -210,7 +211,7 @@ GEM
     io-wait (0.2.1)
     iso (0.4.0)
       i18n
-    jmespath (1.5.0)
+    jmespath (1.6.1)
     jsbundling-rails (1.0.0)
       railties (>= 6.0.0)
     launchy (2.5.0)
@@ -264,7 +265,7 @@ GEM
     pundit (2.2.0)
       activesupport (>= 3.0.0)
     racc (1.6.0)
-    rack (2.2.3)
+    rack (2.2.3.1)
     rack-test (1.1.0)
       rack (>= 1.0, < 3)
     rails (6.1.4.6)
@@ -441,6 +442,7 @@ DEPENDENCIES
   database_cleaner
   devise
   dotenv-rails
+  erb-formatter
   factory_bot_rails
   faker
   friendly_id (~> 5.4.0)

data/README.md

@@ -76,6 +76,17 @@ Please read the [UPGRADE_GUIDE.MD](https://docs.avohq.io/2.0/upgrade.html)
 </a>
 <!--  https://contrib.rocks -->
 
+# 🥇 Business & Agency Sponsors
+
+<a href="https://equipetechnique.com/?utm_source=github&utm_medium=link&utm_campaign=avo_code_without_borders" target="_blank">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://avohq.io/img/sponsors/ET-dark.jpeg">
+    <img alt="Equipe Technique Busines Sponsor" src="https://avohq.io/img/sponsors/ET-light.jpeg" width="240px">
+  </picture>
+</a>
+
+[Become a sponsor ](https://github.com/sponsors/adrianthedev)
+
 
 ![Alt](https://repobeats.axiom.co/api/embed/1481a6a259064f02a7936470d12a50802a9c98a4.svg "Repobeats analytics image")
 

data/app/assets/stylesheets/avo.css

@@ -1,7 +1,6 @@
 @import './../../../node_modules/simplemde/dist/simplemde.min.css';
 @import './../../../node_modules/tippy.js/dist/tippy.css';
 @import './../../../node_modules/tippy.js/themes/light.css';
-@import './../../../node_modules/trix/dist/trix.css';
 @import './../../../node_modules/flatpickr/dist/flatpickr.css';
 @import './../../../node_modules/@algolia/autocomplete-theme-classic/dist/theme.css';
 @import './../../../node_modules/@yaireo/tagify/dist/tagify.css';
@@ -20,9 +19,10 @@
 @import './css/spinner.css';
 @import './css/tags.css';
 
-@import './css/components/status.css';
-@import './css/components/code.css';
-@import './css/components/progress.css';
+@import './css/fields/status.css';
+@import './css/fields/code.css';
+@import './css/fields/progress.css';
+@import './css/fields/trix.css';
 
 @import 'tailwindcss/components';
 

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

@@ -0,0 +1,17 @@
+@import './../../../../../node_modules/trix/dist/trix.css';
+
+.trix-content h1 {
+  @apply text-xl font-bold mb-2;
+}
+
+.trix-content ul {
+  @apply list-disc;
+}
+
+.trix-content pre {
+  @apply text-base;
+}
+
+.trix-content ol {
+  @apply list-decimal;
+}

data/app/assets/svgs/download-solid-reversed.svg

@@ -1,3 +1,3 @@
-<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor" transform="rotate(-180)">
-  <path fill-rule="evenodd" d="M3 17a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm3.293-7.707a1 1 0 011.414 0L9 10.586V3a1 1 0 112 0v7.586l1.293-1.293a1 1 0 111.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z" clip-rule="evenodd" />
+<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
+  <path fill-rule="evenodd" d="M3 17a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zm3.293-7.707a1 1 0 011.414 0L9 10.586V3a1 1 0 112 0v7.586l1.293-1.293a1 1 0 111.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z" clip-rule="evenodd" transform="rotate(-180 10 10)" />
 </svg>

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

@@ -4,6 +4,7 @@
   data-actions-picker-disabled-class="cursor-wait text-gray-500"
 >
   <%= a_button style: :outline,
+    type: :button,
     color: :primary,
     class: "focus:outline-none",
     icon: 'arrow-circle-right',
@@ -18,24 +19,15 @@
   >
     <div class="w-full space divide-y">
       <% @actions.each_with_index do |action, index| %>
-        <%
-          path = action_name == 'show' ?
-            "#{@resource.record_path}/actions/#{action.param_id}" :
-            "#{@resource.records_path}/actions/#{action.param_id}"
-          if action_name == 'show' || action.standalone
-            disabled = false
-          else
-            disabled = true
-          end
-        %>
-        <%= link_to path,
+        <%= link_to action_path(action.param_id),
           data: {
             'turbo-frame': 'actions_show',
             'action': 'click->actions-picker#visitAction',
             'actions-picker-target': action.standalone ? 'standaloneAction' : 'resourceAction',
-            'disabled': disabled,
+            'disabled': is_disabled?(action),
           },
-          class: "flex items-center px-4 py-3 w-full font-semibold text-sm #{disabled ? 'text-gray-500' : 'text-black hover:bg-blue-500 hover:text-white'}" do %>
+          title: action.action_name,
+          class: "flex items-center px-4 py-3 w-full font-semibold text-sm #{is_disabled?(action) ? 'text-gray-500' : 'text-black hover:bg-blue-500 hover:text-white'}" do %>
           <%= svg 'play', class: 'h-5 mr-1 inline' %> <%= action.action_name %>
         <% end %>
       <% end %>

data/app/components/avo/actions_component.rb

@@ -3,12 +3,50 @@
 class Avo::ActionsComponent < ViewComponent::Base
   include Avo::ApplicationHelper
 
-  def initialize(actions: [], resource: nil)
+  def initialize(actions: [], resource: nil, view: nil)
     @actions = actions
     @resource = resource
+    @view = view
   end
 
   def render?
     @actions.present?
   end
+
+  # When running an action for one record we should do it on a special path.
+  # We do that so we get the `model` param inside the action so we can prefill fields.
+  def action_path(id)
+    return many_records_path(id) unless @resource.has_model_id?
+
+    if on_record_page?
+      single_record_path id
+    else
+      many_records_path id
+    end
+  end
+
+  # How should the action be displayed by default
+  def is_disabled?(action)
+    return false if action.standalone
+
+    on_index_page?
+  end
+
+  private
+
+  def on_record_page?
+    @view.in?([:show, :edit, :new])
+  end
+
+  def on_index_page?
+    !on_record_page?
+  end
+
+  def single_record_path(id)
+    "#{@resource.record_path}/actions/#{id}"
+  end
+
+  def many_records_path(id)
+    "#{@resource.records_path}/actions/#{id}"
+  end
 end

data/app/components/avo/alert_component.rb

@@ -21,6 +21,8 @@ class Avo::AlertComponent < ViewComponent::Base
   end
 
   def classes
+    return "hidden" if is_empty?
+
     result = "max-w-lg w-full shadow-lg rounded px-4 py-3 rounded relative border text-white pointer-events-auto"
 
     result += if is_error?
@@ -51,4 +53,8 @@ class Avo::AlertComponent < ViewComponent::Base
   def is_warning?
     type.to_sym == :warning
   end
+
+  def is_empty?
+    message.nil?
+  end
 end

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

@@ -11,8 +11,8 @@
             <%= @card.label %>
           </div>
         <div data-controller="select">
-          <% if @card.type == :metric && @card.parsed_ranges.present? %>
-            <%= select_tag "#{@card.id}_#{@card.index}_range", options_for_select(@card.parsed_ranges, @card.range),
+          <% if @card.type.in?([:metric, :chartkick, :partial]) && @card.ranges.present? %>
+            <%= select_tag "#{@card.id}_#{@card.index}_range", options_for_select(@card.ranges, @card.range),
               class: 'appearance-none inline-flex bg-blue-gray-100 disabled:bg-blue-gray-300 disabled:cursor-not-allowed focus:bg-white text-sm text-blue-gray-700 disabled:text-blue-gray-700 leading-none rounded-md py-px px-2 leading-tight border outline-none outline w-24',
               data: {
                 target: 'select',

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

@@ -1,15 +1,22 @@
-<div class="flex flex-col md:flex-row md:items-center pb-2 md:pb-0 leading-tight <%= @classes %> min-h-14" data-field-id="<%= @field.id %>" data-field-type="<%= @field.type %>">
-  <div class="pt-4 md:pt-0 md:h-14 flex self-start items-center text-slate-800">
+<%= content_tag :div,
+  class: classes("relative flex flex-col md:flex-row md:items-center pb-2 md:pb-0 leading-tight min-h-14"),
+  style: style,
+  data: {
+    field_id: @field.id,
+    field_type: @field.type,
+    **stimulus_attributes,
+  } do %>
+  <div class="h-full pt-4 md:pt-0 md:h-14 flex self-start items-center text-slate-800">
     <div class="<% if @displayed_in_modal %> md:w-48 <% else %> md:w-64 px-6 md:px-6 <% end %> w-48 flex uppercase font-semibold text-gray-500 text-sm" data-slot="label">
       <% if @form.present? %>
         <%= @form.label @field.id, label %>
       <% else %>
         <%= @field.name %>
       <% end %>
-      <% if @field.required %> <span class="text-red-600 ml-1">*</span> <% end %>
+      <% if @field.is_required? %> <span class="text-red-600 ml-1">*</span> <% end %>
     </div>
   </div>
   <div class="flex-1 flex flex-row md:min-h-inherit py-2 <% unless @displayed_in_modal %> px-6 <% end %>">
     <%= content %>
   </div>
-</div>
+<% end %>

data/app/components/avo/common_field_wrapper_component.rb

@@ -1,7 +1,9 @@
 # frozen_string_literal: true
 
 class Avo::CommonFieldWrapperComponent < ViewComponent::Base
-  def initialize(field: nil, dash_if_blank: true, full_width: false, displayed_in_modal: false, form: nil, resource: {}, label: nil, **args)
+  attr_reader :view
+
+  def initialize(field: nil, dash_if_blank: true, full_width: false, displayed_in_modal: false, form: nil, resource: nil, label: nil, view: nil, **args)
     @field = field
     @dash_if_blank = dash_if_blank
     @classes = args[:class].present? ? args[:class] : ""
@@ -12,9 +14,33 @@ class Avo::CommonFieldWrapperComponent < ViewComponent::Base
     @model = resource.present? ? resource.model : nil
     @full_width = full_width
     @label = label
+    @view = view
+  end
+
+  def classes(extra_classes = "")
+    "#{@classes || ""} #{extra_classes || ""} #{@field.get_html(:classes, view: view, element: :wrapper)}"
+  end
+
+  def style
+    @field.get_html(:style, view: view, element: :wrapper)
   end
 
   def label
     @label || @field.name
   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
 end

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

@@ -1,4 +1,4 @@
-<%= render Avo::CommonFieldWrapperComponent.new(field: @field, resource: @resource, index: @index, form: @form, displayed_in_modal: @displayed_in_modal, label: @label) do %>
+<%= render Avo::CommonFieldWrapperComponent.new(field: @field, resource: @resource, index: @index, form: @form, displayed_in_modal: @displayed_in_modal, label: @label, view: @resource.view, class: @classes) do %>
   <div class="self-center <% if @displayed_in_modal or @full_width %> w-full <% else %> w-full md:w-8/12 <% end %>" data-slot="value">
     <%= content %>
     <% if @model.present? and @model.errors.include? @field.id %>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field, flush: true do %>
+<%= index_field_wrapper field: @field, resource: @resource, flush: true do %>
   <%= render Avo::Fields::Common::BadgeViewerComponent.new value: @field.value, options: @field.options %>
 <% end %>

data/app/components/avo/fields/badge_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::BadgeViewerComponent.new value: @field.value, options: @field.options %>
 <% end %>

data/app/components/avo/fields/belongs_to_field/autocomplete_component.html.erb

@@ -13,24 +13,35 @@
   ></div>
   <div class="relative w-full" autocomplete="off">
     <%= @form.text_field @foreign_key,
-      type: :text,
-      value: field_label,
-      class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-      placeholder: @field.placeholder,
-      'data-search-target': 'button clearValue',
+      class: classes,
       # This instructs the search_controller if it should enable/disabled this field when the user switches polymorphic associations
       # It should not enable the field if the record is being created through an association
-      'data-should-be-disabled': @disabled,
-      disabled: true %>
+      data: {
+        'search-target': 'button clearValue',
+        'should-be-disabled': @disabled,
+        **@field.get_html(:data, view: view, element: :input)
+      },
+      disabled: true,
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input),
+      type: :text,
+      value: field_label %>
     <% unless @disabled %>
-      <div class="absolute top-1/2 left-auto right-3 mr-px -mt-2 cursor-pointer hidden text-gray-500"
+      <button class="absolute top-1/2 left-auto right-3 mr-px -mt-2 cursor-pointer hidden text-gray-500"
+        type="button"
         data-tippy="tooltip"
         data-search-target="clearButton"
         title="<%= I18n.translate 'avo.clear_value' %>"
         data-action="click->search#clearValue"
         ><%= helpers.svg 'x', class: 'h-4' %>
-      </div>
+      </button>
     <% end %>
   </div>
-  <%= @form.hidden_field @foreign_key, value: field_value, 'data-search-target': 'hiddenId clearValue' %>
+  <%= @form.hidden_field @foreign_key,
+    value: field_value,
+    data: {
+      'search-target': 'hiddenId clearValue',
+      **@field.get_html(:data, view: view, element: :input)
+    }
+  %>
 </div>

data/app/components/avo/fields/belongs_to_field/autocomplete_component.rb

@@ -1,14 +1,20 @@
 # frozen_string_literal: true
 
 class Avo::Fields::BelongsToField::AutocompleteComponent < ViewComponent::Base
-  def initialize(form:, field:, model_key:, foreign_key:, disabled: false, type: nil, resource: nil, polymorphic_record: nil)
+  attr_reader :classes
+  attr_reader :view
+
+  def initialize(form:, field:, model_key:, foreign_key:, disabled: false, type: nil, resource: nil, polymorphic_record: nil, view: nil, style: nil, classes: nil)
     @form = form
     @field = field
     @type = type
+    @view = view
     @model_key = model_key
     @foreign_key = foreign_key
     @resource = resource
     @disabled = disabled
+    @style = style
+    @classes = classes
     @polymorphic_record = polymorphic_record
   end
 

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

@@ -19,10 +19,13 @@
         include_blank: @field.placeholder,
       },
       {
-        class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-        disabled: disabled,
-        'data-belongs-to-field-target': "select",
-        'data-action': 'change->belongs-to-field#changeType'
+        class: classes("w-full"),
+        data: {
+          **@field.get_html(:data, view: view, element: :input),
+          action: "change->belongs-to-field#changeType #{field_html_action}",
+          'belongs-to-field-target': "select",
+        },
+        disabled: disabled
       }
     %>
       <%
@@ -40,13 +43,16 @@
         <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal, label: type.to_s.underscore.humanize do %>
           <% if @field.searchable %>
             <%= render Avo::Fields::BelongsToField::AutocompleteComponent.new form: @form,
-            field: @field,
-            type: type,
-            model_key: model_keys[type.to_s],
-            foreign_key: @field.id_input_foreign_key,
-            resource: @resource,
-            disabled: disabled,
-            polymorphic_record: polymorphic_record
+              disabled: disabled,
+              field: @field,
+              foreign_key: @field.id_input_foreign_key,
+              model_key: model_keys[type.to_s],
+              polymorphic_record: polymorphic_record,
+              resource: @resource,
+              style: @field.get_html(:style, view: view, element: :input),
+              type: type,
+              classes: classes("w-full"),
+              view: @resource.view
           %>
           <% else %>
             <%= @form.select @field.id_input_foreign_key,
@@ -56,7 +62,8 @@
               include_blank: @field.placeholder,
             },
             {
-              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: disabled
             }
           %>
@@ -79,7 +86,10 @@
         model_key: @field.target_resource&.model_key,
         foreign_key: @field.id_input_foreign_key,
         resource: @resource,
-        disabled: disabled
+        disabled: disabled,
+        classes: classes("w-full"),
+        view: @resource.view,
+        style: @field.get_html(:style, view: view, element: :input)
       %>
     <% else %>
       <%= @form.select @field.id_input_foreign_key, @field.options,
@@ -88,8 +98,10 @@
           value: @field.value
         },
         {
-          class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-          disabled: disabled
+          class: classes("w-full"),
+          data: @field.get_html(:data, view: view, element: :input),
+          disabled: disabled,
+          style: @field.get_html(:style, view: view, element: :input)
         }
       %>
       <%

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

@@ -48,4 +48,8 @@ class Avo::Fields::BelongsToField::EditComponent < Avo::Fields::EditComponent
 
     @polymorphic_record
   end
+
+  def field_html_action
+    @field.get_html(:data, view: @resource.view, element: :input).fetch(:action, nil)
+  end
 end

data/app/components/avo/fields/belongs_to_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/belongs_to_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 %>
   <%= link_to @field.label, helpers.resource_path(model: @field.value, resource: @field.target_resource, via_resource_class: @resource.model_class, via_resource_id: @resource.model.id) %>
 <% end %>

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

@@ -1,9 +1,11 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, dash_if_blank: false, displayed_in_modal: @displayed_in_modal do %>
   <div class="h-8 flex items-center">
     <%= @form.check_box @field.id,
-      class: 'text-lg h-4 w-4',
+      checked: @field.value,
+      class: "text-lg h-4 w-4 #{@field.get_html(:classes, view: view, element: :input)}",
+      data: @field.get_html(:data, view: view, element: :input),
       disabled: @field.readonly,
-      checked: @field.value
+      style: @field.get_html(:style, view: view, element: :input)
     %>
   </div>
 <% end %>

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

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

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

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index, dash_if_blank: false do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index, dash_if_blank: false do %>
   <%= render Avo::Fields::Common::BooleanCheckComponent.new checked: @field.value %>
 <% end %>

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

@@ -17,7 +17,13 @@
           end
         %>
         <label class="block">
-          <%= check_box_tag "#{model_param_key}[#{@field.id}][]", id, checked, { class: "w-4 h-4", disabled: @field.readonly, id: "#{model_param_key}_#{@field.id}_#{id}" } %> <%= label %>
+          <%= check_box_tag "#{model_param_key}[#{@field.id}][]", id, checked, {
+              class: "w-4 h-4 #{@field.get_html(:classes, view: view, element: :input)}",
+              data: @field.get_html(:data, view: view, element: :input),
+              disabled: @field.readonly,
+              id: "#{model_param_key}_#{@field.id}_#{id}",
+              style: @field.get_html(:style, view: view, element: :input)
+            } %> <%= label %>
         </label>
       <% end %>
     </div>

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

@@ -1,3 +1,3 @@
-<%= index_field_wrapper field: @field, dash_if_blank: false do %>
+<%= index_field_wrapper field: @field, resource: @resource, dash_if_blank: false do %>
   <%= render Avo::Fields::Common::BooleanGroupComponent.new options: @field.options, value: @field.value %>
 <% end %>

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

@@ -1,3 +1,3 @@
-<%= show_field_wrapper field: @field, index: @index, dash_if_blank: false do %>
+<%= show_field_wrapper field: @field, resource: @resource, index: @index, dash_if_blank: false do %>
   <%= render Avo::Fields::Common::BooleanGroupComponent.new options: @field.options, value: @field.value %>
 <% end %>

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

@@ -1,19 +1,21 @@
 <%= edit_field_wrapper field: @field, index: @index, form: @form, resource: @resource, displayed_in_modal: @displayed_in_modal, full_width: true do %>
   <div data-controller="code-field">
     <%= @form.text_area @field.id,
-      class: helpers.input_classes('w-full', has_error: @field.model_errors.include?(@field.id)),
-      placeholder: @field.placeholder,
-      disabled: @field.readonly,
+      class: classes("w-full"),
       data: {
         'code-field-target': 'element',
-        view: :edit,
+        view: @resource.view,
         language: @field.language,
         theme: @field.theme,
         'tab-size': @field.tab_size,
         'read-only': @field.readonly,
         'indent-with-tabs': @field.indent_with_tabs,
         'line-wrapping': @field.line_wrapping,
-      }
+        **@field.get_html(:data, view: view, element: :input),
+      },
+      disabled: @field.readonly,
+      placeholder: @field.placeholder,
+      style: @field.get_html(:style, view: view, element: :input)
     %>
   </div>
 <% end %>

data/app/components/avo/fields/code_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="code-field" style="--height: <%= @field.height %>">
     <%= text_area_tag @field.id, @field.value,
       class: helpers.input_classes('w-full'),
@@ -6,7 +6,7 @@
       disabled: true,
       data: {
         'code-field-target': 'element',
-        view: :edit,
+        view: @resource.view,
         language: @field.language,
         theme: @field.theme,
         'tab-size': @field.tab_size,