@genspectrum/dashboard-components 1.5.0 → 1.6.0

package/custom-elements.json

@@ -1063,7 +1063,7 @@
           "type": {
             "text": "Meta<MutationFilterProps>"
           },
-          "default": "{ title: 'Input/Mutation filter', component: 'gs-mutation-filter', parameters: withComponentDocs({ actions: { handles: [gsEventNames.mutationFilterChanged, ...previewHandles], }, fetchMock: {}, componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, }), argTypes: { initialValue: { control: { type: 'object', }, }, width: { control: 'text' }, }, tags: ['autodocs'], }"
+          "default": "{ title: 'Input/Mutation filter', component: 'gs-mutation-filter', parameters: withComponentDocs({ actions: { handles: [gsEventNames.mutationFilterChanged, ...previewHandles], }, fetchMock: {}, componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, }), argTypes: { initialValue: { control: { type: 'object', }, }, width: { control: 'text' }, enabledMutationTypes: { control: { type: 'object', }, }, }, tags: ['autodocs'], }"
         },
         {
           "kind": "variable",
@@ -1081,6 +1081,14 @@
           },
           "default": "{ ...Template, play: async ({ canvasElement, step }) => { const canvas = await withinShadowRoot(canvasElement, 'gs-mutation-filter'); const inputField = () => canvas.getByPlaceholderText('Enter a mutation', { exact: false }); const listenerMock = fn(); await step('Setup event listener mock', () => { canvasElement.addEventListener(gsEventNames.mutationFilterChanged, listenerMock); }); await step('wait until data is loaded', async () => { await waitFor(() => { return expect(inputField()).toBeEnabled(); }); }); await step('Enter a valid mutation', async () => { await userEvent.type(inputField(), 'A123T'); const option = await canvas.findByRole('option'); await userEvent.click(option); await waitFor(() => expect(listenerMock).toHaveBeenCalledWith( expect.objectContaining({ detail: { nucleotideMutations: ['A123T'], aminoAcidMutations: [], nucleotideInsertions: [], aminoAcidInsertions: [], }, }), ), ); }); }, }"
         },
+        {
+          "kind": "variable",
+          "name": "RestrictEnabledMutationTypes",
+          "type": {
+            "text": "StoryObj<MutationFilterProps>"
+          },
+          "default": "{ ...Template, args: { ...Template.args, enabledMutationTypes: ['nucleotideMutations', 'aminoAcidMutations'], }, play: async ({ canvasElement }) => { const canvas = await withinShadowRoot(canvasElement, 'gs-mutation-filter'); const inputField = () => canvas.getByPlaceholderText('Enter a mutation', { exact: false }); await waitFor(async () => { const placeholderText = inputField().getAttribute('placeholder'); await expect(placeholderText).toEqual('Enter a mutation (e.g. 23T, E:57Q)'); }); }, }"
+        },
         {
           "kind": "variable",
           "name": "MultiSegmentedReferenceGenomes",
@@ -1115,6 +1123,14 @@
             "module": "src/web-components/input/gs-mutation-filter.stories.ts"
           }
         },
+        {
+          "kind": "js",
+          "name": "RestrictEnabledMutationTypes",
+          "declaration": {
+            "name": "RestrictEnabledMutationTypes",
+            "module": "src/web-components/input/gs-mutation-filter.stories.ts"
+          }
+        },
         {
           "kind": "js",
           "name": "MultiSegmentedReferenceGenomes",
@@ -1131,7 +1147,7 @@
       "declarations": [
         {
           "kind": "class",
-          "description": "## Context\nThis component provides an input field to specify filters for nucleotide and amino acid mutations and insertions.\n\nInput values have to be provided one at a time and submitted by pressing the Enter key or by selecting an option from the dropdown.\nAlternatively, they can be provided as a string of comma-separated values, which will be directly parsed and validated.\nAfter submission (after pressing Enter or pasting a comma-separated string) an event is fired with the selected mutations.\nAll previously selected mutations are displayed at the input field and added to the event.\nUsers can remove a mutation by clicking the 'x' button next to the mutation.\n\n## Input Validation\n\nValidation of the input is performed according to the following rules:\n\n### Mutations\n\nMutations have to conform to the following format: `<gene/segment>:<symbol at reference><position><Substituted symbol/Deletion>`\n- Gene/segment: The gene or segment where the mutation occurs. Must be contained in the reference genome.\n  (Optional for elements with only one gene/segment)\n- Symbol at reference: The symbol at the reference position. (Optional)\n- Position: The position of the mutation. (Required)\n- Substituted symbol/Deletion: The substituted symbol or '-' for a deletion. (Required)\n\nExamples: `S:614G`, `614G`, `614-`, `614G`\n\n### Insertions\n\nInsertions have to conform to the following format: `ins_<gene/segment>:<position>:<Inserted symbols>`\n- Gene/segment: The gene or segment where the insertion occurs. Must be contained in the reference genome.\n  (Optional for elements with only one gene/segment)\n- Position: The position of the insertion. (Required)\n- Inserted symbols: The symbols that are inserted. (Required)\n\nExamples: `ins_S:614:G`, `ins_614:G`",
+          "description": "## Context\nThis component provides an input field to specify filters for nucleotide and amino acid mutations and insertions.\n\nInput values have to be provided one at a time and submitted by pressing the Enter key or by selecting an option from the dropdown.\nAlternatively, they can be provided as a string of comma-separated values, which will be directly parsed and validated.\nAfter submission (after pressing Enter or pasting a comma-separated string) an event is fired with the selected mutations.\nAll previously selected mutations are displayed at the input field and added to the event.\nUsers can remove a mutation by clicking the 'x' button next to the mutation.\n\n## Input Validation\n\nValidation of the input is performed according to the following rules:\n\n### Mutations\n\nMutations have to conform to the following format: `<gene/segment>:<symbol at reference><position><Substituted symbol/Deletion>`\n- Gene/segment: The gene or segment where the mutation occurs. Must be contained in the reference genome.\n  (Optional for elements with only one gene/segment)\n- Symbol at reference: The symbol at the reference position. (Optional)\n- Position: The position of the mutation. (Required)\n- Substituted symbol/Deletion: The substituted symbol or '-' for a deletion. (Required)\n\nExamples: `S:614G`, `614G`, `614-`, `614G`\n\n### Insertions\n\nInsertions have to conform to the following format: `ins_<gene/segment>:<position>:<Inserted symbols>`\n- Gene/segment: The gene or segment where the insertion occurs. Must be contained in the reference genome.\n  (Optional for elements with only one gene/segment)\n- Position: The position of the insertion. (Required)\n- Inserted symbols: The symbols that are inserted. (Required)\n\nExamples: `ins_S:614:G`, `ins_614:G`\n\n### Enabled mutation types\n\nAfter parsing, the entered mutation/insertion also has to match the enabled mutation types,\nwhich are configured with the `enabledMutationTypes` attribute.",
           "name": "MutationFilterComponent",
           "members": [
             {
@@ -1153,6 +1169,16 @@
               "default": "'100%'",
               "description": "The width of the component.\n\nVisit https://genspectrum.github.io/dashboard-components/?path=/docs/concepts-size-of-components--docs for more information.",
               "attribute": "width"
+            },
+            {
+              "kind": "field",
+              "name": "enabledMutationTypes",
+              "type": {
+                "text": "MutationType[] | undefined"
+              },
+              "default": "undefined",
+              "description": "Which mutation types this input will accept.\nAny (or all) of the following can be given in a list:\n\n- `nucleotideMutations`\n- `nucleotideInsertions`\n- `aminoAcidMutations`\n- `aminoAcidInsertions`\n\nBy default or if none are given, all types are accepted.",
+              "attribute": "enabledMutationTypes"
             }
           ],
           "events": [
@@ -1182,6 +1208,15 @@
               "default": "'100%'",
               "description": "The width of the component.\n\nVisit https://genspectrum.github.io/dashboard-components/?path=/docs/concepts-size-of-components--docs for more information.",
               "fieldName": "width"
+            },
+            {
+              "name": "enabledMutationTypes",
+              "type": {
+                "text": "MutationType[] | undefined"
+              },
+              "default": "undefined",
+              "description": "Which mutation types this input will accept.\nAny (or all) of the following can be given in a list:\n\n- `nucleotideMutations`\n- `nucleotideInsertions`\n- `aminoAcidMutations`\n- `aminoAcidInsertions`\n\nBy default or if none are given, all types are accepted.",
+              "fieldName": "enabledMutationTypes"
             }
           ],
           "superclass": {