sdr_view_components 0.2.0 → 0.2.1

data/spec/components/previews/sdr_view_components/forms/checkbox_component_preview.rb

@@ -0,0 +1,33 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class CheckboxComponentPreview < ViewComponent::Preview
+      def default; end
+
+      # @!group Checkbox State
+      def checked; end
+
+      def disabled; end
+      # @!endgroup
+
+      def with_label; end
+
+      # Help text can only be put below a checkbox.
+      def with_help_text; end
+
+      def with_validation_error; end
+
+      def with_additional_container_content; end
+
+      class CheckboxPreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :test_boolean_field, :boolean, default: false
+
+        validates :test_boolean_field, acceptance: true
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/file_component_preview/default.html.erb

@@ -0,0 +1,8 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_additional_container_content.html.erb

@@ -0,0 +1,14 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file
+  ) do |component| %>
+    <% component.with_additional_container_content do %>
+      <div class="alert alert-info mt-2" role="alert">
+        <strong>Note:</strong> Accepted file types are PDF, DOC, and DOCX only.
+      </div>
+    <% end %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_help_text.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file,
+    help_text: 'Select a file to upload. Maximum file size: 10MB.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_help_text_below.html.erb

@@ -0,0 +1,10 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file,
+    variant: :help_text_below,
+    help_text: 'Help text appears below the file input when using help_text_below variant.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_label.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :document,
+    label_text: 'Upload your document'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_multiple.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file,
+    input_multiple: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview/with_validation_error.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::FileComponentPreview::FilePreviewModel.new(document: nil) %>
+<% model.valid? %>
+
+<%= form_with(model: model, url: '/upload') do |form| %>
+  <%= render SdrViewComponents::Forms::FileComponent.new(
+    form: form,
+    field_name: :file
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/file_component_preview.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class FileComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def with_label; end
+
+      # @!group Help text
+      def with_help_text; end
+
+      def with_help_text_below; end
+      # @!endgroup
+
+      def with_multiple; end
+
+      def with_additional_container_content; end
+
+      def with_validation_error; end
+
+      class FilePreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :document, :string, default: nil
+
+        validates :document, presence: true
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/help_text_component_preview/with_block_content.html.erb

@@ -0,0 +1,3 @@
+<%= render SdrViewComponents::Forms::HelpTextComponent.new(id: 'metadata-help-text') do %>
+  Include <strong>at least one creator</strong> and the resource date when known.
+<% end %>

data/spec/components/previews/sdr_view_components/forms/help_text_component_preview/with_text.html.erb

@@ -0,0 +1,4 @@
+<%= render SdrViewComponents::Forms::HelpTextComponent.new(
+  id: 'title-help-text',
+  text: 'Use a concise, descriptive title that will make sense to end users.'
+) %>

data/spec/components/previews/sdr_view_components/forms/help_text_component_preview.rb

@@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class HelpTextComponentPreview < ViewComponent::Preview
+      # @!group Content
+      def with_text; end
+
+      def with_block_content; end
+      # @!endgroup
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/label_component_preview/default.html.erb

@@ -0,0 +1,7 @@
+<%= form_with(url: '/example', scope: :item) do |form| %>
+  <%= render SdrViewComponents::Forms::LabelComponent.new(
+    form: form,
+    field_name: :title,
+    text: 'Collection title'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/label_component_preview/hidden_label.html.erb

@@ -0,0 +1,8 @@
+<%= form_with(url: '/example', scope: :item) do |form| %>
+  <%= render SdrViewComponents::Forms::LabelComponent.new(
+    form: form,
+    field_name: :title,
+    text: 'Collection title',
+    hidden: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/label_component_preview/with_caption.html.erb

@@ -0,0 +1,8 @@
+<%= form_with(url: '/example', scope: :item) do |form| %>
+  <%= render SdrViewComponents::Forms::LabelComponent.new(
+    form: form,
+    field_name: :title,
+    text: 'Collection title',
+    caption: 'Shown to repository users and search results.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/label_component_preview/with_tooltip.html.erb

@@ -0,0 +1,17 @@
+<%= form_with(url: '/example', scope: :item) do |form| %>
+  <%= render SdrViewComponents::Forms::LabelComponent.new(
+    form: form,
+    field_name: :title,
+    text: 'Collection title',
+    tooltip: 'Use the public title shown to repository users.'
+  ) %>
+<% end %>
+
+<script>
+  window.addEventListener('load', () => {
+    const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
+    ;[...tooltipTriggerList].forEach((tooltipTriggerEl) => {
+      window.bootstrap.Tooltip.getOrCreateInstance(tooltipTriggerEl)
+    })
+  })
+</script>

data/spec/components/previews/sdr_view_components/forms/label_component_preview.rb

@@ -0,0 +1,17 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class LabelComponentPreview < ViewComponent::Preview
+      def default; end
+
+      # @!group Label options
+      def hidden_label; end
+
+      def with_tooltip; end
+
+      def with_caption; end
+      # @!endgroup
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/default.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/with_additional_container_content.html.erb

@@ -0,0 +1,14 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email',
+    label_text: 'Email'
+  ) do |component| %>
+    <% component.with_additional_container_content do %>
+      <span class="text-info">Recommended if you want notifications delivered to your inbox.</span>
+    <% end %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/with_help_text.html.erb

@@ -0,0 +1,10 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email',
+    help_text: 'Use this option to receive updates by email.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/with_help_text_below.html.erb

@@ -0,0 +1,11 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email',
+    variant: :help_text_below,
+    help_text: 'Use this option to receive updates by email.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/with_label.html.erb

@@ -0,0 +1,10 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email',
+    label_text: 'Email'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview/with_validation_error.html.erb

@@ -0,0 +1,11 @@
+<% model = SdrViewComponents::Forms::RadioButtonComponentPreview::RadioButtonPreviewModel.new(delivery_method: nil) %>
+<% model.valid? %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::RadioButtonComponent.new(
+    form: form,
+    field_name: :delivery_method,
+    input_value: 'email',
+    label_text: 'Email'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/radio_button_component_preview.rb

@@ -0,0 +1,30 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class RadioButtonComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def with_label; end
+
+      # @!group Help text
+      def with_help_text; end
+
+      def with_help_text_below; end
+      # @!endgroup
+
+      def with_additional_container_content; end
+
+      def with_validation_error; end
+
+      class RadioButtonPreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :delivery_method, :string, default: nil
+
+        validates :delivery_method, presence: true
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/danger.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/items/123', method: :delete) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Delete draft',
+    variant: :danger
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/default.html.erb

@@ -0,0 +1,5 @@
+<%= form_with(url: '/items/123', method: :patch) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Save changes'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/info.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/review', method: :post) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Request information',
+    variant: :info
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/primary.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/items/123', method: :patch) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Save changes',
+    variant: :primary
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/secondary.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/items/123', method: :patch) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Save draft',
+    variant: :secondary
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/success.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/deposit', method: :post) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Deposit item',
+    variant: :success
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/warning.html.erb

@@ -0,0 +1,6 @@
+<%= form_with(url: '/review', method: :post) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    label: 'Submit for review',
+    variant: :warning
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/with_block_content_and_value.html.erb

@@ -0,0 +1,7 @@
+<%= form_with(url: '/deposit', method: :post) do %>
+  <%= render SdrViewComponents::Forms::SubmitComponent.new(
+    value: 'deposit-item'
+  ) do %>
+    Deposit item
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview/with_form_id.html.erb

@@ -0,0 +1,8 @@
+<%= form_with(url: '/items/123/publish', method: :post, html: { id: 'publish-item-form' }) do |form| %>
+  <%= form.hidden_field :item_id, value: '123' %>
+<% end %>
+
+<%= render SdrViewComponents::Forms::SubmitComponent.new(
+  label: 'Publish item',
+  form_id: 'publish-item-form'
+) %>

data/spec/components/previews/sdr_view_components/forms/submit_component_preview.rb

@@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class SubmitComponentPreview < ViewComponent::Preview
+      # @!group Button Variants
+      def primary; end
+
+      def secondary; end
+
+      def success; end
+
+      def danger; end
+
+      def warning; end
+
+      def info; end
+      # @!endgroup
+
+      # @!group Content Options
+      def with_block_content_and_value; end
+      # @!endgroup
+
+      def with_form_id; end
+
+      def default; end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/default.html.erb

@@ -0,0 +1,8 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_additional_container_content.html.erb

@@ -0,0 +1,12 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description
+  ) do |component| %>
+    <% component.with_additional_container_content do %>
+      <p>Character limit: 500.</p>
+    <% end %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_help_text.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description,
+    help_text: 'Describe the item in one or two sentences.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_help_text_below.html.erb

@@ -0,0 +1,10 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description,
+    variant: :help_text_below,
+    help_text: 'This help text appears after the textarea.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_hidden_label.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description,
+    label_hidden: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_mark_required.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description,
+    mark_required: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview/with_validation_error.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextAreaComponentPreview::TextAreaPreviewModel.new(description: nil) %>
+<% model.valid? %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextAreaComponent.new(
+    form: form,
+    field_name: :description
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_area_component_preview.rb

@@ -0,0 +1,32 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class TextAreaComponentPreview < ViewComponent::Preview
+      def default; end
+
+      # @!group Help text
+      def with_help_text; end
+
+      def with_help_text_below; end
+      # @!endgroup
+
+      def with_hidden_label; end
+
+      def with_mark_required; end
+
+      def with_additional_container_content; end
+
+      def with_validation_error; end
+
+      class TextAreaPreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :description, :string, default: nil
+
+        validates :description, presence: true
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/default.html.erb

@@ -0,0 +1,8 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: 'Project overview') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/disabled.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: 'Project overview') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title,
+    input_disabled: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/label_hidden.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: 'Project overview') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title,
+    label_hidden: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/marked_required.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title,
+    mark_required: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/required.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: nil) %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title,
+    input_required: true
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/with_additional_container_content.html.erb

@@ -0,0 +1,12 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: 'Project overview') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title
+  ) do |component| %>
+    <% component.with_additional_container_content do %>
+      <span class="text-info">Suggested: keep titles under 80 characters.</span>
+    <% end %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/with_help_text.html.erb

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: 'Project overview') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::TextFieldComponent.new(
+    form: form,
+    field_name: :title,
+    help_text: 'Use a concise title that will make sense to end users.'
+  ) %>
+<% end %>