@genspectrum/dashboard-components 0.17.0 → 0.17.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/custom-elements.json +44 -13
  2. package/dist/components.d.ts +18 -14
  3. package/dist/components.js +557 -99
  4. package/dist/components.js.map +1 -1
  5. package/dist/style.css +318 -6
  6. package/dist/util.d.ts +12 -12
  7. package/package.json +2 -1
  8. package/src/preact/mutationsOverTime/mutations-over-time-grid.tsx +133 -84
  9. package/src/preact/mutationsOverTime/mutations-over-time.stories.tsx +46 -16
  10. package/src/preact/mutationsOverTime/mutations-over-time.tsx +3 -0
  11. package/src/preact/shared/tanstackTable/pagination.tsx +132 -0
  12. package/src/preact/shared/tanstackTable/tanstackTable.tsx +43 -0
  13. package/src/preact/wastewater/mutationsOverTime/wastewater-mutations-over-time.stories.tsx +2 -1
  14. package/src/preact/wastewater/mutationsOverTime/wastewater-mutations-over-time.tsx +3 -5
  15. package/src/web-components/visualization/gs-mutations-over-time.spec-d.ts +39 -0
  16. package/src/web-components/visualization/gs-mutations-over-time.stories.ts +4 -0
  17. package/src/web-components/visualization/gs-mutations-over-time.tsx +8 -31
  18. package/src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.spec-d.ts +24 -0
  19. package/src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.stories.ts +3 -3
  20. package/src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.tsx +5 -36
  21. package/standalone-bundle/dashboard-components.js +17733 -15921
  22. package/standalone-bundle/dashboard-components.js.map +1 -1
  23. package/standalone-bundle/style.css +1 -1
@@ -2063,6 +2063,12 @@
2063
2063
  }
2064
2064
  ]
2065
2065
  },
2066
+ {
2067
+ "kind": "javascript-module",
2068
+ "path": "src/web-components/visualization/gs-mutations-over-time.spec-d.ts",
2069
+ "declarations": [],
2070
+ "exports": []
2071
+ },
2066
2072
  {
2067
2073
  "kind": "javascript-module",
2068
2074
  "path": "src/web-components/visualization/gs-mutations-over-time.stories.ts",
@@ -2073,7 +2079,7 @@
2073
2079
  "type": {
2074
2080
  "text": "Meta<Required<MutationsOverTimeProps>>"
2075
2081
  },
2076
- "default": "{ title: 'Visualization/Mutations over time', component: 'gs-mutations-over-time', argTypes: { lapisFilter: { control: 'object' }, sequenceType: { options: ['nucleotide', 'amino acid'], control: { type: 'radio' }, }, views: { options: ['grid'], control: { type: 'check' }, }, width: { control: 'text' }, height: { control: 'text' }, granularity: { options: ['day', 'week', 'month', 'year'], control: { type: 'radio' }, }, lapisDateField: { control: 'text' }, displayMutations: { control: 'object' }, initialMeanProportionInterval: { control: 'object' }, }, args: { lapisFilter: { pangoLineage: 'JN.1*', dateFrom: '2024-01-15', dateTo: '2024-07-10' }, sequenceType: 'nucleotide', views: ['grid'], width: '100%', granularity: 'month', lapisDateField: 'date', initialMeanProportionInterval: { min: 0.05, max: 0.9 }, }, parameters: withComponentDocs({ componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, fetchMock: {}, }), tags: ['autodocs'], }"
2082
+ "default": "{ title: 'Visualization/Mutations over time', component: 'gs-mutations-over-time', argTypes: { lapisFilter: { control: 'object' }, sequenceType: { options: ['nucleotide', 'amino acid'], control: { type: 'radio' }, }, views: { options: ['grid'], control: { type: 'check' }, }, width: { control: 'text' }, height: { control: 'text' }, granularity: { options: ['day', 'week', 'month', 'year'], control: { type: 'radio' }, }, lapisDateField: { control: 'text' }, displayMutations: { control: 'object' }, initialMeanProportionInterval: { control: 'object' }, pageSizes: { control: 'object' }, }, args: { lapisFilter: { pangoLineage: 'JN.1*', dateFrom: '2024-01-15', dateTo: '2024-07-10' }, sequenceType: 'nucleotide', views: ['grid'], width: '100%', granularity: 'month', lapisDateField: 'date', initialMeanProportionInterval: { min: 0.05, max: 0.9 }, pageSizes: [10, 20, 30, 40, 50], }, parameters: withComponentDocs({ componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, fetchMock: {}, }), tags: ['autodocs'], }"
2077
2083
  },
2078
2084
  {
2079
2085
  "kind": "variable",
@@ -2281,6 +2287,16 @@
2281
2287
  "default": "{ min: 0.05, max: 0.9 }",
2282
2288
  "description": "The initial proportion interval for the grid view.\nThe values must be between 0 and 1, inclusive.",
2283
2289
  "attribute": "initialMeanProportionInterval"
2290
+ },
2291
+ {
2292
+ "kind": "field",
2293
+ "name": "pageSizes",
2294
+ "type": {
2295
+ "text": "number[] | number"
2296
+ },
2297
+ "default": "[10, 20, 30, 40, 50]",
2298
+ "description": "The number of rows per page, which can be selected by the user.",
2299
+ "attribute": "pageSizes"
2284
2300
  }
2285
2301
  ],
2286
2302
  "attributes": [
@@ -2364,6 +2380,15 @@
2364
2380
  "default": "{ min: 0.05, max: 0.9 }",
2365
2381
  "description": "The initial proportion interval for the grid view.\nThe values must be between 0 and 1, inclusive.",
2366
2382
  "fieldName": "initialMeanProportionInterval"
2383
+ },
2384
+ {
2385
+ "name": "pageSizes",
2386
+ "type": {
2387
+ "text": "number[] | number"
2388
+ },
2389
+ "default": "[10, 20, 30, 40, 50]",
2390
+ "description": "The number of rows per page, which can be selected by the user.",
2391
+ "fieldName": "pageSizes"
2367
2392
  }
2368
2393
  ],
2369
2394
  "superclass": {
@@ -4219,6 +4244,12 @@
4219
4244
  }
4220
4245
  ]
4221
4246
  },
4247
+ {
4248
+ "kind": "javascript-module",
4249
+ "path": "src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.spec-d.ts",
4250
+ "declarations": [],
4251
+ "exports": []
4252
+ },
4222
4253
  {
4223
4254
  "kind": "javascript-module",
4224
4255
  "path": "src/web-components/wastewaterVisualization/gs-wastewater-mutations-over-time.stories.ts",
@@ -4229,7 +4260,7 @@
4229
4260
  "type": {
4230
4261
  "text": "Meta<WastewaterMutationsOverTimeProps & { infoText: string }>"
4231
4262
  },
4232
- "default": "{ title: 'Wastewater visualization/Wastewater mutations over time', component: 'gs-wastewater-mutations-over-time', argTypes: { lapisFilter: { control: 'object' }, sequenceType: { options: ['nucleotide', 'amino acid'], control: { type: 'radio' }, }, width: { control: 'text' }, height: { control: 'text' }, }, args: { lapisFilter: { versionStatus: 'LATEST_VERSION', isRevocation: false }, sequenceType: 'nucleotide', width: '100%', height: undefined, infoText: 'Some info text', maxNumberOfGridRows: 100, }, parameters: withComponentDocs({ componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, fetchMock: {}, }), tags: ['autodocs'], }"
4263
+ "default": "{ title: 'Wastewater visualization/Wastewater mutations over time', component: 'gs-wastewater-mutations-over-time', argTypes: { lapisFilter: { control: 'object' }, sequenceType: { options: ['nucleotide', 'amino acid'], control: { type: 'radio' }, }, width: { control: 'text' }, height: { control: 'text' }, }, args: { lapisFilter: { versionStatus: 'LATEST_VERSION', isRevocation: false }, sequenceType: 'nucleotide', width: '100%', height: undefined, infoText: 'Some info text', pageSizes: [10, 20, 30, 40, 50], }, parameters: withComponentDocs({ componentDocs: { opensShadowDom: true, expectsChildren: false, codeExample, }, fetchMock: {}, }), tags: ['autodocs'], }"
4233
4264
  },
4234
4265
  {
4235
4266
  "kind": "variable",
@@ -4237,7 +4268,7 @@
4237
4268
  "type": {
4238
4269
  "text": "StoryObj<WastewaterMutationsOverTimeProps & { infoText: string }>"
4239
4270
  },
4240
- "default": "{ render: (args) => html` <gs-app lapis=\"${WISE_LAPIS_URL}\" .mutationAnnotations=${mutationAnnotations}> <gs-wastewater-mutations-over-time .lapisFilter=${args.lapisFilter} .sequenceType=${args.sequenceType} .width=${args.width} .height=${args.height} .maxNumberOfGridRows=${args.maxNumberOfGridRows} > <span slot=\"infoText\">${args.infoText}</span> </gs-wastewater-mutations-over-time> </gs-app> `, parameters: { fetchMock: { mocks: [ { matcher: { name: 'details', url: WISE_DETAILS_ENDPOINT, body: { fields: ['date', 'location', 'nucleotideMutationFrequency', 'aminoAcidMutationFrequency'], versionStatus: 'LATEST_VERSION', isRevocation: false, }, }, response: { status: 200, body: details, }, }, ], }, }, }"
4271
+ "default": "{ render: (args) => html` <gs-app lapis=\"${WISE_LAPIS_URL}\" .mutationAnnotations=${mutationAnnotations}> <gs-wastewater-mutations-over-time .lapisFilter=${args.lapisFilter} .sequenceType=${args.sequenceType} .width=${args.width} .height=${args.height} .pageSizes=${args.pageSizes} > <span slot=\"infoText\">${args.infoText}</span> </gs-wastewater-mutations-over-time> </gs-app> `, parameters: { fetchMock: { mocks: [ { matcher: { name: 'details', url: WISE_DETAILS_ENDPOINT, body: { fields: ['date', 'location', 'nucleotideMutationFrequency', 'aminoAcidMutationFrequency'], versionStatus: 'LATEST_VERSION', isRevocation: false, }, }, response: { status: 200, body: details, }, }, ], }, }, }"
4241
4272
  },
4242
4273
  {
4243
4274
  "kind": "variable",
@@ -4332,13 +4363,13 @@
4332
4363
  },
4333
4364
  {
4334
4365
  "kind": "field",
4335
- "name": "maxNumberOfGridRows",
4366
+ "name": "pageSizes",
4336
4367
  "type": {
4337
- "text": "number"
4368
+ "text": "number[] | number"
4338
4369
  },
4339
- "default": "100",
4340
- "description": "The maximum number of grid rows to display.",
4341
- "attribute": "maxNumberOfGridRows"
4370
+ "default": "[10, 20, 30, 40, 50]",
4371
+ "description": "The number of rows per page, which can be selected by the user.",
4372
+ "attribute": "pageSizes"
4342
4373
  }
4343
4374
  ],
4344
4375
  "attributes": [
@@ -4379,13 +4410,13 @@
4379
4410
  "fieldName": "height"
4380
4411
  },
4381
4412
  {
4382
- "name": "maxNumberOfGridRows",
4413
+ "name": "pageSizes",
4383
4414
  "type": {
4384
- "text": "number"
4415
+ "text": "number[] | number"
4385
4416
  },
4386
- "default": "100",
4387
- "description": "The maximum number of grid rows to display.",
4388
- "fieldName": "maxNumberOfGridRows"
4417
+ "default": "[10, 20, 30, 40, 50]",
4418
+ "description": "The number of rows per page, which can be selected by the user.",
4419
+ "fieldName": "pageSizes"
4389
4420
  }
4390
4421
  ],
4391
4422
  "superclass": {
@@ -703,6 +703,10 @@ export declare class MutationsOverTimeComponent extends PreactLitAdapterWithGrid
703
703
  min: number;
704
704
  max: number;
705
705
  };
706
+ /**
707
+ * The number of rows per page, which can be selected by the user.
708
+ */
709
+ pageSizes: number[] | number;
706
710
  /* Excluded from this release type: mutationAnnotations */
707
711
  render(): JSX_2.Element;
708
712
  }
@@ -1375,9 +1379,9 @@ export declare class WastewaterMutationsOverTimeComponent extends PreactLitAdapt
1375
1379
  */
1376
1380
  height: string | undefined;
1377
1381
  /**
1378
- * The maximum number of grid rows to display.
1382
+ * The number of rows per page, which can be selected by the user.
1379
1383
  */
1380
- maxNumberOfGridRows: number;
1384
+ pageSizes: number[] | number;
1381
1385
  /* Excluded from this release type: mutationAnnotations */
1382
1386
  render(): JSX_2.Element;
1383
1387
  }
@@ -1490,7 +1494,7 @@ declare global {
1490
1494
 
1491
1495
  declare global {
1492
1496
  interface HTMLElementTagNameMap {
1493
- 'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
1497
+ 'gs-mutations-over-time': MutationsOverTimeComponent;
1494
1498
  }
1495
1499
  }
1496
1500
 
@@ -1498,7 +1502,7 @@ declare global {
1498
1502
  declare global {
1499
1503
  namespace JSX {
1500
1504
  interface IntrinsicElements {
1501
- 'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1505
+ 'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1502
1506
  }
1503
1507
  }
1504
1508
  }
@@ -1506,7 +1510,7 @@ declare global {
1506
1510
 
1507
1511
  declare global {
1508
1512
  interface HTMLElementTagNameMap {
1509
- 'gs-mutations-over-time': MutationsOverTimeComponent;
1513
+ 'gs-number-sequences-over-time': NumberSequencesOverTimeComponent;
1510
1514
  }
1511
1515
  }
1512
1516
 
@@ -1514,7 +1518,7 @@ declare global {
1514
1518
  declare global {
1515
1519
  namespace JSX {
1516
1520
  interface IntrinsicElements {
1517
- 'gs-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1521
+ 'gs-number-sequences-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1518
1522
  }
1519
1523
  }
1520
1524
  }
@@ -1554,11 +1558,7 @@ declare global {
1554
1558
 
1555
1559
  declare global {
1556
1560
  interface HTMLElementTagNameMap {
1557
- 'gs-date-range-filter': DateRangeFilterComponent;
1558
- }
1559
- interface HTMLElementEventMap {
1560
- 'gs-date-range-filter-changed': CustomEvent<Record<string, string>>;
1561
- 'gs-date-range-option-changed': DateRangeOptionChangedEvent;
1561
+ 'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
1562
1562
  }
1563
1563
  }
1564
1564
 
@@ -1566,7 +1566,7 @@ declare global {
1566
1566
  declare global {
1567
1567
  namespace JSX {
1568
1568
  interface IntrinsicElements {
1569
- 'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1569
+ 'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1570
1570
  }
1571
1571
  }
1572
1572
  }
@@ -1574,7 +1574,11 @@ declare global {
1574
1574
 
1575
1575
  declare global {
1576
1576
  interface HTMLElementTagNameMap {
1577
- 'gs-wastewater-mutations-over-time': WastewaterMutationsOverTimeComponent;
1577
+ 'gs-date-range-filter': DateRangeFilterComponent;
1578
+ }
1579
+ interface HTMLElementEventMap {
1580
+ 'gs-date-range-filter-changed': CustomEvent<Record<string, string>>;
1581
+ 'gs-date-range-option-changed': DateRangeOptionChangedEvent;
1578
1582
  }
1579
1583
  }
1580
1584
 
@@ -1582,7 +1586,7 @@ declare global {
1582
1586
  declare global {
1583
1587
  namespace JSX {
1584
1588
  interface IntrinsicElements {
1585
- 'gs-wastewater-mutations-over-time': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1589
+ 'gs-date-range-filter': DetailedHTMLProps<HTMLAttributes<HTMLElement>, HTMLElement>;
1586
1590
  }
1587
1591
  }
1588
1592
  }