sdr_view_components 0.1.14 → 0.2.1

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 %>

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

@@ -0,0 +1,10 @@
+<% 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,
+    variant: :help_text_below,
+    help_text: 'Help text appears below the field when using the help_text_below variant.'
+  ) %>
+<% end %>

data/spec/components/previews/sdr_view_components/forms/text_field_component_preview/with_placeholder.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_placeholder: 'Enter a descriptive title'
+  ) %>
+<% end %>

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

@@ -0,0 +1,9 @@
+<% model = SdrViewComponents::Forms::TextFieldComponentPreview::TextFieldPreviewModel.new(title: nil) %>
+<% model.valid? %>
+
+<%= 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.rb

@@ -0,0 +1,40 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class TextFieldComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def label_hidden; end
+
+      # @!group Help text
+      def with_help_text; end
+
+      def with_help_text_below; end
+      # @!endgroup
+
+      # @!group Input Options
+      def with_placeholder; end
+
+      def disabled; end
+
+      def required; end
+
+      def marked_required; end
+      # @!endgroup
+
+      def with_additional_container_content; end
+
+      def with_validation_error; end
+
+      class TextFieldPreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :title, :string, default: nil
+
+        validates :title, presence: true
+      end
+    end
+  end
+end

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

@@ -0,0 +1,11 @@
+<% model = SdrViewComponents::Forms::ToggleComponentPreview::TogglePreviewModel.new(audience: 'collections') %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::ToggleComponent.new(
+    form: form,
+    field_name: :audience
+  ) do |component| %>
+    <% component.with_left_toggle_option(form:, field_name: :audience, label: 'Collections', value: 'collections') %>
+    <% component.with_right_toggle_option(form:, field_name: :audience, label: 'Items', value: 'items') %>
+  <% end %>
+<% end %>

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

@@ -0,0 +1,12 @@
+<% model = SdrViewComponents::Forms::ToggleComponentPreview::TogglePreviewModel.new(audience: nil) %>
+<% model.valid? %>
+
+<%= form_with(model: model, url: '/example') do |form| %>
+  <%= render SdrViewComponents::Forms::ToggleComponent.new(
+    form: form,
+    field_name: :audience
+  ) do |component| %>
+    <% component.with_left_toggle_option(form:, field_name: :audience, label: 'Collections', value: 'collections') %>
+    <% component.with_right_toggle_option(form:, field_name: :audience, label: 'Items', value: 'items') %>
+  <% end %>
+<% end %>

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

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Forms
+    class ToggleComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def with_validation_error; end
+
+      class TogglePreviewModel
+        include ActiveModel::Model
+        include ActiveModel::Attributes
+
+        attribute :audience, :string, default: 'collections'
+
+        validates :audience, presence: true
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/structure/footer_component_preview.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Structure
+    class FooterComponentPreview < ViewComponent::Preview
+      def default
+        render SdrViewComponents::Structure::FooterComponent.new
+      end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/structure/header_component_preview/dark_variant.html.erb

@@ -0,0 +1,15 @@
+<%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', variant: :dark) do |header| %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %>
+  <% end %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %>
+      <% dropdown.with_item do %>
+        <%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %>
+      <% end %>
+    <% end %>
+  <% end %>
+  <% header.with_secondary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/structure/header_component_preview/dark_variant_with_background_color.html.erb

@@ -0,0 +1,15 @@
+<%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', variant: :dark, background_color: '1, 104, 149') do |header| %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %>
+  <% end %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %>
+      <% dropdown.with_item do %>
+        <%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %>
+      <% end %>
+    <% end %>
+  <% end %>
+  <% header.with_secondary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/structure/header_component_preview/light_variant.html.erb

@@ -0,0 +1,15 @@
+<%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle') do |header| %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %>
+  <% end %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %>
+      <% dropdown.with_item do %>
+        <%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %>
+      <% end %>
+    <% end %>
+  <% end %>
+  <% header.with_secondary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/structure/header_component_preview/no_rosette.html.erb

@@ -0,0 +1,15 @@
+<%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', rosette: false) do |header| %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %>
+  <% end %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %>
+      <% dropdown.with_item do %>
+        <%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %>
+      <% end %>
+    <% end %>
+  <% end %>
+  <% header.with_secondary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/structure/header_component_preview/white_variant.html.erb

@@ -0,0 +1,15 @@
+<%= render SdrViewComponents::Structure::HeaderComponent.new(title: 'Test Header', subtitle: 'Test Subtitle', variant: :white) do |header| %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Home', path: '#') %>
+  <% end %>
+  <% header.with_primary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::DropdownMenuComponent.new(text: 'Logged in: amcollie-preview-dropdown') do |dropdown| %>
+      <% dropdown.with_item do %>
+        <%= link_to 'Logout', '/Shibboleth.sso/Logout', class: 'dropdown-item' %>
+      <% end %>
+    <% end %>
+  <% end %>
+  <% header.with_secondary_navigation_link do %>
+    <%= render SdrViewComponents::Elements::Navigation::NavItemComponent.new(text: 'Option', path: '/item1') %>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/structure/header_component_preview.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Structure
+    class HeaderComponentPreview < ViewComponent::Preview
+      def light_variant; end
+
+      def white_variant; end
+
+      def dark_variant; end
+      def dark_variant_with_background_color; end
+
+      def no_rosette; end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/tables/cell_component_preview/default.html.erb

@@ -0,0 +1,9 @@
+<table class="table">
+  <tbody>
+    <tr>
+      <%= render SdrViewComponents::Tables::CellComponent.new do %>
+        Status
+      <% end %>
+    </tr>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/cell_component_preview/with_colspan.html.erb

@@ -0,0 +1,17 @@
+<table class="table">
+  <tbody>
+    <tr>
+      <%= render SdrViewComponents::Tables::CellComponent.new(colspan: 2) do %>
+        Quarterly total
+      <% end %>
+    </tr>
+    <tr>
+      <%= render SdrViewComponents::Tables::CellComponent.new do %>
+        Revenue
+      <% end %>
+      <%= render SdrViewComponents::Tables::CellComponent.new do %>
+        $125,000
+      <% end %>
+    </tr>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/cell_component_preview.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Tables
+    class CellComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def with_colspan; end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/tables/header_component_preview/default.html.erb

@@ -0,0 +1,7 @@
+<table class="table">
+  <thead>
+    <tr>
+      <%= render SdrViewComponents::Tables::HeaderComponent.new(label: 'Repository') %>
+    </tr>
+  </thead>
+</table>

data/spec/components/previews/sdr_view_components/tables/header_component_preview/with_tooltip.html.erb

@@ -0,0 +1,19 @@
+<table class="table">
+  <thead>
+    <tr>
+      <%= render SdrViewComponents::Tables::HeaderComponent.new(
+            label: 'Access',
+            tooltip: 'Explains who can view or manage this item.'
+          ) %>
+    </tr>
+  </thead>
+</table>
+
+<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/tables/header_component_preview.rb

@@ -0,0 +1,11 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Tables
+    class HeaderComponentPreview < ViewComponent::Preview
+      def default; end
+
+      def with_tooltip; end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/tables/list_cell_component_preview/with_item_values.html.erb

@@ -0,0 +1,7 @@
+<table class="table">
+  <tbody>
+    <tr>
+      <%= render SdrViewComponents::Tables::ListCellComponent.new(item_values: item_values) %>
+    </tr>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/list_cell_component_preview/with_items.html.erb

@@ -0,0 +1,11 @@
+<table class="table">
+  <tbody>
+    <tr>
+      <%= render SdrViewComponents::Tables::ListCellComponent.new do |component| %>
+        <% items.each do |item| %>
+          <% component.with_item { item } %>
+        <% end %>
+      <% end %>
+    </tr>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/list_cell_component_preview.rb

@@ -0,0 +1,27 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Tables
+    class ListCellComponentPreview < ViewComponent::Preview
+      # @!group Item sources
+
+      def with_item_values
+        render_with_template(locals: {
+                               item_values: ['Published', 'Preserved', 'Available in SearchWorks']
+                             })
+      end
+
+      def with_items
+        render_with_template(locals: {
+                               items: [
+                                 'Created by Digital Production Group',
+                                 'Reviewed by Metadata Services',
+                                 'Updated last week'
+                               ]
+                             })
+      end
+
+      # @!endgroup
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/tables/raw_table_component_preview/default.html.erb

@@ -0,0 +1,26 @@
+<%= render(SdrViewComponents::Tables::RawTableComponent.new(label: 'Custom Row Content')) do |component| %>
+  <% component.with_header(label: 'Item') %>
+  <% component.with_header(label: 'Status') %>
+  <% component.with_header(label: 'Description') %>
+  <% component.with_row do %>
+    <tr>
+      <td>Item 1</td>
+      <td><strong>Complete</strong></td>
+      <td>Custom HTML rendering</td>
+    </tr>
+  <% end %>
+  <% component.with_row do %>
+    <tr>
+      <td>Item 2</td>
+      <td><em>In Progress</em></td>
+      <td><code>RawTableComponent</code> demo</td>
+    </tr>
+  <% end %>
+  <% component.with_row do %>
+    <tr>
+      <td>Item 3</td>
+      <td><u>Pending</u></td>
+      <td>Arbitrary HTML content</td>
+    </tr>
+  <% end %>
+<% end %>

data/spec/components/previews/sdr_view_components/tables/raw_table_component_preview.rb

@@ -0,0 +1,9 @@
+# frozen_string_literal: true
+
+module SdrViewComponents
+  module Tables
+    class RawTableComponentPreview < ViewComponent::Preview
+      def default; end
+    end
+  end
+end

data/spec/components/previews/sdr_view_components/tables/row_component_preview/label_only.html.erb

@@ -0,0 +1,5 @@
+<table class="table">
+  <tbody>
+    <%= render SdrViewComponents::Tables::RowComponent.new(label: 'Deposit status') %>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/row_component_preview/with_cells.html.erb

@@ -0,0 +1,13 @@
+<% row = SdrViewComponents::Tables::RowComponent.new(label: 'Content files') %>
+<% row.with_cell do %>
+  image-0001.tif
+<% end %>
+<% row.with_cell do %>
+  image-0002.tif
+<% end %>
+
+<table class="table">
+  <tbody>
+    <%= render row %>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/row_component_preview/with_first_value_and_values.html.erb

@@ -0,0 +1,8 @@
+<table class="table">
+  <tbody>
+    <%= render SdrViewComponents::Tables::RowComponent.new(
+      first_value: 'File set',
+      values: ['Preserved', 'Published']
+    ) %>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/row_component_preview/with_label_content.html.erb

@@ -0,0 +1,11 @@
+<% row = SdrViewComponents::Tables::RowComponent.new(value: 'Submitted') %>
+<% row.with_label_content do %>
+  <strong>Deposit status</strong><br>
+  <small>Current workflow step</small>
+<% end %>
+
+<table class="table">
+  <tbody>
+    <%= render row %>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/row_component_preview/with_tooltip.html.erb

@@ -0,0 +1,18 @@
+<table class="table">
+  <tbody>
+    <%= render SdrViewComponents::Tables::RowComponent.new(
+      label: 'Embargo',
+      value: 'Ends 2027-01-15',
+      tooltip: 'Date when the item becomes visible to the public.'
+    ) %>
+  </tbody>
+</table>
+
+<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/tables/row_component_preview/with_value.html.erb

@@ -0,0 +1,8 @@
+<table class="table">
+  <tbody>
+    <%= render SdrViewComponents::Tables::RowComponent.new(
+      label: 'Collection',
+      value: 'Manuscript Division'
+    ) %>
+  </tbody>
+</table>

data/spec/components/previews/sdr_view_components/tables/row_component_preview/with_values.html.erb

@@ -0,0 +1,8 @@
+<table class="table">
+  <tbody>
+    <%= render SdrViewComponents::Tables::RowComponent.new(
+      label: 'Access',
+      values: ['Stanford users', 'World']
+    ) %>
+  </tbody>
+</table>