@nasa-terra/components 0.0.193 → 0.0.195

package/cdn/chunks/chunk.TRYBS3TL.js

@@ -0,0 +1,912 @@
+import {
+  TerraSlider
+} from "./chunk.6UL4YIIE.js";
+import {
+  TerraMenuItem
+} from "./chunk.TQUM32MX.js";
+import {
+  TerraMenu
+} from "./chunk.LCG6CS5W.js";
+import {
+  TerraDatePicker
+} from "./chunk.4ZKXL6QQ.js";
+import {
+  data_access_styles_default
+} from "./chunk.IQKJGOOA.js";
+import {
+  CollectionController,
+  queryCmrGranules
+} from "./chunk.JXSV4XD4.js";
+import {
+  TerraSpatialPicker
+} from "./chunk.B3L3TUDC.js";
+import {
+  TerraDropdown
+} from "./chunk.TXITE2FV.js";
+import {
+  TerraDataGrid
+} from "./chunk.OENYLZWT.js";
+import {
+  DataAccessService
+} from "./chunk.D3RTCDY7.js";
+import {
+  QueryClientMixin
+} from "./chunk.DOUWGQFH.js";
+import {
+  TerraLoader
+} from "./chunk.FJOMHPCP.js";
+import {
+  e,
+  n as n2
+} from "./chunk.APOEQA6N.js";
+import {
+  TerraButton
+} from "./chunk.ZHO3MDDD.js";
+import {
+  TerraAlert
+} from "./chunk.SQOILSEV.js";
+import {
+  TerraIcon
+} from "./chunk.YL6WAIUW.js";
+import {
+  watch
+} from "./chunk.MPVZOQYA.js";
+import {
+  TerraElement,
+  component_styles_default,
+  n,
+  r
+} from "./chunk.MUSV5WD7.js";
+import {
+  getBasePath
+} from "./chunk.ZQVMOVOT.js";
+import {
+  A,
+  b
+} from "./chunk.RRCYT4LP.js";
+import {
+  __decorateClass,
+  __privateAdd,
+  __privateGet,
+  __privateMethod,
+  __privateSet,
+  __spreadProps,
+  __spreadValues,
+  init_buffer,
+  init_dirname,
+  init_process
+} from "./chunk.ZEOVK2FE.js";
+
+// src/components/data-access/data-access.component.ts
+init_dirname();
+init_buffer();
+init_process();
+
+// src/internal/debounce.ts
+init_dirname();
+init_buffer();
+init_process();
+var TIMER_ID_KEY = Symbol();
+var debounce = (delay) => {
+  return (_target, _propertyKey, descriptor) => {
+    const fn = descriptor.value;
+    descriptor.value = function(...args) {
+      clearTimeout(this[TIMER_ID_KEY]);
+      this[TIMER_ID_KEY] = window.setTimeout(() => {
+        fn.apply(this, args);
+      }, delay);
+    };
+  };
+};
+
+// src/apis/types/cmr/umm-g.ts
+init_dirname();
+init_buffer();
+init_process();
+
+// src/components/data-access/data-access.component.ts
+var _boundHandleCloudCoverClickOutside, _collectionController, _gridApi, gridApi_get, _handleCloudCoverClickOutside, handleCloudCoverClickOutside_fn, _initializeGrid, initializeGrid_fn, _handleMapChange, handleMapChange_fn, _handleDateRangeChange, handleDateRangeChange_fn, _getDateRangeButtonText, getDateRangeButtonText_fn, _getSpatialButtonText, getSpatialButtonText_fn, _clearDateRange, clearDateRange_fn, _updateLocation, updateLocation_fn, _toggleCloudCoverPicker, toggleCloudCoverPicker_fn, _clearCloudCoverFilter, clearCloudCoverFilter_fn, _getCloudCoverButtonText, getCloudCoverButtonText_fn, _handleDownloadSelect, handleDownloadSelect_fn, _downloadPythonScript, downloadPythonScript_fn, _downloadEarthdataDownload, downloadEarthdataDownload_fn, _handleCloudCoverChange, handleCloudCoverChange_fn, _updateCloudCover, updateCloudCover_fn, _renderLoadingOverlay, renderLoadingOverlay_fn;
+var TerraDataAccess = class extends QueryClientMixin(TerraElement) {
+  constructor() {
+    super(...arguments);
+    __privateAdd(this, _gridApi);
+    __privateAdd(this, _handleCloudCoverClickOutside);
+    __privateAdd(this, _initializeGrid);
+    __privateAdd(this, _handleMapChange);
+    __privateAdd(this, _handleDateRangeChange);
+    __privateAdd(this, _getDateRangeButtonText);
+    __privateAdd(this, _getSpatialButtonText);
+    // Date picker is now handled by dropdown component
+    __privateAdd(this, _clearDateRange);
+    __privateAdd(this, _updateLocation);
+    __privateAdd(this, _toggleCloudCoverPicker);
+    __privateAdd(this, _clearCloudCoverFilter);
+    __privateAdd(this, _getCloudCoverButtonText);
+    __privateAdd(this, _handleDownloadSelect);
+    __privateAdd(this, _downloadPythonScript);
+    __privateAdd(this, _downloadEarthdataDownload);
+    __privateAdd(this, _handleCloudCoverChange);
+    __privateAdd(this, _updateCloudCover);
+    __privateAdd(this, _renderLoadingOverlay);
+    this.service = new DataAccessService();
+    this.searchParams = {
+      pageSize: 50,
+      offset: 0,
+      search: "",
+      sortBy: "title",
+      sortDirection: "asc",
+      cloudCover: { min: void 0, max: void 0 }
+    };
+    this.loading = false;
+    this.totalGranules = 0;
+    this.estimatedSize = null;
+    this.cloudCoverRange = null;
+    this._gridInitialized = false;
+    this.cloudCoverPickerOpen = false;
+    this.datePickerRef = e();
+    this.spatialPickerRef = e();
+    this.cloudCoverSliderRef = e();
+    this.gridRef = e();
+    __privateAdd(this, _boundHandleCloudCoverClickOutside, null);
+    __privateAdd(this, _collectionController, new CollectionController(this, {
+      getCollectionEntryId: () => this.collectionEntryId,
+      getBearerToken: () => this.bearerToken
+    }));
+  }
+  handleShortNameOrVersionChange() {
+    if (this.shortName && this.version && !this.collectionEntryId) {
+      this.collectionEntryId = `${this.shortName}_${this.version}`;
+    }
+  }
+  handleCollectionChange() {
+    if (this._gridInitialized && this.isVisible) {
+      this._gridInitialized = false;
+      this.firstVisible();
+    }
+  }
+  // ─── Delegated from CollectionController ───────────────────────────────────
+  get isSubDaily() {
+    return __privateGet(this, _collectionController).isSubDaily;
+  }
+  get granuleMinDate() {
+    var _a, _b;
+    const minDateStr = (_b = (_a = __privateGet(this, _collectionController).sampling) == null ? void 0 : _a.data) == null ? void 0 : _b.minDate;
+    return minDateStr ? new Date(minDateStr) : null;
+  }
+  get granuleMaxDate() {
+    var _a, _b;
+    const maxDateStr = (_b = (_a = __privateGet(this, _collectionController).sampling) == null ? void 0 : _a.data) == null ? void 0 : _b.maxDate;
+    return maxDateStr ? new Date(maxDateStr) : null;
+  }
+  get spatialConstraints() {
+    return __privateGet(this, _collectionController).spatialConstraints;
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    if (__privateGet(this, _boundHandleCloudCoverClickOutside)) {
+      document.removeEventListener(
+        "click",
+        __privateGet(this, _boundHandleCloudCoverClickOutside)
+      );
+      __privateSet(this, _boundHandleCloudCoverClickOutside, null);
+    }
+  }
+  async firstVisible() {
+    __privateMethod(this, _initializeGrid, initializeGrid_fn).call(this);
+  }
+  handleSearch(search) {
+    var _a;
+    this.searchParams = __spreadProps(__spreadValues({}, this.searchParams), {
+      search
+    });
+    (_a = __privateGet(this, _gridApi, gridApi_get)) == null ? void 0 : _a.purgeInfiniteCache();
+  }
+  render() {
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m;
+    return b`
+            <div class="filters-compact">
+                <div class="search-row">
+                    <div class="search-icon" aria-hidden="true">🔍</div>
+                    <input
+                        type="text"
+                        class="search-input"
+                        placeholder="Search file names"
+                        .value=${(_a = this.searchParams.search) != null ? _a : ""}
+                        @input=${(event) => {
+      this.handleSearch(
+        event.target.value
+      );
+    }}
+                    />
+                </div>
+
+                <div class="toggle-row">
+                    <terra-dropdown>
+                        <button
+                            slot="trigger"
+                            class="filter-btn ${this.searchParams.startDate && this.searchParams.endDate ? "active" : ""}"
+                        >
+                            <terra-icon
+                                name="outline-calendar"
+                                library="heroicons"
+                                font-size="18px"
+                            ></terra-icon>
+                            <span>${__privateMethod(this, _getDateRangeButtonText, getDateRangeButtonText_fn).call(this)}</span>
+                            ${this.searchParams.startDate && this.searchParams.endDate ? b`
+                                      <button
+                                          class="clear-badge"
+                                          @click=${(e2) => {
+      e2.stopPropagation();
+      __privateMethod(this, _clearDateRange, clearDateRange_fn).call(this);
+    }}
+                                          aria-label="Clear date range"
+                                      >
+                                          ×
+                                      </button>
+                                  ` : A}
+                        </button>
+
+                        <div class="datepicker-container">
+                            <terra-date-picker
+                                ${n2(this.datePickerRef)}
+                                range
+                                ?enable-time=${this.isSubDaily}
+                                show-presets
+                                split-inputs
+                                inline
+                                .startDate=${this.searchParams.startDate}
+                                .endDate=${this.searchParams.endDate}
+                                .startPlaceholder=${this.isSubDaily ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD"}
+                                .endPlaceholder=${this.isSubDaily ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD"}
+                                .minDate=${this.granuleMinDate}
+                                .maxDate=${this.granuleMaxDate}
+                                @terra-date-range-change=${__privateMethod(this, _handleDateRangeChange, handleDateRangeChange_fn)}
+                            >
+                                ${this.granuleMinDate && this.granuleMaxDate ? b` <p
+                                          slot="additional-text"
+                                          class="available-range"
+                                      >
+                                          <strong>Available Range:</strong>
+                                          ${this.service.formatAvailableRangeDate(
+      this.granuleMinDate,
+      this.isSubDaily
+    )}
+                                          -
+                                          ${this.service.formatAvailableRangeDate(
+      this.granuleMaxDate,
+      this.isSubDaily
+    )}
+                                      </p>` : A}
+                            </terra-date-picker>
+                        </div>
+                    </terra-dropdown>
+
+                    <terra-dropdown placement="bottom-start" distance="4" hoist>
+                        <div slot="trigger" class="filter">
+                            <button
+                                class="filter-btn ${this.searchParams.location ? "active" : ""}"
+                            >
+                                <terra-icon
+                                    name="outline-globe-alt"
+                                    library="heroicons"
+                                    font-size="18px"
+                                ></terra-icon>
+                                <span>${__privateMethod(this, _getSpatialButtonText, getSpatialButtonText_fn).call(this)}</span>
+                                ${this.searchParams.location ? b`
+                                          <button
+                                              class="clear-badge"
+                                              @click=${(e2) => {
+      e2.stopPropagation();
+      __privateMethod(this, _updateLocation, updateLocation_fn).call(this, null);
+    }}
+                                              aria-label="Clear spatial filter"
+                                          >
+                                              ×
+                                          </button>
+                                      ` : A}
+                            </button>
+                        </div>
+
+                        <div class="spatialpicker-container">
+                            <terra-spatial-picker
+                                ${n2(this.spatialPickerRef)}
+                                hide-label
+                                inline
+                                no-world-wrap
+                                .spatialConstraints=${this.spatialConstraints}
+                                @terra-map-change=${__privateMethod(this, _handleMapChange, handleMapChange_fn)}
+                            >
+                                <p class="available-range" slot="additional-text">
+                                    <strong>Available range:</strong> ${this.spatialConstraints}
+                                </p>
+                            </terra-spatial-picker>
+                        </div>
+                    </terra-dropdown>
+
+                    ${this.cloudCoverRange ? b`
+                              <div class="filter">
+                                  <button
+                                      class="filter-btn ${((_b = this.searchParams.cloudCover) == null ? void 0 : _b.min) !== void 0 && ((_c = this.searchParams.cloudCover) == null ? void 0 : _c.max) !== void 0 ? "active" : ""}"
+                                      @click=${(e2) => {
+      e2.stopPropagation();
+      __privateMethod(this, _toggleCloudCoverPicker, toggleCloudCoverPicker_fn).call(this);
+    }}
+                                  >
+                                      <terra-icon
+                                          name="outline-cloud"
+                                          library="heroicons"
+                                          font-size="18px"
+                                      ></terra-icon>
+                                      <span>${__privateMethod(this, _getCloudCoverButtonText, getCloudCoverButtonText_fn).call(this)}</span>
+                                      ${((_d = this.searchParams.cloudCover) == null ? void 0 : _d.min) !== void 0 && ((_e = this.searchParams.cloudCover) == null ? void 0 : _e.max) !== void 0 ? b`
+                                                <button
+                                                    class="clear-badge"
+                                                    @click=${(e2) => {
+      e2.stopPropagation();
+      __privateMethod(this, _clearCloudCoverFilter, clearCloudCoverFilter_fn).call(this);
+    }}
+                                                    aria-label="Clear cloud cover filter"
+                                                >
+                                                    ×
+                                                </button>
+                                            ` : A}
+                                  </button>
+
+                                  <!-- hidden slider to show when clicking the filter -->
+                                  <div
+                                      class="cloud-cover-dropdown ${this.cloudCoverPickerOpen ? "open" : ""}"
+                                      @click=${(e2) => e2.stopPropagation()}
+                                  >
+                                      <terra-slider
+                                          ${n2(this.cloudCoverSliderRef)}
+                                          mode="range"
+                                          min=${(_f = this.cloudCoverRange) == null ? void 0 : _f.min}
+                                          max=${(_g = this.cloudCoverRange) == null ? void 0 : _g.max}
+                                          start-value=${(_j = (_h = this.searchParams.cloudCover) == null ? void 0 : _h.min) != null ? _j : (_i = this.cloudCoverRange) == null ? void 0 : _i.min}
+                                          end-value=${(_m = (_k = this.searchParams.cloudCover) == null ? void 0 : _k.max) != null ? _m : (_l = this.cloudCoverRange) == null ? void 0 : _l.max}
+                                          step="0.1"
+                                          hide-label
+                                          label="Cloud Cover"
+                                          @terra-slider-change=${__privateMethod(this, _handleCloudCoverChange, handleCloudCoverChange_fn)}
+                                          show-inputs
+                                      ></terra-slider>
+                                  </div>
+                              </div>
+                          ` : A}
+                </div>
+
+                <div class="results-info">
+                    <strong>${this.totalGranules.toLocaleString()}</strong>
+                    files selected
+                    ${this.estimatedSize ? b` (~${this.estimatedSize})` : A}
+                </div>
+            </div>
+
+            <div class="grid-container">
+                <terra-data-grid
+                    ${n2(this.gridRef)}
+                    row-model-type="infinite"
+                    height="350px"
+                ></terra-data-grid>
+
+                ${this.loading ? __privateMethod(this, _renderLoadingOverlay, renderLoadingOverlay_fn).call(this) : A}
+            </div>
+
+            ${this.footerSlot ? b`
+                      <div
+                          slot="footer"
+                          style="margin-top: 15px; display: flex; align-items: center; gap: 8px;"
+                      >
+                          <terra-dropdown @terra-select=${__privateMethod(this, _handleDownloadSelect, handleDownloadSelect_fn)}>
+                              <terra-button slot="trigger" caret>
+                                  Download Options
+                              </terra-button>
+                              <terra-menu>
+                                  <terra-menu-item value="python-script">
+                                      <svg
+                                          slot="prefix"
+                                          viewBox="0 0 128 128"
+                                          width="16"
+                                          height="16"
+                                          style="width: 16px; height: 16px;"
+                                      >
+                                          <path
+                                              fill="currentColor"
+                                              d="M49.33 62h29.159C86.606 62 93 55.132 93 46.981V19.183c0-7.912-6.632-13.856-14.555-15.176-5.014-.835-10.195-1.215-15.187-1.191-4.99.023-9.612.448-13.805 1.191C37.098 6.188 35 10.758 35 19.183V30h29v4H23.776c-8.484 0-15.914 5.108-18.237 14.811-2.681 11.12-2.8 17.919 0 29.53C7.614 86.983 12.569 93 21.054 93H31V79.952C31 70.315 39.428 62 49.33 62zm-1.838-39.11c-3.026 0-5.478-2.479-5.478-5.545 0-3.079 2.451-5.581 5.478-5.581 3.015 0 5.479 2.502 5.479 5.581-.001 3.066-2.465 5.545-5.479 5.545zm74.789 25.921C120.183 40.363 116.178 34 107.682 34H97v12.981C97 57.031 88.206 65 78.489 65H49.33C41.342 65 35 72.326 35 80.326v27.8c0 7.91 6.745 12.564 14.462 14.834 9.242 2.717 17.994 3.208 29.051 0C85.862 120.831 93 116.549 93 108.126V97H64v-4h43.682c8.484 0 11.647-5.776 14.599-14.66 3.047-9.145 2.916-17.799 0-29.529zm-41.955 55.606c3.027 0 5.479 2.479 5.479 5.547 0 3.076-2.451 5.579-5.479 5.579-3.015 0-5.478-2.502-5.478-5.579 0-3.068 2.463-5.547 5.478-5.547z"
+                                          ></path>
+                                      </svg>
+                                      Python Script
+                                  </terra-menu-item>
+                                  <terra-menu-item value="earthdata-download">
+                                      <svg
+                                          slot="prefix"
+                                          viewBox="0 0 64 64"
+                                          fill="none"
+                                          width="16"
+                                          height="16"
+                                          style="width: 16px; height: 16px;"
+                                      >
+                                          <circle
+                                              cx="32"
+                                              cy="32"
+                                              r="28"
+                                              fill="currentColor"
+                                          />
+                                          <path
+                                              d="M32 14v26M32 40l-9-9M32 40l9-9"
+                                              stroke="#fff"
+                                              stroke-width="4"
+                                              stroke-linecap="round"
+                                              stroke-linejoin="round"
+                                              fill="none"
+                                          />
+                                      </svg>
+                                      Earthdata Download
+                                  </terra-menu-item>
+                              </terra-menu>
+                          </terra-dropdown>
+                      </div>
+                  ` : b`
+                      <div
+                          style="margin-top: 15px; display: flex; align-items: center; gap: 8px;"
+                      >
+                          <terra-dropdown @terra-select=${__privateMethod(this, _handleDownloadSelect, handleDownloadSelect_fn)}>
+                              <terra-button slot="trigger" caret>
+                                  Download Options
+                              </terra-button>
+                              <terra-menu>
+                                  <terra-menu-item value="python-script">
+                                      <svg
+                                          slot="prefix"
+                                          viewBox="0 0 128 128"
+                                          width="16"
+                                          height="16"
+                                          style="width: 16px; height: 16px;"
+                                      >
+                                          <path
+                                              fill="currentColor"
+                                              d="M49.33 62h29.159C86.606 62 93 55.132 93 46.981V19.183c0-7.912-6.632-13.856-14.555-15.176-5.014-.835-10.195-1.215-15.187-1.191-4.99.023-9.612.448-13.805 1.191C37.098 6.188 35 10.758 35 19.183V30h29v4H23.776c-8.484 0-15.914 5.108-18.237 14.811-2.681 11.12-2.8 17.919 0 29.53C7.614 86.983 12.569 93 21.054 93H31V79.952C31 70.315 39.428 62 49.33 62zm-1.838-39.11c-3.026 0-5.478-2.479-5.478-5.545 0-3.079 2.451-5.581 5.478-5.581 3.015 0 5.479 2.502 5.479 5.581-.001 3.066-2.465 5.545-5.479 5.545zm74.789 25.921C120.183 40.363 116.178 34 107.682 34H97v12.981C97 57.031 88.206 65 78.489 65H49.33C41.342 65 35 72.326 35 80.326v27.8c0 7.91 6.745 12.564 14.462 14.834 9.242 2.717 17.994 3.208 29.051 0C85.862 120.831 93 116.549 93 108.126V97H64v-4h43.682c8.484 0 11.647-5.776 14.599-14.66 3.047-9.145 2.916-17.799 0-29.529zm-41.955 55.606c3.027 0 5.479 2.479 5.479 5.547 0 3.076-2.451 5.579-5.479 5.579-3.015 0-5.478-2.502-5.478-5.579 0-3.068 2.463-5.547 5.478-5.547z"
+                                          ></path>
+                                      </svg>
+                                      Python Script
+                                  </terra-menu-item>
+                                  <terra-menu-item value="earthdata-download">
+                                      <svg
+                                          slot="prefix"
+                                          viewBox="0 0 64 64"
+                                          fill="none"
+                                          width="16"
+                                          height="16"
+                                          style="width: 16px; height: 16px;"
+                                      >
+                                          <circle
+                                              cx="32"
+                                              cy="32"
+                                              r="28"
+                                              fill="currentColor"
+                                          />
+                                          <path
+                                              d="M32 14v26M32 40l-9-9M32 40l9-9"
+                                              stroke="#fff"
+                                              stroke-width="4"
+                                              stroke-linecap="round"
+                                              stroke-linejoin="round"
+                                              fill="none"
+                                          />
+                                      </svg>
+                                      Earthdata Download
+                                  </terra-menu-item>
+                              </terra-menu>
+                          </terra-dropdown>
+                      </div>
+                  `}
+        `;
+  }
+};
+_boundHandleCloudCoverClickOutside = new WeakMap();
+_collectionController = new WeakMap();
+_gridApi = new WeakSet();
+gridApi_get = function() {
+  var _a;
+  return (_a = this.gridRef.value) == null ? void 0 : _a.getGridApi();
+};
+_handleCloudCoverClickOutside = new WeakSet();
+handleCloudCoverClickOutside_fn = function(event) {
+  var _a;
+  const target = event.target;
+  const dropdown = (_a = this.shadowRoot) == null ? void 0 : _a.querySelector(".cloud-cover-dropdown");
+  const filterContainer = dropdown == null ? void 0 : dropdown.closest(".filter");
+  if (filterContainer == null ? void 0 : filterContainer.contains(target)) {
+    return;
+  }
+  this.cloudCoverPickerOpen = false;
+  if (__privateGet(this, _boundHandleCloudCoverClickOutside)) {
+    document.removeEventListener(
+      "click",
+      __privateGet(this, _boundHandleCloudCoverClickOutside)
+    );
+    __privateSet(this, _boundHandleCloudCoverClickOutside, null);
+  }
+};
+_initializeGrid = new WeakSet();
+initializeGrid_fn = function() {
+  if (!this.gridRef.value || this._gridInitialized) {
+    return;
+  }
+  this._gridInitialized = true;
+  const datasource = {
+    rowCount: void 0,
+    // behave as infinite scroll
+    getRows: async (params) => {
+      var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
+      if (!this.collectionEntryId && !this.searchParams.collectionConceptId) {
+        params.successCallback([], 0);
+        return;
+      }
+      this.loading = true;
+      try {
+        const queryOptions = queryCmrGranules(__spreadProps(__spreadValues({
+          collectionEntryId: this.collectionEntryId
+        }, this.searchParams), {
+          pageSize: params.endRow - params.startRow,
+          offset: params.startRow,
+          sortBy: (_c = (_b = (_a = params.sortModel) == null ? void 0 : _a[0]) == null ? void 0 : _b.colId) != null ? _c : "title",
+          sortDirection: (_f = (_e = (_d = params.sortModel) == null ? void 0 : _d[0]) == null ? void 0 : _e.sort) != null ? _f : "asc"
+        }));
+        const data = await this.queryClient.ensureQueryData(queryOptions);
+        if ((data == null ? void 0 : data.hits) === void 0 || !(data == null ? void 0 : data.items)) {
+          params.failCallback();
+          return;
+        }
+        this.totalGranules = data.hits;
+        const firstGranule = (_h = (_g = __privateGet(this, _collectionController).sampling) == null ? void 0 : _g.data) == null ? void 0 : _h.firstGranule;
+        const lastGranule = (_j = (_i = __privateGet(this, _collectionController).sampling) == null ? void 0 : _i.data) == null ? void 0 : _j.lastGranule;
+        this.estimatedSize = this.service.getEstimatedGranuleSize(
+          firstGranule,
+          lastGranule,
+          this.totalGranules
+        );
+        const lastRow = data.hits <= params.endRow ? data.hits : -1;
+        params.successCallback(data.items, lastRow);
+      } catch (e2) {
+        params.failCallback();
+      } finally {
+        this.loading = false;
+      }
+    }
+  };
+  const columnDefs = [
+    {
+      field: "umm.GranuleUR",
+      headerName: "Title",
+      flex: 3,
+      cellRenderer: (params) => {
+        var _a, _b;
+        if (!params.data) {
+          return "";
+        }
+        const url = (_b = (_a = params.data.umm.RelatedUrls) == null ? void 0 : _a.find(
+          (relatedUrl) => relatedUrl.Type === "GET DATA" /* GetData */
+        )) == null ? void 0 : _b.URL;
+        if (url) {
+          const link = document.createElement("a");
+          link.href = url;
+          link.target = "_blank";
+          link.title = url;
+          link.textContent = params.data.umm.GranuleUR;
+          return link;
+        }
+        const span = document.createElement("span");
+        span.textContent = params.data.umm.GranuleUR;
+        return span;
+      }
+    },
+    {
+      colId: "umm.DataGranule.Size",
+      headerName: "Size (MB)",
+      valueGetter: (g) => {
+        if (!g.data) {
+          return void 0;
+        }
+        return this.service.calculateGranuleSize(g.data.umm, "MB").toFixed(2);
+      }
+    },
+    {
+      field: "umm.TemporalExtent.RangeDateTime.BeginningDateTime",
+      headerName: "Start Date"
+    },
+    {
+      field: "umm.TemporalExtent.RangeDateTime.EndingDateTime",
+      headerName: "End Date"
+    },
+    {
+      field: "umm.CloudCover",
+      hide: true,
+      headerName: "Cloud Cover (%)"
+    }
+  ];
+  this.gridRef.value.rowModelType = "infinite";
+  this.gridRef.value.columnDefs = columnDefs;
+  this.gridRef.value.datasource = datasource;
+  this.gridRef.value.gridOptions = {
+    defaultColDef: {
+      flex: 1,
+      minWidth: 100,
+      sortable: true,
+      sortingOrder: ["desc", "asc", null]
+    },
+    rowBuffer: 25,
+    cacheBlockSize: 50,
+    maxConcurrentDatasourceRequests: 2,
+    infiniteInitialRowCount: 50
+  };
+};
+_handleMapChange = new WeakSet();
+handleMapChange_fn = function(event) {
+  __privateMethod(this, _updateLocation, updateLocation_fn).call(this, event.detail);
+};
+_handleDateRangeChange = new WeakSet();
+handleDateRangeChange_fn = function(event) {
+  var _a;
+  const detail = event.detail;
+  this.searchParams = __spreadProps(__spreadValues({}, this.searchParams), {
+    startDate: detail.startDate || "",
+    endDate: detail.endDate || ""
+  });
+  (_a = __privateGet(this, _gridApi, gridApi_get)) == null ? void 0 : _a.purgeInfiniteCache();
+};
+_getDateRangeButtonText = new WeakSet();
+getDateRangeButtonText_fn = function() {
+  if (this.searchParams.startDate && this.searchParams.endDate) {
+    const formatDate = (dateStr) => {
+      const date = new Date(dateStr);
+      return date.toLocaleDateString("en-US", {
+        month: "short",
+        day: "numeric",
+        year: "numeric",
+        timeZone: "UTC"
+      });
+    };
+    return `${formatDate(this.searchParams.startDate)} \u2013 ${formatDate(this.searchParams.endDate)}`;
+  }
+  return "Date Range";
+};
+_getSpatialButtonText = new WeakSet();
+getSpatialButtonText_fn = function() {
+  if (!this.searchParams.location) {
+    return "Spatial Area";
+  }
+  try {
+    if (this.searchParams.location.type === "point" /* POINT */ && this.searchParams.location.latLng) {
+      const { lat, lng } = this.searchParams.location.latLng;
+      return `${lat.toFixed(2)}, ${lng.toFixed(2)}`;
+    }
+    if (this.searchParams.location.type === "bbox" /* BBOX */ && this.searchParams.location.bounds) {
+      const boundsStr = this.searchParams.location.bounds.toBBoxString();
+      const coords = boundsStr.split(",").map((c) => parseFloat(c.trim()));
+      if (coords.length === 4) {
+        return `${coords[1].toFixed(2)}, ${coords[0].toFixed(2)}, ${coords[3].toFixed(2)}, ${coords[2].toFixed(2)}`;
+      }
+      return boundsStr;
+    }
+    if (this.searchParams.location.type === "bbox" /* BBOX */ && this.searchParams.location.bounds) {
+      return this.searchParams.location.bounds.toBBoxString();
+    }
+  } catch (error) {
+    console.warn("Error formatting spatial selection:", error);
+  }
+  return "Spatial Area";
+};
+_clearDateRange = new WeakSet();
+clearDateRange_fn = function() {
+  var _a;
+  this.searchParams.startDate = "";
+  this.searchParams.endDate = "";
+  (_a = __privateGet(this, _gridApi, gridApi_get)) == null ? void 0 : _a.purgeInfiniteCache();
+};
+_updateLocation = new WeakSet();
+updateLocation_fn = function(location) {
+  var _a;
+  this.searchParams.location = location;
+  (_a = __privateGet(this, _gridApi, gridApi_get)) == null ? void 0 : _a.purgeInfiniteCache();
+};
+_toggleCloudCoverPicker = new WeakSet();
+toggleCloudCoverPicker_fn = function() {
+  setTimeout(() => {
+    this.cloudCoverPickerOpen = !this.cloudCoverPickerOpen;
+    if (this.cloudCoverPickerOpen) {
+      if (!__privateGet(this, _boundHandleCloudCoverClickOutside)) {
+        __privateSet(this, _boundHandleCloudCoverClickOutside, __privateMethod(this, _handleCloudCoverClickOutside, handleCloudCoverClickOutside_fn).bind(this));
+        document.addEventListener(
+          "click",
+          __privateGet(this, _boundHandleCloudCoverClickOutside)
+        );
+      }
+    } else {
+      if (__privateGet(this, _boundHandleCloudCoverClickOutside)) {
+        document.removeEventListener(
+          "click",
+          __privateGet(this, _boundHandleCloudCoverClickOutside)
+        );
+        __privateSet(this, _boundHandleCloudCoverClickOutside, null);
+      }
+    }
+  }, 0);
+};
+_clearCloudCoverFilter = new WeakSet();
+clearCloudCoverFilter_fn = function() {
+  __privateMethod(this, _updateCloudCover, updateCloudCover_fn).call(this, { min: void 0, max: void 0 });
+  this.cloudCoverPickerOpen = false;
+  if (__privateGet(this, _boundHandleCloudCoverClickOutside)) {
+    document.removeEventListener(
+      "click",
+      __privateGet(this, _boundHandleCloudCoverClickOutside)
+    );
+    __privateSet(this, _boundHandleCloudCoverClickOutside, null);
+  }
+};
+_getCloudCoverButtonText = new WeakSet();
+getCloudCoverButtonText_fn = function() {
+  var _a, _b, _c, _d;
+  if (((_a = this.searchParams.cloudCover) == null ? void 0 : _a.min) !== void 0 && ((_b = this.searchParams.cloudCover) == null ? void 0 : _b.max) !== void 0) {
+    return `${(_c = this.searchParams.cloudCover) == null ? void 0 : _c.min.toFixed(1)}% \u2013 ${(_d = this.searchParams.cloudCover) == null ? void 0 : _d.max.toFixed(1)}%`;
+  }
+  return "Cloud Cover";
+};
+_handleDownloadSelect = new WeakSet();
+handleDownloadSelect_fn = function(event) {
+  const item = event.detail.item;
+  const value = item.value || item.getTextLabel();
+  if (value === "python-script") {
+    __privateMethod(this, _downloadPythonScript, downloadPythonScript_fn).call(this, event);
+  } else if (value === "earthdata-download") {
+    __privateMethod(this, _downloadEarthdataDownload, downloadEarthdataDownload_fn).call(this, event);
+  }
+};
+_downloadPythonScript = new WeakSet();
+downloadPythonScript_fn = async function(event) {
+  var _a, _b, _c, _d, _e, _f, _g, _h, _i;
+  event.stopPropagation();
+  const response = await fetch(
+    getBasePath("assets/data-access/download_files.py.txt")
+  );
+  if (!response.ok) {
+    alert(
+      "Sorry, there was a problem generating the Python script. We are investigating the issue.\nYou could try using the Jupyter Notebook in the meantime"
+    );
+  }
+  const getBboxString = () => {
+    if (!this.searchParams.location) {
+      return "";
+    }
+    try {
+      if (this.searchParams.location.type === "bbox" /* BBOX */ && this.searchParams.location.bounds) {
+        const boundsStr = this.searchParams.location.bounds.toBBoxString();
+        const coords = boundsStr.split(",").map((c) => parseFloat(c.trim()));
+        if (coords.length === 4) {
+          return coords.join(",");
+        }
+        return boundsStr.replace(/\s+/g, "");
+      }
+      if (this.searchParams.location.type === "point" /* POINT */ && this.searchParams.location.latLng) {
+        const { lat, lng } = this.searchParams.location.latLng;
+        const buffer = 0.01;
+        return `${(lng - buffer).toFixed(2)},${(lat - buffer).toFixed(2)},${(lng + buffer).toFixed(2)},${(lat + buffer).toFixed(2)}`;
+      }
+    } catch (error) {
+      console.warn("Error formatting bbox for Python script:", error);
+    }
+    return "";
+  };
+  const content = (await response.text()).replace(/{{short_name}}/gi, (_a = this.shortName) != null ? _a : "").replace(/{{version}}/gi, (_b = this.version) != null ? _b : "").replace(
+    /{{filter_temporal}}/gi,
+    this.searchParams.startDate && this.searchParams.endDate ? this.searchParams.startDate + "," + this.searchParams.endDate : ""
+  ).replace(/{{filter_bbox}}/gi, getBboxString()).replace(/{{filter_search}}/gi, (_c = this.searchParams.search) != null ? _c : "").replace(
+    /{{filter_cloud_cover_min}}/gi,
+    (_f = (_e = (_d = this.searchParams.cloudCover) == null ? void 0 : _d.min) == null ? void 0 : _e.toString()) != null ? _f : ""
+  ).replace(
+    /{{filter_cloud_cover_max}}/gi,
+    (_i = (_h = (_g = this.searchParams.cloudCover) == null ? void 0 : _g.max) == null ? void 0 : _h.toString()) != null ? _i : ""
+  );
+  const blob = new Blob([content], { type: "text/plain" });
+  const url = URL.createObjectURL(blob);
+  const a = document.createElement("a");
+  a.href = url;
+  a.download = `download_files_${this.shortName}_${this.version}.py`;
+  document.body.appendChild(a);
+  a.click();
+  document.body.removeChild(a);
+  URL.revokeObjectURL(url);
+};
+_downloadEarthdataDownload = new WeakSet();
+downloadEarthdataDownload_fn = async function(event) {
+  event.stopPropagation();
+  alert("Sorry, Earthdata Download is not currently supported");
+};
+_handleCloudCoverChange = new WeakSet();
+handleCloudCoverChange_fn = function(event) {
+  const cloudCover = event.detail;
+  __privateMethod(this, _updateCloudCover, updateCloudCover_fn).call(this, {
+    min: "startValue" in cloudCover ? cloudCover.startValue : void 0,
+    max: "endValue" in cloudCover ? cloudCover.endValue : void 0
+  });
+};
+_updateCloudCover = new WeakSet();
+updateCloudCover_fn = function(cloudCover) {
+  var _a;
+  this.searchParams = __spreadProps(__spreadValues({}, this.searchParams), {
+    cloudCover: {
+      min: cloudCover.min,
+      max: cloudCover.max
+    }
+  });
+  (_a = __privateGet(this, _gridApi, gridApi_get)) == null ? void 0 : _a.purgeInfiniteCache();
+};
+_renderLoadingOverlay = new WeakSet();
+renderLoadingOverlay_fn = function() {
+  return b` <div class="loading-modal">
+            <terra-loader indeterminate variant="small"></terra-loader>
+            <span>Loading</span>
+        </div>`;
+};
+TerraDataAccess.styles = [component_styles_default, data_access_styles_default];
+TerraDataAccess.dependencies = {
+  "terra-loader": TerraLoader,
+  "terra-icon": TerraIcon,
+  "terra-date-picker": TerraDatePicker,
+  "terra-spatial-picker": TerraSpatialPicker,
+  "terra-slider": TerraSlider,
+  "terra-dropdown": TerraDropdown,
+  "terra-menu": TerraMenu,
+  "terra-menu-item": TerraMenuItem,
+  "terra-button": TerraButton,
+  "terra-data-grid": TerraDataGrid,
+  "terra-alert": TerraAlert
+};
+__decorateClass([
+  n({ reflect: true, attribute: "collection-entry-id" })
+], TerraDataAccess.prototype, "collectionEntryId", 2);
+__decorateClass([
+  n({ reflect: true, attribute: "short-name" })
+], TerraDataAccess.prototype, "shortName", 2);
+__decorateClass([
+  n({ reflect: true, attribute: "version" })
+], TerraDataAccess.prototype, "version", 2);
+__decorateClass([
+  n({ attribute: "footer-slot", type: Boolean })
+], TerraDataAccess.prototype, "footerSlot", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "searchParams", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "loading", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "totalGranules", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "estimatedSize", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "cloudCoverRange", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "_gridInitialized", 2);
+__decorateClass([
+  r()
+], TerraDataAccess.prototype, "cloudCoverPickerOpen", 2);
+__decorateClass([
+  watch(["shortName", "version"])
+], TerraDataAccess.prototype, "handleShortNameOrVersionChange", 1);
+__decorateClass([
+  watch("collectionEntryId")
+], TerraDataAccess.prototype, "handleCollectionChange", 1);
+__decorateClass([
+  debounce(500)
+], TerraDataAccess.prototype, "handleSearch", 1);
+
+export {
+  debounce,
+  TerraDataAccess
+};