atomic_view 0.4.0 → 0.4.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 75aad701c9a9b4598ba4a086f8a3c1c37faaac0bbf23f4ef2927b4d667364f1b
-  data.tar.gz: 1a63769c7c94188b829105777227267be43df6480e6b2f864a5c7be4e831a179
+  metadata.gz: f37c405116dc18595f21f9f7b3a45223edef67c921c991a7c1523a93b594cf39
+  data.tar.gz: 3ce7216ee4b6327f57dec679651d507ba799023f4b2eb3b865ef61bfa3781c1a
 SHA512:
-  metadata.gz: ba9732b3bf6ed19951e2c29ac2feafa7af299679135645bf28650808fd9ff6a6c9e9c3d994be9d23319b69a4679e4e7a8d67a73ae46603a963544a11430e0579
-  data.tar.gz: 10aff2eb5c66efb09918961c87cc708941cd30721c769cd3c2402082d09898098b32389cdfffe52519bbd3bedfa34bb8f2f265694cb0ed5226148abcfcbcd058
+  metadata.gz: a550e6749f5c77da2336b475b69d59d24d09be6e5dfb321bc9c2e73af3968d1b308e0d26962e728f8f0c5dfcd4a341e0d6e63a753ec5986943deba90db4223c7
+  data.tar.gz: 05477662ea7b03cd022ca121c0c1b30967cdf99feae9166209aabf64f531ef1902b3a5c746e76dca92cc107e2a7caa05705a36f91f2fd9bdb3e941270eb49e07

data/lib/atomic_view/components/table_component/cell_component.html.erb

@@ -2,5 +2,5 @@
   <% if linked? %>
     <%= link_to "", path, class: "absolute inset-0", tabindex: (first ? 0 : -1), "aria-hidden": (first ? nil : "true"), "aria-label": (first ? label : nil), data: {row_link: true} %>
   <% end %>
-  <%= tag.span(content, class: "relative") %>
+  <%= tag.span(content, class: content_class) %>
 <% end %>

data/lib/atomic_view/components/table_component/cell_component.rb

@@ -10,21 +10,25 @@ module AtomicView
       # design. `first` and `clickable` are set by RowComponent's `cells`
       # slot from the row itself, not passed by the caller.
       #
-      # Visible content renders as a normal sibling of the (empty,
-      # transparent) stretched `<a>`, wrapped in its own `position:
-      # relative` span so a real link nested inside a cell's content (e.g.
-      # a second, more specific action) still stays clickable above the
-      # row-wide overlay.
+      # Visible content renders as a sibling of the (empty, transparent)
+      # stretched `<a>`, wrapped in a `pointer-events-none` span so plain
+      # content (the common case -- a name, a badge) doesn't sit in the
+      # way of clicks meant for the row-wide overlay underneath it. Pass
+      # `interactive: true` on a cell that renders a real, more specific
+      # link/button of its own (e.g. an "Edit" action) to flip that span
+      # back to `pointer-events-auto`, so that cell's own content takes
+      # the click instead of falling through to the row link.
       class CellComponent < AtomicView::Component
-        attr_reader :path, :label, :first, :align, :clickable
+        attr_reader :path, :label, :first, :align, :clickable, :interactive
 
-        def initialize(path:, label:, first:, align: :left, clickable: true, **options)
+        def initialize(path:, label:, first:, align: :left, clickable: true, interactive: false, **options)
           super()
           @path = path
           @label = label
           @first = first
           @align = align
           @clickable = clickable
+          @interactive = interactive
           @options = options
         end
 
@@ -40,6 +44,10 @@ module AtomicView
           @options.except(:class)
         end
 
+        def content_class
+          interactive ? "relative pointer-events-auto" : "relative pointer-events-none"
+        end
+
         private
 
         def base_classes

data/lib/atomic_view/components/table_component.rb

@@ -24,32 +24,37 @@ module AtomicView
     #
     # `with_column` is an opt-in alternative to hand-building the <thead>:
     # give it at least one column and TableComponent renders the header row
-    # itself, from `<th>`s built by TableComponent::ColumnComponent -- you
-    # still own `<tbody>` content (typically TableComponent::RowComponent
-    # rows) in the block, same as before:
+    # itself, from `<th>`s built by TableComponent::ColumnComponent -- and
+    # wraps the block's return value in a <tbody> for you too, so the block
+    # only has to render rows (typically TableComponent::RowComponent),
+    # same as it would for a turbo_stream append/update elsewhere:
     #
     #   <%= render AtomicView::Components::TableComponent.new(model: Booking) do |table| %>
     #     <% table.with_column(attribute: :camper_name) %>
     #     <% table.with_column(attribute: :status, align: :center) %>
     #     <% table.with_column(label: "") %>
     #
-    #     <tbody>
-    #       <% @bookings.each do |booking| %>
-    #         <%= render(AtomicView::Components::TableComponent::RowComponent.new(record: booking, label: booking.camper_name, path: booking_path(booking))) do |row| %>
-    #           <% row.with_cell { booking.camper_name } %>
-    #           <% row.with_cell(align: :center) { render(BadgeComponent.new) { booking.status } } %>
-    #           <% row.with_cell { render(LinkComponent.new(edit_booking_path(booking), variant: :outline)) { "Edit" } } %>
-    #         <% end %>
+    #     <% @bookings.each do |booking| %>
+    #       <%= render(AtomicView::Components::TableComponent::RowComponent.new(record: booking, label: booking.camper_name, path: booking_path(booking))) do |row| %>
+    #         <% row.with_cell { booking.camper_name } %>
+    #         <% row.with_cell(align: :center) { render(BadgeComponent.new) { booking.status } } %>
+    #         <% row.with_cell(interactive: true) { render(LinkComponent.new(edit_booking_path(booking), variant: :outline)) { "Edit" } } %>
     #       <% end %>
-    #     </tbody>
+    #     <% end %>
     #   <% end %>
     #
+    # The <tbody>'s `id` defaults to `model.model_name.plural` (e.g.
+    # "bookings") so a turbo_stream response can target it directly with
+    # no extra bookkeeping -- pass `body_id:` to override it (a nested
+    # resource sharing a differently-named frame, say).
+    #
     # A table with no columns given renders exactly as before -- `with_column`
-    # is opt-in, not a second required API. `model:` is passed through to
-    # each column so `with_column(attribute: :camper_name)` can default its
-    # label via `model.human_attribute_name(:camper_name)`; a column with no
-    # backing attribute (like the blank "" header above, for an actions
-    # column) just passes `label:` directly instead.
+    # is opt-in, not a second required API, and in that raw mode you still
+    # own the whole `<thead>`/`<tbody>` yourself. `model:` is passed through
+    # to each column so `with_column(attribute: :camper_name)` can default
+    # its label via `model.human_attribute_name(:camper_name)`; a column
+    # with no backing attribute (like the blank "" header above, for an
+    # actions column) just passes `label:` directly instead.
     class TableComponent < AtomicView::Component
       HEAD_ROW_CLASSES = "text-left text-xs font-semibold uppercase tracking-wide text-muted-foreground border-b border-border"
       BODY_ROW_CLASSES = "border-b border-border hover:bg-offset"
@@ -58,15 +63,20 @@ module AtomicView
 
       attr_reader :model
 
-      def initialize(model: nil, **options)
+      def initialize(model: nil, body_id: nil, **options)
         super()
         @model = model
+        @body_id = body_id
         @options = options
       end
 
       def call
         tag.table(**@options.except(:class), class: class_names(base_classes, @options[:class])) do
-          safe_join([columns_header, content].compact)
+          if columns?
+            safe_join([columns_header, tag.tbody(content, id: body_id)])
+          else
+            content
+          end
         end
       end
 
@@ -89,6 +99,10 @@ module AtomicView
         columns.any?
       end
 
+      def body_id
+        @body_id || model&.model_name&.plural
+      end
+
       def base_classes
         "w-full text-sm"
       end

data/lib/atomic_view/version.rb

@@ -1,5 +1,5 @@
 # frozen_string_literal: true
 
 module AtomicView
-  VERSION = "0.4.0"
+  VERSION = "0.4.1"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: atomic_view
 version: !ruby/object:Gem::Version
-  version: 0.4.0
+  version: 0.4.1
 platform: ruby
 authors:
 - Joel Warrington