@unabridged/midwest 0.19.0 → 0.19.2

package/README.md

@@ -3,7 +3,7 @@
 [![Rails Tests](https://github.com/unabridged/midwest/actions/workflows/rails-tests.yml/badge.svg?branch=main)](https://github.com/unabridged/midwest/actions/workflows/rails-tests.yml)
 [![Bridgetown Tests](https://github.com/unabridged/midwest/actions/workflows/bridgetown-tests.yml/badge.svg?branch=main)](https://github.com/unabridged/midwest/actions/workflows/bridgetown-tests.yml)
 [![Ruby](https://img.shields.io/badge/Ruby-3.3_%7C_3.4-CC342D?logo=ruby&logoColor=white)](https://github.com/unabridged/midwest/actions/workflows/ci.yml)
-[![Coverage](https://img.shields.io/badge/coverage-96%25-brightgreen)](https://github.com/unabridged/midwest/actions/workflows/ci.yml)
+[![Coverage](https://img.shields.io/badge/coverage-97%25-brightgreen)](https://github.com/unabridged/midwest/actions/workflows/ci.yml)
 
 Midwest Component Library is an implementation of the Midwest Design System using [ViewComponent](https://github.com/github/view_component).
 

package/app/assets/javascript/midwest/index.ts

@@ -24,6 +24,7 @@ import Notification from '../../../components/midwest/notification_component/not
 import HorizontalScroll from '../../../components/midwest/horizontal_scroll_component/horizontal_scroll_component_controller'
 import Table from '../../../components/midwest/table_component/table_component_controller'
 import LoadMore from '../../../components/midwest/table_component/load_more_controller'
+import Pagination from '../../../components/midwest/pagination_component/pagination_component_controller'
 /* IMPORTS */
 
 export { Card, Banner, CountdownTimer, Chart }
@@ -55,5 +56,6 @@ export function registerMidwestControllers (application: any) {
   application.register('midwest-horizontal-scroll', HorizontalScroll)
   application.register('midwest-table', Table)
   application.register('midwest-load-more', LoadMore)
+  application.register('midwest-pagination', Pagination)
   /* EXPORTS */
 }

package/app/assets/javascript/midwest.js

@@ -4784,6 +4784,25 @@ class Table extends Controller {
       cb.checked = checked;
     });
   }
+  navigateRow(event) {
+    const target = event.target;
+    if (target.closest('a, button, input, select, textarea, [role="button"]'))
+      return;
+    const row = event.currentTarget;
+    const href = row.dataset.href;
+    if (!href)
+      return;
+    if (event.metaKey || event.ctrlKey) {
+      window.open(href, "_blank");
+    } else {
+      const Turbo = window.Turbo;
+      if (Turbo?.visit) {
+        Turbo.visit(href);
+      } else {
+        window.location.href = href;
+      }
+    }
+  }
   updateSelectAll() {
     if (!this.hasSelectAllTarget)
       return;
@@ -4858,6 +4877,54 @@ class LoadMore extends Controller {
   }
 }
 
+class Pagination extends Controller {
+  static targets = ["jumpInput"];
+  static values = { urlTemplate: String, turboFrameId: String };
+  debounceTimer = null;
+  // Intercepts the jump-to-page form submit and navigates to the resolved URL.
+  jump(event) {
+    event.preventDefault();
+    if (!this.hasJumpInputTarget)
+      return;
+    const page = parseInt(this.jumpInputTarget.value, 10);
+    if (!isNaN(page) && page >= 1) {
+      this.visitUrl(this.urlTemplateValue.replace("__PAGE__", String(page)));
+    }
+  }
+  // Debounced handler for the `incremental` input — navigates 400 ms after the
+  // user stops typing, and only when the value is within the valid page range.
+  jumpIncremental() {
+    if (this.debounceTimer)
+      clearTimeout(this.debounceTimer);
+    this.debounceTimer = setTimeout(() => {
+      if (!this.hasJumpInputTarget)
+        return;
+      const input = this.jumpInputTarget;
+      const page = parseInt(input.value, 10);
+      const max = parseInt(input.max, 10);
+      if (!isNaN(page) && page >= 1 && (!max || page <= max)) {
+        this.visitUrl(this.urlTemplateValue.replace("__PAGE__", String(page)));
+      }
+    }, 400);
+  }
+  // Navigates to the URL selected in the per-page <select> element.
+  navigate(event) {
+    const select = event.target;
+    const href = select.value;
+    if (href && href !== "#") {
+      this.visitUrl(href);
+    }
+  }
+  // Navigates to a URL via Turbo visit, updating the browser URL.
+  visitUrl(url) {
+    if (window.Turbo) {
+      window.Turbo.visit(url);
+    } else {
+      window.location.href = url;
+    }
+  }
+}
+
 function registerMidwestControllers(application) {
   application.register("midwest-card", Card);
   application.register("midwest-banner", Banner);
@@ -4885,6 +4952,7 @@ function registerMidwestControllers(application) {
   application.register("midwest-horizontal-scroll", HorizontalScroll);
   application.register("midwest-table", Table);
   application.register("midwest-load-more", LoadMore);
+  application.register("midwest-pagination", Pagination);
 }
 
 export { Banner, Card, Chart, CountdownTimer, registerMidwestControllers };