formstrap 0.1.0

data/app/views/formstrap/_datetime_range.html.erb

@@ -0,0 +1,40 @@
+<%
+  # formstrap/datetime_range
+  #
+  # ==== Required parameters
+  # * +form+ - Form object
+  # * +start+ - Hash with all options for the start date input (:attribute is required)
+  # * +end+ - Hash with all options for the end date input (:attribute is required)
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +float+ - Use floating labels. Defaults to false
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/datetime_range
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datetime-local
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/datetime_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/datetime_range", form: form, start: {attribute: :start_date}, end: {attribute: :end_date} %#>
+  #   <% end %#>
+
+  datetime_range = Formstrap::DatetimeRangeView.new(local_assigns)
+%>
+
+<div class="row">
+  <div class="col">
+    <%= render "formstrap/datetime", datetime_range.start_options %>
+  </div>
+  <div class="col">
+    <%= render "formstrap/datetime", datetime_range.end_options %>
+  </div>
+</div>
+

data/app/views/formstrap/_email.html.erb

@@ -0,0 +1,43 @@
+<%
+  # formstrap/email
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +collection+ - Values to be suggested while typing. Can be an collection array or a remote URL.
+  # * +float+ - Use floating labels. Defaults to false
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +list+ - Options are passed through options_for_select
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/email
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/email
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/email_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/email", form: form, attribute: :email_address %#>
+  #   <% end %#>
+
+  email = Formstrap::EmailView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", email.wrapper_options do %>
+    <%= render "formstrap/label", email.label_options if email.prepend_label? %>
+    <%= render "formstrap/input_group", email.input_group_options do %>
+      <%= form.email_field(email.attribute, email.input_options) %>
+    <%= render "formstrap/datalist", email.datalist_options if email.datalist? %>
+    <%= render "formstrap/autocomplete", email.autocomplete_options if email.autocomplete? %>
+    <% end %>
+    <%= render "formstrap/validation", email.validation_options if email.validate? %>
+    <%= render "formstrap/hint", email.hint_options if email.hint? %>
+    <%= render "formstrap/label", email.label_options if email.append_label? %>
+<% end %>

data/app/views/formstrap/_errors.html.erb

@@ -0,0 +1,19 @@
+<%#
+    name: formstrap/errors
+    accepts block: false
+    parameters:
+      form: (string) Form object
+%>
+
+<% if form.object.errors.any? %>
+  <div class="alert alert-danger" role="alert">
+    <h5 class="alert-heading d-flex align-items-center">
+      <%= t("errors.template.header", count: form.object.errors.size, model: form.object.model_name.human) %>
+    </h5>
+    <ul class="mb-0">
+      <% form.object.errors.full_messages.each do |message| %>
+        <li><%= message %></li>
+      <% end %>
+    </ul>
+  </div>
+<% end %>

data/app/views/formstrap/_file.html.erb

@@ -0,0 +1,94 @@
+<%
+  # formstrap/file
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +destroy+ - Adds delete buttons to the preview thumbnails
+  # * +dropzone+ - Add drag&drop interface. This setting automatically enables previews
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +multiple+ - Add drag&drop interface. This setting automatically enables previews
+  # * +preview+ - Show file previews after selection and after upload
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/file
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/file_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/file", form: form, attribute: :file %#>
+  #   <% end %#>
+
+  file = Formstrap::FileView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", file.wrapper_options do %>
+  <%= render "formstrap/label", file.label_options if file.prepend_label? %>
+  <div <%= tag.attributes(file.dropzone_options) %>>
+    <%= render "formstrap/input_group", file.input_group_options do %>
+
+      <% if file.preview %>
+        <div class="h-form-file-thumbnails" data-file-preview-target="thumbnails">
+
+          <!-- Render previews for attachments -->
+          <%= form.fields_for(file.nested_attribute) do |ff| %>
+            <%
+              attachment = ff.object
+              next unless attachment
+              filename = attachment.blob.filename.to_s
+              size = number_to_human_size(attachment.blob.byte_size)
+            %>
+            <div class="h-form-file-thumbnail" title="<%= "#{filename} (#{size})" %>" data-file-preview-target="thumbnail">
+              <%= ff.hidden_field(:id, disabled: !file.destroy) %>
+              <%= ff.hidden_field(:_destroy, data: {"file-preview-target": "thumbnailDestroy"}, disabled: !file.destroy) %>
+              <%= render "formstrap/shared/thumbnail", file: attachment %>
+
+              <% if file.destroy %>
+                <div class="h-form-file-thumbnail-remove" data-action="click->file-preview#remove" data-file-preview-name-param="<%= filename %>">
+                  <%= bootstrap_icon("x") %>
+                </div>
+              <% end %>
+            </div>
+          <% end %>
+
+          <!-- Placeholder -->
+          <% if file.dropzone %>
+            <div class="h-dropzone-placeholder <%= "d-none" if file.attachments.any? %>" data-file-preview-target="placeholder" style="height: 100px;">
+              <%= t("headmin.forms.file.placeholder", count: file.number_of_files) %>
+            </div>
+          <% else %>
+            <div class="h-form-file-thumbnail <%= "d-none" if file.attachments.any? %>" title="<%= t("headmin.forms.file.not_found") %>" data-file-preview-target="placeholder">
+              <%= render "formstrap/shared/thumbnail", icon: "plus" %>
+            </div>
+          <% end %>
+        </div>
+      <% end %>
+
+      <!-- Template -->
+      <template data-file-preview-target="template">
+        <div class="h-form-file-thumbnail" title="" data-file-preview-target="thumbnail">
+          <%= render "formstrap/shared/thumbnail" %>
+
+          <% if file.destroy %>
+            <div class="h-form-file-thumbnail-remove" data-action="click->file-preview#remove">
+              <%= bootstrap_icon("x") %>
+            </div>
+          <% end %>
+        </div>
+      </template>
+
+      <%= form.file_field(attribute, file.input_options) %>
+    <% end %>
+  </div>
+  <%= render "formstrap/validation", file.validation_options if file.validate? %>
+  <%= render "formstrap/hint", file.hint_options if file.hint? %>
+  <%= render "formstrap/label", file.label_options if file.append_label? %>
+<% end %>

data/app/views/formstrap/_flatpickr.html.erb

@@ -0,0 +1,33 @@
+<%
+  # formstrap/flatpickr
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +float+ - Use floating labels. Defaults to false
+  # * +flatpickr+ - Hash with all options you can pass to flatpickr JS config
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +list+ - Options are passed through options_for_select
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/date
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/date
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/date_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/date", form: form, attribute: :date_of_birth %#>
+  #   <% end %#>
+
+  flatpickr = Formstrap::FlatpickrView.new(local_assigns)
+%>
+
+<%= render "formstrap/date", flatpickr.options %>

data/app/views/formstrap/_flatpickr_range.html.erb

@@ -0,0 +1,40 @@
+<%
+  # formstrap/flatpickr_range
+  #
+  # ==== Required parameters
+  # * +form+ - Form object
+  # * +start+ - Hash with all options for the start date input (:attribute is required)
+  # * +end+ - Hash with all options for the end date input (:attribute is required)
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +float+ - Use floating labels. Defaults to false
+  # * +flatpickr+ - Hash with all options you can pass to flatpickr JS config
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +list+ - Options are passed through options_for_select
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/flatpickr_range", form: form, start: {attribute: :start_date}, end: {attribute: :end_date} %#>
+  #   <% end %#>
+
+  flatpickr_range = Formstrap::FlatpickrRangeView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", flatpickr_range.wrapper_options do %>
+  <%= render "formstrap/label", flatpickr_range.label_options if flatpickr_range.prepend_label? %>
+  <%= render "formstrap/input_group", flatpickr_range.input_group_options do %>
+    <%= form.date_field(flatpickr_range.attribute, flatpickr_range.input_options) %>
+    <%= form.hidden_field(flatpickr_range.start[:attribute], flatpickr_range.start_options) %>
+    <%= form.hidden_field(flatpickr_range.end[:attribute], flatpickr_range.end_options) %>
+  <% end %>
+  <%= render "formstrap/validation", flatpickr_range.validation_options if flatpickr_range.validate? %>
+  <%= render "formstrap/hint", flatpickr_range.hint_options if flatpickr_range.hint? %>
+  <%= render "formstrap/datalist", flatpickr_range.datalist_options if flatpickr_range.datalist? %>
+  <%= render "formstrap/label", flatpickr_range.label_options if flatpickr_range.append_label? %>
+<% end %>

data/app/views/formstrap/_hidden.html.erb

@@ -0,0 +1,23 @@
+<%
+  # formstrap/hidden
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/hidden
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/hidden
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/hidden_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/hidden", form: form, attribute: :id %#>
+  #   <% end %#>
+
+  hidden = Formstrap::HiddenView.new(local_assigns)
+%>
+
+<%= form.hidden_field(attribute, hidden.input_options) %>
+

data/app/views/formstrap/_hint.html.erb

@@ -0,0 +1,21 @@
+<%
+  # formstrap/hint
+  #
+  # ==== Required parameters
+  # * +content+ - Content to be displayed as input hint
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/hint", content: "Hello" %#>
+  #   <% end %#>
+
+  hint = Formstrap::HintView.new(local_assigns)
+%>
+
+<div class="form-text d-flex justify-content-between">
+  <div><%= raw(hint.content) %></div>
+  <% if hint.maxlength %>
+    <div data-textarea-target="count"></div>
+  <% end %>
+</div>

data/app/views/formstrap/_input_group.html.erb

@@ -0,0 +1,21 @@
+<% input_group = Formstrap::InputGroupView.new(local_assigns) %>
+
+<% if input_group.bypass %>
+  <%= yield %>
+<% else %>
+  <div <%= tag.attributes(input_group.options) %>>
+    <% if input_group.prepend %>
+      <span class="input-group-text">
+        <%= input_group.prepend %>
+      </span>
+    <% end %>
+
+    <%= yield %>
+
+    <% if input_group.append %>
+      <span class="input-group-text">
+        <%= input_group.append %>
+      </span>
+    <% end %>
+  </div>
+<% end %>

data/app/views/formstrap/_label.html.erb

@@ -0,0 +1,22 @@
+<%
+  # name: formstrap/label
+  #
+  # ==== Required parameters
+  # * +form+ - Form object
+  # * +attribute+ - Name of the attribute of the form model
+  #
+  # ==== Optional parameters
+  # * +text+ - Custom label to be used instead of the attribute
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/label
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/label
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= render "formstrap/label", form: form, attribute: :image %#>
+%>
+
+<% label = Formstrap::LabelView.new(local_assigns) %>
+<%= form.label label.attribute, label.text, label.options %>

data/app/views/formstrap/_media.html.erb

@@ -0,0 +1,60 @@
+<%
+  # formstrap/media
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +destroy+ - Adds delete buttons to the preview thumbnails
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label
+  # * +min+ - Limit the selection to a minimum amount of items
+  # * +max+ - Limit the selection to a maximum amount of items
+  # * +sort+ - Allow sorting by dragging items. `active_storage_attachments` must have a position column
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  # * +width+ - Width of the thumbnail
+  # * +height+ - Height of the thumbnail
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/media
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/media", form: form, attribute: :file %#>
+  #   <% end %#>
+
+  media = Formstrap::MediaView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", media.wrapper_options do %>
+  <%= render "formstrap/label", media.label_options if media.prepend_label? %>
+  <div class="h-form-file-thumbnails" data-media-target="thumbnails">
+    <%= render "formstrap/media/validation", media.custom_validation_options %>
+
+    <!-- Render previews for attachments -->
+    <%= form.fields_for(media.nested_attribute, media.association_object) do |ff| %>
+      <%= render "formstrap/media/item", media.item_options.merge(form: ff, url: formstrap_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max, mimetype: media.accept)) %>
+    <% end %>
+
+    <!-- Placeholder -->
+    <div class="<%= "d-none" if media.attachments.any? %>" data-media-target="placeholder">
+      <a href="<%= formstrap_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max, mimetype: media.accept) %>" data-turbo-frame="remote_modal" data-media-target="modalButton">
+        <%= render "formstrap/shared/thumbnail", media.thumbnail_options %>
+      </a>
+    </div>
+  </div>
+
+  <!-- Template -->
+  <% association_object = ActiveStorage::Attachment.new %>
+  <template data-media-target="template" data-template-id-regex="<%= association_object.object_id %>">
+    <%= form.fields_for(media.nested_attribute, ActiveStorage::Attachment.new, child_index: association_object.object_id) do |ff| %>
+      <%= render "formstrap/media/item", media.item_options.merge(form: ff, url: formstrap_media_url(name: media.name, ids: media.blob_ids, min: media.min, max: media.max, mimetype: media.accept)) %>
+    <% end %>
+  </template>
+
+  <%= render "formstrap/validation", media.validation_options if media.validate? %>
+  <%= render "formstrap/hint", media.hint_options if media.hint? %>
+  <%= render "formstrap/label", media.label_options if media.append_label? %>
+<% end %>

data/app/views/formstrap/_number.html.erb

@@ -0,0 +1,41 @@
+<%
+  # formstrap/number
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +float+ - Use floating labels. Defaults to false
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +list+ - Options are passed through options_for_select
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/number
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/number
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/number_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/number", form: form, attribute: :number %#>
+  #   <% end %#>
+
+  number = Formstrap::NumberView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", number.wrapper_options do %>
+  <%= render "formstrap/label", number.label_options if number.prepend_label? %>
+  <%= render "formstrap/input_group", number.input_group_options do %>
+    <%= form.number_field(number.attribute, number.input_options) %>
+    <%= render "formstrap/datalist", number.datalist_options if number.datalist? %>
+  <% end %>
+  <%= render "formstrap/validation", number.validation_options if number.validate? %>
+  <%= render "formstrap/hint", number.hint_options if number.hint? %>
+  <%= render "formstrap/label", number.label_options if number.append_label? %>
+<% end %>

data/app/views/formstrap/_password.html.erb

@@ -0,0 +1,39 @@
+<%
+  # formstrap/password
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +float+ - Use floating labels. Defaults to false
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +plaintext+ - Render input as plain text.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/password
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/password
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/password_field
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/password", form: form, attribute: :password %#>
+  #   <% end %#>
+
+  password = Formstrap::PasswordView.new(local_assigns)
+%>
+
+<%= render "formstrap/wrapper", password.wrapper_options do %>
+  <%= render "formstrap/label", password.label_options if password.prepend_label? %>
+  <%= render "formstrap/input_group", password.input_group_options do %>
+    <%= form.password_field(password.attribute, password.input_options) %>
+  <% end %>
+  <%= render "formstrap/validation", password.validation_options if password.validate? %>
+  <%= render "formstrap/hint", password.hint_options if password.hint? %>
+  <%= render "formstrap/label", password.label_options if password.append_label? %>
+<% end %>

data/app/views/formstrap/_redactorx.html.erb

@@ -0,0 +1,31 @@
+<%
+  # formstrap/redactorx
+  #
+  # ==== Required parameters
+  # * +attribute+ - Name of the attribute of the form model
+  # * +form+ - Form object
+  #
+  # ==== Optional parameters
+  # * +append+ - Display as input group with text on the right-hand side
+  # * +hint+ - Informative text to assist with data input. HTML markup is allowed.
+  # * +hybrid+ - Enables hybrid mode when set to true (default = false)
+  # * +label+ - Text to display inside label tag. Defaults to the attribute name. Set to false if you don"t want to show a label.
+  # * +prepend+ - Display as input group with text on the left-hand side
+  # * +redactor+ - Hash with all options you can pass to redactor JS config
+  # * +wrapper+ - Hash with all options for the surrounding html tag
+  #
+  # ==== References
+  # https://headmin.dev/docs/forms/redactorx
+  # https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea
+  # https://apidock.com/rails/ActionView/Helpers/FormHelper/text_area
+  #
+  # ==== Examples
+  #   Basic version
+  #   <%= form_with do |form| %#>
+  #     <%= render "formstrap/redactorx", form: form, attribute: :text %#>
+  #   <% end %#>
+
+  redactor = Formstrap::RedactorxView.new(local_assigns)
+%>
+
+<%= render "formstrap/textarea", redactor.options %>