@genspectrum/dashboard-components 0.19.6 → 0.19.8

package/README.md

@@ -54,9 +54,10 @@ We use [Lit](https://lit.dev/) to create web components.
 
 We have split the package into two parts:
 
-- The components, which are web components that can be used in the browser.
+- The web components that can be used in the browser.
     - They can be imported with `import '@genspectrum/dashboard-components/components';`
-- utility functions, which can also be used in a node environment.
+    - Note that this imports all components at once. The `import` statement will make the web components available in the browser.
+- Utility functions, types and constants which can also be used in a node environment.
     - They can be imported with `import '@genspectrum/dashboard-components/util';`
 
 We primarily provide two kinds of components:
@@ -65,7 +66,7 @@ We primarily provide two kinds of components:
     - Those components fetch data from the LAPIS instance and visualize it.
 - **Input components** that let you specify sequence filters for the LAPIS requests.
     - Input changes will fire events that can be listened to by the visualization components.
-      It is the responsibility of the dashbaord maintainer to listen to those events
+      It is the responsibility of the dashboard maintainer to listen to those events
       and to wire the data correctly into the visualization components.
 
 ## Local Development
@@ -105,16 +106,26 @@ npm run storybook
 ```
 
 Then, open http://localhost:6006/ and http://localhost:6007/ in your browser.
-The Storybook on port 6007 uses the Preact build.
-The Storybook on port 6006 uses the Lit build and includes the Preact Storybook.
-Note that some Storybook integrations (such as interaction tests) do not work in the included Storybook.
-We only deploy the Lit part of the Storybook to GitHub pages.
 
+The Storybook on port 6006 uses the Lit build.
+Its purpose is public documentation and live demonstration of the publicly available web components.
+It should focus on stories that are relevant for users of the components.
+This storybook is deployed to GitHub pages.
+
+Every web component should have a separate "Docs" page.
 Storybook offers an integration of the custom-elements.json that can generate doc pages for the web components.
 Refer to the
 [Custom Elements Manifest Docs](https://custom-elements-manifest.open-wc.org/analyzer/getting-started/#documenting-your-components)
 for how to document the components using JSDoc.
 
+The Storybook on port 6007 uses the Preact build.
+Its purpose is to test the components in a Preact environment.
+It is not meant to be used outside the development environment
+and contains many stories that are not relevant for the public (e.g. because they serve as a unit test for some edge case).
+It should contain stories and corresponding unit tests for every Preact component that is relevant in a wider context
+(either because it is a top level component that is also exposed as a web component
+or because it is supposed to be reusable in other components).
+
 ### Testing
 
 We use vitest to run our unit tests:
@@ -147,7 +158,12 @@ We follow this testing concept:
 
 #### Mocking
 
-All our tests use mock data. In general, we use `storybook-addon-fetch-mock` for all outgoing requests. This strategy
+All our tests use mock data.
+Make sure that stories don't issue actual HTTP calls to LAPIS or other services.
+This is to make sure that we have stable tests in CI that don't depend on the availability of other services.
+We still use the real LAPIS URL so that a user can change the filters in a story and will still see data.
+
+In general, we use `storybook-addon-fetch-mock` for all outgoing requests. This strategy
 cannot be used for components that use web workers, like gs-mutations-over-time. Therefore, we created custom mock
 workers that return mocked data. The mock workers are enabled in the package.json using
 Node.js [subpath imports](https://nodejs.org/api/packages.html#subpath-imports), following the guide

package/custom-elements.json

@@ -594,7 +594,7 @@
           "type": {
             "text": "Meta<Required<LineageFilterProps>>"
           },
-          "default": "{ title: 'Input/Lineage filter', component: 'gs-lineage-filter', parameters: withComponentDocs({ actions: { handles: [gsEventNames.lineageFilterChanged, ...previewHandles], }, fetchMock: { mocks: [ { matcher: { name: 'pangoLineage', url: AGGREGATED_ENDPOINT, body: { fields: ['pangoLineage'], country: 'Germany', }, }, response: { status: 200, body: aggregatedData, }, }, ], }, componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, }), tags: ['autodocs'], argTypes: { lapisField: { control: { type: 'select', }, options: ['host'], }, placeholderText: { control: { type: 'text', }, }, value: { control: { type: 'text', }, }, width: { control: { type: 'text', }, }, lapisFilter: { control: { type: 'object', }, }, }, }"
+          "default": "{ title: 'Input/Lineage filter', component: 'gs-lineage-filter', parameters: withComponentDocs({ actions: { handles: [gsEventNames.lineageFilterChanged, ...previewHandles], }, fetchMock: { mocks: [ { matcher: { name: 'pangoLineage', url: AGGREGATED_ENDPOINT, body: { fields: ['pangoLineage'], country: 'Germany', }, }, response: { status: 200, body: aggregatedData, }, }, { matcher: { name: 'lineageDefinition', url: lineageDefinitionEndpoint(LAPIS_URL, 'pangoLineage'), }, response: { status: 200, body: lineageDefinition, }, }, ], }, componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, }), tags: ['autodocs'], argTypes: { lapisField: { control: { type: 'select', }, options: ['host'], }, placeholderText: { control: { type: 'text', }, }, value: { control: { type: 'text', }, }, width: { control: { type: 'text', }, }, lapisFilter: { control: { type: 'object', }, }, }, }"
         },
         {
           "kind": "variable",
@@ -626,7 +626,7 @@
           "type": {
             "text": "StoryObj<Required<LineageFilterProps>>"
           },
-          "default": "{ ...LineageFilter, play: async ({ canvasElement, step }) => { const canvas = await withinShadowRoot(canvasElement, 'gs-lineage-filter'); const inputField = () => canvas.getByPlaceholderText('Enter a lineage'); const listenerMock = fn(); await step('Setup event listener mock', () => { canvasElement.addEventListener(gsEventNames.lineageFilterChanged, listenerMock); }); await step('wait until data is loaded', async () => { await waitFor(() => { return expect(inputField()).toBeEnabled(); }); }); await step('Enters an invalid lineage value', async () => { await userEvent.type(inputField(), 'notInList'); await expect(listenerMock).not.toHaveBeenCalled(); }); await step('Empty input', async () => { await userEvent.type(inputField(), '{backspace>9/}'); await userEvent.click(canvas.getByLabelText('toggle menu')); await waitFor(() => { return expect(listenerMock.mock.calls.at(-1)![0].detail).toStrictEqual({ pangoLineage: undefined, }); }); }); await step('Enter a valid lineage value', async () => { await userEvent.type(inputField(), 'B.1.1.7*'); await userEvent.click(canvas.getByRole('option', { name: 'B.1.1.7*' })); await waitFor(() => { return expect(listenerMock.mock.calls.at(-1)![0].detail).toStrictEqual({ pangoLineage: 'B.1.1.7*', }); }); }); }, args: { ...LineageFilter.args, value: '', }, }"
+          "default": "{ ...LineageFilter, play: async ({ canvasElement, step }) => { const canvas = await withinShadowRoot(canvasElement, 'gs-lineage-filter'); const inputField = () => canvas.getByPlaceholderText('Enter a lineage'); const listenerMock = fn(); await step('Setup event listener mock', () => { canvasElement.addEventListener(gsEventNames.lineageFilterChanged, listenerMock); }); await step('wait until data is loaded', async () => { await waitFor(() => { return expect(inputField()).toBeEnabled(); }); }); await step('Enters an invalid lineage value', async () => { await userEvent.type(inputField(), 'notInList'); await expect(listenerMock).not.toHaveBeenCalled(); }); await step('Empty input', async () => { await userEvent.type(inputField(), '{backspace>9/}'); await userEvent.click(canvas.getByLabelText('toggle menu')); await waitFor(() => { return expect(listenerMock.mock.calls.at(-1)![0].detail).toStrictEqual({ pangoLineage: undefined, }); }); }); await step('Enter a valid lineage value', async () => { await userEvent.type(inputField(), 'B.1.1.7*'); await userEvent.click(canvas.getByRole('option', { name: 'B.1.1.7*(677146)' })); await waitFor(() => { return expect(listenerMock.mock.calls.at(-1)![0].detail).toStrictEqual({ pangoLineage: 'B.1.1.7*', }); }); }); }, args: { ...LineageFilter.args, value: '', }, }"
         }
       ],
       "exports": [
@@ -1323,14 +1323,14 @@
           "events": [
             {
               "type": {
-                "text": "CustomEvent<Record<string, string | undefined>>"
+                "text": "CustomEvent<Record<string, number | undefined>>"
               },
               "description": "Fired when the slider is released, `onBlur` on the input fields after the user has typed a valid range in the input fields, or when one of the input fields is cleared. The `details` of this event contain an object with `${lapisField}From` and `${lapisField}To` as keys. The values are the numbers from the input fields or `undefined` if the input field is empty: ``` { [`${lapisField}From`]: number | undefined [`${lapisField}To`]: number | undefined } ``` Example: ``` { ageFrom: 18, ageTo: undefined } ```",
               "name": "gs-number-range-filter-changed"
             },
             {
               "type": {
-                "text": "CustomEvent<Record<string, string | undefined>>"
+                "text": "CustomEvent<Record<string, number | undefined>>"
               },
               "description": "Similar to the `gs-number-range-filter-changed` event, but contains an `event.detail` that has a fixed format: ``` { min: number | undefined max: number | undefined } ``` This event should be used when you want to control this component externally. The `event.detail` can be used as the value of the component. Example: ``` { min: 18, max: undefined } ```",
               "name": "gs-number-range-value-changed"

package/dist/{LineageFilterChangedEvent-Cqa8Frcf.js → NumberRangeFilterChangedEvent-RZ8haPHq.js}

@@ -143,17 +143,42 @@ class LineageFilterChangedEvent extends CustomEvent {
     });
   }
 }
+const numberRangeSchema = z.object({
+  min: z.number().optional(),
+  max: z.number().optional()
+});
+class NumberRangeValueChangedEvent extends CustomEvent {
+  constructor(detail) {
+    super(gsEventNames.numberRangeValueChanged, {
+      detail,
+      bubbles: true,
+      composed: true
+    });
+  }
+}
+class NumberRangeFilterChangedEvent extends CustomEvent {
+  constructor(detail) {
+    super(gsEventNames.numberRangeFilterChanged, {
+      detail,
+      bubbles: true,
+      composed: true
+    });
+  }
+}
 export {
   DateRangeOptionChangedEvent as D,
   LocationChangedEvent as L,
+  NumberRangeFilterChangedEvent as N,
   TextFilterChangedEvent as T,
   LineageFilterChangedEvent as a,
-  dateRangeValueSchema as b,
-  dateRangeOptionSchema as c,
+  NumberRangeValueChangedEvent as b,
+  dateRangeValueSchema as c,
   dateRangeOptionPresets as d,
-  toYYYYMMDD as e,
-  lapisLocationFilterSchema as f,
+  dateRangeOptionSchema as e,
+  toYYYYMMDD as f,
   gsEventNames as g,
+  lapisLocationFilterSchema as h,
+  numberRangeSchema as i,
   lapisFilterSchema as l,
   mutationsFilterSchema as m,
   namedLapisFilterSchema as n,
@@ -161,4 +186,4 @@ export {
   temporalGranularitySchema as t,
   views as v
 };
-//# sourceMappingURL=LineageFilterChangedEvent-Cqa8Frcf.js.map
+//# sourceMappingURL=NumberRangeFilterChangedEvent-RZ8haPHq.js.map

package/dist/NumberRangeFilterChangedEvent-RZ8haPHq.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"NumberRangeFilterChangedEvent-RZ8haPHq.js","sources":["../src/utils/gsEventNames.ts","../src/types.ts","../src/preact/dateRangeFilter/dateConversion.ts","../src/preact/dateRangeFilter/dateRangeOption.ts","../src/preact/locationFilter/LocationChangedEvent.ts","../src/preact/textFilter/TextFilterChangedEvent.ts","../src/preact/lineageFilter/LineageFilterChangedEvent.ts","../src/preact/numberRangeFilter/NumberRangeFilterChangedEvent.ts"],"sourcesContent":["export const gsEventNames = {\n    error: 'gs-error',\n    componentFinishedLoading: 'gs-component-finished-loading',\n    dateRangeFilterChanged: 'gs-date-range-filter-changed',\n    dateRangeOptionChanged: 'gs-date-range-option-changed',\n    mutationFilterChanged: 'gs-mutation-filter-changed',\n    lineageFilterChanged: 'gs-lineage-filter-changed',\n    locationChanged: 'gs-location-changed',\n    textFilterChanged: 'gs-text-filter-changed',\n    numberRangeFilterChanged: 'gs-number-range-filter-changed',\n    numberRangeValueChanged: 'gs-number-range-value-changed',\n} as const;\n","import z from 'zod';\n\nimport {\n    type Deletion,\n    type DeletionClass,\n    type Insertion,\n    type InsertionClass,\n    type Substitution,\n    type SubstitutionClass,\n} from './utils/mutations';\n\nexport const mutationsFilterSchema = z.object({\n    nucleotideMutations: z.array(z.string()),\n    aminoAcidMutations: z.array(z.string()),\n    nucleotideInsertions: z.array(z.string()),\n    aminoAcidInsertions: z.array(z.string()),\n});\nexport type MutationsFilter = z.infer<typeof mutationsFilterSchema>;\n\nexport const lapisFilterSchema = z\n    .record(z.union([z.string(), z.array(z.string()), z.number(), z.null(), z.boolean(), z.undefined()]))\n    .and(mutationsFilterSchema.partial());\nexport type LapisFilter = z.infer<typeof lapisFilterSchema>;\n\nexport const namedLapisFilterSchema = z.object({\n    lapisFilter: lapisFilterSchema,\n    displayName: z.string(),\n});\nexport type NamedLapisFilter = z.infer<typeof namedLapisFilterSchema>;\n\nexport const lapisLocationFilterSchema = z.record(z.union([z.string(), z.undefined()]));\nexport type LapisLocationFilter = z.infer<typeof lapisLocationFilterSchema>;\n\nexport const temporalGranularitySchema = z.union([\n    z.literal('day'),\n    z.literal('week'),\n    z.literal('month'),\n    z.literal('year'),\n]);\nexport type TemporalGranularity = z.infer<typeof temporalGranularitySchema>;\n\nexport const sequenceTypeSchema = z.union([z.literal('nucleotide'), z.literal('amino acid')]);\nexport type SequenceType = z.infer<typeof sequenceTypeSchema>;\n\nexport type SubstitutionOrDeletion = 'substitution' | 'deletion';\n\nexport type MutationType = SubstitutionOrDeletion | 'insertion';\n\nexport type SubstitutionEntry<T extends Substitution = SubstitutionClass> = {\n    type: 'substitution';\n    mutation: T;\n    count: number;\n    proportion: number;\n};\n\nexport type DeletionEntry<T extends Deletion = DeletionClass> = {\n    type: 'deletion';\n    mutation: T;\n    count: number;\n    proportion: number;\n};\n\nexport type InsertionEntry<T extends Insertion = InsertionClass> = { type: 'insertion'; mutation: T; count: number };\n\nexport type SubstitutionOrDeletionEntry<\n    S extends Substitution = SubstitutionClass,\n    D extends Deletion = DeletionClass,\n> = SubstitutionEntry<S> | DeletionEntry<D>;\n\nexport type MutationEntry = SubstitutionEntry | DeletionEntry | InsertionEntry;\n\nexport const views = {\n    table: 'table',\n    venn: 'venn',\n    grid: 'grid',\n    insertions: 'insertions',\n    bar: 'bar',\n    line: 'line',\n    bubble: 'bubble',\n    map: 'map',\n} as const;\n","export const toYYYYMMDD = (date: Date) => {\n    const options: Intl.DateTimeFormatOptions = { year: 'numeric', month: '2-digit', day: '2-digit' };\n    return date.toLocaleDateString('en-CA', options);\n};\n","import z from 'zod';\n\nimport { toYYYYMMDD } from './dateConversion';\nimport { gsEventNames } from '../../utils/gsEventNames';\n\n/**\n * A date range option that can be used in the `gs-date-range-filter` component.\n */\nexport const dateRangeOptionSchema = z.object({\n    /** The label of the date range option that will be shown to the user */\n    label: z.string(),\n    /**\n     * The start date of the date range in the format `YYYY-MM-DD`.\n     * If not set, the date range selector will default to the `earliestDate` property.\n     */\n    dateFrom: z.string().date().optional(),\n    /**\n     * The end date of the date range in the format `YYYY-MM-DD`.\n     * If not set, the date range selector will default to the current date.\n     */\n    dateTo: z.string().date().optional(),\n});\n\nexport type DateRangeOption = z.infer<typeof dateRangeOptionSchema>;\n\nexport const dateRangeValueSchema = z\n    .union([\n        z.string(),\n        z.object({\n            dateFrom: z.string().date().optional(),\n            dateTo: z.string().date().optional(),\n        }),\n    ])\n    .nullable();\n\nexport type DateRangeValue = z.infer<typeof dateRangeValueSchema>;\n\nexport class DateRangeOptionChangedEvent extends CustomEvent<DateRangeValue> {\n    constructor(detail: DateRangeValue) {\n        super(gsEventNames.dateRangeOptionChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n\nconst today = new Date();\n\nconst twoWeeksAgo = new Date();\ntwoWeeksAgo.setDate(today.getDate() - 14);\n\nconst lastMonth = new Date(today);\nlastMonth.setMonth(today.getMonth() - 1);\n\nconst last2Months = new Date(today);\nlast2Months.setMonth(today.getMonth() - 2);\n\nconst last3Months = new Date(today);\nlast3Months.setMonth(today.getMonth() - 3);\n\nconst last6Months = new Date(today);\nlast6Months.setMonth(today.getMonth() - 6);\n\nconst lastYear = new Date(today);\nlastYear.setFullYear(today.getFullYear() - 1);\n\n/**\n * Presets for the `gs-date-range-filter` component that can be used as `dateRangeOptions`.\n */\nexport const dateRangeOptionPresets = {\n    last2Weeks: {\n        label: 'Last 2 weeks',\n        dateFrom: toYYYYMMDD(twoWeeksAgo),\n    },\n    lastMonth: {\n        label: 'Last month',\n        dateFrom: toYYYYMMDD(lastMonth),\n    },\n    last2Months: {\n        label: 'Last 2 months',\n        dateFrom: toYYYYMMDD(last2Months),\n    },\n    last3Months: {\n        label: 'Last 3 months',\n        dateFrom: toYYYYMMDD(last3Months),\n    },\n    last6Months: {\n        label: 'Last 6 months',\n        dateFrom: toYYYYMMDD(last6Months),\n    },\n    lastYear: {\n        label: 'Last year',\n        dateFrom: toYYYYMMDD(lastYear),\n    },\n    allTimes: {\n        label: 'All times',\n    },\n} satisfies Record<string, DateRangeOption>;\n","import { type LapisLocationFilter } from '../../types';\nimport { gsEventNames } from '../../utils/gsEventNames';\n\nexport class LocationChangedEvent extends CustomEvent<LapisLocationFilter> {\n    constructor(detail: LapisLocationFilter) {\n        super(gsEventNames.locationChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n","import { gsEventNames } from '../../utils/gsEventNames';\n\ntype LapisTextFilter = Record<string, string | undefined>;\n\nexport class TextFilterChangedEvent extends CustomEvent<LapisTextFilter> {\n    constructor(detail: LapisTextFilter) {\n        super(gsEventNames.textFilterChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n","import { gsEventNames } from '../../utils/gsEventNames';\n\ntype LapisLineageFilter = Record<string, string | undefined>;\n\nexport class LineageFilterChangedEvent extends CustomEvent<LapisLineageFilter> {\n    constructor(detail: LapisLineageFilter) {\n        super(gsEventNames.lineageFilterChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n","import z from 'zod';\n\nimport { gsEventNames } from '../../utils/gsEventNames';\n\nexport type LapisNumberFilter = Record<string, number | undefined>;\n\nexport const numberRangeSchema = z.object({\n    min: z.number().optional(),\n    max: z.number().optional(),\n});\nexport type NumberRange = z.infer<typeof numberRangeSchema>;\n\nexport class NumberRangeValueChangedEvent extends CustomEvent<NumberRange> {\n    constructor(detail: NumberRange) {\n        super(gsEventNames.numberRangeValueChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n\nexport class NumberRangeFilterChangedEvent extends CustomEvent<LapisNumberFilter> {\n    constructor(detail: LapisNumberFilter) {\n        super(gsEventNames.numberRangeFilterChanged, {\n            detail,\n            bubbles: true,\n            composed: true,\n        });\n    }\n}\n"],"names":[],"mappings":"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"}