@fivepixels-js/react 0.1.7 → 0.2.1

package/dist/components/icons/ProbeLayoutIcons.d.ts

@@ -0,0 +1,16 @@
+import { type MaterialIconProps } from "../../components/icons/MaterialIcon.js";
+export declare function AlignJustifyFlexStartIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignJustifyCenterIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignJustifyFlexEndIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignJustifySpaceBetweenIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignVerticalTopIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignVerticalCenterIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignVerticalBottomIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignHorizontalLeftIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignHorizontalCenterIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function AlignHorizontalRightIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function SwapHorizIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function SwapVertIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function ViewColumnIcon(props: MaterialIconProps): import("react").JSX.Element;
+export declare function ViewStreamIcon(props: MaterialIconProps): import("react").JSX.Element;
+//# sourceMappingURL=ProbeLayoutIcons.d.ts.map

package/dist/components/icons/ProbeLayoutIcons.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProbeLayoutIcons.d.ts","sourceRoot":"","sources":["../../../src/components/icons/ProbeLayoutIcons.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,iBAAiB,EAAE,MAAM,oCAAoC,CAAC;AAuC1F,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,iBAAiB,+BAEjE;AAED,wBAAgB,sBAAsB,CAAC,KAAK,EAAE,iBAAiB,+BAE9D;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,iBAAiB,+BAE/D;AAED,wBAAgB,4BAA4B,CAAC,KAAK,EAAE,iBAAiB,+BAEpE;AAED,wBAAgB,oBAAoB,CAAC,KAAK,EAAE,iBAAiB,+BAE5D;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,iBAAiB,+BAE/D;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,iBAAiB,+BAE/D;AAED,wBAAgB,uBAAuB,CAAC,KAAK,EAAE,iBAAiB,+BAE/D;AAED,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,iBAAiB,+BAEjE;AAED,wBAAgB,wBAAwB,CAAC,KAAK,EAAE,iBAAiB,+BAEhE;AAED,wBAAgB,aAAa,CAAC,KAAK,EAAE,iBAAiB,+BAErD;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,+BAEpD;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,iBAAiB,+BAEtD;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,iBAAiB,+BAEtD"}

package/dist/components/icons/ProbeLayoutIcons.js

@@ -0,0 +1,62 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { MaterialIcon } from "../../components/icons/MaterialIcon.js";
+const ALIGN_JUSTIFY_FLEX_START_PATH = "M120-80q-17 0-28.5-11.5T80-120v-720q0-17 11.5-28.5T120-880q17 0 28.5 11.5T160-840v720q0 17-11.5 28.5T120-80Zm440-200q-17 0-28.5-11.5T520-320v-320q0-17 11.5-28.5T560-680h40q17 0 28.5 11.5T640-640v320q0 17-11.5 28.5T600-280h-40Zm-240 0q-17 0-28.5-11.5T280-320v-320q0-17 11.5-28.5T320-680h40q17 0 28.5 11.5T400-640v320q0 17-11.5 28.5T360-280h-40Z";
+const ALIGN_JUSTIFY_CENTER_PATH = "M480-80q-17 0-28.5-11.5T440-120v-720q0-17 11.5-28.5T480-880q17 0 28.5 11.5T520-840v720q0 17-11.5 28.5T480-80Zm160-200q-17 0-28.5-11.5T600-320v-320q0-17 11.5-28.5T640-680h40q17 0 28.5 11.5T720-640v320q0 17-11.5 28.5T680-280h-40Zm-360 0q-17 0-28.5-11.5T240-320v-320q0-17 11.5-28.5T280-680h40q17 0 28.5 11.5T360-640v320q0 17-11.5 28.5T320-280h-40Z";
+const ALIGN_JUSTIFY_FLEX_END_PATH = "M840-80q-17 0-28.5-11.5T800-120v-720q0-17 11.5-28.5T840-880q17 0 28.5 11.5T880-840v720q0 17-11.5 28.5T840-80ZM600-280q-17 0-28.5-11.5T560-320v-320q0-17 11.5-28.5T600-680h40q17 0 28.5 11.5T680-640v320q0 17-11.5 28.5T640-280h-40Zm-240 0q-17 0-28.5-11.5T320-320v-320q0-17 11.5-28.5T360-680h40q17 0 28.5 11.5T440-640v320q0 17-11.5 28.5T400-280h-40Z";
+const ALIGN_JUSTIFY_SPACE_BETWEEN_PATH = "M840-80q-17 0-28.5-11.5T800-120v-160h-80q-17 0-28.5-11.5T680-320v-320q0-17 11.5-28.5T720-680h80v-160q0-17 11.5-28.5T840-880q17 0 28.5 11.5T880-840v720q0 17-11.5 28.5T840-80Zm-720 0q-17 0-28.5-11.5T80-120v-720q0-17 11.5-28.5T120-880q17 0 28.5 11.5T160-840v160h80q17 0 28.5 11.5T280-640v320q0 17-11.5 28.5T240-280h-80v160q0 17-11.5 28.5T120-80Z";
+const ALIGN_VERTICAL_TOP_PATH = "M340-80q-25 0-42.5-17.5T280-140v-520q0-25 17.5-42.5T340-720q25 0 42.5 17.5T400-660v520q0 25-17.5 42.5T340-80Zm280-240q-25 0-42.5-17.5T560-380v-280q0-25 17.5-42.5T620-720q25 0 42.5 17.5T680-660v280q0 25-17.5 42.5T620-320ZM120-800q-17 0-28.5-11.5T80-840q0-17 11.5-28.5T120-880h720q17 0 28.5 11.5T880-840q0 17-11.5 28.5T840-800H120Z";
+const ALIGN_VERTICAL_CENTER_PATH = "M340-120q-25 0-42.5-17.5T280-180v-260H120q-17 0-28.5-11.5T80-480q0-17 11.5-28.5T120-520h160v-260q0-25 17.5-42.5T340-840q25 0 42.5 17.5T400-780v260h160v-140q0-25 17.5-42.5T620-720q25 0 42.5 17.5T680-660v140h160q17 0 28.5 11.5T880-480q0 17-11.5 28.5T840-440H680v140q0 25-17.5 42.5T620-240q-25 0-42.5-17.5T560-300v-140H400v260q0 25-17.5 42.5T340-120Z";
+const ALIGN_VERTICAL_BOTTOM_PATH = "M120-80q-17 0-28.5-11.5T80-120q0-17 11.5-28.5T120-160h720q17 0 28.5 11.5T880-120q0 17-11.5 28.5T840-80H120Zm220-160q-25 0-42.5-17.5T280-300v-520q0-25 17.5-42.5T340-880q25 0 42.5 17.5T400-820v520q0 25-17.5 42.5T340-240Zm280 0q-25 0-42.5-17.5T560-300v-280q0-25 17.5-42.5T620-640q25 0 42.5 17.5T680-580v280q0 25-17.5 42.5T620-240Z";
+const ALIGN_HORIZONTAL_LEFT_PATH = "M120-80q-17 0-28.5-11.5T80-120v-720q0-17 11.5-28.5T120-880q17 0 28.5 11.5T160-840v720q0 17-11.5 28.5T120-80Zm180-200q-25 0-42.5-17.5T240-340q0-25 17.5-42.5T300-400h280q25 0 42.5 17.5T640-340q0 25-17.5 42.5T580-280H300Zm0-280q-25 0-42.5-17.5T240-620q0-25 17.5-42.5T300-680h520q25 0 42.5 17.5T880-620q0 25-17.5 42.5T820-560H300Z";
+const ALIGN_HORIZONTAL_CENTER_PATH = "M440-120v-160H300q-25 0-42.5-17.5T240-340q0-25 17.5-42.5T300-400h140v-160H180q-25 0-42.5-17.5T120-620q0-25 17.5-42.5T180-680h260v-160q0-17 11.5-28.5T480-880q17 0 28.5 11.5T520-840v160h260q25 0 42.5 17.5T840-620q0 25-17.5 42.5T780-560H520v160h140q25 0 42.5 17.5T720-340q0 25-17.5 42.5T660-280H520v160q0 17-11.5 28.5T480-80q-17 0-28.5-11.5T440-120Z";
+const ALIGN_HORIZONTAL_RIGHT_PATH = "M840-80q-17 0-28.5-11.5T800-120v-720q0-17 11.5-28.5T840-880q17 0 28.5 11.5T880-840v720q0 17-11.5 28.5T840-80ZM380-280q-25 0-42.5-17.5T320-340q0-25 17.5-42.5T380-400h280q25 0 42.5 17.5T720-340q0 25-17.5 42.5T660-280H380ZM140-560q-25 0-42.5-17.5T80-620q0-25 17.5-42.5T140-680h520q25 0 42.5 17.5T720-620q0 25-17.5 42.5T660-560H140Z";
+const SWAP_HORIZ_PATH = "m233-320 75 75q11 11 11 27.5T308-189q-12 12-28.5 12T251-189L108-332q-6-6-8.5-13T97-360q0-8 2.5-15t8.5-13l144-144q12-12 28-11.5t28 12.5q11 12 11.5 28T308-475l-75 75h247q17 0 28.5 11.5T520-360q0 17-11.5 28.5T480-320H233Zm494-240H480q-17 0-28.5-11.5T440-600q0-17 11.5-28.5T480-640h247l-75-75q-11-11-11-27.5t11-28.5q12-12 28.5-12t28.5 12l143 143q6 6 8.5 13t2.5 15q0 8-2.5 15t-8.5 13L708-428q-12 12-28 11.5T652-429q-11-12-11.5-28t11.5-28l75-75Z";
+const SWAP_VERT_PATH = "M360-440q-17 0-28.5-11.5T320-480v-247l-75 75q-11 11-27.5 11T189-652q-12-12-12-28.5t12-28.5l143-143q6-6 13-8.5t15-2.5q8 0 15 2.5t13 8.5l144 144q12 12 11.5 28T531-652q-12 11-28 11.5T475-652l-75-75v247q0 17-11.5 28.5T360-440ZM600-97q-8 0-15-2.5t-13-8.5L428-252q-12-12-11.5-28t12.5-28q12-11 28-11.5t28 11.5l75 75v-247q0-17 11.5-28.5T600-520q17 0 28.5 11.5T640-480v247l75-75q11-11 27.5-11t28.5 11q12 12 12 28.5T771-251L628-108q-6 6-13 8.5T600-97Z";
+const VIEW_COLUMN_PATH = "M121-280v-400q0-33 23.5-56.5T201-760h559q33 0 56.5 23.5T840-680v400q0 33-23.5 56.5T760-200H201q-33 0-56.5-23.5T121-280Zm79 0h133v-400H200v400Zm213 0h133v-400H413v400Zm213 0h133v-400H626v400Z";
+const VIEW_STREAM_PATH = "M760-280v-160H200v160h560Zm0-240v-160H200v160h560ZM200-200q-33 0-56.5-23.5T120-280v-400q0-33 23.5-56.5T200-760h560q33 0 56.5 23.5T840-680v400q0 33-23.5 56.5T760-200H200Z";
+function ProbeLayoutIconGlyph({ path, className }) {
+    return (_jsx(MaterialIcon, { className: className, "aria-hidden": true, children: _jsx("path", { d: path }) }));
+}
+export function AlignJustifyFlexStartIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_JUSTIFY_FLEX_START_PATH, ...props });
+}
+export function AlignJustifyCenterIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_JUSTIFY_CENTER_PATH, ...props });
+}
+export function AlignJustifyFlexEndIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_JUSTIFY_FLEX_END_PATH, ...props });
+}
+export function AlignJustifySpaceBetweenIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_JUSTIFY_SPACE_BETWEEN_PATH, ...props });
+}
+export function AlignVerticalTopIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_VERTICAL_TOP_PATH, ...props });
+}
+export function AlignVerticalCenterIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_VERTICAL_CENTER_PATH, ...props });
+}
+export function AlignVerticalBottomIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_VERTICAL_BOTTOM_PATH, ...props });
+}
+export function AlignHorizontalLeftIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_HORIZONTAL_LEFT_PATH, ...props });
+}
+export function AlignHorizontalCenterIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_HORIZONTAL_CENTER_PATH, ...props });
+}
+export function AlignHorizontalRightIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: ALIGN_HORIZONTAL_RIGHT_PATH, ...props });
+}
+export function SwapHorizIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: SWAP_HORIZ_PATH, ...props });
+}
+export function SwapVertIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: SWAP_VERT_PATH, ...props });
+}
+export function ViewColumnIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: VIEW_COLUMN_PATH, ...props });
+}
+export function ViewStreamIcon(props) {
+    return _jsx(ProbeLayoutIconGlyph, { path: VIEW_STREAM_PATH, ...props });
+}
+//# sourceMappingURL=ProbeLayoutIcons.js.map

package/dist/components/icons/ProbeLayoutIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProbeLayoutIcons.js","sourceRoot":"","sources":["../../../src/components/icons/ProbeLayoutIcons.tsx"],"names":[],"mappings":"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"}

package/dist/components/overlay/DotWaveOverlay.d.ts

@@ -0,0 +1,21 @@
+import { type CSSProperties } from "react";
+export type DotWaveOrigin = {
+    x: number;
+    y: number;
+};
+export type DotWaveOverlayProps = {
+    active?: boolean;
+    dotSize?: number;
+    gap?: number;
+    minOpacity?: number;
+    maxOpacity?: number;
+    waveDuration?: number;
+    fadeOutDuration?: number;
+    deactivateDelay?: number;
+    color?: string;
+    origin?: DotWaveOrigin;
+    className?: string;
+    style?: CSSProperties;
+};
+export declare function DotWaveOverlay({ active, dotSize, gap, minOpacity, maxOpacity, waveDuration, fadeOutDuration, deactivateDelay, color, origin, className, style, }: DotWaveOverlayProps): import("react").JSX.Element;
+//# sourceMappingURL=DotWaveOverlay.d.ts.map

package/dist/components/overlay/DotWaveOverlay.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DotWaveOverlay.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/DotWaveOverlay.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAqB,KAAK,aAAa,EAAE,MAAM,OAAO,CAAC;AAE9D,MAAM,MAAM,aAAa,GAAG;IACxB,CAAC,EAAE,MAAM,CAAC;IACV,CAAC,EAAE,MAAM,CAAC;CACb,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAC9B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,KAAK,CAAC,EAAE,aAAa,CAAC;CACzB,CAAC;AAgCF,wBAAgB,cAAc,CAAC,EAC3B,MAAa,EACb,OAAW,EACX,GAAQ,EACR,UAAgB,EAChB,UAAgB,EAChB,YAAoB,EACpB,eAAuB,EACvB,eAAmB,EACnB,KAAiB,EACjB,MAAuB,EACvB,SAAc,EACd,KAAK,GACR,EAAE,mBAAmB,+BAsQrB"}

package/dist/components/overlay/DotWaveOverlay.js

@@ -0,0 +1,226 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useRef } from "react";
+const DEFAULT_ORIGIN = { x: 0.5, y: 0.5 };
+const TAU = Math.PI * 2;
+const DOT_REVEAL_DURATION = 360;
+const BLINK_BLEND_DURATION = 720;
+const DOT_EXIT_DURATION = 300;
+function clamp(value, min, max) {
+    return Math.min(max, Math.max(min, value));
+}
+function easeOutCubic(value) {
+    return 1 - Math.pow(1 - value, 3);
+}
+export function DotWaveOverlay({ active = true, dotSize = 2, gap = 20, minOpacity = 0.2, maxOpacity = 0.8, waveDuration = 1400, fadeOutDuration = 2200, deactivateDelay = 0, color = "#94a3b8", origin = DEFAULT_ORIGIN, className = "", style, }) {
+    const canvasRef = useRef(null);
+    const controllerRef = useRef(null);
+    const activeRef = useRef(active);
+    const colorRef = useRef(color);
+    activeRef.current = active;
+    colorRef.current = color;
+    useEffect(() => {
+        const canvas = canvasRef.current;
+        if (!canvas) {
+            return;
+        }
+        const context = canvas.getContext("2d");
+        if (!context) {
+            return;
+        }
+        const drawingContext = context;
+        const safeDotSize = Math.max(0.5, dotSize);
+        const safeGap = Math.max(safeDotSize + 1, gap);
+        const safeMinOpacity = clamp(minOpacity, 0, 1);
+        const safeMaxOpacity = clamp(Math.max(safeMinOpacity, maxOpacity), 0, 1);
+        const safeWaveDuration = Math.max(0, waveDuration);
+        const safeFadeOutDuration = Math.max(0, fadeOutDuration);
+        const reducedMotion = window.matchMedia("(prefers-reduced-motion: reduce)").matches;
+        const dots = [];
+        let width = 0;
+        let height = 0;
+        let frameId = null;
+        let resizeFrameId = null;
+        let isActive = activeRef.current;
+        let currentColor = colorRef.current;
+        let startedAt = performance.now();
+        let stoppedAt = null;
+        let maxExitEnd = 0;
+        let deactivateTimeout = null;
+        const buildDots = () => {
+            dots.length = 0;
+            maxExitEnd = 0;
+            const originX = width * clamp(origin.x, 0, 1);
+            const originY = height * clamp(origin.y, 0, 1);
+            const maxDistance = Math.max(Math.hypot(originX, originY), Math.hypot(width - originX, originY), Math.hypot(originX, height - originY), Math.hypot(width - originX, height - originY), 1);
+            const startX = (width % safeGap) / 2;
+            const startY = (height % safeGap) / 2;
+            for (let y = startY; y < height; y += safeGap) {
+                for (let x = startX; x < width; x += safeGap) {
+                    const distanceProgress = Math.hypot(x - originX, y - originY) / maxDistance;
+                    const jitter = (Math.random() - 0.5) * safeWaveDuration * 0.12;
+                    const exitAt = distanceProgress * Math.max(0, safeFadeOutDuration - DOT_EXIT_DURATION);
+                    dots.push({
+                        x,
+                        y,
+                        revealAt: Math.max(0, distanceProgress * safeWaveDuration + jitter),
+                        exitAt,
+                        initialOpacity: safeMinOpacity + Math.random() * (safeMaxOpacity - safeMinOpacity),
+                        maxOpacity: safeMinOpacity + Math.random() * (safeMaxOpacity - safeMinOpacity),
+                        phase: Math.random() * TAU,
+                        speed: 0.0007 + Math.random() * 0.0011,
+                    });
+                    maxExitEnd = Math.max(maxExitEnd, exitAt + DOT_EXIT_DURATION);
+                }
+            }
+        };
+        const resize = () => {
+            const rect = canvas.getBoundingClientRect();
+            width = Math.max(0, rect.width);
+            height = Math.max(0, rect.height);
+            const pixelRatio = Math.min(window.devicePixelRatio || 1, 2);
+            canvas.width = Math.round(width * pixelRatio);
+            canvas.height = Math.round(height * pixelRatio);
+            drawingContext.setTransform(pixelRatio, 0, 0, pixelRatio, 0, 0);
+            buildDots();
+        };
+        function requestDraw() {
+            if (frameId === null) {
+                frameId = window.requestAnimationFrame(draw);
+            }
+        }
+        function draw(now) {
+            frameId = null;
+            drawingContext.clearRect(0, 0, width, height);
+            if (reducedMotion && !isActive) {
+                return;
+            }
+            const elapsed = now - startedAt;
+            const exitElapsed = stoppedAt === null ? null : now - stoppedAt;
+            drawingContext.fillStyle = currentColor;
+            for (const dot of dots) {
+                const timeSinceReveal = elapsed - dot.revealAt;
+                if (!reducedMotion && timeSinceReveal < 0) {
+                    continue;
+                }
+                const revealProgress = reducedMotion ? 1 : easeOutCubic(clamp(timeSinceReveal / DOT_REVEAL_DURATION, 0, 1));
+                const blinkOpacity = ((Math.sin(elapsed * dot.speed + dot.phase) + 1) / 2) * dot.maxOpacity;
+                const blinkBlend = reducedMotion ? 0 : clamp((timeSinceReveal - DOT_REVEAL_DURATION) / BLINK_BLEND_DURATION, 0, 1);
+                const exitProgress = exitElapsed === null ? 0 : easeOutCubic(clamp((exitElapsed - dot.exitAt) / DOT_EXIT_DURATION, 0, 1));
+                const opacity = (dot.initialOpacity * (1 - blinkBlend) + blinkOpacity * blinkBlend) * revealProgress * (1 - exitProgress);
+                if (opacity <= 0.001) {
+                    continue;
+                }
+                drawingContext.globalAlpha = opacity;
+                drawingContext.fillRect(dot.x - safeDotSize / 2, dot.y - safeDotSize / 2, safeDotSize, safeDotSize);
+            }
+            drawingContext.globalAlpha = 1;
+            if (reducedMotion) {
+                return;
+            }
+            if (isActive || (exitElapsed !== null && exitElapsed < maxExitEnd)) {
+                requestDraw();
+            }
+        }
+        const scheduleResize = () => {
+            if (resizeFrameId !== null) {
+                window.cancelAnimationFrame(resizeFrameId);
+            }
+            resizeFrameId = window.requestAnimationFrame(() => {
+                resize();
+                resizeFrameId = null;
+                const exiting = stoppedAt !== null && performance.now() - stoppedAt < maxExitEnd;
+                if (isActive || exiting) {
+                    requestDraw();
+                }
+            });
+        };
+        resize();
+        if (isActive) {
+            requestDraw();
+        }
+        const controller = {
+            setActive(nextActive, delay) {
+                if (deactivateTimeout !== null) {
+                    window.clearTimeout(deactivateTimeout);
+                    deactivateTimeout = null;
+                }
+                if (nextActive) {
+                    if (isActive) {
+                        requestDraw();
+                        return;
+                    }
+                    isActive = true;
+                    startedAt = performance.now();
+                    stoppedAt = null;
+                    buildDots();
+                    requestDraw();
+                    return;
+                }
+                if (!isActive) {
+                    return;
+                }
+                const deactivate = () => {
+                    deactivateTimeout = null;
+                    isActive = false;
+                    stoppedAt = performance.now();
+                    if (reducedMotion) {
+                        drawingContext.clearRect(0, 0, width, height);
+                        return;
+                    }
+                    requestDraw();
+                };
+                const safeDelay = reducedMotion ? 0 : Math.max(0, delay);
+                if (safeDelay > 0) {
+                    deactivateTimeout = window.setTimeout(deactivate, safeDelay);
+                    requestDraw();
+                    return;
+                }
+                deactivate();
+            },
+            setColor(nextColor) {
+                if (!isActive && stoppedAt !== null) {
+                    return;
+                }
+                currentColor = nextColor;
+                if (isActive) {
+                    requestDraw();
+                }
+            },
+        };
+        controllerRef.current = controller;
+        const resizeObserver = typeof ResizeObserver === "undefined" ? null : new ResizeObserver(scheduleResize);
+        resizeObserver?.observe(canvas);
+        window.addEventListener("resize", scheduleResize);
+        return () => {
+            if (frameId !== null) {
+                window.cancelAnimationFrame(frameId);
+            }
+            if (resizeFrameId !== null) {
+                window.cancelAnimationFrame(resizeFrameId);
+            }
+            if (deactivateTimeout !== null) {
+                window.clearTimeout(deactivateTimeout);
+            }
+            resizeObserver?.disconnect();
+            window.removeEventListener("resize", scheduleResize);
+            if (controllerRef.current === controller) {
+                controllerRef.current = null;
+            }
+        };
+    }, [dotSize, fadeOutDuration, gap, maxOpacity, minOpacity, origin.x, origin.y, waveDuration]);
+    useEffect(() => {
+        const controller = controllerRef.current;
+        if (!controller) {
+            return;
+        }
+        if (active) {
+            controller.setActive(true, deactivateDelay);
+            controller.setColor(color);
+            return;
+        }
+        controller.setColor(color);
+        controller.setActive(false, deactivateDelay);
+    }, [active, color, deactivateDelay]);
+    return (_jsx("canvas", { ref: canvasRef, "aria-hidden": "true", className: `pointer-events-none absolute inset-0 h-full w-full ${className}`, style: style }));
+}
+//# sourceMappingURL=DotWaveOverlay.js.map

package/dist/components/overlay/DotWaveOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DotWaveOverlay.js","sourceRoot":"","sources":["../../../src/components/overlay/DotWaveOverlay.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAsB,MAAM,OAAO,CAAC;AAiC9D,MAAM,cAAc,GAAkB,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC;AACzD,MAAM,GAAG,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC;AACxB,MAAM,mBAAmB,GAAG,GAAG,CAAC;AAChC,MAAM,oBAAoB,GAAG,GAAG,CAAC;AACjC,MAAM,iBAAiB,GAAG,GAAG,CAAC;AAO9B,SAAS,KAAK,CAAC,KAAa,EAAE,GAAW,EAAE,GAAW;IAClD,OAAO,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC;AAC/C,CAAC;AAED,SAAS,YAAY,CAAC,KAAa;IAC/B,OAAO,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,EAAE,CAAC,CAAC,CAAC;AACtC,CAAC;AAED,MAAM,UAAU,cAAc,CAAC,EAC3B,MAAM,GAAG,IAAI,EACb,OAAO,GAAG,CAAC,EACX,GAAG,GAAG,EAAE,EACR,UAAU,GAAG,GAAG,EAChB,UAAU,GAAG,GAAG,EAChB,YAAY,GAAG,IAAK,EACpB,eAAe,GAAG,IAAK,EACvB,eAAe,GAAG,CAAC,EACnB,KAAK,GAAG,SAAS,EACjB,MAAM,GAAG,cAAc,EACvB,SAAS,GAAG,EAAE,EACd,KAAK,GACa;IAClB,MAAM,SAAS,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IACzD,MAAM,aAAa,GAAG,MAAM,CAA2B,IAAI,CAAC,CAAC;IAC7D,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC;IACjC,MAAM,QAAQ,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAC/B,SAAS,CAAC,OAAO,GAAG,MAAM,CAAC;IAC3B,QAAQ,CAAC,OAAO,GAAG,KAAK,CAAC;IAEzB,SAAS,CAAC,GAAG,EAAE;QACX,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,IAAI,CAAC,MAAM,EAAE,CAAC;YACV,OAAO;QACX,CAAC;QAED,MAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,CAAC,OAAO,EAAE,CAAC;YACX,OAAO;QACX,CAAC;QACD,MAAM,cAAc,GAAG,OAAO,CAAC;QAE/B,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,CAAC,CAAC;QAC3C,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,WAAW,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC;QAC/C,MAAM,cAAc,GAAG,KAAK,CAAC,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QAC/C,MAAM,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,UAAU,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;QACzE,MAAM,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC;QACnD,MAAM,mBAAmB,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,eAAe,CAAC,CAAC;QACzD,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,CAAC,kCAAkC,CAAC,CAAC,OAAO,CAAC;QACpF,MAAM,IAAI,GAAU,EAAE,CAAC;QACvB,IAAI,KAAK,GAAG,CAAC,CAAC;QACd,IAAI,MAAM,GAAG,CAAC,CAAC;QACf,IAAI,OAAO,GAAkB,IAAI,CAAC;QAClC,IAAI,aAAa,GAAkB,IAAI,CAAC;QACxC,IAAI,QAAQ,GAAG,SAAS,CAAC,OAAO,CAAC;QACjC,IAAI,YAAY,GAAG,QAAQ,CAAC,OAAO,CAAC;QACpC,IAAI,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;QAClC,IAAI,SAAS,GAAkB,IAAI,CAAC;QACpC,IAAI,UAAU,GAAG,CAAC,CAAC;QACnB,IAAI,iBAAiB,GAAkB,IAAI,CAAC;QAE5C,MAAM,SAAS,GAAG,GAAG,EAAE;YACnB,IAAI,CAAC,MAAM,GAAG,CAAC,CAAC;YAChB,UAAU,GAAG,CAAC,CAAC;YAEf,MAAM,OAAO,GAAG,KAAK,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YAC9C,MAAM,OAAO,GAAG,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YAC/C,MAAM,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,OAAO,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,EAAE,OAAO,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,EAAE,CAAC,CAAC,CAAC;YAC1L,MAAM,MAAM,GAAG,CAAC,KAAK,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;YACrC,MAAM,MAAM,GAAG,CAAC,MAAM,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC;YAEtC,KAAK,IAAI,CAAC,GAAG,MAAM,EAAE,CAAC,GAAG,MAAM,EAAE,CAAC,IAAI,OAAO,EAAE,CAAC;gBAC5C,KAAK,IAAI,CAAC,GAAG,MAAM,EAAE,CAAC,GAAG,KAAK,EAAE,CAAC,IAAI,OAAO,EAAE,CAAC;oBAC3C,MAAM,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,OAAO,EAAE,CAAC,GAAG,OAAO,CAAC,GAAG,WAAW,CAAC;oBAC5E,MAAM,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,GAAG,CAAC,GAAG,gBAAgB,GAAG,IAAI,CAAC;oBAC/D,MAAM,MAAM,GAAG,gBAAgB,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,mBAAmB,GAAG,iBAAiB,CAAC,CAAC;oBAEvF,IAAI,CAAC,IAAI,CAAC;wBACN,CAAC;wBACD,CAAC;wBACD,QAAQ,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,gBAAgB,GAAG,gBAAgB,GAAG,MAAM,CAAC;wBACnE,MAAM;wBACN,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,cAAc,GAAG,cAAc,CAAC;wBAClF,UAAU,EAAE,cAAc,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,cAAc,GAAG,cAAc,CAAC;wBAC9E,KAAK,EAAE,IAAI,CAAC,MAAM,EAAE,GAAG,GAAG;wBAC1B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC,MAAM,EAAE,GAAG,MAAM;qBACzC,CAAC,CAAC;oBACH,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,MAAM,GAAG,iBAAiB,CAAC,CAAC;gBAClE,CAAC;YACL,CAAC;QACL,CAAC,CAAC;QAEF,MAAM,MAAM,GAAG,GAAG,EAAE;YAChB,MAAM,IAAI,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;YAC5C,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;YAChC,MAAM,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAElC,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,gBAAgB,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC;YAC7D,MAAM,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,UAAU,CAAC,CAAC;YAC9C,MAAM,CAAC,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,UAAU,CAAC,CAAC;YAChD,cAAc,CAAC,YAAY,CAAC,UAAU,EAAE,CAAC,EAAE,CAAC,EAAE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;YAChE,SAAS,EAAE,CAAC;QAChB,CAAC,CAAC;QAEF,SAAS,WAAW;YAChB,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;gBACnB,OAAO,GAAG,MAAM,CAAC,qBAAqB,CAAC,IAAI,CAAC,CAAC;YACjD,CAAC;QACL,CAAC;QAED,SAAS,IAAI,CAAC,GAAW;YACrB,OAAO,GAAG,IAAI,CAAC;YACf,cAAc,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;YAE9C,IAAI,aAAa,IAAI,CAAC,QAAQ,EAAE,CAAC;gBAC7B,OAAO;YACX,CAAC;YAED,MAAM,OAAO,GAAG,GAAG,GAAG,SAAS,CAAC;YAChC,MAAM,WAAW,GAAG,SAAS,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,GAAG,SAAS,CAAC;YAEhE,cAAc,CAAC,SAAS,GAAG,YAAY,CAAC;YAExC,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE,CAAC;gBACrB,MAAM,eAAe,GAAG,OAAO,GAAG,GAAG,CAAC,QAAQ,CAAC;gBAC/C,IAAI,CAAC,aAAa,IAAI,eAAe,GAAG,CAAC,EAAE,CAAC;oBACxC,SAAS;gBACb,CAAC;gBAED,MAAM,cAAc,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,eAAe,GAAG,mBAAmB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;gBAC5G,MAAM,YAAY,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,OAAO,GAAG,GAAG,CAAC,KAAK,GAAG,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,GAAG,CAAC,UAAU,CAAC;gBAC5F,MAAM,UAAU,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,eAAe,GAAG,mBAAmB,CAAC,GAAG,oBAAoB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;gBACnH,MAAM,YAAY,GAAG,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,WAAW,GAAG,GAAG,CAAC,MAAM,CAAC,GAAG,iBAAiB,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;gBAC1H,MAAM,OAAO,GAAG,CAAC,GAAG,CAAC,cAAc,GAAG,CAAC,CAAC,GAAG,UAAU,CAAC,GAAG,YAAY,GAAG,UAAU,CAAC,GAAG,cAAc,GAAG,CAAC,CAAC,GAAG,YAAY,CAAC,CAAC;gBAE1H,IAAI,OAAO,IAAI,KAAK,EAAE,CAAC;oBACnB,SAAS;gBACb,CAAC;gBAED,cAAc,CAAC,WAAW,GAAG,OAAO,CAAC;gBACrC,cAAc,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,WAAW,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,WAAW,GAAG,CAAC,EAAE,WAAW,EAAE,WAAW,CAAC,CAAC;YACxG,CAAC;YAED,cAAc,CAAC,WAAW,GAAG,CAAC,CAAC;YAE/B,IAAI,aAAa,EAAE,CAAC;gBAChB,OAAO;YACX,CAAC;YAED,IAAI,QAAQ,IAAI,CAAC,WAAW,KAAK,IAAI,IAAI,WAAW,GAAG,UAAU,CAAC,EAAE,CAAC;gBACjE,WAAW,EAAE,CAAC;YAClB,CAAC;QACL,CAAC;QAED,MAAM,cAAc,GAAG,GAAG,EAAE;YACxB,IAAI,aAAa,KAAK,IAAI,EAAE,CAAC;gBACzB,MAAM,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC;YAC/C,CAAC;YAED,aAAa,GAAG,MAAM,CAAC,qBAAqB,CAAC,GAAG,EAAE;gBAC9C,MAAM,EAAE,CAAC;gBACT,aAAa,GAAG,IAAI,CAAC;gBAErB,MAAM,OAAO,GAAG,SAAS,KAAK,IAAI,IAAI,WAAW,CAAC,GAAG,EAAE,GAAG,SAAS,GAAG,UAAU,CAAC;gBACjF,IAAI,QAAQ,IAAI,OAAO,EAAE,CAAC;oBACtB,WAAW,EAAE,CAAC;gBAClB,CAAC;YACL,CAAC,CAAC,CAAC;QACP,CAAC,CAAC;QAEF,MAAM,EAAE,CAAC;QAET,IAAI,QAAQ,EAAE,CAAC;YACX,WAAW,EAAE,CAAC;QAClB,CAAC;QAED,MAAM,UAAU,GAAsB;YAClC,SAAS,CAAC,UAAU,EAAE,KAAK;gBACvB,IAAI,iBAAiB,KAAK,IAAI,EAAE,CAAC;oBAC7B,MAAM,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;oBACvC,iBAAiB,GAAG,IAAI,CAAC;gBAC7B,CAAC;gBAED,IAAI,UAAU,EAAE,CAAC;oBACb,IAAI,QAAQ,EAAE,CAAC;wBACX,WAAW,EAAE,CAAC;wBACd,OAAO;oBACX,CAAC;oBAED,QAAQ,GAAG,IAAI,CAAC;oBAChB,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;oBAC9B,SAAS,GAAG,IAAI,CAAC;oBACjB,SAAS,EAAE,CAAC;oBACZ,WAAW,EAAE,CAAC;oBACd,OAAO;gBACX,CAAC;gBAED,IAAI,CAAC,QAAQ,EAAE,CAAC;oBACZ,OAAO;gBACX,CAAC;gBAED,MAAM,UAAU,GAAG,GAAG,EAAE;oBACpB,iBAAiB,GAAG,IAAI,CAAC;oBACzB,QAAQ,GAAG,KAAK,CAAC;oBACjB,SAAS,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC;oBAE9B,IAAI,aAAa,EAAE,CAAC;wBAChB,cAAc,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;wBAC9C,OAAO;oBACX,CAAC;oBAED,WAAW,EAAE,CAAC;gBAClB,CAAC,CAAC;gBAEF,MAAM,SAAS,GAAG,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC;gBACzD,IAAI,SAAS,GAAG,CAAC,EAAE,CAAC;oBAChB,iBAAiB,GAAG,MAAM,CAAC,UAAU,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;oBAC7D,WAAW,EAAE,CAAC;oBACd,OAAO;gBACX,CAAC;gBAED,UAAU,EAAE,CAAC;YACjB,CAAC;YACD,QAAQ,CAAC,SAAS;gBACd,IAAI,CAAC,QAAQ,IAAI,SAAS,KAAK,IAAI,EAAE,CAAC;oBAClC,OAAO;gBACX,CAAC;gBAED,YAAY,GAAG,SAAS,CAAC;gBACzB,IAAI,QAAQ,EAAE,CAAC;oBACX,WAAW,EAAE,CAAC;gBAClB,CAAC;YACL,CAAC;SACJ,CAAC;QACF,aAAa,CAAC,OAAO,GAAG,UAAU,CAAC;QAEnC,MAAM,cAAc,GAAG,OAAO,cAAc,KAAK,WAAW,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,cAAc,CAAC,cAAc,CAAC,CAAC;QACzG,cAAc,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;QAChC,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;QAElD,OAAO,GAAG,EAAE;YACR,IAAI,OAAO,KAAK,IAAI,EAAE,CAAC;gBACnB,MAAM,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;YACzC,CAAC;YACD,IAAI,aAAa,KAAK,IAAI,EAAE,CAAC;gBACzB,MAAM,CAAC,oBAAoB,CAAC,aAAa,CAAC,CAAC;YAC/C,CAAC;YACD,IAAI,iBAAiB,KAAK,IAAI,EAAE,CAAC;gBAC7B,MAAM,CAAC,YAAY,CAAC,iBAAiB,CAAC,CAAC;YAC3C,CAAC;YAED,cAAc,EAAE,UAAU,EAAE,CAAC;YAC7B,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;YAErD,IAAI,aAAa,CAAC,OAAO,KAAK,UAAU,EAAE,CAAC;gBACvC,aAAa,CAAC,OAAO,GAAG,IAAI,CAAC;YACjC,CAAC;QACL,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,GAAG,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC,EAAE,YAAY,CAAC,CAAC,CAAC;IAE9F,SAAS,CAAC,GAAG,EAAE;QACX,MAAM,UAAU,GAAG,aAAa,CAAC,OAAO,CAAC;QACzC,IAAI,CAAC,UAAU,EAAE,CAAC;YACd,OAAO;QACX,CAAC;QAED,IAAI,MAAM,EAAE,CAAC;YACT,UAAU,CAAC,SAAS,CAAC,IAAI,EAAE,eAAe,CAAC,CAAC;YAC5C,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;YAC3B,OAAO;QACX,CAAC;QAED,UAAU,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;QAC3B,UAAU,CAAC,SAAS,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC;IACjD,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC;IAErC,OAAO,CACH,iBACI,GAAG,EAAE,SAAS,iBACF,MAAM,EAClB,SAAS,EAAE,sDAAsD,SAAS,EAAE,EAC5E,KAAK,EAAE,KAAK,GACd,CACL,CAAC;AACN,CAAC"}

package/dist/components/overlay/FloatingPinRail.d.ts

@@ -0,0 +1,2 @@
+export declare function FloatingPinRail(): import("react").JSX.Element | null;
+//# sourceMappingURL=FloatingPinRail.d.ts.map

package/dist/components/overlay/FloatingPinRail.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPinRail.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/FloatingPinRail.tsx"],"names":[],"mappings":"AAmMA,wBAAgB,eAAe,uCA8K9B"}

package/dist/components/overlay/FloatingPinRail.js

@@ -0,0 +1,112 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { CloseIcon, ChevronDownIcon, FavoritePinIcon } from "../../components/icons/Icons.js";
+import { MOTION } from "../../constants/motionClasses.js";
+import { useReportData, useReportPreferences, useReportSession } from "../../providers/reportContext.js";
+import { formatFeedbackCaseId } from "../../utils/feedback/feedbackCaseId.js";
+import { getPinnedFeedbackCaseProgress } from "../../utils/pinned/pinnedFeedback.js";
+function CircularProgress({ progress, size = 30, showPercentLabel = false, }) {
+    const { messages } = useReportPreferences();
+    const strokeWidth = showPercentLabel ? 3.5 : 3;
+    const radius = (size - strokeWidth) / 2;
+    const circumference = 2 * Math.PI * radius;
+    const offset = circumference - (progress.percentage / 100) * circumference;
+    const labelSize = Math.max(9, Math.round(size * 0.28));
+    return (_jsxs("span", { className: "relative inline-flex shrink-0 items-center justify-center", style: { width: size, height: size }, role: "img", "aria-label": messages.pins.progressAriaLabel(progress.resolved, progress.total, progress.percentage), children: [_jsxs("svg", { viewBox: `0 0 ${size} ${size}`, className: "h-full w-full -rotate-90", "aria-hidden": true, children: [_jsx("circle", { cx: size / 2, cy: size / 2, r: radius, fill: "none", stroke: "var(--adaptive-black200)", strokeWidth: strokeWidth }), _jsx("circle", { cx: size / 2, cy: size / 2, r: radius, fill: "none", stroke: "var(--adaptive-blue500)", strokeWidth: strokeWidth, strokeLinecap: "round", strokeDasharray: circumference, strokeDashoffset: offset, className: "transition-[stroke-dashoffset] duration-300 ease-[cubic-bezier(0.22,1,0.36,1)]" })] }), showPercentLabel ? (_jsxs("span", { className: "absolute inset-0 flex items-center justify-center font-bold tabular-nums text-[var(--adaptive-blue500)]", style: { fontSize: `${labelSize}px` }, "aria-hidden": true, children: [progress.percentage, "%"] })) : null] }));
+}
+function PinRailCard({ item, index, onOpen, onRemove, }) {
+    const { messages } = useReportPreferences();
+    const [pulsing, setPulsing] = useState(false);
+    const handleOpen = () => {
+        setPulsing(true);
+        window.setTimeout(() => setPulsing(false), 180);
+        onOpen(item);
+    };
+    return (_jsxs("div", { className: `${MOTION.pinCardEnter} group relative flex flex-col gap-[4px] rounded-[10px] border border-[var(--adaptive-border-subtle)] bg-[var(--adaptive-fillOpacity800)] px-[10px] py-[8px] shadow-[var(--adaptive-popup-shadow)] backdrop-blur-[8px] ${pulsing ? MOTION.pinCardPulse : ""}`, style: { animationDelay: `${index * 35}ms` }, children: [_jsxs("button", { type: "button", "data-fivepixels-interactive": "", onClick: handleOpen, "aria-label": messages.pins.openPinAriaLabel, className: "flex w-full flex-col gap-[3px] pr-[20px] text-left", children: [_jsx("p", { className: "text-[12px] font-bold leading-none text-[var(--adaptive-black900)]", children: item.fcNumber ? formatFeedbackCaseId(item.fcNumber) : "#FC-—" }), _jsx("p", { className: "line-clamp-1 text-[11px] leading-[1.35] text-[var(--adaptive-black500)]", children: item.summary })] }), _jsx("button", { type: "button", "data-fivepixels-interactive": "", onClick: () => onRemove(item.reportId), "aria-label": messages.pins.removePinAriaLabel, className: "absolute right-[4px] top-[4px] flex h-[20px] w-[20px] items-center justify-center rounded-[6px] text-[var(--adaptive-black400)] opacity-0 transition-opacity hover:bg-[var(--adaptive-tintOpacity200)] hover:text-[var(--adaptive-black900)] group-hover:opacity-100", children: _jsx(CloseIcon, { className: "h-[12px] w-[12px]" }) })] }));
+}
+function PinnedRouteAccordion({ group, collapsed, onToggle, onOpen, onRemove, }) {
+    const { messages } = useReportPreferences();
+    const expanded = !collapsed;
+    return (_jsxs("section", { className: "overflow-hidden rounded-[10px] border border-[var(--adaptive-border-subtle)] bg-[var(--adaptive-black50)]", children: [_jsxs("button", { type: "button", "data-fivepixels-interactive": "", onClick: onToggle, "aria-expanded": expanded, "aria-label": messages.pins.routeToggleAriaLabel(group.pathname), className: "flex w-full items-center justify-between gap-[8px] px-[10px] py-[8px] text-left", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-[7px]", children: [_jsx(CircularProgress, { progress: group.progress, size: 26 }), _jsxs("span", { className: "min-w-0", children: [_jsx("span", { className: "block truncate text-[11px] font-semibold text-[var(--adaptive-black900)]", children: group.pathname }), _jsx("span", { className: "block text-[10px] tabular-nums text-[var(--adaptive-black500)]", children: messages.pins.completedCasesLabel(group.progress.resolved, group.progress.total) })] })] }), _jsx(ChevronDownIcon, { className: `h-[13px] w-[13px] shrink-0 text-[var(--adaptive-black500)] transition-transform duration-200 ease-[cubic-bezier(0.22,1,0.36,1)] ${expanded ? "rotate-180" : ""}` })] }), _jsx("div", { className: MOTION.pinRailBody, "data-expanded": expanded ? "true" : "false", children: _jsx("div", { className: MOTION.pinRailBodyInner, children: _jsx("div", { className: "flex flex-col gap-[6px] border-t border-[var(--adaptive-border-subtle)] p-[6px]", children: group.items.map((item, index) => (_jsx(PinRailCard, { item: item, index: index, onOpen: onOpen, onRemove: onRemove }, item.reportId))) }) }) })] }));
+}
+export function FloatingPinRail() {
+    const { messages, pinnedFeedbackItems, pinRailCollapsed, setPinRailCollapsed, unpinFeedback, syncPinnedFeedbackReports, } = useReportPreferences();
+    const { openPinnedFeedback } = useReportSession();
+    const { reports, allPageReports } = useReportData();
+    const [entered, setEntered] = useState(false);
+    const [collapsedRoutes, setCollapsedRoutes] = useState(() => new Set());
+    const hasPins = pinnedFeedbackItems.length > 0;
+    const enrichedItems = useMemo(() => {
+        const reportById = new Map([...allPageReports, ...reports].map((report) => [report.id, report]));
+        return [...pinnedFeedbackItems].reverse().map((item) => {
+            const report = reportById.get(item.reportId);
+            if (!report) {
+                return item;
+            }
+            return {
+                ...item,
+                fcNumber: report.fc_number ?? item.fcNumber ?? null,
+                pathname: report.pathname,
+                cases: report.cases.map((caseItem) => ({
+                    id: caseItem.id,
+                    status: caseItem.status,
+                })),
+            };
+        });
+    }, [allPageReports, pinnedFeedbackItems, reports]);
+    const routeGroups = useMemo(() => {
+        const groups = new Map();
+        for (const item of enrichedItems) {
+            const current = groups.get(item.pathname);
+            if (current) {
+                current.push(item);
+            }
+            else {
+                groups.set(item.pathname, [item]);
+            }
+        }
+        return [...groups].map(([pathname, items]) => ({
+            pathname,
+            items,
+            progress: getPinnedFeedbackCaseProgress(items),
+        }));
+    }, [enrichedItems]);
+    const overallProgress = useMemo(() => getPinnedFeedbackCaseProgress(enrichedItems), [enrichedItems]);
+    useEffect(() => {
+        syncPinnedFeedbackReports([...allPageReports, ...reports]);
+    }, [allPageReports, reports, syncPinnedFeedbackReports]);
+    useEffect(() => {
+        if (!hasPins) {
+            setEntered(false);
+            return;
+        }
+        const frame = window.requestAnimationFrame(() => setEntered(true));
+        return () => window.cancelAnimationFrame(frame);
+    }, [hasPins]);
+    if (!hasPins) {
+        return null;
+    }
+    const expanded = !pinRailCollapsed;
+    const handleOpen = (item) => {
+        void openPinnedFeedback(item.reportId, {
+            caseId: item.caseId,
+            pathname: item.pathname,
+        });
+    };
+    if (!expanded) {
+        return (_jsx("div", { className: `pointer-events-auto fixed right-[16px] top-[20%] z-[1000002] ${entered ? MOTION.pinRailEnter : ""}`, children: _jsx("button", { type: "button", "data-fivepixels-interactive": "", onClick: () => setPinRailCollapsed(false), "aria-expanded": false, "aria-label": messages.pins.railExpandAriaLabel, className: "flex h-[52px] w-[52px] items-center justify-center rounded-full border border-[var(--adaptive-border-subtle)] bg-[var(--adaptive-fillOpacity700)] shadow-[var(--adaptive-popup-shadow)] backdrop-blur-[12px] transition-transform duration-200 ease-[cubic-bezier(0.34,1.28,0.64,1)] hover:scale-[1.04]", children: _jsx(CircularProgress, { progress: overallProgress, size: 44, showPercentLabel: true }) }) }));
+    }
+    return (_jsx("div", { className: `pointer-events-auto fixed right-[16px] top-[20%] z-[1000002] flex w-[280px] flex-col gap-[8px] ${entered ? MOTION.pinRailEnter : ""}`, children: _jsxs("div", { className: `${MOTION.pinRailShell} overflow-hidden rounded-[14px] border border-[var(--adaptive-border-subtle)] bg-[var(--adaptive-fillOpacity700)] shadow-[var(--adaptive-popup-shadow)] backdrop-blur-[12px]`, "data-expanded": "true", children: [_jsxs("button", { type: "button", "data-fivepixels-interactive": "", onClick: () => setPinRailCollapsed(true), "aria-expanded": true, "aria-label": messages.pins.railCollapseAriaLabel, className: "flex w-full items-center justify-between gap-[8px] px-[12px] py-[9px] text-left", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-[7px]", children: [_jsx(CircularProgress, { progress: overallProgress, size: 30, showPercentLabel: true }), _jsx(FavoritePinIcon, { filled: true, className: "h-[14px] w-[14px] shrink-0 text-[var(--adaptive-blue500)]" }), _jsx("span", { className: "truncate text-[12px] font-bold text-[var(--adaptive-black900)]", children: messages.pins.railTitle }), _jsx("span", { className: "rounded-[999px] bg-[var(--adaptive-black100)] px-[6px] py-[1px] text-[10px] font-semibold tabular-nums text-[var(--adaptive-black600)]", children: messages.pins.railCountLabel(pinnedFeedbackItems.length) })] }), _jsx(ChevronDownIcon, { className: "h-[14px] w-[14px] shrink-0 rotate-180 text-[var(--adaptive-black500)] transition-transform duration-200 ease-[cubic-bezier(0.22,1,0.36,1)]" })] }), _jsx("div", { className: MOTION.pinRailBody, "data-expanded": "true", children: _jsx("div", { className: MOTION.pinRailBodyInner, children: _jsx("div", { className: "max-h-[min(60vh,520px)] overflow-y-auto px-[8px] pb-[8px]", children: _jsx("div", { className: "flex flex-col gap-[7px]", children: routeGroups.map((group) => (_jsx(PinnedRouteAccordion, { group: group, collapsed: collapsedRoutes.has(group.pathname), onToggle: () => {
+                                        setCollapsedRoutes((current) => {
+                                            const next = new Set(current);
+                                            if (next.has(group.pathname)) {
+                                                next.delete(group.pathname);
+                                            }
+                                            else {
+                                                next.add(group.pathname);
+                                            }
+                                            return next;
+                                        });
+                                    }, onOpen: handleOpen, onRemove: unpinFeedback }, group.pathname))) }) }) }) })] }) }));
+}
+//# sourceMappingURL=FloatingPinRail.js.map

package/dist/components/overlay/FloatingPinRail.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FloatingPinRail.js","sourceRoot":"","sources":["../../../src/components/overlay/FloatingPinRail.tsx"],"names":[],"mappings":"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"}

package/dist/components/overlay/PickTargetCompareChip.d.ts

@@ -0,0 +1,7 @@
+import type { TargetSnapshot } from "../../types/report-ui.js";
+type PickTargetCompareChipProps = {
+    target: TargetSnapshot;
+};
+export declare function PickTargetCompareChip({ target }: PickTargetCompareChipProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=PickTargetCompareChip.d.ts.map

package/dist/components/overlay/PickTargetCompareChip.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PickTargetCompareChip.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/PickTargetCompareChip.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAI3D,KAAK,0BAA0B,GAAG;IAC9B,MAAM,EAAE,cAAc,CAAC;CAC1B,CAAC;AAEF,wBAAgB,qBAAqB,CAAC,EAAE,MAAM,EAAE,EAAE,0BAA0B,+BAmD3E"}

package/dist/components/overlay/PickTargetCompareChip.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useCallback, useLayoutEffect, useRef, useState } from "react";
+import { useReportPreferences, useReportSession } from "../../providers/reportContext.js";
+import { getPickProbeCompareChipLayout } from "../../utils/probe/pickProbeLayout.js";
+import { PickTargetCompareSegment } from "./PickTargetCompareSegment.js";
+export function PickTargetCompareChip({ target }) {
+    const { messages } = useReportPreferences();
+    const { pickProbeCompareMode, setPickProbeCompareMode } = useReportSession();
+    const chipRef = useRef(null);
+    const [layout, setLayout] = useState(null);
+    const updateLayout = useCallback(() => {
+        const chip = chipRef.current;
+        if (!chip) {
+            return;
+        }
+        const rect = chip.getBoundingClientRect();
+        setLayout(getPickProbeCompareChipLayout(target.rect, rect.width, rect.height));
+    }, [target.rect]);
+    useLayoutEffect(() => {
+        updateLayout();
+        const frameId = window.requestAnimationFrame(updateLayout);
+        window.addEventListener("resize", updateLayout);
+        window.addEventListener("scroll", updateLayout, true);
+        return () => {
+            window.cancelAnimationFrame(frameId);
+            window.removeEventListener("resize", updateLayout);
+            window.removeEventListener("scroll", updateLayout, true);
+        };
+    }, [target, updateLayout]);
+    return (_jsx("div", { ref: chipRef, className: "pointer-events-auto fixed z-[1000003]", style: {
+            top: layout?.top ?? target.rect.top,
+            left: layout?.left ?? target.rect.right,
+            opacity: layout ? 1 : 0,
+        }, "data-fivepixels-interactive": "", onClick: (event) => event.stopPropagation(), children: _jsx(PickTargetCompareSegment, { mode: pickProbeCompareMode, onChange: setPickProbeCompareMode, beforeLabel: messages.pickTarget.probeBefore, afterLabel: messages.pickTarget.probeAfter }) }));
+}
+//# sourceMappingURL=PickTargetCompareChip.js.map

package/dist/components/overlay/PickTargetCompareChip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PickTargetCompareChip.js","sourceRoot":"","sources":["../../../src/components/overlay/PickTargetCompareChip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACvE,OAAO,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAEtF,OAAO,EAAE,6BAA6B,EAAE,MAAM,kCAAkC,CAAC;AACjF,OAAO,EAAE,wBAAwB,EAAE,MAAM,+BAA+B,CAAC;AAMzE,MAAM,UAAU,qBAAqB,CAAC,EAAE,MAAM,EAA8B;IACxE,MAAM,EAAE,QAAQ,EAAE,GAAG,oBAAoB,EAAE,CAAC;IAC5C,MAAM,EAAE,oBAAoB,EAAE,uBAAuB,EAAE,GAAG,gBAAgB,EAAE,CAAC;IAC7E,MAAM,OAAO,GAAG,MAAM,CAAwB,IAAI,CAAC,CAAC;IACpD,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAuC,IAAI,CAAC,CAAC;IAEjF,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,EAAE;QAClC,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC;QAE7B,IAAI,CAAC,IAAI,EAAE,CAAC;YACR,OAAO;QACX,CAAC;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC1C,SAAS,CAAC,6BAA6B,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC;IACnF,CAAC,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC;IAElB,eAAe,CAAC,GAAG,EAAE;QACjB,YAAY,EAAE,CAAC;QACf,MAAM,OAAO,GAAG,MAAM,CAAC,qBAAqB,CAAC,YAAY,CAAC,CAAC;QAE3D,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;QAChD,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;QAEtD,OAAO,GAAG,EAAE;YACR,MAAM,CAAC,oBAAoB,CAAC,OAAO,CAAC,CAAC;YACrC,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,CAAC,CAAC;YACnD,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,YAAY,EAAE,IAAI,CAAC,CAAC;QAC7D,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC;IAE3B,OAAO,CACH,cACI,GAAG,EAAE,OAAO,EACZ,SAAS,EAAC,uCAAuC,EACjD,KAAK,EAAE;YACH,GAAG,EAAE,MAAM,EAAE,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,GAAG;YACnC,IAAI,EAAE,MAAM,EAAE,IAAI,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK;YACvC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;SAC1B,iCAC2B,EAAE,EAC9B,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,YAE3C,KAAC,wBAAwB,IACrB,IAAI,EAAE,oBAAoB,EAC1B,QAAQ,EAAE,uBAAuB,EACjC,WAAW,EAAE,QAAQ,CAAC,UAAU,CAAC,WAAW,EAC5C,UAAU,EAAE,QAAQ,CAAC,UAAU,CAAC,UAAU,GAC5C,GACA,CACT,CAAC;AACN,CAAC"}

package/dist/components/overlay/PickTargetCompareSegment.d.ts

@@ -0,0 +1,12 @@
+import type { PickProbeCompareMode } from "../../types/report-ui.js";
+type PickTargetCompareSegmentProps = {
+    mode: PickProbeCompareMode;
+    onChange: (mode: PickProbeCompareMode) => void;
+    beforeLabel: string;
+    afterLabel: string;
+    className?: string;
+    tone?: "default" | "inverse";
+};
+export declare function PickTargetCompareSegment({ mode, onChange, beforeLabel, afterLabel, className, tone, }: PickTargetCompareSegmentProps): import("react").JSX.Element;
+export {};
+//# sourceMappingURL=PickTargetCompareSegment.d.ts.map

package/dist/components/overlay/PickTargetCompareSegment.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PickTargetCompareSegment.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/PickTargetCompareSegment.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAEjE,KAAK,6BAA6B,GAAG;IACjC,IAAI,EAAE,oBAAoB,CAAC;IAC3B,QAAQ,EAAE,CAAC,IAAI,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,SAAS,GAAG,SAAS,CAAC;CAChC,CAAC;AAEF,wBAAgB,wBAAwB,CAAC,EACrC,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,UAAU,EACV,SAAc,EACd,IAAgB,GACnB,EAAE,6BAA6B,+BAqC/B"}

package/dist/components/overlay/PickTargetCompareSegment.js

@@ -0,0 +1,17 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export function PickTargetCompareSegment({ mode, onChange, beforeLabel, afterLabel, className = "", tone = "default", }) {
+    const shellClassName = tone === "inverse"
+        ? "inline-flex overflow-hidden rounded-[8px] border border-white/30 bg-white/10 p-[2px]"
+        : "inline-flex overflow-hidden rounded-[8px] border border-[var(--adaptive-border-subtle)] bg-[var(--adaptive-surface-overlay)] p-[2px] shadow-[var(--adaptive-popup-shadow)]";
+    return (_jsx("div", { className: `${shellClassName} ${className}`.trim(), "data-fivepixels-interactive": "", onClick: (event) => event.stopPropagation(), children: ["before", "after"].map((option) => {
+            const active = mode === option;
+            return (_jsx("button", { type: "button", "data-fivepixels-interactive": "", onClick: () => onChange(option), className: `rounded-[6px] px-[8px] py-[3px] text-[11px] font-semibold transition-colors ${active
+                    ? tone === "inverse"
+                        ? "bg-white text-[#f6572d]"
+                        : "bg-[var(--adaptive-blue500)] text-white"
+                    : tone === "inverse"
+                        ? "text-white/90 hover:bg-white/10"
+                        : "text-[var(--adaptive-black600)] hover:bg-[var(--adaptive-black100)]"}`, children: option === "before" ? beforeLabel : afterLabel }, option));
+        }) }));
+}
+//# sourceMappingURL=PickTargetCompareSegment.js.map

package/dist/components/overlay/PickTargetCompareSegment.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PickTargetCompareSegment.js","sourceRoot":"","sources":["../../../src/components/overlay/PickTargetCompareSegment.tsx"],"names":[],"mappings":";AAWA,MAAM,UAAU,wBAAwB,CAAC,EACrC,IAAI,EACJ,QAAQ,EACR,WAAW,EACX,UAAU,EACV,SAAS,GAAG,EAAE,EACd,IAAI,GAAG,SAAS,GACY;IAC5B,MAAM,cAAc,GAChB,IAAI,KAAK,SAAS;QACd,CAAC,CAAC,sFAAsF;QACxF,CAAC,CAAC,4KAA4K,CAAC;IAEvL,OAAO,CACH,cACI,SAAS,EAAE,GAAG,cAAc,IAAI,SAAS,EAAE,CAAC,IAAI,EAAE,iCACtB,EAAE,EAC9B,OAAO,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,eAAe,EAAE,YAEzC,CAAC,QAAQ,EAAE,OAAO,CAAW,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;YAC3C,MAAM,MAAM,GAAG,IAAI,KAAK,MAAM,CAAC;YAE/B,OAAO,CACH,iBAEI,IAAI,EAAC,QAAQ,iCACe,EAAE,EAC9B,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EAC/B,SAAS,EAAE,+EACP,MAAM;oBACF,CAAC,CAAC,IAAI,KAAK,SAAS;wBAChB,CAAC,CAAC,yBAAyB;wBAC3B,CAAC,CAAC,yCAAyC;oBAC/C,CAAC,CAAC,IAAI,KAAK,SAAS;wBAClB,CAAC,CAAC,iCAAiC;wBACnC,CAAC,CAAC,qEACZ,EAAE,YAED,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,UAAU,IAd1C,MAAM,CAeN,CACZ,CAAC;QACN,CAAC,CAAC,GACA,CACT,CAAC;AACN,CAAC"}