@genspectrum/dashboard-components 1.15.0 → 1.16.0

package/dist/util.d.ts

@@ -71,6 +71,25 @@ export declare type ConfidenceIntervalMethod = default_2.infer<typeof confidence
 
 declare const confidenceIntervalMethodSchema: default_2.ZodUnion<[default_2.ZodLiteral<"wilson">, default_2.ZodLiteral<"none">]>;
 
+export declare type CountCoverageQuery = default_2.infer<typeof countCoverageQuerySchema>;
+
+declare const countCoverageQuerySchema: default_2.ZodObject<{
+    displayLabel: default_2.ZodString;
+    description: default_2.ZodOptional<default_2.ZodString>;
+    countQuery: default_2.ZodString;
+    coverageQuery: default_2.ZodString;
+}, "strip", default_2.ZodTypeAny, {
+    displayLabel: string;
+    countQuery: string;
+    coverageQuery: string;
+    description?: string | undefined;
+}, {
+    displayLabel: string;
+    countQuery: string;
+    coverageQuery: string;
+    description?: string | undefined;
+}>;
+
 export declare type CustomColumn = default_2.infer<typeof customColumnSchema>;
 
 declare const customColumnSchema: default_2.ZodObject<{
@@ -868,22 +887,6 @@ export declare type QueriesOverTimeView = default_2.infer<typeof queriesOverTime
 
 declare const queriesOverTimeViewSchema: default_2.ZodLiteral<"grid">;
 
-export declare type QueryDefinition = default_2.infer<typeof queryDefinition>;
-
-declare const queryDefinition: default_2.ZodObject<{
-    displayLabel: default_2.ZodOptional<default_2.ZodString>;
-    countQuery: default_2.ZodString;
-    coverageQuery: default_2.ZodString;
-}, "strip", default_2.ZodTypeAny, {
-    countQuery: string;
-    coverageQuery: string;
-    displayLabel?: string | undefined;
-}, {
-    countQuery: string;
-    coverageQuery: string;
-    displayLabel?: string | undefined;
-}>;
-
 export declare type RelativeGrowthAdvantageProps = default_2.infer<typeof relativeGrowthAdvantagePropsSchema>;
 
 declare const relativeGrowthAdvantagePropsSchema: default_2.ZodObject<{
@@ -1095,9 +1098,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-app': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-app': AppComponent;
         }
     }
 }
@@ -1105,15 +1108,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
+        'gs-genome-data-viewer': GenomeDataViewerComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-genome-data-viewer': GenomeDataViewerComponent;
         }
     }
 }
@@ -1121,15 +1124,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-genome-data-viewer': GenomeDataViewerComponent;
+        'gs-mutation-comparison': MutationComparisonComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-comparison': MutationComparisonComponent;
         }
     }
 }
@@ -1137,15 +1140,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutation-comparison': MutationComparisonComponent;
+        'gs-mutations': MutationsComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-mutation-comparison': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutations': MutationsComponent;
         }
     }
 }
@@ -1153,15 +1156,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutations': MutationsComponent;
+        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-mutations': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-prevalence-over-time': PrevalenceOverTimeComponent;
         }
     }
 }
@@ -1169,15 +1172,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-prevalence-over-time': PrevalenceOverTimeComponent;
+        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-prevalence-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
         }
     }
 }
@@ -1185,15 +1188,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-relative-growth-advantage': RelativeGrowthAdvantageComponent;
+        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-relative-growth-advantage': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
         }
     }
 }
@@ -1207,9 +1210,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-aggregate': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-aggregate': AggregateComponent;
         }
     }
 }
@@ -1217,15 +1220,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
+        'gs-mutations-over-time': MutationsOverTimeComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutations-over-time': MutationsOverTimeComponent;
         }
     }
 }
@@ -1239,9 +1242,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-queries-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-queries-over-time': QueriesOverTimeComponent;
         }
     }
 }
@@ -1249,15 +1252,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-mutations-over-time': MutationsOverTimeComponent;
+        'gs-statistics': StatisticsComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-statistics': StatisticsComponent;
         }
     }
 }
@@ -1271,9 +1274,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-sequences-by-location': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-sequences-by-location': SequencesByLocationComponent;
         }
     }
 }
@@ -1281,15 +1284,15 @@ declare global {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-statistics': StatisticsComponent;
+        'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
     }
 }
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-statistics': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
         }
     }
 }
@@ -1307,9 +1310,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-date-range-filter': DateRangeFilterComponent;
         }
     }
 }
@@ -1326,9 +1329,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-location-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-location-filter': LocationFilterComponent;
         }
     }
 }
@@ -1345,9 +1348,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-text-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-text-filter': TextFilterComponent;
         }
     }
 }
@@ -1364,9 +1367,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-filter': MutationFilterComponent;
         }
     }
 }
@@ -1384,9 +1387,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-lineage-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-lineage-filter': LineageFilterComponent;
         }
     }
 }
@@ -1404,9 +1407,9 @@ declare global {
 
 
 declare global {
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-number-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-range-filter': NumberRangeFilterComponent;
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@genspectrum/dashboard-components",
-    "version": "1.15.0",
+    "version": "1.16.0",
     "description": "GenSpectrum web components for building dashboards",
     "type": "module",
     "license": "AGPL-3.0-only",
@@ -15,13 +15,6 @@
     "publishConfig": {
         "access": "public"
     },
-    "imports": {
-        "#*": [
-            "./*",
-            "./*.ts",
-            "./*.tsx"
-        ]
-    },
     "exports": {
         "./components": {
             "types": "./dist/components.d.ts",
@@ -136,7 +129,7 @@
         "msw": "^2.2.14",
         "postcss": "^8.4.38",
         "prettier": "^3.2.5",
-        "react": "^18.3.1",
+        "react": "^19.0.0",
         "storybook": "^8.0.9",
         "storybook-addon-fetch-mock": "^2.0.0",
         "tailwindcss": "^4.0.9",

package/src/preact/mutationsOverTime/getFilteredMutationsOverTimeData.ts

@@ -8,7 +8,9 @@ import { type useMutationAnnotationsProvider } from '../MutationAnnotationsConte
 import type { DisplayedMutationType } from '../components/mutation-type-selector';
 import type { DisplayedSegment } from '../components/segment-selector';
 
-export const displayMutationsSchema = z.array(z.string());
+export const displayMutationsSchema = z.array(z.string(), {
+    errorMap: () => ({ message: `invalid display mutations` }),
+});
 export type DisplayMutations = z.infer<typeof displayMutationsSchema>;
 
 export type MutationFilter = {

package/src/preact/queriesOverTime/queries-over-time-row-label-tooltip.stories.tsx

@@ -23,20 +23,20 @@ export const Default: StoryObj<QueriesOverTimeRowLabelTooltipProps> = {
     render: (args) => <QueriesOverTimeRowLabelTooltip {...args} />,
     args: {
         query: {
-            displayLabel: 'S:F456L (single mutation)',
-            description: 'This mutation is associated with increased transmissibility.',
-            countQuery: 'S:456L',
+            displayLabel: 'Foo variant',
+            description: 'These mutations are associated with increased transmissibility.',
+            countQuery: 'S:451L & S:452L & S:453L & S:454L & S:455L & S:456L & S:457L & S:458L & S:459L & S:460L',
             coverageQuery: '!S:456N',
         },
     },
     play: async ({ canvasElement }) => {
         const canvas = within(canvasElement);
-        await expect(canvas.getByText('S:F456L (single mutation)', { exact: true })).toBeVisible();
-        await expect(canvas.getByText('This mutation is associated with increased transmissibility.')).toBeVisible();
+        await expect(canvas.getByText('Foo variant', { exact: true })).toBeVisible();
+        await expect(canvas.getByText('These mutations are associated with increased transmissibility.')).toBeVisible();
         await expect(canvas.getByText('Count query:')).toBeVisible();
-        await expect(canvas.getByText('S:456L')).toBeVisible();
-        await expect(canvas.getByText('Coverage query:')).toBeVisible();
-        await expect(canvas.getByText('!S:456N')).toBeVisible();
+        await expect(
+            canvas.getByText('S:451L & S:452L & S:453L & S:454L & S:455L & S:456L & S:457L & S:458L & S:459L & S:460L'),
+        ).toBeVisible();
     },
 };
 
@@ -54,7 +54,5 @@ export const WithoutDescription: StoryObj<QueriesOverTimeRowLabelTooltipProps> =
         await expect(canvas.getByText('S:R346T', { exact: true })).toBeVisible();
         await expect(canvas.getByText('Count query:')).toBeVisible();
         await expect(canvas.getByText('S:346T')).toBeVisible();
-        await expect(canvas.getByText('Coverage query:')).toBeVisible();
-        await expect(canvas.getByText('!S:346N')).toBeVisible();
     },
 };

package/src/preact/queriesOverTime/queries-over-time-row-label-tooltip.tsx

@@ -8,25 +8,15 @@ export type QueriesOverTimeRowLabelTooltipProps = {
 
 export const QueriesOverTimeRowLabelTooltip: FunctionComponent<QueriesOverTimeRowLabelTooltipProps> = ({ query }) => {
     return (
-        <div className='flex flex-col gap-2'>
+        <div className='flex flex-col gap-2 max-w-xl'>
             <div className='font-bold'>{query.displayLabel}</div>
             {query.description && <div className='text-sm text-gray-700'>{query.description}</div>}
-            <div className='flex flex-col gap-1'>
-                <div className='text-sm'>
-                    <span className='text-gray-600'>Count query:</span>
-                    <div className='p-2 border border-gray-200 rounded bg-gray-50 overflow-x-auto'>
-                        <pre className='text-xs'>
-                            <code>{query.countQuery}</code>
-                        </pre>
-                    </div>
-                </div>
-                <div className='text-sm'>
-                    <span className='text-gray-600'>Coverage query:</span>
-                    <div className='p-2 border border-gray-200 rounded bg-gray-50 overflow-x-auto'>
-                        <pre className='text-xs'>
-                            <code>{query.coverageQuery}</code>
-                        </pre>
-                    </div>
+            <div className='text-sm'>
+                <span className='text-gray-600'>Count query:</span>
+                <div className='p-2 border border-gray-200 rounded bg-gray-50'>
+                    <pre className='text-xs whitespace-pre-wrap'>
+                        <code>{query.countQuery}</code>
+                    </pre>
                 </div>
             </div>
         </div>

package/src/preact/queriesOverTime/queries-over-time.tsx

@@ -177,7 +177,7 @@ const QueriesOverTimeTabs: FunctionComponent<QueriesOverTimeTabsProps> = ({
                         position='right'
                         portalTarget={tooltipPortalTarget}
                     >
-                        <div className='text-center'>
+                        <div className='text-center whitespace-nowrap mr-2'>
                             <span>{value}</span>
                         </div>
                     </PortalTooltip>

package/src/utilEntrypoint.ts

@@ -54,4 +54,4 @@ export {
 export { type MeanProportionInterval } from './preact/mutationsOverTime/mutations-over-time';
 export { type CustomColumn } from './preact/components/features-over-time-grid';
 
-export { type QueryDefinition } from './lapisApi/lapisTypes';
+export { type CountCoverageQuery } from './preact/queriesOverTime/queries-over-time';

package/src/web-components/gs-app.ts

@@ -2,7 +2,6 @@ import { provide } from '@lit/context';
 import { Task } from '@lit/task';
 import { html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 import z from 'zod';
 
 import { lapisContext } from './lapis-context';
@@ -129,9 +128,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-app': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-app': AppComponent;
         }
     }
 }

package/src/web-components/input/gs-date-range-filter.tsx

@@ -1,7 +1,6 @@
 import flatpickrStyle from 'flatpickr/dist/flatpickr.css?inline';
 import { unsafeCSS } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { DateRangeFilter, type DateRangeFilterProps } from '../../preact/dateRangeFilter/date-range-filter';
 import { type DateRangeOptionChangedEvent } from '../../preact/dateRangeFilter/dateRangeOption';
@@ -144,9 +143,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-date-range-filter': DateRangeFilterComponent;
         }
     }
 }

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

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import {
     type LineageFilterChangedEvent,
@@ -146,9 +145,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-lineage-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-lineage-filter': LineageFilterComponent;
         }
     }
 }

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

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { type LocationChangedEvent } from '../../preact/locationFilter/LocationChangedEvent';
 import { LocationFilter, type LocationFilterProps } from '../../preact/locationFilter/location-filter';
@@ -110,9 +109,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-location-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-location-filter': LocationFilterComponent;
         }
     }
 }

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

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { ReferenceGenomesAwaiter } from '../../preact/components/ReferenceGenomesAwaiter';
 import { MutationFilter, type MutationFilterProps } from '../../preact/mutationFilter/mutation-filter';
@@ -67,7 +66,7 @@ export class MutationFilterComponent extends PreactLitAdapter {
      * All values provided must be valid mutations or insertions.
      * Invalid values will be ignored.
      */
-    @property({type: Object})
+    @property({ type: Object })
     initialValue:
         {
             nucleotideMutations: string[];
@@ -125,9 +124,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-mutation-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-mutation-filter': MutationFilterComponent;
         }
     }
 }

package/src/web-components/input/gs-number-range-filter.tsx

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import {
     type NumberRangeFilterChangedEvent,
@@ -140,9 +139,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-number-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-number-range-filter': NumberRangeFilterComponent;
         }
     }
 }

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

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { type TextFilterChangedEvent } from '../../preact/textFilter/TextFilterChangedEvent';
 import { TextFilter, type TextFilterProps } from '../../preact/textFilter/text-filter';
@@ -100,9 +99,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-text-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-text-filter': TextFilterComponent;
         }
     }
 }

package/src/web-components/mutation-annotations-context.ts

@@ -14,7 +14,9 @@ const mutationAnnotationSchema = z.object({
 });
 export type MutationAnnotation = z.infer<typeof mutationAnnotationSchema>;
 
-export const mutationAnnotationsSchema = z.array(mutationAnnotationSchema);
+export const mutationAnnotationsSchema = z.array(mutationAnnotationSchema, {
+    errorMap: () => ({ message: 'invalid mutation annotations' }),
+});
 export type MutationAnnotations = z.infer<typeof mutationAnnotationsSchema>;
 
 export const mutationAnnotationsContext = createContext<MutationAnnotations>(Symbol('mutation-annotations-context'));

package/src/web-components/visualization/gs-aggregate.tsx

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { Aggregate, type AggregateProps } from '../../preact/aggregatedData/aggregate';
 import { type Equals, type Expect } from '../../utils/typeAssertions';
@@ -131,9 +130,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-aggregate': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-aggregate': AggregateComponent;
         }
     }
 }

package/src/web-components/visualization/gs-genome-data-viewer.tsx

@@ -1,5 +1,4 @@
 import { customElement, property } from 'lit/decorators.js';
-import type { DetailedHTMLProps, HTMLAttributes } from 'react';
 
 import { GenomeDataViewer } from '../../preact/genomeViewer/genome-data-viewer';
 import { PreactLitAdapter } from '../PreactLitAdapter';
@@ -53,9 +52,9 @@ declare global {
 
 declare global {
     // eslint-disable-next-line @typescript-eslint/no-namespace
-    namespace JSX {
+    namespace React.JSX {
         interface IntrinsicElements {
-            'gs-genome-data-viewer': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
+            'gs-genome-data-viewer': GenomeDataViewerComponent;
         }
     }
 }