@unabridged/midwest 0.23.4 → 0.24.3

package/dist/javascript/collection/app/components/midwest/table_component/load_more_controller.js.map

@@ -1 +1 @@
-{"version":3,"file":"load_more_controller.js","sources":["../../../../../../../app/components/midwest/table_component/load_more_controller.ts"],"sourcesContent":["import { Controller } from '@hotwired/stimulus'\n\n// Enables infinite scroll on a `midwest-table` by observing a sentinel <tr>\n// element at the bottom of the tbody.  When the sentinel scrolls near the\n// viewport, this controller fetches the next-page URL, extracts the new <tr>\n// elements from the returned HTML, and appends them (plus the new sentinel,\n// if present) to the current tbody — replacing itself in the process.\n//\n// Values\n//   url      — URL for the next page (built by TablePresenter#next_page_url)\n//   tbodyId  — DOM id of the <tbody> to append rows into\nexport default class LoadMore extends Controller<HTMLTableRowElement> {\n  static values = {\n    url:     String,\n    tbodyId: String,\n  }\n\n  declare urlValue:     string\n  declare tbodyIdValue: string\n\n  private observer: IntersectionObserver | null = null\n  private loading = false\n\n  connect () {\n    // No URL means this is the last page — nothing to load.\n    if (!this.urlValue) return\n\n    this.observer = new IntersectionObserver(\n      (entries) => { if (entries[0].isIntersecting) this.load() },\n      // Start fetching 300px before the sentinel enters the viewport so rows\n      // appear before the user actually reaches the bottom.\n      { rootMargin: '0px 0px 300px 0px' }\n    )\n    this.observer.observe(this.element)\n  }\n\n  disconnect () {\n    this.observer?.disconnect()\n    this.observer = null\n  }\n\n  private async load () {\n    if (this.loading) return\n    this.loading = true\n    this.observer?.disconnect()\n\n    try {\n      const response = await fetch(this.urlValue, {\n        headers: {\n          Accept:            'text/html',\n          'X-Requested-With': 'XMLHttpRequest',\n        },\n        credentials: 'same-origin',\n      })\n\n      if (!response.ok) return\n\n      const html    = await response.text()\n      const doc     = new DOMParser().parseFromString(html, 'text/html')\n      const tbody   = document.getElementById(this.tbodyIdValue)\n      const newRows = Array.from(\n        doc.querySelectorAll<HTMLTableRowElement>('.midwest-table-body tr')\n      )\n\n      if (!tbody || newRows.length === 0) return\n\n      // Remove the current sentinel before appending new rows so its position\n      // doesn't shift the table layout during the DOM update.\n      this.element.remove()\n\n      // Import each row (including any new sentinel for the next page) into the\n      // current document and append it to the live tbody.\n      newRows.forEach(row => tbody.appendChild(document.importNode(row, true)))\n    } catch {\n      // Silently fail — the table remains fully functional, just without\n      // auto-loading more rows.\n      this.loading = false\n    }\n  }\n}\n"],"names":[],"mappings":";;AAWA,MAAqB,iBAAiB,UAAgC,CAAA;AAAA,EACpE,OAAO,MAAS,GAAA;AAAA,IACd,GAAS,EAAA,MAAA;AAAA,IACT,OAAS,EAAA,MAAA;AAAA,GACX,CAAA;AAAA,EAKQ,QAAwC,GAAA,IAAA,CAAA;AAAA,EACxC,OAAU,GAAA,KAAA,CAAA;AAAA,EAElB,OAAW,GAAA;AAET,IAAA,IAAI,CAAC,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AAEpB,IAAA,IAAA,CAAK,WAAW,IAAI,oBAAA;AAAA,MAClB,CAAC,OAAY,KAAA;AAAE,QAAI,IAAA,OAAA,CAAQ,CAAC,CAAE,CAAA,cAAA;AAAgB,UAAA,IAAA,CAAK,IAAK,EAAA,CAAA;AAAA,OAAE;AAAA;AAAA;AAAA,MAG1D,EAAE,YAAY,mBAAoB,EAAA;AAAA,KACpC,CAAA;AACA,IAAK,IAAA,CAAA,QAAA,CAAS,OAAQ,CAAA,IAAA,CAAK,OAAO,CAAA,CAAA;AAAA,GACpC;AAAA,EAEA,UAAc,GAAA;AACZ,IAAA,IAAA,CAAK,UAAU,UAAW,EAAA,CAAA;AAC1B,IAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAA;AAAA,GAClB;AAAA,EAEA,MAAc,IAAQ,GAAA;AACpB,IAAA,IAAI,IAAK,CAAA,OAAA;AAAS,MAAA,OAAA;AAClB,IAAA,IAAA,CAAK,OAAU,GAAA,IAAA,CAAA;AACf,IAAA,IAAA,CAAK,UAAU,UAAW,EAAA,CAAA;AAE1B,IAAI,IAAA;AACF,MAAA,MAAM,QAAW,GAAA,MAAM,KAAM,CAAA,IAAA,CAAK,QAAU,EAAA;AAAA,QAC1C,OAAS,EAAA;AAAA,UACP,MAAmB,EAAA,WAAA;AAAA,UACnB,kBAAoB,EAAA,gBAAA;AAAA,SACtB;AAAA,QACA,WAAa,EAAA,aAAA;AAAA,OACd,CAAA,CAAA;AAED,MAAA,IAAI,CAAC,QAAS,CAAA,EAAA;AAAI,QAAA,OAAA;AAElB,MAAM,MAAA,IAAA,GAAU,MAAM,QAAA,CAAS,IAAK,EAAA,CAAA;AACpC,MAAA,MAAM,MAAU,IAAI,SAAA,EAAY,CAAA,eAAA,CAAgB,MAAM,WAAW,CAAA,CAAA;AACjE,MAAA,MAAM,KAAU,GAAA,QAAA,CAAS,cAAe,CAAA,IAAA,CAAK,YAAY,CAAA,CAAA;AACzD,MAAA,MAAM,UAAU,KAAM,CAAA,IAAA;AAAA,QACpB,GAAA,CAAI,iBAAsC,wBAAwB,CAAA;AAAA,OACpE,CAAA;AAEA,MAAI,IAAA,CAAC,KAAS,IAAA,OAAA,CAAQ,MAAW,KAAA,CAAA;AAAG,QAAA,OAAA;AAIpC,MAAA,IAAA,CAAK,QAAQ,MAAO,EAAA,CAAA;AAIpB,MAAQ,OAAA,CAAA,OAAA,CAAQ,SAAO,KAAM,CAAA,WAAA,CAAY,SAAS,UAAW,CAAA,GAAA,EAAK,IAAI,CAAC,CAAC,CAAA,CAAA;AAAA,KACxE,CAAA,MAAA;AAGA,MAAA,IAAA,CAAK,OAAU,GAAA,KAAA,CAAA;AAAA,KACjB;AAAA,GACF;AACF;;;;"}
+{"version":3,"file":"load_more_controller.js","sources":["../../../../../../../app/components/midwest/table_component/load_more_controller.ts"],"sourcesContent":["import { Controller } from '@hotwired/stimulus'\nimport { observeViewport } from '../../../assets/javascript/midwest/viewport_observer'\n\n// Enables infinite scroll on a `midwest-table` by observing a sentinel <tr>\n// element at the bottom of the tbody.  When the sentinel scrolls near the\n// viewport, this controller fetches the next-page URL, extracts the new <tr>\n// elements from the returned HTML, and appends them (plus the new sentinel,\n// if present) to the current tbody — replacing itself in the process.\n//\n// Values\n//   url      — URL for the next page (built by TablePresenter#next_page_url)\n//   tbodyId  — DOM id of the <tbody> to append rows into\nexport default class LoadMore extends Controller<HTMLTableRowElement> {\n  static values = {\n    url:     String,\n    tbodyId: String,\n  }\n\n  declare urlValue:     string\n  declare tbodyIdValue: string\n\n  private teardown: (() => void) | null = null\n  private loading = false\n\n  connect () {\n    // No URL means this is the last page — nothing to load.\n    if (!this.urlValue) return\n\n    // The sentinel loads exactly once, then removes itself and is replaced by\n    // the next page's sentinel — so `once` matches the lifecycle. `rootMargin`\n    // starts the fetch 300px early so rows appear before the user hits bottom.\n    this.teardown = observeViewport(this.element, {\n      rootMargin: '0px 0px 300px 0px',\n      once: true,\n      onEnter: () => this.load(),\n    })\n  }\n\n  disconnect () {\n    this.teardown?.()\n    this.teardown = null\n  }\n\n  private async load () {\n    if (this.loading) return\n    this.loading = true\n    this.teardown?.()\n\n    try {\n      const response = await fetch(this.urlValue, {\n        headers: {\n          Accept:            'text/html',\n          'X-Requested-With': 'XMLHttpRequest',\n        },\n        credentials: 'same-origin',\n      })\n\n      if (!response.ok) return\n\n      const html    = await response.text()\n      const doc     = new DOMParser().parseFromString(html, 'text/html')\n      const tbody   = document.getElementById(this.tbodyIdValue)\n      const newRows = Array.from(\n        doc.querySelectorAll<HTMLTableRowElement>('.midwest-table-body tr')\n      )\n\n      if (!tbody || newRows.length === 0) return\n\n      // Remove the current sentinel before appending new rows so its position\n      // doesn't shift the table layout during the DOM update.\n      this.element.remove()\n\n      // Import each row (including any new sentinel for the next page) into the\n      // current document and append it to the live tbody.\n      newRows.forEach(row => tbody.appendChild(document.importNode(row, true)))\n    } catch {\n      // Silently fail — the table remains fully functional, just without\n      // auto-loading more rows.\n      this.loading = false\n    }\n  }\n}\n"],"names":[],"mappings":";;;AAYA,MAAqB,iBAAiB,UAAgC,CAAA;AAAA,EACpE,OAAO,MAAS,GAAA;AAAA,IACd,GAAS,EAAA,MAAA;AAAA,IACT,OAAS,EAAA,MAAA;AAAA,GACX,CAAA;AAAA,EAKQ,QAAgC,GAAA,IAAA,CAAA;AAAA,EAChC,OAAU,GAAA,KAAA,CAAA;AAAA,EAElB,OAAW,GAAA;AAET,IAAA,IAAI,CAAC,IAAK,CAAA,QAAA;AAAU,MAAA,OAAA;AAKpB,IAAK,IAAA,CAAA,QAAA,GAAW,eAAgB,CAAA,IAAA,CAAK,OAAS,EAAA;AAAA,MAC5C,UAAY,EAAA,mBAAA;AAAA,MACZ,IAAM,EAAA,IAAA;AAAA,MACN,OAAA,EAAS,MAAM,IAAA,CAAK,IAAK,EAAA;AAAA,KAC1B,CAAA,CAAA;AAAA,GACH;AAAA,EAEA,UAAc,GAAA;AACZ,IAAA,IAAA,CAAK,QAAW,IAAA,CAAA;AAChB,IAAA,IAAA,CAAK,QAAW,GAAA,IAAA,CAAA;AAAA,GAClB;AAAA,EAEA,MAAc,IAAQ,GAAA;AACpB,IAAA,IAAI,IAAK,CAAA,OAAA;AAAS,MAAA,OAAA;AAClB,IAAA,IAAA,CAAK,OAAU,GAAA,IAAA,CAAA;AACf,IAAA,IAAA,CAAK,QAAW,IAAA,CAAA;AAEhB,IAAI,IAAA;AACF,MAAA,MAAM,QAAW,GAAA,MAAM,KAAM,CAAA,IAAA,CAAK,QAAU,EAAA;AAAA,QAC1C,OAAS,EAAA;AAAA,UACP,MAAmB,EAAA,WAAA;AAAA,UACnB,kBAAoB,EAAA,gBAAA;AAAA,SACtB;AAAA,QACA,WAAa,EAAA,aAAA;AAAA,OACd,CAAA,CAAA;AAED,MAAA,IAAI,CAAC,QAAS,CAAA,EAAA;AAAI,QAAA,OAAA;AAElB,MAAM,MAAA,IAAA,GAAU,MAAM,QAAA,CAAS,IAAK,EAAA,CAAA;AACpC,MAAA,MAAM,MAAU,IAAI,SAAA,EAAY,CAAA,eAAA,CAAgB,MAAM,WAAW,CAAA,CAAA;AACjE,MAAA,MAAM,KAAU,GAAA,QAAA,CAAS,cAAe,CAAA,IAAA,CAAK,YAAY,CAAA,CAAA;AACzD,MAAA,MAAM,UAAU,KAAM,CAAA,IAAA;AAAA,QACpB,GAAA,CAAI,iBAAsC,wBAAwB,CAAA;AAAA,OACpE,CAAA;AAEA,MAAI,IAAA,CAAC,KAAS,IAAA,OAAA,CAAQ,MAAW,KAAA,CAAA;AAAG,QAAA,OAAA;AAIpC,MAAA,IAAA,CAAK,QAAQ,MAAO,EAAA,CAAA;AAIpB,MAAQ,OAAA,CAAA,OAAA,CAAQ,SAAO,KAAM,CAAA,WAAA,CAAY,SAAS,UAAW,CAAA,GAAA,EAAK,IAAI,CAAC,CAAC,CAAA,CAAA;AAAA,KACxE,CAAA,MAAA;AAGA,MAAA,IAAA,CAAK,OAAU,GAAA,KAAA,CAAA;AAAA,KACjB;AAAA,GACF;AACF;;;;"}