merge playground

components/LineGraph.tsx

@@ -4,6 +4,7 @@ import { leftTickLabelProps } from "@visx/axis/lib/axis/AxisLeft";
 import { localPoint } from "@visx/event";
 import { GridColumns, GridRows } from "@visx/grid";
 import { Group } from "@visx/group";
+import { Point } from "@visx/point";
 import { scaleBand, scaleLinear } from "@visx/scale";
 import { LinePath } from "@visx/shape";
 import { useTooltip, useTooltipInPortal } from "@visx/tooltip";
@@ -193,7 +194,7 @@ export function LineGraph(props: LineGraphProps) {
                         // @ts-ignore
                         e.target.ownerSVGElement as Element,
                         e
-                      );
+                      ) as Point;
                       showTooltip({
                         tooltipData: data.lines[i].label,
                         tooltipTop: eventSvgCoords.y,
@@ -219,7 +220,6 @@ export function LineGraph(props: LineGraphProps) {
       {tooltipOpen && (
         <TooltipInPortal
           // set this to random so it correctly updates with parent bounds
-          key={Math.random()}
           top={tooltipTop}
           left={tooltipLeft}
           className={styles.tooltip}

pages/playground.tsx

@@ -2,12 +2,9 @@ import { BarGraphHorizontal, BarGraphVertical } from "components/BarGraph";
 import {
   mockCategoricalData,
   moreMockCategoricalData,
-<<<<<<< HEAD
   mockLineData,
-=======
   mockQuoteData,
   mockQuoteDataLong,
->>>>>>> main
 } from "data/mocks";
 import React from "react";
 
@@ -73,9 +70,8 @@ export default function Home() {
       />
 
       <h2>
-        <code>{"<QuotationCarousel />"}</code>
+        <code>{"<LineGraph />"}</code>
       </h2>
-<<<<<<< HEAD
       <LineGraph
         data={mockLineData}
         width={800}
@@ -87,7 +83,10 @@ export default function Home() {
           right: 20,
         }}
       ></LineGraph>
-=======
+
+      <h2>
+        <code>{"<QuotationCarousel />"}</code>
+      </h2>
       <div className={styles.quotationCarouselDemo}>
         <QuotationCarousel data={mockQuoteData} circleDiameter={0} />
         <QuotationCarousel
@@ -97,7 +96,6 @@ export default function Home() {
           circleDiameter={180}
         />
       </div>
->>>>>>> main
     </div>
   );
 }