diff --git a/apps/web-graphpolaris/src/app/app.tsx b/apps/web-graphpolaris/src/app/app.tsx
index aeebee3fe1845a9e354ce8186c9caf40426583b9..7230795259a44bfb926a5cb496e3639ba73e264c 100644
--- a/apps/web-graphpolaris/src/app/app.tsx
+++ b/apps/web-graphpolaris/src/app/app.tsx
@@ -1,72 +1,104 @@
// eslint-disable-next-line @typescript-eslint/no-unused-vars
+import * as React from 'react';
+import { createTheme, ThemeProvider } from '@mui/material/styles';
import {
assignNewGraphQueryResult,
useAppDispatch,
+ useColorPalette,
} from '@graphpolaris/shared/data-access/store';
import GridLayout from 'react-grid-layout';
import Panel from '../components/panels/panel';
import { RawJSONVis } from '../components/visualisations/rawjsonvis/rawjsonvis';
+import SemanticSubstrates from '../components/visualisations/semanticsubstrates/semanticsubstrates';
+import { Theme, Palette } from '@mui/material/styles';
+
+declare module '@mui/material/styles' {
+ interface PaletteOptions {
+ dataPointColors: React.CSSProperties['color'][];
+ }
+}
export function App() {
const dispatch = useAppDispatch();
+ const colorPalette = useColorPalette();
+
+ // Create a new theme when our custom color palette in redux changed
+ const theme = React.useMemo(
+ () =>
+ // Mapping our palette slice data to the mui theme could be a usecase
+ createTheme({
+ palette: {
+ primary: { main: colorPalette.primary.main },
+ dataPointColors: colorPalette.dataPointColors,
+ },
+ }),
+ [colorPalette]
+ );
+
return (
- <GridLayout
- className="layout"
- cols={10}
- rowHeight={30}
- width={window.innerWidth}
- >
- <div
- key="schema-panel"
- data-grid={{ x: 0, y: 0, w: 3, h: 30, maxW: 5, isDraggable: false }}
- >
- <Panel content="Schema Panel" color="red"></Panel>
- </div>
- <div
- key="query-panel"
- data-grid={{ x: 3, y: 20, w: 5, h: 10, maxH: 20, isDraggable: false }}
- >
- <Panel content="Query Panel" color="blue"></Panel>
- </div>
- <div
- key="visualisation-panel"
- data-grid={{ x: 3, y: 0, w: 7, h: 20, isDraggable: false }}
- >
- <Panel content="Visualisation Panel" color="green">
- <div>
- <button
- onClick={() =>
- dispatch(
- assignNewGraphQueryResult({
- nodes: [
- { id: 'agent/007', attributes: { name: 'Daniel Craig' } },
- ],
- links: [],
- })
- )
- }
- >
- Load in mock result
- </button>
- <button
- onClick={() =>
- dispatch(assignNewGraphQueryResult({ nodes: [], links: [] }))
- }
- >
- Remove mock result
- </button>
- </div>
- <RawJSONVis />
- <div />
- </Panel>
- </div>
- <div
- key="history-panel"
- data-grid={{ x: 8, y: 20, w: 2, h: 10, isDraggable: false }}
+ <ThemeProvider theme={theme}>
+ <GridLayout
+ className="layout"
+ cols={10}
+ rowHeight={30}
+ width={window.innerWidth}
>
- <Panel content="History Channel" color="purple"></Panel>
- </div>
- </GridLayout>
+ <div
+ key="schema-panel"
+ data-grid={{ x: 0, y: 0, w: 3, h: 30, maxW: 5, isDraggable: false }}
+ >
+ <Panel content="Schema Panel" color="red"></Panel>
+ </div>
+ <div
+ key="query-panel"
+ data-grid={{ x: 3, y: 20, w: 5, h: 10, maxH: 20, isDraggable: false }}
+ >
+ <Panel content="Query Panel" color="blue"></Panel>
+ </div>
+ <div
+ key="visualisation-panel"
+ data-grid={{ x: 3, y: 0, w: 7, h: 20, isDraggable: false }}
+ >
+ <Panel content="Visualisation Panel" color="green">
+ <div>
+ <button
+ onClick={() =>
+ dispatch(
+ assignNewGraphQueryResult({
+ nodes: [
+ {
+ id: 'agent/007',
+ attributes: { name: 'Daniel Craig' },
+ },
+ ],
+ links: [],
+ })
+ )
+ }
+ >
+ Load in mock result
+ </button>
+ <button
+ onClick={() =>
+ dispatch(assignNewGraphQueryResult({ nodes: [], links: [] }))
+ }
+ >
+ Remove mock result
+ </button>
+ </div>
+ <RawJSONVis />
+ <SemanticSubstrates />
+ <div />
+ </Panel>
+ </div>
+ <div
+ key="history-panel"
+ data-grid={{ x: 8, y: 20, w: 2, h: 10, isDraggable: false }}
+ >
+ <Panel content="History Channel" color="purple"></Panel>
+ </div>
+ </GridLayout>
+ </ThemeProvider>
);
}
diff --git a/apps/web-graphpolaris/src/components/visualisations/semanticsubstrates/semanticsubstrates.tsx b/apps/web-graphpolaris/src/components/visualisations/semanticsubstrates/semanticsubstrates.tsx
index 5874dd7eb27ea2336842054f38d1c705ba100821..9c2609a70cc189898b711c6d5fece7e4b1308a02 100644
--- a/apps/web-graphpolaris/src/components/visualisations/semanticsubstrates/semanticsubstrates.tsx
+++ b/apps/web-graphpolaris/src/components/visualisations/semanticsubstrates/semanticsubstrates.tsx
@@ -1,18 +1,58 @@
-import styled from 'styled-components';
-interface Props {
- content: string;
-}
+import { styled, Theme } from '@mui/material/styles';
+import Box from '@mui/material/Box';
+import { useDispatch } from 'react-redux';
+import {
+ changeDataPointColors,
+ changePrimary,
+ useColorPalette,
+} from '@graphpolaris/shared/data-access/store';
-const Div = styled.div`
- background-color: red;
- font: 'Arial';
-`;
+// Basically a styled-component
+const Div = styled('div')(({ theme }) => ({
+ backgroundColor: theme.palette.primary.main,
+}));
+
+const SemanticSubstrates = () => {
+ const dispatch = useDispatch();
+ const colorPalette = useColorPalette();
-const SemanticSubstrates = (props: Props) => {
return (
- <Div>
- <h1>{props.content}</h1>
- </Div>
+ <>
+ <Div>
+ <h1>semantic substrates</h1>
+ </Div>
+ <Box
+ sx={{
+ // Using our custom palette dataPointColors property, cast theme to any because Theme doesn't know of this custom property
+ backgroundColor: (theme: any) => theme.palette.dataPointColors[0],
+ }}
+ >
+ <h1>semantic substrates</h1>
+ </Box>
+ <input
+ onChange={(v) =>
+ dispatch(changePrimary({ main: v.currentTarget.value }))
+ }
+ type="color"
+ id="head"
+ name="head"
+ value={colorPalette.primary.main}
+ />
+ <input
+ onChange={(v) =>
+ dispatch(
+ changeDataPointColors([
+ v.currentTarget.value,
+ ...colorPalette.dataPointColors.slice(1),
+ ])
+ )
+ }
+ type="color"
+ id="head"
+ name="head"
+ value={colorPalette.dataPointColors[0]}
+ />
+ </>
);
};
diff --git a/libs/shared/data-access/store/src/index.ts b/libs/shared/data-access/store/src/index.ts
index 8251e55eecd3b36bb67afdcf18acf84aa24127b6..b798d7f530615da227699bbe3004696ab390cc83 100644
--- a/libs/shared/data-access/store/src/index.ts
+++ b/libs/shared/data-access/store/src/index.ts
@@ -6,6 +6,7 @@ export {
selectGraphQueryResultNodes,
assignNewGraphQueryResult,
} from './lib/graphQueryResultSlice';
+export { changePrimary, changeDataPointColors } from './lib/colorPaletteSlice';
// Exported types
export type { Node, Edge, GraphQueryResult } from './lib/graphQueryResultSlice';
diff --git a/libs/shared/data-access/store/src/lib/colorPaletteSlice.ts b/libs/shared/data-access/store/src/lib/colorPaletteSlice.ts
new file mode 100644
index 0000000000000000000000000000000000000000..753a4b7d6f8fdcf29cc9ebced56fef2b03ba3dc2
--- /dev/null
+++ b/libs/shared/data-access/store/src/lib/colorPaletteSlice.ts
@@ -0,0 +1,33 @@
+import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+import type { RootState } from './store';
+
+// This looks very much like the mui Palette,
+// But we don't reference that type directly here to stay decoupled
+export const initialState = {
+ dataPointColors: ['#ff0000', '#00ff00', '#0000ff'],
+ primary: {
+ main: '#9999ff',
+ },
+};
+
+export const colorPaletteSlice = createSlice({
+ name: 'colorPalette',
+ // `createSlice` will infer the state type from the `initialState` argument
+ initialState,
+ reducers: {
+ changePrimary: (state, action: PayloadAction<{ main: string }>) => {
+ state.primary = action.payload;
+ },
+ changeDataPointColors: (state, action: PayloadAction<string[]>) => {
+ state.dataPointColors = action.payload;
+ },
+ },
+});
+
+export const { changePrimary, changeDataPointColors } =
+ colorPaletteSlice.actions;
+
+// Select the schema and convert it to a graphology object
+export const selectColorPalette = (state: RootState) => state.colorPalette;
+
+export default colorPaletteSlice.reducer;
diff --git a/libs/shared/data-access/store/src/lib/hooks.ts b/libs/shared/data-access/store/src/lib/hooks.ts
index df0faef46e155463bea444790b3ba91dcc076b76..cc8af8bf1caacfea364e4a878b4c80adf5cf6879 100644
--- a/libs/shared/data-access/store/src/lib/hooks.ts
+++ b/libs/shared/data-access/store/src/lib/hooks.ts
@@ -1,4 +1,5 @@
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
+import { selectColorPalette } from './colorPaletteSlice';
import { selectGraphQueryResult } from './graphQueryResultSlice';
import { selectSchema } from './schemaSlice';
import type { RootState, AppDispatch } from './store';
@@ -12,3 +13,5 @@ export const useGraphQueryResult = () => useAppSelector(selectGraphQueryResult);
// Gives the schema form the store (as a graphology object)
export const useSchema = () => useAppSelector(selectSchema);
+
+export const useColorPalette = () => useAppSelector(selectColorPalette);
diff --git a/libs/shared/data-access/store/src/lib/store.ts b/libs/shared/data-access/store/src/lib/store.ts
index c4a617bc4931f87d2811f8a95a027c10d0faee8b..3ecb3ec20ebd75c7412904f46c192d23fb217538 100644
--- a/libs/shared/data-access/store/src/lib/store.ts
+++ b/libs/shared/data-access/store/src/lib/store.ts
@@ -1,4 +1,5 @@
import { configureStore } from '@reduxjs/toolkit';
+import colorPaletteSlice from './colorPaletteSlice';
import graphQueryResultSlice from './graphQueryResultSlice';
import schemaSlice from './schemaSlice';
@@ -6,6 +7,7 @@ export const store = configureStore({
reducer: {
graphQueryResult: graphQueryResultSlice,
schema: schemaSlice,
+ colorPalette: colorPaletteSlice,
},
});
diff --git a/package.json b/package.json
index 64fe528c6b0be6c11047b069b44da5c20b9eb73d..17d5f2a69a9615cf36aac692b2a374a8e7784519 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,9 @@
"private": true,
"dependencies": {
"@commitlint/config-conventional": "^16.0.0",
+ "@emotion/react": "^11.7.1",
+ "@emotion/styled": "^11.6.0",
+ "@mui/material": "^5.4.1",
"@reduxjs/toolkit": "^1.7.1",
"@types/react-grid-layout": "^1.3.0",
"@types/styled-components": "^5.1.21",
diff --git a/yarn.lock b/yarn.lock
index 948c5e10973c321308c4797e1bfc37117c2868d6..ae1d3aee53486d5a54e071fe48f0e11ddc146ec9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -664,7 +664,7 @@
dependencies:
"@babel/helper-plugin-utils" "^7.10.4"
-"@babel/plugin-syntax-jsx@^7.16.7":
+"@babel/plugin-syntax-jsx@^7.12.13", "@babel/plugin-syntax-jsx@^7.16.7":
version "7.16.7"
resolved "https://registry.yarnpkg.com/@babel/plugin-syntax-jsx/-/plugin-syntax-jsx-7.16.7.tgz#50b6571d13f764266a113d77c82b4a6508bbe665"
integrity sha512-Esxmk7YjA8QysKeT3VhTXvF6y77f/a91SIs4pWb4H2eWGQkCKFgQaG6hdoEVZtGsrAcb2K5BW66XsOErD4WU3Q==
@@ -1202,7 +1202,7 @@
core-js-pure "^3.20.2"
regenerator-runtime "^0.13.4"
-"@babel/runtime@^7.0.0", "@babel/runtime@^7.16.7", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.6":
+"@babel/runtime@^7.0.0", "@babel/runtime@^7.13.10", "@babel/runtime@^7.16.7", "@babel/runtime@^7.17.0", "@babel/runtime@^7.3.1", "@babel/runtime@^7.5.0", "@babel/runtime@^7.5.5", "@babel/runtime@^7.7.6", "@babel/runtime@^7.8.7":
version "7.17.0"
resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.17.0.tgz#b8d142fc0f7664fb3d9b5833fd40dcbab89276c0"
integrity sha512-etcO/ohMNaNA2UBdaXBBSX/3aEzFMRrVfaPv8Ptc0k+cWpWW0QFiGZ2XnVqQZI1Cf734LbPGmqBKWESfW4x/dQ==
@@ -1512,6 +1512,24 @@
resolved "https://registry.yarnpkg.com/@discoveryjs/json-ext/-/json-ext-0.5.6.tgz#d5e0706cf8c6acd8c6032f8d54070af261bbbb2f"
integrity sha512-ws57AidsDvREKrZKYffXddNkyaF14iHNHm8VQnZH6t99E8gczjNN0GpvcGny0imC80yQ0tHz1xVUKk/KFQSUyA==
+"@emotion/babel-plugin@^11.3.0":
+ version "11.7.2"
+ resolved "https://registry.yarnpkg.com/@emotion/babel-plugin/-/babel-plugin-11.7.2.tgz#fec75f38a6ab5b304b0601c74e2a5e77c95e5fa0"
+ integrity sha512-6mGSCWi9UzXut/ZAN6lGFu33wGR3SJisNl3c0tvlmb8XChH1b2SUvxvnOh7hvLpqyRdHHU9AiazV3Cwbk5SXKQ==
+ dependencies:
+ "@babel/helper-module-imports" "^7.12.13"
+ "@babel/plugin-syntax-jsx" "^7.12.13"
+ "@babel/runtime" "^7.13.10"
+ "@emotion/hash" "^0.8.0"
+ "@emotion/memoize" "^0.7.5"
+ "@emotion/serialize" "^1.0.2"
+ babel-plugin-macros "^2.6.1"
+ 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"
+
"@emotion/cache@^10.0.27":
version "10.0.29"
resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-10.0.29.tgz#87e7e64f412c060102d589fe7c6dc042e6f9d1e0"
@@ -1522,6 +1540,17 @@
"@emotion/utils" "0.11.3"
"@emotion/weak-memoize" "0.2.5"
+"@emotion/cache@^11.7.1":
+ version "11.7.1"
+ resolved "https://registry.yarnpkg.com/@emotion/cache/-/cache-11.7.1.tgz#08d080e396a42e0037848214e8aa7bf879065539"
+ integrity sha512-r65Zy4Iljb8oyjtLeCuBH8Qjiy107dOYC6SJq7g7GV5UCQWMObY4SJDPGFjiiVpPrOJ2hmJOoBiYTC7hwx9E2A==
+ dependencies:
+ "@emotion/memoize" "^0.7.4"
+ "@emotion/sheet" "^1.1.0"
+ "@emotion/utils" "^1.0.0"
+ "@emotion/weak-memoize" "^0.2.5"
+ stylis "4.0.13"
+
"@emotion/core@^10.1.1":
version "10.3.1"
resolved "https://registry.yarnpkg.com/@emotion/core/-/core-10.3.1.tgz#4021b6d8b33b3304d48b0bb478485e7d7421c69d"
@@ -1543,7 +1572,7 @@
"@emotion/utils" "0.11.3"
babel-plugin-emotion "^10.0.27"
-"@emotion/hash@0.8.0":
+"@emotion/hash@0.8.0", "@emotion/hash@^0.8.0":
version "0.8.0"
resolved "https://registry.yarnpkg.com/@emotion/hash/-/hash-0.8.0.tgz#bbbff68978fefdbe68ccb533bc8cbe1d1afb5413"
integrity sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==
@@ -1555,11 +1584,36 @@
dependencies:
"@emotion/memoize" "0.7.4"
+"@emotion/is-prop-valid@^1.1.1":
+ version "1.1.1"
+ resolved "https://registry.yarnpkg.com/@emotion/is-prop-valid/-/is-prop-valid-1.1.1.tgz#cbd843d409dfaad90f9404e7c0404c55eae8c134"
+ integrity sha512-bW1Tos67CZkOURLc0OalnfxtSXQJMrAMV0jZTVGJUPSOd4qgjF3+tTD5CwJM13PHA8cltGW1WGbbvV9NpvUZPw==
+ dependencies:
+ "@emotion/memoize" "^0.7.4"
+
"@emotion/memoize@0.7.4":
version "0.7.4"
resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.4.tgz#19bf0f5af19149111c40d98bb0cf82119f5d9eeb"
integrity sha512-Ja/Vfqe3HpuzRsG1oBtWTHk2PGZ7GR+2Vz5iYGelAw8dx32K0y7PjVuxK6z1nMpZOqAFsRUPCkK1YjJ56qJlgw==
+"@emotion/memoize@^0.7.4", "@emotion/memoize@^0.7.5":
+ version "0.7.5"
+ resolved "https://registry.yarnpkg.com/@emotion/memoize/-/memoize-0.7.5.tgz#2c40f81449a4e554e9fc6396910ed4843ec2be50"
+ integrity sha512-igX9a37DR2ZPGYtV6suZ6whr8pTFtyHL3K/oLUotxpSVO2ASaprmAe2Dkq7tBo7CRY7MMDrAa9nuQP9/YG8FxQ==
+
+"@emotion/react@^11.7.1":
+ version "11.7.1"
+ resolved "https://registry.yarnpkg.com/@emotion/react/-/react-11.7.1.tgz#3f800ce9b20317c13e77b8489ac4a0b922b2fe07"
+ integrity sha512-DV2Xe3yhkF1yT4uAUoJcYL1AmrnO5SVsdfvu+fBuS7IbByDeTVx9+wFmvx9Idzv7/78+9Mgx2Hcmr7Fex3tIyw==
+ dependencies:
+ "@babel/runtime" "^7.13.10"
+ "@emotion/cache" "^11.7.1"
+ "@emotion/serialize" "^1.0.2"
+ "@emotion/sheet" "^1.1.0"
+ "@emotion/utils" "^1.0.0"
+ "@emotion/weak-memoize" "^0.2.5"
+ hoist-non-react-statics "^3.3.1"
+
"@emotion/serialize@^0.11.15", "@emotion/serialize@^0.11.16":
version "0.11.16"
resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-0.11.16.tgz#dee05f9e96ad2fb25a5206b6d759b2d1ed3379ad"
@@ -1571,11 +1625,27 @@
"@emotion/utils" "0.11.3"
csstype "^2.5.7"
+"@emotion/serialize@^1.0.2":
+ version "1.0.2"
+ resolved "https://registry.yarnpkg.com/@emotion/serialize/-/serialize-1.0.2.tgz#77cb21a0571c9f68eb66087754a65fa97bfcd965"
+ integrity sha512-95MgNJ9+/ajxU7QIAruiOAdYNjxZX7G2mhgrtDWswA21VviYIRP1R5QilZ/bDY42xiKsaktP4egJb3QdYQZi1A==
+ dependencies:
+ "@emotion/hash" "^0.8.0"
+ "@emotion/memoize" "^0.7.4"
+ "@emotion/unitless" "^0.7.5"
+ "@emotion/utils" "^1.0.0"
+ csstype "^3.0.2"
+
"@emotion/sheet@0.9.4":
version "0.9.4"
resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-0.9.4.tgz#894374bea39ec30f489bbfc3438192b9774d32e5"
integrity sha512-zM9PFmgVSqBw4zL101Q0HrBVTGmpAxFZH/pYx/cjJT5advXguvcgjHFTCaIO3enL/xr89vK2bh0Mfyj9aa0ANA==
+"@emotion/sheet@^1.1.0":
+ version "1.1.0"
+ resolved "https://registry.yarnpkg.com/@emotion/sheet/-/sheet-1.1.0.tgz#56d99c41f0a1cda2726a05aa6a20afd4c63e58d2"
+ integrity sha512-u0AX4aSo25sMAygCuQTzS+HsImZFuS8llY8O7b9MDRzbJM0kVJlAz6KNDqcG7pOuQZJmj/8X/rAW+66kMnMW+g==
+
"@emotion/styled-base@^10.3.0":
version "10.3.0"
resolved "https://registry.yarnpkg.com/@emotion/styled-base/-/styled-base-10.3.0.tgz#9aa2c946100f78b47316e4bc6048321afa6d4e36"
@@ -1594,12 +1664,23 @@
"@emotion/styled-base" "^10.3.0"
babel-plugin-emotion "^10.0.27"
+"@emotion/styled@^11.6.0":
+ version "11.6.0"
+ resolved "https://registry.yarnpkg.com/@emotion/styled/-/styled-11.6.0.tgz#9230d1a7bcb2ebf83c6a579f4c80e0664132d81d"
+ integrity sha512-mxVtVyIOTmCAkFbwIp+nCjTXJNgcz4VWkOYQro87jE2QBTydnkiYusMrRGFtzuruiGK4dDaNORk4gH049iiQuw==
+ dependencies:
+ "@babel/runtime" "^7.13.10"
+ "@emotion/babel-plugin" "^11.3.0"
+ "@emotion/is-prop-valid" "^1.1.1"
+ "@emotion/serialize" "^1.0.2"
+ "@emotion/utils" "^1.0.0"
+
"@emotion/stylis@0.8.5", "@emotion/stylis@^0.8.4":
version "0.8.5"
resolved "https://registry.yarnpkg.com/@emotion/stylis/-/stylis-0.8.5.tgz#deacb389bd6ee77d1e7fcaccce9e16c5c7e78e04"
integrity sha512-h6KtPihKFn3T9fuIrwvXXUOwlx3rfUvfZIcP5a6rh8Y7zjE3O06hT5Ss4S/YI1AYhuZ1kjaE/5EaOOI2NqSylQ==
-"@emotion/unitless@0.7.5", "@emotion/unitless@^0.7.4":
+"@emotion/unitless@0.7.5", "@emotion/unitless@^0.7.4", "@emotion/unitless@^0.7.5":
version "0.7.5"
resolved "https://registry.yarnpkg.com/@emotion/unitless/-/unitless-0.7.5.tgz#77211291c1900a700b8a78cfafda3160d76949ed"
integrity sha512-OWORNpfjMsSSUBVrRBVGECkhWcULOAJz9ZW8uK9qgxD+87M7jHRcvh/A96XXNhXTLmKcoYSQtBEX7lHMO7YRwg==
@@ -1609,7 +1690,12 @@
resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-0.11.3.tgz#a759863867befa7e583400d322652a3f44820924"
integrity sha512-0o4l6pZC+hI88+bzuaX/6BgOvQVhbt2PfmxauVaYOGgbsAw14wdKyvMCZXnsnsHys94iadcF+RG/wZyx6+ZZBw==
-"@emotion/weak-memoize@0.2.5":
+"@emotion/utils@^1.0.0":
+ version "1.0.0"
+ resolved "https://registry.yarnpkg.com/@emotion/utils/-/utils-1.0.0.tgz#abe06a83160b10570816c913990245813a2fd6af"
+ integrity sha512-mQC2b3XLDs6QCW+pDQDiyO/EdGZYOygE8s5N5rrzjSI4M3IejPE/JPndCBwRT9z982aqQNi6beWs1UeayrQxxA==
+
+"@emotion/weak-memoize@0.2.5", "@emotion/weak-memoize@^0.2.5":
version "0.2.5"
resolved "https://registry.yarnpkg.com/@emotion/weak-memoize/-/weak-memoize-0.2.5.tgz#8eed982e2ee6f7f4e44c253e12962980791efd46"
integrity sha512-6U71C2Wp7r5XtFtQzYrW5iKFT67OixrSxjI4MptCHzdSVlgabczzqLe0ZSgnub/5Kp4hSbpDB1tMytZY9pwxxA==
@@ -1990,6 +2076,85 @@
call-me-maybe "^1.0.1"
glob-to-regexp "^0.3.0"
+"@mui/base@5.0.0-alpha.68":
+ version "5.0.0-alpha.68"
+ resolved "https://registry.yarnpkg.com/@mui/base/-/base-5.0.0-alpha.68.tgz#d93d77e662bc8dce47c9415fc6cbcac6658efab7"
+ integrity sha512-q+3gX6EHuM/AyOn8fkoANQxSzIHBeuNsrGgb7SPP0y7NuM+4ZHG/b9882+OfHcilaSqPDWUQoLbphcBpw/m/RA==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@emotion/is-prop-valid" "^1.1.1"
+ "@mui/utils" "^5.4.1"
+ "@popperjs/core" "^2.4.4"
+ clsx "^1.1.1"
+ prop-types "^15.7.2"
+ react-is "^17.0.2"
+
+"@mui/material@^5.4.1":
+ version "5.4.1"
+ resolved "https://registry.yarnpkg.com/@mui/material/-/material-5.4.1.tgz#05d3f726771c413dc430163d7c508edfcee04807"
+ integrity sha512-SxAT43UAjFTBBpJrN+oGrv40xP1uCa5Z49NfHt3m93xYeFzbxKOk0V9IKU7zlUjbsaVQ0i+o24yF5GULZmynlA==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@mui/base" "5.0.0-alpha.68"
+ "@mui/system" "^5.4.1"
+ "@mui/types" "^7.1.1"
+ "@mui/utils" "^5.4.1"
+ "@types/react-transition-group" "^4.4.4"
+ clsx "^1.1.1"
+ csstype "^3.0.10"
+ hoist-non-react-statics "^3.3.2"
+ prop-types "^15.7.2"
+ react-is "^17.0.2"
+ react-transition-group "^4.4.2"
+
+"@mui/private-theming@^5.4.1":
+ version "5.4.1"
+ resolved "https://registry.yarnpkg.com/@mui/private-theming/-/private-theming-5.4.1.tgz#5fa6490f35e78781239f1944ae80a7006c5a7648"
+ integrity sha512-Xbc4MXFZxv0A3hoc4TSDBhzjhstppKfc+gQcTMqqBZQP7KjnmxF+wO7rEPQuYRBihjCqQBdrHIGMLsKWrhkZkQ==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@mui/utils" "^5.4.1"
+ prop-types "^15.7.2"
+
+"@mui/styled-engine@^5.4.1":
+ version "5.4.1"
+ resolved "https://registry.yarnpkg.com/@mui/styled-engine/-/styled-engine-5.4.1.tgz#1427738e71c087f7005547e17d4a59de75597850"
+ integrity sha512-CFLNJkopRoAuShkgUZOTBVxdTlKu4w6L4kOwPi4r3QB2XXS6O5kyLHSsg9huUbtOYk5Dv5UZyUSc5pw4J7ezdg==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@emotion/cache" "^11.7.1"
+ prop-types "^15.7.2"
+
+"@mui/system@^5.4.1":
+ version "5.4.1"
+ resolved "https://registry.yarnpkg.com/@mui/system/-/system-5.4.1.tgz#cf253369fbf1d960c792f0ec068fa28af81be3d4"
+ integrity sha512-07JBYf9iQdxIHZU8cFOLoxBnkQDUPLb7UBhNxo4998yEqpWFJ00WKgEVYBKvPl0X+MRU/20wqFz6yGIuCx4AeA==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@mui/private-theming" "^5.4.1"
+ "@mui/styled-engine" "^5.4.1"
+ "@mui/types" "^7.1.1"
+ "@mui/utils" "^5.4.1"
+ clsx "^1.1.1"
+ csstype "^3.0.10"
+ prop-types "^15.7.2"
+
+"@mui/types@^7.1.1":
+ version "7.1.1"
+ resolved "https://registry.yarnpkg.com/@mui/types/-/types-7.1.1.tgz#9cf159dc60a101ee336e6ec74193a4f5f97f6160"
+ integrity sha512-33hbHFLCwenTpS+T4m4Cz7cQ/ng5g+IgtINkw1uDBVvi1oM83VNt/IGzWIQNPK8H2pr0WIfkmboD501bVdYsPw==
+
+"@mui/utils@^5.4.1":
+ version "5.4.1"
+ resolved "https://registry.yarnpkg.com/@mui/utils/-/utils-5.4.1.tgz#feb365ce9a4426587510f0943fd6d6e1889e06e6"
+ integrity sha512-5HzM+ZjlQqbSp7UTOvLlhAjkWB+o9Z4NzO0W+yhZ1KnxITr+zr/MBzYmmQ3kyvhui8pyhgRDoTcVgwb+02ZUZA==
+ dependencies:
+ "@babel/runtime" "^7.17.0"
+ "@types/prop-types" "^15.7.4"
+ "@types/react-is" "^16.7.1 || ^17.0.0"
+ prop-types "^15.7.2"
+ react-is "^17.0.2"
+
"@nodelib/fs.scandir@2.1.5":
version "2.1.5"
resolved "https://registry.yarnpkg.com/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz#7619c2eb21b25483f6d167548b4cfd5a7488c3d5"
@@ -2480,7 +2645,7 @@
schema-utils "^3.0.0"
source-map "^0.7.3"
-"@popperjs/core@^2.5.4", "@popperjs/core@^2.6.0":
+"@popperjs/core@^2.4.4", "@popperjs/core@^2.5.4", "@popperjs/core@^2.6.0":
version "2.11.2"
resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.2.tgz#830beaec4b4091a9e9398ac50f865ddea52186b9"
integrity sha512-92FRmppjjqz29VMJ2dn+xdyXZBrMlE42AV6Kq6BwjWV7CNUW1hs2FtxSNLQE+gJhaZ6AAmYuO9y8dshhcBl7vA==
@@ -4194,7 +4359,7 @@
resolved "https://registry.yarnpkg.com/@types/pretty-hrtime/-/pretty-hrtime-1.0.1.tgz#72a26101dc567b0d68fd956cf42314556e42d601"
integrity sha512-VjID5MJb1eGKthz2qUerWT8+R4b9N+CHvGCzg9fn4kWZgaF9AhdYikQio3R7wV8YY1NsQKPaCwKz1Yff+aHNUQ==
-"@types/prop-types@*":
+"@types/prop-types@*", "@types/prop-types@^15.7.4":
version "15.7.4"
resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.4.tgz#fcf7205c25dff795ee79af1e30da2c9790808f11"
integrity sha512-rZ5drC/jWjrArrS8BR6SIr4cWpW09RNTYt9AMZo3Jwwif+iacXAqgVjm0B0Bv/S1jhDXKHqRVNCbACkJ89RAnQ==
@@ -4235,6 +4400,13 @@
dependencies:
"@types/react" "*"
+"@types/react-is@^16.7.1 || ^17.0.0":
+ version "17.0.3"
+ resolved "https://registry.yarnpkg.com/@types/react-is/-/react-is-17.0.3.tgz#2d855ba575f2fc8d17ef9861f084acc4b90a137a"
+ integrity sha512-aBTIWg1emtu95bLTLx0cpkxwGW3ueZv71nE2YFBpL8k/z5czEW8yYpOo8Dp+UUAFAtKwNaOsh/ioSeQnWlZcfw==
+ dependencies:
+ "@types/react" "*"
+
"@types/react-redux@^7.1.20":
version "7.1.22"
resolved "https://registry.yarnpkg.com/@types/react-redux/-/react-redux-7.1.22.tgz#0eab76a37ef477cc4b53665aeaf29cb60631b72a"
@@ -4259,6 +4431,13 @@
dependencies:
"@types/react" "*"
+"@types/react-transition-group@^4.4.4":
+ version "4.4.4"
+ resolved "https://registry.yarnpkg.com/@types/react-transition-group/-/react-transition-group-4.4.4.tgz#acd4cceaa2be6b757db61ed7b432e103242d163e"
+ integrity sha512-7gAPz7anVK5xzbeQW9wFBDg7G++aPLAFY0QaSMOou9rJZpbuI58WAuJrgu+qR92l61grlnCUe7AFX8KGahAgug==
+ dependencies:
+ "@types/react" "*"
+
"@types/react@*", "@types/react@>=16.9.0":
version "17.0.38"
resolved "https://registry.yarnpkg.com/@types/react/-/react-17.0.38.tgz#f24249fefd89357d5fa71f739a686b8d7c7202bd"
@@ -5470,7 +5649,7 @@ babel-plugin-jest-hoist@^27.4.0:
"@types/babel__core" "^7.0.0"
"@types/babel__traverse" "^7.0.6"
-babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.8.0:
+babel-plugin-macros@^2.0.0, babel-plugin-macros@^2.6.1, babel-plugin-macros@^2.8.0:
version "2.8.0"
resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.8.0.tgz#0f958a7cc6556b1e65344465d99111a1e5e10138"
integrity sha512-SEP5kJpfGYqYKpBrj5XU3ahw5p5GOHJ0U5ssOSQ/WBVdwkD2Dzlce95exQTs3jOVWPPKLBN2rlEWkCK7dSmLvg==
@@ -7247,7 +7426,7 @@ csstype@^2.5.7:
resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.19.tgz#feeb5aae89020bb389e1f63669a5ed490e391caa"
integrity sha512-ZVxXaNy28/k3kJg0Fou5MiYpp88j7H9hLZp8PDC3jV0WFjfH5E9xHb56L0W59cPbKbcHXeP4qyT8PrHp8t6LcQ==
-csstype@^3.0.2:
+csstype@^3.0.10, csstype@^3.0.2:
version "3.0.10"
resolved "https://registry.yarnpkg.com/csstype/-/csstype-3.0.10.tgz#2ad3a7bed70f35b965707c092e5f30b327c290e5"
integrity sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==
@@ -7623,6 +7802,14 @@ dom-converter@^0.2.0:
dependencies:
utila "~0.4"
+dom-helpers@^5.0.1:
+ version "5.2.1"
+ resolved "https://registry.yarnpkg.com/dom-helpers/-/dom-helpers-5.2.1.tgz#d9400536b2bf8225ad98fe052e029451ac40e902"
+ integrity sha512-nRCa7CK3VTrM2NmGkIy4cbK7IZlgBE/PYMn55rrXefr5xXDP0LdtfPnblFDoVdcAfslJ7or6iqAUnx0CCGIWQA==
+ dependencies:
+ "@babel/runtime" "^7.8.7"
+ csstype "^3.0.2"
+
dom-serializer@0:
version "0.2.2"
resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.2.2.tgz#1afb81f533717175d478655debc5e332d9f9bb51"
@@ -9561,7 +9748,7 @@ hmac-drbg@^1.0.1:
minimalistic-assert "^1.0.0"
minimalistic-crypto-utils "^1.0.1"
-hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.2:
+hoist-non-react-statics@^3.0.0, hoist-non-react-statics@^3.3.0, hoist-non-react-statics@^3.3.1, hoist-non-react-statics@^3.3.2:
version "3.3.2"
resolved "https://registry.yarnpkg.com/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz#ece0acaf71d62c2969c2ec59feff42a4b1a85b45"
integrity sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==
@@ -13454,7 +13641,7 @@ prompts@^2.0.1, prompts@^2.4.0:
kleur "^3.0.3"
sisteransi "^1.0.5"
-prop-types@15.x, prop-types@^15.0.0, prop-types@^15.6.0, prop-types@^15.7.2:
+prop-types@15.x, prop-types@^15.0.0, prop-types@^15.6.0, prop-types@^15.6.2, prop-types@^15.7.2:
version "15.8.1"
resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"
integrity sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==
@@ -13880,6 +14067,16 @@ react-textarea-autosize@^8.3.0, react-textarea-autosize@^8.3.2:
use-composed-ref "^1.0.0"
use-latest "^1.0.0"
+react-transition-group@^4.4.2:
+ version "4.4.2"
+ resolved "https://registry.yarnpkg.com/react-transition-group/-/react-transition-group-4.4.2.tgz#8b59a56f09ced7b55cbd53c36768b922890d5470"
+ integrity sha512-/RNYfRAMlZwDSr6z4zNKV6xu53/e2BuaBbGhbyYIXTrmgu/bGHzmqOs7mJSJBHy9Ud+ApHx3QjrkKSp1pxvlFg==
+ dependencies:
+ "@babel/runtime" "^7.5.5"
+ dom-helpers "^5.0.1"
+ loose-envify "^1.4.0"
+ prop-types "^15.6.2"
+
react@17.0.2:
version "17.0.2"
resolved "https://registry.yarnpkg.com/react/-/react-17.0.2.tgz#d0b5cc516d29eb3eee383f75b62864cfb6800037"
@@ -15326,6 +15523,11 @@ stylehacks@^5.0.2:
browserslist "^4.16.6"
postcss-selector-parser "^6.0.4"
+stylis@4.0.13:
+ version "4.0.13"
+ resolved "https://registry.yarnpkg.com/stylis/-/stylis-4.0.13.tgz#f5db332e376d13cc84ecfe5dace9a2a51d954c91"
+ integrity sha512-xGPXiFVl4YED9Jh7Euv2V220mriG9u4B2TA6Ybjc1catrstKD2PpIdU3U0RKpkVBC2EhmL/F0sPCr9vrFTNRag==
+
stylus-loader@^6.2.0:
version "6.2.0"
resolved "https://registry.yarnpkg.com/stylus-loader/-/stylus-loader-6.2.0.tgz#0ba499e744e7fb9d9b3977784c8639728a7ced8c"