form_components 0.1.1 → 0.1.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 8263e5728d9eb7435fc73aaaca11069d712a916f81dd78274ae6f64d962856da
-  data.tar.gz: 532ef72e4ae348a6c4e9efc0df796175a68a01b5daaa0757253ba83a1207a918
+  metadata.gz: fb4d786c398395142f8b487666fc51999ef5a58ec727eb53af5abe6e71ae2e2b
+  data.tar.gz: 77c200345adba5f4e75a9eac9a1dc146176fafc29e6229ed0eced8c37787cd32
 SHA512:
-  metadata.gz: ba582fffbc42304b5e9f3b67ad99aad8ffaf0c0c1f7fa1a3a3e651fd2ae846b8812e55bbe9bf3e98684f945914072e0b6b2809672d27f3e9213a3a2556d9d8c5
-  data.tar.gz: 4ec8d95dcde0c417e7d8197b80461d60d97657fd7120a629d289223b02f5b7af661b057a46948cd3b789555afdc671e782f8fd13c996d66c67dab6d37db1bc5e
+  metadata.gz: 2b3ca6d9bc89211b163ca6c1aebc54ebbe516368597e2e6e2928cf075be0a62307aa692669d7217e379b5ce85a9b378eff0cb7449fc1a1b5f5bcd796515abeac
+  data.tar.gz: 5a575a867ca65b1e9f25f5ac2c9d761d46908829f82963f979213a6dd0f4e717dc8a5831969362ddef44d05f3794094e511aa0b9fb2ff9ca922b748a89d48186

data/CHANGELOG.md

@@ -1,6 +1,11 @@
 # Changelog
 
-## Unreleased
+## 0.1.2
+
+- The templates are ERB; slim-rails is no longer a dependency. They render
+  the same HTML as the Slim ones did, apart from whitespace between tags.
+
+## 0.1.1
 
 - Every helper takes Rails' arguments and renders Rails' own input, so
   names, ids, values and options are Rails' (with `index:`, `namespace:`,

data/README.md

@@ -1,9 +1,10 @@
 # Form components
 
 A form builder for Rails whose fields are view components (ViewComponent,
-Slim, Stimulus, Tailwind CSS v4), as a Rails engine: labels, text fields of
-every type, text areas, check boxes, radio buttons and their collections,
-color and file fields, a submit button and nested forms. Each field has its
+Stimulus, Tailwind CSS v4), as a Rails engine: labels, text fields of every
+type, text areas, check boxes, radio buttons and their collections, selects,
+a combobox, ratings, scales, color and file fields, a submit button and
+nested forms. Each field has its
 label (marked when the attribute is required), a description, and its errors.
 
 The fields are Rails' own: every helper takes the arguments Rails' form
@@ -62,16 +63,19 @@ Instead of the importmap, a bundler resolves these imports to the gem:
 
 ## Usage
 
-```slim
-= form_with model: @post, builder: FormComponents::FormBuilder do |f|
-  = f.text_field :title, placeholder: "A title", description: "Shown on top", leading_icon: "fas fa-heading"
-  = f.email_field :email, corner_hint: "Optional"
-  = f.text_area :body, label: false
-  = f.check_box :published
-  = f.collection_radio_buttons :kind, Kind.all, :id, :name, {description_method: :hint}, {class: "mine"}
-  = f.color_field :color, swatches: ["#e6007e", "#1e40af"], default: "#e6007e"
-  = f.file_field :logo, accept: "image/*", preview: @post.logo
-  = f.submit
+```erb
+<%= form_with model: @post, builder: FormComponents::FormBuilder do |f| %>
+  <%= f.text_field :title, placeholder: "A title", description: "Shown on top", leading_icon: "fas fa-heading" %>
+  <%= f.email_field :email, corner_hint: "Optional" %>
+  <%= f.text_area :body, label: false %>
+  <%= f.check_box :published %>
+  <%= f.collection_radio_buttons :kind, Kind.all, :id, :name, {description_method: :hint}, {class: "mine"} %>
+  <%= f.select :category, Post::CATEGORIES, {include_blank: true}, description: "Where it goes" %>
+  <%= f.rating_field :rating %>
+  <%= f.color_field :color, swatches: ["#e6007e", "#1e40af"], default: "#e6007e" %>
+  <%= f.file_field :logo, accept: "image/*", preview: @post.logo %>
+  <%= f.submit %>
+<% end %>
 ```
 
 ### As the default form builder
@@ -144,23 +148,27 @@ place (`.form-component .field_with_errors { display: contents }`).
 A field's label is marked when its attribute has a presence validator. Pass
 the validation context to the form to count those `on:` it:
 
-```slim
-= form_with model: @post, builder: FormComponents::FormBuilder, validation_context: :publish do |f|
+```erb
+<%= form_with model: @post, builder: FormComponents::FormBuilder, validation_context: :publish do |f| %>
 ```
 
 ### Nested forms
 
 For a has_many association with `accepts_nested_attributes_for`:
 
-```slim
-= f.nested_form :sections do |nf|
-  - nf.with_item do |sf|
-    .section-wrapper data-new-record=sf.object.new_record?.to_s
-      = sf.hidden_field :_destroy
-      = sf.text_field :title
-      button type="button" data-action="form-components--nested-form#remove" Remove
-  - nf.with_add_button
-    button type="button" Add section
+```erb
+<%= f.nested_form :sections do |nf| %>
+  <% nf.with_item do |sf| %>
+    <div class="section-wrapper" data-new-record="<%= sf.object.new_record? %>">
+      <%= sf.hidden_field :_destroy %>
+      <%= sf.text_field :title %>
+      <button type="button" data-action="form-components--nested-form#remove">Remove</button>
+    </div>
+  <% end %>
+  <% nf.with_add_button do %>
+    <button type="button">Add section</button>
+  <% end %>
+<% end %>
 ```
 
 The add button adds a new item from a template, the remove button removes a

data/app/components/form_components/check_box/component.html.erb

@@ -0,0 +1,16 @@
+<div class="form-component flex gap-3">
+  <div class="flex h-6 shrink-0 items-center">
+    <div class="group grid size-4 grid-cols-1"><%= input %></div>
+  </div>
+  <div class="text-sm/6">
+    <% if label != false %>
+      <div class="flex justify-between"><%= field_label(input_id, value: (checked_value if html_options[:multiple])) %></div>
+    <% end %>
+    <% if description.present? %>
+      <label class="text-gray-500 auto-dark:text-gray-400" for="<%= input_id %>" id="<%= input_id %>_description"><%= description %></label>
+    <% end %>
+    <% if has_error? %>
+      <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= input_id %>_error"><%= all_errors.join(", ") %></p>
+    <% end %>
+  </div>
+</div>

data/app/components/form_components/collection/component.html.erb

@@ -0,0 +1,13 @@
+<fieldset <%= tag.attributes("aria-describedby": aria_described_by, class: "form-component") %>>
+  <% if label != false %>
+    <legend class="<%= legend_classes %>"><%= legend %></legend>
+  <% end %>
+  <% if description.present? %>
+    <p class="<%= class_names("text-sm/6 text-gray-500 auto-dark:text-gray-400", "mt-1" => label != false) %>" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <div class="<%= class_names(items_classes, "mt-2" => label != false || description.present?) %>"><%= items %></div>
+  <%= after_items %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</fieldset>

data/app/components/form_components/color_field/component.html.erb

@@ -0,0 +1,10 @@
+<div class="form-component">
+  <%= field_label %>
+  <div <%= tag.attributes(class: class_names("form-color-field mt-2", "form-color-field--error" => has_error?, "form-color-field--default" => default_color), "data-controller": "form-components--color-field", "data-form-components--color-field-swatches-value": swatches.to_json, style: (default_color && "--color-field-default: #{default_color}")) %>><%= input %></div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/components/form_components/combobox/component.html.erb

@@ -0,0 +1,10 @@
+<div class="form-component">
+  <%= field_label %>
+  <div class="mt-2"><%= input %></div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/components/form_components/file_field/component.html.erb

@@ -0,0 +1,13 @@
+<div class="form-component">
+  <%= field_label %>
+  <% if preview? %>
+    <%= image_tag helpers.main_app.url_for(preview.representation(resize_to_limit: [300, 120])), class: "mt-2 max-h-20 rounded", alt: "" %>
+  <% end %>
+  <div class="mt-2"><%= input %></div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/components/form_components/nested_form/component.html.erb

@@ -0,0 +1,19 @@
+<%# Stimulus form-components--nested-form controller:
+    data-form-components--nested-form-placeholder-value      — token replaced with a timestamp on "Add"
+    data-form-components--nested-form-wrapper-selector-value — CSS selector for remove-button scope %>
+<div data-controller="form-components--nested-form" data-form-components--nested-form-placeholder-value="<%= placeholder %>" data-form-components--nested-form-wrapper-selector-value="<%= wrapper_selector %>">
+  <template data-form-components--nested-form-target="template"><%= form.fields_for(method, new_record_object, child_index: placeholder, &item_block) %></template>
+
+  <%# The collection %>
+  <%= form.fields_for(method, &item_block) %>
+
+  <div data-form-components--nested-form-target="insertion"></div>
+
+  <span data-action="click-&gt;form-components--nested-form#add">
+    <% if add_button? %>
+      <%= add_button %>
+    <% else %>
+      <button class="mt-4 inline-flex items-center gap-x-2 rounded-md border border-dashed border-primary-300 px-4 py-3 text-sm font-medium text-primary-600 hover:border-primary-500 hover:bg-primary-50" type="button"><i class="fal fa-plus"></i><span><%= add_label %></span></button>
+    <% end %>
+  </span>
+</div>

data/app/components/form_components/nested_form/component.rb

@@ -4,15 +4,19 @@ module FormComponents
   module NestedForm
     # ViewComponent that encapsulates the Stimulus-driven nested-form pattern.
     #
-    # Usage (in a Slim template with a FormComponents::FormBuilder):
+    # Usage (with a FormComponents::FormBuilder):
     #
-    #   = f.nested_form :sections do |nf|
-    #     - nf.with_item do |sf|
-    #       .section-wrapper data-new-record=sf.object.new_record?.to_s
-    #         = sf.hidden_field :_destroy
-    #         = sf.text_field :title
-    #     - nf.with_add_button
-    #       button type="button" data-action="form-components--nested-form#add" Add section
+    #   <%= f.nested_form :sections do |nf| %>
+    #     <% nf.with_item do |sf| %>
+    #       <div class="section-wrapper" data-new-record="<%= sf.object.new_record? %>">
+    #         <%= sf.hidden_field :_destroy %>
+    #         <%= sf.text_field :title %>
+    #       </div>
+    #     <% end %>
+    #     <% nf.with_add_button do %>
+    #       <button type="button" data-action="form-components--nested-form#add">Add section</button>
+    #     <% end %>
+    #   <% end %>
     #
     # The same +with_item+ block is used for both:
     #   • the hidden HTML <template> tag (rendered with a new record so that

data/app/components/form_components/radio_button/component.html.erb

@@ -0,0 +1,14 @@
+<div class="form-component relative flex items-start">
+  <div class="flex h-6 items-center"><%= input %></div>
+  <div class="ml-3 text-sm/6">
+    <% if label != false %>
+      <div class="flex justify-between"><%= field_label(input_id, value: tag_value) %></div>
+    <% end %>
+    <% if description.present? %>
+      <label class="text-gray-500 auto-dark:text-gray-400" for="<%= input_id %>" id="<%= input_id %>_description"><%= description %></label>
+    <% end %>
+    <% if has_error? %>
+      <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= input_id %>_error"><%= all_errors.join(", ") %></p>
+    <% end %>
+  </div>
+</div>

data/app/components/form_components/select/component.html.erb

@@ -0,0 +1,10 @@
+<div class="form-component">
+  <%= field_label %>
+  <div class="mt-2"><%= input %></div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/components/form_components/text_area/component.html.erb

@@ -0,0 +1,20 @@
+<div class="form-component">
+  <% if label != false || corner_hint.present? %>
+    <div class="flex justify-between">
+      <%= field_label %>
+      <span class="text-sm/6 text-gray-500 auto-dark:text-gray-400"><%= corner_hint %></span>
+    </div>
+  <% end %>
+  <div class="mt-2 grid grid-cols-1">
+    <%= input %>
+    <% if has_error? %>
+      <div class="fas fa-circle-exclamation pointer-events-none col-start-1 row-start-1 mr-3 size-5 self-center justify-self-end text-red-500 sm:size-4"></div>
+    <% end %>
+  </div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/components/form_components/text_field/component.html.erb

@@ -0,0 +1,23 @@
+<div class="form-component">
+  <% if label != false || corner_hint.present? %>
+    <div class="flex justify-between">
+      <%= field_label %>
+      <span class="text-sm/6 text-gray-500 auto-dark:text-gray-400"><%= corner_hint %></span>
+    </div>
+  <% end %>
+  <div class="mt-2 grid grid-cols-1">
+    <%= input %>
+    <% if leading_icon.present? %>
+      <span class="<%= class_names("pointer-events-none col-start-1 row-start-1 ml-3 size-5 self-center text-gray-400 sm:size-4", leading_icon) %>"></span>
+    <% end %>
+    <% if has_error? %>
+      <div class="fas fa-circle-exclamation pointer-events-none col-start-1 row-start-1 mr-3 size-5 self-center justify-self-end text-red-500 sm:size-4"></div>
+    <% end %>
+  </div>
+  <% if description.present? %>
+    <p class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" id="<%= tag_id %>_description"><%= description %></p>
+  <% end %>
+  <% if has_error? %>
+    <p class="mt-2 text-sm text-red-600 auto-dark:text-red-400" id="<%= tag_id %>_error"><%= all_errors.join(", ") %></p>
+  <% end %>
+</div>

data/app/form_builders/form_components/form_builder.rb

@@ -9,8 +9,9 @@ module FormComponents
   # get. Helpers without a component here, such as hidden_field or date_select,
   # are Rails'.
   #
-  #   = form_with model: @post, builder: FormComponents::FormBuilder do |f|
-  #     = f.text_field :title
+  #   <%= form_with model: @post, builder: FormComponents::FormBuilder do |f| %>
+  #     <%= f.text_field :title %>
+  #   <% end %>
   class FormBuilder < ActionView::Helpers::FormBuilder
     include FormComponents::ValidationContext
 
@@ -107,13 +108,17 @@ module FormComponents
     # Renders a Stimulus-driven nested form for a has_many association.
     # The block receives the component (nf) so you can declare slots:
     #
-    #   = f.nested_form :sections do |nf|
-    #     - nf.with_item do |sf|
-    #       .section-wrapper data-new-record=sf.object.new_record?.to_s
-    #         = sf.hidden_field :_destroy
-    #         = sf.text_field :title
-    #     - nf.with_add_button
-    #       button type="button" data-action="form-components--nested-form#add" Add section
+    #   <%= f.nested_form :sections do |nf| %>
+    #     <% nf.with_item do |sf| %>
+    #       <div class="section-wrapper" data-new-record="<%= sf.object.new_record? %>">
+    #         <%= sf.hidden_field :_destroy %>
+    #         <%= sf.text_field :title %>
+    #       </div>
+    #     <% end %>
+    #     <% nf.with_add_button do %>
+    #       <button type="button" data-action="form-components--nested-form#add">Add section</button>
+    #     <% end %>
+    #   <% end %>
     #
     # Options (keyword arguments):
     #   placeholder:      – Stimulus token replaced on clone, default "NEW_<SINGULAR>"

data/lib/form_components/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module FormComponents
-  VERSION = "0.1.1"
+  VERSION = "0.1.2"
 end

data/lib/form_components.rb

@@ -1,7 +1,6 @@
 # frozen_string_literal: true
 
 require "view_component"
-require "slim-rails"
 require "importmap-rails"
 require "form_components/version"
 require "form_components/engine"

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: form_components
 version: !ruby/object:Gem::Version
-  version: 0.1.1
+  version: 0.1.2
 platform: ruby
 authors:
 - Tom de Grunt
@@ -37,20 +37,6 @@ dependencies:
     - - ">="
       - !ruby/object:Gem::Version
         version: '3'
-- !ruby/object:Gem::Dependency
-  name: slim-rails
-  requirement: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '3'
-  type: :runtime
-  prerelease: false
-  version_requirements: !ruby/object:Gem::Requirement
-    requirements:
-    - - ">="
-      - !ruby/object:Gem::Version
-        version: '3'
 - !ruby/object:Gem::Dependency
   name: importmap-rails
   requirement: !ruby/object:Gem::Requirement
@@ -80,35 +66,35 @@ files:
 - app/assets/stylesheets/form_components/application.css
 - app/assets/tailwind/form_components/engine.css
 - app/components/form_components/base/component.rb
-- app/components/form_components/check_box/component.html.slim
+- app/components/form_components/check_box/component.html.erb
 - app/components/form_components/check_box/component.rb
-- app/components/form_components/collection/component.html.slim
+- app/components/form_components/collection/component.html.erb
 - app/components/form_components/collection/component.rb
 - app/components/form_components/collection_check_boxes/component.rb
 - app/components/form_components/collection_radio_buttons/component.rb
 - app/components/form_components/color_field/component.css
-- app/components/form_components/color_field/component.html.slim
+- app/components/form_components/color_field/component.html.erb
 - app/components/form_components/color_field/component.rb
 - app/components/form_components/color_field/component_controller.js
-- app/components/form_components/combobox/component.html.slim
+- app/components/form_components/combobox/component.html.erb
 - app/components/form_components/combobox/component.rb
 - app/components/form_components/field/component.rb
-- app/components/form_components/file_field/component.html.slim
+- app/components/form_components/file_field/component.html.erb
 - app/components/form_components/file_field/component.rb
 - app/components/form_components/label/component.rb
-- app/components/form_components/nested_form/component.html.slim
+- app/components/form_components/nested_form/component.html.erb
 - app/components/form_components/nested_form/component.rb
 - app/components/form_components/nested_form/component_controller.js
-- app/components/form_components/radio_button/component.html.slim
+- app/components/form_components/radio_button/component.html.erb
 - app/components/form_components/radio_button/component.rb
 - app/components/form_components/rating_field/component.rb
 - app/components/form_components/scale_field/component.rb
-- app/components/form_components/select/component.html.slim
+- app/components/form_components/select/component.html.erb
 - app/components/form_components/select/component.rb
 - app/components/form_components/submit/component.rb
-- app/components/form_components/text_area/component.html.slim
+- app/components/form_components/text_area/component.html.erb
 - app/components/form_components/text_area/component.rb
-- app/components/form_components/text_field/component.html.slim
+- app/components/form_components/text_field/component.html.erb
 - app/components/form_components/text_field/component.rb
 - app/components/form_components/validation.rb
 - app/form_builders/form_components/form_builder.rb

data/app/components/form_components/check_box/component.html.slim

@@ -1,13 +0,0 @@
-.form-component.flex.gap-3
-  .flex.h-6.shrink-0.items-center
-    .group.grid.size-4.grid-cols-1
-      = input
-  .text-sm/6
-    - if label != false
-      div.flex.justify-between
-        = field_label(input_id, value: (checked_value if html_options[:multiple]))
-    - if description.present?
-      label for=input_id class="text-gray-500 auto-dark:text-gray-400" id=input_id+"_description"
-        = description
-    - if has_error?
-      p id=input_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/collection/component.html.slim

@@ -1,10 +0,0 @@
-fieldset.form-component aria-describedby=aria_described_by
-  - if label != false
-    legend class=legend_classes = legend
-  - if description.present?
-    p id=tag_id+"_description" class=class_names("text-sm/6 text-gray-500 auto-dark:text-gray-400", "mt-1" => label != false) = description
-  div class=class_names(items_classes, "mt-2" => label != false || description.present?)
-    = items
-  = after_items
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/color_field/component.html.slim

@@ -1,8 +0,0 @@
-.form-component
-  = field_label
-  .form-color-field.mt-2 class=class_names("form-color-field--error" => has_error?, "form-color-field--default" => default_color) style=(default_color && "--color-field-default: #{default_color}") data-controller="form-components--color-field" data-form-components--color-field-swatches-value=swatches.to_json
-    = input
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/combobox/component.html.slim

@@ -1,8 +0,0 @@
-.form-component
-  = field_label
-  div.mt-2
-    = input
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/file_field/component.html.slim

@@ -1,10 +0,0 @@
-.form-component
-  = field_label
-  - if preview?
-    = image_tag helpers.main_app.url_for(preview.representation(resize_to_limit: [300, 120])), class: "mt-2 max-h-20 rounded", alt: ""
-  .mt-2
-    = input
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/nested_form/component.html.slim

@@ -1,20 +0,0 @@
-/ ─── Stimulus form-components--nested-form controller ─────────────────────
-/ data-form-components--nested-form-placeholder-value  — token replaced with a timestamp on "Add"
-/ data-form-components--nested-form-wrapper-selector-value — CSS selector for remove-button scope
-div data-controller="form-components--nested-form" data-form-components--nested-form-placeholder-value=placeholder data-form-components--nested-form-wrapper-selector-value=wrapper_selector
-
-  template data-form-components--nested-form-target="template"
-    = form.fields_for(method, new_record_object, child_index: placeholder, &item_block)
-
-  / ── Collection ──────────────────────────────────────────────────────────────
-  = form.fields_for(method, &item_block)
-
-  div data-form-components--nested-form-target="insertion"
-
-  span data-action="click->form-components--nested-form#add"
-    - if add_button?
-      = add_button
-    - else
-      button.mt-4.inline-flex.items-center.gap-x-2.rounded-md.border.border-dashed.border-primary-300.px-4.py-3.text-sm.font-medium.text-primary-600.hover:border-primary-500.hover:bg-primary-50 type="button"
-        i.fal.fa-plus
-        span = add_label

data/app/components/form_components/radio_button/component.html.slim

@@ -1,12 +0,0 @@
-.form-component.relative.flex.items-start
-  .flex.h-6.items-center
-    = input
-  .ml-3.text-sm/6
-    - if label != false
-      div.flex.justify-between
-        = field_label(input_id, value: tag_value)
-    - if description.present?
-      label.text-gray-500.auto-dark:text-gray-400 for=input_id id=input_id+"_description"
-        = description
-    - if has_error?
-      p id=input_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/select/component.html.slim

@@ -1,8 +0,0 @@
-.form-component
-  = field_label
-  div.mt-2
-    = input
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/text_area/component.html.slim

@@ -1,14 +0,0 @@
-.form-component
-  - if label != false || corner_hint.present?
-    div.flex.justify-between
-      = field_label
-      span.text-sm/6.text-gray-500.auto-dark:text-gray-400
-        = corner_hint
-  div.mt-2 class="grid grid-cols-1"
-    = input
-    - if has_error?
-      .fas.fa-circle-exclamation class="pointer-events-none col-start-1 row-start-1 mr-3 size-5 self-center justify-self-end text-red-500 sm:size-4"
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")

data/app/components/form_components/text_field/component.html.slim

@@ -1,16 +0,0 @@
-.form-component
-  - if label != false || corner_hint.present?
-    div.flex.justify-between
-      = field_label
-      span.text-sm/6.text-gray-500.auto-dark:text-gray-400
-        = corner_hint
-  div.mt-2 class="grid grid-cols-1"
-    = input
-    - if leading_icon.present?
-      span class=class_names("pointer-events-none col-start-1 row-start-1 ml-3 size-5 self-center text-gray-400 sm:size-4", leading_icon)
-    - if has_error?
-      .fas.fa-circle-exclamation class="pointer-events-none col-start-1 row-start-1 mr-3 size-5 self-center justify-self-end text-red-500 sm:size-4"
-  - if description.present?
-    p id=tag_id+"_description" class="mt-2 text-sm text-gray-500 auto-dark:text-gray-400" = description
-  - if has_error?
-    p id=tag_id+"_error" class="mt-2 text-sm text-red-600 auto-dark:text-red-400" = all_errors.join(", ")