yummy-guide-generic-administrate 0.8.13 → 0.8.15

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: f39b663ae3463f915b180637532395e54c341dafac50ad331dbb600ab7e275ab
-  data.tar.gz: c690e6ccabd5efdb8a31b74b8c6b3ff0cebe8c54e694bba11725c663108ed84d
+  metadata.gz: a9da6643ffb00010859cc51766113d7c757744a92cb1415ce70a30dafb33c194
+  data.tar.gz: 984902613fa65606e1ca1404bed57cc90b40cf821f678343583ec80e42ee8d95
 SHA512:
-  metadata.gz: ff05d854eaa89f3110eec3936ea31ee769c14a6787ca3dad63070957b38ebc9e185a9a36536f7fcfe86bba2525e15d3ea9929caf16416534b609ab371be07238
-  data.tar.gz: 436be499cc212d05255da8a299ca251a50390199ba73bcd9de6c560e614e3d173df728dd9910e27a25c430fed4e729f190ed74187fda3047e1b45ae3446aa93f
+  metadata.gz: 7cb593f606f48ca2bb18af508fd9df0e567cabfb457ae105901152d7501bc32c069ec5c7e662365e26084cd5b1095e949a9ea920d206da2525eec17db08bca2e
+  data.tar.gz: 1ea3603669a04a6a83ef151dfe48b2c961befdd8e1d6de81f13407fb871980b5556f4e14d4db3ab47746b1907cc83b832354d2cd57db14190b4f649296c01f53

data/app/assets/images/yummy_guide_administrate/icon-check-square.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="none">
+  <rect x="2.25" y="2.25" width="11.5" height="11.5" rx="2" stroke="#000" stroke-width="1.5"/>
+  <path d="m4.85 8.15 2.05 2.05 4.25-4.4" stroke="#000" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

data/app/assets/images/yummy_guide_administrate/icon-eraser.svg

@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
+  <path fill="#000" d="M9.22 1.66a1.75 1.75 0 0 1 2.48 0l2.64 2.64a1.75 1.75 0 0 1 0 2.48l-6.18 6.18a1.75 1.75 0 0 1-2.48 0L3.04 10.32a1.75 1.75 0 0 1 0-2.48l6.18-6.18Zm.95 1.24L4.28 8.79a.4.4 0 0 0 0 .58l2.35 2.35a.4.4 0 0 0 .58 0l5.89-5.89a.4.4 0 0 0 0-.58L10.75 2.9a.4.4 0 0 0-.58 0Z"/>
+  <path fill="#000" d="M7.85 4.72a.67.67 0 0 1 .95 0l2.48 2.48a.67.67 0 1 1-.95.95L7.85 5.67a.67.67 0 0 1 0-.95ZM2.25 13.58c0-.37.3-.66.67-.66h10.16a.67.67 0 0 1 0 1.33H2.92a.67.67 0 0 1-.67-.67Z"/>
+</svg>

data/app/assets/javascripts/yummy_guide_administrate/filter_controls.js

@@ -1,30 +1,92 @@
 (function() {
   function initialize(root) {
     var scope = root || document;
-    scope.querySelectorAll('[data-admin-filter-form="true"]').forEach(function(formEl) {
-      if (formEl.dataset.adminFilterControlsInitialized === 'true') return;
-
-      formEl.dataset.adminFilterControlsInitialized = 'true';
-
-      formEl.addEventListener('submit', function(event) {
-        if (formEl.dataset.submitMode !== 'event') return;
-
-        event.preventDefault();
-        document.dispatchEvent(new CustomEvent('yummy-guide:administrate-filter:submit', {
-          detail: {
-            form: formEl,
-            formData: new FormData(formEl)
-          }
-        }));
-      });
+
+    scope.querySelectorAll('[data-admin-filter-form="true"]').forEach(initializeForm);
+    scope.querySelectorAll('[data-admin-filter-controls="true"]').forEach(initializeControls);
+  }
+
+  function initializeForm(formEl) {
+    if (formEl.dataset.adminFilterControlsInitialized === "true") return;
+
+    formEl.dataset.adminFilterControlsInitialized = "true";
+
+    formEl.addEventListener("submit", function(event) {
+      if (formEl.dataset.submitMode !== "event") return;
+
+      event.preventDefault();
+      document.dispatchEvent(new CustomEvent("yummy-guide:administrate-filter:submit", {
+        detail: {
+          form: formEl,
+          formData: new FormData(formEl)
+        }
+      }));
+    });
+  }
+
+  function initializeControls(rootEl) {
+    if (!rootEl || rootEl.dataset.adminFilterModalInitialized === "true") return;
+
+    var modalRootEl = modalRootFor(rootEl);
+    var formScopeEl = modalRootEl || rootEl;
+    var triggerEl = rootEl.querySelector("a, button");
+    var formEl = formScopeEl.querySelector("form");
+    var overlayEl = overlayFor(rootEl, modalRootEl);
+
+    if (!triggerEl || !formEl || !overlayEl) return;
+
+    rootEl.dataset.adminFilterModalInitialized = "true";
+
+    triggerEl.addEventListener("click", showForm);
+    overlayEl.addEventListener("click", hideForm);
+    formEl.querySelectorAll('[data-behavior="filter-form-close"]').forEach(function(buttonEl) {
+      buttonEl.addEventListener("click", hideForm);
+    });
+    document.addEventListener("keydown", function(event) {
+      if (event.key === "Escape") hideForm();
     });
+
+    function showForm(event) {
+      if (event) event.preventDefault();
+
+      document.documentElement.classList.add("admin-filter-open");
+      document.body.classList.add("admin-filter-open");
+      overlayEl.style.display = "block";
+      formEl.style.display = "flex";
+    }
+
+    function hideForm() {
+      document.documentElement.classList.remove("admin-filter-open");
+      document.body.classList.remove("admin-filter-open");
+      overlayEl.style.removeProperty("display");
+      formEl.style.removeProperty("display");
+    }
+  }
+
+  function modalRootFor(rootEl) {
+    var modalId = rootEl.dataset.adminFilterModalId;
+    if (!modalId) return null;
+
+    return document.getElementById(modalId);
+  }
+
+  function overlayFor(rootEl, modalRootEl) {
+    if (modalRootEl) {
+      return modalRootEl.querySelector("[data-admin-filter-overlay]");
+    }
+
+    if (rootEl.previousElementSibling && rootEl.previousElementSibling.matches("[data-admin-filter-overlay]")) {
+      return rootEl.previousElementSibling;
+    }
+
+    return rootEl.querySelector("[data-admin-filter-overlay]");
   }
 
-  if (document.readyState === 'loading') {
-    document.addEventListener('DOMContentLoaded', function() { initialize(document); }, { once: true });
+  if (document.readyState === "loading") {
+    document.addEventListener("DOMContentLoaded", function() { initialize(document); }, { once: true });
   } else {
     initialize(document);
   }
 
-  document.addEventListener('turbo:load', function() { initialize(document); });
+  document.addEventListener("turbo:load", function() { initialize(document); });
 })();

data/app/assets/javascripts/yummy_guide_administrate/filter_form.js

@@ -110,7 +110,6 @@
       var inputType = (inputEl.getAttribute("type") || "").toLowerCase();
 
       if (inputType === "checkbox" || inputType === "radio") return;
-      if (inputType === "hidden" && inputEl.dataset.datetimePart !== "combined") return;
 
       inputEl.value = "";
       inputEl.setAttribute("value", "");

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

@@ -140,6 +140,11 @@
     box-shadow: 0 calc(0px - var(--admin-sticky-page-header-top, 0px)) 0 var(--admin-sticky-page-header-top, 0px) var(--admin-page-background, #f6f7f7);
   }
 
+  .app-container > .main-content:has(> .main-content__header > .main-content__header-pagination),
+  body.admin-body > main.main-content:has(> .main-content__header > .main-content__header-pagination) {
+    --admin-sticky-page-header-height: 8rem;
+  }
+
   .main-content__header--sticky-table-layout + .main-content__body,
   [data-reservations-sticky-header] + .main-content__body,
   .app-container > .main-content:has(> .main-content__body--flush [data-css-sticky-table]) > .main-content__body--flush,
@@ -188,6 +193,57 @@
     --admin-sticky-page-header-height: 6.75rem;
     --admin-sticky-page-header-z-index: 10;
   }
+
+  .app-container > .main-content:has(> .main-content__header > .main-content__header-pagination),
+  body.admin-body > main.main-content:has(> .main-content__header > .main-content__header-pagination) {
+    --admin-sticky-page-header-height: 9rem;
+  }
+}
+
+.main-content__header:has(> .main-content__header-pagination) {
+  padding-bottom: calc(var(--admin-sticky-page-header-pagination-height, 2.5rem) + 0.75rem);
+}
+
+.main-content__header-pagination {
+  align-items: center;
+  box-sizing: border-box;
+  display: flex;
+  inset-block-end: 0.5rem;
+  inset-inline-start: 50%;
+  justify-content: center;
+  max-inline-size: calc(100% - 2rem);
+  pointer-events: none;
+  position: absolute;
+  transform: translateX(-50%);
+  width: max-content;
+  z-index: 1;
+}
+
+.main-content__header-pagination .pagination {
+  align-items: center;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.25rem 0.5rem;
+  justify-content: center;
+  margin: 0;
+  max-inline-size: 100%;
+  padding-left: 0;
+  padding-right: 0;
+  pointer-events: auto;
+  text-align: center;
+}
+
+.main-content__header-pagination .pagination .first,
+.main-content__header-pagination .pagination .prev,
+.main-content__header-pagination .pagination .page,
+.main-content__header-pagination .pagination .next,
+.main-content__header-pagination .pagination .last {
+  flex: 0 0 auto;
+  inline-size: auto;
+  margin: 0;
+  max-inline-size: none;
+  white-space: nowrap;
+  width: auto;
 }
 
 .scroll-table {
@@ -1044,6 +1100,8 @@ td.actions-column .sticky__item,
 }
 
 .yummy-guide-administrate-filter-form .filter_table {
+  border-collapse: separate;
+  border-spacing: 4px 0;
   width: 100%;
 }
 
@@ -1055,7 +1113,10 @@ td.actions-column .sticky__item,
 .yummy-guide-administrate-filter-form .filter_table td:first-child {
   width: 160px;
   font-weight: 600;
+  overflow-wrap: anywhere;
   vertical-align: middle;
+  white-space: normal;
+  word-break: normal;
 }
 
 .yummy-guide-administrate-filter-form input[type="text"],
@@ -1084,6 +1145,206 @@ td.actions-column .sticky__item,
   box-shadow: 0 -12px 24px rgba(15, 23, 42, 0.08);
 }
 
+#reserv-filter-options {
+  position: relative;
+}
+
+[data-admin-filter-overlay] {
+  display: none;
+  position: fixed;
+  inset: 0;
+  z-index: 1000;
+  background: rgba(15, 23, 42, 0.42);
+}
+
+html.admin-filter-open,
+body.admin-filter-open {
+  overflow: hidden;
+}
+
+#reserv-filter-options > .filter-form,
+.admin-filter-modal-root > .filter-form {
+  display: none;
+  flex-direction: column;
+  position: fixed;
+  top: 50%;
+  left: 50%;
+  right: auto;
+  z-index: 1001;
+  width: calc(100vw - 48px);
+  max-width: 720px;
+  max-height: calc(100vh - 48px);
+  padding: 0;
+  background: #fff;
+  border: 1px solid #d7dce5;
+  border-radius: 8px;
+  box-shadow: 0 18px 44px rgba(15, 23, 42, 0.18);
+  transform: translate(-50%, -50%);
+  overflow: hidden;
+  overscroll-behavior: contain;
+}
+
+.filter-form__header {
+  flex: 0 0 auto;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 12px;
+  padding: 20px 20px 16px;
+}
+
+.filter-form__title {
+  min-width: 0;
+  margin: 0;
+  padding: 0;
+  font-size: 1.2rem;
+}
+
+.filter-form__close {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex: 0 0 32px;
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  border: 1px solid #d0d7de;
+  border-radius: 50%;
+  background: #fff;
+  color: #57606a;
+  cursor: pointer;
+  font: inherit;
+  line-height: 1;
+}
+
+.filter-form__close:hover,
+.filter-form__close:focus,
+.filter-field-clear-button:hover,
+.filter-field-clear-button:focus,
+.filter-icon-button:hover,
+.filter-icon-button:focus {
+  border-color: #0d6efd;
+  background: #eef5ff;
+  color: #0d6efd;
+}
+
+.filter-form__body {
+  flex: 1 1 auto;
+  min-height: 0;
+  overflow-y: auto;
+  overflow-x: hidden;
+  overscroll-behavior: contain;
+  -webkit-overflow-scrolling: touch;
+  padding: 0 20px;
+}
+
+.filter-form .filter_table {
+  border-collapse: separate;
+  border-spacing: 4px 0;
+  width: 100%;
+}
+
+.filter-form .filter_table td {
+  padding: 8px 0;
+  vertical-align: top;
+}
+
+.filter-form .filter_table td:first-child {
+  width: 160px;
+  font-weight: 600;
+  overflow-wrap: anywhere;
+  vertical-align: middle;
+  white-space: normal;
+  word-break: normal;
+}
+
+.filter-form input[type="text"],
+.filter-form input[type="number"],
+.filter-form input[type="search"],
+.filter-form input[type="date"],
+.filter-form select,
+.filter-form textarea,
+.filter-form .filter-datetime-group__time {
+  width: 100%;
+  min-height: 40px;
+  height: 40px;
+  box-sizing: border-box;
+  border: 1px solid #dfe0e1;
+  border-radius: 5px;
+  background-color: #fff;
+}
+
+.filter-form__actions {
+  flex: 0 0 auto;
+  display: flex;
+  gap: 8px;
+  justify-content: flex-end;
+  align-items: center;
+  flex-wrap: wrap;
+  padding: 12px 20px 20px;
+  background: #fff;
+  border-top: 1px solid #e5e7eb;
+  box-shadow: 0 -12px 24px rgba(15, 23, 42, 0.08);
+}
+
+.filter-table__clear {
+  width: 1%;
+  padding-left: 0;
+  text-align: right;
+  vertical-align: middle;
+  white-space: nowrap;
+}
+
+.filter-form .filter_table td.filter-table__clear,
+.yummy-guide-administrate-filter-form .filter_table td.filter-table__clear {
+  vertical-align: middle;
+}
+
+.filter-field-clear-button,
+.filter-icon-button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 40px;
+  height: 32px;
+  box-sizing: border-box;
+  padding: 0 8px;
+  border: 1px solid #d0d7de;
+  border-radius: 5px;
+  background: #fff;
+  color: #57606a;
+  cursor: pointer;
+  font: inherit;
+  font-size: 0.8rem;
+  line-height: 1;
+}
+
+.filter-control-icon {
+  display: inline-block;
+  flex: 0 0 16px;
+  width: 16px;
+  height: 16px;
+  background-color: currentColor;
+}
+
+.filter-control-icon--eraser {
+  -webkit-mask: image-url("yummy_guide_administrate/icon-eraser.svg") center / contain no-repeat;
+  mask: image-url("yummy_guide_administrate/icon-eraser.svg") center / contain no-repeat;
+}
+
+.filter-control-icon--check-square {
+  -webkit-mask: image-url("yummy_guide_administrate/icon-check-square.svg") center / contain no-repeat;
+  mask: image-url("yummy_guide_administrate/icon-check-square.svg") center / contain no-repeat;
+}
+
+.filter-checkbox-group__actions.filter-checkbox-group__actions--clear-cell {
+  flex-direction: column;
+  flex-wrap: nowrap;
+  justify-content: flex-end;
+  align-items: center;
+  gap: 4px;
+}
+
 .filter-datetime-group {
   display: grid;
   grid-template-columns: minmax(180px, 1fr) 88px auto 88px;
@@ -1195,11 +1456,26 @@ td.actions-column .sticky__item,
   }
 
   .yummy-guide-administrate-filter-form__actions,
+  .filter-form__actions,
   .filter-checkbox-group__actions {
     flex-direction: column;
     align-items: stretch;
   }
 
+  #reserv-filter-options > .filter-form,
+  .admin-filter-modal-root > .filter-form {
+    width: calc(100vw - 32px);
+    max-height: calc(100vh - 32px);
+  }
+
+  .filter-form__header {
+    padding: 16px 16px 12px;
+  }
+
+  .filter-form__body {
+    padding: 0 16px;
+  }
+
   .filter-datetime-group {
     grid-template-columns: 1fr;
   }

data/app/helpers/yummy_guide/administrate/filter_controls_helper.rb

@@ -3,6 +3,11 @@
 module YummyGuide
   module Administrate
     module FilterControlsHelper
+      FILTER_CONTROL_ICON_CLASS_MAP = {
+        "fa-eraser" => :eraser,
+        "fa-check-square" => :check_square
+      }.freeze
+
       def admin_filter_controls(
         dashboard: nil,
         page: nil,
@@ -73,7 +78,7 @@ module YummyGuide
         end
 
         safe_join([
-          content_tag(:div, "", class: "modal_overlay"),
+          content_tag(:div, "", class: "modal_overlay", data: { admin_filter_overlay: true }),
           admin_filter_button_container(button_label: button_label, form_markup: form_markup)
         ])
       end
@@ -135,7 +140,7 @@ module YummyGuide
             end,
             content_tag(:div, class: "filter-form__actions") do
               safe_join([
-                link_to("Clear", clear_path, class: "button button--outline-primary"),
+                link_to("Clear", clear_path, class: "button button--outline-primary", data: { behavior: "filter-form-clear-link" }),
                 Array(extra_actions),
                 f.submit(submit_label, class: "submit_filter")
               ].flatten)
@@ -159,7 +164,7 @@ module YummyGuide
       def admin_filter_modal_root(modal_id:, form_markup:)
         content_tag(:div, id: modal_id, class: "admin-filter-modal-root", data: { admin_filter_modal_root: true }) do
           safe_join([
-            content_tag(:div, "", class: "modal_overlay"),
+            content_tag(:div, "", class: "modal_overlay", data: { admin_filter_overlay: true }),
             form_markup
           ])
         end
@@ -233,6 +238,91 @@ module YummyGuide
 
         values.deep_stringify_keys
       end
+
+      def filter_field_clear_button
+        button_tag(
+          type: "button",
+          class: "filter-field-clear-button",
+          data: { behavior: "filter-field-clear" },
+          aria: { label: "Clear this filter" },
+          title: "Clear this filter"
+        ) do
+          filter_control_icon(:eraser)
+        end
+      end
+
+      def filter_field_clear_cell
+        content_tag(:td, filter_field_clear_button, class: "filter-table__clear")
+      end
+
+      def checkbox_group_select_all_button(target:)
+        checkbox_group_action_button(
+          icon: :check_square,
+          label: "Select all",
+          behavior: "checkbox-group-select-all",
+          target: target
+        )
+      end
+
+      def checkbox_group_clear_all_button(target:)
+        checkbox_group_action_button(
+          icon: :eraser,
+          label: "Clear all",
+          behavior: "checkbox-group-clear-all",
+          target: target
+        )
+      end
+
+      def checkbox_group_action_cell(target:)
+        content_tag(:td, class: "filter-table__clear filter-table__checkbox-actions") do
+          content_tag(
+            :div,
+            safe_join([
+              checkbox_group_select_all_button(target: target),
+              checkbox_group_clear_all_button(target: target)
+            ]),
+            class: "filter-checkbox-group__actions filter-checkbox-group__actions--clear-cell"
+          )
+        end
+      end
+
+      def filter_control_icon(icon)
+        icon_name = icon.to_s.tr("_", "-")
+
+        content_tag(
+          :span,
+          "",
+          class: "filter-control-icon filter-control-icon--#{icon_name}",
+          data: { filter_icon: icon_name },
+          aria: { hidden: true }
+        )
+      end
+
+      def checkbox_group_action_button(label:, behavior:, target:, icon: nil, icon_class: nil, title: nil)
+        accessible_label = title || label
+        icon ||= filter_control_icon_name_from_class(icon_class)
+
+        button_tag(
+          type: "button",
+          class: "filter-icon-button",
+          data: { behavior: behavior, target: target },
+          aria: { label: accessible_label },
+          title: accessible_label
+        ) do
+          if icon.present?
+            filter_control_icon(icon)
+          else
+            label
+          end
+        end
+      end
+
+      def filter_control_icon_name_from_class(icon_class)
+        classes = icon_class.to_s.split
+        icon_class_name = FILTER_CONTROL_ICON_CLASS_MAP.keys.find { |class_name| classes.include?(class_name) }
+
+        FILTER_CONTROL_ICON_CLASS_MAP[icon_class_name]
+      end
     end
   end
 end

data/app/views/administrate/application/_header_pagination.html.erb

@@ -0,0 +1,7 @@
+<% pagination = local_assigns[:pagination] %>
+
+<% if pagination.present? %>
+  <div class="main-content__header-pagination">
+    <%= pagination %>
+  </div>
+<% end %>

data/app/views/administrate/application/_index_header.html.erb

@@ -0,0 +1,30 @@
+<% content_for(:title) do %>
+  <%= display_resource_name(page.resource_name) %>
+<% end %>
+
+<header class="main-content__header main-content__header--sticky-table-layout">
+  <h1 class="main-content__page-title" id="page-title">
+    <%= content_for(:title) %>
+  </h1>
+
+  <% if show_search_bar %>
+    <%= render(
+      "search",
+      search_term: search_term,
+      resource_name: display_resource_name(page.resource_name)
+    ) %>
+  <% end %>
+
+  <div>
+    <%= link_to(
+      t(
+        "administrate.actions.new_resource",
+        name: display_resource_name(page.resource_name, singular: true).downcase
+      ),
+      [:new, namespace, page.resource_path.to_sym],
+      class: "button",
+    ) if accessible_action?(new_resource, :new) %>
+  </div>
+
+  <%= render("administrate/application/header_pagination", pagination: local_assigns[:pagination]) %>
+</header>

data/app/views/administrate/application/index.html.erb

@@ -0,0 +1,22 @@
+<% pagination = render("pagination", resources: resources) %>
+
+<%=
+  render("index_header",
+    resources: resources,
+    search_term: search_term,
+    page: page,
+    show_search_bar: show_search_bar,
+    pagination: pagination,
+  )
+%>
+
+<section class="main-content__body main-content__body--flush">
+  <%= render(
+    "collection",
+    collection_presenter: page,
+    collection_field_name: resource_name,
+    page: page,
+    resources: resources,
+    table_title: "page-title"
+  ) %>
+</section>

data/app/views/yummy_guide/administrate/filter_forms/_checkbox_group.html.erb

@@ -17,14 +17,19 @@
     <% end %>
   </div>
   <div class="filter-checkbox-group__actions">
-    <%= button_tag "Select all",
-                   type: "button",
-                   class: "button button--outline-primary filter-checkbox-group__action",
-                   data: { behavior: "checkbox-group-select-all", target: group_name } %>
-    <%= button_tag "Clear all",
-                   type: "button",
-                   class: "button button--outline-primary filter-checkbox-group__action",
-                   data: { behavior: "checkbox-group-clear-all", target: group_name } %>
+    <%= button_tag type: "button",
+                   class: "button button--outline-primary filter-checkbox-group__action filter-icon-button",
+                   data: { behavior: "checkbox-group-select-all", target: group_name },
+                   aria: { label: "Select all" },
+                   title: "Select all" do %>
+      <%= filter_control_icon(:check_square) %>
+    <% end %>
+    <%= button_tag type: "button",
+                   class: "button button--outline-primary filter-checkbox-group__action filter-icon-button",
+                   data: { behavior: "checkbox-group-clear-all", target: group_name },
+                   aria: { label: "Clear all" },
+                   title: "Clear all" do %>
+      <%= filter_control_icon(:eraser) %>
+    <% end %>
   </div>
 </div>
-

data/app/views/yummy_guide/administrate/filter_forms/_datetime_field.html.erb

@@ -1,4 +1,5 @@
 <% parts = yummy_guide_administrate_datetime_filter_parts(current_value, end_of_day: local_assigns[:end_of_day]) %>
+<% minute_options = local_assigns[:minute_options].presence || yummy_guide_administrate_filter_minute_options %>
 <div
   class="filter-datetime-group"
   data-datetime-filter="true"
@@ -22,9 +23,8 @@
                  disabled: parts[:date].blank?) %>
   <span class="filter-datetime-group__separator">:</span>
   <%= select_tag("#{form_scope}[#{field_name}_minute]",
-                 options_for_select(yummy_guide_administrate_filter_minute_options, parts[:minute]),
+                 options_for_select(minute_options, parts[:minute]),
                  class: "#{css_class} #{css_class}--minute filter-datetime-group__time",
                  data: { datetime_part: "minute" },
                  disabled: parts[:date].blank?) %>
 </div>
-

data/lib/yummy_guide/administrate/filters.rb

@@ -189,7 +189,12 @@ module YummyGuide
         protected
 
         def input_cell(view_context, _form, scope, current_values, locals)
-          selected_values = Array(current_values[name.to_s]).map(&:to_s).reject(&:blank?)
+          selected_value = if current_values.key?(name.to_s)
+                             current_values[name.to_s]
+                           else
+                             evaluate_option(options[:default], view_context, locals)
+                           end
+          selected_values = Array(selected_value).map(&:to_s).reject(&:blank?)
           group_name = (options[:group] || name).to_s.dasherize
           controls = normalize_options(view_context, locals).map do |label, value|
             value_string = value.to_s
@@ -240,6 +245,7 @@ module YummyGuide
           from_name = (options[:from] || :"start_#{name}").to_sym
           to_name = (options[:to] || :"end_#{name}").to_sym
           css_class = evaluate_option(options[:css_class] || "#{scope}_#{name}", view_context, locals)
+          minute_options = evaluate_option(options[:minute_options], view_context, locals)
 
           view_context.safe_join([
             view_context.render(
@@ -248,7 +254,8 @@ module YummyGuide
               field_name: from_name,
               current_value: current_values[from_name.to_s],
               css_class: css_class,
-              end_target: to_name
+              end_target: to_name,
+              minute_options: minute_options
             ),
             view_context.content_tag(:p, "〜", class: "filter-datetime-range-separator"),
             view_context.render(
@@ -257,7 +264,8 @@ module YummyGuide
               field_name: to_name,
               current_value: current_values[to_name.to_s],
               css_class: css_class,
-              end_of_day: true
+              end_of_day: true,
+              minute_options: minute_options
             )
           ])
         end

data/lib/yummy_guide/administrate/version.rb

@@ -2,6 +2,6 @@
 
 module YummyGuide
   module Administrate
-    VERSION = "0.8.13"
+    VERSION = "0.8.15"
   end
 end

data/spec/yummy_guide/administrate/column_resizer_asset_spec.rb

@@ -358,6 +358,22 @@ RSpec.describe "column resizer assets" do
     expect(resizable_navigation_source).to include("z-index: var(--admin-navigation-z-index, 40)")
   end
 
+  # ページネーションを固定ページヘッダー下部中央に配置するCSSがあることを静的に確認する
+  it "places pagination at the bottom center of the sticky page header" do
+    expect(components_source).to include(".main-content__header-pagination")
+    expect(components_source).to include("inset-block-end: 0.5rem")
+    expect(components_source).to include("inset-inline-start: 50%")
+    expect(components_source).to include("transform: translateX(-50%)")
+    expect(components_source).to include("justify-content: center")
+    expect(components_source).to include("pointer-events: none")
+    expect(components_source).to include("pointer-events: auto")
+    expect(components_source).to include("--admin-sticky-page-header-height: 8rem")
+    expect(components_source).to include("--admin-sticky-page-header-height: 9rem")
+    expect(components_source).to include(".main-content__header:has(> .main-content__header-pagination)")
+    expect(components_source).to include("white-space: nowrap")
+    expect(components_source).to include("inline-size: auto")
+  end
+
   # 固定列リサイズ後にCSS変数のleftと幅を再計算する処理があることを静的に確認する
   it "recalculates CSS sticky-left offsets after applying column widths" do
     expect(javascript_source).to include("function refreshCssStickyLeftColumns(table)")

data/spec/yummy_guide/administrate/copy_cell_asset_spec.rb

@@ -24,4 +24,23 @@ RSpec.describe "copy cell assets" do
   it "keeps attribute copy controls visible" do
     expect(components_source).to match(/\.attribute-data \.admin-copy-cell__link,\s*\.attribute-data \.admin-copy-cell__button:not\(\[disabled\]\) \{\s*opacity: 1;/m)
   end
+
+  # フィルター操作アイコンをGem内のSVG assetからCSS maskで描画することを静的に確認する
+  it "uses bundled SVG assets for filter control icons" do
+    expect(components_source).to include('mask: image-url("yummy_guide_administrate/icon-eraser.svg") center / contain no-repeat;')
+    expect(components_source).to include('mask: image-url("yummy_guide_administrate/icon-check-square.svg") center / contain no-repeat;')
+  end
+
+  # フィルター操作ボタンのセルが項目内で上下中央に配置されることを静的に確認する
+  it "keeps filter control cells vertically centered" do
+    expect(components_source).to include(".filter-form .filter_table td.filter-table__clear,\n.yummy-guide-administrate-filter-form .filter_table td.filter-table__clear {\n  vertical-align: middle;")
+    expect(components_source).to include(".filter-checkbox-group__actions.filter-checkbox-group__actions--clear-cell {\n  flex-direction: column;\n  flex-wrap: nowrap;")
+  end
+
+  # フィルターの項目名・入力フォーム・操作ボタンの列間を4pxに保ち、項目名を折り返せることを静的に確認する
+  it "keeps filter table columns spaced and labels wrappable" do
+    expect(components_source.scan(/border-spacing: 4px 0;/).size).to be >= 2
+    expect(components_source.scan(/overflow-wrap: anywhere;/).size).to be >= 2
+    expect(components_source).to include(".filter-table__clear {\n  width: 1%;\n  padding-left: 0;")
+  end
 end

data/spec/yummy_guide/administrate/filter_controls_helper_spec.rb

@@ -54,6 +54,10 @@ RSpec.describe YummyGuide::Administrate::FilterControlsHelper do
       expect(close_button["aria-label"]).to eq("Close")
       expect(close_button["type"]).to eq("button")
       expect(document.at_css("form.filter-form")["action"]).to eq("/admin/resources")
+      expect(document.at_css('[data-admin-filter-overlay="true"]')).to be_present
+      clear_button = document.at_css('button.filter-field-clear-button[data-behavior="filter-field-clear"]')
+      expect(clear_button).to be_present
+      expect(clear_button.at_css("span.filter-control-icon.filter-control-icon--eraser[data-filter-icon='eraser'][aria-hidden='true']")).to be_present
       expect(document.at_css('input[name="search_options[keyword]"]')["value"]).to eq("tokyo")
       expect(document.at_css('select[name="search_options[status]"] option[selected]')["value"]).to eq("closed")
     end
@@ -81,11 +85,42 @@ RSpec.describe YummyGuide::Administrate::FilterControlsHelper do
       expect(controls.at_css("#reserv-filter-options > a.button").text).to eq("Filter")
       expect(controls.at_css("#reserv-filter-options > form")).to be_nil
       expect(modal_id).to eq("admin-filter-modal-1")
-      expect(modals.at_css("##{modal_id}.admin-filter-modal-root > .modal_overlay")).to be_present
+      expect(modals.at_css("##{modal_id}.admin-filter-modal-root > .modal_overlay[data-admin-filter-overlay='true']")).to be_present
       expect(modals.at_css("##{modal_id} > form.filter-form")["action"]).to eq("/admin/resources")
       expect(modals.at_css('input[name="search_options[keyword]"]')["value"]).to eq("tokyo")
     end
 
+    # checkbox group の一括操作ボタンがアプリ側 helper なしで描画されることを確認する
+    it "renders built-in checkbox group action controls" do
+      dashboard = Class.new
+      dashboard.const_set(
+        :FILTER_ATTRIBUTES,
+        {
+          statuses: YummyGuide::Administrate::Filters::CheckboxGroup.with_options(
+            label: "Status",
+            collection: [["Open", "open"], ["Closed", "closed"]],
+            group: "resource-statuses"
+          )
+        }.freeze
+      )
+
+      html = helper_host.admin_filter_controls(
+        dashboard: dashboard,
+        path: "/admin/resources",
+        search_options: { statuses: ["open"] }
+      )
+      document = fragment(html)
+
+      select_all_button = document.at_css('button.filter-icon-button[data-behavior="checkbox-group-select-all"][data-target="resource-statuses"]')
+      clear_all_button = document.at_css('button.filter-icon-button[data-behavior="checkbox-group-clear-all"][data-target="resource-statuses"]')
+
+      expect(document.at_css('input[type="checkbox"][name="search_options[statuses][]"][value="open"]')["checked"]).to eq("checked")
+      expect(select_all_button["aria-label"]).to eq("Select all")
+      expect(select_all_button.at_css("span.filter-control-icon.filter-control-icon--check-square[data-filter-icon='check-square'][aria-hidden='true']")).to be_present
+      expect(clear_all_button["aria-label"]).to eq("Clear all")
+      expect(clear_all_button.at_css("span.filter-control-icon.filter-control-icon--eraser[data-filter-icon='eraser'][aria-hidden='true']")).to be_present
+    end
+
     # boolean radio group が未指定・true・falseを横並びで描画し、ラベルと選択状態を反映することを確認する
     it "renders boolean radio group controls with custom labels" do
       dashboard = Class.new

data/spec/yummy_guide/administrate/filters_spec.rb

@@ -1,6 +1,7 @@
 # frozen_string_literal: true
 
 require "spec_helper"
+require "nokogiri"
 
 RSpec.describe YummyGuide::Administrate::Filters do
   describe YummyGuide::Administrate::Filters::Resolver do
@@ -32,4 +33,22 @@ RSpec.describe YummyGuide::Administrate::Filters do
       expect(field.visible?(view_context, {})).to be(false)
     end
   end
+
+  describe YummyGuide::Administrate::Filters::CheckboxGroup do
+    # current_values に値がない場合は default 配列を選択状態として利用することを確認する
+    it "uses default values when current values do not include the field" do
+      view_context = ActionController::Base.helpers
+      form = double("form")
+      field = described_class.with_options(
+        collection: [["Open", "open"], ["Closed", "closed"]],
+        default: ["closed"]
+      ).with_name(:statuses)
+
+      html = field.send(:input_cell, view_context, form, :search_options, {}, {})
+      document = Nokogiri::HTML.fragment(html)
+
+      expect(document.at_css('input[value="closed"]')["checked"]).to eq("checked")
+      expect(document.at_css('input[value="open"]')["checked"]).to be_nil
+    end
+  end
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: yummy-guide-generic-administrate
 version: !ruby/object:Gem::Version
-  version: 0.8.13
+  version: 0.8.15
 platform: ruby
 authors:
 - akatsuki-kk
 autorequire:
 bindir: bin
 cert_chain: []
-date: 2026-06-22 00:00:00.000000000 Z
+date: 2026-07-01 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: administrate
@@ -89,7 +89,9 @@ files:
 - Gemfile
 - README.md
 - Rakefile
+- app/assets/images/yummy_guide_administrate/icon-check-square.svg
 - app/assets/images/yummy_guide_administrate/icon-copy.svg
+- app/assets/images/yummy_guide_administrate/icon-eraser.svg
 - app/assets/javascripts/yummy_guide_administrate/clipboards.js
 - app/assets/javascripts/yummy_guide_administrate/column_resizer.js
 - app/assets/javascripts/yummy_guide_administrate/datetime_input.js
@@ -119,6 +121,9 @@ files:
 - app/helpers/yummy_guide/administrate/filter_form_helper.rb
 - app/helpers/yummy_guide/administrate/number_input_helper.rb
 - app/helpers/yummy_guide/administrate/tooltip_helper.rb
+- app/views/administrate/application/_header_pagination.html.erb
+- app/views/administrate/application/_index_header.html.erb
+- app/views/administrate/application/index.html.erb
 - app/views/fields/number/_form.html.erb
 - app/views/fields/yummy_guide_administrate/area/picture/_form.html.erb
 - app/views/fields/yummy_guide_administrate/area/picture/_index.html.erb