diff options
| -rw-r--r-- | org-roam-ui.el | 6 | ||||
| -rw-r--r-- | package.json | 3 | ||||
| -rw-r--r-- | pages/_app.tsx | 98 | ||||
| -rw-r--r-- | pages/index.tsx | 494 | ||||
| -rw-r--r-- | yarn.lock | 168 |
5 files changed, 507 insertions, 262 deletions
diff --git a/org-roam-ui.el b/org-roam-ui.el index 9988899..60070cd 100644 --- a/org-roam-ui.el +++ b/org-roam-ui.el @@ -94,15 +94,15 @@ ROWS is the sql result, while COLUMN-NAMES is the columns to use." (push (cons (pop column-names) (pop rows)) res)) res)) -(defservlet* theme application/json () +(defservlet* theme text/stream () (progn (when (boundp 'doom-themes--colors) (let* ((colors (butlast doom-themes--colors (- (length doom-themes--colors) 25))) ui-theme (list nil)) (progn (dolist (color colors) (push (cons (car color) (car (cdr color))) ui-theme)) - (insert (json-encode ui-theme))))) - (httpd-send-header t "text/plain" 200 :Access-Control-Allow-Origin "*"))) + (insert (format "data: %s\n\n" (json-encode ui-theme)))))) + (httpd-send-header t "text/event-stream" 200 :Access-Control-Allow-Origin "*"))) (defservlet* id/:id text/html () diff --git a/package.json b/package.json index 0a7dd00..f561d15 100644 --- a/package.json +++ b/package.json @@ -17,10 +17,13 @@ "@react-hook/window-size": "^3.0.7", "d3-force-3d": "^3.0.2", "framer-motion": "^4", + "hex-rgb": "^5.0.0", "next": "11.0.1", "react": "17.0.2", + "react-custom-scrollbars-2": "^4.4.0", "react-dom": "17.0.2", "react-force-graph": "^1.41.7", + "react-spring": "^9.2.4", "three-spritetext": "^1.6.2", "use-constant": "^1.1.0" }, diff --git a/pages/_app.tsx b/pages/_app.tsx index 1801159..262ac69 100644 --- a/pages/_app.tsx +++ b/pages/_app.tsx @@ -1,10 +1,106 @@ import '../styles/globals.css' import type { AppProps } from 'next/app' import { ChakraProvider } from '@chakra-ui/react' +import { useEffect, useState, useMemo } from 'react' +import { extendTheme } from '@chakra-ui/react' +//import hexRgb from 'hex-rgb' function MyApp({ Component, pageProps }: AppProps) { + const initialTheme = { + base1: '#1c1f24', + base2: '#21272d', + base3: '#23272e', + base4: '#484854', + base5: '#62686E', + base6: '#757B80', + base7: '#9ca0a4', + base8: '#DFDFDF', + bg: '#242730', + 'bg-alt': '#2a2e38', + blue: '#51afef', + cyan: '#5cEfFF', + 'dark-blue': '#1f5582', + 'dark-cyan': '#6A8FBF', + fg: '#bbc2cf', + 'fg-alt': '#5D656B', + green: '#7bc275', + grey: '#484854', + magenta: '#C57BDB', + orange: '#e69055', + red: '#ff665c', + teal: '#4db5bd', + violet: '#a991f1', + yellow: '#FCCE7B', + } + const [emacsTheme, setEmacsTheme] = useState(initialTheme) + useEffect(() => { + const trackTheme = new EventSource('http://127.0.0.1:35901/theme') + trackTheme.addEventListener('message', (e) => { + const themeData = JSON.parse(e.data) + setEmacsTheme(themeData) + console.log(themeData) + console.log(themeData['fg-alt']) + }) + }, []) + + const borderColor = emacsTheme.violet + 'aa' + const theme = + //useMemo(() => { + //console.log("theme change") + extendTheme({ + colors: { + white: emacsTheme.bg, + black: emacsTheme.fg, + gray: { + 200: emacsTheme.base1, + 300: emacsTheme.base2, + 400: emacsTheme.base3, + 500: emacsTheme.base4, + 600: emacsTheme.base5, + 700: emacsTheme.base6, + 800: emacsTheme.base7, + 900: emacsTheme.base8, + }, + blue: { + 500: emacsTheme.blue, + }, + teal: { + 500: emacsTheme.blue, + }, + yellow: { + 500: emacsTheme.yellow, + }, + orange: { + 500: emacsTheme.orange, + }, + red: { + 500: emacsTheme.red, + }, + green: { + 500: emacsTheme.green, + }, + purple: { + 500: emacsTheme.violet, + }, + pink: { + 500: emacsTheme.magenta, + }, + cyan: { + 500: emacsTheme.cyan, + }, + alt: { + 100: emacsTheme['bg-alt'], + 900: emacsTheme['fg-alt'], + }, + }, + shadows: { + outline: '0 0 0 3px ' + borderColor, + }, + }) + // }, [emacsTheme.base1]) + return ( - <ChakraProvider> + <ChakraProvider theme={theme}> <Component {...pageProps} /> </ChakraProvider> ) diff --git a/pages/index.tsx b/pages/index.tsx index a020545..ff3f8d0 100644 --- a/pages/index.tsx +++ b/pages/index.tsx @@ -10,6 +10,7 @@ import { OrgRoamGraphReponse, OrgRoamLink, OrgRoamNode } from '../api' import { GraphData, NodeObject } from 'force-graph' import { useWindowSize } from '@react-hook/window-size' +import { Scrollbars } from 'react-custom-scrollbars-2' import { Accordion, @@ -44,6 +45,7 @@ import { MenuOptionGroup, MenuItemOption, Flex, + useTheme, } from '@chakra-ui/react' import { InfoOutlineIcon, RepeatClockIcon, ChevronDownIcon, SettingsIcon } from '@chakra-ui/icons' @@ -97,33 +99,6 @@ const initialPhysics = { highlightLinkSize: 2, } -const initialTheme = { - base1: '#1c1f24', - base2: '#21272d', - base3: '#23272e', - base4: '#484854', - base5: '#62686E', - base6: '#757B80', - base7: '#9ca0a4', - base8: '#DFDFDF', - bg: '#242730', - 'bg-alt': '#2a2e38', - blue: '#51afef', - cyan: '#5cEfFF', - 'dark-blue': '#1f5582', - 'dark-cyan': '#6A8FBF', - fg: '#bbc2cf', - 'fg-alt': '#5D656B', - green: '#7bc275', - grey: '#484854', - magenta: '#C57BDB', - orange: '#e69055', - red: '#ff665c', - teal: '#4db5bd', - violet: '#a991f1', - yellow: '#FCCE7B', -} - export default function Home() { // only render on the client const [showPage, setShowPage] = useState(false) @@ -140,7 +115,7 @@ export default function Home() { export function GraphPage() { const [physics, setPhysics] = usePersistantState('physics', initialPhysics) - const [theme, setTheme] = useState(initialTheme) + // const [theme, setTheme] = useState(initialTheme) const [graphData, setGraphData] = useState<GraphData | null>(null) const [emacsNodeId, setEmacsNodeId] = useState<string | null>(null) @@ -178,12 +153,6 @@ export function GraphPage() { setEmacsNodeId(emacsNodeId) }) - fetch('http://localhost:35901/theme') - .then((res) => res.json()) - .then((emacsTheme) => { - setTheme(emacsTheme) - }) - updateGraphData() }, []) @@ -273,7 +242,14 @@ export const SliderWithInfo = ({ <Text>{label}</Text> {infoText && <InfoTooltip infoText={infoText} />} </Box> - <Slider value={value} onChange={onChange} min={min} max={max} step={step}> + <Slider + value={value} + onChange={onChange} + min={min} + max={max} + step={step} + colorScheme="purple" + > <SliderTrack> <SliderFilledTrack /> </SliderTrack> @@ -302,13 +278,22 @@ export const EnableSection = (props: EnableSectionProps) => { <Text>{label}</Text> {infoText && <InfoTooltip infoText={infoText} />} </Box> - <Switch isChecked={!!value} onChange={onChange} /> + <Switch isChecked={!!value} onChange={onChange} colorScheme="purple" /> </Box> {value && children} </Box> ) } +/* style={{ + * position: "absolute", + * zIndex: 2000, + * width: 400, + * maxHeight: "70%", + * background: "alt.100", + * marginTop: "2%", + * marginLeft: "2%" + * }} */ export interface TweakProps { physics: typeof initialPhysics setPhysics: any @@ -321,13 +306,14 @@ export const Tweaks = function (props: TweakProps) { <Box zIndex="overlay" position="absolute" - bg="white" + bg="alt.100" w="xs" marginTop="2%" marginLeft="2%" borderRadius="md" - maxH="80%" - overflowY="scroll" + maxH={650} + paddingBottom={5} + //overflowY="scroll" > <Box display="flex" justifyContent="flex-end"> <Tooltip label="Reset settings to defaults"> @@ -335,224 +321,228 @@ export const Tweaks = function (props: TweakProps) { aria-label="Reset Defaults" icon={<RepeatClockIcon />} onClick={() => setPhysics(initialPhysics)} + colorScheme="purple" /> </Tooltip> <CloseButton onClick={onClose} /> </Box> - <Accordion allowMultiple allowToggle> - <AccordionItem> - <AccordionButton display="flex" justifyContent="space-between"> - <Box display="flex"> - <AccordionIcon /> - <Text>Physics</Text> - </Box> - <Switch - id="physicsOn" - onChange={() => setPhysics({ ...physics, enabled: !physics.enabled })} - isChecked={physics.enabled} - /> - </AccordionButton> - <AccordionPanel> - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.200" />} - align="stretch" - > - <EnableSection - label="Gravity" - value={physics.gravityOn} - onChange={() => setPhysics({ ...physics, gravityOn: !physics.gravityOn })} - > - <SliderWithInfo - label="Strength" - value={physics.gravity * 10} - onChange={(v) => setPhysics({ ...physics, gravity: v / 10 })} - /> - </EnableSection> - <SliderWithInfo - value={-physics.charge / 100} - onChange={(value) => setPhysics({ ...physics, charge: -100 * value })} - label="Repulsive Force" + <Scrollbars autoHeight autoHeightMax={600}> + <Accordion allowMultiple allowToggle colorScheme="purple"> + <AccordionItem> + <AccordionButton display="flex" justifyContent="space-between" colorScheme="purple"> + <Box display="flex"> + <AccordionIcon /> + <Text>Physics</Text> + </Box> + <Switch + id="physicsOn" + onChange={() => setPhysics({ ...physics, enabled: !physics.enabled })} + isChecked={physics.enabled} + colorScheme="purple" /> - <EnableSection - label="Collision" - infoText="Perfomance sap, disable if slow" - value={physics.collision} - onChange={() => setPhysics({ ...physics, collision: !physics.collision })} + </AccordionButton> + <AccordionPanel> + <VStack + spacing={2} + justifyContent="flex-start" + divider={<StackDivider borderColor="gray.200" />} + align="stretch" > + <EnableSection + label="Gravity" + value={physics.gravityOn} + onChange={() => setPhysics({ ...physics, gravityOn: !physics.gravityOn })} + > + <SliderWithInfo + label="Strength" + value={physics.gravity * 10} + onChange={(v) => setPhysics({ ...physics, gravity: v / 10 })} + /> + </EnableSection> <SliderWithInfo - value={physics.collisionStrength * 10} - onChange={(value) => setPhysics({ ...physics, collisionStrength: value / 10 })} - label="Strength" + value={-physics.charge / 100} + onChange={(value) => setPhysics({ ...physics, charge: -100 * value })} + label="Repulsive Force" /> - </EnableSection> - <SliderWithInfo - value={physics.linkStrength * 5} - onChange={(value) => setPhysics({ ...physics, linkStrength: value / 5 })} - label="Link Force" - /> - <SliderWithInfo - label="Link Iterations" - value={physics.linkIts} - onChange={(value) => setPhysics({ ...physics, linkIts: value })} - min={0} - max={6} - step={1} - infoText="How many links down the line the physics of a single node affects (Slow)" - /> - <SliderWithInfo - label="Viscosity" - value={physics.velocityDecay * 10} - onChange={(value) => setPhysics({ ...physics, velocityDecay: value / 10 })} - /> - </VStack> - <Box> - <Accordion allowToggle> - <AccordionItem> - <AccordionButton> - <Text>Advanced</Text> - <AccordionIcon /> - </AccordionButton> - <AccordionPanel> - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.200" />} - align="stretch" - > - <SliderWithInfo - label="Iterations per tick" - min={1} - max={10} - step={1} - value={physics.iterations} - onChange={(v) => setPhysics({ ...physics, iterations: v })} - infoText="Number of times the physics simulation iterates per simulation step" - /> - <SliderWithInfo - label="Stabilization rate" - value={physics.alphaDecay * 50} - onChange={(value) => setPhysics({ ...physics, alphaDecay: value / 50 })} - /> - </VStack> - </AccordionPanel> - </AccordionItem> - </Accordion> - </Box> - {/* </VStack> */} - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <AccordionIcon /> - Visual - </AccordionButton> - <AccordionPanel> - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.200" />} - align="stretch" - > - <SliderWithInfo - label="Node size" - value={physics.nodeRel} - onChange={(value) => setPhysics({ ...physics, nodeRel: value })} - /> - <SliderWithInfo - label="Link width" - value={physics.linkWidth} - onChange={(value) => setPhysics({ ...physics, linkWidth: value })} - /> - <EnableSection - label="Labels" - value={physics.labels} - onChange={() => setPhysics({ ...physics, labels: !physics.labels })} - > + <EnableSection + label="Collision" + infoText="Perfomance sap, disable if slow" + value={physics.collision} + onChange={() => setPhysics({ ...physics, collision: !physics.collision })} + > + <SliderWithInfo + value={physics.collisionStrength * 10} + onChange={(value) => setPhysics({ ...physics, collisionStrength: value / 10 })} + label="Strength" + /> + </EnableSection> <SliderWithInfo - label="Label Appearance Scale" - value={physics.labelScale * 5} - onChange={(value) => setPhysics({ ...physics, labelScale: value / 5 })} + value={physics.linkStrength * 5} + onChange={(value) => setPhysics({ ...physics, linkStrength: value / 5 })} + label="Link Force" /> - </EnableSection> - <EnableSection - label="Directional Particles" - value={physics.particles} - onChange={() => setPhysics({ ...physics, particles: !physics.particles })} - > <SliderWithInfo - label="Particle Number" - value={physics.particlesNumber} - max={5} + label="Link Iterations" + value={physics.linkIts} + onChange={(value) => setPhysics({ ...physics, linkIts: value })} + min={0} + max={6} step={1} - onChange={(value) => setPhysics({ ...physics, particlesNumber: value })} + infoText="How many links down the line the physics of a single node affects (Slow)" /> <SliderWithInfo - label="Particle Size" - value={physics.particlesWidth} - onChange={(value) => setPhysics({ ...physics, particleWidth: value })} + label="Viscosity" + value={physics.velocityDecay * 10} + onChange={(value) => setPhysics({ ...physics, velocityDecay: value / 10 })} /> - </EnableSection> - <EnableSection - label="Highlight" - onChange={() => setPhysics({ ...physics, highlight: !physics.highlight })} - value={physics.highlight} + </VStack> + <Box> + <Accordion allowToggle> + <AccordionItem> + <AccordionButton> + <Text>Advanced</Text> + <AccordionIcon /> + </AccordionButton> + <AccordionPanel> + <VStack + spacing={2} + justifyContent="flex-start" + divider={<StackDivider borderColor="gray.200" />} + align="stretch" + > + <SliderWithInfo + label="Iterations per tick" + min={1} + max={10} + step={1} + value={physics.iterations} + onChange={(v) => setPhysics({ ...physics, iterations: v })} + infoText="Number of times the physics simulation iterates per simulation step" + /> + <SliderWithInfo + label="Stabilization rate" + value={physics.alphaDecay * 50} + onChange={(value) => setPhysics({ ...physics, alphaDecay: value / 50 })} + /> + </VStack> + </AccordionPanel> + </AccordionItem> + </Accordion> + </Box> + {/* </VStack> */} + </AccordionPanel> + </AccordionItem> + <AccordionItem> + <AccordionButton> + <AccordionIcon /> + Visual + </AccordionButton> + <AccordionPanel> + <VStack + spacing={2} + justifyContent="flex-start" + divider={<StackDivider borderColor="gray.200" />} + align="stretch" > <SliderWithInfo - label="Highlight Link Thickness Multiplier" - value={physics.highlightLinkSize} - onChange={(value) => setPhysics({ ...physics, highlightLinkSize: value })} + label="Node size" + value={physics.nodeRel} + onChange={(value) => setPhysics({ ...physics, nodeRel: value })} /> <SliderWithInfo - label="Highlight Node Size Multiplier" - value={physics.highlightNodeSize} - onChange={(value) => setPhysics({ ...physics, highlightNodeSize: value })} + label="Link width" + value={physics.linkWidth} + onChange={(value) => setPhysics({ ...physics, linkWidth: value })} /> - <Flex justifyContent="space-between"> - <Text> Highlight node color </Text> - </Flex> - <Flex justifyContent="space-between"> - <Text> Highlight link color </Text> - </Flex> - </EnableSection> - </VStack> - </AccordionPanel> - </AccordionItem> - <AccordionItem> - <AccordionButton> - <AccordionIcon /> - Behavior - </AccordionButton> - <AccordionPanel> - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.200" />} - align="stretch" - > - <Box display="flex" justifyContent="space-between" alignItems="center"> - <Text>Hover Higlight</Text> - <Menu> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />}> - {physics.hover} - </MenuButton> - <MenuList> - <MenuItem>Off</MenuItem> - <MenuItem>On</MenuItem> - </MenuList> - </Menu> - </Box> - <Box display="flex" justifyContent="space-between"> - <Text>Click</Text> - </Box> - <Box display="flex" justifyContent="space-between"> - <Text>Double-click</Text> - </Box> - </VStack> - </AccordionPanel> - </AccordionItem> - </Accordion> + <EnableSection + label="Labels" + value={physics.labels} + onChange={() => setPhysics({ ...physics, labels: !physics.labels })} + > + <SliderWithInfo + label="Label Appearance Scale" + value={physics.labelScale * 5} + onChange={(value) => setPhysics({ ...physics, labelScale: value / 5 })} + /> + </EnableSection> + <EnableSection + label="Directional Particles" + value={physics.particles} + onChange={() => setPhysics({ ...physics, particles: !physics.particles })} + > + <SliderWithInfo + label="Particle Number" + value={physics.particlesNumber} + max={5} + step={1} + onChange={(value) => setPhysics({ ...physics, particlesNumber: value })} + /> + <SliderWithInfo + label="Particle Size" + value={physics.particlesWidth} + onChange={(value) => setPhysics({ ...physics, particleWidth: value })} + /> + </EnableSection> + <EnableSection + label="Highlight" + onChange={() => setPhysics({ ...physics, highlight: !physics.highlight })} + value={physics.highlight} + > + <SliderWithInfo + label="Highlight Link Thickness Multiplier" + value={physics.highlightLinkSize} + onChange={(value) => setPhysics({ ...physics, highlightLinkSize: value })} + /> + <SliderWithInfo + label="Highlight Node Size Multiplier" + value={physics.highlightNodeSize} + onChange={(value) => setPhysics({ ...physics, highlightNodeSize: value })} + /> + <Flex justifyContent="space-between"> + <Text> Highlight node color </Text> + </Flex> + <Flex justifyContent="space-between"> + <Text> Highlight link color </Text> + </Flex> + </EnableSection> + </VStack> + </AccordionPanel> + </AccordionItem> + <AccordionItem> + <AccordionButton> + <AccordionIcon /> + Behavior + </AccordionButton> + <AccordionPanel> + <VStack + spacing={2} + justifyContent="flex-start" + divider={<StackDivider borderColor="gray.200" />} + align="stretch" + > + <Box display="flex" justifyContent="space-between" alignItems="center"> + <Text>Hover Higlight</Text> + <Menu> + <MenuButton as={Button} rightIcon={<ChevronDownIcon />}> + {physics.hover} + </MenuButton> + <MenuList> + <MenuItem>Off</MenuItem> + <MenuItem>On</MenuItem> + </MenuList> + </Menu> + </Box> + <Box display="flex" justifyContent="space-between"> + <Text>Click</Text> + </Box> + <Box display="flex" justifyContent="space-between"> + <Text>Double-click</Text> + </Box> + </VStack> + </AccordionPanel> + </AccordionItem> + </Accordion> + </Scrollbars> </Box> ) } @@ -687,37 +677,27 @@ export const Graph = function (props: GraphProps) { return } + const theme = useTheme() + console.log(theme) const graphCommonProps: ComponentPropsWithoutRef<typeof TForceGraph2D> = { graphData: scopedGraphData, width: windowWidth, height: windowHeight, - backgroundColor: '#242730', + backgroundColor: theme.white, nodeLabel: (node) => (node as OrgRoamNode).title, nodeColor: (node) => { if (!physics.colorful) { if (Object.keys(highlightedNodes).length === 0) { return 'rgb(100, 100, 100)' } - return highlightedNodes[node.id!] ? '#a991f1' : 'rgb(50, 50, 50)' + return highlightedNodes[node.id!] ? theme.blue['500'] : 'rgb(50, 50, 50)' } - const palette = [ - '#ff665c', - '#e69055', - '#7bc275', - '#4db5bd', - '#FCCE7B', - '#51afef', - '#1f5582', - '#C57BDB', - '#a991f1', - '#5cEfFF', - '#6A8FBF', - ] - - return palette[ - numbereWithinRange(linksByNodeId[node.id!]?.length ?? 0, 0, palette.length - 1) - ] + const palette = ['pink', 'purple', 'blue', 'cyan', 'teal', 'green', 'yellow', 'orange', 'red'] + + return theme.colors[ + palette[numbereWithinRange(linksByNodeId[node.id!]?.length ?? 0, 0, palette.length - 1)] + ][500] }, nodeRelSize: physics.nodeRel, nodeVal: (node) => { @@ -781,7 +761,7 @@ export const Graph = function (props: GraphProps) { (link.source as NodeObject).id! === centralHighlightedNode?.id! || (link.target as NodeObject).id! === centralHighlightedNode?.id! - return linkIsHighlighted ? '#a991f1' : '#666666' + return linkIsHighlighted ? theme.colors.purple[500] : theme.colors.gray[400] }, linkWidth: physics.linkWidth, linkDirectionalParticleWidth: physics.particlesWidth, @@ -945,6 +945,91 @@ "@react-hook/event" "^1.2.1" "@react-hook/throttle" "^2.2.0" +"@react-spring/animated@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/animated/-/animated-9.2.4.tgz#062ecc0fdfef89f2541a42d8500428b70035f879" + integrity sha512-AfV6ZM8pCCAT29GY5C8/1bOPjZrv/7kD0vedjiE/tEYvNDwg9GlscrvsTViWR2XykJoYrDfdkYArrldWpsCJ5g== + dependencies: + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/core@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/core/-/core-9.2.4.tgz#275a4a065e3a315a4f5fb28c9a6f62ce718c25d6" + integrity sha512-R+PwyfsjiuYCWqaTTfCpYpRmsP0h87RNm7uxC1Uxy7QAHUfHEm2sAHn+AdHPwq/MbVwDssVT8C5yf2WGcqiXGg== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/konva@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/konva/-/konva-9.2.4.tgz#e467b24b3b110ba496526c9001439ce561641e0d" + integrity sha512-19anDOIkfjcydDTfGgVIuZ3lruZxKubYGs9oHCswaP8SRLj7c1kkopJHUr/S4LXGxiIdqdF0XucWm0iTEPEq4w== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/core" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/native@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/native/-/native-9.2.4.tgz#0fd335a44c05023f5428df444d8f1aa3da7abfc9" + integrity sha512-xKJWKh5qOhSclpL3iuGwJRLoZzTNvlBEnIrMs8yh8xvX6z9Lmnu4uGu5DpfrnM1GzBvRoktoCoLEx/VcEYFSng== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/core" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/rafz@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/rafz/-/rafz-9.2.4.tgz#44793e9adc14dd0dcd1573d094368af11a89d73a" + integrity sha512-SOKf9eue+vAX+DGo7kWYNl9i9J3gPUlQjifIcV9Bzw9h3i30wPOOP0TjS7iMG/kLp2cdHQYDNFte6nt23VAZkQ== + +"@react-spring/shared@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/shared/-/shared-9.2.4.tgz#f9cc66ac5308a77293330a18518e34121f4008c1" + integrity sha512-ZEr4l2BxmyFRUvRA2VCkPfCJii4E7cGkwbjmTBx1EmcGrOnde/V2eF5dxqCTY3k35QuCegkrWe0coRJVkh8q2Q== + dependencies: + "@react-spring/rafz" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/three@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/three/-/three-9.2.4.tgz#849c97658a6e1410b6f823ad21e2ee33feada820" + integrity sha512-ljFig7XW099VWwRPKPUf+4yYLivp/sSWXN3oO5SJOF/9BSoV1quS/9chZ5Myl5J14od3CsHf89Tv4FdlX5kHlA== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/core" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/types@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/types/-/types-9.2.4.tgz#2365ce9d761f548a9adcb2cd68714bf26765a5de" + integrity sha512-zHUXrWO8nweUN/ISjrjqU7GgXXvoEbFca1CgiE0TY0H/dqJb3l+Rhx8ecPVNYimzFg3ZZ1/T0egpLop8SOv4aA== + +"@react-spring/web@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/web/-/web-9.2.4.tgz#c6d5464a954bfd0d7bc90117050f796a95ebfa08" + integrity sha512-vtPvOalLFvuju/MDBtoSnCyt0xXSL6Amyv82fljOuWPl1yGd4M1WteijnYL9Zlriljl0a3oXcPunAVYTD9dbDQ== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/core" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + +"@react-spring/zdog@~9.2.0": + version "9.2.4" + resolved "https://registry.yarnpkg.com/@react-spring/zdog/-/zdog-9.2.4.tgz#db1d1924fe9920e917d889c4d3bb138bd0885cf1" + integrity sha512-rv7ptedS37SHr6yuCbRkUErAzAhebdgt8f4KUtZWzseC+7qLNkaZWf+uujgsb881qAuX9b9yz8rre9UKeYepgw== + dependencies: + "@react-spring/animated" "~9.2.0" + "@react-spring/core" "~9.2.0" + "@react-spring/shared" "~9.2.0" + "@react-spring/types" "~9.2.0" + "@rushstack/eslint-patch@^1.0.6": version "1.0.6" resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.0.6.tgz#023d72a5c4531b4ce204528971700a78a85a0c50" @@ -1065,6 +1150,11 @@ acorn@^7.4.0: resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa" integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A== + version "1.0.0" + resolved "https://registry.yarnpkg.com/add-px-to-style/-/add-px-to-style-1.0.0.tgz#d0c135441fa8014a8137904531096f67f28f263a" + integrity sha1-0ME1RB+oAUqBN5BFMQlvZ/KPJjo= + aframe-extras@^6.1: version "6.1.1" resolved "https://registry.yarnpkg.com/aframe-extras/-/aframe-extras-6.1.1.tgz#6f158b6c4da12e77d00fd0b97dfe1c72245327df" @@ -2007,6 +2097,15 @@ document-register-element@dmarcos/document-register-element#8ccc532b7f3744be9545 version "0.5.4" resolved "https://codeload.github.com/dmarcos/document-register-element/tar.gz/8ccc532b7f3744be954574caf3072a5fd260ca90" +dom-css@^2.0.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/dom-css/-/dom-css-2.1.0.tgz#fdbc2d5a015d0a3e1872e11472bbd0e7b9e6a202" + integrity sha1-/bwtWgFdCj4YcuEUcrvQ57nmogI= + dependencies: + add-px-to-style "1.0.0" + prefix-style "2.0.1" + to-camel-case "1.0.0" + dom-walk@^0.1.0: version "0.1.2" resolved "https://registry.yarnpkg.com/dom-walk/-/dom-walk-0.1.2.tgz#0c548bef048f4d1f2a97249002236060daa3fd84" @@ -2679,6 +2778,11 @@ [email protected]: resolved "https://registry.yarnpkg.com/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f" integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw== +hex-rgb@^5.0.0: + version "5.0.0" + resolved "https://registry.yarnpkg.com/hex-rgb/-/hex-rgb-5.0.0.tgz#e2c9eb6a37498d66c5a350a221ed4c2c7d1a92d6" + integrity sha512-NQO+lgVUCtHxZ792FodgW0zflK+ozS9X9dwGp9XvvmPlH7pyxd588cn24TD3rmPm/N0AIRXF10Otah8yKqGw4w== + hey-listen@^1.0.8: version "1.0.8" resolved "https://registry.yarnpkg.com/hey-listen/-/hey-listen-1.0.8.tgz#8e59561ff724908de1aa924ed6ecc84a56a9aa68" @@ -3740,6 +3844,11 @@ pbkdf2@^3.0.3: safe-buffer "^5.0.1" sha.js "^2.4.8" +performance-now@^2.1.0: + version "2.1.0" + resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b" + integrity sha1-Ywn04OX6kT7BxpMHrjZLSzd8nns= + phin@^2.9.1: version "2.9.3" resolved "https://registry.yarnpkg.com/phin/-/phin-2.9.3.tgz#f9b6ac10a035636fb65dfc576aaaa17b8743125c" @@ -3814,6 +3923,11 @@ [email protected]: nanoid "^3.1.22" source-map "^0.6.1" + version "2.0.1" + resolved "https://registry.yarnpkg.com/prefix-style/-/prefix-style-2.0.1.tgz#66bba9a870cfda308a5dc20e85e9120932c95a06" + integrity sha1-ZrupqHDP2jCKXcIOhekSCTLJWgY= + prelude-ls@^1.2.1: version "1.2.1" resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" @@ -3849,7 +3963,7 @@ promise-polyfill@^3.1.0: resolved "https://registry.yarnpkg.com/promise-polyfill/-/promise-polyfill-3.1.0.tgz#62952b01d059b115b432763b7ef461b80f6df47d" integrity sha1-YpUrAdBZsRW0MnY7fvRhuA9t9H0= [email protected], prop-types@^15.6.2, prop-types@^15.7, prop-types@^15.7.2: [email protected], prop-types@^15.5.10, prop-types@^15.6.2, prop-types@^15.7, prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== @@ -3930,6 +4044,13 @@ [email protected]: dependencies: inherits "~2.0.3" +raf@^3.1.0: + version "3.4.1" + resolved "https://registry.yarnpkg.com/raf/-/raf-3.4.1.tgz#0742e99a4a6552f445d73e3ee0328af0ff1ede39" + integrity sha512-Sq4CW4QhwOHE8ucn6J34MqtZCeWFP2aQSmrlroYgqAV1PjStIhJXxYuTgUIfkEk7zTLjmIjLmU5q+fbD1NnOJA== + dependencies: + performance-now "^2.1.0" + randombytes@^2.0.0, randombytes@^2.0.1, randombytes@^2.0.5: version "2.1.0" resolved "https://registry.yarnpkg.com/randombytes/-/randombytes-2.1.0.tgz#df6f84372f0270dc65cdf6291349ab7a473d4f2a" @@ -3962,6 +4083,15 @@ react-clientside-effect@^1.2.2: dependencies: "@babel/runtime" "^7.12.13" +react-custom-scrollbars-2@^4.4.0: + version "4.4.0" + resolved "https://registry.yarnpkg.com/react-custom-scrollbars-2/-/react-custom-scrollbars-2-4.4.0.tgz#6cc237abc18f5ab32b5392b336e6f072c2b4cfc1" + integrity sha512-I+oxZ9rfHfvYm85jdH2lQqpzwNr/ZAdYB8htm6R/hwRGoIEK31jq+YE6MmFwBzuO7C5zcAtH5HN9vwZxnW61NQ== + dependencies: + dom-css "^2.0.0" + prop-types "^15.5.10" + raf "^3.1.0" + version "17.0.2" resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23" @@ -4042,6 +4172,18 @@ [email protected]: use-callback-ref "^1.2.3" use-sidecar "^1.0.1" +react-spring@^9.2.4: + version "9.2.4" + resolved "https://registry.yarnpkg.com/react-spring/-/react-spring-9.2.4.tgz#9d89b0321664d594f957dca9459b13d94b3dfa39" + integrity sha512-bMjbyTW0ZGd+/h9cjtohLqCwOGqX2OuaTvalOVfLCGmhzEg/u3GgopI3LAm4UD2Br3MNdVdGgNVoESg4MGqKFQ== + dependencies: + "@react-spring/core" "~9.2.0" + "@react-spring/konva" "~9.2.0" + "@react-spring/native" "~9.2.0" + "@react-spring/three" "~9.2.0" + "@react-spring/web" "~9.2.0" + "@react-spring/zdog" "~9.2.0" + react-style-singleton@^2.1.0: version "2.1.1" resolved "https://registry.yarnpkg.com/react-style-singleton/-/react-style-singleton-2.1.1.tgz#ce7f90b67618be2b6b94902a30aaea152ce52e66" @@ -4658,11 +4800,23 @@ to-arraybuffer@^1.0.0: resolved "https://registry.yarnpkg.com/to-arraybuffer/-/to-arraybuffer-1.0.1.tgz#7d229b1fcc637e466ca081180836a7aabff83f43" integrity sha1-fSKbH8xjfkZsoIEYCDanqr/4P0M= + version "1.0.0" + resolved "https://registry.yarnpkg.com/to-camel-case/-/to-camel-case-1.0.0.tgz#1a56054b2f9d696298ce66a60897322b6f423e46" + integrity sha1-GlYFSy+daWKYzmamCJcyK29CPkY= + dependencies: + to-space-case "^1.0.0" + to-fast-properties@^2.0.0: version "2.0.0" resolved "https://registry.yarnpkg.com/to-fast-properties/-/to-fast-properties-2.0.0.tgz#dc5e698cbd079265bc73e0377681a4e4e83f616e" integrity sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4= +to-no-case@^1.0.0: + version "1.0.2" + resolved "https://registry.yarnpkg.com/to-no-case/-/to-no-case-1.0.2.tgz#c722907164ef6b178132c8e69930212d1b4aa16a" + integrity sha1-xyKQcWTvaxeBMsjmmTAhLRtKoWo= + to-regex-range@^5.0.1: version "5.0.1" resolved "https://registry.yarnpkg.com/to-regex-range/-/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4" @@ -4670,6 +4824,13 @@ to-regex-range@^5.0.1: dependencies: is-number "^7.0.0" +to-space-case@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/to-space-case/-/to-space-case-1.0.0.tgz#b052daafb1b2b29dc770cea0163e5ec0ebc9fc17" + integrity sha1-sFLar7Gysp3HcM6gFj5ewOvJ/Bc= + dependencies: + to-no-case "^1.0.0" + toggle-selection@^1.0.6: version "1.0.6" resolved "https://registry.yarnpkg.com/toggle-selection/-/toggle-selection-1.0.6.tgz#6e45b1263f2017fa0acc7d89d78b15b8bf77da32" @@ -4790,6 +4951,11 @@ use-callback-ref@^1.2.1, use-callback-ref@^1.2.3: resolved "https://registry.yarnpkg.com/use-callback-ref/-/use-callback-ref-1.2.5.tgz#6115ed242cfbaed5915499c0a9842ca2912f38a5" integrity sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg== +use-constant@^1.1.0: + version "1.1.0" + resolved "https://registry.yarnpkg.com/use-constant/-/use-constant-1.1.0.tgz#76d36a0edf16d4cc8565361f522b55da5f8f3f22" + integrity sha512-yrflEfv7Xv/W8WlYV6nwRH01K+2BpR4cWxuzY03yPRjYZuHixhGlvnJN5O2bRYrXGpJ4zy8QjFABGIQ2QXeBOA== + use-sidecar@^1.0.1: version "1.0.5" resolved "https://registry.yarnpkg.com/use-sidecar/-/use-sidecar-1.0.5.tgz#ffff2a17c1df42e348624b699ba6e5c220527f2b" |