@genspectrum/dashboard-components 0.13.5 → 0.13.7

package/src/web-components/{app.ts → gs-app.ts}

@@ -29,7 +29,7 @@ const lapisUrlSchema = z.string().url();
  * This component does __not__ use a shadow DOM. Children of this component will be rendered directly in the light DOM.
  */
 @customElement('gs-app')
-export class App extends LitElement {
+export class AppComponent extends LitElement {
     /**
      * Required.
      *
@@ -84,7 +84,7 @@ function GsAppError(error: string) {
 
 declare global {
     interface HTMLElementTagNameMap {
-        'gs-app': App;
+        'gs-app': AppComponent;
     }
 }
 

package/src/web-components/index.ts

@@ -1,4 +1,4 @@
-export { App } from './app.js';
+export { AppComponent } from './gs-app';
 export * from './visualization';
 export * from './wastewaterVisualization';
 export * from './input';

package/src/web-components/input/gs-date-range-selector.stories.ts

@@ -7,7 +7,7 @@ import { previewHandles } from '../../../.storybook/preview';
 import { LAPIS_URL } from '../../constants';
 import { type DateRangeSelectorProps } from '../../preact/dateRangeSelector/date-range-selector';
 import './gs-date-range-selector';
-import '../app';
+import '../gs-app';
 import { toYYYYMMDD } from '../../preact/dateRangeSelector/dateConversion';
 import { dateRangeOptionPresets } from '../../preact/dateRangeSelector/dateRangeOption';
 import { withinShadowRoot } from '../withinShadowRoot.story';

package/src/web-components/input/gs-lineage-filter.stories.ts

@@ -5,7 +5,7 @@ import { html } from 'lit';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { previewHandles } from '../../../.storybook/preview';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';
-import '../app';
+import '../gs-app';
 import './gs-lineage-filter';
 import aggregatedData from '../../preact/lineageFilter/__mockData__/aggregated.json';
 import { type LineageFilterProps } from '../../preact/lineageFilter/lineage-filter';

package/src/web-components/input/gs-location-filter.stories.ts

@@ -6,7 +6,7 @@ import { ifDefined } from 'lit/directives/if-defined.js';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { previewHandles } from '../../../.storybook/preview';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';
-import '../app';
+import '../gs-app';
 import './gs-location-filter';
 import data from '../../preact/locationFilter/__mockData__/aggregated.json';
 import { type LocationFilterProps } from '../../preact/locationFilter/location-filter';
@@ -219,7 +219,7 @@ export const FiresEvent: StoryObj<LocationFilterProps> = {
 
         await step('Select Asia', async () => {
             await userEvent.type(inputField(), 'Asia');
-            await userEvent.click(canvas.getByRole('option', { name: 'Asia Asia' }));
+            await userEvent.click(canvas.getByRole('option', { name: /^Asia.*Asia$/ }));
 
             await waitFor(() => {
                 return expect(listenerMock.mock.calls.at(-1)![0].detail).toStrictEqual({

package/src/web-components/input/gs-mutation-filter.stories.ts

@@ -5,7 +5,7 @@ import { html } from 'lit';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { previewHandles } from '../../../.storybook/preview';
 import { LAPIS_URL, REFERENCE_GENOME_ENDPOINT } from '../../constants';
-import '../app';
+import '../gs-app';
 import { type MutationFilterProps } from '../../preact/mutationFilter/mutation-filter';
 import { withinShadowRoot } from '../withinShadowRoot.story';
 import './gs-mutation-filter';
@@ -158,7 +158,7 @@ export const MultiSegmentedReferenceGenomes: StoryObj<MutationFilterProps> = {
             const placeholderText = inputField().getAttribute('placeholder');
 
             expect(placeholderText).toEqual(
-                'Enter a mutation (e.g. seg1:A123T, ins_seg1:123:AT, gene1:M123E, ins_gene1:123:ME)',
+                'Enter a mutation (e.g. seg1:23T, ins_seg1:10462:A, gene1:57Q, ins_gene1:31:N)',
             );
         });
 

package/src/web-components/input/gs-text-input.stories.ts

@@ -5,7 +5,7 @@ import { html } from 'lit';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { previewHandles } from '../../../.storybook/preview';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';
-import '../app';
+import '../gs-app';
 import './gs-text-input';
 import data from '../../preact/textInput/__mockData__/aggregated_hosts.json';
 import type { TextInputProps } from '../../preact/textInput/text-input';

package/src/web-components/visualization/gs-aggregate.stories.ts

@@ -9,7 +9,7 @@ import aggregatedDataWith2Fields from '../../preact/aggregatedData/__mockData__/
 import type { AggregateProps } from '../../preact/aggregatedData/aggregate';
 
 import './gs-aggregate';
-import '../app';
+import '../gs-app';
 
 const codeExample = `
 <gs-aggregate 

package/src/web-components/visualization/gs-mutation-comparison.stories.ts

@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
 import './gs-mutation-comparison';
-import '../app';
+import '../gs-app';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { LAPIS_URL, NUCLEOTIDE_MUTATIONS_ENDPOINT } from '../../constants';
 import nucleotideMutationsOtherDataset from '../../preact/mutationComparison/__mockData__/nucleotideMutationsOtherDataset.json';

package/src/web-components/visualization/gs-mutations-over-time.stories.ts

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
 import './gs-mutations-over-time';
-import '../app';
+import '../gs-app';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { LAPIS_URL } from '../../constants';
 import { type MutationsOverTimeProps } from '../../preact/mutationsOverTime/mutations-over-time';

package/src/web-components/visualization/gs-mutations.stories.ts

@@ -17,7 +17,7 @@ import { type MutationsProps } from '../../preact/mutations/mutations';
 import { withinShadowRoot } from '../withinShadowRoot.story';
 
 import './gs-mutations';
-import '../app';
+import '../gs-app';
 
 const codeExample = String.raw`
 <gs-mutations

package/src/web-components/visualization/gs-number-sequences-over-time.stories.ts

@@ -2,7 +2,7 @@ import { expect, fireEvent, waitFor } from '@storybook/test';
 import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
-import '../app';
+import '../gs-app';
 import './gs-number-sequences-over-time';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';

package/src/web-components/visualization/gs-prevalence-over-time.stories.ts

@@ -2,7 +2,7 @@ import { expect, fireEvent, waitFor } from '@storybook/test';
 import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
-import '../app';
+import '../gs-app';
 import './gs-prevalence-over-time';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';

package/src/web-components/visualization/gs-relative-growth-advantage.stories.ts

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
 import './gs-relative-growth-advantage';
-import '../app';
+import '../gs-app';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { AGGREGATED_ENDPOINT, LAPIS_URL } from '../../constants';
 import denominatorFilter from '../../preact/relativeGrowthAdvantage/__mockData__/denominatorFilter.json';

package/src/web-components/visualization/gs-sequences-by-location.stories.ts

@@ -13,7 +13,7 @@ import { type SequencesByLocationProps } from '../../preact/map/sequences-by-loc
 import { withinShadowRoot } from '../withinShadowRoot.story';
 
 import './gs-sequences-by-location';
-import '../app';
+import '../gs-app';
 
 const codeExample = `<gs-sequences-by-location
     lapisFilter='{"dateFrom":"2022-01-01","dateTo":"2022-04-01"}'

package/src/web-components/visualization/gs-statistics.stories.ts

@@ -8,7 +8,7 @@ import numeratorData from '../../preact/statistic/__mockData__/numerator.json';
 import { type StatisticsProps } from '../../preact/statistic/statistics';
 
 import './gs-statistics';
-import '../app';
+import '../gs-app';
 
 const codeExample = `
 <gs-statistics

package/src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.stories.ts

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/web-components';
 import { html } from 'lit';
 
 import './gs-wastewater-mutations-over-time';
-import '../app';
+import '../gs-app';
 import { withComponentDocs } from '../../../.storybook/ComponentDocsBlock';
 import { WISE_DETAILS_ENDPOINT, WISE_LAPIS_URL } from '../../constants';
 import details from '../../preact/wastewater/mutationsOverTime/__mockData__/details.json';
@@ -14,6 +14,7 @@ const codeExample = String.raw`
     sequenceType='nucleotide'
     width='100%'
     height='700px'
+    maxNumberOfGridRows='100'
 >
     <span slot="infoText">Some info text</span>
 </gs-wastewater-mutations-over-time>`;
@@ -36,6 +37,7 @@ const meta: Meta<WastewaterMutationsOverTimeProps & { infoText: string }> = {
         width: '100%',
         height: '700px',
         infoText: 'Some info text',
+        maxNumberOfGridRows: 100,
     },
     parameters: withComponentDocs({
         componentDocs: {
@@ -58,6 +60,7 @@ export const WastewaterMutationsOverTime: StoryObj<WastewaterMutationsOverTimePr
                 .sequenceType=${args.sequenceType}
                 .width=${args.width}
                 .height=${args.height}
+                .maxNumberOfGridRows=${args.maxNumberOfGridRows}
             >
                 <span slot="infoText">${args.infoText}</span>
             </gs-wastewater-mutations-over-time>

package/src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.tsx

@@ -67,8 +67,6 @@ export class WastewaterMutationsOverTimeComponent extends PreactLitAdapterWithGr
 
     /**
      * The maximum number of grid rows to display.
-     *
-     * Visit https://genspectrum.github.io/dashboard-components/?path=/docs/components-size-of-components--docs for more information.
      */
     @property({ type: Number })
     maxNumberOfGridRows: number = 100;
@@ -120,4 +118,10 @@ type WidthMatches = Expect<
 type HeightMatches = Expect<
     Equals<typeof WastewaterMutationsOverTimeComponent.prototype.height, WastewaterMutationsOverTimeProps['height']>
 >;
+type MaxNumberOfGridRowsMatches = Expect<
+    Equals<
+        typeof WastewaterMutationsOverTimeComponent.prototype.maxNumberOfGridRows,
+        WastewaterMutationsOverTimeProps['maxNumberOfGridRows']
+    >
+>;
 /* eslint-enable @typescript-eslint/no-unused-vars, no-unused-vars */