graphics-debug 0.0.17 → 0.0.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/lib/react.js +215 -35
- package/dist/lib/react.js.map +1 -1
- package/package.json +1 -1
package/dist/lib/react.js
CHANGED
|
@@ -1,10 +1,6 @@
|
|
|
1
1
|
// site/components/InteractiveGraphics/InteractiveGraphics.tsx
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
scale,
|
|
5
|
-
translate
|
|
6
|
-
} from "transformation-matrix";
|
|
7
|
-
import { useMemo, useState as useState5 } from "react";
|
|
2
|
+
import { compose, scale, translate } from "transformation-matrix";
|
|
3
|
+
import { useMemo as useMemo7, useState as useState5 } from "react";
|
|
8
4
|
import useMouseMatrixTransform from "use-mouse-matrix-transform";
|
|
9
5
|
import { SuperGrid } from "react-supergrid";
|
|
10
6
|
import useResizeObserver from "@react-hook/resize-observer";
|
|
@@ -396,6 +392,152 @@ var getGraphicsBounds = (graphics) => {
|
|
|
396
392
|
return bounds;
|
|
397
393
|
};
|
|
398
394
|
|
|
395
|
+
// site/components/InteractiveGraphics/hooks/useIsPointOnScreen.ts
|
|
396
|
+
import { applyToPoint as applyToPoint6 } from "transformation-matrix";
|
|
397
|
+
import { useMemo as useMemo2 } from "react";
|
|
398
|
+
|
|
399
|
+
// site/components/InteractiveGraphics/hooks/useDoesLineIntersectViewport.ts
|
|
400
|
+
import { applyToPoint as applyToPoint5 } from "transformation-matrix";
|
|
401
|
+
import { useMemo } from "react";
|
|
402
|
+
var OFFSCREEN_MARGIN = 5;
|
|
403
|
+
var useDoesLineIntersectViewport = (realToScreen, size) => {
|
|
404
|
+
return useMemo(() => {
|
|
405
|
+
return (p1, p2) => {
|
|
406
|
+
const sp1 = applyToPoint5(realToScreen, p1);
|
|
407
|
+
const sp2 = applyToPoint5(realToScreen, p2);
|
|
408
|
+
const left = -OFFSCREEN_MARGIN;
|
|
409
|
+
const right = size.width + OFFSCREEN_MARGIN;
|
|
410
|
+
const top = -OFFSCREEN_MARGIN;
|
|
411
|
+
const bottom = size.height + OFFSCREEN_MARGIN;
|
|
412
|
+
if (sp1.x >= left && sp1.x <= right && sp1.y >= top && sp1.y <= bottom || sp2.x >= left && sp2.x <= right && sp2.y >= top && sp2.y <= bottom) {
|
|
413
|
+
return true;
|
|
414
|
+
}
|
|
415
|
+
const intersects = (a1, a2, b1, b2) => {
|
|
416
|
+
const det = (a2.x - a1.x) * (b2.y - b1.y) - (a2.y - a1.y) * (b2.x - b1.x);
|
|
417
|
+
if (det === 0) return false;
|
|
418
|
+
const lambda = ((b2.y - b1.y) * (b2.x - a1.x) + (b1.x - b2.x) * (b2.y - a1.y)) / det;
|
|
419
|
+
const gamma = ((a1.y - a2.y) * (b2.x - a1.x) + (a2.x - a1.x) * (b2.y - a1.y)) / det;
|
|
420
|
+
return lambda >= 0 && lambda <= 1 && gamma >= 0 && gamma <= 1;
|
|
421
|
+
};
|
|
422
|
+
return (
|
|
423
|
+
// Top edge
|
|
424
|
+
intersects(sp1, sp2, { x: left, y: top }, { x: right, y: top }) || // Right edge
|
|
425
|
+
intersects(sp1, sp2, { x: right, y: top }, { x: right, y: bottom }) || // Bottom edge
|
|
426
|
+
intersects(sp1, sp2, { x: left, y: bottom }, { x: right, y: bottom }) || // Left edge
|
|
427
|
+
intersects(sp1, sp2, { x: left, y: top }, { x: left, y: bottom })
|
|
428
|
+
);
|
|
429
|
+
};
|
|
430
|
+
}, [realToScreen, size]);
|
|
431
|
+
};
|
|
432
|
+
|
|
433
|
+
// site/components/InteractiveGraphics/hooks/useIsPointOnScreen.ts
|
|
434
|
+
var useIsPointOnScreen = (realToScreen, size) => {
|
|
435
|
+
return useMemo2(() => {
|
|
436
|
+
return (point) => {
|
|
437
|
+
const screenPoint = applyToPoint6(realToScreen, point);
|
|
438
|
+
return screenPoint.x >= -OFFSCREEN_MARGIN && screenPoint.x <= size.width + OFFSCREEN_MARGIN && screenPoint.y >= -OFFSCREEN_MARGIN && screenPoint.y <= size.height + OFFSCREEN_MARGIN;
|
|
439
|
+
};
|
|
440
|
+
}, [realToScreen, size]);
|
|
441
|
+
};
|
|
442
|
+
|
|
443
|
+
// site/components/InteractiveGraphics/hooks/useFilterLines.ts
|
|
444
|
+
import { useMemo as useMemo3 } from "react";
|
|
445
|
+
var useFilterLines = (isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep) => {
|
|
446
|
+
return useMemo3(() => {
|
|
447
|
+
return (line) => {
|
|
448
|
+
if (!filterLayerAndStep(line)) return false;
|
|
449
|
+
if (line.points.some((p) => isPointOnScreen(p))) {
|
|
450
|
+
return true;
|
|
451
|
+
}
|
|
452
|
+
for (let i = 0; i < line.points.length - 1; i++) {
|
|
453
|
+
if (doesLineIntersectViewport(line.points[i], line.points[i + 1])) {
|
|
454
|
+
return true;
|
|
455
|
+
}
|
|
456
|
+
}
|
|
457
|
+
if (line.points.length > 2 && line.closed) {
|
|
458
|
+
if (doesLineIntersectViewport(
|
|
459
|
+
line.points[line.points.length - 1],
|
|
460
|
+
line.points[0]
|
|
461
|
+
)) {
|
|
462
|
+
return true;
|
|
463
|
+
}
|
|
464
|
+
}
|
|
465
|
+
return false;
|
|
466
|
+
};
|
|
467
|
+
}, [isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep]);
|
|
468
|
+
};
|
|
469
|
+
|
|
470
|
+
// site/components/InteractiveGraphics/hooks/useFilterPoints.ts
|
|
471
|
+
import { useMemo as useMemo4 } from "react";
|
|
472
|
+
var useFilterPoints = (isPointOnScreen, filterLayerAndStep) => {
|
|
473
|
+
return useMemo4(() => {
|
|
474
|
+
return (point) => {
|
|
475
|
+
if (!filterLayerAndStep(point)) return false;
|
|
476
|
+
return isPointOnScreen(point);
|
|
477
|
+
};
|
|
478
|
+
}, [isPointOnScreen, filterLayerAndStep]);
|
|
479
|
+
};
|
|
480
|
+
|
|
481
|
+
// site/components/InteractiveGraphics/hooks/useFilterRects.ts
|
|
482
|
+
import { useMemo as useMemo5 } from "react";
|
|
483
|
+
var useFilterRects = (isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep) => {
|
|
484
|
+
return useMemo5(() => {
|
|
485
|
+
return (rect) => {
|
|
486
|
+
if (!filterLayerAndStep(rect)) return false;
|
|
487
|
+
const { center, width, height } = rect;
|
|
488
|
+
const halfWidth = width / 2;
|
|
489
|
+
const halfHeight = height / 2;
|
|
490
|
+
const topLeft = { x: center.x - halfWidth, y: center.y - halfHeight };
|
|
491
|
+
const topRight = { x: center.x + halfWidth, y: center.y - halfHeight };
|
|
492
|
+
const bottomLeft = { x: center.x - halfWidth, y: center.y + halfHeight };
|
|
493
|
+
const bottomRight = { x: center.x + halfWidth, y: center.y + halfHeight };
|
|
494
|
+
if (isPointOnScreen(center) || isPointOnScreen(topLeft) || isPointOnScreen(topRight) || isPointOnScreen(bottomLeft) || isPointOnScreen(bottomRight)) {
|
|
495
|
+
return true;
|
|
496
|
+
}
|
|
497
|
+
return doesLineIntersectViewport(topLeft, topRight) || doesLineIntersectViewport(topRight, bottomRight) || doesLineIntersectViewport(bottomRight, bottomLeft) || doesLineIntersectViewport(bottomLeft, topLeft);
|
|
498
|
+
};
|
|
499
|
+
}, [isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep]);
|
|
500
|
+
};
|
|
501
|
+
|
|
502
|
+
// site/components/InteractiveGraphics/hooks/useFilterCircles.ts
|
|
503
|
+
import { applyToPoint as applyToPoint7 } from "transformation-matrix";
|
|
504
|
+
import { useMemo as useMemo6 } from "react";
|
|
505
|
+
var useFilterCircles = (isPointOnScreen, filterLayerAndStep, realToScreen, size) => {
|
|
506
|
+
return useMemo6(() => {
|
|
507
|
+
return (circle) => {
|
|
508
|
+
if (!filterLayerAndStep(circle)) return false;
|
|
509
|
+
const { center, radius } = circle;
|
|
510
|
+
if (isPointOnScreen(center) || isPointOnScreen({ x: center.x + radius, y: center.y }) || isPointOnScreen({ x: center.x - radius, y: center.y }) || isPointOnScreen({ x: center.x, y: center.y + radius }) || isPointOnScreen({ x: center.x, y: center.y - radius })) {
|
|
511
|
+
return true;
|
|
512
|
+
}
|
|
513
|
+
const screenCenter = applyToPoint7(realToScreen, center);
|
|
514
|
+
const scale2 = Math.abs(realToScreen.a);
|
|
515
|
+
const screenRadius = radius * scale2;
|
|
516
|
+
const left = -OFFSCREEN_MARGIN;
|
|
517
|
+
const right = size.width + OFFSCREEN_MARGIN;
|
|
518
|
+
const top = -OFFSCREEN_MARGIN;
|
|
519
|
+
const bottom = size.height + OFFSCREEN_MARGIN;
|
|
520
|
+
if (screenCenter.x >= left && screenCenter.x <= right) {
|
|
521
|
+
if (Math.abs(screenCenter.y - top) <= screenRadius || Math.abs(screenCenter.y - bottom) <= screenRadius) {
|
|
522
|
+
return true;
|
|
523
|
+
}
|
|
524
|
+
}
|
|
525
|
+
if (screenCenter.y >= top && screenCenter.y <= bottom) {
|
|
526
|
+
if (Math.abs(screenCenter.x - left) <= screenRadius || Math.abs(screenCenter.x - right) <= screenRadius) {
|
|
527
|
+
return true;
|
|
528
|
+
}
|
|
529
|
+
}
|
|
530
|
+
const cornerDistanceSquared = (cornerX, cornerY) => {
|
|
531
|
+
const dx = screenCenter.x - cornerX;
|
|
532
|
+
const dy = screenCenter.y - cornerY;
|
|
533
|
+
return dx * dx + dy * dy;
|
|
534
|
+
};
|
|
535
|
+
const radiusSquared = screenRadius * screenRadius;
|
|
536
|
+
return cornerDistanceSquared(left, top) <= radiusSquared || cornerDistanceSquared(right, top) <= radiusSquared || cornerDistanceSquared(left, bottom) <= radiusSquared || cornerDistanceSquared(right, bottom) <= radiusSquared;
|
|
537
|
+
};
|
|
538
|
+
}, [isPointOnScreen, filterLayerAndStep, realToScreen, size]);
|
|
539
|
+
};
|
|
540
|
+
|
|
399
541
|
// site/components/InteractiveGraphics/InteractiveGraphics.tsx
|
|
400
542
|
import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
401
543
|
var InteractiveGraphics = ({
|
|
@@ -417,7 +559,7 @@ var InteractiveGraphics = ({
|
|
|
417
559
|
...graphics.rects?.map((r) => r.step).filter(Boolean) ?? [],
|
|
418
560
|
...graphics.points?.map((p) => p.step).filter(Boolean) ?? []
|
|
419
561
|
);
|
|
420
|
-
const graphicsBoundsWithPadding =
|
|
562
|
+
const graphicsBoundsWithPadding = useMemo7(() => {
|
|
421
563
|
const actualBounds = getGraphicsBounds(graphics);
|
|
422
564
|
const width = actualBounds.maxX - actualBounds.minX;
|
|
423
565
|
const height = actualBounds.maxY - actualBounds.minY;
|
|
@@ -459,6 +601,11 @@ var InteractiveGraphics = ({
|
|
|
459
601
|
realToScreen
|
|
460
602
|
};
|
|
461
603
|
const showToolbar = availableLayers.length > 1 || maxStep > 0;
|
|
604
|
+
const isPointOnScreen = useIsPointOnScreen(realToScreen, size);
|
|
605
|
+
const doesLineIntersectViewport = useDoesLineIntersectViewport(
|
|
606
|
+
realToScreen,
|
|
607
|
+
size
|
|
608
|
+
);
|
|
462
609
|
const filterLayerAndStep = (obj) => {
|
|
463
610
|
if (activeLayers && obj.layer && !activeLayers.includes(obj.layer))
|
|
464
611
|
return false;
|
|
@@ -466,6 +613,23 @@ var InteractiveGraphics = ({
|
|
|
466
613
|
return false;
|
|
467
614
|
return true;
|
|
468
615
|
};
|
|
616
|
+
const filterLines = useFilterLines(
|
|
617
|
+
isPointOnScreen,
|
|
618
|
+
doesLineIntersectViewport,
|
|
619
|
+
filterLayerAndStep
|
|
620
|
+
);
|
|
621
|
+
const filterPoints = useFilterPoints(isPointOnScreen, filterLayerAndStep);
|
|
622
|
+
const filterRects = useFilterRects(
|
|
623
|
+
isPointOnScreen,
|
|
624
|
+
doesLineIntersectViewport,
|
|
625
|
+
filterLayerAndStep
|
|
626
|
+
);
|
|
627
|
+
const filterCircles = useFilterCircles(
|
|
628
|
+
isPointOnScreen,
|
|
629
|
+
filterLayerAndStep,
|
|
630
|
+
realToScreen,
|
|
631
|
+
size
|
|
632
|
+
);
|
|
469
633
|
return /* @__PURE__ */ jsxs2("div", { children: [
|
|
470
634
|
showToolbar && /* @__PURE__ */ jsxs2("div", { style: { margin: 8 }, children: [
|
|
471
635
|
availableLayers.length > 1 && /* @__PURE__ */ jsxs2(
|
|
@@ -531,34 +695,50 @@ var InteractiveGraphics = ({
|
|
|
531
695
|
overflow: "hidden"
|
|
532
696
|
},
|
|
533
697
|
children: [
|
|
534
|
-
graphics.lines?.
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
698
|
+
graphics.lines?.map(
|
|
699
|
+
(l, originalIndex) => filterLines(l) ? /* @__PURE__ */ jsx6(
|
|
700
|
+
Line,
|
|
701
|
+
{
|
|
702
|
+
line: l,
|
|
703
|
+
index: originalIndex,
|
|
704
|
+
interactiveState
|
|
705
|
+
},
|
|
706
|
+
originalIndex
|
|
707
|
+
) : null
|
|
708
|
+
),
|
|
709
|
+
graphics.rects?.map(
|
|
710
|
+
(r, originalIndex) => filterRects(r) ? /* @__PURE__ */ jsx6(
|
|
711
|
+
Rect,
|
|
712
|
+
{
|
|
713
|
+
rect: r,
|
|
714
|
+
index: originalIndex,
|
|
715
|
+
interactiveState
|
|
716
|
+
},
|
|
717
|
+
originalIndex
|
|
718
|
+
) : null
|
|
719
|
+
),
|
|
720
|
+
graphics.points?.map(
|
|
721
|
+
(p, originalIndex) => filterPoints(p) ? /* @__PURE__ */ jsx6(
|
|
722
|
+
Point,
|
|
723
|
+
{
|
|
724
|
+
point: p,
|
|
725
|
+
index: originalIndex,
|
|
726
|
+
interactiveState
|
|
727
|
+
},
|
|
728
|
+
originalIndex
|
|
729
|
+
) : null
|
|
730
|
+
),
|
|
731
|
+
graphics.circles?.map(
|
|
732
|
+
(c, originalIndex) => filterCircles(c) ? /* @__PURE__ */ jsx6(
|
|
733
|
+
Circle,
|
|
734
|
+
{
|
|
735
|
+
circle: c,
|
|
736
|
+
index: originalIndex,
|
|
737
|
+
interactiveState
|
|
738
|
+
},
|
|
739
|
+
originalIndex
|
|
740
|
+
) : null
|
|
741
|
+
),
|
|
562
742
|
/* @__PURE__ */ jsx6(
|
|
563
743
|
SuperGrid,
|
|
564
744
|
{
|
package/dist/lib/react.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../site/components/InteractiveGraphics/InteractiveGraphics.tsx","../../site/components/InteractiveGraphics/Line.tsx","../../site/components/InteractiveGraphics/Tooltip.tsx","../../site/utils/distToLineSegment.ts","../../site/components/InteractiveGraphics/defaultColors.ts","../../site/utils/safeLighten.ts","../../site/components/InteractiveGraphics/Point.tsx","../../site/components/InteractiveGraphics/Rect.tsx","../../site/components/InteractiveGraphics/Circle.tsx","../../site/utils/getGraphicsBounds.ts"],"sourcesContent":["import {\n compose,\n type Matrix,\n applyToPoint,\n scale,\n translate,\n} from \"transformation-matrix\"\nimport { GraphicsObject } from \"../../../lib\"\nimport { useMemo, useState } from \"react\"\nimport useMouseMatrixTransform from \"use-mouse-matrix-transform\"\nimport { InteractiveState } from \"./InteractiveState\"\nimport { SuperGrid } from \"react-supergrid\"\nimport useResizeObserver from \"@react-hook/resize-observer\"\nimport { Line } from \"./Line\"\nimport { Point } from \"./Point\"\nimport { Rect } from \"./Rect\"\nimport { Circle } from \"./Circle\"\nimport { getGraphicsBounds } from \"site/utils/getGraphicsBounds\"\n\nexport const InteractiveGraphics = ({\n graphics,\n}: { graphics: GraphicsObject }) => {\n const [activeLayers, setActiveLayers] = useState<string[] | null>(null)\n const [activeStep, setActiveStep] = useState<number | null>(null)\n const [size, setSize] = useState({ width: 600, height: 600 })\n const availableLayers: string[] = Array.from(\n new Set([\n ...(graphics.lines?.map((l) => l.layer!).filter(Boolean) ?? []),\n ...(graphics.rects?.map((r) => r.layer!).filter(Boolean) ?? []),\n ...(graphics.points?.map((p) => p.layer!).filter(Boolean) ?? []),\n ]),\n )\n const maxStep = Math.max(\n 0,\n ...(graphics.lines?.map((l) => l.step!).filter(Boolean) ?? []),\n ...(graphics.rects?.map((r) => r.step!).filter(Boolean) ?? []),\n ...(graphics.points?.map((p) => p.step!).filter(Boolean) ?? []),\n )\n\n const graphicsBoundsWithPadding = useMemo(() => {\n const actualBounds = getGraphicsBounds(graphics)\n const width = actualBounds.maxX - actualBounds.minX\n const height = actualBounds.maxY - actualBounds.minY\n return {\n minX: actualBounds.minX - width / 10,\n minY: actualBounds.minY - height / 10,\n maxX: actualBounds.maxX + width / 10,\n maxY: actualBounds.maxY + height / 10,\n }\n }, [graphics])\n\n const { transform: realToScreen, ref } = useMouseMatrixTransform({\n initialTransform: compose(\n translate(size.width / 2, size.height / 2),\n scale(\n Math.min(\n size.width /\n (graphicsBoundsWithPadding.maxX - graphicsBoundsWithPadding.minX),\n size.height /\n (graphicsBoundsWithPadding.maxY - graphicsBoundsWithPadding.minY),\n ),\n -Math.min(\n size.width /\n (graphicsBoundsWithPadding.maxX - graphicsBoundsWithPadding.minX),\n size.height /\n (graphicsBoundsWithPadding.maxY - graphicsBoundsWithPadding.minY),\n ),\n ),\n translate(\n -(graphicsBoundsWithPadding.maxX + graphicsBoundsWithPadding.minX) / 2,\n -(graphicsBoundsWithPadding.maxY + graphicsBoundsWithPadding.minY) / 2,\n ),\n ),\n })\n\n useResizeObserver(ref, (entry: ResizeObserverEntry) => {\n setSize({\n width: entry.contentRect.width,\n height: entry.contentRect.height,\n })\n })\n\n const interactiveState: InteractiveState = {\n activeLayers: activeLayers,\n activeStep: activeStep,\n realToScreen: realToScreen,\n }\n\n const showToolbar = availableLayers.length > 1 || maxStep > 0\n\n const filterLayerAndStep = (obj: { layer?: string; step?: number }) => {\n if (activeLayers && obj.layer && !activeLayers.includes(obj.layer))\n return false\n if (\n activeStep !== null &&\n obj.step !== undefined &&\n obj.step !== activeStep\n )\n return false\n return true\n }\n\n return (\n <div>\n {showToolbar && (\n <div style={{ margin: 8 }}>\n {availableLayers.length > 1 && (\n <select\n value={activeLayers ? activeLayers[0] : \"\"}\n onChange={(e) => {\n const value = e.target.value\n setActiveLayers(value === \"\" ? null : [value])\n }}\n style={{ marginRight: 8 }}\n >\n <option value=\"\">All Layers</option>\n {availableLayers.map((layer) => (\n <option key={layer} value={layer}>\n {layer}\n </option>\n ))}\n </select>\n )}\n\n {maxStep > 0 && (\n <div\n style={{ display: \"inline-flex\", alignItems: \"center\", gap: 8 }}\n >\n Step:\n <input\n type=\"number\"\n min={0}\n max={maxStep}\n value={activeStep ?? 0}\n onChange={(e) => {\n const value = parseInt(e.target.value)\n setActiveStep(Number.isNaN(value) ? null : value)\n }}\n disabled={activeStep === null}\n />\n <label>\n <input\n type=\"checkbox\"\n style={{ marginRight: 4 }}\n checked={activeStep !== null}\n onChange={(e) => {\n setActiveStep(e.target.checked ? 0 : null)\n }}\n />\n Filter by step\n </label>\n </div>\n )}\n </div>\n )}\n\n <div\n ref={ref}\n style={{\n position: \"relative\",\n height: 600,\n overflow: \"hidden\",\n }}\n >\n {graphics.lines?.filter(filterLayerAndStep)?.map((l, i) => (\n <Line\n key={i}\n line={l}\n index={i}\n interactiveState={interactiveState}\n />\n ))}\n {graphics.rects?.filter(filterLayerAndStep)?.map((r, i) => (\n <Rect\n key={i}\n rect={r}\n index={i}\n interactiveState={interactiveState}\n />\n ))}\n {graphics.points?.filter(filterLayerAndStep)?.map((p, i) => (\n <Point\n key={i}\n point={p}\n index={i}\n interactiveState={interactiveState}\n />\n ))}\n {graphics.circles?.filter(filterLayerAndStep)?.map((c, i) => (\n <Circle key={i} circle={c} index={i} interactiveState={interactiveState} />\n ))}\n <SuperGrid\n stringifyCoord={(x, y) => `${x.toFixed(2)}, ${y.toFixed(2)}`}\n width={size.width}\n height={size.height}\n transform={realToScreen}\n />\n </div>\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { lighten } from \"polished\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { distToLineSegment } from \"site/utils/distToLineSegment\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Line = ({\n line,\n index,\n interactiveState,\n}: { line: Types.Line; index: number; interactiveState: InteractiveState }) => {\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const {\n points,\n layer,\n step,\n strokeColor,\n strokeWidth = 1 / realToScreen.a,\n strokeDash,\n } = line\n const [isHovered, setIsHovered] = useState(false)\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 })\n\n const screenPoints = points.map((p) => applyToPoint(realToScreen, p))\n\n const handleMouseMove = (e: React.MouseEvent) => {\n const rect = e.currentTarget.getBoundingClientRect()\n const mouseX = e.clientX - rect.left\n const mouseY = e.clientY - rect.top\n const hoverThreshold = 10 // pixels\n\n setMousePos({ x: mouseX, y: mouseY })\n\n // Check distance to each line segment\n let isNearLine = false\n for (let i = 0; i < screenPoints.length - 1; i++) {\n const dist = distToLineSegment(\n mouseX,\n mouseY,\n screenPoints[i].x,\n screenPoints[i].y,\n screenPoints[i + 1].x,\n screenPoints[i + 1].y,\n )\n if (dist < hoverThreshold) {\n isNearLine = true\n break\n }\n }\n\n setIsHovered(isNearLine)\n }\n\n const baseColor = strokeColor ?? defaultColors[index % defaultColors.length]\n\n return (\n <svg\n style={{\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n }}\n onMouseMove={handleMouseMove}\n onMouseLeave={() => setIsHovered(false)}\n >\n <polyline\n points={screenPoints.map((p) => `${p.x},${p.y}`).join(\" \")}\n stroke={isHovered ? safeLighten(0.2, baseColor) : baseColor}\n fill=\"none\"\n strokeWidth={strokeWidth * realToScreen.a}\n strokeDasharray={strokeDash}\n strokeLinecap=\"round\"\n />\n {isHovered && line.label && (\n <foreignObject\n x={mousePos.x}\n y={mousePos.y - 40}\n width={300}\n height={40}\n >\n <Tooltip text={line.label} />\n </foreignObject>\n )}\n </svg>\n )\n}\n","export const Tooltip = ({ text }: { text: string }) => {\n return (\n <div\n style={{\n background: \"white\",\n border: \"1px solid #ccc\",\n boxShadow: \"0 0 10px 0 rgba(0, 0, 0, 0.1)\",\n borderRadius: \"4px\",\n padding: \"4px 8px\",\n fontSize: \"12px\",\n minWidth: \"150px\",\n maxWidth: \"300px\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"pre-wrap\",\n zIndex: 100,\n }}\n >\n {text}\n </div>\n )\n}\n","// Calculate distance from point to line segment\nexport const distToLineSegment = (\n px: number,\n py: number,\n x1: number,\n y1: number,\n x2: number,\n y2: number,\n) => {\n const A = px - x1\n const B = py - y1\n const C = x2 - x1\n const D = y2 - y1\n\n const dot = A * C + B * D\n const lenSq = C * C + D * D\n let param = -1\n\n if (lenSq !== 0) param = dot / lenSq\n\n let xx = 0\n let yy = 0\n\n if (param < 0) {\n xx = x1\n yy = y1\n } else if (param > 1) {\n xx = x2\n yy = y2\n } else {\n xx = x1 + param * C\n yy = y1 + param * D\n }\n\n const dx = px - xx\n const dy = py - yy\n return Math.sqrt(dx * dx + dy * dy)\n}\n","// These are default colors if no color is provided\n// colors are made based on the index of the item in the array\n\nexport const defaultColors = [\n \"rgba(239, 68, 68, 0.8)\", // red-300\n \"rgba(249, 115, 22, 0.8)\", // orange-300\n \"rgba(245, 158, 11, 0.8)\", // amber-300\n \"rgba(234, 179, 8, 0.8)\", // yellow-300\n \"rgba(132, 204, 22, 0.8)\", // lime-300\n \"rgba(34, 197, 94, 0.8)\", // green-300\n \"rgba(16, 185, 129, 0.8)\", // emerald-300\n \"rgba(20, 184, 166, 0.8)\", // teal-300\n \"rgba(6, 182, 212, 0.8)\", // cyan-300\n \"rgba(14, 165, 233, 0.8)\", // sky-300\n \"rgba(59, 130, 246, 0.8)\", // blue-300\n \"rgba(99, 102, 241, 0.8)\", // indigo-300\n \"rgba(139, 92, 246, 0.8)\", // violet-300\n \"rgba(168, 85, 247, 0.8)\", // purple-300\n \"rgba(217, 70, 239, 0.8)\", // fuchsia-300\n \"rgba(236, 72, 153, 0.8)\", // pink-300\n \"rgba(249, 168, 212, 0.8)\", // rose-300\n \"rgba(161, 161, 170, 0.8)\", // zinc-300\n]\n","import { lighten } from \"polished\"\n\nexport const safeLighten = (amount: number, color: string) => {\n try {\n return lighten(amount, color)\n } catch (e) {\n return color\n }\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Point = ({\n point,\n interactiveState,\n index,\n}: {\n point: Types.Point\n interactiveState: InteractiveState\n index: number\n}) => {\n const { color, label, layer, step } = point\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n\n const screenPoint = applyToPoint(realToScreen, point)\n const size = 10\n\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenPoint.x - size / 2,\n top: screenPoint.y - size / 2,\n width: size,\n height: size,\n borderRadius: \"50%\",\n border: `2px solid ${\n isHovered\n ? safeLighten(\n 0.2,\n color ?? defaultColors[index % defaultColors.length],\n )\n : (color ?? defaultColors[index % defaultColors.length])\n }`,\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip\n text={`${label ? `${label}\\n` : \"\"}x: ${point.x.toFixed(2)}, y: ${point.y.toFixed(2)}`}\n />\n </div>\n )}\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { lighten } from \"polished\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Rect = ({\n rect,\n interactiveState,\n index,\n}: {\n rect: Types.Rect\n interactiveState: InteractiveState\n index: number\n}) => {\n const defaultColor = defaultColors[index % defaultColors.length]\n let { center, width, height, fill, stroke, layer, step } = rect\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n\n const screenCenter = applyToPoint(realToScreen, center)\n const screenWidth = width * realToScreen.a\n const screenHeight = height * Math.abs(realToScreen.d)\n\n // Default style when neither fill nor stroke is specified\n const hasStrokeOrFill = fill !== undefined || stroke !== undefined\n\n let backgroundColor = hasStrokeOrFill ? fill || \"transparent\" : defaultColor\n if (isHovered) {\n backgroundColor = safeLighten(0.2, backgroundColor)\n stroke = safeLighten(0.2, stroke!)\n }\n\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenCenter.x - screenWidth / 2,\n top: screenCenter.y - screenHeight / 2,\n width: screenWidth,\n height: screenHeight,\n backgroundColor,\n border: stroke\n ? `2px solid ${isHovered ? safeLighten(0.2, stroke) : stroke}`\n : \"none\",\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && rect.label && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip text={rect.label} />\n </div>\n )}\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Circle = ({\n circle,\n interactiveState,\n index,\n}: {\n circle: Types.Circle\n interactiveState: InteractiveState\n index: number\n}) => {\n const defaultColor = defaultColors[index % defaultColors.length]\n let { center, radius, fill, stroke, layer, step, label } = circle\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n const screenCenter = applyToPoint(realToScreen, center)\n const screenRadius = radius * realToScreen.a\n let backgroundColor = fill || defaultColor\n if (isHovered) {\n backgroundColor = safeLighten(0.2, backgroundColor)\n stroke = stroke ? safeLighten(0.2, stroke) : stroke\n }\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenCenter.x - screenRadius,\n top: screenCenter.y - screenRadius,\n width: screenRadius * 2,\n height: screenRadius * 2,\n borderRadius: \"50%\",\n backgroundColor,\n border: stroke ? `2px solid ${stroke}` : \"none\",\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && label && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip text={label} />\n </div>\n )}\n </div>\n )\n}\n","import { GraphicsObject } from \"lib/types\"\n\nexport const getGraphicsBounds = (graphics: GraphicsObject) => {\n const bounds = {\n minX: Infinity,\n minY: Infinity,\n maxX: -Infinity,\n maxY: -Infinity,\n }\n for (const line of graphics.lines ?? []) {\n for (const point of line.points ?? []) {\n bounds.minX = Math.min(bounds.minX, point.x)\n bounds.minY = Math.min(bounds.minY, point.y)\n bounds.maxX = Math.max(bounds.maxX, point.x)\n bounds.maxY = Math.max(bounds.maxY, point.y)\n }\n }\n for (const rect of graphics.rects ?? []) {\n const { center, width, height } = rect\n const halfWidth = width / 2\n const halfHeight = height / 2\n bounds.minX = Math.min(bounds.minX, center.x - halfWidth)\n bounds.minY = Math.min(bounds.minY, center.y - halfHeight)\n bounds.maxX = Math.max(bounds.maxX, center.x + halfWidth)\n bounds.maxY = Math.max(bounds.maxY, center.y + halfHeight)\n }\n for (const point of graphics.points ?? []) {\n bounds.minX = Math.min(bounds.minX, point.x)\n bounds.minY = Math.min(bounds.minY, point.y)\n bounds.maxX = Math.max(bounds.maxX, point.x)\n bounds.maxY = Math.max(bounds.maxY, point.y)\n }\n return bounds\n}\n"],"mappings":"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","names":["useState","jsx","applyToPoint","useState","jsx","useState","applyToPoint","applyToPoint","useState","jsx","useState","applyToPoint","applyToPoint","useState","jsx","useState","applyToPoint","jsx","jsxs","useState"]}
|
|
1
|
+
{"version":3,"sources":["../../site/components/InteractiveGraphics/InteractiveGraphics.tsx","../../site/components/InteractiveGraphics/Line.tsx","../../site/components/InteractiveGraphics/Tooltip.tsx","../../site/utils/distToLineSegment.ts","../../site/components/InteractiveGraphics/defaultColors.ts","../../site/utils/safeLighten.ts","../../site/components/InteractiveGraphics/Point.tsx","../../site/components/InteractiveGraphics/Rect.tsx","../../site/components/InteractiveGraphics/Circle.tsx","../../site/utils/getGraphicsBounds.ts","../../site/components/InteractiveGraphics/hooks/useIsPointOnScreen.ts","../../site/components/InteractiveGraphics/hooks/useDoesLineIntersectViewport.ts","../../site/components/InteractiveGraphics/hooks/useFilterLines.ts","../../site/components/InteractiveGraphics/hooks/useFilterPoints.ts","../../site/components/InteractiveGraphics/hooks/useFilterRects.ts","../../site/components/InteractiveGraphics/hooks/useFilterCircles.ts"],"sourcesContent":["import { compose, scale, translate } from \"transformation-matrix\"\nimport { GraphicsObject } from \"../../../lib\"\nimport { useMemo, useState } from \"react\"\nimport useMouseMatrixTransform from \"use-mouse-matrix-transform\"\nimport { InteractiveState } from \"./InteractiveState\"\nimport { SuperGrid } from \"react-supergrid\"\nimport useResizeObserver from \"@react-hook/resize-observer\"\nimport { Line } from \"./Line\"\nimport { Point } from \"./Point\"\nimport { Rect } from \"./Rect\"\nimport { Circle } from \"./Circle\"\nimport { getGraphicsBounds } from \"site/utils/getGraphicsBounds\"\nimport {\n useIsPointOnScreen,\n useDoesLineIntersectViewport,\n useFilterLines,\n useFilterPoints,\n useFilterRects,\n useFilterCircles,\n} from \"./hooks\"\n\nexport const InteractiveGraphics = ({\n graphics,\n}: { graphics: GraphicsObject }) => {\n const [activeLayers, setActiveLayers] = useState<string[] | null>(null)\n const [activeStep, setActiveStep] = useState<number | null>(null)\n const [size, setSize] = useState({ width: 600, height: 600 })\n const availableLayers: string[] = Array.from(\n new Set([\n ...(graphics.lines?.map((l) => l.layer!).filter(Boolean) ?? []),\n ...(graphics.rects?.map((r) => r.layer!).filter(Boolean) ?? []),\n ...(graphics.points?.map((p) => p.layer!).filter(Boolean) ?? []),\n ]),\n )\n const maxStep = Math.max(\n 0,\n ...(graphics.lines?.map((l) => l.step!).filter(Boolean) ?? []),\n ...(graphics.rects?.map((r) => r.step!).filter(Boolean) ?? []),\n ...(graphics.points?.map((p) => p.step!).filter(Boolean) ?? []),\n )\n\n const graphicsBoundsWithPadding = useMemo(() => {\n const actualBounds = getGraphicsBounds(graphics)\n const width = actualBounds.maxX - actualBounds.minX\n const height = actualBounds.maxY - actualBounds.minY\n return {\n minX: actualBounds.minX - width / 10,\n minY: actualBounds.minY - height / 10,\n maxX: actualBounds.maxX + width / 10,\n maxY: actualBounds.maxY + height / 10,\n }\n }, [graphics])\n\n const { transform: realToScreen, ref } = useMouseMatrixTransform({\n initialTransform: compose(\n translate(size.width / 2, size.height / 2),\n scale(\n Math.min(\n size.width /\n (graphicsBoundsWithPadding.maxX - graphicsBoundsWithPadding.minX),\n size.height /\n (graphicsBoundsWithPadding.maxY - graphicsBoundsWithPadding.minY),\n ),\n -Math.min(\n size.width /\n (graphicsBoundsWithPadding.maxX - graphicsBoundsWithPadding.minX),\n size.height /\n (graphicsBoundsWithPadding.maxY - graphicsBoundsWithPadding.minY),\n ),\n ),\n translate(\n -(graphicsBoundsWithPadding.maxX + graphicsBoundsWithPadding.minX) / 2,\n -(graphicsBoundsWithPadding.maxY + graphicsBoundsWithPadding.minY) / 2,\n ),\n ),\n })\n\n useResizeObserver(ref, (entry: ResizeObserverEntry) => {\n setSize({\n width: entry.contentRect.width,\n height: entry.contentRect.height,\n })\n })\n\n const interactiveState: InteractiveState = {\n activeLayers: activeLayers,\n activeStep: activeStep,\n realToScreen: realToScreen,\n }\n\n const showToolbar = availableLayers.length > 1 || maxStep > 0\n\n // Use custom hooks for visibility checks and filtering\n const isPointOnScreen = useIsPointOnScreen(realToScreen, size)\n\n const doesLineIntersectViewport = useDoesLineIntersectViewport(\n realToScreen,\n size,\n )\n\n // Filter by layer and step\n const filterLayerAndStep = (obj: { layer?: string; step?: number }) => {\n if (activeLayers && obj.layer && !activeLayers.includes(obj.layer))\n return false\n if (\n activeStep !== null &&\n obj.step !== undefined &&\n obj.step !== activeStep\n )\n return false\n return true\n }\n\n const filterLines = useFilterLines(\n isPointOnScreen,\n doesLineIntersectViewport,\n filterLayerAndStep,\n )\n\n const filterPoints = useFilterPoints(isPointOnScreen, filterLayerAndStep)\n\n const filterRects = useFilterRects(\n isPointOnScreen,\n doesLineIntersectViewport,\n filterLayerAndStep,\n )\n\n const filterCircles = useFilterCircles(\n isPointOnScreen,\n filterLayerAndStep,\n realToScreen,\n size,\n )\n\n return (\n <div>\n {showToolbar && (\n <div style={{ margin: 8 }}>\n {availableLayers.length > 1 && (\n <select\n value={activeLayers ? activeLayers[0] : \"\"}\n onChange={(e) => {\n const value = e.target.value\n setActiveLayers(value === \"\" ? null : [value])\n }}\n style={{ marginRight: 8 }}\n >\n <option value=\"\">All Layers</option>\n {availableLayers.map((layer) => (\n <option key={layer} value={layer}>\n {layer}\n </option>\n ))}\n </select>\n )}\n\n {maxStep > 0 && (\n <div\n style={{ display: \"inline-flex\", alignItems: \"center\", gap: 8 }}\n >\n Step:\n <input\n type=\"number\"\n min={0}\n max={maxStep}\n value={activeStep ?? 0}\n onChange={(e) => {\n const value = parseInt(e.target.value)\n setActiveStep(Number.isNaN(value) ? null : value)\n }}\n disabled={activeStep === null}\n />\n <label>\n <input\n type=\"checkbox\"\n style={{ marginRight: 4 }}\n checked={activeStep !== null}\n onChange={(e) => {\n setActiveStep(e.target.checked ? 0 : null)\n }}\n />\n Filter by step\n </label>\n </div>\n )}\n </div>\n )}\n\n <div\n ref={ref}\n style={{\n position: \"relative\",\n height: 600,\n overflow: \"hidden\",\n }}\n >\n {graphics.lines?.map((l, originalIndex) =>\n filterLines(l) ? (\n <Line\n key={originalIndex}\n line={l}\n index={originalIndex}\n interactiveState={interactiveState}\n />\n ) : null,\n )}\n {graphics.rects?.map((r, originalIndex) =>\n filterRects(r) ? (\n <Rect\n key={originalIndex}\n rect={r}\n index={originalIndex}\n interactiveState={interactiveState}\n />\n ) : null,\n )}\n {graphics.points?.map((p, originalIndex) =>\n filterPoints(p) ? (\n <Point\n key={originalIndex}\n point={p}\n index={originalIndex}\n interactiveState={interactiveState}\n />\n ) : null,\n )}\n {graphics.circles?.map((c, originalIndex) =>\n filterCircles(c) ? (\n <Circle\n key={originalIndex}\n circle={c}\n index={originalIndex}\n interactiveState={interactiveState}\n />\n ) : null,\n )}\n <SuperGrid\n stringifyCoord={(x, y) => `${x.toFixed(2)}, ${y.toFixed(2)}`}\n width={size.width}\n height={size.height}\n transform={realToScreen}\n />\n </div>\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { lighten } from \"polished\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { distToLineSegment } from \"site/utils/distToLineSegment\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Line = ({\n line,\n index,\n interactiveState,\n}: { line: Types.Line; index: number; interactiveState: InteractiveState }) => {\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const {\n points,\n layer,\n step,\n strokeColor,\n strokeWidth = 1 / realToScreen.a,\n strokeDash,\n } = line\n const [isHovered, setIsHovered] = useState(false)\n const [mousePos, setMousePos] = useState({ x: 0, y: 0 })\n\n const screenPoints = points.map((p) => applyToPoint(realToScreen, p))\n\n const handleMouseMove = (e: React.MouseEvent) => {\n const rect = e.currentTarget.getBoundingClientRect()\n const mouseX = e.clientX - rect.left\n const mouseY = e.clientY - rect.top\n const hoverThreshold = 10 // pixels\n\n setMousePos({ x: mouseX, y: mouseY })\n\n // Check distance to each line segment\n let isNearLine = false\n for (let i = 0; i < screenPoints.length - 1; i++) {\n const dist = distToLineSegment(\n mouseX,\n mouseY,\n screenPoints[i].x,\n screenPoints[i].y,\n screenPoints[i + 1].x,\n screenPoints[i + 1].y,\n )\n if (dist < hoverThreshold) {\n isNearLine = true\n break\n }\n }\n\n setIsHovered(isNearLine)\n }\n\n const baseColor = strokeColor ?? defaultColors[index % defaultColors.length]\n\n return (\n <svg\n style={{\n position: \"absolute\",\n top: 0,\n left: 0,\n width: \"100%\",\n height: \"100%\",\n }}\n onMouseMove={handleMouseMove}\n onMouseLeave={() => setIsHovered(false)}\n >\n <polyline\n points={screenPoints.map((p) => `${p.x},${p.y}`).join(\" \")}\n stroke={isHovered ? safeLighten(0.2, baseColor) : baseColor}\n fill=\"none\"\n strokeWidth={strokeWidth * realToScreen.a}\n strokeDasharray={strokeDash}\n strokeLinecap=\"round\"\n />\n {isHovered && line.label && (\n <foreignObject\n x={mousePos.x}\n y={mousePos.y - 40}\n width={300}\n height={40}\n >\n <Tooltip text={line.label} />\n </foreignObject>\n )}\n </svg>\n )\n}\n","export const Tooltip = ({ text }: { text: string }) => {\n return (\n <div\n style={{\n background: \"white\",\n border: \"1px solid #ccc\",\n boxShadow: \"0 0 10px 0 rgba(0, 0, 0, 0.1)\",\n borderRadius: \"4px\",\n padding: \"4px 8px\",\n fontSize: \"12px\",\n minWidth: \"150px\",\n maxWidth: \"300px\",\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n whiteSpace: \"pre-wrap\",\n zIndex: 100,\n }}\n >\n {text}\n </div>\n )\n}\n","// Calculate distance from point to line segment\nexport const distToLineSegment = (\n px: number,\n py: number,\n x1: number,\n y1: number,\n x2: number,\n y2: number,\n) => {\n const A = px - x1\n const B = py - y1\n const C = x2 - x1\n const D = y2 - y1\n\n const dot = A * C + B * D\n const lenSq = C * C + D * D\n let param = -1\n\n if (lenSq !== 0) param = dot / lenSq\n\n let xx = 0\n let yy = 0\n\n if (param < 0) {\n xx = x1\n yy = y1\n } else if (param > 1) {\n xx = x2\n yy = y2\n } else {\n xx = x1 + param * C\n yy = y1 + param * D\n }\n\n const dx = px - xx\n const dy = py - yy\n return Math.sqrt(dx * dx + dy * dy)\n}\n","// These are default colors if no color is provided\n// colors are made based on the index of the item in the array\n\nexport const defaultColors = [\n \"rgba(239, 68, 68, 0.8)\", // red-300\n \"rgba(249, 115, 22, 0.8)\", // orange-300\n \"rgba(245, 158, 11, 0.8)\", // amber-300\n \"rgba(234, 179, 8, 0.8)\", // yellow-300\n \"rgba(132, 204, 22, 0.8)\", // lime-300\n \"rgba(34, 197, 94, 0.8)\", // green-300\n \"rgba(16, 185, 129, 0.8)\", // emerald-300\n \"rgba(20, 184, 166, 0.8)\", // teal-300\n \"rgba(6, 182, 212, 0.8)\", // cyan-300\n \"rgba(14, 165, 233, 0.8)\", // sky-300\n \"rgba(59, 130, 246, 0.8)\", // blue-300\n \"rgba(99, 102, 241, 0.8)\", // indigo-300\n \"rgba(139, 92, 246, 0.8)\", // violet-300\n \"rgba(168, 85, 247, 0.8)\", // purple-300\n \"rgba(217, 70, 239, 0.8)\", // fuchsia-300\n \"rgba(236, 72, 153, 0.8)\", // pink-300\n \"rgba(249, 168, 212, 0.8)\", // rose-300\n \"rgba(161, 161, 170, 0.8)\", // zinc-300\n]\n","import { lighten } from \"polished\"\n\nexport const safeLighten = (amount: number, color: string) => {\n try {\n return lighten(amount, color)\n } catch (e) {\n return color\n }\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Point = ({\n point,\n interactiveState,\n index,\n}: {\n point: Types.Point\n interactiveState: InteractiveState\n index: number\n}) => {\n const { color, label, layer, step } = point\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n\n const screenPoint = applyToPoint(realToScreen, point)\n const size = 10\n\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenPoint.x - size / 2,\n top: screenPoint.y - size / 2,\n width: size,\n height: size,\n borderRadius: \"50%\",\n border: `2px solid ${\n isHovered\n ? safeLighten(\n 0.2,\n color ?? defaultColors[index % defaultColors.length],\n )\n : (color ?? defaultColors[index % defaultColors.length])\n }`,\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip\n text={`${label ? `${label}\\n` : \"\"}x: ${point.x.toFixed(2)}, y: ${point.y.toFixed(2)}`}\n />\n </div>\n )}\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { lighten } from \"polished\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Rect = ({\n rect,\n interactiveState,\n index,\n}: {\n rect: Types.Rect\n interactiveState: InteractiveState\n index: number\n}) => {\n const defaultColor = defaultColors[index % defaultColors.length]\n let { center, width, height, fill, stroke, layer, step } = rect\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n\n const screenCenter = applyToPoint(realToScreen, center)\n const screenWidth = width * realToScreen.a\n const screenHeight = height * Math.abs(realToScreen.d)\n\n // Default style when neither fill nor stroke is specified\n const hasStrokeOrFill = fill !== undefined || stroke !== undefined\n\n let backgroundColor = hasStrokeOrFill ? fill || \"transparent\" : defaultColor\n if (isHovered) {\n backgroundColor = safeLighten(0.2, backgroundColor)\n stroke = safeLighten(0.2, stroke!)\n }\n\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenCenter.x - screenWidth / 2,\n top: screenCenter.y - screenHeight / 2,\n width: screenWidth,\n height: screenHeight,\n backgroundColor,\n border: stroke\n ? `2px solid ${isHovered ? safeLighten(0.2, stroke) : stroke}`\n : \"none\",\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && rect.label && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip text={rect.label} />\n </div>\n )}\n </div>\n )\n}\n","import type * as Types from \"lib/types\"\nimport { applyToPoint } from \"transformation-matrix\"\nimport type { InteractiveState } from \"./InteractiveState\"\nimport { useState } from \"react\"\nimport { Tooltip } from \"./Tooltip\"\nimport { defaultColors } from \"./defaultColors\"\nimport { safeLighten } from \"site/utils/safeLighten\"\n\nexport const Circle = ({\n circle,\n interactiveState,\n index,\n}: {\n circle: Types.Circle\n interactiveState: InteractiveState\n index: number\n}) => {\n const defaultColor = defaultColors[index % defaultColors.length]\n let { center, radius, fill, stroke, layer, step, label } = circle\n const { activeLayers, activeStep, realToScreen } = interactiveState\n const [isHovered, setIsHovered] = useState(false)\n const screenCenter = applyToPoint(realToScreen, center)\n const screenRadius = radius * realToScreen.a\n let backgroundColor = fill || defaultColor\n if (isHovered) {\n backgroundColor = safeLighten(0.2, backgroundColor)\n stroke = stroke ? safeLighten(0.2, stroke) : stroke\n }\n return (\n <div\n style={{\n position: \"absolute\",\n left: screenCenter.x - screenRadius,\n top: screenCenter.y - screenRadius,\n width: screenRadius * 2,\n height: screenRadius * 2,\n borderRadius: \"50%\",\n backgroundColor,\n border: stroke ? `2px solid ${stroke}` : \"none\",\n cursor: \"pointer\",\n transition: \"border-color 0.2s\",\n }}\n onMouseEnter={() => setIsHovered(true)}\n onMouseLeave={() => setIsHovered(false)}\n >\n {isHovered && label && (\n <div\n style={{\n position: \"absolute\",\n bottom: \"100%\",\n left: \"50%\",\n transform: \"translateX(-50%)\",\n marginBottom: 8,\n }}\n >\n <Tooltip text={label} />\n </div>\n )}\n </div>\n )\n}\n","import { GraphicsObject } from \"lib/types\"\n\nexport const getGraphicsBounds = (graphics: GraphicsObject) => {\n const bounds = {\n minX: Infinity,\n minY: Infinity,\n maxX: -Infinity,\n maxY: -Infinity,\n }\n for (const line of graphics.lines ?? []) {\n for (const point of line.points ?? []) {\n bounds.minX = Math.min(bounds.minX, point.x)\n bounds.minY = Math.min(bounds.minY, point.y)\n bounds.maxX = Math.max(bounds.maxX, point.x)\n bounds.maxY = Math.max(bounds.maxY, point.y)\n }\n }\n for (const rect of graphics.rects ?? []) {\n const { center, width, height } = rect\n const halfWidth = width / 2\n const halfHeight = height / 2\n bounds.minX = Math.min(bounds.minX, center.x - halfWidth)\n bounds.minY = Math.min(bounds.minY, center.y - halfHeight)\n bounds.maxX = Math.max(bounds.maxX, center.x + halfWidth)\n bounds.maxY = Math.max(bounds.maxY, center.y + halfHeight)\n }\n for (const point of graphics.points ?? []) {\n bounds.minX = Math.min(bounds.minX, point.x)\n bounds.minY = Math.min(bounds.minY, point.y)\n bounds.maxX = Math.max(bounds.maxX, point.x)\n bounds.maxY = Math.max(bounds.maxY, point.y)\n }\n return bounds\n}\n","import { applyToPoint, type Matrix } from \"transformation-matrix\"\nimport { useMemo } from \"react\"\nimport { OFFSCREEN_MARGIN } from \"./useDoesLineIntersectViewport\"\n\nexport const useIsPointOnScreen = (\n realToScreen: Matrix,\n size: { width: number; height: number },\n) => {\n return useMemo(() => {\n return (point: { x: number; y: number }) => {\n const screenPoint = applyToPoint(realToScreen, point)\n return (\n screenPoint.x >= -OFFSCREEN_MARGIN &&\n screenPoint.x <= size.width + OFFSCREEN_MARGIN &&\n screenPoint.y >= -OFFSCREEN_MARGIN &&\n screenPoint.y <= size.height + OFFSCREEN_MARGIN\n )\n }\n }, [realToScreen, size])\n}\n","import { applyToPoint, type Matrix } from \"transformation-matrix\"\nimport { useMemo } from \"react\"\n\n// Margin in pixels for determining if elements are off-screen\nexport const OFFSCREEN_MARGIN = 5\n\nexport const useDoesLineIntersectViewport = (\n realToScreen: Matrix,\n size: { width: number; height: number },\n) => {\n return useMemo(() => {\n return (p1: { x: number; y: number }, p2: { x: number; y: number }) => {\n // Convert real-world points to screen coordinates\n const sp1 = applyToPoint(realToScreen, p1)\n const sp2 = applyToPoint(realToScreen, p2)\n\n // Viewport boundaries with margin\n const left = -OFFSCREEN_MARGIN\n const right = size.width + OFFSCREEN_MARGIN\n const top = -OFFSCREEN_MARGIN\n const bottom = size.height + OFFSCREEN_MARGIN\n\n // If either point is inside the viewport, the line intersects\n if (\n (sp1.x >= left && sp1.x <= right && sp1.y >= top && sp1.y <= bottom) ||\n (sp2.x >= left && sp2.x <= right && sp2.y >= top && sp2.y <= bottom)\n ) {\n return true\n }\n\n // Helper function to check if a line intersects with a line segment\n const intersects = (\n a1: { x: number; y: number },\n a2: { x: number; y: number },\n b1: { x: number; y: number },\n b2: { x: number; y: number },\n ) => {\n // Line segment A is (a1, a2), line segment B is (b1, b2)\n const det =\n (a2.x - a1.x) * (b2.y - b1.y) - (a2.y - a1.y) * (b2.x - b1.x)\n\n // If lines are parallel or coincident, they don't intersect in a unique point\n if (det === 0) return false\n\n const lambda =\n ((b2.y - b1.y) * (b2.x - a1.x) + (b1.x - b2.x) * (b2.y - a1.y)) / det\n const gamma =\n ((a1.y - a2.y) * (b2.x - a1.x) + (a2.x - a1.x) * (b2.y - a1.y)) / det\n\n // Check if the intersection point is within both line segments\n return lambda >= 0 && lambda <= 1 && gamma >= 0 && gamma <= 1\n }\n\n // Check intersection with each edge of the viewport\n return (\n // Top edge\n intersects(sp1, sp2, { x: left, y: top }, { x: right, y: top }) ||\n // Right edge\n intersects(sp1, sp2, { x: right, y: top }, { x: right, y: bottom }) ||\n // Bottom edge\n intersects(sp1, sp2, { x: left, y: bottom }, { x: right, y: bottom }) ||\n // Left edge\n intersects(sp1, sp2, { x: left, y: top }, { x: left, y: bottom })\n )\n }\n }, [realToScreen, size])\n}\n","import { useMemo } from \"react\"\n\ntype Line = {\n points: Array<{ x: number; y: number }>\n layer?: string\n step?: number\n closed?: boolean\n}\n\nexport const useFilterLines = (\n isPointOnScreen: (point: { x: number; y: number }) => boolean,\n doesLineIntersectViewport: (\n p1: { x: number; y: number },\n p2: { x: number; y: number },\n ) => boolean,\n filterLayerAndStep: (obj: { layer?: string; step?: number }) => boolean,\n) => {\n return useMemo(() => {\n return (line: Line) => {\n // First apply layer and step filters\n if (!filterLayerAndStep(line)) return false\n\n // Then check if any point of the line is visible\n if (line.points.some((p) => isPointOnScreen(p))) {\n return true\n }\n\n // If no points are visible, check if any line segment intersects the viewport\n for (let i = 0; i < line.points.length - 1; i++) {\n if (doesLineIntersectViewport(line.points[i], line.points[i + 1])) {\n return true\n }\n }\n\n // If it's a closed shape (polyline), check the last segment too\n if (line.points.length > 2 && line.closed) {\n if (\n doesLineIntersectViewport(\n line.points[line.points.length - 1],\n line.points[0],\n )\n ) {\n return true\n }\n }\n\n return false\n }\n }, [isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep])\n}\n","import { useMemo } from \"react\"\n\ntype Point = {\n x: number\n y: number\n layer?: string\n step?: number\n}\n\nexport const useFilterPoints = (\n isPointOnScreen: (point: { x: number; y: number }) => boolean,\n filterLayerAndStep: (obj: { layer?: string; step?: number }) => boolean,\n) => {\n return useMemo(() => {\n return (point: Point) => {\n // First apply layer and step filters\n if (!filterLayerAndStep(point)) return false\n\n // Then check if the point is visible\n return isPointOnScreen(point)\n }\n }, [isPointOnScreen, filterLayerAndStep])\n}\n","import { useMemo } from \"react\"\n\ntype Rect = {\n center: { x: number; y: number }\n width: number\n height: number\n layer?: string\n step?: number\n}\n\nexport const useFilterRects = (\n isPointOnScreen: (point: { x: number; y: number }) => boolean,\n doesLineIntersectViewport: (\n p1: { x: number; y: number },\n p2: { x: number; y: number },\n ) => boolean,\n filterLayerAndStep: (obj: { layer?: string; step?: number }) => boolean,\n) => {\n return useMemo(() => {\n return (rect: Rect) => {\n // First apply layer and step filters\n if (!filterLayerAndStep(rect)) return false\n\n // For rectangles, check if any corner or the center is visible\n const { center, width, height } = rect\n const halfWidth = width / 2\n const halfHeight = height / 2\n\n const topLeft = { x: center.x - halfWidth, y: center.y - halfHeight }\n const topRight = { x: center.x + halfWidth, y: center.y - halfHeight }\n const bottomLeft = { x: center.x - halfWidth, y: center.y + halfHeight }\n const bottomRight = { x: center.x + halfWidth, y: center.y + halfHeight }\n\n // Check if any corner or center is visible\n if (\n isPointOnScreen(center) ||\n isPointOnScreen(topLeft) ||\n isPointOnScreen(topRight) ||\n isPointOnScreen(bottomLeft) ||\n isPointOnScreen(bottomRight)\n ) {\n return true\n }\n\n // Check if any edge of the rectangle intersects the viewport\n return (\n doesLineIntersectViewport(topLeft, topRight) ||\n doesLineIntersectViewport(topRight, bottomRight) ||\n doesLineIntersectViewport(bottomRight, bottomLeft) ||\n doesLineIntersectViewport(bottomLeft, topLeft)\n )\n }\n }, [isPointOnScreen, doesLineIntersectViewport, filterLayerAndStep])\n}\n","import { applyToPoint, type Matrix } from \"transformation-matrix\"\nimport { useMemo } from \"react\"\nimport { OFFSCREEN_MARGIN } from \"./useDoesLineIntersectViewport\"\n\ntype Circle = {\n center: { x: number; y: number }\n radius: number\n layer?: string\n step?: number\n}\n\nexport const useFilterCircles = (\n isPointOnScreen: (point: { x: number; y: number }) => boolean,\n filterLayerAndStep: (obj: { layer?: string; step?: number }) => boolean,\n realToScreen: Matrix,\n size: { width: number; height: number },\n) => {\n return useMemo(() => {\n return (circle: Circle) => {\n // First apply layer and step filters\n if (!filterLayerAndStep(circle)) return false\n\n // For circles, check if center is visible or if any cardinal point is visible\n const { center, radius } = circle\n\n // Check if center or cardinal points on the circle are visible\n if (\n isPointOnScreen(center) ||\n isPointOnScreen({ x: center.x + radius, y: center.y }) ||\n isPointOnScreen({ x: center.x - radius, y: center.y }) ||\n isPointOnScreen({ x: center.x, y: center.y + radius }) ||\n isPointOnScreen({ x: center.x, y: center.y - radius })\n ) {\n return true\n }\n\n // Check if the circle intersects the viewport\n // Convert to screen coordinates for viewport intersection test\n const screenCenter = applyToPoint(realToScreen, center)\n const scale = Math.abs(realToScreen.a) // Get the scale factor\n const screenRadius = radius * scale\n\n // Viewport boundaries\n const left = -OFFSCREEN_MARGIN\n const right = size.width + OFFSCREEN_MARGIN\n const top = -OFFSCREEN_MARGIN\n const bottom = size.height + OFFSCREEN_MARGIN\n\n // Check if the circle intersects with the viewport\n // Case 1: Circle center is inside the viewport horizontally but outside vertically\n if (screenCenter.x >= left && screenCenter.x <= right) {\n if (\n Math.abs(screenCenter.y - top) <= screenRadius ||\n Math.abs(screenCenter.y - bottom) <= screenRadius\n ) {\n return true\n }\n }\n\n // Case 2: Circle center is inside the viewport vertically but outside horizontally\n if (screenCenter.y >= top && screenCenter.y <= bottom) {\n if (\n Math.abs(screenCenter.x - left) <= screenRadius ||\n Math.abs(screenCenter.x - right) <= screenRadius\n ) {\n return true\n }\n }\n\n // Case 3: Circle center is outside the viewport, check corners\n const cornerDistanceSquared = (cornerX: number, cornerY: number) => {\n const dx = screenCenter.x - cornerX\n const dy = screenCenter.y - cornerY\n return dx * dx + dy * dy\n }\n\n const radiusSquared = screenRadius * screenRadius\n\n return (\n cornerDistanceSquared(left, top) <= radiusSquared ||\n cornerDistanceSquared(right, top) <= radiusSquared ||\n cornerDistanceSquared(left, bottom) <= radiusSquared ||\n cornerDistanceSquared(right, bottom) <= radiusSquared\n )\n }\n }, [isPointOnScreen, filterLayerAndStep, realToScreen, size])\n}\n"],"mappings":"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","names":["useMemo","useState","jsx","applyToPoint","useState","jsx","useState","applyToPoint","applyToPoint","useState","jsx","useState","applyToPoint","applyToPoint","useState","jsx","useState","applyToPoint","applyToPoint","useMemo","applyToPoint","useMemo","applyToPoint","useMemo","useMemo","useMemo","applyToPoint","useMemo","useMemo","applyToPoint","scale","jsx","jsxs","useState","useMemo"]}
|