yummy-guide-generic-administrate 0.8.19 → 0.8.20

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c85a364e43e99ea2fcb9440143675804196ced1b1d46b211cd202e1664232581
-  data.tar.gz: e6974ae9c103179acfc9fe77347336dac3feae4e305f1008dbc2ebd18eb1bd26
+  metadata.gz: 80717c9b4b3431c6d830aa3364e4e731eb53758755cee3ed3d265d605d22549c
+  data.tar.gz: 6352ff8d1f0e18c879ce79fe160aea19221c796fd1f9ca85dcb9ccbab8c54c39
 SHA512:
-  metadata.gz: bddc130440fc835aabeca11cc79dafcaaecfcd6f06ab4c37a18318b618a4d20b835436e5f766adb4f31a4e25f391a447dbdce40af0e2694b2101f426f2153109
-  data.tar.gz: 87927272596c5bbb430f78982a5ba8d4e20626c88b907fa14613708a49de8d4dc357d8fe4c8160719f00a8e3d159aaea74dee74678aa1c22f5c41430fbadb117
+  metadata.gz: fa85ed3939027282dcc7eb7c30f9c8b95a9c1ed9b5cbe56b17c6126c81d6fdf67ebb314b4e333a8c02cacd597f9f34958ec672c969082d8675411ea0d36ced3a
+  data.tar.gz: 9ce39cfffdb9d190e0f2a67838487818aedc47dec192d9e3c7c8a06689d1241b532131840e828a24d2466c9ef6db82dd784aacbf4dc1d44691f2726981b89c93

data/app/assets/stylesheets/yummy_guide_administrate/components.scss

@@ -260,6 +260,15 @@
   overflow: visible;
 }
 
+// Embedded tables opt in so the wrapper, not the page, owns both scroll axes.
+.scroll-table[data-css-sticky-table][data-constrained-scroll],
+.home-table__wrapper[data-css-sticky-table][data-constrained-scroll] {
+  --admin-sticky-actions-right: 0px; // pin Actions to the box edge, not to the page padding
+  max-block-size: calc(100dvh - var(--admin-sticky-page-header-height, 8rem) - 5rem);
+  overflow: auto;
+  overscroll-behavior: contain;
+}
+
 .scroll-table[data-css-sticky-table] table,
 .sticky-table-scroll[data-css-sticky-table] table,
 .home-table__wrapper[data-css-sticky-table] table,
@@ -1646,6 +1655,14 @@ body.admin-filter-open {
     width: 100vw !important;
   }
 
+  // Constrained tables live inside a padded card, so fit the card instead of the viewport.
+  body :is(.scroll-table, .home-table__wrapper)[data-css-sticky-table][data-constrained-scroll] {
+    inline-size: 100% !important;
+    max-inline-size: 100% !important;
+    max-width: 100% !important;
+    width: 100% !important;
+  }
+
   body.admin-navigation-mobile-open:has([data-css-sticky-table]) :is(.scroll-table, .sticky-table-scroll, .home-table__wrapper, .table-wrap, .af__table__content)[data-css-sticky-table] {
     overflow: hidden !important;
     touch-action: none;

data/app/views/yummy_guide/administrate/administrate/application/_collection.html.erb

@@ -1,10 +1,11 @@
 <% column_width_storage_scope = local_assigns[:column_width_storage_scope].presence %>
+<% constrained_scroll = local_assigns[:constrained_scroll] %>
 <% table_definition = yummy_guide_administrate_collection_table_definition(
      page: page,
      collection_presenter: collection_presenter,
      column_width_storage_scope: column_width_storage_scope
    ) %>
-<div class="scroll-table" data-css-sticky-table>
+<div class="scroll-table" data-css-sticky-table<%= " data-constrained-scroll" if constrained_scroll %>>
   <table
     aria-labelledby="<%= table_title %>"
     data-fixed-columns-count="<%= table_definition.fixed_columns_count %>"

data/lib/yummy_guide/administrate/version.rb

@@ -2,6 +2,6 @@
 
 module YummyGuide
   module Administrate
-    VERSION = "0.8.19"
+    VERSION = "0.8.20"
   end
 end

data/spec/yummy_guide/administrate/column_resizer_asset_spec.rb

@@ -257,6 +257,14 @@ RSpec.describe "column resizer assets" do
     expect(components_source).to include("width: var(--admin-sticky-actions-right, 0px)")
   end
 
+  it "supports opt-in scrolling for embedded sticky tables" do
+    expect(components_source).to include("[data-constrained-scroll]")
+    expect(components_source).to include(".home-table__wrapper[data-css-sticky-table][data-constrained-scroll]")
+    expect(components_source).to include("max-block-size: calc(100dvh - var(--admin-sticky-page-header-height, 8rem) - 5rem)")
+    expect(components_source).to include("overscroll-behavior: contain")
+    expect(components_source).to include("--admin-sticky-actions-right: 0px;")
+  end
+
   # PC表示ではsticky tableをページ全体スクロールで扱うことを静的に確認する
   it "expands the main content to the sticky table width on desktop" do
     expect(components_source).to include("@media screen and (min-width: 768px)")

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: yummy-guide-generic-administrate
 version: !ruby/object:Gem::Version
-  version: 0.8.19
+  version: 0.8.20
 platform: ruby
 authors:
 - akatsuki-kk