@eodash/eodash 5.0.0-alpha.2.9 → 5.0.0-rc

package/core/client/vite-env.d.ts

@@ -6,16 +6,8 @@ declare module "*.vue" {
   export default component;
 }
 declare interface Window {
-  eodashStore: import("@/types").EodashStore;
-}
-declare module "@eox/stacinfo" {
-  export const EOxStacInfo: CustomElementConstructor;
-}
-declare module "@eox/map" {
-  export const EOxMap: CustomElementConstructor;
-}
-declare module "@eox/itemfilter" {
-  export const EOxItemFilter: CustomElementConstructor;
+  eodashStore: typeof import("@/store").default;
+  setEodashLoglevel: typeof import("loglevel").setLevel;
 }
 declare module "user:config" {
   const eodash: import("@/types").Eodash | Promise<import("@/types").Eodash>;

package/dist/client/DashboardLayout-232tRmjz.js

@@ -0,0 +1,84 @@
+import { openBlock, createBlock, withCtx, createElementVNode, unref, normalizeStyle, createElementBlock, Suspense, resolveDynamicComponent, mergeProps, createCommentVNode, Fragment, renderList, Transition } from 'vue';
+import '@eox/layout';
+import { _ as _export_sfc, F as useDefineTemplate } from './asWebComponent-BRGyP_j5.js';
+import { V as VMain } from './VMain-BUs3kDTd.js';
+
+const _hoisted_1 = ["gap"];
+const _hoisted_2 = ["id", "h", "w", "x", "y"];
+
+
+const _sfc_main = {
+  __name: 'DashboardLayout',
+  setup(__props) {
+
+const { bgWidget, importedWidgets, gap } = useDefineTemplate();
+
+return (_ctx, _cache) => {
+                                                       
+
+  return (openBlock(), createBlock(VMain, null, {
+    default: withCtx(() => [
+      createElementVNode("eox-layout", {
+        gap: unref(gap),
+        style: normalizeStyle(`padding: ${unref(gap)}px`)
+      }, [
+        (unref(bgWidget)?.component)
+          ? (openBlock(), createElementBlock("eox-layout-item", {
+              key: 0,
+              class: "bg-panel bg-surface",
+              style: normalizeStyle(`margin: -${unref(gap) + 1}px;`),
+              x: "0",
+              y: "0",
+              h: "12",
+              w: "12"
+            }, [
+              (openBlock(), createBlock(Suspense, { suspensible: "" }, {
+                default: withCtx(() => [
+                  (openBlock(), createBlock(resolveDynamicComponent(unref(bgWidget)?.component), mergeProps({ id: "bg-widget" }, unref(bgWidget)?.props), null, 16 /* FULL_PROPS */))
+                ]),
+                _: 1 /* STABLE */
+              }))
+            ], 4 /* STYLE */))
+          : createCommentVNode("v-if", true),
+        (openBlock(true), createElementBlock(Fragment, null, renderList(unref(importedWidgets), (importedWidget, idx) => {
+          return (openBlock(), createBlock(Transition, {
+            key: idx,
+            name: "fade"
+          }, {
+            default: withCtx(() => [
+              (importedWidget.value.component)
+                ? (openBlock(), createElementBlock("eox-layout-item", {
+                    id: importedWidget.value.id.toString(),
+                    key: importedWidget.value.id,
+                    class: "panel bg-surface",
+                    h: importedWidget.value.layout.h,
+                    w: importedWidget.value.layout.w,
+                    x: importedWidget.value.layout.x,
+                    y: importedWidget.value.layout.y
+                  }, [
+                    (openBlock(), createBlock(Suspense, { suspensible: "" }, {
+                      default: withCtx(() => [
+                        (openBlock(), createBlock(resolveDynamicComponent(importedWidget.value.component), mergeProps({
+                          key: importedWidget.value.id,
+                          ref_for: true
+                        }, importedWidget.value.props), null, 16 /* FULL_PROPS */))
+                      ]),
+                      _: 2 /* DYNAMIC */
+                    }, 1024 /* DYNAMIC_SLOTS */))
+                  ], 8 /* PROPS */, _hoisted_2))
+                : createCommentVNode("v-if", true)
+            ]),
+            _: 2 /* DYNAMIC */
+          }, 1024 /* DYNAMIC_SLOTS */))
+        }), 128 /* KEYED_FRAGMENT */))
+      ], 12 /* STYLE, PROPS */, _hoisted_1)
+    ]),
+    _: 1 /* STABLE */
+  }))
+}
+}
+
+};
+const DashboardLayout = /*#__PURE__*/_export_sfc(_sfc_main, [['__scopeId',"data-v-ebeeb1d1"]]);
+
+export { DashboardLayout as default };

package/dist/client/DynamicWebComponent-Cl4LqHU6.js

@@ -0,0 +1,88 @@
+import { withAsyncContext, ref, onMounted, onUnmounted, openBlock, createElementBlock, createBlock, resolveDynamicComponent, mergeProps } from 'vue';
+import { $ as useSTAcStore } from './asWebComponent-BRGyP_j5.js';
+
+const _hoisted_1 = { class: "d-flex flex-column fill-height overflow-auto" };
+
+
+const _sfc_main = {
+  __name: 'DynamicWebComponent',
+  props: {
+    link: {
+      type: [String, Function],
+      required: true,
+    },
+    constructorProp: String,
+    tagName: {
+      type: String,
+      required: true,
+    },
+    properties: {
+      type: Object,
+      default: () => {
+        return {};
+      },
+    },
+    onMounted: Function,
+    onUnmounted: Function,
+  },
+  async setup(__props) {
+
+let __temp, __restore;
+
+const props = /** @type {import("@/types").WebComponentProps} */ (
+  __props
+);
+
+const getWebComponent = async () =>
+  typeof props.link === "string"
+    ? await import(/* @vite-ignore */ props.link)
+    : await props.link();
+
+const imported = !customElements.get(props.tagName)
+  ? (
+  ([__temp,__restore] = withAsyncContext(() => getWebComponent().catch((e) => {
+      console.error(e);
+    }))),
+  __temp = await __temp,
+  __restore(),
+  __temp
+)
+  : null;
+
+const defined = customElements.get(props.tagName);
+
+// if the imported link doesn't define the custom tag provided
+if (!defined && props.constructorProp) {
+  const Constructor = imported[props.constructorProp];
+  customElements.define(props.tagName, Constructor);
+}
+
+const store = useSTAcStore();
+
+/**
+ * @typedef {HTMLElement & Record<string | number | symbol, unknown>} CustomElement
+ * @type {import("vue").Ref<CustomElement | null>}
+ */
+const elementRef = ref(null);
+
+onMounted(() => {
+  props.onMounted?.(elementRef.value, store);
+});
+
+onUnmounted(() => {
+  props.onUnmounted?.(elementRef.value, store);
+});
+
+return (_ctx, _cache) => {
+  return (openBlock(), createElementBlock("span", _hoisted_1, [
+    (openBlock(), createBlock(resolveDynamicComponent(__props.tagName), mergeProps(__props.properties, {
+      ref_key: "elementRef",
+      ref: elementRef
+    }), null, 16 /* FULL_PROPS */))
+  ]))
+}
+}
+
+};
+
+export { _sfc_main as default };

package/dist/client/EodashDatePicker-Pok6bZwU.js

@@ -0,0 +1,306 @@
+import { resolveComponent, render, h, mergeProps, customRef, ref, reactive, toRef, watch, openBlock, createElementBlock, createVNode, unref, withCtx, createElementVNode, withDirectives, createBlock, createCommentVNode } from 'vue';
+import { DatePicker } from 'v-calendar';
+import { E as isObject, Y as consoleError, Z as datetime, $ as useSTAcStore, a0 as eodashCollections, a1 as makePanelTransparent, V as VBtn, y as VIcon } from './asWebComponent-BRGyP_j5.js';
+import { mdiRayEndArrow, mdiRayStartArrow } from '@mdi/js';
+import log from 'loglevel';
+import { V as VTooltip } from './VTooltip-CDu3bErh.js';
+
+// Utilities
+function useDirectiveComponent(component, props) {
+  const concreteComponent = typeof component === 'string' ? resolveComponent(component) : component;
+  const hook = mountComponent(concreteComponent, props);
+  return {
+    mounted: hook,
+    updated: hook,
+    unmounted(el) {
+      render(null, el);
+    }
+  };
+}
+function mountComponent(component, props) {
+  return function (el, binding, vnode) {
+    const _props = typeof props === 'function' ? props(binding) : props;
+    const text = binding.value?.text ?? binding.value ?? _props?.text;
+    const value = isObject(binding.value) ? binding.value : {};
+
+    // Get the children from the props or directive value, or the element's children
+    const children = () => text ?? el.textContent;
+
+    // If vnode.ctx is the same as the instance, then we're bound to a plain element
+    // and need to find the nearest parent component instance to inherit provides from
+    const provides = (vnode.ctx === binding.instance.$ ? findComponentParent(vnode, binding.instance.$)?.provides : vnode.ctx?.provides) ?? binding.instance.$.provides;
+    const node = h(component, mergeProps(_props, value), children);
+    node.appContext = Object.assign(Object.create(null), binding.instance.$.appContext, {
+      provides
+    });
+    render(node, el);
+  };
+}
+function findComponentParent(vnode, root) {
+  // Walk the tree from root until we find the child vnode
+  const stack = new Set();
+  const walk = children => {
+    for (const child of children) {
+      if (!child) continue;
+      if (child === vnode || child.el && vnode.el && child.el === vnode.el) {
+        return true;
+      }
+      stack.add(child);
+      let result;
+      if (child.suspense) {
+        result = walk([child.ssContent]);
+      } else if (Array.isArray(child.children)) {
+        result = walk(child.children);
+      } else if (child.component?.vnode) {
+        result = walk([child.component?.subTree]);
+      }
+      if (result) {
+        return result;
+      }
+      stack.delete(child);
+    }
+    return false;
+  };
+  if (!walk([root.subTree])) {
+    consoleError('Could not find original vnode, component will not inherit provides');
+    return root;
+  }
+
+  // Return the first component parent
+  const result = Array.from(stack).reverse();
+  for (const child of result) {
+    if (child.component) {
+      return child.component;
+    }
+  }
+  return root;
+}
+
+// Components
+const Tooltip = useDirectiveComponent(VTooltip, binding => {
+  return {
+    activator: 'parent',
+    location: binding.arg?.replace('-', ' '),
+    text: typeof binding.value === 'boolean' ? undefined : binding.value
+  };
+});
+
+const _hoisted_1 = { class: "d-flex flex-row align-center justify-center pb-1" };
+const _hoisted_2 = {
+  class: "flex rounded-lg border border-gray-300 dark:border-gray-600",
+  style: {"margin":"2px"}
+};
+const _hoisted_3 = ["value"];
+
+// holds the number value of the datetime
+
+const _sfc_main = {
+  __name: 'EodashDatePicker',
+  props: {
+  hintText: {
+    type: String,
+    default: null,
+  },
+  hideArrows: {
+    type: Boolean,
+    default: false,
+  },
+  hideInputField: {
+    type: Boolean,
+    default: false,
+  },
+},
+  setup(__props) {
+
+const currentDate = customRef((track, trigger) => ({
+  get() {
+    track();
+    return new Date(datetime.value).getTime();
+  },
+  /** @param {number} num */
+  set(num) {
+    trigger();
+    log.debug("Datepicker setting currentDate", datetime.value);
+    datetime.value = new Date(num).toISOString();
+  },
+}));
+
+const masks = ref({
+  input: "YYYY-MM-DD",
+});
+
+
+
+/**
+ * Attributes displayed on datepicker
+ *
+ * @type {import("vue").Reactive<
+ *   (
+ *     | Partial<import("v-calendar/dist/types/src/utils/attribute").AttributeConfig>
+ *     | undefined
+ *   )[]
+ * >}
+ */
+const attributes = reactive([]);
+
+/** @type {import("vue").Ref<HTMLDivElement|null>} */
+const rootRef = ref(null);
+
+const selectedStac = toRef(useSTAcStore(), "selectedStac");
+
+watch(
+  selectedStac,
+  async (updatedStac, previousStac) => {
+    if (updatedStac && previousStac?.id !== updatedStac.id) {
+      log.debug("Datepicker selected STAC change triggered");
+      const wongPalette = [
+        "#009E73",
+        "#0072B2",
+        "#E69F00",
+        "#CC79A7",
+        "#56B4E9",
+        "#D55E00",
+      ];
+      // remove old values
+      attributes.splice(0, attributes.length);
+
+      for (let idx = 0; idx < eodashCollections.length; idx++) {
+        log.debug("Retrieving dates", eodashCollections[idx]);
+        await eodashCollections[idx].fetchCollection();
+        const dates = [
+          ...new Set(
+            eodashCollections[idx].getItems()?.reduce((valid, it) => {
+              const parsed = Date.parse(/** @type {string} */ (it.datetime));
+              if (parsed) {
+                valid.push(new Date(parsed));
+              }
+              return valid;
+            }, /** @type {Date[]} */ ([])),
+          ),
+        ];
+        attributes.push({
+          key: "id-" + idx.toString() + Math.random().toString(16).slice(2),
+          bar: {
+            style: {
+              backgroundColor: wongPalette[idx % wongPalette.length],
+            },
+          },
+          dates,
+          content: {
+            style: {
+              color: "#000000",
+              "font-weight": "bold",
+            },
+          },
+        });
+      }
+    }
+  },
+  { immediate: true },
+);
+
+/**
+ * @param {boolean} reverse
+ */
+function jumpDate(reverse) {
+  if (attributes.length) {
+    let latestDateMS = reverse ? Infinity : -Infinity;
+    attributes.forEach((coll) => {
+      if (coll?.dates) {
+        coll.dates.forEach((d) => {
+          // TODO: we need to handle time ranges and other options here
+          if (d instanceof Date) {
+            const mathFun = reverse ? "min" : "max";
+            latestDateMS = Math[mathFun](latestDateMS, d.getTime());
+          }
+        });
+      }
+    });
+    currentDate.value =
+      latestDateMS === -Infinity
+        ? Date.now()
+        : latestDateMS === Infinity
+          ? 0
+          : latestDateMS;
+  }
+}
+
+makePanelTransparent(rootRef);
+
+return (_ctx, _cache) => {
+                                                       
+                                                     
+                                                         
+
+  return (openBlock(), createElementBlock("div", {
+    ref_key: "rootRef",
+    ref: rootRef,
+    class: "datePicker"
+  }, [
+    createVNode(unref(DatePicker), {
+      modelValue: currentDate.value,
+      "onUpdate:modelValue": _cache[2] || (_cache[2] = $event => ((currentDate).value = $event)),
+      modelModifiers: { number: true },
+      attributes: attributes,
+      masks: masks.value,
+      expanded: "",
+      class: "bg-surface overflow-auto",
+      style: {"background-color":"transparent","max-width":"100%"}
+    }, {
+      footer: withCtx(() => [
+        createElementVNode("div", _hoisted_1, [
+          (!__props.hideArrows)
+            ? withDirectives((openBlock(), createBlock(VBtn, {
+                key: 0,
+                density: "compact",
+                variant: "text",
+                onClick: _cache[0] || (_cache[0] = $event => (jumpDate(true)))
+              }, {
+                default: withCtx(() => [
+                  createVNode(VIcon, {
+                    icon: [unref(mdiRayEndArrow)]
+                  }, null, 8 /* PROPS */, ["icon"])
+                ]),
+                _: 1 /* STABLE */
+              })), [
+                [Tooltip, 'Set date to oldest available dataset', "bottom"]
+              ])
+            : createCommentVNode("v-if", true),
+          createElementVNode("div", _hoisted_2, [
+            (!__props.hideInputField)
+              ? (openBlock(), createElementBlock("input", {
+                  key: 0,
+                  value: new Date(currentDate.value).toLocaleDateString(),
+                  style: {"margin":"1px"},
+                  class: "flex-grow px-1 py-1 dark:bg-gray-700"
+                }, null, 8 /* PROPS */, _hoisted_3))
+              : createCommentVNode("v-if", true)
+          ]),
+          (!__props.hideArrows)
+            ? withDirectives((openBlock(), createBlock(VBtn, {
+                key: 1,
+                density: "compact",
+                variant: "text",
+                onClick: _cache[1] || (_cache[1] = $event => (jumpDate(false)))
+              }, {
+                default: withCtx(() => [
+                  createVNode(VIcon, {
+                    icon: [unref(mdiRayStartArrow)]
+                  }, null, 8 /* PROPS */, ["icon"])
+                ]),
+                _: 1 /* STABLE */
+              })), [
+                [Tooltip, 'Set date to latest available dataset', "bottom"]
+              ])
+            : createCommentVNode("v-if", true)
+        ])
+      ]),
+      _: 1 /* STABLE */
+    }, 8 /* PROPS */, ["modelValue", "attributes", "masks"])
+  ], 512 /* NEED_PATCH */))
+}
+}
+
+};
+
+export { _sfc_main as default };

package/dist/client/EodashItemFilter-16eMMjTV.js

@@ -0,0 +1,151 @@
+import { computed, ref, openBlock, createElementBlock, mergeProps, unref, createElementVNode, toDisplayString } from 'vue';
+import { t as useDisplay, $ as useSTAcStore } from './asWebComponent-BRGyP_j5.js';
+import '@eox/itemfilter';
+
+const _hoisted_1 = [".items"];
+const _hoisted_2 = {
+  slot: "filterstitle",
+  style: {"margin":"14px 8px"}
+};
+const _hoisted_3 = {
+  slot: "resultstitle",
+  style: {"margin":"14px 8px"}
+};
+
+
+const _sfc_main = {
+  __name: 'EodashItemFilter',
+  props: {
+  enableCompare: {
+    type: Boolean,
+    default: false,
+  },
+  filtersTitle: {
+    type: String,
+    default: "Indicators",
+  },
+  resultsTitle: {
+    type: String,
+    default: "Results",
+  },
+  titleProperty: {
+    type: String,
+    default: "title",
+  },
+  aggregateResults: {
+    type: String,
+    default: undefined,
+  },
+  imageProperty: {
+    type: String,
+    default: "",
+  },
+  subTitleProperty: {
+    type: String,
+    default: "",
+  },
+  resultType: {
+    type: String,
+    default: "",
+  },
+  cssVars: {
+    type: [String, Object],
+    default: "",
+  },
+  enableHighlighting: { type: Boolean, default: true },
+  expandMultipleFilters: { type: Boolean, default: true },
+  expandMultipleResults: { type: Boolean, default: true },
+  filterProperties: {
+    /** @type {import("vue").PropType<{
+     * keys:string[];
+     * title:string;
+     * type:string;
+     * expanded?:boolean
+     * }[]> }*/
+    type: Array,
+    default: () => [
+      {
+        keys: ["title", "themes", "description"],
+        title: "Search",
+        type: "text",
+      },
+      {
+        key: "themes",
+        title: "Theme Filter",
+        type: "multiselect",
+      },
+    ],
+  },
+},
+  emits: ["select"],
+  setup(__props, { emit: __emit }) {
+
+const emit = __emit;
+
+const props = __props;
+/**
+ * @param {import("stac-ts").StacLink} item
+ */
+const selectIndicator = async (item) => {
+  if (item) {
+    // Reset compare stac to empty
+    store.resetSelectedCompareSTAC();
+    await store.loadSelectedSTAC(item.href);
+    emit("select", item);
+  } else {
+    store.selectedStac = null;
+  }
+};
+/**
+ * @param {import("stac-ts").StacLink} item
+ */
+const selectCompareIndicator = (item) => {
+  if (item) {
+    store.loadSelectedCompareSTAC(item.href);
+    emit("select", item);
+  }
+};
+/** @param {any} evt*/
+const onSelect = async (evt) => {
+  const item = /** @type {import('stac-ts').StacLink} */ evt.detail;
+  if (props.enableCompare) {
+    selectCompareIndicator(item);
+  } else {
+    selectIndicator(item);
+  }
+};
+const { smAndDown } = useDisplay();
+const config = computed(() => ({
+  titleProperty: props.titleProperty,
+  enableHighlighting: props.enableHighlighting,
+  expandMultipleFilters: props.expandMultipleFilters,
+  expandMultipleResults: props.expandMultipleResults,
+  subTitleProperty: props.subTitleProperty,
+  resultType: props.resultType,
+  imageProperty: props.imageProperty,
+  aggregateResults: props.aggregateResults,
+  style: props.cssVars,
+  filterProperties: smAndDown.value ? "" : props.filterProperties,
+}));
+/** @type {import("vue").Ref<HTMLElement & Record<string,any> | null>} */
+const eoxItemFilter = ref(null);
+
+const store = useSTAcStore();
+
+return (_ctx, _cache) => {
+  return (openBlock(), createElementBlock("eox-itemfilter", mergeProps({ class: "fill-height" }, config.value, {
+    ref_key: "eoxItemFilter",
+    ref: eoxItemFilter,
+    style: {"overflow":"auto","--background-color":"none"},
+    onSelect: onSelect,
+    ".items": unref(store).stac?.filter((item) => item.rel === "child")
+  }), [
+    createElementVNode("h4", _hoisted_2, toDisplayString(__props.filtersTitle), 1 /* TEXT */),
+    createElementVNode("h4", _hoisted_3, toDisplayString(__props.resultsTitle), 1 /* TEXT */)
+  ], 48 /* FULL_PROPS, NEED_HYDRATION */, _hoisted_1))
+}
+}
+
+};
+
+export { _sfc_main as default };