From 270653ce3aad9a45771d6ef9be94fc496e768337 Mon Sep 17 00:00:00 2001 From: Ronen Date: Tue, 20 Aug 2024 18:27:10 -0400 Subject: [PATCH] chore: Upgrade MUI and SDS - SCE-3 SCE-2 (#1075) --- .infra/rdev/values.yaml | 2 +- ...ctions-whole-diffexp-1-chromium-darwin.txt | 2 +- ...actions-whole-diffexp-1-chromium-linux.txt | 2 +- ...ctions-whole-diffexp-2-chromium-darwin.txt | 2 +- ...actions-whole-diffexp-2-chromium-linux.txt | 2 +- ...ctions-whole-diffexp-1-chromium-darwin.txt | 2 +- ...actions-whole-diffexp-1-chromium-linux.txt | 2 +- ...ctions-whole-diffexp-2-chromium-darwin.txt | 2 +- ...actions-whole-diffexp-2-chromium-linux.txt | 2 +- client/package-lock.json | 811 +++++++++--------- client/package.json | 15 +- client/src/common/style.ts | 17 + client/src/components/BottomBanner/index.tsx | 78 +- client/src/components/BottomBanner/style.ts | 2 +- .../NavBar/components/NavDivider/style.ts | 6 +- client/src/components/NavBar/style.ts | 4 +- client/src/components/app.tsx | 6 +- .../components/categorical/value/index.tsx | 35 +- client/src/components/diffexNotice/style.ts | 4 +- .../Opacities/components/Opacity/index.tsx | 10 +- .../Opacities/components/Opacity/style.ts | 3 +- .../embedding/components/Opacities/index.tsx | 6 +- .../components/geneExpression/gene/index.tsx | 34 +- .../common/infoPanelContainer/index.tsx | 2 +- .../infoPanel/common/infoPanelParts/index.tsx | 6 +- .../common}/infoSearch/connect.ts | 4 +- .../common}/infoSearch/index.tsx | 2 +- .../common/infoSearch/style.ts} | 0 .../common}/infoSearch/types.ts | 2 +- .../geneExpression/infoPanel/common/style.ts | 71 +- .../geneExpression/infoPanel/connect.ts | 4 +- .../geneExpression/infoPanel/index.tsx | 2 +- .../infoPanel/infoPanelGene/index.tsx | 1 - .../components/geneExpression/quickGene.tsx | 6 +- client/src/components/theme.ts | 391 ++++++--- client/src/reducers/controls.ts | 2 +- 36 files changed, 834 insertions(+), 708 deletions(-) create mode 100644 client/src/common/style.ts rename client/src/components/geneExpression/{ => infoPanel/common}/infoSearch/connect.ts (93%) rename client/src/components/geneExpression/{ => infoPanel/common}/infoSearch/index.tsx (97%) rename client/src/components/geneExpression/{infoSearch/styles.ts => infoPanel/common/infoSearch/style.ts} (100%) rename client/src/components/geneExpression/{ => infoPanel/common}/infoSearch/types.ts (92%) diff --git a/.infra/rdev/values.yaml b/.infra/rdev/values.yaml index ff249e05b..ae122bee9 100644 --- a/.infra/rdev/values.yaml +++ b/.infra/rdev/values.yaml @@ -2,7 +2,7 @@ stack: services: explorer: image: - tag: sha-28c98d87 + tag: sha-de849f4b replicaCount: 1 env: # env vars common to all deployment stages diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt index 33aafada0..2f4aae0dd 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt index 33aafada0..2f4aae0dd 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-7618b-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt index 8552fa308..e2cf19f41 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt index 8552fa308..e2cf19f41 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-pbmc3k-cxg-graph-instance-layout-gra-b442e-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt index 6118a03e7..9cc58b211 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-darwin.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt index 6118a03e7..9cc58b211 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-2f523-rud-operations-and-interactions-whole-diffexp-1-chromium-linux.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt index cca33d7dd..7b17a6fbd 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-darwin.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt index cca33d7dd..7b17a6fbd 100644 --- a/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt +++ b/client/__tests__/e2e/e2e.test.ts-snapshots/dataset-super-cool-spatial-cxg-graph-instance-8de13-rud-operations-and-interactions-whole-diffexp-2-chromium-linux.txt @@ -1 +1 @@ -
\ No newline at end of file +
\ No newline at end of file diff --git a/client/package-lock.json b/client/package-lock.json index 915052ce8..2f00e16e0 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -13,15 +13,16 @@ "@blueprintjs/core": "^5.11.0", "@blueprintjs/icons": "^5.11.0", "@blueprintjs/select": "^5.2.2", - "@emotion/css": "^11.9.0", - "@emotion/react": "^11.9.3", - "@emotion/styled": "^11.9.3", - "@material-ui/core": "^4.12.4", - "@material-ui/icons": "^4.11.3", - "@material-ui/lab": "^4.0.0-alpha.61", + "@czi-sds/components": "^20.7.0", + "@emotion/css": "^11.13.0", + "@emotion/react": "^11.13.0", + "@emotion/styled": "^11.13.0", + "@mui/base": "^5.0.0-beta.40", + "@mui/icons-material": "^5.16.7", + "@mui/lab": "^5.0.0-alpha.173", + "@mui/material": "^5.16.7", "abort-controller": "^3.0.0", "core-js": "^3.6.5", - "czifui": "^6.6.0", "d3": "^4.10.0", "d3-scale-chromatic": "^1.5.0", "flatbuffers": "^1.11.0", @@ -178,6 +179,7 @@ "version": "2.2.0", "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.2.0.tgz", "integrity": "sha512-qRmjj8nj9qmLTQXXmaR1cck3UXSRMPrbsLJAasZpF+t3riI71BXed5ebIOYwQntykeZuhjsdweEc9BxH5Jc26w==", + "dev": true, "dependencies": { "@jridgewell/gen-mapping": "^0.1.0", "@jridgewell/trace-mapping": "^0.3.9" @@ -833,6 +835,7 @@ "version": "7.23.5", "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.23.5.tgz", "integrity": "sha512-uU27kfDRlhfKl+w1U6vp16IuvSLtjAxdArVXPa9BvLkrr7CYIsxH5adpHObeAGY/41+syctUWOZ140a2Rvkgjw==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -841,6 +844,7 @@ "version": "7.23.9", "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.23.9.tgz", "integrity": "sha512-5q0175NOjddqpvvzU+kDiSOAk4PfdO6FvwCWoQ6RO7rTzEe8vlo+4HVfcnAREhD4npMs0e9uZypjTwzZPCf/cw==", + "dev": true, "dependencies": { "@ampproject/remapping": "^2.2.0", "@babel/code-frame": "^7.23.5", @@ -869,12 +873,14 @@ "node_modules/@babel/core/node_modules/convert-source-map": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz", - "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==" + "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==", + "dev": true }, "node_modules/@babel/generator": { "version": "7.23.6", "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.23.6.tgz", "integrity": "sha512-qrSfCYxYQB5owCmGLbl8XRpX1ytXlpueOb0N0UmQwA073KZxejgQTzAmJezxvpwQD9uGtK2shHdi55QT+MbjIw==", + "dev": true, "dependencies": { "@babel/types": "^7.23.6", "@jridgewell/gen-mapping": "^0.3.2", @@ -889,6 +895,7 @@ "version": "0.3.2", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz", "integrity": "sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==", + "dev": true, "dependencies": { "@jridgewell/set-array": "^1.0.1", "@jridgewell/sourcemap-codec": "^1.4.10", @@ -926,6 +933,7 @@ "version": "7.23.6", "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.23.6.tgz", "integrity": "sha512-9JB548GZoQVmzrFgp8o7KxdgkTGm6xs9DW0o/Pim72UDjzr5ObUQ6ZzYPqA+g9OTS2bBQoctLJrky0RDCAWRgQ==", + "dev": true, "dependencies": { "@babel/compat-data": "^7.23.5", "@babel/helper-validator-option": "^7.23.5", @@ -941,6 +949,7 @@ "version": "5.1.1", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz", "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==", + "dev": true, "dependencies": { "yallist": "^3.0.2" } @@ -948,7 +957,8 @@ "node_modules/@babel/helper-compilation-targets/node_modules/yallist": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz", - "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==" + "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==", + "dev": true }, "node_modules/@babel/helper-create-class-features-plugin": { "version": "7.23.10", @@ -1011,6 +1021,7 @@ "version": "7.22.20", "resolved": "https://registry.npmjs.org/@babel/helper-environment-visitor/-/helper-environment-visitor-7.22.20.tgz", "integrity": "sha512-zfedSIzFhat/gFhWfHtgWvlec0nqB9YEIVrpuwjruLlXfUSnA8cJB0miHKwqDnQ7d32aKo2xt88/xZptwxbfhA==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -1019,6 +1030,7 @@ "version": "7.23.0", "resolved": "https://registry.npmjs.org/@babel/helper-function-name/-/helper-function-name-7.23.0.tgz", "integrity": "sha512-OErEqsrxjZTJciZ4Oo+eoZqeW9UIiOcuYKRJA4ZAgV9myA+pOXhhmpfNCKjEH/auVfEYVFJ6y1Tc4r0eIApqiw==", + "dev": true, "dependencies": { "@babel/template": "^7.22.15", "@babel/types": "^7.23.0" @@ -1031,6 +1043,7 @@ "version": "7.22.5", "resolved": "https://registry.npmjs.org/@babel/helper-hoist-variables/-/helper-hoist-variables-7.22.5.tgz", "integrity": "sha512-wGjk9QZVzvknA6yKIUURb8zY3grXCcOZt+/7Wcy8O2uctxhplmUPkOdlgoNhmdVee2c92JXbf1xpMtVNbfoxRw==", + "dev": true, "dependencies": { "@babel/types": "^7.22.5" }, @@ -1065,6 +1078,7 @@ "version": "7.23.3", "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.23.3.tgz", "integrity": "sha512-7bBs4ED9OmswdfDzpz4MpWgSrV7FXlc3zIagvLFjS5H+Mk7Snr21vQ6QwrsoCGMfNC4e4LQPdoULEt4ykz0SRQ==", + "dev": true, "dependencies": { "@babel/helper-environment-visitor": "^7.22.20", "@babel/helper-module-imports": "^7.22.15", @@ -1095,6 +1109,7 @@ "version": "7.22.5", "resolved": "https://registry.npmjs.org/@babel/helper-plugin-utils/-/helper-plugin-utils-7.22.5.tgz", "integrity": "sha512-uLls06UVKgFG9QD4OeFYLEGteMIAa5kpTPcFL28yuCIIzsf6ZyKZMllKVOCZFhiZ5ptnwX4mtKdWCBE/uT4amg==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -1137,6 +1152,7 @@ "version": "7.22.5", "resolved": "https://registry.npmjs.org/@babel/helper-simple-access/-/helper-simple-access-7.22.5.tgz", "integrity": "sha512-n0H99E/K+Bika3++WNL17POvo4rKWZ7lZEp1Q+fStVbUi8nxPQEBOlTmCOxW/0JsS56SKKQ+ojAe2pHKJHN35w==", + "dev": true, "dependencies": { "@babel/types": "^7.22.5" }, @@ -1160,6 +1176,7 @@ "version": "7.22.6", "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.22.6.tgz", "integrity": "sha512-AsUnxuLhRYsisFiaJwvp1QF+I3KjD5FOxut14q/GzovUe6orHLesW2C7d754kRm53h5gqrz6sFl6sxc4BVtE/g==", + "dev": true, "dependencies": { "@babel/types": "^7.22.5" }, @@ -1187,6 +1204,7 @@ "version": "7.23.5", "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.23.5.tgz", "integrity": "sha512-85ttAOMLsr53VgXkTbkx8oA6YTfT4q7/HzXSLEYmjcSTJPMPQtvq1BD79Byep5xMUYbGRzEpDsjUf3dyp54IKw==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -1209,6 +1227,7 @@ "version": "7.23.9", "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.23.9.tgz", "integrity": "sha512-87ICKgU5t5SzOT7sBMfCOZQ2rHjRU+Pcb9BoILMYz600W6DkVRLFBPwQ18gwUVvggqXivaUakpnxWQGbpywbBQ==", + "dev": true, "dependencies": { "@babel/template": "^7.23.9", "@babel/traverse": "^7.23.9", @@ -1299,6 +1318,7 @@ "version": "7.23.9", "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.23.9.tgz", "integrity": "sha512-9tcKgqKbs3xGJ+NtKF2ndOBBLVwPjl1SHxPQkd36r3Dlirw3xWUeGaTbqr7uGZcTaxkVNwc+03SVP7aCdWrTlA==", + "dev": true, "bin": { "parser": "bin/babel-parser.js" }, @@ -1660,6 +1680,7 @@ "version": "7.23.3", "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.23.3.tgz", "integrity": "sha512-EB2MELswq55OHUoRZLGg/zC7QWUKfNLpE57m/S2yr1uEneIgsTgrSzXP3NXEsMkVn76OlaVVnzN+ugObuYGwhg==", + "dev": true, "dependencies": { "@babel/helper-plugin-utils": "^7.22.5" }, @@ -2998,6 +3019,7 @@ "version": "7.23.9", "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.23.9.tgz", "integrity": "sha512-+xrD2BWLpvHKNmX2QbpdpsBaWnRxahMwJjO+KZk2JOElj5nSmKezyS1B4u+QbHMTX69t4ukm6hh9lsYQ7GHCKA==", + "dev": true, "dependencies": { "@babel/code-frame": "^7.23.5", "@babel/parser": "^7.23.9", @@ -3011,6 +3033,7 @@ "version": "7.23.9", "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.23.9.tgz", "integrity": "sha512-I/4UJ9vs90OkBtY6iiiTORVMyIhJ4kAVmsKo9KFc8UOxMeUfi2hvtIBsET5u9GizXE6/GFSuKCTNfgCswuEjRg==", + "dev": true, "dependencies": { "@babel/code-frame": "^7.23.5", "@babel/generator": "^7.23.6", @@ -4599,6 +4622,23 @@ "node": ">=0.1.90" } }, + "node_modules/@czi-sds/components": { + "version": "20.7.0", + "resolved": "https://registry.npmjs.org/@czi-sds/components/-/components-20.7.0.tgz", + "integrity": "sha512-aNtNY5/ufEXkFaWzuTQMDXNqaAk8RvUV+ytzTMeNxIcr37g0jAS/mnmY4vPx/FQUTFAPcsxZJKls8vtz5KqOQw==", + "peerDependencies": { + "@emotion/core": "^11.0.0", + "@emotion/css": "^11.11.2", + "@emotion/react": "^11.11.3", + "@emotion/styled": "^11.11.0", + "@mui/base": "^5.0.0-beta.30", + "@mui/icons-material": "^5.15.3", + "@mui/lab": "^5.0.0-alpha.159", + "@mui/material": "^5.15.3", + "react": ">=17.0.1", + "react-dom": ">=17.0.1" + } + }, "node_modules/@discoveryjs/json-ext": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/@discoveryjs/json-ext/-/json-ext-0.5.7.tgz", @@ -4609,174 +4649,155 @@ } }, "node_modules/@emotion/babel-plugin": { - "version": "11.10.2", - "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.10.2.tgz", - "integrity": "sha512-xNQ57njWTFVfPAc3cjfuaPdsgLp5QOSuRsj9MA6ndEhH/AzuZM86qIQzt6rq+aGBwj3n5/TkLmU5lhAfdRmogA==", + "version": "11.12.0", + "resolved": "https://registry.npmjs.org/@emotion/babel-plugin/-/babel-plugin-11.12.0.tgz", + "integrity": "sha512-y2WQb+oP8Jqvvclh8Q55gLUyb7UFvgv7eJfsj7td5TToBrIUtPay2kMrZi4xjq9qw2vD0ZR5fSho0yqoFgX7Rw==", "dependencies": { "@babel/helper-module-imports": "^7.16.7", - "@babel/plugin-syntax-jsx": "^7.17.12", "@babel/runtime": "^7.18.3", - "@emotion/hash": "^0.9.0", - "@emotion/memoize": "^0.8.0", - "@emotion/serialize": "^1.1.0", + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/serialize": "^1.2.0", "babel-plugin-macros": "^3.1.0", "convert-source-map": "^1.5.0", "escape-string-regexp": "^4.0.0", "find-root": "^1.1.0", "source-map": "^0.5.7", - "stylis": "4.0.13" - }, - "peerDependencies": { - "@babel/core": "^7.0.0" + "stylis": "4.2.0" } }, "node_modules/@emotion/cache": { - "version": "11.11.0", - "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.11.0.tgz", - "integrity": "sha512-P34z9ssTCBi3e9EI1ZsWpNHcfY1r09ZO0rZbRO2ob3ZQMnFI35jB536qoXbkdesr5EUhYi22anuEJuyxifaqAQ==", - "dependencies": { - "@emotion/memoize": "^0.8.1", - "@emotion/sheet": "^1.2.2", - "@emotion/utils": "^1.2.1", - "@emotion/weak-memoize": "^0.3.1", + "version": "11.13.1", + "resolved": "https://registry.npmjs.org/@emotion/cache/-/cache-11.13.1.tgz", + "integrity": "sha512-iqouYkuEblRcXmylXIwwOodiEK5Ifl7JcX7o6V4jI3iW4mLXX3dmt5xwBtIkJiQEXFAI+pC8X0i67yiPkH9Ucw==", + "dependencies": { + "@emotion/memoize": "^0.9.0", + "@emotion/sheet": "^1.4.0", + "@emotion/utils": "^1.4.0", + "@emotion/weak-memoize": "^0.4.0", "stylis": "4.2.0" } }, - "node_modules/@emotion/cache/node_modules/stylis": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz", - "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==" + "node_modules/@emotion/core": { + "version": "11.0.0", + "resolved": "https://registry.npmjs.org/@emotion/core/-/core-11.0.0.tgz", + "integrity": "sha512-w4sE3AmHmyG6RDKf6mIbtHpgJUSJ2uGvPQb8VXFL7hFjMPibE8IiehG8cMX3Ztm4svfCQV6KqusQbeIOkurBcA==", + "peer": true }, "node_modules/@emotion/css": { - "version": "11.10.0", - "resolved": "https://registry.npmjs.org/@emotion/css/-/css-11.10.0.tgz", - "integrity": "sha512-dH9f+kSCucc8ilMg0MUA1AemabcyzYpe5EKX24F528PJjD7HyIY/VBNJHxfUdc8l400h2ncAjR6yEDu+DBj2cg==", + "version": "11.13.0", + "resolved": "https://registry.npmjs.org/@emotion/css/-/css-11.13.0.tgz", + "integrity": "sha512-BUk99ylT+YHl+W/HN7nv1RCTkDYmKKqa1qbvM/qLSQEg61gipuBF5Hptk/2/ERmX2DCv0ccuFGhz9i0KSZOqPg==", "dependencies": { - "@emotion/babel-plugin": "^11.10.0", - "@emotion/cache": "^11.10.0", - "@emotion/serialize": "^1.1.0", - "@emotion/sheet": "^1.2.0", - "@emotion/utils": "^1.2.0" - }, - "peerDependencies": { - "@babel/core": "^7.0.0" - }, - "peerDependenciesMeta": { - "@babel/core": { - "optional": true - } + "@emotion/babel-plugin": "^11.12.0", + "@emotion/cache": "^11.13.0", + "@emotion/serialize": "^1.3.0", + "@emotion/sheet": "^1.4.0", + "@emotion/utils": "^1.4.0" } }, "node_modules/@emotion/hash": { - "version": "0.9.0", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.0.tgz", - "integrity": "sha512-14FtKiHhy2QoPIzdTcvh//8OyBlknNs2nXRwIhG904opCby3l+9Xaf/wuPvICBF0rc1ZCNBd3nKe9cd2mecVkQ==" + "version": "0.9.2", + "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.9.2.tgz", + "integrity": "sha512-MyqliTZGuOm3+5ZRSaaBGP3USLw6+EGykkwZns2EPC5g8jJ4z9OrdZY9apkl3+UP9+sdz76YYkwCKP5gh8iY3g==" }, "node_modules/@emotion/is-prop-valid": { - "version": "1.2.0", - "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.2.0.tgz", - "integrity": "sha512-3aDpDprjM0AwaxGE09bOPkNxHpBd+kA6jty3RnaEXdweX1DF1U3VQpPYb0g1IStAuK7SVQ1cy+bNBBKp4W3Fjg==", + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@emotion/is-prop-valid/-/is-prop-valid-1.3.0.tgz", + "integrity": "sha512-SHetuSLvJDzuNbOdtPVbq6yMMMlLoW5Q94uDqJZqy50gcmAjxFkVqmzqSGEFq9gT2iMuIeKV1PXVWmvUhuZLlQ==", "dependencies": { - "@emotion/memoize": "^0.8.0" + "@emotion/memoize": "^0.9.0" } }, "node_modules/@emotion/memoize": { - "version": "0.8.1", - "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.8.1.tgz", - "integrity": "sha512-W2P2c/VRW1/1tLox0mVUalvnWXxavmv/Oum2aPsRcoDJuob75FC3Y8FbpfLwUegRcxINtGUMPq0tFCvYNTBXNA==" + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/memoize/-/memoize-0.9.0.tgz", + "integrity": "sha512-30FAj7/EoJ5mwVPOWhAyCX+FPfMDrVecJAM+Iw9NRoSl4BBAQeqj4cApHHUXOVvIPgLVDsCFoz/hGD+5QQD1GQ==" }, "node_modules/@emotion/react": { - "version": "11.10.4", - "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.10.4.tgz", - "integrity": "sha512-j0AkMpr6BL8gldJZ6XQsQ8DnS9TxEQu1R+OGmDZiWjBAJtCcbt0tS3I/YffoqHXxH6MjgI7KdMbYKw3MEiU9eA==", + "version": "11.13.0", + "resolved": "https://registry.npmjs.org/@emotion/react/-/react-11.13.0.tgz", + "integrity": "sha512-WkL+bw1REC2VNV1goQyfxjx1GYJkcc23CRQkXX+vZNLINyfI7o+uUn/rTGPt/xJ3bJHd5GcljgnxHf4wRw5VWQ==", "dependencies": { "@babel/runtime": "^7.18.3", - "@emotion/babel-plugin": "^11.10.0", - "@emotion/cache": "^11.10.0", - "@emotion/serialize": "^1.1.0", - "@emotion/use-insertion-effect-with-fallbacks": "^1.0.0", - "@emotion/utils": "^1.2.0", - "@emotion/weak-memoize": "^0.3.0", + "@emotion/babel-plugin": "^11.12.0", + "@emotion/cache": "^11.13.0", + "@emotion/serialize": "^1.3.0", + "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0", + "@emotion/utils": "^1.4.0", + "@emotion/weak-memoize": "^0.4.0", "hoist-non-react-statics": "^3.3.1" }, "peerDependencies": { - "@babel/core": "^7.0.0", "react": ">=16.8.0" }, "peerDependenciesMeta": { - "@babel/core": { - "optional": true - }, "@types/react": { "optional": true } } }, "node_modules/@emotion/serialize": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.1.0.tgz", - "integrity": "sha512-F1ZZZW51T/fx+wKbVlwsfchr5q97iW8brAnXmsskz4d0hVB4O3M/SiA3SaeH06x02lSNzkkQv+n3AX3kCXKSFA==", + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/@emotion/serialize/-/serialize-1.3.0.tgz", + "integrity": "sha512-jACuBa9SlYajnpIVXB+XOXnfJHyckDfe6fOpORIM6yhBDlqGuExvDdZYHDQGoDf3bZXGv7tNr+LpLjJqiEQ6EA==", "dependencies": { - "@emotion/hash": "^0.9.0", - "@emotion/memoize": "^0.8.0", - "@emotion/unitless": "^0.8.0", - "@emotion/utils": "^1.2.0", + "@emotion/hash": "^0.9.2", + "@emotion/memoize": "^0.9.0", + "@emotion/unitless": "^0.9.0", + "@emotion/utils": "^1.4.0", "csstype": "^3.0.2" } }, "node_modules/@emotion/sheet": { - "version": "1.2.2", - "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.2.2.tgz", - "integrity": "sha512-0QBtGvaqtWi+nx6doRwDdBIzhNdZrXUppvTM4dtZZWEGTXL/XE/yJxLMGlDT1Gt+UHH5IX1n+jkXyytE/av7OA==" + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/@emotion/sheet/-/sheet-1.4.0.tgz", + "integrity": "sha512-fTBW9/8r2w3dXWYM4HCB1Rdp8NLibOw2+XELH5m5+AkWiL/KqYX6dc0kKYlaYyKjrQ6ds33MCdMPEwgs2z1rqg==" }, "node_modules/@emotion/styled": { - "version": "11.10.4", - "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.10.4.tgz", - "integrity": "sha512-pRl4R8Ez3UXvOPfc2bzIoV8u9P97UedgHS4FPX594ntwEuAMA114wlaHvOK24HB48uqfXiGlYIZYCxVJ1R1ttQ==", + "version": "11.13.0", + "resolved": "https://registry.npmjs.org/@emotion/styled/-/styled-11.13.0.tgz", + "integrity": "sha512-tkzkY7nQhW/zC4hztlwucpT8QEZ6eUzpXDRhww/Eej4tFfO0FxQYWRyg/c5CCXa4d/f174kqeXYjuQRnhzf6dA==", "dependencies": { "@babel/runtime": "^7.18.3", - "@emotion/babel-plugin": "^11.10.0", - "@emotion/is-prop-valid": "^1.2.0", - "@emotion/serialize": "^1.1.0", - "@emotion/use-insertion-effect-with-fallbacks": "^1.0.0", - "@emotion/utils": "^1.2.0" + "@emotion/babel-plugin": "^11.12.0", + "@emotion/is-prop-valid": "^1.3.0", + "@emotion/serialize": "^1.3.0", + "@emotion/use-insertion-effect-with-fallbacks": "^1.1.0", + "@emotion/utils": "^1.4.0" }, "peerDependencies": { - "@babel/core": "^7.0.0", "@emotion/react": "^11.0.0-rc.0", "react": ">=16.8.0" }, "peerDependenciesMeta": { - "@babel/core": { - "optional": true - }, "@types/react": { "optional": true } } }, "node_modules/@emotion/unitless": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.8.0.tgz", - "integrity": "sha512-VINS5vEYAscRl2ZUDiT3uMPlrFQupiKgHz5AA4bCH1miKBg4qtwkim1qPmJj/4WG6TreYMY111rEFsjupcOKHw==" + "version": "0.9.0", + "resolved": "https://registry.npmjs.org/@emotion/unitless/-/unitless-0.9.0.tgz", + "integrity": "sha512-TP6GgNZtmtFaFcsOgExdnfxLLpRDla4Q66tnenA9CktvVSdNKDvMVuUah4QvWPIpNjrWsGg3qeGo9a43QooGZQ==" }, "node_modules/@emotion/use-insertion-effect-with-fallbacks": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.0.1.tgz", - "integrity": "sha512-jT/qyKZ9rzLErtrjGgdkMBn2OP8wl0G3sQlBb3YPryvKHsjvINUhVaPFfP+fpBcOkmrVOVEEHQFJ7nbj2TH2gw==", + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/@emotion/use-insertion-effect-with-fallbacks/-/use-insertion-effect-with-fallbacks-1.1.0.tgz", + "integrity": "sha512-+wBOcIV5snwGgI2ya3u99D7/FJquOIniQT1IKyDsBmEgwvpxMNeS65Oib7OnE2d2aY+3BU4OiH+0Wchf8yk3Hw==", "peerDependencies": { "react": ">=16.8.0" } }, "node_modules/@emotion/utils": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.2.1.tgz", - "integrity": "sha512-Y2tGf3I+XVnajdItskUCn6LX+VUDmP6lTL4fcqsXAv43dnlbZiuW4MWQW38rW/BVWSE7Q/7+XQocmpnRYILUmg==" + "version": "1.4.0", + "resolved": "https://registry.npmjs.org/@emotion/utils/-/utils-1.4.0.tgz", + "integrity": "sha512-spEnrA1b6hDR/C68lC2M7m6ALPUHZC0lIY7jAS/B/9DuuO1ZP04eov8SMv/6fwRd8pzmsn2AuJEznRREWlQrlQ==" }, "node_modules/@emotion/weak-memoize": { - "version": "0.3.1", - "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.3.1.tgz", - "integrity": "sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww==" + "version": "0.4.0", + "resolved": "https://registry.npmjs.org/@emotion/weak-memoize/-/weak-memoize-0.4.0.tgz", + "integrity": "sha512-snKqtPW01tN0ui7yu9rGv69aJXr/a/Ywvl11sUjNtEcRc+ng/mQriFL0wLXMef74iHa/EkftbDzU9F8iFbH+zg==" }, "node_modules/@esbuild/darwin-arm64": { "version": "0.18.20", @@ -4896,7 +4917,6 @@ "version": "1.6.0", "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.0.tgz", "integrity": "sha512-PcF++MykgmTj3CIyOQbKA/hDzOAiqI3mhuoN44WRCopIs1sgoDoU4oty4Jtqaj/y3oDU6fnVSm4QG0a3t5i0+g==", - "dev": true, "dependencies": { "@floating-ui/utils": "^0.2.1" } @@ -4905,7 +4925,6 @@ "version": "1.6.1", "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.6.1.tgz", "integrity": "sha512-iA8qE43/H5iGozC3W0YSnVSW42Vh522yyM1gj+BqRwVsTNOyr231PsXDaV04yT39PsO0QL2QpbI/M0ZaLUQgRQ==", - "dev": true, "dependencies": { "@floating-ui/core": "^1.6.0", "@floating-ui/utils": "^0.2.1" @@ -4915,7 +4934,6 @@ "version": "2.0.8", "resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.8.tgz", "integrity": "sha512-HOdqOt3R3OGeTKidaLvJKcgg75S6tibQ3Tif4eyd91QnIJWr0NLvoXFpJA/j8HqkFSL68GDca9AuyWEHlhyClw==", - "dev": true, "dependencies": { "@floating-ui/dom": "^1.6.1" }, @@ -4927,8 +4945,7 @@ "node_modules/@floating-ui/utils": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.1.tgz", - "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==", - "dev": true + "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==" }, "node_modules/@humanwhocodes/config-array": { "version": "0.5.0", @@ -5130,6 +5147,7 @@ "version": "0.1.1", "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.1.1.tgz", "integrity": "sha512-sQXCasFk+U8lWYEe66WxRDOE9PjVz4vSM51fTu3Hw+ClTpUSQb718772vH3pyS5pShp6lvQM7SxgIDXXXmOX7w==", + "dev": true, "dependencies": { "@jridgewell/set-array": "^1.0.0", "@jridgewell/sourcemap-codec": "^1.4.10" @@ -5142,6 +5160,7 @@ "version": "3.1.0", "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz", "integrity": "sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==", + "dev": true, "engines": { "node": ">=6.0.0" } @@ -5150,6 +5169,7 @@ "version": "1.1.2", "resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz", "integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==", + "dev": true, "engines": { "node": ">=6.0.0" } @@ -5181,12 +5201,14 @@ "node_modules/@jridgewell/sourcemap-codec": { "version": "1.4.15", "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz", - "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==" + "integrity": "sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==", + "dev": true }, "node_modules/@jridgewell/trace-mapping": { "version": "0.3.19", "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.19.tgz", "integrity": "sha512-kf37QtfW+Hwx/buWGMPcR60iF9ziHa6r/CZJIHbmcm4+0qrXiVdxegAH0F6yddEVQ7zdkjcGCgCzUu+BcbhQxw==", + "dev": true, "dependencies": { "@jridgewell/resolve-uri": "^3.1.0", "@jridgewell/sourcemap-codec": "^1.4.14" @@ -5219,36 +5241,53 @@ "node": ">=8" } }, - "node_modules/@material-ui/core": { - "version": "4.12.4", - "resolved": "https://registry.npmjs.org/@material-ui/core/-/core-4.12.4.tgz", - "integrity": "sha512-tr7xekNlM9LjA6pagJmL8QCgZXaubWUwkJnoYcMKd4gw/t4XiyvnTkjdGrUVicyB2BsdaAv1tvow45bPM4sSwQ==", - "deprecated": "Material UI v4 doesn't receive active development since September 2021. See the guide https://mui.com/material-ui/migration/migration-v4/ to upgrade to v5.", + "node_modules/@mdn/browser-compat-data": { + "version": "5.3.16", + "resolved": "https://registry.npmjs.org/@mdn/browser-compat-data/-/browser-compat-data-5.3.16.tgz", + "integrity": "sha512-b0kKg2weqKDLI+Ai5+tocgUEIidccdSfzUndbS2YnwIp5aVvd3M0D+DCcbrsSOSgMyrV9QKMqogtqMIjKwvDxw==", + "dev": true + }, + "node_modules/@mdx-js/react": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.3.0.tgz", + "integrity": "sha512-zQH//gdOmuu7nt2oJR29vFhDv88oGPmVw6BggmrHeMI+xgEkp1B2dX9/bMBSYtK0dyLX/aOmesKS09g222K1/g==", + "dev": true, "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/styles": "^4.11.5", - "@material-ui/system": "^4.12.2", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "@types/react-transition-group": "^4.2.0", - "clsx": "^1.0.4", - "hoist-non-react-statics": "^3.3.2", - "popper.js": "1.16.1-lts", - "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0", - "react-transition-group": "^4.4.0" + "@types/mdx": "^2.0.0", + "@types/react": ">=16" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + }, + "peerDependencies": { + "react": ">=16" + } + }, + "node_modules/@mui/base": { + "version": "5.0.0-beta.40", + "resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-beta.40.tgz", + "integrity": "sha512-I/lGHztkCzvwlXpjD2+SNmvNQvB4227xBXhISPjEaJUXGImOQ9f3D2Yj/T3KasSI/h0MLWy74X0J6clhPmsRbQ==", + "dependencies": { + "@babel/runtime": "^7.23.9", + "@floating-ui/react-dom": "^2.0.8", + "@mui/types": "^7.2.14", + "@mui/utils": "^5.15.14", + "@popperjs/core": "^2.11.8", + "clsx": "^2.1.0", + "prop-types": "^15.8.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -5256,26 +5295,41 @@ } } }, - "node_modules/@material-ui/core/node_modules/popper.js": { - "version": "1.16.1-lts", - "resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.16.1-lts.tgz", - "integrity": "sha512-Kjw8nKRl1m+VrSFCoVGPph93W/qrSO7ZkqPpTf7F4bk/sqcfWK019dWBUpE/fBOsOQY1dks/Bmcbfn1heM/IsA==" + "node_modules/@mui/base/node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } + }, + "node_modules/@mui/core-downloads-tracker": { + "version": "5.16.7", + "resolved": "https://registry.npmjs.org/@mui/core-downloads-tracker/-/core-downloads-tracker-5.16.7.tgz", + "integrity": "sha512-RtsCt4Geed2/v74sbihWzzRs+HsIQCfclHeORh5Ynu2fS4icIKozcSubwuG7vtzq2uW3fOR1zITSP84TNt2GoQ==", + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + } }, - "node_modules/@material-ui/icons": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/icons/-/icons-4.11.3.tgz", - "integrity": "sha512-IKHlyx6LDh8n19vzwH5RtHIOHl9Tu90aAAxcbWME6kp4dmvODM3UvOHJeMIDzUbd4muuJKHmlNoBN+mDY4XkBA==", + "node_modules/@mui/icons-material": { + "version": "5.16.7", + "resolved": "https://registry.npmjs.org/@mui/icons-material/-/icons-material-5.16.7.tgz", + "integrity": "sha512-UrGwDJCXEszbDI7yV047BYU5A28eGJ79keTCP4cc74WyncuVrnurlmIRxaHL8YK+LI1Kzq+/JM52IAkNnv4u+Q==", "dependencies": { - "@babel/runtime": "^7.4.4" + "@babel/runtime": "^7.23.9" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@material-ui/core": "^4.0.0", - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@mui/material": "^5.0.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -5283,105 +5337,130 @@ } } }, - "node_modules/@material-ui/lab": { - "version": "4.0.0-alpha.61", - "resolved": "https://registry.npmjs.org/@material-ui/lab/-/lab-4.0.0-alpha.61.tgz", - "integrity": "sha512-rSzm+XKiNUjKegj8bzt5+pygZeckNLOr+IjykH8sYdVk7dE9y2ZuUSofiMV2bJk3qU+JHwexmw+q0RyNZB9ugg==", - "deprecated": "Material UI v4 doesn't receive active development since September 2021. See the guide https://mui.com/material-ui/migration/migration-v4/ to upgrade to v5.", + "node_modules/@mui/lab": { + "version": "5.0.0-alpha.173", + "resolved": "https://registry.npmjs.org/@mui/lab/-/lab-5.0.0-alpha.173.tgz", + "integrity": "sha512-Gt5zopIWwxDgGy/MXcp6GueD84xFFugFai4hYiXY0zowJpTVnIrTQCQXV004Q7rejJ7aaCntX9hpPJqCrioshA==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "@babel/runtime": "^7.23.9", + "@mui/base": "5.0.0-beta.40", + "@mui/system": "^5.16.5", + "@mui/types": "^7.2.15", + "@mui/utils": "^5.16.5", + "clsx": "^2.1.0", + "prop-types": "^15.8.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@material-ui/core": "^4.12.1", - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@mui/material": ">=5.15.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/styles": { - "version": "4.11.5", - "resolved": "https://registry.npmjs.org/@material-ui/styles/-/styles-4.11.5.tgz", - "integrity": "sha512-o/41ot5JJiUsIETME9wVLAJrmIWL3j0R0Bj2kCOLbSfqEkKf0fmaPt+5vtblUh5eXr2S+J/8J3DaCb10+CzPGA==", - "deprecated": "Material UI v4 doesn't receive active development since September 2021. See the guide https://mui.com/material-ui/migration/migration-v4/ to upgrade to v5.", + "node_modules/@mui/lab/node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } + }, + "node_modules/@mui/material": { + "version": "5.16.7", + "resolved": "https://registry.npmjs.org/@mui/material/-/material-5.16.7.tgz", + "integrity": "sha512-cwwVQxBhK60OIOqZOVLFt55t01zmarKJiJUWbk0+8s/Ix5IaUzAShqlJchxsIQ4mSrWqgcKCCXKtIlG5H+/Jmg==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@emotion/hash": "^0.8.0", - "@material-ui/types": "5.1.0", - "@material-ui/utils": "^4.11.3", - "clsx": "^1.0.4", - "csstype": "^2.5.2", - "hoist-non-react-statics": "^3.3.2", - "jss": "^10.5.1", - "jss-plugin-camel-case": "^10.5.1", - "jss-plugin-default-unit": "^10.5.1", - "jss-plugin-global": "^10.5.1", - "jss-plugin-nested": "^10.5.1", - "jss-plugin-props-sort": "^10.5.1", - "jss-plugin-rule-value-function": "^10.5.1", - "jss-plugin-vendor-prefixer": "^10.5.1", - "prop-types": "^15.7.2" + "@babel/runtime": "^7.23.9", + "@mui/core-downloads-tracker": "^5.16.7", + "@mui/system": "^5.16.7", + "@mui/types": "^7.2.15", + "@mui/utils": "^5.16.6", + "@popperjs/core": "^2.11.8", + "@types/react-transition-group": "^4.4.10", + "clsx": "^2.1.0", + "csstype": "^3.1.3", + "prop-types": "^15.8.1", + "react-is": "^18.3.1", + "react-transition-group": "^4.4.5" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0", + "react-dom": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, "@types/react": { "optional": true } } }, - "node_modules/@material-ui/styles/node_modules/@emotion/hash": { - "version": "0.8.0", - "resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", - "integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==" + "node_modules/@mui/material/node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } }, - "node_modules/@material-ui/styles/node_modules/csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" + "node_modules/@mui/material/node_modules/react-is": { + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz", + "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==" }, - "node_modules/@material-ui/system": { - "version": "4.12.2", - "resolved": "https://registry.npmjs.org/@material-ui/system/-/system-4.12.2.tgz", - "integrity": "sha512-6CSKu2MtmiJgcCGf6nBQpM8fLkuB9F55EKfbdTC80NND5wpTmKzwdhLYLH3zL4cLlK0gVaaltW7/wMuyTnN0Lw==", + "node_modules/@mui/private-theming": { + "version": "5.16.6", + "resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.16.6.tgz", + "integrity": "sha512-rAk+Rh8Clg7Cd7shZhyt2HGTTE5wYKNSJ5sspf28Fqm/PZ69Er9o6KX25g03/FG2dfpg5GCwZh/xOojiTfm3hw==", "dependencies": { - "@babel/runtime": "^7.4.4", - "@material-ui/utils": "^4.11.3", - "csstype": "^2.5.2", - "prop-types": "^15.7.2" + "@babel/runtime": "^7.23.9", + "@mui/utils": "^5.16.6", + "prop-types": "^15.8.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/material-ui" + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "@types/react": "^16.8.6 || ^17.0.0", - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { "@types/react": { @@ -5389,64 +5468,139 @@ } } }, - "node_modules/@material-ui/system/node_modules/csstype": { - "version": "2.6.20", - "resolved": "https://registry.npmjs.org/csstype/-/csstype-2.6.20.tgz", - "integrity": "sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==" - }, - "node_modules/@material-ui/types": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/@material-ui/types/-/types-5.1.0.tgz", - "integrity": "sha512-7cqRjrY50b8QzRSYyhSpx4WRw2YuO0KKIGQEVk5J8uoz2BanawykgZGoWEqKm7pVIbzFDN0SpPcVV4IhOFkl8A==", + "node_modules/@mui/styled-engine": { + "version": "5.16.6", + "resolved": "https://registry.npmjs.org/@mui/styled-engine/-/styled-engine-5.16.6.tgz", + "integrity": "sha512-zaThmS67ZmtHSWToTiHslbI8jwrmITcN93LQaR2lKArbvS7Z3iLkwRoiikNWutx9MBs8Q6okKvbZq1RQYB3v7g==", + "dependencies": { + "@babel/runtime": "^7.23.9", + "@emotion/cache": "^11.11.0", + "csstype": "^3.1.3", + "prop-types": "^15.8.1" + }, + "engines": { + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" + }, "peerDependencies": { - "@types/react": "*" + "@emotion/react": "^11.4.1", + "@emotion/styled": "^11.3.0", + "react": "^17.0.0 || ^18.0.0" }, "peerDependenciesMeta": { - "@types/react": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { "optional": true } } }, - "node_modules/@material-ui/utils": { - "version": "4.11.3", - "resolved": "https://registry.npmjs.org/@material-ui/utils/-/utils-4.11.3.tgz", - "integrity": "sha512-ZuQPV4rBK/V1j2dIkSSEcH5uT6AaHuKWFfotADHsC0wVL1NLd2WkFCm4ZZbX33iO4ydl6V0GPngKm8HZQ2oujg==", + "node_modules/@mui/system": { + "version": "5.16.7", + "resolved": "https://registry.npmjs.org/@mui/system/-/system-5.16.7.tgz", + "integrity": "sha512-Jncvs/r/d/itkxh7O7opOunTqbbSSzMTHzZkNLM+FjAOg+cYAZHrPDlYe1ZGKUYORwwb2XexlWnpZp0kZ4AHuA==", "dependencies": { - "@babel/runtime": "^7.4.4", - "prop-types": "^15.7.2", - "react-is": "^16.8.0 || ^17.0.0" + "@babel/runtime": "^7.23.9", + "@mui/private-theming": "^5.16.6", + "@mui/styled-engine": "^5.16.6", + "@mui/types": "^7.2.15", + "@mui/utils": "^5.16.6", + "clsx": "^2.1.0", + "csstype": "^3.1.3", + "prop-types": "^15.8.1" }, "engines": { - "node": ">=8.0.0" + "node": ">=12.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "react": "^16.8.0 || ^17.0.0", - "react-dom": "^16.8.0 || ^17.0.0" + "@emotion/react": "^11.5.0", + "@emotion/styled": "^11.3.0", + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@emotion/react": { + "optional": true + }, + "@emotion/styled": { + "optional": true + }, + "@types/react": { + "optional": true + } } }, - "node_modules/@mdn/browser-compat-data": { - "version": "5.3.16", - "resolved": "https://registry.npmjs.org/@mdn/browser-compat-data/-/browser-compat-data-5.3.16.tgz", - "integrity": "sha512-b0kKg2weqKDLI+Ai5+tocgUEIidccdSfzUndbS2YnwIp5aVvd3M0D+DCcbrsSOSgMyrV9QKMqogtqMIjKwvDxw==", - "dev": true + "node_modules/@mui/system/node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } }, - "node_modules/@mdx-js/react": { - "version": "2.3.0", - "resolved": "https://registry.npmjs.org/@mdx-js/react/-/react-2.3.0.tgz", - "integrity": "sha512-zQH//gdOmuu7nt2oJR29vFhDv88oGPmVw6BggmrHeMI+xgEkp1B2dX9/bMBSYtK0dyLX/aOmesKS09g222K1/g==", - "dev": true, + "node_modules/@mui/types": { + "version": "7.2.15", + "resolved": "https://registry.npmjs.org/@mui/types/-/types-7.2.15.tgz", + "integrity": "sha512-nbo7yPhtKJkdf9kcVOF8JZHPZTmqXjJ/tI0bdWgHg5tp9AnIN4Y7f7wm9T+0SyGYJk76+GYZ8Q5XaTYAsUHN0Q==", + "peerDependencies": { + "@types/react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } + } + }, + "node_modules/@mui/utils": { + "version": "5.16.6", + "resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.16.6.tgz", + "integrity": "sha512-tWiQqlhxAt3KENNiSRL+DIn9H5xNVK6Jjf70x3PnfQPz1MPBdh7yyIcAyVBT9xiw7hP3SomRhPR7hzBMBCjqEA==", "dependencies": { - "@types/mdx": "^2.0.0", - "@types/react": ">=16" + "@babel/runtime": "^7.23.9", + "@mui/types": "^7.2.15", + "@types/prop-types": "^15.7.12", + "clsx": "^2.1.1", + "prop-types": "^15.8.1", + "react-is": "^18.3.1" + }, + "engines": { + "node": ">=12.0.0" }, "funding": { "type": "opencollective", - "url": "https://opencollective.com/unified" + "url": "https://opencollective.com/mui-org" }, "peerDependencies": { - "react": ">=16" + "@types/react": "^17.0.0 || ^18.0.0", + "react": "^17.0.0 || ^18.0.0" + }, + "peerDependenciesMeta": { + "@types/react": { + "optional": true + } } }, + "node_modules/@mui/utils/node_modules/clsx": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz", + "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==", + "engines": { + "node": ">=6" + } + }, + "node_modules/@mui/utils/node_modules/react-is": { + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-is/-/react-is-18.3.1.tgz", + "integrity": "sha512-/LLMVyas0ljjAtoYiPqYiL8VWXzUUdThrmU5+n20DZv+a+ClRoevUzw5JxU+Ieh5/c87ytoTBV9G1FiKfNJdmg==" + }, "node_modules/@ndelangen/get-tarball": { "version": "3.0.9", "resolved": "https://registry.npmjs.org/@ndelangen/get-tarball/-/get-tarball-3.0.9.tgz", @@ -12381,6 +12535,7 @@ "version": "4.22.3", "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.22.3.tgz", "integrity": "sha512-UAp55yfwNv0klWNapjs/ktHoguxuQNGnOzxYmfnXIS+8AsRDZkSDxg7R1AX3GKzn078SBI5dzwzj/Yx0Or0e3A==", + "dev": true, "funding": [ { "type": "opencollective", @@ -12547,6 +12702,7 @@ "version": "1.0.30001581", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001581.tgz", "integrity": "sha512-whlTkwhqV2tUmP3oYhtNfaWGYHDdS3JYFQBKXxcUR9qqPWsRhFHhoISO2Xnl/g0xyKzht9mI1LZpiNWfMzHixQ==", + "dev": true, "funding": [ { "type": "opencollective", @@ -12932,14 +13088,6 @@ "node": ">=6" } }, - "node_modules/clsx": { - "version": "1.2.1", - "resolved": "https://registry.npmjs.org/clsx/-/clsx-1.2.1.tgz", - "integrity": "sha512-EcR6r5a8bj6pu3ycsa/E/cKVGuTgZJZdsyUYHOksG/UHIiKfjxzRxYJpyVBwYaQeOvghal9fcc4PidlgzugAQg==", - "engines": { - "node": ">=6" - } - }, "node_modules/code-point-at": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz", @@ -13211,12 +13359,9 @@ } }, "node_modules/convert-source-map": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.8.0.tgz", - "integrity": "sha512-+OQdjP49zViI/6i7nIJpA8rAl4sV/JdPfU9nZs3VqOwGIgizICvuN2ru6fMd+4llL0tar18UYJXfZ/TWtmhUjA==", - "dependencies": { - "safe-buffer": "~5.1.1" - } + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz", + "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==" }, "node_modules/cookie": { "version": "0.6.0", @@ -13593,15 +13738,6 @@ "node": ">=0.10.0" } }, - "node_modules/css-vendor": { - "version": "2.0.8", - "resolved": "https://registry.npmjs.org/css-vendor/-/css-vendor-2.0.8.tgz", - "integrity": "sha512-x9Aq0XTInxrkuFeHKbYC7zWY8ai7qJ04Kxd9MnvbC1uO5DagxoHQjm4JvG+vCdXOoFtCjbL2XSZfxmoYa9uQVQ==", - "dependencies": { - "@babel/runtime": "^7.8.3", - "is-in-browser": "^1.0.2" - } - }, "node_modules/css-what": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", @@ -13725,21 +13861,6 @@ "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==" }, - "node_modules/czifui": { - "version": "6.9.0", - "resolved": "https://registry.npmjs.org/czifui/-/czifui-6.9.0.tgz", - "integrity": "sha512-jvj/Kqw0lL0tKJulHqpVVkDBZEifqSce6bxgiZ7cuzRTzWvrwUjMLhLtEe9A+C+k8fQwTRoxXfy0izzaLJ8YGA==", - "peerDependencies": { - "@emotion/css": "^11.1.3", - "@emotion/react": "^11.1.5", - "@emotion/styled": "^11.1.5", - "@material-ui/core": "^4.11.3", - "@material-ui/icons": "^4.11.2", - "@material-ui/lab": "^4.0.0-alpha.57", - "react": "^17.0.1", - "react-dom": "^17.0.1" - } - }, "node_modules/d3": { "version": "4.13.0", "resolved": "https://registry.npmjs.org/d3/-/d3-4.13.0.tgz", @@ -14025,6 +14146,7 @@ "version": "4.3.4", "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", + "dev": true, "dependencies": { "ms": "2.1.2" }, @@ -14595,7 +14717,8 @@ "node_modules/electron-to-chromium": { "version": "1.4.652", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.652.tgz", - "integrity": "sha512-XvQaa8hVUAuEJtLw6VKQqvdOxTOfBLWfI10t2xWpezx4XXD3k8bdLweEKeItqaa0+OkJX5l0mP1W+JWobyIDrg==" + "integrity": "sha512-XvQaa8hVUAuEJtLw6VKQqvdOxTOfBLWfI10t2xWpezx4XXD3k8bdLweEKeItqaa0+OkJX5l0mP1W+JWobyIDrg==", + "dev": true }, "node_modules/emoji-regex": { "version": "9.2.2", @@ -14858,6 +14981,7 @@ "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==", + "dev": true, "engines": { "node": ">=6" } @@ -16763,6 +16887,7 @@ "version": "1.0.0-beta.2", "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz", "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==", + "dev": true, "engines": { "node": ">=6.9.0" } @@ -16955,6 +17080,7 @@ "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", "integrity": "sha512-WOBp/EEGUiIsJSp7wcv/y6MO+lV9UoncWqxuFfm8eBwzWNgyfBd6Gz+IeKQ9jCmyhoH99g15M3T+QaVHFjizVA==", + "dev": true, "engines": { "node": ">=4" } @@ -17496,11 +17622,6 @@ "node": ">=10" } }, - "node_modules/hyphenate-style-name": { - "version": "1.0.4", - "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.4.tgz", - "integrity": "sha512-ygGZLjmXfPHj+ZWh6LwbC37l43MhfztxetbFCoYTM2VjkIUpeHgSNn7QIyVFj7YQ1Wl9Cbw5sholVJPzWvC2MQ==" - }, "node_modules/iconv-lite": { "version": "0.4.24", "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz", @@ -17900,11 +18021,6 @@ "node": ">=0.10.0" } }, - "node_modules/is-in-browser": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/is-in-browser/-/is-in-browser-1.1.3.tgz", - "integrity": "sha512-FeXIBgG/CPGd/WUxuEyvgGTEfwiG9Z4EKGxjNMRqviiIIfsmgrpnHLffEDdwUHqNva1VEW91o3xBT/m8Elgl9g==" - }, "node_modules/is-interactive": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-1.0.0.tgz", @@ -18474,6 +18590,7 @@ "version": "2.5.2", "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==", + "dev": true, "bin": { "jsesc": "bin/jsesc" }, @@ -18508,6 +18625,7 @@ "version": "2.2.3", "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz", "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==", + "dev": true, "bin": { "json5": "lib/cli.js" }, @@ -18524,88 +18642,6 @@ "graceful-fs": "^4.1.6" } }, - "node_modules/jss": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss/-/jss-10.9.2.tgz", - "integrity": "sha512-b8G6rWpYLR4teTUbGd4I4EsnWjg7MN0Q5bSsjKhVkJVjhQDy2KzkbD2AW3TuT0RYZVmZZHKIrXDn6kjU14qkUg==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "csstype": "^3.0.2", - "is-in-browser": "^1.1.3", - "tiny-warning": "^1.0.2" - }, - "funding": { - "type": "opencollective", - "url": "https://opencollective.com/jss" - } - }, - "node_modules/jss-plugin-camel-case": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-camel-case/-/jss-plugin-camel-case-10.9.2.tgz", - "integrity": "sha512-wgBPlL3WS0WDJ1lPJcgjux/SHnDuu7opmgQKSraKs4z8dCCyYMx9IDPFKBXQ8Q5dVYij1FFV0WdxyhuOOAXuTg==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "hyphenate-style-name": "^1.0.3", - "jss": "10.9.2" - } - }, - "node_modules/jss-plugin-default-unit": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-default-unit/-/jss-plugin-default-unit-10.9.2.tgz", - "integrity": "sha512-pYg0QX3bBEFtTnmeSI3l7ad1vtHU42YEEpgW7pmIh+9pkWNWb5dwS/4onSfAaI0kq+dOZHzz4dWe+8vWnanoSg==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.9.2" - } - }, - "node_modules/jss-plugin-global": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-global/-/jss-plugin-global-10.9.2.tgz", - "integrity": "sha512-GcX0aE8Ef6AtlasVrafg1DItlL/tWHoC4cGir4r3gegbWwF5ZOBYhx04gurPvWHC8F873aEGqge7C17xpwmp2g==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.9.2" - } - }, - "node_modules/jss-plugin-nested": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-nested/-/jss-plugin-nested-10.9.2.tgz", - "integrity": "sha512-VgiOWIC6bvgDaAL97XCxGD0BxOKM0K0zeB/ECyNaVF6FqvdGB9KBBWRdy2STYAss4VVA7i5TbxFZN+WSX1kfQA==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.9.2", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-props-sort": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-props-sort/-/jss-plugin-props-sort-10.9.2.tgz", - "integrity": "sha512-AP1AyUTbi2szylgr+O0OB7gkIxEGzySLITZ2GpsaoX72YMCGI2jYAc+WUhPfvUnZYiauF4zTnN4V4TGuvFjJlw==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.9.2" - } - }, - "node_modules/jss-plugin-rule-value-function": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-rule-value-function/-/jss-plugin-rule-value-function-10.9.2.tgz", - "integrity": "sha512-vf5ms8zvLFMub6swbNxvzsurHfUZ5Shy5aJB2gIpY6WNA3uLinEcxYyraQXItRHi5ivXGqYciFDRM2ZoVoRZ4Q==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "jss": "10.9.2", - "tiny-warning": "^1.0.2" - } - }, - "node_modules/jss-plugin-vendor-prefixer": { - "version": "10.9.2", - "resolved": "https://registry.npmjs.org/jss-plugin-vendor-prefixer/-/jss-plugin-vendor-prefixer-10.9.2.tgz", - "integrity": "sha512-SxcEoH+Rttf9fEv6KkiPzLdXRmI6waOTcMkbbEFgdZLDYNIP9UKNHFy6thhbRKqv0XMQZdrEsbDyV464zE/dUA==", - "dependencies": { - "@babel/runtime": "^7.3.1", - "css-vendor": "^2.0.8", - "jss": "10.9.2" - } - }, "node_modules/jsx-ast-utils": { "version": "3.3.3", "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-3.3.3.tgz", @@ -19429,7 +19465,8 @@ "node_modules/ms": { "version": "2.1.2", "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz", - "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==" + "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==", + "dev": true }, "node_modules/nanoid": { "version": "3.3.7", @@ -19617,7 +19654,8 @@ "node_modules/node-releases": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz", - "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==" + "integrity": "sha512-y10wOWt8yZpqXmOgRo77WaHEmhYQYGNA6y421PKsKYWEK8aW+cqAphborZDhqfyKrbZEN92CN1X2KbafY2s7Yw==", + "dev": true }, "node_modules/normalize-package-data": { "version": "2.5.0", @@ -20423,7 +20461,8 @@ "node_modules/picocolors": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.0.0.tgz", - "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==" + "integrity": "sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==", + "dev": true }, "node_modules/picomatch": { "version": "2.3.1", @@ -22525,7 +22564,8 @@ "node_modules/safe-buffer": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz", - "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==" + "integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g==", + "dev": true }, "node_modules/safe-identifier": { "version": "0.4.2", @@ -22575,6 +22615,7 @@ "version": "6.3.1", "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz", "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==", + "dev": true, "bin": { "semver": "bin/semver.js" } @@ -23378,9 +23419,9 @@ } }, "node_modules/stylis": { - "version": "4.0.13", - "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.0.13.tgz", - "integrity": "sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==" + "version": "4.2.0", + "resolved": "https://registry.npmjs.org/stylis/-/stylis-4.2.0.tgz", + "integrity": "sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==" }, "node_modules/supports-color": { "version": "7.2.0", @@ -23919,11 +23960,6 @@ "integrity": "sha512-AD5ih2NlSssTCwsMznbvwMZpJ1cbhkGd2uueNxzv2jDlEeZdU04JQfRnggJQ8DrcVBGjAsCKwFBbDlVNtEMlzw==", "dev": true }, - "node_modules/tiny-warning": { - "version": "1.0.3", - "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz", - "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA==" - }, "node_modules/tinyqueue": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/tinyqueue/-/tinyqueue-2.0.3.tgz", @@ -24343,6 +24379,7 @@ "version": "1.0.13", "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.0.13.tgz", "integrity": "sha512-xebP81SNcPuNpPP3uzeW1NYXxI3rxyJzF3pD6sH4jE7o/IX+WtSpwnVU+qIsDPyk0d3hmFQ7mjqc6AtV604hbg==", + "dev": true, "funding": [ { "type": "opencollective", diff --git a/client/package.json b/client/package.json index 599645c0a..1a70e15dd 100644 --- a/client/package.json +++ b/client/package.json @@ -57,15 +57,16 @@ "@blueprintjs/core": "^5.11.0", "@blueprintjs/icons": "^5.11.0", "@blueprintjs/select": "^5.2.2", - "@emotion/css": "^11.9.0", - "@emotion/react": "^11.9.3", - "@emotion/styled": "^11.9.3", - "@material-ui/core": "^4.12.4", - "@material-ui/icons": "^4.11.3", - "@material-ui/lab": "^4.0.0-alpha.61", + "@czi-sds/components": "^20.7.0", + "@emotion/css": "^11.13.0", + "@emotion/react": "^11.13.0", + "@emotion/styled": "^11.13.0", + "@mui/base": "^5.0.0-beta.40", + "@mui/icons-material": "^5.16.7", + "@mui/lab": "^5.0.0-alpha.173", + "@mui/material": "^5.16.7", "abort-controller": "^3.0.0", "core-js": "^3.6.5", - "czifui": "^6.6.0", "d3": "^4.10.0", "d3-scale-chromatic": "^1.5.0", "flatbuffers": "^1.11.0", diff --git a/client/src/common/style.ts b/client/src/common/style.ts new file mode 100644 index 000000000..96f2c37ba --- /dev/null +++ b/client/src/common/style.ts @@ -0,0 +1,17 @@ +import styled from "@emotion/styled"; +import { Button } from "@czi-sds/components"; + +export const InfoButton = styled(Button)` + padding: 0; + width: 18px; + min-width: 18px; + &:hover { + background-color: transparent; + } +`; + +export const InfoButtonWrapper = styled.div` + display: inline-block; + height: 18px; + width: 18px; +`; diff --git a/client/src/components/BottomBanner/index.tsx b/client/src/components/BottomBanner/index.tsx index 2ef7ae7bb..2e61541c1 100644 --- a/client/src/components/BottomBanner/index.tsx +++ b/client/src/components/BottomBanner/index.tsx @@ -26,45 +26,45 @@ const mapDispatchToProps = (dispatch: AppDispatch) => ({ dispatch, }); -const BottomBanner = memo( - ({ - surveyLink, - showBottomBanner, - dispatch, - }: BottomBannerProps): JSX.Element | null => { - const setBottomBannerLastClosedTime = () => { - dispatch({ - type: "update bottom banner last closed time", - time: Date.now(), - }); - }; +function BannerContent({ surveyLink }: { surveyLink: string }): JSX.Element { + return ( + + {BOTTOM_BANNER_SURVEY_TEXT} + + {BOTTOM_BANNER_SURVEY_LINK_TEXT} + + + ); +} + +function BottomBanner({ + surveyLink, + showBottomBanner, + dispatch, +}: BottomBannerProps): JSX.Element | null { + const setBottomBannerLastClosedTime = () => { + dispatch({ + type: "update bottom banner last closed time", + time: Date.now(), + }); + }; - if (!showBottomBanner) return null; + if (!showBottomBanner) return null; - return ( - <> - - - {BOTTOM_BANNER_SURVEY_TEXT} - - {BOTTOM_BANNER_SURVEY_LINK_TEXT} - - - } - /> - - - ); - } -); + return ( + + + + + + ); +} -export default connect(mapStateToProps, mapDispatchToProps)(BottomBanner); +export default connect(mapStateToProps, mapDispatchToProps)(memo(BottomBanner)); diff --git a/client/src/components/BottomBanner/style.ts b/client/src/components/BottomBanner/style.ts index cf6c75b5e..74cd9d8b4 100644 --- a/client/src/components/BottomBanner/style.ts +++ b/client/src/components/BottomBanner/style.ts @@ -1,5 +1,5 @@ import styled from "@emotion/styled"; -import { Banner, Icon } from "czifui"; +import { Banner, Icon } from "@czi-sds/components"; import { beta100, beta400, gray500 } from "../theme"; export const SKINNY_MODE_BREAKPOINT_WIDTH = 960; diff --git a/client/src/components/NavBar/components/NavDivider/style.ts b/client/src/components/NavBar/components/NavDivider/style.ts index 9254bed24..cef3f23d2 100644 --- a/client/src/components/NavBar/components/NavDivider/style.ts +++ b/client/src/components/NavBar/components/NavDivider/style.ts @@ -1,8 +1,6 @@ -import { Divider } from "@material-ui/core"; -import { CommonThemeProps, getColors } from "czifui"; +import { Divider } from "@mui/material"; import styled from "@emotion/styled"; - -const gray500 = (props: CommonThemeProps) => getColors(props)?.gray[500]; +import { gray500 } from "../../../theme"; export const NavDivider = styled(Divider)` background-color: ${gray500}; diff --git a/client/src/components/NavBar/style.ts b/client/src/components/NavBar/style.ts index dfb4835da..f221e2728 100644 --- a/client/src/components/NavBar/style.ts +++ b/client/src/components/NavBar/style.ts @@ -1,7 +1,7 @@ import { Classes } from "@blueprintjs/core"; import styled from "@emotion/styled"; import { css } from "@emotion/react"; -import { Chip, CommonThemeProps, fontCapsXxxs } from "czifui"; +import { Tag, CommonThemeProps, fontCapsXxxs } from "@czi-sds/components"; import { PT_TEXT_COLOR } from "./theme"; import { HEADER_HEIGHT_PX } from "../../globals"; import { @@ -105,7 +105,7 @@ export const NavItemContainer = styled.span` gap: ${spacesL}px; `; -export const BetaChip = styled(Chip)` +export const BetaChip = styled(Tag)` background: #7a41ce; color: white; margin-left: 4px; diff --git a/client/src/components/app.tsx b/client/src/components/app.tsx index e17eda196..4b951d61c 100644 --- a/client/src/components/app.tsx +++ b/client/src/components/app.tsx @@ -2,7 +2,7 @@ import React from "react"; import Helmet from "react-helmet"; import { connect } from "react-redux"; import { ThemeProvider as EmotionThemeProvider } from "@emotion/react"; -import { StylesProvider, ThemeProvider } from "@material-ui/core/styles"; +import { StyledEngineProvider, ThemeProvider } from "@mui/material/styles"; import { theme } from "./theme"; import BottomBanner from "./BottomBanner"; @@ -78,7 +78,7 @@ class App extends React.Component { } = this.props; return ( - + @@ -134,7 +134,7 @@ class App extends React.Component { - + ); } diff --git a/client/src/components/categorical/value/index.tsx b/client/src/components/categorical/value/index.tsx index cc88af45c..18902ca49 100644 --- a/client/src/components/categorical/value/index.tsx +++ b/client/src/components/categorical/value/index.tsx @@ -1,9 +1,7 @@ import { connect } from "react-redux"; import React from "react"; import * as d3 from "d3"; -import { Icon as InfoCircle, IconButton } from "czifui"; - -import { AnchorButton, Classes } from "@blueprintjs/core"; +import { Classes } from "@blueprintjs/core"; import * as globals from "../../../globals"; // @ts-expect-error ts-migrate(2307) FIXME: Cannot find module '../categorical.css' or its cor... Remove this comment to see the full error message import styles from "../categorical.css"; @@ -23,6 +21,7 @@ import { isDataframeDictEncodedColumn } from "../../../util/dataframe/types"; import { CategorySummary } from "../../../util/stateManager/controlsHelpers"; import { ColorTable } from "../../../util/stateManager/colorHelpers"; import { ActiveTab } from "../../../common/types/entities"; +import { InfoButton, InfoButtonWrapper } from "../../../common/style"; const STACKED_BAR_HEIGHT = 11; const STACKED_BAR_WIDTH = 100; @@ -124,13 +123,13 @@ class CategoryValue extends React.Component { } } - labelNameError = (name: any) => { + labelNameError = (name: string) => { const { metadataField, schema } = this.props; if (name === this.currentLabelAsString()) return false; return isLabelErroneous(name, metadataField, schema); }; - instruction = (label: any) => + instruction = (label: string) => labelPrompt(this.labelNameError(label), "New, unique label", ":"); activateEditLabelMode = () => { @@ -646,26 +645,16 @@ class CategoryValue extends React.Component { {isCellInfo && ( -
- + this.handleDisplayCellTypeInfo(displayString)} - style={{ minHeight: "18px", minWidth: "18px", padding: 0 }} - > - -
- -
- - -
+ sdsType="tertiary" + sdsStyle="icon" + icon="InfoCircle" + sdsSize="small" + /> + )} diff --git a/client/src/components/diffexNotice/style.ts b/client/src/components/diffexNotice/style.ts index 66b97a72c..74d19d47e 100644 --- a/client/src/components/diffexNotice/style.ts +++ b/client/src/components/diffexNotice/style.ts @@ -1,6 +1,6 @@ import styled from "@emotion/styled"; -import Snackbar from "@material-ui/core/Snackbar"; -import { Alert } from "@material-ui/lab"; +import Snackbar from "@mui/material/Snackbar"; +import { Alert } from "@mui/lab"; export const StyledSnackbar = styled(Snackbar)` width: 423px; diff --git a/client/src/components/embedding/components/Opacities/components/Opacity/index.tsx b/client/src/components/embedding/components/Opacities/components/Opacity/index.tsx index db503c445..410c5c05e 100644 --- a/client/src/components/embedding/components/Opacities/components/Opacity/index.tsx +++ b/client/src/components/embedding/components/Opacities/components/Opacity/index.tsx @@ -1,7 +1,5 @@ -import React, { ChangeEvent } from "react"; -import { InputSlider } from "czifui"; -import { SliderProps } from "@material-ui/core"; - +import React from "react"; +import { InputSlider } from "@czi-sds/components"; import { kebabCase } from "lodash"; import { HeaderWrapper, @@ -31,7 +29,7 @@ interface Props { name: string; value: number; handleChange: ( - event: ChangeEvent, + event: Event | React.ChangeEvent, value: number | number[] ) => void; } @@ -73,7 +71,7 @@ export default function Opacity({ name, value, handleChange }: Props) { step={10} min={0} max={100} - onChange={handleChange as SliderProps["onChange"]} + onChange={handleChange} /> ); diff --git a/client/src/components/embedding/components/Opacities/components/Opacity/style.ts b/client/src/components/embedding/components/Opacities/components/Opacity/style.ts index 2f43b08e7..563fe1e05 100644 --- a/client/src/components/embedding/components/Opacities/components/Opacity/style.ts +++ b/client/src/components/embedding/components/Opacities/components/Opacity/style.ts @@ -1,5 +1,5 @@ import styled from "@emotion/styled"; -import { InputText } from "czifui"; +import { InputText } from "@czi-sds/components"; import { fontWeightBold, spacesM, @@ -40,6 +40,7 @@ export const StyledInputText = styled(InputText)` /* Firefox remove up/down arrow */ input[type="number"] { -moz-appearance: textfield; + appearance: textfield; } input { diff --git a/client/src/components/embedding/components/Opacities/index.tsx b/client/src/components/embedding/components/Opacities/index.tsx index 60cb44711..88df01479 100644 --- a/client/src/components/embedding/components/Opacities/index.tsx +++ b/client/src/components/embedding/components/Opacities/index.tsx @@ -1,4 +1,4 @@ -import React, { ChangeEvent } from "react"; +import React from "react"; import { connect } from "react-redux"; import { Section, Wrapper } from "./style"; @@ -27,7 +27,7 @@ function Opacities({ imageOpacity, dotOpacity, dispatch }: Props) { ); function handleImageOpacityChange( - _: ChangeEvent, + _: Event | React.ChangeEvent, value: number | number[] ) { dispatch({ @@ -37,7 +37,7 @@ function Opacities({ imageOpacity, dotOpacity, dispatch }: Props) { } function handleDotOpacityChange( - _: ChangeEvent, + _: Event | React.ChangeEvent, value: number | number[] ) { dispatch({ diff --git a/client/src/components/geneExpression/gene/index.tsx b/client/src/components/geneExpression/gene/index.tsx index bc199fbf6..3c7e34f3e 100644 --- a/client/src/components/geneExpression/gene/index.tsx +++ b/client/src/components/geneExpression/gene/index.tsx @@ -1,8 +1,7 @@ import React from "react"; -import { AnchorButton, Button, Icon } from "@blueprintjs/core"; +import { Button, Icon } from "@blueprintjs/core"; import { connect } from "react-redux"; -import { Icon as InfoCircle, IconButton } from "czifui"; import Truncate from "../../util/truncate"; import HistogramBrush from "../../brushableHistogram"; @@ -17,6 +16,7 @@ import { EVENTS } from "../../../analytics/events"; import { ActiveTab } from "../../../common/types/entities"; import { State, Props, mapStateToProps, mapDispatchToProps } from "./types"; import { MINI_HISTOGRAM_WIDTH } from "../constants"; +import { InfoButton, InfoButtonWrapper } from "../../../common/style"; class Gene extends React.Component { constructor(props: Props) { @@ -112,7 +112,6 @@ class Gene extends React.Component { removeGene, onGeneExpressionComplete, isGeneExpressionComplete, - isGeneInfo, } = this.props; const { geneIsExpanded } = this.state; const geneSymbolWidth = 60 + (geneIsExpanded ? MINI_HISTOGRAM_WIDTH : 0); @@ -155,30 +154,17 @@ class Gene extends React.Component { -
- + - -
- -
- - -
+ sdsType="tertiary" + sdsStyle="icon" + icon="InfoCircle" + sdsSize="small" + /> + {!geneIsExpanded ? (
- + {NCBI_WARNING} ); @@ -121,7 +121,9 @@ export function ShowInfo(props: ExtendedInfoProps) { symbol, showWarningBanner, } = props; + const externalUrl = id ? url + id : url; + const infoTypeTag = kebabCase(infoType); return ( diff --git a/client/src/components/geneExpression/infoSearch/connect.ts b/client/src/components/geneExpression/infoPanel/common/infoSearch/connect.ts similarity index 93% rename from client/src/components/geneExpression/infoSearch/connect.ts rename to client/src/components/geneExpression/infoPanel/common/infoSearch/connect.ts index a6398997e..7801f9c40 100644 --- a/client/src/components/geneExpression/infoSearch/connect.ts +++ b/client/src/components/geneExpression/infoPanel/common/infoSearch/connect.ts @@ -1,8 +1,8 @@ import fuzzysort from "fuzzysort"; -import actions from "../../../actions"; +import actions from "../../../../../actions"; import { Item } from "./types"; -import { AppDispatch } from "../../../reducers"; +import { AppDispatch } from "../../../../../reducers"; export default function useConnect({ infoType, diff --git a/client/src/components/geneExpression/infoSearch/index.tsx b/client/src/components/geneExpression/infoPanel/common/infoSearch/index.tsx similarity index 97% rename from client/src/components/geneExpression/infoSearch/index.tsx rename to client/src/components/geneExpression/infoPanel/common/infoSearch/index.tsx index 86e2851c0..d6c8956e1 100644 --- a/client/src/components/geneExpression/infoSearch/index.tsx +++ b/client/src/components/geneExpression/infoPanel/common/infoSearch/index.tsx @@ -12,7 +12,7 @@ import { mapDispatchToProps, } from "./types"; import useConnect from "./connect"; -import { InfoSearchWrapper } from "./styles"; +import { InfoSearchWrapper } from "./style"; function InfoSearch(props: Props) { const { infoType, isLoading, quickList, dispatch } = props; diff --git a/client/src/components/geneExpression/infoSearch/styles.ts b/client/src/components/geneExpression/infoPanel/common/infoSearch/style.ts similarity index 100% rename from client/src/components/geneExpression/infoSearch/styles.ts rename to client/src/components/geneExpression/infoPanel/common/infoSearch/style.ts diff --git a/client/src/components/geneExpression/infoSearch/types.ts b/client/src/components/geneExpression/infoPanel/common/infoSearch/types.ts similarity index 92% rename from client/src/components/geneExpression/infoSearch/types.ts rename to client/src/components/geneExpression/infoPanel/common/infoSearch/types.ts index 6dbadd081..2bea61576 100644 --- a/client/src/components/geneExpression/infoSearch/types.ts +++ b/client/src/components/geneExpression/infoPanel/common/infoSearch/types.ts @@ -1,4 +1,4 @@ -import { AppDispatch } from "../../../reducers"; +import { AppDispatch } from "../../../../../reducers"; export interface FuzzySortResult { target: string; diff --git a/client/src/components/geneExpression/infoPanel/common/style.ts b/client/src/components/geneExpression/infoPanel/common/style.ts index 5d5a7d127..6d3fbc24b 100644 --- a/client/src/components/geneExpression/infoPanel/common/style.ts +++ b/client/src/components/geneExpression/infoPanel/common/style.ts @@ -1,17 +1,24 @@ import styled from "@emotion/styled"; import { fontBodyXs, - getFontWeights, fontBodyS, - getColors, fontHeaderL, fontHeaderM, -} from "czifui"; +} from "@czi-sds/components"; import { Icon } from "@blueprintjs/core"; import * as globals from "../../../../globals"; import * as styles from "../../util"; -import { gray100, gray500, spacesM } from "../../../theme"; +import { + fontWeightRegular, + fontWeightSemibold, + gray100, + gray500, + primary400, + spacesM, + warning100, + warning400, +} from "../../../theme"; export const InfoWrapper = styled.div` display: flex; @@ -37,13 +44,7 @@ export const InfoSymbol = styled.h1` text-overflow: ellipsis; color: black; ${fontHeaderL} - ${(props) => { - const fontWeights = getFontWeights(props); - - return ` - font-weight: ${fontWeights?.semibold}; - `; - }} + font-weight: ${fontWeightSemibold}; `; export const InfoTitle = styled.div` @@ -67,41 +68,21 @@ export const ContentRow = styled.p` export const InfoLabel = styled.span` ${fontBodyXs} - ${(props) => { - const colors = getColors(props); - const fontWeights = getFontWeights(props); - - return ` - color: ${colors?.gray[500]}; - font-weight: ${fontWeights?.regular}; - `; - }} + color: ${gray500}; + font-weight: ${fontWeightRegular}; `; export const Items = styled.span` padding: 4px; color: black; - ${fontBodyXs} - ${(props) => { - const fontWeights = getFontWeights(props); - - return ` - font-weight: ${fontWeights?.regular}; - `; - }} + font-weight: ${fontWeightRegular}; `; export const Link = styled.a` font-weight: 500; ${fontBodyS} - ${(props) => { - const colors = getColors(props); - - return ` - color: ${colors?.primary[400]}; - `; - }} + color: ${primary400}; `; export const WarningBanner = styled.div` @@ -112,15 +93,10 @@ export const WarningBanner = styled.div` margin-left: 10px; } ${fontBodyXs} - ${(props) => { - const colors = getColors(props); - return ` - background-color: ${colors?.warning[100]}; - svg { - fill: ${colors?.warning[400]} - } - `; - }} + background-color: ${warning100}; + svg { + fill: ${warning400}; + } `; export const NoGeneSelectedDiv = styled.div` @@ -138,17 +114,16 @@ export const NoGeneSelectedDiv = styled.div` export const MessageDiv = styled.div` ${fontBodyXs} font-weight: 400; - color: ${gray500}; + padding: 10px; &.title { color: black; ${fontHeaderM} font-weight: 700; } + color: ${gray500}; `; export const CustomIcon = styled(Icon)` - && { - color: ${gray500}; - } + color: ${gray500}; `; diff --git a/client/src/components/geneExpression/infoPanel/connect.ts b/client/src/components/geneExpression/infoPanel/connect.ts index ec9529ede..ba29efea5 100644 --- a/client/src/components/geneExpression/infoPanel/connect.ts +++ b/client/src/components/geneExpression/infoPanel/connect.ts @@ -1,4 +1,4 @@ -import { ChangeEvent, useEffect, useState } from "react"; +import { SyntheticEvent, useEffect, useState } from "react"; import { AppDispatch } from "../../../reducers"; import { ActiveTab } from "../../../common/types/entities"; @@ -15,7 +15,7 @@ function useConnect({ * TODO: update to once we upgrade MUI */ const handleTabsChange = ( - _: ChangeEvent>, + _: SyntheticEvent, activeTabValue: ActiveTab ) => { setTabValue(activeTabValue); diff --git a/client/src/components/geneExpression/infoPanel/index.tsx b/client/src/components/geneExpression/infoPanel/index.tsx index 12fe36da8..32f1de26f 100644 --- a/client/src/components/geneExpression/infoPanel/index.tsx +++ b/client/src/components/geneExpression/infoPanel/index.tsx @@ -1,7 +1,7 @@ import React from "react"; import { connect } from "react-redux"; import { AnchorButton, ButtonGroup } from "@blueprintjs/core"; -import { Tabs, Tab } from "czifui"; +import { Tabs, Tab } from "@czi-sds/components"; import { CollapseToggle, diff --git a/client/src/components/geneExpression/infoPanel/infoPanelGene/index.tsx b/client/src/components/geneExpression/infoPanel/infoPanelGene/index.tsx index 6a64dc238..c2d01f970 100644 --- a/client/src/components/geneExpression/infoPanel/infoPanelGene/index.tsx +++ b/client/src/components/geneExpression/infoPanel/infoPanelGene/index.tsx @@ -6,7 +6,6 @@ import InfoPanelContainer from "../common/infoPanelContainer"; import { EMPTY_ARRAY } from "../../../../common/constants"; - function GeneInfo(props: Props) { const { geneInfo, geneList } = props; diff --git a/client/src/components/geneExpression/quickGene.tsx b/client/src/components/geneExpression/quickGene.tsx index 256032bde..bf8194bf6 100644 --- a/client/src/components/geneExpression/quickGene.tsx +++ b/client/src/components/geneExpression/quickGene.tsx @@ -13,7 +13,11 @@ import actions from "../../actions"; import { Dataframe, DataframeValue } from "../../util/dataframe"; import { track } from "../../analytics"; import { EVENTS } from "../../analytics/events"; -import { FuzzySortResult, Item, RenderItemProps } from "./infoSearch/types"; +import { + FuzzySortResult, + Item, + RenderItemProps, +} from "./infoPanel/common/infoSearch/types"; // eslint-disable-next-line @typescript-eslint/no-explicit-any --- FIXME: disabled temporarily on migrate to TS. const usePrevious = (value: any) => { diff --git a/client/src/components/theme.ts b/client/src/components/theme.ts index 0ef421db4..0a40d6812 100644 --- a/client/src/components/theme.ts +++ b/client/src/components/theme.ts @@ -6,12 +6,12 @@ import { getPalette, getShadows, getSpaces, - defaultAppTheme, + SDSAppTheme, makeThemeOptions, -} from "czifui"; -import { createTheme } from "@material-ui/core/styles"; +} from "@czi-sds/components"; +import { createTheme } from "@mui/material/styles"; -const { fontWeights } = defaultAppTheme; +const { fontWeights } = SDSAppTheme; const iconSizes = { input: { height: 16, width: 16 }, // for use with input icons only (radio and checkbox) @@ -57,125 +57,251 @@ export const cornersM = (props: CommonThemeProps) => getCorners(props)?.m; export const cornersS = (props: CommonThemeProps) => getCorners(props)?.s; export const cornersNone = (props: CommonThemeProps) => getCorners(props)?.none; +const tabularNums = "tabular-nums"; + const typography = { fontFamily: "Roboto Condensed", + styles: { body: { - button: { - fontSize: 14, - fontWeight: fontWeights.medium, - letterSpacing: "0px", - lineHeight: "20px", - textTransform: "none" as const, - }, - l: { - fontSize: 18, - fontWeight: fontWeights.regular, - letterSpacing: "0px", - lineHeight: "24px", - }, - m: { - fontSize: 16, - fontWeight: fontWeights.regular, - letterSpacing: "0px", - lineHeight: "24px", + regular: { + button: { + fontSize: 14, + fontWeight: fontWeights.medium, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, + l: { + fontSize: 18, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "24px", + }, + m: { + fontSize: 16, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "24px", + }, + s: { + fontSize: 14, + fontWeight: fontWeights.regular, + letterSpacing: "-0.08px", + lineHeight: "20px", + }, + xs: { + fontSize: 13, + fontWeight: fontWeights.regular, + letterSpacing: "-0.04px", + lineHeight: "20px", + }, + xxs: { + fontSize: 12, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "16px", + }, + xxxs: { + fontSize: 11, + fontWeight: fontWeights.regular, + letterSpacing: "-0.05px", + lineHeight: "16px", + }, }, - s: { - fontSize: 14, - fontWeight: fontWeights.regular, - letterSpacing: "-0.08px", - lineHeight: "20px", - }, - xs: { - fontSize: 13, - fontWeight: fontWeights.regular, - letterSpacing: "-0.04px", - lineHeight: "20px", - }, - xxs: { - fontSize: 12, - fontWeight: fontWeights.regular, - letterSpacing: "0px", - lineHeight: "16px", - }, - xxxs: { - fontSize: 11, - fontWeight: fontWeights.regular, - letterSpacing: "-0.05px", - lineHeight: "16px", + semibold: { + button: { + fontSize: 14, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, + l: { + fontSize: 18, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "24px", + }, + m: { + fontSize: 16, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "24px", + }, + s: { + fontSize: 14, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.08px", + lineHeight: "20px", + }, + xs: { + fontSize: 13, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.04px", + lineHeight: "20px", + }, + xxs: { + fontSize: 12, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "16px", + }, + xxxs: { + fontSize: 11, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.05px", + lineHeight: "16px", + }, }, }, caps: { - xxs: { - fontSize: 12, - fontWeight: fontWeights.semibold, - letterSpacing: "0.36px", - lineHeight: "16px", - textTransform: "uppercase" as const, + semibold: { + xxs: { + fontSize: 12, + fontWeight: fontWeights.semibold, + letterSpacing: "0.36px", + lineHeight: "16px", + textTransform: "uppercase" as const, + }, + xxxs: { + fontSize: 11, + fontWeight: fontWeights.semibold, + letterSpacing: "0.33px", + lineHeight: "16px", + textTransform: "uppercase" as const, + }, + xxxxs: { + fontSize: 10, + fontWeight: fontWeights.semibold, + letterSpacing: "1.0px", + lineHeight: "12px", + textTransform: "uppercase" as const, + }, }, - xxxs: { - fontSize: 11, - fontWeight: fontWeights.semibold, - letterSpacing: "0.33px", - lineHeight: "16px", - textTransform: "uppercase" as const, + }, + code: { + regular: { + s: { + fontSize: 14, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "24px", + textTransform: "none" as const, + }, + xs: { + fontSize: 13, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, }, - xxxxs: { - fontSize: 10, - fontWeight: fontWeights.semibold, - letterSpacing: "1.0px", - lineHeight: "12px", - textTransform: "uppercase" as const, + semibold: { + s: { + fontSize: 14, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "24px", + textTransform: "none" as const, + }, + xs: { + fontSize: 13, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, }, }, header: { - l: { - fontSize: 18, - fontWeight: fontWeights.semibold, - letterSpacing: "-0.31px", - lineHeight: "24px", + semibold: { + l: { + fontSize: 18, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.31px", + lineHeight: "24px", + }, + m: { + fontSize: 16, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.18px", + lineHeight: "20px", + }, + s: { + fontSize: 14, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.1px", + lineHeight: "20px", + }, + xl: { + fontSize: 24, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.37px", + lineHeight: "32px", + }, + xs: { + fontSize: 13, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "16px", + }, + xxl: { + fontSize: 32, + fontWeight: fontWeights.semibold, + letterSpacing: "-0.56px", + lineHeight: "36px", + }, + xxs: { + fontSize: 12, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "16px", + }, + xxxs: { + fontSize: 11, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "16px", + }, }, - m: { - fontSize: 16, - fontWeight: fontWeights.semibold, - letterSpacing: "-0.18px", - lineHeight: "20px", - }, - s: { - fontSize: 14, - fontWeight: fontWeights.semibold, - letterSpacing: "-0.1px", - lineHeight: "20px", - }, - xl: { - fontSize: 24, - fontWeight: fontWeights.semibold, - letterSpacing: "-0.37px", - lineHeight: "32px", - }, - xs: { - fontSize: 13, - fontWeight: fontWeights.semibold, - letterSpacing: "0px", - lineHeight: "16px", - }, - xxl: { - fontSize: 32, - fontWeight: fontWeights.semibold, - letterSpacing: "-0.56px", - lineHeight: "36px", - }, - xxs: { - fontSize: 12, - fontWeight: fontWeights.semibold, - letterSpacing: "0px", - lineHeight: "16px", + }, + tabular: { + regular: { + s: { + fontSize: 14, + fontVariantNumeric: tabularNums, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "24px", + textTransform: "none" as const, + }, + xs: { + fontSize: 13, + fontVariantNumeric: tabularNums, + fontWeight: fontWeights.regular, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, }, - xxxs: { - fontSize: 11, - fontWeight: fontWeights.semibold, - letterSpacing: "0px", - lineHeight: "16px", + semibold: { + s: { + fontSize: 14, + fontVariantNumeric: tabularNums, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "24px", + textTransform: "none" as const, + }, + xs: { + fontSize: 13, + fontVariantNumeric: tabularNums, + fontWeight: fontWeights.semibold, + letterSpacing: "0px", + lineHeight: "20px", + textTransform: "none" as const, + }, }, }, }, @@ -188,7 +314,7 @@ const customTheme = { typography, }; -const themeOptions = { ...defaultAppTheme, ...customTheme }; +const themeOptions = { ...SDSAppTheme, ...customTheme }; // Colors @@ -208,50 +334,39 @@ export const textSecondary = (props: CommonThemeProps) => getPalette(props)?.text?.secondary; export const primary100 = (props: CommonThemeProps) => - getColors(props)?.primary[100]; + getColors(props)?.blue[100]; export const primary400 = (props: CommonThemeProps) => - getColors(props)?.primary[400]; + getColors(props)?.blue[400]; export const primary500 = (props: CommonThemeProps) => - getColors(props)?.primary[500]; + getColors(props)?.blue[500]; export const primary600 = (props: CommonThemeProps) => - getColors(props)?.primary[600]; - -const infoColors = { - "100": primaryColors["100"], - "200": primaryColors["200"], - "400": primaryColors["400"], - "600": primaryColors["600"], -}; + getColors(props)?.blue[600]; -themeOptions.colors.primary = primaryColors; -themeOptions.colors.info = infoColors; +themeOptions.colors.blue = primaryColors; export const success100 = (props: CommonThemeProps) => - getColors(props)?.success[100]; + getColors(props)?.green[100]; export const success500 = (props: CommonThemeProps) => - getColors(props)?.success[500]; + getColors(props)?.green[500]; export const warning100 = (props: CommonThemeProps) => - getColors(props)?.warning[100]; + getColors(props)?.yellow[100]; export const warning400 = (props: CommonThemeProps) => - getColors(props)?.warning[400]; + getColors(props)?.yellow[400]; export const warning500 = (props: CommonThemeProps) => - getColors(props)?.warning[500]; + getColors(props)?.yellow[500]; -export const error100 = (props: CommonThemeProps) => - getColors(props)?.error[100]; +export const error100 = (props: CommonThemeProps) => getColors(props)?.red[100]; -export const error400 = (props: CommonThemeProps) => - getColors(props)?.error[400]; +export const error400 = (props: CommonThemeProps) => getColors(props)?.red[400]; -export const error500 = (props: CommonThemeProps) => - getColors(props)?.error[500]; +export const error500 = (props: CommonThemeProps) => getColors(props)?.red[500]; export const grey100 = (props: CommonThemeProps) => getColors(props)?.gray[100]; export const gray100 = grey100; @@ -276,11 +391,14 @@ export const grayWhite = greyWhite; themeOptions.colors.gray = { ...themeOptions.colors.gray, "400": "#999999" }; -export const beta100 = (props: CommonThemeProps) => getColors(props)?.beta[100]; +export const beta100 = (props: CommonThemeProps) => + getColors(props)?.purple[100]; -export const beta400 = (props: CommonThemeProps) => getColors(props)?.beta[400]; +export const beta400 = (props: CommonThemeProps) => + getColors(props)?.purple[400]; -export const beta600 = (props: CommonThemeProps) => getColors(props)?.beta[600]; +export const beta600 = (props: CommonThemeProps) => + getColors(props)?.purple[600]; export const OFF_WHITE = "#f8f8f8"; @@ -310,6 +428,7 @@ export const shadowL = (props: CommonThemeProps) => getShadows(props)?.l; export const shadowM = (props: CommonThemeProps) => getShadows(props)?.m; export const shadowS = (props: CommonThemeProps) => getShadows(props)?.s; +// @ts-expect-error due to Typography mismatch in ThemeOptions const appTheme = makeThemeOptions(themeOptions); export const theme = createTheme(appTheme); diff --git a/client/src/reducers/controls.ts b/client/src/reducers/controls.ts index 6cdb663dc..d9948e5dd 100644 --- a/client/src/reducers/controls.ts +++ b/client/src/reducers/controls.ts @@ -301,7 +301,7 @@ const Controls = ( geneName: action.info.name, geneSummary: action.info.summary, geneSynonyms: action.info.synonyms, - geneUrl: action.info.url, + geneUrl: action.info.ncbi_url, showWarningBanner: action.info.show_warning_banner, loading: false, },