headmin 0.2.5 → 0.3.1

data/app/views/headmin/_form.html.erb

@@ -2,20 +2,20 @@
   # headmin/form
   #
   # ==== Options
-  # * <tt>model<tt> - A model to infer :url and :scope
-  # * <tt>scope<tt> - The scope to prefix input field names with
-  # * <tt>url<tt> - The URL the form submits to
-  # * <tt>format<tt> - The format of the route the form submits to
-  # * <tt>namespace<tt> - A namespace for your form to ensure uniqueness of id attributes on form elements
-  # * <tt>method<tt> - The method to use when submitting the form
-  # * <tt>authenticity_token<tt> - Authenticity token to use in the form
-  # * <tt>local<tt> - By default form submits are remote and unobtrusive XHRs
-  # * <tt>skip_enforcing_utf8<tt> - If set to true, a hidden input with name utf8 is not output
-  # * <tt>builder<tt> - Override the object used to build the form
-  # * <tt>html<tt> - Other optional HTML attributes for the form tag
-  # * <tt>id<tt> - Optional HTML id attribute
-  # * <tt>class<tt> - Optional HTML class attribute
-  # * <tt>data<tt> - Optional HTML data attributes
+  # * +model+ - A model to infer :url and :scope
+  # * +scope+ - The scope to prefix input field names with
+  # * +url+ - The URL the form submits to
+  # * +format+ - The format of the route the form submits to
+  # * +namespace+ - A namespace for your form to ensure uniqueness of id attributes on form elements
+  # * +method+ - The method to use when submitting the form
+  # * +authenticity_token+ - Authenticity token to use in the form
+  # * +local+ - By default form submits are remote and unobtrusive XHRs
+  # * +skip_enforcing_utf8+ - If set to true, a hidden input with name utf8 is not output
+  # * +builder+ - Override the object used to build the form
+  # * +html+ - Other optional HTML attributes for the form tag
+  # * +id+ - Optional HTML id attribute
+  # * +class+ - Optional HTML class attribute
+  # * +data+ - Optional HTML data attributes
   #
   # === Examples
   #   Basic version

data/app/views/headmin/_heading.html.erb

@@ -9,5 +9,5 @@
 %>
 
 <div class="h-heading d-flex flex-column flex-md-row align-items-start align-items-md-end justify-content-between">
-  <%= yield if block_given? %>
+  <%= yield %>
 </div>

data/app/views/headmin/_notifications.html.erb

@@ -8,7 +8,7 @@
 
 <div class="toast-container position-absolute top-0 end-0 p-3">
   <% flash.each do |name, message| %>
-    <div class="toast align-items-center text-white show <%= notification_color(name.to_sym)[:background] %>" role="alert" aria-live="assertive" aria-atomic="true">
+    <div class="toast align-items-center text-white show <%= notification_color(name.to_sym)[:background] %>" role="alert" aria-live="assertive" aria-atomic="true" data-controller="toast">
       <div class="d-flex">
         <div class="toast-body <%= notification_color(name.to_sym)[:text] %>">
           <%= message %>

data/app/views/headmin/_pagination.html.erb

@@ -2,7 +2,7 @@
   # headmin/notifications
   #
   # ==== Options
-  # * <tt>collection</tt> - Kaminari collection that accepts a method .total_count
+  # * +collection</tt> - Kaminari collection that accepts a method .total_count
   #
   # ==== Examples
   #   Basic version
@@ -10,8 +10,9 @@
 %>
 
 <div class="d-flex flex-row-reverse flex-md-row align-items-center justify-content-between justify-content-md-end my-1">
+  <% content_for :collection_total_count, collection.total_count.to_s unless content_for?(:collection_total_count) %>
   <div class="ms-2 me-md-2 text-secondary">
-    <%= t('.items', count: collection.total_count) %>
+    <%= t('.items', count: content_for(:collection_total_count).to_i) %>
   </div>
   <%= paginate collection, views_prefix: 'headmin/pagination' %>
 </div>

data/app/views/headmin/_popup.html.erb

@@ -2,7 +2,7 @@
   # headmin/popup
   #
   # ==== Options
-  # * <tt>id</tt> - Identifier for this popup
+  # * +id</tt> - Identifier for this popup
   #
   # ==== Examples
   #   To trigger this popup create an element with a data attribute like this
@@ -19,8 +19,14 @@
   #   <%= render 'headmin/popup', id: 'popupId' do %#>
   #     <a href="https://example.com" id="link">
   #   <% end %#>
+  data = local_assigns.has_key?(:data) ? data : {}
+
+  options = {
+    class: ['h-popup', 'closed'],
+    data: data.merge('popup-target': 'popup', 'popup-id': id)
+  }
 %>
 
-<div class="h-popup closed" data-popup-target="popup" data-popup-id="<%= id %>">
-  <%= yield if block_given? %>
-</div>
+<%= content_tag(:div, options) do %>
+  <%= yield %>
+<% end %>

data/app/views/headmin/_table.html.erb

@@ -2,19 +2,25 @@
   # headmin/table
   #
   # ==== Options
-  # * <tt>sort_url</tt> - U
+  # * +sort_url</tt> - Url to post object ids to in the order of positions
   #
   # ==== Examples
   #   <%= render 'headmin/table', sort_url: positions_admin_categories_path do %#>
   #     table content here
   #   <% end %#>
+
+  sort_url = local_assigns.has_key?(:sort_url) ? sort_url : nil
+  total_count = content_for(:collection_total_count).to_i || nil
 %>
 
-<% sort_url = local_assigns.has_key?(:sort_url) ? sort_url : nil %>
 <div class="h-table card my-2 shadow-sm <%= 'table-drag-sort' if sort_url %>" data-sort-url="<%= sort_url %>">
   <div class="table-responsive">
-    <table class="table table-hover m-0" data-controller="table" data-table-target="table" data-table-url-value="<%= sort_url %>">
-      <%= yield if block_given? %>
+    <table class="table table-hover m-0"
+           data-controller="table"
+           data-table-target="table"
+           data-table-url-value="<%= sort_url %>"
+           data-table-count-value="<%= total_count %>">
+      <%= yield %>
     </table>
   </div>
 </div>

data/app/views/headmin/_thumbnail.html.erb

@@ -0,0 +1,47 @@
+<%
+  # name: headmin/thumbnail
+  #
+  # ==== Required parameters
+  # * +src+ - Sourch path for the file
+  #
+  # ==== Optional parameters
+  # * +width+ - Width of the thumbnail
+  # * +height+ - Height of the thumbnail
+  #
+  # ==== References
+  # https://getbootstrap.com/docs/5.1/content/images/#image-thumbnails
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= render 'headmin/thumbnail', src: file %#>
+  #
+  #   Custom width and height
+  #   <%= render 'headmin/thumbnail', src: file, width: 300, height: 100 %#>
+
+  width = local_assigns[:width] || 150
+  height = local_assigns[:height] || 150
+  class_names = ['img-thumbnail h-thumbnail', local_assigns[:class]].join(' ')
+
+  mime_type = nil
+  if src
+    stripped_path = URI.parse(src).path
+    extension = File.extname(stripped_path)
+    mime_type = Rack::Mime.mime_type(extension)
+  end
+%>
+
+<div class="<%= class_names %>" style="width: <%= width %>px; height: <%= height %>px;">
+  <% if mime_type&.match?(/^image/) %>
+        <div class="h-thumbnail-bg" style="background-image: url('<%= src %>');"></div>
+  <% else %>
+    <div class="h-thumbnail-bg">
+      <%= src ? File.extname(src) : 'nil' %>
+      <%= mime_type %>
+      <% if mime_type %>
+        <%= bootstrap_icon_for_mime_type(mime_type, class: 'h-thumbnail-icon') %>
+      <% else %>
+        <%= bootstrap_icon('question', class: 'h-thumbnail-icon') %>
+      <% end %>
+    </div>
+  <% end %>
+</div>

data/app/views/headmin/dropdown/_devise.html.erb

@@ -1,19 +1,29 @@
-<%#
-    headmin/dropdown/locale
-    accepts block: yes
-    parameters:
-      scope: (symbol) devise scope, i.e. ':users' => current_user
+<%
+  # headmin/dropdown/devise
+  #
+  # ==== Options
+  # * +scope</tt> - (symbol) devise scope, i.e. ':users' => current_user
+  # * +class</tt> - Custom class names to put on the dropdown
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= render "headmin/dropdown/devise"  %#>
+  #
+  #   Custom scope
+  #   <%= render "headmin/dropdown/devise", scope: :admins  %#>
+
+  class_names = local_assigns.has_key?(:class) ? local_assigns[:class] : ''
+  scope = local_assigns.has_key?(:scope) ? scope : :users
+  singular = scope.to_s.singularize.to_sym
+  user = send("current_#{singular}")
 %>
 
-<% scope = local_assigns.has_key?(:scope) ? scope : :users %>
-<% singular = scope.to_s.singularize.to_sym %>
-<% user = send("current_#{singular}") %>
 
-<%= render 'headmin/dropdown' do %>
+<%= render 'headmin/dropdown', class: class_names do %>
   <%= render 'headmin/dropdown/button' do %>
     <%= user.to_s %>
   <% end %>
-  <%= render 'headmin/dropdown/list' do %>
+  <%= render 'headmin/dropdown/list', class: 'dropdown-menu-end' do %>
     <%= render 'headmin/dropdown/item', name: t('.edit_profile'), url: polymorphic_path([:edit, singular, :registration]) %>
     <%= render 'headmin/dropdown/divider' %>
     <%= render 'headmin/dropdown/item', name: t('.log_out'), url: polymorphic_path([:destroy, singular, :session]), method: :delete %>

data/app/views/headmin/dropdown/_list.html.erb

@@ -1,11 +1,18 @@
-<%#
-    headmin/dropdown/list
-    accepts block: yes
-    parameters:
-      id: unique identifier for the dropdown
+<%
+  # headmin/dropdown/list
+  #
+  # ==== Options
+  # * +id</tt> - unique identifier for the dropdown
+  # * +class</tt> - Custom class names to put on the dropdown menu
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= render "headmin/dropdown/list", id: 'dropdown-1'  %#>
+
+  class_names = local_assigns.has_key?(:class) ? local_assigns[:class] : ''
+  id = local_assigns.has_key?(:id) ? id : 'dropdown-1'
 %>
-<% id = local_assigns.has_key?(:id) ? id : 'dropdown-1' %>
 
-<ul class="dropdown-menu" aria-labelledby="<%= id %>">
+<ul class="dropdown-menu <%= class_names %>" aria-labelledby="<%= id %>">
   <%= yield %>
 </ul>

data/app/views/headmin/filters/_date.html.erb

@@ -2,22 +2,24 @@
   # headmin/filters/date
   #
   # ==== Options
-  # * <tt>name</tt> - Name of the filter parameter
-  # * <tt>label</tt> - Display name
+  # * +name</tt> - Name of the filter parameter
+  # * +label</tt> - Display name
   #
   # ==== Examples
   #   Basic version
   #   <%= render "headmin/filters/date", name: :created_at, label: 'Created at' %#>
 
-  label = local_assigns.has_key?(:label) ? label : nil
-  name = local_assigns.has_key?(:name) ? name : nil
+  name = local_assigns.has_key?(:name) ? name.to_sym : nil
+  label = local_assigns.has_key?(:label) ? label : name.to_s.humanize
 
   input_options = {
     placeholder: 'dd/mm/yyyy',
-    class: "form-control flatpickr",
+    class: "form-control",
     required: true,
-    'data-filters-target': 'input',
-    'data-action': "change->filters#update"
+    data: {
+      'filters-target': 'input',
+      'action': 'change->filters#update',
+    }
   }
 %>
 
@@ -28,9 +30,6 @@
 <%= content_for :filters_templates do %>
   <%= render 'headmin/filters/filter/template', name: name, label: label do %>
     <div class="input-group">
-      <span class="input-group-text">
-        <%= bootstrap_icon('calendar') %>
-      </span>
       <%= date_field_tag(name, nil, input_options) %>
     </div>
   <% end %>
@@ -41,9 +40,6 @@
     <% value_formatted = Date.parse(params[name]).strftime('%d/%m/%Y') %>
     <%= render 'headmin/filters/filter/button', name: name, label: label, value: value_formatted do %>
       <div class="input-group">
-        <span class="input-group-text">
-          <%= bootstrap_icon('calendar') %>
-        </span>
         <%= date_field_tag(name, params[name], input_options) %>
       </div>
     <% end %>

data/app/views/headmin/filters/_flatpickr.html.erb

@@ -0,0 +1,57 @@
+<%
+  # headmin/filters/flatpickr
+  #
+  # ==== Options
+  # * +name</tt> - Name of the filter parameter
+  # * +label</tt> - Display name
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= render "headmin/filters/flatpickr", name: :created_at, label: 'Created at' %#>
+
+  name = local_assigns.has_key?(:name) ? name.to_sym : nil
+  label = local_assigns.has_key?(:label) ? label : name.to_s.humanize
+
+  input_options = {
+    placeholder: 'dd/mm/yyyy',
+    class: "form-control",
+    required: true,
+    data: {
+      'filters-target': 'input',
+      'flatpickr-target': 'input',
+      'action': 'change->filters#update',
+      'flatpickr-options': {
+        defaultDate: params[name]
+      }
+    }
+  }
+%>
+
+<%= content_for :filters_menu do %>
+  <%= render 'headmin/filters/filter/menu_item', name: name, label: label %>
+<% end %>
+
+<%= content_for :filters_templates do %>
+  <%= render 'headmin/filters/filter/template', name: name, label: label do %>
+    <div class="input-group" data-controller="flatpickr">
+      <span class="input-group-text">
+        <%= bootstrap_icon('calendar') %>
+      </span>
+      <%= date_field_tag(name, nil, input_options) %>
+    </div>
+  <% end %>
+<% end %>
+
+<%= content_for :filters_buttons do %>
+  <% if filter_param_exists?(name) %>
+    <% value_formatted = Date.parse(params[name]).strftime('%d/%m/%Y') %>
+    <%= render 'headmin/filters/filter/button', name: name, label: label, value: value_formatted do %>
+      <div class="input-group" data-controller="flatpickr">
+        <span class="input-group-text">
+          <%= bootstrap_icon('calendar') %>
+        </span>
+        <%= date_field_tag(name, params[name], input_options) %>
+      </div>
+    <% end %>
+  <% end %>
+<% end %>

data/app/views/headmin/filters/_search.html.erb

@@ -2,16 +2,16 @@
   # headmin/filters/search
   #
   # ==== Options
-  # * <tt>name</tt> - Name of the filter parameter
-  # * <tt>label</tt> - Name of the resource to be used in the placeholder (search in ...)
-  # * <tt>placeholder</tt> - Placeholder in the search field
+  # * +name</tt> - Name of the filter parameter
+  # * +label</tt> - Name of the resource to be used in the placeholder (search in ...)
+  # * +placeholder</tt> - Placeholder in the search field
   #
   # ==== Examples
   #   Basic version.
   #   <%= render 'headmin/filters/search', name: :search, label: Poll.model_name.human(count: 2) %#>
 
   name = local_assigns.has_key?(:name) ? name : :search
-  label = local_assigns.has_key?(:label) ? label : nil
+  label = local_assigns.has_key?(:label) ? label : name.to_s.humanize
   placeholder = local_assigns.has_key?(:placeholder) ? placeholder : t('.placeholder', resource: label)
 
   value = filter_param_exists?(name) ? params[name] : nil
@@ -19,4 +19,4 @@
 
 <% content_for :filters_search do %>
   <input class="form-control" type="search" placeholder="<%= raw placeholder.capitalize %>" aria-label="Search" name="<%= name %>" value="<%= value %>">
-<% end %>
+<% end %>

data/app/views/headmin/filters/_select.html.erb

@@ -2,16 +2,16 @@
   # headmin/filters/select
   #
   # ==== Options
-  # * <tt>name</tt> - Name of the filter parameter
-  # * <tt>label</tt> - Display name
-  # * <tt>options</tt> - List of options to select from
+  # * +name</tt> - Name of the filter parameter
+  # * +label</tt> - Display name
+  # * +options</tt> - List of options to select from
   #
   # ==== Examples
   #   Basic version
   #   <%= render "headmin/filters/select", name: :poll_type, label: 'Type', options: [["General", "general", "Fun", "fun"]] %#>
 
-  label = local_assigns.has_key?(:label) ? label : nil
-  name = local_assigns.has_key?(:name) ? name : nil
+  name = local_assigns.has_key?(:name) ? name.to_sym : nil
+  label = local_assigns.has_key?(:label) ? label : name.to_s.humanize
   options = local_assigns.has_key?(:options) ? options : []
 
   select_options = {
@@ -38,7 +38,7 @@
   <% (params[name] || []).each_with_index do |param, index| %>
     <% selected_option = options.detect { |value, key, config| (key.present? ? key : value) == param } %>
     <% selected_value = selected_option.is_a?(Array) ? selected_option.first : selected_option %>
-    <%= render 'headmin/filters/filter/button', name: name, label: label, value: selected_value, id: "#{name}_#{index}" do %>
+    <%= render 'headmin/filters/filter/button', name: name, label: label, value: selected_value, id: "#{name}_#{index}_#{SecureRandom.hex}" do %>
       <%= select_tag("#{name}[]", options_for_select(options, param), select_options) %>
     <% end %>
   <% end %>

data/app/views/headmin/filters/filter/_button.html.erb

@@ -6,15 +6,16 @@
       label: (string) Display name
       value: (string) Value of the parameter
 %>
-<% id = local_assigns.has_key?(:id) ? id : Time.now.utc.to_i %>
-<% name = local_assigns.has_key?(:name) ? name : nil %>
-<% label = local_assigns.has_key?(:label) ? label : nil %>
+<% id = local_assigns.has_key?(:id) ? id : SecureRandom.hex %>
+<% name = local_assigns.has_key?(:name) ? name.to_sym : nil %>
+<% label = local_assigns.has_key?(:label) ? label : name.to_s.humanize %>
 <% value = local_assigns.has_key?(:value) ? value : nil %>
 
-<div class="h-filter me-1 my-1" data-filter-name="<%= name %>">
+<div class="h-filter me-1 my-1" data-controller="filter" data-filter-name="<%= name %>">
   <button
     type="button"
     class="h-filter-button btn h-btn-outline-transparent"
+    data-filter-target="button"
     data-popup-target="button"
     data-popup-id="<%= id %>"
     data-action="click->popup#open"
@@ -23,8 +24,7 @@
     <span class="h-filter-remove" data-action="click->filters#remove"><%= bootstrap_icon('x-lg') %></span>
   </button>
 
-  <%= render 'headmin/popup', id: "#{id}" do %>
-    <%= yield if block_given? %>
+  <%= render 'headmin/popup', id: "#{id}", data: {'filter-target': 'popup'} do %>
+    <%= yield %>
   <% end %>
-
 </div>

data/app/views/headmin/filters/filter/_template.html.erb

@@ -8,6 +8,6 @@
 
 <template data-filter-name="<%= name %>" data-filters-target="template">
   <%= render 'headmin/filters/filter/button', name: name, label: label, value: nil, id: 'template_id' do %>
-    <%= yield if block_given? %>
+    <%= yield %>
   <% end %>
 </template>

data/app/views/headmin/forms/_actions.html.erb

@@ -19,7 +19,7 @@
       </dl>
     <% end %>
 
-    <%= yield if block_given? %>
+    <%= yield %>
 
     <%= render 'headmin/forms/actions/destroy', form: form %>
     <hr>

data/app/views/headmin/forms/_base.html.erb

@@ -1,60 +1,114 @@
-<%
-  # headmin/forms/base
-  #
-  # ==== Options
-  # * <tt>form<tt> - Form object
-  # * <tt>attribute<tt> - Name of the attribute of the form model
-  # * <tt>options<tt> - Hash with all HTML options to pass to
-  # * <tt>label<tt> - Text to show as label. Label will be hidden if value is false
-  # * <tt>required<tt> - Set to true to mark as required
-  # * <tt>float<tt> - Set to true if you want to show floating labels
-  # * <tt>append<tt> - Text or icon to be shown on the left hand side of the input, Doesn't work with float
-  # * <tt>prepend<tt> - Text or icon to be shown on the right hand side of the input, Doesn't work with float
-  #
-  # ==== Examples
-  #   Basic version
-  #   <%= render 'headmin/forms/date', form: form, attribute: :title %#>
-  #
-  #   With datepicker
-  #   <%= render 'headmin/forms/text', form: form, attribute: :title, datepicker: true %#>
-
-  append = local_assigns.has_key?(:append) ? append : nil
-  float = local_assigns.has_key?(:float) ? float : false
-  label = local_assigns.has_key?(:label) ? label : nil
-  prepend = local_assigns.has_key?(:prepend) ? prepend : nil
-  required = local_assigns.has_key?(:required) ? required : false
-
-  show_label = label != false
-%>
-
-<div class="<%= 'form-floating' if float %> <%= ('mb-3 text-start' if show_label) %>">
-  <% if show_label && !float %>
-    <%= render 'headmin/forms/label', form: form, attribute: attribute, name: label, required: required %>
-  <% end %>
-
-  <% if float %>
-    <%= yield form %>
-    <%= render 'headmin/forms/validation', form: form, attribute: attribute %>
-  <% else %>
+<!--
+<% documentation do %>
+  # Base
+  This serves as a wrapper around most form views. It allows defining everything that happens outside the input field.
+  The main purpose of this view is to coordinate labels and appendages.
+
+  ```erbx
+  <%= form_with do |form| %>
+    <%= render "headmin/forms/base", form: form, attribute: "basic_example" do |form| %>
+      <%= form.text_field("attribute", class: 'form-control') %>
+    <% end %>
+  <% end %>
+  ```
+
+  # Parameters
+  | Name         | Required | Type             | Description |
+  | ------------ | -------- | ---------------- | ----------- |
+  | form         | yes      | Object           | Form object |
+  | attribute    | yes      | String, Symbol   | Name of the attribute of the form model |
+  | append       | no       | Boolean          | Text or icon to be shown on the left hand side of the input, Doesn't work with float |
+  | class        | no       | String           | A space separated string of HTML class names |
+  | float        | no       | Boolean          | Set to true if you want to show floating labels |
+  | id           | no       | String           | Input identifier to be used as "for" in the label |
+  | label        | no       | Hash             | Text to show as label. Label will be hidden if value is false |
+  | prepend      | no       | Boolean          | Text or icon to be shown on the right hand side of the input, Doesn't work with float |
+
+  ## Examples
+
+  ### Sizing
+  ```erbx
+  <%= form_with do |form| %>
+    <%= render "headmin/forms/base", form: form, attribute: "small", class: 'input-group-sm' do |form| %>
+      <%= form.text_field("attribute", class: 'form-control', placeholder: '.input-group-sm') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "medium" do |form| %>
+      <%= form.text_field("attribute", class: 'form-control', placeholder: 'Default size') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "large", class: 'input-group-lg' do |form| %>
+      <%= form.text_field("attribute", class: 'form-control', placeholder: '.input-group-lg') %>
+    <% end %>
+  <% end %>
+  ```
+
+  ### Labels
+  ```erbx
+  <%= form_with do |form| %>
+    <%= render "headmin/forms/base", form: form, attribute: "no_label", label: false do |form| %>
+      <%= form.text_field("attribute", class: 'form-control', placeholder: 'Without label') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "floating_label", float: true do |form| %>
+      <%= form.text_field("attribute", class: 'form-control', placeholder: 'Default size') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "custom_label", label: 'Custom label' do |form| %>
+      <%= form.text_field("attribute", class: 'form-control') %>
+    <% end %>
+  <% end %>
+  ```
+
+  ### Appendages
+  ```erbx
+  <%= form_with do |form| %>
+    <%= render "headmin/forms/base", form: form, attribute: "prepend", prepend: "€" do |form| %>
+      <%= form.text_field("attribute", class: 'form-control') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "append", append: "m²" do |form| %>
+      <%= form.text_field("attribute", class: 'form-control') %>
+    <% end %>
+    <%= render "headmin/forms/base", form: form, attribute: "prepend_and_append", prepend: "€", append: "m²" do |form| %>
+      <%= form.text_field("attribute", class: 'form-control') %>
+    <% end %>
+  <% end %>
+  ```
+<% end %>
+-->
+
+<% base = Headmin::Form::Base.new(local_assigns) %>
+
+<%= tag.div(class: base.class_names, data: base.data) do %>
+  <% if base.label != false && !base.float %>
+    <%= render 'headmin/forms/label', base.label_options %>
+  <% end %>
+
+  <% if base.append || base.prepend %>
     <div class="input-group w-100">
-      <% if prepend %>
+      <% if base.prepend %>
       <span class="input-group-text">
-        <%= prepend %>
+        <%= base.prepend %>
       </span>
       <% end %>
 
       <%= yield form %>
-      <%= render 'headmin/forms/validation', form: form, attribute: attribute %>
+      <%= render 'headmin/forms/validation', base.validation_options if form.object.respond_to?(:errors) %>
 
-      <% if append %>
+      <% if base.append %>
       <span class="input-group-text">
-        <%= append %>
+        <%= base.append %>
       </span>
       <% end %>
     </div>
+  <% else %>
+    <%= yield form %>
+    <%= render 'headmin/forms/validation', base.validation_options if form.object.respond_to?(:errors) %>
+  <% end %>
+
+  <% if base.label != false && base.float %>
+    <%= render 'headmin/forms/label', base.label_options %>
   <% end %>
 
-  <% if show_label && float %>
-    <%= render 'headmin/forms/label', form: form, attribute: attribute, name: label, required: required %>
+  <% if base.list %>
+    <datalist id="<%= base.list_id %>">
+      <%= options_for_select(base.list) %>
+    </datalist>
   <% end %>
-</div>
+<% end %>