diff --git a/components/Block/BlockContent.tsx b/components/Block/BlockContent.tsx index 8231613..e4bbfcb 100644 --- a/components/Block/BlockContent.tsx +++ b/components/Block/BlockContent.tsx @@ -21,7 +21,12 @@ export const BlockContent: React.FC = ({ const isEditing = editingBlockId === shallowBlock.id; if (!isEditing) { - return ; + return ( + + ); } return ( diff --git a/components/Block/Preview.tsx b/components/Block/Preview.tsx index ccb9667..66764b4 100644 --- a/components/Block/Preview.tsx +++ b/components/Block/Preview.tsx @@ -3,7 +3,13 @@ import clsx from "clsx"; import deepEqual from "fast-deep-equal/es6/react"; import { useAtomValue, useUpdateAtom } from "jotai/utils"; import { nanoid } from "nanoid"; -import { memo as ReactMemo, useCallback } from "react"; +import { + memo as ReactMemo, + useCallback, + forwardRef, + CSSProperties, + RefObject, +} from "react"; import { useAdapter } from "../Editor/adapters/AdapterContext"; import { Token, tokenizer } from "../Editor/parser"; import { anchorOffsetAtom, editingBlockIdAtom } from "../Editor/store"; @@ -11,8 +17,12 @@ import { anchorOffsetAtom, editingBlockIdAtom } from "../Editor/store"; export type PropsType = { blockId: string; className: string; + style?: CSSProperties; }; -const PreviewImpl: React.FC = ({ blockId, className }) => { +const PreviewImpl: React.ForwardRefRenderFunction = ( + { blockId, className, style }, + ref +) => { const { blockFamily, pageIdAtom } = useAdapter(); const setAnchorOffset = useUpdateAtom(anchorOffsetAtom); const setEditingBlockId = useUpdateAtom(editingBlockIdAtom); @@ -45,11 +55,10 @@ const PreviewImpl: React.FC = ({ blockId, className }) => { } `}
} + style={style} > {parsed.map((token) => { return ( @@ -66,6 +75,7 @@ const PreviewImpl: React.FC = ({ blockId, className }) => { ); }; -export const Preview = ReactMemo(PreviewImpl, (prevProps, nextProps) => - deepEqual(prevProps, nextProps) +export const Preview = ReactMemo( + forwardRef(PreviewImpl), + (prevProps, nextProps) => deepEqual(prevProps, nextProps) ); diff --git a/components/Editor/adapters/memory.ts b/components/Editor/adapters/memory.ts index 12e0e13..5e5bc35 100644 --- a/components/Editor/adapters/memory.ts +++ b/components/Editor/adapters/memory.ts @@ -29,7 +29,7 @@ const isStaleAtom = atom(false); const defaultPageIdFromRoute = () => { if (process.browser) { const matches = window?.location?.pathname?.match( - /\/note\/([^\/]+)?\/?/ + /\/(?:note|graph)\/([^\/]+)?\/?/ ) ?? [""]; return matches![1] as string; } diff --git a/components/Editor/blocks/Code.tsx b/components/Editor/blocks/Code.tsx index a08b194..a7134ba 100644 --- a/components/Editor/blocks/Code.tsx +++ b/components/Editor/blocks/Code.tsx @@ -1,16 +1,21 @@ -import { MouseEventHandler } from "react"; +import { MouseEventHandler, forwardRef } from "react"; export type PropType = { content: string; focusTextHelper: (offset?: number) => MouseEventHandler; }; -export const Code: React.FC = ({ content, focusTextHelper }) => { + +export const Code = forwardRef(function Code( + { content, focusTextHelper }, + ref +) { return ( {content} ); -}; +}); diff --git a/components/Editor/blocks/HyperLink.tsx b/components/Editor/blocks/HyperLink.tsx index 274d380..2731a16 100644 --- a/components/Editor/blocks/HyperLink.tsx +++ b/components/Editor/blocks/HyperLink.tsx @@ -1,3 +1,4 @@ +import { forwardRef } from "react"; import Link from "next/link"; export type PropsType = { @@ -8,14 +9,20 @@ export type PropsType = { const stopPropagation = (ev) => { ev.stopPropagation(); }; -export const HyperLink: React.FC = ({ url, alt }) => ( - - - {alt} - - + +export const HyperLink = forwardRef( + function HyperLink({ url, alt }, ref) { + return ( + + + {alt} + + + ); + } ); diff --git a/components/Editor/blocks/Image.tsx b/components/Editor/blocks/Image.tsx index 5b4506a..ce10ca6 100644 --- a/components/Editor/blocks/Image.tsx +++ b/components/Editor/blocks/Image.tsx @@ -1,4 +1,10 @@ -export const Image: React.FC<{ url: string; alt: string }> = ({ url, alt }) => ( - // eslint-disable-next-line @next/next/no-img-element - {alt} +import { forwardRef } from "react"; + +export const Image = forwardRef( + function Image({ url, alt }, ref) { + return ( + // eslint-disable-next-line @next/next/no-img-element + {alt} + ); + } ); diff --git a/components/Editor/blocks/Text.tsx b/components/Editor/blocks/Text.tsx index 5cd4ac6..ff5cc6f 100644 --- a/components/Editor/blocks/Text.tsx +++ b/components/Editor/blocks/Text.tsx @@ -1,3 +1,15 @@ -export function Text({ children, focusTextHelper }) { - return {children}; -} +import { forwardRef, ReactNode, MouseEventHandler } from "react"; + +export const Text = forwardRef< + HTMLElement, + { + children?: ReactNode; + focusTextHelper: (offset: number) => MouseEventHandler; + } +>(function Text({ children, focusTextHelper }, ref) { + return ( + + {children} + + ); +}); diff --git a/components/Editor/index.tsx b/components/Editor/index.tsx index 16fce4a..7f05fb3 100644 --- a/components/Editor/index.tsx +++ b/components/Editor/index.tsx @@ -35,7 +35,9 @@ export const Editor: React.FC = ({ setPage(page); router.beforePopState((nextState) => { if (nextState.url === "/note/[pageId]") { - const pageId = nextState?.as?.match?.(/note\/([^\/]+)(?:\/.+)*/)?.[1]; + const pageId = nextState?.as?.match?.( + /(?:note|graph)\/([^\/]+)(?:\/.+)*/ + )?.[1]; if (pageId) { setPageId(pageId); } diff --git a/components/MindMap/index.tsx b/components/MindMap/index.tsx new file mode 100644 index 0000000..857c576 --- /dev/null +++ b/components/MindMap/index.tsx @@ -0,0 +1,174 @@ +import React, { useMemo, Suspense, useEffect, useState, useRef } from "react"; +import { Group } from "@visx/group"; +import { Tree, Cluster, Pack, hierarchy } from "@visx/hierarchy"; +import { HierarchyPointNode } from "@visx/hierarchy/lib/types"; +import { LinkHorizontalStep, LinkHorizontal } from "@visx/shape"; +import { Preview } from "../Block/Preview"; +import { ParentSize } from "@visx/responsive"; +import { Zoom } from "@visx/zoom"; + +const peach = "#fd9b93"; +const pink = "#fe6e9e"; +const blue = "#03c0dc"; +const green = "#26deb0"; +const plum = "#71248e"; +const lightpurple = "#374469"; +const white = "#ffffff"; +export const background = "#272b4d"; + +export interface TreeNode { + id: string; + title?: string; + children?: this[]; +} + +type HierarchyNode = HierarchyPointNode; + +/** Handles rendering Root, Parent, and other Nodes. */ +function Node({ node }: { node: HierarchyNode }) { + const width = 5000; + const height = 5000; + + return ( + + + + ); +} + +function DynamicPreview(props: { + height: number; + width: number; + node: HierarchyNode; +}) { + const { node } = props; + const [height, setHeight] = useState(props.height); + const [width, setWidth] = useState(props.width); + + const ref = useRef(null); + const syncSize = () => { + const rect = ref.current?.getBoundingClientRect(); + const img = ref.current?.querySelector("img"); + if (img) { + img.addEventListener("load", (ev) => { + setHeight(Math.min(img.height, 320)); + setWidth(Math.min(img.width, 320)); + setTimeout(() => { + const rect = ref.current!.getBoundingClientRect(); + setHeight(rect.height); + setWidth(rect.width); + }, 0); + }); + } else { + setHeight(Math.min(rect?.height ?? props.height, 320)); + setWidth(Math.max(Math.min(rect?.width ?? props.width, 320), 120)); + } + }; + useEffect(() => { + syncSize(); + }, [width, height, ref.current]); + + const translate = useMemo(() => { + if (ref.current?.tagName === "IMG") { + return ""; + } + return `translate(8, ${height * (node.children ? 0.25 : -0.95)})`; + }, [height, ref.current, node.children, node]); + return ( + + + + + + ); +} + +const defaultMargin = { top: 48, left: 80, right: 80, bottom: 16 }; + +export type TreeProps = { + width: number; + height: number; + margin?: { top: number; right: number; bottom: number; left: number }; + rawTree: TreeNode; +}; + +function MindMapTree({ + width, + height, + margin = defaultMargin, + rawTree, +}: TreeProps) { + const data = useMemo(() => hierarchy(rawTree), []); + const yMax = height - margin.top - margin.bottom; + const xMax = width - margin.left - margin.right; + const scale = 1; + return width < 10 ? null : ( + + width={width} + height={height} + scaleXMin={0.5 / scale} + scaleYMin={0.5 / scale} + > + {(zoom) => ( +
+ + + + root={data} + size={[yMax * scale, xMax * scale]} + separation={(a, b) => { + return (a.parent == b.parent ? 0.2 : 0.1) * a.depth; + }} + > + {(tree) => { + return ( + + {tree.links().map((link, i) => ( + + ))} + {tree.descendants().map((node, i) => ( + + ))} + + ); + }} + + +
+ )} + + ); +} + +export const MindMap: React.FC<{ tree: TreeNode }> = ({ tree }) => { + return ( + + {(parent) => ( + + )} + + ); +}; diff --git a/hooks/measure-preview.tsx b/hooks/measure-preview.tsx new file mode 100644 index 0000000..6c2d2de --- /dev/null +++ b/hooks/measure-preview.tsx @@ -0,0 +1,64 @@ +// @ts-ignore +import { createRoot } from "react-dom"; + +import { useEventListener, useMountEffect } from "@react-hookz/web"; +import { Preview } from "../components/Block/Preview"; +import React, { useState } from "react"; + +const IFRAME_ID = "plastic_measure_iframe"; +export function useMeasurePreview(blockId: string) { + const [rect, setRect] = useState(null); + let iframe; + let root; + useMountEffect(() => { + iframe = document.getElementById(IFRAME_ID); + if (!iframe) { + iframe = document.createElement("iframe"); + } + iframe.id = IFRAME_ID; + iframe.setAttribute( + "style", + "position: absolute; top: -50000px; border: 0; z-index: -50000; width: 50000px" + ); + document.body.appendChild(iframe); + iframe.addEventListener("load", () => { + const doc = iframe!.contentDocument!; + console.log(doc); + let rootEl = doc.getElementById("root"); + if (!rootEl) { + rootEl = doc.createElement("div"); + rootEl.id = "root"; + doc.body.appendChild(rootEl); + } + console.log(rootEl); + if (!root) { + root = createRoot(rootEl); + } + root.render( + + ); + const setValue = () => { + const el = doc.querySelector(".preview"); + if (el) { + const r = el.getBoundingClientRect(); + setRect(r); + return r; + } else { + setTimeout(setValue, 4); + } + }; + setTimeout(() => { + setValue(); + }, 4); + }); + }); + return rect; +} diff --git a/package.json b/package.json index 02f34c2..1a7c333 100644 --- a/package.json +++ b/package.json @@ -16,6 +16,14 @@ "@react-hookz/web": "^7.0.0", "@supabase/supabase-js": "^1.29.1", "@tauri-apps/api": "^1.0.0-beta.8", + "@visx/event": "^2.1.0", + "@visx/gradient": "^2.1.0", + "@visx/group": "^2.1.0", + "@visx/hierarchy": "^2.1.0", + "@visx/responsive": "^2.1.0", + "@visx/scale": "^2.1.0", + "@visx/shape": "^2.1.0", + "@visx/zoom": "^2.1.0", "clsx": "^1.1.1", "date-fns": "^2.28.0", "fast-deep-equal": "^3.1.3", diff --git a/pages/graph/[pageId].tsx b/pages/graph/[pageId].tsx new file mode 100644 index 0000000..760a3a9 --- /dev/null +++ b/pages/graph/[pageId].tsx @@ -0,0 +1,29 @@ +import { + AdapterProvider, + useAdapter, +} from "../../components/Editor/adapters/AdapterContext"; +import { useCurrentPageId } from "../../components/Editor/hooks"; +import { MindMap as IMindMap } from "../../components/MindMap"; +import { useAtomValue } from "jotai/utils"; + +export default function NotePage(props) { + const pageId = useCurrentPageId("pageId"); + if (!pageId) { + return null; + } + return ( + +
+ +
+ + ); +} + +function MindMap() { + const { pageFamily, pageIdAtom } = useAdapter(); + const id = useAtomValue(pageIdAtom); + console.log(id); + const pageContent = useAtomValue(pageFamily({ id })); + return ; +} diff --git a/pages/note/[pageId].tsx b/pages/note/[pageId].tsx index 47ce148..55efd23 100644 --- a/pages/note/[pageId].tsx +++ b/pages/note/[pageId].tsx @@ -1,5 +1,4 @@ import { AdapterProvider } from "../../components/Editor/adapters/AdapterContext"; -import { memoryAdapter } from "../../components/Editor/adapters/memory"; import { useCurrentPageId } from "../../components/Editor/hooks"; import { Main } from "../../components/Main"; @@ -10,7 +9,9 @@ export default function NotePage(props) { } return ( -
+
+
+
); } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 51bd5b7..55bf553 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -10,6 +10,14 @@ specifiers: "@types/file-saver": ^2.0.4 "@types/lodash.debounce": ^4.0.6 "@types/react": ^17.0.38 + "@visx/event": ^2.1.0 + "@visx/gradient": ^2.1.0 + "@visx/group": ^2.1.0 + "@visx/hierarchy": ^2.1.0 + "@visx/responsive": ^2.1.0 + "@visx/scale": ^2.1.0 + "@visx/shape": ^2.1.0 + "@visx/zoom": ^2.1.0 autoprefixer: ^10.4.2 clsx: ^1.1.1 date-fns: ^2.28.0 @@ -44,6 +52,14 @@ dependencies: "@react-hookz/web": 7.0.0_88bc4fee344d9ebe6e1abd431fb36b31 "@supabase/supabase-js": 1.29.1 "@tauri-apps/api": 1.0.0-beta.8 + "@visx/event": 2.1.2 + "@visx/gradient": 2.1.0_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/group": 2.1.0_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/hierarchy": 2.1.2_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/responsive": 2.4.1_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/scale": 2.2.2 + "@visx/shape": 2.4.0_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/zoom": 2.2.2_e32785dbcafa2fde92a71a8f50f52ce6 clsx: 1.1.1 date-fns: 2.28.0 fast-deep-equal: 3.1.3 @@ -635,6 +651,61 @@ packages: "@types/responselike": 1.0.0 dev: true + /@types/d3-color/1.4.2: + resolution: + { + integrity: sha512-fYtiVLBYy7VQX+Kx7wU/uOIkGQn8aAEY8oWMoyja3N4dLd8Yf6XgSIR/4yWvMuveNOH5VShnqCgRqqh/UNanBA==, + } + dev: false + + /@types/d3-hierarchy/1.1.8: + resolution: + { + integrity: sha512-AbStKxNyWiMDQPGDguG2Kuhlq1Sv539pZSxYbx4UZeYkutpPwXCcgyiRrlV4YH64nIOsKx7XVnOMy9O7rJsXkg==, + } + dev: false + + /@types/d3-interpolate/1.4.2: + resolution: + { + integrity: sha512-ylycts6llFf8yAEs1tXzx2loxxzDZHseuhPokrqKprTQSTcD3JbJI1omZP1rphsELZO3Q+of3ff0ZS7+O6yVzg==, + } + dependencies: + "@types/d3-color": 1.4.2 + dev: false + + /@types/d3-path/1.0.9: + resolution: + { + integrity: sha512-NaIeSIBiFgSC6IGUBjZWcscUJEq7vpVu7KthHN8eieTV9d9MqkSOZLH4chq1PmcKy06PNe3axLeKmRIyxJ+PZQ==, + } + dev: false + + /@types/d3-scale/3.3.2: + resolution: + { + integrity: sha512-gGqr7x1ost9px3FvIfUMi5XA/F/yAf4UkUDtdQhpH92XCT0Oa7zkkRzY61gPVJq+DxpHn/btouw5ohWkbBsCzQ==, + } + dependencies: + "@types/d3-time": 2.1.1 + dev: false + + /@types/d3-shape/1.3.8: + resolution: + { + integrity: sha512-gqfnMz6Fd5H6GOLYixOZP/xlrMtJms9BaS+6oWxTKHNqPGZ93BkWWupQSCYm6YHqx6h9wjRupuJb90bun6ZaYg==, + } + dependencies: + "@types/d3-path": 1.0.9 + dev: false + + /@types/d3-time/2.1.1: + resolution: + { + integrity: sha512-9MVYlmIgmRR31C5b4FVSWtuMmBHh2mOWQYfl7XAYOa8dsnb7iEmUmRSWSFgXFtkjxO65d7hTUHQC+RhR/9IWFg==, + } + dev: false + /@types/file-saver/2.0.4: resolution: { @@ -683,7 +754,6 @@ packages: { integrity: sha512-0d5Wd09ItQWH1qFbEyQ7oTQ3GZrMfth5JkbN3EvTKLXcHLRDSXeLnlvlOn0wvxVIwK5o2M8JzP/OWz7T3NRsbw==, } - dev: true /@types/node/17.0.8: resolution: @@ -824,6 +894,164 @@ packages: eslint-visitor-keys: 2.1.0 dev: true + /@use-gesture/core/10.2.4: + resolution: + { + integrity: sha512-fk1LjCBj43BKb8NE05qkdtPOR0ngA7PwgvEqfFap/h+s7QHi+JTv4/mtDQ4wI9zzem+Ry5EKrHS/cVdBehI4wA==, + } + dev: false + + /@use-gesture/react/10.2.4_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-CbqyRj+qNbRBOGmS8OWtaOa29fxEr7bKTYHvPuMQ1wsgQDh2/DqQxbp7cFxAg6WZ8oZjppDj/EkWnw22WpIIWQ==, + } + peerDependencies: + react: ">= 16.8.0" + dependencies: + "@use-gesture/core": 10.2.4 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + + /@visx/curve/2.1.0: + resolution: + { + integrity: sha512-9b6JOnx91gmOQiSPhUOxdsvcnW88fgqfTPKoVgQxidMsD/I3wksixtwo8TR/vtEz2aHzzsEEhlv1qK7Y3yaSDw==, + } + dependencies: + "@types/d3-shape": 1.3.8 + d3-shape: 1.3.7 + dev: false + + /@visx/event/2.1.2: + resolution: + { + integrity: sha512-x3gAQ9DB4zDA6qqGpzlpGacGuOtmzFi/m5Zq7BJ0OJ7PjNfkIazCsznc9epCT/g9IIhwhs+UN/Ijww4YnFHqHw==, + } + dependencies: + "@types/react": 17.0.38 + "@visx/point": 2.1.0 + dev: false + + /@visx/gradient/2.1.0_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-IpmAuAPsk4XQzKB+BxZiyyWHK4Ao/fJXYuqSO1Kryp5li3wt5H7LshXn2b2Nhu9NsR2eJFU1tmH9BDD9mT/Vww==, + } + peerDependencies: + react: ^16.0.0-0 || ^17.0.0-0 + dependencies: + "@types/react": 17.0.38 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + + /@visx/group/2.1.0_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-bZKa54yVjGYPZZhzYHLz4AVlidSr4ET9B/xmSa7nnictMJWr7e/IuZThB/bMfDQlgdtvhcfTgs+ZluySc5SBUg==, + } + peerDependencies: + react: ^16.0.0-0 || ^17.0.0-0 + dependencies: + "@types/react": 17.0.38 + classnames: 2.3.1 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + + /@visx/hierarchy/2.1.2_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-dza9X3OpX5vvw/mZ14OpuZSkWP+8ig8Mfm1c4yE6bK2TmobiqR9uJ1D8ouw1dBit5zUVb03XWuY2VqG6yzyKAg==, + } + peerDependencies: + react: ^16.3.0-0 || ^17.0.0-0 + dependencies: + "@types/d3-hierarchy": 1.1.8 + "@types/react": 17.0.38 + "@visx/group": 2.1.0_e32785dbcafa2fde92a71a8f50f52ce6 + classnames: 2.3.1 + d3-hierarchy: 1.1.9 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + + /@visx/point/2.1.0: + resolution: + { + integrity: sha512-vVnfI7oqjjttkn05Xi/ooR0UqQRoGf68lyT3SOl0WPHvIQBGNh3XoVUBHDr15/NUkfErgK6TNlfXY763YncPWg==, + } + dev: false + + /@visx/responsive/2.4.1_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-x5zPUmmsdVX/QaeDj9rLg3mGtNuiomBWUvwBo5oQs2KOtAFiviHx0NpLfY09h+p5gvkmGfTM+8gHEtVtIwLXPg==, + } + peerDependencies: + react: ^16.0.0-0 || ^17.0.0-0 + dependencies: + "@types/lodash": 4.14.178 + "@types/react": 17.0.38 + lodash: 4.17.21 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + resize-observer-polyfill: 1.5.1 + dev: false + + /@visx/scale/2.2.2: + resolution: + { + integrity: sha512-3aDySGUTpe6VykDQmF+g2nz5paFu9iSPTcCOEgkcru0/v5tmGzUdvivy8CkYbr87HN73V/Jc53lGm+kJUQcLBw==, + } + dependencies: + "@types/d3-interpolate": 1.4.2 + "@types/d3-scale": 3.3.2 + "@types/d3-time": 2.1.1 + d3-interpolate: 1.4.0 + d3-scale: 3.3.0 + d3-time: 2.1.1 + dev: false + + /@visx/shape/2.4.0_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-D6XdGCgWi0/0ZKJ5iK8W5gILCKdrbDwnR/e7o6n/favLU0o+ntiI4a9PZBZ5bYS0aFNG7r+miGMcWV/AQfODuA==, + } + peerDependencies: + react: ^16.3.0-0 || ^17.0.0-0 + dependencies: + "@types/d3-path": 1.0.9 + "@types/d3-shape": 1.3.8 + "@types/lodash": 4.14.178 + "@types/react": 17.0.38 + "@visx/curve": 2.1.0 + "@visx/group": 2.1.0_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/scale": 2.2.2 + classnames: 2.3.1 + d3-path: 1.0.9 + d3-shape: 1.3.7 + lodash: 4.17.21 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + + /@visx/zoom/2.2.2_e32785dbcafa2fde92a71a8f50f52ce6: + resolution: + { + integrity: sha512-Dpg3KHp2nsKBF4gIHEUUa1gYb6Php5r4B/x1VxHFQO+yVY8bqd3RWo6jdvfP/XHNowrEwM6hLhBVm7U/igPhVw==, + } + peerDependencies: + react: ^16.0.0-0 || ^17.0.0-0 + dependencies: + "@types/react": 17.0.38 + "@use-gesture/react": 10.2.4_e32785dbcafa2fde92a71a8f50f52ce6 + "@visx/event": 2.1.2 + prop-types: 15.8.1 + react: 18.0.0-rc.0-next-fe905f152-20220107 + dev: false + /acorn-jsx/5.3.2_acorn@7.4.1: resolution: { @@ -1550,6 +1778,13 @@ packages: } dev: true + /classnames/2.3.1: + resolution: + { + integrity: sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA==, + } + dev: false + /cli-boxes/2.2.1: resolution: { @@ -1857,6 +2092,92 @@ packages: type: 1.2.0 dev: false + /d3-array/2.12.1: + resolution: + { + integrity: sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==, + } + dependencies: + internmap: 1.0.1 + dev: false + + /d3-color/1.4.1: + resolution: + { + integrity: sha512-p2sTHSLCJI2QKunbGb7ocOh7DgTAn8IrLx21QRc/BSnodXM4sv6aLQlnfpvehFMLZEfBc6g9pH9SWQccFYfJ9Q==, + } + dev: false + + /d3-format/2.0.0: + resolution: + { + integrity: sha512-Ab3S6XuE/Q+flY96HXT0jOXcM4EAClYFnRGY5zsjRGNy6qCYrQsMffs7cV5Q9xejb35zxW5hf/guKw34kvIKsA==, + } + dev: false + + /d3-hierarchy/1.1.9: + resolution: + { + integrity: sha512-j8tPxlqh1srJHAtxfvOUwKNYJkQuBFdM1+JAUfq6xqH5eAqf93L7oG1NVqDa4CpFZNvnNKtCYEUC8KY9yEn9lQ==, + } + dev: false + + /d3-interpolate/1.4.0: + resolution: + { + integrity: sha512-V9znK0zc3jOPV4VD2zZn0sDhZU3WAE2bmlxdIwwQPPzPjvyLkd8B3JUVdS1IDUFDkWZ72c9qnv1GK2ZagTZ8EA==, + } + dependencies: + d3-color: 1.4.1 + dev: false + + /d3-path/1.0.9: + resolution: + { + integrity: sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==, + } + dev: false + + /d3-scale/3.3.0: + resolution: + { + integrity: sha512-1JGp44NQCt5d1g+Yy+GeOnZP7xHo0ii8zsQp6PGzd+C1/dl0KGsp9A7Mxwp+1D1o4unbTTxVdU/ZOIEBoeZPbQ==, + } + dependencies: + d3-array: 2.12.1 + d3-format: 2.0.0 + d3-interpolate: 1.4.0 + d3-time: 2.1.1 + d3-time-format: 3.0.0 + dev: false + + /d3-shape/1.3.7: + resolution: + { + integrity: sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==, + } + dependencies: + d3-path: 1.0.9 + dev: false + + /d3-time-format/3.0.0: + resolution: + { + integrity: sha512-UXJh6EKsHBTjopVqZBhFysQcoXSv/5yLONZvkQ5Kk3qbwiUYkdX17Xa1PT6U1ZWXGGfB1ey5L8dKMlFq2DO0Ag==, + } + dependencies: + d3-time: 2.1.1 + dev: false + + /d3-time/2.1.1: + resolution: + { + integrity: sha512-/eIQe/eR4kCQwq7yxi7z4c6qEXf2IYGcjoWB5OOQy4Tq9Uv39/947qlDcN2TLkiTzQWzvnsuYPB9TrWaNfipKQ==, + } + dependencies: + d3-array: 2.12.1 + dev: false + /damerau-levenshtein/1.0.8: resolution: { @@ -3665,6 +3986,13 @@ packages: side-channel: 1.0.4 dev: true + /internmap/1.0.1: + resolution: + { + integrity: sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==, + } + dev: false + /into-stream/3.1.0: resolution: { integrity: sha1-lvsKk2wSur1v8XUqF9BWFqvQlMY= } engines: { node: ">=4" } @@ -5385,7 +5713,6 @@ packages: loose-envify: 1.4.0 object-assign: 4.1.1 react-is: 16.13.1 - dev: true /proto-list/1.2.4: resolution: { integrity: sha1-IS1b/hMYMGpCD2QCuOJv85ZHqEk= } @@ -5721,6 +6048,13 @@ packages: engines: { node: ">=0.10.0" } dev: true + /resize-observer-polyfill/1.5.1: + resolution: + { + integrity: sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg==, + } + dev: false + /resolve-alpn/1.2.1: resolution: {