@genspectrum/dashboard-components 1.10.1 → 1.10.3

package/dist/util.d.ts

@@ -942,7 +942,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutation-comparison-component': MutationComparisonComponent;
+        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
     }
 }
 
@@ -950,7 +950,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutation-comparison-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -958,7 +958,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutations': MutationsComponent;
+        'gs-mutation-comparison-component': MutationComparisonComponent;
     }
 }
 
@@ -966,7 +966,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutations': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-comparison-component': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -974,7 +974,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
+        'gs-genome-data-viewer': GenomeDataViewerComponent;
     }
 }
 
@@ -982,7 +982,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -990,7 +990,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
+        'gs-mutations': MutationsComponent;
     }
 }
 
@@ -998,7 +998,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutations': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1006,7 +1006,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-aggregate': AggregateComponent;
+        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
     }
 }
 
@@ -1014,7 +1014,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-aggregate': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1022,7 +1022,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
+        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
     }
 }
 
@@ -1030,7 +1030,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1038,7 +1038,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-sequences-by-location': SequencesByLocationComponent;
+        'gs-aggregate': AggregateComponent;
     }
 }
 
@@ -1046,7 +1046,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-aggregate': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1054,7 +1054,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutations-over-time': MutationsOverTimeComponent;
+        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
     }
 }
 
@@ -1062,7 +1062,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1070,7 +1070,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-genome-data-viewer': GenomeDataViewerComponent;
+        'gs-mutations-over-time': MutationsOverTimeComponent;
     }
 }
 
@@ -1078,7 +1078,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1086,7 +1086,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-statistics': StatisticsComponent;
+        'gs-sequences-by-location': SequencesByLocationComponent;
     }
 }
 
@@ -1094,7 +1094,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1122,10 +1122,7 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-location-filter': LocationFilterComponent;
-    }
-    interface HTMLElementEventMap {
-        [gsEventNames.locationChanged]: LocationChangedEvent;
+        'gs-statistics': StatisticsComponent;
     }
 }
 
@@ -1133,7 +1130,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-location-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1160,10 +1157,10 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutation-filter': MutationFilterComponent;
+        'gs-location-filter': LocationFilterComponent;
     }
     interface HTMLElementEventMap {
-        [gsEventNames.mutationFilterChanged]: CustomEvent<MutationsFilter>;
+        [gsEventNames.locationChanged]: LocationChangedEvent;
     }
 }
 
@@ -1171,7 +1168,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-location-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1179,11 +1176,10 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-number-range-filter': NumberRangeFilterComponent;
+        'gs-mutation-filter': MutationFilterComponent;
     }
     interface HTMLElementEventMap {
-        [gsEventNames.numberRangeFilterChanged]: NumberRangeFilterChangedEvent;
-        [gsEventNames.numberRangeValueChanged]: NumberRangeValueChangedEvent;
+        [gsEventNames.mutationFilterChanged]: CustomEvent<MutationsFilter>;
     }
 }
 
@@ -1191,7 +1187,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-number-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1199,11 +1195,11 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-lineage-filter': LineageFilterComponent;
+        'gs-number-range-filter': NumberRangeFilterComponent;
     }
     interface HTMLElementEventMap {
-        [gsEventNames.lineageFilterChanged]: LineageFilterChangedEvent;
-        [gsEventNames.lineageFilterMultiChanged]: LineageMultiFilterChangedEvent;
+        [gsEventNames.numberRangeFilterChanged]: NumberRangeFilterChangedEvent;
+        [gsEventNames.numberRangeValueChanged]: NumberRangeValueChangedEvent;
     }
 }
 
@@ -1211,7 +1207,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-lineage-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }
@@ -1219,7 +1215,11 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
+        'gs-lineage-filter': LineageFilterComponent;
+    }
+    interface HTMLElementEventMap {
+        [gsEventNames.lineageFilterChanged]: LineageFilterChangedEvent;
+        [gsEventNames.lineageFilterMultiChanged]: LineageMultiFilterChangedEvent;
     }
 }
 
@@ -1227,7 +1227,7 @@ declare global {
 declare global {
     namespace JSX {
         interface IntrinsicElements {
-            'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-lineage-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@genspectrum/dashboard-components",
-    "version": "1.10.1",
+    "version": "1.10.3",
     "description": "GenSpectrum web components for building dashboards",
     "type": "module",
     "license": "AGPL-3.0-only",

package/src/preact/components/resize-container.tsx

@@ -4,11 +4,15 @@ import { forwardRef } from 'preact/compat';
 export type Size = {
     width: string;
     height?: string;
+    minHeight?: string;
 };
 
 export const ResizeContainer = forwardRef<HTMLDivElement, { size: Size; children: ComponentChildren }>(
     ({ size, children }, ref) => (
-        <div ref={ref} style={{ width: size.width, height: size.height, position: 'relative' }}>
+        <div
+            ref={ref}
+            style={{ width: size.width, height: size.height, minHeight: size.minHeight, position: 'relative' }}
+        >
             {children}
         </div>
     ),

package/src/preact/lineageFilter/lineage-filter.tsx

@@ -52,7 +52,7 @@ type LineageSelectorProps = z.infer<typeof lineageSelectorPropsSchema>;
 
 export const LineageFilter: FunctionComponent<LineageFilterProps> = (props) => {
     const { width, ...innerProps } = props;
-    const size = { width, height: '3rem' };
+    const size = { width, minHeight: '3rem' };
 
     return (
         <ErrorBoundary size={size} layout='horizontal' componentProps={props} schema={lineageFilterPropsSchema}>

package/src/web-components/input/gs-lineage-filter.tsx

@@ -49,7 +49,22 @@ export class LineageFilterComponent extends PreactLitAdapter {
      * Can be a string for single select mode or an array of strings (or comma-separated string) for multi-select mode.
      * Examples: "B.1.1.7" or ["B.1.1.7", "BA.5"] or "B.1.1.7,BA.5"
      */
-    @property()
+    @property({
+        converter: (value) => {
+            if (value === null) {
+                return value;
+            }
+            try {
+                const parsed = JSON.parse(value) as unknown;
+                if (Array.isArray(parsed) && parsed.every((v) => typeof v === 'string')) {
+                    return parsed;
+                }
+                return value;
+            } catch {
+                return value;
+            }
+        },
+    })
     value: string | string[] = '';
 
     /**
@@ -103,33 +118,6 @@ export class LineageFilterComponent extends PreactLitAdapter {
     @property({ type: Boolean })
     hideCounts: boolean | undefined = false;
 
-    override updated(changedProps: Map<string, unknown>) {
-        if (changedProps.has('value') || changedProps.has('multiSelect')) {
-            if (this.multiSelect) {
-                if (typeof this.value === 'string') {
-                    let parsed: unknown;
-                    try {
-                        parsed = JSON.parse(this.value);
-                    } catch {
-                        parsed = this.value.split(',').map((s) => s.trim());
-                    }
-
-                    // type guard
-                    if (Array.isArray(parsed) && parsed.every((v) => typeof v === 'string')) {
-                        this.value = parsed;
-                    } else {
-                        this.value = [];
-                    }
-                }
-            } else {
-                // single select: ensure value is a string
-                if (Array.isArray(this.value)) {
-                    this.value = this.value[0] ?? '';
-                }
-            }
-        }
-    }
-
     override render() {
         return (
             <LineageFilter

package/standalone-bundle/dashboard-components.js

@@ -5209,7 +5209,14 @@ var MT = function(n, e) {
   return n(e);
 }, TT = ke, AT = Yd, vd = { useState: xe, useId: gx, useReducer: Wc, useEffect: je, useLayoutEffect: qo, useInsertionEffect: Tx, useTransition: Cx, useDeferredValue: Mx, useSyncExternalStore: kx, startTransition: Sx, useRef: Le, useImperativeHandle: px, useMemo: He, useCallback: dt, useContext: Mn, useDebugValue: mx, version: "18.3.1", Children: nT, render: hT, hydrate: fT, unmountComponentAtNode: kT, createPortal: Ix, createElement: eo, createContext: Ua, createFactory: _T, cloneElement: wT, createRef: L2, Fragment: ke, isValidElement: Yd, isElement: AT, isFragment: bT, isMemo: xT, findDOMNode: ST, Component: ar, PureComponent: gp, memo: eT, forwardRef: km, flushSync: CT, unstable_batchedUpdates: MT, StrictMode: TT, Suspense: Yu, SuspenseList: Il, lazy: rT, __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: yT };
 const Kt = km(
-  ({ size: n, children: e }, t) => /* @__PURE__ */ v("div", { ref: t, style: { width: n.width, height: n.height, position: "relative" }, children: e })
+  ({ size: n, children: e }, t) => /* @__PURE__ */ v(
+    "div",
+    {
+      ref: t,
+      style: { width: n.width, height: n.height, minHeight: n.minHeight, position: "relative" },
+      children: e
+    }
+  )
 ), dn = ({
   size: n,
   layout: e,
@@ -40111,7 +40118,7 @@ const pB = T.object({
     path: ["value"]
   })
 ), vB = (n) => {
-  const { width: e, ...t } = n, i = { width: e, height: "3rem" };
+  const { width: e, ...t } = n, i = { width: e, minHeight: "3rem" };
   return /* @__PURE__ */ v(dn, { size: i, layout: "horizontal", componentProps: n, schema: gB, children: /* @__PURE__ */ v(Kt, { size: i, children: /* @__PURE__ */ v(yB, { ...t }) }) });
 }, yB = ({
   lapisField: n,
@@ -40199,21 +40206,6 @@ let so = class extends zn {
   constructor() {
     super(...arguments), this.value = "", this.lapisField = "", this.multiSelect = !1, this.lapisFilter = {}, this.placeholderText = void 0, this.width = "100%", this.hideCounts = !1;
   }
-  updated(n) {
-    if (n.has("value") || n.has("multiSelect"))
-      if (this.multiSelect) {
-        if (typeof this.value == "string") {
-          let e;
-          try {
-            e = JSON.parse(this.value);
-          } catch {
-            e = this.value.split(",").map((t) => t.trim());
-          }
-          Array.isArray(e) && e.every((t) => typeof t == "string") ? this.value = e : this.value = [];
-        }
-      } else
-        Array.isArray(this.value) && (this.value = this.value[0] ?? "");
-  }
   render() {
     return /* @__PURE__ */ v(
       vB,
@@ -40230,7 +40222,18 @@ let so = class extends zn {
   }
 };
 is([
-  U()
+  U({
+    converter: (n) => {
+      if (n === null)
+        return n;
+      try {
+        const e = JSON.parse(n);
+        return Array.isArray(e) && e.every((t) => typeof t == "string") ? e : n;
+      } catch {
+        return n;
+      }
+    }
+  })
 ], so.prototype, "value", 2);
 is([
   U()